Polymer's declarative event listener names have issues with casing

[sorvell]

Polymer adds event listeners to elements declaratively using attribute names in HTML as input. For example, <a on-click="foo"> in an element template adds a listener as if the user did: <a>.addEventListener('click', e => this.foo(e)).

Since HTML attribute names are not case sensitive, supporting any casing requires a convention. For properties Polymer does dash->camel casing to map attribute names to properties names (foo-bar becomes fooBar) but it does not do this for events. Notably Polymer notification events include dashes (e.g. name-changed) so we expect lots of user code relies on this convention.

This means that it's currently not possible to declaratively listen to events like camelEvent, CAPSEvent, or PascalEvent.

We could consider introducing a new syntax to support this. A couple of options:

• Use _ in events to indicate "remove the _ and replace the next character with uppercase".
• Add a special attribute name like polymer-events within which the value is used to declare events like `polymer-events="lowercaseevent: handler1, cameEvent: handler2, CAPSEvent: handler3" ...

This will cause Polymer to fail ~6 tests (as of this issue) at https://custom-elements-everywhere.com/

[JosefJezek]

@sorvell @TimvdLippe any progress?

[TimvdLippe]

No progress yet. The desired solution is still under discussion. The root issue is that this how the platform currently works and we have not decided how to address this (whether to solve it in the platform or in Polymer specifically)

[robdodson]

After seeing that a few other libraries on custom-elements-everywhere trip over this I've started just using all lowercase event names with no separators. It looks messy, but it does match how the platform does most modern events like touchstart and pointerdown.

[esprehn]

fwiw my understanding when working on specs was that all future events will be all lowercase. Ex. See fetch observer events.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale]

This issue has been automatically closed after being marked stale. If you're still facing this problem with the above solution, please comment and we'll reopen!