fix: access control test suite (#5548)

* chore: improve flakiness with access control test suite

* fix issue with redirecting from a drawer

* chore: watches for created id in drawers

---------

Co-authored-by: James <james@trbl.design>

.github/workflows/main.yml

@@ -217,7 +217,7 @@ jobs:
         # find test -type f -name 'e2e.spec.ts' | sort | xargs dirname | xargs -I {} basename {}
         suite:
           - _community
-          # - access-control
+          - access-control
           # - admin
           - auth
           - field-error-states

packages/next/src/views/Edit/Default/index.tsx

@@ -124,7 +124,7 @@ export const DefaultEditView: React.FC = () => {
         })
       }
 
-      if (!isEditing) {
+      if (!isEditing && depth < 2) {
         // Redirect to the same locale if it's been set
         const redirectRoute = `${adminRoute}/collections/${collectionSlug}/${json?.doc?.id}${locale ? `?locale=${locale}` : ''}`
         router.push(redirectRoute)
@@ -144,6 +144,7 @@ export const DefaultEditView: React.FC = () => {
       id,
       entitySlug,
       user,
+      depth,
       collectionSlug,
       getVersions,
       getDocPermissions,

packages/ui/src/elements/DocumentDrawer/DrawerContent.tsx

@@ -39,6 +39,7 @@ export const DocumentDrawerContent: React.FC<DocumentDrawerProps> = ({
   const { closeModal, modalState, toggleModal } = useModal()
   const locale = useLocale()
   const { t } = useTranslation()
+  const [createdID, setCreatedID] = useState()
   const [isOpen, setIsOpen] = useState(false)
   const [collectionConfig] = useRelatedCollections(collectionSlug)
   const { formQueryParams } = useFormQueryParams()
@@ -69,6 +70,7 @@ export const DocumentDrawerContent: React.FC<DocumentDrawerProps> = ({
 
   const onSave = useCallback<DocumentDrawerProps['onSave']>(
     (args) => {
+      setCreatedID(args.doc.id)
       if (typeof onSaveFromProps === 'function') {
         void onSaveFromProps({
           ...args,
@@ -113,7 +115,7 @@ export const DocumentDrawerContent: React.FC<DocumentDrawerProps> = ({
       // Same reason as above. We need to fully-fetch the docPreferences from the server. This is done in DocumentInfoProvider if we set it to null here.
       hasSavePermission={null}
       // isLoading,
-      id={id}
+      id={id || createdID}
       isEditing={isEditing}
       onLoadError={onLoadError}
       onSave={onSave}

test/access-control/e2e.spec.ts

@@ -17,6 +17,7 @@ import {
 } from '../helpers.js'
 import { AdminUrlUtil } from '../helpers/adminUrlUtil.js'
 import { initPayloadE2E } from '../helpers/initPayloadE2E.js'
+import { POLL_TOPASS_TIMEOUT } from '../playwright.config.js'
 import config from './config.js'
 import {
   docLevelAccessSlug,
@@ -258,8 +259,11 @@ describe('access control', () => {
   })
 
   // TODO: Test flakes. In CI, test global does not appear in nav. Perhaps the checkbox setValue is not triggered BEFORE the document is saved, as the custom save button can be clicked even if the form has not been set to modified.
-  test.skip('should show test global immediately after allowing access', async () => {
-    await page.goto(`${serverURL}/admin/globals/settings`)
+  test('should show test global immediately after allowing access', async () => {
+    const url = `${serverURL}/admin/globals/settings`
+    await page.goto(url)
+
+    await expect.poll(() => page.url(), { timeout: POLL_TOPASS_TIMEOUT }).toContain(url)
 
     await openNav(page)
 
@@ -278,8 +282,11 @@ describe('access control', () => {
 
     await openNav(page)
 
-    // Now test collection should appear in the menu.
-    await expect(page.locator('#nav-global-test')).toBeVisible()
+    const globalTest = page.locator('#nav-global-test')
+
+    await expect(async () => await globalTest.isVisible()).toPass({
+      timeout: POLL_TOPASS_TIMEOUT,
+    })
   })
 
   test('maintain access control in document drawer', async () => {

tsconfig.json

@@ -37,7 +37,7 @@
     ],
     "paths": {
       "@payload-config": [
-        "./test/versions/config.ts"
+        "./test/_community/config.ts"
       ],
       "@payloadcms/live-preview": [
         "./packages/live-preview/src"
@@ -160,4 +160,4 @@
     ".next/types/**/*.ts",
     "scripts/**/*.ts"
   ]
-}
+}