mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-09-07 01:09:54 +08:00
refactor(core): doc property (#8465)
doc property upgraded to use orm. The visibility of the property are simplified to three types: `always show`, `always hide`, `hide when empty`, and the default is `always show`.  Added a sidebar view to manage properties  new property ui in workspace settings  Property lists can be collapsed 
This commit is contained in:
@@ -44,8 +44,6 @@ test('New a page and open it ,then open info modal in the title bar', async ({
|
||||
|
||||
const infoModal = page.getByTestId('info-modal');
|
||||
await expect(infoModal).toBeVisible();
|
||||
const tagRow = page.getByTestId('info-modal-tags-row');
|
||||
await expect(tagRow).toBeVisible();
|
||||
const title = page.getByTestId('info-modal-title');
|
||||
await expect(title).toHaveText('this is a new page');
|
||||
});
|
||||
@@ -58,8 +56,6 @@ test('New a page and open it ,then open info modal in the title bar more action
|
||||
|
||||
const infoModal = page.getByTestId('info-modal');
|
||||
await expect(infoModal).toBeVisible();
|
||||
const tagRow = page.getByTestId('info-modal-tags-row');
|
||||
await expect(tagRow).toBeVisible();
|
||||
const title = page.getByTestId('info-modal-title');
|
||||
await expect(title).toHaveText('this is a new page');
|
||||
});
|
||||
@@ -75,8 +71,6 @@ test('New a page, then open info modal from all doc', async ({ page }) => {
|
||||
|
||||
const infoModal = page.getByTestId('info-modal');
|
||||
await expect(infoModal).toBeVisible();
|
||||
const tagRow = page.getByTestId('info-modal-tags-row');
|
||||
await expect(tagRow).toBeVisible();
|
||||
const title = page.getByTestId('info-modal-title');
|
||||
await expect(title).toHaveText('this is a new page');
|
||||
});
|
||||
@@ -105,8 +99,6 @@ test('New a page and add to favourites, then open info modal from sidebar', asyn
|
||||
|
||||
const infoModal = page.getByTestId('info-modal');
|
||||
await expect(infoModal).toBeVisible();
|
||||
const tagRow = page.getByTestId('info-modal-tags-row');
|
||||
await expect(tagRow).toBeVisible();
|
||||
const title = page.getByTestId('info-modal-title');
|
||||
await expect(title).toHaveText('this is a new page');
|
||||
});
|
||||
@@ -116,16 +108,16 @@ test('allow create tag', async ({ page }) => {
|
||||
|
||||
const infoModal = page.getByTestId('info-modal');
|
||||
await expect(infoModal).toBeVisible();
|
||||
await page.getByTestId('info-modal-tags-value').click();
|
||||
await infoModal.getByTestId('property-tags-value').click();
|
||||
await searchAndCreateTag(page, 'Test1');
|
||||
await searchAndCreateTag(page, 'Test2');
|
||||
await closeTagsEditor(page);
|
||||
await expectTagsVisible(page, ['Test1', 'Test2']);
|
||||
await expectTagsVisible(infoModal, ['Test1', 'Test2']);
|
||||
|
||||
await page.getByTestId('info-modal-tags-value').click();
|
||||
await infoModal.getByTestId('property-tags-value').click();
|
||||
await removeSelectedTag(page, 'Test1');
|
||||
await closeTagsEditor(page);
|
||||
await expectTagsVisible(page, ['Test2']);
|
||||
await expectTagsVisible(infoModal, ['Test2']);
|
||||
});
|
||||
|
||||
test('add custom property', async ({ page }) => {
|
||||
@@ -133,10 +125,10 @@ test('add custom property', async ({ page }) => {
|
||||
|
||||
const infoModal = page.getByTestId('info-modal');
|
||||
await expect(infoModal).toBeVisible();
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, 'Number');
|
||||
await addCustomProperty(page, 'Date');
|
||||
await addCustomProperty(page, 'Checkbox');
|
||||
await addCustomProperty(page, 'Created by');
|
||||
await addCustomProperty(page, 'Last edited by');
|
||||
await addCustomProperty(page, infoModal, 'text');
|
||||
await addCustomProperty(page, infoModal, 'number');
|
||||
await addCustomProperty(page, infoModal, 'date');
|
||||
await addCustomProperty(page, infoModal, 'checkbox');
|
||||
await addCustomProperty(page, infoModal, 'createdBy');
|
||||
await addCustomProperty(page, infoModal, 'updatedBy');
|
||||
});
|
||||
|
||||
@@ -81,39 +81,40 @@ test('allow create tag on journals page', async ({ page }) => {
|
||||
});
|
||||
|
||||
test('add custom property', async ({ page }) => {
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, 'Number');
|
||||
await addCustomProperty(page, 'Date');
|
||||
await addCustomProperty(page, 'Checkbox');
|
||||
await addCustomProperty(page, 'Created by');
|
||||
await addCustomProperty(page, 'Last edited by');
|
||||
await addCustomProperty(page, page, 'text');
|
||||
await addCustomProperty(page, page, 'number');
|
||||
await addCustomProperty(page, page, 'date');
|
||||
await addCustomProperty(page, page, 'checkbox');
|
||||
await addCustomProperty(page, page, 'createdBy');
|
||||
await addCustomProperty(page, page, 'updatedBy');
|
||||
});
|
||||
|
||||
test('add custom property & edit', async ({ page }) => {
|
||||
await addCustomProperty(page, 'Checkbox');
|
||||
await addCustomProperty(page, page, 'checkbox');
|
||||
await expect(
|
||||
getPropertyValueLocator(page, 'Checkbox').locator('input')
|
||||
getPropertyValueLocator(page, 'checkbox').locator('input')
|
||||
).not.toBeChecked();
|
||||
await clickPropertyValue(page, 'Checkbox');
|
||||
await clickPropertyValue(page, 'checkbox');
|
||||
await expect(
|
||||
getPropertyValueLocator(page, 'Checkbox').locator('input')
|
||||
getPropertyValueLocator(page, 'checkbox').locator('input')
|
||||
).toBeChecked();
|
||||
});
|
||||
|
||||
test('property table reordering', async ({ page }) => {
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, 'Number');
|
||||
await addCustomProperty(page, 'Date');
|
||||
await addCustomProperty(page, 'Checkbox');
|
||||
await addCustomProperty(page, 'Created by');
|
||||
await addCustomProperty(page, 'Last edited by');
|
||||
await addCustomProperty(page, page, 'text');
|
||||
await addCustomProperty(page, page, 'number');
|
||||
await addCustomProperty(page, page, 'date');
|
||||
await addCustomProperty(page, page, 'checkbox');
|
||||
await addCustomProperty(page, page, 'createdBy');
|
||||
await addCustomProperty(page, page, 'updatedBy');
|
||||
|
||||
await dragTo(
|
||||
page,
|
||||
page.locator('[data-testid="page-property-row-name"]:has-text("Text")'),
|
||||
page.locator('[data-testid="doc-property-name"]:has-text("Text")'),
|
||||
page.locator(
|
||||
'[data-testid="page-property-row-name"]:has-text("Checkbox") + div'
|
||||
)
|
||||
'[data-testid="doc-property-name"]:has-text("Checkbox") + div'
|
||||
),
|
||||
'bottom'
|
||||
);
|
||||
|
||||
// new order should be (Tags), Number, Date, Checkbox, Text
|
||||
@@ -128,9 +129,9 @@ test('property table reordering', async ({ page }) => {
|
||||
].entries()) {
|
||||
await expect(
|
||||
page
|
||||
.getByTestId('page-property-row')
|
||||
.getByTestId('doc-property-row')
|
||||
.nth(index)
|
||||
.getByTestId('page-property-row-name')
|
||||
.getByTestId('doc-property-name')
|
||||
).toHaveText(property);
|
||||
}
|
||||
});
|
||||
@@ -143,23 +144,20 @@ test('page info show more will not should by default when there is no properties
|
||||
});
|
||||
|
||||
test('page info show more will show all properties', async ({ page }) => {
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, 'Number');
|
||||
await addCustomProperty(page, 'Date');
|
||||
await addCustomProperty(page, 'Checkbox');
|
||||
await addCustomProperty(page, 'Created by');
|
||||
await addCustomProperty(page, 'Last edited by');
|
||||
await addCustomProperty(page, page, 'text');
|
||||
await addCustomProperty(page, page, 'number');
|
||||
await addCustomProperty(page, page, 'date');
|
||||
await addCustomProperty(page, page, 'checkbox');
|
||||
await addCustomProperty(page, page, 'createdBy');
|
||||
await addCustomProperty(page, page, 'updatedBy');
|
||||
|
||||
await expect(page.getByTestId('page-info-show-more')).toBeVisible();
|
||||
await page.click('[data-testid="page-info-show-more"]');
|
||||
await expect(
|
||||
page.getByRole('heading', {
|
||||
name: 'customize properties',
|
||||
})
|
||||
).toBeVisible();
|
||||
await changePropertyVisibility(page, 'Text', 'always-hide');
|
||||
|
||||
await expect(page.getByTestId('property-collapsible-button')).toBeVisible();
|
||||
await page.click('[data-testid="property-collapsible-button"]');
|
||||
|
||||
// new order should be (Tags), Number, Date, Checkbox, Text
|
||||
for (const [index, property] of [
|
||||
'Tags',
|
||||
'Text',
|
||||
'Number',
|
||||
'Date',
|
||||
@@ -169,51 +167,51 @@ test('page info show more will show all properties', async ({ page }) => {
|
||||
].entries()) {
|
||||
await expect(
|
||||
page
|
||||
.getByTestId('page-properties-settings-menu-item')
|
||||
.getByTestId('doc-property-row')
|
||||
.nth(index)
|
||||
.getByTestId('page-property-setting-row-name')
|
||||
.getByTestId('doc-property-name')
|
||||
).toHaveText(property);
|
||||
}
|
||||
});
|
||||
|
||||
test('change page properties visibility', async ({ page }) => {
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, 'Number');
|
||||
await addCustomProperty(page, 'Date');
|
||||
await addCustomProperty(page, 'Checkbox');
|
||||
await addCustomProperty(page, page, 'text');
|
||||
await addCustomProperty(page, page, 'number');
|
||||
await addCustomProperty(page, page, 'date');
|
||||
await addCustomProperty(page, page, 'checkbox');
|
||||
|
||||
// add some number to number property
|
||||
await clickPropertyValue(page, 'Number');
|
||||
await page.locator('input[type=number]').fill('123');
|
||||
|
||||
await changePropertyVisibility(page, 'Text', 'Hide in view');
|
||||
await changePropertyVisibility(page, 'Number', 'Hide in view when empty');
|
||||
await changePropertyVisibility(page, 'Text', 'always-hide');
|
||||
await changePropertyVisibility(page, 'Number', 'hide-when-empty');
|
||||
|
||||
// text property should not be visible
|
||||
await expect(
|
||||
page.locator('[data-testid="page-property-row-name"]:has-text("Text")')
|
||||
page.locator('[data-testid="doc-property-name"]:has-text("Text")')
|
||||
).not.toBeVisible();
|
||||
|
||||
// number property should be visible
|
||||
await expect(
|
||||
page.locator('[data-testid="page-property-row-name"]:has-text("Number")')
|
||||
page.locator('[data-testid="doc-property-name"]:has-text("Number")')
|
||||
).toBeVisible();
|
||||
});
|
||||
|
||||
test('check if added property is also in workspace settings', async ({
|
||||
page,
|
||||
}) => {
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, page, 'text');
|
||||
await openWorkspaceProperties(page);
|
||||
await expect(
|
||||
page.locator('[data-testid=custom-property-row]:has-text("Text")')
|
||||
page.locator('[data-testid=doc-property-manager-item]:has-text("Text")')
|
||||
).toBeVisible();
|
||||
});
|
||||
|
||||
test('edit property name', async ({ page }) => {
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, page, 'text');
|
||||
await page
|
||||
.locator('[data-testid="page-property-row-name"]:has-text("Text")')
|
||||
.locator('[data-testid="doc-property-name"]:has-text("Text")')
|
||||
.click();
|
||||
await expect(page.locator('[data-radix-menu-content]')).toBeVisible();
|
||||
await expect(page.locator('[data-radix-menu-content] input')).toHaveValue(
|
||||
@@ -229,26 +227,24 @@ test('edit property name', async ({ page }) => {
|
||||
// check if the property name is also updated in workspace settings
|
||||
await openWorkspaceProperties(page);
|
||||
await expect(
|
||||
page.locator('[data-testid=custom-property-row]:has-text("New Text")')
|
||||
page.locator('[data-testid=doc-property-manager-item]:has-text("New Text")')
|
||||
).toBeVisible();
|
||||
});
|
||||
|
||||
test('delete property via property popup', async ({ page }) => {
|
||||
await addCustomProperty(page, 'Text');
|
||||
await addCustomProperty(page, page, 'text');
|
||||
await page
|
||||
.locator('[data-testid="page-property-row-name"]:has-text("Text")')
|
||||
.locator('[data-testid="doc-property-name"]:has-text("Text")')
|
||||
.click();
|
||||
await expect(page.locator('[data-radix-menu-content]')).toBeVisible();
|
||||
await page
|
||||
.locator('[data-radix-menu-content]')
|
||||
.getByRole('menuitem', {
|
||||
name: 'Remove property',
|
||||
name: 'Delete property',
|
||||
})
|
||||
.click();
|
||||
// confirm delete dialog should show
|
||||
await expect(page.getByRole('dialog')).toContainText(
|
||||
`The "Text" property will be remove from 1 doc(s). This action cannot be undone.`
|
||||
);
|
||||
await expect(page.getByRole('dialog')).toBeVisible();
|
||||
await page
|
||||
.getByRole('button', {
|
||||
name: 'Confirm',
|
||||
@@ -256,84 +252,6 @@ test('delete property via property popup', async ({ page }) => {
|
||||
.click();
|
||||
// check if the property is removed
|
||||
await expect(
|
||||
page.locator('[data-testid="page-property-row-name"]:has-text("Text")')
|
||||
).not.toBeVisible();
|
||||
});
|
||||
|
||||
test('create a required property', async ({ page }) => {
|
||||
await openWorkspaceProperties(page);
|
||||
await addCustomProperty(page, 'Text', true);
|
||||
|
||||
await page
|
||||
.locator('[data-testid="custom-property-row"]:has-text("Text")')
|
||||
.getByRole('button')
|
||||
.click();
|
||||
|
||||
await page
|
||||
.getByRole('menuitem', {
|
||||
name: 'Set as required property',
|
||||
})
|
||||
.click();
|
||||
|
||||
await expect(
|
||||
page.locator('[data-testid="custom-property-row"]:has-text("Text")')
|
||||
).toContainText('Required');
|
||||
|
||||
// close workspace settings
|
||||
await page.keyboard.press('Escape');
|
||||
|
||||
// check if the property is also required in page properties
|
||||
await expect(
|
||||
page.locator('[data-testid="page-property-row-name"]:has-text("Text")')
|
||||
).toBeVisible();
|
||||
|
||||
// check if the required property is also listed in the show more menu
|
||||
await page.click('[data-testid="page-info-show-more"]');
|
||||
await expect(
|
||||
page.locator(
|
||||
'[data-testid="page-properties-settings-menu-item"]:has-text("Text")'
|
||||
)
|
||||
).toContainText('Required');
|
||||
});
|
||||
|
||||
test('delete a required property', async ({ page }) => {
|
||||
await openWorkspaceProperties(page);
|
||||
await addCustomProperty(page, 'Text', true);
|
||||
|
||||
await page
|
||||
.locator('[data-testid="custom-property-row"]:has-text("Text")')
|
||||
.getByRole('button')
|
||||
.click();
|
||||
|
||||
await page
|
||||
.getByRole('menuitem', {
|
||||
name: 'Set as required property',
|
||||
})
|
||||
.click();
|
||||
|
||||
await page
|
||||
.locator('[data-testid="custom-property-row"]:has-text("Text")')
|
||||
.getByRole('button')
|
||||
.click();
|
||||
|
||||
await page
|
||||
.getByRole('menuitem', {
|
||||
name: 'Delete property',
|
||||
})
|
||||
.click();
|
||||
await page
|
||||
.getByRole('button', {
|
||||
name: 'Confirm',
|
||||
})
|
||||
.click();
|
||||
|
||||
// close workspace settings
|
||||
await page.keyboard.press('Escape');
|
||||
|
||||
await waitForEditorLoad(page);
|
||||
|
||||
// check if the property is removed from page properties
|
||||
await expect(
|
||||
page.locator('[data-testid="page-property-row-name"]:has-text("Text")')
|
||||
page.locator('[data-testid="http://localhost:8080/"]:has-text("Text")')
|
||||
).not.toBeVisible();
|
||||
});
|
||||
|
||||
@@ -127,9 +127,7 @@ export const createPageWithTag = async (
|
||||
await getBlockSuiteEditorTitle(page).click();
|
||||
await getBlockSuiteEditorTitle(page).fill('test page');
|
||||
await page.getByTestId('page-info-collapse').click();
|
||||
await page
|
||||
.locator('[data-testid="page-property-row"][data-property="tags"]')
|
||||
.click();
|
||||
await page.locator('[data-testid="property-tags-value"]').click();
|
||||
for (const name of options.tags) {
|
||||
await createTag(page, name);
|
||||
}
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import type { Page } from '@playwright/test';
|
||||
import type { Locator, Page } from '@playwright/test';
|
||||
import { expect } from '@playwright/test';
|
||||
|
||||
export const getPropertyValueLocator = (page: Page, property: string) => {
|
||||
return page.locator(
|
||||
`[data-testid="page-property-row-name"]:has-text("${property}") + *`
|
||||
`[data-testid="doc-property-name"]:has-text("${property}") + *`
|
||||
);
|
||||
};
|
||||
|
||||
@@ -66,9 +66,12 @@ export const searchAndCreateTag = async (page: Page, name: string) => {
|
||||
.click();
|
||||
};
|
||||
|
||||
export const expectTagsVisible = async (page: Page, tags: string[]) => {
|
||||
const tagListPanel = page
|
||||
.getByTestId('page-property-row')
|
||||
export const expectTagsVisible = async (
|
||||
root: Locator | Page,
|
||||
tags: string[]
|
||||
) => {
|
||||
const tagListPanel = root
|
||||
.getByTestId('property-tags-value')
|
||||
.getByTestId('inline-tags-list');
|
||||
|
||||
expect(await tagListPanel.locator('[data-tag-value]').count()).toBe(
|
||||
@@ -82,8 +85,8 @@ export const expectTagsVisible = async (page: Page, tags: string[]) => {
|
||||
}
|
||||
};
|
||||
|
||||
export const clickAddPropertyButton = async (page: Page) => {
|
||||
await page
|
||||
export const clickAddPropertyButton = async (root: Locator | Page) => {
|
||||
await root
|
||||
.getByRole('button', {
|
||||
name: 'Add property',
|
||||
})
|
||||
@@ -92,40 +95,17 @@ export const clickAddPropertyButton = async (page: Page) => {
|
||||
|
||||
export const addCustomProperty = async (
|
||||
page: Page,
|
||||
type: string,
|
||||
inSettings?: boolean
|
||||
root: Locator | Page,
|
||||
type: string
|
||||
) => {
|
||||
await clickAddPropertyButton(page);
|
||||
if (!inSettings) {
|
||||
await expect(
|
||||
page.getByRole('heading', {
|
||||
name: 'Properties',
|
||||
})
|
||||
).toBeVisible();
|
||||
await page
|
||||
.getByRole('menuitem', {
|
||||
name: 'Create property',
|
||||
})
|
||||
.click();
|
||||
}
|
||||
await expect(
|
||||
page.getByRole('heading', {
|
||||
name: 'Type',
|
||||
})
|
||||
).toBeVisible();
|
||||
await clickAddPropertyButton(root);
|
||||
await page
|
||||
.getByRole('menuitem', {
|
||||
name: type,
|
||||
})
|
||||
.locator(
|
||||
`[data-testid="${'create-property-menu-item'}"][data-property-type="${type}"]`
|
||||
)
|
||||
.click();
|
||||
if (!inSettings) {
|
||||
await expect(
|
||||
page
|
||||
.getByRole('menuitem', {
|
||||
name: type,
|
||||
})
|
||||
.locator('.selected')
|
||||
).toBeVisible();
|
||||
if (await page.getByTestId('edit-property-menu-item').isVisible()) {
|
||||
// is edit property menu opened, close it
|
||||
await page.keyboard.press('Escape');
|
||||
}
|
||||
await page.waitForTimeout(500);
|
||||
@@ -184,12 +164,10 @@ export const changePropertyVisibility = async (
|
||||
name: string,
|
||||
option: string
|
||||
) => {
|
||||
await expect(page.getByTestId('page-info-show-more')).toBeVisible();
|
||||
await page.click('[data-testid="page-info-show-more"]');
|
||||
await expect(
|
||||
page.getByRole('heading', {
|
||||
name: 'customize properties',
|
||||
})
|
||||
).toBeVisible();
|
||||
await selectVisibilitySelector(page, name, option);
|
||||
await page
|
||||
.locator(`[data-testid="doc-property-name"]:has-text("${name}")`)
|
||||
.click();
|
||||
await page.locator(`[data-property-visibility="${option}"]`).click();
|
||||
await page.keyboard.press('Escape');
|
||||
await page.waitForTimeout(500);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user