Skip to content

fix: add null checks for document.documentElement (fixes #1049)#1060

Open
jibin7jose wants to merge 2 commits into
TanStack:mainfrom
jibin7jose:fix-document-element-null
Open

fix: add null checks for document.documentElement (fixes #1049)#1060
jibin7jose wants to merge 2 commits into
TanStack:mainfrom
jibin7jose:fix-document-element-null

Conversation

@jibin7jose

@jibin7jose jibin7jose commented Jul 22, 2026

Copy link
Copy Markdown

Closes #1049

Description

This PR resolves an issue where the application would throw a TypeError: Cannot read properties of null (reading 'className') or document.documentElement is null. This typically occurs in environments (like some browser extensions or specific contexts) where the DOM is not yet fully initialized or document.documentElement evaluates to null.

Changes Made

  • Added a null check for document.documentElement inside updateThemeClass in ThemeProvider.tsx.
  • Used optional chaining for document.documentElement in getHtmlClass (ThemeProvider.tsx).
  • Added safety checks inside the injected THEME_BOOTSTRAP and GOOGLE_ANALYTICS_BOOTSTRAP scripts in __root.tsx to verify document.documentElement and document.head exist before trying to read from or write to them.

Testing

  • Verified that the scripts and theme handlers fail gracefully without crashing the app when document.documentElement is null.

Summary by CodeRabbit

Summary by CodeRabbit

  • Bug Fixes
    • Improved theme handling by safely handling cases when the document root isn’t available, preventing startup/runtime issues.
    • Prevented errors when reading theme-related HTML classes during initialization.
    • Made Google Analytics bootstrapping more resilient by only loading when the page head is available, with graceful fallback behavior.

@coderabbitai

coderabbitai Bot commented Jul 22, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: eae78ff1-afb8-4e7b-9efe-ba68dadc278b

📥 Commits

Reviewing files that changed from the base of the PR and between 56fe8ee and a495557.

📒 Files selected for processing (1)
  • src/routes/__root.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • src/routes/__root.tsx

📝 Walkthrough

Walkthrough

Theme handling and app-shell bootstrap scripts now guard against missing document.documentElement and document.head, preventing unsafe DOM access while preserving existing theme and analytics behavior.

Changes

DOM access guards

Layer / File(s) Summary
Theme and bootstrap DOM guards
src/components/ThemeProvider.tsx, src/routes/__root.tsx
Theme updates return when the HTML root is unavailable, class reads fall back to an empty string, and bootstrap scripts verify required document elements before DOM mutations or GA script injection.

Estimated code review effort: 2 (Simple) | ~10 minutes

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly matches the main change: adding null checks for document.documentElement to fix #1049.
Linked Issues check ✅ Passed The changes address #1049 by guarding document.documentElement access and failing safely when the DOM root is unavailable.
Out of Scope Changes check ✅ Passed No unrelated changes are apparent; the document.head fallback and GA script safety checks support the same DOM-initialization fix.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/routes/__root.tsx`:
- Line 47: Update the GA loader inside GOOGLE_ANALYTICS_BOOTSTRAP so loaded is
set to true only after a script is successfully appended to a valid parent. When
document.head is unavailable, avoid consuming the one-shot callback and retry
later or use a safe fallback insertion parent, ensuring analytics eventually
loads.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 8e3cbee5-869d-4a24-b344-b40f4334c5f0

📥 Commits

Reviewing files that changed from the base of the PR and between 4962bf1 and 56fe8ee.

📒 Files selected for processing (2)
  • src/components/ThemeProvider.tsx
  • src/routes/__root.tsx

Comment thread src/routes/__root.tsx Outdated
@jibin7jose jibin7jose changed the title fix: add null checks for document.documentElement (fixes #1049) fix: add null checks for document.documentElement #1049 #1053 Jul 22, 2026
@jibin7jose jibin7jose changed the title fix: add null checks for document.documentElement #1049 #1053 fix: add null checks for document.documentElement #1049 Jul 22, 2026
@jibin7jose jibin7jose changed the title fix: add null checks for document.documentElement #1049 fix: add null checks for document.documentElement (fixes #1049) Jul 22, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Cannot load: document.documentElement is null

1 participant