tests

src/pages/Refund.tsx

@@ -1,7 +1,7 @@
 import { useNavigate } from "@solidjs/router";
 import log from "loglevel";
 import QrScanner from "qr-scanner";
-import { Show, createEffect, createSignal } from "solid-js";
+import { Show, createSignal, onMount } from "solid-js";
 
 import BlockExplorer from "../components/BlockExplorer";
 import RefundButton from "../components/RefundButton";
@@ -30,7 +30,8 @@ const Refund = () => {
     const checkRefundJsonKeys = (input: HTMLInputElement, json: any) => {
         log.debug("checking refund json", json);
 
-        // Redirect to normal flow if swap is in local storage
+        // When the swap id is found in the local storage, there is no need for the validation,
+        // all relevant data is there already and we just need to show the button to redirect
         const localStorageSwap = swaps().find((s: any) => s.id === json.id);
         if (localStorageSwap !== undefined) {
             setSwapFound(json.id);
@@ -95,7 +96,7 @@ const Refund = () => {
         setRefundableSwaps(refundableSwaps().concat(swap));
     };
 
-    createEffect(() => {
+    onMount(() => {
         const swapsToRefund = swaps()
             .filter(refundSwapsSanityFilter)
             .filter((swap) =>

tests/pages/Refund.spec.tsx

@@ -24,9 +24,8 @@ describe("Refund", () => {
         ).not.toBeUndefined();
     });
 
-    test("should not show refund button when no file was uploaded", async () => {
+    test("should show refund button when file was uploaded", async () => {
         const user = userEvent.setup();
-
         render(
             () => (
                 <>
@@ -55,6 +54,75 @@ describe("Refund", () => {
             });
         await user.upload(uploadInput, swapFile);
 
-        expect(refundFrame.children.length).toEqual(8);
+        expect(await screen.findAllByText(i18n.en.refund)).not.toBeUndefined();
+    });
+
+    test("should show invalid refund button when invalid file was uploaded", async () => {
+        const user = userEvent.setup();
+        render(
+            () => (
+                <>
+                    <TestComponent />
+                    <Refund />
+                </>
+            ),
+            {
+                wrapper: contextWrapper,
+            },
+        );
+        const refundFrame = (await screen.findByTestId(
+            "refundFrame",
+        )) as HTMLDivElement;
+        expect(refundFrame.children.length).toEqual(4);
+
+        const uploadInput = await screen.findByTestId("refundUpload");
+        const swapFile = new File(["{}"], "swap.json", {
+            type: "application/json",
+        });
+        (swapFile as any).text = async () =>
+            JSON.stringify({
+                asset: "BTC",
+            });
+        await user.upload(uploadInput, swapFile);
+
+        expect(
+            await screen.findAllByText(i18n.en.invalid_refund_file),
+        ).not.toBeUndefined();
+    });
+
+    test("should show open swap button when swap is in `swaps()`", async () => {
+        const user = userEvent.setup();
+        render(
+            () => (
+                <>
+                    <TestComponent />
+                    <Refund />
+                </>
+            ),
+            {
+                wrapper: contextWrapper,
+            },
+        );
+        const swap = {
+            asset: "BTC",
+            id: "123",
+            privateKey: "",
+        };
+        globalSignals.setSwaps([swap]);
+        const refundFrame = (await screen.findByTestId(
+            "refundFrame",
+        )) as HTMLDivElement;
+        expect(refundFrame.children.length).toEqual(4);
+
+        const uploadInput = await screen.findByTestId("refundUpload");
+        const swapFile = new File(["{}"], "swap.json", {
+            type: "application/json",
+        });
+        (swapFile as any).text = async () => JSON.stringify(swap);
+        await user.upload(uploadInput, swapFile);
+
+        expect(
+            await screen.findAllByText(i18n.en.open_swap),
+        ).not.toBeUndefined();
     });
 });