test: add test case for quick search

tests/libs/keyboard.ts

@@ -0,0 +1,82 @@
+import type { Page } from '@playwright/test';
+
+const IS_MAC = process.platform === 'darwin';
+// const IS_WINDOWS = process.platform === 'win32';
+// const IS_LINUX = !IS_MAC && !IS_WINDOWS;
+
+async function keyDownCtrlOrMeta(page: Page) {
+  if (IS_MAC) {
+    await page.keyboard.down('Meta');
+  } else {
+    await page.keyboard.down('Control');
+  }
+}
+
+async function keyUpCtrlOrMeta(page: Page) {
+  if (IS_MAC) {
+    await page.keyboard.up('Meta');
+  } else {
+    await page.keyboard.up('Control');
+  }
+}
+async function keyDownOptionMeta(page: Page) {
+  if (IS_MAC) {
+    await page.keyboard.down('Alt');
+  } else {
+    await page.keyboard.down('Shift');
+  }
+}
+
+async function keyUpOptionMeta(page: Page) {
+  if (IS_MAC) {
+    await page.keyboard.up('Alt');
+  } else {
+    await page.keyboard.up('Shift');
+  }
+}
+
+// It's not good enough, but better than calling keyDownCtrlOrMeta and keyUpCtrlOrMeta separately
+export const withCtrlOrMeta = async (page: Page, fn: () => Promise<void>) => {
+  await keyDownCtrlOrMeta(page);
+  await fn();
+  await keyUpCtrlOrMeta(page);
+};
+
+export async function pressEnter(page: Page) {
+  // avoid flaky test by simulate real user input
+  await page.keyboard.press('Enter', { delay: 50 });
+}
+
+export async function pressTab(page: Page) {
+  await page.keyboard.press('Tab', { delay: 50 });
+}
+
+export async function pressShiftTab(page: Page) {
+  await page.keyboard.down('Shift');
+  await page.keyboard.press('Tab', { delay: 50 });
+  await page.keyboard.up('Shift');
+}
+
+export async function pressShiftEnter(page: Page) {
+  await page.keyboard.down('Shift');
+  await page.keyboard.press('Enter', { delay: 50 });
+  await page.keyboard.up('Shift');
+}
+
+export async function copyByKeyboard(page: Page) {
+  await keyDownCtrlOrMeta(page);
+  await page.keyboard.press('c', { delay: 50 });
+  await keyUpCtrlOrMeta(page);
+}
+
+export async function cutByKeyboard(page: Page) {
+  await keyDownCtrlOrMeta(page);
+  await page.keyboard.press('x', { delay: 50 });
+  await keyUpCtrlOrMeta(page);
+}
+
+export async function pasteByKeyboard(page: Page) {
+  await keyDownCtrlOrMeta(page);
+  await page.keyboard.press('v', { delay: 50 });
+  await keyUpCtrlOrMeta(page);
+}

tests/quick-search.spec.ts

@@ -0,0 +1,66 @@
+import { test, expect, type Page } from '@playwright/test';
+import { loadPage } from './libs/load-page';
+import { withCtrlOrMeta } from './libs/keyboard';
+
+loadPage();
+const IS_MAC = process.platform === 'darwin';
+// const IS_WINDOWS = process.platform === 'win32';
+// const IS_LINUX = !IS_MAC && !IS_WINDOWS;
+
+const openQuickSearchByShortcut = async (page: Page) =>
+  await withCtrlOrMeta(page, () => page.keyboard.press('k', { delay: 50 }));
+
+async function assertTitleTexts(
+  page: Page,
+  texts: string[],
+  option?: { delay: number }
+) {
+  await page.mouse.move(100, 100); // move mouse for focus
+  const actual = await page
+    .locator('[class=affine-default-page-block-title]')
+    .allInnerTexts();
+  setTimeout(() => {
+    expect(actual).toEqual(texts);
+  }, option?.delay);
+}
+
+test.describe('Open quick search', () => {
+  test('Click slider bar button', async ({ page }) => {
+    const quickSearchButton = page.locator(
+      '[data-testid=sliderBar-quickSearchButton]'
+    );
+    await quickSearchButton.click();
+    const quickSearch = page.locator('[data-testid=quickSearch]');
+    expect(quickSearch.isVisible()).toEqual(true);
+  });
+  test('Click arrowDown icon after title', async ({ page }) => {
+    //header-quickSearchButton
+    const quickSearchButton = page.locator(
+      '[data-testid=header-quickSearchButton]'
+    );
+    await quickSearchButton.click();
+    const quickSearch = page.locator('[data-testid=quickSearch]');
+    expect(quickSearch.isVisible()).toEqual(true);
+  });
+  test('Press the shortcut key cmd+k', async ({ page }) => {
+    await openQuickSearchByShortcut(page);
+    const quickSearch = page.locator('[data-testid=quickSearch]');
+    expect(quickSearch.isVisible()).toEqual(true);
+  });
+});
+
+test.describe('Add new page in quick search', () => {
+  test('Create a new page without keyword', async ({ page }) => {
+    await openQuickSearchByShortcut(page);
+    const addNewPage = page.locator('[data-testid=quickSearch-addNewPage]');
+    await addNewPage.click();
+    await assertTitleTexts(page, [''], { delay: 50 });
+  });
+  test('Create a new page with keyword', async ({ page }) => {
+    await openQuickSearchByShortcut(page);
+    await page.keyboard.insertText('test');
+    const addNewPage = page.locator('[data-testid=quickSearch-addNewPage]');
+    await addNewPage.click();
+    await assertTitleTexts(page, ['test'], { delay: 50 });
+  });
+});