Skip to content

Commit 57da495

Browse files
nitinmalavenitinmalave
committed
test(multiple): refactor unit tests of several components
1 parent 30cfd7d commit 57da495

File tree

7 files changed

+108
-102
lines changed

7 files changed

+108
-102
lines changed

‎src/material/sort/sort.spec.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -74,8 +74,8 @@ describe('MatSort', () => {
7474
}));
7575

7676
it('should use the column definition if used within a cdk table', () => {
77-
let cdkTableMatSortAppFixture = TestBed.createComponent(CdkTableMatSortApp);
78-
let cdkTableMatSortAppComponent = cdkTableMatSortAppFixture.componentInstance;
77+
const cdkTableMatSortAppFixture = TestBed.createComponent(CdkTableMatSortApp);
78+
const cdkTableMatSortAppComponent = cdkTableMatSortAppFixture.componentInstance;
7979

8080
cdkTableMatSortAppFixture.detectChanges();
8181
cdkTableMatSortAppFixture.detectChanges();
@@ -88,8 +88,8 @@ describe('MatSort', () => {
8888
});
8989

9090
it('should use the column definition if used within an mat table', () => {
91-
let matTableMatSortAppFixture = TestBed.createComponent(MatTableMatSortApp);
92-
let matTableMatSortAppComponent = matTableMatSortAppFixture.componentInstance;
91+
const matTableMatSortAppFixture = TestBed.createComponent(MatTableMatSortApp);
92+
const matTableMatSortAppComponent = matTableMatSortAppFixture.componentInstance;
9393

9494
matTableMatSortAppFixture.detectChanges();
9595
matTableMatSortAppFixture.detectChanges();
@@ -469,7 +469,7 @@ function testSingleColumnSortDirectionSequence(
469469
component.matSort.direction = '';
470470

471471
// Run through the sequence to confirm the order
472-
let actualSequence = expectedSequence.map(() => {
472+
const actualSequence = expectedSequence.map(() => {
473473
component.sort(id);
474474

475475
// Check that the sort event's active sort is consistent with the MatSort

‎src/material/stepper/stepper.spec.ts

Lines changed: 63 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -75,8 +75,9 @@ describe('MatStepper', () => {
7575
});
7676

7777
it('should default to the first step', () => {
78-
let stepperComponent = fixture.debugElement
78+
const stepperComponent: MatStepper = fixture.debugElement
7979
.query(By.css('mat-stepper'))!.componentInstance;
80+
8081
expect(stepperComponent.selectedIndex).toBe(0);
8182
});
8283

@@ -101,8 +102,9 @@ describe('MatStepper', () => {
101102
});
102103

103104
it('should change selected index on header click', () => {
104-
let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
105-
let stepperComponent =
105+
const stepHeaders =
106+
fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
107+
const stepperComponent =
106108
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
107109

108110
expect(stepperComponent.selectedIndex).toBe(0);
@@ -126,27 +128,27 @@ describe('MatStepper', () => {
126128
});
127129

128130
it('should set the "tablist" role on stepper', () => {
129-
let stepperEl = fixture.debugElement.query(By.css('mat-stepper'))!.nativeElement;
131+
const stepperEl = fixture.debugElement.query(By.css('mat-stepper'))!.nativeElement;
130132
expect(stepperEl.getAttribute('role')).toBe('tablist');
131133
});
132134

133135
it('should set aria-expanded of content correctly', () => {
134-
let stepContents = fixture.debugElement.queryAll(By.css(`.mat-vertical-stepper-content`));
135-
let stepperComponent =
136+
const stepContents = fixture.debugElement.queryAll(By.css(`.mat-vertical-stepper-content`));
137+
const stepperComponent =
136138
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
137-
let firstStepContentEl = stepContents[0].nativeElement;
139+
const firstStepContentEl = stepContents[0].nativeElement;
138140
expect(firstStepContentEl.getAttribute('aria-expanded')).toBe('true');
139141

140142
stepperComponent.selectedIndex = 1;
141143
fixture.detectChanges();
142144

143145
expect(firstStepContentEl.getAttribute('aria-expanded')).toBe('false');
144-
let secondStepContentEl = stepContents[1].nativeElement;
146+
const secondStepContentEl = stepContents[1].nativeElement;
145147
expect(secondStepContentEl.getAttribute('aria-expanded')).toBe('true');
146148
});
147149

148150
it('should display the correct label', () => {
149-
let stepperComponent =
151+
const stepperComponent =
150152
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
151153
let selectedLabel = fixture.nativeElement.querySelector('[aria-selected="true"]');
152154
expect(selectedLabel.textContent).toMatch('Step 1');
@@ -165,7 +167,7 @@ describe('MatStepper', () => {
165167
});
166168

167169
it('should go to next available step when the next button is clicked', () => {
168-
let stepperComponent =
170+
const stepperComponent =
169171
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
170172

171173
expect(stepperComponent.selectedIndex).toBe(0);
@@ -198,7 +200,7 @@ describe('MatStepper', () => {
198200
});
199201

200202
it('should go to previous available step when the previous button is clicked', () => {
201-
let stepperComponent =
203+
const stepperComponent =
202204
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
203205

204206
expect(stepperComponent.selectedIndex).toBe(0);
@@ -232,7 +234,7 @@ describe('MatStepper', () => {
232234
});
233235

234236
it('should set the correct step position for animation', () => {
235-
let stepperComponent =
237+
const stepperComponent =
236238
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
237239

238240
expect(stepperComponent._getAnimationDirection(0)).toBe('current');
@@ -255,10 +257,10 @@ describe('MatStepper', () => {
255257
});
256258

257259
it('should not set focus on header of selected step if header is not clicked', () => {
258-
let stepperComponent =
260+
const stepperComponent =
259261
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
260-
let stepHeaderEl = fixture.debugElement.queryAll(By.css('mat-step-header'))[1].nativeElement;
261-
let nextButtonNativeEl = fixture.debugElement
262+
const stepHeaderEl = fixture.debugElement.queryAll(By.css('mat-step-header'))[1].nativeElement;
263+
const nextButtonNativeEl = fixture.debugElement
262264
.queryAll(By.directive(MatStepperNext))[0].nativeElement;
263265
spyOn(stepHeaderEl, 'focus');
264266
nextButtonNativeEl.click();
@@ -269,10 +271,10 @@ describe('MatStepper', () => {
269271
});
270272

271273
it('should focus next step header if focus is inside the stepper', () => {
272-
let stepperComponent =
274+
const stepperComponent =
273275
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
274-
let stepHeaderEl = fixture.debugElement.queryAll(By.css('mat-step-header'))[1].nativeElement;
275-
let nextButtonNativeEl = fixture.debugElement
276+
const stepHeaderEl = fixture.debugElement.queryAll(By.css('mat-step-header'))[1].nativeElement;
277+
const nextButtonNativeEl = fixture.debugElement
276278
.queryAll(By.directive(MatStepperNext))[0].nativeElement;
277279
spyOn(stepHeaderEl, 'focus');
278280
nextButtonNativeEl.focus();
@@ -284,12 +286,12 @@ describe('MatStepper', () => {
284286
});
285287

286288
it('should only be able to return to a previous step if it is editable', () => {
287-
let stepperComponent =
289+
const stepperComponent =
288290
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
289291

290292
stepperComponent.selectedIndex = 1;
291293
stepperComponent.steps.toArray()[0].editable = false;
292-
let previousButtonNativeEl = fixture.debugElement
294+
const previousButtonNativeEl = fixture.debugElement
293295
.queryAll(By.directive(MatStepperPrevious))[1].nativeElement;
294296
previousButtonNativeEl.click();
295297
fixture.detectChanges();
@@ -304,9 +306,9 @@ describe('MatStepper', () => {
304306
});
305307

306308
it('should set create icon if step is editable and completed', () => {
307-
let stepperComponent =
309+
const stepperComponent =
308310
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
309-
let nextButtonNativeEl = fixture.debugElement
311+
const nextButtonNativeEl = fixture.debugElement
310312
.queryAll(By.directive(MatStepperNext))[0].nativeElement;
311313
expect(stepperComponent._getIndicatorType(0)).toBe('number');
312314
stepperComponent.steps.toArray()[0].editable = true;
@@ -317,9 +319,9 @@ describe('MatStepper', () => {
317319
});
318320

319321
it('should set done icon if step is not editable and is completed', () => {
320-
let stepperComponent =
322+
const stepperComponent =
321323
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
322-
let nextButtonNativeEl = fixture.debugElement
324+
const nextButtonNativeEl = fixture.debugElement
323325
.queryAll(By.directive(MatStepperNext))[0].nativeElement;
324326
expect(stepperComponent._getIndicatorType(0)).toBe('number');
325327
stepperComponent.steps.toArray()[0].editable = false;
@@ -330,11 +332,11 @@ describe('MatStepper', () => {
330332
});
331333

332334
it('should emit an event when the enter animation is done', fakeAsync(() => {
333-
let stepper = fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
334-
let selectionChangeSpy = jasmine.createSpy('selectionChange spy');
335-
let animationDoneSpy = jasmine.createSpy('animationDone spy');
336-
let selectionChangeSubscription = stepper.selectionChange.subscribe(selectionChangeSpy);
337-
let animationDoneSubscription = stepper.animationDone.subscribe(animationDoneSpy);
335+
const stepper = fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
336+
const selectionChangeSpy = jasmine.createSpy('selectionChange spy');
337+
const animationDoneSpy = jasmine.createSpy('animationDone spy');
338+
const selectionChangeSubscription = stepper.selectionChange.subscribe(selectionChangeSpy);
339+
const animationDoneSubscription = stepper.animationDone.subscribe(animationDoneSpy);
338340

339341
stepper.selectedIndex = 1;
340342
fixture.detectChanges();
@@ -495,7 +497,7 @@ describe('MatStepper', () => {
495497
});
496498

497499
it('should reverse animation in RTL mode', () => {
498-
let stepperComponent =
500+
const stepperComponent =
499501
fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
500502

501503
expect(stepperComponent._getAnimationDirection(0)).toBe('current');
@@ -543,15 +545,15 @@ describe('MatStepper', () => {
543545
expect(testComponent.oneGroup.invalid).toBe(true);
544546
expect(stepperComponent.selectedIndex).toBe(0);
545547

546-
let stepHeaderEl = fixture.debugElement
548+
const stepHeaderEl = fixture.debugElement
547549
.queryAll(By.css('.mat-vertical-stepper-header'))[1].nativeElement;
548550

549551
stepHeaderEl.click();
550552
fixture.detectChanges();
551553

552554
expect(stepperComponent.selectedIndex).toBe(0);
553555

554-
let nextButtonNativeEl = fixture.debugElement
556+
const nextButtonNativeEl = fixture.debugElement
555557
.queryAll(By.directive(MatStepperNext))[0].nativeElement;
556558
nextButtonNativeEl.click();
557559
fixture.detectChanges();
@@ -567,10 +569,10 @@ describe('MatStepper', () => {
567569
});
568570

569571
it('should not move to next step if current step is pending', () => {
570-
let stepHeaderEl = fixture.debugElement
572+
const stepHeaderEl = fixture.debugElement
571573
.queryAll(By.css('.mat-vertical-stepper-header'))[2].nativeElement;
572574

573-
let nextButtonNativeEl = fixture.debugElement
575+
const nextButtonNativeEl = fixture.debugElement
574576
.queryAll(By.directive(MatStepperNext))[1].nativeElement;
575577

576578
testComponent.oneGroup.get('oneCtrl')!.setValue('input');
@@ -616,7 +618,8 @@ describe('MatStepper', () => {
616618
});
617619

618620
it('should be able to focus step header upon click if it is unable to be selected', () => {
619-
let stepHeaderEl = fixture.debugElement.queryAll(By.css('mat-step-header'))[1].nativeElement;
621+
const stepHeaderEl =
622+
fixture.debugElement.queryAll(By.css('mat-step-header'))[1].nativeElement;
620623

621624
fixture.detectChanges();
622625

@@ -834,41 +837,42 @@ describe('MatStepper', () => {
834837

835838
describe('vertical stepper', () => {
836839
it('should be able to use the legacy classes in queries', () => {
837-
let fixture = createComponent(SimpleMatVerticalStepperApp);
840+
const fixture = createComponent(SimpleMatVerticalStepperApp);
838841
fixture.detectChanges();
842+
839843
expect(fixture.componentInstance.legacyTokenStepper).toBeTruthy();
840844
});
841845

842846
it('should set the aria-orientation to "vertical"', () => {
843-
let fixture = createComponent(SimpleMatVerticalStepperApp);
847+
const fixture = createComponent(SimpleMatVerticalStepperApp);
844848
fixture.detectChanges();
845849

846-
let stepperEl = fixture.debugElement.query(By.css('mat-stepper'))!.nativeElement;
850+
const stepperEl = fixture.debugElement.query(By.css('mat-stepper'))!.nativeElement;
847851
expect(stepperEl.getAttribute('aria-orientation')).toBe('vertical');
848852
});
849853

850854
it('should support using the left/right arrows to move focus', () => {
851-
let fixture = createComponent(SimpleMatVerticalStepperApp);
855+
const fixture = createComponent(SimpleMatVerticalStepperApp);
852856
fixture.detectChanges();
853857

854-
let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
858+
const stepHeaders = fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
855859
assertCorrectKeyboardInteraction(fixture, stepHeaders, 'horizontal');
856860
});
857861

858862
it('should support using the up/down arrows to move focus', () => {
859-
let fixture = createComponent(SimpleMatVerticalStepperApp);
863+
const fixture = createComponent(SimpleMatVerticalStepperApp);
860864
fixture.detectChanges();
861865

862-
let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
866+
const stepHeaders = fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
863867
assertCorrectKeyboardInteraction(fixture, stepHeaders, 'vertical');
864868
});
865869

866870
it('should reverse arrow key focus in RTL mode', () => {
867871
dir.value = 'rtl';
868-
let fixture = createComponent(SimpleMatVerticalStepperApp);
872+
const fixture = createComponent(SimpleMatVerticalStepperApp);
869873
fixture.detectChanges();
870874

871-
let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
875+
const stepHeaders = fixture.debugElement.queryAll(By.css('.mat-vertical-stepper-header'));
872876
assertArrowKeyInteractionInRtl(fixture, stepHeaders);
873877
});
874878

@@ -941,41 +945,42 @@ describe('MatStepper', () => {
941945

942946
describe('horizontal stepper', () => {
943947
it('should be able to use the legacy classes in queries', () => {
944-
let fixture = createComponent(SimpleMatHorizontalStepperApp);
948+
const fixture = createComponent(SimpleMatHorizontalStepperApp);
945949
fixture.detectChanges();
950+
946951
expect(fixture.componentInstance.legacyTokenStepper).toBeTruthy();
947952
});
948953

949954
it('should set the aria-orientation to "horizontal"', () => {
950-
let fixture = createComponent(SimpleMatHorizontalStepperApp);
955+
const fixture = createComponent(SimpleMatHorizontalStepperApp);
951956
fixture.detectChanges();
952957

953-
let stepperEl = fixture.debugElement.query(By.css('mat-stepper'))!.nativeElement;
958+
const stepperEl = fixture.debugElement.query(By.css('mat-stepper'))!.nativeElement;
954959
expect(stepperEl.getAttribute('aria-orientation')).toBe('horizontal');
955960
});
956961

957962
it('should support using the left/right arrows to move focus', () => {
958-
let fixture = createComponent(SimpleMatHorizontalStepperApp);
963+
const fixture = createComponent(SimpleMatHorizontalStepperApp);
959964
fixture.detectChanges();
960965

961-
let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-horizontal-stepper-header'));
966+
const stepHeaders = fixture.debugElement.queryAll(By.css('.mat-horizontal-stepper-header'));
962967
assertCorrectKeyboardInteraction(fixture, stepHeaders, 'horizontal');
963968
});
964969

965970
it('should reverse arrow key focus in RTL mode', () => {
966971
dir.value = 'rtl';
967-
let fixture = createComponent(SimpleMatHorizontalStepperApp);
972+
const fixture = createComponent(SimpleMatHorizontalStepperApp);
968973
fixture.detectChanges();
969974

970-
let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-horizontal-stepper-header'));
975+
const stepHeaders = fixture.debugElement.queryAll(By.css('.mat-horizontal-stepper-header'));
971976
assertArrowKeyInteractionInRtl(fixture, stepHeaders);
972977
});
973978

974979
it('should reverse arrow key focus when switching into RTL after init', () => {
975-
let fixture = createComponent(SimpleMatHorizontalStepperApp);
980+
const fixture = createComponent(SimpleMatHorizontalStepperApp);
976981
fixture.detectChanges();
977982

978-
let stepHeaders = fixture.debugElement.queryAll(By.css('.mat-horizontal-stepper-header'));
983+
const stepHeaders = fixture.debugElement.queryAll(By.css('.mat-horizontal-stepper-header'));
979984
assertCorrectKeyboardInteraction(fixture, stepHeaders, 'horizontal');
980985

981986
dir.value = 'rtl';
@@ -1246,7 +1251,7 @@ describe('MatStepper', () => {
12461251
});
12471252

12481253
it('should show done state when step is completed and its not the current step', () => {
1249-
let nextButtonNativeEl = fixture.debugElement
1254+
const nextButtonNativeEl = fixture.debugElement
12501255
.queryAll(By.directive(MatStepperNext))[0].nativeElement;
12511256

12521257
stepper.selectedIndex = 1;
@@ -1421,9 +1426,9 @@ describe('MatStepper', () => {
14211426
function assertCorrectKeyboardInteraction(fixture: ComponentFixture<any>,
14221427
stepHeaders: DebugElement[],
14231428
orientation: StepperOrientation) {
1424-
let stepperComponent = fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
1425-
let nextKey = orientation === 'vertical' ? DOWN_ARROW : RIGHT_ARROW;
1426-
let prevKey = orientation === 'vertical' ? UP_ARROW : LEFT_ARROW;
1429+
const stepperComponent = fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
1430+
const nextKey = orientation === 'vertical' ? DOWN_ARROW : RIGHT_ARROW;
1431+
const prevKey = orientation === 'vertical' ? UP_ARROW : LEFT_ARROW;
14271432

14281433
expect(stepperComponent._getFocusIndex()).toBe(0);
14291434
expect(stepperComponent.selectedIndex).toBe(0);
@@ -1492,7 +1497,7 @@ function assertCorrectKeyboardInteraction(fixture: ComponentFixture<any>,
14921497
/** Asserts that arrow key direction works correctly in RTL mode. */
14931498
function assertArrowKeyInteractionInRtl(fixture: ComponentFixture<any>,
14941499
stepHeaders: DebugElement[]) {
1495-
let stepperComponent = fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
1500+
const stepperComponent = fixture.debugElement.query(By.directive(MatStepper))!.componentInstance;
14961501

14971502
expect(stepperComponent._getFocusIndex()).toBe(0);
14981503

0 commit comments

Comments
 (0)