mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-16 05:47:09 +08:00
fix: date-picker hidden in update collection (#3045)
This commit is contained in:
JimmFly
208
tests/libs/filter.ts
Normal file
208
tests/libs/filter.ts
Normal file
@@ -0,0 +1,208 @@
|
||||
import type { Page } from '@playwright/test';
|
||||
import { expect } from '@playwright/test';
|
||||
|
||||
import { getBlockSuiteEditorTitle, newPage } from './page-logic';
|
||||
|
||||
const monthNames = [
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'May',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Aug',
|
||||
'Sep',
|
||||
'Oct',
|
||||
'Nov',
|
||||
'Dec',
|
||||
];
|
||||
|
||||
export 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();
|
||||
};
|
||||
|
||||
export const checkFilterName = async (page: Page, name: string) => {
|
||||
const filterName = await page
|
||||
.locator('[data-testid="filter-name"]')
|
||||
.textContent();
|
||||
expect(filterName).toBe(name);
|
||||
};
|
||||
|
||||
const dateFormat = (date: Date) => {
|
||||
const month = monthNames[date.getMonth()];
|
||||
const day = date.getDate().toString().padStart(2, '0');
|
||||
return `${month} ${day}`;
|
||||
};
|
||||
|
||||
export const checkPagesCount = async (page: Page, count: number) => {
|
||||
expect((await page.locator('[data-testid="title"]').all()).length).toBe(
|
||||
count
|
||||
);
|
||||
};
|
||||
|
||||
export const checkDatePicker = async (page: Page, date: Date) => {
|
||||
expect(
|
||||
await page
|
||||
.locator('[data-testid="filter-arg"]')
|
||||
.locator('input')
|
||||
.inputValue()
|
||||
).toBe(dateFormat(date));
|
||||
};
|
||||
|
||||
export const clickDatePicker = async (page: Page) => {
|
||||
await page.locator('[data-testid="filter-arg"]').locator('input').click();
|
||||
};
|
||||
|
||||
const clickMonthPicker = async (page: Page) => {
|
||||
await page.locator('[data-testid="month-picker-button"]').click();
|
||||
};
|
||||
|
||||
export const fillDatePicker = async (page: Page, date: Date) => {
|
||||
await page
|
||||
.locator('[data-testid="filter-arg"]')
|
||||
.locator('input')
|
||||
.fill(dateFormat(date));
|
||||
};
|
||||
|
||||
const checkIsLastMonth = (date: Date): boolean => {
|
||||
const targetMonth = date.getMonth();
|
||||
const currentMonth = new Date().getMonth();
|
||||
const lastMonth = currentMonth === 0 ? 11 : currentMonth - 1;
|
||||
return targetMonth === lastMonth;
|
||||
};
|
||||
|
||||
const checkIsNextMonth = (date: Date): boolean => {
|
||||
const targetMonth = date.getMonth();
|
||||
const currentMonth = new Date().getMonth();
|
||||
const nextMonth = currentMonth === 11 ? 0 : currentMonth + 1;
|
||||
return targetMonth === nextMonth;
|
||||
};
|
||||
|
||||
export const selectDateFromDatePicker = async (page: Page, date: Date) => {
|
||||
const datePickerPopup = page.locator('.react-datepicker-popper');
|
||||
const day = date.getDate().toString();
|
||||
const month = date.toLocaleString('en-US', { month: 'long' });
|
||||
const weekday = date.toLocaleString('en-US', { weekday: 'long' });
|
||||
const year = date.getFullYear().toString();
|
||||
// Open the date picker popup
|
||||
await clickDatePicker(page);
|
||||
const selectDate = async (): Promise<void> => {
|
||||
if (checkIsLastMonth(date)) {
|
||||
const lastMonthButton = page.locator(
|
||||
'[data-testid="date-picker-prev-button"]'
|
||||
);
|
||||
await lastMonthButton.click();
|
||||
} else if (checkIsNextMonth(date)) {
|
||||
const nextMonthButton = page.locator(
|
||||
'[data-testid="date-picker-next-button"]'
|
||||
);
|
||||
await nextMonthButton.click();
|
||||
}
|
||||
const map = ['th', 'st', 'nd', 'rd'];
|
||||
// Click on the day cell
|
||||
const dateCell = page.locator(
|
||||
`[aria-disabled="false"][aria-label="Choose ${weekday}, ${month} ${day}${
|
||||
map[Number.parseInt(day) % 10] ?? 'th'
|
||||
}, ${year}"]`
|
||||
);
|
||||
await dateCell.click();
|
||||
};
|
||||
await selectDate();
|
||||
|
||||
// Wait for the date picker popup to close
|
||||
await datePickerPopup.waitFor({ state: 'hidden' });
|
||||
};
|
||||
|
||||
const checkIsLastYear = (date: Date): boolean => {
|
||||
const targetYear = date.getFullYear();
|
||||
const currentYear = new Date().getFullYear();
|
||||
const lastYear = currentYear - 1;
|
||||
return targetYear === lastYear;
|
||||
};
|
||||
|
||||
const checkIsNextYear = (date: Date): boolean => {
|
||||
const targetYear = date.getFullYear();
|
||||
const currentYear = new Date().getFullYear();
|
||||
const nextYear = currentYear + 1;
|
||||
return targetYear === nextYear;
|
||||
};
|
||||
|
||||
export const selectMonthFromMonthPicker = async (page: Page, date: Date) => {
|
||||
const month = date.toLocaleString('en-US', { month: 'long' });
|
||||
const year = date.getFullYear().toString();
|
||||
// Open the month picker popup
|
||||
await clickMonthPicker(page);
|
||||
const selectMonth = async (): Promise<void> => {
|
||||
if (checkIsLastYear(date)) {
|
||||
const lastYearButton = page.locator(
|
||||
'[data-testid="month-picker-prev-button"]'
|
||||
);
|
||||
await lastYearButton.click();
|
||||
} else if (checkIsNextYear(date)) {
|
||||
const nextYearButton = page.locator(
|
||||
'[data-testid="month-picker-next-button"]'
|
||||
);
|
||||
await nextYearButton.click();
|
||||
}
|
||||
// Click on the day cell
|
||||
const monthCell = page.locator(`[aria-label="Choose ${month} ${year}"]`);
|
||||
await monthCell.click();
|
||||
};
|
||||
await selectMonth();
|
||||
};
|
||||
|
||||
export const checkDatePickerMonth = async (page: Page, date: Date) => {
|
||||
expect(
|
||||
await page.locator('[data-testid="date-picker-current-month"]').innerText()
|
||||
).toBe(date.toLocaleString('en-US', { month: 'long' }));
|
||||
};
|
||||
|
||||
const createTag = async (page: Page, name: string) => {
|
||||
await page.keyboard.type(name);
|
||||
await page.keyboard.press('ArrowUp');
|
||||
await page.keyboard.press('Enter');
|
||||
};
|
||||
|
||||
export const createPageWithTag = async (
|
||||
page: Page,
|
||||
options: {
|
||||
title: string;
|
||||
tags: string[];
|
||||
}
|
||||
) => {
|
||||
await page.getByTestId('all-pages').click();
|
||||
await newPage(page);
|
||||
await getBlockSuiteEditorTitle(page).click();
|
||||
await getBlockSuiteEditorTitle(page).fill('test page');
|
||||
await page.locator('affine-page-meta-data').click();
|
||||
await page.locator('.add-tag').click();
|
||||
for (const name of options.tags) {
|
||||
await createTag(page, name);
|
||||
}
|
||||
await page.keyboard.press('Escape');
|
||||
};
|
||||
|
||||
export const changeFilter = async (page: Page, to: string | RegExp) => {
|
||||
await page.getByTestId('filter-name').click();
|
||||
await page
|
||||
.getByTestId('filter-name-select')
|
||||
.locator('button', { hasText: to })
|
||||
.click();
|
||||
};
|
||||
|
||||
export async function selectTag(page: Page, name: string | RegExp) {
|
||||
await page.getByTestId('filter-arg').click();
|
||||
await page
|
||||
.getByTestId('multi-select')
|
||||
.getByTestId('select-option')
|
||||
.getByText(name)
|
||||
.click();
|
||||
await page.getByTestId('filter-arg').click();
|
||||
}
|
||||
Reference in New Issue
Block a user