Do not consider namespaces when checking for DOM

[yacinehmito]

When testing whether a component is a DOM element, we select the first portion of the name up until : or ., then tests for ^[a-z]|-.

There are many problems with this:

• It doesn't test the name but the namespace, which I don't think is what was intended
• In effect it only tests the first character; not the full tag EDIT: Irrelevant
• It allows for tags that start with - (Related to this)
• In JSX it is not possible to be a DOM element and be in a namespace as well
• : is not an allowed character

It may be a dangerous change, but the tests are still passing and locally it is "more correct".

UPDATE: So this triggers a "chain reaction" in jsx-pascal-case, which if followed solves #1334.

[yacinehmito]

I don't know why these have been considered as valid in the first place. They are not in pascal case.

Is the reasoning that the problem is that they start with a lower case, and thus are wrong to begin with? I can see why we wouldn't want to let jsx-pascal-case trigger an error in that situation.

[yacinehmito]

This is exactly why: 1e17259

[ljharb]

Yes, lowercase components are HTML elements, not custom ones.

[yacinehmito]

: is not an allowed character

About that, I saw references to the colon is a couple of places.
My current understanding, which stems from this comment, is clashing with what I see in the code. 🤔

[yacinehmito]

I performed more tests and found this bit of code that explains it: https://github.com/babel/babel/blob/c3a5bf1ff5bd0df437bc20752464d08674d011d3/packages/babel-types/src/validators/react/isCompatTag.js#L2

I'll revert to (almost) the same RegExp and will add a comment.

[yacinehmito]

@ljharb This is ready for review.