Partial fix for #9774. When `admin.disableListColumn` is set retroactively, it continues to appear in column state, but shouldn't. This was because the table column context was not refreshing after HMR runs, and would instead hold onto these stale columns until the page itself refreshes. Similarly, this was also a problem when the user had saved any of these columns to their list preferences, where those prefs would take precedence despite these properties being set on the underlying fields. The fix is to filter these columns from all requests that send them, and ensure local component state properly refreshes itself.
75 lines
1.9 KiB
TypeScript
75 lines
1.9 KiB
TypeScript
import type { Page } from '@playwright/test'
|
|
|
|
import { expect } from '@playwright/test'
|
|
|
|
import { exactText } from '../../helpers.js'
|
|
|
|
export const openListColumns = async (
|
|
page: Page,
|
|
{
|
|
togglerSelector = '.list-controls__toggle-columns',
|
|
columnContainerSelector = '.list-controls__columns',
|
|
}: {
|
|
columnContainerSelector?: string
|
|
togglerSelector?: string
|
|
},
|
|
): Promise<any> => {
|
|
const columnContainer = page.locator(columnContainerSelector).first()
|
|
const isAlreadyOpen = await columnContainer.isVisible()
|
|
|
|
if (!isAlreadyOpen) {
|
|
await page.locator(togglerSelector).first().click()
|
|
}
|
|
|
|
await expect(page.locator(`${columnContainerSelector}.rah-static--height-auto`)).toBeVisible()
|
|
|
|
return columnContainer
|
|
}
|
|
|
|
export const toggleColumn = async (
|
|
page: Page,
|
|
{
|
|
togglerSelector,
|
|
columnContainerSelector,
|
|
columnLabel,
|
|
targetState: targetStateFromArgs,
|
|
}: {
|
|
columnContainerSelector?: string
|
|
columnLabel: string
|
|
targetState?: 'off' | 'on'
|
|
togglerSelector?: string
|
|
},
|
|
): Promise<any> => {
|
|
const columnContainer = await openListColumns(page, { togglerSelector, columnContainerSelector })
|
|
|
|
const column = columnContainer.locator(`.column-selector .column-selector__column`, {
|
|
hasText: exactText(columnLabel),
|
|
})
|
|
|
|
const isActiveBeforeClick = await column.evaluate((el) =>
|
|
el.classList.contains('column-selector__column--active'),
|
|
)
|
|
|
|
const targetState =
|
|
targetStateFromArgs !== undefined ? targetStateFromArgs : isActiveBeforeClick ? 'off' : 'on'
|
|
|
|
await expect(column).toBeVisible()
|
|
|
|
if (
|
|
(isActiveBeforeClick && targetState === 'off') ||
|
|
(!isActiveBeforeClick && targetState === 'on')
|
|
) {
|
|
await column.click()
|
|
}
|
|
|
|
if (targetState === 'off') {
|
|
// no class
|
|
await expect(column).not.toHaveClass(/column-selector__column--active/)
|
|
} else {
|
|
// has class
|
|
await expect(column).toHaveClass(/column-selector__column--active/)
|
|
}
|
|
|
|
return column
|
|
}
|