-
Notifications
You must be signed in to change notification settings - Fork 29.5k
Web semantics: Fix email field selection/cursor by using type="text" + inputmode="email" #175876
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
Conversation
… email inputs; fix selection/cursor; set autocapitalize attribute
|
It looks like this pull request may not have tests. Please make sure to add tests or get an explicit test exemption before merging. If you are not sure if you need tests, consider this rule of thumb: the purpose of a test is to make sure someone doesn't accidentally revert the fix. Ask yourself, is there anything in your PR that you feel it is important we not accidentally revert back to how it was before your fix? Reviewers: Read the Tree Hygiene page and make sure this patch meets those guidelines before LGTMing. If you believe this PR qualifies for a test exemption, contact "@test-exemption-reviewer" in the #hackers channel in Discord (don't just cc them here, they won't see it!). The test exemption team is a small volunteer group, so all reviewers should feel empowered to ask for tests, without delegating that responsibility entirely to the test exemption group. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code Review
This pull request addresses an issue on Flutter Web where using type="email" for input fields with semantics enabled causes problems with cursor movement and text selection in some browsers. The fix involves changing the input type to text and using inputmode="email", autocomplete="email", and autocapitalize="none" to preserve the expected email input user experience. My review identifies a potential bug where the autocomplete attribute is not reset when an input field's type changes from email to another type, which could lead to incorrect autofill behavior. I've provided a suggestion to fix this.
engine/src/flutter/lib/web_ui/lib/src/engine/semantics/text_field.dart
Outdated
Show resolved
Hide resolved
|
An existing Git SHA, To re-trigger presubmits after closing or re-opeing a PR, or pushing a HEAD commit (i.e. with |
chunhtai
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM, thanks for fixing this! I left a minor suggestion.
engine/src/flutter/lib/web_ui/lib/src/engine/semantics/text_field.dart
Outdated
Show resolved
Hide resolved
Refactors the _updateInputType method in SemanticTextField to use a switch statement. This makes the logic for handling different input types, especially for email, clearer and more consolidated.
mdebbar
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for fixing this!
At some point in the future, we should unify this part of the semantics mode with the non-semantics mode that uses:
…pe="text" + inputmode="email" (flutter/flutter#175876)
…pe="text" + inputmode="email" (flutter/flutter#175876)
…pe="text" + inputmode="email" (flutter/flutter#175876)
…pe="text" + inputmode="email" (flutter/flutter#175876)
…pe="text" + inputmode="email" (flutter/flutter#175876)
…10160) Manual roll requested by tarrinneal@google.com flutter/flutter@c9608e2...7811e89 2025-10-01 32538273+ValentinVignal@users.noreply.github.com Migrate to `WidgetStateTextStyle` (flutter/flutter#176330) 2025-10-01 32538273+ValentinVignal@users.noreply.github.com Migrate to `WidgetStateOutlinedBorder` (flutter/flutter#176270) 2025-10-01 matej.knopp@gmail.com [win32] Runloop should use high resolution timer and avoid deadlock (flutter/flutter#176023) 2025-10-01 engine-flutter-autoroll@skia.org Roll Packages from 287739d to 321a584 (3 revisions) (flutter/flutter#176357) 2025-10-01 15619084+vashworth@users.noreply.github.com Add SwiftUI support for UIScene migration (flutter/flutter#176230) 2025-10-01 engine-flutter-autoroll@skia.org Roll Skia from ecaff95f51aa to c44a36470d07 (4 revisions) (flutter/flutter#176336) 2025-10-01 dacoharkes@google.com [native assets] Enable build hooks and code assets on stable (flutter/flutter#176285) 2025-10-01 dacoharkes@google.com [native assets] Roll dependencies (flutter/flutter#176287) 2025-10-01 engine-flutter-autoroll@skia.org Roll Dart SDK from 527333cfe4cf to 8ffec1435cf3 (1 revision) (flutter/flutter#176334) 2025-10-01 engine-flutter-autoroll@skia.org Roll Skia from 6998b06397c5 to ecaff95f51aa (1 revision) (flutter/flutter#176333) 2025-10-01 Krzysztof.swietnicki@gmail.com Update description in _LastFinderMixin to properly describe finding last (flutter/flutter#174232) 2025-10-01 engine-flutter-autoroll@skia.org Roll Skia from b242cc09488d to 6998b06397c5 (2 revisions) (flutter/flutter#176331) 2025-10-01 engine-flutter-autoroll@skia.org Roll Dart SDK from af31d2637b6b to 527333cfe4cf (17 revisions) (flutter/flutter#176325) 2025-10-01 scheglov@google.com Stop using deprecated analyzer 7.x.y APIs. (flutter/flutter#176242) 2025-10-01 victorsanniay@gmail.com Fix docs referencing deprecated radio properties (flutter/flutter#176244) 2025-09-30 engine-flutter-autoroll@skia.org Roll Skia from bb3b6bd4be0d to b242cc09488d (22 revisions) (flutter/flutter#176320) 2025-09-30 engine-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from rcOl0yxJb4znJ903Y... to 1Ai6VL4vb_GdGnWhg... (flutter/flutter#176315) 2025-09-30 47866232+chunhtai@users.noreply.github.com Adds dart ui API for setting application level locale (flutter/flutter#175100) 2025-09-30 mohellebiabdessalem@gmail.com replace `onPop` usage with `onPopWithResult` in `navigation_bar.2.dart ` (flutter/flutter#174841) 2025-09-30 bkonyi@google.com [ Widget Preview ] Forward Widget Inspector navigation events via DTD (flutter/flutter#176218) 2025-09-30 15619084+vashworth@users.noreply.github.com Add verbose logs to module_uiscene_test_ios (flutter/flutter#176306) 2025-09-30 zhongliu88889@gmail.com Web semantics: Fix email field selection/cursor by using type="text" + inputmode="email" (flutter/flutter#175876) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC stuartmorgan@google.com,tarrinneal@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Packages: 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
…+ inputmode="email" (flutter#175876) **What/Why** On Flutter Web with semantics enabled, <input type="email"> can reject selection APIs in some browsers, causing: cursor to not advance while typing, selection to fail (and selected text not deletable), and, in some cases, InvalidStateError exceptions. This PR updates the semantics editing element for email fields to keep selection/cursor APIs working while preserving email UX. **How** In engine/src/flutter/lib/web_ui/lib/src/engine/semantics/text_field.dart: Use type="text" for SemanticsInputType.email Add inputmode="email" (keeps email keyboard layout/hints) Add autocomplete="email" (preserves autofill) Add autocapitalize="none" (prevents unwanted capitalization) Remove the attributes when not email Rationale: type="text" avoids browser selection restrictions; inputmode="email" preserves the expected email keyboard; autofill and capitalization behavior is retained/optimized. **Before/After** Before the change https://email-0923-before.web.app/ After the change https://email-0923.web.app/ **Impact** Cursor now advances correctly while typing in email fields under semantics. Text can be selected and deleted normally. Avoids InvalidStateError crashes with accessibility semantics enabled. **Tests/Verification** Manually verified on Chrome and safari: Typing in email fields advances cursor correctly Drag-select, double-click select, and Cmd/Ctrl+A work Deleting selected text works No exceptions thrown with semantics enabled Autofill prompts continue to appear when saved emails are available. Mobile keyboards (iOS/Android) show email-optimized layout via inputmode="email". **Fixed issues** Fixes flutter#173239 ## Pre-launch Checklist - [x] I read the [Contributor Guide] and followed the process outlined there for submitting PRs. - [x] I read the [Tree Hygiene] wiki page, which explains my responsibilities. - [x] I read and followed the [Flutter Style Guide], including [Features we expect every widget to implement]. - [x] I signed the [CLA]. - [x] I listed at least one issue that this PR fixes in the description above. - [x] I updated/added relevant documentation (doc comments with `///`). - [x] I added new tests to check the change I am making, or this PR is [test-exempt]. - [x] I followed the [breaking change policy] and added [Data Driven Fixes] where supported. - [x] All existing and new tests are passing.
…pe="text" + inputmode="email" (flutter/flutter#175876)
What/Why
On Flutter Web with semantics enabled, can reject selection APIs in some browsers, causing:
cursor to not advance while typing,
selection to fail (and selected text not deletable),
and, in some cases, InvalidStateError exceptions.
This PR updates the semantics editing element for email fields to keep selection/cursor APIs working while preserving email UX.
How
In engine/src/flutter/lib/web_ui/lib/src/engine/semantics/text_field.dart:
Use type="text" for SemanticsInputType.email
Add inputmode="email" (keeps email keyboard layout/hints)
Add autocomplete="email" (preserves autofill)
Add autocapitalize="none" (prevents unwanted capitalization)
Remove the attributes when not email
Rationale: type="text" avoids browser selection restrictions; inputmode="email" preserves the expected email keyboard; autofill and capitalization behavior is retained/optimized.
Before/After
Before the change
https://email-0923-before.web.app/
After the change
https://email-0923.web.app/
Impact
Cursor now advances correctly while typing in email fields under semantics.
Text can be selected and deleted normally.
Avoids InvalidStateError crashes with accessibility semantics enabled.
Tests/Verification
Manually verified on Chrome and safari:
Typing in email fields advances cursor correctly
Drag-select, double-click select, and Cmd/Ctrl+A work
Deleting selected text works
No exceptions thrown with semantics enabled
Autofill prompts continue to appear when saved emails are available.
Mobile keyboards (iOS/Android) show email-optimized layout via inputmode="email".
Fixed issues
Fixes #173239
Pre-launch Checklist
///).