Skip to content

fix(web): inline HTML renders match the thread background - #320

Merged
coreybain merged 1 commit into
mainfrom
fix/html-render-host-background
Oct 8, 2026
Merged

coreybain merged 1 commit into
mainfrom
fix/html-render-host-background

Conversation

@coreybain

@coreybain coreybain commented Oct 8, 2026 •

Copy link
Copy Markdown
Collaborator

Inline HTML renders (#278) sat in a visibly darker box in dark threads. The frame passed the page the theme palette's canvas as --background (#0a0a0a in standard dark), but index.css repaints the content frame to #181818 in dark mode, so html{background:var(--background)} never matched the thread around it.

HtmlRenderDocument now reads the computed --background of the surface hosting the iframe and uses that in place of the palette value:

  • On mount, a layout effect reads it before paint and, if it differs, swaps the src fragment once before the page loads, so first paint is already correct.
  • Theme changes are applied to the DOM before they reach React, so the same effect re-reads the surface and the theme message posts the new value.
  • The full-size dialog reads its own host surface the same way.
  • Where getComputedStyle is unavailable or empty, the palette value stands, so server rendering is unchanged.

Desktop gets this via the web frame. iOS is untouched: it injects .systemBackground and its web view is transparent. I didn't verify iOS on a device.

Testing: added a HtmlRenderDocument test for the corrected first src and a later theme change. HtmlRenderDocument and HtmlRenderFrame tests pass (11/11), and lint, format and the apps/web typecheck are clean.

Screenshots: before: the render showed #0a0a0a inside the #181818 thread (reported from the Nightly with #278). After: not captured yet. This needs one pass in a real client on a build with this change.

🤖 Generated with Claude Code


View with [code]smith Autofix with [code]smith
Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.

Renders took --background from the theme palette's canvas, but app CSS
repaints some surfaces past it (dark threads use #181818 over a #0a0a0a
canvas), so pages sat in a visibly darker box. The frame now reads the
--background of the surface hosting it, corrects its URL before the page
loads, and sends the new surface on theme changes.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

@greptile-apps greptile-apps Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Your trial has ended. Reactivate Greptile to resume code reviews.

@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Oct 8, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-10-08T10:30:04.182106Z d496173 PR opened
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@coreybain
coreybain merged commit 5aee56c into main Oct 8, 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.

1 participant