fix(core): load Osano consent script async via client module

[marythought]

Summary

• Move Osano CMP script from synchronous headTags to a Docusaurus client module (src/theme/OsanoLoader.js)
• Only load Osano on production hosts (opentdf.io) via an allowlist — skipped on localhost, Surge previews, and all other non-production environments
• Add querySelector guard against duplicate injection, script.onerror handler, and safe window.openOsanoPreferences() wrapper with pre-hydration guard
• Add 200.html SPA fallback in Surge preview workflows

Root Cause

Docusaurus strips the async attribute from headTags script elements. The Osano CMP script blocks page loading when cmp.osano.com is slow or unreachable — preventing React hydration, chunk loading, and all client-side navigation. Even loading async via appendChild in a client module still blocks when the CDN is unreachable.

Confirmed by systematic bisect (2026-04-03):

Config	Local nav works?
Pre-Osano config (commit 13d5235)	Yes
+ consent defaults inline script	Yes
+ GTM loader script	Yes
+ Osano via client module (async, no host gate)	No
+ Osano via client module (production allowlist)	Yes

Changes

• docusaurus.config.ts: Remove Osano from headTags, register OsanoLoader.js as client module, update footer to use window.openOsanoPreferences?.() (safe before hydration)
• src/theme/OsanoLoader.js: New client module — injects Osano only on OSANO_HOSTS (opentdf.io, www.opentdf.io), exposes safe preferences wrapper everywhere
• .github/workflows/surge-preview.yaml, surge-preview-deploy.yaml: Add 200.html SPA fallback for Surge

Test plan

• Local dev navigation works (npm start)
• Surge preview deploys and navigates correctly
• npm run build succeeds

🤖 Generated with Claude Code

[coderabbitai]

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

• @coderabbitai resume to resume automatic reviews.
• @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

• ▶️ Resume reviews
• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Removed the inline Osano CMP script from Docusaurus config, added a client module that injects the Osano script and exposes window.openOsanoPreferences, and added post-build steps in two Surge workflows to copy build/index.html → build/200.html after successful builds.

Changes

Cohort / File(s)	Summary
Docusaurus config docusaurus.config.ts	Removed Osano CMP <script> from headTags; added ./src/theme/OsanoLoader.js to clientModules; updated footer "Preferences" handler to call window.openOsanoPreferences() instead of Osano.cm.showDrawer(...).
Osano loader src/theme/OsanoLoader.js	New client module that, when DOM is available, injects async Osano CMP <script> into document.head if absent and assigns window.openOsanoPreferences = () => window.Osano?.cm?.showDrawer?.('osano-cm-dom-info-dialog-open'); exports default {}.
CI / Surge preview workflows .github/workflows/surge-preview.yaml, .github/workflows/surge-preview-deploy.yaml	Added conditional post-build steps to copy build/index.html → build/200.html when the build step succeeds to ensure SPA fallback on Surge deployments.

Sequence Diagram(s)

sequenceDiagram
    participant Browser as Browser (Client)
    participant Loader as OsanoLoader (clientModule)
    participant Head as DocumentHead (DOM)
    participant Osano as OsanoCMP (External Script)

    rect rgba(200,230,255,0.5)
    Browser->>Loader: page loads (DOM available)
    Loader->>Head: check for existing Osano script
    alt script missing
        Loader->>Head: append async `<script src="https://cmp.osano.com/.../osano.js">`
    end
    end

    rect rgba(200,255,200,0.5)
    Note over Osano,Browser: External script downloads & initializes asynchronously
    Osano-->>Browser: exposes `window.Osano.cm.showDrawer`
    Loader->>Browser: set `window.openOsanoPreferences()` (calls Osano when available)
    end

    rect rgba(255,230,200,0.5)
    Browser->>Browser: user clicks "Preferences"
    Browser->>Loader: invokes `window.openOsanoPreferences()`
    Loader->>Osano: calls `window.Osano?.cm?.showDrawer?.('osano-cm-dom-info-dialog-open')`
    end

Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• CMP Update #258: Also modifies how the Osano CMP is included and how the footer "Preferences" action opens Osano (client-side loading / handler changes).

Poem

🐰 I hopped through code and left a trail,
I moved the script to load in browsers' gale,
I plant a key on window's sill,
Tap "Preferences" — Osano answers still. 🥕

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check	✅ Passed	The title accurately describes the main change: moving the Osano CMP script loading from synchronous headTags to an async client module, which directly addresses the core issue of blocking hydration.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/osano-async-loading

---

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

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[gemini-code-assist]

Code Review

This pull request refactors the Osano script loading by moving it from a static script tag in docusaurus.config.ts to a dynamic loader in a new client module, src/theme/OsanoLoader.js. A review comment suggests extracting the hardcoded script URL into a constant to improve maintainability.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@src/theme/OsanoLoader.js`:
- Around line 3-9: The Osano script loader in OsanoLoader.js appends the script
unconditionally causing duplicate injection and race errors when footer onclick
calls Osano.cm.showDrawer; update the loader to first check
document.querySelector for the Osano script src or an id before
creating/appending the script, attach script.onerror to log/handle load
failures, and expose a safe wrapper function window.openOsanoPreferences() that
calls window.Osano?.cm?.showDrawer(...) with optional chaining to avoid
exceptions if the script hasn’t loaded yet; finally change footer invocation to
call window.openOsanoPreferences() instead of Osano.cm.showDrawer().

🪄 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: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 16f21428-cd35-42e3-8f8b-d855cf7dda91

📥 Commits

Reviewing files that changed from the base of the PR and between c7a2653 and 8eaabb6.

📒 Files selected for processing (2)

• docusaurus.config.ts
• src/theme/OsanoLoader.js

[github-actions]

📄 Preview deployed to https://opentdf-docs-pr-262.surge.sh

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In @.github/workflows/surge-preview.yaml:
- Around line 43-45: Add the same SPA fallback step used in the surge-preview
workflow to the manual deployment workflow by inserting a step that runs the
command `cp build/index.html build/200.html` after the build step in
surge-preview-deploy.yaml (mirror the behavior of the existing "Add SPA fallback
for Surge" step) so manual deployments also serve 200.html for client-side
routes.

🪄 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: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 19cccb46-d322-4f8e-9c78-97321a15a324

📥 Commits

Reviewing files that changed from the base of the PR and between 8eaabb6 and 68150d0.

📒 Files selected for processing (1)

• .github/workflows/surge-preview.yaml

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@docusaurus.config.ts`:
- Line 236: The footer button currently calls window.openOsanoPreferences
directly causing a ReferenceError during SSR or before client hydration; change
the onclick to safely guard the call (e.g., check typeof
window.openOsanoPreferences === 'function' before invoking) or remove the inline
onclick and wire the click handler from the client-side OsanoLoader
initialization so clicks before hydration no-op; update the element that renders
the button to use the guarded call (reference: window.openOsanoPreferences and
the client module OsanoLoader.js) so the handler degrades gracefully when the
client module hasn't loaded yet.

🪄 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: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: dd8b6dcf-8324-4559-9463-587e95711f89

📥 Commits

Reviewing files that changed from the base of the PR and between 887c8a4 and c3b7449.

📒 Files selected for processing (1)

• docusaurus.config.ts