test(react): add tests for onclick prop of additional field

add tests for adding a callback to the onclick event of a component in the additional field slot test #2514
mi6 · Nov 25, 2024 · 4c3e3c6 · 4c3e3c6
1 parent 7663b13
commit 4c3e3c6
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 0 deletions.
diff --git a/packages/react/src/component-tests/IcRadio/IcRadio.cy.tsx b/packages/react/src/component-tests/IcRadio/IcRadio.cy.tsx
@@ -206,6 +206,17 @@ describe("IcRadio end-to-end tests", () => {
     cy.get(TEXT_FIELD_SELECTOR).eq(2).should("be.visible");
   });
 
+  it("should call onclick function of component in additional-field slot when slotted component is clicked", () => {
+    mount(<ConditionalDynamic />);
+    cy.get(RADIO_SELECTOR).eq(0).find(".container").click();
+    cy.get(TEXT_FIELD_SELECTOR).eq(0).click();
+    cy.spy(window.console, "log").as("spyWinConsoleLog");
+    cy.get("@spyWinConsoleLog").should(
+      HAVE_BEEN_CALLED_WITH,
+      "Textfield clicked"
+    );
+  });
+
   it("should emit icChange and icCheck events when radio option is selected", () => {
     mount(<Default />);
 

diff --git a/packages/react/src/component-tests/IcRadio/IcRadioTestData.tsx b/packages/react/src/component-tests/IcRadio/IcRadioTestData.tsx
@@ -313,6 +313,9 @@ export const ConditionalStatic = () => {
 };
 
 export const ConditionalDynamic = () => {
+  const handleTextfieldClicked = () => {
+    console.log("Textfield clicked");
+  };
   return (
     <div style={{ padding: "10px" }}>
       <IcRadioGroup
@@ -329,6 +332,7 @@ export const ConditionalDynamic = () => {
             slot="additional-field"
             placeholder="Placeholder"
             label="What's your favourite type of coffee?"
+            onClick={handleTextfieldClicked}
           />
         </IcRadioOption>
         <IcRadioOption