universo-platform-2d

1
import type { Locator, Page } from '@playwright/test';
2
import { expect } from '@playwright/test';
3

4
export async function waitForEditorLoad(page: Page) {
5
  await page.waitForSelector('v-line', {
6
    timeout: 20000,
7
  });
8
}
9

10
export async function waitForAllPagesLoad(page: Page) {
11
  // if filters tag is rendered, we believe all_pages is ready
12
  await page.waitForSelector('[data-testid="create-first-filter"]', {
13
    timeout: 20000,
14
  });
15
}
16

17
export async function clickNewPageButton(page: Page, title?: string) {
18
  // FiXME: when the page is in edgeless mode, clickNewPageButton will create a new edgeless page
19
  const edgelessPage = page.locator('edgeless-editor');
20
  if (await edgelessPage.isVisible()) {
21
    await page.getByTestId('switch-page-mode-button').click({
22
      delay: 100,
23
    });
24
  }
25
  // fixme(himself65): if too fast, the page will crash
26
  await page.getByTestId('sidebar-new-page-button').click({
27
    delay: 100,
28
  });
29
  await waitForEmptyEditor(page);
30
  if (title) {
31
    await getBlockSuiteEditorTitle(page).fill(title);
32
  }
33
}
34

35
export async function waitForEmptyEditor(page: Page) {
36
  await expect(page.locator('.doc-title-container-empty')).toBeVisible();
37
}
38

39
export function getBlockSuiteEditorTitle(page: Page) {
40
  return page.locator('doc-title .inline-editor').nth(0);
41
}
42

43
export async function type(page: Page, content: string, delay = 50) {
44
  await page.keyboard.type(content, { delay });
45
}
46

47
export const createLinkedPage = async (page: Page, pageName?: string) => {
48
  // fixme: workaround for @ popover not showing up when editor is not ready
49
  await page.waitForTimeout(500);
50
  await page.keyboard.type('@', { delay: 50 });
51
  const linkedPagePopover = page.locator('.linked-doc-popover');
52
  await expect(linkedPagePopover).toBeVisible();
53
  await type(page, pageName || 'Untitled');
54

55
  await page.keyboard.press('ArrowUp');
56
  await page.keyboard.press('ArrowUp');
57
  await page.keyboard.press('Enter', { delay: 50 });
58
};
59

60
export async function clickPageMoreActions(page: Page) {
61
  return page
62
    .getByTestId('header')
63
    .getByTestId('header-dropDownButton')
64
    .click();
65
}
66

67
export const getPageOperationButton = (page: Page, id: string) => {
68
  return getPageItem(page, id).getByTestId('page-list-operation-button');
69
};
70

71
export const getPageItem = (page: Page, id: string) => {
72
  return page.locator(`[data-page-id="${id}"][data-testid="page-list-item"]`);
73
};
74

75
export const getPageByTitle = (page: Page, title: string) => {
76
  return page.getByTestId('page-list-item').getByText(title);
77
};
78

79
export const dragTo = async (
80
  page: Page,
81
  locator: Locator,
82
  target: Locator,
83
  location:
84
    | 'top-left'
85
    | 'top'
86
    | 'bottom'
87
    | 'center'
88
    | 'left'
89
    | 'right' = 'center'
90
) => {
91
  await locator.hover();
92
  await page.mouse.down();
93
  await page.mouse.move(1, 1);
94

95
  const targetElement = await target.boundingBox();
96
  if (!targetElement) {
97
    throw new Error('target element not found');
98
  }
99
  const position = (() => {
100
    switch (location) {
101
      case 'center':
102
        return {
103
          x: targetElement.width / 2,
104
          y: targetElement.height / 2,
105
        };
106
      case 'top':
107
        return { x: targetElement.width / 2, y: 1 };
108
      case 'bottom':
109
        return { x: targetElement.width / 2, y: targetElement.height - 1 };
110

111
      case 'left':
112
        return { x: 1, y: targetElement.height / 2 };
113

114
      case 'right':
115
        return { x: targetElement.width - 1, y: targetElement.height / 2 };
116

117
      case 'top-left':
118
      default:
119
        return { x: 1, y: 1 };
120
    }
121
  })();
122
  await target.hover({
123
    position: position,
124
  });
125
  await page.mouse.up();
126
};
127

128
// sometimes editor loses focus, this function is to focus the editor
129
export const focusInlineEditor = async (page: Page) => {
130
  await page
131
    .locator(
132
      `.affine-paragraph-rich-text-wrapper:has(.visible):has-text("Type '/' for commands")`
133
    )
134
    .locator('.inline-editor')
135
    .focus();
136
};
137