Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[web:a11y] make header a proper <header> #55747

Merged
merged 6 commits into from
Oct 9, 2024
Merged

Conversation

yjbanov
Copy link
Contributor

@yjbanov yjbanov commented Oct 8, 2024

Now that we have proper headings, headers should become proper headers.

Fixes flutter/flutter#152268

@github-actions github-actions bot added the platform-web Code specifically for the web engine label Oct 8, 2024
@yjbanov yjbanov requested a review from mdebbar October 8, 2024 18:27
yjbanov and others added 2 commits October 9, 2024 11:18
Co-authored-by: Navaron Bracke <brackenavaron@gmail.com>
Co-authored-by: Navaron Bracke <brackenavaron@gmail.com>
@yjbanov yjbanov added the autosubmit Merge PR when tree becomes green via auto submit App label Oct 9, 2024
@auto-submit auto-submit bot merged commit 2fbb0c1 into flutter:main Oct 9, 2024
30 checks passed
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Oct 10, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Oct 10, 2024
auto-submit bot pushed a commit to flutter/flutter that referenced this pull request Oct 10, 2024
…156541)

flutter/engine@590babc...3ce72a2

2024-10-10 skia-flutter-autoroll@skia.org Roll Skia from 0a9bfc90496e to 1e269594df9d (1 revision) (flutter/engine#55801)
2024-10-10 skia-flutter-autoroll@skia.org Roll Skia from 6e4a2f266a17 to 0a9bfc90496e (2 revisions) (flutter/engine#55799)
2024-10-10 skia-flutter-autoroll@skia.org Roll Skia from 3a9e6b6a4721 to 6e4a2f266a17 (1 revision) (flutter/engine#55797)
2024-10-10 aam@google.com Roll buildroot to pick up change to --time executions (flutter/engine#55792)
2024-10-10 skia-flutter-autoroll@skia.org Roll Skia from 8c95b719bf05 to 3a9e6b6a4721 (1 revision) (flutter/engine#55793)
2024-10-09 matanlurey@users.noreply.github.com Move some `et` tests around and delete unused files. (flutter/engine#55764)
2024-10-09 yjbanov@google.com [web:a11y] make header a proper <header> (flutter/engine#55747)
2024-10-09 skia-flutter-autoroll@skia.org Roll Skia from cf9a558b3abb to 8c95b719bf05 (1 revision) (flutter/engine#55788)
2024-10-09 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Reverts "Run gen_snapshot under /usr/bin/time (#55777)" (#55787)" (flutter/engine#55789)
2024-10-09 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Run gen_snapshot under /usr/bin/time (#55777)" (flutter/engine#55787)
2024-10-09 skia-flutter-autoroll@skia.org Roll Skia from 1349ddc074ad to cf9a558b3abb (2 revisions) (flutter/engine#55785)
2024-10-09 aam@google.com Run gen_snapshot under /usr/bin/time (flutter/engine#55777)
2024-10-09 chinmaygarde@google.com [Impeller] libImpeller: Publish SDK artifacts. (flutter/engine#55783)

If this roll has caused a breakage, revert this CL and stop the roller
using the controls here:
https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Please CC jacksongardner@google.com,zra@google.com on the revert to ensure that a human
is aware of the problem.

To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose

To report a problem with the AutoRoller itself, please file a bug:
https://issues.skia.org/issues/new?component=1389291&template=1850622

Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md
@math1man
Copy link
Contributor

Hey folks, this change broke our app. We're running into two issues.

  1. The label of our page headers used to be read as "header, This is my page". Now the label is dropped and it's just read as "banner".

  2. According to documentation, banner is meant for

    defining a global site header, which usually includes a logo, company name, search feature, and possibly the global navigation or a slogan

    In our web app, we have a corresponding banner, which can logically be labeled as "banner", but the in-page headers that are impacted by this change should still be labeled as "header" rather than "banner.

Internal bug b/374695603.

@math1man
Copy link
Contributor

Regarding my point #2, here's the issue using Wikipedia as a proxy, given that it has a very similar layout to our app:
image

@yjbanov yjbanov added the revert Label used to revert changes in a closed and merged pull request. label Oct 21, 2024
Copy link
Contributor

auto-submit bot commented Oct 21, 2024

Time to revert pull request flutter/engine/55747 has elapsed.
You need to open the revert manually and process as a regular pull request.

@auto-submit auto-submit bot removed the revert Label used to revert changes in a closed and merged pull request. label Oct 21, 2024
yjbanov added a commit to yjbanov/engine that referenced this pull request Oct 21, 2024
auto-submit bot pushed a commit that referenced this pull request Oct 21, 2024
yjbanov added a commit to yjbanov/engine that referenced this pull request Oct 21, 2024
yjbanov added a commit to yjbanov/engine that referenced this pull request Nov 6, 2024
auto-submit bot pushed a commit that referenced this pull request Nov 7, 2024
…ty (#55996)

This relands the [reverted](#55993) [original PR](#55747) with one important adjustment: if the header is empty and has a label, it is rendered as a heading (`<h1>`, `<h2>`, etc) instead of a `<header>`. This is to be consistent with mobile, where headers are frequently used as headings, and screen readers do indeed read it as "heading". Changing all headers to the `<header>` tag turned to out to be too disruptive to existing usages of `SemanticsProperties.header`.

Long-term, when flutter/flutter#155928 is implemented, we could migrate the framework to use `SemanticsProperties.headingLevel` to communicate that something is a heading, and encourage our users to move from `header` to `headingLevel` as well. After that migration is done, we could make all headers proper `<header>` tags, and not special-case empty headers.

Fixes flutter/flutter#152268
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
autosubmit Merge PR when tree becomes green via auto submit App platform-web Code specifically for the web engine
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[web:a11y] switch header from role "heading" to role "banner"
4 participants