Skip to content
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.

Sign up for GitHub

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

Jump to bottom

🐛 [Story a11y] Reduced motion should apply the animation's last frame to the elements #34466

Merged
merged 67 commits into from
Jul 2, 2021
Merged

🐛 [Story a11y] Reduced motion should apply the animation's last frame to the elements #34466

merged 67 commits into from
Jul 2, 2021

Conversation

mszylkowski
Copy link
Contributor

@mszylkowski mszylkowski commented May 20, 2021 •
edited
Loading

Closes #34443

If prefers-reduced-motion, still creates the animation manager.

On maybeStartAnimations, check if prefers-reduced-motion and if so, call maybeApplyLastAnimationFrame. This calls Animation.finish() or Animation.pause (if animation is infinite).

Demo at https://stories-demos-matias.web.app/examples/amp-story/amp-story-animation.html

reduced-motion.mp4

mszylkowski and others added 30 commits April 6, 2021 12:58
@mszylkowski
Created e2e test
85fa95f
@mszylkowski
Added tests
2d2dc25
@mszylkowski
Fixed e2e tests
e596041
@mszylkowski
Removed comment
052e788
@mszylkowski
Removed unused import
932f19c
@mszylkowski
Merge branch 'master' of github.com:ampproject/amphtml into ampvideo_e2e
d7c648c
@mszylkowski
Addede e2es
478589e
@mszylkowski
Moved field to html
73385c7
@mszylkowski
More work on e2e
6ea2c13
@mszylkowski
Added load unload fixture
1ccf0bf
@mszylkowski
Fixed tests
40ac1f1
@mszylkowski
Added more tests and cleaned up hooks
48cf2fb
@mszylkowski
Added multiple sources on first videos to test flexible-bitrate
352f7a4
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into ampvideo_e2e
f7453d1
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into ampvideo_e2e
dd92f63
@mszylkowski
Changed e2es to work
7389a6c
@mszylkowski
Removed whitespaces
e53b606
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into ampvideo_e2e
d3cde6c
@mszylkowski
Adding cache fetch test
7ec9ac2
@mszylkowski
Add e2e fixture to disallowlist for validate
625d1fd
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into ampvideo_e2e
913c51a
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into ampvideo_e2e
cce1cae
@mszylkowski
fixed host_url in e2e
b0d3b57
@mszylkowski
Updated tests
7c63f98
@mszylkowski
Changed order of test conditions for consistency
4ce66ae
@gmajoulet
Update extensions/amp-video/0.1/test-e2e/test-amp-video-flexible-bitr…
9468218 
…ate.js
@gmajoulet
Update extensions/amp-video/0.1/test-e2e/test-amp-video-flexible-bitr…
114fd36 
…ate.js
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into animation_r…
21e9694 
…educedmotion
@mszylkowski
Fixed reduced motion animation
3a91465
@mszylkowski
Fixed reduced motion
13cd887
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into animation_r…
03c1547 
…educedmotion
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into animation_r…
dc26575 
…educedmotion
@mszylkowski
Removed finishOrPause
1e194ed
@mszylkowski
Merge branch 'animation_reducedmotion' of github.com:mszylkowski/amph…
1065721 
…tml; branch 'main' of github.com:ampproject/amphtml into animation_reducedmotion
@mszylkowski
Merge pt2
9abfb6d
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into animation_r…
655e110 
…educedmotion
@mszylkowski
Fixed animation.js
d32ee51
@mszylkowski
Removed unused property prefersReducedMotion
9ecdf64
@mszylkowski
Fixed error when switching user prefs
208c1e2
@mszylkowski
Merge branch 'main' of github.com:ampproject/amphtml into animation_r…
aa82246 
…educedmotion
@mszylkowski
Fixed animation tests
36c3688
@mszylkowski
Added delay to bot rendering so the animations are applied
54703ef
@mszylkowski
removed unused maybe and isinitialized
7e5b84b
@mszylkowski
merge branch main of amphtml into animation_reducedmotion
d300898
@swissspidy swissspidy mentioned this pull request Jun 23, 2021
Closed
alanorozco
alanorozco approved these changes Jun 23, 2021
View reviewed changes
Copy link
Member

@alanorozco alanorozco left a comment

Choose a reason for hiding this comment

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

Thank you for your patience on the back and forth. LGTM!

@mszylkowski mszylkowski merged commit 9520909 into ampproject:main Jul 2, 2021
@mszylkowski mszylkowski deleted the animation_reducedmotion branch July 2, 2021 15:38
@processprocess processprocess mentioned this pull request Jul 7, 2021
Open
This was referenced Jul 7, 2021
Closed
Closed
@mszylkowski mszylkowski mentioned this pull request Jul 8, 2021
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@gmajoulet gmajoulet gmajoulet approved these changes

@alanorozco alanorozco alanorozco approved these changes

@kristoferbaxter kristoferbaxter kristoferbaxter approved these changes

Assignees

@mszylkowski mszylkowski

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[Story a11y] Reduced motion breaks layouts with animate-in
5 participants
@mszylkowski @newmuis @kristoferbaxter @alanorozco @gmajoulet