search

wix-incubator / react-templates

Light weight templates for react
https://wix.github.io/react-templates
MIT License
2.82k stars 207 forks source link

allow the use of 'class' in custom-elements #191

Closed nippur72 closed 7 years ago

nippur72 commented 8 years ago

Since react-templates automatically turns the class attribute into className it's not possible to define a working class attribute on custom elements (e.g. WebComponents).

Example:

<my-div class="red"></my-div>

generates:

var templateRT = function () {
    return React.createElement('my-div', { 'className': 'red' });
};

which doesn't work because custom elements in react expect a class attribute instead of className, as explained in https://github.com/facebook/react/issues/4933:

TLDR: Custom elements DO work in React. You must use class instead of className because the custom element spec requires that we allow users to specify a className attribute and we need to preserve that functionality for custom elements.

As a fix for this, I suggest that we map back className into class for custom elements.