From 9efb43e0d2ca4c887c84ae994cd5a8136a425090 Mon Sep 17 00:00:00 2001
From: DanConwayDev <DanConwayDev@protonmail.com>
Date: Sun, 1 Oct 2023 00:00:00 +0100
Subject: [PATCH] build: fix dom snapshot config

using svelte format for stories requires storybook to run with the
--index-json flag but this breaks the storage location of DOM
snapshots

the configuration files in this commit fixes this and also moves them
to the same location as the image snapshots
---
 .storybook/test-runner.ts                           |  1 +
 .../navbar.test.js.snap                             |  6 +++---
 test-runner-jest.config.js                          | 13 +++++++++++++
 test-runner-snapshotresolver.js                     |  9 +++++++++
 4 files changed, 26 insertions(+), 3 deletions(-)
 rename src/lib/components/__snapshots__/Navbar.stories.ts.snap => __snapshots__/navbar.test.js.snap (90%)
 create mode 100644 test-runner-jest.config.js
 create mode 100644 test-runner-snapshotresolver.js

diff --git a/.storybook/test-runner.ts b/.storybook/test-runner.ts
index dfed69c..98dad55 100644
--- a/.storybook/test-runner.ts
+++ b/.storybook/test-runner.ts
@@ -15,6 +15,7 @@ const config: TestRunnerConfig = {
             const innerHTML = await elementHandler.innerHTML();
             expect(innerHTML).toMatchSnapshot();
         }
+        else throw "cannot find storybook DOM root to take DOM screenshot"
         // Image Snapshop
         const image = await page.screenshot();
         expect(image).toMatchImageSnapshot({
diff --git a/src/lib/components/__snapshots__/Navbar.stories.ts.snap b/__snapshots__/navbar.test.js.snap
similarity index 90%
rename from src/lib/components/__snapshots__/Navbar.stories.ts.snap
rename to __snapshots__/navbar.test.js.snap
index cb27b76..e44c3b9 100644
--- a/src/lib/components/__snapshots__/Navbar.stories.ts.snap
+++ b/__snapshots__/navbar.test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Navbar Default smoke-test 1`] = `
+exports[`Navbar Default test 1`] = `
 <div class="navbar bg-neutral">
   <div class="flex-1">
     <h4>
@@ -26,7 +26,7 @@ exports[`Navbar Default smoke-test 1`] = `
 </div>
 `;
 
-exports[`Navbar NIP07Exists smoke-test 1`] = `
+exports[`Navbar NIP07Exists test 1`] = `
 <div class="navbar bg-neutral">
   <div class="flex-1">
     <h4>
@@ -49,7 +49,7 @@ exports[`Navbar NIP07Exists smoke-test 1`] = `
 </div>
 `;
 
-exports[`Navbar NoNIP07 smoke-test 1`] = `
+exports[`Navbar NoNIP07 test 1`] = `
 <div class="navbar bg-neutral">
   <div class="flex-1">
     <h4>
diff --git a/test-runner-jest.config.js b/test-runner-jest.config.js
new file mode 100644
index 0000000..0cf442d
--- /dev/null
+++ b/test-runner-jest.config.js
@@ -0,0 +1,13 @@
+const { getJestConfig } = require('@storybook/test-runner');
+const path = require('path');
+/**
+ * @type {import('@jest/types').Config.InitialOptions}
+ */
+module.exports = {
+  // The default configuration comes from @storybook/test-runner
+  ...getJestConfig(),
+  /** Add your own overrides below
+   * @see https://jestjs.io/docs/configuration
+   */
+  snapshotResolver: "<rootDir>/test-runner-snapshotresolver.js"
+};
diff --git a/test-runner-snapshotresolver.js b/test-runner-snapshotresolver.js
new file mode 100644
index 0000000..1ee16d9
--- /dev/null
+++ b/test-runner-snapshotresolver.js
@@ -0,0 +1,9 @@
+const path = require('path');
+
+module.exports = {
+    resolveSnapshotPath: (testPath, snapshotExtension) =>
+        path.join(process.cwd(), '__snapshots__', path.basename(testPath) + snapshotExtension),
+    resolveTestPath: (snapshotFilePath, snapshotExtension) =>
+        path.join(process.env.TEST_ROOT, path.basename(snapshotFilePath, snapshotExtension)),
+    testPathForConsistencyCheck: path.join(process.env.TEST_ROOT, 'example.test.js'),
+};
\ No newline at end of file