feat(core): set doc mode and primary doc mode separately (#8359)

https://github.com/user-attachments/assets/98c282f2-4c53-475f-bf10-936a626c2630

tests/affine-local/e2e/change-page-mode.spec.ts

@@ -8,56 +8,20 @@ import { openHomePage } from '@affine-test/kit/utils/load-page';
 import {
   clickNewPageButton,
   clickPageMoreActions,
+  getBlockSuiteEditorTitle,
+  waitForAllPagesLoad,
   waitForEditorLoad,
 } from '@affine-test/kit/utils/page-logic';
+import { clickSideBarAllPageButton } from '@affine-test/kit/utils/sidebar';
 import { expect } from '@playwright/test';
 
 test('Switch to edgeless by switch edgeless item', async ({ page }) => {
-  async function getCount(): Promise<number> {
-    return page.evaluate(() => {
-      // @ts-expect-error
-      return globalThis.__toastCount;
-    });
-  }
   await openHomePage(page);
   await waitForEditorLoad(page);
   await clickNewPageButton(page);
   const btn = page.getByTestId('switch-edgeless-mode-button');
-  await page.evaluate(() => {
-    // @ts-expect-error
-    globalThis.__toastCount = 0;
-    window.addEventListener('affine-toast:emit', () => {
-      // @ts-expect-error
-      globalThis.__toastCount++;
-    });
-  });
-  await btn.click();
-  await page.waitForTimeout(100);
-  {
-    const count = await getCount();
-    expect(count).toBe(1);
-  }
-  const edgeless = page.locator('affine-edgeless-root');
-  await expect(edgeless).toBeVisible();
-
-  const editorWrapperPadding = await page
-    .locator('.editor-wrapper.edgeless-mode')
-    .evaluate(element => {
-      return window.getComputedStyle(element).getPropertyValue('padding');
-    });
-  expect(editorWrapperPadding).toBe('0px');
-  {
-    const count = await getCount();
-    expect(count).toBe(1);
-  }
-  await btn.click();
-  await btn.click();
-  await btn.click();
-  await page.waitForTimeout(100);
-  {
-    const count = await getCount();
-    expect(count).toBe(1);
-  }
+  await btn.click({ delay: 100 });
+  await ensureInEdgelessMode(page);
 });
 
 test('Quick Switch Doc Mode, Doc Mode should stable', async ({ page }) => {
@@ -94,13 +58,26 @@ test('Quick Switch Doc Mode, Doc Mode should stable', async ({ page }) => {
   expect(await getPageMode(page)).toBe('page');
 });
 
-test('Convert to edgeless by editor header items', async ({ page }) => {
+test('default to edgeless by editor header items', async ({ page }) => {
   await openHomePage(page);
   await waitForEditorLoad(page);
-  await clickNewPageButton(page);
+  await clickNewPageButton(page, 'this is a new page');
+  const title = getBlockSuiteEditorTitle(page);
+  expect(await title.textContent()).toBe('this is a new page');
+
   await clickPageMoreActions(page);
   const menusEdgelessItem = page.getByTestId('editor-option-menu-edgeless');
   await menusEdgelessItem.click({ delay: 100 });
+
+  await clickSideBarAllPageButton(page);
+  await waitForAllPagesLoad(page);
+  const docItem = page.locator(
+    `[data-testid="page-list-item"]:has-text("this is a new page")`
+  );
+  expect(docItem).not.toBeUndefined();
+  await docItem.click();
+
+  await waitForEditorLoad(page);
   const edgeless = page.locator('affine-edgeless-root');
   await expect(edgeless).toBeVisible();
 });

tests/affine-local/e2e/page-properties.spec.ts

@@ -22,6 +22,7 @@ import {
   openWorkspaceProperties,
   removeSelectedTag,
   searchAndCreateTag,
+  togglePropertyListVisibility,
 } from '@affine-test/kit/utils/properties';
 import { expect } from '@playwright/test';
 
@@ -117,8 +118,9 @@ test('property table reordering', async ({ page }) => {
     'bottom'
   );
 
-  // new order should be (Tags), Number, Date, Checkbox, Text
+  // new order should be Doc mode, (Tags), Number, Date, Checkbox, Text
   for (const [index, property] of [
+    'Doc mode',
     'Tags',
     'Number',
     'Date',
@@ -157,6 +159,7 @@ test('page info show more will show all properties', async ({ page }) => {
   await page.click('[data-testid="property-collapsible-button"]');
 
   for (const [index, property] of [
+    'Doc mode',
     'Tags',
     'Text',
     'Number',
@@ -179,6 +182,7 @@ test('change page properties visibility', async ({ page }) => {
   await addCustomProperty(page, page, 'number');
   await addCustomProperty(page, page, 'date');
   await addCustomProperty(page, page, 'checkbox');
+  await togglePropertyListVisibility(page);
 
   // add some number to number property
   await clickPropertyValue(page, 'Number');

tests/affine-mobile/e2e/detail.spec.ts

@@ -18,7 +18,7 @@ test('switch to page mode', async ({ page }) => {
   await page.click('[data-testid="detail-page-header-more-button"]');
   await expect(page.getByRole('dialog')).toBeVisible();
 
-  await page.getByRole('menuitem', { name: 'convert to page' }).click();
+  await page.getByRole('menuitem', { name: 'Default to Page mode' }).click();
   await expect(page.locator('.doc-title-container')).toBeVisible();
 });
 

tests/kit/utils/properties.ts

@@ -93,11 +93,36 @@ export const clickAddPropertyButton = async (root: Locator | Page) => {
     .click();
 };
 
+export const ensureAddPropertyButtonVisible = async (
+  page: Page,
+  root: Locator | Page
+) => {
+  if (
+    await root
+      .getByRole('button', {
+        name: 'Add property',
+      })
+      .isVisible()
+  ) {
+    return;
+  }
+  await togglePropertyListVisibility(page);
+  await page.waitForTimeout(500);
+  await expect(
+    root.getByRole('button', { name: 'Add property' })
+  ).toBeVisible();
+};
+
+export const togglePropertyListVisibility = async (page: Page) => {
+  await page.getByTestId('property-collapsible-button').click();
+};
+
 export const addCustomProperty = async (
   page: Page,
   root: Locator | Page,
   type: string
 ) => {
+  ensureAddPropertyButtonVisible(page, root);
   await clickAddPropertyButton(root);
   await page
     .locator(