fix(accordion): fix screen scroll behavior during accordion navigation - Githubissues

cengage / react-magma

https://react-magma.cengage.com

MIT License

21 stars 13 forks source link

fix(accordion): fix screen scroll behavior during accordion navigation #1427

Closed vitaliirumiantsev-cengage closed 2 months ago

vitaliirumiantsev-cengage commented 2 months ago

Issue: #1385

What I did

We prevent default keyboard scroll behavior if some accordion header button are focused

Checklist

[x] changeset has been added
[x] Pull request description is descriptive
[ ] I have made corresponding changes to the documentation
[x] New and existing unit tests pass locally with my changes
[ ] I have added tests that prove my fix is effective or that my feature works

How to test

Open storybook accordion section
Click on the first accordion header button
Press on the keyboard 'Down' key
Make sure scrollbar position on the page is not changed

changeset-bot[bot] commented 2 months ago

🦋 Changeset detected

Latest commit: 6160e7bbe8a9b9610b11a49cc4ede3bc7a509422

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

github-actions[bot] commented 2 months ago

🚀 Deployed on https://docs-preview-1427--upbeat-sinoussi-f675aa.netlify.app

github-actions[bot] commented 2 months ago

🚀 Deployed on https://storybook-preview-1427--upbeat-sinoussi-f675aa.netlify.app

github-actions[bot] commented 2 months ago

🚀 Deployed on https://docs-preview-1427--upbeat-sinoussi-f675aa.netlify.app

github-actions[bot] commented 2 months ago

🚀 Deployed on https://storybook-preview-1427--upbeat-sinoussi-f675aa.netlify.app

github-actions[bot] commented 2 months ago

🚀 Deployed on https://docs-preview-1427--upbeat-sinoussi-f675aa.netlify.app

github-actions[bot] commented 2 months ago

🚀 Deployed on https://storybook-preview-1427--upbeat-sinoussi-f675aa.netlify.app

github-actions[bot] commented 2 months ago

🚀 Deployed on https://docs-preview-1427--upbeat-sinoussi-f675aa.netlify.app

github-actions[bot] commented 2 months ago

🚀 Deployed on https://storybook-preview-1427--upbeat-sinoussi-f675aa.netlify.app

orion-cengage commented 2 months ago

OK, I see we went with fixing the scroll locking part of the issue rather than removing the arrow key navigation. This is fine as it appears to be a satisfactory fix based on the feedback from Perkins. I tested both on the docs site and Storybook and it is working as intended.