test: add test for replace button visibility in multiple file fields

Author: sairajchouhan

src/__test__/data/fields.ts

@@ -35,3 +35,18 @@ export const mockMultipleLinkFieldSchema: ISchemaFieldMap = {
     non_localizable: false,
     unique: false,
 };
+
+export const mockMultipleFileFieldSchema: ISchemaFieldMap = {
+    data_type: "file",
+    display_name: "File",
+    uid: "file",
+    extensions: [],
+    field_metadata: {
+        description: "",
+        rich_text_type: "standard"
+    },
+    mandatory: false,
+    multiple: true,
+    non_localizable: false,
+    unique: false,
+};

src/visualBuilder/components/__test__/fieldToolbar.test.tsx

@@ -7,7 +7,7 @@ import {
 } from "../../utils/instanceHandlers";
 import { ISchemaFieldMap } from "../../utils/types/index.types";
 import FieldToolbarComponent from "../FieldToolbar";
-import { mockMultipleLinkFieldSchema, singleLineFieldSchema } from "../../../__test__/data/fields";
+import { mockMultipleLinkFieldSchema, mockMultipleFileFieldSchema } from "../../../__test__/data/fields";
 import { asyncRender } from "../../../__test__/utils";
 import { VisualBuilderCslpEventDetails } from "../../types/visualBuilder.types";
 
@@ -180,4 +180,60 @@ describe("MultipleFieldToolbarComponent", () => {
         );
         expect(variantIcon).toBeInTheDocument();
     });
+
+    describe("'Replace button' visibility for multiple file fields", () => {
+        beforeEach(() => {
+            vi.spyOn(FieldSchemaMap, "getFieldSchema").mockResolvedValue(
+                mockMultipleFileFieldSchema
+            );
+        });
+
+        test("'replace button' is hidden for parent wrapper of multiple file field", async () => {
+            const parentWrapperMetadata: CslpData = {
+                ...mockMultipleFieldMetadata,
+                fieldPathWithIndex: "files",
+                instance: {
+                    fieldPathWithIndex: "files"
+                },
+            };
+
+            const parentWrapperEventDetails = {
+                ...mockEventDetails,
+                fieldMetadata: parentWrapperMetadata
+            };
+
+            const { container } = await asyncRender(
+                <FieldToolbarComponent
+                    eventDetails={parentWrapperEventDetails}
+                />
+            );
+
+            const replaceButton = container.querySelector('[data-testid="visual-builder-replace-file"]');
+            expect(replaceButton).not.toBeInTheDocument();
+        });
+
+        test("'replace button' is visible for individual field in multiple file field", async () => {
+            const individualFieldMetadata: CslpData = {
+                ...mockMultipleFieldMetadata,
+                fieldPathWithIndex: "files",
+                instance: {
+                    fieldPathWithIndex: "files.0"
+                },
+            };
+
+            const individualFieldEventDetails = {
+                ...mockEventDetails,
+                fieldMetadata: individualFieldMetadata
+            };
+
+            const { container } = await asyncRender(
+                <FieldToolbarComponent
+                    eventDetails={individualFieldEventDetails}
+                />
+            );
+
+            const replaceButton = container.querySelector('[data-testid="visual-builder-replace-file"]');
+            expect(replaceButton).toBeInTheDocument();
+        });
+    });
 });