test: Cypress - Modal, Radio widget automation (#27330)

## Description

- Automated Modal and Radio widget test cases mentioned in
https://github.com/appsmithorg/TestSmith/issues/2515
https://github.com/appsmithorg/TestSmith/issues/2514

## Type of change

- Automation

## How Has This Been Tested?
- Cypress test runs

## Checklist:
### QA activity:
- [ ] Test plan has been approved by relevant developers
- [ ] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test

app/client/cypress/e2e/Regression/ClientSide/Widgets/Modal/Modal_Widget_With_Button_spec.ts

@@ -14,7 +14,7 @@ describe("Modal Widget with auto-layout usecases", function () {
     _.entityExplorer.DragDropWidgetNVerify(_.draggableWidgets.INPUT_V2, 10, 20);
     _.entityExplorer.DragDropWidgetNVerify(_.draggableWidgets.BUTTON, 20, 30);
     _.agHelper.AssertElementAbsence(_.locators._modal);
-    _.propPane.CreateModal("Modal1", "onClick");
+    _.propPane.CreateModal("onClick");
     _.agHelper.GetNClick(_.locators._closeModal, 0, true, 0);
     _.agHelper.AssertElementExist(_.locators._widgetInCanvas("inputwidgetv2"));
     _.agHelper.AssertElementExist(

app/client/cypress/e2e/Regression/ClientSide/Widgets/Modal/Modal_spec.ts

@@ -0,0 +1,371 @@
+import {
+  agHelper,
+  assertHelper,
+  deployMode,
+  draggableWidgets,
+  entityExplorer,
+  homePage,
+  locators,
+  propPane,
+  table,
+} from "../../../../../support/Objects/ObjectsCore";
+
+describe("Modal Widget test cases", function () {
+  const image = (src: string) => 'img[src="' + src + '"]';
+  const jpgImg = "https://jpeg.org/images/jpegsystems-home.jpg";
+  const gifImg =
+    "https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/5eeea355389655.59822ff824b72.gif";
+
+  it("1. Modal widget functionality", () => {
+    entityExplorer.DragDropWidgetNVerify(draggableWidgets.BUTTON);
+    entityExplorer.DragDropWidgetNVerify(draggableWidgets.MODAL, 300, 300);
+    entityExplorer.SelectEntityByName("Button1");
+    propPane.EnterJSContext("onClick", "{{showModal('Modal1');}}");
+    deployMode.DeployApp(locators._widgetInDeployed(draggableWidgets.BUTTON));
+    agHelper.Sleep(); //Wait for widgets to settle
+
+    //Verify that the Modal widget opens correctly when configured on a button click.
+    agHelper.ClickButton("Submit");
+    agHelper.AssertElementVisibility(locators._modal);
+
+    //Verify that the Modal widget is closed and no longer visible on the screen on clicking the "X" button.
+    agHelper.AssertElementVisibility(
+      locators._widgetInDeployed(draggableWidgets.ICONBUTTON),
+    );
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.ICONBUTTON));
+    agHelper.AssertElementAbsence(locators._modal);
+
+    //Verify that clicking outside the Modal widget closes it as expected when Quick dismiss is enabled
+    agHelper.ClickButton("Submit");
+    agHelper.AssertElementVisibility(locators._modal);
+    agHelper.ClickOutside(350, 150, false);
+    agHelper.Sleep();
+    agHelper.AssertElementAbsence(locators._modal);
+  });
+
+  it("2. Verify that multiple Modal widgets can be opened simultaneously.", () => {
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("Button1");
+    propPane.ToggleJSMode("onClick", false);
+    propPane.CreateModal("onClick");
+    propPane.CreateModal("onClick");
+    deployMode.DeployApp(locators._widgetInDeployed(draggableWidgets.BUTTON));
+
+    agHelper.ClickButton("Submit");
+    agHelper.AssertElementLength(locators._modal, 3);
+    agHelper.AssertElementVisibility(locators._modal, true, 2);
+    agHelper.GetNClick(
+      locators._widgetInDeployed(draggableWidgets.ICONBUTTON),
+      2,
+    );
+    agHelper.AssertElementVisibility(locators._modal, true, 1);
+    agHelper.GetNClick(
+      locators._widgetInDeployed(draggableWidgets.ICONBUTTON),
+      1,
+    );
+    agHelper.AssertElementVisibility(locators._modal);
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.ICONBUTTON));
+    agHelper.AssertElementAbsence(locators._modal);
+  });
+
+  it("3. Verify that scroll appears when there are multiple widgets in modal", () => {
+    agHelper.ClickButton("Submit");
+    agHelper.AssertProperty(locators._modal, "scrollTop", 0);
+    deployMode.NavigateBacktoEditor();
+    homePage.NavigateToHome();
+
+    //Contains modal with couple of widgets(image, text, select, input, table, container, icon button, json form , list, tab)
+    homePage.ImportApp("modalWidgetTestApp.json");
+    entityExplorer.SelectEntityByName("Modal1", "Widgets");
+
+    //Auto height
+    propPane.AssertPropertiesDropDownValues("Height", ["Auto Height", "Fixed"]);
+    propPane.AssertPropertiesDropDownCurrentValue("Height", "Auto Height");
+
+    deployMode.DeployApp(locators._widgetInDeployed(draggableWidgets.BUTTON));
+
+    agHelper.ClickButton("Submit");
+    agHelper.AssertElementVisibility(locators._modal);
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.IMAGE),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.LIST_V2),
+    );
+    agHelper
+      .GetElement(locators._modal)
+      .invoke("scrollTop")
+      .should("be.greaterThan", 400);
+    agHelper.ScrollTo(locators._modal, "bottom");
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.TABLE),
+    );
+
+    deployMode.NavigateBacktoEditor();
+
+    //Fixed height
+    entityExplorer.SelectEntityByName("Modal1", "Widgets");
+    propPane.SelectPropertiesDropDown("Height", "Fixed");
+    deployMode.DeployApp(locators._widgetInDeployed(draggableWidgets.BUTTON));
+    agHelper.ClickButton("Submit");
+    agHelper.AssertElementVisibility(locators._modal);
+
+    //Verify that a fixed canvas size is visible when height is selected as Fixed
+    agHelper.AssertProperty(locators._modal, "offsetHeight", 1094);
+    agHelper.AssertProperty(locators._modal, "offsetWidth", 456);
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.IMAGE),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.LIST_V2),
+    );
+    agHelper
+      .GetElement(locators._modal)
+      .invoke("scrollTop")
+      .should("be.greaterThan", 400);
+    agHelper.ScrollTo(locators._modal, "bottom");
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.TABLE),
+    );
+  });
+
+  it("4. Verify that multiple widgets within the Modal widget can communicate without errors.", () => {
+    agHelper.ScrollTo(locators._modal, "top");
+
+    //Assert all the widgets in modal are visible
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.INPUT_V2),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.SELECT),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal + " " + locators._widgetInDeployed(draggableWidgets.TEXT),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.IMAGE),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.LIST_V2),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.JSONFORM),
+    );
+
+    //Verify that complex layouts with nested widgets are displayed correctly within the Modal widget.
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.CONTAINER),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.CONTAINER) +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.ICONBUTTON),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.CONTAINER) +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.TAB),
+    );
+    agHelper.AssertElementVisibility(
+      locators._modal +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.CONTAINER) +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.TAB) +
+        " " +
+        locators._widgetInDeployed(draggableWidgets.TABLE),
+    );
+
+    //Input
+    agHelper.TypeText(
+      locators._widgetInDeployed(draggableWidgets.INPUT_V2) + " input",
+      "test",
+    );
+
+    //Validate input widget binding to select dropdown
+    agHelper.SelectDropDown("test1");
+    agHelper.ReadSelectedDropDownValue().then(($selectedValue) => {
+      expect($selectedValue).to.eq("test1");
+    });
+    agHelper.SelectDropDown("test2");
+    agHelper.ReadSelectedDropDownValue().then(($selectedValue) => {
+      expect($selectedValue).to.eq("test2");
+    });
+
+    //Image
+    agHelper.AssertElementExist(image(gifImg));
+
+    //List
+    agHelper.AssertElementExist(image(jpgImg));
+    agHelper.AssertElementLength(image(jpgImg), 3);
+    agHelper.GetNAssertContains(
+      locators._widgetInDeployed(draggableWidgets.TEXT),
+      "Blue",
+    );
+    agHelper.GetNAssertContains(
+      locators._widgetInDeployed(draggableWidgets.TEXT),
+      "Green",
+    );
+    agHelper.GetNAssertContains(
+      locators._widgetInDeployed(draggableWidgets.TEXT),
+      "Red",
+    );
+
+    //JSON Form
+    agHelper.TypeText(locators._jsonFormInputField("name"), "test user");
+    agHelper.TypeText(
+      locators._jsonFormInputField("date_of_birth"),
+      "12/03/1999",
+    );
+    agHelper.TypeText(locators._jsonFormInputField("employee_id"), "1234");
+    agHelper.ClickButton("Submit", 1);
+    agHelper.ValidateToastMessage("Form submitted!");
+
+    //Nested widgets
+    //Icon button
+    agHelper.GetNClick(
+      locators._widgetInDeployed(draggableWidgets.ICONBUTTON),
+      1,
+    );
+    assertHelper
+      .WaitForNetworkCall("@postExecute")
+      .then((interception: any) => {
+        agHelper.Sleep();
+
+        const name = interception.response.body.data.body[0].name;
+        agHelper.ValidateToastMessage("Executed api!");
+
+        //Tab
+        agHelper.GetNClick(propPane._tabId1);
+
+        //Table
+        table.SearchTable(name);
+        table.ReadTableRowColumnData(0, 5, "v2").then(($cellData) => {
+          expect($cellData).to.contain(name);
+        });
+        table.SelectTableRow(0, 0, true, "v2");
+
+        //Text
+        agHelper.ScrollTo(locators._modal, "top");
+        agHelper.AssertContains(
+          name,
+          "be.visible",
+          locators._modal +
+            " " +
+            locators._widgetInDeployed(draggableWidgets.TEXT),
+        );
+      });
+  });
+
+  it("5. Verify that the Modal widget opens correctly when configured on various events for different widget types.", () => {
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.ICONBUTTON));
+    agHelper.AssertElementAbsence(locators._modal);
+
+    //Select - onOptionChanged
+    agHelper.SelectDropDown("Red");
+    agHelper.AssertElementVisibility(locators._modal);
+    agHelper.AssertContains("Option changed!", "be.visible", locators._modal);
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.ICONBUTTON));
+
+    //List - onItemClick
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.LIST_V2));
+    agHelper.AssertContains(
+      "List Item Clicked!",
+      "be.visible",
+      locators._modal,
+    );
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.ICONBUTTON));
+
+    //Table - onSearchTextChanged
+    table.SearchTable("test");
+    agHelper.AssertContains(
+      "Table search value changed!",
+      "be.visible",
+      locators._modal,
+    );
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.ICONBUTTON));
+
+    //JSON Form - onSubmit
+    agHelper.TypeText(locators._jsonFormInputField("name"), "test user");
+    agHelper.TypeText(
+      locators._jsonFormInputField("date_of_birth"),
+      "12/03/1999",
+    );
+    agHelper.TypeText(locators._jsonFormInputField("employee_id"), "1234");
+    agHelper.ClickButton("Submit", 1);
+    agHelper.AssertContains("Form submitted!", "be.visible", locators._modal);
+    agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.ICONBUTTON));
+  });
+
+  it("6. Verify modal widget styles", function () {
+    //JS conversion
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("Modal1", "Widgets");
+    propPane.MoveToTab("Style");
+    propPane.EnterJSContext("Background color", "#fca5a5");
+    propPane.EnterJSContext("Border radius", "1.5rem");
+    agHelper
+      .GetWidgetCSSFrAttribute(locators._modalWrapper, "background")
+      .then((backgroundColor) => {
+        deployMode.DeployApp(
+          locators._widgetInDeployed(draggableWidgets.BUTTON),
+        );
+        agHelper.ClickButton("Submit");
+        agHelper.AssertCSS(
+          locators._modalWrapper,
+          "background",
+          backgroundColor,
+        );
+      });
+    agHelper.AssertCSS(locators._modalWrapper, "border-radius", "24px");
+
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("Modal1", "Widgets");
+    propPane.MoveToTab("Style");
+    //Full color picker
+    propPane.ToggleJSMode("Background color", false);
+    propPane.TogglePropertyState("Full color picker", "On");
+    agHelper.GetNClick(propPane._propertyControlColorPicker("backgroundcolor"));
+    agHelper
+      .GetWidgetCSSFrAttribute(locators._modalWrapper, "background")
+      .then((backgroundColor) => {
+        deployMode.DeployApp(
+          locators._widgetInDeployed(draggableWidgets.BUTTON),
+        );
+        agHelper.ClickButton("Submit");
+        agHelper.AssertCSS(
+          locators._modalWrapper,
+          "background",
+          backgroundColor,
+        );
+      });
+  });
+});

