test(core, desk): add tests for keyvalue storage (#6587)

* test(core): add tests for document list sort and display * test(structure): add test for inspect dialog * test(core): add tests for saved searches
sanity-io · May 7, 2024 · ab94bea · ab94bea
1 parent 379510f
commit ab94bea
Show file tree

Hide file tree

Showing 3 changed files with 246 additions and 125 deletions.
diff --git a/test/e2e/tests/desk/documentTypeListContextMenu.spec.ts b/test/e2e/tests/desk/documentTypeListContextMenu.spec.ts
@@ -1,77 +1,143 @@
+import {expect} from '@playwright/test'
 import {test} from '@sanity/test'
 
 const SORT_KEY = 'studio.structure-tool.sort-order.author'
+const CUSTOM_SORT_KEY = 'studio.structure-tool.sort-order.book'
 const LAYOUT_KEY = 'studio.structure-tool.layout.author'
 
 //we should also check for custom sort orders
-test('clicking sort order and direction sets value in storage', async ({page, sanityClient}) => {
+test('clicking default sort order and direction sets value in storage', async ({
+  page,
+  sanityClient,
+}) => {
   await page.goto('/test/content/author')
+
+  const existingKeys = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
+    uri: `/users/me/keyvalue/${SORT_KEY}`,
+    withCredentials: true,
+  })
+
+  // If the value is not null there are existingKeys, delete them in that case
+  if (existingKeys[0].value !== null) {
+    // Clear the sort order
+    await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
+      uri: `/users/me/keyvalue/${SORT_KEY}`,
+      withCredentials: true,
+      method: 'DELETE',
+    })
+  }
+
+  const keyValueRequest = page.waitForResponse(async (response) => {
+    return response.url().includes('/users/me/keyvalue') && response.request().method() === 'PUT'
+  })
   await page.getByTestId('pane').getByTestId('pane-context-menu-button').click()
   await page.getByRole('menuitem', {name: 'Sort by Name'}).click()
+  const responseBody = await (await keyValueRequest).json()
+
+  expect(responseBody[0]).toMatchObject({
+    key: SORT_KEY,
+    value: {
+      by: [{field: 'name', direction: 'asc'}],
+      extendedProjection: 'name',
+    },
+  })
+
+  const keyValueRequest2 = page.waitForResponse(async (response) => {
+    return response.url().includes('/users/me/keyvalue') && response.request().method() === 'PUT'
+  })
+  await page.getByTestId('pane').getByTestId('pane-context-menu-button').click()
+  await page.getByRole('menuitem', {name: 'Sort by Last Edited'}).click()
+  const responseBody2 = await (await keyValueRequest2).json()
 
-  /*
-   * The network proves to be a bit flaky for this in our CI environment. We will revisit this after release.
-   */
-  // await page.waitForTimeout(10000)
-  // const nameResult = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
-  //   uri: `/users/me/keyvalue/${SORT_KEY}`,
-  //   withCredentials: true,
-  // })
-
-  // expect(nameResult[0]).toMatchObject({
-  //   key: SORT_KEY,
-  //   value: {
-  //     by: [{field: 'name', direction: 'asc'}],
-  //     extendedProjection: 'name',
-  //   },
-  // })
-
-  // await page.getByTestId('pane').getByTestId('pane-context-menu-button').click()
-  // await page.getByRole('menuitem', {name: 'Sort by Last Edited'}).click()
-
-  // await page.waitForTimeout(10000)
-  // const lastEditedResult = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
-  //   uri: `/users/me/keyvalue/${SORT_KEY}`,
-  //   withCredentials: true,
-  // })
-
-  // expect(lastEditedResult[0]).toMatchObject({
-  //   key: SORT_KEY,
-  //   value: {
-  //     by: [{field: '_updatedAt', direction: 'desc'}],
-  //     extendedProjection: '',
-  //   },
-  // })
+  expect(responseBody2[0]).toMatchObject({
+    key: SORT_KEY,
+    value: {
+      by: [{field: '_updatedAt', direction: 'desc'}],
+      extendedProjection: '',
+    },
+  })
+})
+
+test('clicking custom sort order and direction sets value in storage', async ({
+  page,
+  sanityClient,
+}) => {
+  await page.goto('/test/content/book')
+
+  const existingKeys = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
+    uri: `/users/me/keyvalue/${CUSTOM_SORT_KEY}`,
+    withCredentials: true,
+  })
+
+  // If the value is not null there are existingKeys, delete them in that case
+  if (existingKeys[0].value !== null) {
+    // Clear the sort order
+    await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
+      uri: `/users/me/keyvalue/${CUSTOM_SORT_KEY}`,
+      withCredentials: true,
+      method: 'DELETE',
+    })
+  }
+
+  const keyValueRequest = page.waitForResponse(async (response) => {
+    return response.url().includes('/users/me/keyvalue') && response.request().method() === 'PUT'
+  })
+  await page.getByTestId('pane').getByTestId('pane-context-menu-button').click()
+  await page.getByRole('menuitem', {name: 'Sort by Title'}).click()
+  const responseBody = await (await keyValueRequest).json()
+
+  expect(responseBody[0]).toMatchObject({
+    key: CUSTOM_SORT_KEY,
+    value: {
+      // located in dev/test-studio/schema/book.ts
+      by: [
+        {field: 'title', direction: 'asc'},
+        {field: 'publicationYear', direction: 'asc'},
+      ],
+      extendedProjection: 'title, publicationYear',
+    },
+  })
 })
 
 test('clicking list view sets value in storage', async ({page, sanityClient}) => {
   await page.goto('/test/content/author')
+
+  const existingKeys = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
+    uri: `/users/me/keyvalue/${LAYOUT_KEY}`,
+    withCredentials: true,
+  })
+
+  // If the value is not null there are existingKeys, delete them in that case
+  if (existingKeys[0].value !== null) {
+    // Clear the sort order
+    await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
+      uri: `/users/me/keyvalue/${LAYOUT_KEY}`,
+      withCredentials: true,
+      method: 'DELETE',
+    })
+  }
+
+  const keyValueRequest = page.waitForResponse(async (response) => {
+    return response.url().includes('/users/me/keyvalue') && response.request().method() === 'PUT'
+  })
   await page.getByTestId('pane').getByTestId('pane-context-menu-button').click()
   await page.getByRole('menuitem', {name: 'Detailed view'}).click()
