test: update tests for refactored stamp data

passportxyz · Feb 6, 2025 · 777abe4 · 777abe4
1 parent 1280ed3
commit 777abe4
Show file tree

Hide file tree

Showing 7 changed files with 351 additions and 137 deletions.
diff --git a/src/components/Body/PlatformVerification.tsx b/src/components/Body/PlatformVerification.tsx
@@ -129,7 +129,7 @@ export const PlatformVerification = ({
 
           console.log("DEBUG  THIS ON CLICK VERIFY CREDENTIALS platform");
           let signature, credential;
-          if (platform.requireSignature) {
+          if (platform.requiresSignature) {
             // get the challenge and  sign it
             if (!queryProps.address) {
               console.error("No address found");
@@ -158,10 +158,10 @@ export const PlatformVerification = ({
             signature = await generateSignatureCallback(challengeToSign);
           }
 
-          if (platform.requiresPopup && platform.popUpUrl) {
+          if (platform.requiresPopup && platform.popupUrl) {
             // open the popup
             const oAuthPopUpUrl = `${
-              platform.popUpUrl
+              platform.popupUrl
             }?address=${encodeURIComponent(
               queryProps.address || ""
             )}&scorerId=${encodeURIComponent(

diff --git a/src/hooks/useStampPages.tsx b/src/hooks/useStampPages.tsx
@@ -1,7 +1,6 @@
 import { useEffect, useState, ReactNode } from "react";
-import axios from "axios";
-import { DEFAULT_IAM_URL } from "./usePassportScore";
 import { SanitizedHTMLComponent } from "../components/SanitizedHTMLComponent";
+import { fetchStampPages } from "../utils/stampDataApi";
 
 export type Credential = {
   id: string;
@@ -12,9 +11,9 @@ export type Platform = {
   name: string;
   description: ReactNode;
   documentationLink: string;
-  requireSignature?: boolean;
+  requiresSignature?: boolean;
   requiresPopup?: boolean;
-  popUpUrl?: string;
+  popupUrl?: string;
   credentials: Credential[];
   displayWeight: string;
 };
@@ -32,13 +31,9 @@ type RawStampPageData = Omit<StampPage, "platforms"> & {
   platforms: RawPlatformData[];
 };
 
-type StampsMetadataResponse = RawStampPageData[];
+export type StampsMetadataResponse = RawStampPageData[];
 
-export const usePaginatedStampPages = ({
-  apiKey,
-  scorerId,
-  overrideIamUrl,
-}: {
+export const usePaginatedStampPages = (props: {
   apiKey: string;
   scorerId: string;
   overrideIamUrl?: string;
@@ -49,24 +44,10 @@ export const usePaginatedStampPages = ({
   const [idx, setIdx] = useState(0);
 
   useEffect(() => {
-    const fetchStampPages = async () => {
+    (async () => {
       try {
-        // TODO: fix this to use propr url encoding
-        const response = await axios.get<StampsMetadataResponse>(
-          `${
-            overrideIamUrl || DEFAULT_IAM_URL
-          }/embed/stamps/metadata?scorerId=${scorerId}`,
-          {
-            headers: {
-              "X-API-KEY": apiKey,
-              "Content-Type": "application/json",
-            },
-          }
-        );
-
-        const data = response.data;
+        const data = await fetchStampPages(props);
 
-        // Convert description from HTML string to JSX
         const formattedData: StampPage[] = data.map(
           (page: RawStampPageData) => ({
             ...page,
@@ -87,9 +68,7 @@ export const usePaginatedStampPages = ({
       } finally {
         setLoading(false);
       }
-    };
-
-    fetchStampPages();
+    })();
   }, []);
 
   // Pagination controls

diff --git a/src/utils/stampDataApi.tsx b/src/utils/stampDataApi.tsx
@@ -0,0 +1,28 @@
+import axios from "axios";
+import { StampsMetadataResponse } from "../hooks/useStampPages";
+import { DEFAULT_IAM_URL } from "../hooks/usePassportScore";
+
+export const fetchStampPages = async ({
+  apiKey,
+  scorerId,
+  overrideIamUrl,
+}: {
+  apiKey: string;
+  scorerId: string;
+  overrideIamUrl?: string;
+}) => {
+  // TODO: fix this to use propr url encoding
+  const response = await axios.get<StampsMetadataResponse>(
+    `${
+      overrideIamUrl || DEFAULT_IAM_URL
+    }/embed/stamps/metadata?scorerId=${scorerId}`,
+    {
+      headers: {
+        "X-API-KEY": apiKey,
+        "Content-Type": "application/json",
+      },
+    }
+  );
+
+  return response.data;
+};
diff --git a/test/components/PlatformVerification.test.tsx b/test/components/PlatformVerification.test.tsx
@@ -5,7 +5,11 @@ import { PlatformVerification } from "../../src/components/Body/PlatformVerifica
 import * as usePassportScore from "../../src/hooks/usePassportScore";
 import * as usePlatformStatus from "../../src/hooks/usePlatformStatus";
 import * as QueryContext from "../../src/contexts/QueryContext";
-import { setupTestQueryClient } from "../testUtils";
+import {
+  mockExpectedConsoleErrorLog,
+  setupTestQueryClient,
+} from "../testUtils";
+import { Platform } from "../../src/hooks/useStampPages";
 
 // Mock the hooks
 jest.mock("../../src/hooks/usePassportScore");
@@ -19,12 +23,13 @@ describe("PlatformVerification", () => {
   setupTestQueryClient();
 
   // Common test props
-  const mockPlatform = {
+  const mockPlatform: Platform = {
     name: "LinkedIn",
     description: <div>Verify your LinkedIn account</div>,
     credentials: [{ id: "linkedin", weight: "1" }],
-    requireSignature: true,
-    oAuthPopup: true,
+    requiresSignature: true,
+    requiresPopup: true,
+    popupUrl: "https://test.com/oauth",
     documentationLink: "https://docs.example.com",
     displayWeight: "1",
   };
@@ -168,8 +173,8 @@ describe("PlatformVerification", () => {
       <PlatformVerification
         platform={{
           ...mockPlatform,
-          oAuthPopup: false,
-          requireSignature: false,
+          requiresSignature: false,
+          requiresPopup: false,
         }}
         onClose={mockOnClose}
         generateSignatureCallback={mockGenerateSignature}
@@ -187,39 +192,40 @@ describe("PlatformVerification", () => {
     });
   });
 
-  it("handles missing address error", async () => {
-    const consoleSpy = jest.spyOn(console, "error").mockImplementation();
-
-    // Mock missing address in context
-    (QueryContext.useQueryContext as jest.Mock).mockReturnValue({
-      address: null,
-    });
-
-    const mockVerifyCredentials = jest.fn();
-    (usePassportScore.useWidgetVerifyCredentials as jest.Mock).mockReturnValue({
-      verifyCredentials: mockVerifyCredentials,
-    });
+  describe("Errors", () => {
+    mockExpectedConsoleErrorLog();
+
+    it("handles missing address error", async () => {
+      // Mock missing address in context
+      (QueryContext.useQueryContext as jest.Mock).mockReturnValue({
+        address: null,
+      });
+
+      const mockVerifyCredentials = jest.fn();
+      (
+        usePassportScore.useWidgetVerifyCredentials as jest.Mock
+      ).mockReturnValue({
+        verifyCredentials: mockVerifyCredentials,
+      });
+
+      render(
+        <PlatformVerification
+          platform={mockPlatform}
+          onClose={mockOnClose}
+          generateSignatureCallback={mockGenerateSignature}
+        />
+      );
 
-    render(
-      <PlatformVerification
-        platform={mockPlatform}
-        onClose={mockOnClose}
-        generateSignatureCallback={mockGenerateSignature}
-      />
-    );
+      // Click verify button
+      fireEvent.click(screen.getByRole("button", { name: /verify/i }));
 
-    // Click verify button
-    fireEvent.click(screen.getByRole("button", { name: /verify/i }));
+      await waitFor(() => {
+        expect(
+          screen.getByText(/Unable to claim this Stamp/i)
+        ).toBeInTheDocument();
+      });
 
-    await waitFor(() => {
-      expect(
-        screen.getByText(/Unable to claim this Stamp/i)
-      ).toBeInTheDocument();
+      expect(mockVerifyCredentials).not.toHaveBeenCalled();
     });
-
-    expect(mockVerifyCredentials).not.toHaveBeenCalled();
-
-    expect(consoleSpy).toHaveBeenCalled();
-    consoleSpy.mockRestore();
   });
 });