Skip to content

Commit 05e6f33

Browse files
jacobsfletchjacobsfletch
authored
test: addListFilter helper (#11026)
Adds a new `addListFilter` e2e helper. This will help to standardize this common functionality across all tests that require filtering list tables and help reduce the overall lines of code within each test file.
1 parent 8b6ba62 commit 05e6f33

File tree

10 files changed

+143
-212
lines changed

10 files changed

+143
-212
lines changed

‎test/admin/e2e/list-view/e2e.spec.ts‎

Lines changed: 42 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ import type { PayloadTestSDK } from '../../../helpers/sdk/index.js'
4343
import { reorderColumns } from '../../../helpers/e2e/reorderColumns.js'
4444
import { reInitializeDB } from '../../../helpers/reInitializeDB.js'
4545
import { POLL_TOPASS_TIMEOUT, TEST_TIMEOUT_LONG } from '../../../playwright.config.js'
46+
import { addListFilter } from 'helpers/e2e/addListFilter.js'
4647
const filename = fileURLToPath(import.meta.url)
4748
const currentFolder = path.dirname(filename)
4849
const dirname = path.resolve(currentFolder, '../../')
@@ -311,27 +312,12 @@ describe('List View', () => {
311312

312313
await expect(page.locator(tableRowLocator)).toHaveCount(2)
313314

314-
await openListFilters(page, {})
315-
316-
await page.locator('.where-builder__add-first-filter').click()
317-
318-
const conditionField = page.locator('.condition__field')
319-
await conditionField.click()
320-
const dropdownFieldOption = conditionField.locator('.rs__option', {
321-
hasText: exactText('ID'),
315+
await addListFilter({
316+
page,
317+
fieldLabel: 'ID',
318+
operatorLabel: 'equals',
319+
value: id,
322320
})
323-
await dropdownFieldOption.click()
324-
await expect(page.locator('.condition__field')).toContainText('ID')
325-
326-
const operatorField = page.locator('.condition__operator')
327-
const valueField = page.locator('.condition__value input')
328-
329-
await operatorField.click()
330-
331-
const dropdownOptions = operatorField.locator('.rs__option')
332-
await dropdownOptions.locator('text=equals').click()
333-
334-
await valueField.fill(id)
335321

336322
const tableRows = page.locator(tableRowLocator)
337323

@@ -347,20 +333,12 @@ describe('List View', () => {
347333
test('should reset filter value and operator on field update', async () => {
348334
const id = (await page.locator('.cell-id').first().innerText()).replace('ID: ', '')
349335

350-
// open the column controls
351-
await page.locator('.list-controls__toggle-columns').click()
352-
await openListFilters(page, {})
353-
await page.locator('.where-builder__add-first-filter').click()
354-
355-
const operatorField = page.locator('.condition__operator')
356-
await operatorField.click()
357-
358-
const dropdownOperatorOptions = operatorField.locator('.rs__option')
359-
await dropdownOperatorOptions.locator('text=equals').click()
360-
361-
// execute filter (where ID equals id value)
362-
const valueField = page.locator('.condition__value > input')
363-
await valueField.fill(id)
336+
await addListFilter({
337+
page,
338+
fieldLabel: 'ID',
339+
operatorLabel: 'equals',
340+
value: id,
341+
})
364342

365343
const filterField = page.locator('.condition__field')
366344
await filterField.click()
@@ -373,6 +351,7 @@ describe('List View', () => {
373351
await expect(filterField).toContainText('Status')
374352

375353
// expect operator & value field to reset (be empty)
354+
const operatorField = page.locator('.condition__operator')
376355
await expect(operatorField.locator('.rs__placeholder')).toContainText('Select a value')
377356
await expect(page.locator('.condition__value input')).toHaveValue('')
378357
})
@@ -490,21 +469,22 @@ describe('List View', () => {
490469
await expect(page.locator('.collection-list__page-info')).toHaveText('1-5 of 6')
491470
await expect(page.locator('.per-page')).toContainText('Per Page: 5')
492471
await page.goto(`${postsUrl.list}?limit=5&page=2`)
493-
await openListFilters(page, {})
494-
await page.locator('.where-builder__add-first-filter').click()
495-
await page.locator('.condition__field .rs__control').click()
496-
const options = page.locator('.rs__option')
497-
await options.locator('text=Tab 1 > Title').click()
498-
await page.locator('.condition__operator .rs__control').click()
499-
await options.locator('text=equals').click()
500-
await page.locator('.condition__value input').fill('test')
472+
473+
await addListFilter({
474+
page,
475+
fieldLabel: 'Tab 1 > Title',
476+
operatorLabel: 'equals',
477+
value: 'test',
478+
})
479+
501480
await page.waitForURL(new RegExp(`${postsUrl.list}\\?limit=5&page=1`))
502481
await expect(page.locator('.collection-list__page-info')).toHaveText('1-3 of 3')
503482
})
504483

505484
test('should reset filter values for every additional filters', async () => {
506485
await page.goto(postsUrl.list)
507486
await openListFilters(page, {})
487+
508488
await page.locator('.where-builder__add-first-filter').click()
509489
const firstConditionField = page.locator('.condition__field')
510490
const firstOperatorField = page.locator('.condition__operator')
@@ -536,48 +516,36 @@ describe('List View', () => {
536516

537517
test('should not re-render page upon typing in a value in the filter value field', async () => {
538518
await page.goto(postsUrl.list)
539-
await openListFilters(page, {})
540-
await page.locator('.where-builder__add-first-filter').click()
541-
const firstConditionField = page.locator('.condition__field')
542-
const firstOperatorField = page.locator('.condition__operator')
543-
const firstValueField = page.locator('.condition__value >> input')
544519

545-
await firstConditionField.click()
546-
await firstConditionField
547-
.locator('.rs__option', { hasText: exactText('Tab 1 > Title') })
548-
.click()
549-
await expect(firstConditionField.locator('.rs__single-value')).toContainText('Tab 1 > Title')
520+
await addListFilter({
521+
page,
522+
fieldLabel: 'Tab 1 > Title',
523+
operatorLabel: 'equals',
524+
skipValueInput: true,
525+
})
550526

551-
await firstOperatorField.click()
552-
await firstOperatorField.locator('.rs__option').locator('text=equals').click()
527+
const valueInput = page.locator('.condition__value >> input')
553528

554529
// Type into the input field instead of filling it
555-
await firstValueField.click()
556-
await firstValueField.type('Test', { delay: 100 }) // Add a delay to simulate typing speed
530+
await valueInput.click()
531+
await valueInput.type('Test', { delay: 100 }) // Add a delay to simulate typing speed
557532

558533
// Wait for a short period to see if the input loses focus
559534
await page.waitForTimeout(500)
560535

561536
// Check if the input still has the correct value
562-
await expect(firstValueField).toHaveValue('Test')
537+
await expect(valueInput).toHaveValue('Test')
563538
})
564539

565540
test('should still show second filter if two filters exist and first filter is removed', async () => {
566541
await page.goto(postsUrl.list)
567-
await openListFilters(page, {})
568-
await page.locator('.where-builder__add-first-filter').click()
569-
const firstConditionField = page.locator('.condition__field')
570-
const firstOperatorField = page.locator('.condition__operator')
571-
const firstValueField = page.locator('.condition__value >> input')
572-
await firstConditionField.click()
573-
await firstConditionField
574-
.locator('.rs__option', { hasText: exactText('Tab 1 > Title') })
575-
.click()
576-
await expect(firstConditionField.locator('.rs__single-value')).toContainText('Tab 1 > Title')
577-
await firstOperatorField.click()
578-
await firstOperatorField.locator('.rs__option').locator('text=equals').click()
579-
await firstValueField.fill('Test 1')
580-
await expect(firstValueField).toHaveValue('Test 1')
542+
543+
await addListFilter({
544+
page,
545+
fieldLabel: 'Tab 1 > Title',
546+
operatorLabel: 'equals',
547+
value: 'Test 1',
548+
})
581549

582550
await wait(500)
583551

@@ -609,6 +577,7 @@ describe('List View', () => {
609577
await removeButton.click()
610578
const filterListItems = page.locator('.where-builder__and-filters li')
611579
await expect(filterListItems).toHaveCount(1)
580+
const firstValueField = page.locator('.condition__value >> input')
612581
await expect(firstValueField).toHaveValue('Test 2')
613582
})
614583

@@ -647,8 +616,6 @@ describe('List View', () => {
647616
)}`,
648617
)
649618

650-
console.log('URL', page.url())
651-
652619
await openListFilters(page, {})
653620

654621
const condition = page.locator('.condition__field')
@@ -1150,23 +1117,22 @@ describe('List View', () => {
11501117
test('should display translated field titles', async () => {
11511118
await createPost()
11521119

1153-
// column controls
11541120
await page.locator('.list-controls__toggle-columns').click()
1121+
11551122
await expect(
11561123
page.locator('.column-selector__column', {
11571124
hasText: exactText('Title'),
11581125
}),
11591126
).toHaveText('Title')
11601127

1161-
// filters
11621128
await openListFilters(page, {})
1129+
11631130
await page.locator('.where-builder__add-first-filter').click()
11641131
await page.locator('.condition__field .rs__control').click()
11651132
const options = page.locator('.rs__option')
11661133

11671134
await expect(options.locator('text=Tab 1 > Title')).toHaveText('Tab 1 > Title')
11681135

1169-
// list columns
11701136
await expect(page.locator('#heading-title .sort-column__label')).toHaveText('Title')
11711137
await expect(page.locator('.search-filter input')).toHaveAttribute('placeholder', /(Title)/)
11721138
})

‎test/fields-relationship/collections/Relationship/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@ export const Relationship: CollectionConfig = {
5757
},
5858
{
5959
name: 'relationshipFilteredByID',
60+
label: 'Relationship Filtered By ID',
6061
filterOptions: (args: FilterOptionsProps<FieldsRelationship>) => {
6162
return {
6263
id: {

‎test/fields-relationship/e2e.spec.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ import {
4343
slug,
4444
versionedRelationshipFieldSlug,
4545
} from './slugs.js'
46+
import { addListFilter } from 'helpers/e2e/addListFilter.js'
4647

4748
const filename = fileURLToPath(import.meta.url)
4849
const dirname = path.dirname(filename)

‎test/fields/collections/Checkbox/e2e.spec.ts‎

Lines changed: 8 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ import { reInitializeDB } from '../../../helpers/reInitializeDB.js'
1212
import { RESTClient } from '../../../helpers/rest.js'
1313
import { TEST_TIMEOUT_LONG } from '../../../playwright.config.js'
1414
import { checkboxFieldsSlug } from '../../slugs.js'
15+
import { openListFilters } from 'helpers/e2e/openListFilters.js'
16+
import { addListFilter } from 'helpers/e2e/addListFilter.js'
1517

1618
const filename = fileURLToPath(import.meta.url)
1719
const currentFolder = path.dirname(filename)
@@ -59,23 +61,12 @@ describe('Checkboxes', () => {
5961
test('should not crash on filtering where checkbox is first field', async () => {
6062
await page.goto(url.list)
6163

62-
const filterButton = page.locator('.list-controls__toggle-where')
63-
await filterButton.click()
64-
65-
const addButton = page.locator('.where-builder__add-first-filter')
66-
await addButton.click()
67-
68-
const operator = page.locator('.condition__operator .rs__control')
69-
await operator.click()
70-
71-
const equals = page.locator('.rs__option:has-text("equals")')
72-
await equals.click()
73-
74-
const value = page.locator('.condition__value')
75-
await value.click()
76-
77-
const trueOption = page.locator('.rs__option:has-text("True")')
78-
await trueOption.click()
64+
await addListFilter({
65+
page,
66+
fieldLabel: 'Checkbox',
67+
operatorLabel: 'equals',
68+
value: 'True',
69+
})
7970

8071
await wait(1000)
8172

‎test/fields/collections/Email/e2e.spec.ts‎

Lines changed: 21 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import { RESTClient } from '../../../helpers/rest.js'
1717
import { TEST_TIMEOUT_LONG } from '../../../playwright.config.js'
1818
import { emailFieldsSlug } from '../../slugs.js'
1919
import { emailDoc } from './shared.js'
20+
import { addListFilter } from 'helpers/e2e/addListFilter.js'
2021

2122
const filename = fileURLToPath(import.meta.url)
2223
const currentFolder = path.dirname(filename)
@@ -129,27 +130,12 @@ describe('Email', () => {
129130
test('should reset filter conditions when adding additional filters', async () => {
130131
await page.goto(url.list)
131132

132-
// open the first filter options
133-
await openListFilters(page, {})
134-
await page.locator('.where-builder__add-first-filter').click()
135-
136-
const firstInitialField = page.locator('.condition__field')
137-
const firstOperatorField = page.locator('.condition__operator')
138-
const firstValueField = page.locator('.condition__value >> input')
139-
140-
await firstInitialField.click()
141-
const firstInitialFieldOptions = firstInitialField.locator('.rs__option')
142-
await firstInitialFieldOptions.locator('text=text').first().click()
143-
await expect(firstInitialField.locator('.rs__single-value')).toContainText('Text')
144-
145-
await firstOperatorField.click()
146-
await firstOperatorField.locator('.rs__option').locator('text=equals').click()
147-
148-
await firstValueField.fill('hello')
149-
150-
await wait(500)
151-
152-
await expect(firstValueField).toHaveValue('hello')
133+
await addListFilter({
134+
page,
135+
fieldLabel: 'Text en',
136+
operatorLabel: 'equals',
137+
value: 'hello',
138+
})
153139

154140
// open the second filter options
155141
await page.locator('.condition__actions-add').click()
@@ -170,23 +156,15 @@ describe('Email', () => {
170156
test('should not re-render page upon typing in a value in the filter value field', async () => {
171157
await page.goto(url.list)
172158

173-
// open the first filter options
174-
await openListFilters(page, {})
175-
await page.locator('.where-builder__add-first-filter').click()
176-
177-
const firstInitialField = page.locator('.condition__field')
178-
const firstOperatorField = page.locator('.condition__operator')
179-
const firstValueField = page.locator('.condition__value >> input')
180-
181-
await firstInitialField.click()
182-
const firstInitialFieldOptions = firstInitialField.locator('.rs__option')
183-
await firstInitialFieldOptions.locator('text=text').first().click()
184-
await expect(firstInitialField.locator('.rs__single-value')).toContainText('Text')
185-
186-
await firstOperatorField.click()
187-
await firstOperatorField.locator('.rs__option').locator('text=equals').click()
159+
await addListFilter({
160+
page,
161+
fieldLabel: 'Text en',
162+
operatorLabel: 'equals',
163+
skipValueInput: true,
164+
})
188165

189166
// Type into the input field instead of filling it
167+
const firstValueField = page.locator('.condition__value >> input')
190168
await firstValueField.click()
191169
await firstValueField.type('hello', { delay: 100 }) // Add a delay to simulate typing speed
192170

@@ -200,27 +178,12 @@ describe('Email', () => {
200178
test('should still show second filter if two filters exist and first filter is removed', async () => {
201179
await page.goto(url.list)
202180

203-
// open the first filter options
204-
await openListFilters(page, {})
205-
await page.locator('.where-builder__add-first-filter').click()
206-
207-
const firstInitialField = page.locator('.condition__field')
208-
const firstOperatorField = page.locator('.condition__operator')
209-
const firstValueField = page.locator('.condition__value >> input')
210-
211-
await firstInitialField.click()
212-
const firstInitialFieldOptions = firstInitialField.locator('.rs__option')
213-
await firstInitialFieldOptions.locator('text=text').first().click()
214-
await expect(firstInitialField.locator('.rs__single-value')).toContainText('Text')
215-
216-
await firstOperatorField.click()
217-
await firstOperatorField.locator('.rs__option').locator('text=equals').click()
218-
219-
await firstValueField.fill('hello')
220-
221-
await wait(500)
222-
223-
await expect(firstValueField).toHaveValue('hello')
181+
await addListFilter({
182+
page,
183+
fieldLabel: 'Text en',
184+
operatorLabel: 'equals',
185+
value: 'hello',
186+
})
224187

225188
// open the second filter options
226189
await page.locator('.condition__actions-add').click()
@@ -255,6 +218,7 @@ describe('Email', () => {
255218
const filterListItems = page.locator('.where-builder__and-filters li')
256219
await expect(filterListItems).toHaveCount(1)
257220

221+
const firstValueField = page.locator('.condition__value >> input')
258222
await expect(firstValueField).toHaveValue('world')
259223
})
260224
})

0 commit comments

Comments
 (0)