+  const responseBody = await (await keyValueRequest).json()
+
+  expect(responseBody[0]).toMatchObject({
+    key: LAYOUT_KEY,
+    value: 'detail',
+  })
+
+  const keyValueRequest2 = page.waitForResponse(async (response) => {
+    return response.url().includes('/users/me/keyvalue') && response.request().method() === 'PUT'
+  })
+  await page.getByTestId('pane').getByTestId('pane-context-menu-button').click()
+  await page.getByRole('menuitem', {name: 'Compact view'}).click()
+  const responseBody2 = await (await keyValueRequest2).json()
 
-  /*
-   * The network proves to be a bit flaky for this in our CI environment. We will revisit this after release.
-   */
-  // await page.waitForTimeout(10000)
-  // const detailResult = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
-  //   uri: `/users/me/keyvalue/${LAYOUT_KEY}`,
-  //   withCredentials: true,
-  // })
-  // expect(detailResult[0]).toMatchObject({
-  //   key: LAYOUT_KEY,
-  //   value: 'detail',
-  // })
-
-  // await page.getByTestId('pane').getByTestId('pane-context-menu-button').click()
-  // await page.getByRole('menuitem', {name: 'Compact view'}).click()
-
-  // await page.waitForTimeout(10000)
-  // const compactResult = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
-  //   uri: `/users/me/keyvalue/${LAYOUT_KEY}`,
-  //   withCredentials: true,
-  // })
-  // expect(compactResult[0]).toMatchObject({
-  //   key: LAYOUT_KEY,
-  //   value: 'default',
-  // })
+  expect(responseBody2[0]).toMatchObject({
+    key: LAYOUT_KEY,
+    value: 'default',
+  })
 })
diff --git a/test/e2e/tests/desk/inspectDialog.spec.ts b/test/e2e/tests/desk/inspectDialog.spec.ts
@@ -1,37 +1,32 @@
+import {expect} from '@playwright/test'
 import {test} from '@sanity/test'
 
 const INSPECT_KEY = 'studio.structure-tool.inspect-view-mode'
 
-test('clicking inspect mode sets value in storage', async ({
-  page,
-  sanityClient,
-  createDraftDocument,
-}) => {
+test('clicking inspect mode sets value in storage', async ({page, createDraftDocument}) => {
   await createDraftDocument('/test/content/book')
   await page.getByTestId('document-pane').getByTestId('pane-context-menu-button').click()
-  await page.getByRole('menuitem', {name: 'Inspect Ctrl Alt I'}).click()
+  await page.getByRole('menuitem', {name: /Inspect/i}).click()
 
+  const keyValueRequest = page.waitForResponse(async (response) => {
+    return response.url().includes('/users/me/keyvalue') && response.request().method() === 'PUT'
+  })
   await page.getByRole('tab', {name: 'Raw JSON'}).click()
-  /*
-   * The network proves to be a bit flaky for this in our CI environment. We will revisit this after release.
-   */
-  // const rawResult = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
-  //   uri: `/users/me/keyvalue/${INSPECT_KEY}`,
-  //   withCredentials: true,
-  // })
-  // expect(rawResult[0]).toMatchObject({
-  //   key: INSPECT_KEY,
-  //   value: 'raw',
-  // })
+  const responseBody = await (await keyValueRequest).json()
 
-  // await page.getByRole('tab', {name: 'Parsed'}).click()
-  // const parsedResult = await sanityClient.withConfig({apiVersion: '2024-03-12'}).request({
-  //   uri: `/users/me/keyvalue/${INSPECT_KEY}`,
-  //   withCredentials: true,
-  // })
+  expect(responseBody[0]).toMatchObject({
+    key: INSPECT_KEY,
+    value: 'raw',
+  })
 
-  // expect(parsedResult[0]).toMatchObject({
-  //   key: INSPECT_KEY,
-  //   value: 'parsed',
-  // })
+  const keyValueRequest2 = page.waitForResponse(async (response) => {
+    return response.url().includes('/users/me/keyvalue') && response.request().method() === 'PUT'
+  })
+  await page.getByRole('tab', {name: 'Parsed'}).click()
+  const responseBody2 = await (await keyValueRequest2).json()
+
+  expect(responseBody2[0]).toMatchObject({
+    key: INSPECT_KEY,
+    value: 'parsed',
+  })
 })