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

Score 100% on Custom Elements Everywhere benchmark #3335

Open
nolanlawson opened this issue Feb 8, 2023 · 4 comments
Open

Score 100% on Custom Elements Everywhere benchmark #3335

nolanlawson opened this issue Feb 8, 2023 · 4 comments
Labels
BUG P3 Up for grabs Issues that are relatively small, self-contained, and ready for implementation

Comments

@nolanlawson
Copy link
Collaborator

The Custom Elements Everywhere benchmark is an industry-standard tool to measure the degree that a web framework supports custom elements (web components).

Now that we have lwc:external, we should be able to score 100% on this test. There are two pieces of work here:

  1. Open a PR on that project to add LWC as a tested framework.
  2. Fix bugs where we don't score 100% on the test. Off the top of my head, we will need to support declarative event names in formats like camelCase and kebab-case, not just lowercase.
@ekashida
Copy link
Member

#1904 for historical context

@ekashida ekashida closed this as not planned Won't fix, can't repro, duplicate, stale Feb 21, 2023
@ekashida ekashida reopened this Feb 21, 2023
@ekashida
Copy link
Member

Sorry, wrong button!

@git2gus
Copy link

git2gus bot commented Jul 26, 2023

This issue has been linked to a new work item: W-13831267

@nolanlawson nolanlawson added the Up for grabs Issues that are relatively small, self-contained, and ready for implementation label Aug 11, 2023
@nolanlawson
Copy link
Collaborator Author

Related: #1811

We discussed this today in dev sync, @ekashida and I agree that it would make sense to support

<x-foo onfoo-bar>
<x-foo onFooBar>

... i.e., event names in kebab-case or pascal/camel/upper-case, in order to score 100% on Custom Elements Everywhere. Even if LWC components do not support this format, other web component frameworks may dispatch events in this format, and for maximum interoperability, LWC should be able to declaratively handle those events.

We can solve this purely in the compiler level – when the VNode is sent to the client, it already has the event as the key in an object, so it's trivial to support hyphens/uppercase letters.

The question is whether to support this only for lwc:external or all components. For LWC components, supporting this would mean relaxing existing compile-time and runtime tests that validate that event names are always lowercase and don't contain hyphens.

We also need #3602 to be merged first since we will probably have to grab the raw string from parse5.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
BUG P3 Up for grabs Issues that are relatively small, self-contained, and ready for implementation
Projects
None yet
Development

No branches or pull requests

2 participants