diff --git a/src/cdk/schematics/ng-generate/drag-drop/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/src/cdk/schematics/ng-generate/drag-drop/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template index 9a583d6438e0..98cd469e0c89 100644 --- a/src/cdk/schematics/ng-generate/drag-drop/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template +++ b/src/cdk/schematics/ng-generate/drag-drop/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template @@ -14,7 +14,8 @@ import { <% if(standalone) { %>CdkDrag, CdkDropList, <% } %>CdkDragDrop, moveIte encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %><% if(standalone) { %>, standalone: true, - imports: [CdkDrag, CdkDropList]<% } %> + imports: [CdkDrag, CdkDropList]<% } else { %>, + standalone: false<% } %> }) export class <%= classify(name) %>Component { todo = [ diff --git a/src/cdk/schematics/ng-generate/drag-drop/index.spec.ts b/src/cdk/schematics/ng-generate/drag-drop/index.spec.ts index a542758bfe3a..995c91add72b 100644 --- a/src/cdk/schematics/ng-generate/drag-drop/index.spec.ts +++ b/src/cdk/schematics/ng-generate/drag-drop/index.spec.ts @@ -56,6 +56,19 @@ describe('CDK drag-drop schematic', () => { expect(component).toContain('imports: ['); }); + it('should generate a component with no imports and standalone false', async () => { + const app = await createTestApp(runner, {standalone: false}); + const tree = await runner.runSchematic('drag-drop', {...baseOptions, standalone: false}, app); + const module = getFileContent(tree, '/projects/material/src/app/app.module.ts'); + const component = getFileContent(tree, '/projects/material/src/app/foo/foo.component.ts'); + + expect(module).toContain('DragDropModule'); + expect(module).toContain('FooComponent'); + + expect(component).toContain('standalone: false'); + expect(component).not.toContain('imports: ['); + }); + it('should infer the standalone option from the project structure', async () => { const app = await createTestApp(runner, {standalone: true}); const tree = await runner.runSchematic('drag-drop', baseOptions, app); diff --git a/src/material/schematics/ng-generate/address-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/src/material/schematics/ng-generate/address-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template index 6671f045b81a..ac3c3228902c 100644 --- a/src/material/schematics/ng-generate/address-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template +++ b/src/material/schematics/ng-generate/address-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template @@ -22,7 +22,6 @@ import { FormBuilder, Validators } from '@angular/forms'; styleUrl: './<%= dasherize(name) %>.component.<%= style %>'<% } %><% if(!!viewEncapsulation) { %>, encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %><% if(standalone) { %>, - standalone: true, imports: [ MatInputModule, MatButtonModule, @@ -30,7 +29,8 @@ import { FormBuilder, Validators } from '@angular/forms'; MatRadioModule, MatCardModule, ReactiveFormsModule - ]<% } %> + ]<% } else { %>, + standalone: false<% } %> }) export class <%= classify(name) %>Component { private fb = inject(FormBuilder); diff --git a/src/material/schematics/ng-generate/address-form/index.spec.ts b/src/material/schematics/ng-generate/address-form/index.spec.ts index e18985df5ae1..c1a334de9725 100644 --- a/src/material/schematics/ng-generate/address-form/index.spec.ts +++ b/src/material/schematics/ng-generate/address-form/index.spec.ts @@ -74,17 +74,41 @@ describe('Material address-form schematic', () => { }); expect(module).not.toContain('FooComponent'); - expect(content).toContain('standalone: true'); expect(content).toContain('imports: ['); }); + it('should generate a component with no imports and standalone false', async () => { + const app = await createTestApp(runner, {standalone: false}); + const tree = await runner.runSchematic( + 'address-form', + {...baseOptions, standalone: false}, + app, + ); + const module = getFileContent(tree, '/projects/material/src/app/app.module.ts'); + const content = getFileContent(tree, '/projects/material/src/app/foo/foo.component.ts'); + const requiredModules = [ + 'MatInputModule', + 'MatButtonModule', + 'MatSelectModule', + 'MatRadioModule', + 'ReactiveFormsModule', + ]; + + requiredModules.forEach(name => { + expect(module).withContext('Module should import dependencies').toContain(name); + expect(content).withContext('Component should not import dependencies').not.toContain(name); + }); + + expect(content).toContain('standalone: false'); + expect(content).not.toContain('imports: ['); + }); + it('should infer the standalone option from the project structure', async () => { const app = await createTestApp(runner, {standalone: true}); const tree = await runner.runSchematic('address-form', baseOptions, app); const component = getFileContent(tree, '/projects/material/src/app/foo/foo.component.ts'); expect(tree.exists('/projects/material/src/app/app.module.ts')).toBe(false); - expect(component).toContain('standalone: true'); expect(component).toContain('imports: ['); }); }); diff --git a/src/material/schematics/ng-generate/dashboard/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/src/material/schematics/ng-generate/dashboard/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template index b845891fe6c5..9435b012075f 100644 --- a/src/material/schematics/ng-generate/dashboard/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template +++ b/src/material/schematics/ng-generate/dashboard/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template @@ -20,7 +20,6 @@ import { MatCardModule } from '@angular/material/card';<% } %> styleUrl: './<%= dasherize(name) %>.component.<%= style %>'<% } %><% if(!!viewEncapsulation) { %>, encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %><% if(standalone) { %>, - standalone: true, imports: [ AsyncPipe, MatGridListModule, @@ -28,7 +27,8 @@ import { MatCardModule } from '@angular/material/card';<% } %> MatIconModule, MatButtonModule, MatCardModule - ]<% } %> + ]<% } else { %>, + standalone: false<% } %> }) export class <%= classify(name) %>Component { private breakpointObserver = inject(BreakpointObserver); diff --git a/src/material/schematics/ng-generate/dashboard/index.spec.ts b/src/material/schematics/ng-generate/dashboard/index.spec.ts index 4ced17b6aa8f..97f7792abf2f 100644 --- a/src/material/schematics/ng-generate/dashboard/index.spec.ts +++ b/src/material/schematics/ng-generate/dashboard/index.spec.ts @@ -78,10 +78,33 @@ describe('material-dashboard-schematic', () => { }); expect(module).not.toContain('FooComponent'); - expect(component).toContain('standalone: true'); expect(component).toContain('imports: ['); }); + it('should generate a component with no imports and standalone false', async () => { + const app = await createTestApp(runner, {standalone: false}); + const tree = await runner.runSchematic('dashboard', {...baseOptions, standalone: false}, app); + const module = getFileContent(tree, '/projects/material/src/app/app.module.ts'); + const component = getFileContent(tree, '/projects/material/src/app/foo/foo.component.ts'); + const requiredModules = [ + 'MatButtonModule', + 'MatCardModule', + 'MatGridListModule', + 'MatIconModule', + 'MatMenuModule', + ]; + + requiredModules.forEach(name => { + expect(module).withContext('Module should import dependencies').toContain(name); + expect(component) + .withContext('Component should not import dependencies') + .not.toContain(name); + }); + + expect(component).toContain('standalone: false'); + expect(component).not.toContain('imports: ['); + }); + it('should infer the standalone option from the project structure', async () => { const app = await createTestApp(runner, {standalone: true}); const tree = await runner.runSchematic('dashboard', baseOptions, app); @@ -91,7 +114,6 @@ describe('material-dashboard-schematic', () => { ); expect(tree.exists('/projects/material/src/app/app.module.ts')).toBe(false); - expect(componentContent).toContain('standalone: true'); expect(componentContent).toContain('imports: ['); }); }); diff --git a/src/material/schematics/ng-generate/navigation/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/src/material/schematics/ng-generate/navigation/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template index f452a41a3346..55b0852452be 100644 --- a/src/material/schematics/ng-generate/navigation/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template +++ b/src/material/schematics/ng-generate/navigation/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template @@ -21,7 +21,6 @@ import { map, shareReplay } from 'rxjs/operators'; styleUrl: './<%= dasherize(name) %>.component.<%= style %>'<% } %><% if(!!viewEncapsulation) { %>, encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %><% if(standalone) { %>, - standalone: true, imports: [ MatToolbarModule, MatButtonModule, @@ -29,7 +28,8 @@ import { map, shareReplay } from 'rxjs/operators'; MatListModule, MatIconModule, AsyncPipe, - ]<% } %> + ]<% } else { %>, + standalone: false<% } %> }) export class <%= classify(name) %>Component { private breakpointObserver = inject(BreakpointObserver); diff --git a/src/material/schematics/ng-generate/navigation/index.spec.ts b/src/material/schematics/ng-generate/navigation/index.spec.ts index 94f3ca593456..e17ce5b14e92 100644 --- a/src/material/schematics/ng-generate/navigation/index.spec.ts +++ b/src/material/schematics/ng-generate/navigation/index.spec.ts @@ -89,10 +89,37 @@ describe('material-navigation-schematic', () => { }); expect(module).not.toContain('FooComponent'); - expect(component).toContain('standalone: true'); expect(component).toContain('imports: ['); }); + it('should generate a component with no imports and standalone false', async () => { + const app = await createTestApp(runner, {standalone: false}); + const tree = await runner.runSchematic( + 'navigation', + {...baseOptions, standalone: false}, + app, + ); + const module = getFileContent(tree, '/projects/material/src/app/app.module.ts'); + const component = getFileContent(tree, '/projects/material/src/app/foo/foo.component.ts'); + const requiredModules = [ + 'MatToolbarModule', + 'MatButtonModule', + 'MatSidenavModule', + 'MatListModule', + 'MatIconModule', + ]; + + requiredModules.forEach(name => { + expect(module).withContext('Module should import dependencies').toContain(name); + expect(component) + .withContext('Component should not import dependencies') + .not.toContain(name); + }); + + expect(component).toContain('standalone: false'); + expect(component).not.toContain('imports: ['); + }); + it('should infer the standalone option from the project structure', async () => { const app = await createTestApp(runner, {standalone: true}); const tree = await runner.runSchematic('navigation', baseOptions, app); @@ -102,7 +129,6 @@ describe('material-navigation-schematic', () => { ); expect(tree.exists('/projects/material/src/app/app.module.ts')).toBe(false); - expect(componentContent).toContain('standalone: true'); expect(componentContent).toContain('imports: ['); }); }); diff --git a/src/material/schematics/ng-generate/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/src/material/schematics/ng-generate/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template index 79a0e66255d2..852f2650e26a 100644 --- a/src/material/schematics/ng-generate/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template +++ b/src/material/schematics/ng-generate/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template @@ -16,8 +16,8 @@ import { <%= classify(name) %>DataSource, <%= classify(name) %>Item } from './<% styleUrl: './<%= dasherize(name) %>.component.<%= style %>'<% } %><% if(!!viewEncapsulation) { %>, encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %><% if(standalone) { %>, - standalone: true, - imports: [MatTableModule, MatPaginatorModule, MatSortModule]<% } %> + imports: [MatTableModule, MatPaginatorModule, MatSortModule]<% } else { %>, + standalone: false<% } %> }) export class <%= classify(name) %>Component implements AfterViewInit { @ViewChild(MatPaginator) paginator!: MatPaginator; diff --git a/src/material/schematics/ng-generate/table/index.spec.ts b/src/material/schematics/ng-generate/table/index.spec.ts index bd2b50733af0..dbdf545983bd 100644 --- a/src/material/schematics/ng-generate/table/index.spec.ts +++ b/src/material/schematics/ng-generate/table/index.spec.ts @@ -84,10 +84,27 @@ describe('material-table-schematic', () => { }); expect(module).not.toContain('FooComponent'); - expect(component).toContain('standalone: true'); expect(component).toContain('imports: ['); }); + it('should generate a component with no imports and standalone false', async () => { + const app = await createTestApp(runner, {standalone: false}); + const tree = await runner.runSchematic('table', {...baseOptions, standalone: false}, app); + const module = getFileContent(tree, '/projects/material/src/app/app.module.ts'); + const component = getFileContent(tree, '/projects/material/src/app/foo/foo.component.ts'); + const requiredModules = ['MatTableModule', 'MatPaginatorModule', 'MatSortModule']; + + requiredModules.forEach(name => { + expect(module).withContext('Module should import dependencies').toContain(name); + expect(component) + .withContext('Component should not import dependencies') + .not.toContain(name); + }); + + expect(component).toContain('standalone: false'); + expect(component).not.toContain('imports: ['); + }); + it('should infer the standalone option from the project structure', async () => { const app = await createTestApp(runner, {standalone: true}); const tree = await runner.runSchematic('table', baseOptions, app); @@ -97,7 +114,6 @@ describe('material-table-schematic', () => { ); expect(tree.exists('/projects/material/src/app/app.module.ts')).toBe(false); - expect(componentContent).toContain('standalone: true'); expect(componentContent).toContain('imports: ['); }); }); diff --git a/src/material/schematics/ng-generate/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template b/src/material/schematics/ng-generate/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template index c99857313654..98e2291d00cf 100644 --- a/src/material/schematics/ng-generate/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template +++ b/src/material/schematics/ng-generate/tree/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts.template @@ -35,8 +35,8 @@ export interface FlatTreeNode { styleUrl: './<%= dasherize(name) %>.component.<%= style %>'<% } %><% if(!!viewEncapsulation) { %>, encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>, changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %><% if(standalone) { %>, - standalone: true, - imports: [MatTreeModule, MatButtonModule, MatIconModule]<% } %> + imports: [MatTreeModule, MatButtonModule, MatIconModule]<% } else { %>, + standalone: false<% } %> }) export class <%= classify(name) %>Component { diff --git a/src/material/schematics/ng-generate/tree/index.spec.ts b/src/material/schematics/ng-generate/tree/index.spec.ts index 9bec5db57542..d4d88822ba7a 100644 --- a/src/material/schematics/ng-generate/tree/index.spec.ts +++ b/src/material/schematics/ng-generate/tree/index.spec.ts @@ -62,10 +62,27 @@ describe('Material tree schematic', () => { }); expect(module).not.toContain('FooComponent'); - expect(component).toContain('standalone: true'); expect(component).toContain('imports: ['); }); + it('should generate a component with no imports and standalone false', async () => { + const app = await createTestApp(runner, {standalone: false}); + const tree = await runner.runSchematic('tree', {...baseOptions, standalone: false}, app); + const module = getFileContent(tree, '/projects/material/src/app/app.module.ts'); + const component = getFileContent(tree, '/projects/material/src/app/foo/foo.component.ts'); + const requiredModules = ['MatTreeModule', 'MatButtonModule', 'MatIconModule']; + + requiredModules.forEach(name => { + expect(module).withContext('Module should import dependencies').toContain(name); + expect(component) + .withContext('Component should not import dependencies') + .not.toContain(name); + }); + + expect(component).toContain('standalone: false'); + expect(component).not.toContain('imports: ['); + }); + it('should infer the standalone option from the project structure', async () => { const app = await createTestApp(runner, {standalone: true}); const tree = await runner.runSchematic('tree', baseOptions, app); @@ -75,7 +92,6 @@ describe('Material tree schematic', () => { ); expect(tree.exists('/projects/material/src/app/app.module.ts')).toBe(false); - expect(componentContent).toContain('standalone: true'); expect(componentContent).toContain('imports: ['); }); });