Page MenuHomePhabricator

Render TMH in Parsoid's output
Closed, ResolvedPublic

Description

@ssastry asks,

do you know why the audio player renders differently in Parsoid vs. legacy? See the infobox on https://it.wikipedia.org/wiki/Timor_Est vs https://it.wikipedia.org/wiki/Timor_Est?useparsoid=1 .. I don't remember if this is known and not yet fixed or a bug / regression

It looks like TMH's assets aren't loaded because of Parsoid's native implementation,

diff --git a/src/Wt2Html/PP/Processors/AddMediaInfo.php b/src/Wt2Html/PP/Processors/AddMediaInfo.php
index e2135c3a3..36438ef96 100644
--- a/src/Wt2Html/PP/Processors/AddMediaInfo.php
+++ b/src/Wt2Html/PP/Processors/AddMediaInfo.php
@@ -794,6 +794,11 @@ class AddMediaInfo implements Wt2HtmlDOMProcessor {
                                        break;
                        }
 
+                       if ( !$isImage ) {
+                               $env->getMetadata()->addModuleStyles( [ 'ext.tmh.player.styles' ] );
+                               $env->getMetadata()->addModules( [ 'ext.tmh.player' ] );
+                       }
+
                        $alt = null;
                        $keepAltInDataMw = !$isImage || $errs;
                        $attr = WTSUtils::getAttrFromDataMw( $dataMw, 'alt', $keepAltInDataMw );

Parsoid's player is just the browser's native rendering.

A somewhat related note is T313875

Event Timeline

Arlolra triaged this task as Medium priority.Sep 19 2023, 12:14 AM
Arlolra moved this task from Backlog to In Progress on the Content-Transform-Team-WIP board.
Arlolra moved this task from Needs Triage to Missing Functionality on the Parsoid board.
MSantos raised the priority of this task from Medium to High.Sep 19 2023, 3:45 PM

Change 959029 had a related patch set uploaded (by Arlolra; author: Arlolra):

[mediawiki/services/parsoid@master] Add TMH modules

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

Change 959029 merged by jenkins-bot:

[mediawiki/services/parsoid@master] Add missing TMH modules

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

Change 960644 had a related patch set uploaded (by Arlolra; author: Arlolra):

[mediawiki/vendor@master] Bump parsoid to 0.18.0-a25

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

Change 960644 merged by jenkins-bot:

[mediawiki/vendor@master] Bump parsoid to 0.18.0-a25

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

The train has reached itwiki and the TMH player is now loaded on,
https://it.wikipedia.org/wiki/Timor_Est?useparsoid=1

The width of the player seems different though, so something new to investigate, related is T273013.

Change 961481 had a related patch set uploaded (by Arlolra; author: Arlolra):

[mediawiki/extensions/TimedMediaHandler@master] Use JS to transfer audio width from attribute to style

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

I might be wrong, but...

https://it.wikipedia.org/wiki/Timor_Est
width attribute is 180
https://it.wikipedia.org/wiki/Timor_Est?useparsoid=1
width attribute is 220
actual styled width is 300

Now yes, we can transfer the audio width from the attribute to the style... but the attribute itself is also wrong.

In a new session where I'm signed out, both the legacy rendering and parsoid set the width to 220. Are you signed in with a specific user setting?

The difference in the actual style is what's noted in T346703#9204822 and is the result of the inline style="width:220px" in the legacy rendering vs the fallback 300px style from,
https://github.com/wikimedia/mediawiki-extensions-TimedMediaHandler/blob/master/resources/ext.tmh.player.styles.less#L21

Ah yes, it's the thumbnail width user setting. Apparently i had it at 180px at it.wp. Considering i hardly use it.wp, might be from years and years and years ago.

So that is a bug/known difference that Parsoid doesn't respect the user setting but that's generally been by design to this point and something that needs to be examined outside of this issue.

Ya, I think we will need a html2html transform for respecting user prefs -- I don't think we have fully examined the feasibility for all available user options (that impact HTML output), but thumbsize should be easy to handle.