Add extension snapshot testing support to frontend-test-utils

Adds the snapshot() method to ExtensionTester, enabling snapshot testing of extension tree structures. The snapshots use a tree-shaped format that mirrors the extension hierarchy, with empty fields and default values omitted for clarity. Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
2026-02-02 01:30:22 +01:00
parent a5e536d899
commit 15ed3f9ccb
7 changed files with 297 additions and 2 deletions
@@ -153,4 +153,61 @@ describe('PageBlueprint', () => {
      expect(getByText("I'm a lovely card")).toBeInTheDocument(),
    );
  });
+
+  it('should produce a correct extension tree snapshot with child extensions', () => {
+    const myPage = PageBlueprint.makeWithOverrides({
+      name: 'test-page',
+      inputs: {
+        cards: createExtensionInput([coreExtensionData.reactElement], {
+          optional: false,
+          singleton: false,
+        }),
+      },
+      factory(originalFactory, { inputs }) {
+        return originalFactory({
+          loader: async () => (
+            <div>
+              {inputs.cards.map(c => c.get(coreExtensionData.reactElement))}
+            </div>
+          ),
+          path: '/test',
+          routeRef: mockRouteRef,
+        });
+      },
+    });
+
+    const CardBlueprint = createExtensionBlueprint({
+      kind: 'card',
+      attachTo: { id: 'page:test-page', input: 'cards' },
+      output: [coreExtensionData.reactElement],
+      factory() {
+        return [coreExtensionData.reactElement(<div>I'm a lovely card</div>)];
+      },
+    });
+
+    const tester = createExtensionTester(myPage).add(
+      CardBlueprint.make({ name: 'card', params: {} }),
+    );
+
+    expect(tester.snapshot()).toMatchInlineSnapshot(`
+      {
+        "children": {
+          "cards": [
+            {
+              "id": "card:card",
+              "outputs": [
+                "core.reactElement",
+              ],
+            },
+          ],
+        },
+        "id": "page:test-page",
+        "outputs": [
+          "core.reactElement",
+          "core.routing.path",
+          "core.routing.ref",
+        ],
+      }
+    `);
+  });
 });