Material Navigation schematic should use the configured prefix in the generated component selector

[juristr]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

When I generate a new component using the new Material schematic for the navigation, for example using shell as my name

ng generate @angular/material:material-nav --name Shell

..then it should create a ShellComponent which uses the app-shell as it's selector.

What is the current behavior?

The selector is shell, like

@Component({
   selector: 'shell'
})
...

What are the steps to reproduce?

Just create a new Angular project, add material and then generate use the schematics command for generating a navigation component:

ng generate @angular/material:material-nav --name Shell

What is the use-case or motivation for changing an existing behavior?

It should follow the standard Angular CLI behavior when generating components.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular CLI: 6.0.5
Node: 9.11.1
OS: darwin x64
Angular: 6.0.3
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.5
@angular-devkit/build-angular     0.6.5
@angular-devkit/build-optimizer   0.6.5
@angular-devkit/core              0.6.5
@angular-devkit/schematics        0.6.5
@angular/cdk                      6.1.0
@angular/cli                      6.0.5
@angular/flex-layout              6.0.0-beta.15
@angular/material                 6.1.0
@ngtools/webpack                  6.0.5
@schematics/angular               0.6.5
@schematics/update                0.6.5
rxjs                              6.2.0
typescript                        2.7.2
webpack                           4.8.3

Is there anything else we should know?

[pfeigl]

While I agree with your report, for now you should be able to to --prefix app.

[juristr]

Yep sure, but ppl won't know that and for consistency the schematic should use the prefix configured in the angular.json. also, as of now, the component generates without any kind of prefix at all which doesn't comply to best practices wrt to custom elements

[pfeigl]

Hmm, had a chance to look at this, but ultimately I think this is not something @angular/material can actually do as of now, because of the following:

https://www.npmjs.com/package/@angular-devkit/schematics#future-work

Schematics is not done yet. Here's a list of things we are considering:

• Smart defaults for Options. Having a JavaScript function for default values based on other default values.

Also (as can be read in the schematics documentation) the tooling is responsible for generating the options. However the important point is, that the schematic can not make an assumption about the CLI executing the schematic.

What that actually means is, that the schematic can not know about the prefix option from angular.json, because that is specific to angular-cli, which is probably the executor, but does not have to be it.

So either this whole topic should be logged with @angular/devkit because something like the correct prefix could always be provided by default (which would be a breaking change) or the issue is kept open because @angular/material gets an option to actually read out the correct prefix and needs to apply it to the options.

And than again, this is just what I read from the current documentation and I might be totally wrong ;-)

[juristr]

I see..

However the important point is, that the schematic can not make an assumption about the CLI executing the schematic.

Sure, that would be wrong.

Great, gonna forward the link to this issue on the Angular Slack. thx meanwhile :)

[Splaktar]

Fixed in 6.3.0 via 84634cc.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}