app/client/cypress/e2e/Regression/ClientSide/Widgets/Radio/Radio2_spec.ts

@@ -0,0 +1,412 @@
+import {
+  agHelper,
+  apiPage,
+  dataManager,
+  deployMode,
+  draggableWidgets,
+  entityExplorer,
+  jsEditor,
+  locators,
+  propPane,
+  widgetLocators,
+} from "../../../../../support/Objects/ObjectsCore";
+
+describe("Radio Widget test cases", function () {
+  it("1. Validate radio widget bindings", () => {
+    //JS Object
+    jsEditor.CreateJSObject(
+      `export default {
+      myFun1 () {
+        const myVar1= [{
+          label:'test',
+          value:'test'}]
+        return myVar1
+      }
+    }`,
+      {
+        paste: true,
+        completeReplace: true,
+        toRun: false,
+        shouldCreateNewJSObj: true,
+      },
+    );
+    entityExplorer.DragDropWidgetNVerify(draggableWidgets.RADIO_GROUP);
+    propPane.EnterJSContext("Options", "{{JSObject1.myFun1()}}");
+
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.AssertExistingCheckedState(
+      locators._checkboxTypeByOption("test"),
+      "false",
+    );
+    deployMode.NavigateBacktoEditor();
+
+    //API
+    apiPage.CreateAndFillApi(
+      dataManager.dsValues[dataManager.defaultEnviorment].mockApiUrl,
+    );
+    apiPage.RunAPI();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext(
+      "Options",
+      `{{Api1.data.map((s)=>{
+         return {label: s.name,
+         value: s.name}
+        })}}`,
+    );
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.GetElement("@postExecute").then((interception: any) => {
+      agHelper.Sleep();
+      const name = interception.response.body.data.body[0].name;
+      agHelper.AssertExistingCheckedState(
+        locators._checkboxTypeByOption(name),
+        "false",
+      );
+    });
+    agHelper.AssertElementLength(widgetLocators.radioBtn, 10);
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+
+    //Array
+    propPane.EnterJSContext(
+      "Options",
+      `[{
+        "label": "Blue",
+        "value": "BLUE"
+      },
+      {
+        "label": "Green",
+        "value": "GREEN"
+      }]`,
+    );
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.AssertExistingCheckedState(
+      locators._checkboxTypeByOption("Blue"),
+      "false",
+    );
+    agHelper.AssertExistingCheckedState(
+      locators._checkboxTypeByOption("Green"),
+      "false",
+    );
+  });
+
+  it("2. Validate validation errors evaluated value poup", () => {
+    //String
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext("Options", "test");
+    agHelper.VerifyEvaluatedErrorMessage(
+      `This value does not evaluate to type Array<{ "label": "string", "value": "string" | number }>`,
+    );
+
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.GetNAssertContains(
+      widgetLocators.radioWidgetContainer,
+      "test",
+      "not.exist",
+    );
+
+    //Non array
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext("Options", `[{name:1,class:10}]`);
+    agHelper.VerifyEvaluatedErrorMessage(
+      `This value does not evaluate to type Array<{ "label": "string", "value": "string" | number }>`,
+    );
+
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.GetNAssertContains(
+      widgetLocators.radioWidgetContainer,
+      "10",
+      "not.exist",
+    );
+
+    //Non array api data
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext(
+      "Options",
+      `{{Api1.data.map((s)=>{
+      return value: s.name
+     }})}`,
+    );
+    agHelper.VerifyEvaluatedErrorMessage(
+      `This value does not evaluate to type Array<{ "label": "string", "value": "string" | number }>`,
+    );
+
+    //Non array JS data
+    jsEditor.CreateJSObject(
+      `export default {
+      myFun1 () {
+        const myVar1= {
+          label:'test',
+          value:'test'}
+        return myVar1
+      }
+    }`,
+      {
+        paste: true,
+        completeReplace: true,
+        toRun: false,
+        shouldCreateNewJSObj: true,
+      },
+    );
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext("Options", `"{{JSObject2.myFun1()}}"`);
+    agHelper.VerifyEvaluatedErrorMessage(
+      `This value does not evaluate to type Array<{ "label": "string", "value": "string" | number }>`,
+    );
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.GetNAssertContains(
+      widgetLocators.radioWidgetContainer,
+      "test",
+      "not.exist",
+    );
+  });
+
+  it("3. Verify default selected value property", () => {
+    //String
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext(
+      "Options",
+      `[{
+      "label": "Blue",
+      "value": "BLUE"
+    },
+    {
+      "label": "Green",
+      "value": "GREEN"
+    }]`,
+    );
+    propPane.UpdatePropertyFieldValue("Default selected value", "red");
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.AssertExistingCheckedState(
+      locators._checkboxTypeByOption("Blue"),
+      "false",
+    );
+    agHelper.AssertExistingCheckedState(
+      locators._checkboxTypeByOption("Green"),
+      "false",
+    );
+
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext("Options", "{{JSObject1.myFun1()}}");
+    propPane.UpdatePropertyFieldValue(
+      "Default selected value",
+      "{{JSObject1.myFun1()[0]}}",
+    );
+    agHelper.VerifyEvaluatedErrorMessage(
+      "This value does not evaluate to type: string or number",
+    );
+
+    propPane.UpdatePropertyFieldValue(
+      "Default selected value",
+      "{{JSObject1.myFun1()[0].label}}",
+    );
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.AssertExistingCheckedState(locators._checkboxTypeByOption("test"));
+  });
+
+  it("4. Validate Label properties - Text , Position , Alignment , Width(in columns)", function () {
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    //Text
+    propPane.TypeTextIntoField("Text", "Select Value");
+
+    //Position
+    agHelper.AssertAttribute(
+      locators._position("Top"),
+      "data-selected",
+      "true",
+    );
+    agHelper.AssertCSS(widgetLocators.radioWidgetLabel, "margin-bottom", "5px");
+    agHelper.AssertCSS(widgetLocators.radioWidgetLabel, "margin-right", "0px");
+    agHelper.GetNClick(locators._position("Left"));
+
+    //Alignment
+    agHelper.AssertAttribute(
+      locators._alignment("left"),
+      "data-selected",
+      "true",
+    );
+    agHelper.GetNClick(locators._alignment("right"));
+
+    //Width
+    agHelper.AssertCSS(
+      widgetLocators.radioWidgetLabelContainer,
+      "width",
+      "59.765625px",
+    );
+    agHelper.GetNClick(widgetLocators.selectWidgetWidthPlusBtn);
+    agHelper.GetNClick(widgetLocators.selectWidgetWidthPlusBtn);
+
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.AssertCSS(widgetLocators.radioWidgetLabel, "margin-bottom", "0px");
+    agHelper.AssertCSS(widgetLocators.radioWidgetLabel, "margin-right", "5px");
+    agHelper.AssertCSS(widgetLocators.radioWidgetLabel, "text-align", "right");
+    agHelper.AssertCSS(
+      widgetLocators.radioWidgetLabelContainer,
+      "width",
+      "151.265625px",
+    );
+    agHelper.AssertText(
+      widgetLocators.radioWidgetLabel,
+      "text",
+      "Select Value",
+    );
+  });
+
+  it("5. Validate general section in radio group", function () {
+    deployMode.NavigateBacktoEditor();
+
+    //Tooltip
+    entityExplorer.DragNDropWidget(draggableWidgets.TEXT, 300, 300);
+    propPane.UpdatePropertyFieldValue("Text", "Tooltip text");
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext(
+      "Options",
+      `{{Api1.data.map((s)=>{
+         return {label: s.name,
+         value: s.name}
+        })}}`,
+    );
+    propPane.UpdatePropertyFieldValue("Tooltip", "{{Text1.text}}");
+    agHelper.AssertExistingToggleState("Disabled", "false");
+    agHelper.AssertExistingToggleState("Inline", "true");
+    agHelper.AssertExistingToggleState("Visible", "true");
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+    agHelper.HoverElement(locators._tooltipIcon);
+    agHelper.AssertPopoverTooltip("Tooltip text");
+    agHelper.AssertElementEnabledDisabled(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+      0,
+      false,
+    );
+    agHelper
+      .GetWidgetCSSHeight(
+        locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+      )
+      .then((currentHeight) => {
+        const updatedHeight = parseInt(currentHeight?.split("px")[0]);
+        expect(updatedHeight).to.be.greaterThan(130);
+      });
+
+    agHelper.GetWidth(locators._widgetInDeployed(draggableWidgets.RADIO_GROUP));
+    agHelper.GetElement("@eleWidth").then((currentWidth) => {
+      expect(currentWidth).to.be.greaterThan(420);
+    });
+    //Disable - should throw error for non boolean values
+    deployMode.NavigateBacktoEditor();
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext("Disabled", "test", true, true);
+    agHelper.VerifyEvaluatedErrorMessage(
+      `This value does not evaluate to type boolean`,
+    );
+    propPane.EnterJSContext("Disabled", "{{!!(Text1.text)}}", true, true);
+
+    //Inline - should throw error for non boolean values
+    propPane.EnterJSContext("Inline", "test", true, true);
+    agHelper.VerifyEvaluatedErrorMessage(
+      `This value does not evaluate to type boolean`,
+    );
+    propPane.EnterJSContext("Inline", "{{Text1.text}}", true, true);
+
+    //Visible - should throw error for non boolean values
+    propPane.EnterJSContext("Visible", "test", true, true);
+    agHelper.VerifyEvaluatedErrorMessage(
+      `This value does not evaluate to type boolean`,
+    );
+    propPane.EnterJSContext("Visible", "{{!!(Text1.text)}}", true, true);
+
+    entityExplorer.SelectEntityByName("Text1", "Widgets");
+    propPane.UpdatePropertyFieldValue("Text", "false");
+    deployMode.DeployApp(locators._widgetInDeployed(draggableWidgets.TEXT));
+    agHelper.AssertElementEnabledDisabled(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+      0,
+      true,
+    );
+    agHelper
+      .GetWidgetCSSHeight(
+        locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+      )
+      .then((currentHeight) => {
+        const updatedHeight = parseInt(currentHeight?.split("px")[0]);
+        expect(updatedHeight).to.be.greaterThan(270);
+      });
+
+    agHelper.GetWidth(locators._widgetInDeployed(draggableWidgets.RADIO_GROUP));
+    agHelper.GetElement("@eleWidth").then((currentWidth) => {
+      expect(currentWidth).to.be.greaterThan(420);
+    });
+  });
+
+  it("6. Validate set property methods for Radio group", () => {
+    deployMode.NavigateBacktoEditor();
+    //JS Object
+    jsEditor.CreateJSObject(
+      `export default {
+        myVar1: [{
+          label:'test',
+          value:'test'}],
+        myFun1 () { 
+          RadioGroup1.setData(this.myVar1);
+          RadioGroup1.isVisible? RadioGroup1.setDisabled(true):RadioGroup1.setVisibility(false)
+        }
+      }`,
+      {
+        paste: true,
+        completeReplace: true,
+        toRun: false,
+        shouldCreateNewJSObj: true,
+      },
+    );
+    entityExplorer.SelectEntityByName("RadioGroup1", "Widgets");
+    propPane.EnterJSContext("Disabled", "false", true, true);
+    propPane.EnterJSContext("onSelectionChange", "{{JSObject3.myFun1();}}");
+
+    deployMode.DeployApp(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+    );
+
+    agHelper.GetElement("@postExecute").then((interception: any) => {
+      agHelper.Sleep();
+      const name = interception.response.body.data.body[0].name;
+      agHelper.AssertExistingCheckedState(
+        locators._checkboxTypeByOption(name),
+        "false",
+      );
+    });
+    agHelper.GetNClick(widgetLocators.radioBtn, 1);
+    agHelper.AssertExistingCheckedState(
+      locators._checkboxTypeByOption("test"),
+      "false",
+    );
+    agHelper.AssertElementEnabledDisabled(
+      locators._widgetInDeployed(draggableWidgets.RADIO_GROUP),
+      0,
+      true,
+    );
+  });
+});

