PromucFlow_constructor/app/client/cypress/support/dataSourceCommands.js
Nidhi 906a7298dc
feat: Simplified Google Sheets queries (#14869)
* Client changes 1

* add DSL functionality

* Temp commit for refactoring changes

* Do I even know what I'm doing here?

* chore: Second GS layout

* Update: Visibility conditional outputs for schemas

- Added the output from conditional outputs for schema children too

* Update: Entity selector visibility control

- Added logic for controlling visibility of sub components via the JS expressions system

* Update: Passing disabled prop to toggle button

* Update: Passing disabled prop to toggle btn

* Update: Styled component for toggle button

- Added disabled styles based on the disabled prop sent to the toggle form view JSON button

* Update: configProperty role in Entity Selector

- Removed dependance of the configProperty of the entity selector children to it's parent component

* Update: type of placeholder key

- Made placeholder key from form config JSON to accept either string or an object
- Earlier only string was accepted
- This is for pagination component

* Update: Added placeholder control for pagination

* Client changes 1

* add DSL functionality

* Do I even know what I'm doing here?

* fix: updated uqi forms ui, clubbed JS switch button to ads, updated tooltip design

* fix: updated tooltip component for wrong ui on entity explore

* temp triggers

* fix: updated uqi forms ui, clubbed JS switch button to ads, updated tooltip design (#12395)

* fix: updated uqi forms ui, clubbed JS switch button to ads, updated tooltip design

* fix: updated tooltip component for wrong ui on entity explore

* fix: updated tooltip ui, where condition placement, sort by ui

* temp form data access logic

* fix: updated sorting type width ui

* fix: updated ui for spacing, width and text issues

* Update: Type for tooltip of UQI forms

- Added option to send an object to the tooltipText object.
- This allows for composite components like pagination to have tooltips for each sub component

* Update: tooltip for pagination component

- Added handling to parse the tooltip for multiple components.
- This allows for composite components like pagination to have tooltips for each sub component

* Update: Type cast for tooltip component

- Made the content passed to tooltip component as a string only

* Update: Fixed tooltip component CSS

* Update: Dropdown option component

- Added a tooltip wrapper to each option
- This is to show on hover text like disabled state

* fix: updated ẇhere clause broken ui for condition

* Add: functions to check and extract expressions

- Loop through the formConfig and find any keys that have a value that is bindable
- Used pre defined regex to check if value is a moustache binding

* Add: Types for evaluated form configs

- Added types for the form configs to be evaluated and their output post eval

* Add: Flow to run the form config

- Run the form config and update the result to the redux state

* Update: Name of the type for formconfigs

- Updated since it was clashing with a component of the same name

* Add: Function to enforce config type checks

- This is done so that the improper configs can be weeded out and the rest of the form can be shown

* Add: Function to update evaluated config

- Added option to update the config if it's values needed evaluation

* Add: Type check for schema sections

* Update: Error handling for invalid control type

- We were throwing an exception till now, changed it to a warning text

* Add: Exposed tooltip for dropdown option disabled state

* Update: switch to json mode functionality

- Added logic to convert data to a string rather than an object when the first switch to JSON mode happens

* Update: Added key to tooltip for dropdown options

* Trigger API modification

* Add: function to fetch default trigger URL

* Update: Made URL optional in dynamic trigger config

* Update: Dynamic trigger API call

- Made the API call for dynamic triggers have URL as optional field
- Added type check to the response of the API call

* Update: resp type for trigger APIs

* Update: Moved code to utils folder

- Moved functions for UQI form eval processing to utils file

* Update: passing original controltype to JS switch

* Update: config for JSON editor mode

- Updated the config to have different options for JSON mode depending on the original control type

* Update: Connected line numbers flag to config

* Revert: CSS changes for tooltip

* Refactor: Removed consle

* Add: type for the config of dynamic values

* Add: Feature to evaluate config for triggers

* Refactor: fix type check errors

* fix: dropdown ui width with text alignment

* Update: fixed selector for dynamic values

* Update: selector call for fetchDynamicValues

* Add table header index prop for columns selector

* migration partial commit

* migration partial commit

* Refactor: removed unused import

* Update: reused function for checking dynamic value

* Update: removed unused import

* Fix format JSON issues

* Retrieve binding paths from entity selector components

* Fixes 6 remaining issues with UQI implementation

* Fix dropdown issues

* Fix dropdown height issues and fixes triggering of APIs when option is deselected

* Migration changes

* Fix QA generated UQI issues

* Fix projection component height and route change logic

* Fix multi select dropdown placeholder text issue and json stringify issue with switching view types

* Reset entity type value when command value changes

* Test changes

* Review comments

* Moved migrations around

* Corrected import statement

* Added JSON schema migration

* Updated schema version

* perf improvements and filter dropdown options feature

* Fix Code mirror component config for toggleComponentToJson input fields.

* Fix prettier issues

* fix prettier issues

* Fix style issues as a result of the merged conflicts

* Fix failing test case

* Fixed a few other flows (#14225)

* Fixed a few other flows

* Review comments

* Fix generate CRUD, fix evaluation of dynamic bindings and fix various styling issues.

* More fixes (#14367)

* Factor in the root formconfig parent key.

* Fix flickering issues, and evaluatedFormConfig issues

* fix: Teeny bugs (#14455)

* Teeny bugs

* Added previous functionality as is

* Improvements in the way we fetch dynamic values

* Fix stringiification issue and cyclic dependency issues

* Resolve projection component values deletion

* Resolve merge conflicts and fix prettier issues

* fix: Tsc issues

* Fix property pane connection navigation

* updating ee locator

* updating inputfield locator

* dropdown locator update

* Merge conflict not properly resolved.

* Fix s3 spec

* Fix Mongo Spec

* Fix some more tests

* fix: prevent cyclic dependency when switching to js mode (#14668)

* add delete events for change from array to string in diff

* add test to assert absence of cyclic dependency error when switching to js in switchgroup widget

* Assert that evaluation is not disabled when no cyclic dependency happens

* Cypress test preparations for google sheets and form controls

* Fixed a few test errors (#14874)

* Add: unit tests for uqi UI updates

- view type tests
- conditional output extraction
- processing conditional output to handle view/enabled state of the component

* Add: completed isValidFormConfig test

* Update: improved tests for update config

- These tests cover the functionality to update a section config after it's components are done evaluating

* Fix failing cypress tests and cyclic dependency issue

* Fixes some more tests

* Fixed migration of row objects (#14896)

* Bumped the version of design system package

* Update: reverted change to EE selector

* Fix deletion pointer

* Update: selector for js on load spec

- Synced with changes related to ADS dropdown

* Fix mongoDBShoppingCart spec

* Remove comments

* Fix: mongo shopping cart test failures

* fix: mongo shopping cart spec

* Dummy push to retrigger vercel

* fix: mongo shopping cart spec

* Update MongoDBShoppingCart_spec.js

* fix: removed unused click away

* dummy commit

* Update: moved helper functions to separate file

* Add: added tests for saga functions

- Worked on testing for
   - extractFetchDynamicValueFormConfigs
   - extractQueueOfValuesToBeFetched

* Add if check for queueOfValuesToBeFetched

* Resolve review comments

* Empty-Commit

Co-authored-by: Irongade <adeoluayangade@yahoo.com>
Co-authored-by: Ayush Pahwa <ayush@appsmith.com>
Co-authored-by: Aman Agarwal <aman@appsmith.com>
Co-authored-by: Ayangade Adeoluwa <37867493+Irongade@users.noreply.github.com>
Co-authored-by: Aishwarya UR <aishwarya@appsmith.com>
Co-authored-by: Favour Ohanekwu <fohanekwu@gmail.com>
Co-authored-by: Albin <albin@appsmith.com>
2022-07-04 11:13:27 +05:30

482 lines
16 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 datasourceEditor = require("../locators/DatasourcesEditor.json");
const datasourceFormData = require("../fixtures/datasources.json");
const explorer = require("../locators/explorerlocators.json");
const backgroundColorBlack = "rgb(0, 0, 0)";
const backgroundColorGray1 = "rgb(250, 250, 250)";
const backgroundColorGray2 = "rgb(240, 240, 240)";
const backgroundColorGray8 = "rgb(113, 110, 110)";
export const initLocalstorage = () => {
cy.window().then((window) => {
window.localStorage.setItem("ShowCommentsButtonToolTip", "");
window.localStorage.setItem("updateDismissed", "true");
});
};
Cypress.Commands.add("firestoreDatasourceForm", () => {
cy.get(datasourceEditor.datasourceConfigUrl).type(
datasourceFormData["database-url"],
);
cy.get(datasourceEditor.projectID).type(datasourceFormData["projectID"]);
cy.get(datasourceEditor.serviceAccCredential)
.clear()
.type(datasourceFormData["serviceAccCredentials"]);
});
Cypress.Commands.add("amazonDatasourceForm", () => {
cy.get(datasourceEditor.projectID).type(datasourceFormData["access_key"]);
cy.get(datasourceEditor.serviceAccCredential)
.clear()
.type(datasourceFormData["secret_key"]);
});
Cypress.Commands.add("testSaveDeleteDatasource", () => {
// Instead of deleting the last datasource on the active datasources list,
// we delete the datasource that was just created (identified by its title)
cy.get(datasourceEditor.datasourceTitle)
.invoke("text")
.then((datasourceTitle) => {
// test datasource
cy.get(".t--test-datasource").click();
cy.wait("@testDatasource");
// .should("have.nested.property", "response.body.data.success", true)
// .debug();
// save datasource
cy.get(".t--save-datasource").click();
cy.wait("@saveDatasource").should(
"have.nested.property",
"response.body.responseMeta.status",
200,
);
// select datasource to be deleted by datasource title
cy.get(`${datasourceEditor.datasourceCard}`)
.contains(datasourceTitle)
.last()
.click();
// delete datasource
cy.get(".t--delete-datasource").click();
cy.get(".t--delete-datasource")
.contains("Are you sure?")
.click();
cy.wait("@deleteDatasource").should(
"have.nested.property",
"response.body.responseMeta.status",
200,
);
});
});
Cypress.Commands.add("NavigateToDatasourceEditor", () => {
cy.get(explorer.addDBQueryEntity)
.last()
.click({ force: true });
cy.get(pages.integrationCreateNew)
.should("be.visible")
.click({ force: true });
});
Cypress.Commands.add("NavigateToActiveDatasources", () => {
cy.get(explorer.addDBQueryEntity)
.last()
.click({ force: true });
cy.get(pages.integrationActiveTab)
.should("be.visible")
.click({ force: true });
});
Cypress.Commands.add("testDatasource", (expectedRes = true) => {
cy.get(".t--test-datasource").click({ force: true });
cy.wait("@testDatasource").should(
"have.nested.property",
"response.body.data.success",
expectedRes,
);
});
Cypress.Commands.add("saveDatasource", () => {
cy.get(".t--save-datasource").click({ force: true });
cy.wait("@saveDatasource")
.then((xhr) => {
cy.log(JSON.stringify(xhr.response.body));
})
.should("have.nested.property", "response.body.responseMeta.status", 200);
});
Cypress.Commands.add("testSaveDatasource", (expectedRes = true) => {
cy.testDatasource(expectedRes);
cy.saveDatasource();
// cy.get(datasourceEditor.datasourceCard)
// .last()
// .click();
});
Cypress.Commands.add(
"fillMongoDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const hostAddress = shouldAddTrailingSpaces
? datasourceFormData["mongo-host"] + " "
: datasourceFormData["mongo-host"];
// const databaseName = shouldAddTrailingSpaces
// ? datasourceFormData["mongo-databaseName"] + " "
// : datasourceFormData["mongo-databaseName"];
cy.get(datasourceEditor["host"]).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["mongo-port"]);
//cy.get(datasourceEditor["port"]).type(datasourceFormData["mongo-port"]);
//cy.get(datasourceEditor["selConnectionType"]).click();
//cy.contains(datasourceFormData["connection-type"]).click();
//cy.get(datasourceEditor["defaultDatabaseName"]).type(databaseName);//is optional hence removing
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor["databaseName"])
.clear()
.type(datasourceFormData["mongo-databaseName"]);
// cy.get(datasourceEditor["username"]).type(
// datasourceFormData["mongo-username"],
// );
// cy.get(datasourceEditor["password"]).type(
// datasourceFormData["mongo-password"],
// );
// cy.get(datasourceEditor["authenticationAuthtype"]).click();
// cy.contains(datasourceFormData["mongo-authenticationAuthtype"]).click({
// force: true,
// });
},
);
Cypress.Commands.add(
"fillPostgresDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const hostAddress = shouldAddTrailingSpaces
? datasourceFormData["postgres-host"] + " "
: datasourceFormData["postgres-host"];
const databaseName = shouldAddTrailingSpaces
? datasourceFormData["postgres-databaseName"] + " "
: datasourceFormData["postgres-databaseName"];
cy.get(datasourceEditor.host).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["postgres-port"]);
cy.get(datasourceEditor.databaseName)
.clear()
.type(databaseName);
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor.username).type(
datasourceFormData["postgres-username"],
);
cy.get(datasourceEditor.password).type(
datasourceFormData["postgres-password"],
);
},
);
Cypress.Commands.add(
"fillElasticDatasourceForm",
(shouldAddTrailingSpaces = false) => {
// we are using postgresql data for elastic search,
// in the future, this should be changed, just for testing purposes
const hostAddress = "https://localhost";
const headerValue = "Bearer Token";
cy.get(datasourceEditor.host).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["postgres-port"]);
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor.username).type(
datasourceFormData["postgres-username"],
);
cy.get(datasourceEditor.password).type(
datasourceFormData["postgres-password"],
);
cy.get(datasourceEditor.headers).type(headerValue);
},
);
Cypress.Commands.add(
"fillMySQLDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const hostAddress = shouldAddTrailingSpaces
? datasourceFormData["mysql-host"] + " "
: datasourceFormData["mysql-host"];
const databaseName = shouldAddTrailingSpaces
? datasourceFormData["mysql-databaseName"] + " "
: datasourceFormData["mysql-databaseName"];
cy.get(datasourceEditor.host).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["mysql-port"]);
cy.get(datasourceEditor.databaseName)
.clear()
.type(databaseName);
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor.username).type(
datasourceFormData["mysql-username"],
);
cy.get(datasourceEditor.password).type(
datasourceFormData["mysql-password"],
);
},
);
Cypress.Commands.add(
"fillMsSQLDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const hostAddress = shouldAddTrailingSpaces
? datasourceFormData["mssql-host"] + " "
: datasourceFormData["mssql-host"];
const databaseName = shouldAddTrailingSpaces
? datasourceFormData["mssql-databaseName"] + " "
: datasourceFormData["mssql-databaseName"];
cy.get(datasourceEditor.host).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["mssql-port"]);
cy.get(datasourceEditor.databaseName)
.clear()
.type(databaseName);
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor.username).type(
datasourceFormData["mssql-username"],
);
cy.get(datasourceEditor.password).type(
datasourceFormData["mssql-password"],
);
},
);
Cypress.Commands.add(
"fillArangoDBDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const hostAddress = shouldAddTrailingSpaces
? datasourceFormData["arango-host"] + " "
: datasourceFormData["arango-host"];
const databaseName = shouldAddTrailingSpaces
? datasourceFormData["arango-databaseName"] + " "
: datasourceFormData["arango-databaseName"];
cy.get(datasourceEditor.host).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["arango-port"]);
cy.get(datasourceEditor.databaseName)
.clear()
.type(databaseName);
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor.username).type(
datasourceFormData["arango-username"],
);
cy.get(datasourceEditor.password).type(
datasourceFormData["arango-password"],
);
},
);
Cypress.Commands.add(
"fillRedshiftDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const hostAddress = shouldAddTrailingSpaces
? datasourceFormData["redshift-host"] + " "
: datasourceFormData["redshift-host"];
const databaseName = shouldAddTrailingSpaces
? datasourceFormData["redshift-databaseName"] + " "
: datasourceFormData["redshift-databaseName"];
cy.get(datasourceEditor.host).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["redshift-port"]);
cy.get(datasourceEditor.databaseName)
.clear()
.type(databaseName);
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor.username).type(
datasourceFormData["redshift-username"],
);
cy.get(datasourceEditor.password).type(
datasourceFormData["redshift-password"],
);
},
);
Cypress.Commands.add(
"fillUsersMockDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const userMockDatabaseName = shouldAddTrailingSpaces
? `${datasourceFormData["mockDatabaseName"] + " "}`
: datasourceFormData["mockDatabaseName"];
const userMockHostAddress = shouldAddTrailingSpaces
? `${datasourceFormData["mockHostAddress"] + " "}`
: datasourceFormData["mockHostAddress"];
const userMockDatabaseUsername = shouldAddTrailingSpaces
? `${datasourceFormData["mockDatabaseUsername"] + " "}`
: datasourceFormData["mockDatabaseUsername"];
cy.get(datasourceEditor["host"])
.clear()
.type(userMockHostAddress);
cy.get(datasourceEditor["databaseName"])
.clear()
.type(userMockDatabaseName);
cy.get(datasourceEditor["sectionAuthentication"]).click();
cy.get(datasourceEditor["password"])
.clear()
.type(datasourceFormData["mockDatabasePassword"]);
cy.get(datasourceEditor["username"])
.clear()
.type(userMockDatabaseUsername);
},
);
Cypress.Commands.add(
"fillSMTPDatasourceForm",
(shouldAddTrailingSpaces = false) => {
const hostAddress = shouldAddTrailingSpaces
? datasourceFormData["smtp-host"] + " "
: datasourceFormData["smtp-host"];
cy.get(datasourceEditor.host).type(hostAddress);
cy.get(datasourceEditor.port).type(datasourceFormData["smtp-port"]);
cy.get(datasourceEditor.sectionAuthentication).click();
cy.get(datasourceEditor.username).type(datasourceFormData["smtp-username"]);
cy.get(datasourceEditor.password).type(datasourceFormData["smtp-password"]);
},
);
Cypress.Commands.add("createPostgresDatasource", () => {
cy.NavigateToDatasourceEditor();
cy.get(datasourceEditor.PostgreSQL).click();
//cy.getPluginFormsAndCreateDatasource();
cy.fillPostgresDatasourceForm();
cy.testSaveDatasource();
});
Cypress.Commands.add("deleteDatasource", (datasourceName) => {
cy.NavigateToQueryEditor();
cy.get(pages.integrationActiveTab)
.should("be.visible")
.click({ force: true });
cy.contains(".t--datasource-name", datasourceName).click();
cy.get(".t--delete-datasource").click();
cy.get(".t--delete-datasource")
.contains("Are you sure?")
.click();
cy.wait("@deleteDatasource").should(
"have.nested.property",
"response.body.responseMeta.status",
200,
);
});
Cypress.Commands.add("renameDatasource", (datasourceName) => {
cy.get(".t--edit-datasource-name").click();
cy.get(".t--edit-datasource-name input")
.clear()
.type(datasourceName, { force: true })
.should("have.value", datasourceName)
.blur();
});
Cypress.Commands.add("fillAmazonS3DatasourceForm", () => {
cy.get(datasourceEditor.projectID)
.clear()
.type(Cypress.env("S3_ACCESS_KEY"));
cy.get(datasourceEditor.serviceAccCredential)
.clear()
.type(Cypress.env("S3_SECRET_KEY"));
});
Cypress.Commands.add("createAmazonS3Datasource", () => {
cy.NavigateToDatasourceEditor();
cy.get(datasourceEditor.AmazonS3).click();
cy.fillAmazonS3DatasourceForm();
cy.testSaveDatasource();
});
Cypress.Commands.add("fillMongoDatasourceFormWithURI", () => {
cy.xpath(datasourceEditor["mongoUriDropdown"])
.click()
.wait(500);
cy.xpath(datasourceEditor["mongoUriYes"])
.click()
.wait(500);
cy.xpath(datasourceEditor["mongoUriInput"]).type(
datasourceFormData["mongo-uri"],
);
});
Cypress.Commands.add("ReconnectDatasource", (datasource) => {
cy.xpath(`//span[text()='${datasource}']`).click();
});
Cypress.Commands.add("createMockDatasource", () => {
cy.get(".t--mock-datasource")
.contains("Users")
.click();
});
Cypress.Commands.add("datasourceCardContainerStyle", (tag) => {
cy.get(tag)
.should("have.css", "min-width", "150px")
.and("have.css", "border-radius", "4px")
.and("have.css", "align-items", "center");
});
Cypress.Commands.add("datasourceCardStyle", (tag) => {
cy.get(tag)
.should("have.css", "display", "flex")
.and("have.css", "justify-content", "space-between")
.and("have.css", "align-items", "center")
.and("have.css", "height", "64px")
.realHover()
.should("have.css", "background-color", backgroundColorGray1)
.and("have.css", "cursor", "pointer");
});
Cypress.Commands.add("datasourceImageStyle", (tag) => {
cy.get(tag)
.should("have.css", "height", "28px")
.and("have.css", "max-width", "100%");
});
Cypress.Commands.add("datasourceContentWrapperStyle", (tag) => {
cy.get(tag)
.should("have.css", "display", "flex")
.and("have.css", "align-items", "center")
.and("have.css", "gap", "13px")
.and("have.css", "padding-left", "13.5px");
});
Cypress.Commands.add("datasourceIconWrapperStyle", (tag) => {
cy.get(tag)
.should("have.css", "background-color", backgroundColorGray2)
.and("have.css", "width", "48px")
.and("have.css", "height", "48px")
.and("have.css", "border-radius", "50%")
.and("have.css", "display", "flex")
.and("have.css", "align-items", "center");
});
Cypress.Commands.add("datasourceNameStyle", (tag) => {
cy.get(tag)
.should("have.css", "color", backgroundColorBlack)
.and("have.css", "font-size", "16px")
.and("have.css", "font-weight", "400")
.and("have.css", "line-height", "24px")
.and("have.css", "letter-spacing", "-0.24px");
});
Cypress.Commands.add("mockDatasourceDescriptionStyle", (tag) => {
cy.get(tag)
.should("have.css", "color", backgroundColorGray8)
.and("have.css", "font-size", "13px")
.and("have.css", "font-weight", "400")
.and("have.css", "line-height", "17px")
.and("have.css", "letter-spacing", "-0.24px");
});