Page MenuHomePhabricator

[BACKEND] Supporting Images - Implement rendering path
Closed, ResolvedPublic

Description

⚠️ This ticket is a work in progress. The scope and requirements are preliminary and will change significantly once technical decisions are finalized.

Implement the v1 image rendering path in AW/WikiLambda.

Leading documentation: https://docs.google.com/document/d/1ERhZ1XF-4u9vfKYhat3typhnBzapWbcUlqfqZd2KJN0/edit?tab=t.0

Core task:
Create a <figure> or <img> element for the frontend to display when rendering the image in AW and WF. This has to be done at render/sanitizer time.
We have introduced a Z89 output contract in https://phabricator.wikimedia.org/T426169. This task needs to be done first!
The output of the Z89 needs to be transformed into an actual image html. If it is not already.

Depending on what the output contract will be: <aw-image > or an actual <figure>, we will need to either decorate the custom element or let the specific figure through and check for bad image links.

This patch introduced the WikifunctionsPFragmentRenderer which we can use.

Desired Output HTML

<figure class="ext-wikilambda-image ext-wikilambda-image-thumb">
  <a href="https://commons.wikimedia.org/wiki/File:Blue-mountains-daphne-smit-75.jpg">
    <img 
src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/4e/Blue-mountains-daphne-smit-75.jpg/250px-Blue-mountains-daphne-smit-75.jpg"
decoding="async"
width="250"
height="188"
alt="Blue mountains with Daphne || Filename.jpg"
    />
  </a>
  <!-- figcaption: out of scope for v1 -->
</figure>

Scope (subject to change based on technical decisions):

  • Implement the chosen rendering approach for AW article read view, AW preview and WF run result
  • Ensure the rendered output uses the MediaWiki's sanitizer and/or the new renderer
  • Ensure bad images are not allowed using the BadImage list from MW. Return an error.
  • Ensure that external URLs fail (only commons). Return an error
  • Ensure unsupported media types (video/audio/timed media) fail. Return an error
  • Ensure sanitization safety (no XSS vectors in image output path)
  • Rendering failure falls back gracefully (error placeholder, does not break article)

Out of scope: Full MediaViewer integration, full srcset/responsive behavior (post-v1)

Acceptance criteria:

  • Rendering working in AW read view, AW preview and WF run result
  • Output uses MediaWiki sanitizer/renderer
  • Rendering contract documented
  • Failure falls back gracefully
  • Integration tests covering rendering path

Event Timeline

DSmit-WMF triaged this task as Medium priority.
DSmit-WMF renamed this task from [BACKEND] Implement rendering path to [BACKEND] Supporting Images - Implement rendering path.Apr 16 2026, 10:17 AM
DSmit-WMF updated the task description. (Show Details)
DSmit-WMF changed the task status from Open to In Progress.Tue, May 19, 1:27 PM

Change #1289952 had a related patch set uploaded (by Daphne Smit; author: Daphne Smit):

[mediawiki/extensions/WikiLambda@master] WikifunctionsPFragmentImageRenderer: render <ext-wikilambda-image> to <figure>

https://gerrit.wikimedia.org/r/1289952

Change #1289952 merged by jenkins-bot:

[mediawiki/extensions/WikiLambda@master] Commons image support: renderer, editor integration, and frontend components

https://gerrit.wikimedia.org/r/1289952

Change #1291985 had a related patch set uploaded (by Jforrester; author: Daphne Smit):

[mediawiki/extensions/WikiLambda@master] Show a nice placeholder image when an (cached)image fails to load.

https://gerrit.wikimedia.org/r/1291985

Change #1291985 merged by jenkins-bot:

[mediawiki/extensions/WikiLambda@master] Show a nice placeholder image when an (cached)image fails to load.

https://gerrit.wikimedia.org/r/1291985