Angular Test harness not setting ngModel variable in MatSelect

Using MatSelect and working on UTs. Post selecting a option via test harness, not able to see ngModel variable binding working.

Here is the html snippet:

<mat-form-field class="dropdown-container">
<mat-label>Select issue type</mat-label>
<mat-select [(ngModel)]="selectedIssueType" (ngModelChange)="filterIssueType()" id="issuetype-filter">
<mat-option
*ngFor="let issueLinkUnique of issueTypeList"
value={{issueLinkUnique}}>
{{issueLinkUnique}}
</mat-option>
</mat-select>
</mat-form-field>


Here is the unit test case:

it('dummy test', async () => {
serviceSpy.and.returnValue(of(rtConsolidatedLinkedIssesTableData)); // mocking data
component.ngOnInit(); // initialization data
const issueTypeFilter = await loader.getHarness<MatSelectHarness>(MatSelectHarness.with({
selector: '#issuetype-filter'}));
await issueTypeFilter.open();
expect((await issueTypeFilter.getOptions()).length).toBe(2); // correct
const blockedOption = await issueTypeFilter.getOptions({text: 'Blocked'});
await blockedOption[0].click();
expect(await blockedOption[0].isSelected()).toBe(true); // correct
fixture.whenStable();
expect(component.selectedIssueType).toBe('Block'); // it's having default value

});

Continue reading...