feat: add "unlock all elements" to canvas contextMenu (#5894)

This commit is contained in:
David Luzar 2023-05-13 22:52:03 +02:00 committed by GitHub
parent 5bf27a463c
commit b1b325b9a7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 148 additions and 42 deletions

View file

@ -247,7 +247,7 @@ Object {
Object {
"contextItemLabel": [Function],
"keyTest": [Function],
"name": "toggleLock",
"name": "toggleElementLock",
"perform": [Function],
"trackEvent": Object {
"category": "element",
@ -4644,7 +4644,7 @@ Object {
Object {
"contextItemLabel": [Function],
"keyTest": [Function],
"name": "toggleLock",
"name": "toggleElementLock",
"perform": [Function],
"trackEvent": Object {
"category": "element",
@ -5194,7 +5194,7 @@ Object {
Object {
"contextItemLabel": [Function],
"keyTest": [Function],
"name": "toggleLock",
"name": "toggleElementLock",
"perform": [Function],
"trackEvent": Object {
"category": "element",
@ -5642,6 +5642,16 @@ Object {
"category": "canvas",
},
},
Object {
"contextItemLabel": "labels.elementLock.unlockAll",
"name": "unlockAllElements",
"perform": [Function],
"predicate": [Function],
"trackEvent": Object {
"category": "canvas",
},
"viewMode": false,
},
"separator",
Object {
"checked": [Function],
@ -6043,7 +6053,7 @@ Object {
Object {
"contextItemLabel": [Function],
"keyTest": [Function],
"name": "toggleLock",
"name": "toggleElementLock",
"perform": [Function],
"trackEvent": Object {
"category": "element",
@ -6389,7 +6399,7 @@ Object {
Object {
"contextItemLabel": [Function],
"keyTest": [Function],
"name": "toggleLock",
"name": "toggleElementLock",
"perform": [Function],
"trackEvent": Object {
"category": "element",

View file

@ -125,7 +125,7 @@ describe("contextMenu element", () => {
"bringToFront",
"duplicateSelection",
"hyperlink",
"toggleLock",
"toggleElementLock",
];
expect(contextMenu).not.toBeNull();
@ -212,7 +212,7 @@ describe("contextMenu element", () => {
"sendToBack",
"bringToFront",
"duplicateSelection",
"toggleLock",
"toggleElementLock",
];
expect(contextMenu).not.toBeNull();
@ -263,7 +263,7 @@ describe("contextMenu element", () => {
"sendToBack",
"bringToFront",
"duplicateSelection",
"toggleLock",
"toggleElementLock",
];
expect(contextMenu).not.toBeNull();
@ -287,7 +287,7 @@ describe("contextMenu element", () => {
});
const contextMenu = UI.queryContextMenu();
expect(copiedStyles).toBe("{}");
fireEvent.click(queryByText(contextMenu as HTMLElement, "Copy styles")!);
fireEvent.click(queryByText(contextMenu!, "Copy styles")!);
expect(copiedStyles).not.toBe("{}");
const element = JSON.parse(copiedStyles)[0];
expect(element).toEqual(API.getSelectedElement());
@ -328,7 +328,7 @@ describe("contextMenu element", () => {
clientY: 40,
});
let contextMenu = UI.queryContextMenu();
fireEvent.click(queryByText(contextMenu as HTMLElement, "Copy styles")!);
fireEvent.click(queryByText(contextMenu!, "Copy styles")!);
const secondRect = JSON.parse(copiedStyles)[0];
expect(secondRect.id).toBe(h.elements[1].id);
@ -340,7 +340,7 @@ describe("contextMenu element", () => {
clientY: 10,
});
contextMenu = UI.queryContextMenu();
fireEvent.click(queryByText(contextMenu as HTMLElement, "Paste styles")!);
fireEvent.click(queryByText(contextMenu!, "Paste styles")!);
const firstRect = API.getSelectedElement();
expect(firstRect.id).toBe(h.elements[0].id);
@ -364,7 +364,7 @@ describe("contextMenu element", () => {
clientY: 1,
});
const contextMenu = UI.queryContextMenu();
fireEvent.click(queryAllByText(contextMenu as HTMLElement, "Delete")[0]);
fireEvent.click(queryAllByText(contextMenu!, "Delete")[0]);
expect(API.getSelectedElements()).toHaveLength(0);
expect(h.elements[0].isDeleted).toBe(true);
});
@ -380,7 +380,7 @@ describe("contextMenu element", () => {
clientY: 1,
});
const contextMenu = UI.queryContextMenu();
fireEvent.click(queryByText(contextMenu as HTMLElement, "Add to library")!);
fireEvent.click(queryByText(contextMenu!, "Add to library")!);
await waitFor(() => {
const library = localStorage.getItem("excalidraw-library");
@ -401,7 +401,7 @@ describe("contextMenu element", () => {
clientY: 1,
});
const contextMenu = UI.queryContextMenu();
fireEvent.click(queryByText(contextMenu as HTMLElement, "Duplicate")!);
fireEvent.click(queryByText(contextMenu!, "Duplicate")!);
expect(h.elements).toHaveLength(2);
const { id: _id0, seed: _seed0, x: _x0, y: _y0, ...rect1 } = h.elements[0];
const { id: _id1, seed: _seed1, x: _x1, y: _y1, ...rect2 } = h.elements[1];
@ -425,7 +425,7 @@ describe("contextMenu element", () => {
});
const contextMenu = UI.queryContextMenu();
const elementsBefore = h.elements;
fireEvent.click(queryByText(contextMenu as HTMLElement, "Send backward")!);
fireEvent.click(queryByText(contextMenu!, "Send backward")!);
expect(elementsBefore[0].id).toEqual(h.elements[1].id);
expect(elementsBefore[1].id).toEqual(h.elements[0].id);
});
@ -447,7 +447,7 @@ describe("contextMenu element", () => {
});
const contextMenu = UI.queryContextMenu();
const elementsBefore = h.elements;
fireEvent.click(queryByText(contextMenu as HTMLElement, "Bring forward")!);
fireEvent.click(queryByText(contextMenu!, "Bring forward")!);
expect(elementsBefore[0].id).toEqual(h.elements[1].id);
expect(elementsBefore[1].id).toEqual(h.elements[0].id);
});
@ -469,7 +469,7 @@ describe("contextMenu element", () => {
});
const contextMenu = UI.queryContextMenu();
const elementsBefore = h.elements;
fireEvent.click(queryByText(contextMenu as HTMLElement, "Send to back")!);
fireEvent.click(queryByText(contextMenu!, "Send to back")!);
expect(elementsBefore[1].id).toEqual(h.elements[0].id);
});
@ -490,7 +490,7 @@ describe("contextMenu element", () => {
});
const contextMenu = UI.queryContextMenu();
const elementsBefore = h.elements;
fireEvent.click(queryByText(contextMenu as HTMLElement, "Bring to front")!);
fireEvent.click(queryByText(contextMenu!, "Bring to front")!);
expect(elementsBefore[0].id).toEqual(h.elements[1].id);
});
@ -514,9 +514,7 @@ describe("contextMenu element", () => {
clientY: 1,
});
const contextMenu = UI.queryContextMenu();
fireEvent.click(
queryByText(contextMenu as HTMLElement, "Group selection")!,
);
fireEvent.click(queryByText(contextMenu!, "Group selection")!);
const selectedGroupIds = Object.keys(h.state.selectedGroupIds);
expect(h.elements[0].groupIds).toEqual(selectedGroupIds);
expect(h.elements[1].groupIds).toEqual(selectedGroupIds);
@ -548,9 +546,7 @@ describe("contextMenu element", () => {
const contextMenu = UI.queryContextMenu();
expect(contextMenu).not.toBeNull();
fireEvent.click(
queryByText(contextMenu as HTMLElement, "Ungroup selection")!,
);
fireEvent.click(queryByText(contextMenu!, "Ungroup selection")!);
const selectedGroupIds = Object.keys(h.state.selectedGroupIds);
expect(selectedGroupIds).toHaveLength(0);

View file

@ -152,7 +152,7 @@ describe("element locking", () => {
expect(contextMenu).not.toBeNull();
expect(
contextMenu?.querySelector(
`li[data-testid="toggleLock"] .context-menu-item__label`,
`li[data-testid="toggleElementLock"] .context-menu-item__label`,
),
).toHaveTextContent(t("labels.elementLock.unlock"));
});

View file

@ -321,6 +321,6 @@ export class UI {
static queryContextMenu = () => {
return GlobalTestState.renderResult.container.querySelector(
".context-menu",
);
) as HTMLElement | null;
};
}