diff --git a/src/client-scopes/add/MapperDialog.test.tsx b/src/client-scopes/add/MapperDialog.test.tsx
new file mode 100644
index 0000000000..31ea66d1d2
--- /dev/null
+++ b/src/client-scopes/add/MapperDialog.test.tsx
@@ -0,0 +1,75 @@
+import { Button } from "@patternfly/react-core";
+import { fireEvent, render, screen } from "@testing-library/react";
+import type { ServerInfoRepresentation } from "keycloak-admin/lib/defs/serverInfoRepesentation";
+import React, { useState } from "react";
+import { ServerInfoContext } from "../../context/server-info/ServerInfoProvider";
+import serverInfo from "../../context/server-info/__tests__/mock.json";
+import { AddMapperDialog, AddMapperDialogModalProps } from "./MapperDialog";
+
+describe("MapperDialog", () => {
+ const Test = (args: AddMapperDialogModalProps) => {
+ const [open, setOpen] = useState(false);
+
+ return (
+
+ setOpen(!open)}
+ />
+
+
+ );
+ };
+
+ it("disables the add button when nothing is selected", () => {
+ render( {}} />);
+
+ fireEvent.click(screen.getByText("Show"));
+
+ expect(screen.getByTestId("modalConfirm")).toHaveClass("pf-m-disabled");
+ });
+
+ it("returns array with selected build in protocol mapping", () => {
+ const onConfirm = jest.fn();
+ const protocol = "openid-connect";
+
+ render();
+
+ fireEvent.click(screen.getByText("Show"));
+ fireEvent.click(screen.getByLabelText("Select row 0"));
+ fireEvent.click(screen.getByLabelText("Select row 1"));
+ fireEvent.click(screen.getByTestId("modalConfirm"));
+
+ expect(onConfirm).toBeCalledWith([
+ serverInfo.builtinProtocolMappers[protocol][0],
+ serverInfo.builtinProtocolMappers[protocol][1],
+ ]);
+ });
+
+ it("returns selected protocol mapping type on click", () => {
+ const onConfirm = jest.fn();
+ const protocol = "openid-connect";
+
+ render();
+
+ fireEvent.click(screen.getByText("Show"));
+ fireEvent.click(screen.getByLabelText("User Realm Role"));
+
+ expect(onConfirm).toBeCalledWith(
+ serverInfo.protocolMapperTypes[protocol][0]
+ );
+ });
+
+ it("closes the dialog on 'X' click", () => {
+ render( {}} />);
+
+ fireEvent.click(screen.getByText("Show"));
+ expect(screen.getByText("Hide")).toBeInTheDocument();
+
+ fireEvent.click(screen.getByLabelText("Close"));
+ expect(screen.getByText("Show")).toBeInTheDocument();
+ });
+});
diff --git a/src/client-scopes/add/MapperDialog.tsx b/src/client-scopes/add/MapperDialog.tsx
index f7df694467..f3fdb8264e 100644
--- a/src/client-scopes/add/MapperDialog.tsx
+++ b/src/client-scopes/add/MapperDialog.tsx
@@ -81,6 +81,7 @@ export const AddMapperDialog = (props: AddMapperDialogProps) => {
? [