Improve name validation with component schematic (and others)

[yjaaidi]

🚀 Feature request

Command (mark with an x)

- [ ] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [X] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Description

A clear and concise description of the problem or missing capability...

Using dots in component name when using component schematic (might also happen with other schematics) should fail. I.e. ng generate component a.b.x should fail.

I noticed that people who are new to Angular tend to use the schematic like this for the first time:

ng generate component hello-world.component

which produces something funky like this:

export class HelloWorld.ComponentComponent

Describe the solution you'd like

If you have a solution in mind, please describe it.

Use some whitelist regex to check the component's name before.

By the way, why does the component's selector allow dots in the regular expression below?

angular-cli/packages/schematics/angular/utility/validation.ts

Line 20 in eca5dc3

export const htmlSelectorRe = /^[a-zA-Z][.0-9a-zA-Z]*(:?-[a-zA-Z][.0-9a-zA-Z]*)*$/;

Describe alternatives you've considered

Have you considered any alternative solutions or workarounds?

ng generate component hello-world.component
echo D'OH!
git reset --hard
git clean -d -f
ng generate component hello-world

Anyway, I am in for a pull request.

[alan-agius4]

This also relates to #12868

I am not sure why a dot is allowed there, maybe @clydin knows.

[clydin]

It's a valid character in an HTML element name. That regex is technically overly restrictive as well. unicode characters should be allowed.

[dgp1130]

Should we dupe this against #11051? That one has to do with ng new while this has to do with ng generate, but they are both schematics related and likely have the same root cause?

[alan-agius4]

@dgp1130, I think it’s best to keep these separate since this is a separate validate pattern. Unless we want to create a new master issue to track various validation issues.