Enable section collapsing on Parsoid HTML
Open, MediumPublic3 Estimated Story Points
Actions

Assigned To

Authored By

	Jdlrobson
	May 1 2024, 6:55 PM

Description

Background

Follow up work to T359001

User story

As a reader on office wikimedia and other projects using Parsoid I want to be able to collapse sections.

Requirements

JavaScript/CSS has been added that allows sections to be collapsed or expanded.
The code is guarded so it only applies to Parsoid views.
The sections are expanded by default (pending no decision on T363933 we will do the simplest possible thing here in the mean time)
Section collapsing has appropriate semantics indicating the expanded/collapsed status of a section, and that the header is a button. Reference the original accessibility implementation of section collapsing to confirm

Note: Remembering collapsed/expanded sections on back button is not in scope for this ticket.

QA steps

If I view a page with sections, I can expand and collapse sections by clicking on the heading or the up/down arrow.
I can use "Find in page" on text in collapsed sections.

Rollback plan

None necessary due to feature flag.

This task was created by Version 1.0.0 of the Web team task template

QA Results - Beta

AC	Status	Details
1	✅	T363934#9942531

Details

	Subject	Repo	Branch	Lines +/-
	Extend section header bottom border to include edit button	mediawiki/extensions/MobileFrontend	master	+8 -5
	Enable section collapsing	mediawiki/extensions/MobileFrontend	master	+119 -28

Customize query in gerrit

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Open		ovasileva	T269499 [Epic] Make MobileFrontend compatible with Parsoid HTML
		Open		ovasileva	T363934 Enable section collapsing on Parsoid HTML

Event Timeline

Jdlrobson created this task.May 1 2024, 6:55 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMay 1 2024, 6:55 PM

Jdlrobson mentioned this in T359001: Mobile section collapsing doesn't work with Parsoid HTML.May 1 2024, 7:01 PM

Pppery updated the task description. (Show Details)May 1 2024, 9:20 PM

Jdlrobson triaged this task as Medium priority.May 14 2024, 9:27 PM

Jdlrobson added projects: Web Team Essential Work 2024, Web-Team-Backlog (FY2023-24 Q4 Sprint 4).

Jdlrobson updated the task description. (Show Details)

Jdlrobson added a parent task: T269499: [Epic] Make MobileFrontend compatible with Parsoid HTML.May 15 2024, 12:13 AM

Jdlrobson moved this task from Backlog to Q4 (April-July) on the Web Team Essential Work 2024 board.May 15 2024, 3:57 PM

Jdlrobson moved this task from FY2023-24 Q4 Sprint 4 to FY2023-24 Q4 Sprint 5 on the Web-Team-Backlog board.May 16 2024, 6:19 PM

Jdlrobson edited projects, added Web-Team-Backlog (FY2023-24 Q4 Sprint 5); removed Web-Team-Backlog (FY2023-24 Q4 Sprint 4).

SToyofuku-WMF subscribed.May 20 2024, 6:35 PM

Jdlrobson updated the task description. (Show Details)May 28 2024, 6:09 PM

Jdlrobson moved this task from Needs analysis to Ready for estimation on the Web-Team-Backlog (FY2023-24 Q4 Sprint 5) board.

We have some proof of concepts. Scope should be relatively tight.

Jdlrobson moved this task from Ready for estimation to Ready for Development on the Web-Team-Backlog (FY2023-24 Q4 Sprint 5) board.May 30 2024, 5:58 PM

alistair3149 subscribed.May 30 2024, 6:48 PM

Picking up ahead of next week's sprint - will gladly put down if something higher priority is needed

There are now higher priority things that can be worked on - putting this down, but I reviewed the proofs of concept (first attempt and second) and agree with the approach. I think some analysis needs to be done on whether jQuery should be avoided entirely considering the current state, but however this is done, it should work

I would say that any new code by web team should not be using jQuery.

bwang claimed this task.Jun 4 2024, 5:47 PM

bwang moved this task from Ready for Development to Doing on the Web-Team-Backlog (FY2023-24 Q4 Sprint 5) board.

Change #1040239 had a related patch set uploaded (by Bernard Wang; author: Bernard Wang):

[mediawiki/extensions/MobileFrontend@master] POC: Enable section collapsing

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

gerritbot added a project: Patch-For-Review.Fri, Jun 7, 6:42 PM

bwang removed bwang as the assignee of this task.Tue, Jun 11, 5:22 PM

bwang moved this task from Doing to Code Review on the Web-Team-Backlog (FY2023-24 Q4 Sprint 5) board.

bwang subscribed.

bwang updated the task description. (Show Details)Tue, Jun 11, 6:30 PM

Jdlrobson claimed this task.Tue, Jun 11, 6:31 PM

I created https://phabricator.wikimedia.org/T367240 to capture the layout shifting bug that exists with this current solution

Steph could you please take over review? This change looks good to me codewise, and I think you have all the background needed to review this! Thanks in advance!

Change #1040239 merged by jenkins-bot:

[mediawiki/extensions/MobileFrontend@master] Enable section collapsing

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

Maintenance_bot removed a project: Patch-For-Review.Thu, Jun 13, 8:30 PM

ReleaseTaggerBot added a project: MW-1.43-notes (1.43.0-wmf.10; 2024-06-18).Thu, Jun 13, 9:00 PM

bwang reassigned this task from SToyofuku-WMF to Edtadros.Fri, Jun 14, 8:07 PM

bwang moved this task from Code Review to QA on the Web-Team-Backlog (FY2023-24 Q4 Sprint 5) board.

Change #1043885 had a related patch set uploaded (by Stoyofuku-wmf; author: Stoyofuku-wmf):

[mediawiki/extensions/MobileFrontend@master] Extend section header bottom border to include edit button

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

gerritbot added a project: Patch-For-Review.Fri, Jun 14, 8:08 PM

Change #1043885 merged by jenkins-bot: