Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support constructed stylesheets in shadow DOM instances #3

Merged

Conversation

andrewortwein
Copy link

@andrewortwein andrewortwein commented Sep 23, 2024

Detect, serialize, and rebuild constructed stylesheets in shadow DOM elements.

QA

  1. Go to packages/rrweb-snapshot
  2. Run yarn build
  3. Run yarn link to set this package up for local linking
  4. In the chromatic-e2e repo, use the locally-linked rrweb-snapshot build in the cypress, playwright, and shared packages by replacing "@chromaui/rrweb-snapshot": "2.0.0-alpha.17" with "@chromaui/rrweb-snapshot": "link:../../../rrweb/packages/rrweb-snapshot" in each package.json
  5. Run yarn test:playwright && yarn archive-storybook:playwright to launch the built Storybook
  6. Verify that the styles render in shadow DOM elements and styles render in web components in shadow DOM stories properly display the color styles that are described by the text on those story pages
  7. Repeat steps 5 & 6 for cypress I tried this but Cypress didn't seem to like the local link, so we will need to verify this after we publish a version of this package

@andrewortwein andrewortwein changed the title Add shadow DOM support Create changes to support constructed stylesheets in shadow DOM instances Sep 24, 2024
@andrewortwein andrewortwein changed the title Create changes to support constructed stylesheets in shadow DOM instances Support constructed stylesheets in shadow DOM instances Sep 24, 2024
Copy link
Member

@skitterm skitterm left a comment

Choose a reason for hiding this comment

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

@andrewortwein so far this looks good! Let me know when you're ready for QA and I'll give it a go there as well.

@andrewortwein andrewortwein marked this pull request as ready for review September 24, 2024 22:40
@thafryer
Copy link
Member

@andrewortwein Don't forget to generate a Changeset!

@skitterm
Copy link
Member

@andrewortwein Don't forget to generate a Changeset!

@thafryer good point -- originally we were going to merge this PR and wait to do a proper release until my deduplicating-the-stylesheets work was in, but we've since decided the deduplicating work is not necessary right now.

@andrewortwein as part of this we'll want to release the NPM package as well, let me know if you want to pair on that.

@skitterm skitterm merged commit 5024d35 into master Sep 25, 2024
9 of 11 checks passed
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.

3 participants