Skip to content

Update Ariakit packages - #81080

Open
ciampo wants to merge 3 commits into
trunkfrom
codex/deps-ariakit-0.4.36-0.7.3
Open

Update Ariakit packages#81080
ciampo wants to merge 3 commits into
trunkfrom
codex/deps-ariakit-0.4.36-0.7.3

Conversation

@ciampo

@ciampo ciampo commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

Follow up to #80765.

Complete release span:

What?

Updates the Ariakit group from the resolved @ariakit/react 0.4.35 and @ariakit/test 0.7.2 to 0.4.36 and 0.7.3, respectively.

Why?

The React release improves Combobox and popup interaction behavior. The test package fixes happy-dom behavior and remains experimental, so even this 0.x patch is treated as potentially breaking.

Notable upstream changes

  • React 0.4.36 closes popups across existing same-origin iframe boundaries. This resolves Ariakit #3031 and Ariakit #3250, which originated from Gutenberg #57206. Gutenberg directly inherits the fix through Tooltip, Menu.Popover, and both CustomSelectControl variants through Ariakit's SelectPopover. A popup in an embedded frame now closes when focus enters an ancestor document, and a root popup closes after a pointer interaction in an existing sibling frame such as the editor canvas. Focus stays on the outside target.
  • The iframe fix is intentionally bounded. It covers readable same-origin frames that exist when the popup opens. It does not cover cross-origin frames, frames inserted or navigated while the popup stays open, separate windows, or true browser/application blur. Reopening a popup refreshes Ariakit's frame snapshot.
  • No Gutenberg iframe workaround can be removed. The proposed Tooltip hideOnBlur workaround in Fix/tooltip hide on blur #57204 was never merged. The current useFocusableIframe hook serves a separate purpose: it exposes focus on an iframe element to parent React handlers. Gutenberg's Floating UI Popover, Base UI components, and the always-visible DataViews ComboboxList do not use this Ariakit Dialog path.
  • React 0.4.36 also adds Combobox Select APIs and separate anchor components. Gutenberg does not import the new APIs, so no source migration is needed.
  • Combobox focus, naming, Escape, and persistent-element behavior is more reliable. Gutenberg's direct Ariakit consumers use the existing APIs, and their focused interaction tests pass with the new version.
  • Test 0.7.3 fixes form and select ancestry in happy-dom. Gutenberg's direct test consumers use the existing root and /react entry points under jsdom, so this fix does not change the current test environment or require a migration.
  • Peer support remains compatible. Gutenberg uses React 18, Testing Library React 16, and Playwright 1.62, all within the published peer ranges.

How?

Updates every direct declaration in packages/components, packages/dataviews, and packages/block-editor, then regenerates the root lockfile. The lockfile also moves the required @ariakit/react-components and @ariakit/components packages to 0.4.0 and 0.1.9.

Testing Instructions

  1. Open the post editor. Hover or focus an icon-only top-toolbar button until its tooltip appears, then click inside the editor canvas iframe. Confirm the tooltip closes and focus remains in the canvas.
  2. Open an Ariakit-backed menu outside the canvas, such as the post actions menu, then click a block inside the canvas. Confirm the menu closes and the block receives focus.
  3. Open an inspector control that uses CustomSelectControl, such as a font family or font appearance selector, then click inside the canvas. Confirm the select popover closes and the canvas interaction is preserved.
  4. Open Storybook at Components → Actions → Menu. Open the menu and a submenu. Move through the items and dismiss each menu. Confirm positioning, focus, and dismissal work normally.
  5. Open the CustomSelectControl story. Open the list, filter or move through options, select one, and reopen the list. Confirm the selected value, focus, and Escape behavior are preserved.
  6. Open Components → Containers → Tabs. Move between tabs and confirm the matching panel is shown.
Automated verification

The exact current head passes the full repository build, dependency and lockfile validation, the published-dependency audit, and 173 focused Menu, CustomSelect, Tabs, and Tooltip tests with 5 snapshots. The broader Components suite also passed 2,061 tests and 111 snapshots, and the Block Editor Global Styles suites passed 206 tests. Ariakit's upstream change includes browser coverage for focus moving from an embedded combobox to its parent document, pointer interaction in a sibling frame, contained frames, and focus preservation across Chromium, Firefox, and WebKit. The npm audit reports the repository's current 77 advisories and none involves an Ariakit package.

Testing Instructions for Keyboard

Use Tab to reach each control, Enter or Space to open it, the arrow keys to move through items or tabs, and Escape to dismiss overlays. For the iframe case, focus a toolbar tooltip or open a menu, then move into the editor canvas and confirm the popup closes without focus returning to its trigger.

Screenshots or screencast

Not applicable; no visual change is intended.

Use of AI Tools

Codex selected and implemented the dependency update, reviewed the complete upstream release span and repository impact, traced the iframe fix through Ariakit and Gutenberg consumers, and ran the verification above.

@github-actions github-actions Bot added [Package] Components /packages/components [Package] Block editor /packages/block-editor [Package] DataViews /packages/dataviews labels Aug 3, 2026
@ciampo ciampo added [Type] Code Quality Issues or PRs that relate to code quality codex labels Aug 3, 2026 — with ChatGPT Codex Connector
@github-actions

github-actions Bot commented Aug 3, 2026

Copy link
Copy Markdown

Size Change: +8.93 kB (+0.11%)

Total Size: 7.79 MB

📦 View Changed
Filename Size Change
build/modules/content-types/index.min.js 168 kB +2.06 kB (+1.24%)
build/scripts/components/index.min.js 279 kB +972 B (+0.35%)
build/scripts/edit-site/index.min.js 308 kB +1.9 kB (+0.62%)
build/scripts/editor/index.min.js 503 kB +1.96 kB (+0.39%)
build/scripts/media-utils/index.min.js 124 kB +2.05 kB (+1.68%)

compressed-size-action

@ciampo ciampo self-assigned this Aug 3, 2026
@ciampo ciampo removed codex labels Aug 3, 2026
@ciampo
ciampo marked this pull request as ready for review August 3, 2026 15:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Package] Block editor /packages/block-editor [Package] Components /packages/components [Package] DataViews /packages/dataviews [Type] Code Quality Issues or PRs that relate to code quality

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[ComboBox] Menu doesn't close when tabbing out of iframe

1 participant