Page MenuHomePhabricator

Help panel and Edit Check pagination conflict
Closed, ResolvedPublic

Description

At present, it is not possible for people to use the navigation within the Pre-Save Edit Check moment because the ? button appears atop it.

This task involves the work of deciding how we can address this UI conflict.

Decision(s) to be made

  • What will be done to ensure people can use both and buttons to navigate the Edit Checks they're seeing with the visualeditor's Pre-save moment?
    • Per offline discussion, we'll start by attempting to float the help panel above the Edit Check card as is down for Structured Tasks:

image.png (750×1,624 px, 356 KB)

  • If/when the above proves more complex than we think it's worth, we'll hide the ? button and revisit a more sustainable solution via T352115

Requirements

Ensure the Help panel (?) appears above Edit Check/Suggestion cards. See technical context @Michael shared in TICKET.

Behavior

Screenshot 2026-02-19 at 12.38.10.png (726×1,484 px, 320 KB)

Related

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald Transcript
ppelberg updated the task description. (Show Details)
ppelberg added a subscriber: Michael.

Via @Michael:

From a technical perspective: That CTA sits in the "bottom dock"(#p-dock-bottom), a portlet at the bottom of the viewport for such floating buttons. Especially on mobile this is not ideal vis-a-vis Edit-Checks (and also the Revise Tone card). With Add-a-Link and Add-an-Image we built a custom interface and that included a place to add this CTA above it. Maybe it would make sense for VE to define its own equivalent dock above the edit check cards, and then we could show the CTA there instead?

If placing the help button above the check bottom sheet is not feasible, an alternative could be to keep the help button behind the bottom sheet while it is open. At that moment, the user is focused on resolving the check and interacting with pagination, rather than accessing the help panel.

Esanders subscribed.

There is existing code to transition away the CTA when a context item is shown (e.g. link context) the same should be applied to edit check cards. We can make this generic by applying it to anything that changes the bottom padding of the surface.

Change #1247597 had a related patch set uploaded (by Esanders; author: Esanders):

[VisualEditor/VisualEditor@master] ve.ui.Surface: Emit a padding event when padding changes

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

Change #1247599 had a related patch set uploaded (by Esanders; author: Esanders):

[mediawiki/extensions/GrowthExperiments@master] Transition help panel CTA whenever surface has bottom padding

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

Hi, I noticed that the task's "Requirements" section includes the phrase "See technical context @Michael shared in TICKET." Which ticket is this referring to? Thanks!

Change #1247597 merged by jenkins-bot:

[VisualEditor/VisualEditor@master] ve.ui.Surface: Emit a padding event when padding changes

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

Change #1249278 had a related patch set uploaded (by Esanders; author: Esanders):

[mediawiki/extensions/VisualEditor@master] Update VE core submodule to master (c8db73677)

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

Change #1249278 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] Update VE core submodule to master (c8db73677)

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

Change #1247599 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] Move help panel CTA up to avoid surface bottom padding

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

As the functional part of this is in GrowthExperiments, we should probably leave it to them to QA.

Checked on testwiki wmf.22 - the following requirement is done:

Ensure the Help panel (?) appears above Edit Check/Suggestion cards.

Screenshot 2026-03-31 at 6.28.16 PM.png (722×1,582 px, 432 KB)

@Esanders - I noticed that the navigation button (↓ and ↑) to navigate the Edit Checks are not present anymore. Were they removed? I checked beta, testwiki wmf. 22, and enwiki wmf.21` (both desktop and mobile). The navigation buttons are not present with the Help panel disabled.

@Etonkovidova at the moment, navigation buttons should just appear to navigate Edit Checks in the Pre-save moment.

@Etonkovidova at the moment, navigation buttons should just appear to navigate Edit Checks in the Pre-save moment.

Thank you, @bmartinezcalvo - my concern was that the fix affected the navigation buttons.