test(quantic): SFINT-5832 Sort E2E tests migrate from Cypress to Playwright

[lvu285]

https://coveord.atlassian.net/browse/SFINT-5832

IN THIS PR:

• Added Playwright E2E tests for the quantic-sort component

UNIT TESTS:

• No need, as UTs already there

E2E PLAYWRIGHT TESTS:

• Playwright for Sort component

[github-actions]

Pull Request Report

PR Title

❌ Title should follow the conventional commit spec:
<type>(optional scope): <description>

Example: feat(headless): add result-list controller

Live demo links

• Storybook

• Playwright report

Bundle Size

File	Old (kb)	New (kb)	Change (%)
case-assist	243.9	243.9	0
commerce	355.1	355.1	0
search	415	415	0
insight	406.3	406.3	0
recommendation	256.2	256.2	0
ssr	408.9	408.9	0
ssr-commerce	372.9	372.9	0

SSR Progress

Use case	SSR (#)	CSR (#)	Progress (%)
search	39	44	89
recommendation	0	4	0
case-assist	0	6	0
insight	0	27	0
commerce	0	15	0

Detailed logs

search : buildInteractiveResult
search : buildInteractiveInstantResult
search : buildInteractiveRecentResult
search : buildInteractiveCitation
search : buildGeneratedAnswer
recommendation : missing SSR support
case-assist : missing SSR support
insight : missing SSR support
commerce : missing SSR support

[mmitiche]

@erocheleau I will integrate the content from this PR: #4782 in this PR as well, to have more unit tests to test the component rather going E2E only.

[SimonMilord]

Re-read the comments that were addressed, ltgm! thank you

[erocheleau]

Not done yet :)

Will review the playwright tests later

[erocheleau]

What does the "focusSortDropDownEnter" mean here?
The function clicks on the preview button and then presses Tab?

[erocheleau]

The name of this function doesn't describe what is being done with the steps within this function, what are you trying to accomplish with that?

[erocheleau]

Some suggestions

[erocheleau]

This one is weird for me, why you rely on 'Oldest' specifically, and also why do you have to wait for 500ms?

[erocheleau]

After seeing the test, it shouldn't be in the pageObject just in your test, put this:

await this.page.keyboard.press('ArrowDown');
await this.page.keyboard.press('Enter');

[lvu285]

the wait for 500ms is to make the test for Insight use case more stable, otherwise the next keyboard action sometimes will fail.

[erocheleau]

Why do you need the as typeof ?

Suggested change

	let test;
	if (useCase.value === useCaseEnum.search) {
	test = fixtures[useCase.value] as typeof testSearch;
	} else {
	test = fixtures[useCase.value] as typeof testInsight;
	}
	const test = fixtures[useCase.value];

[lvu285]

I won't fix it now, as it's bit complicated. Mehdi will review and fix them later

[erocheleau]

Again here, I would go fetch what the loaded sorts are available on the page instead of relying on the default sorts.

[lvu285]

same as above, we want to be sure the sort displays in correct order