1
- import {
2
- inject ,
3
- async ,
4
- TestComponentBuilder ,
5
- ComponentFixture ,
6
- TestBed ,
7
- } from '@angular/core/testing' ;
1
+ import { async , ComponentFixture , TestBed } from '@angular/core/testing' ;
8
2
import { By } from '@angular/platform-browser' ;
9
3
import { Component } from '@angular/core' ;
10
4
import { MdSlideToggle , MdSlideToggleChange , MdSlideToggleModule } from './slide-toggle' ;
11
5
import { FormsModule , NgControl } from '@angular/forms' ;
12
6
13
7
describe ( 'MdSlideToggle' , ( ) => {
14
- let builder : TestComponentBuilder ;
15
8
16
9
beforeEach ( async ( ( ) => {
17
10
TestBed . configureTestingModule ( {
@@ -22,12 +15,7 @@ describe('MdSlideToggle', () => {
22
15
TestBed . compileComponents ( ) ;
23
16
} ) ) ;
24
17
25
- beforeEach ( inject ( [ TestComponentBuilder ] , ( tcb : TestComponentBuilder ) => {
26
- builder = tcb ;
27
- } ) ) ;
28
-
29
18
describe ( 'basic behavior' , ( ) => {
30
-
31
19
let fixture : ComponentFixture < any > ;
32
20
33
21
let testComponent : SlideToggleTestApp ;
@@ -37,28 +25,27 @@ describe('MdSlideToggle', () => {
37
25
let labelElement : HTMLLabelElement ;
38
26
let inputElement : HTMLInputElement ;
39
27
28
+ // This initialization is async() because it needs to wait for ngModel to set the initial value.
40
29
beforeEach ( async ( ( ) => {
41
- builder . createAsync ( SlideToggleTestApp ) . then ( f => {
42
- fixture = f ;
30
+ fixture = TestBed . createComponent ( SlideToggleTestApp ) ;
43
31
44
- testComponent = fixture . debugElement . componentInstance ;
32
+ testComponent = fixture . debugElement . componentInstance ;
45
33
46
- // Enable jasmine spies on event functions, which may trigger at initialization
47
- // of the slide-toggle component.
48
- spyOn ( fixture . debugElement . componentInstance , 'onSlideChange' ) . and . callThrough ( ) ;
49
- spyOn ( fixture . debugElement . componentInstance , 'onSlideClick' ) . and . callThrough ( ) ;
34
+ // Enable jasmine spies on event functions, which may trigger at initialization
35
+ // of the slide-toggle component.
36
+ spyOn ( fixture . debugElement . componentInstance , 'onSlideChange' ) . and . callThrough ( ) ;
37
+ spyOn ( fixture . debugElement . componentInstance , 'onSlideClick' ) . and . callThrough ( ) ;
50
38
51
- // Initialize the slide-toggle component, by triggering the first change detection cycle.
52
- fixture . detectChanges ( ) ;
39
+ // Initialize the slide-toggle component, by triggering the first change detection cycle.
40
+ fixture . detectChanges ( ) ;
53
41
54
- let slideToggleDebug = fixture . debugElement . query ( By . css ( 'md-slide-toggle' ) ) ;
42
+ let slideToggleDebug = fixture . debugElement . query ( By . css ( 'md-slide-toggle' ) ) ;
55
43
56
- slideToggle = slideToggleDebug . componentInstance ;
57
- slideToggleElement = slideToggleDebug . nativeElement ;
58
- slideToggleControl = slideToggleDebug . injector . get ( NgControl ) ;
59
- inputElement = fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement ;
60
- labelElement = fixture . debugElement . query ( By . css ( 'label' ) ) . nativeElement ;
61
- } ) ;
44
+ slideToggle = slideToggleDebug . componentInstance ;
45
+ slideToggleElement = slideToggleDebug . nativeElement ;
46
+ slideToggleControl = slideToggleDebug . injector . get ( NgControl ) ;
47
+ inputElement = fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement ;
48
+ labelElement = fixture . debugElement . query ( By . css ( 'label' ) ) . nativeElement ;
62
49
} ) ) ;
63
50
64
51
// TODO(kara); update when core/testing adds fix
@@ -348,53 +335,14 @@ describe('MdSlideToggle', () => {
348
335
} ) ;
349
336
350
337
describe ( 'custom template' , ( ) => {
351
-
352
- let testComponent : SlideToggleTestApp ;
353
- let slideToggle : MdSlideToggle ;
354
- let slideToggleElement : HTMLElement ;
355
- let labelElement : HTMLLabelElement ;
356
- let inputElement : HTMLInputElement ;
357
-
358
338
it ( 'should not trigger the change event on initialization' , async ( ( ) => {
359
- builder
360
- . overrideTemplate ( SlideToggleTestApp , `
361
- <md-slide-toggle checked="true" (change)="onSlideChange($event)"></md-slide-toggle>
362
- ` )
363
- . createAsync ( SlideToggleTestApp )
364
- . then ( fixture => {
365
- // Initialize the variables for our test.
366
- initializeTest ( fixture ) ;
367
-
368
- // Enable jasmine spies on event functions, which may trigger at initialization
369
- // of the slide-toggle component.
370
- spyOn ( fixture . debugElement . componentInstance , 'onSlideChange' ) . and . callThrough ( ) ;
371
-
372
- fixture . detectChanges ( ) ;
373
-
374
- fixture . whenStable ( ) . then ( ( ) => {
375
- expect ( testComponent . onSlideChange ) . not . toHaveBeenCalled ( ) ;
376
- } ) ;
377
- } ) ;
378
- } ) ) ;
379
-
380
- /**
381
- * Initializes the suites variables, to allow developers to easily access the several variables
382
- * without loading / querying them always again.
383
- * @param fixture Custom fixture, which contains the slide-toggle component.
384
- */
385
- function initializeTest ( fixture : ComponentFixture < any > ) {
386
- testComponent = fixture . debugElement . componentInstance ;
387
-
388
- // Initialize the slide-toggle component, by triggering the first change detection cycle.
339
+ let fixture = TestBed . createComponent ( SlideToggleTestApp ) ;
340
+ fixture . componentInstance . slideModel = true ;
341
+ fixture . componentInstance . slideChecked = true ;
389
342
fixture . detectChanges ( ) ;
390
343
391
- let slideToggleDebug = fixture . debugElement . query ( By . css ( 'md-slide-toggle' ) ) ;
392
-
393
- slideToggle = slideToggleDebug . componentInstance ;
394
- slideToggleElement = slideToggleDebug . nativeElement ;
395
- inputElement = fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement ;
396
- labelElement = fixture . debugElement . query ( By . css ( 'label' ) ) . nativeElement ;
397
- }
344
+ expect ( fixture . componentInstance . lastEvent ) . toBeFalsy ( ) ;
345
+ } ) ) ;
398
346
} ) ;
399
347
400
348
} ) ;
@@ -419,8 +367,7 @@ function dispatchFocusChangeEvent(eventName: string, element: HTMLElement): void
419
367
(change)="onSlideChange($event)"
420
368
(click)="onSlideClick($event)">
421
369
<span>Test Slide Toggle</span>
422
- </md-slide-toggle>
423
- ` ,
370
+ </md-slide-toggle>` ,
424
371
} )
425
372
class SlideToggleTestApp {
426
373
isDisabled : boolean = false ;
0 commit comments