Skip to content

Commit f2ad219

Browse files
asynclizcopybara-github
asyncliz
authored and
copybara-github
committed
test(chip): refactor tests
PiperOrigin-RevId: 540945103
1 parent 47614f3 commit f2ad219

File tree

3 files changed

+189
-133
lines changed

3 files changed

+189
-133
lines changed

‎chips/filter-chip_test.ts‎

Lines changed: 0 additions & 133 deletions
Original file line numberDiff line numberDiff line change
@@ -6,145 +6,12 @@
66

77
// import 'jasmine'; (google3-only)
88

9-
import {html} from 'lit';
10-
11-
import {Environment} from '../testing/environment.js';
129
import {createTokenTests} from '../testing/tokens.js';
1310

1411
import {MdFilterChip} from './filter-chip.js';
15-
import {ChipHarness} from './harness.js';
1612

1713
describe('<md-filter-chip>', () => {
1814
describe('.styles', () => {
1915
createTokenTests(MdFilterChip.styles);
2016
});
21-
22-
const env = new Environment();
23-
24-
async function setupTest() {
25-
const chip = new MdFilterChip();
26-
env.render(html`${chip}`);
27-
await env.waitForStability();
28-
return {chip, harness: new ChipHarness(chip)};
29-
}
30-
31-
describe('selection', () => {
32-
it('should select on click', async () => {
33-
const {chip, harness} = await setupTest();
34-
35-
await harness.clickWithMouse();
36-
expect(chip.selected).withContext('chip.selected').toBeTrue();
37-
});
38-
39-
it('should deselect on click', async () => {
40-
const {chip, harness} = await setupTest();
41-
chip.selected = true;
42-
43-
await harness.clickWithMouse();
44-
expect(chip.selected).withContext('chip.selected').toBeFalse();
45-
});
46-
47-
it('should not select on click when disabled', async () => {
48-
const {chip, harness} = await setupTest();
49-
chip.disabled = true;
50-
51-
await harness.clickWithMouse();
52-
expect(chip.selected).withContext('chip.selected').toBeFalse();
53-
});
54-
55-
it('should dispatch "selected" event when selected changes programmatically',
56-
async () => {
57-
const {chip} = await setupTest();
58-
const handler = jasmine.createSpy();
59-
chip.addEventListener('selected', handler);
60-
61-
chip.selected = true;
62-
await env.waitForStability();
63-
chip.selected = false;
64-
await env.waitForStability();
65-
expect(handler).toHaveBeenCalledTimes(2);
66-
});
67-
68-
it('should dispatch "selected" event when selected changes by click',
69-
async () => {
70-
const {chip, harness} = await setupTest();
71-
const handler = jasmine.createSpy();
72-
chip.addEventListener('selected', handler);
73-
74-
await harness.clickWithMouse();
75-
await harness.clickWithMouse();
76-
expect(handler).toHaveBeenCalledTimes(2);
77-
});
78-
});
79-
80-
describe('removable', () => {
81-
it('should remove chip from DOM when remove button clicked', async () => {
82-
const {chip, harness} = await setupTest();
83-
chip.removable = true;
84-
await env.waitForStability();
85-
86-
expect(chip.parentElement)
87-
.withContext('chip should be attached before removing')
88-
.not.toBeNull();
89-
harness.action = 'trailing';
90-
await harness.clickWithMouse();
91-
expect(chip.parentElement)
92-
.withContext('chip should be detached after removing')
93-
.toBeNull();
94-
});
95-
96-
it('should dispatch a "remove" event when removed', async () => {
97-
const {chip, harness} = await setupTest();
98-
chip.removable = true;
99-
await env.waitForStability();
100-
const handler = jasmine.createSpy();
101-
chip.addEventListener('remove', handler);
102-
103-
harness.action = 'trailing';
104-
await harness.clickWithMouse();
105-
expect(handler).toHaveBeenCalledTimes(1);
106-
});
107-
108-
it('should not remove chip if "remove" event is default prevented',
109-
async () => {
110-
const {chip, harness} = await setupTest();
111-
chip.removable = true;
112-
await env.waitForStability();
113-
chip.addEventListener('remove', event => {
114-
event.preventDefault();
115-
});
116-
117-
harness.action = 'trailing';
118-
await harness.clickWithMouse();
119-
expect(chip.parentElement)
120-
.withContext('chip should still be attached')
121-
.not.toBeNull();
122-
});
123-
124-
it('should provide a default "ariaLabelRemove" value', async () => {
125-
const {chip} = await setupTest();
126-
chip.label = 'Label';
127-
128-
expect(chip.ariaLabelRemove).toEqual(`Remove ${chip.label}`);
129-
});
130-
131-
it('should provide a default "ariaLabelRemove" when "ariaLabel" is provided',
132-
async () => {
133-
const {chip} = await setupTest();
134-
chip.label = 'Label';
135-
chip.ariaLabel = 'Descriptive label';
136-
137-
expect(chip.ariaLabelRemove).toEqual(`Remove ${chip.ariaLabel}`);
138-
});
139-
140-
it('should allow setting a custom "ariaLabelRemove"', async () => {
141-
const {chip} = await setupTest();
142-
chip.label = 'Label';
143-
chip.ariaLabel = 'Descriptive label';
144-
const customAriaLabelRemove = 'Remove custom label';
145-
chip.ariaLabelRemove = customAriaLabelRemove;
146-
147-
expect(chip.ariaLabelRemove).toEqual(customAriaLabelRemove);
148-
});
149-
});
15017
});

