Skip to content

bug(react): useAskableFocusSource crashes during SSR #366

Closed

Description

@vamgan

Summary

useAskableFocusSource() reads document.activeElement inside its useState initializer, so rendering a component that uses this hook on the server throws ReferenceError: document is not defined.

Evidence

packages/react/src/useAskableFocusSource.ts initializes state with direct document access around lines 39–46. The normal React adapter has SSR tests, but this newer source hook is not covered by them.

Reproduced against main at 40a3374 after a full build:

ReferenceError: document is not defined

The reproduction renders a component using useAskableFocusSource() with react-dom/server.

Proposed fix

  • Return a browser-neutral initial snapshot when typeof document === 'undefined'.
  • Read the real active element only in a browser-safe path.
  • Guard the effect as additional defense.
  • Clear the deferred focusout timer during cleanup so it cannot update after unmount.

Acceptance criteria

  • renderToString() succeeds for a component using useAskableFocusSource()
  • SSR snapshot reports no focused element
  • Browser hydration still initializes/tracks the actual focused element correctly
  • Pending focusout work is cancelled on unmount
  • Existing React tests continue to pass

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: reactReact adapter workbugSomething isn't working

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions