Remove overflow property from popover #6709

pksjce · 2025-09-03T03:29:15Z

Closes #https://github.com/github/primer/issues/5729

The original issue was a complaint that popover does not have customisable width and that they were replacing it with an AnchoredOverlay. In #6303, I fixed this and also premptively added support for height and overflow. However, overflow:hidden default property makes the caret disappear. Fixing this here by removing overflow property altogether. If a need for this property arises in the future, we can look into how to safely add it. Probably by changing the implementation of the caret visual.

Changelog

New

Changed

Removed

Rollout strategy

Patch release
Minor release
Major release; if selected, include a written rollout or migration plan
None; if selected, include a brief description as to why

Testing & Reviewing

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 (Learn more about how to run integration tests)

changeset-bot · 2025-09-03T03:29:19Z

🦋 Changeset detected

Latest commit: 0394474

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

This PR includes changesets to release 2 packages

Name	Type
@primer/react	Minor
@primer/styled-react	Major

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

Copilot

Pull Request Overview

This PR removes the overflow property from the Popover component to fix an issue where the default overflow:hidden was causing the popover's caret to disappear.

Removes the overflow prop from PopoverContentProps interface and its default value
Removes overflow-related CSS styles and data attributes from the component implementation
Updates Storybook stories to remove overflow controls and usage

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.

File	Description
packages/react/src/Popover/Popover.tsx	Removes overflow prop from PopoverContentProps interface and removes overflow handling in PopoverContent component
packages/react/src/Popover/Popover.stories.tsx	Updates Playground story to remove overflow prop usage and removes overflow controls from argTypes
packages/react/src/Popover/Popover.module.css	Removes default overflow:hidden style and all overflow-related CSS rules

github-actions · 2025-09-03T03:29:46Z

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

github-actions · 2025-09-03T03:33:31Z

size-limit report 📦

Path	Size
packages/react/dist/browser.esm.js	88.61 KB (-0.03% 🔽)
packages/react/dist/browser.umd.js	88.67 KB (-0.07% 🔽)

pksjce · 2025-09-04T09:33:58Z

e2e/components/IconButton.test.ts

