Add workspace master/detail tests

Signed-off-by: Andrew Stein <steinlink@gmail.com>

Author: texodus

packages/perspective-viewer-datagrid/package.json

@@ -35,7 +35,7 @@
         "@finos/perspective": "workspace:^",
         "@finos/perspective-viewer": "workspace:^",
         "chroma-js": "^1.3.4",
-        "regular-table": "=0.6.6"
+        "regular-table": "=0.6.7"
     },
     "devDependencies": {
         "@prospective.co/procss": "^0.1.16",

packages/perspective-workspace/src/ts/perspective-workspace.ts

@@ -141,6 +141,15 @@ export class HTMLPerspectiveWorkspaceElement extends HTMLElement {
         await this.workspace!.restore(layout);
     }
 
+    async clear() {
+        await this.restore({
+            sizes: [],
+            master: { sizes: [] },
+            detail: { sizes: [] },
+            viewers: {},
+        });
+    }
+
     /**
      * Await all asynchronous tasks for all viewers in this workspace. This is
      * useful to make sure asynchonous side effects of synchronous methods calls

packages/perspective-workspace/src/ts/workspace/workspace.ts

@@ -237,6 +237,10 @@ export class PerspectiveWorkspace extends SplitPanel {
         // Using ES generators as context managers ..
         for (const viewers of this._capture_viewers()) {
             for (const widgets of this._capture_widgets()) {
+                for (const v of viewers) {
+                    v.removeAttribute("class");
+                }
+
                 const callback = this._restore_callback.bind(
                     this,
                     viewer_configs,

packages/perspective-workspace/test/js/restore.spec.js

@@ -116,6 +116,136 @@ function tests(context, compare) {
             `${context}-restore-workspace-is-symmetric-with-addviewer.txt`
         );
     });
+
+    test.describe("Toggle master/detail", () => {
+        test("restore a blank view removes master panel", async ({ page }) => {
+            const config = {
+                detail: {
+                    main: {
+                        type: "tab-area",
+                        widgets: ["PERSPECTIVE_GENERATED_ID_1"],
+                        currentIndex: 0,
+                    },
+                },
+                master: { widgets: ["PERSPECTIVE_GENERATED_ID_0"], sizes: [1] },
+                viewers: {
+                    PERSPECTIVE_GENERATED_ID_0: {
+                        table: "superstore",
+                    },
+                    PERSPECTIVE_GENERATED_ID_1: {
+                        table: "superstore",
+                    },
+                },
+            };
+
+            const empty_config = {
+                detail: {},
+                viewers: {},
+            };
+
+            const x = await page.evaluate(async (config) => {
+                const workspace = document.getElementById("workspace");
+                await workspace.restore(config);
+                await workspace.flush();
+                return workspace.outerHTML;
+            }, config);
+
+            test.expect(x).toEqual(
+                '<perspective-workspace id="workspace"><perspective-viewer slot="PERSPECTIVE_GENERATED_ID_1" table="superstore" theme="Pro Light"><perspective-viewer-datagrid style="position: absolute; inset: 0px; opacity: 1;" class="edit-mode-allowed" data-edit-mode="READ_ONLY"></perspective-viewer-datagrid><perspective-viewer-datagrid-toolbar slot="plugin-settings"></perspective-viewer-datagrid-toolbar></perspective-viewer><perspective-viewer slot="PERSPECTIVE_GENERATED_ID_0" table="superstore" class="workspace-master-widget" selectable="" theme="Pro Light"><perspective-viewer-datagrid style="position: absolute; inset: 0px; opacity: 1;" data-edit-mode="READ_ONLY"></perspective-viewer-datagrid><perspective-viewer-datagrid-toolbar slot="plugin-settings"></perspective-viewer-datagrid-toolbar></perspective-viewer></perspective-workspace>'
+            );
+
+            await page.evaluate(async (config) => {
+                const workspace = document.getElementById("workspace");
+                await workspace.restore(config);
+                await workspace.flush();
+            }, empty_config);
+
+            return compare(
+                page,
+                `${context}-restore-a-blank-view-removes-master-panel.txt`
+            );
+        });
+
+        test("restore a view which reuses a master viewer, removes master panel", async ({
+            page,
+        }) => {
+            const config = {
+                detail: {
+                    main: {
+                        type: "tab-area",
+                        widgets: ["PERSPECTIVE_GENERATED_ID_1"],
+                        currentIndex: 0,
+                    },
+                },
+                master: { widgets: ["PERSPECTIVE_GENERATED_ID_0"], sizes: [1] },
+                viewers: {
+                    PERSPECTIVE_GENERATED_ID_0: {
+                        table: "superstore",
+                        title: "One",
+                    },
+                    PERSPECTIVE_GENERATED_ID_1: {
+                        table: "superstore",
+                        title: "Two",
+                    },
+                },
+            };
+
+            const config2 = {
+                detail: {
+                    main: {
+                        type: "split-area",
+                        orientation: "horizontal",
+                        children: [
+                            {
+                                type: "tab-area",
+                                widgets: ["PERSPECTIVE_GENERATED_ID_0"],
+                                currentIndex: 0,
+                            },
+                            {
+                                type: "tab-area",
+                                widgets: ["PERSPECTIVE_GENERATED_ID_1"],
+                                currentIndex: 0,
+                            },
+                        ],
+                        sizes: [0.5, 0.5],
+                    },
+                },
+                master: { widgets: [], sizes: [] },
+                viewers: {
+                    PERSPECTIVE_GENERATED_ID_0: {
+                        table: "superstore",
+                        title: "One",
+                    },
+                    PERSPECTIVE_GENERATED_ID_1: {
+                        table: "superstore",
+                        title: "Two",
+                    },
+                },
+            };
+
+            const x = await page.evaluate(async (config) => {
+                const workspace = document.getElementById("workspace");
+                await workspace.restore(config);
+                await workspace.flush();
+                return workspace.outerHTML;
+            }, config);
+
+            test.expect(x).toEqual(
+                '<perspective-workspace id="workspace"><perspective-viewer slot="PERSPECTIVE_GENERATED_ID_1" table="superstore" theme="Pro Light"><perspective-viewer-datagrid style="position: absolute; inset: 0px; opacity: 1;" class="edit-mode-allowed" data-edit-mode="READ_ONLY"></perspective-viewer-datagrid><perspective-viewer-datagrid-toolbar slot="plugin-settings"></perspective-viewer-datagrid-toolbar></perspective-viewer><perspective-viewer slot="PERSPECTIVE_GENERATED_ID_0" table="superstore" class="workspace-master-widget" selectable="" theme="Pro Light"><perspective-viewer-datagrid style="position: absolute; inset: 0px; opacity: 1;" data-edit-mode="READ_ONLY"></perspective-viewer-datagrid><perspective-viewer-datagrid-toolbar slot="plugin-settings"></perspective-viewer-datagrid-toolbar></perspective-viewer></perspective-workspace>'
+            );
+
+            await page.evaluate(async (config) => {
+                const workspace = document.getElementById("workspace");
+                await workspace.restore(config);
+                await workspace.flush();
+            }, config2);
+
+            return compare(
+                page,
+                `${context}-restore-which-reseats-master-viewer.txt`
+            );
+        });
+    });
 }
 
 test.describe("Workspace restore", () => {