tabshift/payload
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): unable to use browser back navigation after visiting list view (#11172)

Browse Source
This commit is contained in:
Jacob Fletcher
2025-02-14 07:47:00 -05:00
committed by GitHub
parent dd28959916
commit 0a3820a487
2 changed files with 13 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/ui/src/providers/ListQuery/index.tsx
View File

@@ -153,6 +153,7 @@ export const ListQueryProvider: React.FC<ListQueryProps> = ({
)
// If `defaultLimit` or `defaultSort` are updated externally, update the query
// I.e. when HMR runs, these properties may be different
useEffect(() => {
if (modifySearchParams) {
let shouldUpdateQueryString = false
@@ -173,7 +174,7 @@ export const ListQueryProvider: React.FC<ListQueryProps> = ({
if (shouldUpdateQueryString) {
setCurrentQuery(newQuery)
// Do not use router.replace here to avoid re-rendering on initial load
window.history.pushState(null, '', `?${qs.stringify(newQuery)}`)
window.history.replaceState(null, '', `?${qs.stringify(newQuery)}`)
}
}
}, [defaultSort, defaultLimit, router, modifySearchParams])

36
test/admin/e2e/general/e2e.spec.ts
View File

@@ -227,7 +227,6 @@ describe('General', () => {
describe('document meta', () => {
test('should render custom meta title from collection config', async () => {
await page.goto(customViewsURL.list)
await page.waitForURL(customViewsURL.list)
const pattern = new RegExp(`^${customCollectionMetaTitle}`)
await expect(page.title()).resolves.toMatch(pattern)
})
@@ -242,7 +241,6 @@ describe('General', () => {
await navigateToDoc(page, customViewsURL)
const versionsURL = `${page.url()}/versions`
await page.goto(versionsURL)
await page.waitForURL(versionsURL)
const pattern = new RegExp(`^${customVersionsTabMetaTitle}`)
await expect(page.title()).resolves.toMatch(pattern)
})
@@ -251,7 +249,6 @@ describe('General', () => {
await navigateToDoc(page, customViewsURL)
const customTabURL = `${page.url()}/custom-tab-view`
await page.goto(customTabURL)
await page.waitForURL(customTabURL)
const pattern = new RegExp(`^${customViewMetaTitle}`)
await expect(page.title()).resolves.toMatch(pattern)
})
@@ -260,7 +257,6 @@ describe('General', () => {
await navigateToDoc(page, customViewsURL)
const customTabURL = `${page.url()}${customTabViewPath}`
await page.goto(customTabURL)
await page.waitForURL(customTabURL)
const pattern = new RegExp(`^${customCollectionMetaTitle}`)
await expect(page.title()).resolves.toMatch(pattern)
})
@@ -270,10 +266,8 @@ describe('General', () => {
describe('theme', () => {
test('should render light theme by default', async () => {
await page.goto(postsUrl.admin)
await page.waitForURL(postsUrl.admin)
await expect(page.locator('html')).toHaveAttribute('data-theme', 'light')
await page.goto(`${postsUrl.admin}/account`)
await page.waitForURL(`${postsUrl.admin}/account`)
await expect(page.locator('#field-theme-auto')).toBeChecked()
await expect(page.locator('#field-theme-light')).not.toBeChecked()
await expect(page.locator('#field-theme-dark')).not.toBeChecked()
@@ -281,7 +275,6 @@ describe('General', () => {
test('should explicitly change to light theme', async () => {
await page.goto(`${postsUrl.admin}/account`)
await page.waitForURL(`${postsUrl.admin}/account`)
await page.locator('label[for="field-theme-light"]').click()
await expect(page.locator('#field-theme-auto')).not.toBeChecked()
await expect(page.locator('#field-theme-light')).toBeChecked()
@@ -294,7 +287,6 @@ describe('General', () => {
// go back to auto theme
await page.goto(`${postsUrl.admin}/account`)
await page.waitForURL(`${postsUrl.admin}/account`)
await page.locator('label[for="field-theme-auto"]').click()
await expect(page.locator('#field-theme-auto')).toBeChecked()
await expect(page.locator('#field-theme-light')).not.toBeChecked()
@@ -304,7 +296,6 @@ describe('General', () => {
test('should explicitly change to dark theme', async () => {
await page.goto(`${postsUrl.admin}/account`)
await page.waitForURL(`${postsUrl.admin}/account`)
await page.locator('label[for="field-theme-dark"]').click()
await expect(page.locator('#field-theme-auto')).not.toBeChecked()
await expect(page.locator('#field-theme-light')).not.toBeChecked()
@@ -317,7 +308,6 @@ describe('General', () => {
// go back to auto theme
await page.goto(`${postsUrl.admin}/account`)
await page.waitForURL(`${postsUrl.admin}/account`)
await page.locator('label[for="field-theme-auto"]').click()
await expect(page.locator('#field-theme-auto')).toBeChecked()
await expect(page.locator('#field-theme-light')).not.toBeChecked()
@@ -351,7 +341,6 @@ describe('General', () => {
describe('navigation', () => {
test('nav — should navigate to collection', async () => {
await page.goto(postsUrl.admin)
await page.waitForURL(postsUrl.admin)
await openNav(page)
const anchor = page.locator(`#nav-${postsCollectionSlug}`)
const anchorHref = await anchor.getAttribute('href')
@@ -361,7 +350,6 @@ describe('General', () => {
test('nav — should navigate to a global', async () => {
await page.goto(postsUrl.admin)
await page.waitForURL(postsUrl.admin)
await openNav(page)
const anchor = page.locator(`#nav-global-${globalSlug}`)
const anchorHref = await anchor.getAttribute('href')
@@ -371,7 +359,6 @@ describe('General', () => {
test('dashboard — should navigate to collection', async () => {
await page.goto(postsUrl.admin)
await page.waitForURL(postsUrl.admin)
const anchor = page.locator(`#card-${postsCollectionSlug} a.card__click`)
const anchorHref = await anchor.getAttribute('href')
await anchor.click()
@@ -380,7 +367,6 @@ describe('General', () => {
test('nav — should collapse and expand collection groups', async () => {
await page.goto(postsUrl.admin)
await page.waitForURL(postsUrl.admin)
await openNav(page)
const navGroup = page.locator('#nav-group-One .nav-group__toggle')
await expect(navGroup).toContainText('One')
@@ -407,7 +393,6 @@ describe('General', () => {
test('nav — should save group collapse preferences', async () => {
await page.goto(postsUrl.admin)
await page.waitForURL(postsUrl.admin)
await openNav(page)
await page.locator('#nav-group-One .nav-group__toggle').click()
const link = page.locator('#nav-group-one-collection-ones')
@@ -430,25 +415,33 @@ describe('General', () => {
await expect(collectionBreadcrumb).toHaveText(slugPluralLabel)
expect(page.url()).toContain(postsUrl.list)
})
test('should replace history when adding query params to the URL and not push a new entry', async () => {
await page.goto(postsUrl.admin)
await page.locator('.dashboard__card-list .card').first().click()
// wait for the search params to get injected into the URL
const escapedAdminURL = postsUrl.admin.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
const pattern = new RegExp(`${escapedAdminURL}/collections/[^?]+\\?limit=[^&]+`)
await expect.poll(() => page.url(), { timeout: POLL_TOPASS_TIMEOUT }).toMatch(pattern)
await page.goBack()
await expect.poll(() => page.url(), { timeout: POLL_TOPASS_TIMEOUT }).toMatch(postsUrl.admin)
})
})
describe('hidden entities', () => {
test('nav — should not show hidden collections and globals', async () => {
await page.goto(postsUrl.admin)
// nav menu
await expect(page.locator('#nav-hidden-collection')).toBeHidden()
await expect(page.locator('#nav-hidden-global')).toBeHidden()
})
test('dashboard — should not show hidden collections and globals', async () => {
await page.goto(postsUrl.admin)
// dashboard
await expect(page.locator('#card-hidden-collection')).toBeHidden()
await expect(page.locator('#card-hidden-global')).toBeHidden()
})
test('routing — should 404 on hidden collections and globals', async () => {
// routing
await page.goto(postsUrl.collection('hidden-collection'))
await expect(page.locator('.not-found')).toContainText('Nothing found')
await page.goto(postsUrl.global('hidden-global'))
@@ -457,20 +450,17 @@ describe('General', () => {
test('nav — should not show group: false collections and globals', async () => {
await page.goto(notInViewUrl.admin)
// nav menu
await expect(page.locator('#nav-not-in-view-collection')).toBeHidden()
await expect(page.locator('#nav-global-not-in-view-global')).toBeHidden()
})
test('dashboard — should not show group: false collections and globals', async () => {
await page.goto(notInViewUrl.admin)
// dashboard
await expect(page.locator('#card-not-in-view-collection')).toBeHidden()
await expect(page.locator('#card-not-in-view-global')).toBeHidden()
})
test('routing — should not 404 on group: false collections and globals', async () => {
// routing
await page.goto(notInViewUrl.collection('not-in-view-collection'))
await expect(page.locator('.list-header h1')).toContainText('Not In View Collections')
await page.goto(notInViewUrl.global('not-in-view-global'))
@@ -481,7 +471,6 @@ describe('General', () => {
describe('custom CSS', () => {
test('should see custom css in admin UI', async () => {
await page.goto(postsUrl.admin)
await page.waitForURL(postsUrl.admin)
await openNav(page)
const navControls = page.locator('#custom-css')
await expect(navControls).toHaveCSS('font-family', 'monospace')
@@ -507,7 +496,6 @@ describe('General', () => {
describe('custom root views', () => {
test('should render custom view', async () => {
await page.goto(`${serverURL}${adminRoutes.routes.admin}${customViewPath}`)
await page.waitForURL(`**${adminRoutes.routes.admin}${customViewPath}`)
await expect(page.locator('h1#custom-view-title')).toContainText(customViewTitle)
})
@@ -521,7 +509,6 @@ describe('General', () => {
test('should render public custom view', async () => {
await page.goto(`${serverURL}${adminRoutes.routes.admin}${publicCustomViewPath}`)
await page.waitForURL(`**${adminRoutes.routes.admin}${publicCustomViewPath}`)
await expect(page.locator('h1#custom-view-title')).toContainText(customViewTitle)
})
@@ -539,7 +526,6 @@ describe('General', () => {
await saveDocAndAssert(page)
await page.goto(`${serverURL}${adminRoutes.routes.admin}${protectedCustomNestedViewPath}`)
await page.waitForURL(`**${adminRoutes.routes.admin}${protectedCustomNestedViewPath}`)
await expect(page.locator('h1#custom-view-title')).toContainText(customNestedViewTitle)
})
})