1786334 - Recently closed section in Firefox View should also be exposed as a landmark

Status: RESOLVED WORKSFORME

(Firefox :: Firefox View, defect, P1)

Description

[Ray Fambro]

Tab Pickup (main landmark) and Colorways (complimentary landmark) are landmarks but Recently Closed is not. Let's fix this if it isn't intentional.

Comment 1

[:Gijs (he/him)]

Looks like <section>s should get a landmark if they have an aria-labelledby attr, so presumably adding one to get the recently closed section labeled by recently-closed-tabs-header should be sufficient to fix this issue.

Comment 2

[Sarah Clements [:sclements]]

I'm confused... how does the Tab Pickup section have a landmark but Recently Closed Tabs doesn't? The Tab Pickup <section> doesn't have an aria-labelledby, only the <div>s contained within the <named-deck> do. And the synced-tabs div specifically (for the Tab Pickup list) has role=region, which is an ARIA landmark role. Recently Closed Tabs is structured similarly: https://searchfox.org/mozilla-central/source/browser/components/firefoxview/firefoxview.html#100,170

Comment 3

[Sarah Clements [:sclements]]

It looks like Morgan did the accessibility review on nightly on Aug 15th, per this comment. That was before my patch that had the above mentioned changes landed (merged to autoland on the 16th of Aug). So, I think this is probably fixed now..

Morgan, can you please advise?

Comment 4

[Morgan Reschenberg [:morgan]]

Hi, it looks like now the landmarks are navigation, main, and complementary, where "main" contains both the tab pickup and recently closed sections. These sections are not individually distinct as landmarks. Complementary is the colorways section. It's a bit odd to have the colorways section identifiable as its own landmark, but tab pickup and recently closed be one "thing" (especially if we plan to keep the focus order as tab pickup, colorways section, recently closed)

That said, this is probably fine, but I'll pass this to Anna who has a better idea of frontend a11y :)

Comment 5

[Anna Yeddi [:ayeddi]]

(In reply to Morgan Reschenberg [:morgan] from comment #4)

Hi, it looks like now the landmarks are navigation, main, and complementary, where "main" contains both the tab pickup and recently closed sections. These sections are not individually distinct as landmarks. Complementary is the colorways section. It's a bit odd to have the colorways section identifiable as its own landmark, but tab pickup and recently closed be one "thing" (especially if we plan to keep the focus order as tab pickup, colorways section, recently closed)

That said, this is probably fine, but I'll pass this to Anna who has a better idea of frontend a11y :)

Agree that having them both in one main landmark is fine if the Colorways complimentary is not focused in-between. As it still is, I'd say having each one of them as a region with appropriate accessible name by aria-labelledby as it is marked up in HTML is a good solution too

Comment 6

[:Gijs (he/him)]

(In reply to Anna Yeddi [:ayeddi] from comment #5)

(In reply to Morgan Reschenberg [:morgan] from comment #4)

Hi, it looks like now the landmarks are navigation, main, and complementary, where "main" contains both the tab pickup and recently closed sections. These sections are not individually distinct as landmarks. Complementary is the colorways section. It's a bit odd to have the colorways section identifiable as its own landmark, but tab pickup and recently closed be one "thing" (especially if we plan to keep the focus order as tab pickup, colorways section, recently closed)

That said, this is probably fine, but I'll pass this to Anna who has a better idea of frontend a11y :)

Agree that having them both in one main landmark is fine if the Colorways complimentary is not focused in-between. As it still is, I'd say having each one of them as a region with appropriate accessible name by aria-labelledby as it is marked up in HTML is a good solution too

I'm confused - does this mean this is now already fixed and we can close this bug without further code changes? Morgan appears to say "no", and your comment appears to say "yes", as it references the current source code which Sarah explained in comment #2 should mean this is now addressed (and that seems to match your comment).

(worth noting that having the focus order get to colorways last is already tracked separately in bug 1780239)

Comment 7

[Sam Foster [:sfoster] (he/him)]

We contain both "Tab Pickup" and "Recently Closed" in a <main> and it sounds like that is not itself a problem. But these two sub-sections should perhaps have an explicit role="region"?

Will bug 1784902 change this significantly? It swaps the <section> elements for <details> elements and puts their respective H1s inside <summary> elements. My understanding is that it will not...

Comment 8

[Anna Yeddi [:ayeddi]]

(In reply to :Gijs (he/him) from comment #6)

(In reply to Anna Yeddi [:ayeddi] from comment #5)

(In reply to Morgan Reschenberg [:morgan] from comment #4)

Hi, it looks like now the landmarks are navigation, main, and complementary, where "main" contains both the tab pickup and recently closed sections. These sections are not individually distinct as landmarks. Complementary is the colorways section. It's a bit odd to have the colorways section identifiable as its own landmark, but tab pickup and recently closed be one "thing" (especially if we plan to keep the focus order as tab pickup, colorways section, recently closed)

That said, this is probably fine, but I'll pass this to Anna who has a better idea of frontend a11y :)

Agree that having them both in one main landmark is fine if the Colorways complimentary is not focused in-between. As it still is, I'd say having each one of them as a region with appropriate accessible name by aria-labelledby as it is marked up in HTML is a good solution too

I'm confused - does this mean this is now already fixed and we can close this bug without further code changes? Morgan appears to say "no", and your comment appears to say "yes", as it references the current source code which Sarah explained in comment #2 should mean this is now addressed (and that seems to match your comment).

(worth noting that having the focus order get to colorways last is already tracked separately in bug 1780239)

Both Tab pickup and Recently Closed are now their own widgets within one <main>, as per Sam's comment and corresponding patch. This should provide sufficient distinction between these two widgets.

Colorways landmark appears to be appropriate on wider screens and without magnification/browser zoom. Its when it gets injected between widgets of the main landmark on smaller screens and/or with magnification/browser zoom, it is a bit odd. But I think the <section> pattern does improve it - and fixes this bug, imo.

Comment 9

[:Gijs (he/him)]

Alright, let's close this out then. Thank you!