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

fix: add css hash to custom element rendered with svelte:element #12715

Conversation

paoloricciuti
Copy link
Member

Svelte 5 rewrite

Closes #12714

I initially did this change and then searched for where set_custom_element_data was used. I added the css_hash there too but then realized that for a normal custom element (rendered without the use of svelte:element it was already adding the class.

I did a bit of digging and found out that the css hash is added during the analysis phase which seemed a bit odd to me but seems part of a bigger system in place which i was a bit scared to touch). So for the moment i've made the css_hash argument optional and i'm checking for it's presence before adding the class but if you think a major refactor to always pass the css_hash during the transform phase instead of the analysis phase is needed i can work on this a bit more.

I've added the normal custom element to the test to avoid falling, in the future, in the trap of adding the custom css hash twice.

Please note that the Svelte codebase is currently being rewritten for Svelte 5. Changes should target Svelte 5, which lives on the default branch (main).

If your PR concerns Svelte 4 (including updates to svelte.dev.docs), please ensure the base branch is svelte-4 and not main.

Before submitting the PR, please make sure you do the following

  • It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
  • Prefix your PR title with feat:, fix:, chore:, or docs:.
  • This message body should clearly illustrate what problems it solves.
  • Ideally, include a test that fails without this PR but passes with it.

Tests and linting

  • Run the tests with pnpm test and lint the project with pnpm lint

Copy link

changeset-bot bot commented Aug 2, 2024

🦋 Changeset detected

Latest commit: 7599df0

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

This PR includes changesets to release 1 package
Name Type
svelte 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

@Rich-Harris
Copy link
Member

Thanks — tweaked it a bit by adding the hash before calling set_custom_element_data, so that function doesn't need to be aware of it, and made a couple of small changes while I was at it that will result in slightly more compact code output in some cases

@paoloricciuti
Copy link
Member Author

Gotcha...thanks!

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.

Svelte 5: <svelte:element> not working with custom html tags
2 participants