mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-15 17:16:16 +08:00
chore(editor): keep root slash menu open when pressing left arrow left (#10730)
Close [BS-2643](https://linear.app/affine-design/issue/BS-2643/slash-menu-左键不关闭根菜单)
This commit is contained in:
@@ -216,7 +216,14 @@ export class SlashMenu extends WithDisposable(LitElement) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (key === 'ArrowRight' || key === 'ArrowLeft' || key === 'Escape') {
|
||||
if (key === 'Escape') {
|
||||
this.abortController.abort();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
return;
|
||||
}
|
||||
|
||||
if (key === 'ArrowRight' || key === 'ArrowLeft') {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -542,7 +549,14 @@ export class InnerSlashMenu extends WithDisposable(LitElement) {
|
||||
event.stopPropagation();
|
||||
}
|
||||
|
||||
if ((key === 'ArrowLeft' || key === 'Escape') && notControlShift) {
|
||||
if (key === 'ArrowLeft' && notControlShift) {
|
||||
if (this.depth != 0) this.abortController.abort();
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
|
||||
if (key === 'Escape' && notControlShift) {
|
||||
this.abortController.abort();
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
@@ -365,9 +365,7 @@ test.describe('slash menu should show and hide correctly', () => {
|
||||
await expect(subMenu).toBeHidden();
|
||||
});
|
||||
|
||||
test('should open and close menu when using left right arrow, Enter, Esc keys', async ({
|
||||
page,
|
||||
}) => {
|
||||
test('navigate menu with left right arrow and Enter', async ({ page }) => {
|
||||
await initEmptyParagraphState(page);
|
||||
await focusRichText(page);
|
||||
|
||||
@@ -381,7 +379,11 @@ test.describe('slash menu should show and hide correctly', () => {
|
||||
await type(page, '/');
|
||||
await expect(slashMenu).toBeVisible();
|
||||
await pressArrowLeft(page);
|
||||
await expect(slashMenu).toBeHidden();
|
||||
await expect(
|
||||
slashMenu,
|
||||
'root menu should be visible when press arrow left'
|
||||
).toBeVisible();
|
||||
await pressEscape(page);
|
||||
|
||||
// Test sub menu case
|
||||
const slashItems = slashMenu.locator('icon-button');
|
||||
@@ -407,9 +409,29 @@ test.describe('slash menu should show and hide correctly', () => {
|
||||
await pressEnter(page);
|
||||
await expect(slashMenu).toBeVisible();
|
||||
await expect(subMenu).toBeVisible();
|
||||
});
|
||||
|
||||
await pressEscape(page);
|
||||
test('menu should be hidden when press escape', async ({ page }) => {
|
||||
await initEmptyParagraphState(page);
|
||||
await focusRichText(page);
|
||||
|
||||
const slashMenu = page.locator('.slash-menu[data-testid=sub-menu-0]');
|
||||
|
||||
await type(page, '/');
|
||||
await expect(slashMenu).toBeVisible();
|
||||
await pressEscape(page);
|
||||
await expect(slashMenu).toBeHidden();
|
||||
|
||||
// go to sub menu
|
||||
await type(page, '/');
|
||||
await expect(slashMenu).toBeVisible();
|
||||
await pressArrowDown(page, 4);
|
||||
await pressArrowRight(page);
|
||||
await expect(slashMenu).toBeVisible();
|
||||
const subMenu = page.locator('.slash-menu[data-testid=sub-menu-1]');
|
||||
await expect(subMenu).toBeVisible();
|
||||
await pressEscape(page);
|
||||
await expect(slashMenu).toBeHidden();
|
||||
await expect(subMenu).toBeHidden();
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user