chore: improve ListV2 cypress scripts (#20905)
## Description Improve Listv2 tests Fixes # (issue) https://theappsmith.slack.com/archives/C02JV8G1MP0/p1676925949886009 ## Type of change > Please delete options that are not relevant. - Bug fix (non-breaking change which fixes an issue) ## How Has This Been Tested? - Cypress ## Checklist: ### Dev activity - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my own code - [x] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [x] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag ### 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 --------- Co-authored-by: ashit-rath <ashit@appsmith.com> Co-authored-by: Favour Ohanekwu <fohanekwu@gmail.com>
This commit is contained in:
Tolulope Adetula
GitHub
parent
a056f715e4
commit
7dc9056834
|
|
@ -173,10 +173,11 @@ describe("List widget V2 page number and page size", () => {
|
|||
|
||||
// Choose the first data source which consists of users keyword & Click on the "New Query +"" button
|
||||
cy.get(`${datasource.datasourceCard}`)
|
||||
.contains("Users")
|
||||
.get(`${datasource.createQuery}`)
|
||||
.last()
|
||||
.click({ force: true });
|
||||
.filter(":contains('Users')")
|
||||
.first()
|
||||
.within(() => {
|
||||
cy.get(`${datasource.createQuery}`).click({ force: true });
|
||||
});
|
||||
|
||||
// Click the editing field
|
||||
cy.get(".t--action-name-edit-field").click({ force: true });
|
||||
|
|
|
|||
|
|
@ -7,6 +7,9 @@ const commonlocators = require("../../../../../locators/commonlocators.json");
|
|||
import { ObjectsRegistry } from "../../../../../support/Objects/Registry";
|
||||
let agHelper = ObjectsRegistry.AggregateHelper;
|
||||
|
||||
const widgetSelector = (name) => `[data-widgetname-cy="${name}"]`;
|
||||
const containerWidgetSelector = `[type="CONTAINER_WIDGET"]`;
|
||||
|
||||
function dragAndDropToWidget(widgetType, destinationWidget, { x, y }) {
|
||||
const selector = `.t--widget-card-draggable-${widgetType}`;
|
||||
cy.wait(800);
|
||||
|
|
@ -23,6 +26,20 @@ function dragAndDropToWidget(widgetType, destinationWidget, { x, y }) {
|
|||
.trigger("mouseup", x, y, { eventConstructor: "MouseEvent" });
|
||||
}
|
||||
|
||||
function deleteAllWidgetsInContainer() {
|
||||
const modifierKey = Cypress.platform === "darwin" ? "meta" : "ctrl";
|
||||
|
||||
cy.get(`${widgetSelector("List1")} ${containerWidgetSelector}`)
|
||||
.first()
|
||||
.click({
|
||||
force: true,
|
||||
});
|
||||
cy.get("body").type(`{${modifierKey}}{a}`);
|
||||
cy.get("body").type("{del}");
|
||||
|
||||
cy.wait(200);
|
||||
}
|
||||
|
||||
function checkSelectedRadioValue(selector, value) {
|
||||
/**
|
||||
* This function checks if the radio button is checked.
|
||||
|
|
@ -33,20 +50,20 @@ function checkSelectedRadioValue(selector, value) {
|
|||
}
|
||||
|
||||
describe("List widget v2 - Basic Child Widget Interaction", () => {
|
||||
beforeEach(() => {
|
||||
agHelper.RestoreLocalStorageCache();
|
||||
before(() => {
|
||||
cy.addDsl(emptyListDSL);
|
||||
agHelper.RestoreLocalStorageCache();
|
||||
cy.get(publishLocators.containerWidget).should("have.length", 3);
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
after(() => {
|
||||
agHelper.SaveLocalStorageCache();
|
||||
});
|
||||
|
||||
it("1. Input widget", () => {
|
||||
it("1. Child widgets", () => {
|
||||
// Drop Input widget
|
||||
dragAndDropToWidget("inputwidgetv2", "containerwidget", {
|
||||
x: 50,
|
||||
x: 250,
|
||||
y: 50,
|
||||
});
|
||||
|
||||
|
|
@ -62,12 +79,12 @@ describe("List widget v2 - Basic Child Widget Interaction", () => {
|
|||
cy.get(publishLocators.inputWidget)
|
||||
.find("input")
|
||||
.should("have.value", "abcd");
|
||||
});
|
||||
|
||||
it("2. Select widget", () => {
|
||||
deleteAllWidgetsInContainer();
|
||||
|
||||
// Drop Select widget
|
||||
dragAndDropToWidget("selectwidget", "containerwidget", {
|
||||
x: 50,
|
||||
x: 250,
|
||||
y: 50,
|
||||
});
|
||||
|
||||
|
|
@ -89,12 +106,12 @@ describe("List widget v2 - Basic Child Widget Interaction", () => {
|
|||
// Assert if the select widget has Red as the selected value
|
||||
cy.get(publishLocators.selectwidget).contains("Red");
|
||||
cy.get(publishPage.backToEditor).click({ force: true });
|
||||
});
|
||||
|
||||
it("3. Checkbox group widget", () => {
|
||||
// Drop Select widget
|
||||
deleteAllWidgetsInContainer();
|
||||
|
||||
// Drop Checkbox widget
|
||||
dragAndDropToWidget("checkboxgroupwidget", "containerwidget", {
|
||||
x: 50,
|
||||
x: 250,
|
||||
y: 50,
|
||||
});
|
||||
|
||||
|
|
@ -103,7 +120,7 @@ describe("List widget v2 - Basic Child Widget Interaction", () => {
|
|||
|
||||
cy.PublishtheApp();
|
||||
|
||||
cy.wait(1000);
|
||||
cy.wait(3000);
|
||||
|
||||
// select green
|
||||
cy.get(publishLocators.checkboxGroupWidget)
|
||||
|
|
@ -125,12 +142,11 @@ describe("List widget v2 - Basic Child Widget Interaction", () => {
|
|||
.siblings("input")
|
||||
.should("be.checked");
|
||||
cy.get(publishPage.backToEditor).click({ force: true });
|
||||
});
|
||||
deleteAllWidgetsInContainer();
|
||||
|
||||
it("4. Switch widget", () => {
|
||||
// Drop Select widget
|
||||
// Drop Switch widget
|
||||
dragAndDropToWidget("switchwidget", "containerwidget", {
|
||||
x: 50,
|
||||
x: 250,
|
||||
y: 50,
|
||||
});
|
||||
|
||||
|
|
@ -156,12 +172,11 @@ describe("List widget v2 - Basic Child Widget Interaction", () => {
|
|||
.first()
|
||||
.should("not.be.checked");
|
||||
cy.get(publishPage.backToEditor).click({ force: true });
|
||||
});
|
||||
deleteAllWidgetsInContainer();
|
||||
|
||||
it("5. Radio group widget", () => {
|
||||
// Drop Select widget
|
||||
// Drop Radio widget
|
||||
dragAndDropToWidget("radiogroupwidget", "containerwidget", {
|
||||
x: 50,
|
||||
x: 250,
|
||||
y: 50,
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ function changeValueOfWidget(widgetType, value, index) {
|
|||
cy.SelectDropDown(value);
|
||||
break;
|
||||
case "multiselectwidgetv2":
|
||||
cy.RemoveMultiSelectItems(["Green", "Red"]);
|
||||
cy.RemoveAllSelections();
|
||||
cy.SelectFromMultiSelect(value);
|
||||
break;
|
||||
case "inputwidgetv2":
|
||||
|
|
@ -80,6 +80,7 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
);
|
||||
//FirstPage
|
||||
// First Row
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
changeValueOfWidget("selectwidget", "Green", 0);
|
||||
changeValueOfWidget("inputwidgetv2", "First", 0);
|
||||
changeValueOfWidget("multiselectwidgetv2", ["Green"], 0);
|
||||
|
|
@ -102,6 +103,7 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
|
||||
// SecondPage
|
||||
// First Row
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
changeValueOfWidget("selectwidget", "Blue", 0);
|
||||
changeValueOfWidget("inputwidgetv2", "Fourth", 0);
|
||||
changeValueOfWidget("multiselectwidgetv2", ["Blue"], 0);
|
||||
|
|
@ -124,6 +126,8 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
|
||||
//Validate values in FirstPage
|
||||
// First Row
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
|
||||
verifyValueOfWidget("selectwidget", "Green", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "First", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Green"], 0);
|
||||
|
|
@ -146,6 +150,8 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
|
||||
//Validate values in SecondPage
|
||||
// First Row
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
|
||||
verifyValueOfWidget("selectwidget", "Blue", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "Fourth", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Blue"], 0);
|
||||
|
|
@ -214,6 +220,8 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
|
||||
//Validate values in FirstPage
|
||||
// First Row
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
|
||||
verifyValueOfWidget("selectwidget", "Green", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "First", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Green"], 0);
|
||||
|
|
@ -236,6 +244,8 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
|
||||
//Validate values in SecondPage
|
||||
// First Row
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
|
||||
verifyValueOfWidget("selectwidget", "Blue", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "Fourth", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Blue"], 0);
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ function changeValueOfWidget(widgetType, value, index) {
|
|||
cy.SelectDropDown(value);
|
||||
break;
|
||||
case "multiselectwidgetv2":
|
||||
cy.RemoveMultiSelectItems(["Green", "Red"]);
|
||||
cy.RemoveAllSelections();
|
||||
cy.SelectFromMultiSelect(value);
|
||||
break;
|
||||
case "inputwidgetv2":
|
||||
|
|
@ -198,6 +198,7 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
//Validate values in FirstPage
|
||||
// First Row
|
||||
cy.wait(10000);
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
verifyValueOfWidget("selectwidget", "Green", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "First", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Green"], 0);
|
||||
|
|
@ -220,6 +221,7 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
//Validate values in SecondPage
|
||||
// First Row
|
||||
cy.wait(10000);
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
verifyValueOfWidget("selectwidget", "Blue", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "Fourth", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Blue"], 0);
|
||||
|
|
@ -287,6 +289,7 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
//Validate values in FirstPage
|
||||
// First Row
|
||||
cy.wait(10000);
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
verifyValueOfWidget("selectwidget", "Green", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "First", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Green"], 0);
|
||||
|
|
@ -309,6 +312,7 @@ describe("List widget v2 - meta hydration tests", () => {
|
|||
//Validate values in SecondPage
|
||||
// First Row
|
||||
cy.wait(10000);
|
||||
cy.get(`${widgetSelector("List1")}`).scrollIntoView();
|
||||
verifyValueOfWidget("selectwidget", "Blue", 0);
|
||||
verifyValueOfWidget("inputwidgetv2", "Fourth", 0);
|
||||
verifyValueOfWidget("multiselectwidgetv2", ["Blue"], 0);
|
||||
|
|
|
|||
|
|
@ -2075,6 +2075,14 @@ Cypress.Commands.add("RemoveMultiSelectItems", (dropdownOptions) => {
|
|||
});
|
||||
});
|
||||
|
||||
Cypress.Commands.add("RemoveAllSelections", () => {
|
||||
cy.get(`.rc-select-selection-overflow-item .remove-icon`).each(($each) => {
|
||||
cy.wrap($each)
|
||||
.click({ force: true })
|
||||
.wait(1000);
|
||||
});
|
||||
});
|
||||
|
||||
Cypress.Commands.add("SelectFromMultiSelect", (options) => {
|
||||
const option = (value) =>
|
||||
`.rc-select-item-option[title=${value}] input[type='checkbox']`;
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user