@@ -45,6 +45,9 @@ const stories = [
    disableAnimations: true,
    async setup(page: Page) {
      await page.keyboard.press('Tab') // focus on icon button
+      await page.getByText('Bold').waitFor({
+        state: 'visible',
+      })


This is just a fix for the flakiness I experienced.

langermank

@pksjce not sure if you've accounted for this but since the caret was broken, we had to suggest teams use the overflow prop to get around it: https://primer-query.githubapp.com/?query=popover+attribute%3Aoverflow

I wonder if we should just change the default prop to visible, and then remove the prop in a separate PR as a major breaking change?

pksjce · 2025-09-08T01:24:20Z

I see that this affects two uages. I can have a github-ui PR ready to go when this change is released. Does that work?
IMO, making overflow:visible for all popovers could have other side-effects?
cc- @joshblack (current RC), @llastflowers (next RC)
Would you be able to accomodate this?

pksjce · 2025-09-09T05:10:58Z

Fixes for release(path-to-green)- Will update in release tracking PR after merge https://github.com/github/github-ui/pull/2049/commits/9194c3449bfb80a3977e7814edcedeeedc40d05b

github-actions · 2025-09-09T21:34:38Z

👋 Hi, there are new commits since the last successful integration test. We recommend running the integration workflow once more, unless you are sure the new changes do not affect github/github. Thanks!

siddharthkp

Left a couple comments to confirm if the visual changes are intentional

Approving in advance

siddharthkp · 2025-09-10T08:45:24Z

.playwright/snapshots/components/Popover.test.ts-snapshots/Popover-Default-dark-linux.png

Caret is back, but it seems like the background color has changed? Is that intentional?

I did notice this and checked that its the same color that primitive offers. I refreshed my node modules and ran the tests on local and there's no change to the snapshots. The primitives changed the color three months back. Do you think the snapshots were just never updated since it doesn't register color change as an error?

that's strange!

Do you think the snapshots were just never updated since it doesn't register color change as an error?

possible, don't think i haven't seen that before 🤔 maybe others have? worth asking

Maybe @langermank knows?

This happens sometimes. When the change is really minimal it just doesn't always pick it up.

siddharthkp · 2025-09-10T08:46:05Z

...IconButton.test.ts-snapshots/IconButton-Keybinding-Hint-on-Description-dark-dimmed-linux.png

I can't see what has changed here? 😅 Do you know? (safe to ignore?)

I think its a flaky test. I tried to make it robust. I think its safe to ignore

Remove overflow property from popover

464b2cd

Copilot AI review requested due to automatic review settings September 3, 2025 03:29

pksjce requested a review from a team as a code owner September 3, 2025 03:29

pksjce requested a review from TylerJDev September 3, 2025 03:29

Copilot AI reviewed Sep 3, 2025

View reviewed changes

github-actions bot added the integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm label Sep 3, 2025

Change @primer/react version to minor and update message

969712d

github-actions bot requested a deployment to storybook-preview-6709 September 3, 2025 03:33 Abandoned

pksjce deployed to github-pages September 3, 2025 03:42 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 3, 2025 03:42 Inactive

pksjce added the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Sep 3, 2025

test(vrt): update snapshots

8e910a1

primer bot requested a review from a team as a code owner September 3, 2025 04:53

primer bot requested a review from mperrotti September 3, 2025 04:53

github-actions bot removed the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Sep 3, 2025

primer bot deployed to github-pages September 3, 2025 05:02 View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 3, 2025 05:03 Inactive

Remove overflow story

34b39f8

pksjce added the update snapshots 🤖 Command that updates VRT snapshots on the pull request label Sep 4, 2025

pksjce deployed to github-pages September 4, 2025 04:04 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 4, 2025 04:04 Inactive

pksjce added 2 commits September 4, 2025 14:23

Fix the flaky issue with iconbutton keybinding

46095f2

Merge branch 'main' into pk/popover-overflow-regression

77a1b00

github-actions bot temporarily deployed to storybook-preview-6709 September 4, 2025 04:33 Inactive

pksjce deployed to github-pages September 4, 2025 04:42 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 4, 2025 04:42 Inactive

pksjce commented Sep 4, 2025

View reviewed changes

pksjce marked this pull request as ready for review September 5, 2025 13:59

github-actions bot requested a deployment to storybook-preview-6709 September 5, 2025 14:03 Abandoned

pksjce deployed to github-pages September 5, 2025 14:10 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 5, 2025 14:11 Inactive

langermank reviewed Sep 5, 2025

View reviewed changes

Merge branch 'main' into pk/popover-overflow-regression

a87dd3e

pksjce deployed to github-pages September 8, 2025 01:33 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 8, 2025 01:33 Inactive

Merge branch 'main' into pk/popover-overflow-regression

fc78f79

pksjce deployed to github-pages September 9, 2025 00:35 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 9, 2025 00:36 Inactive

Merge branch 'main' into pk/popover-overflow-regression

5ea6079

pksjce deployed to github-pages September 9, 2025 05:17 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6709 September 9, 2025 05:17 Inactive

pksjce requested a review from langermank September 9, 2025 12:11

pksjce added the integration-tests: passing Changes in this PR do NOT cause breaking changes in gh/gh label Sep 9, 2025

Merge branch 'main' into pk/popover-overflow-regression

0394474

pksjce deployed to github-pages September 9, 2025 21:43 — with GitHub Actions View deployment

github-actions bot deployed to storybook-preview-6709 September 9, 2025 21:43 View deployment

siddharthkp approved these changes Sep 10, 2025

View reviewed changes

pksjce enabled auto-merge September 10, 2025 23:13

pksjce disabled auto-merge September 11, 2025 22:03

pksjce added this pull request to the merge queue Sep 11, 2025

Merged via the queue into main with commit 78784b3 Sep 11, 2025
43 of 44 checks passed

pksjce deleted the pk/popover-overflow-regression branch September 11, 2025 22:11

primer bot mentioned this pull request Sep 11, 2025

Release tracking (rc) #6842

Open

Remove overflow property from popover #6709

Remove overflow property from popover #6709

Uh oh!

Conversation

pksjce commented Sep 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changelog

New

Changed

Removed

Rollout strategy

Testing & Reviewing

Merge checklist

Uh oh!

changeset-bot bot commented Sep 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

github-actions bot commented Sep 3, 2025

Uh oh!

github-actions bot commented Sep 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

size-limit report 📦

Uh oh!

pksjce Sep 4, 2025

Choose a reason for hiding this comment

Uh oh!

langermank left a comment

Choose a reason for hiding this comment

Uh oh!

pksjce commented Sep 8, 2025

Uh oh!

pksjce commented Sep 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Sep 9, 2025

Uh oh!

siddharthkp left a comment

Choose a reason for hiding this comment

Uh oh!

siddharthkp Sep 10, 2025

Choose a reason for hiding this comment

Uh oh!

pksjce Sep 10, 2025

Choose a reason for hiding this comment

Uh oh!

siddharthkp Sep 10, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

pksjce Sep 10, 2025

Choose a reason for hiding this comment

Uh oh!

langermank Sep 10, 2025

Choose a reason for hiding this comment

Uh oh!

siddharthkp Sep 10, 2025

Choose a reason for hiding this comment

Uh oh!

pksjce Sep 10, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

pksjce commented Sep 3, 2025 •

edited

Loading

changeset-bot bot commented Sep 3, 2025 •

edited

Loading

github-actions bot commented Sep 3, 2025 •

edited

Loading

pksjce commented Sep 9, 2025 •

edited

Loading

siddharthkp Sep 10, 2025 •

edited

Loading