Hi @ngdangtu-vn - thanks for reporting this. I agree it would be nice to disambiguate them. Alternatively, a different custom name, like:

customElements.define('custom-p-element',
...
// or 
customElements.define('styled-para',
...

Bear in mind if we change this here, we'll have to rename it in the docs that reference the example:

• https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots
• https://developer.mozilla.org/en-US/docs/Web/API/CustomElementRegistry/get
• https://developer.mozilla.org/en-US/docs/Web/API/Element/slot
• https://developer.mozilla.org/en-US/docs/Web/API/Element/assignedSlot

How should I update those MDN articles? Should I update the doc (https://github.com/mdn/content/tree/main/files/en-us/web/api) first or example (this) first?

Lets update the examples here first and we can look at the MDN pages when we're ready. So this might be the best way:

1. open a pull request here with the changes, when that looks good (not necessarily merged):
2. open a pull request in mdn/content to update the pages listed above.

I can help with the reviews for these. Does that sound good? :)

Sound good, give me one or two days.