2

When inspecting the DOM on a web page created by Angular I see many non-standard HTML elements. E.g. inspect the Angular documentation on custom elements. What are these non-standard HTML elements? Examples of non-standard elements in the link: aio-shell and mat-toolbar.

The closest thing I can think of is custom elements from web components but I haven't found documentation that states all Angular components will automatically be compiled to custom elements. Angular supports creating custom elements but from the documentation it seems one has to import @angular/elements and call createCustomElement and I have a project where I have done neither of these and still see the non-standard HTML elements in the DOM.

I can mention that I am used to React which as far as I know only outputs standard HTML elements.

Improve this question
11
  • 1
    Can you provide a specific example to your question? Commented Jan 12, 2022 at 13:24
  • 1
    Maybe you are using a framework or a library (Material, Nebular, etc.) with custom components and that's what you seeing in inspect elements. Commented Jan 12, 2022 at 13:28
  • @J.Starkl Updated question with the examples: aio-shell and mat-toolbar. I know the last one is probably from Material UI, so material UI are creating web components? Commented Jan 12, 2022 at 14:27
  • 1
    mat-toolbar could be from Angular Material. Angular doesn't remove or replace non-standard HTML elements. You'll find all the components in the generated output. Commented Jan 12, 2022 at 14:27
  • @Qiimiia I am using Material UI, can't see web components mentioned in their docs, but I guess that could be the answer. Commented Jan 12, 2022 at 14:29

1 Answer 1

Reset to default
0

Non-standard HTML elements are in fact allowed in HTML5. There is no need to define a custom element (from web components) for a custom element to show up in the DOM. More details here (under the section "Regarding The Validity of The Basic Syntax"): https://stackoverflow.com/a/34972064/6113915

The assumption the question made that non-standard HTML elements are invalid or bad is thus largely wrong, although this can be discussed. The linked SO post states "W3C strongly recommends against them" and the Extensibility paragraph in the HTML spec where custom elements are mentioned the paragraph is stated as "non-normative".

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.