fix: Update flashing issue in popups and rtl placement #3729
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mannycarrera4
commented
Jan 30, 2026
| } | ||
| // No cleanup is needed if element or theme is not set, so return undefined (no effect) | ||
| return undefined; | ||
| }, [localRef, style, theme]); |
Contributor
Author
There was a problem hiding this comment.
This layout effect was happening too late, causing menu and select to flash on first render on the first focusable element. Moved this further up in the first uselayout effect
mannycarrera4
commented
Jan 30, 2026
| </Popup.Card> | ||
| </Popup.Popper> | ||
| </Popup> | ||
| </div> |
Contributor
Author
There was a problem hiding this comment.
undo this change
mannycarrera4
commented
Jan 30, 2026
| </Popup> | ||
| <div style={{display: 'flex', justifyContent: 'flex-start'}}> | ||
| <Popup model={model}> | ||
| <Popup.Target style={{visibility: 'hidden'}}></Popup.Target> |
Contributor
Author
There was a problem hiding this comment.
when the target is hidden, it knows how to correctly position itself.
Workday/canvas-kit
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Project |
Workday/canvas-kit
|
| Branch Review |
mc-fix-popper-issues
|
| Run status |
|
| Run duration | 02m 18s |
| Commit |
|
| Committer | Manuel Carrera |
| View all properties for this run ↗︎ | |
| Test results | |
|---|---|
Failures
|
1
|
Flaky
|
3
|
Pending
|
73
|
Skipped
|
0
|
Passing
|
432
|
| View all changes introduced in this branch ↗︎ | |
Warning
Partial Report: The results for the Application Quality reports may be incomplete.
UI Coverage
19.51%
|
|
|---|---|
|
Untested elements
|
1027
|
|
Tested elements
|
249
|
Accessibility
98.26%
|
|
|---|---|
|
Failed rules
|
4 critical
4 serious
0 moderate
2 minor
|
|
Failed elements
|
8
|
Tests for review
Modal.spec.tsx • 1 failed test
| Test | Artifacts | |
|---|---|---|
| ... > should not close the modal |
Test Replay
Screenshots
|
|
The first 5 failed specs are shown, see all 27 specs in Cypress Cloud.
Tabs.spec.tsx • 1 flaky test
| Test | Artifacts | |
|---|---|---|
| ... > when the "More" button is clicked > should have the third Tab as the first menu item |
Test Replay
Screenshots
|
|
Select.spec.tsx • 1 flaky test
| Test | Artifacts | |
|---|---|---|
| ... > when Boulder is reached via the arrow key > should show Boulder (United States) |
Test Replay
Screenshots
|
|
Popup.spec.tsx • 1 flaky test
| Test | Artifacts | |
|---|---|---|
| ... > when the "Delete" button has focus and the tab key is pressed > should redirect focus to the "Next Focusable Button" button |
Test Replay
Screenshots
|
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Fixes: #1234
Release Category
Components
Release Note
Optional release note message. Changelog and release summaries will contain a pull request title. This section will add additional notes under that title. This section is not a summary, but something extra to point out in release notes. An example might be calling out breaking changes in a labs component or minor visual changes that need visual regression updates. Remove this section if no additional release notes are required.
BREAKING CHANGES
Optional breaking changes message. If your PR includes breaking changes. It is extremely rare to put breaking changes outside a
prerelease/majorbranch. Anything in this section will show up in release notes. Remove this section if no breaking changes are present.Checklist
ready for reviewhas been added to PRFor the Reviewer
Where Should the Reviewer Start?
Areas for Feedback? (optional)
Testing Manually
Screenshots or GIFs (if applicable)
Thank You Gif (optional)