fix: ci

tests/affine-local/e2e/blocksuite/paragraph.spec.ts

@@ -14,7 +14,7 @@ import {
   waitForEditorLoad,
 } from '@affine-test/kit/utils/page-logic';
 import type { ParagraphBlockComponent } from '@blocksuite/affine-block-paragraph';
-import { expect } from '@playwright/test';
+import { expect, type Locator } from '@playwright/test';
 
 test.beforeEach(async ({ page }) => {
   await openHomePage(page);
@@ -22,6 +22,44 @@ test.beforeEach(async ({ page }) => {
   await waitForEditorLoad(page);
 });
 
+async function expectParagraphState(
+  paragraphs: Locator,
+  index: number,
+  expectedType: string,
+  expectedText: string
+) {
+  await expect
+    .poll(async () => {
+      return await paragraphs
+        .nth(index)
+        .evaluate(
+          (
+            block: ParagraphBlockComponent,
+            expected: { type: string; text: string }
+          ) =>
+            block.model.props.type === expected.type &&
+            block.model.props.text.toString() === expected.text,
+          {
+            type: expectedType,
+            text: expectedText,
+          }
+        );
+    })
+    .toBeTruthy();
+}
+
+async function expectParagraphVisibility(
+  paragraphs: Locator,
+  index: number,
+  visible: boolean
+) {
+  await expect
+    .poll(async () => {
+      return await paragraphs.nth(index).isVisible();
+    })
+    .toBe(visible);
+}
+
 test('heading icon should be updated after change heading level', async ({
   page,
 }) => {
@@ -320,26 +358,9 @@ test('also move children when dedent collapsed heading', async ({ page }) => {
   await subParagraph.nth(0).click();
   await pressShiftTab(page);
   expect(await subParagraph.count()).toBe(0);
-  expect(
+  await expectParagraphState(paragraph, 1, 'h1', 'bbb');
-    await paragraph
+  await expectParagraphState(paragraph, 2, 'text', 'ccc');
-      .nth(1)
+  await expectParagraphVisibility(paragraph, 2, false);
-      .evaluate(
-        (block: ParagraphBlockComponent) =>
-          block.model.props.type === 'h1' &&
-          block.model.props.text.toString() === 'bbb'
-      )
-  ).toBeTruthy();
-  expect(
-    await paragraph
-      .nth(2)
-      .evaluate(
-        (block: ParagraphBlockComponent) =>
-          block.model.props.type === 'text' &&
-          block.model.props.text.toString() === 'ccc'
-      )
-  ).toBeTruthy();
-
-  expect(await paragraph.nth(2).isVisible()).toBeFalsy();
   await paragraph
     .nth(1)
     .locator('blocksuite-toggle-button .toggle-icon')
@@ -349,7 +370,7 @@ test('also move children when dedent collapsed heading', async ({ page }) => {
         y: 5,
       },
     });
-  expect(await paragraph.nth(2).isVisible()).toBeTruthy();
+  await expectParagraphVisibility(paragraph, 2, true);
 });
 
 test('also move collapsed siblings when indent collapsed heading', async ({
@@ -433,23 +454,19 @@ test('unfold collapsed heading when its other blocks indented to be its sibling'
    */
 
   const paragraph = page.locator('affine-note affine-paragraph');
-  expect(await paragraph.nth(2).isVisible()).toBeTruthy();
+  await expectParagraphVisibility(paragraph, 2, true);
-  expect(
+  await expectParagraphState(paragraph, 2, 'text', 'ccc');
-    await paragraph
-      .nth(2)
-      .evaluate(
-        (block: ParagraphBlockComponent) =>
-          block.model.props.type === 'text' &&
-          block.model.props.text.toString() === 'ccc'
-      )
-  ).toBeTruthy();
   await paragraph.locator('blocksuite-toggle-button .toggle-icon').click();
-  expect(await paragraph.nth(2).isVisible()).toBeFalsy();
+  await expectParagraphVisibility(paragraph, 2, false);
 
   await paragraph.nth(3).click(); // ddd
-  expect(await paragraph.nth(2).isVisible()).toBeFalsy();
+  await expectParagraphVisibility(paragraph, 2, false);
-  expect(await paragraph.nth(0).locator('affine-paragraph').count()).toBe(2);
+  await expect
+    .poll(() => paragraph.nth(0).locator('affine-paragraph').count())
+    .toBe(2);
   await pressTab(page);
-  expect(await paragraph.nth(0).locator('affine-paragraph').count()).toBe(3);
+  await expect
-  expect(await paragraph.nth(2).isVisible()).toBeTruthy();
+    .poll(() => paragraph.nth(0).locator('affine-paragraph').count())
+    .toBe(3);
+  await expectParagraphVisibility(paragraph, 2, true);
 });

tests/blocksuite/e2e/utils/actions/misc.ts

@@ -1229,43 +1229,37 @@ export async function getCurrentThemeCSSPropertyValue(
 }
 
 export async function scrollToTop(page: Page) {
-  await page.mouse.wheel(0, -1000);
+  const scrollContainer = page.locator('.affine-page-viewport');
-
+  await expect(scrollContainer).toBeVisible();
-  await page.waitForFunction(() => {
+  await scrollContainer.evaluate(node => {
-    const scrollContainer = document.querySelector('.affine-page-viewport');
+    (node as HTMLElement).scrollTop = 0;
-    if (!scrollContainer) {
-      throw new Error("Can't find scroll container");
-    }
-    return scrollContainer.scrollTop < 10;
   });
+  await expect
+    .poll(async () => {
+      return await scrollContainer.evaluate(node => {
+        return (node as HTMLElement).scrollTop;
+      });
+    })
+    .toBeLessThan(10);
 }
 
 export async function scrollToBottom(page: Page) {
-  // await page.mouse.wheel(0, 1000);
+  const scrollContainer = page.locator('.affine-page-viewport');
-
+  await expect(scrollContainer).toBeVisible();
-  await page
+  await scrollContainer.evaluate(node => {
-    .locator('.affine-page-viewport')
+    const viewport = node as HTMLElement;
-    .evaluate(node =>
+    viewport.scrollTop = viewport.scrollHeight;
-      node.scrollTo({ left: 0, top: 1000, behavior: 'smooth' })
-    );
-  // TODO switch to `scrollend`
-  // See https://developer.chrome.com/en/blog/scrollend-a-new-javascript-event/
-  await page.waitForFunction(() => {
-    const scrollContainer = document.querySelector('.affine-page-viewport');
-    if (!scrollContainer) {
-      throw new Error("Can't find scroll container");
-    }
-
-    return (
-      // Wait for scrolled to the bottom
-      // Refer to https://stackoverflow.com/questions/3898130/check-if-a-user-has-scrolled-to-the-bottom-not-just-the-window-but-any-element
-      Math.abs(
-        scrollContainer.scrollHeight -
-          scrollContainer.scrollTop -
-          scrollContainer.clientHeight
-      ) < 10
-    );
   });
+  await expect
+    .poll(async () => {
+      return await scrollContainer.evaluate(node => {
+        const viewport = node as HTMLElement;
+        return Math.abs(
+          viewport.scrollHeight - viewport.scrollTop - viewport.clientHeight
+        );
+      });
+    })
+    .toBeLessThan(10);
 }
 
 export async function mockParseDocUrlService(

tests/kit/src/electron.ts

@@ -7,7 +7,7 @@ import fs from 'fs-extra';
 import type { ElectronApplication } from 'playwright';
 import { _electron as electron } from 'playwright';
 
-import { test as base, testResultDir } from './playwright';
+import { test as base } from './playwright';
 import { removeWithRetry } from './utils/utils';
 
 const electronRoot = new Package('@affine/electron').path;
@@ -39,6 +39,28 @@ const getActivePage = async (pages: Page[]) => {
   return null;
 };
 
+const cleanupElectronApp = async (electronApp: ElectronApplication) => {
+  const closeApp = async () => {
+    await Promise.allSettled(
+      electronApp.windows().map(async page => {
+        if (!page.isClosed()) {
+          await page.close();
+        }
+      })
+    );
+    await electronApp.close().catch(() => {});
+  };
+
+  await Promise.race([
+    closeApp(),
+    setTimeout(10000).then(() => {
+      try {
+        electronApp.process().kill();
+      } catch {}
+    }),
+  ]);
+};
+
 export const test = base.extend<{
   electronApp: ElectronApplication;
   shell: Page;
@@ -111,11 +133,13 @@ export const test = base.extend<{
   },
   // oxlint-disable-next-line no-empty-pattern
   electronApp: async ({}, use) => {
+    // a random id to avoid conflicts between tests
+    const id = generateUUID();
+    const dist = electronRoot.join('dist').value;
+    const clonedDist = electronRoot.join('e2e-dist-' + id).value;
+    let electronApp: ElectronApplication | undefined;
+
     try {
-      // a random id to avoid conflicts between tests
-      const id = generateUUID();
-      const dist = electronRoot.join('dist').value;
-      const clonedDist = electronRoot.join('e2e-dist-' + id).value;
       await fs.copy(dist, clonedDist);
       const packageJson = await fs.readJSON(
         electronRoot.join('package.json').value
@@ -134,41 +158,23 @@ export const test = base.extend<{
         }
       }
       env.DEBUG = 'pw:browser';
-
       env.SKIP_ONBOARDING = '1';
 
-      const electronApp = await electron.launch({
+      electronApp = await electron.launch({
         args: [clonedDist],
         env,
         cwd: clonedDist,
-        recordVideo: {
-          dir: testResultDir,
-        },
         colorScheme: 'light',
       });
 
       await use(electronApp);
-      const cleanup = async () => {
+    } finally {
-        const pages = electronApp.windows();
+      if (electronApp) {
-        for (const page of pages) {
+        await cleanupElectronApp(electronApp);
-          if (page.isClosed()) {
+      }
-            continue;
+      if (await fs.pathExists(clonedDist)) {
-          }
-          await page.close();
-        }
-        await electronApp.close();
         await removeWithRetry(clonedDist);
-      };
+      }
-      await Promise.race([
-        // cleanup may stuck and fail the test, but it should be fine.
-        cleanup(),
-        setTimeout(10000).then(() => {
-          // kill the electron app if it is not closed after 10 seconds
-          electronApp.process().kill();
-        }),
-      ]);
-    } catch (error) {
-      console.log(error);
     }
   },
   appInfo: async ({ electronApp }, use) => {