Skip to content

Scope glimmer-scoped-css styles by package-relative path - #6594

Open
backspace wants to merge 4 commits into
mainfrom
cs-13587-stable-scoped-css-prefix
Open

backspace wants to merge 4 commits into
mainfrom
cs-13587-stable-scoped-css-prefix

Conversation

@backspace

@backspace backspace commented Oct 7, 2026 •

Copy link
Copy Markdown
Contributor

Background and Goal

glimmer-scoped-css makes each data-scopedcss-* prefix from md5 of the absolute file path. Two builds of the same source at different paths therefore give different attributes. Prerendered HTML holds the attributes of the build that rendered it, so a build at another path does not style it. boxel-ui components are affected most, because the host supplies their CSS and the prerendered card does not record it (CS-13587).

This PR is a pnpm patch that tests the fix before the library changes. A file on disk now gets the prefix of its path relative to the build's working directory, with both paths resolved through symlinks. Every host build runs from packages/host, so every checkout gives the same prefixes. A file that does not exist on disk keeps its filename, so the realm transpile's synthetic paths (/spec.gts) and their prefixes do not change.

How to confirm it

Each PR builds the host test assets twice, at two paths: CI Host on runs-on (/home/runner/_work/…, artifact …-env-ci) and CI on ubuntu-latest (/home/runner/work/…, artifact …-env-std). The main-branch index cache is built from the ubuntu-latest one.

  • Without the patch (Serve the whole of base from the host bundle #6445 at 5e3d619371): Pill is .pill[data-scopedcss-f0e3e9ccf9-9feed8dbe3] in …-env-std (components-BTXBHzll.css) and .pill[data-scopedcss-7c8ff8e74a-9feed8dbe3] in …-env-ci (components-CE4lH1v2.css).
  • With the patch, both artifacts have .pill[data-scopedcss-f135659bf3-9feed8dbe3] (md5('../boxel-ui/src/components/pill/index.gts')). At 08a9258742 both have the same 259 CSS file names and the same 456 scope prefixes.

End-to-end evidence

[Claude Code 🤖] The arms ran the patch at 7fb6f326a3, which identified a file by its package name and the path inside the package. That form and the working-directory form are both independent of the checkout path, which is the property the arms test. Two arms on top of #6445 at c97a5c9bbf, the branch that reproduces the unstyled Pill. Each arm built its own index cache on ubuntu-latest with ci.yaml's own test-web-assets and cache-index steps, as main does. A dispatched CI Host run on runs-on then imported that cache, and the shard logs confirm each arm imported its own. A temporary harness on throwaway branches did this; it is not part of this PR.

Arm Patch Percy build Result
A yes #29970 60 snapshots, 0 diffs
B (control) no #29971 closes the top-most modal first when clicking overlay background differs at 0.0120107, the ratio of the original diff on #6367

Arm B also had one failing integration test (card-chooser | paging: Select All keeps a row selected from past the first page, a waitFor timeout). That test does not use the index cache, and arm A passed it.

Key decisions and non-obvious mechanics

  • Every host-built and boxel-ui prefix changes once. The CI index cache from main keeps the old prefixes until a main run after this merge rebuilds it, so expect Percy diffs on cached HTML until then. Staging and production prerendered HTML keeps the old prefixes until a reindex re-renders it.
  • This patch is temporary. When the check above passes, the same change goes into cardstack/glimmer-scoped-css, and a release replaces this patch.

🤖 Generated with Claude Code

https://claude.ai/code/session_01RhwZUafCP38ur35n87R7BW

The scope prefix was the md5 of the absolute file path, so two builds of the
same source at different paths gave different data-scopedcss attributes, and
prerendered HTML from one build did not match the CSS of the other. A file
inside a package is now identified by its package name and its path inside
the package. A file that does not exist on disk keeps its filename, so the
realm transpile's synthetic paths are unchanged.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RhwZUafCP38ur35n87R7BW
@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Oct 7, 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-07T08:35:41.136432Z ffff646 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.

@github-actions

github-actions Bot commented Oct 7, 2026 •

Copy link
Copy Markdown
Contributor

Host Test Results

    1 files      1 suites   1h 13m 25s ⏱️
5 215 tests 5 204 ✅ 11 💤 0 ❌
5 230 runs  5 219 ✅ 11 💤 0 ❌

Results for commit 08a9258.

Realm Server Test Results

    1 files    319 suites   1h 57m 49s ⏱️
5 102 tests 5 102 ✅ 0 💤 0 ❌
5 161 runs  5 161 ✅ 0 💤 0 ❌

Results for commit 08a9258.

backspace and others added 2 commits October 8, 2026 11:47
The patch hashes path.relative(process.cwd(), filename) instead of
walking up to the nearest package.json and hashing the package name
and the path inside the package. A file that does not exist on disk
still keeps its filename.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RhwZUafCP38ur35n87R7BW
process.cwd() is always a real path. A filename reached through a
symlink otherwise gives a relative path up to the root and back down,
which holds the absolute path again.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01RhwZUafCP38ur35n87R7BW

This branch has not been deployed

No deployments
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.

2 participants