@@ -16,7 +16,14 @@ describe('MdSelect', () => {
16
16
beforeEach ( async ( ( ) => {
17
17
TestBed . configureTestingModule ( {
18
18
imports : [ MdSelectModule . forRoot ( ) , ReactiveFormsModule , FormsModule ] ,
19
- declarations : [ BasicSelect , NgModelSelect , ManySelects , NgIfSelect , SelectWithChangeEvent ] ,
19
+ declarations : [
20
+ BasicSelect ,
21
+ NgModelSelect ,
22
+ ManySelects ,
23
+ NgIfSelect ,
24
+ SelectInitWithoutOptions ,
25
+ SelectWithChangeEvent
26
+ ] ,
20
27
providers : [
21
28
{ provide : OverlayContainer , useFactory : ( ) => {
22
29
overlayContainerElement = document . createElement ( 'div' ) as HTMLElement ;
@@ -239,6 +246,27 @@ describe('MdSelect', () => {
239
246
240
247
} ) ;
241
248
249
+ it ( 'should select the proper option when the list of options is initialized at a later point' ,
250
+ async ( ( ) => {
251
+ let fixture = TestBed . createComponent ( SelectInitWithoutOptions ) ;
252
+ let instance = fixture . componentInstance ;
253
+
254
+ fixture . detectChanges ( ) ;
255
+
256
+ // Wait for the initial writeValue promise.
257
+ fixture . whenStable ( ) . then ( ( ) => {
258
+ expect ( instance . select . selected ) . toBeFalsy ( ) ;
259
+
260
+ instance . addOptions ( ) ;
261
+ fixture . detectChanges ( ) ;
262
+
263
+ // Wait for the next writeValue promise.
264
+ fixture . whenStable ( ) . then ( ( ) => {
265
+ expect ( instance . select . selected ) . toBe ( instance . options . toArray ( ) [ 1 ] ) ;
266
+ } ) ;
267
+ } ) ;
268
+ } ) ) ;
269
+
242
270
describe ( 'forms integration' , ( ) => {
243
271
let fixture : ComponentFixture < BasicSelect > ;
244
272
let trigger : HTMLElement ;
@@ -1267,7 +1295,6 @@ class ManySelects {}
1267
1295
</md-select>
1268
1296
</div>
1269
1297
` ,
1270
-
1271
1298
} )
1272
1299
class NgIfSelect {
1273
1300
isShowing = false ;
@@ -1304,6 +1331,32 @@ class SelectWithChangeEvent {
1304
1331
changeListener = jasmine . createSpy ( 'MdSelect change listener' ) ;
1305
1332
}
1306
1333
1334
+ @Component ( {
1335
+ selector : 'select-init-without-options' ,
1336
+ template : `
1337
+ <md-select placeholder="Food I want to eat right now" [formControl]="control">
1338
+ <md-option *ngFor="let food of foods" [value]="food.value">
1339
+ {{ food.viewValue }}
1340
+ </md-option>
1341
+ </md-select>
1342
+ `
1343
+ } )
1344
+ class SelectInitWithoutOptions {
1345
+ foods : any [ ] ;
1346
+ control = new FormControl ( 'pizza-1' ) ;
1347
+
1348
+ @ViewChild ( MdSelect ) select : MdSelect ;
1349
+ @ViewChildren ( MdOption ) options : QueryList < MdOption > ;
1350
+
1351
+ addOptions ( ) {
1352
+ this . foods = [
1353
+ { value : 'steak-0' , viewValue : 'Steak' } ,
1354
+ { value : 'pizza-1' , viewValue : 'Pizza' } ,
1355
+ { value : 'tacos-2' , viewValue : 'Tacos' }
1356
+ ] ;
1357
+ }
1358
+ }
1359
+
1307
1360
/**
1308
1361
* TODO: Move this to core testing utility until Angular has event faking
1309
1362
* support.
0 commit comments