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

What about producing custom elements? #580

Open
justinbmeyer opened this issue Aug 16, 2019 · 4 comments
Open

What about producing custom elements? #580

justinbmeyer opened this issue Aug 16, 2019 · 4 comments
Labels
Additional Tests For issues that identify good additional tests to run on all libraries

Comments

@justinbmeyer
Copy link

While listing which libraries work with custom elements is extremely useful, I'd also like to know which frameworks can produce custom elements. Would this be a useful advanced test?

Adding complexity is that some frameworks have third party libraries that do this, (example: convert react to web components), should something like this be included?

If there's support, I'd be interested in helping write the tests, etc. Thanks!

@robdodson
Copy link
Contributor

Hm that's an interesting idea.

It also brings into question what sorts of behaviors do those libraries imbue into their elements. For example, do they create corresponding properties and attributes? Just because you can convert an element from React to a custom element doesn't necessarily mean it's a good custom element.

Personally I feel like I'm having a bit of a hard time keeping the existing content on the site up to date given my current workload so I think I'd be supportive of the idea but I'd also need help maintaining it 😅

@justinbmeyer
Copy link
Author

Just because you can convert an element from React to a custom element doesn't necessarily mean it's a good custom element.

Well my library does both, so it's good :-). But I completely agree with your point. Here's a rough list of criteria, in order of importance:

  1. Accepts properties.
  2. Accepts attributes for any “primitive” value properties. <my-el number="5" string="hi" bool>
  3. Updates when setAttribute is called.
  4. Produces custom events when state changes.
  5. Can be configured prior to connected.
    const el = new MyEl();
    el.prop = "value" //-> does not break
    document.body.appendChild( el );
    

What's involved with maintaining it? There's a few folks at bitovi who are big believers in web components.

@robdodson
Copy link
Contributor

I have a bot that keeps most dependencies up to date. But aside from that I havent had time to write new tests or update tests for frameworks that have done major version revisions. For example, Svelte 3 doesn't work because the tests need to be updated.

So if someone wanted to add new tests I guess I'd need them to own the maintenance of those tests and handle integrating their results into the site.

@robdodson robdodson mentioned this issue Sep 4, 2019
@justinfagnani
Copy link
Contributor

I think this would be very good to do, especially to test that frameworks that do things like event delegation have a way to work scoped to a shadow root.

I think the way to proceed here would be to develop a list of tests that we would want to write against custom elements and then open the repo for contributions of custom element implementations using the framework to test.

@rictic rictic added the Additional Tests For issues that identify good additional tests to run on all libraries label Dec 29, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Additional Tests For issues that identify good additional tests to run on all libraries
Projects
None yet
Development

No branches or pull requests

4 participants