);
diff --git a/packages/component/src/components/page-list/filter/vars.tsx b/packages/component/src/components/page-list/filter/vars.tsx
index acafd3219a..968c7a7a2c 100644
--- a/packages/component/src/components/page-list/filter/vars.tsx
+++ b/packages/component/src/components/page-list/filter/vars.tsx
@@ -60,7 +60,7 @@ export const VariableSelect = ({
onSelect: (value: Filter) => void;
}) => {
return (
-
+
Filter
{vars
@@ -74,7 +74,12 @@ export const VariableSelect = ({
}}
className={styles.menuItemStyle}
>
-
{v.name}
+
+ {v.name}
+
))}
diff --git a/tests/parallels/all-page.spec.ts b/tests/parallels/all-page.spec.ts
index 4df7633a24..f6c59cc16a 100644
--- a/tests/parallels/all-page.spec.ts
+++ b/tests/parallels/all-page.spec.ts
@@ -54,3 +54,93 @@ test('all page can create new edgeless page', async ({ page }) => {
await clickNewEdgelessDropdown();
await expect(page.locator('affine-edgeless-page')).toBeVisible();
});
+
+const closeDownloadTip = async (page: Page) => {
+ await page
+ .locator('[data-testid="download-client-tip-close-button"]')
+ .click();
+};
+
+const createFirstFilter = async (page: Page, name: string) => {
+ await page
+ .locator('[data-testid="editor-header-items"]')
+ .locator('button', { hasText: 'Filter' })
+ .click();
+ await page
+ .locator('[data-testid="variable-select-item"]', { hasText: name })
+ .click();
+};
+
+const checkFilterName = async (page: Page, name: string) => {
+ await expect(
+ await page.locator('[data-testid="filter-name"]').textContent()
+ ).toBe(name);
+};
+
+test('allow creation of filters by favorite', async ({ page }) => {
+ await openHomePage(page);
+ await waitMarkdownImported(page);
+ await clickSideBarAllPageButton(page);
+ await closeDownloadTip(page);
+ await createFirstFilter(page, 'Is Favourited');
+ await page
+ .locator('[data-testid="filter-arg"]', { hasText: 'true' })
+ .locator('div')
+ .click();
+ await expect(
+ await page.locator('[data-testid="filter-arg"]').textContent()
+ ).toBe('false');
+});
+
+const dateFormat = (date: Date) => {
+ return `${date.getFullYear()}-${(date.getMonth() + 1)
+ .toString()
+ .padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
+};
+const checkPagesCount = async (page: Page, count: number) => {
+ await expect((await page.locator('[data-testid="title"]').all()).length).toBe(
+ count
+ );
+};
+const checkDatePicker = async (page: Page, date: Date) => {
+ expect(
+ await page
+ .locator('[data-testid="filter-arg"]')
+ .locator('input')
+ .inputValue()
+ ).toBe(dateFormat(date));
+};
+const fillDatePicker = async (page: Page, date: Date) => {
+ await page
+ .locator('[data-testid="filter-arg"]')
+ .locator('input')
+ .fill(dateFormat(date));
+};
+test('allow creation of filters by created time', async ({ page }) => {
+ await openHomePage(page);
+ await waitMarkdownImported(page);
+ await clickSideBarAllPageButton(page);
+ await closeDownloadTip(page);
+ await createFirstFilter(page, 'Created');
+ await checkFilterName(page, 'after');
+ // init date
+ const yesterday = new Date();
+ yesterday.setDate(yesterday.getDate() - 1);
+ await checkDatePicker(page, yesterday);
+ await checkPagesCount(page, 1);
+ // change date
+ const today = new Date();
+ await fillDatePicker(page, today);
+ await checkPagesCount(page, 0);
+ // change filter
+ await page.locator('[data-testid="filter-name"]').click();
+ await page
+ .locator('[data-testid="filter-name-select"]')
+ .locator('button', { hasText: 'before' })
+ .click();
+ const tomorrow = new Date();
+ tomorrow.setDate(tomorrow.getDate() + 1);
+ await fillDatePicker(page, tomorrow);
+ await checkDatePicker(page, tomorrow);
+ await checkPagesCount(page, 1);
+});