Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

test: fixed datepicker skipped tests set 2 (#37126)

Browse Source 
Updated common method to suite both v1 and v2
Skipped test updated
locator change handled

EE PR: https://github.com/appsmithorg/appsmith-ee/pull/5477
/ok-to-test tags="@tag.All"



<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/11677761197>
> Commit: 56ecbce50bef806998c83ffe585482a32eff120b
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=11677761197&attempt=2"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.All`
> Spec:
> <hr>Tue, 05 Nov 2024 06:59:10 UTC
<!-- end of auto-generated comment: Cypress test results  -->


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **New Features**
- Enhanced date selection process in DatePicker widget with improved
test interactions.
- Introduced a new structured JSON layout for the user interface,
including multiple interactive widgets.

- **Bug Fixes**
- Activated previously skipped tests to ensure comprehensive validation
of DatePicker functionality.

- **Documentation**
- Updated locators for form widgets to improve selector accuracy and
functionality.

- **Chores**
- Refined various Cypress commands related to widget interactions for
better reliability and performance.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: “NandanAnantharamu” <“nandan@thinkify.io”>
This commit is contained in:
NandanAnantharamu 2024-11-05 17:11:02 +05:30 committed by GitHub
parent 79a7979839
commit 0b2cffb3b7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 577 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
app/client/cypress/e2e/Regression/ClientSide/Binding/DatePicker_Text_spec.js
View File

@ -14,7 +14,7 @@ describe(
_.agHelper.AddDsl("uiBindDsl");
});
// Skipping tests due to issue - https://www.notion.so/appsmith/f353d8c6bd664f79ad858a42010cdfc8?v=f04cde23f6424aeb9d5a6e389cd172bd&p=0717892d43684c40bae4e2c87b8308cb&pm=s
it.skip("1. DatePicker-Text, Validate selectedDate functionality", function () {
it("1. DatePicker-Text, Validate selectedDate functionality", function () {
/**
* Bind DatePicker1 to Text for "selectedDate"
*/
@ -25,9 +25,8 @@ describe(
* Set the Calender for today's date in DatePicker1
*/
cy.openPropertyPane("datepickerwidget");
cy.get(formWidgetsPage.defaultDate).click();
cy.ClearDateFooter();
cy.SetDateToToday();
cy.get(formWidgetsPage.datepickerWidget).first().click();
cy.get(formWidgetsPage.datepickerFooter).contains("Today").click();
cy.getDate(1, "YYYY-MM-DD").then((date) => {
cy.log("retured date" + date);
@ -43,15 +42,15 @@ describe(
cy.get(publishPage.datepickerWidget + commonlocators.inputField)
.eq(0)
.click();
cy.ClearDateFooter();
cy.setDate(1, "ddd MMM DD YYYY");
cy.SetDateToToday();
cy.setDate(1, "ddd MMM DD YYYY", "v1");
cy.get(commonlocators.labelTextStyle).should("contain", nextDay);
});
cy.get(commonlocators.backToEditor).click();
});
it.skip("2. DatePicker1-text: Change the date in DatePicker1 and Validate the same in text widget", function () {
it("2. DatePicker1-text: Change the date in DatePicker1 and Validate the same in text widget", function () {
cy.openPropertyPane("textwidget");
/**
@ -75,9 +74,9 @@ describe(
*/
cy.openPropertyPane("datepickerwidget");
cy.get(formWidgetsPage.defaultDate).click();
cy.ClearDateFooter();
cy.setDate(1, "ddd MMM DD YYYY");
// cy.get(commonlocators.onDateSelectedField).click();
cy.get(formWidgetsPage.dayPickerToday).click();
cy.get(formWidgetsPage.defaultDate).click();
cy.setDate(1);
/**
*Validate the date in text widget
@ -89,7 +88,7 @@ describe(
});
});
it.skip("3. Validate the Date is not changed in DatePicker2", function () {
it("3. Validate the Date is not changed in DatePicker2", function () {
cy.log("dateDp2:" + dateDp2);
cy.get(formWidgetsPage.datepickerWidget + commonlocators.inputField)
.eq(1)
@ -124,7 +123,7 @@ describe(
_.deployMode.NavigateBacktoEditor();
});
it.skip("5. Checks if on deselection of date triggers the onDateSelected action or not.", function () {
it("5. Checks if on deselection of date triggers the onDateSelected action or not.", function () {
/**
* bind datepicker to show a message "Hello" on date selected
*/
@ -135,7 +134,6 @@ describe(
* checking if on selecting the date triggers the message
*/
cy.get(formWidgetsPage.datepickerWidget).first().click();
cy.ClearDateFooter();
cy.SetDateToToday();
cy.get(commonlocators.toastmsg).contains("hello");

2
app/client/cypress/e2e/Regression/ClientSide/Widgets/Datepicker/DatePicker2_spec.js
View File

@ -22,7 +22,7 @@ describe(
it("DatePicker-Date Name validation", function () {
// changing the date to today
cy.get(formWidgetsPage.defaultDate).click();
cy.SetDateToToday();
cy.get(formWidgetsPage.dayPickerToday).click();
//changing the Button Name
cy.widgetText(

21
app/client/cypress/e2e/Regression/ClientSide/Widgets/Datepicker/DatePicker_With_Switch_spec.js
View File

@ -28,11 +28,14 @@ describe(
cy.closePropertyPane();
});
// Skipping tests due to issue - https://www.notion.so/appsmith/f353d8c6bd664f79ad858a42010cdfc8?v=f04cde23f6424aeb9d5a6e389cd172bd&p=0717892d43684c40bae4e2c87b8308cb&pm=s
it.skip("Date Widget with Reset widget being switch widget", function () {
it("Date Widget with Reset widget being switch widget", function () {
EditorNavigation.SelectEntityByName("DatePicker1", EntityType.Widget);
cy.get(formWidgetsPage.datePickerInput).click();
_.agHelper.GetNClick(widgetsPage.todayText);
cy.get(formWidgetsPage.defaultDate).click();
_.agHelper.GetNClick(".ads-v2-datepicker__calender-today");
cy.get(formWidgetsPage.defaultDate).click();
cy.SetDateToToday();
cy.setDate(1, "ddd MMM DD YYYY");
const nextDay = dayjs().format("DD/MM/YYYY");
cy.log(nextDay);
@ -51,18 +54,10 @@ describe(
cy.get(widgetsPage.switchWidgetInactive).should("be.visible");
});
it.skip("DatePicker-Date change and validate switch widget status", function () {
it("DatePicker-Date change and validate switch widget status", function () {
cy.get(widgetsPage.datepickerInput).click({ force: true });
cy.SetDateToToday();
cy.get(widgetsPage.switchWidgetActive).should("be.visible");
cy.get(".t--toast-action span")
.last()
.invoke("text")
.then((text) => {
const toasttext = text;
cy.log(toasttext);
expect(text.trim()).to.equal(toasttext.trim());
});
_.agHelper.GetNClick(widgetsPage.todayText);
_.agHelper.AssertClassExists(".bp3-switch", "t--switch-widget-active");
});
},
);

540
app/client/cypress/fixtures/uiBindnewDsl.json Normal file
View File

@ -0,0 +1,540 @@
{
"dsl": {
"widgetName": "MainContainer",
"backgroundColor": "none",
"rightColumn": 4896,
"snapColumns": 64,
"detachFromLayout": true,
"widgetId": "0",
"topRow": 0,
"bottomRow": 600,
"containerStyle": "none",
"snapRows": 124,
"parentRowSpace": 1,
"type": "CANVAS_WIDGET",
"canExtend": true,
"version": 90,
"minHeight": 1292,
"parentColumnSpace": 1,
"dynamicBindingPathList": [],
"leftColumn": 0,
"children": [
{
"boxShadow": "none",
"widgetName": "Container1",
"topRow": 0,
"bottomRow": 60,
"parentRowSpace": 38,
"type": "CONTAINER_WIDGET",
"parentColumnSpace": 75.25,
"dynamicBindingPathList": [],
"leftColumn": 0,
"children": [
{
"labelTextSize": "0.875rem",
"boxShadow": "none",
"backgroundColor": "#FFFFFF",
"widgetName": "utncsu66ty",
"rightColumn": 2408,
"orientation": "VERTICAL",
"snapColumns": 16,
"detachFromLayout": true,
"widgetId": "acizsl94my",
"containerStyle": "none",
"topRow": 0,
"bottomRow": 380,
"parentRowSpace": 1,
"isVisible": true,
"type": "CANVAS_WIDGET",
"canExtend": false,
"version": 1,
"isLoading": false,
"parentColumnSpace": 1,
"leftColumn": 0,
"dynamicBindingPathList": [],
"borderRadius": "0px",
"children": [
{
"boxShadow": "none",
"widgetName": "Text5",
"topRow": 28,
"bottomRow": 32,
"parentRowSpace": 38,
"type": "TEXT_WIDGET",
"parentColumnSpace": 62.484375,
"overflow": "NONE",
"fontFamily": "System Default",
"dynamicTriggerPathList": [],
"leftColumn": 16,
"dynamicBindingPathList": [
{
"key": "text"
}
],
"text": "{{DatePicker1.selectedDate}}",
"labelTextSize": "0.875rem",
"rightColumn": 32,
"textAlign": "LEFT",
"dynamicHeight": "FIXED",
"widgetId": "t7c7i4gv0f",
"isVisible": true,
"fontStyle": "BOLD",
"version": 1,
"textColor": "#231F20",
"parentId": "acizsl94my",
"isLoading": false,
"borderRadius": "0px",
"maxDynamicHeight": 9000,
"fontSize": "0.875rem",
"minDynamicHeight": 4
},
{
"needsErrorInfo": false,
"boxShadow": "none",
"mobileBottomRow": 12,
"widgetName": "DatePicker1",
"minDate": "1920-12-31T18:30:00.000Z",
"dateFormat": "YYYY-MM-DD HH:mm",
"topRow": 5,
"bottomRow": 12,
"shortcuts": false,
"parentRowSpace": 10,
"labelWidth": 5,
"type": "DATE_PICKER_WIDGET2",
"mobileRightColumn": 30,
"animateLoading": true,
"parentColumnSpace": 7.26171875,
"leftColumn": 10,
"dynamicBindingPathList": [
{
"key": "accentColor"
},
{
"key": "borderRadius"
}
],
"labelPosition": "Top",
"isDisabled": false,
"key": "frcocd42ul",
"labelTextSize": "0.875rem",
"isRequired": false,
"defaultDate": "2024-10-24T07:39:07.659Z",
"rightColumn": 30,
"dynamicHeight": "FIXED",
"widgetId": "pwo88q4udx",
"accentColor": "{{appsmith.theme.colors.primaryColor}}",
"minWidth": 450,
"isVisible": true,
"datePickerType": "DATE_PICKER",
"label": "Label",
"version": 2,
"parentId": "acizsl94my",
"labelAlignment": "left",
"renderMode": "CANVAS",
"isLoading": false,
"mobileTopRow": 5,
"timePrecision": "minute",
"responsiveBehavior": "fill",
"borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}",
"mobileLeftColumn": 10,
"maxDynamicHeight": 9000,
"firstDayOfWeek": 0,
"closeOnSelection": true,
"maxDate": "2121-12-31T18:29:00.000Z",
"minDynamicHeight": 4
},
{
"needsErrorInfo": false,
"boxShadow": "none",
"mobileBottomRow": 22,
"widgetName": "DatePicker2",
"minDate": "1920-12-31T18:30:00.000Z",
"dateFormat": "YYYY-MM-DD HH:mm",
"topRow": 14,
"bottomRow": 21,
"shortcuts": false,
"parentRowSpace": 10,
"labelWidth": 5,
"type": "DATE_PICKER_WIDGET2",
"mobileRightColumn": 29,
"animateLoading": true,
"parentColumnSpace": 7.26171875,
"leftColumn": 10,
"dynamicBindingPathList": [
{
"key": "accentColor"
},
{
"key": "borderRadius"
}
],
"labelPosition": "Top",
"isDisabled": false,
"key": "frcocd42ul",
"labelTextSize": "0.875rem",
"isRequired": false,
"defaultDate": "2024-10-24T07:39:07.659Z",
"rightColumn": 30,
"dynamicHeight": "FIXED",
"widgetId": "gwcu42z6yn",
"accentColor": "{{appsmith.theme.colors.primaryColor}}",
"minWidth": 450,
"isVisible": true,
"datePickerType": "DATE_PICKER",
"label": "Label",
"version": 2,
"parentId": "acizsl94my",
"labelAlignment": "left",
"renderMode": "CANVAS",
"isLoading": false,
"mobileTopRow": 15,
"timePrecision": "minute",
"responsiveBehavior": "fill",
"borderRadius": "{{appsmith.theme.borderRadius.appBorderRadius}}",
"mobileLeftColumn": 9,
"maxDynamicHeight": 9000,
"firstDayOfWeek": 0,
"closeOnSelection": true,
"maxDate": "2121-12-31T18:29:00.000Z",
"minDynamicHeight": 4
}
]
}
],
"labelTextSize": "0.875rem",
"backgroundColor": "#FFFFFF",
"rightColumn": 56,
"orientation": "VERTICAL",
"snapColumns": 16,
"dynamicHeight": "FIXED",
"widgetId": "mp429a7dl3",
"containerStyle": "card",
"isVisible": true,
"version": 1,
"isLoading": false,
"borderRadius": "0px",
"maxDynamicHeight": 9000,
"minDynamicHeight": 4
},
{
"boxShadow": "none",
"widgetName": "Modal1",
"topRow": 0,
"bottomRow": 0,
"parentRowSpace": 1,
"type": "MODAL_WIDGET",
"shouldScrollContents": true,
"parentColumnSpace": 1,
"leftColumn": 0,
"dynamicBindingPathList": [],
"children": [
{
"boxShadow": "none",
"widgetName": "Canvas1",
"topRow": 0,
"bottomRow": 240,
"parentRowSpace": 1,
"canExtend": true,
"type": "CANVAS_WIDGET",
"shouldScrollContents": false,
"minHeight": 0,
"parentColumnSpace": 1,
"leftColumn": 0,
"dynamicBindingPathList": [],
"children": [
{
"labelTextSize": "0.875rem",
"isRequired": false,
"boxShadow": "none",
"widgetName": "Icon1",
"rightColumn": 64,
"onClick": "{{closeModal(Modal1.name)}}",
"iconName": "cross",
"buttonColor": "#2E3D49",
"widgetId": "t3sjfihdb1",
"topRow": 0,
"bottomRow": 4,
"isVisible": true,
"type": "ICON_BUTTON_WIDGET",
"version": 1,
"parentId": "cwamdbv44c",
"isLoading": false,
"leftColumn": 60,
"dynamicBindingPathList": [],
"borderRadius": "0px",
"buttonVariant": "TERTIARY",
"iconSize": 24
},
{
"boxShadow": "none",
"widgetName": "Text4",
"dynamicPropertyPathList": [
{
"key": "fontSize"
}
],
"topRow": 0,
"bottomRow": 4,
"type": "TEXT_WIDGET",
"overflow": "NONE",
"fontFamily": "System Default",
"leftColumn": 0,
"dynamicBindingPathList": [],
"text": "Modal Title",
"labelTextSize": "0.875rem",
"rightColumn": 60,
"dynamicHeight": "FIXED",
"widgetId": "x893ud3zjh",
"isVisible": true,
"fontStyle": "BOLD",
"version": 1,
"textColor": "#231F20",
"parentId": "cwamdbv44c",
"isLoading": false,
"borderRadius": "0px",
"maxDynamicHeight": 9000,
"fontSize": "1.5rem",
"minDynamicHeight": 4
},
{
"labelTextSize": "0.875rem",
"boxShadow": "none",
"widgetName": "Button2",
"rightColumn": 52,
"isDefaultClickDisabled": true,
"buttonColor": "#03B365",
"widgetId": "q9snwskqan",
"topRow": 16,
"bottomRow": 20,
"isVisible": true,
"type": "BUTTON_WIDGET",
"version": 1,
"recaptchaType": "V3",
"parentId": "cwamdbv44c",
"isLoading": false,
"leftColumn": 40,
"dynamicBindingPathList": [],
"borderRadius": "0px",
"buttonVariant": "PRIMARY",
"text": "Cancel",
"isDisabled": false
},
{
"labelTextSize": "0.875rem",
"boxShadow": "none",
"widgetName": "Button3",
"rightColumn": 64,
"isDefaultClickDisabled": true,
"buttonColor": "#03B365",
"widgetId": "tufuj2kdpz",
"topRow": 16,
"bottomRow": 20,
"isVisible": true,
"type": "BUTTON_WIDGET",
"version": 1,
"recaptchaType": "V3",
"parentId": "cwamdbv44c",
"isLoading": false,
"leftColumn": 52,
"dynamicBindingPathList": [],
"borderRadius": "0px",
"buttonVariant": "PRIMARY",
"text": "Confirm",
"isDisabled": false
}
],
"isDisabled": false,
"labelTextSize": "0.875rem",
"rightColumn": 0,
"detachFromLayout": true,
"widgetId": "cwamdbv44c",
"isVisible": true,
"version": 1,
"parentId": "bx9a2jg08o",
"blueprint": {
"view": [
{
"type": "ICON_WIDGET",
"position": {
"left": 15,
"top": 0
},
"size": {
"rows": 1,
"cols": 1
},
"props": {
"iconName": "cross",
"iconSize": 24,
"color": "#040627"
}
},
{
"type": "TEXT_WIDGET",
"position": {
"left": 0,
"top": 0
},
"size": {
"rows": 1,
"cols": 15
},
"props": {
"text": "Modal Title",
"textStyle": "HEADING"
}
},
{
"type": "BUTTON_WIDGET",
"position": {
"left": 10,
"top": 4
},
"size": {
"rows": 1,
"cols": 3
},
"props": {
"text": "Cancel",
"buttonStyle": "SECONDARY_BUTTON"
}
},
{
"type": "BUTTON_WIDGET",
"position": {
"left": 13,
"top": 4
},
"size": {
"rows": 1,
"cols": 3
},
"props": {
"text": "Confirm",
"buttonStyle": "PRIMARY_BUTTON"
}
}
],
"operations": [
{
"type": "MODIFY_PROPS"
}
]
},
"isLoading": false,
"borderRadius": "0px"
}
],
"height": 240,
"labelTextSize": "0.875rem",
"rightColumn": 0,
"detachFromLayout": true,
"dynamicHeight": "FIXED",
"widgetId": "bx9a2jg08o",
"isVisible": false,
"canOutsideClickClose": true,
"canEscapeKeyClose": true,
"version": 2,
"parentId": "0",
"blueprint": {
"view": [
{
"type": "CANVAS_WIDGET",
"position": {
"left": 0,
"top": 0
},
"props": {
"detachFromLayout": true,
"canExtend": true,
"isVisible": true,
"isDisabled": false,
"shouldScrollContents": false,
"children": [],
"blueprint": {
"view": [
{
"type": "ICON_WIDGET",
"position": {
"left": 15,
"top": 0
},
"size": {
"rows": 1,
"cols": 1
},
"props": {
"iconName": "cross",
"iconSize": 24,
"color": "#040627"
}
},
{
"type": "TEXT_WIDGET",
"position": {
"left": 0,
"top": 0
},
"size": {
"rows": 1,
"cols": 15
},
"props": {
"text": "Modal Title",
"textStyle": "HEADING"
}
},
{
"type": "BUTTON_WIDGET",
"position": {
"left": 10,
"top": 4
},
"size": {
"rows": 1,
"cols": 3
},
"props": {
"text": "Cancel",
"buttonStyle": "SECONDARY_BUTTON"
}
},
{
"type": "BUTTON_WIDGET",
"position": {
"left": 13,
"top": 4
},
"size": {
"rows": 1,
"cols": 3
},
"props": {
"text": "Confirm",
"buttonStyle": "PRIMARY_BUTTON"
}
}
],
"operations": [
{
"type": "MODIFY_PROPS"
}
]
}
}
}
]
},
"isLoading": false,
"borderRadius": "0px",
"maxDynamicHeight": 9000,
"width": 456,
"minDynamicHeight": 4
}
]
},
"layoutOnLoadActions": [],
"layoutOnLoadActionErrors": [],
"actionUpdates": [],
"messages": []
}

3
app/client/cypress/locators/FormWidgets.json
View File

@ -78,5 +78,6 @@
"minDateTextArea" : ".t--property-control-mindate .CodeMirror textarea",
"minDateInput" : ".t--property-control-mindate .ads-v2-input__input-section-input",
"datePickerInput": ".t--widget-datepickerwidget2 .bp3-input",
"dayPickerNextButton": ".DayPicker-NavButton--next"
"dayPickerNextButton": ".DayPicker-NavButton--next",
"dayPickerToday": ".ads-v2-datepicker__calender-today"
}

4
app/client/cypress/locators/Widgets.json
View File

@ -234,5 +234,7 @@
"propertyPaneSaveButton": ".t--property-pane-section-collapse-savebutton",
"firstEditInput":"[data-colindex=0][data-rowindex=0] .t--inlined-cell-editor input.bp3-input",
"cellControlSwitch" : ".t--property-control-cellwrapping .ads-v2-switch",
"propertyControlLabel" : ".t--property-control-label"
"propertyControlLabel" : ".t--property-control-label",
"todayText": "span:contains('Today')",
"dayPickerToday": ".DayPicker-Day--today"
}

14
app/client/cypress/support/commands.js
View File

@ -526,9 +526,17 @@ Cypress.Commands.add("getDate", (date, dateFormate) => {
return eDate;
});
Cypress.Commands.add("setDate", (date) => {
const expDate = dayjs().add(date, "days").format("dddd, MMMM Do, YYYY");
cy.get(`.react-datepicker__day[aria-label^="Choose ${expDate}"]`).click();
Cypress.Commands.add("setDate", (date, dateFormate, ver = "v2") => {
if (ver == "v2") {
const expDate = dayjs().add(date, "days").format("dddd, MMMM D");
cy.get(`.react-datepicker__day[aria-label^="Choose ${expDate}"]`)
.first()
.click();
} else if (ver == "v1") {
const expDate = dayjs().add(date, "days").format(dateFormate);
const sel = `.DayPicker-Day[aria-label=\"${expDate}\"]`;
cy.get(sel).click();
}
});
Cypress.Commands.add("validateDisableWidget", (widgetCss, disableCss) => {

2
app/client/cypress/support/widgetCommands.js
View File

@ -837,7 +837,7 @@ Cypress.Commands.add("selectWidgetForReset", (value) => {
});
Cypress.Commands.add("SetDateToToday", () => {
cy.get(".react-datepicker .react-datepicker__day--today").click({
cy.get("button:contains('Today')").click({
force: true,
});
agHelper.AssertAutoSave();