Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

fix(select): improve focus/blur handling on iOS #11739

Merged
merged 1 commit into from
Aug 12, 2019

Conversation

Splaktar
Copy link
Contributor

@Splaktar Splaktar commented Jun 6, 2019

PR Checklist

Please check that your PR fulfills the following requirements:

  • The commit message follows our guidelines
  • Tests for the changes have been added or this is not a bug fix / enhancement
  • Docs have been added, updated, or were not required

PR Type

What kind of change does this PR introduce?

[x] Bugfix
[ ] Enhancement
[ ] Documentation content changes
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Infrastructure changes
[ ] Other... Please describe:

What is the current behavior?

On iOS

  1. changing between two selects can lead to a situation where the floating label for both selects is colored due to both md-input-containers of the selects having class="md-input-focused" which should not happen.
  2. with a md-select open, clicking on an input in a md-input-container causes the input to get focused (floating label and ink) but then the focus gets stolen back by the md-select's md-input-container. This results in a really unintuitive and janky experience.

Issue Number:
Fixes #11345

What is the new behavior?

  • fixed situations where tapping between select's in md-input-containers can leave multiple class="md-input-focused" active.
  • fix focus jumping back to md-select after tapping another input.

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

Previously, tapping out of the md-select's panel would pull the focus back to the md-select's md-input-container. Now, if you tap on an element outside of the md-select's panel, the md-select stays blurred (it gets blurred when the panel opens). If you select an option, the focus returns to the md-select when the panel closes (both when using the mouse and keyboard).

This seems like a more intuitive and correct behavior since md-select panels don't have backdrops, but it does change the behavior on iOS from what it was (which was pretty bad).

also fix focus jumping back to md-select after tapping another input

Fixes #11345
@googlebot googlebot added the cla: yes PR author has signed Google's CLA: https://opensource.google.com/docs/cla/ label Jun 6, 2019
@Splaktar Splaktar self-assigned this Jun 6, 2019
@Splaktar Splaktar added g3: sync os: iOS This issue is specific to iOS P3: important Important issues that really should be fixed when possible. type: bug labels Jun 6, 2019
@Splaktar Splaktar added this to the 1.1.20 milestone Jun 6, 2019
@Splaktar Splaktar added the pr: merge ready This PR is ready for a caretaker to review label Jun 6, 2019
@Splaktar Splaktar added P2: required Issues that must be fixed. and removed P3: important Important issues that really should be fixed when possible. labels Jun 6, 2019
@Splaktar Splaktar assigned mmalerba and unassigned josephperrott Jun 13, 2019
@Splaktar Splaktar assigned andrewseguin and unassigned mmalerba and jelbourn Jun 20, 2019
@mmalerba mmalerba merged commit 0284b13 into master Aug 12, 2019
@mmalerba mmalerba deleted the select-fixFocusBluriOS branch August 12, 2019 21:55
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
cla: yes PR author has signed Google's CLA: https://opensource.google.com/docs/cla/ os: iOS This issue is specific to iOS P2: required Issues that must be fixed. pr: merge ready This PR is ready for a caretaker to review type: bug
Projects
None yet
Development

Successfully merging this pull request may close these issues.

select: label style/position is wrong on iOS after other md-select selection occurs
6 participants