app/client/cypress/e2e/Regression/ClientSide/Widgets/Rating/Rating_Widget_spec.ts

@@ -137,7 +137,7 @@ describe("Rating widet testcases", () => {
     deployMode.NavigateBacktoEditor();
     agHelper.GetNClick(RATING_WIDGET.ratingwidget);
     // open a modal on clicking ratings
-    propPane.CreateModal("Thanks for rating us!", "onChange");
+    propPane.CreateModal("onChange");
     // deploy app and click on stars and close the modal
     deployMode.DeployApp();
     agHelper.GetNClick(RATING_WIDGET.star_icon, 5, true, 0);

app/client/cypress/locators/WidgetLocators.ts

@@ -102,6 +102,11 @@ export const WIDGETSKIT = {
     "//*[contains(@class, 'bp3-icon-chevron-up')]//parent::button",
   inputWidgetStepDown:
     "//*[contains(@class, 'bp3-icon-chevron-down')]//parent::button",
+  radioWidgetContainer: "[data-testid='radiogroup-container']",
+  radioBtn: ".bp3-radio",
+  radioWidgetLabel: ".radiogroup-label",
+  radioWidgetLabelContainer:
+    "[data-testid='radiogroup-container'] .label-container",
 };
 type ValueOf<T> = T[keyof T];
 

app/client/cypress/support/Pages/AggregateHelper.ts

@@ -594,8 +594,8 @@ export class AggregateHelper extends ReusableHelper {
     cy.get(this.locator._canvasViewport).invoke("width", `${width}px`);
   }
 
-  public ClickOutside() {
+  public ClickOutside(x = 0, y = 0, force = true) {
-    cy.get("body").click(0, 0, { force: true });
+    cy.get("body").click(x, y, { force: force });
   }
 
   public RemoveMultiSelectItems(items: string[]) {

app/client/cypress/support/Pages/PropertyPane.ts

@@ -599,7 +599,7 @@ export class PropertyPane {
     this.assertHelper.AssertNetworkStatus("@updateWidgetName");
   }
 
-  public CreateModal(modalName: string, property: string) {
+  public CreateModal(property: string) {
     this.SelectPlatformFunction(property, "Show modal");
     this.agHelper.GetNClick(this._actionOpenDropdownSelectModal);
     this.agHelper.GetNClick(this._createModalButton);