e2e(core): add test for split view (#6133)

packages/common/infra/src/atom/settings.ts

@@ -80,7 +80,7 @@ export function setupEditorFlags(docCollection: DocCollection) {
   const syncEditorFlags = () => {
     try {
       const editorFlags = getCurrentStore().get(appSettingBaseAtom).editorFlags;
-      Object.entries(editorFlags).forEach(([key, value]) => {
+      Object.entries(editorFlags ?? {}).forEach(([key, value]) => {
         docCollection.awarenessStore.setFlag(
           key as keyof BlockSuiteFlags,
           value

packages/frontend/core/src/modules/workbench/view/workbench-link.tsx

@@ -18,6 +18,7 @@ export const WorkbenchLink = ({
   const handleClick = useCallback(
     (event: React.MouseEvent<HTMLAnchorElement>) => {
       event.preventDefault();
+      event.stopPropagation();
       // TODO: open this when multi view control is implemented
       if (
         appSettings.enableMultiView &&

tests/affine-desktop/e2e/basic.spec.ts

@@ -2,7 +2,9 @@ import { test } from '@affine-test/kit/electron';
 import { withCtrlOrMeta } from '@affine-test/kit/utils/keyboard';
 import {
   clickNewPageButton,
+  createLinkedPage,
   getBlockSuiteEditorTitle,
+  waitForEmptyEditor,
 } from '@affine-test/kit/utils/page-logic';
 import {
   clickSideBarCurrentWorkspaceBanner,
@@ -25,8 +27,6 @@ test('new page', async ({ page, workspace }) => {
   expect(flavour).toBe('local');
 });
 
-// macOS only
-// if (platform() === 'darwin') {
 test('app sidebar router forward/back', async ({ page }) => {
   {
     // create pages
@@ -83,7 +83,6 @@ test('app sidebar router forward/back', async ({ page }) => {
     await expect(getBlockSuiteEditorTitle(page)).toHaveText('test3');
   }
 });
-// }
 
 test('clientBorder value should disable by default on window', async ({
   page,
@@ -166,3 +165,45 @@ test('delete workspace', async ({ page }) => {
     'Demo Workspace'
   );
 });
+
+// temporary way to enable split view
+async function enableSplitView(page: Page) {
+  await page.evaluate(() => {
+    const settingKey = 'affine-settings';
+    window.localStorage.setItem(
+      settingKey,
+      JSON.stringify({
+        clientBorder: false,
+        fullWidthLayout: false,
+        windowFrameStyle: 'frameless',
+        fontStyle: 'Serif',
+        dateFormat: 'MM/dd/YYYY',
+        startWeekOnMonday: false,
+        enableBlurBackground: true,
+        enableNoisyBackground: true,
+        autoCheckUpdate: true,
+        autoDownloadUpdate: true,
+        enableMultiView: true,
+        editorFlags: {},
+      })
+    );
+  });
+  await page.reload();
+}
+
+test('open split view', async ({ page }) => {
+  await enableSplitView(page);
+  await page.getByTestId('sidebar-new-page-button').click({
+    delay: 100,
+  });
+  await waitForEmptyEditor(page);
+  await page.waitForTimeout(500);
+  await page.keyboard.press('Enter');
+  await createLinkedPage(page, 'hi from another page');
+  await page
+    .locator('.affine-reference-title:has-text("hi from another page")')
+    .click({
+      modifiers: [process.platform === 'darwin' ? 'Meta' : 'Control'],
+    });
+  await expect(page.locator('.doc-title-container')).toHaveCount(2);
+});

tests/affine-desktop/playwright.config.ts

@@ -1,3 +1,5 @@
+import assert from 'node:assert';
+
 import { testResultDir } from '@affine-test/kit/playwright';
 import type { PlaywrightTestConfig } from '@playwright/test';
 // import { devices } from '@playwright/test';
@@ -26,4 +28,23 @@ if (process.env.CI) {
   config.workers = '50%';
 }
 
+if (process.env.DEV_SERVER_URL) {
+  const devServerUrl = new URL(process.env.DEV_SERVER_URL);
+  assert(
+    devServerUrl.origin === 'http://localhost:8080',
+    'DEV_SERVER_URL must be http://localhost:8080'
+  );
+  config.webServer = [
+    {
+      command: 'yarn run start:web-static',
+      port: 8080,
+      timeout: 120 * 1000,
+      reuseExistingServer: !process.env.CI,
+      env: {
+        COVERAGE: process.env.COVERAGE || 'false',
+      },
+    },
+  ];
+}
+
 export default config;