@@ -49,7 +49,8 @@ describe('MdInputContainer', function () {
49
49
MdInputContainerMissingMdInputTestController ,
50
50
MdInputContainerMultipleHintTestController ,
51
51
MdInputContainerMultipleHintMixedTestController ,
52
- MdInputContainerWithDynamicPlaceholder
52
+ MdInputContainerWithDynamicPlaceholder ,
53
+ MdInputContainerWithPrefixAndSuffix
53
54
] ,
54
55
} ) ;
55
56
@@ -550,6 +551,29 @@ describe('MdInputContainer', function () {
550
551
expect ( labelEl . classList ) . not . toContain ( 'mat-float' ) ;
551
552
} ) ;
552
553
554
+ it ( 'should not have prefix and suffix elements when none are specified' , ( ) => {
555
+ let fixture = TestBed . createComponent ( MdInputContainerWithId ) ;
556
+ fixture . detectChanges ( ) ;
557
+
558
+ let prefixEl = fixture . debugElement . query ( By . css ( '.mat-input-prefix' ) ) ;
559
+ let suffixEl = fixture . debugElement . query ( By . css ( '.mat-input-suffix' ) ) ;
560
+
561
+ expect ( prefixEl ) . toBeNull ( ) ;
562
+ expect ( suffixEl ) . toBeNull ( ) ;
563
+ } ) ;
564
+
565
+ it ( 'should add prefix and suffix elements when specified' , ( ) => {
566
+ let fixture = TestBed . createComponent ( MdInputContainerWithPrefixAndSuffix ) ;
567
+ fixture . detectChanges ( ) ;
568
+
569
+ let prefixEl = fixture . debugElement . query ( By . css ( '.mat-input-prefix' ) ) ;
570
+ let suffixEl = fixture . debugElement . query ( By . css ( '.mat-input-suffix' ) ) ;
571
+
572
+ expect ( prefixEl ) . not . toBeNull ( ) ;
573
+ expect ( suffixEl ) . not . toBeNull ( ) ;
574
+ expect ( prefixEl . nativeElement . innerText . trim ( ) ) . toEqual ( 'Prefix' ) ;
575
+ expect ( suffixEl . nativeElement . innerText . trim ( ) ) . toEqual ( 'Suffix' ) ;
576
+ } ) ;
553
577
} ) ;
554
578
555
579
@Component ( {
@@ -775,6 +799,17 @@ class MdTextareaWithBindings {
775
799
} )
776
800
class MdInputContainerMissingMdInputTestController { }
777
801
802
+ @Component ( {
803
+ template : `
804
+ <md-input-container>
805
+ <div mdPrefix>Prefix</div>
806
+ <input mdInput>
807
+ <div mdSuffix>Suffix</div>
808
+ </md-input-container>
809
+ `
810
+ } )
811
+ class MdInputContainerWithPrefixAndSuffix { }
812
+
778
813
/**
779
814
* Gets a RegExp used to detect an angular wrapped error message.
780
815
* See https://github.com/angular/angular/issues/8348
0 commit comments