From df4e903bd6f1b173cf085a73ee4d529c7c6e82a9 Mon Sep 17 00:00:00 2001 From: Farooq AR Date: Sun, 26 Jul 2020 16:29:44 +0500 Subject: [PATCH] Add regression tests for context-menu actions (#1959) --- src/actions/actionStyles.ts | 3 +- .../regressionTests.test.tsx.snap | 3030 ++++++++++++++++- src/tests/regressionTests.test.tsx | 250 +- 3 files changed, 3264 insertions(+), 19 deletions(-) diff --git a/src/actions/actionStyles.ts b/src/actions/actionStyles.ts index 2cd6936c..e6da2bef 100644 --- a/src/actions/actionStyles.ts +++ b/src/actions/actionStyles.ts @@ -12,7 +12,8 @@ import { DEFAULT_TEXT_ALIGN, } from "../constants"; -let copiedStyles: string = "{}"; +// `copiedStyles` is exported only for tests. +export let copiedStyles: string = "{}"; export const actionCopyStyles = register({ name: "copyStyles", diff --git a/src/tests/__snapshots__/regressionTests.test.tsx.snap b/src/tests/__snapshots__/regressionTests.test.tsx.snap index c618479a..31c87858 100644 --- a/src/tests/__snapshots__/regressionTests.test.tsx.snap +++ b/src/tests/__snapshots__/regressionTests.test.tsx.snap @@ -15145,6 +15145,3028 @@ exports[`regression tests resize an element, trying every resize handle: [unresi exports[`regression tests resize an element, trying every resize handle: [unresize handle sw (-5, -5)] number of renders 1`] = `36`; +exports[`regression tests selecting 'Add to library' in context menu adds element to library: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Add to library' in context menu adds element to library: [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 selecting 'Add to library' in context menu adds element to library: [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 selecting 'Add to library' in context menu adds element to library: [end of test] number of elements 1`] = `1`; + +exports[`regression tests selecting 'Add to library' in context menu adds element to library: [end of test] number of renders 1`] = `6`; + +exports[`regression tests selecting 'Bring forward' in context menu brings element forward: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Bring forward' in context menu brings element forward: [end of test] element 0 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, +} +`; + +exports[`regression tests selecting 'Bring forward' in context menu brings element forward: [end of test] element 1 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 selecting 'Bring forward' in context menu brings element forward: [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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + 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": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + 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 selecting 'Bring forward' in context menu brings element forward: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Bring forward' in context menu brings element forward: [end of test] number of renders 1`] = `12`; + +exports[`regression tests selecting 'Bring to front' in context menu brings element to front: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Bring to front' in context menu brings element to front: [end of test] element 0 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, +} +`; + +exports[`regression tests selecting 'Bring to front' in context menu brings element to front: [end of test] element 1 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 selecting 'Bring to front' in context menu brings element to front: [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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + 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": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + 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 selecting 'Bring to front' in context menu brings element to front: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Bring to front' in context menu brings element to front: [end of test] number of renders 1`] = `12`; + +exports[`regression tests selecting 'Copy styles' in context menu copies styles: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Copy styles' in context menu copies styles: [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 selecting 'Copy styles' in context menu copies styles: [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 selecting 'Copy styles' in context menu copies styles: [end of test] number of elements 1`] = `1`; + +exports[`regression tests selecting 'Copy styles' in context menu copies styles: [end of test] number of renders 1`] = `6`; + +exports[`regression tests selecting 'Delete' in context menu deletes 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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Delete' in context menu deletes element: [end of test] element 0 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id0", + "isDeleted": true, + "opacity": 100, + "roughness": 1, + "seed": 337897, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 449462985, + "width": 20, + "x": 10, + "y": 10, +} +`; + +exports[`regression tests selecting 'Delete' in context menu deletes 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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object {}, + "viewBackgroundColor": "#ffffff", + }, + "elements": Array [ + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id0", + "isDeleted": true, + "opacity": 100, + "roughness": 1, + "seed": 337897, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 449462985, + "width": 20, + "x": 10, + "y": 10, + }, + ], + }, + ], +} +`; + +exports[`regression tests selecting 'Delete' in context menu deletes element: [end of test] number of elements 1`] = `1`; + +exports[`regression tests selecting 'Delete' in context menu deletes element: [end of test] number of renders 1`] = `7`; + +exports[`regression tests selecting 'Duplicate' in context menu duplicates 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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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 { + "id1": true, + }, + "selectedGroupIds": Object {}, + "selectionElement": null, + "shouldAddWatermark": false, + "shouldCacheIgnoreZoom": false, + "showShortcutsDialog": false, + "username": "", + "viewBackgroundColor": "#ffffff", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Duplicate' in context menu duplicates 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 selecting 'Duplicate' in context menu duplicates element: [end of test] element 1 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 1278240551, + "width": 20, + "x": 20, + "y": 20, +} +`; + +exports[`regression tests selecting 'Duplicate' in context menu duplicates 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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 1278240551, + "width": 20, + "x": 20, + "y": 20, + }, + ], + }, + ], +} +`; + +exports[`regression tests selecting 'Duplicate' in context menu duplicates element: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Duplicate' in context menu duplicates element: [end of test] number of renders 1`] = `7`; + +exports[`regression tests selecting 'Group selection' in context menu groups selected elements: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": false, + "isLoading": false, + "isResizing": false, + "isRotating": false, + "lastPointerDownWith": "mouse", + "multiElement": null, + "name": "Untitled-201933152653", + "openMenu": null, + "previousSelectedElementIds": Object { + "id1": true, + }, + "resizingElement": null, + "scrollX": 0, + "scrollY": 0, + "scrolledOutside": false, + "selectedElementIds": Object { + "id0": true, + "id1": true, + "id2": true, + }, + "selectedGroupIds": Object { + "id3": true, + }, + "selectionElement": null, + "shouldAddWatermark": false, + "shouldCacheIgnoreZoom": false, + "showShortcutsDialog": false, + "username": "", + "viewBackgroundColor": "#ffffff", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Group selection' in context menu groups selected elements: [end of test] element 0 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [ + "id3", + ], + "height": 20, + "id": "id0", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 337897, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 2019559783, + "width": 20, + "x": 10, + "y": 10, +} +`; + +exports[`regression tests selecting 'Group selection' in context menu groups selected elements: [end of test] element 1 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [ + "id3", + ], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 1150084233, + "width": 20, + "x": 40, + "y": 40, +} +`; + +exports[`regression tests selecting 'Group selection' in context menu groups selected elements: [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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id0": true, + "id1": true, + "id2": true, + }, + "viewBackgroundColor": "#ffffff", + }, + "elements": Array [ + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [ + "id3", + ], + "height": 20, + "id": "id0", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 337897, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 2019559783, + "width": 20, + "x": 10, + "y": 10, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [ + "id3", + ], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 1150084233, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + ], +} +`; + +exports[`regression tests selecting 'Group selection' in context menu groups selected elements: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Group selection' in context menu groups selected elements: [end of test] number of renders 1`] = `13`; + +exports[`regression tests selecting 'Paste styles' in context menu pastes styles: [end of test] appState 1`] = ` +Object { + "collaborators": Map {}, + "currentItemBackgroundColor": "#e64980", + "currentItemFillStyle": "cross-hatch", + "currentItemFontFamily": 1, + "currentItemFontSize": 20, + "currentItemOpacity": 60, + "currentItemRoughness": 2, + "currentItemStrokeColor": "#c92a2a", + "currentItemStrokeStyle": "dotted", + "currentItemStrokeWidth": 2, + "currentItemTextAlign": "left", + "cursorButton": "up", + "cursorX": 0, + "cursorY": 0, + "draggingElement": null, + "editingElement": null, + "editingGroupId": null, + "editingLinearElement": null, + "elementLocked": false, + "elementType": "selection", + "errorMessage": null, + "exportBackground": true, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Paste styles' in context menu pastes styles: [end of test] element 0 1`] = ` +Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id0", + "isDeleted": false, + "opacity": 60, + "roughness": 2, + "seed": 337897, + "strokeColor": "#c92a2a", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "version": 3, + "versionNonce": 915032327, + "width": 20, + "x": 10, + "y": 10, +} +`; + +exports[`regression tests selecting 'Paste styles' in context menu pastes styles: [end of test] element 1 1`] = ` +Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 60, + "roughness": 2, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "version": 13, + "versionNonce": 493213705, + "width": 20, + "x": 40, + "y": 40, +} +`; + +exports[`regression tests selecting 'Paste styles' in context menu pastes styles: [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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 401146281, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 5, + "versionNonce": 1150084233, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 6, + "versionNonce": 1116226695, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 8, + "versionNonce": 238820263, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 9, + "versionNonce": 400692809, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "solid", + "strokeWidth": 2, + "type": "rectangle", + "version": 10, + "versionNonce": 1604849351, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "version": 11, + "versionNonce": 1505387817, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 2, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "version": 12, + "versionNonce": 23633383, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 60, + "roughness": 2, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "version": 13, + "versionNonce": 493213705, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id0": true, + }, + "viewBackgroundColor": "#ffffff", + }, + "elements": Array [ + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id0", + "isDeleted": false, + "opacity": 60, + "roughness": 2, + "seed": 337897, + "strokeColor": "#c92a2a", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "version": 3, + "versionNonce": 915032327, + "width": 20, + "x": 10, + "y": 10, + }, + Object { + "angle": 0, + "backgroundColor": "#e64980", + "fillStyle": "cross-hatch", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 60, + "roughness": 2, + "seed": 449462985, + "strokeColor": "#c92a2a", + "strokeStyle": "dotted", + "strokeWidth": 2, + "type": "rectangle", + "version": 13, + "versionNonce": 493213705, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + ], +} +`; + +exports[`regression tests selecting 'Paste styles' in context menu pastes styles: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Paste styles' in context menu pastes styles: [end of test] number of renders 1`] = `21`; + +exports[`regression tests selecting 'Send backward' in context menu sends element backward: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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 { + "id1": true, + }, + "selectedGroupIds": Object {}, + "selectionElement": null, + "shouldAddWatermark": false, + "shouldCacheIgnoreZoom": false, + "showShortcutsDialog": false, + "username": "", + "viewBackgroundColor": "#ffffff", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Send backward' in context menu sends element backward: [end of test] element 0 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, +} +`; + +exports[`regression tests selecting 'Send backward' in context menu sends element backward: [end of test] element 1 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 selecting 'Send backward' in context menu sends element backward: [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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": true, + }, + "viewBackgroundColor": "#ffffff", + }, + "elements": Array [ + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + 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 selecting 'Send backward' in context menu sends element backward: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Send backward' in context menu sends element backward: [end of test] number of renders 1`] = `11`; + +exports[`regression tests selecting 'Send to back' in context menu sends element to back: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": 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 { + "id1": true, + }, + "selectedGroupIds": Object {}, + "selectionElement": null, + "shouldAddWatermark": false, + "shouldCacheIgnoreZoom": false, + "showShortcutsDialog": false, + "username": "", + "viewBackgroundColor": "#ffffff", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Send to back' in context menu sends element to back: [end of test] element 0 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, +} +`; + +exports[`regression tests selecting 'Send to back' in context menu sends element to back: [end of test] element 1 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 selecting 'Send to back' in context menu sends element to back: [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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": true, + }, + "viewBackgroundColor": "#ffffff", + }, + "elements": Array [ + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + 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 selecting 'Send to back' in context menu sends element to back: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Send to back' in context menu sends element to back: [end of test] number of renders 1`] = `11`; + +exports[`regression tests selecting 'Ungroup selection' in context menu ungroups selected group: [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, + "gridSize": null, + "height": 768, + "isCollaborating": false, + "isLibraryOpen": false, + "isLoading": false, + "isResizing": false, + "isRotating": false, + "lastPointerDownWith": "mouse", + "multiElement": null, + "name": "Untitled-201933152653", + "openMenu": null, + "previousSelectedElementIds": Object { + "id1": true, + }, + "resizingElement": null, + "scrollX": 0, + "scrollY": 0, + "scrolledOutside": false, + "selectedElementIds": Object { + "id0": true, + "id1": true, + "id2": true, + }, + "selectedGroupIds": Object {}, + "selectionElement": null, + "shouldAddWatermark": false, + "shouldCacheIgnoreZoom": false, + "showShortcutsDialog": false, + "username": "", + "viewBackgroundColor": "#ffffff", + "width": 1024, + "zenModeEnabled": false, + "zoom": 1, +} +`; + +exports[`regression tests selecting 'Ungroup selection' in context menu ungroups selected group: [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": 4, + "versionNonce": 1116226695, + "width": 20, + "x": 10, + "y": 10, +} +`; + +exports[`regression tests selecting 'Ungroup selection' in context menu ungroups selected group: [end of test] element 1 1`] = ` +Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 4, + "versionNonce": 1014066025, + "width": 20, + "x": 40, + "y": 40, +} +`; + +exports[`regression tests selecting 'Ungroup selection' in context menu ungroups selected group: [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, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id1": 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, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 2, + "versionNonce": 453191, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id0": true, + "id1": true, + "id2": true, + }, + "viewBackgroundColor": "#ffffff", + }, + "elements": Array [ + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [ + "id3", + ], + "height": 20, + "id": "id0", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 337897, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 2019559783, + "width": 20, + "x": 10, + "y": 10, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [ + "id3", + ], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 3, + "versionNonce": 1150084233, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + Object { + "appState": Object { + "editingGroupId": null, + "editingLinearElement": null, + "name": "Untitled-201933152653", + "selectedElementIds": Object { + "id0": true, + "id1": true, + "id2": 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": 4, + "versionNonce": 1116226695, + "width": 20, + "x": 10, + "y": 10, + }, + Object { + "angle": 0, + "backgroundColor": "transparent", + "fillStyle": "hachure", + "groupIds": Array [], + "height": 20, + "id": "id1", + "isDeleted": false, + "opacity": 100, + "roughness": 1, + "seed": 449462985, + "strokeColor": "#000000", + "strokeStyle": "solid", + "strokeWidth": 1, + "type": "rectangle", + "version": 4, + "versionNonce": 1014066025, + "width": 20, + "x": 40, + "y": 40, + }, + ], + }, + ], +} +`; + +exports[`regression tests selecting 'Ungroup selection' in context menu ungroups selected group: [end of test] number of elements 1`] = `2`; + +exports[`regression tests selecting 'Ungroup selection' in context menu ungroups selected group: [end of test] number of renders 1`] = `14`; + exports[`regression tests shift-click to multiselect, then drag: [end of test] appState 1`] = ` Object { "collaborators": Map {}, @@ -15629,7 +18651,7 @@ Object { exports[`regression tests shows 'Group selection' in context menu for multiple selected elements: [end of test] number of elements 1`] = `2`; -exports[`regression tests shows 'Group selection' in context menu for multiple selected elements: [end of test] number of renders 1`] = `15`; +exports[`regression tests shows 'Group selection' in context menu for multiple selected elements: [end of test] number of renders 1`] = `14`; exports[`regression tests shows 'Ungroup selection' in context menu for group inside selected elements: [end of test] appState 1`] = ` Object { @@ -15909,7 +18931,7 @@ Object { exports[`regression tests shows 'Ungroup selection' in context menu for group inside selected elements: [end of test] number of elements 1`] = `2`; -exports[`regression tests shows 'Ungroup selection' in context menu for group inside selected elements: [end of test] number of renders 1`] = `16`; +exports[`regression tests shows 'Ungroup selection' in context menu for group inside selected elements: [end of test] number of renders 1`] = `15`; exports[`regression tests shows context menu for canvas: [end of test] appState 1`] = ` Object { @@ -15975,7 +18997,7 @@ Object { 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 canvas: [end of test] number of renders 1`] = `2`; exports[`regression tests shows context menu for element: [end of test] appState 1`] = ` Object { @@ -16102,7 +19124,7 @@ Object { 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 shows context menu for element: [end of test] number of renders 1`] = `6`; exports[`regression tests spacebar + drag scrolls the canvas: [end of test] appState 1`] = ` Object { diff --git a/src/tests/regressionTests.test.tsx b/src/tests/regressionTests.test.tsx index 297cf1f9..6650e603 100644 --- a/src/tests/regressionTests.test.tsx +++ b/src/tests/regressionTests.test.tsx @@ -10,6 +10,8 @@ import { KEYS, Key } from "../keys"; import { setDateTimeForTests } from "../utils"; import { ExcalidrawElement } from "../element/types"; import { handlerRectangles } from "../element"; +import { queryByText } from "@testing-library/react"; +import { copiedStyles } from "../actions/actionStyles"; const { h } = window; @@ -857,9 +859,6 @@ describe("regression tests", () => { }); 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"); @@ -871,12 +870,10 @@ describe("regression tests", () => { }); 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"); @@ -900,10 +897,6 @@ describe("regression tests", () => { }); it("shows 'Group selection' in context menu for multiple selected elements", () => { - fireEvent.change(document.querySelector(".dropdown-select__language")!, { - target: { value: "en" }, - }); - clickTool("rectangle"); mouse.down(10, 10); mouse.up(10, 10); @@ -943,10 +936,6 @@ describe("regression tests", () => { }); it("shows 'Ungroup selection' in context menu for group inside selected elements", () => { - fireEvent.change(document.querySelector(".dropdown-select__language")!, { - target: { value: "en" }, - }); - clickTool("rectangle"); mouse.down(10, 10); mouse.up(10, 10); @@ -988,4 +977,237 @@ describe("regression tests", () => { expect(opt.textContent).toBe(expectedOptions[i]); }); }); + + it("selecting 'Copy styles' in context menu copies styles", () => { + 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"); + expect(copiedStyles).toBe("{}"); + fireEvent.click(queryByText(contextMenu as HTMLElement, "Copy styles")!); + expect(copiedStyles).not.toBe("{}"); + const element = JSON.parse(copiedStyles); + expect(element).toEqual(getSelectedElement()); + }); + + it("selecting 'Paste styles' in context menu pastes styles", () => { + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + // Change some styles of second rectangle + clickLabeledElement("Stroke"); + clickLabeledElement("#c92a2a"); + clickLabeledElement("Background"); + clickLabeledElement("#e64980"); + // Fill style + fireEvent.click(screen.getByLabelText("Cross-hatch")); + // Stroke width + fireEvent.click(screen.getByLabelText("Bold")); + // Stroke style + fireEvent.click(screen.getByLabelText("Dotted")); + // Roughness + fireEvent.click(screen.getByLabelText("Cartoonist")); + // Opacity + fireEvent.change(screen.getByLabelText("Opacity"), { + target: { value: "60" }, + }); + + mouse.reset(); + // Copy styles of second rectangle + fireEvent.contextMenu(canvas, { button: 2, clientX: 40, clientY: 40 }); + let contextMenu = document.querySelector(".context-menu"); + fireEvent.click(queryByText(contextMenu as HTMLElement, "Copy styles")!); + const secondRect = JSON.parse(copiedStyles); + expect(secondRect.id).toBe(h.elements[1].id); + + mouse.reset(); + // Paste styles to first rectangle + fireEvent.contextMenu(canvas, { button: 2, clientX: 10, clientY: 10 }); + contextMenu = document.querySelector(".context-menu"); + fireEvent.click(queryByText(contextMenu as HTMLElement, "Paste styles")!); + + const firstRect = getSelectedElement(); + expect(firstRect.id).toBe(h.elements[0].id); + expect(firstRect.strokeColor).toBe("#c92a2a"); + expect(firstRect.backgroundColor).toBe("#e64980"); + expect(firstRect.fillStyle).toBe("cross-hatch"); + expect(firstRect.strokeWidth).toBe(2); // Bold: 2 + expect(firstRect.strokeStyle).toBe("dotted"); + expect(firstRect.roughness).toBe(2); // Cartoonist: 2 + expect(firstRect.opacity).toBe(60); + }); + + it("selecting 'Delete' in context menu deletes element", () => { + 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"); + fireEvent.click(queryByText(contextMenu as HTMLElement, "Delete")!); + expect(getSelectedElements()).toHaveLength(0); + expect(h.elements[0].isDeleted).toBe(true); + }); + + it("selecting 'Add to library' in context menu adds element to library", async () => { + 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"); + fireEvent.click(queryByText(contextMenu as HTMLElement, "Add to library")!); + + await waitFor(() => { + const library = localStorage.getItem("excalidraw-library"); + expect(library).not.toBeNull(); + const addedElement = JSON.parse(library!)[0][0]; + expect(addedElement).toEqual(h.elements[0]); + }); + }); + + it("selecting 'Duplicate' in context menu duplicates element", () => { + 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"); + fireEvent.click(queryByText(contextMenu as HTMLElement, "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]; + expect(rect1).toEqual(rect2); + }); + + it("selecting 'Send backward' in context menu sends element backward", () => { + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + mouse.reset(); + fireEvent.contextMenu(canvas, { button: 2, clientX: 40, clientY: 40 }); + const contextMenu = document.querySelector(".context-menu"); + const elementsBefore = h.elements; + fireEvent.click(queryByText(contextMenu as HTMLElement, "Send backward")!); + expect(elementsBefore[0].id).toEqual(h.elements[1].id); + expect(elementsBefore[1].id).toEqual(h.elements[0].id); + }); + + it("selecting 'Bring forward' in context menu brings element forward", () => { + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + mouse.reset(); + fireEvent.contextMenu(canvas, { button: 2, clientX: 10, clientY: 10 }); + const contextMenu = document.querySelector(".context-menu"); + const elementsBefore = h.elements; + fireEvent.click(queryByText(contextMenu as HTMLElement, "Bring forward")!); + expect(elementsBefore[0].id).toEqual(h.elements[1].id); + expect(elementsBefore[1].id).toEqual(h.elements[0].id); + }); + + it("selecting 'Send to back' in context menu sends element to back", () => { + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + mouse.reset(); + fireEvent.contextMenu(canvas, { button: 2, clientX: 40, clientY: 40 }); + const contextMenu = document.querySelector(".context-menu"); + const elementsBefore = h.elements; + fireEvent.click(queryByText(contextMenu as HTMLElement, "Send to back")!); + expect(elementsBefore[1].id).toEqual(h.elements[0].id); + }); + + it("selecting 'Bring to front' in context menu brings element to front", () => { + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + mouse.reset(); + fireEvent.contextMenu(canvas, { button: 2, clientX: 10, clientY: 10 }); + const contextMenu = document.querySelector(".context-menu"); + const elementsBefore = h.elements; + fireEvent.click(queryByText(contextMenu as HTMLElement, "Bring to front")!); + expect(elementsBefore[0].id).toEqual(h.elements[1].id); + }); + + it("selecting 'Group selection' in context menu groups selected elements", () => { + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + mouse.reset(); + withModifierKeys({ shift: true }, () => { + mouse.click(10, 10); + }); + + fireEvent.contextMenu(canvas, { button: 2, clientX: 1, clientY: 1 }); + const contextMenu = document.querySelector(".context-menu"); + fireEvent.click( + queryByText(contextMenu as HTMLElement, "Group selection")!, + ); + const selectedGroupIds = Object.keys(h.state.selectedGroupIds); + expect(h.elements[0].groupIds).toEqual(selectedGroupIds); + expect(h.elements[1].groupIds).toEqual(selectedGroupIds); + }); + + it("selecting 'Ungroup selection' in context menu ungroups selected group", () => { + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + clickTool("rectangle"); + mouse.down(10, 10); + mouse.up(20, 20); + + mouse.reset(); + withModifierKeys({ shift: true }, () => { + mouse.click(10, 10); + }); + + withModifierKeys({ ctrl: true }, () => { + keyPress("g"); + }); + + fireEvent.contextMenu(canvas, { button: 2, clientX: 1, clientY: 1 }); + const contextMenu = document.querySelector(".context-menu"); + fireEvent.click( + queryByText(contextMenu as HTMLElement, "Ungroup selection")!, + ); + + const selectedGroupIds = Object.keys(h.state.selectedGroupIds); + expect(selectedGroupIds).toHaveLength(0); + expect(h.elements[0].groupIds).toHaveLength(0); + expect(h.elements[1].groupIds).toHaveLength(0); + }); });