HP9008: React loaded but never mounted a root

HP9008 (no-root) means a React renderer loaded on the page, but the page never created a React root before the timeout: hydrateRoot and createRoot were never called. Nothing was hydrated, so nothing was tested. Usually the app's entry script stopped early; check the page's console errors and failed requests.

What the HP9008 no root finding means

hydration-proof sees React register with the page, and then waits for a root. If none appears a few seconds after the page finished loading, it reports:

React loaded but never mounted a root.

It is a warning. Compare it with its neighbors:

Likely causes

• The entry script threw before it called hydrateRoot; the page usually also has HP2007.
• A script chunk with the entry failed to load.
• The entry waits for something before it mounts (a feature flag, an auth check, a config request) that never answers in the test environment.
• React was loaded by a third-party widget on a page that is not a React app.

How to fix it

1. Open the route with --headed and check the console and the network tab.
2. Fix the error or the failed request that stops the entry.
3. If the entry waits for an API, make the API available to the test, or answer the request with mocks in the scenario (see scenarios).

npx hydration-proof test --route /dashboard --headed --workers 1

Related

• HP9002: no React found on the page
• HP9001: hydration did not finish in time
• HP2007: uncaught error while loading the page
• Troubleshooting