mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
refactor: Stop using the deprecated keyCode (#2426)
Co-authored-by: Lipis <lipiridis@gmail.com> Co-authored-by: David Luzar <luzar.david@gmail.com>
This commit is contained in:
Lipis
GitHub
parent
58fcb44de0
commit
014097a97e
21 changed files with 257 additions and 281 deletions
|
|
@ -18,6 +18,7 @@ import { queryByText } from "@testing-library/react";
|
|||
import { copiedStyles } from "../actions/actionStyles";
|
||||
import { UI, Pointer, Keyboard } from "./helpers/ui";
|
||||
import { API } from "./helpers/api";
|
||||
import { CODES, KEYS } from "../keys";
|
||||
|
||||
const { h } = window;
|
||||
|
||||
|
|
@ -129,13 +130,13 @@ describe("regression tests", () => {
|
|||
mouse.click(40, -10);
|
||||
mouse.click(50, 10);
|
||||
mouse.click(30, 10);
|
||||
Keyboard.hotkeyPress("ENTER");
|
||||
Keyboard.keyPress(KEYS.ENTER);
|
||||
|
||||
UI.clickTool("line");
|
||||
mouse.click(40, -20);
|
||||
mouse.click(50, 10);
|
||||
mouse.click(30, 10);
|
||||
Keyboard.hotkeyPress("ENTER");
|
||||
Keyboard.keyPress(KEYS.ENTER);
|
||||
|
||||
UI.clickTool("draw");
|
||||
mouse.down(40, -20);
|
||||
|
|
@ -172,15 +173,15 @@ describe("regression tests", () => {
|
|||
});
|
||||
|
||||
for (const [keys, shape] of [
|
||||
["2r", "rectangle"],
|
||||
["3d", "diamond"],
|
||||
["4e", "ellipse"],
|
||||
["5a", "arrow"],
|
||||
["6l", "line"],
|
||||
["7x", "draw"],
|
||||
[`2${KEYS.R}`, "rectangle"],
|
||||
[`3${KEYS.D}`, "diamond"],
|
||||
[`4${KEYS.E}`, "ellipse"],
|
||||
[`5${KEYS.A}`, "arrow"],
|
||||
[`6${KEYS.L}`, "line"],
|
||||
[`7${KEYS.X}`, "draw"],
|
||||
] as [string, ExcalidrawElement["type"]][]) {
|
||||
for (const key of keys) {
|
||||
it(`hotkey ${key} selects ${shape} tool`, () => {
|
||||
it(`key ${key} selects ${shape} tool`, () => {
|
||||
Keyboard.keyPress(key);
|
||||
|
||||
mouse.down(10, 10);
|
||||
|
|
@ -190,7 +191,6 @@ describe("regression tests", () => {
|
|||
});
|
||||
}
|
||||
}
|
||||
|
||||
it("change the properties of a shape", () => {
|
||||
UI.clickTool("rectangle");
|
||||
mouse.down(10, 10);
|
||||
|
|
@ -397,10 +397,10 @@ describe("regression tests", () => {
|
|||
|
||||
it("spacebar + drag scrolls the canvas", () => {
|
||||
const { scrollX: startScrollX, scrollY: startScrollY } = h.state;
|
||||
Keyboard.hotkeyDown("SPACE");
|
||||
Keyboard.keyDown(KEYS.SPACE);
|
||||
mouse.down(50, 50);
|
||||
mouse.up(60, 60);
|
||||
Keyboard.hotkeyUp("SPACE");
|
||||
Keyboard.keyUp(KEYS.SPACE);
|
||||
const { scrollX, scrollY } = h.state;
|
||||
expect(scrollX).not.toEqual(startScrollX);
|
||||
expect(scrollY).not.toEqual(startScrollY);
|
||||
|
|
@ -410,12 +410,12 @@ describe("regression tests", () => {
|
|||
UI.clickTool("rectangle");
|
||||
mouse.down(10, 10);
|
||||
mouse.up(10, 10);
|
||||
Keyboard.hotkeyPress("ARROW_LEFT");
|
||||
Keyboard.hotkeyPress("ARROW_LEFT");
|
||||
Keyboard.hotkeyPress("ARROW_RIGHT");
|
||||
Keyboard.hotkeyPress("ARROW_UP");
|
||||
Keyboard.hotkeyPress("ARROW_UP");
|
||||
Keyboard.hotkeyPress("ARROW_DOWN");
|
||||
Keyboard.keyPress(KEYS.ARROW_LEFT);
|
||||
Keyboard.keyPress(KEYS.ARROW_LEFT);
|
||||
Keyboard.keyPress(KEYS.ARROW_RIGHT);
|
||||
Keyboard.keyPress(KEYS.ARROW_UP);
|
||||
Keyboard.keyPress(KEYS.ARROW_UP);
|
||||
Keyboard.keyPress(KEYS.ARROW_DOWN);
|
||||
expect(h.elements[0].x).toBe(9);
|
||||
expect(h.elements[0].y).toBe(9);
|
||||
});
|
||||
|
|
@ -433,20 +433,20 @@ describe("regression tests", () => {
|
|||
mouse.click(60, -10);
|
||||
mouse.click(60, 10);
|
||||
mouse.click(40, 10);
|
||||
Keyboard.hotkeyPress("ENTER");
|
||||
Keyboard.keyPress(KEYS.ENTER);
|
||||
|
||||
expect(h.elements.filter((element) => !element.isDeleted).length).toBe(3);
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("z");
|
||||
Keyboard.keyPress("z");
|
||||
Keyboard.keyPress(KEYS.Z);
|
||||
Keyboard.keyPress(KEYS.Z);
|
||||
});
|
||||
expect(h.elements.filter((element) => !element.isDeleted).length).toBe(2);
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("z");
|
||||
Keyboard.keyPress(KEYS.Z);
|
||||
});
|
||||
expect(h.elements.filter((element) => !element.isDeleted).length).toBe(1);
|
||||
Keyboard.withModifierKeys({ ctrl: true, shift: true }, () => {
|
||||
Keyboard.keyPress("z");
|
||||
Keyboard.keyPress(KEYS.Z);
|
||||
});
|
||||
expect(h.elements.filter((element) => !element.isDeleted).length).toBe(2);
|
||||
});
|
||||
|
|
@ -469,7 +469,7 @@ describe("regression tests", () => {
|
|||
expect(API.getStateHistory().length).toBe(3);
|
||||
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("z");
|
||||
Keyboard.keyPress(KEYS.Z);
|
||||
});
|
||||
|
||||
expect(API.getStateHistory().length).toBe(2);
|
||||
|
|
@ -480,7 +480,7 @@ describe("regression tests", () => {
|
|||
expect(API.getStateHistory().length).toBe(2);
|
||||
|
||||
Keyboard.withModifierKeys({ shift: true, ctrl: true }, () => {
|
||||
Keyboard.keyPress("z");
|
||||
Keyboard.keyPress(KEYS.Z);
|
||||
});
|
||||
|
||||
expect(API.getStateHistory().length).toBe(3);
|
||||
|
|
@ -501,11 +501,11 @@ describe("regression tests", () => {
|
|||
|
||||
it("zoom hotkeys", () => {
|
||||
expect(h.state.zoom.value).toBe(1);
|
||||
fireEvent.keyDown(document, { code: "Equal", ctrlKey: true });
|
||||
fireEvent.keyUp(document, { code: "Equal", ctrlKey: true });
|
||||
fireEvent.keyDown(document, { code: CODES.EQUAL, ctrlKey: true });
|
||||
fireEvent.keyUp(document, { code: CODES.EQUAL, ctrlKey: true });
|
||||
expect(h.state.zoom.value).toBeGreaterThan(1);
|
||||
fireEvent.keyDown(document, { code: "Minus", ctrlKey: true });
|
||||
fireEvent.keyUp(document, { code: "Minus", ctrlKey: true });
|
||||
fireEvent.keyDown(document, { code: CODES.MINUS, ctrlKey: true });
|
||||
fireEvent.keyUp(document, { code: CODES.MINUS, ctrlKey: true });
|
||||
expect(h.state.zoom.value).toBe(1);
|
||||
});
|
||||
|
||||
|
|
@ -553,7 +553,7 @@ describe("regression tests", () => {
|
|||
}
|
||||
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
for (const element of h.elements) {
|
||||
|
|
@ -591,8 +591,8 @@ describe("regression tests", () => {
|
|||
mouse.up(10, 10);
|
||||
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("a");
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.keyPress(KEYS.A);
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
expect(API.getSelectedElements().length).toBe(3);
|
||||
|
|
@ -629,7 +629,7 @@ describe("regression tests", () => {
|
|||
mouse.click();
|
||||
});
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
expect(h.elements.map((element) => element.id)).toEqual([
|
||||
|
|
@ -658,8 +658,8 @@ describe("regression tests", () => {
|
|||
positions.push(mouse.getPosition());
|
||||
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("a");
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.keyPress(KEYS.A);
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
mouse.doubleClick();
|
||||
|
|
@ -668,7 +668,7 @@ describe("regression tests", () => {
|
|||
mouse.click();
|
||||
});
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
const groupIds = h.elements[2].groupIds;
|
||||
|
|
@ -813,7 +813,7 @@ describe("regression tests", () => {
|
|||
});
|
||||
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
fireEvent.contextMenu(GlobalTestState.canvas, {
|
||||
|
|
@ -1106,7 +1106,7 @@ describe("regression tests", () => {
|
|||
});
|
||||
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
fireEvent.contextMenu(GlobalTestState.canvas, {
|
||||
|
|
@ -1502,8 +1502,8 @@ describe("regression tests", () => {
|
|||
UI.group([rect3, rect4]);
|
||||
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("a");
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.keyPress(KEYS.A);
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
const selectedGroupIds_prev = h.state.selectedGroupIds;
|
||||
|
|
@ -1617,7 +1617,7 @@ it(
|
|||
|
||||
// Create group with first and third rectangle
|
||||
Keyboard.withModifierKeys({ ctrl: true }, () => {
|
||||
Keyboard.keyPress("g");
|
||||
Keyboard.codePress(CODES.G);
|
||||
});
|
||||
|
||||
expect(API.getSelectedElements().length).toBe(2);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue