Adds a new property to the config that enables the Select API in the
list view. This is a performance opt-in, where only the active columns
(and those specified in `forceSelect`) are queried. This can greatly
improve performance, especially for collections with large documents or
many fields.
To enable this, use the `admin.enableListViewSelectAPI` in your
Collection Config:
```ts
import type { CollectionConfig } from 'payload'
export const Posts: CollectionConfig = {
// ...
admin: {
enableListViewSelectAPI: true // This will select only the active columns (and any `forceSelect` fields)
}
}
```
Note: The `enableListViewSelectAPI` property is currently labeled as
experimental, as it will likely become the default behavior in v4 and be
deprecated. The reason it cannot be the default now is because cells or
other components may be relying on fully populated data, which will no
longer be the case when using `select`.
For example, if your component relies on a "title" field, this field
will _**not**_ exist if the column is **_inactive_**:
```ts
import type { CollectionConfig } from 'payload'
export const Posts: CollectionConfig = {
// ...
fields: [
// ...
{
name: 'myField',
type: 'text',
hooks: {
afterRead: [
({ doc }) => doc.title // `title` will only be populated if the column is active
]
}
}
]
}
```
There are other cases that might be affected by this change as well, for
example any components relying on the `data` object returned by the
`useListQuery()` hook:
```ts
'use client'
export const MyComponent = () => {
const { data } = useListQuery() // `data.docs` will only contain fields that are selected
// ...
}
```
To ensure title is always present, you will need to add that field to
the `forceSelect` property in your Collection Config:
```ts
import type { CollectionConfig } from 'payload'
export const Posts: CollectionConfig = {
// ...
forceSelect: {
title: true
}
}
```
---
- To see the specific tasks where the Asana app for GitHub is being
used, see below:
- https://app.asana.com/0/0/1211248751470559
57 lines
1.7 KiB
TypeScript
57 lines
1.7 KiB
TypeScript
import type { Page } from '@playwright/test'
|
|
|
|
import { expect } from '@playwright/test'
|
|
|
|
/**
|
|
* A helper function to assert the body of a network request.
|
|
* This is useful for reading the body of a request and testing whether it is correct.
|
|
* For example, if you have a form that submits data to an API, you can use this function to
|
|
* assert that the data being sent is correct.
|
|
* @param page The Playwright page
|
|
* @param options Options
|
|
* @param options.action The action to perform that will trigger the request
|
|
* @param options.expect A function to run after the request is made to assert the request body
|
|
* @returns The request body
|
|
* @example
|
|
* const requestBody = await assertRequestBody(page, {
|
|
* action: page.click('button'),
|
|
* expect: (requestBody) => expect(requestBody.foo).toBe('bar')
|
|
* })
|
|
*/
|
|
export const assertRequestBody = async <T>(
|
|
page: Page,
|
|
options: {
|
|
action: () => Promise<void> | void
|
|
expect?: (
|
|
requestBody: T,
|
|
requestHeaders: {
|
|
[key: string]: string
|
|
},
|
|
) => boolean | Promise<boolean>
|
|
requestMethod?: string
|
|
url: string
|
|
},
|
|
): Promise<T | undefined> => {
|
|
const [request] = await Promise.all([
|
|
page.waitForRequest((request) =>
|
|
Boolean(
|
|
request.url().startsWith(options.url) &&
|
|
(request.method() === options.requestMethod || 'POST'),
|
|
),
|
|
),
|
|
await options.action(),
|
|
])
|
|
|
|
const requestBody = request.postData()
|
|
|
|
if (typeof requestBody === 'string') {
|
|
const parsedBody = JSON.parse(requestBody) as T
|
|
|
|
if (typeof options.expect === 'function') {
|
|
expect(await options.expect(parsedBody, request.headers())).toBeTruthy()
|
|
}
|
|
|
|
return parsedBody
|
|
}
|
|
}
|