[Tabs] Input focus breaks sliding animation

[Mario-Eis]

Bug, feature request, or proposal:

Bug (or feature request)

What is the expected behavior?

Tab animation should run flawless.
Or an alternative way should be provided to handle the focus when browsing tabs

What is the current behavior?

If the focus is set to an element in the new visible tab, the animation breaks

What are the steps to reproduce?

http://plnkr.co/edit/JOaZUON0G7JTBcEWlZTJ?p=preview

What is the use-case or motivation for changing an existing behavior?

Handle input focus when browsing tabs

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

4.2.3 / beta.6, at least chrome and opera

Is there anything else we should know?

Slide from the left side seems to work, slide from the right side is broken when focus is set.
Setting the focus within a 500ms timeout works, but has other problems like when users switches the tabs to fast (second tab-switch within the 500ms timeout). Also the 500ms would be hard coded in the component host and could not be compatible to future tab animation implementations.
Providing a hook to @translateTab.done could be a possible quick-fix.

[amcdnl]

@jelbourn - Are you ok w/ exposing the onCentered event from the body?

[jelbourn]

@amcdnl don't quite follow what you mean

[amcdnl]

@jelbourn - onCentered is an event emitted from the tab-body component when the animation has finished. Its hidden and not re-emitted for public consumption, my suggestion to address his issue was to expose this event for consumption by external consumers.

[jelbourn]

I wouldn't be a fan of that API. What's the underlying problem?

[amcdnl]

The user wants the ability to set focus once the animation has completed.

[Mario-Eis]

Doesn't necessarily need to be set once the animation is complete. Thats just one way to do it. The issue is, thats it's not possible to set the focus at all. Except for some dirty workarounds described above. I could imagine the underlaying issue could be the inputs focus animation breaking the tabs sliding animation... just a guess.

[jelbourn]

Something like (animationDone) would be more general. @matsko, do you have any input in general for use-cases like this?

[amcdnl]

@jelbourn - let me know if you want me to move forward with that API.

[jelbourn]

Matias said that such a feature would be reasonable to add to animations in general, but it wouldn't be any time soon. I suppose (animationDone) works for now

[mmalerba]

Confirmed (animationDone) is working in v15

[angular-automatic-lock-bot]

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.}