Skip to content

fix(input): do not focus input element twice #12851

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

Merged

Conversation

devversion
Copy link
Member

  • Currently if a user clicks on a input, the element receives focus and the click event bubbles up. Once it reaches the <mat-form-field>, the click event will cause the onContainerClick method to be invoked. This method then manually focused the input element (again). Resulting in unexpected behavior for time inputs in Firefox.

Note: There is no good way to test this behavior because we cannot dispatch a click event that sets focus and also explicitly selects the minute field of a time input. E2E tests don't work either because we run against Chrome headless and not Firefox.

Fixes #12849

* Currently if a user clicks on a input, the element receives focus and the `click` event bubbles up. Once it reaches the `<mat-form-field>`, the click event will cause the `onContainerClick` method to be invoked. This method then manually focused the input element (again). Resulting in unexpected behavior for time inputs in Firefox.

Fixes angular#12849
@devversion devversion added the target: patch This PR is targeted for the next patch release label Aug 27, 2018
@devversion devversion requested a review from mmalerba as a code owner August 27, 2018 12:44
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Aug 27, 2018
// Do not re-focus the input element if the element is already focused. Otherwise it can happen
// that someone clicks on a time input and the cursor resets to the "hours" field while the
// "minutes" field was actually clicked. See: https://github.com/angular/material2/issues/12849
if (!this.focused) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need similar logic for other MatFormFieldControl components (e.g. select, chips)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It guess it wouldn't hurt. There might be also people that use chips with a time input.

I can update it tomorrow (or have a follow-up PR)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just checked. The chip list already has a proper check for that. Please have another look.

@mmalerba mmalerba added pr: lgtm action: merge The PR is ready for merge by the caretaker labels Aug 28, 2018
@jelbourn jelbourn merged commit 7d586e4 into angular:master Sep 14, 2018
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement target: patch This PR is targeted for the next patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Input time can't click at minutes to edit in Firefox
4 participants