This commit is contained in:
DarkSky
2026-03-22 22:41:19 +08:00
parent ffa3ff9d7f
commit 54c4a9dbab
3 changed files with 116 additions and 99 deletions

View File

@@ -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 paragraph
.nth(1)
.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 expectParagraphState(paragraph, 1, 'h1', 'bbb');
await expectParagraphState(paragraph, 2, 'text', 'ccc');
await expectParagraphVisibility(paragraph, 2, false);
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();
expect(
await paragraph
.nth(2)
.evaluate(
(block: ParagraphBlockComponent) =>
block.model.props.type === 'text' &&
block.model.props.text.toString() === 'ccc'
)
).toBeTruthy();
await expectParagraphVisibility(paragraph, 2, true);
await expectParagraphState(paragraph, 2, 'text', 'ccc');
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();
expect(await paragraph.nth(0).locator('affine-paragraph').count()).toBe(2);
await expectParagraphVisibility(paragraph, 2, false);
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);
expect(await paragraph.nth(2).isVisible()).toBeTruthy();
await expect
.poll(() => paragraph.nth(0).locator('affine-paragraph').count())
.toBe(3);
await expectParagraphVisibility(paragraph, 2, true);
});

View File

@@ -1229,43 +1229,37 @@ export async function getCurrentThemeCSSPropertyValue(
}
export async function scrollToTop(page: Page) {
await page.mouse.wheel(0, -1000);
await page.waitForFunction(() => {
const scrollContainer = document.querySelector('.affine-page-viewport');
if (!scrollContainer) {
throw new Error("Can't find scroll container");
}
return scrollContainer.scrollTop < 10;
const scrollContainer = page.locator('.affine-page-viewport');
await expect(scrollContainer).toBeVisible();
await scrollContainer.evaluate(node => {
(node as HTMLElement).scrollTop = 0;
});
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);
await page
.locator('.affine-page-viewport')
.evaluate(node =>
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
);
const scrollContainer = page.locator('.affine-page-viewport');
await expect(scrollContainer).toBeVisible();
await scrollContainer.evaluate(node => {
const viewport = node as HTMLElement;
viewport.scrollTop = viewport.scrollHeight;
});
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(

View File

@@ -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 () => {
const pages = electronApp.windows();
for (const page of pages) {
if (page.isClosed()) {
continue;
}
await page.close();
}
await electronApp.close();
} finally {
if (electronApp) {
await cleanupElectronApp(electronApp);
}
if (await fs.pathExists(clonedDist)) {
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) => {