Skip to content

Add SelectPanel outside-top autogrow regression fixture and VRT test#7911

Draft
siddharthkp wants to merge 4 commits into
mainfrom
fix/selectpanel-outside-top-autogrow
Draft

Add SelectPanel outside-top autogrow regression fixture and VRT test#7911
siddharthkp wants to merge 4 commits into
mainfrom
fix/selectpanel-outside-top-autogrow

Conversation

@siddharthkp
Copy link
Copy Markdown
Member

Closes #

This PR adds a fixture story and VRT test to reproduce and guard against a visual regression where SelectPanel with anchorSide: 'outside-top' and async-loading content briefly flickers downward before repositioning upward.

The bug:
When content loads asynchronously inside an outside-top anchored SelectPanel:

  1. Content loads → panel height increases naturally (downward)
  2. Position recalculates → panel jumps to correct outside-top position
  3. This causes a visible flicker

This PR:

  • Adds AutogrowAfterLoadingWithOutsideTopAnchor story to reproduce the issue
  • Adds a VRT test to catch regressions
  • Does not include a fix yet — this is a regression fixture only

Note: With CSS anchor positioning (primer_react_css_anchor_positioning flag enabled), the browser handles positioning natively and bottom: anchor(top) causes content to grow upward naturally — no flicker. The bug only affects the JS positioning fallback path.

Changelog

New

  • SelectPanel.examples.stories.tsx: Added AutogrowAfterLoadingWithOutsideTopAnchor story

Changed

  • None

Removed

  • None

Rollout strategy

  • None; this is a fixture/test-only change with no runtime impact

Testing & Reviewing

  1. Open Storybook → SelectPanel → Examples → Autogrow After Loading With Outside Top Anchor
  2. Click the button to open the panel
  3. Observe the brief downward flicker before the panel repositions upward
  4. With primer_react_css_anchor_positioning: true, the flicker should not occur

Merge checklist

  • Added/updated tests
  • Added/updated documentation
  • Added/updated previews (Storybook)
  • Changes are SSR compatible
  • Tested in Chrome
  • Tested in Firefox
  • Tested in Safari
  • Tested in Edge
  • (GitHub staff only) Integration tests pass at github/github-ui

@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Jun 1, 2026

⚠️ No Changeset found

Latest commit: c715328

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

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

@github-actions github-actions Bot added staff Author is a staff member integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm labels Jun 1, 2026
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented Jun 1, 2026

⚠️ Action required

👋 Hi, this pull request contains changes to the source code that github/github-ui depends on. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Check the integration testing docs for step-by-step instructions. Or, apply the integration-tests: skipped manually label to skip these checks.

To publish a canary release for integration testing, apply the Canary Release label to this PR.

@github-actions github-actions Bot requested a deployment to storybook-preview-7911 June 1, 2026 12:01 Abandoned
@primer
Copy link
Copy Markdown
Contributor

primer Bot commented Jun 1, 2026

🤖 Lint issues have been automatically fixed and committed to this PR.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm staff Author is a staff member

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant