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

Allow any Node, including ShadowRoot, as container #2728

Merged
merged 10 commits into from Apr 28, 2022

Conversation

Peeja
Copy link
Contributor

@Peeja Peeja commented Apr 16, 2022

What:

  • Expands the type of container in @emotion/sheet and @emotion/cache to Node.
  • Tests the use of a ShadowRoot as a container.

Why:

When using Shadow DOM, stylesheets are scoped to the shadow DOM tree they appear in. The most common place to put them is at the shadow root. But a ShadowRoot, though it contains HTMLElements, is not itself an HTMLElement, though it is a Node. The types only allowed HTMLElements as the container, but as the code is written, any Node should work. The added test validates that.

How:

Broadens a type in a few places and adds one test.

Checklist:

  • Documentation
  • Tests
  • Code complete
  • Changeset
    • Note: I've made this a patch bump because it's "just" types. Arguably it could be a minor bump because it's a new feature, according to SemVer. Happy to switch it if you'd prefer.

@changeset-bot
Copy link

changeset-bot bot commented Apr 16, 2022

🦋 Changeset detected

Latest commit: 21d4bd8

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages
Name Type
@emotion/cache Patch
@emotion/sheet Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@codesandbox-ci
Copy link

codesandbox-ci bot commented Apr 16, 2022

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 21d4bd8:

Sandbox Source
Emotion Configuration

@srmagura srmagura self-requested a review April 16, 2022 20:00
Copy link
Member

@srmagura srmagura left a comment

Choose a reason for hiding this comment

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

Great work 👏. Left two suggestions.

packages/sheet/src/index.js Show resolved Hide resolved
.changeset/five-balloons-sneeze.md Outdated Show resolved Hide resolved
Peeja and others added 2 commits April 23, 2022 08:46
Co-authored-by: Sam Magura <srmagura@gmail.com>
Co-authored-by: Sam Magura <srmagura@gmail.com>
@Peeja
Copy link
Contributor Author

Peeja commented Apr 23, 2022

Thanks! I've committed those suggestions.

Copy link
Member

@srmagura srmagura left a comment

Choose a reason for hiding this comment

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

LGTM 🙏. Looks like ESLint is complaining about a trailing space in packages/sheet/src/index.js. Can you run Prettier on that file and push the change? I would push to your branch but I don't have write access to the repo.

@Andarist ready for you to review

Peeja and others added 2 commits April 28, 2022 14:18
Since `Node['firstChild']` is `ChildNode`, not `Element`.

Co-authored-by: Mateusz Burzyński <mateuszburzynski@gmail.com>
@Peeja
Copy link
Contributor Author

Peeja commented Apr 28, 2022

Good catch, @Andarist, thanks! Added.

@Andarist Andarist merged commit 6c2d7a6 into emotion-js:main Apr 28, 2022
@github-actions github-actions bot mentioned this pull request Apr 28, 2022
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.

None yet

3 participants