chore: brings back tests from has many PR (#7917)
This commit is contained in:
Jarrod Flesch
@@ -141,13 +141,14 @@ export function UploadInput(props: UploadInputProps) {
|
||||
}
|
||||
}, [value, activeRelationTo, filterOptionsFromProps])
|
||||
|
||||
const [ListDrawer, ListDrawerToggler, { closeDrawer: closeListDrawer }] = useListDrawer({
|
||||
collectionSlugs: typeof relationTo === 'string' ? [relationTo] : relationTo,
|
||||
filterOptions,
|
||||
})
|
||||
const [ListDrawer, , { closeDrawer: closeListDrawer, openDrawer: openListDrawer }] =
|
||||
useListDrawer({
|
||||
collectionSlugs: typeof relationTo === 'string' ? [relationTo] : relationTo,
|
||||
filterOptions,
|
||||
})
|
||||
const [
|
||||
CreateDocDrawer,
|
||||
_,
|
||||
,
|
||||
{ closeDrawer: closeCreateDocDrawer, openDrawer: openCreateDocDrawer },
|
||||
] = useDocumentDrawer({
|
||||
collectionSlug: activeRelationTo,
|
||||
@@ -412,6 +413,7 @@ export function UploadInput(props: UploadInputProps) {
|
||||
]
|
||||
.filter(Boolean)
|
||||
.join(' ')}
|
||||
id={`field-${path.replace(/\./g, '__')}`}
|
||||
style={{
|
||||
...style,
|
||||
width,
|
||||
@@ -476,6 +478,7 @@ export function UploadInput(props: UploadInputProps) {
|
||||
<div className={`${baseClass}__dropzoneContent__buttons`}>
|
||||
<Button
|
||||
buttonStyle="pill"
|
||||
className={`${baseClass}__createNewToggler`}
|
||||
disabled={readOnly || !canCreate}
|
||||
onClick={() => {
|
||||
if (!readOnly) {
|
||||
@@ -491,11 +494,16 @@ export function UploadInput(props: UploadInputProps) {
|
||||
{t('general:createNew')}
|
||||
</Button>
|
||||
<span className={`${baseClass}__dropzoneContent__orText`}>{t('general:or')}</span>
|
||||
<ListDrawerToggler className={`${baseClass}__toggler`} disabled={readOnly}>
|
||||
<Button buttonStyle="pill" el="span" size="small">
|
||||
{t('fields:chooseFromExisting')}
|
||||
</Button>
|
||||
</ListDrawerToggler>
|
||||
<Button
|
||||
buttonStyle="pill"
|
||||
className={`${baseClass}__listToggler`}
|
||||
disabled={readOnly}
|
||||
el="span"
|
||||
onClick={openListDrawer}
|
||||
size="small"
|
||||
>
|
||||
{t('fields:chooseFromExisting')}
|
||||
</Button>
|
||||
|
||||
<CreateDocDrawer onSave={onDocCreate} />
|
||||
<ListDrawer
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
.uploadDocRelationshipContent {
|
||||
.upload-relationship-details {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@@ -25,11 +25,14 @@
|
||||
margin-right: calc(var(--base)* 2);
|
||||
}
|
||||
|
||||
&__title {
|
||||
&__filename {
|
||||
margin: 0;
|
||||
text-wrap: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
&__meta {
|
||||
|
||||
@@ -8,7 +8,7 @@ import { useDocumentDrawer } from '../../../elements/DocumentDrawer/index.js'
|
||||
import { ThumbnailComponent } from '../../../elements/Thumbnail/index.js'
|
||||
import './index.scss'
|
||||
|
||||
const baseClass = 'uploadDocRelationshipContent'
|
||||
const baseClass = 'upload-relationship-details'
|
||||
|
||||
type Props = {
|
||||
readonly allowEdit?: boolean
|
||||
@@ -79,7 +79,11 @@ export function RelationshipContent(props: Props) {
|
||||
size="small"
|
||||
/>
|
||||
<div className={`${baseClass}__details`}>
|
||||
<p className={`${baseClass}__title`}>{filename}</p>
|
||||
<p className={`${baseClass}__filename`}>
|
||||
<a href={src} target="_blank">
|
||||
{filename}
|
||||
</a>
|
||||
</p>
|
||||
{withMeta ? <p className={`${baseClass}__meta`}>{metaText}</p> : null}
|
||||
</div>
|
||||
</div>
|
||||
@@ -87,12 +91,18 @@ export function RelationshipContent(props: Props) {
|
||||
{allowEdit !== false || allowRemove !== false ? (
|
||||
<div className={`${baseClass}__actions`}>
|
||||
{allowEdit !== false ? (
|
||||
<Button buttonStyle="icon-label" icon="edit" iconStyle="none" onClick={openDrawer} />
|
||||
<Button
|
||||
buttonStyle="icon-label"
|
||||
className={`${baseClass}__edit`}
|
||||
icon="edit"
|
||||
iconStyle="none"
|
||||
onClick={openDrawer}
|
||||
/>
|
||||
) : null}
|
||||
{allowRemove !== false ? (
|
||||
<Button
|
||||
buttonStyle="icon-label"
|
||||
className={`${baseClass}__button`}
|
||||
className={`${baseClass}__remove`}
|
||||
icon="x"
|
||||
iconStyle="none"
|
||||
onClick={() => onRemove()}
|
||||
|
||||
@@ -46,6 +46,7 @@ export function UploadComponent(props: UploadFieldProps) {
|
||||
filterOptions,
|
||||
formInitializing,
|
||||
formProcessing,
|
||||
path,
|
||||
readOnly: readOnlyFromField,
|
||||
setValue,
|
||||
showError,
|
||||
@@ -71,7 +72,7 @@ export function UploadComponent(props: UploadFieldProps) {
|
||||
label={label}
|
||||
maxRows={maxRows}
|
||||
onChange={setValue}
|
||||
path={_path}
|
||||
path={path}
|
||||
readOnly={disabled}
|
||||
relationTo={relationTo}
|
||||
required={required}
|
||||
|
||||
@@ -469,214 +469,222 @@ describe('lexicalBlocks', () => {
|
||||
})
|
||||
|
||||
// Big test which tests a bunch of things: Creation of blocks via slash commands, creation of deeply nested sub-lexical-block fields via slash commands, properly populated deeply nested fields within those
|
||||
// test('ensure creation of a lexical, lexical-field-block, which contains another lexical, lexical-and-upload-field-block, works and that the sub-upload field is properly populated', async () => {
|
||||
// await navigateToLexicalFields()
|
||||
// const richTextField = page.locator('.rich-text-lexical').nth(1) // second
|
||||
// await richTextField.scrollIntoViewIfNeeded()
|
||||
// await expect(richTextField).toBeVisible()
|
||||
test('ensure creation of a lexical, lexical-field-block, which contains another lexical, lexical-and-upload-field-block, works and that the sub-upload field is properly populated', async () => {
|
||||
await navigateToLexicalFields()
|
||||
const richTextField = page.locator('.rich-text-lexical').nth(1) // second
|
||||
await richTextField.scrollIntoViewIfNeeded()
|
||||
await expect(richTextField).toBeVisible()
|
||||
|
||||
// const lastParagraph = richTextField.locator('p').last()
|
||||
// await lastParagraph.scrollIntoViewIfNeeded()
|
||||
// await expect(lastParagraph).toBeVisible()
|
||||
const lastParagraph = richTextField.locator('p').last()
|
||||
await lastParagraph.scrollIntoViewIfNeeded()
|
||||
await expect(lastParagraph).toBeVisible()
|
||||
|
||||
// /**
|
||||
// * Create new sub-block
|
||||
// */
|
||||
// // type / to open the slash menu
|
||||
// await lastParagraph.click()
|
||||
// await page.keyboard.press('/')
|
||||
// await page.keyboard.type('Rich')
|
||||
/**
|
||||
* Create new sub-block
|
||||
*/
|
||||
// type / to open the slash menu
|
||||
await lastParagraph.click()
|
||||
await page.keyboard.press('/')
|
||||
await page.keyboard.type('Rich')
|
||||
|
||||
// // Create Rich Text Block
|
||||
// const slashMenuPopover = page.locator('#slash-menu .slash-menu-popup')
|
||||
// await expect(slashMenuPopover).toBeVisible()
|
||||
// Create Rich Text Block
|
||||
const slashMenuPopover = page.locator('#slash-menu .slash-menu-popup')
|
||||
await expect(slashMenuPopover).toBeVisible()
|
||||
|
||||
// // Click 1. Button and ensure it's the Rich Text block creation button (it should be! Otherwise, sorting wouldn't work)
|
||||
// const richTextBlockSelectButton = slashMenuPopover.locator('button').first()
|
||||
// await expect(richTextBlockSelectButton).toBeVisible()
|
||||
// await expect(richTextBlockSelectButton).toContainText('Rich Text')
|
||||
// await richTextBlockSelectButton.click()
|
||||
// await expect(slashMenuPopover).toBeHidden()
|
||||
// Click 1. Button and ensure it's the Rich Text block creation button (it should be! Otherwise, sorting wouldn't work)
|
||||
const richTextBlockSelectButton = slashMenuPopover.locator('button').first()
|
||||
await expect(richTextBlockSelectButton).toBeVisible()
|
||||
await expect(richTextBlockSelectButton).toContainText('Rich Text')
|
||||
await richTextBlockSelectButton.click()
|
||||
await expect(slashMenuPopover).toBeHidden()
|
||||
|
||||
// const newRichTextBlock = richTextField
|
||||
// .locator('.lexical-block:not(.lexical-block .lexical-block)')
|
||||
// .nth(8) // The :not(.lexical-block .lexical-block) makes sure this does not select sub-blocks
|
||||
// await newRichTextBlock.scrollIntoViewIfNeeded()
|
||||
// await expect(newRichTextBlock).toBeVisible()
|
||||
const newRichTextBlock = richTextField
|
||||
.locator('.lexical-block:not(.lexical-block .lexical-block)')
|
||||
.nth(8) // The :not(.lexical-block .lexical-block) makes sure this does not select sub-blocks
|
||||
await newRichTextBlock.scrollIntoViewIfNeeded()
|
||||
await expect(newRichTextBlock).toBeVisible()
|
||||
|
||||
// // Ensure that sub-editor is empty
|
||||
// const newRichTextEditorParagraph = newRichTextBlock.locator('p').first()
|
||||
// await expect(newRichTextEditorParagraph).toBeVisible()
|
||||
// await expect(newRichTextEditorParagraph).toHaveText('')
|
||||
// Ensure that sub-editor is empty
|
||||
const newRichTextEditorParagraph = newRichTextBlock.locator('p').first()
|
||||
await expect(newRichTextEditorParagraph).toBeVisible()
|
||||
await expect(newRichTextEditorParagraph).toHaveText('')
|
||||
|
||||
// await newRichTextEditorParagraph.click()
|
||||
// await page.keyboard.press('/')
|
||||
// await page.keyboard.type('Lexical')
|
||||
// await expect(slashMenuPopover).toBeVisible()
|
||||
// // Click 1. Button and ensure it's the Lexical And Upload block creation button (it should be! Otherwise, sorting wouldn't work)
|
||||
// const lexicalAndUploadBlockSelectButton = slashMenuPopover.locator('button').first()
|
||||
// await expect(lexicalAndUploadBlockSelectButton).toBeVisible()
|
||||
// await expect(lexicalAndUploadBlockSelectButton).toContainText('Lexical And Upload')
|
||||
// await lexicalAndUploadBlockSelectButton.click()
|
||||
// await expect(slashMenuPopover).toBeHidden()
|
||||
await newRichTextEditorParagraph.click()
|
||||
await page.keyboard.press('/')
|
||||
await page.keyboard.type('Lexical')
|
||||
await expect(slashMenuPopover).toBeVisible()
|
||||
// Click 1. Button and ensure it's the Lexical And Upload block creation button (it should be! Otherwise, sorting wouldn't work)
|
||||
const lexicalAndUploadBlockSelectButton = slashMenuPopover.locator('button').first()
|
||||
await expect(lexicalAndUploadBlockSelectButton).toBeVisible()
|
||||
await expect(lexicalAndUploadBlockSelectButton).toContainText('Lexical And Upload')
|
||||
await lexicalAndUploadBlockSelectButton.click()
|
||||
await expect(slashMenuPopover).toBeHidden()
|
||||
|
||||
// // Ensure that sub-editor is created
|
||||
// const newSubLexicalAndUploadBlock = newRichTextBlock.locator('.lexical-block').first()
|
||||
// await newSubLexicalAndUploadBlock.scrollIntoViewIfNeeded()
|
||||
// await expect(newSubLexicalAndUploadBlock).toBeVisible()
|
||||
// Ensure that sub-editor is created
|
||||
const newSubLexicalAndUploadBlock = newRichTextBlock.locator('.lexical-block').first()
|
||||
await newSubLexicalAndUploadBlock.scrollIntoViewIfNeeded()
|
||||
await expect(newSubLexicalAndUploadBlock).toBeVisible()
|
||||
|
||||
// // Type in newSubLexicalAndUploadBlock
|
||||
// const paragraphInSubEditor = newSubLexicalAndUploadBlock.locator('p').first()
|
||||
// await expect(paragraphInSubEditor).toBeVisible()
|
||||
// await paragraphInSubEditor.click()
|
||||
// await page.keyboard.type('Some subText')
|
||||
// Type in newSubLexicalAndUploadBlock
|
||||
const paragraphInSubEditor = newSubLexicalAndUploadBlock.locator('p').first()
|
||||
await expect(paragraphInSubEditor).toBeVisible()
|
||||
await paragraphInSubEditor.click()
|
||||
await page.keyboard.type('Some subText')
|
||||
|
||||
// // Upload something
|
||||
// await expect(async () => {
|
||||
// const chooseExistingUploadButton = newSubLexicalAndUploadBlock
|
||||
// .locator('.upload__toggler.list-drawer__toggler')
|
||||
// .first()
|
||||
// await wait(300)
|
||||
// await expect(chooseExistingUploadButton).toBeVisible()
|
||||
// await wait(300)
|
||||
// await chooseExistingUploadButton.click()
|
||||
// await wait(500) // wait for drawer form state to initialize (it's a flake)
|
||||
// const uploadListDrawer = page.locator('dialog[id^=list-drawer_1_]').first() // IDs starting with list-drawer_1_ (there's some other symbol after the underscore)
|
||||
// await expect(uploadListDrawer).toBeVisible()
|
||||
// await wait(300)
|
||||
// Upload something
|
||||
await expect(async () => {
|
||||
const chooseExistingUploadButton = newSubLexicalAndUploadBlock
|
||||
.locator('.upload__listToggler')
|
||||
.first()
|
||||
await wait(300)
|
||||
await expect(chooseExistingUploadButton).toBeVisible()
|
||||
await wait(300)
|
||||
await chooseExistingUploadButton.click()
|
||||
await wait(500) // wait for drawer form state to initialize (it's a flake)
|
||||
const uploadListDrawer = page.locator('dialog[id^=list-drawer_1_]').first() // IDs starting with list-drawer_1_ (there's some other symbol after the underscore)
|
||||
await expect(uploadListDrawer).toBeVisible()
|
||||
await wait(300)
|
||||
|
||||
// // find button which has a span with text "payload.jpg" and click it in playwright
|
||||
// const uploadButton = uploadListDrawer.locator('button').getByText('payload.jpg').first()
|
||||
// await expect(uploadButton).toBeVisible()
|
||||
// await wait(300)
|
||||
// await uploadButton.click()
|
||||
// await wait(300)
|
||||
// await expect(uploadListDrawer).toBeHidden()
|
||||
// // Check if the upload is there
|
||||
// await expect(
|
||||
// newSubLexicalAndUploadBlock.locator('.field-type.upload .file-meta__url a'),
|
||||
// ).toHaveText('payload.jpg')
|
||||
// }).toPass({
|
||||
// timeout: POLL_TOPASS_TIMEOUT,
|
||||
// })
|
||||
// find button which has a span with text "payload.jpg" and click it in playwright
|
||||
const uploadButton = uploadListDrawer.locator('button').getByText('payload.jpg').first()
|
||||
await expect(uploadButton).toBeVisible()
|
||||
await wait(300)
|
||||
await uploadButton.click()
|
||||
await wait(300)
|
||||
await expect(uploadListDrawer).toBeHidden()
|
||||
// Check if the upload is there
|
||||
await expect(
|
||||
newSubLexicalAndUploadBlock.locator(
|
||||
'.field-type.upload .upload-relationship-details__filename a',
|
||||
),
|
||||
).toHaveText('payload.jpg')
|
||||
}).toPass({
|
||||
timeout: POLL_TOPASS_TIMEOUT,
|
||||
})
|
||||
|
||||
// await wait(300)
|
||||
await wait(300)
|
||||
|
||||
// // save document and assert
|
||||
// await saveDocAndAssert(page)
|
||||
// await wait(300)
|
||||
// save document and assert
|
||||
await saveDocAndAssert(page)
|
||||
await wait(300)
|
||||
|
||||
// await expect(
|
||||
// newSubLexicalAndUploadBlock.locator('.field-type.upload .file-meta__url a'),
|
||||
// ).toHaveText('payload.jpg')
|
||||
// await expect(paragraphInSubEditor).toHaveText('Some subText')
|
||||
// await wait(300)
|
||||
await expect(
|
||||
newSubLexicalAndUploadBlock.locator(
|
||||
'.field-type.upload .upload-relationship-details__filename a',
|
||||
),
|
||||
).toHaveText('payload.jpg')
|
||||
await expect(paragraphInSubEditor).toHaveText('Some subText')
|
||||
await wait(300)
|
||||
|
||||
// // reload page and assert again
|
||||
// await page.reload()
|
||||
// await wait(300)
|
||||
// await newSubLexicalAndUploadBlock.scrollIntoViewIfNeeded()
|
||||
// await expect(newSubLexicalAndUploadBlock).toBeVisible()
|
||||
// await newSubLexicalAndUploadBlock
|
||||
// .locator('.field-type.upload .file-meta__url a')
|
||||
// .scrollIntoViewIfNeeded()
|
||||
// await expect(
|
||||
// newSubLexicalAndUploadBlock.locator('.field-type.upload .file-meta__url a'),
|
||||
// ).toBeVisible()
|
||||
// reload page and assert again
|
||||
await page.reload()
|
||||
await wait(300)
|
||||
await newSubLexicalAndUploadBlock.scrollIntoViewIfNeeded()
|
||||
await expect(newSubLexicalAndUploadBlock).toBeVisible()
|
||||
await newSubLexicalAndUploadBlock
|
||||
.locator('.field-type.upload .upload-relationship-details__filename a')
|
||||
.scrollIntoViewIfNeeded()
|
||||
await expect(
|
||||
newSubLexicalAndUploadBlock.locator(
|
||||
'.field-type.upload .upload-relationship-details__filename a',
|
||||
),
|
||||
).toBeVisible()
|
||||
|
||||
// await expect(
|
||||
// newSubLexicalAndUploadBlock.locator('.field-type.upload .file-meta__url a'),
|
||||
// ).toHaveText('payload.jpg')
|
||||
// await expect(paragraphInSubEditor).toHaveText('Some subText')
|
||||
await expect(
|
||||
newSubLexicalAndUploadBlock.locator(
|
||||
'.field-type.upload .upload-relationship-details__filename a',
|
||||
),
|
||||
).toHaveText('payload.jpg')
|
||||
await expect(paragraphInSubEditor).toHaveText('Some subText')
|
||||
|
||||
// // Check if the API result is populated correctly - Depth 0
|
||||
// await expect(async () => {
|
||||
// const lexicalDoc: LexicalField = (
|
||||
// await payload.find({
|
||||
// collection: lexicalFieldsSlug,
|
||||
// depth: 0,
|
||||
// overrideAccess: true,
|
||||
// where: {
|
||||
// title: {
|
||||
// equals: lexicalDocData.title,
|
||||
// },
|
||||
// },
|
||||
// })
|
||||
// ).docs[0] as never
|
||||
// Check if the API result is populated correctly - Depth 0
|
||||
await expect(async () => {
|
||||
const lexicalDoc: LexicalField = (
|
||||
await payload.find({
|
||||
collection: lexicalFieldsSlug,
|
||||
depth: 0,
|
||||
overrideAccess: true,
|
||||
where: {
|
||||
title: {
|
||||
equals: lexicalDocData.title,
|
||||
},
|
||||
},
|
||||
})
|
||||
).docs[0] as never
|
||||
|
||||
// const uploadDoc: Upload = (
|
||||
// await payload.find({
|
||||
// collection: 'uploads',
|
||||
// depth: 0,
|
||||
// overrideAccess: true,
|
||||
// where: {
|
||||
// filename: {
|
||||
// equals: 'payload.jpg',
|
||||
// },
|
||||
// },
|
||||
// })
|
||||
// ).docs[0] as never
|
||||
const uploadDoc: Upload = (
|
||||
await payload.find({
|
||||
collection: 'uploads',
|
||||
depth: 0,
|
||||
overrideAccess: true,
|
||||
where: {
|
||||
filename: {
|
||||
equals: 'payload.jpg',
|
||||
},
|
||||
},
|
||||
})
|
||||
).docs[0] as never
|
||||
|
||||
// const lexicalField: SerializedEditorState = lexicalDoc.lexicalWithBlocks
|
||||
// const richTextBlock: SerializedBlockNode = lexicalField.root
|
||||
// .children[13] as SerializedBlockNode
|
||||
// const subRichTextBlock: SerializedBlockNode = richTextBlock.fields.richTextField.root
|
||||
// .children[1] as SerializedBlockNode // index 0 and 2 are paragraphs created by default around the block node when a new block is added via slash command
|
||||
const lexicalField: SerializedEditorState = lexicalDoc.lexicalWithBlocks
|
||||
const richTextBlock: SerializedBlockNode = lexicalField.root
|
||||
.children[13] as SerializedBlockNode
|
||||
const subRichTextBlock: SerializedBlockNode = richTextBlock.fields.richTextField.root
|
||||
.children[1] as SerializedBlockNode // index 0 and 2 are paragraphs created by default around the block node when a new block is added via slash command
|
||||
|
||||
// const subSubRichTextField = subRichTextBlock.fields.subRichTextField
|
||||
// const subSubUploadField = subRichTextBlock.fields.subUploadField
|
||||
const subSubRichTextField = subRichTextBlock.fields.subRichTextField
|
||||
const subSubUploadField = subRichTextBlock.fields.subUploadField
|
||||
|
||||
// expect(subSubRichTextField.root.children[0].children[0].text).toBe('Some subText')
|
||||
// expect(subSubUploadField).toBe(uploadDoc.id)
|
||||
// }).toPass({
|
||||
// timeout: POLL_TOPASS_TIMEOUT,
|
||||
// })
|
||||
expect(subSubRichTextField.root.children[0].children[0].text).toBe('Some subText')
|
||||
expect(subSubUploadField).toBe(uploadDoc.id)
|
||||
}).toPass({
|
||||
timeout: POLL_TOPASS_TIMEOUT,
|
||||
})
|
||||
|
||||
// // Check if the API result is populated correctly - Depth 1
|
||||
// await expect(async () => {
|
||||
// // Now with depth 1
|
||||
// const lexicalDocDepth1: LexicalField = (
|
||||
// await payload.find({
|
||||
// collection: lexicalFieldsSlug,
|
||||
// depth: 1,
|
||||
// overrideAccess: true,
|
||||
// where: {
|
||||
// title: {
|
||||
// equals: lexicalDocData.title,
|
||||
// },
|
||||
// },
|
||||
// })
|
||||
// ).docs[0] as never
|
||||
// Check if the API result is populated correctly - Depth 1
|
||||
await expect(async () => {
|
||||
// Now with depth 1
|
||||
const lexicalDocDepth1: LexicalField = (
|
||||
await payload.find({
|
||||
collection: lexicalFieldsSlug,
|
||||
depth: 1,
|
||||
overrideAccess: true,
|
||||
where: {
|
||||
title: {
|
||||
equals: lexicalDocData.title,
|
||||
},
|
||||
},
|
||||
})
|
||||
).docs[0] as never
|
||||
|
||||
// const uploadDoc: Upload = (
|
||||
// await payload.find({
|
||||
// collection: 'uploads',
|
||||
// depth: 0,
|
||||
// overrideAccess: true,
|
||||
// where: {
|
||||
// filename: {
|
||||
// equals: 'payload.jpg',
|
||||
// },
|
||||
// },
|
||||
// })
|
||||
// ).docs[0] as never
|
||||
const uploadDoc: Upload = (
|
||||
await payload.find({
|
||||
collection: 'uploads',
|
||||
depth: 0,
|
||||
overrideAccess: true,
|
||||
where: {
|
||||
filename: {
|
||||
equals: 'payload.jpg',
|
||||
},
|
||||
},
|
||||
})
|
||||
).docs[0] as never
|
||||
|
||||
// const lexicalField2: SerializedEditorState = lexicalDocDepth1.lexicalWithBlocks
|
||||
// const richTextBlock2: SerializedBlockNode = lexicalField2.root
|
||||
// .children[13] as SerializedBlockNode
|
||||
// const subRichTextBlock2: SerializedBlockNode = richTextBlock2.fields.richTextField.root
|
||||
// .children[1] as SerializedBlockNode // index 0 and 2 are paragraphs created by default around the block node when a new block is added via slash command
|
||||
const lexicalField2: SerializedEditorState = lexicalDocDepth1.lexicalWithBlocks
|
||||
const richTextBlock2: SerializedBlockNode = lexicalField2.root
|
||||
.children[13] as SerializedBlockNode
|
||||
const subRichTextBlock2: SerializedBlockNode = richTextBlock2.fields.richTextField.root
|
||||
.children[1] as SerializedBlockNode // index 0 and 2 are paragraphs created by default around the block node when a new block is added via slash command
|
||||
|
||||
// const subSubRichTextField2 = subRichTextBlock2.fields.subRichTextField
|
||||
// const subSubUploadField2 = subRichTextBlock2.fields.subUploadField
|
||||
const subSubRichTextField2 = subRichTextBlock2.fields.subRichTextField
|
||||
const subSubUploadField2 = subRichTextBlock2.fields.subUploadField
|
||||
|
||||
// expect(subSubRichTextField2.root.children[0].children[0].text).toBe('Some subText')
|
||||
// expect(subSubUploadField2.id).toBe(uploadDoc.id)
|
||||
// expect(subSubUploadField2.filename).toBe(uploadDoc.filename)
|
||||
// }).toPass({
|
||||
// timeout: POLL_TOPASS_TIMEOUT,
|
||||
// })
|
||||
// })
|
||||
expect(subSubRichTextField2.root.children[0].children[0].text).toBe('Some subText')
|
||||
expect(subSubUploadField2.id).toBe(uploadDoc.id)
|
||||
expect(subSubUploadField2.filename).toBe(uploadDoc.filename)
|
||||
}).toPass({
|
||||
timeout: POLL_TOPASS_TIMEOUT,
|
||||
})
|
||||
})
|
||||
|
||||
test('should allow changing values of two different radio button blocks independently', async () => {
|
||||
// This test ensures that https://github.com/payloadcms/payload/issues/3911 does not happen again
|
||||
|
||||
@@ -85,33 +85,33 @@ describe('Upload', () => {
|
||||
await uploadImage()
|
||||
})
|
||||
|
||||
// test('should upload files from remote URL', async () => {
|
||||
// await uploadImage()
|
||||
test('should upload files from remote URL', async () => {
|
||||
await uploadImage()
|
||||
|
||||
// await page.goto(url.create)
|
||||
await page.goto(url.create)
|
||||
|
||||
// const pasteURLButton = page.locator('.file-field__upload .dropzone__file-button', {
|
||||
// hasText: 'Paste URL',
|
||||
// })
|
||||
// await pasteURLButton.click()
|
||||
const pasteURLButton = page.locator('.file-field__upload button', {
|
||||
hasText: 'Paste URL',
|
||||
})
|
||||
await pasteURLButton.click()
|
||||
|
||||
// const remoteImage = 'https://payloadcms.com/images/og-image.jpg'
|
||||
const remoteImage = 'https://payloadcms.com/images/og-image.jpg'
|
||||
|
||||
// const inputField = page.locator('.file-field__upload .file-field__remote-file')
|
||||
// await inputField.fill(remoteImage)
|
||||
const inputField = page.locator('.file-field__upload .file-field__remote-file')
|
||||
await inputField.fill(remoteImage)
|
||||
|
||||
// const addFileButton = page.locator('.file-field__add-file')
|
||||
// await addFileButton.click()
|
||||
const addFileButton = page.locator('.file-field__add-file')
|
||||
await addFileButton.click()
|
||||
|
||||
// await expect(page.locator('.file-field .file-field__filename')).toHaveValue('og-image.jpg')
|
||||
await expect(page.locator('.file-field .file-field__filename')).toHaveValue('og-image.jpg')
|
||||
|
||||
// await saveDocAndAssert(page)
|
||||
await saveDocAndAssert(page)
|
||||
|
||||
// await expect(page.locator('.file-field .file-details img')).toHaveAttribute(
|
||||
// 'src',
|
||||
// /\/api\/uploads\/file\/og-image\.jpg(\?.*)?$/,
|
||||
// )
|
||||
// })
|
||||
await expect(page.locator('.file-field .file-details img')).toHaveAttribute(
|
||||
'src',
|
||||
/\/api\/uploads\/file\/og-image\.jpg(\?.*)?$/,
|
||||
)
|
||||
})
|
||||
|
||||
// test that the image renders
|
||||
test('should render uploaded image', async () => {
|
||||
@@ -122,99 +122,97 @@ describe('Upload', () => {
|
||||
)
|
||||
})
|
||||
|
||||
// test('should upload using the document drawer', async () => {
|
||||
// await uploadImage()
|
||||
// await wait(1000)
|
||||
// // Open the media drawer and create a png upload
|
||||
test('should upload using the document drawer', async () => {
|
||||
await uploadImage()
|
||||
await wait(1000)
|
||||
// Open the media drawer and create a png upload
|
||||
|
||||
// await openDocDrawer(page, '.field-type.upload .upload__toggler.doc-drawer__toggler')
|
||||
await openDocDrawer(page, '#field-media .upload__createNewToggler')
|
||||
|
||||
// await page
|
||||
// .locator('[id^=doc-drawer_uploads_1_] .file-field__upload input[type="file"]')
|
||||
// .setInputFiles(path.resolve(dirname, './uploads/payload.png'))
|
||||
// await expect(
|
||||
// page.locator('[id^=doc-drawer_uploads_1_] .file-field__upload .file-field__filename'),
|
||||
// ).toHaveValue('payload.png')
|
||||
// await page.locator('[id^=doc-drawer_uploads_1_] #action-save').click()
|
||||
// await expect(page.locator('.payload-toast-container')).toContainText('successfully')
|
||||
await page
|
||||
.locator('[id^=doc-drawer_uploads_1_] .file-field__upload input[type="file"]')
|
||||
.setInputFiles(path.resolve(dirname, './uploads/payload.png'))
|
||||
await expect(
|
||||
page.locator('[id^=doc-drawer_uploads_1_] .file-field__upload .file-field__filename'),
|
||||
).toHaveValue('payload.png')
|
||||
await page.locator('[id^=doc-drawer_uploads_1_] #action-save').click()
|
||||
await expect(page.locator('.payload-toast-container')).toContainText('successfully')
|
||||
|
||||
// // Assert that the media field has the png upload
|
||||
// await expect(
|
||||
// page.locator('.field-type.upload .file-details .file-meta__url a'),
|
||||
// ).toHaveAttribute('href', '/api/uploads/file/payload-1.png')
|
||||
// await expect(page.locator('.field-type.upload .file-details .file-meta__url a')).toContainText(
|
||||
// 'payload-1.png',
|
||||
// )
|
||||
// await expect(page.locator('.field-type.upload .file-details img')).toHaveAttribute(
|
||||
// 'src',
|
||||
// '/api/uploads/file/payload-1.png',
|
||||
// )
|
||||
// await saveDocAndAssert(page)
|
||||
// })
|
||||
// Assert that the media field has the png upload
|
||||
await expect(
|
||||
page.locator('.field-type.upload .upload-relationship-details__filename a'),
|
||||
).toHaveAttribute('href', '/api/uploads/file/payload-1.png')
|
||||
await expect(
|
||||
page.locator('.field-type.upload .upload-relationship-details__filename a'),
|
||||
).toContainText('payload-1.png')
|
||||
await expect(
|
||||
page.locator('.field-type.upload .upload-relationship-details img'),
|
||||
).toHaveAttribute('src', '/api/uploads/file/payload-1.png')
|
||||
await saveDocAndAssert(page)
|
||||
})
|
||||
|
||||
// test('should upload after editing image inside a document drawer', async () => {
|
||||
// await uploadImage()
|
||||
// await wait(1000)
|
||||
// // Open the media drawer and create a png upload
|
||||
test('should upload after editing image inside a document drawer', async () => {
|
||||
await uploadImage()
|
||||
await wait(1000)
|
||||
// Open the media drawer and create a png upload
|
||||
|
||||
// await openDocDrawer(page, '.field-type.upload .upload__toggler.doc-drawer__toggler')
|
||||
await openDocDrawer(page, '#field-media .upload__createNewToggler')
|
||||
|
||||
// await page
|
||||
// .locator('[id^=doc-drawer_uploads_1_] .file-field__upload input[type="file"]')
|
||||
// .setInputFiles(path.resolve(dirname, './uploads/payload.png'))
|
||||
// await expect(
|
||||
// page.locator('[id^=doc-drawer_uploads_1_] .file-field__upload .file-field__filename'),
|
||||
// ).toHaveValue('payload.png')
|
||||
// await page.locator('[id^=doc-drawer_uploads_1_] .file-field__edit').click()
|
||||
// await page
|
||||
// .locator('[id^=edit-upload] .edit-upload__input input[name="Width (px)"]')
|
||||
// .nth(1)
|
||||
// .fill('200')
|
||||
// await page
|
||||
// .locator('[id^=edit-upload] .edit-upload__input input[name="Height (px)"]')
|
||||
// .nth(1)
|
||||
// .fill('200')
|
||||
// await page.locator('[id^=edit-upload] button:has-text("Apply Changes")').nth(1).click()
|
||||
// await page.locator('[id^=doc-drawer_uploads_1_] #action-save').click()
|
||||
// await expect(page.locator('.payload-toast-container')).toContainText('successfully')
|
||||
await page
|
||||
.locator('[id^=doc-drawer_uploads_1_] .file-field__upload input[type="file"]')
|
||||
.setInputFiles(path.resolve(dirname, './uploads/payload.png'))
|
||||
await expect(
|
||||
page.locator('[id^=doc-drawer_uploads_1_] .file-field__upload .file-field__filename'),
|
||||
).toHaveValue('payload.png')
|
||||
await page.locator('[id^=doc-drawer_uploads_1_] .file-field__edit').click()
|
||||
await page
|
||||
.locator('[id^=edit-upload] .edit-upload__input input[name="Width (px)"]')
|
||||
.nth(1)
|
||||
.fill('200')
|
||||
await page
|
||||
.locator('[id^=edit-upload] .edit-upload__input input[name="Height (px)"]')
|
||||
.nth(1)
|
||||
.fill('200')
|
||||
await page.locator('[id^=edit-upload] button:has-text("Apply Changes")').nth(1).click()
|
||||
await page.locator('[id^=doc-drawer_uploads_1_] #action-save').click()
|
||||
await expect(page.locator('.payload-toast-container')).toContainText('successfully')
|
||||
|
||||
// // Assert that the media field has the png upload
|
||||
// await expect(
|
||||
// page.locator('.field-type.upload .file-details .file-meta__url a'),
|
||||
// ).toHaveAttribute('href', '/api/uploads/file/payload-1.png')
|
||||
// await expect(page.locator('.field-type.upload .file-details .file-meta__url a')).toContainText(
|
||||
// 'payload-1.png',
|
||||
// )
|
||||
// await expect(page.locator('.field-type.upload .file-details img')).toHaveAttribute(
|
||||
// 'src',
|
||||
// '/api/uploads/file/payload-1.png',
|
||||
// )
|
||||
// await saveDocAndAssert(page)
|
||||
// })
|
||||
// Assert that the media field has the png upload
|
||||
await expect(
|
||||
page.locator('.field-type.upload .upload-relationship-details__filename a'),
|
||||
).toHaveAttribute('href', '/api/uploads/file/payload-1.png')
|
||||
await expect(
|
||||
page.locator('.field-type.upload .upload-relationship-details__filename a'),
|
||||
).toContainText('payload-1.png')
|
||||
await expect(
|
||||
page.locator('.field-type.upload .upload-relationship-details img'),
|
||||
).toHaveAttribute('src', '/api/uploads/file/payload-1.png')
|
||||
await saveDocAndAssert(page)
|
||||
})
|
||||
|
||||
// test('should clear selected upload', async () => {
|
||||
// await uploadImage()
|
||||
// await wait(1000) // TODO: Fix this. Need to wait a bit until the form in the drawer mounted, otherwise values sometimes disappear. This is an issue for all drawers
|
||||
test('should clear selected upload', async () => {
|
||||
await uploadImage()
|
||||
await wait(1000) // TODO: Fix this. Need to wait a bit until the form in the drawer mounted, otherwise values sometimes disappear. This is an issue for all drawers
|
||||
|
||||
// await openDocDrawer(page, '.field-type.upload .upload__toggler.doc-drawer__toggler')
|
||||
await openDocDrawer(page, '#field-media .upload__createNewToggler')
|
||||
|
||||
// await wait(1000)
|
||||
await wait(1000)
|
||||
|
||||
// await page
|
||||
// .locator('[id^=doc-drawer_uploads_1_] .file-field__upload input[type="file"]')
|
||||
// .setInputFiles(path.resolve(dirname, './uploads/payload.png'))
|
||||
// await expect(
|
||||
// page.locator('[id^=doc-drawer_uploads_1_] .file-field__upload .file-field__filename'),
|
||||
// ).toHaveValue('payload.png')
|
||||
// await page.locator('[id^=doc-drawer_uploads_1_] #action-save').click()
|
||||
// await expect(page.locator('.payload-toast-container')).toContainText('successfully')
|
||||
// await page.locator('.field-type.upload .file-details__remove').click()
|
||||
// })
|
||||
await page
|
||||
.locator('[id^=doc-drawer_uploads_1_] .file-field__upload input[type="file"]')
|
||||
.setInputFiles(path.resolve(dirname, './uploads/payload.png'))
|
||||
await expect(
|
||||
page.locator('[id^=doc-drawer_uploads_1_] .file-field__upload .file-field__filename'),
|
||||
).toHaveValue('payload.png')
|
||||
await page.locator('[id^=doc-drawer_uploads_1_] #action-save').click()
|
||||
await expect(page.locator('.payload-toast-container')).toContainText('successfully')
|
||||
await page.locator('.field-type.upload .upload-relationship-details__remove').click()
|
||||
})
|
||||
|
||||
test('should select using the list drawer and restrict mimetype based on filterOptions', async () => {
|
||||
await uploadImage()
|
||||
|
||||
await openDocDrawer(page, '.field-type.upload .upload__toggler.list-drawer__toggler')
|
||||
await openDocDrawer(page, '.field-type.upload .upload__listToggler')
|
||||
|
||||
const jpgImages = page.locator('[id^=list-drawer_1_] .upload-gallery img[src$=".jpg"]')
|
||||
await expect
|
||||
|
||||
@@ -286,61 +286,61 @@ describe('uploads', () => {
|
||||
await page.locator('.field-type:nth-of-type(2) .icon--x').click()
|
||||
|
||||
// choose from existing
|
||||
await openDocDrawer(page, '.list-drawer__toggler')
|
||||
await openDocDrawer(page, '.upload__listToggler')
|
||||
|
||||
await expect(page.locator('.row-3 .cell-title')).toContainText('draft')
|
||||
})
|
||||
|
||||
// test('should restrict mimetype based on filterOptions', async () => {
|
||||
// await page.goto(audioURL.edit(audioDoc.id))
|
||||
// await page.waitForURL(audioURL.edit(audioDoc.id))
|
||||
test('should restrict mimetype based on filterOptions', async () => {
|
||||
await page.goto(audioURL.edit(audioDoc.id))
|
||||
await page.waitForURL(audioURL.edit(audioDoc.id))
|
||||
|
||||
// // remove the selection and open the list drawer
|
||||
// await wait(500) // flake workaround
|
||||
// await page.locator('.file-details__remove').click()
|
||||
// remove the selection and open the list drawer
|
||||
await wait(500) // flake workaround
|
||||
await page.locator('#field-audio .upload-relationship-details__remove').click()
|
||||
|
||||
// await openDocDrawer(page, '.upload__toggler.list-drawer__toggler')
|
||||
await openDocDrawer(page, '#field-audio .upload__listToggler')
|
||||
|
||||
// const listDrawer = page.locator('[id^=list-drawer_1_]')
|
||||
// await expect(listDrawer).toBeVisible()
|
||||
const listDrawer = page.locator('[id^=list-drawer_1_]')
|
||||
await expect(listDrawer).toBeVisible()
|
||||
|
||||
// await openDocDrawer(page, 'button.list-drawer__create-new-button.doc-drawer__toggler')
|
||||
// await expect(page.locator('[id^=doc-drawer_media_2_]')).toBeVisible()
|
||||
await openDocDrawer(page, 'button.list-drawer__create-new-button.doc-drawer__toggler')
|
||||
await expect(page.locator('[id^=doc-drawer_media_2_]')).toBeVisible()
|
||||
|
||||
// // upload an image and try to select it
|
||||
// await page
|
||||
// .locator('[id^=doc-drawer_media_2_] .file-field__upload input[type="file"]')
|
||||
// .setInputFiles(path.resolve(dirname, './image.png'))
|
||||
// await page.locator('[id^=doc-drawer_media_2_] button#action-save').click()
|
||||
// await expect(page.locator('.payload-toast-container .toast-success')).toContainText(
|
||||
// 'successfully',
|
||||
// )
|
||||
// await page
|
||||
// .locator('.payload-toast-container .toast-success .payload-toast-close-button')
|
||||
// .click()
|
||||
// upload an image and try to select it
|
||||
await page
|
||||
.locator('[id^=doc-drawer_media_2_] .file-field__upload input[type="file"]')
|
||||
.setInputFiles(path.resolve(dirname, './image.png'))
|
||||
await page.locator('[id^=doc-drawer_media_2_] button#action-save').click()
|
||||
await expect(page.locator('.payload-toast-container .toast-success')).toContainText(
|
||||
'successfully',
|
||||
)
|
||||
await page
|
||||
.locator('.payload-toast-container .toast-success .payload-toast-close-button')
|
||||
.click()
|
||||
|
||||
// // save the document and expect an error
|
||||
// await page.locator('button#action-save').click()
|
||||
// await expect(page.locator('.payload-toast-container .toast-error')).toContainText(
|
||||
// 'The following field is invalid: audio',
|
||||
// )
|
||||
// })
|
||||
// save the document and expect an error
|
||||
await page.locator('button#action-save').click()
|
||||
await expect(page.locator('.payload-toast-container .toast-error')).toContainText(
|
||||
'The following field is invalid: audio',
|
||||
)
|
||||
})
|
||||
|
||||
// test('should restrict uploads in drawer based on filterOptions', async () => {
|
||||
// await page.goto(audioURL.edit(audioDoc.id))
|
||||
// await page.waitForURL(audioURL.edit(audioDoc.id))
|
||||
test('should restrict uploads in drawer based on filterOptions', async () => {
|
||||
await page.goto(audioURL.edit(audioDoc.id))
|
||||
await page.waitForURL(audioURL.edit(audioDoc.id))
|
||||
|
||||
// // remove the selection and open the list drawer
|
||||
// await wait(500) // flake workaround
|
||||
// await page.locator('.file-details__remove').click()
|
||||
// remove the selection and open the list drawer
|
||||
await wait(500) // flake workaround
|
||||
await page.locator('#field-audio .upload-relationship-details__remove').click()
|
||||
|
||||
// await openDocDrawer(page, '.upload__toggler.list-drawer__toggler')
|
||||
await openDocDrawer(page, '.upload__listToggler')
|
||||
|
||||
// const listDrawer = page.locator('[id^=list-drawer_1_]')
|
||||
// await expect(listDrawer).toBeVisible()
|
||||
const listDrawer = page.locator('[id^=list-drawer_1_]')
|
||||
await expect(listDrawer).toBeVisible()
|
||||
|
||||
// await expect(listDrawer.locator('tbody tr')).toHaveCount(1)
|
||||
// })
|
||||
await expect(listDrawer.locator('tbody tr')).toHaveCount(1)
|
||||
})
|
||||
|
||||
test('should throw error when file is larger than the limit and abortOnLimit is true', async () => {
|
||||
await page.goto(mediaURL.create)
|
||||
|
||||
Reference in New Issue
Block a user