‎chips/lib/filter-chip_test.ts‎

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
/**
2+
* @license
3+
* Copyright 2023 Google LLC
4+
* SPDX-License-Identifier: Apache-2.0
5+
*/
6+
7+
// import 'jasmine'; (google3-only)
8+
9+
import {html} from 'lit';
10+
import {customElement} from 'lit/decorators.js';
11+
12+
import {Environment} from '../../testing/environment.js';
13+
import {Harness} from '../../testing/harness.js';
14+
15+
import {FilterChip} from './filter-chip.js';
16+
17+
@customElement('test-filter-chip')
18+
class TestFilterChip extends FilterChip {
19+
declare primaryAction: HTMLElement;
20+
}
21+
22+
describe('Filter chip', () => {
23+
const env = new Environment();
24+
25+
async function setupTest() {
26+
const chip = new TestFilterChip();
27+
env.render(html`${chip}`);
28+
await env.waitForStability();
29+
return {chip, harness: new Harness(chip.primaryAction)};
30+
}
31+
32+
describe('selection', () => {
33+
it('should select on click', async () => {
34+
const {chip, harness} = await setupTest();
35+
36+
await harness.clickWithMouse();
37+
expect(chip.selected).withContext('chip.selected').toBeTrue();
38+
});
39+
40+
it('should deselect on click', async () => {
41+
const {chip, harness} = await setupTest();
42+
chip.selected = true;
43+
44+
await harness.clickWithMouse();
45+
expect(chip.selected).withContext('chip.selected').toBeFalse();
46+
});
47+
48+
it('should not select on click when disabled', async () => {
49+
const {chip, harness} = await setupTest();
50+
chip.disabled = true;
51+
52+
await harness.clickWithMouse();
53+
expect(chip.selected).withContext('chip.selected').toBeFalse();
54+
});
55+
56+
it('should dispatch "selected" event when selected changes programmatically',
57+
async () => {
58+
const {chip} = await setupTest();
59+
const handler = jasmine.createSpy();
60+
chip.addEventListener('selected', handler);
61+
62+
chip.selected = true;
63+
await env.waitForStability();
64+
chip.selected = false;
65+
await env.waitForStability();
66+
expect(handler).toHaveBeenCalledTimes(2);
67+
});
68+
69+
it('should dispatch "selected" event when selected changes by click',
70+
async () => {
71+
const {chip, harness} = await setupTest();
72+
const handler = jasmine.createSpy();
73+
chip.addEventListener('selected', handler);
74+
75+
await harness.clickWithMouse();
76+
await harness.clickWithMouse();
77+
expect(handler).toHaveBeenCalledTimes(2);
78+
});
79+
});
80+
});

