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.

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

Fix LiveAnnouncer styles cause page shift #3807

Merged
merged 4 commits into from
Jan 6, 2023

Conversation

snowystinger
Copy link
Member

@snowystinger snowystinger commented Nov 30, 2022

Closes #3791

started here #3792

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Go to path=/story/combobox--static-items
inspect the dom
watch the height of the data-live-announcer as you move the mouse over items in the combobox popover repeatedly
it should not grow in height

🧢 Your Project:

@adobe-bot
Copy link

Copy link
Member

@reidbarber reidbarber left a comment

Choose a reason for hiding this comment

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

LGTM

Copy link
Member

@LFDanLu LFDanLu left a comment

Choose a reason for hiding this comment

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

LGTM, confirmed that the LiveAnnouncer is staying as a 1x1 div now

@snowystinger snowystinger merged commit 73d8be4 into main Jan 6, 2023
@snowystinger snowystinger deleted the live-announcer-hidden-styles branch January 6, 2023 00:30
vuluongj20 added a commit to getsentry/sentry that referenced this pull request May 25, 2023
Fix a scrolling issue coming from `CompactSelect` in grid mode,
specifically the `LiveAnnouncer` element:


https://github.com/getsentry/sentry/assets/44172267/171b3ca1-c61e-43b0-9ac5-be830a2f91af

This was a `react-aria` issue and was fixed in
adobe/react-spectrum#3807. We just need to
upgrade `@react-aria/gridlist`.

After upgrading, the `LiveAnnouncer` element is always 1px wide/tall and
won't cause any scrolling issue.
<img width="1543" alt="image"
src="https://github.com/getsentry/sentry/assets/44172267/3b2d9b25-c056-4e7f-9004-48f5ab1e7075">
volokluev pushed a commit to getsentry/sentry that referenced this pull request May 30, 2023
Fix a scrolling issue coming from `CompactSelect` in grid mode,
specifically the `LiveAnnouncer` element:


https://github.com/getsentry/sentry/assets/44172267/171b3ca1-c61e-43b0-9ac5-be830a2f91af

This was a `react-aria` issue and was fixed in
adobe/react-spectrum#3807. We just need to
upgrade `@react-aria/gridlist`.

After upgrading, the `LiveAnnouncer` element is always 1px wide/tall and
won't cause any scrolling issue.
<img width="1543" alt="image"
src="https://github.com/getsentry/sentry/assets/44172267/3b2d9b25-c056-4e7f-9004-48f5ab1e7075">
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
small review Easy to review PR
Projects
None yet
Development

Successfully merging this pull request may close these issues.

live-announcer incorrectly copies visually hidden styles
4 participants