diff --git a/test/admin/e2e.spec.ts b/test/admin/e2e.spec.ts index 7601c8843d..0e2e4d36dc 100644 --- a/test/admin/e2e.spec.ts +++ b/test/admin/e2e.spec.ts @@ -430,7 +430,7 @@ describe('admin', () => { const { id } = await createPost() await page.goto(postsUrl.edit(id)) await page.locator('#field-title')?.fill('') - expect(await page.locator('.doc-header__title.render-title')?.innerText()).toContain('ID:') + await expect(page.locator('.doc-header__title.render-title:has-text("ID:")')).toBeVisible() await saveDocAndAssert(page) }) diff --git a/test/fields/e2e.spec.ts b/test/fields/e2e.spec.ts index 33a1fdb367..b44855585a 100644 --- a/test/fields/e2e.spec.ts +++ b/test/fields/e2e.spec.ts @@ -11,7 +11,9 @@ import type { Config } from './payload-types.js' import { ensureAutoLoginAndCompilationIsDone, initPageConsoleErrorCatch, + navigateToListCellLink, saveDocAndAssert, + switchTab, } from '../helpers.js' import { AdminUrlUtil } from '../helpers/adminUrlUtil.js' import { initPayloadE2ENoConfig } from '../helpers/initPayloadE2ENoConfig.js' @@ -34,11 +36,7 @@ let serverURL: string // If we want to make this run in parallel: test.describe.configure({ mode: 'parallel' }) describe('fields', () => { - beforeAll(async ({ browser }, testInfo) => { - // const prebuild = Boolean(process.env.CI) - - // if (prebuild) testInfo.setTimeout(testInfo.timeout * 3) - + beforeAll(async ({ browser }) => { process.env.SEED_IN_CONFIG_ONINIT = 'false' // Makes it so the payload config onInit seed is not run. Otherwise, the seed would be run unnecessarily twice for the initial test run - once for beforeEach and once for onInit ;({ payload, serverURL } = await initPayloadE2ENoConfig({ dirname, @@ -542,20 +540,17 @@ describe('fields', () => { const jsonValue = '{ "foo": "bar"}' await page.goto(url.create) + await page.waitForURL(url.create) - await wait(1000) - - await page.locator('.tabs-field__tab-button:has-text("Tab with Row")').click() + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Row")') await page.locator('#field-textInRow').fill(textInRowValue) await page.locator('#field-numberInRow').fill(numberInRowValue) await page.locator('.json-field .inputarea').fill(jsonValue) await wait(300) - await page.locator('.tabs-field__tab-button:has-text("Tab with Array")').click() - await page.locator('.tabs-field__tab-button:has-text("Tab with Row")').click() - - await wait(100) + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Array")') + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Row")') await expect(page.locator('#field-textInRow')).toHaveValue(textInRowValue) await expect(page.locator('#field-numberInRow')).toHaveValue(numberInRowValue) @@ -566,46 +561,43 @@ describe('fields', () => { const textInRowValue = 'new value' const jsonValue = '{ "new": "value"}' await page.goto(url.list) - await page.locator('.cell-id a').click() - - await wait(500) + await navigateToListCellLink(page) // Go to Row tab, update the value - await page.locator('.tabs-field__tab-button:has-text("Tab with Row")').click() + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Row")') + await page.locator('#field-textInRow').fill(textInRowValue) await page.locator('.json-field .inputarea').fill(jsonValue) await wait(500) // Go to Array tab, then back to Row. Make sure new value is still there - await page.locator('.tabs-field__tab-button:has-text("Tab with Array")').click() - await page.locator('.tabs-field__tab-button:has-text("Tab with Row")').click() + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Array")') + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Row")') await expect(page.locator('#field-textInRow')).toHaveValue(textInRowValue) await expect(page.locator('.json-field .lines-content')).toContainText(jsonValue) // Go to array tab, save the doc - await page.locator('.tabs-field__tab-button:has-text("Tab with Array")').click() - await page.click('#action-save', { delay: 100 }) - - await wait(500) + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Array")') + await saveDocAndAssert(page) // Go back to row tab, make sure the new value is still present - await page.locator('.tabs-field__tab-button:has-text("Tab with Row")').click() + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Row")') await expect(page.locator('#field-textInRow')).toHaveValue(textInRowValue) }) test('should render array data within unnamed tabs', async () => { await page.goto(url.list) - await page.locator('.cell-id a').click() - await page.locator('.tabs-field__tab-button:has-text("Tab with Array")').click() + await navigateToListCellLink(page) + await switchTab(page, '.tabs-field__tab-button:has-text("Tab with Array")') await expect(page.locator('#field-array__0__text')).toHaveValue("Hello, I'm the first row") }) test('should render array data within named tabs', async () => { await page.goto(url.list) - await page.locator('.cell-id a').click() - await page.locator('.tabs-field__tab-button:nth-child(5)').click() + await navigateToListCellLink(page) + await switchTab(page, '.tabs-field__tab-button:nth-child(5)') await expect(page.locator('#field-tab__array__0__text')).toHaveValue( "Hello, I'm the first row, in a named tab", ) diff --git a/test/helpers.ts b/test/helpers.ts index f9fb38d65f..7ae6847d00 100644 --- a/test/helpers.ts +++ b/test/helpers.ts @@ -141,11 +141,10 @@ export async function openDocControls(page: Page): Promise { await expect(page.locator('.doc-controls__popup >> .popup__content')).toBeVisible() } -export async function changeLocale(page: Page, newLocale: string, skipURLCheck: boolean = false) { +export async function changeLocale(page: Page, newLocale: string) { await page.locator('.localizer >> button').first().click() await page - .locator(`.localizer`) - .locator(`.popup >> button`, { + .locator(`.localizer .popup.popup--active .popup-button-list button`, { hasText: newLocale, }) .first() @@ -153,11 +152,7 @@ export async function changeLocale(page: Page, newLocale: string, skipURLCheck: const regexPattern = new RegExp(`locale=${newLocale}`) - if (skipURLCheck) { - await wait(500) - } else { - await expect(page).toHaveURL(regexPattern) - } + await expect(page).toHaveURL(regexPattern) } export function exactText(text: string) { @@ -196,12 +191,25 @@ export const findTableCell = (page: Page, fieldName: string, rowTitle?: string): return cell } +export async function navigateToListCellLink(page: Page, selector = '.cell-id') { + const cellLink = page.locator(`${selector} a`).first() + const linkURL = await cellLink.getAttribute('href') + await cellLink.click() + await page.waitForURL(`**${linkURL}`) +} + export const findTableRow = (page: Page, title: string): Locator => { const row = page.locator(`tbody tr:has-text("${title}")`) expect(row).toBeTruthy() return row } +export async function switchTab(page: Page, selector: string) { + await page.locator(selector).click() + await wait(300) + await expect(page.locator(`${selector}.tabs-field__tab-button--active`)).toBeVisible() +} + /** * Throws an error when browser console error messages (with some exceptions) are thrown, thus resulting * in the e2e test failing. diff --git a/test/live-preview/e2e.spec.ts b/test/live-preview/e2e.spec.ts index 38d8e3413b..02b0cb15cf 100644 --- a/test/live-preview/e2e.spec.ts +++ b/test/live-preview/e2e.spec.ts @@ -8,6 +8,7 @@ import { ensureAutoLoginAndCompilationIsDone, exactText, initPageConsoleErrorCatch, + navigateToListCellLink, saveDocAndAssert, } from '../helpers.js' import { AdminUrlUtil } from '../helpers/adminUrlUtil.js' @@ -26,25 +27,21 @@ describe('Live Preview', () => { const goToDoc = async (page: Page) => { await page.goto(url.list) - const linkToDoc = page.locator('tbody tr:first-child .cell-id a').first() - - await expect(() => expect(linkToDoc).toBeTruthy()).toPass({ timeout: POLL_TOPASS_TIMEOUT }) - const linkDocHref = await linkToDoc.getAttribute('href') - - await linkToDoc.click() - - await page.waitForURL(`**${linkDocHref}`) + await page.waitForURL(url.list) + await navigateToListCellLink(page) } const goToCollectionPreview = async (page: Page): Promise => { await goToDoc(page) await page.goto(`${page.url()}/preview`) + await page.waitForURL(`**/preview`) } const goToGlobalPreview = async (page: Page, slug: string): Promise => { const global = new AdminUrlUtil(serverURL, slug) const previewURL = `${global.global(slug)}/preview` await page.goto(previewURL) + await page.waitForURL(previewURL) } beforeAll(async ({ browser }) => { @@ -78,12 +75,9 @@ describe('Live Preview', () => { test('collection — has route', async () => { await goToDoc(page) - const url = page.url() await goToCollectionPreview(page) - await expect(() => expect(page.url()).toBe(`${url}/preview`)).toPass({ - timeout: POLL_TOPASS_TIMEOUT, - }) + await expect(page.locator('.live-preview')).toBeVisible() }) test('collection — renders iframe', async () => { @@ -127,6 +121,7 @@ describe('Live Preview', () => { test('global — has tab', async () => { const global = new AdminUrlUtil(serverURL, 'header') await page.goto(global.global('header')) + await page.waitForURL(global.global('header')) const docURL = page.url() const pathname = new URL(docURL).pathname @@ -169,17 +164,13 @@ describe('Live Preview', () => { test('properly measures iframe and displays size', async () => { await page.goto(url.create) + await page.waitForURL(url.create) await page.locator('#field-title').fill('Title 3') await page.locator('#field-slug').fill('slug-3') await saveDocAndAssert(page) - await goToCollectionPreview(page) - await expect(() => expect(page.url()).toContain('/preview')).toPass({ - timeout: POLL_TOPASS_TIMEOUT, - }) - const iframe = page.locator('iframe') // Measure the actual iframe size and compare it with the inputs rendered in the toolbar @@ -222,17 +213,13 @@ describe('Live Preview', () => { test('resizes iframe to specified breakpoint', async () => { await page.goto(url.create) - await expect.poll(() => page.url(), { timeout: POLL_TOPASS_TIMEOUT }).toContain('create') + await page.waitForURL(url.create) await page.locator('#field-title').fill('Title 4') await page.locator('#field-slug').fill('slug-4') await saveDocAndAssert(page) await goToCollectionPreview(page) - await expect(() => expect(page.url()).toContain('/preview')).toPass({ - timeout: POLL_TOPASS_TIMEOUT, - }) - // Check that the breakpoint select is present const breakpointSelector = page.locator( '.live-preview-toolbar-controls__breakpoint button.popup-button', diff --git a/test/localization/e2e.spec.ts b/test/localization/e2e.spec.ts index 81c1bdb49c..b603d0b959 100644 --- a/test/localization/e2e.spec.ts +++ b/test/localization/e2e.spec.ts @@ -86,7 +86,7 @@ describe('Localization', () => { await fillValues({ description, title: spanishTitle }) await saveDocAndAssert(page) - await changeLocale(page, defaultLocale, true) + await changeLocale(page, defaultLocale) // Expect english title await expect(page.locator('#field-title')).toHaveValue(title) @@ -105,7 +105,7 @@ describe('Localization', () => { await saveDocAndAssert(page) // Change back to English - await changeLocale(page, defaultLocale, true) + await changeLocale(page, defaultLocale) // Localized field should not be populated await expect(page.locator('#field-title')).toBeEmpty() @@ -133,7 +133,7 @@ describe('Localization', () => { await saveDocAndAssert(page) // Change back to English - await changeLocale(page, defaultLocale, true) + await changeLocale(page, defaultLocale) // Localized field should not be populated await expect(page.locator('#field-title')).toBeEmpty() @@ -191,9 +191,9 @@ describe('Localization', () => { test('should duplicate localized checkbox correctly', async () => { await page.goto(url.create) - await page.waitForURL(`**${url.create}`) + await page.waitForURL(url.create) - //await changeLocale(page, defaultLocale, true) + await changeLocale(page, defaultLocale) await fillValues({ description, title: englishTitle }) await page.locator('#field-localizedCheckbox').click() @@ -207,7 +207,7 @@ describe('Localization', () => { await expect(page.locator('#field-localizedCheckbox')).not.toBeChecked() // duplicate doc - await changeLocale(page, defaultLocale, true) + await changeLocale(page, defaultLocale) await openDocControls(page) await page.locator('#action-duplicate').click() @@ -225,7 +225,7 @@ describe('Localization', () => { test('should duplicate even if missing some localized data', async () => { // create a localized required doc await page.goto(urlWithRequiredLocalizedFields.create) - await changeLocale(page, defaultLocale, true) + await changeLocale(page, defaultLocale) await page.locator('#field-title').fill(englishTitle) await page.locator('#field-layout .blocks-field__drawer-toggler').click() await page.locator('button[title="Text"]').click()