Add regression tests for context-menu (#1683) (#1697)

Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Farooq AR 2020-06-05 01:09:16 +05:00 committed by GitHub
parent ff93d95998
commit 669e84b5d7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 260 additions and 27 deletions

View File

@ -30,7 +30,7 @@ Object {
"isRotating": false,
"lastPointerDownWith": "mouse",
"multiElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"openMenu": null,
"previousSelectedElementIds": Object {
"id0": true,
@ -145,7 +145,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
},
@ -179,7 +179,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id1": true,
},
@ -234,7 +234,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id2": true,
},
@ -310,7 +310,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id2": true,
@ -1886,7 +1886,7 @@ Object {
"isRotating": false,
"lastPointerDownWith": "mouse",
"multiElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"openMenu": null,
"previousSelectedElementIds": Object {},
"resizingElement": null,
@ -1995,7 +1995,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
},
@ -2029,7 +2029,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id1": true,
},
@ -2084,7 +2084,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id2": true,
},
@ -2160,7 +2160,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id1": true,
@ -5671,7 +5671,7 @@ Object {
"isRotating": false,
"lastPointerDownWith": "mouse",
"multiElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"openMenu": null,
"previousSelectedElementIds": Object {
"id0": true,
@ -5869,7 +5869,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
},
@ -5903,7 +5903,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id1": true,
},
@ -5958,7 +5958,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id2": true,
},
@ -6034,7 +6034,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id1": true,
@ -6119,7 +6119,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id1": true,
@ -6608,7 +6608,7 @@ Object {
exports[`regression tests rerenders UI on language change: [end of test] number of elements 1`] = `0`;
exports[`regression tests rerenders UI on language change: [end of test] number of renders 1`] = `4`;
exports[`regression tests rerenders UI on language change: [end of test] number of renders 1`] = `5`;
exports[`regression tests resize an element, trying every resize handle: [end of test] appState 1`] = `
Object {
@ -15243,6 +15243,191 @@ exports[`regression tests shift-click to multiselect, then drag: [end of test] n
exports[`regression tests shift-click to multiselect, then drag: [end of test] number of renders 1`] = `17`;
exports[`regression tests shows context menu for canvas: [end of test] appState 1`] = `
Object {
"collaborators": Map {},
"currentItemBackgroundColor": "transparent",
"currentItemFillStyle": "hachure",
"currentItemFontFamily": 1,
"currentItemFontSize": 20,
"currentItemOpacity": 100,
"currentItemRoughness": 1,
"currentItemStrokeColor": "#000000",
"currentItemStrokeStyle": "solid",
"currentItemStrokeWidth": 1,
"currentItemTextAlign": "left",
"cursorButton": "up",
"cursorX": 0,
"cursorY": 0,
"draggingElement": null,
"editingElement": null,
"editingGroupId": null,
"editingLinearElement": null,
"elementLocked": false,
"elementType": "selection",
"errorMessage": null,
"exportBackground": true,
"isCollaborating": false,
"isLoading": false,
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"multiElement": null,
"name": "Untitled-201933152653",
"openMenu": null,
"previousSelectedElementIds": Object {},
"resizingElement": null,
"scrollX": 0,
"scrollY": 0,
"scrolledOutside": false,
"selectedElementIds": Object {},
"selectedGroupIds": Object {},
"selectionElement": null,
"shouldAddWatermark": false,
"shouldCacheIgnoreZoom": false,
"showShortcutsDialog": false,
"username": "",
"viewBackgroundColor": "#ffffff",
"zenModeEnabled": false,
"zoom": 1,
}
`;
exports[`regression tests shows context menu for canvas: [end of test] history 1`] = `
Object {
"recording": false,
"redoStack": Array [],
"stateHistory": Array [],
}
`;
exports[`regression tests shows context menu for canvas: [end of test] number of elements 1`] = `0`;
exports[`regression tests shows context menu for canvas: [end of test] number of renders 1`] = `3`;
exports[`regression tests shows context menu for element: [end of test] appState 1`] = `
Object {
"collaborators": Map {},
"currentItemBackgroundColor": "transparent",
"currentItemFillStyle": "hachure",
"currentItemFontFamily": 1,
"currentItemFontSize": 20,
"currentItemOpacity": 100,
"currentItemRoughness": 1,
"currentItemStrokeColor": "#000000",
"currentItemStrokeStyle": "solid",
"currentItemStrokeWidth": 1,
"currentItemTextAlign": "left",
"cursorButton": "up",
"cursorX": 0,
"cursorY": 0,
"draggingElement": null,
"editingElement": null,
"editingGroupId": null,
"editingLinearElement": null,
"elementLocked": false,
"elementType": "selection",
"errorMessage": null,
"exportBackground": true,
"isCollaborating": false,
"isLoading": false,
"isResizing": false,
"isRotating": false,
"lastPointerDownWith": "mouse",
"multiElement": null,
"name": "Untitled-201933152653",
"openMenu": null,
"previousSelectedElementIds": Object {},
"resizingElement": null,
"scrollX": 0,
"scrollY": 0,
"scrolledOutside": false,
"selectedElementIds": Object {
"id0": true,
},
"selectedGroupIds": Object {},
"selectionElement": null,
"shouldAddWatermark": false,
"shouldCacheIgnoreZoom": false,
"showShortcutsDialog": false,
"username": "",
"viewBackgroundColor": "#ffffff",
"zenModeEnabled": false,
"zoom": 1,
}
`;
exports[`regression tests shows context menu for element: [end of test] element 0 1`] = `
Object {
"angle": 0,
"backgroundColor": "transparent",
"fillStyle": "hachure",
"groupIds": Array [],
"height": 20,
"id": "id0",
"isDeleted": false,
"opacity": 100,
"roughness": 1,
"seed": 337897,
"strokeColor": "#000000",
"strokeStyle": "solid",
"strokeWidth": 1,
"type": "rectangle",
"version": 2,
"versionNonce": 1278240551,
"width": 20,
"x": 10,
"y": 10,
}
`;
exports[`regression tests shows context menu for element: [end of test] history 1`] = `
Object {
"recording": false,
"redoStack": Array [],
"stateHistory": Array [
Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
},
"viewBackgroundColor": "#ffffff",
},
"elements": Array [
Object {
"angle": 0,
"backgroundColor": "transparent",
"fillStyle": "hachure",
"groupIds": Array [],
"height": 20,
"id": "id0",
"isDeleted": false,
"opacity": 100,
"roughness": 1,
"seed": 337897,
"strokeColor": "#000000",
"strokeStyle": "solid",
"strokeWidth": 1,
"type": "rectangle",
"version": 2,
"versionNonce": 1278240551,
"width": 20,
"x": 10,
"y": 10,
},
],
},
],
}
`;
exports[`regression tests shows context menu for element: [end of test] number of elements 1`] = `1`;
exports[`regression tests shows context menu for element: [end of test] number of renders 1`] = `7`;
exports[`regression tests spacebar + drag scrolls the canvas: [end of test] appState 1`] = `
Object {
"collaborators": Map {},
@ -15335,7 +15520,7 @@ Object {
"isRotating": false,
"lastPointerDownWith": "mouse",
"multiElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"openMenu": null,
"previousSelectedElementIds": Object {},
"resizingElement": null,
@ -15446,7 +15631,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
},
@ -15480,7 +15665,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id1": true,
},
@ -15535,7 +15720,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id2": true,
},
@ -15611,7 +15796,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id1": true,
@ -15695,7 +15880,7 @@ Object {
"appState": Object {
"editingGroupId": "id3",
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id2": true,
@ -15779,7 +15964,7 @@ Object {
"appState": Object {
"editingGroupId": "id3",
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id2": true,
@ -15865,7 +16050,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {
"id0": true,
"id1": true,
@ -16475,7 +16660,7 @@ Object {
"isRotating": false,
"lastPointerDownWith": "mouse",
"multiElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"openMenu": null,
"previousSelectedElementIds": Object {},
"resizingElement": null,
@ -16504,7 +16689,7 @@ Object {
"appState": Object {
"editingGroupId": null,
"editingLinearElement": null,
"name": "Unbenannt-201933152653",
"name": "Untitled-201933152653",
"selectedElementIds": Object {},
"viewBackgroundColor": "#ffffff",
},

View File

@ -665,6 +665,10 @@ describe("regression tests", () => {
});
// switching to german, `hachure` label should no longer exist
expect(screen.queryByText(/hachure/i)).toBeNull();
// reset language
fireEvent.change(document.querySelector(".dropdown-select__language")!, {
target: { value: "en" },
});
});
it("make a group and duplicate it", () => {
@ -847,4 +851,48 @@ describe("regression tests", () => {
fireEvent.click(screen.getByText(/code/i));
expect(h.state.currentItemFontFamily).toEqual(3); // Cascadia
});
it("shows context menu for canvas", () => {
fireEvent.change(document.querySelector(".dropdown-select__language")!, {
target: { value: "en" },
});
fireEvent.contextMenu(canvas, { button: 2, clientX: 1, clientY: 1 });
const contextMenu = document.querySelector(".context-menu");
const options = contextMenu?.querySelectorAll(".context-menu-option");
const expectedOptions = ["Select all"];
expect(contextMenu).not.toBeNull();
expect(options?.length).toBe(1);
expect(options?.item(0).textContent).toBe(expectedOptions[0]);
});
it("shows context menu for element", () => {
fireEvent.change(document.querySelector(".dropdown-select__language")!, {
target: { value: "en" },
});
clickTool("rectangle");
mouse.down(10, 10);
mouse.up(20, 20);
fireEvent.contextMenu(canvas, { button: 2, clientX: 1, clientY: 1 });
const contextMenu = document.querySelector(".context-menu");
const options = contextMenu?.querySelectorAll(".context-menu-option");
const expectedOptions = [
"Copy styles",
"Paste styles",
"Delete",
"Group selection",
"Ungroup selection",
"Send backward",
"Bring forward",
"Send to back",
"Bring to front",
"Duplicate",
];
expect(contextMenu).not.toBeNull();
expect(contextMenu?.children.length).toBe(10);
options?.forEach((opt, i) => {
expect(opt.textContent).toBe(expectedOptions[i]);
});
});
});