re: Web Components — the right way. VIEW POST

FULL DISCUSSION
 

I actually like the Gold Standard (github.com/webcomponents/gold-stan...) it's kinda describing what you mean, isn't it?

Could you please explain what you mean by the <my-button> example? Isn't that the way to go due to the lack of customized built-ins? Thx in advance

 

Hi, gold standard is much more related to the technical development, this article talk about something more abstract. But yes, they aim to the same point. Telling to users how to use web components by the HTML approach.

If you can extend, check this section of the google fundamentals doc.
If you can't extend and you are making a custom button element (even if i don't see why you should do that), you should recreate it. Your <my-button> will become the button itself (using accessibility attributes), it should not wrap another <button>. This mean that you should recreate all the native button behaviours (or those you need) and add your new features. This does not mean that you can't put a button inside a shadow-root, just not inside a custom element that aim to replace the button itself.

Do you would put a <button> inside another <button> in the HTML? Why you should do that with custom elements?

 

Yep, customized built-ins would be ideal. We agree.

What do you think of how elix's AutsizeTextarea does it?

Recreating (as you describe) means building a new element with a (potentially) different behavior set, running the danger to not really behave like an extended element, wouldn't it?

Recreating (as you describe) means building a new element with a (potentially) different behavior set, running the danger to not really behave like an extended element, wouldn't it?

Yes, until we can fully extend built-in elements each ”recreated" custom element should behave the same as the native one.. and that's why is hard to think, hard to do and generally a bad practice. I think it's really hard to find some built-in element that needs to be recreated... about elis'x autosize textarea, they added a funcionality but they can avoid using a <textarea> element and use a content-editable element (recreating the textarea behavior and so on...)

code of conduct - report abuse