diff --git a/app/client/cypress/e2e/Regression/ClientSide/MobileResponsiveTests/ResizingSpec.ts b/app/client/cypress/e2e/Regression/ClientSide/MobileResponsiveTests/ResizingSpec.ts new file mode 100644 index 0000000000..cd95660b51 --- /dev/null +++ b/app/client/cypress/e2e/Regression/ClientSide/MobileResponsiveTests/ResizingSpec.ts @@ -0,0 +1,124 @@ +import * as commonlocators from "../../../../locators/commonlocators.json"; +import { ObjectsRegistry } from "../../../../support/Objects/Registry"; +import * as _ from "../../../../support/Objects/ObjectsCore"; + +const { AggregateHelper: agHelper, EntityExplorer: ee } = ObjectsRegistry; + +describe("Resizing Behaviour in Auto Layout", function () { + before(() => { + cy.get(commonlocators.autoConvert).click({ + force: true, + }); + cy.get(commonlocators.convert).click({ + force: true, + }); + cy.get(commonlocators.refreshApp).click({ + force: true, + }); + }); + beforeEach(() => { + const isMac = Cypress.platform === "darwin"; + cy.get(".appsmith_widget_0").type(isMac ? "{meta}A" : "{ctrl}A"); + agHelper.PressDelete(); + }); + it("1. Resizing Handles for center aligned free resizing widgets - image widget", function () { + cy.get("#canvas-viewport").then((canvas) => { + const mainCanvasWidth = canvas.width() || 0; + ee.DragDropWidgetNVerify("imagewidget", mainCanvasWidth / 2, 600); + Object.values(_.locators._resizeHandles).forEach((eachHandle) => { + cy.get(`[data-testid='${eachHandle}']`) + .first() + .should("not.have.css", "cursor", "undefined") + .should("not.have.css", "cursor", "grab"); + }); + }); + }); + it("2. Resizing Handles for center aligned non-resizing widgets - button widget", () => { + cy.get("#canvas-viewport").then((canvas) => { + const mainCanvasWidth = canvas.width() || 0; + ee.DragDropWidgetNVerify("buttonwidget", mainCanvasWidth / 2, 600); + Object.values(_.locators._resizeHandles).forEach((eachHandle) => { + cy.get(`[data-testid='${eachHandle}']`) + .first() + .should("have.css", "cursor", "grab"); + }); + }); + }); + it("3. Resizing Handles for center aligned height resiziable widgets - table widget", () => { + cy.get("#canvas-viewport").then((canvas) => { + const mainCanvasWidth = canvas.width() || 0; + ee.DragDropWidgetNVerify("tablewidgetv2", mainCanvasWidth / 2, 600); + cy.get(`[data-testid='t--resizable-handle-BOTTOM']`) + .first() + .should("not.have.css", "cursor", "undefined") + .should("not.have.css", "cursor", "grab"); + }); + }); + it("4. Resizing Handles for end aligned free resizing widgets - image widget", function () { + cy.get("#canvas-viewport").then((canvas) => { + const mainCanvasWidth = canvas.width() || 0; + ee.DragDropWidgetNVerify("imagewidget", mainCanvasWidth * 0.8, 600); + [ + _.locators._resizeHandles.left, + _.locators._resizeHandles.bottom, + _.locators._resizeHandles.bottomLeft, + _.locators._resizeHandles.bottomRight, + ].forEach((eachHandle) => { + cy.get(`[data-testid='${eachHandle}']`) + .first() + .should("not.have.css", "cursor", "undefined") + .should("not.have.css", "cursor", "grab"); + }); + }); + }); + it("5. Resizing Handles for end aligned non-resizing widgets - button widget", () => { + cy.get("#canvas-viewport").then((canvas) => { + const mainCanvasWidth = canvas.width() || 0; + ee.DragDropWidgetNVerify("buttonwidget", mainCanvasWidth * 0.8, 600); + [ + _.locators._resizeHandles.left, + _.locators._resizeHandles.bottom, + _.locators._resizeHandles.bottomLeft, + _.locators._resizeHandles.bottomRight, + ].forEach((eachHandle) => { + cy.get(`[data-testid='${eachHandle}']`) + .first() + .should("have.css", "cursor", "grab"); + }); + }); + }); + + it("6. Resizing Handles for start aligned free resizing widgets - image widget", function () { + cy.get("#canvas-viewport").then((canvas) => { + const mainCanvasWidth = canvas.width() || 0; + ee.DragDropWidgetNVerify("imagewidget", mainCanvasWidth * 0.1, 600); + [ + _.locators._resizeHandles.right, + _.locators._resizeHandles.bottom, + _.locators._resizeHandles.bottomLeft, + _.locators._resizeHandles.bottomRight, + ].forEach((eachHandle) => { + cy.get(`[data-testid='${eachHandle}']`) + .first() + .should("not.have.css", "cursor", "undefined") + .should("not.have.css", "cursor", "grab"); + }); + }); + }); + it("7. Resizing Handles for start aligned non-resizing widgets - button widget", () => { + cy.get("#canvas-viewport").then((canvas) => { + const mainCanvasWidth = canvas.width() || 0; + ee.DragDropWidgetNVerify("buttonwidget", mainCanvasWidth * 0.1, 600); + [ + _.locators._resizeHandles.right, + _.locators._resizeHandles.bottom, + _.locators._resizeHandles.bottomLeft, + _.locators._resizeHandles.bottomRight, + ].forEach((eachHandle) => { + cy.get(`[data-testid='${eachHandle}']`) + .first() + .should("have.css", "cursor", "grab"); + }); + }); + }); +}); diff --git a/app/client/cypress/e2e/Regression/ClientSide/MobileResponsiveTests/SuggestedWidgets_spec.js b/app/client/cypress/e2e/Regression/ClientSide/MobileResponsiveTests/SuggestedWidgets_spec.js new file mode 100644 index 0000000000..9e31ca7e7f --- /dev/null +++ b/app/client/cypress/e2e/Regression/ClientSide/MobileResponsiveTests/SuggestedWidgets_spec.js @@ -0,0 +1,63 @@ +const queryLocators = require("../../../../locators/QueryEditor.json"); +const queryEditor = require("../../../../locators/QueryEditor.json"); +const commonlocators = require("../../../../locators/commonlocators.json"); +import * as _ from "../../../../support/Objects/ObjectsCore"; + +let datasourceName; + +describe("Check Suggested Widgets Feature in Auto Layout", function () { + before(() => { + cy.get(commonlocators.autoConvert).click({ + force: true, + }); + cy.get(commonlocators.convert).click({ + force: true, + }); + cy.get(commonlocators.refreshApp).click({ + force: true, + }); + }); + + beforeEach(() => { + cy.startRoutesForDatasource(); + }); + + it("1. Create a PostgresDataSource", () => { + cy.createPostgresDatasource(); + cy.get("@saveDatasource").then((httpResponse) => { + datasourceName = httpResponse.response.body.data.name; + }); + }); + + it("2. Create a query and populate response by choosing addWidget and validate in Table Widget", () => { + cy.NavigateToActiveDSQueryPane(datasourceName); + cy.get(queryLocators.templateMenu).click(); + cy.get(".CodeMirror textarea") + .first() + .focus() + .type("SELECT * FROM configs LIMIT 10;"); + // eslint-disable-next-line cypress/no-unnecessary-waiting + cy.wait(500); + // Mock the response for this test + cy.intercept("/api/v1/actions/execute", { + fixture: "addWidgetTable-mock", + }); + + cy.onlyQueryRun(); + cy.xpath(queryEditor.queryResponse) + .first() + .invoke("text") + .then((text) => { + const tableRowTxt = text; + cy.get(queryEditor.suggestedTableWidget).click(); + _.entityExplorer.SelectEntityByName("Table1"); + cy.isSelectRow(1); + cy.readTableV2dataPublish("1", "0").then((tabData) => { + const tabValue = tabData; + cy.log("the value is" + tabValue); + expect(tabValue).to.be.equal("5"); + expect(tableRowTxt).to.equal(tabValue); + }); + }); + }); +}); diff --git a/app/client/cypress/limited-tests.txt b/app/client/cypress/limited-tests.txt index 315aa45cc9..c260d0c798 100644 --- a/app/client/cypress/limited-tests.txt +++ b/app/client/cypress/limited-tests.txt @@ -1 +1 @@ -cypress/e2e/**/**/* \ No newline at end of file +cypress/e2e/**/**/* diff --git a/app/client/cypress/support/Objects/CommonLocators.ts b/app/client/cypress/support/Objects/CommonLocators.ts index a2db90e473..b38af57e17 100644 --- a/app/client/cypress/support/Objects/CommonLocators.ts +++ b/app/client/cypress/support/Objects/CommonLocators.ts @@ -198,6 +198,13 @@ export class CommonLocators { _ds_uppy_crop_confirm = ".uppy-ImageCropper-controls .uppy-c-btn"; _ds_uppy_upload_btn = ".uppy-StatusBar-actionBtn--upload"; _goBack = this._visibleTextSpan("Back") + "/parent::a"; + _resizeHandles = { + left: "t--resizable-handle-LEFT", + right: "t--resizable-handle-RIGHT", + bottom: "t--resizable-handle-BOTTOM", + bottomLeft: "t--resizable-handle-BOTTOM|LEFT", + bottomRight: "t--resizable-handle-BOTTOM|RIGHT", + }; _popUpCloseBtn = (popupname: string) => `//*[text()='${popupname}']/following-sibling::button`; _selectByValue = (value: string) =>