File tree Expand file tree Collapse file tree 3 files changed +48
-1
lines changed
material-experimental/mdc-select Expand file tree Collapse file tree 3 files changed +48
-1
lines changed Original file line number Diff line number Diff line change @@ -3742,6 +3742,30 @@ describe('MDC-based MatSelect', () => {
3742
3742
} ) . not . toThrow ( ) ;
3743
3743
} ) ) ;
3744
3744
3745
+ it ( 'should update the option selected state if the same array is mutated and passed back in' ,
3746
+ fakeAsync ( ( ) => {
3747
+ const value : string [ ] = [ ] ;
3748
+ trigger . click ( ) ;
3749
+ testInstance . control . setValue ( value ) ;
3750
+ fixture . detectChanges ( ) ;
3751
+
3752
+ const optionNodes =
3753
+ Array . from < HTMLElement > ( overlayContainerElement . querySelectorAll ( 'mat-option' ) ) ;
3754
+ const optionInstances = testInstance . options . toArray ( ) ;
3755
+
3756
+ expect ( optionNodes . some ( option => {
3757
+ return option . classList . contains ( 'mdc-list-item--selected' ) ;
3758
+ } ) ) . toBe ( false ) ;
3759
+ expect ( optionInstances . some ( option => option . selected ) ) . toBe ( false ) ;
3760
+
3761
+ value . push ( 'eggs-5' ) ;
3762
+ testInstance . control . setValue ( value ) ;
3763
+ fixture . detectChanges ( ) ;
3764
+
3765
+ expect ( optionNodes [ 5 ] . classList ) . toContain ( 'mdc-list-item--selected' ) ;
3766
+ expect ( optionInstances [ 5 ] . selected ) . toBe ( true ) ;
3767
+ } ) ) ;
3768
+
3745
3769
} ) ;
3746
3770
3747
3771
it ( 'should be able to provide default values through an injection token' , fakeAsync ( ( ) => {
Original file line number Diff line number Diff line change @@ -4621,6 +4621,28 @@ describe('MatSelect', () => {
4621
4621
} ) . not . toThrow ( ) ;
4622
4622
} ) ) ;
4623
4623
4624
+ it ( 'should update the option selected state if the same array is mutated and passed back in' ,
4625
+ fakeAsync ( ( ) => {
4626
+ const value : string [ ] = [ ] ;
4627
+ trigger . click ( ) ;
4628
+ testInstance . control . setValue ( value ) ;
4629
+ fixture . detectChanges ( ) ;
4630
+
4631
+ const optionNodes =
4632
+ Array . from < HTMLElement > ( overlayContainerElement . querySelectorAll ( 'mat-option' ) ) ;
4633
+ const optionInstances = testInstance . options . toArray ( ) ;
4634
+
4635
+ expect ( optionNodes . some ( option => option . classList . contains ( 'mat-selected' ) ) ) . toBe ( false ) ;
4636
+ expect ( optionInstances . some ( option => option . selected ) ) . toBe ( false ) ;
4637
+
4638
+ value . push ( 'eggs-5' ) ;
4639
+ testInstance . control . setValue ( value ) ;
4640
+ fixture . detectChanges ( ) ;
4641
+
4642
+ expect ( optionNodes [ 5 ] . classList ) . toContain ( 'mat-selected' ) ;
4643
+ expect ( optionInstances [ 5 ] . selected ) . toBe ( true ) ;
4644
+ } ) ) ;
4645
+
4624
4646
} ) ;
4625
4647
4626
4648
it ( 'should be able to provide default values through an injection token' , fakeAsync ( ( ) => {
Original file line number Diff line number Diff line change @@ -402,7 +402,8 @@ export abstract class _MatSelectBase<C> extends _MatSelectMixinBase implements A
402
402
@Input ( )
403
403
get value ( ) : any { return this . _value ; }
404
404
set value ( newValue : any ) {
405
- if ( newValue !== this . _value ) {
405
+ // Always re-assign an array, because it might have been mutated.
406
+ if ( newValue !== this . _value || ( this . _multiple && Array . isArray ( newValue ) ) ) {
406
407
if ( this . options ) {
407
408
this . _setSelectionByValue ( newValue ) ;
408
409
}
You can’t perform that action at this time.
0 commit comments