‎chips/lib/multi-action-chip_test.ts‎

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
/**
2+
* @license
3+
* Copyright 2023 Google LLC
4+
* SPDX-License-Identifier: Apache-2.0
5+
*/
6+
7+
// import 'jasmine'; (google3-only)
8+
9+
import {html} from 'lit';
10+
import {customElement, query} from 'lit/decorators.js';
11+
12+
import {Environment} from '../../testing/environment.js';
13+
import {Harness} from '../../testing/harness.js';
14+
15+
import {MultiActionChip} from './multi-action-chip.js';
16+
import {renderRemoveButton} from './trailing-icons.js';
17+
18+
@customElement('test-multi-action-chip')
19+
class TestMultiActionChip extends MultiActionChip {
20+
@query('#primary') primaryAction!: HTMLElement;
21+
@query('.trailing.action') trailingAction!: HTMLElement;
22+
23+
protected primaryId = 'primary';
24+
25+
protected override renderAction() {
26+
return html`<button id="primary"></button>`;
27+
}
28+
29+
protected override renderTrailingAction() {
30+
return renderRemoveButton(
31+
{ariaLabel: this.ariaLabelRemove, disabled: this.disabled});
32+
}
33+
}
34+
35+
describe('Multi-action chips', () => {
36+
const env = new Environment();
37+
38+
async function setupTest() {
39+
const chip = new TestMultiActionChip();
40+
env.render(html`${chip}`);
41+
await env.waitForStability();
42+
return chip;
43+
}
44+
45+
describe('remove action', () => {
46+
it('should remove chip from DOM when remove button clicked', async () => {
47+
const chip = await setupTest();
48+
const harness = new Harness(chip.trailingAction);
49+
50+
expect(chip.parentElement)
51+
.withContext('chip should be attached before removing')
52+
.not.toBeNull();
53+
await harness.clickWithMouse();
54+
expect(chip.parentElement)
55+
.withContext('chip should be detached after removing')
56+
.toBeNull();
57+
});
58+
59+
it('should dispatch a "remove" event when removed', async () => {
60+
const chip = await setupTest();
61+
const harness = new Harness(chip.trailingAction);
62+
const handler = jasmine.createSpy();
63+
chip.addEventListener('remove', handler);
64+
65+
await harness.clickWithMouse();
66+
expect(handler).toHaveBeenCalledTimes(1);
67+
});
68+
69+
it('should not remove chip if "remove" event is default prevented',
70+
async () => {
71+
const chip = await setupTest();
72+
const harness = new Harness(chip.trailingAction);
73+
chip.addEventListener('remove', event => {
74+
event.preventDefault();
75+
});
76+
77+
await harness.clickWithMouse();
78+
expect(chip.parentElement)
79+
.withContext('chip should still be attached')
80+
.not.toBeNull();
81+
});
82+
83+
it('should provide a default "ariaLabelRemove" value', async () => {
84+
const chip = await setupTest();
85+
chip.label = 'Label';
86+
87+
expect(chip.ariaLabelRemove).toEqual(`Remove ${chip.label}`);
88+
});
89+
90+
it('should provide a default "ariaLabelRemove" when "ariaLabel" is provided',
91+
async () => {
92+
const chip = await setupTest();
93+
chip.label = 'Label';
94+
chip.ariaLabel = 'Descriptive label';
95+
96+
expect(chip.ariaLabelRemove).toEqual(`Remove ${chip.ariaLabel}`);
97+
});
98+
99+
it('should allow setting a custom "ariaLabelRemove"', async () => {
100+
const chip = await setupTest();
101+
chip.label = 'Label';
102+
chip.ariaLabel = 'Descriptive label';
103+
const customAriaLabelRemove = 'Remove custom label';
104+
chip.ariaLabelRemove = customAriaLabelRemove;
105+
106+
expect(chip.ariaLabelRemove).toEqual(customAriaLabelRemove);
107+
});
108+
});
109+
});

0 commit comments

Comments
 (0)