b8d7ccb4dc
Fixes #13653. Duplicating array rows causes phantom rows to appear. This is because when duplicate the row locally, we use inconsistent row IDs, e.g. the `array.rows[0].id` does not match its `array.0.id` counterpart. This causes form state to lose the reference to the existing row, which the server interprets as new row as of #13551. Before: https://github.com/user-attachments/assets/9f7efc59-ebd9-4fbb-b643-c22d4d3140a3 After: https://github.com/user-attachments/assets/188db823-4ee5-4757-8b89-751c8d978ad9 --- - To see the specific tasks where the Asana app for GitHub is being used, see below: - https://app.asana.com/0/0/1211210023936585
54 lines
1.8 KiB
TypeScript
54 lines
1.8 KiB
TypeScript
import type { Locator, Page } from 'playwright'
|
|
|
|
import { wait } from 'payload/shared'
|
|
import { expect } from 'playwright/test'
|
|
|
|
import { openArrayRowActions } from './openArrayRowActions.js'
|
|
|
|
/**
|
|
* Does not wait after adding the row for the row to appear and fully load in. Simply clicks the primary "Add Row" button and moves on.
|
|
*/
|
|
export const addArrayRowAsync = async (page: Page, fieldName: string) => {
|
|
await page.locator(`#field-${fieldName} > .array-field__add-row`).first().click()
|
|
}
|
|
|
|
/**
|
|
* Adds an array row to the end of the array using the primary "Add Row" button.
|
|
*/
|
|
export const addArrayRow = async (
|
|
page: Page,
|
|
{ fieldName }: Omit<Parameters<typeof openArrayRowActions>[1], 'rowIndex'>,
|
|
) => {
|
|
const rowLocator = page.locator(`#field-${fieldName} .array-field__row`)
|
|
const numberOfPrevRows = await rowLocator.count()
|
|
|
|
await addArrayRowAsync(page, fieldName)
|
|
|
|
expect(await rowLocator.count()).toBe(numberOfPrevRows + 1)
|
|
}
|
|
|
|
/**
|
|
* Like `addArrayRow`, but inserts the row at the specified index using the row actions menu.
|
|
*/
|
|
export const addArrayRowBelow = async (
|
|
page: Page,
|
|
{ fieldName, rowIndex = 0 }: Parameters<typeof openArrayRowActions>[1],
|
|
): Promise<{ popupContentLocator: Locator; rowActionsButtonLocator: Locator }> => {
|
|
const rowLocator = page.locator(`#field-${fieldName} .array-field__row`)
|
|
const numberOfPrevRows = await rowLocator.count()
|
|
|
|
const { popupContentLocator, rowActionsButtonLocator } = await openArrayRowActions(page, {
|
|
fieldName,
|
|
rowIndex,
|
|
})
|
|
|
|
await popupContentLocator.locator('.array-actions__action.array-actions__add').click()
|
|
|
|
await expect(rowLocator).toHaveCount(numberOfPrevRows + 1)
|
|
|
|
// TODO: test the array row has appeared in the _correct position_ (immediately below the original row)
|
|
await wait(300)
|
|
|
|
return { popupContentLocator, rowActionsButtonLocator }
|
|
}
|