Skip to content

fix(material/tabs): flicker when animationDuration is set to zero #30966

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
merged 1 commit into from
Apr 28, 2025

Conversation

crisbeto
Copy link
Member

The tabs have a fallback that sets transition-delay: 1ms in case users disabled animations without going through one of our APIs. That was also applying when they set animationDuration="0" which is a supported API. The result was a slight flicker.

These changes resolve the flicker by treating animationDuration="0" in the same way as if animations were disabled globally.

Fixes #30964.

The tabs have a fallback that sets `transition-delay: 1ms` in case users disabled animations without going through one of our APIs. That was also applying when they set `animationDuration="0"` which is a supported API. The result was a slight flicker.

These changes resolve the flicker by treating `animationDuration="0"` in the same way as if animations were disabled globally.

Fixes angular#30964.
@crisbeto crisbeto added the target: patch This PR is targeted for the next patch release label Apr 28, 2025
@crisbeto crisbeto requested a review from a team as a code owner April 28, 2025 12:42
@crisbeto crisbeto requested review from adolgachev and wagnermaciel and removed request for a team April 28, 2025 12:42
@crisbeto crisbeto added action: merge The PR is ready for merge by the caretaker target: major This PR is targeted for the next major release and removed target: patch This PR is targeted for the next patch release labels Apr 28, 2025
@crisbeto crisbeto merged commit c63b1fe into angular:main Apr 28, 2025
29 of 33 checks passed
crisbeto added a commit to crisbeto/material2 that referenced this pull request Apr 28, 2025
…gular#30966)

The tabs have a fallback that sets `transition-delay: 1ms` in case users disabled animations without going through one of our APIs. That was also applying when they set `animationDuration="0"` which is a supported API. The result was a slight flicker.

These changes resolve the flicker by treating `animationDuration="0"` in the same way as if animations were disabled globally.

Fixes angular#30964.
crisbeto added a commit that referenced this pull request Apr 28, 2025
…0966) (#30968)

The tabs have a fallback that sets `transition-delay: 1ms` in case users disabled animations without going through one of our APIs. That was also applying when they set `animationDuration="0"` which is a supported API. The result was a slight flicker.

These changes resolve the flicker by treating `animationDuration="0"` in the same way as if animations were disabled globally.

Fixes #30964.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
action: merge The PR is ready for merge by the caretaker area: material/tabs target: major This PR is targeted for the next major release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

bug(mat-tabs): Flickering on tab content change with no animation
2 participants