Repository navigation
feat(core): implement <BrowserOnly> with React browser() API (AI-assisted) - #12496
Merged
Merged
Conversation
✅ [V2]
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Size Change: +62.1 kB (+0.5%) Total Size: 12.4 MB 📦 View Changed
ℹ️ View Unchanged
|
⚡️ Lighthouse report for the deploy preview of this PR
|
|
Size Change: +62.1 kB (+0.5%) Total Size: 12.5 MB 📦 View Changed
ℹ️ View Unchanged
|
1 of 3 tasks
slorber
force-pushed
the
feat/browser-only-react-browser-api
branch
from
September 25, 2026 14:21
d1b39af to
0606b49
Compare
slorber
changed the base branch from
main
to
claude/useisbrowser-reimplementation-6bcd0e
September 25, 2026 14:21
slorber
added this pull request to stack #12499
September 25, 2026 14:21
slorber
added
the
Argos
|
The latest updates on your projects. Learn more about Argos notifications ↗︎
|
Base automatically changed from
claude/useisbrowser-reimplementation-6bcd0e
to
main
September 25, 2026 14:37
slorber
force-pushed
the
feat/browser-only-react-browser-api
branch
from
September 25, 2026 14:37
0606b49 to
4135a39
Compare
…assisted) Use `use(browser())` inside a `<Suspense>` boundary instead of the `useIsBrowser()` context: React now skips the children during SSR and renders them on the client after hydration. The `<BrowserOnly>` fallback is now also displayed while children suspend, instead of propagating to the parent Suspense boundary. Supersedes #12443 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…nse-tests (AI-assisted) Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…om text snapshots (AI-assisted) Argos text snapshots are built with --dev, and React dev SSR adds data-msg/data-cstck (component stack with line numbers) to <BrowserOnly> client-rendered Suspense boundaries. Production only emits data-dgst="". Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
slorber
force-pushed
the
feat/browser-only-react-browser-api
branch
from
September 25, 2026 16:33
0f69624 to
9e67cf6
Compare
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Pre-flight checklist
Motivation
Supersedes #12443 (AI-assisted), keeping the useful idea and dropping the rest.
<BrowserOnly>now relies on React 19.3'suse(browser())inside its own<Suspense>boundary, instead of reading theuseIsBrowser()context:fallback, never callschildren, and reports a browser bailout, not an error. OurrenderToHtmlonErroris not triggered.use(browser())is a no-op. The children render after hydration, and right away on client-side navigation.Behavior changes:
childrensuspend (for exampleReact.lazy), the<BrowserOnly>fallback is displayed. The suspension no longer reaches the parent<Suspense>, so siblings stay visible. The docs are updated, and thereact-18dogfooding page is renamed to a version-agnosticsuspense-testspage (Argos path updated).<!--$!--><template data-dgst=""></template>…<!--/$-->, about 50 bytes.docusaurus build --devoutput: React's development SSR build also addsdata-msganddata-cstck(a full component stack) to these boundaries. Production builds don't. Argos text snapshots are built with--dev, soargos/normalizeTextSnapshots.mjsnow strips these attributes from<template data-dgst="">markers to avoid noisy, line-number-dependent diffs. A non-empty digest (a real SSR error) is left untouched.Not changed:
Test Plan
Rewrote the
BrowserOnlyunit tests, since the old ones relied on the context:renderToHtml: renders the fallback, never callschildren, doesn't validatechildrenhydrateRoot: children rendered, noonRecoverableError, noconsole.error<BrowserOnly>seeuseIsBrowser() === true, even on a client render without hydration (thanks to refactor(core): reimplement useIsBrowser() with useSyncExternalStore (AI-assisted) #12498)Test links
Deploy preview: https://deploy-preview-12496--docusaurus-2.netlify.app/
<BrowserOnly>)Related issues/PRs
useIsBrowser()reimplementation, merged)🤖 Generated with Claude Code