Skip to content

Commit b09cad4

Browse files
crisbetocrisbeto
committed
refactor(material/sidenav): convert to standalone
Converts `material/sidenav` to standalone.
1 parent f520024 commit b09cad4

File tree

7 files changed

+93
-29
lines changed

7 files changed

+93
-29
lines changed

‎src/material/sidenav/drawer.spec.ts

Lines changed: 49 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,22 @@ import {MatDrawer, MatSidenavModule, MatDrawerContainer} from './index';
1414
import {Direction} from '@angular/cdk/bidi';
1515
import {A11yModule} from '@angular/cdk/a11y';
1616
import {ESCAPE} from '@angular/cdk/keycodes';
17-
import {dispatchKeyboardEvent, createKeyboardEvent, dispatchEvent} from '../../cdk/testing/private';
17+
import {
18+
dispatchKeyboardEvent,
19+
createKeyboardEvent,
20+
dispatchEvent,
21+
} from '@angular/cdk/testing/private';
1822
import {CdkScrollable} from '@angular/cdk/scrolling';
1923
import {CommonModule} from '@angular/common';
2024

2125
describe('MatDrawer', () => {
2226
beforeEach(waitForAsync(() => {
2327
TestBed.configureTestingModule({
24-
imports: [MatSidenavModule, A11yModule, NoopAnimationsModule, CommonModule],
25-
declarations: [
28+
imports: [
29+
MatSidenavModule,
30+
A11yModule,
31+
NoopAnimationsModule,
32+
CommonModule,
2633
BasicTestApp,
2734
DrawerContainerNoDrawerTestApp,
2835
DrawerSetToOpenedFalse,
@@ -500,8 +507,7 @@ describe('MatDrawer', () => {
500507
it('should not throw when a two-way binding is toggled quickly while animating', fakeAsync(() => {
501508
TestBed.resetTestingModule()
502509
.configureTestingModule({
503-
imports: [MatSidenavModule, BrowserAnimationsModule],
504-
declarations: [DrawerOpenBinding],
510+
imports: [MatSidenavModule, BrowserAnimationsModule, DrawerOpenBinding],
505511
})
506512
.compileComponents();
507513

@@ -830,8 +836,10 @@ describe('MatDrawer', () => {
830836
describe('MatDrawerContainer', () => {
831837
beforeEach(waitForAsync(() => {
832838
TestBed.configureTestingModule({
833-
imports: [MatSidenavModule, A11yModule, NoopAnimationsModule],
834-
declarations: [
839+
imports: [
840+
MatSidenavModule,
841+
A11yModule,
842+
NoopAnimationsModule,
835843
DrawerContainerTwoDrawerTestApp,
836844
DrawerDelayed,
837845
DrawerSetToOpenedTrue,
@@ -953,8 +961,7 @@ describe('MatDrawerContainer', () => {
953961
it('should not animate when the sidenav is open on load', fakeAsync(() => {
954962
TestBed.resetTestingModule()
955963
.configureTestingModule({
956-
imports: [MatSidenavModule, BrowserAnimationsModule],
957-
declarations: [DrawerSetToOpenedTrue],
964+
imports: [MatSidenavModule, BrowserAnimationsModule, DrawerSetToOpenedTrue],
958965
})
959966
.compileComponents();
960967

@@ -1135,7 +1142,11 @@ describe('MatDrawerContainer', () => {
11351142
});
11361143

11371144
/** Test component that contains an MatDrawerContainer but no MatDrawer. */
1138-
@Component({template: `<mat-drawer-container></mat-drawer-container>`})
1145+
@Component({
1146+
template: `<mat-drawer-container></mat-drawer-container>`,
1147+
standalone: true,
1148+
imports: [MatSidenavModule, A11yModule, CommonModule],
1149+
})
11391150
class DrawerContainerNoDrawerTestApp {}
11401151

11411152
/** Test component that contains an MatDrawerContainer and 2 MatDrawer in the same position. */
@@ -1145,6 +1156,8 @@ class DrawerContainerNoDrawerTestApp {}
11451156
<mat-drawer position="start"></mat-drawer>
11461157
<mat-drawer position="end"></mat-drawer>
11471158
</mat-drawer-container>`,
1159+
standalone: true,
1160+
imports: [MatSidenavModule, A11yModule],
11481161
})
11491162
class DrawerContainerTwoDrawerTestApp {
11501163
@ViewChild(MatDrawerContainer) drawerContainer: MatDrawerContainer;
@@ -1172,6 +1185,8 @@ class DrawerContainerTwoDrawerTestApp {
11721185
<circle cx="50" cy="50" r="50"/>
11731186
</svg>
11741187
</mat-drawer-container>`,
1188+
standalone: true,
1189+
imports: [MatSidenavModule, A11yModule, CommonModule],
11751190
})
11761191
class BasicTestApp {
11771192
openCount = 0;
@@ -1216,6 +1231,8 @@ class BasicTestApp {
12161231
Closed Drawer.
12171232
</mat-drawer>
12181233
</mat-drawer-container>`,
1234+
standalone: true,
1235+
imports: [MatSidenavModule, A11yModule, CommonModule],
12191236
})
12201237
class DrawerSetToOpenedFalse {}
12211238

@@ -1226,6 +1243,8 @@ class DrawerSetToOpenedFalse {}
12261243
Closed Drawer.
12271244
</mat-drawer>
12281245
</mat-drawer-container>`,
1246+
standalone: true,
1247+
imports: [MatSidenavModule, A11yModule, CommonModule],
12291248
})
12301249
class DrawerSetToOpenedTrue {
12311250
openCallback = jasmine.createSpy('open callback');
@@ -1238,6 +1257,8 @@ class DrawerSetToOpenedTrue {
12381257
Closed Drawer.
12391258
</mat-drawer>
12401259
</mat-drawer-container>`,
1260+
standalone: true,
1261+
imports: [MatSidenavModule, A11yModule, CommonModule],
12411262
})
12421263
class DrawerOpenBinding {
12431264
isOpen = false;
@@ -1249,6 +1270,8 @@ class DrawerOpenBinding {
12491270
<mat-drawer #drawer1 [position]="drawer1Position"></mat-drawer>
12501271
<mat-drawer #drawer2 [position]="drawer2Position"></mat-drawer>
12511272
</mat-drawer-container>`,
1273+
standalone: true,
1274+
imports: [MatSidenavModule, A11yModule, CommonModule],
12521275
})
12531276
class DrawerDynamicPosition {
12541277
drawer1Position = 'start';
@@ -1265,6 +1288,8 @@ class DrawerDynamicPosition {
12651288
</mat-drawer>
12661289
<input type="text" class="input2"/>
12671290
</mat-drawer-container>`,
1291+
standalone: true,
1292+
imports: [MatSidenavModule, A11yModule, CommonModule],
12681293
})
12691294
class DrawerWithFocusableElements {
12701295
mode: string = 'over';
@@ -1278,6 +1303,8 @@ class DrawerWithFocusableElements {
12781303
<button disabled>Not focusable</button>
12791304
</mat-drawer>
12801305
</mat-drawer-container>`,
1306+
standalone: true,
1307+
imports: [MatSidenavModule, A11yModule, CommonModule],
12811308
})
12821309
class DrawerWithoutFocusableElements {}
12831310

@@ -1289,6 +1316,8 @@ class DrawerWithoutFocusableElements {}
12891316
}
12901317
</mat-drawer-container>
12911318
`,
1319+
standalone: true,
1320+
imports: [MatSidenavModule, A11yModule],
12921321
})
12931322
class DrawerDelayed {
12941323
@ViewChild(MatDrawer) drawer: MatDrawer;
@@ -1302,6 +1331,8 @@ class DrawerDelayed {
13021331
<mat-drawer [mode]="mode" style="width:100px"></mat-drawer>
13031332
}
13041333
</mat-drawer-container>`,
1334+
standalone: true,
1335+
imports: [MatSidenavModule, A11yModule],
13051336
})
13061337
class DrawerContainerStateChangesTestApp {
13071338
@ViewChild(MatDrawer) drawer: MatDrawer;
@@ -1320,6 +1351,8 @@ class DrawerContainerStateChangesTestApp {
13201351
<div [style.width.px]="fillerWidth" style="height: 200px; background: red;"></div>
13211352
</mat-drawer>
13221353
</mat-drawer-container>`,
1354+
standalone: true,
1355+
imports: [MatSidenavModule, A11yModule],
13231356
})
13241357
class AutosizeDrawer {
13251358
@ViewChild(MatDrawer) drawer: MatDrawer;
@@ -1334,6 +1367,8 @@ class AutosizeDrawer {
13341367
<mat-drawer-content>Content</mat-drawer-content>
13351368
</mat-drawer-container>
13361369
`,
1370+
standalone: true,
1371+
imports: [MatSidenavModule, A11yModule],
13371372
})
13381373
class DrawerContainerWithContent {
13391374
@ViewChild(MatDrawerContainer) drawerContainer: MatDrawerContainer;
@@ -1348,6 +1383,8 @@ class DrawerContainerWithContent {
13481383
<mat-drawer #drawer>Drawer</mat-drawer>
13491384
}
13501385
</mat-drawer-container>`,
1386+
standalone: true,
1387+
imports: [MatSidenavModule, A11yModule, CommonModule],
13511388
})
13521389
class IndirectDescendantDrawer {
13531390
@ViewChild('container') container: MatDrawerContainer;
@@ -1365,6 +1402,8 @@ class IndirectDescendantDrawer {
13651402
</mat-drawer-content>
13661403
</mat-drawer-container>
13671404
`,
1405+
standalone: true,
1406+
imports: [MatSidenavModule, A11yModule, CommonModule],
13681407
})
13691408
class NestedDrawerContainers {
13701409
@ViewChild('outerContainer') outerContainer: MatDrawerContainer;

‎src/material/sidenav/drawer.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,7 @@ export function MAT_DRAWER_DEFAULT_AUTOSIZE_FACTORY(): boolean {
111111
useExisting: MatDrawerContent,
112112
},
113113
],
114+
standalone: true,
114115
})
115116
export class MatDrawerContent extends CdkScrollable implements AfterContentInit {
116117
constructor(
@@ -155,6 +156,8 @@ export class MatDrawerContent extends CdkScrollable implements AfterContentInit
155156
},
156157
changeDetection: ChangeDetectionStrategy.OnPush,
157158
encapsulation: ViewEncapsulation.None,
159+
standalone: true,
160+
imports: [CdkScrollable],
158161
})
159162
export class MatDrawer implements AfterViewInit, AfterContentChecked, OnDestroy {
160163
private _focusTrap: FocusTrap;
@@ -648,6 +651,8 @@ export class MatDrawer implements AfterViewInit, AfterContentChecked, OnDestroy
648651
useExisting: MatDrawerContainer,
649652
},
650653
],
654+
standalone: true,
655+
imports: [MatDrawerContent],
651656
})
652657
export class MatDrawerContainer implements AfterContentInit, DoCheck, OnDestroy {
653658
/** All drawers in the container. Includes drawers from inside nested containers. */

‎src/material/sidenav/sidenav-module.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,18 +12,19 @@ import {MatDrawer, MatDrawerContainer, MatDrawerContent} from './drawer';
1212
import {MatSidenav, MatSidenavContainer, MatSidenavContent} from './sidenav';
1313

1414
@NgModule({
15-
imports: [MatCommonModule, CdkScrollableModule],
16-
exports: [
17-
CdkScrollableModule,
15+
imports: [
1816
MatCommonModule,
17+
CdkScrollableModule,
1918
MatDrawer,
2019
MatDrawerContainer,
2120
MatDrawerContent,
2221
MatSidenav,
2322
MatSidenavContainer,
2423
MatSidenavContent,
2524
],
26-
declarations: [
25+
exports: [
26+
CdkScrollableModule,
27+
MatCommonModule,
2728
MatDrawer,
2829
MatDrawerContainer,
2930
MatDrawerContent,

‎src/material/sidenav/sidenav.spec.ts

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,14 @@ import {CommonModule} from '@angular/common';
88
describe('MatSidenav', () => {
99
beforeEach(waitForAsync(() => {
1010
TestBed.configureTestingModule({
11-
imports: [MatSidenavModule, NoopAnimationsModule, CommonModule],
12-
declarations: [SidenavWithFixedPosition, IndirectDescendantSidenav, NestedSidenavContainers],
11+
imports: [
12+
MatSidenavModule,
13+
NoopAnimationsModule,
14+
CommonModule,
15+
SidenavWithFixedPosition,
16+
IndirectDescendantSidenav,
17+
NestedSidenavContainers,
18+
],
1319
});
1420

1521
TestBed.compileComponents();
@@ -97,6 +103,8 @@ describe('MatSidenav', () => {
97103
Some content.
98104
</mat-sidenav-content>
99105
</mat-sidenav-container>`,
106+
standalone: true,
107+
imports: [MatSidenavModule, CommonModule],
100108
})
101109
class SidenavWithFixedPosition {
102110
fixed = true;
@@ -114,6 +122,8 @@ class SidenavWithFixedPosition {
114122
}
115123
<mat-sidenav-content>Some content.</mat-sidenav-content>
116124
</mat-sidenav-container>`,
125+
standalone: true,
126+
imports: [MatSidenavModule, CommonModule],
117127
})
118128
class IndirectDescendantSidenav {
119129
@ViewChild('container') container: MatSidenavContainer;
@@ -131,6 +141,8 @@ class IndirectDescendantSidenav {
131141
</mat-sidenav-content>
132142
</mat-sidenav-container>
133143
`,
144+
standalone: true,
145+
imports: [MatSidenavModule, CommonModule],
134146
})
135147
class NestedSidenavContainers {
136148
@ViewChild('outerContainer') outerContainer: MatSidenavContainer;

‎src/material/sidenav/sidenav.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ import {ScrollDispatcher, CdkScrollable} from '@angular/cdk/scrolling';
4747
useExisting: MatSidenavContent,
4848
},
4949
],
50+
standalone: true,
5051
})
5152
export class MatSidenavContent extends MatDrawerContent {
5253
constructor(
@@ -82,6 +83,8 @@ export class MatSidenavContent extends MatDrawerContent {
8283
},
8384
changeDetection: ChangeDetectionStrategy.OnPush,
8485
encapsulation: ViewEncapsulation.None,
86+
standalone: true,
87+
imports: [CdkScrollable],
8588
})
8689
export class MatSidenav extends MatDrawer {
8790
/** Whether the sidenav is fixed in the viewport. */
@@ -139,6 +142,8 @@ export class MatSidenav extends MatDrawer {
139142
useExisting: MatSidenavContainer,
140143
},
141144
],
145+
standalone: true,
146+
imports: [MatSidenavContent],
142147
})
143148
export class MatSidenavContainer extends MatDrawerContainer {
144149
@ContentChildren(MatSidenav, {

‎src/material/sidenav/testing/sidenav-harness.spec.ts

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,7 @@ describe('MatSidenavHarness', () => {
1818

1919
beforeEach(async () => {
2020
await TestBed.configureTestingModule({
21-
imports: [MatSidenavModule, NoopAnimationsModule],
22-
declarations: [DrawerHarnessTest],
21+
imports: [MatSidenavModule, NoopAnimationsModule, DrawerHarnessTest],
2322
}).compileComponents();
2423

2524
fixture = TestBed.createComponent(DrawerHarnessTest);
@@ -111,8 +110,7 @@ describe('MatSidenavHarness', () => {
111110

112111
beforeEach(async () => {
113112
await TestBed.configureTestingModule({
114-
imports: [MatSidenavModule, NoopAnimationsModule],
115-
declarations: [SidenavHarnessTest],
113+
imports: [MatSidenavModule, NoopAnimationsModule, SidenavHarnessTest],
116114
}).compileComponents();
117115

118116
fixture = TestBed.createComponent(SidenavHarnessTest);
@@ -178,6 +176,8 @@ describe('MatSidenavHarness', () => {
178176
<mat-drawer-content>Content</mat-drawer-content>
179177
</mat-drawer-container>
180178
`,
179+
standalone: true,
180+
imports: [MatSidenavModule],
181181
})
182182
class DrawerHarnessTest {
183183
threeOpened = true;
@@ -196,5 +196,7 @@ class DrawerHarnessTest {
196196
<mat-sidenav-content>Content</mat-sidenav-content>
197197
</mat-sidenav-container>
198198
`,
199+
standalone: true,
200+
imports: [MatSidenavModule],
199201
})
200202
class SidenavHarnessTest {}

0 commit comments

Comments
 (0)