I'm trying to assert the contents of a material dialog in an integration test. I basically want to start with a component, click a button that calls MatDialog.open, and then assert that the dialog is displaying the right data. I can currently see that one dialog has been opened via the MatDialogHarness, but I cannot figure out how to, for example, count the amount of elements with a certain class.
Here's my current code:
describe('Members dialog', function testOpenMembers() {
it('should open', async function shouldOpenMembersDialog() {
const testUser: Partial<User> = {uid: '1', displayName: 'inline user name', email: '[email protected]'};
(authService.user$ as Subject<User>).next(testUser as User);
addTestActivity(mockStore, (activity) => {
activity.confirmedTimes.ctid1.userDefaults = { 1: {status: 1, displayName: 'test name'} }, {uid: '1', displayName: 'inline user name'};
activity.confirmedTimes.ctid1.admins.push({email: '[email protected]'});
});
const fixture = TestBed.createComponent(UpcomingSessionsComponent);
fixture.detectChanges(false);
const membersChip = fixture.debugElement.query(By.css('#members-chip'));
membersChip.triggerEventHandler('click', membersChip.nativeElement);
const loader = TestbedHarnessEnvironment.documentRootLoader(fixture);
const dialogs = await loader.getAllHarnesses(MatDialogHarness);
expect(dialogs.length).toBe(1);
});
});
The expect at the bottom is working, so I know it's creating a dialog. But how do I test the dialog to make sure it's displaying the right thing?