diff --git a/apps/admin-ui/cypress/component/KeyValueInput.cy.tsx b/apps/admin-ui/cypress/component/KeyValueInput.cy.tsx new file mode 100644 index 0000000000..c8af2f1c24 --- /dev/null +++ b/apps/admin-ui/cypress/component/KeyValueInput.cy.tsx @@ -0,0 +1,125 @@ +import { + ActionGroup, + Button, + Form, + Page, + PageSection, +} from "@patternfly/react-core"; +import { mount } from "cypress/react"; +import { useEffect } from "react"; +import { FormProvider, useForm } from "react-hook-form"; +import { KeyValueType } from "../../src/components/key-value-form/key-value-convert"; +import { KeyValueInput } from "../../src/components/key-value-form/KeyValueInput"; + +type KeyValueInputTestProps = { + submit: (values: any) => void; + defaultValues?: KeyValueType[]; +}; + +const KeyValueInputTest = ({ + submit, + defaultValues, +}: KeyValueInputTestProps) => { + const form = useForm(); + + useEffect(() => { + form.setValue("name", defaultValues || ""); + }, [form.setValue]); + + return ( + + + +
+ + + + + +
+
+
+ ); +}; + +describe("KeyValueInput", () => { + it("basic interaction", () => { + const submit = cy.spy().as("onSubmit"); + mount(); + + cy.get("input").should("exist"); + cy.findAllByTestId("name-add-row").should("exist").should("be.disabled"); + + cy.findAllByTestId("name[0].key").type("key"); + cy.findAllByTestId("name[0].value").type("value"); + + cy.findAllByTestId("name-add-row").should("be.enabled"); + cy.findAllByTestId("save").click(); + cy.get("@onSubmit").should("have.been.calledWith", { + name: [{ key: "key", value: "value" }], + }); + }); + + it("from existing values", () => { + const submit = cy.spy().as("onSubmit"); + mount( + + ); + + cy.findAllByTestId("name[0].key").should("have.value", "key1"); + cy.findAllByTestId("name[0].value").should("have.value", "value1"); + + cy.findAllByTestId("name-add-row").should("be.enabled").click(); + + cy.findAllByTestId("name[1].key").type("key2"); + cy.findAllByTestId("name[1].value").type("value2"); + cy.findAllByTestId("save").click(); + cy.get("@onSubmit").should("have.been.calledWith", { + name: [ + { key: "key1", value: "value1" }, + { key: "key2", value: "value2" }, + ], + }); + }); + + it("leaving it empty", () => { + const submit = cy.spy().as("onSubmit"); + mount(); + + cy.get("input").should("exist"); + cy.findAllByTestId("save").click(); + cy.get("@onSubmit").should("have.been.calledWith", { + name: [{ key: "", value: "" }], + }); + }); + + it("deleting values", () => { + const submit = cy.spy().as("onSubmit"); + mount( + + ); + + cy.findAllByTestId("name[2].remove").click(); + cy.findAllByTestId("name[1].remove").click(); + cy.findAllByTestId("save").click(); + cy.get("@onSubmit").should("have.been.calledWith", { + name: [ + { key: "key1", value: "value1" }, + { key: "key4", value: "value4" }, + ], + }); + }); +}); diff --git a/apps/admin-ui/cypress/e2e/client_authorization_test.spec.ts b/apps/admin-ui/cypress/e2e/client_authorization_test.spec.ts index b5d5eedade..49af92dc64 100644 --- a/apps/admin-ui/cypress/e2e/client_authorization_test.spec.ts +++ b/apps/admin-ui/cypress/e2e/client_authorization_test.spec.ts @@ -9,6 +9,7 @@ import ModalUtils from "../support/util/ModalUtils"; import ClientDetailsPage from "../support/pages/admin-ui/manage/clients/client_details/ClientDetailsPage"; import PoliciesTab from "../support/pages/admin-ui/manage/clients/client_details/tabs/authorization_subtabs/PoliciesTab"; import PermissionsTab from "../support/pages/admin-ui/manage/clients/client_details/tabs/authorization_subtabs/PermissionsTab"; +import CreateResourcePage from "../support/pages/admin-ui/manage/clients/client_details/CreateResourcePage"; describe("Client authentication subtab", () => { const loginPage = new LoginPage(); @@ -68,6 +69,22 @@ describe("Client authentication subtab", () => { authenticationTab.formUtils().cancel(); }); + it("Edit a resource", () => { + authenticationTab.goToResourcesSubTab(); + listingPage.goToItemDetails("Resource"); + + new CreateResourcePage() + .fillResourceForm({ + displayName: "updated", + }) + .formUtils() + .save(); + + masthead.checkNotificationMessage("Resource successfully updated"); + sidebarPage.waitForPageLoad(); + authenticationTab.formUtils().cancel(); + }); + it("Should create a scope", () => { authenticationTab .goToScopesSubTab() diff --git a/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx b/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx index f05c7dec6c..1f66967ee6 100644 --- a/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx +++ b/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx @@ -49,7 +49,7 @@ export const AdvancedSettings = ({ [] ); - const { control, register } = useFormContext(); + const { control } = useFormContext(); return ( , G = T>( result[key] = keyValueToArray(value as KeyValueType[]); } else if (key === "config" || key === "attributes") { result[key] = Object.fromEntries( - Object.entries(value as Record).map(([k, v]) => [ - debeerify(k), - v, - ]) + Object.entries( + (value as Record | undefined) || {} + ).map(([k, v]) => [debeerify(k), v]) ); } else { result[key] = value;