/ok-to-test tags="@tag.Anvil" <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced test cases for Anvil Button Widgets, including Canvas, Preview, and Deploy modes. - **Bug Fixes** - Updated CSS and HTML selectors for better element targeting and testing reliability. - **Style** - Improved styling logic for buttons in the InlineButtons component. - **Chores** - Added `data-testid` attributes for better test targeting. - Refactored code for string concatenations and URL constructions in DeployModeHelper. <!-- end of auto-generated comment: release notes by coderabbit.ai --><!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/9597157402> > Commit: c551705fe01aace94962fcc7fa91dff253136721 > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=9597157402&attempt=1" target="_blank">Cypress dashboard</a>. > Tags: `@tag.Anvil` <!-- end of auto-generated comment: Cypress test results --> --------- Co-authored-by: Pawan Kumar <pawankumar@Pawans-MacBook-Pro-2.local>
235 lines
7.9 KiB
TypeScript
235 lines
7.9 KiB
TypeScript
import { ObjectsRegistry } from "../Objects/Registry";
|
|
|
|
export class DeployMode {
|
|
private locator = ObjectsRegistry.CommonLocators;
|
|
private agHelper = ObjectsRegistry.AggregateHelper;
|
|
private assertHelper = ObjectsRegistry.AssertHelper;
|
|
|
|
_jsonFieldName = (fieldName: string) => `//p[text()='${fieldName}']`;
|
|
_jsonFormFieldByName = (fieldName: string, input = true) =>
|
|
this._jsonFieldName(fieldName) +
|
|
`/ancestor::div[@direction='column']//div[@data-testid='input-container']//${
|
|
input ? "input" : "textarea"
|
|
}`;
|
|
_jsonFormRadioFieldByName = (fieldName: string) =>
|
|
`//p[text()='${fieldName}']/ancestor::div[@direction='column']//div[@data-testid='radiogroup-container']//input`;
|
|
_jsonFormDatepickerFieldByName = (fieldName: string) =>
|
|
`//p[text()='${fieldName}']/ancestor::div[@direction='column']//div[@data-testid='datepicker-container']//input`;
|
|
_jsonFormNumberFieldByName = (
|
|
fieldName: string,
|
|
direction: "up" | "down" = "up",
|
|
) =>
|
|
`//p[text()='${fieldName}']/ancestor::div[@direction='column']//div[@data-testid='input-container']// ${
|
|
direction == "up" ? this.locator._chevronUp : this.locator._chevronDown
|
|
}`;
|
|
_jsonSelectDropdown = "button.select-button";
|
|
private _jsonFormMultiSelectByName = (fieldName: string) =>
|
|
`//p[text()='${fieldName}']/ancestor::div[@direction='column']//div[@data-testid='multiselect-container']//div[contains(@class, 'rc-select-show-arrow')]`;
|
|
_clearDropdown = "button.select-button span.cancel-icon";
|
|
private _jsonFormMultiSelectOptions = (option: string) =>
|
|
`//div[@title='${option}']//input[@type='checkbox']/ancestor::div[@title='${option}']`;
|
|
private _backtoHome =
|
|
".t--app-viewer-navigation-header .t--app-viewer-back-to-apps-button";
|
|
private _homeAppsmithImage = "a.t--appsmith-logo";
|
|
public _deployPageWidgets =
|
|
".bp3-heading, section.canvas [data-testid=t--app-viewer-page]:not(:empty)";
|
|
public _appViewPageName = `div.t--app-viewer-application-name`;
|
|
|
|
//refering PublishtheApp from command.js
|
|
public DeployApp(
|
|
eleToCheckInDeployPage?: string,
|
|
toCheckFailureToast = true,
|
|
toValidateSavedState = true,
|
|
addDebugFlag = true,
|
|
) {
|
|
this.agHelper.Sleep();
|
|
toValidateSavedState && this.agHelper.AssertAutoSave();
|
|
this.assertHelper.AssertDocumentReady();
|
|
this.StubbingDeployPage(addDebugFlag);
|
|
this.agHelper.ClickButton("Deploy");
|
|
this.agHelper.AssertElementAbsence(this.locator._btnSpinner, 10000);
|
|
this.assertHelper.AssertDocumentReady();
|
|
|
|
this.agHelper.WaitUntilEleAppear(
|
|
eleToCheckInDeployPage ?? this.locator._backToEditor,
|
|
);
|
|
localStorage.setItem("inDeployedMode", "true");
|
|
toCheckFailureToast &&
|
|
this.agHelper.AssertElementAbsence(
|
|
this.locator._specificToast("has failed"),
|
|
); //Validating bug - 14141 + 14252
|
|
this.agHelper.AssertElementVisibility(this._deployPageWidgets);
|
|
this.agHelper.Sleep(2000); //for view page widgets to load
|
|
}
|
|
|
|
// Stubbing window.open to open in the same tab
|
|
public StubbingWindow(timeout = 60000) {
|
|
cy.window({ timeout }).then((window: any) => {
|
|
cy.stub(window, "open")
|
|
.as("windowStub")
|
|
.callsFake((url) => {
|
|
window.location.href = url;
|
|
window.location.target = "_self";
|
|
});
|
|
});
|
|
}
|
|
|
|
public StubbingDeployPage(addDebugFlag = true) {
|
|
// cy.window({ timeout: 60000 }).then((window) => {
|
|
// cy.stub(window, "open")
|
|
// .as("windowDeployStub")
|
|
// .callsFake((url) => {
|
|
// const updatedUrl = `${Cypress.config().baseUrl + url.substring(1)}`;
|
|
// window.location.href = `${updatedUrl}${
|
|
// addDebugFlag
|
|
// ? (updatedUrl.indexOf("?") > -1 ? "&" : "?") + "debug=true"
|
|
// : ""
|
|
// }`;
|
|
// });
|
|
// });
|
|
|
|
// //this.StubbingWindow();
|
|
let updatedUrl = "";
|
|
cy.window({ timeout: 60000 }).then((window) => {
|
|
const originalOpen = window.open; // Save a reference to the original window.open function
|
|
window.open = (url: any) => {
|
|
updatedUrl = `${Cypress.config().baseUrl + url.substring(1)}`;
|
|
originalOpen.call(
|
|
window,
|
|
`${updatedUrl}${
|
|
addDebugFlag
|
|
? (updatedUrl.indexOf("?") > -1 ? "&" : "?") + "debug=true"
|
|
: ""
|
|
}`,
|
|
"_self",
|
|
);
|
|
return null;
|
|
};
|
|
});
|
|
}
|
|
|
|
public StubWindowNAssert(
|
|
selector: string,
|
|
expectedUrl: string,
|
|
networkCall: string,
|
|
) {
|
|
this.StubbingWindow();
|
|
this.agHelper.GetNClick(selector, 0, false, 0);
|
|
this.agHelper.Sleep(4000);
|
|
cy.get("@windowStub").should("be.calledOnce");
|
|
cy.url().should("contain", expectedUrl);
|
|
this.agHelper.Sleep(2000);
|
|
cy.window({ timeout: 60000 }).then((win) => {
|
|
win.history.back();
|
|
});
|
|
this.assertHelper.AssertNetworkResponseData("@" + networkCall);
|
|
this.assertHelper.AssertDocumentReady();
|
|
}
|
|
|
|
public NavigateBacktoEditor(toastToCheck = "") {
|
|
this.assertHelper.AssertDocumentReady();
|
|
this.agHelper.GetNClick(this.locator._backToEditor, 0, true);
|
|
this.agHelper.Sleep();
|
|
localStorage.setItem("inDeployedMode", "false");
|
|
if (toastToCheck) {
|
|
this.agHelper.ValidateToastMessage(toastToCheck);
|
|
}
|
|
this.agHelper.AssertElementAbsence(
|
|
this.locator._specificToast("There was an unexpected error"),
|
|
);
|
|
this.agHelper.AssertElementAbsence(
|
|
this.locator._specificToast(
|
|
"Internal server error while processing request",
|
|
),
|
|
);
|
|
this.agHelper.AssertElementAbsence(
|
|
this.locator._specificToast("Cannot read properties of undefined"),
|
|
);
|
|
this.assertHelper.AssertNetworkResponseData("@getConsolidatedData");
|
|
|
|
this.assertHelper.AssertNetworkStatus("@getWorkspace");
|
|
this.assertHelper.AssertDocumentReady();
|
|
this.agHelper.AssertElementVisibility(this.locator._editPage);
|
|
}
|
|
|
|
public NavigateToHomeDirectly() {
|
|
this.agHelper.GetNClick(this._backtoHome);
|
|
this.agHelper.Sleep(2000);
|
|
this.agHelper.AssertElementVisibility(this._homeAppsmithImage);
|
|
}
|
|
|
|
public EnterJSONInputValue(
|
|
fieldName: string,
|
|
value: string,
|
|
index = 0,
|
|
clearField = false,
|
|
) {
|
|
if (clearField) this.ClearJSONFieldValue(fieldName, index);
|
|
|
|
cy.xpath(this._jsonFormFieldByName(fieldName))
|
|
.eq(index)
|
|
.click()
|
|
.type(value, { delay: 0 })
|
|
.wait(200);
|
|
}
|
|
|
|
public EnterJSONTextAreaValue(fieldName: string, value: string, index = 0) {
|
|
cy.xpath(this._jsonFormFieldByName(fieldName, false))
|
|
.eq(index)
|
|
.click()
|
|
.type(value, { delay: 0 })
|
|
.wait(200);
|
|
}
|
|
|
|
public ClearJSONFieldValue(fieldName: string, index = 0, isInput = true) {
|
|
cy.xpath(this._jsonFormFieldByName(fieldName, isInput))
|
|
.eq(index)
|
|
.clear()
|
|
.wait(300);
|
|
}
|
|
|
|
public SelectJsonFormDropDown(dropdownOption: string, index = 0) {
|
|
cy.get(this._jsonSelectDropdown).eq(index).scrollIntoView().click();
|
|
cy.get(this.locator._selectOptionValue(dropdownOption)).click({
|
|
force: true,
|
|
});
|
|
this.agHelper.Sleep();
|
|
}
|
|
|
|
public SelectJsonFormMultiSelect(
|
|
name: string,
|
|
options: string[],
|
|
index = 0,
|
|
check = true,
|
|
) {
|
|
cy.xpath(this._jsonFormMultiSelectByName(name))
|
|
.eq(index)
|
|
.scrollIntoView()
|
|
.click();
|
|
this.agHelper.Sleep(500);
|
|
|
|
if (check) {
|
|
options.forEach(($each) => {
|
|
cy.get(this.locator._multiSelectOptions($each))
|
|
.check({ force: true })
|
|
.wait(800);
|
|
cy.xpath(this._jsonFormMultiSelectOptions($each)).should(
|
|
"have.class",
|
|
"rc-select-item-option-selected",
|
|
);
|
|
});
|
|
} else {
|
|
options.forEach(($each) => {
|
|
cy.get(this.locator._multiSelectOptions($each))
|
|
.uncheck({ force: true })
|
|
.wait(800);
|
|
cy.xpath(this._jsonFormMultiSelectOptions($each)).should(
|
|
"not.have.class",
|
|
"rc-select-item-option-selected",
|
|
);
|
|
});
|
|
}
|
|
cy.get("body").type("{esc}");
|
|
}
|
|
}
|