@@ -24,6 +24,7 @@ describe('MdRipple', () => {
24
24
declarations : [
25
25
BasicRippleContainer ,
26
26
RippleContainerWithInputBindings ,
27
+ RippleContainerWithoutBindings ,
27
28
RippleContainerWithNgIf ,
28
29
] ,
29
30
} ) ;
@@ -351,23 +352,38 @@ describe('MdRipple', () => {
351
352
describe ( 'global ripple options' , ( ) => {
352
353
let rippleDirective : MdRipple ;
353
354
354
- function createTestComponent ( rippleConfig : RippleGlobalOptions ) {
355
+ function createTestComponent ( rippleConfig : RippleGlobalOptions ,
356
+ testComponent : any = BasicRippleContainer ) {
355
357
// Reset the previously configured testing module to be able set new providers.
356
358
// The testing module has been initialized in the root describe group for the ripples.
357
359
TestBed . resetTestingModule ( ) ;
358
360
TestBed . configureTestingModule ( {
359
361
imports : [ MdRippleModule ] ,
360
- declarations : [ BasicRippleContainer ] ,
362
+ declarations : [ testComponent ] ,
361
363
providers : [ { provide : MD_RIPPLE_GLOBAL_OPTIONS , useValue : rippleConfig } ]
362
364
} ) ;
363
365
364
- fixture = TestBed . createComponent ( BasicRippleContainer ) ;
366
+ fixture = TestBed . createComponent ( testComponent ) ;
365
367
fixture . detectChanges ( ) ;
366
368
367
369
rippleTarget = fixture . nativeElement . querySelector ( '[mat-ripple]' ) ;
368
370
rippleDirective = fixture . componentInstance . ripple ;
369
371
}
370
372
373
+ it ( 'should work without having any binding set' , ( ) => {
374
+ createTestComponent ( { disabled : true } , RippleContainerWithoutBindings ) ;
375
+
376
+ dispatchMouseEvent ( rippleTarget , 'mousedown' ) ;
377
+ dispatchMouseEvent ( rippleTarget , 'mouseup' ) ;
378
+
379
+ expect ( rippleTarget . querySelectorAll ( '.mat-ripple-element' ) . length ) . toBe ( 0 ) ;
380
+
381
+ dispatchMouseEvent ( rippleTarget , 'mousedown' ) ;
382
+ dispatchMouseEvent ( rippleTarget , 'mouseup' ) ;
383
+
384
+ expect ( rippleTarget . querySelectorAll ( '.mat-ripple-element' ) . length ) . toBe ( 0 ) ;
385
+ } ) ;
386
+
371
387
it ( 'when disabled should not show any ripples on mousedown' , ( ) => {
372
388
createTestComponent ( { disabled : true } ) ;
373
389
@@ -577,6 +593,11 @@ class RippleContainerWithInputBindings {
577
593
@ViewChild ( MdRipple ) ripple : MdRipple ;
578
594
}
579
595
596
+ @Component ( {
597
+ template : `<div id="container" #ripple="mdRipple" mat-ripple></div>` ,
598
+ } )
599
+ class RippleContainerWithoutBindings { }
600
+
580
601
@Component ( { template : `<div id="container" mat-ripple [mdRippleSpeedFactor]="0"
581
602
*ngIf="!isDestroyed"></div>` } )
582
603
class RippleContainerWithNgIf {
0 commit comments