Skip to content

test(multiple): switch to non-deprecated test assertion context API #23326

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 9, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
53 changes: 29 additions & 24 deletions src/cdk-experimental/dialog/dialog.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -209,8 +209,8 @@ describe('Dialog', () => {

// beforeClose should emit before dialog container is destroyed
const beforeCloseHandler = jasmine.createSpy('beforeClose callback').and.callFake(() => {
expect(overlayContainerElement.querySelector('cdk-dialog-container'))
.not.toBeNull('dialog container exists when beforeClose is called');
expect(overlayContainerElement.querySelector('cdk-dialog-container')).not
.withContext('dialog container exists when beforeClose is called').toBeNull();
});

dialogRef.beforeClosed().subscribe(beforeCloseHandler);
Expand Down Expand Up @@ -261,15 +261,15 @@ describe('Dialog', () => {
flushMicrotasks();

expect(overlayContainerElement.querySelectorAll('cdk-dialog-container').length)
.toBe(1, 'Expected one open dialog.');
.withContext('Expected one open dialog.').toBe(1);

dialogRef.close();
flushMicrotasks();
onPushFixture.detectChanges();
tick(500);

expect(overlayContainerElement.querySelectorAll('cdk-dialog-container').length)
.toBe(0, 'Expected no open dialogs.');
.withContext('Expected no open dialogs.').toBe(0);
}));

it('should close when clicking on the overlay backdrop', fakeAsync(() => {
Expand Down Expand Up @@ -403,8 +403,8 @@ describe('Dialog', () => {

let overlayPane = overlayContainerElement.querySelector('.cdk-overlay-pane') as HTMLElement;

expect(overlayPane.style.maxWidth).toBe('80vw',
'Expected dialog to set a default max-width on overlay pane');
expect(overlayPane.style.maxWidth)
.withContext('Expected dialog to set a default max-width on overlay pane').toBe('80vw');

dialogRef.close();

Expand Down Expand Up @@ -716,7 +716,8 @@ describe('Dialog', () => {
viewContainerFixture.detectChanges();
flush();

expect(dialogRef.componentInstance).toBeFalsy('Expected reference to have been cleared.');
expect(dialogRef.componentInstance)
.withContext('Expected reference to have been cleared.').toBeFalsy();
}));

it('should assign a unique id to each dialog', () => {
Expand Down Expand Up @@ -892,7 +893,8 @@ describe('Dialog', () => {
flushMicrotasks();

expect(document.activeElement!.tagName)
.toBe('INPUT', 'Expected first tabbable element (input) in the dialog to be focused.');
.withContext('Expected first tabbable element (input) in the dialog to be focused.')
.toBe('INPUT');
}));

it('should focus the dialog element on open', fakeAsync(() => {
Expand All @@ -907,7 +909,8 @@ describe('Dialog', () => {
let container =
overlayContainerElement.querySelector('cdk-dialog-container') as HTMLInputElement;

expect(document.activeElement).toBe(container, 'Expected container to be focused on open');
expect(document.activeElement)
.withContext('Expected container to be focused on open').toBe(container);
}));

it('should focus the first header element on open', fakeAsync(() => {
Expand All @@ -923,7 +926,7 @@ describe('Dialog', () => {
overlayContainerElement.querySelector('h1[tabindex="-1"]') as HTMLInputElement;

expect(document.activeElement)
.toBe(firstHeader, 'Expected first header to be focused on open');
.withContext('Expected first header to be focused on open').toBe(firstHeader);
}));

it('should focus the first element that matches the css selector from autoFocus on open',
Expand All @@ -940,7 +943,7 @@ describe('Dialog', () => {
overlayContainerElement.querySelector('p[tabindex="-1"]') as HTMLInputElement;

expect(document.activeElement)
.toBe(firstParagraph, 'Expected first paragraph to be focused on open');
.withContext('Expected first paragraph to be focused on open').toBe(firstParagraph);
}));

it('should re-focus trigger element when dialog closes', fakeAsync(() => {
Expand Down Expand Up @@ -968,8 +971,9 @@ describe('Dialog', () => {
viewContainerFixture.detectChanges();
flush();

expect(document.activeElement!.id).toBe('dialog-trigger',
'Expected that the trigger was refocused after the dialog is closed.');
expect(document.activeElement!.id)
.withContext('Expected that the trigger was refocused after the dialog is closed.')
.toBe('dialog-trigger');

document.body.removeChild(button);
}));
Expand Down Expand Up @@ -1027,14 +1031,14 @@ describe('Dialog', () => {
otherButton.focus();

expect(document.activeElement!.id)
.toBe('other-button', 'Expected focus to be on the alternate button.');
.withContext('Expected focus to be on the alternate button.').toBe('other-button');

flushMicrotasks();
viewContainerFixture.detectChanges();
flush();

expect(document.activeElement!.id)
.toBe('other-button', 'Expected focus to stay on the alternate button.');
.withContext('Expected focus to stay on the alternate button.').toBe('other-button');

body.removeChild(button);
body.removeChild(otherButton);
Expand Down Expand Up @@ -1065,8 +1069,9 @@ describe('Dialog', () => {
viewContainerFixture.detectChanges();
flushMicrotasks();

expect(document.activeElement!.id).toBe('input-to-be-focused',
'Expected that the trigger was refocused after the dialog is closed.');
expect(document.activeElement!.id)
.withContext('Expected that the trigger was refocused after the dialog is closed.')
.toBe('input-to-be-focused');

document.body.removeChild(button);
document.body.removeChild(input);
Expand All @@ -1081,7 +1086,7 @@ describe('Dialog', () => {
flushMicrotasks();

expect(document.activeElement!.tagName.toLowerCase())
.toBe('cdk-dialog-container', 'Expected dialog container to be focused.');
.withContext('Expected dialog container to be focused.').toBe('cdk-dialog-container');
}));

});
Expand Down Expand Up @@ -1154,14 +1159,14 @@ describe('Dialog with a parent Dialog', () => {
flush();

expect(overlayContainerElement.textContent)
.toContain('Pizza', 'Expected a dialog to be opened');
.withContext('Expected a dialog to be opened').toContain('Pizza');

childDialog.closeAll();
fixture.detectChanges();
flush();

expect(overlayContainerElement.textContent!.trim())
.toBe('', 'Expected closeAll on child Dialog to close dialog opened by parent');
.withContext('Expected closeAll on child Dialog to close dialog opened by parent').toBe('');
}));

it('should close dialogs opened by a child when calling closeAll on a parent Dialog',
Expand All @@ -1170,14 +1175,14 @@ describe('Dialog with a parent Dialog', () => {
fixture.detectChanges();

expect(overlayContainerElement.textContent)
.toContain('Pizza', 'Expected a dialog to be opened');
.withContext('Expected a dialog to be opened').toContain('Pizza');

parentDialog.closeAll();
fixture.detectChanges();
flush();

expect(overlayContainerElement.textContent!.trim())
.toBe('', 'Expected closeAll on parent Dialog to close dialog opened by child');
.withContext('Expected closeAll on parent Dialog to close dialog opened by child').toBe('');
}));

it('should not close the parent dialogs, when a child is destroyed', fakeAsync(() => {
Expand All @@ -1186,14 +1191,14 @@ describe('Dialog with a parent Dialog', () => {
flush();

expect(overlayContainerElement.textContent)
.toContain('Pizza', 'Expected a dialog to be opened');
.withContext('Expected a dialog to be opened').toContain('Pizza');

childDialog.ngOnDestroy();
fixture.detectChanges();
flush();

expect(overlayContainerElement.textContent)
.toContain('Pizza', 'Expected a dialog to remain opened');
.withContext('Expected a dialog to remain opened').toContain('Pizza');
}));

it('should close the top dialog via the escape key', fakeAsync(() => {
Expand Down
16 changes: 8 additions & 8 deletions src/cdk-experimental/listbox/listbox.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -620,23 +620,23 @@ describe('CdkOption and CdkListbox', () => {

it('should be able to set the disabled state via setDisabledState', () => {
expect(listboxInstance.disabled)
.toBe(false, 'Expected the selection list to be enabled.');
.withContext('Expected the selection list to be enabled.').toBe(false);
expect(optionInstances.every(option => !option.disabled))
.toBe(true, 'Expected every list option to be enabled.');
.withContext('Expected every list option to be enabled.').toBe(true);

listboxInstance.setDisabledState(true);
fixture.detectChanges();

expect(listboxInstance.disabled)
.toBe(true, 'Expected the selection list to be disabled.');
.withContext('Expected the selection list to be disabled.').toBe(true);
for (const option of optionElements) {
expect(option.getAttribute('aria-disabled')).toBe('true');
}
});

it('should be able to select options via writeValue', () => {
expect(optionInstances.every(option => !option.disabled))
.toBe(true, 'Expected every list option to be enabled.');
.withContext('Expected every list option to be enabled.').toBe(true);

listboxInstance.writeValue('arc');
fixture.detectChanges();
Expand All @@ -651,7 +651,7 @@ describe('CdkOption and CdkListbox', () => {

it('should be select multiple options by their values', () => {
expect(optionInstances.every(option => !option.disabled))
.toBe(true, 'Expected every list option to be enabled.');
.withContext('Expected every list option to be enabled.').toBe(true);

testComponent.isMultiselectable = true;
fixture.detectChanges();
Expand All @@ -676,7 +676,7 @@ describe('CdkOption and CdkListbox', () => {
it('should be able to disable options from the control', () => {
expect(testComponent.listbox.disabled).toBeFalse();
expect(optionInstances.every(option => !option.disabled))
.toBe(true, 'Expected every list option to be enabled.');
.withContext('Expected every list option to be enabled.').toBe(true);

testComponent.form.disable();
fixture.detectChanges();
Expand All @@ -690,7 +690,7 @@ describe('CdkOption and CdkListbox', () => {
it('should be able to toggle disabled state after form control is disabled', () => {
expect(testComponent.listbox.disabled).toBeFalse();
expect(optionInstances.every(option => !option.disabled))
.toBe(true, 'Expected every list option to be enabled.');
.withContext('Expected every list option to be enabled.').toBe(true);

testComponent.form.disable();
fixture.detectChanges();
Expand All @@ -705,7 +705,7 @@ describe('CdkOption and CdkListbox', () => {

expect(testComponent.listbox.disabled).toBeFalse();
expect(optionInstances.every(option => !option.disabled))
.toBe(true, 'Expected every list option to be enabled.');
.withContext('Expected every list option to be enabled.').toBe(true);
});

it('should be able to select options via setting the value in form control', () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ describe('CdkVirtualScrollViewport', () => {
const contentWrapper =
viewport.elementRef.nativeElement.querySelector('.cdk-virtual-scroll-content-wrapper')!;
expect(contentWrapper.children.length)
.toBe(4, 'should render 4 50px items to fill 200px space');
.withContext('should render 4 50px items to fill 200px space').toBe(4);
}));

it('should render extra content if first item is smaller than average', fakeAsync(() => {
Expand All @@ -38,8 +38,9 @@ describe('CdkVirtualScrollViewport', () => {

const contentWrapper =
viewport.elementRef.nativeElement.querySelector('.cdk-virtual-scroll-content-wrapper')!;
expect(contentWrapper.children.length).toBe(4,
'should render 4 items to fill 200px space based on 50px estimate from first item');
expect(contentWrapper.children.length)
.withContext('should render 4 items to fill 200px space based on 50px ' +
'estimate from first item').toBe(4);
}));

it('should throw if maxBufferPx is less than minBufferPx', fakeAsync(() => {
Expand Down
34 changes: 21 additions & 13 deletions src/cdk/a11y/aria-describer/aria-describer.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -128,38 +128,44 @@ describe('AriaDescriber', () => {
const descriptionNode = fixture.nativeElement.querySelector('#description-with-existing-id');

expect(document.body.contains(descriptionNode))
.toBe(true, 'Expected node to be inside the document to begin with.');
expect(getMessagesContainer()).toBeNull('Expected no messages container on init.');
.withContext('Expected node to be inside the document to begin with.')
.toBe(true);
expect(getMessagesContainer())
.withContext('Expected no messages container on init.').toBeNull();

ariaDescriber.describe(component.element1, descriptionNode);

expectMessage(component.element1, 'Hello');
expect(getMessagesContainer())
.toBeNull('Expected no messages container after the element was described.');
.withContext('Expected no messages container after the element was described.')
.toBeNull();

ariaDescriber.removeDescription(component.element1, descriptionNode);

expect(document.body.contains(descriptionNode)).toBe(true,
'Expected description node to still be in the DOM after it is no longer being used.');
expect(document.body.contains(descriptionNode))
.withContext('Expected description node to still be in the DOM after it is' +
'no longer being used.').toBe(true);
});

it('should keep nodes set as descriptions inside their original position in the DOM', () => {
createFixture();
const descriptionNode = fixture.nativeElement.querySelector('#description-with-existing-id');
const initialParent = descriptionNode.parentNode;

expect(initialParent).toBeTruthy('Expected node to have a parent initially.');
expect(initialParent).withContext('Expected node to have a parent initially.').toBeTruthy();

ariaDescriber.describe(component.element1, descriptionNode);

expectMessage(component.element1, 'Hello');
expect(descriptionNode.parentNode).toBe(initialParent,
'Expected node to stay inside the same parent when used as a description.');
expect(descriptionNode.parentNode)
.withContext('Expected node to stay inside the same parent when used as a description.')
.toBe(initialParent);

ariaDescriber.removeDescription(component.element1, descriptionNode);

expect(descriptionNode.parentNode).toBe(initialParent,
'Expected node to stay inside the same parent after not being used as a description.');
expect(descriptionNode.parentNode)
.withContext('Expected node to stay inside the same parent after not ' +
'being used as a description.').toBe(initialParent);
});

it('should be able to unregister messages while having others registered', () => {
Expand Down Expand Up @@ -247,7 +253,8 @@ describe('AriaDescriber', () => {
const descriptionNode = fixture.nativeElement.querySelector('#description-with-existing-id');

expect(document.body.contains(descriptionNode))
.toBe(true, 'Expected node to be inside the document to begin with.');
.withContext('Expected node to be inside the document to begin with.')
.toBe(true);

ariaDescriber.describe(component.element1, descriptionNode);

Expand All @@ -257,8 +264,9 @@ describe('AriaDescriber', () => {
ariaDescriber.ngOnDestroy();

expect(component.element1.hasAttribute(CDK_DESCRIBEDBY_HOST_ATTRIBUTE)).toBe(false);
expect(document.body.contains(descriptionNode)).toBe(true,
'Expected description node to still be in the DOM after it is no longer being used.');
expect(document.body.contains(descriptionNode))
.withContext('Expected description node to still be in the DOM after ' +
'it is no longer being used.').toBe(true);
});

it('should remove the aria-describedby attribute if there are no more messages', () => {
Expand Down
Loading