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
This commit is contained in:
Vijetha-Kaja
GitHub
parent
0d3a1f72ea
commit
a51e78467c
|
|
@ -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(
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -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,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
|
@ -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);
|
||||
|
|
|
|||
7571
app/client/cypress/fixtures/modalWidgetTestApp.json
Normal file
7571
app/client/cypress/fixtures/modalWidgetTestApp.json
Normal file
File diff suppressed because it is too large
Load Diff
|
|
@ -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];
|
||||
|
||||
|
|
|
|||
|
|
@ -594,8 +594,8 @@ export class AggregateHelper extends ReusableHelper {
|
|||
cy.get(this.locator._canvasViewport).invoke("width", `${width}px`);
|
||||
}
|
||||
|
||||
public ClickOutside() {
|
||||
cy.get("body").click(0, 0, { force: true });
|
||||
public ClickOutside(x = 0, y = 0, force = true) {
|
||||
cy.get("body").click(x, y, { force: force });
|
||||
}
|
||||
|
||||
public RemoveMultiSelectItems(items: string[]) {
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user