mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-13 04:48:53 +00:00
823bf40a57
Close [BS-3029](https://linear.app/affine-design/issue/BS-3029/frame-里面的-shape-没办法进入文本编辑模式) Close [BS-3082](https://linear.app/affine-design/issue/BS-3082/按s切换至shape工具，在白板上点击会创建两个shape) Close [BS-3091](https://linear.app/affine-design/issue/BS-3082/按s切换至shape工具，在白板上点击会创建两个shape) ## Fix Shape Tool Issues This PR addresses several issues with the shape and mindmap tools functionality in the editor: 1. **Fix text editing after mode switching**: Resolves an issue where users couldn't edit text in shapes after switching editor modes. The fix ensures the edgeless block is properly retrieved when double-clicking on a shape. 2. **Improve tool switching behavior**: Fixes issues with tool overlays not showing or being repeated when switching between tools. This includes: - Properly handling tool overlay visibility - Ensuring only one tool is active at a time when using keyboard shortcuts - Adding proper cleanup when switching tools 3. **Add comprehensive tests**: Adds new test cases to verify: - Shape creation with keyboard shortcuts - Shape text editing after mode switching - Tool switching behavior with keyboard shortcuts
119 lines
3.5 KiB
TypeScript
119 lines
3.5 KiB
TypeScript
import { expect } from '@playwright/test';
|
|
|
|
import { clickView } from '../utils/actions/click.js';
|
|
import {
|
|
addBasicRectShapeElement,
|
|
getSelectedBoundCount,
|
|
locatorComponentToolbar,
|
|
resizeElementByHandle,
|
|
selectNoteInEdgeless,
|
|
switchEditorMode,
|
|
zoomResetByKeyboard,
|
|
} from '../utils/actions/edgeless.js';
|
|
import {
|
|
pressBackspace,
|
|
selectAllBlocksByKeyboard,
|
|
} from '../utils/actions/keyboard.js';
|
|
import {
|
|
enterPlaygroundRoom,
|
|
initEmptyEdgelessState,
|
|
} from '../utils/actions/misc.js';
|
|
import { test } from '../utils/playwright.js';
|
|
|
|
test('toolbar should appear when select note', async ({ page }) => {
|
|
await enterPlaygroundRoom(page);
|
|
const { noteId } = await initEmptyEdgelessState(page);
|
|
await switchEditorMode(page);
|
|
|
|
await selectNoteInEdgeless(page, noteId);
|
|
|
|
const toolbar = locatorComponentToolbar(page);
|
|
await expect(toolbar).toBeVisible();
|
|
});
|
|
|
|
test('tooltip should be hidden after clicking on button', async ({ page }) => {
|
|
await enterPlaygroundRoom(page);
|
|
const { noteId } = await initEmptyEdgelessState(page);
|
|
await switchEditorMode(page);
|
|
|
|
await selectNoteInEdgeless(page, noteId);
|
|
|
|
const toolbar = locatorComponentToolbar(page);
|
|
const modeBtn = toolbar.getByRole('button', { name: 'Mode' });
|
|
|
|
await modeBtn.hover();
|
|
await expect(page.locator('.blocksuite-portal')).toBeVisible();
|
|
|
|
await modeBtn.click();
|
|
await expect(page.locator('.blocksuite-portal')).toBeHidden();
|
|
await expect(page.locator('note-display-mode-panel')).toBeVisible();
|
|
|
|
await modeBtn.click();
|
|
await expect(page.locator('.blocksuite-portal')).toBeVisible();
|
|
await expect(page.locator('note-display-mode-panel')).toBeHidden();
|
|
|
|
await modeBtn.click();
|
|
await expect(page.locator('.blocksuite-portal')).toBeHidden();
|
|
await expect(page.locator('note-display-mode-panel')).toBeVisible();
|
|
|
|
const colorBtn = toolbar.getByRole('button', {
|
|
name: 'Background',
|
|
});
|
|
|
|
await colorBtn.hover();
|
|
await expect(page.locator('.blocksuite-portal')).toBeVisible();
|
|
|
|
await colorBtn.click();
|
|
await expect(page.locator('.blocksuite-portal')).toBeHidden();
|
|
await expect(page.locator('note-display-mode-panel')).toBeHidden();
|
|
await expect(page.locator('edgeless-color-panel')).toBeVisible();
|
|
});
|
|
|
|
test('should be hidden when resizing element', async ({ page }) => {
|
|
await enterPlaygroundRoom(page);
|
|
await initEmptyEdgelessState(page);
|
|
await switchEditorMode(page);
|
|
await zoomResetByKeyboard(page);
|
|
|
|
await addBasicRectShapeElement(page, { x: 210, y: 110 }, { x: 310, y: 210 });
|
|
await page.mouse.click(220, 120);
|
|
|
|
const toolbar = locatorComponentToolbar(page);
|
|
await expect(toolbar).toBeVisible();
|
|
|
|
await resizeElementByHandle(
|
|
page,
|
|
{ x: 400, y: 300 },
|
|
'top-left',
|
|
30,
|
|
async () => {
|
|
await expect(toolbar).toBeHidden();
|
|
}
|
|
);
|
|
|
|
await expect(toolbar).toBeVisible();
|
|
});
|
|
|
|
test('should only one tool active at the same time when using shortcut to switch tool', async ({
|
|
page,
|
|
}) => {
|
|
await enterPlaygroundRoom(page);
|
|
await initEmptyEdgelessState(page);
|
|
await switchEditorMode(page);
|
|
await clickView(page, [0, 0]);
|
|
await selectAllBlocksByKeyboard(page);
|
|
await pressBackspace(page);
|
|
|
|
await page.keyboard.press('s');
|
|
await page.keyboard.press('m');
|
|
await page.keyboard.press('n');
|
|
|
|
await clickView(page, [100, 100]);
|
|
await clickView(page, [0, 0]); // click on empty space to deselect the note
|
|
await selectAllBlocksByKeyboard(page);
|
|
expect(
|
|
await getSelectedBoundCount(page),
|
|
'only a note should be created'
|
|
).toBe(1);
|
|
});
|