Page MenuHomePhabricator

[Regression] Page issues banner non-function on mobile legacy parser
Closed, ResolvedPublic

Description

Followup to https://phabricator.wikimedia.org/T386873 and https://phabricator.wikimedia.org/T388083

Looks like this was broken during fixes to Parsoid in T359005

Steps to replicate the issue (include links if applicable):

What happens?:
Banner doesn't open

What should have happened instead?:

  • Banner should open
  • No warnings in JS console

pageissues.gif (797×600 px, 108 KB)

Note: it does seem to work in Parsoid.

Software version (on Special:Version page; skip for WMF-hosted wikis like Wikipedia):

All browsers
e.g. Browser stack Android Galaxy S23 Chrome

Other information (browser name/version, screenshots, etc.):
There are also some deprecation warnings that may be related

Requirement

On mobile pages rendered using the legacy parser (i.e., useparsoid=0), the page issues banner must function as expected: clicking it should expand or collapse the banner content without error, and no JavaScript console warnings should be triggered.

BDD

Feature: Page issues banner expands on legacy parser mobile pages

Scenario: Expand issues banner using legacy parser
  Given I visit a mobile page using the legacy parser with a page issues banner
  When I click the page issues banner
  Then the banner expands to show its content
  And no warnings appear in the JavaScript console

Test Steps

Test Case 1: Page issues banner functions with legacy parser

  1. Open https://en.m.wikipedia.beta.wmflabs.org/wiki/Brass_band#Brass_band_publishers&useparsoid=0
  2. Locate the page issues banner above the article content.
  3. Click the banner.
  4. AC1: Confirm the banner expands to show detailed information.
  5. Open the browser’s Developer Tools → Console.
  6. AC2: Confirm no warnings or errors appear in the console after interacting with the banner.

QA Results - Beta

ACStatusDetails
1T388696#10842366
2T388696#10842366

Event Timeline

Should T386873: [SPIKE] page issues banner non-function on mobile legacy parser be merged here? If not, it might be worth adding the subscribers of that task to this one, given that AFAICS that task was a bug report prior to being turned into a spike.

JScherer-WMF moved this task from Incoming to Q3 on the Web-Team board.
Jdlrobson-WMF changed the task status from Open to In Progress.Mar 14 2025, 4:43 PM
A_smart_kitten added a subscriber: Sdkb.

Migrating codebase/regression tags from T386873; adding @Sdkb as you’re subscribed to that task but not this one.

Jdlrobson-WMF set the point value for this task to 8.Mar 18 2025, 9:38 PM
Jdlrobson-WMF moved this task from Q3 to Sprint Backlog on the Web-Team board.

I don't remember if "raw headings" are counted in the &section=N indexes. If they are not counted, that's good news for the case at hand: provided we are fine with targetting h1 ... h6 levels, we could replace everything with just .find( '.mw-heading' ) (and it wouldn't even need the subsequent .filter()).

I tried this suggestion from the other ticket, and it seems to work. Even without code changes, just setting $wgMFMobileFormatterOptions['headings'] = [ '.mw-heading' ] apparently works. @Jdlrobson-WMF You may need to do some QA testing to verify different cases, but maybe you can avoid having to make code changes.

Jdlrobson-WMF changed the task status from In Progress to Stalled.Mar 27 2025, 10:30 PM

I don't remember if "raw headings" are counted in the &section=N indexes. If they are not counted, that's good news for the case at hand: provided we are fine with targetting h1 ... h6 levels, we could replace everything with just .find( '.mw-heading' ) (and it wouldn't even need the subsequent .filter()).

I tried this suggestion from the other ticket, and it seems to work. Even without code changes, just setting $wgMFMobileFormatterOptions['headings'] = [ '.mw-heading' ] apparently works. @Jdlrobson-WMF You may need to do some QA testing to verify different cases, but maybe you can avoid having to make code changes.

Thanks for this suggestion @matmarex

The change you propose does seem to address the page issues bug, but only because it corrects logic in MobileFrontend's PageHTMLParser which was never updated when we introduced $wgParserEnableLegacyHeadingDOM (it still refers to the legacy HTML!)

The reason the change you proposed works is that this variable is passed down to mw.config as mw.config.get( 'wgMFMobileFormatterHeadings') which is used by the PageHTMLParser

I'd rather not alter the behaviour of MakeSectionsTransform.

I think a good next step would be to rewrite these tests for the new parser and drop support for the old version of heading markup as proposed in T390245: Simplify MobileFrontend's PageHTMLParser to support less content modes and then re-evaluate this ticket.

Change #1131846 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/extensions/MobileFrontend@master] PageHTMLParser: Drop support for desktop HTML and legacy heading HTML

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

Jdlrobson-WMF lowered the priority of this task from High to Medium.May 12 2025, 5:25 PM

Change #1131846 merged by jenkins-bot:

[mediawiki/extensions/MobileFrontend@master] PageHTMLParser: Drop support for desktop HTML and legacy heading HTML

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

Jdlrobson-WMF changed the task status from Stalled to In Progress.May 14 2025, 6:37 PM
Jdlrobson-WMF assigned this task to Edtadros.
Jdlrobson-WMF lowered the priority of this task from Medium to Low.
Jdlrobson-WMF updated the task description. (Show Details)
Jdlrobson-WMF removed the point value 8 for this task.

Edward could you QA this one?

Edtadros subscribed.

Test Steps

Status: ✅ PASS
Environment: Beta
OS: macOS
Browser: Chrome
Device: MS

Test Case 1: Page issues banner functions with legacy parser

  1. Open https://en.m.wikipedia.beta.wmflabs.org/wiki/Brass_band#Brass_band_publishers&useparsoid=0
  2. Locate the page issues banner above the article content.
  3. Click the banner.
  4. ✅ AC1: Confirm the banner expands to show detailed information. See AC2
  5. Open the browser’s Developer Tools → Console.
  6. ✅ AC2: Confirm no warnings or errors appear in the console after interacting with the banner.

screenshot 94.mov.gif (1×1 px, 670 KB)

Jdlrobson-WMF claimed this task.