Prettify HTML test records for better output

texodus · texodus · commit 6e8e3962d534 · 2025-06-19T14:41:56.000-04:00
Signed-off-by: Andrew Stein &lt;steinlink@gmail.com&gt;
diff --git a/packages/perspective-viewer-datagrid/package.json b/packages/perspective-viewer-datagrid/package.json
@@ -40,6 +40,7 @@
     "devDependencies": {
         "@prospective.co/procss": "^0.1.16",
         "@finos/perspective-esbuild-plugin": "workspace:^",
-        "@finos/perspective-test": "workspace:^"
+        "@finos/perspective-test": "workspace:^",
+        "prettier": "^2.8.8"
     }
 }
diff --git a/packages/perspective-viewer-datagrid/test/js/superstore.spec.js b/packages/perspective-viewer-datagrid/test/js/superstore.spec.js
@@ -16,17 +16,22 @@ import {
     run_standard_tests,
     runPerspectiveEventClickTest,
 } from "@finos/perspective-test";
+import * as prettier from "prettier";
 
 async function getDatagridContents(page) {
-    return await page.evaluate(async () => {
+    const raw = await page.evaluate(async () => {
         const datagrid = document.querySelector(
             "perspective-viewer perspective-viewer-datagrid"
         );
         if (!datagrid) {
             return "MISSING DATAGRID";
         }
         const regularTable = datagrid.shadowRoot.querySelector("regular-table");
-        return regularTable?.innerHTML || "MISSING";
+        return regularTable?.innerHTML || "";
+    });
+
+    return await prettier.format(raw, {
+        parser: "html",
     });
 }
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/rust/perspective-js/src/rust/utils/errors.rs b/rust/perspective-js/src/rust/utils/errors.rs
@@ -90,7 +90,7 @@ pub enum ApiErrorType {
     #[error("{0}")]
     ProstError(#[from] prost::DecodeError),
 
-    #[error("Unknown column \"{0}\" in field `{0}`")]
+    #[error("Unknown column \"{1}\" in field `{0}`")]
     InvalidViewerConfigError(&'static str, String),
 
     #[error("Invalid `expressions` {}", format_valid_exprs(.0))]
diff --git a/rust/perspective-viewer/package.json b/rust/perspective-viewer/package.json
@@ -42,9 +42,10 @@
         "@finos/perspective-esbuild-plugin": "workspace:^",
         "@finos/perspective-test": "workspace:^",
         "@finos/perspective-metadata": "workspace:^",
-        "@types/react": "^17.0.2",
-        "cpy": "^9.0.1",
         "@prospective.co/procss": "0.1.16",
+        "cpy": "^9.0.1",
+        "prettier": "^2.8.8",
+        "@types/react": "^17.0.2",
         "zx": "8.1.9"
     }
 }
diff --git a/rust/perspective-viewer/test/js/cancellable.spec.js b/rust/perspective-viewer/test/js/cancellable.spec.js
@@ -12,13 +12,16 @@
 
 import { test } from "@finos/perspective-test";
 import { compareContentsToSnapshot } from "@finos/perspective-test";
+import * as prettier from "prettier";
 
 async function get_contents(page) {
-    return await page.evaluate(async () => {
-        const viewer = document
-            .querySelector("perspective-viewer")
-            .shadowRoot.querySelector("#app_panel");
-        return viewer ? viewer.innerHTML : "MISSING";
+    const raw = await page.evaluate(async () => {
+        const viewer = document.querySelector("perspective-viewer").shadowRoot;
+        return viewer.innerHTML;
+    });
+
+    return await prettier.format(raw, {
+        parser: "html",
     });
 }
 
diff --git a/rust/perspective-viewer/test/js/events.spec.ts b/rust/perspective-viewer/test/js/events.spec.ts
@@ -15,15 +15,18 @@ import {
     compareContentsToSnapshot,
     API_VERSION,
 } from "@finos/perspective-test";
+import * as prettier from "prettier";
 
 async function get_contents(page) {
-    return await page.evaluate(async () => {
+    const raw = await page.evaluate(async () => {
         // @ts-ignore
-        const viewer = document
-            .querySelector("perspective-viewer")
-            .shadowRoot.querySelector("#app_panel");
+        const viewer = document.querySelector("perspective-viewer").shadowRoot;
         return viewer ? viewer.innerHTML : "MISSING";
     });
+
+    return await prettier.format(raw, {
+        parser: "html",
+    });
 }
 
 test.beforeEach(async ({ page }) => {
diff --git a/rust/perspective-viewer/test/js/regressions.spec.js b/rust/perspective-viewer/test/js/regressions.spec.js
@@ -16,13 +16,16 @@ import {
     compareContentsToSnapshot,
     shadow_type,
 } from "@finos/perspective-test";
+import * as prettier from "prettier";
 
 async function get_contents(page) {
-    return await page.evaluate(async () => {
-        const viewer = document
-            .querySelector("perspective-viewer")
-            .shadowRoot.querySelector("#app_panel");
-        return viewer ? viewer.innerHTML : "MISSING";
+    const raw = await page.evaluate(async () => {
+        const viewer = document.querySelector("perspective-viewer").shadowRoot;
+        return viewer.innerHTML;
+    });
+
+    return await prettier.format(raw, {
+        parser: "html",
     });
 }
 
diff --git a/rust/perspective-viewer/test/js/save_restore.spec.js b/rust/perspective-viewer/test/js/save_restore.spec.js
@@ -15,13 +15,16 @@ import {
     compareContentsToSnapshot,
     API_VERSION,
 } from "@finos/perspective-test";
+import * as prettier from "prettier";
 
 async function get_contents(page) {
-    return await page.evaluate(async () => {
-        const viewer = document
-            .querySelector("perspective-viewer")
-            .shadowRoot.querySelector("#app_panel");
-        return viewer ? viewer.innerHTML : "MISSING";
+    const raw = await page.evaluate(async () => {
+        const viewer = document.querySelector("perspective-viewer").shadowRoot;
+        return viewer.innerHTML;
+    });
+
+    return await prettier.format(raw.trim(), {
+        parser: "html",
     });
 }
 
diff --git a/rust/perspective-viewer/test/js/settings.spec.js b/rust/perspective-viewer/test/js/settings.spec.js
@@ -12,15 +12,16 @@
 
 import { test, expect } from "@finos/perspective-test";
 import { compareContentsToSnapshot } from "@finos/perspective-test";
-
-// import path from "node:path";
+import * as prettier from "prettier";
 
 async function get_contents(page) {
-    return await page.evaluate(async () => {
-        const viewer = document
-            .querySelector("perspective-viewer")
-            .shadowRoot.querySelector("#app_panel");
-        return viewer ? viewer.innerHTML : "MISSING";
+    const raw = await page.evaluate(async () => {
+        const viewer = document.querySelector("perspective-viewer").shadowRoot;
+        return viewer.innerHTML;
+    });
+
+    return await prettier.format(raw, {
+        parser: "html",
     });
 }
 
diff --git a/rust/perspective-viewer/test/js/superstore.spec.js b/rust/perspective-viewer/test/js/superstore.spec.js
@@ -18,6 +18,8 @@ async function get_contents(page) {
         const viewer = document.querySelector(
             "perspective-viewer perspective-viewer-plugin"
         );
+
+        // Don't format - light DOM is CSV in a <pre> tag.
         return viewer.innerHTML;
     });
 }
diff --git a/tools/perspective-test/results.tar.gz b/tools/perspective-test/results.tar.gz
diff --git a/tools/perspective-test/src/js/utils.ts b/tools/perspective-test/src/js/utils.ts
@@ -15,6 +15,7 @@ import { expect, Locator, Page } from "@playwright/test";
 import * as fs from "node:fs";
 import path from "node:path";
 import url from "node:url";
+import * as prettier from "prettier";
 
 const __filename = url.fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -162,7 +163,11 @@ export async function compareContentsToSnapshot(
         .replace(/style=""/g, "")
         .replace(/(min-|max-)?(width|height): *\d+\.*\d+(px)?;? */g, "");
 
-    await expect(cleanedContents).toMatchSnapshot(snapshotPath);
+    const formatted = await prettier.format(cleanedContents, {
+        parser: "html",
+    });
+
+    await expect(formatted).toMatchSnapshot(snapshotPath);
 }
 
 export async function compareSVGContentsToSnapshot(
@@ -190,13 +195,11 @@ export function getWorkspaceShadowDOMContents(page: Page): Promise<string> {
 
 export async function compareLightDOMContents(page, snapshotFileName) {
     const contents = await getWorkspaceLightDOMContents(page);
-
     await compareContentsToSnapshot(contents, [snapshotFileName]);
 }
 
 export async function compareShadowDOMContents(page, snapshotFileName) {
     const contents = await getWorkspaceShadowDOMContents(page);
-
     await compareContentsToSnapshot(contents, [snapshotFileName]);
 }
 

Original file line number	Diff line number	Diff line change
`@@ -40,6 +40,7 @@`
`40`	`40`	`"devDependencies": {`
`41`	`41`	`"@prospective.co/procss": "^0.1.16",`
`42`	`42`	`"@finos/perspective-esbuild-plugin": "workspace:^",`
`43`		`- "@finos/perspective-test": "workspace:^"`
	`43`	`+ "@finos/perspective-test": "workspace:^",`
	`44`	`+ "prettier": "^2.8.8"`
`44`	`45`	`}`
`45`	`46`	`}`
Original file line number	Diff line number	Diff line change
`@@ -42,9 +42,10 @@`
`42`	`42`	`"@finos/perspective-esbuild-plugin": "workspace:^",`
`43`	`43`	`"@finos/perspective-test": "workspace:^",`
`44`	`44`	`"@finos/perspective-metadata": "workspace:^",`
`45`		`- "@types/react": "^17.0.2",`
`46`		`- "cpy": "^9.0.1",`
`47`	`45`	`"@prospective.co/procss": "0.1.16",`
	`46`	`+ "cpy": "^9.0.1",`
	`47`	`+ "prettier": "^2.8.8",`
	`48`	`+ "@types/react": "^17.0.2",`
`48`	`49`	`"zx": "8.1.9"`
`49`	`50`	`}`
`50`	`51`	`}`