diff --git a/src/components/Actions.tsx b/src/components/Actions.tsx index 2da4a151..972c7ba8 100644 --- a/src/components/Actions.tsx +++ b/src/components/Actions.tsx @@ -237,7 +237,7 @@ export const ShapesSwitcher = ({ keyBindingLabel={`${numberKey}`} aria-label={capitalizeString(label)} aria-keyshortcuts={shortcut} - data-testid={value} + data-testid={`toolbar-${value}`} onPointerDown={({ pointerType }) => { if (!appState.penDetected && pointerType === "pen") { setAppState({ diff --git a/src/components/App.tsx b/src/components/App.tsx index 5d2dac52..3d5e6a36 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -4836,10 +4836,6 @@ class App extends React.Component { } else { this.setState((prevState) => ({ draggingElement: null, - selectedElementIds: { - ...prevState.selectedElementIds, - [draggingElement.id]: true, - }, })); } } diff --git a/src/components/LockButton.tsx b/src/components/LockButton.tsx index bb5b6d9f..cbcf2b33 100644 --- a/src/components/LockButton.tsx +++ b/src/components/LockButton.tsx @@ -39,6 +39,7 @@ export const LockButton = (props: LockIconProps) => { onChange={props.onChange} checked={props.checked} aria-label={props.title} + data-testid="toolbar-lock" />
{props.checked ? ICONS.CHECKED : ICONS.UNCHECKED} diff --git a/src/tests/queries/toolQueries.ts b/src/tests/queries/toolQueries.ts index 1d680af6..5b0ff937 100644 --- a/src/tests/queries/toolQueries.ts +++ b/src/tests/queries/toolQueries.ts @@ -1,6 +1,7 @@ import { queries, buildQueries } from "@testing-library/react"; const toolMap = { + lock: "lock", selection: "selection", rectangle: "rectangle", diamond: "diamond", @@ -15,7 +16,7 @@ export type ToolName = keyof typeof toolMap; const _getAllByToolName = (container: HTMLElement, tool: string) => { const toolTitle = toolMap[tool as ToolName]; - return queries.getAllByTestId(container, toolTitle); + return queries.getAllByTestId(container, `toolbar-${toolTitle}`); }; const getMultipleError = (_container: any, tool: any) => diff --git a/src/tests/selection.test.tsx b/src/tests/selection.test.tsx index e2bcd1db..6c6547c7 100644 --- a/src/tests/selection.test.tsx +++ b/src/tests/selection.test.tsx @@ -11,7 +11,8 @@ import * as Renderer from "../renderer/renderScene"; import { KEYS } from "../keys"; import { reseed } from "../random"; import { API } from "./helpers/api"; -import { Keyboard, Pointer } from "./helpers/ui"; +import { Keyboard, Pointer, UI } from "./helpers/ui"; +import { SHAPES } from "../shapes"; // Unmount ReactDOM from root ReactDOM.unmountComponentAtNode(document.getElementById("root")!); @@ -380,3 +381,19 @@ describe("select single element on the scene", () => { h.elements.forEach((element) => expect(element).toMatchSnapshot()); }); }); + +describe("tool locking & selection", () => { + it("should not select newly created element while tool is locked", async () => { + await render(); + + UI.clickTool("lock"); + expect(h.state.activeTool.locked).toBe(true); + + for (const { value } of Object.values(SHAPES)) { + if (value !== "image" && value !== "selection") { + const element = UI.createElement(value); + expect(h.state.selectedElementIds[element.id]).not.toBe(true); + } + } + }); +});