PromucFlow_constructor/app/client/cypress/support/widgetCommands.js
Abhinav Jha 4361db4269
feat: Automatic height updates for widgets based on contents (Auto Height) (#18341)
* added multi select back

* (WIP): Complete the dynamc height update logic

* (WIP): Dynamic height logic

* (WIP): Container computation logic, Next steps: Prevent reflow when resize is disabled. Fix logic of widgets randomly changing positions (Debug)

* Fix logic in container computations

* Integrate for PoC

* fixed the no initial load dynamic height updates

* Stop vertical resize and reflow when dynamic height is enabled for a widget

* added another container in text widget

* enabled dynamic height for container widgets

* removed dynamic height feature from list widget

* Fixed Button and Input components height increase

* added an experiment to overflow the content if maxHEight is less

* removed the ref of Textwidget by mistake, added it back

* fixed text widget height overflow problem with a little hack

* added long labels with text

* fixed the table scroll issue

* overflow fixed for json form widget

* added extra 8px height for Switch, Rating and Checkbox Height

* (WIP): Resolve issues

* (WIP): Fix widget padding issue

* added overflow container for Radio and Switch group widgets

* (WIP): Have modals work with dynamic height

* added the overlay and the handles

* added dragging behavior to the dots

* fixed the overlapping with the selection tool

* (WIP): Fix issues reported

* now we can update the property pane values back from overlay handles

* now we can update the property pane values back from overlay handles

* (WIP): Fix table widget

* Fix package.json

* Remove unit tests temporarily

* Fix unit test

* (WIP): Fix modal resize. Fix cursors. Fix border issue on non-resizable widgets

* fetch component heights using the requestAnimationFrame callback

* behavioural changes

* (WIP): Fix issues on the platform

* Update main container size appropriately

* more behavioural changes

* overlay now only be visible when hovering over the dots

* grid showing and widget reselecting

* added onfocus and onblur events to property pane listeners

* added onfocus and onblur events to property pane listeners

* added a range slider for min and max

* added demarcations for slider values

* (WIP): Fix platform workflows for dynamic height

* Fix issues with widgets

* Fix removed import

* - Add missing cypress files

* set the limits

* limit increase on change

* Fix z-index of min max limit indicators. Fix unused-vars warnings

* Fix Table Widget and Text Widget issues

* Fix: all the bugs in the bug master list for DH (#16268)

* changed the zindex for the signifiers

* showing signifiers only when the widget is selected

* made changes suggested by Momcilo

* activate the dots when the fields are active

* created a new centered dot handle

* removed overlays on focus and made the border more like deisgn

* handles on top of other widgets

* hide the overlay when multiple widgets are selected

* added a white border

* added a white border

* bug #15509 resolved

* changed the minDynamicHeightLimit to 2 instead of 4 to fix the Bug #15527

* removed the height auto fix from BaseInputComponent to fix the Bug #15388

* removed the condition to not ccalculate dynamic height when the row difference is less than 2 to fix the bug 15353

* made fixes for the bug #16307

* made fixes for the bug #16308

* made fixes for bug 16310

* made fixes for the bug #16402

* removed some log statements

* made fixes for the bug #16407

* fixed label problem found in the issue #16543

* made fixes for the issue #16547

* made fixes for the bug #16492

* redeploy

* (WIP): Fix to make this branch functional

* imported LabelWithTooltip back from design system

* signifier is now centered

* filled the signifier with primary color

* overlay hidden while dragging

* made the signifier dashed border also draggable

* Fix issue #16590 (#16798)

* set the limits to 4 rows

* replaced the static 40 value

* added signifiers for modal widget

* added signifiers for modal widget

* tried solving the scroll issue for widgets when there are limits

* solved the height problem using ResizeObserver

* (WIP): Fix maxDynamicHeight issue with container widgets:

* made the changes as per the review

* fixed the issue for input widget when label gets out of border

* hide text widget overflow options if auto height is enabled

* (WIP): In view mode, invisible widgets now donot take space (#16920)

* (WIP): In view mode, invisible widgets now donot take space

* (WIP): Enable the feature where invisible widgets in view mode don't take space to all widgets irrespective of the dynamic height feature

* Remove Replay conditional

* removed the scroll container for container type widgets

* removed the scroll container for container type widgets

* updated the hook to set overflow none for text widget

* fixed the should dynamic height logic to respect the min height limit

* Modal widget adheres to dynamic height (#16995)

* Modal widget adheres to dynamic height

* WIP: POC: fix dynamic height issues  (#16996)

Fix height less than 4 issue. Fix JSONForm adherence to min and max height

* POC: Dynamic height undo redo issue (#17085)

* Revert debouce timeout

* (WIP): Fix issue with undo-redo in dynamic height

* fix: Dynamic height issue fixes (#17153)

* Dynamic height issue fixes
==

- Fix issue where nested widgets did not ensure parent dynamic height updates
- Fix issue where Modal widget updates came in subsequent renders
- Fix issue where JSONForm collapses
- Fix performance issue for independent updates

* Use functions to get min and max dynamic height

* Fix issue where variable might have been undefined

* added the dynamic container into the deploy mode as well

* added overflow-x hidden when overflow-y is active in the dynamic height container

* fix: Dynamic height Issue fixes (#17204)

Fix preview mode invisible widgets. Fix Tabs widget dynamic height.

* removed a console.log statement

* removed the slider control file

* imported the LabelWithTooltip from the repo rather than ds

* word-break CSS rules added for Switch and Checkbox widget when Dynamic Height is enabled

* abstracted the check for dynamic height with limits enabled as isDynamicHeightWithLimitsEnabledForWidget

* abstracted the static value of 10 in dynamic height overlay to GridDefaults

* abstracted min and max dynamic height limits to getters

* fix: replaced all the refs for simpler widgets (#17353)

* replaced all the refs for simpler widgets

* removed the updateDynamicHeight from componentDidUpdate in BaseWidget

* added back lifecycle methods back to BaseWidget

* removed the contentRef from SwitchGroup and Table

* updating the height from the auto height with limits as well

* some hacks to make the limits work

* working solution

* used setTimeout to send an update to updateDynamicHeight from overlay update

* removed a log

* added requestanimationframe in settimeout

Co-authored-by: Ankur Singhal <ankursinghal@Ankurs-MacBook-Pro-2.local>
Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* Fix issues caused during merge

* Remove unneeded derived property

* removed more unnecessary code which should have been removed after removing the ref dependency

* fixed the maxDynamicHeight issue

* Fix issue where property configs were not being sent

* fix: Auto Height Feature - add selectors for tests (#17687)

Add selectors for auto height cypress tests

* fix: removed height auto default theme (#17415)

removed height auto css rule from the default theme

Co-authored-by: Ankur Singhal <ankursinghal@Ankurs-MacBook-Pro-2.local>

* fix: Auto Height Feature - Resolve issues and restructure code (#17686)

* Fix issues in dynamic height. Restructure code and reduce abstraction leaks

* Fix typescript issues

* Update based on review comments. Comment migrations, as a cyclic import is causing the jest tests to fail.

* Remove unused imports

* Decrease code nesting

* added the base styles for the overlay like position and z-index in its styled component css

* used the isDynamicHeightEnabled prop to set the height of SwitchGroup and RadioGroup widgets from 32px to 100% in case of inline mode

* fix: Auto Height - Resolve issues (#17737)

* Fix Tabs Widget showTabs toggle based auto height. Revert removal of BaseWidget code. Remove box-intersect and use a bruteforce algorithm. Add base logic for having containers collapse due to hidden child widgets

* Hide scroll contents and overflow property pane controls when dynamic height is enabled

* Removed the class property expectedHeight from BaseWidget as it is not useful in the overlay logic after some changes

* fixed the left alignment issue of label in the rich text editor by adding some styles applied only when the dynamic height is enabled

* fixed the input field stretching issue in case of Dynamic height by adding some CSS styles when isDynamicHeight is true

* Fix failing modal widget cypress tests

* Fix issue with scrollContents and Tabs Widget defaulTab

* added a little bit padding of 4px to the right of scroll container of dynamic height with limit

* Add test locators for resize handles

* removed the dynamic height logic from the table widget

* fix: Auto-Height invisible widgets (#17849)

* Fix issue where invisible widgets were still taking space

* Make sure to collapse only if dynamic height is enabled

* Fix issues with reflow (not the invisible widgets)

* Fix container min height issues

* Fix reflow with original bottom and top values. Testing needed

* Fix invisible widgets

* fix: enabled dynamic height for stat box widget (#17971)

enabled dynamic height for stat box widget

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: added a min height to rich text editor so that it does not collapse (#17970)

added a min height to rich text editor so that it does not collapse

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* Fix issue with resizing auto height widget

* Add helper text to educate users regarding the scroll disconnect in WYSIWYG

* fix: Auto Height Fixes (#18111)

AUTO HEIGHT FIXES

- Fix JSONForm height discrepancy
- Fix issue where widgets moved below the other
- Fix droptarget height after parent container resize

* fix: sliced up the DynamicHeightOverlay component a little bit (#18100)

* sliced up the DynamicHeightOverlay component a little bit

* more refactoring

* more refactoring

* used release event emitter and refactored more

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: rich text editor center alignment issue (#18142)

* removed the center alignment from rich text editor

* dummy commit

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: old DSL container collapse (#18160)

* Fix issue where old containers from old DSLs used to collapse when auto height was enabled

* Fix issue where old containers don't allow new widgets to be added when auto height is enabled, this is because the shouldScrollContents is undefined

* fix: input widgets issue (#18172)

fixed the auto height not working issue

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: preview deploy mode (#18174)

fixed the preview and deploy mode

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: auto height limits label intersection with handle dot (#18186)

fixed the position of the limits label to the right so that it will not intersect with the handle dot

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: auto height limits rich text editor min height (#18187)

decrease the min height of the RTE so that it does not have the boundary issue with the max limit when auto height with limits is enabled

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: grammatical error in the help text (#18188)

changed react to reacts in the helpText of the dynamic height property in the proeprty pane

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: auto height tabs double scroll (#18210)

solved the issue by disabling the scroll for the child canvas widget in the tabs widget

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: auto height limits resizing (#18213)

* fixed the auto height limits resizing issue

* made the auto height overlay independent of isResizing and used its own property to show the grid

* some more refactoring

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* dummy commit

* fix: old apps container issue (#18255)

filtered out the widgets which are detached from layout

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: fixing auto height in childless containers. (#18263)

fixing auto height in childless containers.

* task: Dynamic height reflow fixes in Branch (#18244)

dynamic height reflow fixes

* fix: compact label issue and min and max limits numeric input (#18282)

fixed compact label issue and turned min and max limits to numeric input

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: LabelWithTooltip help icon fix

* fix: NaN and min limit for min and max (#18284)

* fixed compact label issue and turned min and max limits to numeric input

* fixed NaN and set min to be 4

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: validation issues for min max (#18286)

* fixed compact label issue and turned min and max limits to numeric input

* fixed NaN and set min to be 4

* validations start working min max

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* added a full stop to container scroll helper text

* validations start working min max

* dummy commit

* feat: stop resizing auto height widgets vertically because of Drag n Drop Reflow (#18267)

* reflow fixes

* stop resizing auto height widgets vertically because of Drag n Drop Reflow

* feat: Analytics for Dynamic height (#18279)

* Fix canvas min height issue and invisible widgets issue and remove logs and fix issue where widgets overlapped when coming back from preview mode to edit mode

* Fix issue with containers not respecting auto height and decreasing height

* Fix issue with modal widget not hugging contents, and container widgets never become visible after going invisible

* Fix issue where existing containers don't have correct min height for child canvas

* fix: canvasLevelsReducers test (#18301)

fixed the canvasLevelsReducers test

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: removed auto height min max config from widget features (#18316)

removed auto height min max config from widget features

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: Fixing Modal Height updates (#18317)

Fixing Modal Height updates

* fix: text widget background auto height (#18319)

added background color of Text widget back to the auto height container

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* test: cypress tests for auto height (#17676)

* Added tests for dynamic height

* updated tests for another usecase

* moved locators into commonfile

* updated common method

* added tests for some more widgets

* Added tests for jsonForm / Form widget

* Updated the test

* updated test for multiple text widgets

* updated test with few more usecases

* updated the dsl

* updated tests for text change

* updated tests based on new changes

* updated cypress test fixes

* fix: auto height container merge poc wrt release (#18334)

updated the poc wrt PR already merged in the release regarding the auto height container

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: renamed auto height overlay components and added some tests (#18333)

* renamed auto height overlay components and added some tests

* replaced the 10 value with GridDefaults

* avoiding event to reach drop target

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* updated tests

* Merge all code into one branch

* Fix failing AutoHeightcontainer test

* fix: Fix reflow computations which were causing widget overlap (#18300)

* Fix reflow computations which were causing widget overlap

* Fix issues with parent container height and overlapping widgets

* Remove console logs

* Revert comment

* Fix issues related to reflow of containers

* feat: Making getEffectedBoxes a Recursive function in autoHeight Reflow (#18336)

Making getEffectedBoxes a Recursive function in autoHeight Reflow

* Return null for invisible widgets from withWidgetProps

* Remove duplicate import

Co-authored-by: rahulramesha <71900764+rahulramesha@users.noreply.github.com>

* Remove missed console log

* fix: Label position gets deselected on selecting already selected option (#18298)

* fix: Label position gets deselected on selecting the already selected value

* Added migration for Currency & Phone input widgets

* simplify migration function using a utility

* combine conditions

* Increments LATEST_PAGE_VERSION

* Update DynamicHeight_Visibility_spec.js

updated a check wrt auto height

* Handling Modals for canvas size calculations

* fix: migrate label position test failing issue (#18365)

fixed migrate label postition test failing issue

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* removed the two unwanted imports from DSLMigrations to fix client build

* fix: Auto height zero and limits issue (#18366)

fixed the auto height zero and limits issue

Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>

* fix: Auto height regression issues (#18367)

* Fix auto height regression issues #18367

* feat: auto height migrations (#18368)

Add auto height migrations

* Increase file caching size

* Use manual array for list of auto height enabled widgets

* Fix cypress test dsl versions

* Revert changes to shouldUpdateHeightDynamically

* Update test results based on code changes

* Marginally increase the workbox file size cache

* review comment incorporated for test spec

* Update container auto height property on drop

* added small wait for validation

Co-authored-by: Ankur Singhal <ankur@appsmith.com>
Co-authored-by: rahulramesha <rahul@appsmith.com>
Co-authored-by: Abhinav Jha <zatanna@Abhinavs-iMac.lan>
Co-authored-by: Ankur Singhal <ankursinghal@Ankurs-MacBook-Pro-2.local>
Co-authored-by: Ankur Singhal <ankurrsinghal@gmail.com>
Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com>
Co-authored-by: rahulramesha <71900764+rahulramesha@users.noreply.github.com>
Co-authored-by: Albin <albin@appsmith.com>
Co-authored-by: Aswath K <aswath.sana@gmail.com>
Co-authored-by: NandanAnantharamu <67676905+NandanAnantharamu@users.noreply.github.com>
Co-authored-by: Apple <nandan@thinkify.io>
2022-11-23 15:18:23 +05:30

1643 lines
46 KiB
JavaScript

/* eslint-disable cypress/no-unnecessary-waiting */
/* eslint-disable cypress/no-assigning-return-values */
require("cy-verify-downloads").addCustomCommand();
require("cypress-file-upload");
const pages = require("../locators/Pages.json");
const commonlocators = require("../locators/commonlocators.json");
const modalWidgetPage = require("../locators/ModalWidget.json");
const widgetsPage = require("../locators/Widgets.json");
const LayoutPage = require("../locators/Layout.json");
const formWidgetsPage = require("../locators/FormWidgets.json");
const apiwidget = require("../locators/apiWidgetslocator.json");
const dynamicInputLocators = require("../locators/DynamicInput.json");
const viewWidgetsPage = require("../locators/ViewWidgets.json");
const generatePage = require("../locators/GeneratePage.json");
import { ObjectsRegistry } from "../support/Objects/Registry";
let pageidcopy = " ";
const ee = ObjectsRegistry.EntityExplorer;
export const initLocalstorage = () => {
cy.window().then((window) => {
window.localStorage.setItem("ShowCommentsButtonToolTip", "");
window.localStorage.setItem("updateDismissed", "true");
});
};
Cypress.Commands.add("changeZoomLevel", (zoomValue) => {
cy.get(commonlocators.changeZoomlevel)
.last()
.click();
cy.get(".t--dropdown-option")
.children()
.contains(zoomValue)
.click();
cy.wait("@updateLayout").should(
"have.nested.property",
"response.body.responseMeta.status",
200,
);
cy.get(commonlocators.selectedZoomlevel)
.last()
.invoke("text")
.then((text) => {
const someText = text;
expect(someText).to.equal(zoomValue);
});
});
Cypress.Commands.add("changeColumnType", (dataType) => {
cy.get(commonlocators.changeColType)
.last()
.click();
cy.get(".t--dropdown-option")
.children()
.contains(dataType)
.click();
cy.wait("@updateLayout").should(
"have.nested.property",
"response.body.responseMeta.status",
200,
);
/*
cy.get(commonlocators.selectedColType)
.first()
.invoke("text")
.then((text) => {
const someText = text;
expect(someText).to.equal(dataType);
});
*/
});
Cypress.Commands.add("switchToPaginationTab", () => {
cy.get(apiwidget.paginationTab)
.first()
.click({ force: true });
});
Cypress.Commands.add("selectDateFormat", (value) => {
cy.get(".t--property-control-dateformat .bp3-popover-target")
.last()
.click({ force: true });
cy.get(".t--dropdown-option")
.children()
.contains(value)
.click({ force: true });
});
Cypress.Commands.add("selectDropdownValue", (element, value) => {
cy.get(element)
.last()
.click();
cy.get(".t--dropdown-option")
.children()
.contains(value)
.click();
});
Cypress.Commands.add("assertDateFormat", () => {
cy.get(".t--draggable-datepickerwidget2 input")
.first()
.invoke("attr", "value")
.then((text) => {
const firstTxt = text;
cy.log("date time : ", firstTxt);
cy.get(commonlocators.labelTextStyle)
.first()
.should("contain", firstTxt);
cy.get(commonlocators.labelTextStyle)
.last()
.invoke("text")
.then((text) => {
const secondText = text;
cy.log("date time : ", secondText);
expect(firstTxt).not.to.equal(secondText);
});
});
});
Cypress.Commands.add("selectPaginationType", (option) => {
cy.xpath(option).click({ force: true });
});
Cypress.Commands.add("copyJSObjectToPage", (pageName) => {
cy.xpath(apiwidget.popover)
.last()
.click({ force: true });
cy.get(apiwidget.copyTo).click({ force: true });
cy.get(apiwidget.page)
.contains(pageName)
.click();
cy.wait("@createNewJSCollection").should(
"have.nested.property",
"response.body.responseMeta.status",
201,
);
});
Cypress.Commands.add("AddActionWithModal", () => {
cy.get(commonlocators.dropdownSelectButton)
.last()
.click();
cy.get(".single-select")
.contains("Open modal")
.click({ force: true });
cy.get(modalWidgetPage.selectModal).click();
cy.get(modalWidgetPage.createModalButton).click({ force: true });
});
Cypress.Commands.add("createModal", (ModalName) => {
cy.get(widgetsPage.actionSelect)
.first()
.click({ force: true });
cy.selectOnClickOption("Open modal");
cy.get(modalWidgetPage.selectModal).click();
cy.wait(2000);
cy.get(modalWidgetPage.createModalButton).click({ force: true });
cy.wait(3000);
cy.assertPageSave();
//cy.SearchEntityandOpen("Modal1");
// changing the model name verify
// cy.widgetText(
// ModalName,
// modalWidgetPage.modalName,
// modalWidgetPage.modalName,
// );
//changing the Model label
// cy.get(modalWidgetPage.modalWidget + " " + widgetsPage.textWidget)
// .first()
// .trigger("mouseover");
ee.SelectEntityInModal("Modal1", "Widgets");
//cy.get(".t--modal-widget" +" "+ widgetsPage.textWidget).click();
cy.testCodeMirror(ModalName);
cy.moveToStyleTab();
cy.get(widgetsPage.textCenterAlign).click({ force: true });
cy.assertPageSave();
cy.get(".bp3-overlay-backdrop").click({ force: true });
});
Cypress.Commands.add("createModalWithIndex", (ModalName, index) => {
cy.get(widgetsPage.actionSelect)
.eq(index)
.click({ force: true });
cy.selectOnClickOption("Open modal");
cy.get(modalWidgetPage.selectModal).click();
cy.wait(2000);
cy.get(modalWidgetPage.createModalButton).click({ force: true });
cy.wait(3000);
cy.assertPageSave();
//cy.SearchEntityandOpen("Modal1");
// changing the model name verify
// cy.widgetText(
// ModalName,
// modalWidgetPage.modalName,
// modalWidgetPage.modalName,
// );
//cy.wait(20000);
//changing the Model label
// cy.get(modalWidgetPage.modalWidget + " " + widgetsPage.textWidget)
// .first()
// .trigger("mouseover");
ee.SelectEntityInModal("Modal1", "Widgets");
//cy.get(".t--modal-widget" +" "+ widgetsPage.textWidget).click();
cy.testCodeMirror(ModalName);
cy.moveToStyleTab();
cy.get(widgetsPage.textCenterAlign).click({ force: true });
cy.assertPageSave();
cy.get(".bp3-overlay-backdrop").click({ force: true });
});
Cypress.Commands.add("selectOnClickOption", (option) => {
cy.get(".bp3-popover-content").should("be.visible");
cy.get("ul.bp3-menu div.bp3-fill")
.should("be.visible")
.contains(option)
.click({ force: true });
});
Cypress.Commands.add("selectWidgetOnClickOption", (option) => {
cy.get(".bp3-popover-content").should("be.visible");
cy.get(commonlocators.selectWidgetVirtualList)
.should("be.visible")
.contains(option)
.click({ force: true });
});
Cypress.Commands.add("CheckWidgetProperties", (checkboxCss) => {
cy.get(checkboxCss).check({
force: true,
});
cy.assertPageSave();
});
Cypress.Commands.add("UncheckWidgetProperties", (checkboxCss) => {
cy.get(checkboxCss).uncheck({
force: true,
});
cy.assertPageSave();
});
Cypress.Commands.add("EditWidgetPropertiesUsingJS", (checkboxCss, inputJS) => {
cy.get(checkboxCss, { timeout: 10000 })
.last()
.should("exist")
.dblclick({ force: true })
.type(inputJS);
cy.assertPageSave();
});
Cypress.Commands.add(
"ChangeTextStyle",
(dropDownValue, textStylecss, labelName) => {
cy.get(commonlocators.dropDownIcon)
.last()
.click();
cy.get(".t--dropdown-option")
.children()
.contains(dropDownValue)
.click();
cy.get(textStylecss).should("have.text", labelName);
},
);
Cypress.Commands.add("widgetText", (text, inputcss, innercss) => {
cy.get(commonlocators.editWidgetName)
.click({ force: true })
.type(text, { delay: 300 })
.type("{enter}");
cy.get(inputcss)
.first()
.trigger("mouseover", { force: true });
cy.contains(innercss, text);
});
Cypress.Commands.add("verifyUpdatedWidgetName", (text, txtToVerify) => {
cy.get(commonlocators.editWidgetName)
.click({ force: true })
.type(text)
.type("{enter}");
cy.assertPageSave();
if (!txtToVerify) cy.get(".editable-text-container").contains(text);
else cy.get(".editable-text-container").contains(txtToVerify);
cy.wait(2000); //for widget name to reflect!
});
Cypress.Commands.add("verifyWidgetText", (text, inputcss, innercss) => {
cy.get(inputcss)
.first()
.trigger("mouseover", { force: true });
cy.contains(innercss, text);
});
Cypress.Commands.add("editColName", (text) => {
cy.get(commonlocators.editColTitle)
.click({ force: true })
.type(text)
.type("{enter}");
cy.get(commonlocators.editColText).should("have.text", text);
});
Cypress.Commands.add("invalidWidgetText", () => {
// checking invalid widget name
cy.get(commonlocators.editWidgetName)
.click({ force: true })
.type("download")
.type("{enter}");
cy.get(commonlocators.toastmsg).contains("download is already being used.");
});
Cypress.Commands.add("EvaluateDataType", (dataType) => {
cy.get(commonlocators.evaluatedType)
.first()
.should("be.visible")
.contains(dataType);
});
Cypress.Commands.add("getCodeMirror", () => {
cy.EnableAllCodeEditors();
return cy
.get(".CodeMirror textarea")
.first()
.focus()
.type("{ctrl}{shift}{downarrow}");
});
Cypress.Commands.add("testCodeMirror", (value) => {
const modifierKey = Cypress.platform === "darwin" ? "meta" : "ctrl";
cy.EnableAllCodeEditors();
cy.get(".CodeMirror textarea")
.first()
.focus()
.type(`{${modifierKey}}a`)
.then(($cm) => {
if ($cm.val() !== "") {
cy.get(".CodeMirror textarea")
.first()
.clear({
force: true,
});
}
cy.get(".CodeMirror textarea")
.first()
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(2000);
cy.get(".CodeMirror textarea")
.first()
.should("have.value", value);
});
});
Cypress.Commands.add("updateComputedValue", (value) => {
cy.EnableAllCodeEditors();
cy.get(".CodeMirror textarea")
.first()
.focus({ force: true })
.type("{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(($cm) => {
if ($cm.contents !== "") {
cy.log("The field is empty");
cy.get(".CodeMirror textarea")
.first()
.clear({
force: true,
});
}
cy.get(".CodeMirror textarea")
.first()
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("clearComputedValueFirst", () => {
cy.get(".CodeMirror textarea")
.first()
.focus({ force: true })
.type("{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(() => {
cy.get(".CodeMirror textarea")
.first()
.clear({
force: true,
});
cy.log("The field is empty");
});
cy.wait(1000);
});
Cypress.Commands.add("updateComputedValueV2", (value) => {
cy.get(".t--property-control-computedvalue .CodeMirror textarea")
.first()
.focus({ force: true })
.type("{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(($cm) => {
if ($cm.contents !== "") {
cy.log("The field is empty");
cy.get(".CodeMirror textarea")
.first()
.clear({
force: true,
});
}
cy.get(".t--property-control-computedvalue .CodeMirror textarea")
.first()
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("testCodeMirrorLast", (value) => {
cy.EnableAllCodeEditors();
cy.get(".CodeMirror textarea")
.last()
.focus()
.type("{ctrl}{shift}{downarrow}", { force: true })
.then(($cm) => {
if ($cm.val() !== "") {
cy.get(".CodeMirror textarea")
.last()
.clear({
force: true,
});
}
cy.get(".CodeMirror textarea")
.last()
.type("{ctrl}{shift}{downarrow}", { force: true })
.clear({ force: true })
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(200);
cy.get(".CodeMirror textarea")
.last()
.should("have.value", value);
});
});
Cypress.Commands.add("testJsontext", (endp, value, paste = true) => {
cy.EnableAllCodeEditors();
cy.get(".t--property-control-" + endp + " .CodeMirror textarea")
.first()
.focus({ force: true })
.type("{ctrl}{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(($cm) => {
if ($cm.contents !== "") {
cy.log("The field is not empty");
cy.get(".t--property-control-" + endp + " .CodeMirror textarea")
.first()
.click({ force: true })
.focused({ force: true })
.clear({
force: true,
});
}
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(500);
cy.get(".t--property-control-" + endp + " .CodeMirror textarea")
.first()
.then((el) => {
const input = cy.get(el);
if (paste) {
input.invoke("val", value);
} else {
input.type(value, {
force: true,
parseSpecialCharSequences: false,
});
}
});
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(2500); //Allowing time for Evaluate value to capture value
});
Cypress.Commands.add("testJsontextclear", (endp) => {
cy.get(".t--property-control-" + endp + " .CodeMirror textarea")
.first()
.focus({ force: true })
.type("{ctrl}{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(($cm) => {
if ($cm.contents !== "") {
cy.log("The field is not empty");
cy.get(".t--property-control-" + endp + " .CodeMirror textarea")
.first()
.click({ force: true })
.focused({ force: true })
.clear({
force: true,
});
}
});
});
Cypress.Commands.add("getCodeInput", ($selector, value) => {
cy.EnableAllCodeEditors();
cy.get($selector)
.first()
.click({ force: true })
.find(".CodeMirror")
.first()
.then((ins) => {
const input = ins[0];
return cy.wrap(input);
});
});
/**
* Usage:
* Find the element which has a code editor input and then pass it in the function
*
* cy.get(...).then(el => cy.updateCodeInput(el, "test"));
*
*/
Cypress.Commands.add("updateCodeInput", ($selector, value) => {
cy.getCodeInput($selector).then((input) => {
const codeMirrorInput = input[0].CodeMirror;
codeMirrorInput.focus();
cy.wait(200);
codeMirrorInput.setValue(value);
cy.wait(1000); //time for value to set
});
});
Cypress.Commands.add(
"focusCodeInput",
($selector, cursor = { ch: 0, line: 0 }) => {
cy.getCodeInput($selector).then((input) => {
const codeMirrorInput = input[0].CodeMirror;
codeMirrorInput.focus();
cy.wait(200);
codeMirrorInput.setCursor(cursor);
cy.wait(1000); //time for value to set
});
},
);
Cypress.Commands.add(
"assertCursorOnCodeInput",
($selector, cursor = { ch: 0, line: 0 }) => {
cy.EnableAllCodeEditors();
cy.get($selector)
.first()
.find(".CodeMirror")
.first()
.then((ins) => {
const input = ins[0].CodeMirror;
expect(input.hasFocus()).to.be.true;
const editorCursor = input.getCursor();
expect(editorCursor.ch).to.equal(cursor.ch);
expect(editorCursor.line).to.equal(cursor.line);
});
},
);
Cypress.Commands.add(
"assertSoftFocusOnPropertyPane",
($selector, cursor = { ch: 0, line: 0 }) => {
cy.EnableAllCodeEditors();
cy.get($selector)
.find(".CodeEditorTarget")
.should("have.focus")
.find(".CodeMirror")
.first()
.then((ins) => {
const input = ins[0].CodeMirror;
if (!input.hasFocus()) {
input.focus();
}
expect(input.hasFocus()).to.be.true;
const editorCursor = input.getCursor();
expect(editorCursor.ch).to.equal(cursor.ch);
expect(editorCursor.line).to.equal(cursor.line);
});
},
);
Cypress.Commands.add("selectColor", (GivenProperty, colorOffset = -15) => {
// Property pane of the widget is opened, and click given property.
cy.get(
".t--property-control-" + GivenProperty + " .bp3-input-group input",
).click({
force: true,
});
cy.get(widgetsPage.colorPickerV2Color)
.eq(colorOffset)
.then(($elem) => {
cy.get($elem).click({ force: true });
});
});
Cypress.Commands.add("toggleJsAndUpdate", (endp, value) => {
cy.EnableAllCodeEditors();
cy.get(".CodeMirror textarea")
.last()
.focus({ force: true })
.type("{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(($cm) => {
if ($cm.contents !== "") {
cy.log("The field is empty");
cy.get(".CodeMirror textarea")
.last()
.clear({
force: true,
});
}
cy.get(".CodeMirror textarea")
.last()
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(200);
});
Cypress.Commands.add("toggleJsAndUpdateWithIndex", (endp, value, index) => {
cy.get(".CodeMirror textarea")
.eq(index)
.focus({ force: true })
.type("{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(($cm) => {
if ($cm.contents !== "") {
cy.log("The field is empty");
cy.get(".CodeMirror textarea")
.eq(index)
.clear({
force: true,
});
}
cy.get(".CodeMirror textarea")
.eq(index)
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(200);
});
Cypress.Commands.add("assertControlVisibility", (endp) => {
cy.get(".t--property-control-" + endp + " .CodeMirror")
.first()
.should("not.be.visible");
});
Cypress.Commands.add("tableColumnDataValidation", (columnName) => {
cy.get("[data-rbd-draggable-id='" + columnName + "'] input")
.scrollIntoView()
.first()
.focus({ force: true })
.should("be.visible");
});
Cypress.Commands.add("tableV2ColumnDataValidation", (columnName) => {
cy.get("[data-rbd-draggable-id='" + columnName + "'] input[type='text']")
.scrollIntoView()
.first()
.focus({ force: true })
.should("be.visible");
});
Cypress.Commands.add("tableColumnPopertyUpdate", (colId, newColName) => {
cy.get("[data-rbd-draggable-id='" + colId + "'] input")
.scrollIntoView()
.should("be.visible")
.click({
force: true,
});
cy.get("[data-rbd-draggable-id='" + colId + "'] input").clear({
force: true,
});
cy.get("[data-rbd-draggable-id='" + colId + "'] input").type(newColName, {
force: true,
});
cy.get(".draggable-header ")
.contains(newColName)
.should("be.visible");
});
Cypress.Commands.add("tableV2ColumnPopertyUpdate", (colId, newColName) => {
cy.get("[data-rbd-draggable-id='" + colId + "'] input[type='text']")
.scrollIntoView()
.should("be.visible")
.click({
force: true,
});
cy.get("[data-rbd-draggable-id='" + colId + "'] input[type='text']").clear({
force: true,
});
cy.get("[data-rbd-draggable-id='" + colId + "'] input[type='text']").type(
newColName,
{
force: true,
},
);
cy.get(".draggable-header ")
.contains(newColName)
.should("be.visible");
});
Cypress.Commands.add("hideColumn", (colId) => {
cy.get("[data-rbd-draggable-id='" + colId + "'] .t--show-column-btn").click({
force: true,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("showColumn", (colId) => {
cy.get("[data-rbd-draggable-id='" + colId + "'] .t--show-column-btn").click({
force: true,
});
cy.get(".draggable-header ")
.contains(colId)
.should("be.visible");
});
Cypress.Commands.add("deleteColumn", (colId) => {
cy.get("[data-rbd-draggable-id='" + colId + "'] .t--delete-column-btn").click(
{
force: true,
},
);
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("openFieldConfiguration", (fieldIdentifier) => {
cy.get(
"[data-rbd-draggable-id='" + fieldIdentifier + "'] .t--edit-column-btn",
).click({
force: true,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("deleteJSONFormField", (fieldIdentifier) => {
cy.get(
"[data-rbd-draggable-id='" + fieldIdentifier + "'] .t--delete-column-btn",
).click({
force: true,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("makeColumnVisible", (colId) => {
cy.get("[data-rbd-draggable-id='" + colId + "'] .t--show-column-btn").click({
force: true,
});
cy.wait(1000);
});
Cypress.Commands.add("addColumn", (colId) => {
cy.get(widgetsPage.addColumn).scrollIntoView();
cy.get(widgetsPage.addColumn)
.should("be.visible")
.click({ force: true });
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(3000);
cy.get(widgetsPage.defaultColName).clear({
force: true,
});
cy.get(widgetsPage.defaultColName).type(colId, { force: true });
});
Cypress.Commands.add("addColumnV2", (colId) => {
cy.get(widgetsPage.addColumn).scrollIntoView();
cy.get(widgetsPage.addColumn)
.should("be.visible")
.click({ force: true });
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(3000);
cy.get(widgetsPage.defaultColNameV2).clear({
force: true,
});
cy.get(widgetsPage.defaultColNameV2).type(colId, { force: true });
});
Cypress.Commands.add("editColumn", (colId) => {
cy.get("[data-rbd-draggable-id='" + colId + "'] .t--edit-column-btn").click({
force: true,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1500);
});
Cypress.Commands.add("readTextDataValidateCSS", (cssProperty, cssValue) => {
cy.get(commonlocators.headingTextStyle).should(
"have.css",
cssProperty,
cssValue,
);
});
Cypress.Commands.add("evaluateErrorMessage", (value) => {
cy.get(commonlocators.evaluateMsg)
.first()
.click()
.invoke("text")
.then((text) => {
const someText = text;
expect(someText).to.equal(value);
});
});
Cypress.Commands.add("addAction", (value, property) => {
let dropdownSelect = commonlocators.dropdownSelectButton;
if (property)
dropdownSelect = `.t--property-control-${property} ${dropdownSelect}`;
cy.get(dropdownSelect)
.last()
.click();
cy.get(commonlocators.chooseAction)
.children()
.contains("Show message")
.click();
cy.enterActionValue(value, property);
});
Cypress.Commands.add("addEvent", (value) => {
cy.get(commonlocators.dropdownSelectButton)
.last()
.click();
cy.get(commonlocators.chooseAction)
.children()
.contains("Show message")
.click();
cy.enterEventValue(value);
});
Cypress.Commands.add("onTableAction", (value, value1, value2) => {
cy.get(commonlocators.dropdownSelectButton)
.eq(value)
.click();
cy.get(commonlocators.chooseAction)
.children()
.contains("Show message")
.click();
cy.testJsontext(value1, value2);
});
Cypress.Commands.add("selectShowMsg", () => {
cy.get(commonlocators.chooseAction)
.children()
.contains("Show message")
.click();
});
Cypress.Commands.add("addSuccessMessage", (value) => {
cy.get(commonlocators.chooseMsgType)
.last()
.click({ force: true });
cy.get(commonlocators.chooseAction)
.children()
.contains("Success")
.click();
cy.enterActionValue(value);
});
Cypress.Commands.add("SetDateToToday", () => {
cy.get(formWidgetsPage.datepickerFooterPublish)
.contains("Today")
.click({ force: true });
cy.assertPageSave();
});
Cypress.Commands.add("enterActionValue", (value, property) => {
cy.EnableAllCodeEditors();
let codeMirrorTextArea = ".CodeMirror textarea";
if (property)
codeMirrorTextArea = `.t--property-control-${property} ${codeMirrorTextArea}`;
cy.get(codeMirrorTextArea)
.last()
.focus()
.type("{ctrl}{shift}{downarrow}")
.then(($cm) => {
if ($cm.val() !== "") {
cy.get(codeMirrorTextArea)
.last()
.clear({
force: true,
});
}
cy.get(codeMirrorTextArea)
.last()
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(200);
});
});
Cypress.Commands.add("enterEventValue", (value) => {
cy.get(commonlocators.optionchangetextDropdown)
.focus()
.type("{ctrl}{shift}{downarrow}")
.then(($cm) => {
if ($cm.val() !== "") {
cy.get(commonlocators.optionchangetextDropdown).clear({
force: true,
});
}
cy.get(commonlocators.optionchangetextDropdown).type(value, {
force: true,
parseSpecialCharSequences: false,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(200);
});
});
Cypress.Commands.add("enterNavigatePageName", (value) => {
cy.get("ul.tree")
.children()
.first()
.within(() => {
cy.get(".CodeMirror textarea")
.first()
.focus()
.type("{ctrl}{shift}{downarrow}")
.then(($cm) => {
if ($cm.val() !== "") {
cy.get(".CodeMirror textarea")
.first()
.clear({
force: true,
});
}
cy.get(".CodeMirror textarea")
.first()
.type(value, {
force: true,
parseSpecialCharSequences: false,
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(200);
cy.get(".CodeMirror textarea")
.first()
.should("have.value", value);
});
cy.root();
});
});
Cypress.Commands.add("ClearDate", () => {
cy.get(".t--property-control-defaultdate input").clear();
cy.assertPageSave();
});
Cypress.Commands.add("ClearDateFooter", () => {
cy.get(formWidgetsPage.datepickerFooterPublish)
.contains("Clear")
.click({ force: true });
//cy.assertPageSave();
});
Cypress.Commands.add("DeleteModal", () => {
cy.get(widgetsPage.textbuttonWidget).dblclick("topRight", { force: true });
cy.get(widgetsPage.deleteWidget)
.first()
.click({ force: true });
});
Cypress.Commands.add("Createpage", (pageName, navigateToCanvasPage = true) => {
let pageId;
cy.CreatePage();
cy.wait("@createPage").then((xhr) => {
expect(xhr.response.body.responseMeta.status).to.equal(201);
if (pageName) {
pageId = xhr.response.body.data.id;
cy.wait(2000);
cy.get(`div[id=entity-${pageId}] .t--context-menu`).click({
force: true,
});
cy.get(pages.editName).click({ force: true });
cy.get(pages.editInput).type(pageName + "{enter}");
cy.wrap(pageId).as("currentPageId");
}
cy.get("#loading").should("not.exist");
});
});
Cypress.Commands.add("Deletepage", (Pagename) => {
cy.CheckAndUnfoldEntityItem("Pages");
cy.get(`.t--entity-item:contains(${Pagename})`).within(() => {
cy.get(".t--context-menu").click({ force: true });
});
cy.selectAction("Delete");
cy.selectAction("Are you sure?");
cy.wait("@deletePage");
cy.get("@deletePage").should("have.property", "status", 200);
});
Cypress.Commands.add("dropdownDynamic", (text) => {
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(2000);
cy.get("ul.bp3-menu")
.contains(text)
.click({ force: true })
.should("have.text", text);
});
Cypress.Commands.add("dropdownMultiSelectDynamic", (text) => {
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(2000);
cy.get(".multi-select-dropdown")
.contains(text)
.click({ force: true })
.should("have.text", text);
});
Cypress.Commands.add("treeSelectDropdown", (text) => {
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(2000);
cy.get(".tree-select-dropdown")
.contains(text)
.click({ force: true })
.should("have.text", text);
});
Cypress.Commands.add("treeMultiSelectDropdown", (text) => {
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(2000);
cy.get(".tree-multiselect-dropdown")
.contains(text)
.click({ force: true })
.should("have.text", text);
});
Cypress.Commands.add("dropdownDynamicUpdated", (text) => {
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(2000);
cy.get(commonlocators.dropdownmenu)
.contains(text)
.click({ force: true });
cy.xpath(commonlocators.dropDownOptSelected).should("have.text", text);
});
Cypress.Commands.add("selectTextSize", (text) => {
cy.get(".t--dropdown-option")
.first()
.contains(text)
.click({ force: true });
});
Cypress.Commands.add("selectTxtSize", (text) => {
cy.get(".t--dropdown-option")
.contains(text)
.click({ force: true });
});
Cypress.Commands.add("getAlert", (alertcss) => {
cy.get(commonlocators.dropdownSelectButton).click({ force: true });
cy.get(widgetsPage.menubar)
.contains("Show Alert")
.click({ force: true })
.should("have.text", "Show Alert");
cy.get(alertcss)
.click({ force: true })
.type("hello");
cy.get(".t--open-dropdown-Select-type").click({ force: true });
cy.get(".bp3-popover-content .bp3-menu li")
.contains("Success")
.click({ force: true });
});
Cypress.Commands.add("togglebar", (value) => {
cy.get(value)
.check({ force: true })
.should("be.checked");
});
Cypress.Commands.add("togglebarDisable", (value) => {
cy.get(value)
.uncheck({ force: true })
.should("not.checked");
});
Cypress.Commands.add(
"getAlert",
(alertcss, propertyControl = commonlocators.dropdownSelectButton) => {
cy.get(propertyControl)
.first()
.click({ force: true });
cy.get(widgetsPage.menubar)
.contains("Show message")
.click({ force: true });
cy.get(alertcss)
.click({ force: true })
.type("hello");
cy.get(".t--open-dropdown-Select-type").click({ force: true });
cy.get(".bp3-popover-content .bp3-menu li")
.contains("Success")
.click({ force: true });
},
);
Cypress.Commands.add("addQueryFromLightningMenu", (QueryName) => {
cy.get(commonlocators.dropdownSelectButton)
.first()
.click({ force: true })
.selectOnClickOption("Execute a query")
.selectOnClickOption(QueryName);
});
Cypress.Commands.add("addAPIFromLightningMenu", (ApiName) => {
cy.get(commonlocators.dropdownSelectButton)
.first()
.click({ force: true })
.selectOnClickOption("Execute a query")
.selectOnClickOption(ApiName);
});
Cypress.Commands.add("radioInput", (index, text) => {
cy.get(widgetsPage.RadioInput)
.eq(index)
.click({ force: true })
.clear({ force: true })
.type(text)
.wait(200);
});
Cypress.Commands.add("tabVerify", (index, text) => {
cy.get(".t--property-control-tabs input")
.eq(index)
.click({ force: true })
.clear()
.type(text);
cy.get(LayoutPage.tabWidget)
.contains(text)
.click({ force: true })
.should("be.visible");
});
Cypress.Commands.add("openPropertyPane", (widgetType) => {
const selector = `.t--draggable-${widgetType}`;
cy.wait(500);
cy.get(selector)
.first()
.trigger("mouseover", { force: true })
.wait(500);
cy.get(
`${selector}:first-of-type .t--widget-propertypane-toggle > .t--widget-name`,
)
.first()
.click({ force: true });
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("openPropertyPaneCopy", (widgetType) => {
if (widgetType === "List1Copy") {
cy.SearchEntityandOpen(widgetType);
} else {
const selector = `.t--draggable-${widgetType}`;
cy.get(selector)
.last()
.trigger("mouseover", { force: true })
.wait(500);
cy.get(
`${selector}:first-of-type .t--widget-propertypane-toggle > .t--widget-name`,
)
.first()
.click({ force: true });
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
}
});
Cypress.Commands.add("copyWidget", (widget, widgetLocator) => {
const modifierKey = Cypress.platform === "darwin" ? "meta" : "ctrl";
//Copy widget and verify all properties
cy.get(widgetsPage.propertypaneText)
.children()
.last()
.invoke("text")
.then((x) => {
cy.log(x);
let originalWidget = x.replaceAll("x", "");
originalWidget = originalWidget.replaceAll(/\u200B/g, "");
cy.log(originalWidget);
cy.get(widgetsPage.copyWidget).click({ force: true });
cy.wait(3000);
cy.reload();
// Wait for the widget to be appear in the DOM and press Ctrl/Cmd + V to paste the button.
cy.get(widgetLocator).should("be.visible");
cy.wait(1000);
cy.get("body").type(`{${modifierKey}}v`);
cy.wait(3000);
cy.openPropertyPaneCopy(widget);
cy.get(widgetsPage.propertypaneText)
.children()
.last()
.invoke("text")
.then((y) => {
cy.log(y);
let copiedWidget = y.replaceAll("x", "");
copiedWidget = copiedWidget.replaceAll(/\u200B/g, "");
cy.log(copiedWidget);
expect(originalWidget).to.be.equal(copiedWidget);
});
});
});
Cypress.Commands.add("deleteWidget", () => {
// Delete the button widget
cy.get(widgetsPage.removeWidget).click({ force: true });
cy.wait(3000);
cy.wait("@updateLayout");
});
Cypress.Commands.add("UpdateChartType", (typeOfChart) => {
// Command to change the chart type if the property pane of the chart widget is opened.
cy.get(viewWidgetsPage.chartType)
.last()
.click({ force: true });
cy.get(commonlocators.dropdownmenu)
.children()
.contains(typeOfChart)
.click({ force: true });
cy.get(viewWidgetsPage.chartType + " span.cs-text").should(
"have.text",
typeOfChart,
);
});
Cypress.Commands.add("alertValidate", (text) => {
cy.get(commonlocators.success)
.should("be.visible")
.and("have.text", text);
});
Cypress.Commands.add("ExportVerify", (togglecss, name) => {
cy.togglebar(togglecss);
cy.get(".t--draggable-tablewidget button")
.invoke("attr", "aria-label")
.should("contain", name);
cy.togglebarDisable(togglecss);
});
Cypress.Commands.add("getTableDataSelector", (rowNum, colNum) => {
const selector = `.t--widget-tablewidget .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] div div`;
return selector;
});
Cypress.Commands.add("getTableV2DataSelector", (rowNum, colNum) => {
const selector = `.t--widget-tablewidgetv2 .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}]`;
return selector;
});
Cypress.Commands.add("readTabledata", (rowNum, colNum) => {
// const selector = `.t--draggable-tablewidget .e-gridcontent.e-lib.e-droppable td[index=${rowNum}][aria-colindex=${colNum}]`;
const selector = `.tbody .td[data-rowindex="${rowNum}"][data-colindex="${colNum}"] div div`;
const tabVal = cy.get(selector).invoke("text");
return tabVal;
});
Cypress.Commands.add("readTableV2data", (rowNum, colNum) => {
// const selector = `.t--draggable-tablewidget .e-gridcontent.e-lib.e-droppable td[index=${rowNum}][aria-colindex=${colNum}]`;
const selector = `.tbody .td[data-rowindex="${rowNum}"][data-colindex="${colNum}"]`;
const tabVal = cy.get(selector).invoke("text");
return tabVal;
});
Cypress.Commands.add(
"readTabledataPublish",
(rowNum, colNum, shouldNotGoOneLeveDeeper) => {
// const selector = `.t--widget-tablewidget .e-gridcontent.e-lib.e-droppable td[index=${rowNum}][aria-colindex=${colNum}]`;
const selector = `.t--widget-tablewidget .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] div ${
!shouldNotGoOneLeveDeeper ? "div" : ""
}`;
const tabVal = cy.get(selector).invoke("text");
return tabVal;
},
);
Cypress.Commands.add("readTableV2dataPublish", (rowNum, colNum) => {
const selector = `.t--widget-tablewidgetv2 .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}]`;
const tabVal = cy.get(selector).invoke("text");
return tabVal;
});
Cypress.Commands.add(
"readTabledataValidateCSS",
(rowNum, colNum, cssProperty, cssValue, shouldNotGotOneLeveDeeper) => {
const selector = `.t--widget-tablewidget .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] div ${
!shouldNotGotOneLeveDeeper ? "div" : ""
}`;
cy.get(selector).should("have.css", cssProperty, cssValue);
},
);
Cypress.Commands.add(
"readTableV2dataValidateCSS",
(rowNum, colNum, cssProperty, cssValue) => {
const selector = `.t--widget-tablewidgetv2 .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] .cell-wrapper`;
cy.get(selector).should("have.css", cssProperty, cssValue);
},
);
Cypress.Commands.add(
"readTabledataFromSpecificIndex",
(rowNum, colNum, index) => {
// const selector = `.t--widget-tablewidget .e-gridcontent.e-lib.e-droppable td[index=${rowNum}][aria-colindex=${colNum}]`;
const selector = `.t--widget-tablewidget .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] div`;
const tabVal = cy
.get(selector)
.eq(index)
.invoke("text");
return tabVal;
},
);
Cypress.Commands.add(
"readTableV2dataFromSpecificIndex",
(rowNum, colNum, index) => {
const selector = `.t--widget-tablewidgetv2 .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}]`;
const tabVal = cy
.get(selector)
.eq(index)
.invoke("text");
return tabVal;
},
);
Cypress.Commands.add("tablefirstdataRow", () => {
let tabVal = cy
.xpath(
"//div[@class='tableWrap']//div[@class='table']//div[contains(@class, 'tbody')]/div[@class='tr']/div[@class ='td']",
{ timeout: 10000 },
)
.first()
.invoke("text");
return tabVal;
});
Cypress.Commands.add("scrollTabledataPublish", (rowNum, colNum) => {
const selector = `.t--widget-tablewidget .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] div div`;
const tabVal = cy
.get(selector)
.scrollIntoView()
.invoke("text");
return tabVal;
});
Cypress.Commands.add("readTableLinkPublish", (rowNum, colNum) => {
const selector = `.t--widget-tablewidget .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] div .image-cell-wrapper .image-cell`;
const bgUrl = cy.get(selector).should("have.css", "background-image");
return bgUrl;
});
Cypress.Commands.add("readTableV2LinkPublish", (rowNum, colNum) => {
const selector = `.t--widget-tablewidgetv2 .tbody .td[data-rowindex=${rowNum}][data-colindex=${colNum}] div .image-cell-wrapper .image-cell`;
const bgUrl = cy.get(selector).should("have.attr", "src");
return bgUrl;
});
Cypress.Commands.add("assertEvaluatedValuePopup", (expectedType) => {
cy.get(commonlocators.evaluatedTypeTitle)
.first()
.find("span")
.click();
cy.get(dynamicInputLocators.evaluatedValue)
.should("be.visible")
.find("pre")
.first()
.should("have.text", expectedType);
});
Cypress.Commands.add("validateToastMessage", (value) => {
cy.get(commonlocators.toastMsg).should("contain.text", value);
});
Cypress.Commands.add(
"validateWidgetExists",
{ prevSubject: true },
(selector) => {
cy.get(selector).should("exist");
},
);
Cypress.Commands.add("clearPropertyValue", (value) => {
cy.EnableAllCodeEditors();
cy.get(".CodeMirror textarea")
.eq(value)
.focus({ force: true })
.type("{uparrow}", { force: true })
.type("{ctrl}{shift}{downarrow}", { force: true });
cy.focused().then(($cm) => {
if ($cm.contents !== "") {
cy.log("The field is empty");
cy.get(".CodeMirror textarea")
.eq(value)
.clear({
force: true,
});
}
});
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("deleteQueryOrJS", (Action) => {
cy.CheckAndUnfoldEntityItem("Queries/JS");
cy.get(`.t--entity-item:contains(${Action})`).within(() => {
cy.get(".t--context-menu").click({ force: true });
});
cy.selectAction("Delete");
cy.selectAction("Are you sure?");
cy.wait("@deleteAction");
cy.get("@deleteAction").should("have.property", "status", 200);
});
Cypress.Commands.add(
"validateNSelectDropdown",
(ddTitle, currentValue, newValue) => {
let toChange = false;
cy.xpath('//span[contains(text(),"' + currentValue + '")]').should(
"exist",
currentValue + " dropdown value not present",
);
if (newValue) toChange = true;
if (toChange) {
cy.xpath(
"//p[text()='" +
ddTitle +
"']/parent::label/following-sibling::div/div/div",
).click(); //to expand the dropdown
cy.xpath('//span[contains(text(),"' + newValue + '")]')
.last()
.click({ force: true }); //to select the new value
}
},
);
Cypress.Commands.add("EnableAllCodeEditors", () => {
cy.wait(2000);
cy.get("body").then(($body) => {
if ($body.get(commonlocators.codeEditorWrapper)?.length > 0) {
let count = $body.get(commonlocators.codeEditorWrapper)?.length || 0;
while (count) {
$body
.get(commonlocators.codeEditorWrapper)
?.eq(0)
.then(($el) => $el.click({ force: true }).wait(100));
count = $body.find(commonlocators.codeEditorWrapper)?.length || 0;
}
}
});
cy.wait(1000);
});
Cypress.Commands.add("getTableCellHeight", (x, y) => {
return cy
.get(
`.t--widget-tablewidgetv2 .tbody .td[data-colindex=${x}][data-rowindex=${y}] .cell-wrapper div`,
)
.invoke("css", "height");
});
Cypress.Commands.add("hoverTableCell", (x, y) => {
return cy.get(`[data-colindex="${x}"][data-rowindex="${y}"]`).then((ele) => {
const { left, top } = ele[0].getBoundingClientRect();
cy.get(
`[data-colindex=${x}][data-rowindex=${y}] .t--table-text-cell`,
).trigger("mousemove", top + 5, left + 5, {
eventConstructor: "MouseEvent",
force: true,
});
});
});
Cypress.Commands.add("editTableCell", (x, y) => {
cy.get(`[data-colindex="${x}"][data-rowindex="${y}"] .t--editable-cell-icon`)
.invoke("show")
.click({ force: true });
cy.get(
`[data-colindex="${x}"][data-rowindex="${y}"] .t--inlined-cell-editor input.bp3-input`,
).should("exist");
});
Cypress.Commands.add("editTableSelectCell", (x, y) => {
cy.get(`[data-colindex="${x}"][data-rowindex="${y}"] .t--editable-cell-icon`)
.invoke("show")
.click({ force: true });
cy.get(`[data-colindex="${x}"][data-rowindex="${y}"] .select-button`).should(
"exist",
);
});
Cypress.Commands.add("makeColumnEditable", (column) => {
cy.get(
`[data-rbd-draggable-id="${column}"] .t--card-checkbox input+span`,
).click();
});
Cypress.Commands.add("enterTableCellValue", (x, y, text) => {
cy.get(
`[data-colindex="${x}"][data-rowindex="${y}"] .t--inlined-cell-editor input.bp3-input`,
).clear();
if (text) {
cy.get(
`[data-colindex="${x}"][data-rowindex="${y}"] .t--inlined-cell-editor input.bp3-input`,
)
.focus()
.type(text);
}
});
Cypress.Commands.add("discardTableCellValue", (x, y) => {
cy.get(
`[data-colindex="${x}"][data-rowindex="${y}"] .t--inlined-cell-editor input.bp3-input`,
).type("{esc}", { force: true });
});
Cypress.Commands.add("saveTableCellValue", (x, y) => {
cy.get(
`[data-colindex="${x}"][data-rowindex="${y}"] .t--inlined-cell-editor input.bp3-input`,
).type("{enter}", { force: true });
});
Cypress.Commands.add("saveTableRow", (x, y) => {
cy.get(
`[data-colindex="${x}"][data-rowindex="${y}"] button span:contains('Save')`,
).click({ force: true });
});
Cypress.Commands.add("discardTableRow", (x, y) => {
cy.get(
`[data-colindex="${x}"][data-rowindex="${y}"] button span:contains('Discard')`,
).click({ force: true });
});
Cypress.Commands.add("moveToStyleTab", () => {
cy.get(commonlocators.propertyStyle)
.first()
.click({ force: true });
});
Cypress.Commands.add("moveToContentTab", () => {
cy.get(commonlocators.propertyContent)
.first()
.click({ force: true });
});
Cypress.Commands.add("openPropertyPaneWithIndex", (widgetType, index) => {
const selector = `.t--draggable-${widgetType}`;
cy.wait(500);
cy.get(selector)
.eq(index)
.scrollIntoView()
.trigger("mouseover", { force: true })
.wait(500);
cy.get(
`${selector}:first-of-type .t--widget-propertypane-toggle > .t--widget-name`,
)
.eq(index)
.scrollIntoView()
.click({ force: true });
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(1000);
});
Cypress.Commands.add("changeLayoutHeight", (locator) => {
cy.get(".t--property-control-height .remixicon-icon")
.should("be.visible")
.click({ force: true });
cy.get(locator).click({ force: true });
cy.wait("@updateLayout").should(
"have.nested.property",
"response.body.responseMeta.status",
200,
);
});
Cypress.Commands.add("changeLayoutHeightWithoutWait", (locator) => {
cy.get(".t--property-control-height .remixicon-icon")
.should("be.visible")
.click({ force: true });
cy.get(locator).click({ force: true });
});
Cypress.Commands.add("checkMinDefaultValue", (endp, value) => {
cy.get(".cm-m-null")
.first()
.invoke("text")
.then((text) => {
const someText = text;
cy.log(someText);
expect(someText).to.equal(value);
});
});
Cypress.Commands.add("checkMaxDefaultValue", (endp, value) => {
cy.get(".cm-m-null")
.last()
.invoke("text")
.then((text) => {
const someText = text;
cy.log(someText);
expect(someText).to.equal(value);
});
});