snapshot of https://github.com/toeverything/AFFiNE.git (canary, 2026-09-16; blobs > 131072B omitted)

tests/affine-local/e2e/blocksuite/embed/synced.spec.ts

@@ -0,0 +1,170 @@
+import { test } from '@affine-test/kit/playwright';
+import {
+  clickEdgelessModeButton,
+  clickView,
+  createEdgelessNoteBlock,
+  dblclickNoteBody,
+  fitViewportToContent,
+  focusDocTitle,
+  getSelectedXYWH,
+  locateEditorContainer,
+  resizeElementByHandle,
+  scaleElementByHandle,
+} from '@affine-test/kit/utils/editor';
+import { pressEnter } from '@affine-test/kit/utils/keyboard';
+import { openHomePage } from '@affine-test/kit/utils/load-page';
+import {
+  clickNewPageButton,
+  createLinkedPage,
+  waitForEditorLoad,
+} from '@affine-test/kit/utils/page-logic';
+import { expect } from '@playwright/test';
+
+const title = 'Synced Block Test';
+
+test.beforeEach(async ({ page }) => {
+  await openHomePage(page);
+  await waitForEditorLoad(page);
+  await clickNewPageButton(page, title);
+  await pressEnter(page);
+  await page.keyboard.type('test content');
+  await clickEdgelessModeButton(page);
+  const container = locateEditorContainer(page);
+  await container.click();
+});
+
+test('should not show hidden note in embed view page mode', async ({
+  page,
+}) => {
+  await dblclickNoteBody(page);
+  await page.keyboard.type('visible content');
+  await createEdgelessNoteBlock(page, [100, 100]);
+  await page.keyboard.press('Enter');
+  await page.keyboard.type('hidden content');
+  await page.keyboard.press('Enter');
+
+  // create a new page and navigate
+  await createLinkedPage(page, 'Test Page');
+  const inlineLink = page.locator('affine-reference');
+  await inlineLink.dblclick();
+
+  // reference the previous page
+  await focusDocTitle(page);
+  await page.keyboard.press('Enter');
+  await page.keyboard.type('@' + title);
+  const docPopover = page.locator('.linked-doc-popover');
+  await docPopover.getByText(/^Synced Block Test$/).click();
+
+  // switch to embed view
+  await inlineLink.hover();
+  const toolbar = page.locator('affine-toolbar-widget editor-toolbar');
+  await toolbar.getByLabel('Switch view').click();
+  await toolbar.getByLabel('Embed view').click();
+
+  // check the content
+  const embedLink = page.locator('affine-embed-synced-doc-block');
+  await expect(embedLink.getByText(/visible content/)).toBeVisible();
+  await expect(embedLink.getByText(/hidden content/)).toBeHidden();
+});
+
+test.describe('edgeless', () => {
+  test.beforeEach(async ({ page }) => {
+    await clickNewPageButton(page);
+    await clickEdgelessModeButton(page);
+    await clickView(page, [0, 0]);
+    await page.keyboard.type('@' + title);
+    await page
+      .getByTestId('cmdk-quick-search')
+      .getByText(/^Synced Block Test$/)
+      .click();
+
+    await fitViewportToContent(page);
+  });
+
+  test.describe('header of edgeless embed synced doc', () => {
+    test('should fold button works', async ({ page }) => {
+      const embedBlock = page.locator('affine-embed-edgeless-synced-doc-block');
+      const foldButton = embedBlock.getByTestId(
+        'edgeless-embed-synced-doc-fold-button'
+      );
+      const content = embedBlock.locator('editor-host');
+
+      await expect(foldButton).toHaveAttribute('data-folded', 'false');
+      await expect(content).toBeInViewport();
+
+      await foldButton.click();
+
+      await expect(content).not.toBeInViewport();
+      await expect(foldButton).toHaveAttribute('data-folded', 'true');
+    });
+
+    test('should show title in header', async ({ page }) => {
+      const embedBlock = page.locator('affine-embed-edgeless-synced-doc-block');
+      const headerTitle = embedBlock.getByTestId(
+        'edgeless-embed-synced-doc-title'
+      );
+      await expect(headerTitle).toHaveText(title);
+    });
+  });
+
+  test.describe('size adjustment of embed synced doc', () => {
+    test.beforeEach(async ({ page }) => {
+      await scaleElementByHandle(page, [10, 10], 'bottom-right');
+    });
+
+    test('should fold embed synced doc when adjust height to smallest', async ({
+      page,
+    }) => {
+      const [, , , h] = await getSelectedXYWH(page);
+      await resizeElementByHandle(page, [0, -(h - 10)], 'bottom-right');
+
+      const embedBlock = page.locator('affine-embed-edgeless-synced-doc-block');
+      const foldButton = embedBlock.getByTestId(
+        'edgeless-embed-synced-doc-fold-button'
+      );
+      const content = embedBlock.locator('editor-host');
+
+      await expect(foldButton).toHaveAttribute('data-folded', 'true');
+      await expect(content).not.toBeInViewport();
+
+      await foldButton.click();
+      await expect(foldButton).toHaveAttribute('data-folded', 'false');
+      await expect(content).toBeInViewport();
+
+      await embedBlock.click();
+      const [, , , h2] = await getSelectedXYWH(page);
+      expect(
+        h2,
+        'should recover height when unfold embed synced doc which was resized to smallest height directly'
+      ).toEqual(h);
+    });
+
+    test('should be able to adjust height the folded embed synced doc', async ({
+      page,
+    }) => {
+      const embedBlock = page.locator('affine-embed-edgeless-synced-doc-block');
+
+      const content = embedBlock.locator('editor-host');
+      const foldButton = embedBlock.getByTestId(
+        'edgeless-embed-synced-doc-fold-button'
+      );
+      await foldButton.click();
+
+      await resizeElementByHandle(page, [50, 0], 'bottom-right');
+      await expect(content).not.toBeInViewport();
+      await expect(foldButton).toHaveAttribute('data-folded', 'true');
+
+      await resizeElementByHandle(page, [-50, 0], 'bottom-right');
+      await expect(content).not.toBeInViewport();
+      await expect(foldButton).toHaveAttribute('data-folded', 'true');
+
+      await resizeElementByHandle(page, [0, 50], 'bottom-right');
+      await expect(
+        content,
+        'should unfold the embed synced doc when adjust height to greater'
+      ).toBeInViewport();
+      await expect(foldButton).toHaveAttribute('data-folded', 'false');
+      await expect(content).toBeInViewport();
+    });
+  });
+});