refactor(editor): remove edit view of database block properties (#10748)

blocksuite/tests-legacy/e2e/database/actions.ts

@@ -1,7 +1,4 @@
-import type {
-  RichTextCell,
-  RichTextCellEditing,
-} from '@blocksuite/affine/blocks/database';
+import type { RichTextCell } from '@blocksuite/affine/blocks/database';
 import { ZERO_WIDTH_SPACE } from '@blocksuite/affine/inline';
 import { expect, type Locator, type Page } from '@playwright/test';
 
@@ -77,7 +74,7 @@ export function clickColumnType(page: Page, columnType: string) {
 
 export function getDatabaseBodyRows(page: Page) {
   const rowContainer = page.locator('.affine-database-block-rows');
-  return rowContainer.locator('.database-row');
+  return rowContainer.locator('data-view-table-row');
 }
 
 export function getDatabaseBodyRow(page: Page, rowIndex = 0) {
@@ -85,28 +82,17 @@ export function getDatabaseBodyRow(page: Page, rowIndex = 0) {
   return rows.nth(rowIndex);
 }
 
-export function getDatabaseTableContainer(page: Page) {
-  const container = page.locator('.affine-database-table-container');
-  return container;
-}
-
 export async function assertDatabaseTitleColumnText(
   page: Page,
   title: string,
-  index = 0
+  rowIndex = 0,
+  columnIndex = 0
 ) {
-  const text = await page.evaluate(index => {
-    const rowContainer = document.querySelector('.affine-database-block-rows');
-    const row = rowContainer?.querySelector(
-      `.database-row:nth-child(${index + 1})`
-    );
-    const titleColumnCell = row?.querySelector('.database-cell:nth-child(1)');
-    const titleSpan = titleColumnCell?.querySelector(
-      '.data-view-header-area-rich-text'
-    ) as HTMLElement;
-    if (!titleSpan) throw new Error('Cannot find database title column editor');
-    return titleSpan.innerText;
-  }, index);
+  const selectCell1 = getDatabaseCell(page, {
+    rowIndex: rowIndex,
+    columnIndex: columnIndex,
+  });
+  const text = await selectCell1.innerText();
 
   if (title === '') {
     expect(text).toMatch(new RegExp(`^(|[${ZERO_WIDTH_SPACE}])$`));
@@ -115,49 +101,34 @@ export async function assertDatabaseTitleColumnText(
   }
 }
 
-export function getDatabaseBodyCell(
+export function getDatabaseCell(
   page: Page,
   {
     rowIndex,
+    columnType,
     columnIndex,
   }: {
-    rowIndex: number;
-    columnIndex: number;
+    rowIndex?: number;
+    columnType?: string;
+    columnIndex?: number;
   }
 ) {
   const row = getDatabaseBodyRow(page, rowIndex);
-  const cell = row.locator('.database-cell').nth(columnIndex);
-  return cell;
+  const index = columnIndex ?? 0;
+  const columns = columnType
+    ? row.getByTestId(columnType)
+    : row.locator('affine-database-cell-container');
+  return columns.nth(index);
 }
 
-export function getDatabaseBodyCellContent(
-  page: Page,
-  {
-    rowIndex,
-    columnIndex,
-    cellClass,
-  }: {
-    rowIndex: number;
-    columnIndex: number;
-    cellClass: string;
-  }
-) {
-  const cell = getDatabaseBodyCell(page, { rowIndex, columnIndex });
-  const cellContent = cell.locator(`.${cellClass}`);
-  return cellContent;
-}
-
-export function getFirstColumnCell(page: Page, cellClass: string) {
-  const cellContent = getDatabaseBodyCellContent(page, {
-    rowIndex: 0,
-    columnIndex: 1,
-    cellClass,
-  });
-  return cellContent;
-}
+export const getDatabaseColumnCells = (page: Page, columnIndex: number) => {
+  return page.locator(
+    `affine-database-cell-container[data-column-index="${columnIndex}"]`
+  );
+};
 
 export async function clickSelectOption(page: Page, index = 0) {
-  await page.locator('.select-option-icon').nth(index).click();
+  await page.getByTestId('option-more').nth(index).click();
 }
 
 export async function performSelectColumnTagAction(
@@ -207,14 +178,10 @@ export async function assertDatabaseCellRichTexts(
     `affine-database-cell-container[data-row-index='${rowIndex}'][data-column-index='${columnIndex}']`
   );
 
-  const cellEditing = cellContainer.locator(
-    'affine-database-rich-text-cell-editing'
-  );
   const cell = cellContainer.locator('affine-database-rich-text-cell');
 
-  const richText = (await cellEditing.count()) === 0 ? cell : cellEditing;
-  const actualTexts = await richText.evaluate(ele => {
-    return (ele as RichTextCellEditing).inlineEditor?.yTextString;
+  const actualTexts = await cell.evaluate(ele => {
+    return (ele as RichTextCell).inlineEditor$.value?.yTextString;
   });
   expect(actualTexts).toEqual(text);
 }
@@ -263,13 +230,11 @@ export async function assertDatabaseCellLink(
       const cell = row?.querySelector(
         `.database-cell:nth-child(${columnIndex + 1})`
       );
-      const richText =
-        cell?.querySelector<RichTextCell>('affine-database-link-cell') ??
-        cell?.querySelector<RichTextCellEditing>(
-          'affine-database-link-cell-editing'
-        );
+      const richText = cell?.querySelector<RichTextCell>(
+        'affine-database-link-cell'
+      );
       if (!richText) throw new Error('Missing database rich text cell');
-      return richText.inlineEditor!.yText.toString();
+      return richText.inlineEditor$.value!.yText.toString();
     },
     { rowIndex, columnIndex }
   );
@@ -381,7 +346,7 @@ export async function assertCellsSelection(
     const focusBox = await getBoundingBox(focus);
 
     const [rowIndex, columnIndex] = start;
-    const cell = getDatabaseBodyCell(page, { rowIndex, columnIndex });
+    const cell = getDatabaseCell(page, { rowIndex, columnIndex: columnIndex });
     const cellBox = await getBoundingBox(cell);
     expect(focusBox).toEqual({
       x: cellBox.x,
@@ -407,7 +372,7 @@ export async function assertCellsSelection(
     let x = 0;
     let y = 0;
     for (let i = rowIndexStart; i <= rowIndexEnd; i++) {
-      const cell = getDatabaseBodyCell(page, {
+      const cell = getDatabaseCell(page, {
         rowIndex: i,
         columnIndex: columnIndexStart,
       });
@@ -419,7 +384,7 @@ export async function assertCellsSelection(
     }
 
     for (let j = columnIndexStart; j <= columnIndexEnd; j++) {
-      const cell = getDatabaseBodyCell(page, {
+      const cell = getDatabaseCell(page, {
         rowIndex: rowIndexStart,
         columnIndex: j,
       });
@@ -468,7 +433,7 @@ export async function focusKanbanCardHeader(page: Page, index = 0) {
 export async function clickKanbanCardHeader(page: Page, index = 0) {
   const cardHeader = page.locator('data-view-header-area-text').nth(index);
   await cardHeader.click();
-  await cardHeader.click();
+  await pressEnter(page);
 }
 
 export async function assertKanbanCardHeaderText(
@@ -563,6 +528,7 @@ export function getKanbanCard(
   const card = group.locator('affine-data-view-kanban-card').nth(cardIndex);
   return card;
 }
+
 export const moveToCenterOf = async (page: Page, locator: Locator) => {
   const box = (await locator.boundingBox())!;
   expect(box).toBeDefined();

blocksuite/tests-legacy/e2e/database/clipboard.spec.ts

@@ -24,7 +24,7 @@ import { assertRichTexts } from '../utils/asserts.js';
 import { test } from '../utils/playwright.js';
 import {
   assertDatabaseTitleColumnText,
-  getDatabaseBodyCell,
+  getDatabaseCell,
   getElementStyle,
   initDatabaseColumn,
   switchColumnType,
@@ -92,12 +92,12 @@ test.describe('copy&paste when selecting', () => {
     await initDatabaseRowWithData(page, '');
     await initDatabaseRowWithData(page, '');
 
-    const startCell = getDatabaseBodyCell(page, {
+    const startCell = getDatabaseCell(page, {
       rowIndex: 0,
       columnIndex: 0,
     });
     const startCellBox = await getBoundingBox(startCell);
-    const endCell = getDatabaseBodyCell(page, { rowIndex: 1, columnIndex: 1 });
+    const endCell = getDatabaseCell(page, { rowIndex: 1, columnIndex: 1 });
     const endCellBox = await getBoundingBox(endCell);
     const startX = startCellBox.x + startCellBox.width / 2;
     const startY = startCellBox.y + startCellBox.height / 2;
@@ -120,11 +120,11 @@ test.describe('copy&paste when selecting', () => {
 
     await assertDatabaseTitleColumnText(page, 'text1', 2);
     await assertDatabaseTitleColumnText(page, 'text2', 3);
-    const selectCell21 = getDatabaseBodyCell(page, {
+    const selectCell21 = getDatabaseCell(page, {
       rowIndex: 2,
       columnIndex: 1,
     });
-    const selectCell31 = getDatabaseBodyCell(page, {
+    const selectCell31 = getDatabaseCell(page, {
       rowIndex: 3,
       columnIndex: 1,
     });
@@ -145,7 +145,7 @@ test.describe('copy&paste when selecting', () => {
     await waitNextFrame(page, 100);
     await initDatabaseColumn(page);
     await switchColumnType(page, 'Number', 2);
-    const numberCell = getDatabaseBodyCell(page, {
+    const numberCell = getDatabaseCell(page, {
       rowIndex: 0,
       columnIndex: 2,
     });
@@ -162,12 +162,12 @@ test.describe('copy&paste when selecting', () => {
     await waitNextFrame(page);
 
     await assertDatabaseTitleColumnText(page, 'text1', 1);
-    const selectCell = getDatabaseBodyCell(page, {
+    const selectCell = getDatabaseCell(page, {
       rowIndex: 1,
       columnIndex: 1,
     });
     expect(await selectCell.innerText()).toBe('abc');
-    const selectNumberCell = getDatabaseBodyCell(page, {
+    const selectNumberCell = getDatabaseCell(page, {
       rowIndex: 1,
       columnIndex: 2,
     });

blocksuite/tests-legacy/e2e/database/column.spec.ts

@@ -27,8 +27,8 @@ import {
   changeColumnType,
   clickDatabaseOutside,
   clickSelectOption,
+  getDatabaseCell,
   getDatabaseHeaderColumn,
-  getFirstColumnCell,
   initDatabaseColumn,
   performColumnAction,
   performSelectColumnTagAction,
@@ -67,7 +67,10 @@ test.describe('column operations', () => {
     const { text: title1 } = await getDatabaseHeaderColumn(page, 1);
     expect(title1).toBe('Column 1');
 
-    const selected = getFirstColumnCell(page, 'select-selected');
+    const selected = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'multi-select',
+    });
     expect(await selected.innerText()).toBe('123');
 
     await initDatabaseColumn(page, 'abc');
@@ -198,7 +201,10 @@ test.describe('switch column type', () => {
     await pressEscape(page);
     await changeColumnType(page, 1, 'Number');
 
-    const cell = getFirstColumnCell(page, 'number');
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'number',
+    });
     await assertDatabaseCellNumber(page, {
       text: '',
     });
@@ -217,10 +223,11 @@ test.describe('switch column type', () => {
     await pressEscape(page);
     await switchColumnType(page, 'Text');
 
-    // For now, rich-text will only be initialized on click
-    // Therefore, for the time being, here is to detect whether there is '.affine-database-rich-text'
-    const cell = getFirstColumnCell(page, 'affine-database-rich-text');
-    expect(await cell.count()).toBe(1);
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'rich-text',
+    });
+    await cell.isVisible();
     await pressEnter(page);
     await type(page, '123');
     await pressEscape(page);
@@ -239,35 +246,39 @@ test.describe('switch column type', () => {
     await type(page, 'abc');
     await pressEnter(page);
     await pressEscape(page);
-    const cell = getFirstColumnCell(page, 'select-selected');
-    expect(await cell.count()).toBe(2);
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnIndex: 1,
+    });
+    const tags = cell.getByTestId('tag-selected');
+    expect(await tags.count()).toBe(2);
 
     await switchColumnType(page, 'Select', 1);
-    expect(await cell.count()).toBe(1);
-    expect(await cell.innerText()).toBe('123');
+    expect(await tags.count()).toBe(1);
+    expect(await tags.innerText()).toBe('123');
 
     await pressEnter(page);
     await type(page, 'def');
     await pressEnter(page);
-    expect(await cell.innerText()).toBe('def');
+    expect(await tags.innerText()).toBe('def');
 
     await switchColumnType(page, 'Multi-select');
     await pressEnter(page);
     await type(page, '666');
     await pressEnter(page);
     await pressEscape(page);
-    expect(await cell.count()).toBe(2);
-    expect(await cell.nth(0).innerText()).toBe('def');
-    expect(await cell.nth(1).innerText()).toBe('666');
+    expect(await tags.count()).toBe(2);
+    expect(await tags.nth(0).innerText()).toBe('def');
+    expect(await tags.nth(1).innerText()).toBe('666');
 
     await switchColumnType(page, 'Select');
-    expect(await cell.count()).toBe(1);
-    expect(await cell.innerText()).toBe('def');
+    expect(await tags.count()).toBe(1);
+    expect(await tags.innerText()).toBe('def');
 
     await pressEnter(page);
     await type(page, '888');
     await pressEnter(page);
-    expect(await cell.innerText()).toBe('888');
+    expect(await tags.innerText()).toBe('888');
   });
 
   test('switch between number and rich-text', async ({ page }) => {
@@ -302,12 +313,18 @@ test.describe('switch column type', () => {
     await switchColumnType(page, 'Number');
 
     await initDatabaseDynamicRowWithData(page, '123', true);
-    const cell = getFirstColumnCell(page, 'number');
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'number',
+    });
     expect((await cell.textContent())?.trim()).toBe('123');
 
     await switchColumnType(page, 'Select');
     await initDatabaseDynamicRowWithData(page, 'abc');
-    const selectCell = getFirstColumnCell(page, 'select-selected');
+    const selectCell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'select',
+    });
     expect(await selectCell.innerText()).toBe('abc');
 
     await switchColumnType(page, 'Number');
@@ -325,7 +342,10 @@ test.describe('switch column type', () => {
     await pressEscape(page);
     await changeColumnType(page, 1, 'Checkbox');
 
-    const checkbox = getFirstColumnCell(page, 'checkbox');
+    const checkbox = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'checkbox',
+    }).locator('.checkbox');
     await expect(checkbox).not.toHaveClass('checked');
 
     await waitNextFrame(page, 500);
@@ -345,7 +365,10 @@ test.describe('switch column type', () => {
     await pressEscape(page);
     await changeColumnType(page, 1, 'Checkbox');
 
-    let checkbox = getFirstColumnCell(page, 'checkbox');
+    let checkbox = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'checkbox',
+    });
     await expect(checkbox).not.toHaveClass('checked');
 
     // checked
@@ -357,7 +380,10 @@ test.describe('switch column type', () => {
     await clickDatabaseOutside(page);
     await waitNextFrame(page, 100);
     await changeColumnType(page, 1, 'Checkbox');
-    checkbox = getFirstColumnCell(page, 'checkbox');
+    checkbox = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'checkbox',
+    }).locator('.checkbox');
     await expect(checkbox).toHaveClass(/checked/);
 
     // not checked
@@ -369,7 +395,10 @@ test.describe('switch column type', () => {
     await clickDatabaseOutside(page);
     await waitNextFrame(page, 100);
     await changeColumnType(page, 1, 'Checkbox');
-    checkbox = getFirstColumnCell(page, 'checkbox');
+    checkbox = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'checkbox',
+    });
     await expect(checkbox).not.toHaveClass('checked');
   });
 
@@ -382,10 +411,14 @@ test.describe('switch column type', () => {
     await pressEscape(page);
     await switchColumnType(page, 'Progress');
 
-    const progress = getFirstColumnCell(page, 'progress');
-    expect(await progress.textContent()).toBe('0');
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'progress',
+    });
+    const progress = cell.getByTestId('progress');
+    expect((await progress.textContent())?.trim()).toBe('0');
     await waitNextFrame(page, 500);
-    const progressBg = page.locator('.affine-database-progress-bg');
+    const progressBg = cell.getByTestId('progress-background');
     const {
       x: progressBgX,
       y: progressBgY,
@@ -393,7 +426,7 @@ test.describe('switch column type', () => {
     } = await getBoundingBox(progressBg);
     await page.mouse.move(progressBgX, progressBgY);
     await page.mouse.click(progressBgX, progressBgY);
-    const dragHandle = page.locator('.affine-database-progress-drag-handle');
+    const dragHandle = cell.getByTestId('progress-drag-handle');
     const {
       x: dragX,
       y: dragY,
@@ -427,19 +460,25 @@ test.describe('switch column type', () => {
     await switchColumnType(page, 'Link');
 
     const linkText = 'http://example.com';
-    const cell = getFirstColumnCell(page, 'affine-database-link');
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'link',
+    });
     await pressEnter(page);
     await type(page, linkText);
     await pressEscape(page);
-    const link = cell.locator('affine-database-link-node > a');
-    const linkContent = link.locator('.link-node-text');
+    const link = cell.getByTestId('property-link-a');
     await expect(link).toHaveAttribute('href', linkText);
-    expect(await linkContent.textContent()).toBe(linkText);
+    expect(await link.textContent()).toBe(linkText);
 
     // not link text
     await cell.hover();
-    const linkEdit = getFirstColumnCell(page, 'affine-database-link-icon');
+    const linkEdit = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'link',
+    }).getByTestId('edit-link-button');
     await linkEdit.click();
+    await waitNextFrame(page);
     await selectAllByKeyboard(page);
     await type(page, 'abc');
     await pressEnter(page);
@@ -461,7 +500,7 @@ test.describe('select column tag action', () => {
     await pressArrowRight(page);
     await type(page, '4567abc00');
     await pressEnter(page);
-    const options = page.locator('.select-options-container .tag-text');
+    const options = page.getByTestId('tag-option-list').getByTestId('tag-name');
     expect(await options.nth(0).innerText()).toBe('abc4567abc00');
     expect(await options.nth(1).innerText()).toBe('123');
   });
@@ -479,7 +518,7 @@ test.describe('select column tag action', () => {
     // esc
     await pressEscape(page);
     await pressEscape(page);
-    const options = page.locator('.select-options-container .tag-text');
+    const options = page.getByTestId('tag-option-list').getByTestId('tag-name');
     const option1 = options.nth(0);
     expect(await option1.innerText()).toBe('123456');
   });

blocksuite/tests-legacy/e2e/database/database.spec.ts

@@ -40,9 +40,8 @@ import {
   clickDatabaseOutside,
   focusDatabaseHeader,
   focusDatabaseSearch,
-  getDatabaseBodyCell,
+  getDatabaseCell,
   getDatabaseHeaderColumn,
-  getFirstColumnCell,
   initDatabaseColumn,
   switchColumnType,
 } from './actions.js';
@@ -66,9 +65,9 @@ test('edit database block title and create new rows', async ({ page }) => {
   await assertBlockProps(page, '2', {
     title: 'hello',
   });
-  await undoByClick(page);
+  await undoByKeyboard(page);
   await assertBlockProps(page, '2', {
-    title: 'Database 1',
+    title: '',
   });
   await initDatabaseRowWithData(page, '');
   await initDatabaseRowWithData(page, '');
@@ -103,7 +102,10 @@ test('should modify the value when the input loses focus', async ({ page }) => {
   await initDatabaseDynamicRowWithData(page, '1', true);
 
   await clickDatabaseOutside(page);
-  const cell = getFirstColumnCell(page, 'number');
+  const cell = getDatabaseCell(page, {
+    rowIndex: 0,
+    columnType: 'number',
+  });
   const text = await cell.textContent();
   expect(text?.trim()).toBe('1');
 });
@@ -116,13 +118,17 @@ test('should rich-text column support soft enter', async ({ page }) => {
   await switchColumnType(page, 'Text');
   await initDatabaseDynamicRowWithData(page, '123', true);
 
-  const cell = getFirstColumnCell(page, 'affine-database-rich-text');
-  await cell.click();
+  // const cell = getDatabaseCell(page, {
+  //   rowIndex: 0,
+  //   columnType: 'rich-text',
+  // });
+  // await cell.click();
+  await pressEnter(page);
   await pressArrowLeft(page);
   await pressEnter(page);
   await assertDatabaseCellRichTexts(page, { text: '123' });
 
-  await cell.click();
+  await pressEnter(page);
   await pressArrowRight(page);
   await pressArrowLeft(page);
   await pressShiftEnter(page);
@@ -139,10 +145,13 @@ test('should the multi-select mode work correctly', async ({ page }) => {
   await pressEscape(page);
   await initDatabaseDynamicRowWithData(page, '2');
   await pressEscape(page);
-  const cell = getFirstColumnCell(page, 'select-selected');
-  expect(await cell.count()).toBe(2);
-  expect(await cell.nth(0).innerText()).toBe('1');
-  expect(await cell.nth(1).innerText()).toBe('2');
+  const tags = getDatabaseCell(page, {
+    rowIndex: 0,
+    columnType: 'multi-select',
+  }).getByTestId('tag-selected');
+  expect(await tags.count()).toBe(2);
+  expect(await tags.nth(0).innerText()).toBe('1');
+  expect(await tags.nth(1).innerText()).toBe('2');
 });
 
 test('should database search work', async ({ page }) => {
@@ -375,7 +384,10 @@ test('should title column support quick changing of column type', async ({
   await typeIcon.click();
   await waitNextFrame(page);
   await clickColumnType(page, 'Select');
-  const cell = getFirstColumnCell(page, 'select-selected');
+  const cell = getDatabaseCell(page, {
+    rowIndex: 0,
+    columnType: 'select',
+  });
   expect(await cell.count()).toBe(1);
 });
 
@@ -513,12 +525,19 @@ test.describe('readonly mode', () => {
     await switchColumnType(page, 'Text');
     await initDatabaseDynamicRowWithData(page, '', true);
 
-    const cell = getFirstColumnCell(page, 'affine-database-rich-text');
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'rich-text',
+    });
     await cell.click();
+    await pressEnter(page);
     await type(page, '123');
+    await pressEnter(page);
     await assertDatabaseCellRichTexts(page, { text: '123' });
 
     await switchReadonly(page);
+    await waitNextFrame(page);
+    await pressEnter(page);
     await pressBackspace(page);
     await type(page, '789');
     await assertDatabaseCellRichTexts(page, { text: '123' });
@@ -610,7 +629,10 @@ test.describe('readonly mode', () => {
     const database = page.locator('affine-database');
     await expect(database).toBeVisible();
 
-    const cell = getFirstColumnCell(page, 'affine-database-rich-text');
+    const cell = getDatabaseCell(page, {
+      rowIndex: 0,
+      columnType: 'rich-text',
+    });
     await cell.click();
 
     const focusBorder = database.locator(
@@ -635,11 +657,11 @@ test.describe('readonly mode', () => {
     const database = page.locator('affine-database');
     await expect(database).toBeVisible();
 
-    const startCell = getDatabaseBodyCell(page, {
+    const startCell = getDatabaseCell(page, {
       rowIndex: 0,
       columnIndex: 0,
     });
-    const endCell = getDatabaseBodyCell(page, {
+    const endCell = getDatabaseCell(page, {
       rowIndex: 0,
       columnIndex: 1,
     });

blocksuite/tests-legacy/e2e/database/selection.spec.ts

@@ -33,7 +33,7 @@ import {
   assertRowsSelection,
   clickKanbanCardHeader,
   focusKanbanCardHeader,
-  getDatabaseBodyCell,
+  getDatabaseCell,
   getKanbanCard,
   initDatabaseColumn,
   switchColumnType,
@@ -62,7 +62,7 @@ test.describe('focus', () => {
     await switchColumnType(page, 'Number');
     await initDatabaseDynamicRowWithData(page, '123', true);
 
-    const selectColumn = getDatabaseBodyCell(page, {
+    const selectColumn = getDatabaseCell(page, {
       rowIndex: 1,
       columnIndex: 1,
     });
@@ -105,7 +105,6 @@ test.describe('row-level selection', () => {
 
     await initDatabaseColumn(page);
     await initDatabaseRowWithData(page, 'title');
-    await pressEscape(page);
     await waitNextFrame(page, 100);
     await assertCellsSelection(page, {
       start: [0, 0],
@@ -123,7 +122,6 @@ test.describe('row-level selection', () => {
 
     await initDatabaseColumn(page);
     await initDatabaseDynamicRowWithData(page, '123', true);
-    await pressEscape(page);
     await waitNextFrame(page, 100);
     await pressEscape(page);
     await assertRowsSelection(page, [0, 0]);
@@ -134,12 +132,11 @@ test.describe('row-level selection', () => {
     await initEmptyDatabaseState(page);
 
     await initDatabaseColumn(page);
-    await initDatabaseDynamicRowWithData(page, '', true);
-    await pressEscape(page);
     await switchColumnType(page, 'Number');
+    await initDatabaseDynamicRowWithData(page, 'asd', true);
     await initDatabaseDynamicRowWithData(page, '123', true);
 
-    const selectColumn = getDatabaseBodyCell(page, {
+    const selectColumn = getDatabaseCell(page, {
       rowIndex: 1,
       columnIndex: 1,
     });
@@ -250,11 +247,11 @@ test.describe('cell-level selection', () => {
     await switchColumnType(page, 'Number');
     await initDatabaseDynamicRowWithData(page, '123', true);
 
-    const startCell = getDatabaseBodyCell(page, {
+    const startCell = getDatabaseCell(page, {
       rowIndex: 0,
       columnIndex: 0,
     });
-    const endCell = getDatabaseBodyCell(page, {
+    const endCell = getDatabaseCell(page, {
       rowIndex: 1,
       columnIndex: 1,
     });
@@ -293,11 +290,11 @@ test.describe('cell-level selection', () => {
     await initDatabaseDynamicRowWithData(page, '123', false);
     await pressEscape(page);
 
-    const startCell = getDatabaseBodyCell(page, {
+    const startCell = getDatabaseCell(page, {
       rowIndex: 0,
       columnIndex: 0,
     });
-    const endCell = getDatabaseBodyCell(page, {
+    const endCell = getDatabaseCell(page, {
       rowIndex: 1,
       columnIndex: 1,
     });
@@ -319,12 +316,12 @@ test.describe('cell-level selection', () => {
     await pressBackspace(page);
     await assertDatabaseTitleColumnText(page, '', 0);
     await assertDatabaseTitleColumnText(page, '', 1);
-    const selectCell1 = getDatabaseBodyCell(page, {
+    const selectCell1 = getDatabaseCell(page, {
       rowIndex: 0,
       columnIndex: 1,
     });
     expect(await selectCell1.innerText()).toBe('');
-    const selectCell2 = getDatabaseBodyCell(page, {
+    const selectCell2 = getDatabaseCell(page, {
       rowIndex: 1,
       columnIndex: 1,
     });