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

fix(chips): fix chips focus functionality #5941

Closed

Conversation

devversion
Copy link
Member

  • The normal mobile devices won't trigger the focus on the element.
    Focusing the element on ng-click fixes that issue.
    Through keeping and redirecting to ng-focus it's still possible to select chips through keyboard
  • At the moment, we only reset the selectedChip variable but we don't
    apply that to the view, so we need to run an async evaluation.

Fixes #5897 Fixes #5662

@topherfangio
Copy link
Contributor

@devversion Can you please provide a test for this change?

@devversion
Copy link
Member Author

@topherfangio - I added two new tests for the chips, one for the new click / touch feature and even for the normal function focus. Due rebasing to master there is the well known ws error, but I can show a few screenshots with using karma/stable.

If I remove the ng-click line

If I only remove the ng-focus line

Otherwise it succeed

So the test works as expected.

Update: Merged PR #5795 into this commit and added a extra test for chip bluring.

@devversion devversion changed the title fix(chips): fix chips focus for touch devices fix(chips): fix chips focus functionality Dec 31, 2015
@topherfangio
Copy link
Contributor

@devversion Thanks for the updates. Strange thing, all three of the new tests are failing for me in Firefox 42.

screen shot 2015-12-31 at 12 02 04 pm

Are you sure you pushed your latest changes?

Also, can you change your lines from .toHaveBeenCalled() to .toHaveBeenCalledTimes(1)? I am worried that this change might accidentally call the selectChip() function twice if the browser fires both a click and a focus event.

@devversion
Copy link
Member Author

@topherfangio,

I'm sure I uploaded the latest version, and my tests succeed.

What Karma Version are you using?, that's very strange


Done, I changed it to toHaveBeenCalledTimes

@topherfangio topherfangio added pr: merge ready This PR is ready for a caretaker to review and removed needs: work labels Jan 6, 2016
@topherfangio topherfangio added this to the 1.0.2 milestone Jan 6, 2016
@topherfangio
Copy link
Contributor

@devversion Not sure what was wrong with my machine, but it appears to be passing now, and it's passing on Travis, so I think we're good.

@ThomasBurleson This should be good to merge whenever is convenient.

@devversion
Copy link
Member Author

@topherfangio I runned my tests locally again, and they fail 😨. That's really strange. I try to rework that

@topherfangio topherfangio added needs: work and removed pr: merge ready This PR is ready for a caretaker to review labels Jan 6, 2016
@topherfangio
Copy link
Contributor

Lol! Okay, since you're seeing the failures too, I'm guessing that it's an issue with the order that the tests are run in.

I've marked this as "needs work" until we can dig in a bit further.

Thanks for looking into it!

@devversion
Copy link
Member Author

@topherfangio - Okay I fixed it :D - Should be ready for merge now

@topherfangio
Copy link
Contributor

@devversion How did you fix the failing tests? It's not easy to see differences between squashed commits 😄

@devversion
Copy link
Member Author

@topherfangio Sorry for instant squash 😄 I just replaced .click() with triggerHandler

@topherfangio
Copy link
Contributor

@devversion No worries on the squashing! It is what we prefer; it just makes it difficult to look back in history ;-)

Thanks for the update. I'll re-mark this as ready for merge.

@topherfangio topherfangio added pr: merge ready This PR is ready for a caretaker to review and removed needs: work labels Jan 7, 2016
@ThomasBurleson ThomasBurleson modified the milestones: 1.0.2, 1.0.5 Jan 30, 2016
@devversion
Copy link
Member Author

@ThomasBurleson That was an issue with evalAsync, which was suggested for this PR. But reverted it back to applyAsync and now everything works great again.

@topherfangio
Copy link
Contributor

@devversion Can you rebase this one too? Looks like the build is failing and needs the same update as the other PR you just fixed.

- The normal mobile devices won't trigger the focus on the element.
Focusing the element on `ng-click` fixes that issue.
Through keeping and redirecting to `ng-focus` it's still possible to select chips through keyboard
- At the moment, we only reset the selectedChip variable but we don't
  apply that to the view, so we need to run an async evaluation.

Fixes angular#5897 Fixes angular#5662
@devversion
Copy link
Member Author

@topherfangio Yes sure. Rebased :)

@topherfangio topherfangio added needs: review This PR is waiting on review from the team and removed needs: work labels Feb 10, 2016
@topherfangio topherfangio added pr: merge ready This PR is ready for a caretaker to review and removed needs: review This PR is waiting on review from the team labels Feb 10, 2016
@topherfangio
Copy link
Contributor

@ThomasBurleson Just tested this and specifically looked for the issue you found/mentioned above. It appears to be fixed and the demos appear to work correctly. Should be ready for merge now.

@topherfangio topherfangio modified the milestones: 1.1.1, 1.0.6 Mar 8, 2016
@topherfangio
Copy link
Contributor

@ThomasBurleson Just a quick ping to say that this is ready for merge. Can probably wait until 1.1.1 though.

ThomasBurleson pushed a commit that referenced this pull request Apr 1, 2016
- The normal mobile devices won't trigger the focus on the element.
Focusing the element on `ng-click` fixes that issue.
Through keeping and redirecting to `ng-focus` it's still possible to select chips through keyboard
- At the moment, we only reset the selectedChip variable but we don't
  apply that to the view, so we need to run an async evaluation.

Fixes #5897. Fixes #5662. Closes #5941

# Conflicts:
#	src/components/chips/chips.spec.js
ThomasBurleson pushed a commit that referenced this pull request Apr 1, 2016
- The normal mobile devices won't trigger the focus on the element.
Focusing the element on `ng-click` fixes that issue.
Through keeping and redirecting to `ng-focus` it's still possible to select chips through keyboard
- At the moment, we only reset the selectedChip variable but we don't
  apply that to the view, so we need to run an async evaluation.

Fixes #5897. Fixes #5662. Closes #5941

# Conflicts:
#	src/components/chips/chips.spec.js
@devversion devversion deleted the fix/chips-mobile-select branch April 19, 2016 19:51
@Splaktar Splaktar modified the milestones: 1.1.1, 1.1.0 Feb 27, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
pr: merge ready This PR is ready for a caretaker to review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

md-chips small screen md-chips not leave focus when click on other input.
4 participants