test: cypress - updated dateColumn test from js to ts (#25043)
Updated Flaky tests Date_column_editing_1_spec.js and Date_column_editing_2_spec.js to ts.
This commit is contained in:
NandanAnantharamu
GitHub
parent
ed5428dca3
commit
163aecf5c3
|
|
@ -1,207 +0,0 @@
|
|||
const commonlocators = require("../../../../../locators/commonlocators.json");
|
||||
import {
|
||||
agHelper,
|
||||
propPane,
|
||||
table,
|
||||
} from "../../../../../support/Objects/ObjectsCore";
|
||||
|
||||
describe("Table widget date column inline editing functionality", () => {
|
||||
before(() => {
|
||||
agHelper.AddDsl("Table/DateCellEditingDSL");
|
||||
});
|
||||
|
||||
it("1. should check that edit check box is enabled for date type column in the columns list", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.get(
|
||||
`[data-rbd-draggable-id="release_date"] .t--card-checkbox input`,
|
||||
).should("not.be.disabled");
|
||||
});
|
||||
|
||||
it("2. should check that date cell edit mode can be turned on", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(
|
||||
".t--property-pane-section-general .t--property-control-editable",
|
||||
).should("exist");
|
||||
cy.get(
|
||||
".t--property-pane-section-general .t--property-control-editable input[type=checkbox]",
|
||||
).click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Head} [data-header="release_date"] svg`,
|
||||
).should("exist");
|
||||
});
|
||||
|
||||
it("3. should check that user can edit date in table cell", () => {
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick();
|
||||
cy.get(".bp3-dateinput-popover").should("exist");
|
||||
cy.get(".t--inlined-cell-editor").should("exist");
|
||||
cy.get(".bp3-dateinput-popover [aria-label='Mon May 17 2021']").click();
|
||||
cy.get(".bp3-dateinput-popover").should("not.exist");
|
||||
cy.get(".t--inlined-cell-editor").should("not.exist");
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).should("contain", "2021-05-17T00:00:00");
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(".bp3-dateinput-popover").should("exist");
|
||||
cy.get(".t--inlined-cell-editor").should("exist");
|
||||
cy.get(`${commonlocators.textWidget}`).first().click();
|
||||
cy.get(".bp3-dateinput-popover").should("not.exist");
|
||||
cy.get(".t--inlined-cell-editor").should("not.exist");
|
||||
cy.get(
|
||||
`[type='CANVAS_WIDGET'] .t--widget-textwidget ${commonlocators.textWidget} span`,
|
||||
).should(
|
||||
"contain",
|
||||
`{"revenue":42600000,"imdb_id":"tt3228774","release_date":"2021-05-17"}`,
|
||||
);
|
||||
cy.get(
|
||||
`[type='CANVAS_WIDGET'] .t--widget-textwidget+.t--widget-textwidget ${commonlocators.textWidget} span`,
|
||||
).should(
|
||||
"contain",
|
||||
`[{"index":0,"updatedFields":{"release_date":"2021-05-17"},"allFields":{"revenue":42600000,"imdb_id":"tt3228774","release_date":"2021-05-17"}}]`,
|
||||
);
|
||||
cy.get(
|
||||
`[type='CANVAS_WIDGET'] .t--widget-textwidget+.t--widget-textwidget+.t--widget-textwidget ${commonlocators.textWidget} span`,
|
||||
).should("contain", "[0]");
|
||||
});
|
||||
|
||||
it("4. should check that changing property pane display format for date column changes date display format", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(".t--property-control-displayformat .rc-select-show-arrow").click();
|
||||
cy.get(".t--dropdown-option").children().contains("Do MMM YYYY").click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).should("contain", "17th May 2021");
|
||||
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(".t--property-control-displayformat .rc-select-show-arrow").click();
|
||||
cy.get(".t--dropdown-option").children().contains("DD/MM/YYYY").click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).should("contain", "17/05/2021");
|
||||
});
|
||||
|
||||
it("5. should check that changing property pane first day of week changes the date picker starting day", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(".t--property-control-firstdayofweek .t--code-editor-wrapper")
|
||||
.last()
|
||||
.click()
|
||||
.type("{backspace}1");
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(
|
||||
".bp3-datepicker .DayPicker .DayPicker-Months .DayPicker-WeekdaysRow div:first-child abbr",
|
||||
).should("contain", "Mo");
|
||||
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(".t--property-control-firstdayofweek .t--code-editor-wrapper")
|
||||
.last()
|
||||
.click()
|
||||
.type("{backspace}5");
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(
|
||||
".bp3-datepicker .DayPicker .DayPicker-Months .DayPicker-WeekdaysRow div:first-child abbr",
|
||||
).should("contain", "Fr");
|
||||
});
|
||||
|
||||
it("6. should check Show Shortcuts property control functionality", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(
|
||||
".t--property-pane-section-datesettings .t--property-control-showshortcuts",
|
||||
).should("exist");
|
||||
cy.get(
|
||||
".t--property-pane-section-datesettings .t--property-control-showshortcuts input[type=checkbox]",
|
||||
).click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(`.bp3-dateinput-popover .bp3-daterangepicker-shortcuts`).should(
|
||||
"not.exist",
|
||||
);
|
||||
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(
|
||||
".t--property-pane-section-datesettings .t--property-control-showshortcuts",
|
||||
).should("exist");
|
||||
cy.get(
|
||||
".t--property-pane-section-datesettings .t--property-control-showshortcuts input[type=checkbox]",
|
||||
).click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(`.bp3-dateinput-popover .bp3-daterangepicker-shortcuts`).should(
|
||||
"exist",
|
||||
);
|
||||
});
|
||||
|
||||
it("7. should check property pane Required toggle functionality", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
propPane.TogglePropertyState("Required", "On");
|
||||
table.ClickOnEditIcon(0, 2);
|
||||
cy.get(".bp3-dateinput-popover [aria-label='Wed May 26 2021']").click();
|
||||
table.ClickOnEditIcon(0, 2);
|
||||
cy.get(".bp3-dateinput-popover [aria-label='Wed May 26 2021']").click();
|
||||
cy.get(
|
||||
".bp3-transition-container .bp3-popover .bp3-popover-content",
|
||||
).should("exist");
|
||||
cy.get(
|
||||
".bp3-transition-container .bp3-popover .bp3-popover-content",
|
||||
).should("contain", "This field is required");
|
||||
cy.get(".bp3-dateinput-popover [aria-label='Wed May 26 2021']").click();
|
||||
cy.get(
|
||||
".bp3-transition-container .bp3-popover .bp3-popover-content",
|
||||
).should("not.exist");
|
||||
});
|
||||
|
||||
it("8. should check date cells behave as expected when adding a new row to table", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.get("[data-testid='t--property-pane-back-btn']").click();
|
||||
cy.get(
|
||||
".t--property-pane-section-addingarow .t--property-control-allowaddingarow input[type=checkbox]",
|
||||
).click();
|
||||
cy.get(".t--add-new-row").click();
|
||||
cy.get(".bp3-datepicker").should("not.exist");
|
||||
cy.get(".t--inlined-cell-editor")
|
||||
.should("have.css", "border")
|
||||
.and("eq", "1px solid rgb(255, 255, 255)");
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3) input`,
|
||||
).should("have.value", "");
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3) input`,
|
||||
).click();
|
||||
cy.get(".bp3-datepicker").should("exist");
|
||||
cy.get(".t--inlined-cell-editor")
|
||||
.should("have.css", "border")
|
||||
.and("not.eq", "none")
|
||||
.and("not.eq", "1px solid rgb(255, 255, 255)");
|
||||
cy.get(
|
||||
".bp3-datepicker .DayPicker .DayPicker-Body .DayPicker-Week:nth-child(2) .DayPicker-Day:first-child",
|
||||
).click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3) input`,
|
||||
).should("not.have.value", "");
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,189 @@
|
|||
import {
|
||||
table,
|
||||
entityExplorer,
|
||||
agHelper,
|
||||
locators,
|
||||
propPane,
|
||||
draggableWidgets,
|
||||
} from "../../../../../support/Objects/ObjectsCore";
|
||||
|
||||
describe("Table widget date column inline editing functionality", () => {
|
||||
before(() => {
|
||||
agHelper.AddDsl("Table/DateCellEditingDSL");
|
||||
});
|
||||
|
||||
it(
|
||||
"1. should check that edit check box is enabled for date type column in the columns list" +
|
||||
"and check that date cell edit mode can be turned on",
|
||||
() => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
agHelper.AssertElementEnabledDisabled(
|
||||
table._columnCheckbox("release_date"),
|
||||
0,
|
||||
false,
|
||||
);
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.TogglePropertyState("Editable", "On");
|
||||
agHelper.Sleep(1000);
|
||||
agHelper.AssertElementVisible(
|
||||
`${table._tableV2Head} ${table._columnHeaderDiv("release_date")} ${
|
||||
locators._svg
|
||||
}`,
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
it("2. should check that user can edit date in table cell", () => {
|
||||
agHelper.GetElement(`${table._tableRow1Child3}`).dblclick();
|
||||
agHelper.GetNClick(
|
||||
`${table._dateInputPopover} [aria-label='Mon May 17 2021']`,
|
||||
);
|
||||
agHelper.AssertElementAbsence(table._dateInputPopover);
|
||||
agHelper.AssertElementAbsence(table._editCellEditor);
|
||||
agHelper
|
||||
.GetText(`${table._tableRow1Child3}`)
|
||||
.then(($textData) => expect($textData).to.eq(`2021-05-17T00:00:00`));
|
||||
agHelper.GetElement(`${table._tableRow1Child3}`).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper.AssertElementVisible(table._dateInputPopover);
|
||||
agHelper.AssertElementVisible(table._editCellEditor);
|
||||
agHelper.GetNClick(`${locators._widgetInCanvas(draggableWidgets.TEXT)}`, 0);
|
||||
agHelper.AssertElementAbsence(table._dateInputPopover);
|
||||
agHelper.AssertElementAbsence(table._editCellEditor);
|
||||
agHelper
|
||||
.GetText(locators._textWidget, "text", 0)
|
||||
.then(($textData) =>
|
||||
expect($textData).to.eq(
|
||||
`{"revenue":42600000,"imdb_id":"tt3228774","release_date":"2021-05-17"}`,
|
||||
),
|
||||
);
|
||||
agHelper
|
||||
.GetText(locators._textWidget, "text", 1)
|
||||
.then(($textData) =>
|
||||
expect($textData).to.eq(
|
||||
`[{"index":0,"updatedFields":{"release_date":"2021-05-17"},"allFields":{"revenue":42600000,"imdb_id":"tt3228774","release_date":"2021-05-17"}}]`,
|
||||
),
|
||||
);
|
||||
agHelper
|
||||
.GetText(locators._textWidget, "text", 2)
|
||||
.then(($textData) => expect($textData).to.eq("[0]"));
|
||||
});
|
||||
|
||||
it("3. should check that changing property pane display format for date column changes date display format", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.SelectPropertiesDropDown("Display format", "Do MMM YYYY");
|
||||
agHelper
|
||||
.GetText(`${table._tableRow1Child3}`)
|
||||
.then(($textData) => expect($textData).to.eq("17th May 2021"));
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.SelectPropertiesDropDown("Display format", "DD/MM/YYYY");
|
||||
agHelper
|
||||
.GetText(`${table._tableRow1Child3}`)
|
||||
.then(($textData) => expect($textData).to.eq("17/05/2021"));
|
||||
});
|
||||
|
||||
it("4. should check that changing property pane first day of week changes the date picker starting day", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.UpdatePropertyFieldValue("First Day Of Week", "1", true);
|
||||
agHelper.GetElement(`${table._tableRow1Child3}`).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper
|
||||
.GetText(`${table._weekdayRowDayPicker} ${table._divFirstChild}`)
|
||||
.then(($textData) => expect($textData).to.eq("Mo"));
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.UpdatePropertyFieldValue("First Day Of Week", "5", true);
|
||||
agHelper.GetElement(`${table._tableRow1Child3}`).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper
|
||||
.GetText(`${table._weekdayRowDayPicker} ${table._divFirstChild}`)
|
||||
.then(($textData) => expect($textData).to.eq("Fr"));
|
||||
});
|
||||
|
||||
it("5. should check Show Shortcuts property control functionality", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.TogglePropertyState("Show Shortcuts", "Off");
|
||||
agHelper.Sleep(2000);
|
||||
agHelper.GetElement(`${table._tableRow1Child3}`).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper.AssertElementAbsence(`${table._dateRangePickerShortcuts}`);
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.TogglePropertyState("Show Shortcuts", "On");
|
||||
agHelper.Sleep(2000);
|
||||
agHelper.GetElement(`${table._tableRow1Child3}`).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper.AssertElementVisible(`${table._dateRangePickerShortcuts}`);
|
||||
});
|
||||
|
||||
it("6. should check property pane Required toggle functionality", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.TogglePropertyState("Required", "On");
|
||||
agHelper.Sleep(2000);
|
||||
//Edits the date by selecting from the popup
|
||||
table.ClickOnEditIcon(0, 2);
|
||||
agHelper.GetNClick(
|
||||
`${table._dateInputPopover} [aria-label='Wed May 26 2021']`,
|
||||
);
|
||||
//Clears the date selected in previous step
|
||||
table.ClickOnEditIcon(0, 2);
|
||||
agHelper.GetNClick(
|
||||
`${table._dateInputPopover} [aria-label='Wed May 26 2021']`,
|
||||
);
|
||||
agHelper
|
||||
.GetText(table._popoverErrorMsg("This field is required"))
|
||||
.then(($textData) => expect($textData).to.eq("This field is required"));
|
||||
agHelper.GetNClick(
|
||||
`${table._dateInputPopover} [aria-label='Wed May 26 2021']`,
|
||||
);
|
||||
agHelper.AssertElementAbsence(
|
||||
table._popoverErrorMsg("This field is required"),
|
||||
);
|
||||
});
|
||||
|
||||
it("7. should check date cells behave as expected when adding a new row to table", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
propPane.TogglePropertyState("Allow adding a row", "On");
|
||||
table.AddNewRow();
|
||||
agHelper.AssertElementAbsence(table._datePicker);
|
||||
agHelper.AssertCSS(
|
||||
table._editCellEditor,
|
||||
"border",
|
||||
"1px solid rgb(255, 255, 255)",
|
||||
);
|
||||
agHelper
|
||||
.GetText(`${table._tableRow1Child3} ${locators._inputField}`)
|
||||
.then(($textData) => expect($textData).to.eq(""));
|
||||
agHelper.GetNClick(`${table._tableRow1Child3} ${locators._inputField}`);
|
||||
agHelper.AssertElementVisible(table._datePicker);
|
||||
agHelper
|
||||
.GetElement(table._editCellEditor)
|
||||
.should("have.css", "border")
|
||||
.and("not.eq", "none")
|
||||
.and("not.eq", "1px solid rgb(255, 255, 255)");
|
||||
agHelper.GetNClick(
|
||||
`${table._dayPickerWeek}:nth-child(2) ${table._dayPickerFirstChild}`,
|
||||
);
|
||||
agHelper
|
||||
.GetText(`${table._tableRow1Child3} ${locators._inputField}`, "val")
|
||||
.then(($textData) => expect($textData).to.eq("07/07/2023"));
|
||||
});
|
||||
});
|
||||
|
|
@ -1,162 +0,0 @@
|
|||
const commonlocators = require("../../../../../locators/commonlocators.json");
|
||||
import * as _ from "../../../../../support/Objects/ObjectsCore";
|
||||
|
||||
describe("Table widget date column inline editing functionality", () => {
|
||||
before(() => {
|
||||
_.agHelper.AddDsl("Table/DateCellEditingDSL");
|
||||
});
|
||||
|
||||
it.skip("1. should check that changing property pane time precision changes the date picker time precision", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(".t--property-control-timeprecision .bp3-popover-target")
|
||||
.last()
|
||||
.click();
|
||||
cy.get(".t--dropdown-option").children().contains("Minute").click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(".bp3-timepicker-input-row .bp3-timepicker-hour").should("exist");
|
||||
cy.get(".bp3-timepicker-input-row .bp3-timepicker-minute").should("exist");
|
||||
cy.get(".bp3-timepicker-input-row .bp3-timepicker-second").should(
|
||||
"not.exist",
|
||||
);
|
||||
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(".t--property-control-timeprecision .bp3-popover-target")
|
||||
.last()
|
||||
.click();
|
||||
cy.get(".t--dropdown-option").children().contains("None").click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(".bp3-timepicker-input-row").should("not.exist");
|
||||
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(".t--property-control-timeprecision .bp3-popover-target")
|
||||
.last()
|
||||
.click();
|
||||
cy.get(".t--dropdown-option").children().contains("Second").click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) div:nth-child(3)`,
|
||||
).dblclick({
|
||||
force: true,
|
||||
});
|
||||
cy.get(".bp3-timepicker-input-row .bp3-timepicker-hour").should("exist");
|
||||
cy.get(".bp3-timepicker-input-row .bp3-timepicker-minute").should("exist");
|
||||
cy.get(".bp3-timepicker-input-row .bp3-timepicker-second").should("exist");
|
||||
});
|
||||
|
||||
it("2. should check visible property control functionality", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(
|
||||
".t--property-pane-section-general .t--property-control-visible",
|
||||
).should("exist");
|
||||
cy.get(
|
||||
".t--property-pane-section-general .t--property-control-visible input[type=checkbox]",
|
||||
).click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Head} [data-header="release_date"] .hidden-header`,
|
||||
).should("exist");
|
||||
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(
|
||||
".t--property-pane-section-general .t--property-control-visible input[type=checkbox]",
|
||||
).click();
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Head} [data-header="release_date"] .draggable-header`,
|
||||
).should("exist");
|
||||
});
|
||||
|
||||
// ADS changes to date input property causes this test to fail
|
||||
// skipping it temporarily.
|
||||
it.skip("3. should check min date and max date property control functionality", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.editColumn("release_date");
|
||||
cy.get(
|
||||
".t--property-pane-section-validation .t--property-control-mindate",
|
||||
).should("exist");
|
||||
cy.get(
|
||||
".t--property-pane-section-validation .t--property-control-maxdate",
|
||||
).should("exist");
|
||||
|
||||
cy.get(
|
||||
".t--property-pane-section-validation .t--property-control-mindate div:last-child .react-datepicker-wrapper",
|
||||
)
|
||||
.click()
|
||||
.clear()
|
||||
.type("2022-05-05T00:00:10.1010+05:30{enter}");
|
||||
cy.get(
|
||||
".t--property-pane-section-validation .t--property-control-maxdate div:last-child .react-datepicker-wrapper",
|
||||
)
|
||||
.click()
|
||||
.clear()
|
||||
.type("2022-05-30T00:00:10.1010+05:30{enter}");
|
||||
|
||||
cy.get(
|
||||
`${commonlocators.TableV2Row} .tr:nth-child(1) .td:nth-child(3)`,
|
||||
).realHover();
|
||||
cy.get(`.t--editable-cell-icon`).first().click({
|
||||
force: true,
|
||||
});
|
||||
cy.get(
|
||||
".bp3-transition-container .bp3-popover .bp3-popover-content",
|
||||
).should("contain", "Date out of range");
|
||||
cy.get(
|
||||
".t--property-pane-section-validation .t--property-control-mindate div:last-child .react-datepicker-wrapper",
|
||||
)
|
||||
.click()
|
||||
.clear()
|
||||
.type("{enter}");
|
||||
cy.get(
|
||||
".t--property-pane-section-validation .t--property-control-maxdate div:last-child .react-datepicker-wrapper",
|
||||
)
|
||||
.click()
|
||||
.clear()
|
||||
.type("{enter}");
|
||||
});
|
||||
|
||||
it("4. should allow ISO 8601 format date and not throw a disallowed validation error", () => {
|
||||
cy.openPropertyPane("tablewidgetv2");
|
||||
cy.get(commonlocators.editPropBackButton).click();
|
||||
cy.get(".t--property-control-tabledata").then(($el) => {
|
||||
cy.updateCodeInput(
|
||||
$el,
|
||||
'[{ "dateValue": "2023-02-02T13:39:38.367857Z" }]',
|
||||
);
|
||||
});
|
||||
cy.wait(500);
|
||||
|
||||
cy.editColumn("dateValue");
|
||||
//change format of column to date
|
||||
cy.changeColumnType("Date");
|
||||
|
||||
cy.get(".t--property-control-dateformat").click();
|
||||
cy.contains("ISO 8601").click();
|
||||
// we should not see an error after selecting the ISO 8061 format
|
||||
cy.get(".t--property-control-dateformat .t--codemirror-has-error").should(
|
||||
"not.exist",
|
||||
);
|
||||
cy.get(".t--property-control-dateformat").find(".t--js-toggle").click();
|
||||
//check the selected format value
|
||||
cy.get(".t--property-control-dateformat").contains(
|
||||
"YYYY-MM-DDTHH:mm:ss.SSSZ",
|
||||
);
|
||||
cy.get(".t--property-control-dateformat").then(($el) => {
|
||||
//give a corrupted date format
|
||||
cy.updateCodeInput($el, "YYYY-MM-DDTHH:mm:ss.SSSsZ");
|
||||
});
|
||||
//we should now see an error when an incorrect date format
|
||||
cy.get(".t--property-control-dateformat .t--codemirror-has-error").should(
|
||||
"exist",
|
||||
);
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,149 @@
|
|||
import {
|
||||
table,
|
||||
entityExplorer,
|
||||
agHelper,
|
||||
locators,
|
||||
propPane,
|
||||
assertHelper,
|
||||
} from "../../../../../support/Objects/ObjectsCore";
|
||||
|
||||
describe("Table widget date column inline editing functionality", () => {
|
||||
before(() => {
|
||||
agHelper.AddDsl("Table/DateCellEditingDSL");
|
||||
});
|
||||
|
||||
it.skip("1. should check that changing property pane time precision changes the date picker time precision", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
table.EditColumn("release_date", "v2");
|
||||
agHelper.GetNClick(table._timeprecisionPopover, 0);
|
||||
agHelper
|
||||
.GetElement(locators._dropdownText)
|
||||
.children()
|
||||
.contains("Minute")
|
||||
.click();
|
||||
agHelper.GetElement(table._tableRow1Child3).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper.AssertElementExist(table._timePickerHour);
|
||||
agHelper.AssertElementExist(table._timePickerMinute);
|
||||
agHelper.AssertElementAbsence(table._timePickerSecond);
|
||||
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
table.EditColumn("release_date", "v2");
|
||||
agHelper.GetNClick(table._timeprecisionPopover, 0);
|
||||
agHelper
|
||||
.GetElement(locators._dropdownText)
|
||||
.children()
|
||||
.contains("None")
|
||||
.click();
|
||||
agHelper.GetElement(table._tableRow1Child3).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper.AssertElementAbsence(table._timePickerRow);
|
||||
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
table.EditColumn("release_date", "v2");
|
||||
agHelper.GetNClick(table._timeprecisionPopover, 1);
|
||||
agHelper
|
||||
.GetElement(locators._dropdownText)
|
||||
.children()
|
||||
.contains("Second")
|
||||
.click();
|
||||
agHelper.GetElement(table._tableRow1Child3).dblclick({
|
||||
force: true,
|
||||
});
|
||||
agHelper.AssertElementExist(table._timePickerHour);
|
||||
agHelper.AssertElementExist(table._timePickerMinute);
|
||||
agHelper.AssertElementExist(table._timePickerSecond);
|
||||
});
|
||||
|
||||
it("2. should check visible property control functionality", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.TogglePropertyState("Visible", "Off");
|
||||
agHelper.Sleep(1000);
|
||||
table.AssertHiddenColumns(["release_date"]);
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
table.EditColumn("release_date", "v2");
|
||||
propPane.TogglePropertyState("Visible", "On");
|
||||
agHelper.Sleep(1000);
|
||||
table.AssertVisibleColumns(["release_date"]);
|
||||
});
|
||||
|
||||
// ADS changes to date input property causes this test to fail
|
||||
// skipping it temporarily.
|
||||
it.skip("3. should check min date and max date property control functionality", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
table.EditColumn("release_date", "v2");
|
||||
agHelper.AssertElementExist(
|
||||
propPane._propertyPanePropertyControl("validation", "mindate"),
|
||||
);
|
||||
agHelper.AssertElementExist(
|
||||
propPane._propertyPanePropertyControl("validation", "maxdate"),
|
||||
);
|
||||
agHelper.RemoveCharsNType(
|
||||
`${propPane._propertyPanePropertyControl("validation", "mindate")} ${
|
||||
table._lastChildDatePicker
|
||||
}`,
|
||||
-1,
|
||||
"2022-05-05T00:00:10.1010+05:30{enter}",
|
||||
);
|
||||
agHelper.RemoveCharsNType(
|
||||
`${propPane._propertyPanePropertyControl("validation", "mindate")} ${
|
||||
table._lastChildDatePicker
|
||||
}`,
|
||||
-1,
|
||||
"2022-05-30T00:00:10.1010+05:30{enter}",
|
||||
);
|
||||
table.ClickOnEditIcon(0, 2);
|
||||
agHelper
|
||||
.GetText(table._popoverErrorMsg("Date out of range"))
|
||||
.then(($textData) => expect($textData).to.eq("Date out of range"));
|
||||
agHelper.RemoveCharsNType(
|
||||
`${propPane._propertyPanePropertyControl("validation", "mindate")} ${
|
||||
table._lastChildDatePicker
|
||||
}`,
|
||||
-1,
|
||||
"{enter}",
|
||||
);
|
||||
agHelper.RemoveCharsNType(
|
||||
`${propPane._propertyPanePropertyControl("validation", "maxdate")} ${
|
||||
table._lastChildDatePicker
|
||||
}`,
|
||||
-1,
|
||||
"{enter}",
|
||||
);
|
||||
});
|
||||
|
||||
it("4. should allow ISO 8601 format date and not throw a disallowed validation error", () => {
|
||||
entityExplorer.SelectEntityByName("Table1");
|
||||
propPane.NavigateBackToPropertyPane();
|
||||
propPane.UpdatePropertyFieldValue(
|
||||
"Table data",
|
||||
'[{ "dateValue": "2023-02-02T13:39:38.367857Z" }]',
|
||||
);
|
||||
agHelper.Sleep(3000);
|
||||
table.ChangeColumnType("dateValue", "Date", "v2");
|
||||
table.EditColumn("dateValue", "v2");
|
||||
propPane.SelectPropertiesDropDown("Date format", "ISO 8601");
|
||||
// we should not see an error after selecting the ISO 8061 format
|
||||
agHelper.AssertElementAbsence(
|
||||
`${propPane._propertyDateFormat} ${table._codeMirrorError}`,
|
||||
);
|
||||
propPane.ToggleJSMode("Date format", true);
|
||||
agHelper
|
||||
.GetText(locators._existingFieldTextByName("Date format"))
|
||||
.then(($textData) =>
|
||||
expect($textData).to.include("YYYY-MM-DDTHH:mm:ss.SSSZ"),
|
||||
);
|
||||
propPane.UpdatePropertyFieldValue(
|
||||
"Date format",
|
||||
"YYYY-MM-DDTHH:mm:ss.SSSsZ",
|
||||
);
|
||||
//we should now see an error when an incorrect date format
|
||||
agHelper.AssertElementVisible(
|
||||
`${propPane._propertyDateFormat} ${table._codeMirrorError}`,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
|
@ -253,11 +253,10 @@ export class CommonLocators {
|
|||
_appThemeCard = ".t--theme-card";
|
||||
_appNavigationSettings = "#t--navigation-settings-header";
|
||||
_appNavigationSettingsShowTitle = "#t--navigation-settings-application-title";
|
||||
_switchGroupControl =
|
||||
".t--draggable-switchgroupwidget .bp3-control-indicator";
|
||||
_fontSelect = "fontsize .rc-select";
|
||||
_fontInput = "fontsize input";
|
||||
_pagination = ".rc-pagination";
|
||||
_controlOption = ".t--property-control-options";
|
||||
_canvasBody = "[data-testid='div-selection-0']";
|
||||
_svg = "svg";
|
||||
}
|
||||
|
|
|
|||
|
|
@ -46,8 +46,7 @@ export class PropertyPane {
|
|||
`.t--property-pane-section-collapse-${section}`;
|
||||
private _sectionCollapseWithTag = (section: string, tab: string) =>
|
||||
`.t--property-pane-section-collapse-${section} .t--property-section-tag-${tab}`;
|
||||
private _propertyControl = (property: string) =>
|
||||
`.t--property-control-${property}`;
|
||||
_propertyControl = (property: string) => `.t--property-control-${property}`;
|
||||
private _addAction = (property: string) => `.t--add-action-${property}`;
|
||||
_propertyPaneSearchInputWrapper = ".t--property-pane-search-input-wrapper";
|
||||
_propertyPaneSearchInput = `${this._propertyPaneSearchInputWrapper} input`;
|
||||
|
|
@ -107,6 +106,9 @@ export class PropertyPane {
|
|||
}`;
|
||||
private _propPaneSelectedItem = (option: string) =>
|
||||
`.t--property-control-${option} span.rc-select-selection-item span`;
|
||||
_propertyDateFormat = ".t--property-control-dateformat";
|
||||
_propertyPanePropertyControl = (propPane: string, propControl: string) =>
|
||||
`.t--property-pane-section-${propPane} .t--property-control-${propControl}`;
|
||||
_autoHeightLimitMin = "[data-testid='t--auto-height-overlay-handles-min']";
|
||||
_autoHeightLimitMin_div =
|
||||
"[data-testid='t--auto-height-overlay-handles-min'] div";
|
||||
|
|
|
|||
|
|
@ -45,8 +45,7 @@ export class Table {
|
|||
"//div[contains(@class,'thead')]//div[contains(@class,'tr')][1]//div[@role='columnheader']//div[contains(text(),'" +
|
||||
columnName +
|
||||
"')]/parent::div/parent::div";
|
||||
private _columnHeaderDiv = (columnName: string) =>
|
||||
`[data-header=${columnName}]`;
|
||||
_columnHeaderDiv = (columnName: string) => `[data-header=${columnName}]`;
|
||||
private _tableWidgetVersion = (version: "v1" | "v2") =>
|
||||
`.t--widget-tablewidget${version == "v1" ? "" : version}`;
|
||||
private _nextPage = (version: "v1" | "v2") =>
|
||||
|
|
@ -158,6 +157,35 @@ export class Table {
|
|||
`${this._columnHeaderDiv(columnName)} .header-menu .bp3-popover2-target`;
|
||||
_columnHeaderMenu = ".bp3-menu";
|
||||
_selectMenuItem = ".menu-item-text";
|
||||
_columnCheckbox = (columnName: string) =>
|
||||
"[data-rbd-draggable-id='" + columnName + "']" + " .t--card-checkbox input";
|
||||
_dateInputPopover = ".bp3-dateinput-popover";
|
||||
_tableV2Row = ".t--draggable-tablewidgetv2 .tbody";
|
||||
_weekdayRowDayPicker =
|
||||
".bp3-datepicker .DayPicker .DayPicker-Months .DayPicker-WeekdaysRow";
|
||||
_popoverErrorMsg = (msg: string) =>
|
||||
"//div[@class='bp3-popover-content' and contains(text(),'" + msg + "')]";
|
||||
_datePicker = ".bp3-datepicker";
|
||||
_dayPickerWeek = ".bp3-datepicker .DayPicker .DayPicker-Body .DayPicker-Week";
|
||||
_timePickerHour = ".bp3-timepicker-input-row .bp3-timepicker-hour";
|
||||
_timePickerMinute = ".bp3-timepicker-input-row .bp3-timepicker-minute";
|
||||
_timePickerSecond = ".bp3-timepicker-input-row .bp3-timepicker-second";
|
||||
_timePickerRow = ".bp3-timepicker-input-row";
|
||||
_tableV2Head = ".t--draggable-tablewidgetv2 .thead";
|
||||
_timeprecisionPopover =
|
||||
".t--property-control-timeprecision .bp3-popover-target";
|
||||
_tableRow1Child3 =
|
||||
".t--draggable-tablewidgetv2 .tbody .tr:nth-child(1) div:nth-child(3)";
|
||||
_draggableHeader = " .draggable-header";
|
||||
_lastChildDatePicker = "div:last-child .react-datepicker-wrapper";
|
||||
_codeMirrorError = ".t--codemirror-has-error";
|
||||
_canvasWidgetType = "[type='CANVAS_WIDGET']";
|
||||
_showArrow = ".rc-select-show-arrow";
|
||||
_codeEditorWrapper = ".t--code-editor-wrapper";
|
||||
_dateRangePickerShortcuts =
|
||||
".bp3-dateinput-popover .bp3-daterangepicker-shortcuts";
|
||||
_dayPickerFirstChild = ".DayPicker-Day:first-child";
|
||||
_divFirstChild = "div:first-child abbr";
|
||||
|
||||
public GetNumberOfRows() {
|
||||
return this.agHelper.GetElement(this._tr).its("length");
|
||||
|
|
@ -694,4 +722,14 @@ export class Table {
|
|||
);
|
||||
this.agHelper.Sleep(500);
|
||||
}
|
||||
|
||||
public AssertVisibleColumns(columnNames: string[]) {
|
||||
columnNames.forEach(($header) => {
|
||||
cy.xpath(this._columnHeader($header))
|
||||
.invoke("attr", "class")
|
||||
.then((classes) => {
|
||||
expect(classes).includes("draggable-header");
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user