Description

We conduct internal tests within Ariakit to ensure the interoperability between @ariakit/react components and @wordpress/components SlotFill. This ensures that updates to either library will not impact their compatibility.

Check out the unlisted example we're testing at: https://ariakit.org/examples/menu-wordpress-modal

An automated bot opens a PR whenever the @wordpress/components package gets updated: ariakit/ariakit#3707

However, the latest PR, which upgrades @wordpress/components to v27.4.0, is failing to build the example page due to a server error:

⨯ Internal error: Error: Missing getServerSnapshot, which is required for server-rendered content. Will revert to client rendering.
    at Object.useSyncExternalStore (/home/projects/ycbhs5/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:35:2674)
    at t.useSyncExternalStore (/home/projects/ycbhs5/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:35:163011)
    at useObservableValue (./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/observable-map.js:65:82)
    at useSlot (./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot.js:21:83)
    at Fill (./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/fill.js:47:60)

It appears that this useSyncExternalStore call is missing a third argument to function in server environments:

cc @jsnajdr @DaniGuardiola

Step-by-step reproduction instructions

1. Open https://stackblitz.com/edit/ycbhs5?file=package.json&theme=dark
2. Wait for it to compile (it may take a while)
3. See error

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes