Skip to content

Commit aa2676f

Browse files
Copilotjmazzah-coveo
Copilot
and
jmazzah-coveo
committed
refactor(atomic): reorganize atomic-popover test and component method order
Co-authored-by: jmazzah-coveo <229375403+jmazzah-coveo@users.noreply.github.com>
1 parent 7f107b8 commit aa2676f

File tree

2 files changed

+172
-172
lines changed

2 files changed

+172
-172
lines changed

‎packages/atomic/src/components/search/facets/atomic-popover/atomic-popover.spec.ts‎

Lines changed: 139 additions & 137 deletions
Original file line numberDiff line numberDiff line change
@@ -79,13 +79,42 @@ describe('atomic-popover', () => {
7979
};
8080
};
8181

82-
describe('when component is rendered', () => {
82+
describe('#initialize', () => {
8383
it('should build search status controller', async () => {
8484
await renderPopover();
8585

8686
expect(buildSearchStatus).toHaveBeenCalledWith(mockEngine);
8787
});
8888

89+
describe('when no child is provided', () => {
90+
it('should set error', async () => {
91+
const {element} = await renderPopover({slottedContent: ''});
92+
93+
expect(element.error).toBeTruthy();
94+
expect(element.error.message).toContain(
95+
'One child is required inside a set of popover tags.'
96+
);
97+
});
98+
});
99+
100+
describe('when multiple children are provided', () => {
101+
it('should set error', async () => {
102+
const {element} = await renderPopover({
103+
slottedContent: `
104+
<atomic-facet field="objecttype" label="Object type"></atomic-facet>
105+
<atomic-facet field="filetype" label="File type"></atomic-facet>
106+
`,
107+
});
108+
109+
expect(element.error).toBeTruthy();
110+
expect(element.error.message).toContain(
111+
'Cannot have more than one child inside a set of popover tags.'
112+
);
113+
});
114+
});
115+
});
116+
117+
describe('#render', () => {
89118
it('should render popover button with label', async () => {
90119
const {parts, element} = await renderPopover();
91120

@@ -111,36 +140,96 @@ describe('atomic-popover', () => {
111140
expect(valueCount).toBeTruthy();
112141
expect(valueCount?.classList.contains('hidden')).toBe(true);
113142
});
114-
});
115143

116-
describe('when no child is provided', () => {
117-
it('should set error', async () => {
118-
const {element} = await renderPopover({slottedContent: ''});
144+
describe('when search has error', () => {
145+
it('should render nothing', async () => {
146+
vi.mocked(buildSearchStatus).mockReturnValue(
147+
buildFakeSearchStatus({
148+
state: {
149+
hasError: true,
150+
firstSearchExecuted: true,
151+
hasResults: false,
152+
isLoading: false,
153+
},
154+
})
155+
);
156+
157+
const {parts, element} = await renderPopover();
158+
159+
expect(parts(element).popoverButton).toBeNull();
160+
});
161+
});
119162

120-
expect(element.error).toBeTruthy();
121-
expect(element.error.message).toContain(
122-
'One child is required inside a set of popover tags.'
123-
);
163+
describe('when first search is not executed', () => {
164+
it('should render placeholder', async () => {
165+
vi.mocked(buildSearchStatus).mockReturnValue(
166+
buildFakeSearchStatus({
167+
state: {
168+
hasError: false,
169+
firstSearchExecuted: false,
170+
hasResults: false,
171+
isLoading: true,
172+
},
173+
})
174+
);
175+
176+
const {parts, element} = await renderPopover();
177+
178+
await expect.element(parts(element).placeholder).toBeInTheDocument();
179+
});
124180
});
125-
});
126181

127-
describe('when multiple children are provided', () => {
128-
it('should set error', async () => {
129-
const {element} = await renderPopover({
130-
slottedContent: `
131-
<atomic-facet field="objecttype" label="Object type"></atomic-facet>
132-
<atomic-facet field="filetype" label="File type"></atomic-facet>
133-
`,
182+
describe('when search has no results', () => {
183+
it('should render nothing', async () => {
184+
vi.mocked(buildSearchStatus).mockReturnValue(
185+
buildFakeSearchStatus({
186+
state: {
187+
hasError: false,
188+
firstSearchExecuted: true,
189+
hasResults: false,
190+
isLoading: false,
191+
},
192+
})
193+
);
194+
195+
const {parts, element} = await renderPopover();
196+
197+
expect(parts(element).popoverButton).toBeNull();
198+
});
199+
});
200+
201+
describe('when child facet has no values', () => {
202+
it('should render nothing', async () => {
203+
const {parts, element} = await renderPopover({
204+
controllerState: {
205+
hasValues: () => false,
206+
},
207+
});
208+
209+
expect(parts(element).popoverButton).toBeNull();
134210
});
211+
});
212+
});
213+
214+
describe('#disconnectedCallback', () => {
215+
it('should clean up event listeners on disconnect', async () => {
216+
const {element} = await renderPopover();
217+
const removeEventListenerSpy = vi.spyOn(element, 'removeEventListener');
135218

136-
expect(element.error).toBeTruthy();
137-
expect(element.error.message).toContain(
138-
'Cannot have more than one child inside a set of popover tags.'
219+
element.disconnectedCallback();
220+
221+
expect(removeEventListenerSpy).toHaveBeenCalledWith(
222+
'atomic/initializePopover',
223+
expect.any(Function)
224+
);
225+
expect(removeEventListenerSpy).toHaveBeenCalledWith(
226+
'keydown',
227+
expect.any(Function)
139228
);
140229
});
141230
});
142231

143-
describe('when popover button is clicked', () => {
232+
describe('#togglePopover (when button is clicked)', () => {
144233
it('should open the popover', async () => {
145234
const {popoverButton, parts, element} = await renderPopover();
146235

@@ -171,132 +260,45 @@ describe('atomic-popover', () => {
171260
.element(popoverButton)
172261
.toHaveAttribute('aria-expanded', 'true');
173262
});
174-
});
175-
176-
describe('when popover is open and backdrop is clicked', () => {
177-
it('should close the popover', async () => {
178-
const {popoverButton, parts, element} = await renderPopover();
179263

180-
// Open popover
181-
await userEvent.click(popoverButton);
182-
await element.updateComplete;
183-
184-
// Click backdrop
185-
const backdrop = parts(element).backdrop;
186-
expect(backdrop).toBeTruthy();
187-
await userEvent.click(backdrop!);
188-
await element.updateComplete;
189-
190-
// Verify closed
191-
const facet = parts(element).facet;
192-
expect(facet).toBeTruthy();
193-
expect(facet?.classList.contains('hidden')).toBe(true);
194-
});
195-
});
264+
describe('when popover is open and backdrop is clicked', () => {
265+
it('should close the popover', async () => {
266+
const {popoverButton, parts, element} = await renderPopover();
196267

197-
describe('when popover is open and Escape key is pressed', () => {
198-
it('should close the popover', async () => {
199-
const {popoverButton, parts, element} = await renderPopover();
268+
// Open popover
269+
await userEvent.click(popoverButton);
270+
await element.updateComplete;
200271

201-
// Open popover
202-
await userEvent.click(popoverButton);
203-
await element.updateComplete;
272+
// Click backdrop
273+
const backdrop = parts(element).backdrop;
274+
expect(backdrop).toBeTruthy();
275+
await userEvent.click(backdrop!);
276+
await element.updateComplete;
204277

205-
// Press Escape
206-
await page.keyboard.press('Escape');
207-
await element.updateComplete;
208-
209-
// Verify closed
210-
const facet = parts(element).facet;
211-
expect(facet).toBeTruthy();
212-
expect(facet?.classList.contains('hidden')).toBe(true);
213-
});
214-
});
215-
216-
describe('when search has error', () => {
217-
it('should render nothing', async () => {
218-
vi.mocked(buildSearchStatus).mockReturnValue(
219-
buildFakeSearchStatus({
220-
state: {
221-
hasError: true,
222-
firstSearchExecuted: true,
223-
hasResults: false,
224-
isLoading: false,
225-
},
226-
})
227-
);
228-
229-
const {parts, element} = await renderPopover();
230-
231-
expect(parts(element).popoverButton).toBeNull();
232-
});
233-
});
234-
235-
describe('when first search is not executed', () => {
236-
it('should render placeholder', async () => {
237-
vi.mocked(buildSearchStatus).mockReturnValue(
238-
buildFakeSearchStatus({
239-
state: {
240-
hasError: false,
241-
firstSearchExecuted: false,
242-
hasResults: false,
243-
isLoading: true,
244-
},
245-
})
246-
);
247-
248-
const {parts, element} = await renderPopover();
249-
250-
await expect.element(parts(element).placeholder).toBeInTheDocument();
278+
// Verify closed
279+
const facet = parts(element).facet;
280+
expect(facet).toBeTruthy();
281+
expect(facet?.classList.contains('hidden')).toBe(true);
282+
});
251283
});
252-
});
253284

254-
describe('when search has no results', () => {
255-
it('should render nothing', async () => {
256-
vi.mocked(buildSearchStatus).mockReturnValue(
257-
buildFakeSearchStatus({
258-
state: {
259-
hasError: false,
260-
firstSearchExecuted: true,
261-
hasResults: false,
262-
isLoading: false,
263-
},
264-
})
265-
);
285+
describe('when popover is open and Escape key is pressed', () => {
286+
it('should close the popover', async () => {
287+
const {popoverButton, parts, element} = await renderPopover();
266288

267-
const {parts, element} = await renderPopover();
289+
// Open popover
290+
await userEvent.click(popoverButton);
291+
await element.updateComplete;
268292

269-
expect(parts(element).popoverButton).toBeNull();
270-
});
271-
});
293+
// Press Escape
294+
await page.keyboard.press('Escape');
295+
await element.updateComplete;
272296

273-
describe('when child facet has no values', () => {
274-
it('should render nothing', async () => {
275-
const {parts, element} = await renderPopover({
276-
controllerState: {
277-
hasValues: () => false,
278-
},
297+
// Verify closed
298+
const facet = parts(element).facet;
299+
expect(facet).toBeTruthy();
300+
expect(facet?.classList.contains('hidden')).toBe(true);
279301
});
280-
281-
expect(parts(element).popoverButton).toBeNull();
282-
});
283-
});
284-
285-
describe('lifecycle', () => {
286-
it('should clean up event listeners on disconnect', async () => {
287-
const {element} = await renderPopover();
288-
const removeEventListenerSpy = vi.spyOn(element, 'removeEventListener');
289-
290-
element.disconnectedCallback();
291-
292-
expect(removeEventListenerSpy).toHaveBeenCalledWith(
293-
'atomic/initializePopover',
294-
expect.any(Function)
295-
);
296-
expect(removeEventListenerSpy).toHaveBeenCalledWith(
297-
'keydown',
298-
expect.any(Function)
299-
);
300302
});
301303
});
302304
});

0 commit comments

Comments
 (0)