Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-23 08:58:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Merge pull request #7370 from ToolJet/appbuilder-1.3

Browse source 
Release v2.17.0 - App Builder 1.3
This commit is contained in:
Kavin Venkatachalam 2023-09-13 18:07:00 +05:30 committed by GitHub
commit a6bfc57c3e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
451 changed files with 25792 additions and 7810 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.version
View file

@ -1 +1 @@
2.16.1
2.17.0

14
cypress-tests/cypress.config.js
View file

@ -19,9 +19,9 @@ module.exports = defineConfig({
trashAssetsBeforeRuns: true,
e2e: {
setupNodeEvents (on, config) {
setupNodeEvents(on, config) {
on("task", {
readPdf (pathToPdf) {
readPdf(pathToPdf) {
return new Promise((resolve) => {
const pdfPath = path.resolve(pathToPdf);
let dataBuffer = fs.readFileSync(pdfPath);
@ -33,7 +33,7 @@ module.exports = defineConfig({
});
on("task", {
readXlsx (filePath) {
readXlsx(filePath) {
return new Promise((resolve, reject) => {
try {
let dataBuffer = fs.readFileSync(filePath);
@ -48,7 +48,7 @@ module.exports = defineConfig({
});
on("task", {
deleteFolder (folderName) {
deleteFolder(folderName) {
return new Promise((resolve, reject) => {
if (fs.existsSync(folderName)) {
rmdir(folderName, { maxRetries: 10, recursive: true }, (err) => {
@ -66,7 +66,7 @@ module.exports = defineConfig({
});
on("task", {
updateId ({ dbconfig, sql }) {
updateId({ dbconfig, sql }) {
const client = new pg.Pool(dbconfig);
return client.query(sql);
},
@ -79,8 +79,8 @@ module.exports = defineConfig({
baseUrl: "http://localhost:8082",
specPattern: "cypress/e2e/**/*.cy.js",
downloadsFolder: "cypress/downloads",
numTestsKeptInMemory: 25,
redirectionLimit: 10,
numTestsKeptInMemory: 10,
redirectionLimit: 5,
experimentalRunAllSpecs: true,
trashAssetsBeforeRuns: true,
experimentalMemoryManagement: true,

58
cypress-tests/cypress/commands/apiCommands.js
View file

@ -1,8 +1,8 @@
Cypress.Commands.add(
"apiLogin",
(userEmail = "dev@tooljet.io", userPassword = "password") => {
(userEmail = "dev@tooljet.io", userPassword = "password", workspaceId = '') => {
cy.request({
url: "http://localhost:3000/api/authenticate",
url: `http://localhost:3000/api/authenticate/${workspaceId}`,
method: "POST",
body: {
email: userEmail,
@ -23,20 +23,23 @@ Cypress.Commands.add(
Cypress.Commands.add("apiCreateGDS", (url, name, kind, options) => {
cy.getCookie("tj_auth_token").then((cookie) => {
cy.request({
method: "POST",
url: url,
headers: {
"Tj-Workspace-Id": Cypress.env("workspaceId"),
Cookie: `tj_auth_token=${cookie.value}`,
cy.request(
{
method: "POST",
url: url,
headers: {
"Tj-Workspace-Id": Cypress.env("workspaceId"),
Cookie: `tj_auth_token=${cookie.value}`,
},
body: {
name: name,
kind: kind,
options: options,
scope: "global",
},
},
body: {
name: name,
kind: kind,
options: options,
scope: "global",
},
}).then((response) => {
{ log: false }
).then((response) => {
expect(response.status).to.equal(201);
Cypress.log({
@ -49,10 +52,10 @@ Cypress.Commands.add("apiCreateGDS", (url, name, kind, options) => {
});
Cypress.Commands.add("apiCreateApp", (appName = "testApp") => {
cy.window().then((win) => {
cy.window({ log: false }).then((win) => {
win.localStorage.setItem("walkthroughCompleted", "true");
});
cy.getCookie("tj_auth_token").then((cookie) => {
cy.getCookie("tj_auth_token", { log: false }).then((cookie) => {
Cypress.env("authToken", `tj_auth_token=${cookie.value}`);
cy.request({
method: "POST",
@ -84,14 +87,17 @@ Cypress.Commands.add("apiCreateApp", (appName = "testApp") => {
});
Cypress.Commands.add("apiDeleteApp", (appId = Cypress.env("appId")) => {
cy.request({
method: "DELETE",
url: `http://localhost:3000/api/apps/${Cypress.env("appId")}`,
headers: {
"Tj-Workspace-Id": Cypress.env("workspaceId"),
Cookie: Cypress.env("authToken"),
cy.request(
{
method: "DELETE",
url: `http://localhost:3000/api/apps/${Cypress.env("appId")}`,
headers: {
"Tj-Workspace-Id": Cypress.env("workspaceId"),
Cookie: Cypress.env("authToken"),
},
},
}).then((response) => {
{ log: false }
).then((response) => {
expect(response.status).to.equal(200);
Cypress.log({
name: "App Delete",
@ -107,7 +113,7 @@ Cypress.Commands.add(
appId = Cypress.env("appId"),
componentSelector = "[data-cy='empty-editor-text']"
) => {
cy.window().then((win) => {
cy.window({ log: false }).then((win) => {
win.localStorage.setItem("walkthroughCompleted", "true");
});
cy.visit(`/${Cypress.env("workspaceId")}/apps/${Cypress.env("appId")}`);
@ -131,3 +137,5 @@ Cypress.Commands.add(
// { key: "ssl_certificate", value: "none", encrypted: false },
// ]
// );

26
cypress-tests/cypress/commands/commands.js
View file

@ -102,14 +102,14 @@ Cypress.Commands.add(
},
(subject, value) => {
cy.wrap(subject)
.click()
.realClick()
.find("pre.CodeMirror-line")
.invoke("text")
.then((text) => {
cy.wrap(subject).type(createBackspaceText(text)),
{
delay: 0,
};
cy.wrap(subject).type(createBackspaceText(text), { delay: 0 }),
{
delay: 0,
};
});
if (!Array.isArray(value)) {
cy.wrap(subject).type(value, {
@ -184,9 +184,9 @@ Cypress.Commands.add(
.invoke("text")
.then((text) => {
cy.wrap(subject).type(createBackspaceText(text)),
{
delay: 0,
};
{
delay: 0,
};
});
}
);
@ -247,7 +247,7 @@ Cypress.Commands.add("reloadAppForTheElement", (elementText) => {
});
Cypress.Commands.add("skipEditorPopover", () => {
cy.get(".text-muted");
// cy.get(".text-muted");
cy.wait(1000);
cy.get("body").then(($el) => {
if ($el.text().includes("Skip", { timeout: 2000 })) {
@ -283,3 +283,11 @@ Cypress.Commands.add("visitTheWorkspace", (workspaceName) => {
});
cy.wait(2000);
});
Cypress.Commands.add("hideTooltip", () => {
cy.get("body").then(($body) => {
if ($body.find(".tooltip-inner").length > 0) {
cy.get(".tooltip-inner").invoke("css", "display", "none");
}
});
});

10
cypress-tests/cypress/constants/selectors/common.js
View file

@ -9,7 +9,7 @@ export const commonSelectors = {
'.drawer-container > [style="position: fixed; z-index: 9999; inset: 16px; pointer-events: none;"] > .go4109123758 > .go2072408551',
toastCloseButton: '[data-cy="toast-close-button"]',
editButton: "[data-cy=edit-button]",
searchField: "[data-cy=widget-search-box]",
searchField: "[data-cy='widget-search-box-search-bar']",
firstWidget: "[data-cy=widget-list]:eq(0)",
canvas: "[data-cy=real-canvas]",
appCardOptionsButton: "[data-cy=app-card-menu-icon]",
@ -211,7 +211,7 @@ export const commonSelectors = {
editFolderOption: (folderName) => {
return `[data-cy="${cyParamName(folderName)}-edit-folder-option"]`;
},
inspectorPinIcon: '[data-cy="null-option-icon"]',
inspectorPinIcon: '.d-flex > [data-cy="left-sidebar-inspector"]',
groupInputFieldLabel: '[data-cy="label-group-input-field"]',
pageSectionHeader: '[data-cy="dashboard-section-header"]',
yesButton: '[data-cy="yes-button"]',
@ -286,15 +286,15 @@ export const commonWidgetSelector = {
},
buttonCloseEditorSideBar: "[data-cy='inspector-close-icon']",
buttonStylesEditorSideBar: "[data-cy='sidebar-option-styles']",
buttonStylesEditorSideBar: "#inspector-tab-styles",
WidgetNameInputField: "[data-cy=edit-widget-name]",
tooltipInputField: "[data-cy='tooltip-input-field']",
tooltipLabel: "[id=button-tooltip]",
noEventHandlerMessage: "[data-cy='no-event-handler-message']",
noEventHandlerMessage: "[data-cy='no-items-banner']",
addEventHandlerLink: "[data-cy='add-event-handler']",
addMoreEventHandlerLink: '[data-cy="add-more-event-handler"]',
addMoreEventHandlerLink: '[data-cy="add-event-handler"]',
eventHandlerCard: "[data-cy='event-handler-card']",
alertMessageInputField: "[data-cy='alert-message-input-field']",
eventSelection: '[data-cy="event-selection"]',

8
cypress-tests/cypress/constants/selectors/dataSource.js
View file

@ -1,3 +1,5 @@
import { cyParamName } from "../../constants/selectors/common";
export const dataSourceSelector = {
leftSidebarDatasourceButton: "[data-cy='left-sidebar-database-button']",
labelDataSources: "[data-cy='label-datasources']",
@ -8,7 +10,7 @@ export const dataSourceSelector = {
apiLabelAndCount: '[data-cy="apis-datasource-button"]',
cloudStorageLabelAndCount: '[data-cy="cloudstorage-datasource-button"]',
pluginsLabelAndCount: '[data-cy="plugins-datasource-button"]',
dataSourceSearchInputField: '[data-cy="datasource-search-input"]',
dataSourceSearchInputField: '[data-cy="home-page-search-bar"]',
postgresDataSource: "[data-cy='data-source-postgresql']",
dataSourceNameInputField: '[data-cy="data-source-name-input-filed"]',
@ -92,5 +94,7 @@ export const dataSourceSelector = {
unSavedModalTitle: '[data-cy="unsaved-changes-title"]',
eventQuerySelectionField: '[data-cy="query-selection-field"]',
connectionAlertText: '[data-cy="connection-alert-text"]',
deleteDSButton: (datasourceName) => {
return `[data-cy="${cyParamName(datasourceName)}-delete-button"]`
},
};

6
cypress-tests/cypress/constants/selectors/exportImport.js
View file

@ -10,12 +10,12 @@ export const appVersionSelectors = {
createNewVersion: '[data-cy="create-new-version-title"]',
versionNamelabel: '[data-cy="version-name-label"]',
appVersionMenuField:
'[data-cy="app-version-selector"] .undefined__indicators',
'[data-cy="app-version-selector"] .react-select__indicators',
versionNameInputField: '[data-cy="version-name-input-field"]',
createVersionFromLabel: '[data-cy="create-version-from-label"]',
createVersionInputField: '[data-cy="create-version-from-input-field"]',
createNewVersionButton: '[data-cy="create-new-version-button"]',
appVersionContentList: ".undefined__menu-list",
appVersionContentList: ".react-select__menu-list",
};
export const exportAppModalSelectors = {
selectVersionTitle: '[data-cy= "select-a-version-to-export-title"]',
@ -39,4 +39,4 @@ export const importSelectors = {
importAnApplication: '[data-cy="import-an-application"]',
importOptionLabel: '[data-cy="import-option-label"]',
importOptionInput: '[data-cy="import-option-input"]',
};
};

16
cypress-tests/cypress/constants/selectors/multipage.js
View file

@ -1,9 +1,9 @@
export const multipageSelector = {
sidebarPageButton: '[data-cy="left-sidebar-page-button"]',
pagesLabel: '[data-cy="label-pages"]',
addPageIcon: '[data-cy="add-page-option-icon"]',
searchPageIcon: '[data-cy="search-page-option-icon"]',
pagesPinIcon: '[data-cy="pin-panel-option-icon"]',
addPageIcon: '[title="Add Page"]',
searchPageIcon: '[title="Search"]',
pagesPinIcon: '[title="Pin"]',
homePageLabel: '[data-cy="pages-name-home"]',
homePageIcon: '[data-cy="home-page-icon"]',
@ -16,21 +16,21 @@ export const multipageSelector = {
renameOptionButton: '[data-cy="rename-option-button"]',
markHomePageIcon: '[data-cy="mark-home-option-icon"]',
markHomePageOptionButton: '[data-cy="mark-home-option-button"]',
hidePageOptionIcon: '[data-cy="hide-page-option-icon"]',
hidePageOptionButton: '[data-cy="hide-page-option-button"]',
hidePageOptionIcon: '[data-cy="hide-page-on-app-menu-option-icon"]',
hidePageOptionButton: '[data-cy="hide-page-on-app-menu-option-button"]',
eventHandlersOptionIcon: '[data-cy="event-handlers-option-icon"]',
eventHandlerOptionButton: '[data-cy="event-handlers-option-button"]',
disabledDeleteButton:
".menu-options > :nth-child(6)>.unstyled-button.disabled",
pagesMenuIcon: '[data-cy="menu-icon"]',
pagesMenuIcon: '[data-cy="page-global-settings"]',
pageHeaderSettings: '[data-cy="page-settings-header"]',
disableThePageMenuLabel: '[data-cy="disable-page-menu-label"]',
disableMenuDescription: '[data-cy="disable-page-menu-description"]',
disableMenuToggle: '[data-cy="disable-page-menu-toggle"]',
hidePageIcon: '[data-cy="hide-page-icon"]',
hidePageIcon: '[data-cy="icon-hidden"]',
deletePageOptionButton: '[data-cy="delete-page-option-button"]',
modalMessage: '[data-cy="modal-message"]',
modalConfirmButton: '[data-cy="modal-confirm-button"]',
@ -39,7 +39,7 @@ export const multipageSelector = {
modalTitlePageEvents: '[data-cy="modal-title-page-events"]',
pageEventsLabel: '[data-cy="page-events-labe"]',
addEventHandlerLink: '[data-cy="add-event-handler"]',
noEventHandlerMessage: '[data-cy="no-event-handler-message"]',
noEventHandlerMessage: '[data-cy="no-items-banner"]',
closeModal: '[data-cy="close-option-button"]',
closeIconEvents: '[data-cy="modal-close-button-page-events"]',
eventName: '[data-cy="event-name"]',

6
cypress-tests/cypress/constants/selectors/postgreSql.js
View file

@ -25,7 +25,7 @@ export const postgreSqlSelector = {
buttonTestConnection: '[data-cy="test-connection-button"]',
connectionFailedText: '[data-cy="test-connection-failed-text"]',
buttonSave: '[data-cy="db-connection-save-button"] > .tj-base-btn',
dangerAlertNotSupportSSL: '.go3958317564',
dangerAlertNotSupportSSL: ".go3958317564",
passwordTextField: '[data-cy="password-text-field"]',
textConnectionVerified: '[data-cy="test-connection-verified-text"]',
@ -50,7 +50,7 @@ export const postgreSqlSelector = {
toggleTransformation: '[data-cy="transformation-toggle-switch"]',
inputFieldTransformation: '[data-cy="transformation-input-input-field"]',
headerQueryPreview: '.py-2',
headerQueryPreview: ".py-2",
previewTabJson: '[data-cy="preview-tab-json"]',
previewTabRaw: '[data-cy="preview-tab-raw"]',
@ -69,7 +69,7 @@ export const postgreSqlSelector = {
labelSuccessMessageInput: '[data-cy="label-success-message-input"]',
notificationDurationInput: '[data-cy="label-notification-duration-input"]',
addEventHandler: '[data-cy="add-event-handler"]',
noEventHandlerMessage: '[data-cy="no-event-handler-message"]',
noEventHandlerMessage: '[data-cy="no-items-banner"]',
postgresqlQueryRunButton: '[data-cy="postgresql1-query-run-button"]',
psqlQueryLabel: '[data-cy="postgresql1-query-label"]',
psqlQueryDeleteButton: '[data-cy="postgresql1-query-delete-button"]',

4
cypress-tests/cypress/constants/selectors/table.js
View file

@ -4,6 +4,7 @@ export const tableSelector = {
return `[data-cy*="-cell-${index}"]`;
},
pageIndexDetails: '[data-cy="page-index-details"]',
currentPageIndexDetails: '[data-cy="page-index-details"] > .form-control',
paginationButtonToFirst: '[data-cy="pagination-button-to-first"]',
paginationButtonToPrevious: '[data-cy="pagination-button-to-previous"]',
@ -48,7 +49,7 @@ export const tableSelector = {
fxButton: (action) => {
return `[data-cy="${String(action)
.toLowerCase()
.replace(/\s+/g, "-")}-fx-button"]`;
.replace(/\s+/g, "-")}-fx-button"] > svg`;
},
toggleButton: (action) => {
@ -76,4 +77,5 @@ export const tableSelector = {
},
addNewRowTooltip: '[data-tooltip-id="tooltip-for-add-new-row"]',
manageColumns: '[data-tooltip-id="tooltip-for-manage-columns"]',
};

2
cypress-tests/cypress/constants/texts/button.js
View file

@ -3,7 +3,7 @@ export const buttonText = {
defaultWidgetName: "button1",
buttonTextLabel: "Button Text",
loadingState: "Loading State",
buttonDocumentationLink: "Button documentation",
buttonDocumentationLink: "Read documentation for Button",
backgroundColor: "Background Color",
textColor: "Text color",
loaderColor: "Loader color",

15
cypress-tests/cypress/constants/texts/common.js
View file

@ -10,7 +10,7 @@ export const path = {
};
export const commonText = {
autoSave: "Saved changes",
autoSave: "Changes saved",
email: "dev@tooljet.io",
password: "password",
loginErrorToast: "Invalid email or password",
@ -172,8 +172,10 @@ export const commonText = {
},
groupInputFieldLabel: "Select Group",
documentationLink: "Read Documentation",
constantsNameError: "Constant name should start with a letter or underscore and can only contain letters, numbers and underscores",
constantsValueError: "Value should be less than 10000 characters and cannot be empty"
constantsNameError:
"Constant name should start with a letter or underscore and can only contain letters, numbers and underscores",
constantsValueError:
"Value should be less than 10000 characters and cannot be empty",
};
export const commonWidgetText = {
@ -182,6 +184,7 @@ export const commonWidgetText = {
accordionGenaral: "General",
accordionValidation: "Validation",
accordionLayout: "Layout",
accordionDevices: "Devices",
parameterCustomValidation: "Custom validation",
parameterShowOnDesktop: "Show on desktop",
@ -192,7 +195,7 @@ export const commonWidgetText = {
borderRadiusInput: ["{{", "20}}"],
parameterOptionLabels: "Option labels",
parameterBoxShadow: "Box Shadow",
boxShadowDefaultValue: "0px 0px 0px 0px #00000040",
boxShadowDefaultValue: "#00000040",
parameterOptionvalues: "Option values",
boxShadowColor: "Box Shadow Color",
boxShadowFxValue: "-5px 6px 5px 8px #ee121240",
@ -202,7 +205,7 @@ export const commonWidgetText = {
codeMirrorInputTrue: codeMirrorInputLabel(true),
codeMirrorInputFalse: codeMirrorInputLabel("false"),
addEventHandlerLink: "Add handler",
addEventHandlerLink: "New event handler",
inspectorComponentLabel: "components",
componentValueLabel: "Value",
labelDefaultValue: "Default Value",
@ -224,7 +227,7 @@ export const commonWidgetText = {
return `Maximum ${value} characters is allowed`;
},
datepickerDocumentationLink: "Datepicker documentation",
datepickerDocumentationLink: "Read documentation for Datepicker",
text1: "text1",
textinput1: "textinput1",
toggleswitch1: "toggleswitch1",

126
cypress-tests/cypress/constants/texts/dataSource.js
View file

@ -1,74 +1,74 @@
export const dataSourceText = {
labelDataSources: "Datasources",
labelAddDataSource: "+ add data source",
labelDataSources: "Datasources",
labelAddDataSource: "+ add data source",
allDataSources: "All data sources (41)",
allDatabase: "Databases (17)",
allApis: "APIs (20)",
allCloudStorage: "Cloud Storage (4)",
pluginsLabelAndCount: "Plugins (0)",
allDataSources: "All data sources (41)",
allDatabase: "Databases (17)",
allApis: "APIs (20)",
allCloudStorage: "Cloud Storage (4)",
pluginsLabelAndCount: "Plugins (0)",
postgreSQL: "PostgreSQL",
labelHost: "Host",
labelPort: "Port",
labelSSL: "SSL",
labelDbName: "Database Name",
labelUserName: "Username",
labelPassword: "Password",
label: "Encrypted",
sslCertificate: "SSL Certificate",
whiteListIpText:
"Please white-list our IP address if the data source is not publicly accessible",
textCopy: "Copy",
readDocumentation: "Read documentation",
couldNotConnect: "could not connect",
buttonTextSave: "Save",
serverNotSuppotSsl: "The server does not support SSL connections",
psqlName: "cypress-postgresql",
postgreSQL: "PostgreSQL",
labelHost: "Host",
labelPort: "Port",
labelSSL: "SSL",
labelDbName: "Database Name",
labelUserName: "Username",
labelPassword: "Password",
label: "Encrypted",
sslCertificate: "SSL Certificate",
whiteListIpText:
"Please white-list our IP address if the data source is not publicly accessible",
textCopy: "Copy",
readDocumentation: "Read documentation",
couldNotConnect: "could not connect",
buttonTextSave: "Save",
serverNotSuppotSsl: "The server does not support SSL connections",
psqlName: "cypress-postgresql",
labelConnectionVerified: "connection verified",
toastDSAdded: "Data Source Added",
placeholderNameOfDB: "Name of the database",
placeholderEnterHost: "Enter host",
placeholderEnterPort: "Enter port",
placeholderEnterUserName: "Enter username",
labelConnectionVerified: "connection verified",
toastDSAdded: "Data Source Added",
placeholderNameOfDB: "Name of the database",
placeholderEnterHost: "Enter host",
placeholderEnterPort: "Enter port",
placeholderEnterUserName: "Enter username",
headerQueries: "Queries",
headerSelectDatasource: "Select Data Source",
noQueryText: "You haven't created queries yet.",
buttonLabelCreateQuery: "Create query",
tabGeneral: "General",
firstQueryName: "postgresql1",
buttonLabelPreview: "Preview",
buttonLabelCreateAndRun: "Create & Run",
buttonLabelCreate: "Create",
queryModeSql: "SQL mode",
queryModeGui: "GUI mode",
headerQueries: "Queries",
headerSelectDatasource: "Select Data Source",
noQueryText: "You haven't created queries yet.",
buttonLabelCreateQuery: "Create query",
tabGeneral: "General",
firstQueryName: "postgresql1",
buttonLabelPreview: "Preview",
buttonLabelCreateAndRun: "Create & Run",
buttonLabelCreate: "Create",
queryModeSql: "SQL mode",
queryModeGui: "GUI mode",
headerTransformations: "Enable Transformations",
json: "JSON",
raw: "Raw",
headerTransformations: "Enable Transformations",
json: "JSON",
raw: "Raw",
labelOperation: "Operation",
labelTable: "Table",
labelPrimaryKeyColumn: "Primary key column",
labelRecordsToUpdate: "Records to update",
labelOperation: "Operation",
labelTable: "Table",
labelPrimaryKeyColumn: "Primary key column",
labelRecordsToUpdate: "Records to update",
toggleLabelRunOnPageLoad: "Run this query on application load?",
toggleLabelconfirmation: "Request confirmation before running query?",
toggleLabelShowNotification: "Show notification on success?",
labelSuccessMessage: "Success Message",
labelNotificatioDuration: "Notification duration (s)",
toggleLabelRunOnPageLoad: "Run this query on application load?",
toggleLabelconfirmation: "Request confirmation before running query?",
toggleLabelShowNotification: "Show notification on success?",
labelSuccessMessage: "Success Message",
labelNotificatioDuration: "Notification duration (s)",
dialogueTextDelete: "Do you really want to delete this query?",
cancel: "Cancel",
yes: "Yes",
dialogueTextDelete: "Do you really want to delete this query?",
cancel: "Cancel",
yes: "Yes",
guiOptionBulkUpdate: "Bulk update using primary key",
buttonTextTestConnection: "Test Connection",
guiOptionBulkUpdate: "Bulk update using primary key",
buttonTextTestConnection: "Test Connection",
tabAdvanced: "Advanced",
labelNoEventhandler: "This query doesn't have any event handlers",
toastDSSaved: "Data Source Saved",
unSavedModalTitle: "Unsaved Changes"
};
tabAdvanced: "Advanced",
labelNoEventhandler: "No event handlers",
toastDSSaved: "Data Source Saved",
unSavedModalTitle: "Unsaved Changes",
};

2
cypress-tests/cypress/constants/texts/datePicker.js
View file

@ -13,6 +13,6 @@ export const datePickerText = {
labelEnableTimeSection: "Enable time selection?",
labelDisabledDates: "Disabled dates",
noEventMessage: "This datepicker doesn't have any event handlers",
noEventMessage: "No event handlers",
defaultTime: "12:00 AM",
};

2
cypress-tests/cypress/constants/texts/listview.js
View file

@ -2,6 +2,6 @@ export const listviewText = {
defaultWidgetName: "Listview1",
showBottomBorder: "Show bottom border",
rowHeight: "Row height",
noEventHandlerMessage: "This listview doesn't have any event handlers",
noEventHandlerMessage: "No event handlers",
listData: "List data",
};

8
cypress-tests/cypress/constants/texts/multipage.js
View file

@ -1,6 +1,6 @@
export const multipageText = {
labelPages: "Pages",
pageNameHome: "Home",
pageNameHome: "HomeHome",
headerPageHandle: "Page Handle",
pageHandleModalTitle: "Edit page handle",
editPagehandleInfo:
@ -10,13 +10,13 @@ export const multipageText = {
optionRename: "Rename",
optionMarkHome: "Mark home",
optionHidePage: "Hide page",
optionHidePage: "Hide page on app menu",
optionEventHandler: "Event Handlers",
eventModalTitle: "Page Events",
labelEvents: "Events",
addEventHandlerLink: "Add handler",
noEventHandlerInfo: "This page doesn't have any event handlers",
addEventHandlerLink: "New event handler",
noEventHandlerInfo: "No event handlers",
optionDeletePage: "Delete Page",
deleteModalMessage: "Do you really want to delete Home page?",

2
cypress-tests/cypress/constants/texts/multiselect.js
View file

@ -2,7 +2,7 @@ export const multiselectText = {
multiselect: "Multiselect",
defaultWidgetName: "Multiselect1",
labelAllItemsSelected: "All items are selected.",
noEventsMessage: "This multiselect doesn't have any event handlers",
noEventsMessage: "No event handlers",
dropdwonOptionSelectAll: "Select All",
enableSelectAllOptions: "Enable select All option",

4
cypress-tests/cypress/constants/texts/numberInput.js
View file

@ -1,4 +1,4 @@
export const numberInputText = {
defaultWidgetName: "numberinput1",
numberInputDocumentationLink: "NumberInput documentation",
}
numberInputDocumentationLink: "Read documentation for NumberInput",
};

2
cypress-tests/cypress/constants/texts/postgreSql.js
View file

@ -67,6 +67,6 @@ export const postgreSqlText = {
buttonTextTestConnection: "Test Connection",
tabAdvanced: "Advanced",
labelNoEventhandler: "This query doesn't have any event handlers",
labelNoEventhandler: "No event handlers",
toastDSSaved: "Data Source Saved",
};

6
cypress-tests/cypress/constants/texts/table.js
View file

@ -9,7 +9,9 @@ export const tableText = {
],
placeHolderSearch: "Search",
defaultPageIndexDetails: "1 of 1",
defaultPageIndexDetails: "of 1",
currentPageIndexDetails: 1,
defaultNumberOfRecords: "4 Records",
optionDownloadCSV: "Download as CSV",
@ -29,6 +31,6 @@ export const tableText = {
optionEquals: "equals",
labelDynamicColumn: "Use dynamic column",
makeEditable: "make editable",
makeEditable: "Make editable",
lableDisableActionButton: "Disable action button",
};

4
cypress-tests/cypress/constants/texts/textInput.js
View file

@ -1,4 +1,4 @@
export const textInputText = {
defaultWidgetName: "textinput1",
textInputDocumentationLink: "TextInput documentation",
}
textInputDocumentationLink: "Read documentation for TextInput",
};

2
cypress-tests/cypress/e2e/editor/data-source/snowflakeHappyPath.cy.js
View file

@ -103,7 +103,7 @@ describe("Data sources", () => {
);
cy.get('[data-cy="connection-alert-text"]').should(
"have.text",
"A user name must be specified."
"Network error. Could not reach Snowflake."
);
deleteDatasource(`cypress-${data.lastName}-snowflake`);
});

10
cypress-tests/cypress/e2e/editor/globalSetingsHappyPath.cy.js
View file

@ -20,8 +20,9 @@ import {
describe("Editor- Global Settings", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
});
it("should verify global settings", () => {
@ -42,13 +43,14 @@ describe("Editor- Global Settings", () => {
"have.text",
"Maintenance mode"
);
cy.hideTooltip();
cy.get('[data-cy="label-max-canvas-width"]').verifyVisibleElement(
"have.text",
"Max width of canvas"
);
cy.get('[data-cy="label-bg-canvas"]').verifyVisibleElement(
"have.text",
"Background color of canvas"
"Canvas background"
);
// cy.get('[data-cy="canvas-bg-colour-picker"]').click();
selectColourFromColourPicker(
@ -103,6 +105,6 @@ describe("Editor- Global Settings", () => {
.invoke("attr", "class")
.should("contains", "disabled-btn");
cy.wait(2000);
cy.apiDeleteApp();
});
});

8
cypress-tests/cypress/e2e/editor/inspectorHappypath.cy.js
View file

@ -14,8 +14,9 @@ import { multipageSelector } from "Selectors/multipage";
describe("Editor- Inspector", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
});
it("should verify the values of inspector", () => {
@ -128,7 +129,7 @@ describe("Editor- Inspector", () => {
verifyValue("key", "String", `"value"`);
cy.get(`[data-cy="inspector-node-key"] > .mx-1`).realHover();
cy.get(".mx-1 > img").realClick();
cy.get("[data-cy='copy-icon']").realClick();
cy.realPress("Escape");
cy.window().then((win) => {
@ -153,5 +154,6 @@ describe("Editor- Inspector", () => {
cy.get(`[data-cy="inspector-node-button1"] > .mx-1`).realHover();
cy.get('[style="height: 13px; width: 13px;"] > img').click();
cy.notVisible(commonWidgetSelector.draggableWidget("button1"));
cy.apiDeleteApp();
});
});

44
cypress-tests/cypress/e2e/editor/multipage/multipageHappypath.cy.js
View file

@ -40,8 +40,9 @@ import {
describe("Multipage", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
});
it("should verify the elements on multipage", () => {
@ -53,8 +54,6 @@ describe("Multipage", () => {
data.maximumLength = randomNumber(8, 10);
data.customText = randomString(12);
cy.renameApp(data.appName);
cy.get(multipageSelector.sidebarPageButton).click();
cy.get(multipageSelector.pagesLabel).verifyVisibleElement(
"have.text",
@ -112,7 +111,8 @@ describe("Multipage", () => {
cy.get(multipageSelector.pagesPinIcon).click();
cy.get(multipageSelector.sidebarPageButton).click();
cy.get(multipageSelector.pagesMenuIcon).click({ force: true });
cy.hideTooltip();
cy.get(multipageSelector.pagesMenuIcon).realClick();
cy.get(multipageSelector.pageHeaderSettings).verifyVisibleElement(
"have.text",
@ -133,7 +133,7 @@ describe("Multipage", () => {
cy.get('[data-cy="pages-name-test_page"]')
.verifyVisibleElement("have.text", "test_page")
.click();
cy.get(multipageSelector.pageMenuIcon).click();
cy.get(multipageSelector.pageMenuIcon).eq(1).click();
cy.wait(500);
cy.get(multipageSelector.pageHandleText).verifyVisibleElement(
"have.text",
@ -151,11 +151,14 @@ describe("Multipage", () => {
.find(multipageSelector.hidePageIcon)
.should("be.visible");
hideOrUnhidePage("home", "unhide");
hideOrUnhidePage("home", "show");
cy.notVisible(multipageSelector.hidePageIcon);
cy.get(multipageSelector.homePageLabel).click();
cy.get(multipageSelector.pageMenuIcon).click();
cy.get(multipageSelector.homePageLabel)
.click()
.parent()
.find(multipageSelector.pageMenuIcon)
.click();
cy.wait(500);
cy.get(multipageSelector.deletePageOptionButton).click();
cy.get(".modal-title").verifyVisibleElement(
@ -173,16 +176,20 @@ describe("Multipage", () => {
cy.get(multipageSelector.modalCancelButton)
.verifyVisibleElement("have.text", "Cancel")
.click();
cy.get('[data-cy="pages-name-test_page"]').should("be.visible");
cy.get(multipageSelector.pageMenuIcon).click();
cy.wait(500);
cy.get('[data-cy="pages-name-home"]')
.should("be.visible")
.click()
.parent()
.find(multipageSelector.pageMenuIcon)
.click();
cy.get(multipageSelector.deletePageOptionButton).click();
cy.get(multipageSelector.modalConfirmButton).click();
cy.notVisible(multipageSelector.homePageLabel);
cy.get(multipageSelector.pageMenuIcon).click();
cy.wait(500);
cy.get(multipageSelector.pageMenuIcon).click();
cy.get(multipageSelector.eventHandlerOptionButton).click();
cy.get(multipageSelector.modalTitlePageEvents).verifyVisibleElement(
"have.text",
@ -220,7 +227,12 @@ describe("Multipage", () => {
clearSearch();
addNewPage("test");
cy.get(multipageSelector.pageMenuIcon).click();
cy.get('[data-cy="pages-name-test"]')
.should("be.visible")
.click()
.parent()
.find(multipageSelector.pageMenuIcon)
.click();
cy.wait(500);
cy.get(multipageSelector.pageHandleText).click();
cy.get(multipageSelector.modalTitleEditPageHandle).verifyVisibleElement(
@ -264,7 +276,7 @@ describe("Multipage", () => {
hideOrUnhidePage("pageOne");
hideOrUnhidePage("pageTwo");
hideOrUnhidePage("pageOne", "unhide");
hideOrUnhidePage("pageOne", "show");
addEventHandler("pageThree");
cy.get(multipageSelector.closeModal).click();
setHomePage("pageThree");

17
cypress-tests/cypress/e2e/editor/queries/runjsHappyPath.cy.js
View file

@ -59,11 +59,13 @@ import {
searchPage,
} from "Support/utils/multipage";
import { verifyNodeData, openNode, verifyValue } from "Support/utils/inspector";
import { deleteDownloadsFolder } from "Support/utils/common";
describe("RunJS", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.viewport(1800, 1800);
cy.dragAndDropWidget("Button");
resizeQueryPanel("80");
@ -84,10 +86,12 @@ describe("RunJS", () => {
openNode("runjs1");
verifyValue("data", "Boolean", "true");
verifyValue("rawData", "Boolean", "true");
cy.apiDeleteApp();
});
it("should verify actions", () => {
const data = {};
deleteDownloadsFolder();
data.customText = randomString(12);
selectQueryFromLandingPage("runjs", "JavaScript");
@ -195,6 +199,11 @@ describe("RunJS", () => {
addInputOnQueryField("runjs", "actions.logout()");
query("run");
cy.get('[data-cy="sign-in-header"]').should("be.visible");
cy.apiLogin();
cy.openApp(
Cypress.env("appId"),
'[data-cy="draggable-widget-modal1-launch-button"]'
);
});
it("should verify global and page data", () => {
@ -243,6 +252,7 @@ describe("RunJS", () => {
query("preview");
verifypreview("raw", `true`);
}
addInputOnQueryField("runjs", "return globals.mode");
query("preview");
verifypreview("raw", `{"value":"edit"}`);
@ -250,6 +260,7 @@ describe("RunJS", () => {
addInputOnQueryField("runjs", "return constants");
query("preview");
verifypreview("raw", `{}`);
cy.apiDeleteApp();
});
it("should verify action by button", () => {
@ -275,6 +286,7 @@ describe("RunJS", () => {
cy.get('[data-cy="query-selection-field"]').should("have.text", "newrunjs");
cy.get(commonWidgetSelector.draggableWidget("button1")).click();
cy.verifyToastMessage(commonSelectors.toastMessage, "alert from runjs");
cy.apiDeleteApp();
});
it("should verify runjs toggle options", () => {
@ -320,5 +332,6 @@ describe("RunJS", () => {
cy.get('[data-cy="modal-confirm-button"]').realClick();
cy.verifyToastMessage(commonSelectors.toastMessage, "Success alert");
cy.verifyToastMessage(commonSelectors.toastMessage, "alert from runjs");
cy.apiDeleteApp();
});
});

11
cypress-tests/cypress/e2e/editor/queries/runpyHappyPath.cy.js
View file

@ -62,8 +62,9 @@ import { verifyNodeData, openNode, verifyValue } from "Support/utils/inspector";
describe("runpy", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.viewport(1800, 1800);
cy.dragAndDropWidget("Button");
resizeQueryPanel("80");
@ -86,6 +87,7 @@ describe("runpy", () => {
openNode("runpy1");
verifyValue("data", "Boolean", "true");
verifyValue("rawData", "Boolean", "true");
cy.apiDeleteApp();
});
it("should verify actions", () => {
@ -212,7 +214,6 @@ actions.unsetPageVariable('pageVar')`
cy.wait(200);
cy.waitForAutoSave();
query("run");
waitForQueryAction("run");
cy.get('[data-cy="sign-in-header"]').should("be.visible");
});
@ -258,6 +259,7 @@ actions.unsetPageVariable('pageVar')`
// query("preview");
// verifypreview("raw", `true`);
}
addInputOnQueryField("runpy", "tj_globals.mode.value");
query("preview");
verifypreview("raw", `edit`);
@ -265,6 +267,7 @@ actions.unsetPageVariable('pageVar')`
query("preview");
waitForQueryAction("preview");
verifypreview("raw", `{}`);
cy.apiDeleteApp();
});
it("should verify action by button", () => {
@ -290,6 +293,7 @@ actions.unsetPageVariable('pageVar')`
cy.get('[data-cy="query-selection-field"]').should("have.text", "newrunpy");
cy.get(commonWidgetSelector.draggableWidget("button1")).click();
cy.verifyToastMessage(commonSelectors.toastMessage, "alert from runpy");
cy.apiDeleteApp();
});
it("should verify runpy toggle options", () => {
@ -339,5 +343,6 @@ actions.unsetPageVariable('pageVar')`
"alert from runpy",
false
);
cy.apiDeleteApp();
});
});

19
cypress-tests/cypress/e2e/editor/widget/buttonHappyPath.cy.js
View file

@ -33,8 +33,9 @@ import {
describe("Editor- Test Button widget", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.dragAndDropWidget(buttonText.defaultWidgetText, 500, 500);
});
@ -95,9 +96,7 @@ describe("Editor- Test Button widget", () => {
);
verifyControlComponentAction(data.widgetName, data.customMessage);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
cy.apiDeleteApp(data.appName);
});
it("should verify the styles of the button widget", () => {
@ -224,9 +223,7 @@ describe("Editor- Test Button widget", () => {
data.boxShadowColor,
4
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
cy.apiDeleteApp(data.appName);
});
it("should verify the app preview", () => {
@ -281,7 +278,7 @@ describe("Editor- Test Button widget", () => {
commonWidgetText.parameterBorderRadius
)
)
.last()
.first()
.clear()
.type(buttonText.borderRadiusInput);
@ -340,8 +337,7 @@ describe("Editor- Test Button widget", () => {
data.boxShadowParam
);
cy.get(commonSelectors.viewerPageLogo).click();
cy.deleteApp(data.appName);
cy.apiDeleteApp(data.appName);
});
it("Should verify csa", () => {
@ -400,5 +396,6 @@ describe("Editor- Test Button widget", () => {
cy.get(
commonWidgetSelector.draggableWidget(buttonText.defaultWidgetName)
).should("not.be.visible");
cy.apiDeleteApp();
});
});

184
cypress-tests/cypress/e2e/editor/widget/componentsBasicHappypath.cy.js
View file

@ -35,18 +35,21 @@ describe("Basic components", () => {
const data = {};
beforeEach(() => {
data.appName = `${fake.companyName}-${fake.companyName}-App`;
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.modifyCanvasSize(900, 900);
cy.renameApp(data.appName);
cy.intercept("GET", "/api/comments/*").as("loadComments");
});
afterEach(() => {
cy.apiDeleteApp();
});
it("Should verify Toggle switch", () => {
cy.dragAndDropWidget("Toggle Switch", 50, 50);
cy.dragAndDropWidget("Toggle Switch", 200, 200);
verifyComponent("toggleswitch1");
cy.resizeWidget("toggleswitch1", 650, 400);
cy.resizeWidget("toggleswitch1", 650, 400, false);
openEditorSidebar("toggleswitch1");
editAndVerifyWidgetName("toggleswitch2");
@ -67,21 +70,18 @@ describe("Basic components", () => {
cy.go("back");
cy.waitForAppLoad();
deleteComponentAndVerify("toggleswitch2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Checkbox", () => {
cy.dragAndDropWidget("Checkbox", 50, 50);
// cy.resizeWidget("checkbox1", 50, 200);
resizeQueryPanel("0");
cy.dragAndDropWidget("Checkbox", 200, 200);
// cy.resizeWidget("checkbox1", 50, 200,false);
cy.forceClickOnCanvas();
verifyComponent("checkbox1");
cy.resizeWidget("checkbox1", 650, 400);
openEditorSidebar("checkbox1");
editAndVerifyWidgetName("checkbox2");
cy.resizeWidget("checkbox2", 650, 400, false);
verifyAndModifyParameter(commonWidgetText.parameterLabel, "label");
cy.forceClickOnCanvas();
@ -96,18 +96,15 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("checkbox2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Radio Button", () => {
cy.dragAndDropWidget("Radio Button", 50, 50);
// cy.resizeWidget("radiobutton1", 100, 200);
cy.dragAndDropWidget("Radio Button", 200, 200);
// cy.resizeWidget("radiobutton1", 100, 200,false);
cy.forceClickOnCanvas();
verifyComponent("radiobutton1");
cy.resizeWidget("radiobutton1", 650, 400);
cy.resizeWidget("radiobutton1", 650, 400, false);
openEditorSidebar("radiobutton1");
editAndVerifyWidgetName("radiobutton2");
@ -125,20 +122,17 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("radiobutton2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Dropdown", () => {
cy.dragAndDropWidget("Dropdown", 50, 50);
// cy.resizeWidget("radiobutton1", 100, 200);
resizeQueryPanel("0");
cy.dragAndDropWidget("Dropdown", 200, 200);
cy.resizeWidget("dropdown1", 400, 500, false);
cy.forceClickOnCanvas();
verifyComponent("dropdown1");
cy.resizeWidget("dropdown1", 650, 400);
openEditorSidebar("dropdown1");
editAndVerifyWidgetName("dropdown2");
cy.resizeWidget("dropdown2", 650, 400, false);
verifyAndModifyParameter(commonWidgetText.parameterLabel, "label");
cy.forceClickOnCanvas();
@ -153,22 +147,18 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("dropdown2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
//pending
it.skip("Should verify Rating", () => {
it("Should verify Rating", () => {
cy.dragAndDropWidget("Rating", 200, 200);
cy.get('[data-cy="draggable-widget-starrating1"]').click({ force: true });
cy.resizeWidget("starrating1", 200, 500);
cy.resizeWidget("starrating1", 400, 500, false);
cy.forceClickOnCanvas();
verifyComponent("starrating1");
cy.resizeWidget("starrating1", 650, 400);
openEditorSidebar("starrating1");
editAndVerifyWidgetName("starrating2");
cy.resizeWidget("starrating2", 650, 400, false);
verifyAndModifyParameter(commonWidgetText.parameterLabel, "label");
cy.forceClickOnCanvas();
@ -183,9 +173,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("starrating2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Button Group", () => {
@ -193,7 +180,7 @@ describe("Basic components", () => {
cy.forceClickOnCanvas();
verifyComponent("buttongroup1");
cy.resizeWidget("buttongroup1", 650, 400);
cy.resizeWidget("buttongroup1", 650, 400, false);
openEditorSidebar("buttongroup1");
editAndVerifyWidgetName("buttongroup2");
@ -210,18 +197,15 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("buttongroup2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Calendar", () => {
cy.dragAndDropWidget("Calendar", 50, 50);
cy.dragAndDropWidget("Calendar", 200, 200);
cy.get('[data-cy="draggable-widget-calendar1"]').click({ force: true });
cy.forceClickOnCanvas();
verifyComponent("calendar1");
cy.resizeWidget("calendar1", 650, 400);
cy.resizeWidget("calendar1", 650, 400, false);
openEditorSidebar("calendar1");
editAndVerifyWidgetName("calendar2");
@ -232,38 +216,31 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("calendar2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Chart", () => {
cy.dragAndDropWidget("Chart", 50, 50);
cy.dragAndDropWidget("Chart", 200, 200);
cy.get('[data-cy="draggable-widget-chart1"]').click({ force: true });
cy.forceClickOnCanvas();
verifyComponent("chart1");
cy.resizeWidget("chart1", 650, 400);
openEditorSidebar("chart1");
editAndVerifyWidgetName("chart2", ["Chart data", "Properties"]);
// cy.resizeWidget("chart1", 650, 400, false);
verifyAndModifyParameter("Title", "label");
cy.forceClickOnCanvas();
cy.waitForAutoSave();
cy.resizeWidget("chart2", 650, 400, false);
cy.get('[data-cy="draggable-widget-chart2"]').should(
"contain.text",
"label"
);
cy.waitForAutoSave();
cy.openInCurrentTab(commonWidgetSelector.previewButton);
verifyComponent("chart2");
cy.go("back");
deleteComponentAndVerify("chart2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Circular Progress Bar", () => {
@ -271,7 +248,7 @@ describe("Basic components", () => {
cy.forceClickOnCanvas();
verifyComponent("circularprogressbar1");
cy.resizeWidget("circularprogressbar1", 650, 400);
cy.resizeWidget("circularprogressbar1", 650, 400, false);
openEditorSidebar("circularprogressbar1");
editAndVerifyWidgetName("circularprogressbar2");
@ -284,9 +261,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("circularprogressbar2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Code Editor", () => {
@ -295,7 +269,7 @@ describe("Basic components", () => {
cy.forceClickOnCanvas();
verifyComponent("codeeditor1");
cy.resizeWidget("codeeditor1", 650, 400);
cy.resizeWidget("codeeditor1", 650, 400, false);
openEditorSidebar("codeeditor1");
editAndVerifyWidgetName("codeeditor2");
@ -307,9 +281,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("codeeditor2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Color Picker", () => {
@ -318,7 +289,7 @@ describe("Basic components", () => {
cy.forceClickOnCanvas();
verifyComponent("colorpicker1");
cy.resizeWidget("colorpicker1", 650, 400);
cy.resizeWidget("colorpicker1", 650, 400, false);
openEditorSidebar("colorpicker1");
editAndVerifyWidgetName("colorpicker2");
@ -331,17 +302,13 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("colorpicker2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
//needed fix
it.skip("Should verify Custom Component", () => {
cy.dragAndDropWidget("Custom Component", 50, 50);
cy.get('[data-cy="draggable-widget-customcomponent1"]').click({
force: true,
});
cy.forceClickOnCanvas();
it("Should verify Custom Component", () => {
cy.dragAndDropWidget("Custom Component", 200, 200);
// cy.get('[data-cy="draggable-widget-customcomponent1"]').click({
// force: true,
// });
// cy.forceClickOnCanvas();
verifyComponent("customcomponent1");
openEditorSidebar("customcomponent1");
@ -352,39 +319,33 @@ describe("Basic components", () => {
{ delay: 30 }
);
cy.forceClickOnCanvas();
cy.get(commonWidgetSelector.draggableWidget(name)).trigger("mouseover");
cy.get(commonWidgetSelector.widgetConfigHandle(name))
.click()
.should("have.text", name);
cy.resizeWidget("customcomponent1", 650, 400);
openEditorSidebar("customcomponent1");
cy.forceClickOnCanvas();
cy.waitForAutoSave();
cy.resizeWidget("customcomponent2", 650, 400, false);
cy.wait(2000);
cy.get(
commonWidgetSelector.draggableWidget("customcomponent2")
).realHover();
cy.get(commonWidgetSelector.widgetConfigHandle("customcomponent2"))
.click()
.should("have.text", "customcomponent2");
cy.openInCurrentTab(commonWidgetSelector.previewButton);
verifyComponent("customcomponent2", ["Code"]);
cy.go("back");
deleteComponentAndVerify("customcomponent2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Container", () => {
cy.dragAndDropWidget("Container", 50, 50);
cy.dragAndDropWidget("Container", 200, 200);
cy.forceClickOnCanvas();
verifyComponent("container1");
cy.resizeWidget("container1", 650, 400);
openEditorSidebar("container1");
editAndVerifyWidgetName("container2", ["Layout"]);
cy.forceClickOnCanvas();
cy.resizeWidget("container2", 650, 400, false);
cy.waitForAutoSave();
cy.openInCurrentTab(commonWidgetSelector.previewButton);
@ -392,9 +353,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("container2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Date-Range Picker", () => {
@ -403,7 +361,7 @@ describe("Basic components", () => {
cy.forceClickOnCanvas();
verifyComponent("daterangepicker1");
cy.resizeWidget("daterangepicker1", 650, 400);
cy.resizeWidget("daterangepicker1", 650, 400, false);
openEditorSidebar("daterangepicker1");
editAndVerifyWidgetName("daterangepicker2");
@ -416,11 +374,8 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("daterangepicker2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
//visible issue
// visible issue
it.skip("Should verify Divider", () => {
verifyComponentWithOutLabel(
"Divider",
@ -440,10 +395,10 @@ describe("Basic components", () => {
});
it("Should verify Form", () => {
cy.dragAndDropWidget("Form", 50, 50);
cy.dragAndDropWidget("Form", 200, 200);
verifyComponent("form1");
cy.resizeWidget("form1", 650, 400);
cy.resizeWidget("form1", 650, 400, false);
openEditorSidebar("form1");
editAndVerifyWidgetName("form2");
@ -455,16 +410,13 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("form2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify HTML", () => {
cy.dragAndDropWidget("HTML Viewe", 50, 50, "HTML Viewer"); // search logic WIP
cy.dragAndDropWidget("HTML Viewe", 200, 200, "HTML Viewer"); // search logic WIP
verifyComponent("html1");
cy.resizeWidget("html1", 650, 400);
cy.resizeWidget("html1", 650, 400, false);
openEditorSidebar("html1");
editAndVerifyWidgetName("html2");
@ -476,9 +428,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("html2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Icon", () => {
@ -489,7 +438,7 @@ describe("Basic components", () => {
verifyComponentWithOutLabel("Iframe", "iframe1", "iframe2", data.appName);
});
it.skip("Should verify Kamban", () => {
it.skip("Should verify Kanban", () => {
verifyComponentWithOutLabel("Kanban", "kanban1", "kanban2", data.appName);
});
@ -498,7 +447,7 @@ describe("Basic components", () => {
});
it("Should verify Map", () => {
cy.dragAndDropWidget("Map", 50, 50);
cy.dragAndDropWidget("Map", 200, 200);
cy.get("body").then(($body) => {
if ($body.find(".dismissButton").length > 0) {
cy.get(".dismissButton").click();
@ -507,7 +456,7 @@ describe("Basic components", () => {
verifyComponent("map1");
cy.resizeWidget("map1", 650, 400);
cy.resizeWidget("map1", 650, 400, false);
openEditorSidebar("map1");
editAndVerifyWidgetName("map2");
@ -519,9 +468,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("map2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Modal", () => {
@ -529,10 +475,10 @@ describe("Basic components", () => {
});
it("Should verify PDF", () => {
cy.dragAndDropWidget("PDF", 50, 50);
cy.dragAndDropWidget("PDF", 200, 200);
verifyComponent("pdf1");
cy.resizeWidget("pdf1", 650, 400);
cy.resizeWidget("pdf1", 650, 400, false);
openEditorSidebar("pdf1");
editAndVerifyWidgetName("pdf2");
@ -544,9 +490,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("pdf2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Pagination", () => {
@ -567,7 +510,7 @@ describe("Basic components", () => {
);
});
it.skip("Should verify Range Slider", () => {
it("Should verify Range Slider", () => {
verifyComponentWithOutLabel(
"Range Slider",
"rangeslider1",
@ -619,11 +562,11 @@ describe("Basic components", () => {
it("Should verify Tabs", () => {
cy.viewport(1200, 1300);
resizeQueryPanel("0");
cy.dragAndDropWidget("Tabs", 100, 100);
cy.dragAndDropWidget("Tabs", 200, 200);
verifyComponent("tabs1");
deleteComponentAndVerify("image1");
cy.resizeWidget("tabs1", 650, 400);
cy.resizeWidget("tabs1", 650, 400, false);
openEditorSidebar("tabs1");
editAndVerifyWidgetName("tabs2");
@ -635,9 +578,6 @@ describe("Basic components", () => {
cy.go("back");
deleteComponentAndVerify("tabs2");
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("Should verify Tags", () => {

11
cypress-tests/cypress/e2e/editor/widget/csa.cy.js
View file

@ -16,8 +16,13 @@ import { commonWidgetText } from "Texts/common";
describe("Editor- CSA", () => {
const toolJetImage = "cypress/fixtures/Image/tooljet.png";
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
});
afterEach(() => {
cy.apiDeleteApp();
});
it("Should verify Tabs CSA", () => {
@ -54,7 +59,7 @@ describe("Editor- CSA", () => {
selectCSA("form1", "Reset Form");
openEditorSidebar("form1");
cy.get('[data-cy="button-to-submit-form-fx-button"]').eq(1).click();
cy.get('[data-cy="button-to-submit-form-fx-button"] > svg').click();
cy.get(
'[data-cy="button-to-submit-form-input-field"]'
).clearAndTypeOnCodeMirror(`{{components.button2`);

15
cypress-tests/cypress/e2e/editor/widget/datePickerHappyPath.cy.js
View file

@ -32,11 +32,14 @@ import {
describe("Date Picker widget", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.dragAndDropWidget("Date Picker");
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify the properties of the date picker widget", () => {
const data = {};
data.alertMessage = fake.randomSentence;
@ -231,7 +234,7 @@ describe("Date Picker widget", () => {
cy.get(
`${commonWidgetSelector.parameterFxButton(
datePickerText.labelEnableDateSection
)}:eq(1)`
)}:eq(0)`
).click();
cy.get(
commonWidgetSelector.parameterInputField(
@ -245,7 +248,7 @@ describe("Date Picker widget", () => {
cy.get(
`${commonWidgetSelector.parameterFxButton(
datePickerText.labelEnableTimeSection
)}:eq(1)`
)}:eq(0)`
).click();
cy.get(
commonWidgetSelector.parameterInputField(
@ -278,7 +281,7 @@ describe("Date Picker widget", () => {
commonWidgetText.borderRadiusInput
);
openAccordion(commonWidgetText.accordionGenaral, []);
openAccordion(commonWidgetText.accordionGenaral, [], 1);
cy.get(
commonWidgetSelector.stylePicker(commonWidgetText.parameterBoxShadow)

22
cypress-tests/cypress/e2e/editor/widget/listViewHappyPath.cy.js
View file

@ -34,13 +34,17 @@ import {
describe("List view widget", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.viewport(1200, 1200);
cy.dragAndDropWidget("List View", 50, 500);
cy.modifyCanvasSize(1200, 700);
cy.intercept("PUT", "/api/apps/**").as("apps");
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify the properties of the list view widget", () => {
const data = {};
@ -224,7 +228,7 @@ describe("List view widget", () => {
).should("have.attr", "data-disabled", "true");
cy.get("[data-cy='disable-toggle-button']").click();
cy.get("[data-cy='border-radius-fx-button']:eq(1)").click();
cy.get("[data-cy='border-radius-fx-button']:eq(0)").click();
verifyAndModifyParameter(
commonWidgetText.parameterBorderRadius,
commonWidgetText.borderRadiusInput
@ -236,15 +240,15 @@ describe("List view widget", () => {
openEditorSidebar(listviewText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
openAccordion(commonWidgetText.accordionGenaral, []);
openAccordion(commonWidgetText.accordionGenaral, [], 1);
verifyAndModifyToggleFx(
commonWidgetText.parameterBoxShadow,
commonWidgetText.boxShadowDefaultValue,
"0px 0px 0px 0px #00000040",
false
);
cy.get('[data-cy="border-radius-fx-button"]').click();
cy.get('[data-cy="border-radius-fx-button"] > svg').click();
cy.get(commonWidgetSelector.boxShadowColorPicker).click();
fillBoxShadowParams(
@ -369,7 +373,7 @@ describe("List view widget", () => {
)
).click();
cy.get("[data-cy='border-radius-fx-button']:eq(1)").click();
cy.get("[data-cy='border-radius-fx-button']:eq(0)").click();
verifyAndModifyParameter(
commonWidgetText.parameterBorderRadius,
commonWidgetText.borderRadiusInput
@ -382,11 +386,11 @@ describe("List view widget", () => {
openEditorSidebar(listviewText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
openAccordion(commonWidgetText.accordionGenaral, []);
openAccordion(commonWidgetText.accordionGenaral, [], 1);
verifyAndModifyToggleFx(
commonWidgetText.parameterBoxShadow,
commonWidgetText.boxShadowDefaultValue,
"0px 0px 0px 0px #00000040",
false
);

35
cypress-tests/cypress/e2e/editor/widget/modalHappyPath.cy.js
View file

@ -40,10 +40,14 @@ import {
describe("Modal", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.dragAndDropWidget("Modal");
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify the properties of the modal component", () => {
const data = {};
@ -54,7 +58,6 @@ describe("Modal", () => {
data.tooltipText = fake.randomSentence;
data.buttonText = fake.companyName;
cy.renameApp(data.appName);
launchModal("modal1");
cy.get('[data-cy="modal-title"]').verifyVisibleElement(
"have.text",
@ -161,11 +164,8 @@ describe("Modal", () => {
cy.get(commonWidgetSelector.widgetDocumentationLink).should(
"have.text",
"Modal documentation"
"Read documentation for Modal"
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the styles of the modal widget", () => {
@ -176,7 +176,6 @@ describe("Modal", () => {
data.boxShadowParam = fake.boxShadowParam;
data.backgroundColor = fake.randomRgba;
cy.renameApp(data.appName);
launchModal("modal1");
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
@ -246,9 +245,6 @@ describe("Modal", () => {
"have.text",
"This title can be changed"
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the app preview", () => {
@ -261,19 +257,18 @@ describe("Modal", () => {
data.buttonTextColor = fake.randomRgba;
data.customTitle = fake.randomSentence;
cy.get(".close-svg > path").click();
cy.forceClickOnCanvas();
cy.dragAndDropWidget(commonWidgetText.toggleSwitch, 600, 50);
cy.get(".close-svg > path").click();
cy.forceClickOnCanvas();
cy.dragAndDropWidget(commonWidgetText.toggleSwitch, 600, 100);
cy.get(".close-svg > path").click();
cy.forceClickOnCanvas();
cy.dragAndDropWidget(commonWidgetText.toggleSwitch, 600, 150);
cy.get(".close-svg > path").click();
cy.forceClickOnCanvas();
cy.dragAndDropWidget(commonWidgetText.toggleSwitch, 600, 200);
cy.get(".close-svg > path").click();
cy.forceClickOnCanvas();
cy.dragAndDropWidget(commonWidgetText.toggleSwitch, 600, 250);
cy.get(".close-svg > path").click();
cy.forceClickOnCanvas();
cy.renameApp(data.appName);
launchModal("modal1");
verifyAndModifyParameter("Title", data.customTitle);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
@ -329,7 +324,7 @@ describe("Modal", () => {
commonWidgetText.parameterDisable,
"{{components.toggleswitch2.value"
);
cy.get('[data-cy="sidebar-option-properties"]').click();
cy.get("#inspector-tab-properties").click();
typeOnFx("Loading State", "{{components.toggleswitch3.value");
cy.get("[data-cy='modal-header']").realClick();
@ -437,7 +432,7 @@ describe("Modal", () => {
"This title can be changed"
);
cy.get(".close-svg > path").click();
cy.forceClickOnCanvas();
cy.dragAndDropWidget("Button", 500, 300, "Button", "[id*=canvas]:eq(2)");
selectEvent("On click", "Control Component");
selectCSA("modal1", "close");

16
cypress-tests/cypress/e2e/editor/widget/multiselectHappyPath.cy.js
View file

@ -40,10 +40,14 @@ import {
describe("Multiselect widget", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.dragAndDropWidget(multiselectText.multiselect);
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify the properties of the widget", () => {
const data = {};
@ -219,12 +223,14 @@ describe("Multiselect widget", () => {
openEditorSidebar(multiselectText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
openAccordion(commonWidgetText.accordionGenaral, []);
openAccordion(commonWidgetText.accordionGenaral, [], 1);
verifyAndModifyStylePickerFx(
commonWidgetText.parameterBoxShadow,
commonWidgetText.boxShadowDefaultValue,
commonWidgetText.boxShadowFxValue
commonWidgetText.boxShadowFxValue,
0,
"0px 0px 0px 0px "
);
cy.get(
commonWidgetSelector.parameterFxButton(
@ -287,7 +293,7 @@ describe("Multiselect widget", () => {
openEditorSidebar(data.widgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
openAccordion(commonWidgetText.accordionGenaral, []);
openAccordion(commonWidgetText.accordionGenaral, [], 1);
cy.get(
commonWidgetSelector.stylePicker(commonWidgetText.parameterBoxShadow)

37
cypress-tests/cypress/e2e/editor/widget/numberInputHappyPath.cy.js
View file

@ -23,10 +23,14 @@ import {
describe("Number Input", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.dragAndDropWidget("Number Input");
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify the properties of the number input widget", () => {
const data = {};
@ -37,8 +41,6 @@ describe("Number Input", () => {
data.minimumvalue = `${randomNumber(5, 10)}`;
data.maximumValue = `${randomNumber(90, 99)}`;
cy.renameApp(data.appName);
openEditorSidebar(numberInputText.defaultWidgetName);
editAndVerifyWidgetName(data.widgetName);
cy.get(
@ -78,9 +80,10 @@ describe("Number Input", () => {
commonWidgetSelector.draggableWidget(data.widgetName),
randomNumber(1, 4)
);
cy.forceClickOnCanvas();
cy.get(
commonWidgetSelector.draggableWidget(data.widgetName)
).verifyVisibleElement("have.value", `${data.minimumvalue}.00`);
).verifyVisibleElement("have.value", `${data.minimumvalue}`);
openEditorSidebar(data.widgetName);
openAccordion(commonWidgetText.accordionProperties, [
@ -96,9 +99,10 @@ describe("Number Input", () => {
commonWidgetSelector.draggableWidget(data.widgetName),
randomNumber(100, 110)
);
cy.forceClickOnCanvas;
cy.get(
commonWidgetSelector.draggableWidget(data.widgetName)
).verifyVisibleElement("have.value", `${data.maximumValue}.00`);
).verifyVisibleElement("have.value", `${data.maximumValue}`);
openEditorSidebar(data.widgetName);
openAccordion(commonWidgetText.accordionProperties, [
@ -130,9 +134,6 @@ describe("Number Input", () => {
"have.text",
numberInputText.numberInputDocumentationLink
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the styles of the number input widget", () => {
const data = {};
@ -141,8 +142,6 @@ describe("Number Input", () => {
data.boxShadowColor = fake.randomRgba;
data.boxShadowParam = fake.boxShadowParam;
cy.renameApp(data.appName);
openEditorSidebar(numberInputText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
@ -192,9 +191,6 @@ describe("Number Input", () => {
data.boxShadowColor,
3
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the app preview", () => {
@ -208,8 +204,6 @@ describe("Number Input", () => {
data.minimumvalue = randomNumber(5, 10);
data.maximumValue = randomNumber(90, 99);
cy.renameApp(data.appName);
openEditorSidebar(numberInputText.defaultWidgetName);
verifyAndModifyParameter(
commonWidgetText.labelDefaultValue,
@ -243,7 +237,7 @@ describe("Number Input", () => {
openEditorSidebar(numberInputText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
openAccordion(commonWidgetText.accordionGenaral, []);
openAccordion(commonWidgetText.accordionGenaral, [], 1);
cy.get(commonWidgetSelector.boxShadowColorPicker).click();
fillBoxShadowParams(
@ -268,16 +262,18 @@ describe("Number Input", () => {
commonWidgetSelector.draggableWidget(numberInputText.defaultWidgetName),
randomNumber(1, 4)
);
cy.forceClickOnCanvas();
cy.get(
commonWidgetSelector.draggableWidget(numberInputText.defaultWidgetName)
).verifyVisibleElement("have.value", `${data.minimumvalue}.00`);
).verifyVisibleElement("have.value", `${data.minimumvalue}`);
cy.clearAndType(
commonWidgetSelector.draggableWidget(numberInputText.defaultWidgetName),
randomNumber(100, 110)
);
cy.forceClickOnCanvas();
cy.get(
commonWidgetSelector.draggableWidget(numberInputText.defaultWidgetName)
).verifyVisibleElement("have.value", `${data.maximumValue}.00`);
).verifyVisibleElement("have.value", `${data.maximumValue}`);
cy.get(
commonWidgetSelector.draggableWidget(numberInputText.defaultWidgetName)
)
@ -300,8 +296,5 @@ describe("Number Input", () => {
data.boxShadowColor,
data.boxShadowParam
);
cy.get(commonSelectors.viewerPageLogo).click();
cy.deleteApp(data.appName);
});
});

39
cypress-tests/cypress/e2e/editor/widget/passwordInputHappyPath.cy.js
View file

@ -25,11 +25,15 @@ import { randomString } from "Support/utils/textInput";
describe("Password Input", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.modifyCanvasSize(1200, 780);
cy.dragAndDropWidget("Password Input", 350, 300);
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify the properties of the password input widget", () => {
const data = {};
@ -41,8 +45,6 @@ describe("Password Input", () => {
data.maximumLength = randomNumber(8, 10);
data.customText = randomString(12);
cy.renameApp(data.appName);
openEditorSidebar(passwordInputText.defaultWidgetName);
closeAccordions(["Events", "Validation", "Properties", "Layout"]);
editAndVerifyWidgetName(data.widgetName);
@ -169,11 +171,8 @@ describe("Password Input", () => {
cy.get(commonWidgetSelector.widgetDocumentationLink).should(
"have.text",
"PasswordInput documentation"
"Read documentation for PasswordInput"
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the styles of the password input widget", () => {
const data = {};
@ -182,8 +181,6 @@ describe("Password Input", () => {
data.boxShadowColor = fake.randomRgba;
data.boxShadowParam = fake.boxShadowParam;
cy.renameApp(data.appName);
openEditorSidebar(passwordInputText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
@ -233,9 +230,6 @@ describe("Password Input", () => {
data.boxShadowColor,
1
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the app preview", () => {
@ -251,8 +245,6 @@ describe("Password Input", () => {
data.customText = randomString(12);
data.maxLengthText = randomString(data.maximumLength);
cy.renameApp(data.appName);
openEditorSidebar(passwordInputText.defaultWidgetName);
verifyAndModifyParameter("Placeholder", data.customText);
@ -304,7 +296,7 @@ describe("Password Input", () => {
openEditorSidebar(passwordInputText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
openAccordion(commonWidgetText.accordionGenaral, []);
openAccordion(commonWidgetText.accordionGenaral, [], 1);
cy.get(commonWidgetSelector.boxShadowColorPicker).click();
fillBoxShadowParams(
@ -327,6 +319,11 @@ describe("Password Input", () => {
.should("contain", data.customText);
cy.get('[data-cy="real-canvas"]').click("topLeft", { force: true });
cy.get(
commonWidgetSelector.draggableWidget(passwordInputText.defaultWidgetName)
)
.type(" ")
.type("{selectAll}{backspace}");
cy.get(
commonWidgetSelector.validationFeedbackMessage(
passwordInputText.defaultWidgetName
@ -355,6 +352,13 @@ describe("Password Input", () => {
data.customText.toUpperCase()
);
cy.get('[data-cy="real-canvas"]').click("topLeft", { force: true });
// cy.get(
// commonWidgetSelector.draggableWidget(passwordInputText.defaultWidgetName)
// )
// .type("1")
// .type("{selectAll}{backspace}");
cy.get(
commonWidgetSelector.validationFeedbackMessage(
passwordInputText.defaultWidgetName
@ -383,8 +387,5 @@ describe("Password Input", () => {
commonWidgetSelector.draggableWidget(passwordInputText.defaultWidgetName),
data.tooltipText
);
cy.get(commonSelectors.viewerPageLogo).click();
cy.deleteApp(data.appName);
});
});

238
cypress-tests/cypress/e2e/editor/widget/tableRegression.cy.js
View file

@ -55,8 +55,9 @@ import { resizeQueryPanel } from "Support/utils/dataSource";
describe("Table", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
deleteDownloadsFolder();
cy.viewport(1400, 2200);
cy.modifyCanvasSize(900, 800);
@ -65,6 +66,9 @@ describe("Table", () => {
resizeQueryPanel("1");
cy.get(`[data-cy="allow-selection-toggle-button"]`).click({ force: true });
});
afterEach(() => {
cy.apiDeleteApp();
});
it("Should verify the table components and labels", () => {
cy.get(
@ -85,6 +89,9 @@ describe("Table", () => {
"have.text",
tableText.defaultPageIndexDetails
);
cy.get(`${tableSelector.pageIndexDetails}>input`)
.invoke("val")
.should("equal", "1");
cy.get(tableSelector.paginationButtonToFirst).should("be.visible");
cy.get(tableSelector.paginationButtonToPrevious).should("be.visible");
cy.get(tableSelector.paginationButtonToNext).should("be.visible");
@ -208,24 +215,13 @@ describe("Table", () => {
const data = {};
data.widgetName = fake.widgetName;
openEditorSidebar(tableText.defaultWidgetName);
editAndVerifyWidgetName(data.widgetName, [
"Options",
"Properties",
"Columns",
"Layout",
]);
editAndVerifyWidgetName(data.widgetName, []);
cy.forceClickOnCanvas();
openEditorSidebar(data.widgetName);
openAccordion(commonWidgetText.accordionProperties, [
"Options",
"Columns",
"Layout",
]);
verifyAndModifyParameter(
"Table data",
cy.get('[data-cy="table-data-input-field"]').clearAndTypeOnCodeMirror(
codeMirrorInputLabel(`[{id:1,name:"Mike",email:"mike@example.com" },{id:2,name:"Nina",email:"nina@example.com" },{id:3,name:"Steph",email:"steph@example.com" },{id:4,name:"Oliver",email:"oliver@example.com" },
]`)
]`)
);
// cy.get('[data-cy="inspector-close-icon"]').click();
cy.forceClickOnCanvas();
@ -238,21 +234,16 @@ describe("Table", () => {
]);
//cy.get('[data-cy="inspector-close-icon"]').click();
openEditorSidebar(data.widgetName);
openAccordion("Columns", ["Options", "Properties", "Layout"]);
openAccordion("Columns", []);
deleteAndVerifyColumn("email");
openEditorSidebar(data.widgetName);
openAccordion("Action buttons", [
"Options",
"Properties",
"Columns",
"Layout",
]);
cy.get('[data-cy="message-no-action-button"]').should(
openAccordion("Action buttons");
cy.get('[data-cy="no-items-banner-action-button"]').should(
"have.text",
"This table doesn't have any action buttons"
"There are no action buttons"
);
cy.get('[data-cy="button-add-new-action-button"]')
.should("have.text", "+ Add button")
.should("have.text", "New action button")
.click();
cy.get('[data-cy="action-button-button-0"]').verifyVisibleElement(
"have.text",
@ -303,12 +294,7 @@ describe("Table", () => {
cy.get('[data-cy="leftActions-cell-0"]').eq(0).find("button").click();
cy.verifyToastMessage(commonSelectors.toastMessage, "Hello world!");
openEditorSidebar(data.widgetName);
openAccordion(commonWidgetText.accordionEvents, [
"Options",
"Properties",
"Columns",
"Layout",
]);
openAccordion(commonWidgetText.accordionEvents, []);
cy.get('[data-cy="add-event-handler"]').click();
cy.get('[data-cy="event-handler-card"]').click();
cy.get('[data-cy="event-selection"]>')
@ -320,11 +306,7 @@ describe("Table", () => {
cy.get('[data-cy="inspector-close-icon"]').click();
openEditorSidebar(data.widgetName);
openAccordion(commonWidgetText.accordionLayout, [
"Options",
"Properties",
"Columns",
]);
openAccordion(commonWidgetText.accordionLayout, []);
verifyAndModifyToggleFx(
"Show on desktop",
@ -348,28 +330,21 @@ describe("Table", () => {
const data = {};
data.widgetName = fake.widgetName;
openEditorSidebar(tableText.defaultWidgetName);
editAndVerifyWidgetName(data.widgetName, [
"Options",
"Properties",
"Columns",
"Layout",
]);
editAndVerifyWidgetName(data.widgetName, []);
//String/default
openEditorSidebar(data.widgetName);
cy.wait(500);
deleteAndVerifyColumn("id");
deleteAndVerifyColumn("name");
deleteAndVerifyColumn("email");
cy.wait(500);
addAndOpenColumnOption("Fake-String", `string`);
selectDropdownOption('[data-cy="input-overflow"] >>:eq(0)', `wrap`);
cy.get('[data-index="0"]>.select-search-option:eq(1)').realClick();
cy.wait(2000);
verifyAndEnterColumnOptionInput("key", "name");
verifyAndEnterColumnOptionInput("Text color", "red");
verifyAndEnterColumnOptionInput(
"Cell Background Color",
"{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}{backspace}yellow"
);
verifyAndEnterColumnOptionInput("Cell Background Color", "yellow");
cy.get(
'[data-cy="input-and-label-cell-background-color"] > .form-label'
).click();
@ -392,17 +367,22 @@ describe("Table", () => {
verifyAndEnterColumnOptionInput("Regex", "AABb");
verifyAndEnterColumnOptionInput("Min length", "4");
verifyAndEnterColumnOptionInput("Max length", "5");
verifyAndEnterColumnOptionInput("Custom rule", "{backspace}");
verifyAndEnterColumnOptionInput("Custom rule", " ");
verifyInvalidFeedback(0, 0, "The input should match pattern");
addInputOnTable(0, 0, "AABb");
// cy.notVisible('[data-cy="stringsarah-cell-0"] >>>.invalid-feedback');
openEditorSidebar(data.widgetName);
deleteAndVerifyColumn("Fake-String");
deleteAndVerifyColumn("fake-string");
openEditorSidebar(data.widgetName);
addAndOpenColumnOption("fake-number", `number`);
// cy.intercept("PUT", "/api/apps/**").as("appSave");
// cy.wait("@appSave");
// cy.wait(1000);
verifyAndEnterColumnOptionInput("key", "id");
// cy.wait("@appSave");
// verifyAndEnterColumnOptionInput("Cell Background Color", "black");
cy.get('[data-cy="make-editable-toggle-button"]').click();
cy.get('[data-cy="header-validation"]').verifyVisibleElement(
@ -430,7 +410,7 @@ describe("Table", () => {
openEditorSidebar(data.widgetName);
addAndOpenColumnOption("fake-badge", `badge`);
verifyAndEnterColumnOptionInput("key", "");
verifyAndEnterColumnOptionInput("key", " ");
verifyAndEnterColumnOptionInput("Values", "{{[1,2,3]");
verifyAndEnterColumnOptionInput("Labels", '{{["One","Two","Three"]');
@ -445,9 +425,9 @@ describe("Table", () => {
openEditorSidebar(data.widgetName);
addAndOpenColumnOption("fake-multiple-badge", `multipleBadges`);
verifyAndEnterColumnOptionInput("key", "id");
verifyAndEnterColumnOptionInput("Values", "{{[1,2,3]");
cy.wait(500);
verifyAndEnterColumnOptionInput("Labels", '{{["One","Two","Three"]');
// verifyAndEnterColumnOptionInput("Cell Background Color", "fakeString");
cy.get('[data-cy="make-editable-toggle-button"]').click();
@ -469,12 +449,14 @@ describe("Table", () => {
deleteAndVerifyColumn("fake-multiple-badge");
openEditorSidebar(data.widgetName);
verifyAndModifyParameter(
"Table data",
cy.get('[data-cy="table-data-input-field"]').clearAndTypeOnCodeMirror(
codeMirrorInputLabel(`[{id:1,name:"Mike",email:"mike@example.com", tags:['One','Two','Three'] },{id:2,name:"Nina",email:"nina@example.com" },{id:3,name:"Steph",email:"steph@example.com", tags:['One','Two','Three'] },{id:4,name:"Oliver",email:"oliver@example.com" },
]`)
]`)
);
closeAccordions(["Options"]);
// closeAccordions(["Options"]);
cy.get('[data-cy="widget-accordion-data"]').click();
deleteAndVerifyColumn("tags");
addAndOpenColumnOption("fake-tags", `tags`);
verifyAndEnterColumnOptionInput("key", "tags");
@ -483,14 +465,14 @@ describe("Table", () => {
cy.get('[data-cy="make-editable-toggle-button"]').click();
cy.forceClickOnCanvas();
cy.get(`${tableSelector.column(1)}:eq(0) .badge`)
cy.get(`${tableSelector.column(0)}:eq(0) .badge`)
.eq(0)
.should("have.text", "Onex")
.next()
.should("have.text", "Twox")
.next()
.should("have.text", "Threex");
cy.get(`${tableSelector.column(1)}:eq(0) .badge`)
cy.get(`${tableSelector.column(0)}:eq(0) .badge`)
.first()
.click({ force: true })
.trigger("mouseover")
@ -524,7 +506,7 @@ describe("Table", () => {
openEditorSidebar(data.widgetName);
addAndOpenColumnOption("fake-radio", `radio`);
verifyAndEnterColumnOptionInput("key", "");
verifyAndEnterColumnOptionInput("key", " ");
verifyAndEnterColumnOptionInput("Values", "{{[1,2,3]");
verifyAndEnterColumnOptionInput("Labels", '{{["One","Two","Three"]');
@ -546,17 +528,16 @@ describe("Table", () => {
deleteAndVerifyColumn("fake-multiselect");
// openEditorSidebar(data.widgetName);
addAndOpenColumnOption("fake-toggleSwitch", `toggleSwitch`);
addAndOpenColumnOption("fake-toggleswitch", `toggleSwitch`);
verifyAndEnterColumnOptionInput("key", "fakeString");
// verifyAndEnterColumnOptionInput("Active color", "green"); //use color Picker
// verifyAndEnterColumnOptionInput("Cell Background Color", "fakeString");
cy.get('[data-cy="make-editable-toggle-button"]').click();
deleteAndVerifyColumn("fake-toggleSwitch");
deleteAndVerifyColumn("fake-toggleswitch");
//Toggle Switch
// openEditorSidebar(data.widgetName);
addAndOpenColumnOption("fake-datePicker", `datePicker`);
openEditorSidebar(data.widgetName);
addAndOpenColumnOption("fake-datepicker", `datePicker`);
verifyAndEnterColumnOptionInput("key", "fakeString");
// verifyAndEnterColumnOptionInput("Date Display format", "fakeString");
@ -568,15 +549,14 @@ describe("Table", () => {
// verifyAndEnterColumnOptionInput("Parse in timezone", "fakeString");
// verifyAndEnterColumnOptionInput("Display in timezone", "fakeString");
deleteAndVerifyColumn("fake-datePicker");
deleteAndVerifyColumn("fake-datepicker");
verifyAndModifyToggleFx(
tableText.labelDynamicColumn,
commonWidgetText.codeMirrorLabelFalse
);
cy.get('[data-cy*="-cell-1"]').should("have.class", "has-text");
verifyAndModifyParameter(
"Column data",
cy.get('[data-cy="column-data-input-field"] ').clearAndTypeOnCodeMirror(
codeMirrorInputLabel(
`[{name: 'User email', key: 'email'}, {name: 'Full name', key: 'name', isEditable: false}]`
)
@ -588,15 +568,16 @@ describe("Table", () => {
cy.get('[data-cy*="-cell-1"]').should("not.have.class", "has-text");
openEditorSidebar(data.widgetName);
verifyAndModifyParameter(
"Column data",
cy.get('[data-cy="column-data-input-field"] ').clearAndTypeOnCodeMirror(
codeMirrorInputLabel(
`[{name: 'User email', key: 'email'}, {name: 'Full name', key: 'name', isEditable: true}]`
)
);
cy.forceClickOnCanvas();
cy.waitForAutoSave();
cy.get('[data-cy*="-cell-1"]')
.eq(0)
.find("input")
.click()
.type(`{selectAll}{backspace}Mike Jon`);
cy.forceClickOnCanvas();
@ -607,8 +588,7 @@ describe("Table", () => {
cy.get('[data-cy="table-button-save-changes"]').should("be.visible");
openEditorSidebar(data.widgetName);
verifyAndModifyParameter(
"Column data",
cy.get('[data-cy="column-data-input-field"] ').clearAndTypeOnCodeMirror(
codeMirrorInputLabel(
`[{name: 'email', key: 'email', cellBackgroundColor: '#000', textColor: '#fff'}, {name: 'Full name', key: 'name', minLength: 5, maxLength: 6, isEditable: true}]`
)
@ -666,15 +646,10 @@ describe("Table", () => {
cy.get(commonWidgetSelector.buttonCloseEditorSideBar).click();
openEditorSidebar(tableText.defaultWidgetName);
openAccordion("Columns", ["Options", "Properties", "Layout"]);
openAccordion("Columns");
deleteAndVerifyColumn("email");
openEditorSidebar(tableText.defaultWidgetName);
openAccordion("Action buttons", [
"Options",
"Properties",
"Columns",
"Layout",
]);
openAccordion("Action buttons");
cy.get('[data-cy="button-add-new-action-button"]').click();
cy.get('[data-cy="rightActions-cell-2"]')
@ -702,7 +677,8 @@ describe("Table", () => {
verifyAndModifyToggleFx(
commonWidgetText.parameterBoxShadow,
commonWidgetText.boxShadowDefaultValue,
false
false,
"0px 0px 0px 0px "
);
cy.get(commonWidgetSelector.boxShadowColorPicker).click();
@ -727,9 +703,7 @@ describe("Table", () => {
"have.text",
"Table type"
);
cy.get(
'[data-cy="table-type-fx-button"][class*="fx-button unselectable"]'
).click();
cy.get('[data-cy="table-type-fx-button"] > svg').click();
cy.get('[data-cy="table-type-input-field"]').clearAndTypeOnCodeMirror(
`randomText`
);
@ -743,7 +717,7 @@ describe("Table", () => {
).click();
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
cy.get('[data-cy="table-type-fx-button"]').click();
cy.get('[data-cy="table-type-fx-button"]>svg').click();
cy.get('[data-cy="dropdown-table-type"]').click();
selectFromSidebarDropdown('[data-cy="dropdown-table-type"]', "Classic");
cy.forceClickOnCanvas();
@ -754,25 +728,20 @@ describe("Table", () => {
.and("contain", "classic");
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
selectFromSidebarDropdown(
'[data-cy="dropdown-table-type"]',
"Striped & bordered"
);
selectFromSidebarDropdown('[data-cy="dropdown-table-type"]', "Striped");
cy.forceClickOnCanvas();
cy.get(commonWidgetSelector.draggableWidget(tableText.defaultWidgetName))
.click()
.find("table")
.invoke("attr", "class")
.and("contain", "table-striped table-bordered ");
.and("contain", "table-striped");
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
cy.get('[data-cy="label-cell-size"]').verifyVisibleElement(
"have.text",
"Cell size"
);
cy.get(
'[data-cy="cell-size-fx-button"][class*="fx-button unselectable"]'
).click();
cy.get('[data-cy="cell-size-fx-button"] > svg').click();
cy.get('[data-cy="cell-size-input-field"]').clearAndTypeOnCodeMirror(
`randomText`
@ -788,8 +757,8 @@ describe("Table", () => {
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
cy.get('[data-cy="cell-size-fx-button"]').click();
selectFromSidebarDropdown('[data-cy="dropdown-cell-size"]', "Spacious");
cy.get('[data-cy="cell-size-fx-button"] >svg').click();
selectFromSidebarDropdown('[data-cy="dropdown-cell-size"]', "Condensed");
cy.forceClickOnCanvas();
cy.get(
commonWidgetSelector.draggableWidget(tableText.defaultWidgetName)
@ -798,7 +767,7 @@ describe("Table", () => {
cy.get(tableSelector.column(0))
.eq(0)
.invoke("attr", "class")
.and("contain", "spacious");
.and("contain", "condensed");
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
cy.get('[data-cy="label-text-color"]').verifyVisibleElement(
@ -822,42 +791,37 @@ describe("Table", () => {
it("should verify table options", () => {
openEditorSidebar(tableText.defaultWidgetName);
closeAccordions(["Action buttons", "Columns", "Properties"]);
verifyAndModifyToggleFx("Client-side pagination", "{{true}}", true);
cy.get('[data-cy="server-side-pagination-toggle-button"]').click();
verifyAndModifyToggleFx("Enable pagination", "{{true}}", true);
cy.get('[data-cy="enable-pagination-toggle-button"]').click();
cy.get(tableSelector.paginationButtonToPrevious).should("be.visible");
cy.get(tableSelector.paginationButtonToNext).should("be.visible");
verifyAndModifyToggleFx("Enable previous page button", "{{true}}", true);
cy.get(tableSelector.paginationButtonToPrevious).should("be.disabled");
verifyAndModifyToggleFx("Enable next page button", "{{true}}", true);
cy.get(tableSelector.paginationButtonToNext).should("be.disabled");
cy.get("[data-state=off]:eq(3)").click();
cy.get('[data-cy="label-total-records-server-side"]').verifyVisibleElement(
"have.text",
"Total records server side"
);
cy.get('[data-cy="server-side-pagination-toggle-button"]').click();
cy.get('[data-cy="client-side-pagination-toggle-button"]').click();
// cy.get('[data-cy="enable-pagination-toggle-button"]').click();
cy.get("[data-state=off]:eq(3)").click();
cy.get('[data-cy="label-number-of-rows-per-page"]').verifyVisibleElement(
"have.text",
"Number of rows per page"
);
verifyAndModifyToggleFx("Enable sorting", "{{true}}", true); //inputfield
cy.get('[data-cy="enable-sorting-toggle-button"]').click();
verifyAndModifyToggleFx("Server-side sort", "{{false}}", true);
verifyAndModifyToggleFx("Enable column sorting", "{{true}}", true); //inputfield
cy.get('[data-cy="enable-column-sorting-toggle-button"]').click();
verifyAndModifyToggleFx("Show download button", "{{true}}", true);
cy.notVisible('[data-tooltip-id="tooltip-for-download"]');
verifyAndModifyToggleFx("Show filter button", "{{true}}", true);
verifyAndModifyToggleFx("Enable filtering", "{{true}}", true);
cy.notVisible('[data-tooltip-id="tooltip-for-filter-data"]');
cy.get('[data-cy="show-filter-button-toggle-button"]').click();
verifyAndModifyToggleFx("Server-side filter", "{{false}}", true);
verifyAndModifyToggleFx("Show update buttons", "{{true}}", true);
// cy.get('[data-cy="show-filter-button-toggle-button"]').click();
// verifyAndModifyToggleFx("Server-side filter", "{{false}}", true);
// verifyAndModifyToggleFx("Show update buttons", "{{true}}", true);
cy.get(`[data-cy="allow-selection-toggle-button"]`).click({ force: true });
verifyAndModifyToggleFx("Bulk selection", "{{false}}", true);
@ -867,12 +831,12 @@ describe("Table", () => {
verifyAndModifyToggleFx("Hide column selector button", "{{false}}", true);
cy.notVisible('[data-cy="select-column-icon"]');
verifyAndModifyToggleFx("Show search box", "{{true}}", true);
verifyAndModifyToggleFx("Show search", "{{true}}", true);
cy.notVisible('[data-cy="search-input-field"]');
cy.get('[data-cy="show-search-box-toggle-button"]').click();
// cy.get('[data-cy="show-search-box-toggle-button"]').click();
verifyAndModifyToggleFx("Server-side search", "", true);
// verifyAndModifyToggleFx("Server-side search", " ", true);
verifyAndModifyToggleFx("Loading State", "{{false}}", true);
});
@ -900,7 +864,7 @@ describe("Table", () => {
cy.get(
commonWidgetSelector.draggableWidget(tableText.defaultWidgetName)
).should("be.visible");
cy.get(tableSelector.filterButton).click();
// cy.get(tableSelector.filterButton).click();
addFilter(
[{ column: "name", operation: "contains", value: "Sarah" }],
true
@ -1009,6 +973,7 @@ describe("Table", () => {
});
it("should verify table CSA", () => {
deleteDownloadsFolder();
cy.get('[data-cy="column-id"]').click();
cy.get('[data-cy="make-editable-toggle-button"]').click();
cy.get(`[data-cy="allow-selection-toggle-button"]`).click({ force: true });
@ -1072,7 +1037,10 @@ describe("Table", () => {
cy.get(commonWidgetSelector.draggableWidget("button1")).click();
cy.get('[data-cy*="-cell-1"] ').eq(1).should("have.text", "Jon");
cy.get('[data-cy="page-index-details"]').should("have.text", "2 of 2");
cy.get('[data-cy="page-index-details"]').should("have.text", "of 2");
cy.get(`${tableSelector.pageIndexDetails}>input`)
.invoke("val")
.should("equal", "2");
cy.get('[data-cy="3-cell-0"]')
.click()
@ -1093,7 +1061,7 @@ describe("Table", () => {
cy.get(".tooltip-inner").invoke("hide");
verifyNodeData("components", "Object", "9 entries ");
openNode("components");
verifyNodeData(tableText.defaultWidgetName, "Object", "21 entries ");
verifyNodeData(tableText.defaultWidgetName, "Object", "23 entries ");
openNode(tableText.defaultWidgetName);
verifyNodeData("newRows", "Array", "0 item ");
@ -1127,10 +1095,10 @@ describe("Table", () => {
cy.get(".tooltip-inner").invoke("hide");
verifyNodeData("components", "Object", "1 entry ");
openNode("components");
verifyNodeData(tableText.defaultWidgetName, "Object", "17 entries ");
verifyNodeData(tableText.defaultWidgetName, "Object", "22 entries ");
cy.wait(1000);
openNode(tableText.defaultWidgetName);
cy.wait(500);
openNode(tableText.defaultWidgetName, 0, 1);
openNode(tableText.defaultWidgetName, 0, 1);
verifyNodeData("newRows", "Array", "1 item ");
openNode("newRows");
verifyNodeData("0", "Object", "3 entries ");
@ -1142,7 +1110,7 @@ describe("Table", () => {
it("should verify Disable action button", () => {
cy.get('[data-cy="button-add-new-action-button"]')
.should("have.text", "+ Add button")
.should("have.text", "New action button")
.click();
cy.get('[data-cy="action-button-button-0"]').verifyVisibleElement(
@ -1196,7 +1164,7 @@ describe("Table", () => {
cy.get('[data-cy="action-button-button-0"]').click();
cy.get(tableSelector.fxButton(tableText.lableDisableActionButton))
.should("be.visible")
.eq(1)
.eq(0)
.click();
cy.get(
commonWidgetSelector.parameterInputField(
@ -1237,9 +1205,7 @@ describe("Table", () => {
"Column Email"
);
openEditorSidebar(tableText.defaultWidgetName);
cy.get(tableSelector.draggableHandleColumn("email"))
.should("be.visible")
.click();
cy.get('[data-cy="pages-name-email"]').should("be.visible").click();
cy.get(`[data-cy="input-and-label-column-name"]`)
.find("label")
.should("have.text", "Column name");
@ -1249,7 +1215,7 @@ describe("Table", () => {
.clearAndTypeOnCodeMirror(`{{components.text1.text`);
cy.forceClickOnCanvas();
openEditorSidebar(tableText.defaultWidgetName);
cy.get(tableSelector.draggableHandleColumn("Column Email"))
cy.get('[data-cy="pages-name-column email"]')
.scrollIntoView()
.should("be.visible");
cy.get(tableSelector.columnHeader("column-email"))
@ -1259,30 +1225,30 @@ describe("Table", () => {
cy.dragAndDropWidget("Toggle Switch", 800, 300);
openEditorSidebar(tableText.defaultWidgetName);
cy.get(tableSelector.draggableHandleColumn("name"))
.should("be.visible")
.click();
verifyAndModifyToggleFx(tableText.makeEditable, "{{false}}");
cy.get('[data-cy="column-Column Email"]').should("be.visible").click();
verifyAndModifyToggleFx(tableText.makeEditable, "{{false}}", 0);
cy.get(tableSelector.toggleButton(tableText.makeEditable)).click();
cy.get(tableSelector.fxButton(tableText.makeEditable))
.should("be.visible")
.eq(1)
.eq(0)
.click();
cy.get(commonWidgetSelector.parameterInputField(tableText.makeEditable))
.click()
.clearAndTypeOnCodeMirror(`{{components.toggleswitch1.value`);
cy.forceClickOnCanvas();
cy.get('[data-cy*="-cell-0"]').should("not.have.class", "has-text");
cy.waitForAutoSave();
cy.get('[data-cy*="-cell-1"]').eq(0).should("not.have.class", "has-text");
cy.get(
'[data-cy="draggable-widget-toggleswitch1"] [type="checkbox"]'
).click();
cy.get('[data-cy*="-cell-0"]')
cy.get('[data-cy*="-cell-1"]')
.eq(0)
.click()
.type(`{selectAll}{backspace}Jack`);
cy.forceClickOnCanvas();
cy.get('[data-cy*="-cell-0"]').should("have.class", "has-text");
cy.get('[data-cy*="-cell-0"] [type="text"]')
.find("input")
.type(`{selectAll}{backspace}{Enter}`)
.realType("Jack");
cy.get('[data-cy*="-cell-1"]').should("have.class", "has-text");
cy.get('[data-cy*="-cell-1"] [type="text"]')
.eq(0)
.verifyVisibleElement("have.value", "Jack");
});

8
cypress-tests/cypress/e2e/editor/widget/textHappyPath.cy.js
View file

@ -32,11 +32,15 @@ import {
describe("Text Input", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.dragAndDropWidget("Text");
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify CSA", () => {
const data = {};
data.customText = randomString(12);

42
cypress-tests/cypress/e2e/editor/widget/textInputHappyPath.cy.js
View file

@ -32,9 +32,13 @@ import {
describe("Text Input", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
cy.dragAndDropWidget("Text Input");
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.dragAndDropWidget("Text Input", 500, 500);
});
afterEach(() => {
cy.apiDeleteApp();
});
it("should verify the properties of the text input widget", () => {
@ -46,8 +50,6 @@ describe("Text Input", () => {
data.maximumLength = randomNumber(8, 10);
data.customText = randomString(12);
cy.renameApp(data.appName);
openEditorSidebar(textInputText.defaultWidgetName);
closeAccordions(["Validation", "General", "Properties", "Layout"]);
editAndVerifyWidgetName(data.widgetName);
@ -191,9 +193,6 @@ describe("Text Input", () => {
);
data.customText = fake.firstName;
verifyControlComponentAction(data.widgetName, data.customText);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the styles of the text input widget", () => {
const data = {};
@ -202,8 +201,6 @@ describe("Text Input", () => {
data.boxShadowColor = fake.randomRgba;
data.boxShadowParam = fake.boxShadowParam;
cy.renameApp(data.appName);
openEditorSidebar(textInputText.defaultWidgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
@ -254,9 +251,6 @@ describe("Text Input", () => {
data.boxShadowColor,
4
);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(data.appName);
});
it("should verify the app preview", () => {
@ -273,8 +267,6 @@ describe("Text Input", () => {
data.customText = randomString(12);
data.maxLengthText = randomString(data.maximumLength);
cy.renameApp(data.appName);
openEditorSidebar(textInputText.defaultWidgetName);
verifyAndModifyParameter(
commonWidgetText.labelDefaultValue,
@ -344,10 +336,12 @@ describe("Text Input", () => {
.invoke("attr", "placeholder")
.should("contain", data.customText);
cy.clearAndType(
commonWidgetSelector.draggableWidget(textInputText.defaultWidgetName),
data.customText
);
cy.get(
commonWidgetSelector.draggableWidget(textInputText.defaultWidgetName)
)
.type(`{selectAll}{backspace}{enter}`)
.type(data.customText);
cy.forceClickOnCanvas();
cy.get(
commonWidgetSelector.validationFeedbackMessage(
textInputText.defaultWidgetName
@ -416,29 +410,29 @@ describe("Text Input", () => {
selectCSA("textinput1", "Visibility");
cy.get('[data-cy="real-canvas"]').click("topRight", { force: true });
cy.dragAndDropWidget("Text input", 500, 50);
cy.dragAndDropWidget("Text input", 50, 50);
selectEvent("On change", "Control Component");
selectCSA("textinput1", "Set text", "500");
addSupportCSAData("text", "{{components.textinput2.value");
cy.get('[data-cy="real-canvas"]').click("topRight", { force: true });
cy.dragAndDropWidget(buttonText.defaultWidgetText, 500, 275);
cy.dragAndDropWidget(buttonText.defaultWidgetText, 50, 200);
selectEvent("On click", "Control Component");
selectCSA("textinput1", "Clear", "500");
cy.get('[data-cy="real-canvas"]').click("topRight", { force: true });
cy.dragAndDropWidget(buttonText.defaultWidgetText, 500, 350);
cy.dragAndDropWidget(buttonText.defaultWidgetText, 50, 400);
selectEvent("On click", "Control Component");
selectCSA("textinput1", "Disable", "500");
cy.get('[data-cy="Value-toggle-button"]').click();
cy.get('[data-cy="real-canvas"]').click("topRight", { force: true });
cy.dragAndDropWidget(buttonText.defaultWidgetText, 500, 425);
cy.dragAndDropWidget(buttonText.defaultWidgetText, 300, 50);
selectEvent("On click", "Control Component");
selectCSA("textinput1", "Set blur", "500");
cy.get('[data-cy="real-canvas"]').click("topRight", { force: true });
cy.dragAndDropWidget(buttonText.defaultWidgetText, 500, 500);
cy.dragAndDropWidget(buttonText.defaultWidgetText, 300, 200);
selectEvent("On click", "Control Component");
selectCSA("textinput1", "Set focus");

131
cypress-tests/cypress/e2e/globalDataSources/globalDataSourcePermissions.cy.js
View file

@ -6,7 +6,13 @@ import {
fillConnectionForm,
} from "Support/utils/postgreSql";
import { commonText } from "Texts/common";
import { closeDSModal, deleteDatasource, addQuery, addQueryN } from "Support/utils/dataSource";
import {
closeDSModal,
deleteDatasource,
addQuery,
addQueryN,
verifyValueOnInspector,
} from "Support/utils/dataSource";
import { dataSourceSelector } from "Selectors/dataSource";
import { dataSourceText } from "Texts/dataSource";
import { addNewUserMW } from "Support/utils/userPermissions";
@ -28,16 +34,17 @@ data.appName = `${fake.companyName}-App`;
describe("Global Datasource Manager", () => {
beforeEach(() => {
cy.appUILogin();
cy.apiLogin();
cy.viewport(1200, 1300);
cy.visit('/')
});
before(() => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.renameApp(data.appName);
cy.dragAndDropWidget("Button", 50, 50);
cy.dragAndDropWidget("Table", 250, 250);
cy.get(commonSelectors.editorPageLogo).click();
cy.reloadAppForTheElement(data.appName);
addNewUserMW(data.firstName, data.email);
logout();
});
@ -109,8 +116,11 @@ describe("Global Datasource Manager", () => {
.invoke("attr", "placeholder")
.should("eq", "Search for Data Sources");
selectAndAddDataSource("databases", dataSourceText.postgreSQL, data.dsName1);
selectAndAddDataSource(
"databases",
dataSourceText.postgreSQL,
data.dsName1
);
cy.clearAndType(
dataSourceSelector.dsNameInputField,
`cypress-${data.dsName1}-postgresql1`
@ -170,11 +180,10 @@ describe("Global Datasource Manager", () => {
deleteDatasource(`cypress-${data.dsName1}-postgresql1`);
});
it("Should verify the Datasource connection and query creation using global data source", () => {
selectAndAddDataSource("databases", dataSourceText.postgreSQL, data.dsName1);
cy.clearAndType(
dataSourceSelector.dsNameInputField,
`cypress-${data.dsName1}-postgresql`
selectAndAddDataSource(
"databases",
dataSourceText.postgreSQL,
data.dsName1
);
cy.intercept("GET", "api/v2/data_sources").as("datasource");
@ -195,7 +204,7 @@ describe("Global Datasource Manager", () => {
navigateToAppEditor(data.appName);
pinInspector();
cy.get(".tooltip-inner").invoke("hide");
// cy.get(".tooltip-inner").invoke("hide");
addQuery(
"table_preview",
@ -205,33 +214,23 @@ describe("Global Datasource Manager", () => {
cy.get('[data-cy="list-query-table_preview"]').verifyVisibleElement(
"have.text",
'table_preview '
"table_preview "
);
cy.get(".tooltip-inner").invoke("hide");
cy.get(dataSourceSelector.queryCreateAndRunButton).click();
cy.get('[data-cy="inspector-node-queries"]')
.parent()
.within(() => {
cy.get("span").first().scrollIntoView().contains("queries").click();
});
cy.get('[data-cy="inspector-node-table_preview"] > .node-key').click();
cy.get('[data-cy="inspector-node-data"] > .fs-9').verifyVisibleElement(
"have.text",
"7 items "
);
verifyValueOnInspector("table_preview", "7 items ");
cy.get('[data-cy="show-ds-popover-button"]').click();
cy.get(
".p-2 > .tj-base-btn"
)
cy.get(".p-2 > .tj-base-btn")
.should("be.visible")
.and("have.text", "+ Add new datasource");
cy.get(
".p-2 > .tj-base-btn"
).click();
.and("have.text", "+ Add new data source");
cy.get(".p-2 > .tj-base-btn").click();
selectAndAddDataSource("databases", dataSourceText.postgreSQL, data.dsName2);
selectAndAddDataSource(
"databases",
dataSourceText.postgreSQL,
data.dsName2
);
cy.intercept("GET", "api/v2/data_sources").as("datasource");
fillConnectionForm(
{
@ -267,7 +266,8 @@ describe("Global Datasource Manager", () => {
});
it("Should validate the user's global data source permissions on apps created by admin", () => {
logout();
cy.login(data.email, "password");
cy.apiLogin(data.email, "password");
cy.visit('/')
cy.get(commonSelectors.globalDataSourceIcon).should("not.exist");
@ -275,61 +275,37 @@ describe("Global Datasource Manager", () => {
cy.get('[data-cy="list-query-table_preview"]').verifyVisibleElement(
"have.text",
'table_preview '
"table_preview "
);
pinInspector();
cy.get(".tooltip-inner").invoke("hide");
// cy.get(".tooltip-inner").invoke("hide");
cy.get(dataSourceSelector.queryCreateAndRunButton).click();
cy.get('[data-cy="inspector-node-queries"]')
.parent()
.within(() => {
cy.get("span").first().scrollIntoView().contains("queries").click();
});
cy.get('[data-cy="inspector-node-table_preview"] > .node-key').click();
cy.get('[data-cy="inspector-node-data"] > .fs-9').verifyVisibleElement(
"have.text",
"7 items "
);
verifyValueOnInspector("table_preview", "7 items ");
cy.get('[data-cy="show-ds-popover-button"]').click()
cy.get('[data-cy="show-ds-popover-button"]').click();
addQueryN(
"student_data",
`SELECT * FROM student_data;`,
`cypress-${data.dsName2}-postgresql`
);
// addQueryN(
// "student_data",
// `SELECT * FROM student_data;`,
// `cypress-huel-postgresql`
// );
cy.get('[data-cy="list-query-student_data"]').verifyVisibleElement(
"have.text",
'student_data '
"student_data "
);
cy.get(".tooltip-inner").invoke("hide");
cy.get(dataSourceSelector.queryCreateAndRunButton).click();
cy.get('[data-cy="inspector-node-queries"]')
.parent()
.within(() => {
cy.get("span").first().scrollIntoView().contains("queries").dblclick();
});
cy.get('[data-cy="inspector-node-student_data"] > .node-key').click();
cy.get('[data-cy="inspector-node-data"] > .fs-9').verifyVisibleElement(
"have.text",
"8 items "
);
verifyValueOnInspector("student_data", "8 items ");
});
it("Should verify the query creation and scope changing functionality.", () => {
logout();
cy.login(data.email, "password");
cy.createApp();
cy.apiLogin(data.email, "password");
cy.visit('/')
cy.apiCreateApp();
cy.openApp();
cy.renameApp(data.appName);
cy.dragAndDropWidget("Button", 50, 50);
cy.dragAndDropWidget("Table", 250, 250);
addQuery(
"table_preview",
@ -339,22 +315,13 @@ describe("Global Datasource Manager", () => {
cy.get('[data-cy="list-query-table_preview"]').verifyVisibleElement(
"have.text",
'table_preview '
"table_preview "
);
pinInspector();
cy.get(".tooltip-inner").invoke("hide");
// cy.get(".tooltip-inner").invoke("hide");
cy.get(dataSourceSelector.queryCreateAndRunButton).click();
cy.get('[data-cy="inspector-node-queries"]')
.parent()
.within(() => {
cy.get("span").first().scrollIntoView().contains("queries").click();
});
cy.get('[data-cy="inspector-node-table_preview"] > .node-key').click();
cy.get('[data-cy="inspector-node-data"] > .fs-9').verifyVisibleElement(
"have.text",
"7 items "
);
verifyValueOnInspector("table_preview", "7 items ");
});
});

16
cypress-tests/cypress/e2e/regressionSuite/appBuilder/queryPanel/queryEditorRegression.cy.js Normal file
View file

@ -0,0 +1,16 @@
describe("Query Editor", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
});
it("should verify Elements on query editor", () => {});
it("should verify Functionality of query editor", () => {});
it("should verify imported app's queries", () => {});
it("should verify transformation", () => {});
it("should verify Event Handler", () => {});
});

16
cypress-tests/cypress/e2e/regressionSuite/appBuilder/queryPanel/queryManagerRegression.cy.js Normal file
View file

@ -0,0 +1,16 @@
describe("Query Manager", () => {
beforeEach(() => {
cy.appUILogin();
cy.createApp();
});
it("should verify Elements on query Manager", () => {});
it("should verify Filter", () => {});
it("should verify Sort", () => {});
it("should verify Filetr", () => {});
it("should verify Curd operation", () => {});
});

7
cypress-tests/cypress/e2e/workspace/dashboard.cy.js
View file

@ -167,15 +167,16 @@ describe("dashboard", () => {
});
it("Should verify app card elements and app card operations", () => {
cy.appUILogin();
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.renameApp(data.appName);
cy.dragAndDropWidget("Table", 250, 250);
cy.get(commonSelectors.editorPageLogo).click();
cy.wait(500);
cy.reloadAppForTheElement(data.appName);
cy.get(commonSelectors.appCard(data.appName))
.parent()
.within(() => {

7
cypress-tests/cypress/e2e/workspace/shareApp.cy.js
View file

@ -18,7 +18,9 @@ describe("App share functionality", () => {
});
it("Verify private and public app share funtionality", () => {
cy.createApp();
cy.apiLogin();
cy.apiCreateApp();
cy.openApp();
cy.renameApp(data.appName);
cy.dragAndDropWidget("Table", 250, 250);
@ -79,6 +81,7 @@ describe("App share functionality", () => {
cy.appUILogin();
navigateToAppEditor(data.appName);
cy.skipEditorPopover()
cy.get(commonWidgetSelector.shareAppButton).click();
cy.get(commonWidgetSelector.makePublicAppToggle).uncheck();
cy.get(commonWidgetSelector.modalCloseButton).click();
@ -114,8 +117,6 @@ describe("App share functionality", () => {
cy.appUILogin();
navigateToAppEditor(data.appName);
cy.reloadAppForTheElement("skip");
cy.wait(4000);
cy.skipEditorPopover();
cy.get(commonWidgetSelector.shareAppButton).click();
cy.get(commonWidgetSelector.makePublicAppToggle).check();

511
cypress-tests/cypress/e2e/workspace/workspaceConstants.cy.js
View file

@ -33,237 +33,239 @@ describe("Workspace constants", () => {
const envVar = Cypress.env("environment");
beforeEach(() => {
cy.appUILogin();
cy.intercept("GET", "/api/apps?page=1&folder=&searchKey=").as("homePage");
cy.intercept("GET", "/api/library_apps").as("homePage");
});
it("Verify workspace constants UI and CRUD operations", () => {
cy.get(commonSelectors.workspaceSettingsIcon).click();
cy.get(commonSelectors.workspaceConstantsOption)
.should(($el) => {
expect($el.contents().first().text().trim()).to.eq(
"Workspace constants"
);
})
.click();
if (envVar === "Community") {
it("Verify workspace constants UI and CRUD operations", () => {
cy.get(commonSelectors.workspaceSettingsIcon).click();
cy.get(commonSelectors.workspaceConstantsOption)
.should(($el) => {
expect($el.contents().first().text().trim()).to.eq(
"Workspace constants"
);
})
.click();
cy.get(commonSelectors.breadcrumbTitle).should(($el) => {
expect($el.contents().first().text().trim()).to.eq("Workspace settings");
cy.get(commonSelectors.breadcrumbTitle).should(($el) => {
expect($el.contents().first().text().trim()).to.eq("Workspace settings");
});
cy.get(commonSelectors.breadcrumbPageTitle).verifyVisibleElement(
"have.text",
" Workspace constants"
);
cy.get(
workspaceConstantsSelectors.workspaceConstantsHelperText
).verifyVisibleElement(
"have.text",
workspaceConstantsText.workspaceConstantsHelperText
);
cy.get(commonSelectors.documentationLink).verifyVisibleElement(
"have.text",
commonText.documentationLink
);
cy.get("body").then(($body) => {
if ($body.find(workspaceConstantsSelectors.emptyStateImage).length > 0) {
cy.get(workspaceConstantsSelectors.emptyStateImage).should(
"be.visible"
);
cy.get(
workspaceConstantsSelectors.emptyStateHeader
).verifyVisibleElement(
"have.text",
workspaceConstantsText.emptyStateHeader
);
cy.get(workspaceConstantsSelectors.emptyStateText).verifyVisibleElement(
"have.text",
workspaceConstantsText.emptyStateText
);
cy.get(
workspaceConstantsSelectors.addNewConstantButton
).verifyVisibleElement(
"have.text",
workspaceConstantsText.addNewConstantButton
);
}
});
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
cy.get(workspaceConstantsSelectors.contantFormTitle).verifyVisibleElement(
"have.text",
workspaceConstantsText.addConstatntText
);
cy.get(commonSelectors.nameLabel).verifyVisibleElement("have.text", "Name");
cy.get(commonSelectors.nameInputField)
.invoke("attr", "placeholder")
.should("eq", "Enter Constant Name");
cy.get(commonSelectors.nameInputField).should("be.visible");
cy.get(commonSelectors.valueLabel).verifyVisibleElement(
"have.text",
"Value"
);
cy.get(commonSelectors.valueInputField)
.invoke("attr", "placeholder")
.should("eq", "Enter Value");
cy.get(commonSelectors.valueInputField).should("be.visible");
cy.get(commonSelectors.cancelButton).verifyVisibleElement(
"have.text",
"Cancel"
);
cy.get(workspaceConstantsSelectors.addConstantButton).verifyVisibleElement(
"have.text",
"Add constant"
);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
contantsNameValidation(" ", commonText.constantsNameError);
contantsNameValidation("9", commonText.constantsNameError);
contantsNameValidation("%", commonText.constantsNameError);
contantsNameValidation(
"ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_`a",
"Maximum length has been reached"
);
contantsNameValidation(
"ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_`afgg",
"Constant name should be between 1 and 32 characters"
);
cy.clearAndType(commonSelectors.valueInputField, " ");
cy.get(commonSelectors.valueErrorText).verifyVisibleElement(
"have.text",
commonText.constantsValueError
);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
cy.get(commonSelectors.cancelButton).click();
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
cy.clearAndType(commonSelectors.nameInputField, data.constName);
cy.clearAndType(commonSelectors.valueInputField, data.constName);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.enabled");
cy.get(commonSelectors.cancelButton).click();
cy.get(workspaceConstantsSelectors.constantName(data.constName)).should(
"not.exist"
);
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
cy.clearAndType(commonSelectors.nameInputField, data.constName);
cy.clearAndType(commonSelectors.valueInputField, data.constName);
cy.get(workspaceConstantsSelectors.addConstantButton).click();
cy.verifyToastMessage(
commonSelectors.toastMessage,
workspaceConstantsText.constantCreatedToast
);
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
contantsNameValidation(
data.constName,
"Constant with this name already exists in Production environment"
);
cy.get(commonSelectors.cancelButton).click();
cy.get(workspaceConstantsSelectors.envName).verifyVisibleElement(
"have.text",
"Production"
);
cy.get(
workspaceConstantsSelectors.addNewConstantButton
).verifyVisibleElement("have.text", "Create new constant");
cy.get(
workspaceConstantsSelectors.constantsTableNameHeader
).verifyVisibleElement("have.text", "Name");
cy.get(
workspaceConstantsSelectors.constantsTableValueHeader
).verifyVisibleElement("have.text", "Value");
cy.get(
workspaceConstantsSelectors.constantName(data.constName)
).verifyVisibleElement("have.text", data.constName);
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.constName);
cy.get(
workspaceConstantsSelectors.constEditButton(data.constName)
).verifyVisibleElement("have.text", "Edit");
cy.get(
workspaceConstantsSelectors.constDeleteButton(data.constName)
).verifyVisibleElement("have.text", "Delete");
cy.get(commonSelectors.pagination).should("be.visible");
cy.get(workspaceConstantsSelectors.constEditButton(data.constName)).click();
cy.get(workspaceConstantsSelectors.contantFormTitle).verifyVisibleElement(
"have.text",
"Update constant in production "
);
cy.get(commonSelectors.nameLabel).verifyVisibleElement("have.text", "Name");
cy.get(commonSelectors.nameInputField).should("have.value", data.constName);
cy.get(commonSelectors.nameInputField)
.should("be.visible")
.and("be.disabled");
cy.get(commonSelectors.valueLabel).verifyVisibleElement(
"have.text",
"Value"
);
cy.get(commonSelectors.valueInputField)
.should("be.visible")
.and("have.value", data.constName);
cy.get(commonSelectors.cancelButton).verifyVisibleElement(
"have.text",
"Cancel"
);
cy.get(workspaceConstantsSelectors.addConstantButton).verifyVisibleElement(
"have.text",
"Update"
);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
cy.clearAndType(commonSelectors.valueInputField, data.newConstvalue);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.enabled");
cy.get(commonSelectors.cancelButton).click();
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.constName);
cy.get(workspaceConstantsSelectors.constEditButton(data.constName)).click();
cy.clearAndType(commonSelectors.valueInputField, data.newConstvalue);
cy.get(workspaceConstantsSelectors.addConstantButton).click();
cy.verifyToastMessage(
commonSelectors.toastMessage,
"Constant updated successfully"
);
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.newConstvalue);
cy.get(
workspaceConstantsSelectors.constDeleteButton(data.constName)
).click();
cy.get(commonSelectors.modalMessage).verifyVisibleElement(
"have.text",
`Are you sure you want to delete ${data.constName} from production?`
);
cy.get(commonSelectors.cancelButton).verifyVisibleElement(
"have.text",
"Cancel"
);
cy.get(commonSelectors.yesButton).verifyVisibleElement("have.text", "Yes");
cy.get(commonSelectors.cancelButton).click();
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.newConstvalue);
cy.get(
workspaceConstantsSelectors.constDeleteButton(data.constName)
).click();
cy.get(commonSelectors.yesButton).click();
cy.get(workspaceConstantsSelectors.constantValue(data.constName)).should(
"not.exist"
);
cy.verifyToastMessage(
commonSelectors.toastMessage,
"Constant deleted successfully"
);
});
cy.get(commonSelectors.breadcrumbPageTitle).verifyVisibleElement(
"have.text",
" Workspace constants"
);
cy.get(
workspaceConstantsSelectors.workspaceConstantsHelperText
).verifyVisibleElement(
"have.text",
workspaceConstantsText.workspaceConstantsHelperText
);
cy.get(commonSelectors.documentationLink).verifyVisibleElement(
"have.text",
commonText.documentationLink
);
cy.get("body").then(($body) => {
if ($body.find(workspaceConstantsSelectors.emptyStateImage).length > 0) {
cy.get(workspaceConstantsSelectors.emptyStateImage).should(
"be.visible"
);
cy.get(
workspaceConstantsSelectors.emptyStateHeader
).verifyVisibleElement(
"have.text",
workspaceConstantsText.emptyStateHeader
);
cy.get(workspaceConstantsSelectors.emptyStateText).verifyVisibleElement(
"have.text",
workspaceConstantsText.emptyStateText
);
cy.get(
workspaceConstantsSelectors.addNewConstantButton
).verifyVisibleElement(
"have.text",
workspaceConstantsText.addNewConstantButton
);
}
});
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
cy.get(workspaceConstantsSelectors.contantFormTitle).verifyVisibleElement(
"have.text",
workspaceConstantsText.addConstatntText
);
cy.get(commonSelectors.nameLabel).verifyVisibleElement("have.text", "Name");
cy.get(commonSelectors.nameInputField)
.invoke("attr", "placeholder")
.should("eq", "Enter Constant Name");
cy.get(commonSelectors.nameInputField).should("be.visible");
cy.get(commonSelectors.valueLabel).verifyVisibleElement(
"have.text",
"Value"
);
cy.get(commonSelectors.valueInputField)
.invoke("attr", "placeholder")
.should("eq", "Enter Value");
cy.get(commonSelectors.valueInputField).should("be.visible");
cy.get(commonSelectors.cancelButton).verifyVisibleElement(
"have.text",
"Cancel"
);
cy.get(workspaceConstantsSelectors.addConstantButton).verifyVisibleElement(
"have.text",
"Add constant"
);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
contantsNameValidation(" ", commonText.constantsNameError);
contantsNameValidation("9", commonText.constantsNameError);
contantsNameValidation("%", commonText.constantsNameError);
contantsNameValidation(
"ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_`a",
"Maximum length has been reached"
);
contantsNameValidation(
"ABCDEFGHIJKLMNOPQRSTUVWXYZ[]^_`afgg",
"Constant name should be between 1 and 32 characters"
);
cy.clearAndType(commonSelectors.valueInputField, " ");
cy.get(commonSelectors.valueErrorText).verifyVisibleElement(
"have.text",
commonText.constantsValueError
);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
cy.get(commonSelectors.cancelButton).click();
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
cy.clearAndType(commonSelectors.nameInputField, data.constName);
cy.clearAndType(commonSelectors.valueInputField, data.constName);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.enabled");
cy.get(commonSelectors.cancelButton).click();
cy.get(workspaceConstantsSelectors.constantName(data.constName)).should(
"not.exist"
);
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
cy.clearAndType(commonSelectors.nameInputField, data.constName);
cy.clearAndType(commonSelectors.valueInputField, data.constName);
cy.get(workspaceConstantsSelectors.addConstantButton).click();
cy.verifyToastMessage(
commonSelectors.toastMessage,
workspaceConstantsText.constantCreatedToast
);
cy.get(workspaceConstantsSelectors.addNewConstantButton).click();
contantsNameValidation(
data.constName,
"Constant with this name already exists in Production environment"
);
cy.get(commonSelectors.cancelButton).click();
cy.get(workspaceConstantsSelectors.envName).verifyVisibleElement(
"have.text",
"Production"
);
cy.get(
workspaceConstantsSelectors.addNewConstantButton
).verifyVisibleElement("have.text", "Create new constant");
cy.get(
workspaceConstantsSelectors.constantsTableNameHeader
).verifyVisibleElement("have.text", "Name");
cy.get(
workspaceConstantsSelectors.constantsTableValueHeader
).verifyVisibleElement("have.text", "Value");
cy.get(
workspaceConstantsSelectors.constantName(data.constName)
).verifyVisibleElement("have.text", data.constName);
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.constName);
cy.get(
workspaceConstantsSelectors.constEditButton(data.constName)
).verifyVisibleElement("have.text", "Edit");
cy.get(
workspaceConstantsSelectors.constDeleteButton(data.constName)
).verifyVisibleElement("have.text", "Delete");
cy.get(commonSelectors.pagination).should("be.visible");
cy.get(workspaceConstantsSelectors.constEditButton(data.constName)).click();
cy.get(workspaceConstantsSelectors.contantFormTitle).verifyVisibleElement(
"have.text",
"Update constant in production "
);
cy.get(commonSelectors.nameLabel).verifyVisibleElement("have.text", "Name");
cy.get(commonSelectors.nameInputField).should("have.value", data.constName);
cy.get(commonSelectors.nameInputField)
.should("be.visible")
.and("be.disabled");
cy.get(commonSelectors.valueLabel).verifyVisibleElement(
"have.text",
"Value"
);
cy.get(commonSelectors.valueInputField)
.should("be.visible")
.and("have.value", data.constName);
cy.get(commonSelectors.cancelButton).verifyVisibleElement(
"have.text",
"Cancel"
);
cy.get(workspaceConstantsSelectors.addConstantButton).verifyVisibleElement(
"have.text",
"Update"
);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.disabled");
cy.clearAndType(commonSelectors.valueInputField, data.newConstvalue);
cy.get(workspaceConstantsSelectors.addConstantButton).should("be.enabled");
cy.get(commonSelectors.cancelButton).click();
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.constName);
cy.get(workspaceConstantsSelectors.constEditButton(data.constName)).click();
cy.clearAndType(commonSelectors.valueInputField, data.newConstvalue);
cy.get(workspaceConstantsSelectors.addConstantButton).click();
cy.verifyToastMessage(
commonSelectors.toastMessage,
"Constant updated successfully"
);
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.newConstvalue);
cy.get(
workspaceConstantsSelectors.constDeleteButton(data.constName)
).click();
cy.get(commonSelectors.modalMessage).verifyVisibleElement(
"have.text",
`Are you sure you want to delete ${data.constName} from production?`
);
cy.get(commonSelectors.cancelButton).verifyVisibleElement(
"have.text",
"Cancel"
);
cy.get(commonSelectors.yesButton).verifyVisibleElement("have.text", "Yes");
cy.get(commonSelectors.cancelButton).click();
cy.get(
workspaceConstantsSelectors.constantValue(data.constName)
).verifyVisibleElement("have.text", data.newConstvalue);
cy.get(
workspaceConstantsSelectors.constDeleteButton(data.constName)
).click();
cy.get(commonSelectors.yesButton).click();
cy.get(workspaceConstantsSelectors.constantValue(data.constName)).should(
"not.exist"
);
cy.verifyToastMessage(
commonSelectors.toastMessage,
"Constant deleted successfully"
);
});
}
it("should verify the constants resolving value on components and query", () => {
common.navigateToworkspaceConstants();
@ -294,6 +296,7 @@ describe("Workspace constants", () => {
cy.waitForAutoSave();
common.pinInspector();
cy.get(".tooltip-inner").invoke("hide");
cy.get(commonWidgetSelector.sidebarinspector).click();
cy.get(commonWidgetSelector.inspectorNodeComponents).click();
cy.get(commonWidgetSelector.nodeComponent(data.constantsName)).click();
@ -310,31 +313,47 @@ describe("Workspace constants", () => {
`[data-cy="inspector-node-${data.constantsName}"] > .mx-2`
).verifyVisibleElement("have.text", `"dJ_8Q~BcaMPd"`);
cy.get('[data-cy="button-release"]').click();
cy.get('[data-cy="yes-button"]').click();
cy.verifyToastMessage(commonSelectors.toastMessage, "Version v1 released");
cy.get(commonWidgetSelector.shareAppButton).click();
cy.clearAndType(commonWidgetSelector.appNameSlugInput, `${data.slug}`);
cy.get(commonWidgetSelector.modalCloseButton).click();
cy.forceClickOnCanvas();
cy.waitForAutoSave();
cy.openInCurrentTab(commonWidgetSelector.previewButton);
cy.wait(4000);
cy.get(
commonWidgetSelector.draggableWidget(data.constantsName)
).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
cy.get('[data-cy="viewer-page-logo"]').click();
cy.wait("@homePage");
if (envVar === "Community") {
cy.get('[data-cy="button-release"]').click();
cy.get('[data-cy="yes-button"]').click();
cy.verifyToastMessage(
commonSelectors.toastMessage,
"Version v1 released"
);
cy.get(commonWidgetSelector.shareAppButton).click();
cy.clearAndType(commonWidgetSelector.appNameSlugInput, `${data.slug}`);
cy.get(commonWidgetSelector.modalCloseButton).click();
cy.forceClickOnCanvas();
cy.waitForAutoSave();
cy.openInCurrentTab(commonWidgetSelector.previewButton);
cy.wait(4000);
cy.get(
commonWidgetSelector.draggableWidget(data.constantsName)
).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
cy.get('[data-cy="viewer-page-logo"]').click();
cy.wait("@homePage");
cy.visit(`/applications/${data.slug}`);
cy.wait(4000);
cy.get(
commonWidgetSelector.draggableWidget(data.constantsName)
).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
} else {
cy.forceClickOnCanvas();
cy.waitForAutoSave();
cy.openInCurrentTab(commonWidgetSelector.previewButton);
cy.wait(4000);
cy.get(
commonWidgetSelector.draggableWidget(data.constantsName)
).verifyVisibleElement("have.text", "dJ_8Q~BcaMPd");
cy.get('[data-cy="viewer-page-logo"]').click();
cy.wait("@homePage");
}
});
});
});

286
cypress-tests/cypress/support/commands.js
View file

@ -1,286 +0,0 @@
import { commonSelectors, commonWidgetSelector } from "Selectors/common";
import { dashboardSelector } from "Selectors/dashboard";
import { ssoSelector } from "Selectors/manageSSO";
import { commonText, createBackspaceText } from "Texts/common";
import { passwordInputText } from "Texts/passwordInput";
Cypress.Commands.add(
"login",
(email = "dev@tooljet.io", password = "password") => {
cy.visit("/");
cy.clearAndType(commonSelectors.workEmailInputField, email);
cy.clearAndType(commonSelectors.passwordInputField, password);
cy.get(commonSelectors.signInButton).click();
cy.intercept("GET", "api/library_apps").as("apps");
cy.wait("@apps");
cy.wait(4000);
cy.get(commonSelectors.homePageLogo).should("be.visible");
}
);
Cypress.Commands.add("clearAndType", (selector, text) => {
cy.get(selector).clear().type(text, { log: false });
});
Cypress.Commands.add("forceClickOnCanvas", () => {
cy.get(commonSelectors.canvas).click("topRight", { force: true });
});
Cypress.Commands.add(
"verifyToastMessage",
(selector, message, closeAction = true) => {
cy.get(selector).as("toast").should("contain.text", message);
if (closeAction) {
cy.get("body").then(($body) => {
if ($body.find(commonSelectors.toastCloseButton).length > 0) {
cy.closeToastMessage();
cy.wait(200);
}
});
}
}
);
Cypress.Commands.add("waitForAutoSave", () => {
cy.wait(200);
cy.get(commonSelectors.autoSave, { timeout: 20000 }).should(
"have.text",
commonText.autoSave,
{ timeout: 20000 }
);
});
Cypress.Commands.add("createApp", (appName) => {
const getAppButtonSelector = ($title) =>
$title.text().includes(commonText.introductionMessage)
? commonSelectors.emptyAppCreateButton
: commonSelectors.appCreateButton;
cy.get("body").then(($title) => {
cy.get(getAppButtonSelector($title)).click();
});
cy.waitForAppLoad();
cy.skipEditorPopover();
});
Cypress.Commands.add(
"dragAndDropWidget",
(
widgetName,
positionX = 190,
positionY = 80,
widgetName2 = widgetName,
canvas = commonSelectors.canvas
) => {
const dataTransfer = new DataTransfer();
cy.clearAndType(commonSelectors.searchField, widgetName);
cy.get(commonWidgetSelector.widgetBox(widgetName2)).trigger(
"dragstart",
{ dataTransfer },
{ force: true }
);
cy.get(canvas).trigger("drop", positionX, positionY, {
dataTransfer,
force: true,
});
cy.waitForAutoSave();
}
);
Cypress.Commands.add("appUILogin", () => {
cy.visit("/");
cy.clearAndType(commonSelectors.workEmailInputField, "dev@tooljet.io");
cy.clearAndType(commonSelectors.passwordInputField, "password");
cy.get(commonSelectors.signInButton).click();
cy.intercept("GET", "api/library_apps").as("apps");
cy.wait("@apps");
cy.wait(3000);
cy.get(commonSelectors.homePageLogo).should("be.visible");
});
Cypress.Commands.add(
"clearAndTypeOnCodeMirror",
{
prevSubject: "optional",
},
(subject, value) => {
cy.wrap(subject)
.click()
.find("pre.CodeMirror-line")
.invoke("text")
.then((text) => {
cy.wrap(subject).type(createBackspaceText(text)),
{
delay: 0,
};
});
if (!Array.isArray(value)) {
cy.wrap(subject).type(value, {
parseSpecialCharSequences: false,
delay: 0,
});
} else {
cy.wrap(subject)
.type(value[1], {
parseSpecialCharSequences: false,
delay: 0,
})
.type(`{home}${value[0]}`, { delay: 0 });
}
}
);
Cypress.Commands.add("deleteApp", (appName) => {
cy.intercept("DELETE", "/api/apps/*").as("appDeleted");
cy.get(commonSelectors.appCard(appName))
.realHover()
.find(commonSelectors.appCardOptionsButton)
.realHover()
.click();
cy.get(commonSelectors.deleteAppOption).click();
cy.get(commonSelectors.buttonSelector(commonText.modalYesButton)).click();
cy.wait("@appDeleted");
});
Cypress.Commands.add(
"verifyVisibleElement",
{
prevSubject: "element",
},
(subject, assertion, value, ...arg) => {
return cy
.wrap(subject)
.scrollIntoView()
.should("be.visible")
.and(assertion, value, ...arg);
}
);
Cypress.Commands.add("openInCurrentTab", (selector) => {
cy.get(selector).invoke("removeAttr", "target").click();
});
Cypress.Commands.add("modifyCanvasSize", (x, y) => {
cy.get("[data-cy='left-sidebar-settings-button']").click();
cy.clearAndType("[data-cy='maximum-canvas-width-input-field']", x);
cy.forceClickOnCanvas();
cy.intercept("/api/apps/**").as("app");
cy.wait("@app");
});
Cypress.Commands.add("renameApp", (appName) => {
cy.get(commonSelectors.appNameInput).type(
`{selectAll}{backspace}${appName}`,
{ force: true }
);
cy.forceClickOnCanvas();
cy.waitForAutoSave();
});
Cypress.Commands.add(
"clearCodeMirror",
{
prevSubject: "element",
},
(subject, value) => {
cy.wrap(subject)
.click()
.find("pre.CodeMirror-line")
.invoke("text")
.then((text) => {
cy.wrap(subject).type(createBackspaceText(text)),
{
delay: 0,
};
});
}
);
Cypress.Commands.add("closeToastMessage", () => {
cy.get(`${commonSelectors.toastCloseButton}:eq(0)`).click();
});
Cypress.Commands.add("notVisible", (dataCy) => {
cy.get("body").then(($body) => {
if ($body.find(dataCy).length > 0) {
cy.get(dataCy).should("not.be.visible");
}
});
const log = Cypress.log({
name: "notVisible",
displayName: "Not Visible",
message: dataCy,
});
});
Cypress.Commands.add("resizeWidget", (widgetName, x, y) => {
cy.get(`[data-cy="draggable-widget-${widgetName}"]`).trigger("mouseover", {
force: true,
});
cy.get('[class="bottom-right"]').trigger("mousedown", {
which: 1,
force: true,
});
cy.get(commonSelectors.canvas)
.trigger("mousemove", {
which: 1,
clientX: x,
ClientY: y,
clientX: x,
clientY: y,
pageX: x,
pageY: y,
screenX: x,
screenY: y,
})
.trigger("mouseup");
cy.waitForAutoSave();
});
Cypress.Commands.add("reloadAppForTheElement", (elementText) => {
cy.get("body").then(($title) => {
if (!$title.text().includes(elementText)) {
cy.reload();
}
});
});
Cypress.Commands.add("skipEditorPopover", () => {
cy.wait(2000);
cy.get("body").then(($el) => {
if ($el.text().includes("Skip", { timeout: 2000 })) {
cy.get(commonSelectors.skipButton).realClick();
}
});
const log = Cypress.log({
name: "Skip Popover",
displayName: "Skip Popover",
message: " Popover skipped",
});
});
Cypress.Commands.add("waitForAppLoad", () => {
const API_ENDPOINT =
Cypress.env("environment") === "Community"
? "/api/v2/data_sources"
: "/api/app-environments/**";
const TIMEOUT = 15000;
cy.intercept("GET", API_ENDPOINT).as("appDs");
cy.wait("@appDs", { timeout: TIMEOUT });
});
Cypress.Commands.add("visitTheWorkspace", (workspaceName) => {
cy.task("updateId", {
dbconfig: Cypress.env("app_db"),
sql: `select id from organizations where name='${workspaceName}';`,
}).then((resp) => {
let workspaceId = resp.rows[0].id;
cy.visit(workspaceId);
});
cy.wait(2000);
});

10
cypress-tests/cypress/support/e2e.js
View file

@ -14,11 +14,11 @@
// ***********************************************************
// Import commands.js using ES2015 syntax:
import './commands'
import "../commands/commands";
import "../commands/apiCommands";
import "cypress-real-events";
// Alternatively you can use CommonJS syntax:
// require('./commands')
Cypress.on('uncaught:exception', (err, runnable) =>
{
return false;
});
Cypress.on("uncaught:exception", (err, runnable) => {
return false;
});

7
cypress-tests/cypress/support/utils/basicComponents.js
View file

@ -30,11 +30,11 @@ export const verifyComponentWithOutLabel = (
appName,
properties = []
) => {
cy.dragAndDropWidget(component, 50, 50);
cy.dragAndDropWidget(component, 200, 200);
cy.get(`[data-cy="draggable-widget-${defaultName}"]`).click({ force: true });
verifyComponent(defaultName);
cy.resizeWidget(defaultName, 650, 400);
cy.resizeWidget(defaultName, 650, 400, false);
openEditorSidebar(defaultName);
editAndVerifyWidgetName(fakeName, properties);
@ -47,7 +47,4 @@ export const verifyComponentWithOutLabel = (
cy.go("back");
deleteComponentAndVerify(fakeName);
cy.get(commonSelectors.editorPageLogo).click();
cy.deleteApp(appName);
};

37
cypress-tests/cypress/support/utils/commonWidget.js
View file

@ -27,12 +27,14 @@ export const verifyAndModifyParameter = (paramName, value) => {
cy.get(commonWidgetSelector.parameterLabel(paramName))
.scrollIntoView()
.should("have.text", paramName);
cy.get(
commonWidgetSelector.parameterInputField(paramName)
).clearAndTypeOnCodeMirror(value);
cy.get(commonWidgetSelector.parameterInputField(paramName))
.clearAndTypeOnCodeMirror(" ")
.clearAndTypeOnCodeMirror(value);
};
export const openEditorSidebar = (widgetName = "") => {
cy.hideTooltip();
cy.get(`${commonWidgetSelector.draggableWidget(widgetName)}:eq(0)`).trigger(
"mouseover"
);
@ -48,14 +50,7 @@ export const verifyAndModifyToggleFx = (
"have.text",
paramName
);
cy.get(
commonWidgetSelector.parameterFxButton(
paramName,
"[class*='fx-button unselectable']"
)
)
.should("have.text", "Fx")
.click();
cy.get(commonWidgetSelector.parameterFxButton(paramName, " > svg")).click();
if (defaultValue)
cy.get(commonWidgetSelector.parameterInputField(paramName))
.find("pre.CodeMirror-line")
@ -214,7 +209,8 @@ export const verifyAndModifyStylePickerFx = (
paramName,
defaultValue,
value,
index = 0
index = 0,
boxShadow = ""
) => {
cy.get(commonWidgetSelector.parameterLabel(paramName)).should(
"have.text",
@ -228,19 +224,12 @@ export const verifyAndModifyStylePickerFx = (
cy.get(commonWidgetSelector.stylePickerValue(paramName))
.should("be.visible")
.verifyVisibleElement("have.text", defaultValue);
cy.get(
commonWidgetSelector.parameterFxButton(
paramName,
"[class*='fx-button unselectable']"
)
)
.should("have.text", "Fx")
.click();
cy.get(commonWidgetSelector.parameterFxButton(paramName, " > svg")).click();
cy.get(commonWidgetSelector.stylePickerFxInput(paramName)).within(() => {
cy.get(".CodeMirror-line")
.should("be.visible")
.and("have.text", defaultValue);
.and("have.text", `${boxShadow}${defaultValue}`);
});
cy.get(
@ -321,11 +310,13 @@ export const verifyStylesGeneralAccordion = (
) => {
openEditorSidebar(widgetName);
cy.get(commonWidgetSelector.buttonStylesEditorSideBar).click();
openAccordion(commonWidgetText.accordionGenaral, []);
// openAccordion(commonWidgetText.accordionGenaral, []);
verifyAndModifyStylePickerFx(
commonWidgetText.parameterBoxShadow,
commonWidgetText.boxShadowDefaultValue,
`${boxShadowParameter[0]}px ${boxShadowParameter[1]}px ${boxShadowParameter[2]}px ${boxShadowParameter[3]}px ${hexColor}`
`${boxShadowParameter[0]}px ${boxShadowParameter[1]}px ${boxShadowParameter[2]}px ${boxShadowParameter[3]}px ${hexColor}`,
0,
"0px 0px 0px 0px "
);
cy.get(
commonWidgetSelector.parameterFxButton(commonWidgetText.parameterBoxShadow)

36
cypress-tests/cypress/support/utils/dataSource.js
View file

@ -49,17 +49,15 @@ export const deleteDatasource = (datasourceName) => {
cy.get(`[data-cy="${cyParamName(datasourceName)}-button"]`)
.parent()
.within(() => {
cy.get(`[data-cy="${cyParamName(datasourceName)}-delete-button"]`).invoke(
"click"
);
cy.get(dataSourceSelector.deleteDSButton(datasourceName)).invoke("click");
});
cy.get('[data-cy="yes-button"]').click();
cy.verifyToastMessage(commonSelectors.toastMessage, "Data Source Deleted");
cy.get(commonSelectors.breadcrumbTitle).click();
cy.get(commonSelectors.breadcrumbPageTitle).verifyVisibleElement(
"have.text",
" Databases"
);
// cy.verifyToastMessage(commonSelectors.toastMessage, "Data Source Deleted");
// cy.get(commonSelectors.breadcrumbTitle).click()
// cy.get(commonSelectors.breadcrumbPageTitle).verifyVisibleElement(
// "have.text",
// " Databases"
// );
};
export const closeDSModal = () => {
@ -102,3 +100,23 @@ export const addQueryN = (queryName, query, dbName) => {
cy.get(dataSourceSelector.queryInputField).clearAndTypeOnCodeMirror(query);
cy.get(dataSourceSelector.queryCreateAndRunButton).click();
};
export const verifyValueOnInspector = (queryName, value) => {
cy.get('[data-cy="inspector-node-queries"]')
.parent()
.within(() => {
cy.get("span").first().scrollIntoView().contains("queries").click();
});
cy.get("body").then(($body) => {
if (
$body.find(`[data-cy="inspector-node-${queryName}"] > .node-key`).length >
0
) {
cy.get(`[data-cy="inspector-node-${queryName}"] > .node-key`).click();
cy.get('[data-cy="inspector-node-data"] > .fs-9').verifyVisibleElement(
"have.text",
value
);
}
});
};

4
cypress-tests/cypress/support/utils/inspector.js
View file

@ -13,11 +13,11 @@ export const verifyNodeData = (node, type, children, index = 0) => {
.verifyVisibleElement("have.text", type);
};
export const openNode = (node, index = 0) => {
export const openNode = (node, index = 0, time = 1000) => {
cy.get(`[data-cy="inspector-node-${node.toLowerCase()}"] > .node-key`)
.eq(index)
.click();
cy.wait(1000);
cy.wait(time);
};
export const verifyValue = (node, type, children, index = 0) => {

10
cypress-tests/cypress/support/utils/manageUsers.js
View file

@ -134,10 +134,10 @@ export const manageUsersElements = () => {
export const inviteUser = (firstName, email) => {
fillUserInviteForm(firstName, email);
cy.get(usersSelector.buttonInviteUsers).click();
cy.verifyToastMessage(
commonSelectors.toastMessage,
usersText.userCreatedToast
);
// cy.verifyToastMessage(
// commonSelectors.toastMessage,
// usersText.userCreatedToast
// );
cy.wait(1000)
fetchAndVisitInviteLink(email);
};
@ -318,4 +318,4 @@ export const fetchAndVisitInviteLink = (email) => {
});
});
});
};
};

2
cypress-tests/cypress/support/utils/modal.js
View file

@ -52,7 +52,7 @@ export const addAndVerifyColor = (
};
export const typeOnFx = (fx, data) => {
cy.get(commonWidgetSelector.parameterFxButton(fx)).eq(1).realClick();
cy.get(commonWidgetSelector.parameterFxButton(fx)).eq(0).realClick();
cy.get(commonWidgetSelector.parameterInputField(fx)).clearAndTypeOnCodeMirror(
data
);

35
cypress-tests/cypress/support/utils/multipage.js
View file

@ -1,7 +1,7 @@
import { multipageSelector } from "Selectors/multipage";
export const searchPage = (pageName) => {
cy.get('[data-cy="search-page-option-icon"]').click();
cy.get('[title="Search"]').click();
cy.get('[data-cy="search-input-filed"]').type(pageName);
};
@ -10,11 +10,14 @@ export const clearSearch = () => {
};
export const modifyPageHandle = (pageName, handle) => {
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`).click();
cy.get(multipageSelector.pageMenuIcon).click();
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`)
.click()
.parent()
.find(multipageSelector.pageMenuIcon)
.click();
cy.get(multipageSelector.pageHandleText).click();
cy.get(multipageSelector.pageHandleInputField).clear().type(handle);
cy.get(multipageSelector.pageHandleSaveButton).click()
cy.get(multipageSelector.pageHandleSaveButton).click();
};
export const detetePage = (pageName) => {
@ -26,14 +29,21 @@ export const detetePage = (pageName) => {
};
export const hideOrUnhidePage = (pageName, operation = "hide") => {
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`).click();
cy.get(multipageSelector.pageMenuIcon).click();
cy.get(`[data-cy="${operation}-page-option-button"]`).click();
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`)
.click()
.parent()
.find(multipageSelector.pageMenuIcon)
.click();
cy.get(`[data-cy="${operation}-page-on-app-menu-option-button"]`).click();
};
export const setHomePage = (pageName) => {
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`).trigger('mouseover').click();
cy.get(multipageSelector.pageMenuIcon).click();
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`)
.trigger("mouseover")
.click()
.parent()
.find(multipageSelector.pageMenuIcon)
.click();
cy.get(multipageSelector.markHomePageOptionButton).click();
};
@ -45,8 +55,11 @@ export const addNewPage = (pageName) => {
};
export const addEventHandler = (pageName) => {
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`).click();
cy.get(multipageSelector.pageMenuIcon).click();
cy.get(`[data-cy="pages-name-${pageName.toLowerCase()}"]`)
.click()
.parent()
.find(multipageSelector.pageMenuIcon)
.click();
cy.get(multipageSelector.eventHandlerOptionButton).click();
cy.get(multipageSelector.addEventHandlerLink).click();
cy.get(multipageSelector.eventName).verifyVisibleElement(

19
cypress-tests/cypress/support/utils/postgreSql.js
View file

@ -48,29 +48,34 @@ export const selectAndAddDataSource = (
dataSourceName
) => {
cy.get(commonSelectors.globalDataSourceIcon).click();
cy.wait(1000)
cy.get(`[data-cy="${cyParamName(dscategory)}-datasource-button"]`).click();
cy.wait(500)
cy.get(postgreSqlSelector.dataSourceSearchInputField).type(dataSource);
cy.get(`[data-cy="data-source-${String(dataSource).toLowerCase()}"]`)
cy.get(`[data-cy="data-source-${(dataSource).toLowerCase()}"]`)
.parent()
.within(() => {
cy.get(
`[data-cy="data-source-${String(
`[data-cy="data-source-${(
dataSource
).toLowerCase()}"]>>>.datasource-card-title`
).realHover("mouse");
cy.get(`[data-cy="${cyParamName(dataSource)}-add-button"]`).click();
cy.get(
`[data-cy="${cyParamName(dataSource).toLowerCase()}-add-button"]`
).click();
});
cy.get(postgreSqlSelector.buttonSave).should("be.disabled");
cy.wait(1000)
cy.get(postgreSqlSelector.buttonSave).should("be.disabled")
cy.clearAndType(
'[data-cy="data-source-name-input-filed"]',
`cypress-${cyParamName(dataSourceName)}-${cyParamName(dataSource)}`
cyParamName(`cypress-${dataSourceName}-${dataSource}`)
);
cy.get(postgreSqlSelector.buttonSave).click();
cy.verifyToastMessage(
commonSelectors.toastMessage,
postgreSqlText.toastDSAdded
);
cy.get(
`[data-cy="cypress-${cyParamName(dataSourceName)}-${cyParamName(
dataSource
@ -179,4 +184,4 @@ export const addWidgetsToAddUser = () => {
addEventHandlerToRunQuery("add_data_using_widgets");
};
export const addListviewToVerifyData = () => {};
export const addListviewToVerifyData = () => { };

50
cypress-tests/cypress/support/utils/queryPanel/queryEditor.js Normal file
View file

@ -0,0 +1,50 @@
export const verifyElemtsNoGds = (option) => {
cy.get('[data-cy="label-select-datasource"]').verifyVisibleElement(
"have.text",
"Connect to a datasource"
);
cy.get('[data-cy="querymanager-description"]').verifyVisibleElement(
"contain.text",
"Select a datasource to start creating a new query. To know more about queries in ToolJet, you can read our"
);
cy.get('[data-cy="querymanager-doc-link"]').verifyVisibleElement(
"have.text",
"documentation"
);
cy.get('[data-cy="landing-page-label-default"]').verifyVisibleElement(
"have.text",
"Default"
);
cy.get('[data-cy="restapi-add-query-card"]').verifyVisibleElement(
"have.text",
"REST API"
);
cy.get('[data-cy="runjs-add-query-card"]').verifyVisibleElement(
"have.text",
"JavaScript"
);
cy.get('[data-cy="runpy-add-query-card"]').verifyVisibleElement(
"have.text",
"Python"
);
cy.get('[data-cy="tooljetdb-add-query-card"]').verifyVisibleElement(
"have.text",
"ToolJet DB"
);
cy.get('[data-cy="label-avilable-ds"]').verifyVisibleElement(
"have.text",
"Available Datasources 0"
);
cy.get('[data-cy="landing-page-add-new-ds-button"]').verifyVisibleElement(
"have.text",
"Add new"
);
cy.get('[data-cy="empty-banner-queryManager"]').verifyVisibleElement(
"have.text",
"No global datasources have been added yet. Add new datasources to connect to your app! 🚀"
);
};
export const verifyElemtsWithGds = (option) => {};

41
cypress-tests/cypress/support/utils/table.js
View file

@ -32,11 +32,12 @@ export const selectDropdownOption = (inputSelector, option) => {
multipleBadges: 5,
tags: 6,
dropdown: 7,
radio: 8,
multiselect: 9,
toggleSwitch: 10,
datePicker: 11,
image: 12,
link: 8,
radio: 9,
multiselect: 10,
toggleSwitch: 11,
datePicker: 12,
image: 13,
wrap: 0,
scroll: 1,
hide: 2,
@ -65,13 +66,13 @@ export const verifyAndEnterColumnOptionInput = (label, value) => {
.find("label")
.should("have.text", label);
cy.get(`[data-cy="input-and-label-${cyParamName(label)}"]`)
.realClick()
.realPress(["Meta", "A"])
.realType(`{backspace}{backspace}{backspace}{backspace}`)
.realPress(["Meta", "A"])
.realType(
`{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}{backspace}{rightarrow}${value}`
);
.find(`[data-cy="-input-field"]`)
// .click({ force: true })
// .realClick()
// .realPress(["Meta", "A"])
// .realType(`{backspace}{backspace}{backspace}{backspace}`)
// .realPress(["Meta", "A"])
.clearAndTypeOnCodeMirror(`${value}`);
};
export const addAndOpenColumnOption = (name, type) => {
@ -86,7 +87,13 @@ export const addAndOpenColumnOption = (name, type) => {
};
export const deleteAndVerifyColumn = (columnName) => {
cy.get(`[data-cy="button-delete-${columnName}"]`).click();
cy.get(`[data-cy="pages-name-${columnName}"]`)
.parent()
.realHover()
.click()
.find(".tj-base-btn")
.click();
cy.get(".list-item-popover-option").click();
cy.notVisible(`[data-cy="column-${columnName}"]`);
cy.notVisible(tableSelector.columnHeader(columnName));
};
@ -128,20 +135,20 @@ export const verifySingleValueOnTable = (
export const verifyAndModifyToggleFx = (
paramName,
defaultValue,
toggleModification = true
toggleModification = true,
helper = ""
) => {
cy.get(`[data-cy="label-${cyParamName(paramName)}"]`).should(
"have.text",
paramName
);
cy.get(commonWidgetSelector.parameterFxButton(paramName, ":eq(1)"))
cy.get(commonWidgetSelector.parameterFxButton(paramName, "> svg"))
.scrollIntoView()
.should("have.text", "Fx")
.click();
if (defaultValue)
cy.get(commonWidgetSelector.parameterInputField(paramName))
.find("pre.CodeMirror-line")
.should("have.text", defaultValue);
.should("have.text", `${helper}${defaultValue}`);
cy.get(commonWidgetSelector.parameterFxButton(paramName)).click();
if (toggleModification == true)
cy.get(commonWidgetSelector.parameterTogglebutton(paramName)).click();

2
docs/docs/setup/env-vars.md
View file

@ -325,4 +325,4 @@ By default, only embedding of public apps is permitted. By setting this variable
:::caution
The option is only available starting from ToolJet Enterprise Edition `2.8.0` or higher, and `2.10.0` for the Community edition and cloud version.
:::
:::

2
docs/versioned_docs/version-2.8.0/setup/env-vars.md
View file

@ -325,4 +325,4 @@ By default, only embedding of public apps is permitted. By setting this variable
:::caution
The option is only available starting from ToolJet Enterprise Edition `2.8.0` or higher, and `2.10.0` for the Community edition and cloud version.
:::
:::

2
docs/versioned_docs/version-2.9.0/actions/generate-file.md
View file

@ -49,4 +49,4 @@ To use the `Text` file format, the data field should contain a string.
If you want to generate a text file based on an array of objects, you need to stringify the data before providing it.
For example, if you are using the table component to provide the data, you can enter **`{{JSON.stringify(components.table1.currentPageData)}}`** in the Data field.
For example, if you are using the table component to provide the data, you can enter **`{{JSON.stringify(components.table1.currentPageData)}}`** in the Data field.

2
docs/versioned_docs/version-2.9.0/setup/env-vars.md
View file

@ -325,4 +325,4 @@ By default, only embedding of public apps is permitted. By setting this variable
:::caution
The option is only available starting from ToolJet Enterprise Edition `2.8.0` or higher, and `2.10.0` for the Community edition and cloud version.
:::
:::

2
docs/versioned_docs/version-2.9.4/actions/generate-file.md
View file

@ -49,4 +49,4 @@ To use the `Text` file format, the data field should contain a string.
If you want to generate a text file based on an array of objects, you need to stringify the data before providing it.
For example, if you are using the table component to provide the data, you can enter **`{{JSON.stringify(components.table1.currentPageData)}}`** in the Data field.
For example, if you are using the table component to provide the data, you can enter **`{{JSON.stringify(components.table1.currentPageData)}}`** in the Data field.

2
docs/versioned_docs/version-2.9.4/setup/env-vars.md
View file

@ -325,4 +325,4 @@ By default, only embedding of public apps is permitted. By setting this variable
:::caution
The option is only available starting from ToolJet Enterprise Edition `2.8.0` or higher, and `2.10.0` for the Community edition and cloud version.
:::
:::

8
frontend/.eslintrc.js
View file

@ -59,7 +59,12 @@ module.exports = {
'jest/no-identical-title': 'error',
'jest/prefer-to-have-length': 'warn',
'jest/valid-expect': 'error',
'import/no-unresolved': ['error', { ignore: ['^@/', 'react-hot-toast', 'react-i18next'] }],
'import/no-unresolved': [
'error',
{
ignore: ['^@/', 'react-hot-toast', 'react-i18next'],
},
],
'react/no-unknown-property': 'off',
},
settings: {
@ -77,4 +82,5 @@ module.exports = {
},
},
],
extends: ['plugin:storybook/recommended'],
};

32
frontend/.storybook/main.js Normal file
View file

@ -0,0 +1,32 @@
/** @type { import('@storybook/react-webpack5').StorybookConfig } */
import custom from '../webpack.config'
const path = require('path');
const config = {
stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
addons: [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-onboarding",
"@storybook/addon-interactions",
],
framework: {
name: "@storybook/react-webpack5",
options: {},
},
docs: {
autodocs: "tag",
},
webpackFinal: async (config) => {
return {
...config,
module: { ...config.module, rules: [...config.module.rules, ...custom.module.rules] },
resolve : {
alias : {
'@': path.resolve(__dirname, 'src/')
}
}
};
},
};
export default config;

18
frontend/.storybook/preview.js Normal file
View file

@ -0,0 +1,18 @@
/** @type { import('@storybook/react').Preview } */
// import 'bootstrap/dist/css/bootstrap.min.css';
import '../src/_styles/theme.scss';
import './preview.scss'
const preview = {
parameters: {
actions: { argTypesRegex: "^on[A-Z].*" },
controls: {
matchers: {
color: /(background|color)$/i,
date: /Date$/,
},
},
},
};
export default preview;

2
frontend/.storybook/preview.scss Normal file
View file

@ -0,0 +1,2 @@
@import '~bootstrap/scss/bootstrap';

1
frontend/.version Normal file
View file

@ -0,0 +1 @@
2.17.0

BIN
frontend/assets/images/avatar.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

3
frontend/assets/images/icons/editor/left-sidebar/comments.svg Normal file
View file

@ -0,0 +1,3 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.1665 8.5H16.8332C20.9753 8.5 24.3332 11.8579 24.3332 16C24.3332 20.1421 20.9753 23.5 16.8332 23.5H10.9998C9.15889 23.5 7.6665 22.0076 7.6665 20.1667V16C7.6665 11.8579 11.0244 8.5 15.1665 8.5ZM12.6665 18.2917C12.3213 18.2917 12.0415 18.0118 12.0415 17.6667C12.0415 17.3215 12.3213 17.0417 12.6665 17.0417H15.9998C16.345 17.0417 16.6248 17.3215 16.6248 17.6667C16.6248 18.0118 16.345 18.2917 15.9998 18.2917H12.6665ZM12.6665 14.9583C12.3213 14.9583 12.0415 14.6785 12.0415 14.3333C12.0415 13.9882 12.3213 13.7083 12.6665 13.7083H19.3332C19.6783 13.7083 19.9582 13.9882 19.9582 14.3333C19.9582 14.6785 19.6783 14.9583 19.3332 14.9583H12.6665Z" fill="#C1C8CD"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 814 B

6
frontend/assets/images/icons/editor/left-sidebar/debugger.svg
View file

@ -1,3 +1,5 @@
<svg width="33" height="33" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.3633 10.7383C15.8328 10.7383 15.3241 10.949 14.9491 11.3241C14.574 11.6991 14.3633 12.2078 14.3633 12.7383H18.3633C18.3633 12.2078 18.1526 11.6991 17.7775 11.3241C17.4024 10.949 16.8937 10.7383 16.3633 10.7383ZM12.9304 14.7383C12.6003 15.3649 12.4062 16.0564 12.3633 16.7671V19.7383C12.3633 20.7991 12.7847 21.8166 13.5349 22.5667C14.0444 23.0763 14.6773 23.4341 15.3633 23.6113V18.7383C15.3633 18.186 15.811 17.7383 16.3633 17.7383C16.9156 17.7383 17.3633 18.186 17.3633 18.7383V23.6113C18.0493 23.4341 18.6822 23.0763 19.1917 22.5667C19.9419 21.8166 20.3633 20.7991 20.3633 19.7383V16.7671C20.3203 16.0564 20.1263 15.3649 19.7961 14.7383H12.9304ZM21.8879 14.5098C22.1596 15.2014 22.3205 15.9349 22.3618 16.6832C22.3628 16.7016 22.3633 16.7199 22.3633 16.7383H25.3633C25.9156 16.7383 26.3633 17.186 26.3633 17.7383C26.3633 18.2906 25.9156 18.7383 25.3633 18.7383H22.3633V19.7383C22.3633 20.257 22.2961 20.7689 22.1666 21.2621L24.8759 22.8797C25.3501 23.1628 25.505 23.7767 25.2219 24.2509C24.9388 24.7251 24.3249 24.88 23.8507 24.5969L21.3361 23.0956C21.123 23.4111 20.879 23.7078 20.6059 23.9809C19.4807 25.1061 17.9546 25.7383 16.3633 25.7383C14.772 25.7383 13.2459 25.1061 12.1206 23.9809C11.8476 23.7078 11.6035 23.4111 11.3905 23.0956L8.87589 24.5969C8.40169 24.88 7.78777 24.7251 7.50466 24.2509C7.22155 23.7767 7.37647 23.1628 7.85067 22.8797L10.56 21.2621C10.4305 20.7689 10.3633 20.257 10.3633 19.7383V18.7383H7.36328C6.811 18.7383 6.36328 18.2906 6.36328 17.7383C6.36328 17.186 6.811 16.7383 7.36328 16.7383H10.3633C10.3633 16.7199 10.3638 16.7016 10.3648 16.6832C10.4061 15.9349 10.567 15.2014 10.8386 14.5098L7.82423 12.5806C7.35905 12.2828 7.2233 11.6644 7.52101 11.1992C7.81872 10.7341 8.43716 10.5983 8.90233 10.896L11.933 12.8356C12.0654 12.7724 12.2121 12.7383 12.3633 12.7383C12.3633 11.6774 12.7847 10.66 13.5349 9.90985C14.285 9.15971 15.3024 8.73828 16.3633 8.73828C17.4241 8.73828 18.4416 9.15971 19.1917 9.90985C19.9419 10.66 20.3633 11.6774 20.3633 12.7383C20.5145 12.7383 20.6611 12.7724 20.7936 12.8356L23.8242 10.896C24.2894 10.5983 24.9078 10.7341 25.2056 11.1992C25.5033 11.6644 25.3675 12.2828 24.9023 12.5806L21.8879 14.5098Z" fill="#C1C8CD"/>
<svg width="24" height="24" viewBox="0 0 24 24" fill="#C1C8CD" xmlns="http://www.w3.org/2000/svg">
<g id="Bug">
<path id="Union" fill-rule="evenodd" clip-rule="evenodd" d="M16.5107 3.24181C16.5107 2.91246 16.397 2.5966 16.1946 2.36372C15.9922 2.13083 15.7177 2 15.4315 2C15.1452 2 14.8707 2.13083 14.6683 2.36372C14.4659 2.5966 14.3522 2.91246 14.3522 3.24181C14.3522 3.66095 14.2674 4.07434 14.1047 4.44935C13.942 4.82436 13.7058 5.15074 13.4147 5.40272C12.4801 5.19066 11.5184 5.19066 10.5837 5.40272C10.2929 5.15055 10.057 4.82409 9.89457 4.44909C9.73215 4.07409 9.64767 3.6608 9.64779 3.24181C9.64779 2.91246 9.53408 2.5966 9.33168 2.36372C9.12928 2.13083 8.85477 2 8.56853 2C8.28229 2 8.00778 2.13083 7.80538 2.36372C7.60298 2.5966 7.48927 2.91246 7.48927 3.24181C7.48971 4.36073 7.80441 5.44952 8.38646 6.34589C7.70144 6.79746 7.08449 7.37367 6.55954 8.05215C5.55234 7.19515 4.33194 6.73438 3.07926 6.73813C2.93753 6.73848 2.79725 6.77095 2.66643 6.83368C2.5356 6.89641 2.4168 6.98818 2.31679 7.10374C2.21679 7.2193 2.13755 7.35639 2.08359 7.50719C2.02964 7.65799 2.00202 7.81954 2.00233 7.98261C2.00263 8.14569 2.03085 8.3071 2.08537 8.45763C2.13989 8.60816 2.21965 8.74486 2.32008 8.85992C2.42051 8.97499 2.53966 9.06616 2.67072 9.12825C2.80178 9.19033 2.94218 9.2221 3.08391 9.22175C3.91711 9.21857 4.72645 9.54176 5.37879 10.1382C5.10952 10.8145 4.92034 11.5292 4.8163 12.2634H3.07926C2.79303 12.2634 2.51851 12.3943 2.31611 12.6271C2.11371 12.86 2 13.1759 2 13.5052C2 13.8346 2.11371 14.1504 2.31611 14.3833C2.51851 14.6162 2.79303 14.747 3.07926 14.747H4.78376C4.87364 15.5137 5.05339 16.2465 5.31061 16.9329C4.66963 17.4921 3.88673 17.7934 3.08236 17.7905C2.79613 17.7896 2.52128 17.9195 2.3183 18.1517C2.11532 18.3839 2.00083 18.6994 2 19.0287C1.99918 19.3581 2.1121 19.6743 2.31392 19.9079C2.51574 20.1414 2.78993 20.2732 3.07616 20.2741C4.28481 20.2786 5.46476 19.8505 6.45263 19.0492C7.13547 19.9753 7.98548 20.7189 8.9435 21.2285C9.90153 21.7381 10.9446 22.0014 12 22C13.0554 22.0014 14.0985 21.7381 15.0565 21.2285C16.0145 20.7189 16.8645 19.9753 17.5474 19.0492C18.5351 19.8508 19.7151 20.2789 20.9238 20.2741C21.2101 20.2732 21.4843 20.1414 21.6861 19.9079C21.8879 19.6743 22.0008 19.3581 22 19.0287C21.9992 18.6994 21.8847 18.3839 21.6817 18.1517C21.4787 17.9195 21.2039 17.7896 20.9176 17.7905C20.1133 17.7934 19.3304 17.4921 18.6894 16.9329C18.9466 16.2483 19.1264 15.5137 19.2162 14.747H20.9207C21.207 14.747 21.4815 14.6162 21.6839 14.3833C21.8863 14.1504 22 13.8346 22 13.5052C22 13.1759 21.8863 12.86 21.6839 12.6271C21.4815 12.3943 21.207 12.2634 20.9207 12.2634H19.1852C19.0817 11.5293 18.893 10.8145 18.6243 10.1382C19.2762 9.54215 20.085 9.21897 20.9176 9.22175C21.2039 9.22269 21.4787 9.09277 21.6817 8.86055C21.8847 8.62834 21.9992 8.31285 22 7.98351C22.0008 7.65416 21.8879 7.33792 21.6861 7.10437C21.4843 6.87082 21.2101 6.73908 20.9238 6.73813C19.6701 6.73361 18.4485 7.19442 17.4405 8.05215C16.9154 7.37431 16.2984 6.7987 15.6135 6.34767C16.1955 5.45124 16.5102 4.36071 16.5107 3.24181Z" fill="#11181C"/>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 3 KiB

4
frontend/assets/images/icons/editor/left-sidebar/file-accept.svg Normal file
View file

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.36621 3.33333V11.5C1.36621 12.6966 2.35306 13.6667 3.54967 13.6667C4.72788 13.6667 5.69954 12.7115 5.69954 11.5333C5.69954 11.2388 5.93833 11 6.23288 11H12.0329V3.33333C12.0329 2.22876 11.1374 1.33333 10.0329 1.33333H3.36621C2.26164 1.33333 1.36621 2.22876 1.36621 3.33333ZM9.02882 4.95705C9.23663 5.13889 9.25769 5.45477 9.07585 5.66259L7.16258 7.84918C6.75145 8.31904 6.04329 8.38196 5.55576 7.99194L4.38722 7.0571C4.17158 6.8846 4.13662 6.56995 4.30913 6.35432C4.48163 6.13869 4.79628 6.10373 5.01191 6.27623L6.18046 7.21107C6.2501 7.26679 6.35127 7.2578 6.41 7.19068L8.32327 5.00408C8.50512 4.79626 8.821 4.77521 9.02882 4.95705Z" fill="#C1C8CD"/>
<path d="M14.6173 12.6599C14.3236 13.8135 13.2779 14.6667 12.0329 14.6667H4.03288C5.27787 14.6667 6.32358 13.8135 6.61726 12.6599C6.7081 12.3031 6.99802 12 7.36621 12H14.0329C14.4011 12 14.7081 12.3031 14.6173 12.6599Z" fill="#C1C8CD"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1 KiB

4
frontend/assets/images/icons/editor/left-sidebar/file-remove.svg Normal file
View file

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.3335 3.33334V11.5C1.3335 12.6966 2.32034 13.6667 3.51696 13.6667C4.69517 13.6667 5.66683 12.7115 5.66683 11.5333C5.66683 11.2388 5.90561 11 6.20016 11H12.0002V3.33334C12.0002 2.22877 11.1047 1.33334 10.0002 1.33334H3.3335C2.22893 1.33334 1.3335 2.22877 1.3335 3.33334ZM7.72751 8.43442C7.92277 8.62969 8.23935 8.62969 8.43461 8.43442C8.62988 8.23916 8.62988 7.92258 8.43461 7.72732L7.37394 6.66665L8.43459 5.606C8.62985 5.41074 8.62985 5.09416 8.43458 4.8989C8.23932 4.70363 7.92274 4.70363 7.72748 4.8989L6.66684 5.95954L5.60619 4.89889C5.41092 4.70363 5.09434 4.70363 4.89908 4.89889C4.70382 5.09415 4.70382 5.41074 4.89908 5.606L5.95973 6.66665L4.89905 7.72732C4.70379 7.92259 4.70379 8.23917 4.89905 8.43443C5.09431 8.62969 5.4109 8.62969 5.60616 8.43443L6.66684 7.37375L7.72751 8.43442Z" fill="#C1C8CD"/>
<path d="M14.5845 12.6599C14.2909 13.8135 13.2452 14.6667 12.0002 14.6667H4.00016C5.24515 14.6667 6.29087 13.8135 6.58454 12.6599C6.67538 12.3031 6.96531 12 7.3335 12H14.0002C14.3684 12 14.6754 12.3031 14.5845 12.6599Z" fill="#C1C8CD"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.2 KiB

5
frontend/assets/images/icons/editor/left-sidebar/inspect.svg
View file

@ -1,4 +1,3 @@
<svg width="33" height="33" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.66177 9.5081C9.93805 9.23612 10.3466 9.14834 10.7102 9.28284L22.4972 13.6428C22.5151 13.6495 22.5328 13.6566 22.5503 13.6642C22.7905 13.769 22.9952 13.9413 23.1395 14.1601C23.2838 14.379 23.3615 14.6349 23.3633 14.8971L23.3634 14.9104C23.3616 15.1725 23.2838 15.4285 23.1395 15.6473C22.9952 15.8661 22.7905 16.0384 22.5503 16.1433L22.5348 16.1498L18.1104 17.9928L16.0893 22.4284L16.08 22.4481C15.9677 22.6809 15.7917 22.8771 15.5724 23.0139C15.3547 23.1496 15.1032 23.2213 14.8468 23.2207C14.5904 23.221 14.339 23.149 14.1216 23.0131C13.9024 22.876 13.7267 22.6796 13.6149 22.4466C13.5991 22.4138 13.5852 22.3802 13.5731 22.3459L9.42009 10.5529C9.29131 10.1872 9.3855 9.78007 9.66177 9.5081ZM14.8468 23.2207C14.8448 23.2207 14.8429 23.2207 14.8409 23.2207L14.8473 22.2207L14.8527 23.2207C14.8507 23.2207 14.8487 23.2207 14.8468 23.2207ZM12.014 11.8975L14.9243 20.1617L16.4533 16.8061C16.558 16.5763 16.7457 16.3947 16.9788 16.2976L20.2385 14.9398L12.014 11.8975Z" fill="#C1C8CD"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.1562 17.0136C17.5467 16.6231 18.1799 16.6231 18.5704 17.0136L23.0704 21.5136C23.4609 21.9041 23.4609 22.5373 23.0704 22.9278C22.6799 23.3184 22.0467 23.3184 21.6562 22.9278L17.1562 18.4278C16.7657 18.0373 16.7657 17.4041 17.1562 17.0136Z" fill="#C1C8CD"/>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.9063 17.4546L22.7631 16.169C24.8565 15.4712 24.8565 12.51 22.7631 11.8122L10.6928 7.7888C8.89773 7.19043 7.18995 8.89822 7.78831 10.6933L11.8117 22.7636C12.5095 24.857 15.4707 24.857 16.1685 22.7636L17.4541 18.9068C17.6826 18.2212 18.2207 17.6831 18.9063 17.4546Z" fill="#C1C8CD"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 398 B

5
frontend/assets/images/icons/editor/left-sidebar/page.svg
View file

@ -1,3 +1,4 @@
<svg width="33" height="33" viewBox="0 0 33 33" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.3633 8.73828C11.0981 8.73828 10.8437 8.84364 10.6562 9.03117C10.4686 9.21871 10.3633 9.47306 10.3633 9.73828V23.7383C10.3633 24.0035 10.4686 24.2579 10.6562 24.4454C10.8437 24.6329 11.0981 24.7383 11.3633 24.7383H21.3633C21.6285 24.7383 21.8829 24.6329 22.0704 24.4454C22.2579 24.2579 22.3633 24.0035 22.3633 23.7383V13.7383H19.3633C18.8328 13.7383 18.3241 13.5276 17.9491 13.1525C17.574 12.7774 17.3633 12.2687 17.3633 11.7383V8.73828H11.3633ZM19.3633 10.1525L20.9491 11.7383H19.3633V10.1525ZM9.24196 7.61696C9.80457 7.05435 10.5676 6.73828 11.3633 6.73828H18.3633C18.6285 6.73828 18.8829 6.84364 19.0704 7.03117L24.0704 12.0312C24.2579 12.2187 24.3633 12.4731 24.3633 12.7383V23.7383C24.3633 24.5339 24.0472 25.297 23.4846 25.8596C22.922 26.4222 22.1589 26.7383 21.3633 26.7383H11.3633C10.5676 26.7383 9.80457 26.4222 9.24196 25.8596C8.67935 25.297 8.36328 24.5339 8.36328 23.7383V9.73828C8.36328 8.94263 8.67935 8.17957 9.24196 7.61696ZM12.3633 17.7383C12.3633 17.186 12.811 16.7383 13.3633 16.7383H19.3633C19.9156 16.7383 20.3633 17.186 20.3633 17.7383C20.3633 18.2906 19.9156 18.7383 19.3633 18.7383H13.3633C12.811 18.7383 12.3633 18.2906 12.3633 17.7383ZM12.3633 21.7383C12.3633 21.186 12.811 20.7383 13.3633 20.7383H19.3633C19.9156 20.7383 20.3633 21.186 20.3633 21.7383C20.3633 22.2906 19.9156 22.7383 19.3633 22.7383H13.3633C12.811 22.7383 12.3633 22.2906 12.3633 21.7383Z" fill="#C1C8CD"/>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.70801 10.167C7.70801 8.78628 8.8273 7.66699 10.208 7.66699H18.5413C19.9221 7.66699 21.0413 8.78628 21.0413 10.167V19.7503H13.7913C13.4232 19.7503 13.1247 20.0488 13.1247 20.417C13.1247 21.8898 11.9101 23.0837 10.4373 23.0837C8.94156 23.0837 7.70801 21.8711 7.70801 20.3753V10.167ZM11.0413 11.2087C10.6962 11.2087 10.4163 11.4885 10.4163 11.8337C10.4163 12.1788 10.6962 12.4587 11.0413 12.4587H17.708C18.0532 12.4587 18.333 12.1788 18.333 11.8337C18.333 11.4885 18.0532 11.2087 17.708 11.2087H11.0413ZM10.4163 16.0003C10.4163 15.6551 10.6962 15.3753 11.0413 15.3753H14.3747C14.7199 15.3753 14.9997 15.6551 14.9997 16.0003C14.9997 16.3455 14.7199 16.6253 14.3747 16.6253H11.0413C10.6962 16.6253 10.4163 16.3455 10.4163 16.0003Z" fill="#C1C8CD"/>
<path d="M24.2718 21.8252C23.9047 23.2672 22.5976 24.3337 21.0413 24.3337H11.0413C12.5976 24.3337 13.9047 23.2672 14.2718 21.8252C14.3854 21.3792 14.7478 21.0003 15.208 21.0003H23.5413C24.0016 21.0003 24.3854 21.3792 24.2718 21.8252Z" fill="#C1C8CD"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

4
frontend/assets/images/icons/editor/left-sidebar/settings.svg
View file

@ -1,3 +1,3 @@
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.832 9.91667C12.832 9.27233 13.3544 8.75 13.9987 8.75C14.643 8.75 15.1654 9.27233 15.1654 9.91667C15.1654 10.561 14.643 11.0833 13.9987 11.0833C13.3544 11.0833 12.832 10.561 12.832 9.91667ZM12.832 14C12.832 13.3557 13.3544 12.8333 13.9987 12.8333C14.643 12.8333 15.1654 13.3557 15.1654 14C15.1654 14.6443 14.643 15.1667 13.9987 15.1667C13.3544 15.1667 12.832 14.6443 12.832 14ZM12.832 18.0833C12.832 17.439 13.3544 16.9167 13.9987 16.9167C14.643 16.9167 15.1654 17.439 15.1654 18.0833C15.1654 18.7277 14.643 19.25 13.9987 19.25C13.3544 19.25 12.832 18.7277 12.832 18.0833Z" fill="#C1C8CD"/>
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.116 7.66406H16.8841C17.8606 7.66406 18.6522 8.41045 18.6522 9.33116C18.6522 10.3848 19.7795 11.0546 20.7049 10.5509L20.7989 10.4997C21.6446 10.0394 22.726 10.3126 23.2142 11.1099L24.0983 12.5537C24.5866 13.351 24.2968 14.3706 23.4511 14.831C22.5253 15.3349 22.5253 16.6641 23.4511 17.1681C24.2968 17.6285 24.5866 18.648 24.0983 19.4454L23.2142 20.8891C22.726 21.6865 21.6446 21.9597 20.7989 21.4993L20.7049 21.4482C19.7795 20.9444 18.6522 21.6143 18.6522 22.6679C18.6522 23.5886 17.8606 24.335 16.8841 24.335H15.116C14.1394 24.335 13.3478 23.5886 13.3478 22.6679C13.3478 21.6143 12.2205 20.9444 11.2951 21.4482L11.2011 21.4993C10.3554 21.9597 9.27406 21.6865 8.7858 20.8891L7.90173 19.4454C7.41347 18.648 7.70323 17.6285 8.54891 17.1681C9.47475 16.6641 9.47475 15.3349 8.54892 14.831C7.70323 14.3706 7.41348 13.351 7.90173 12.5537L8.7858 11.1099C9.27406 10.3126 10.3554 10.0394 11.2011 10.4997L11.2951 10.5509C12.2205 11.0546 13.3478 10.3848 13.3478 9.33116C13.3478 8.41045 14.1394 7.66406 15.116 7.66406ZM16 18.778C17.5345 18.778 18.7785 17.5341 18.7785 15.9995C18.7785 14.465 17.5345 13.221 16 13.221C14.4655 13.221 13.2215 14.465 13.2215 15.9995C13.2215 17.5341 14.4655 18.778 16 18.778Z" fill="#C1C8CD"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 746 B

After

Width:  |  Height:  |  Size: 1.3 KiB

2
frontend/assets/images/icons/editor/play.svg
View file

@ -1,3 +1,3 @@
<svg width="10" height="12" viewBox="0 0 10 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.495 6.87126L1.54125 11.4863C0.86625 11.8775 0 11.4038 0 10.615V1.38501C0 0.597508 0.865 0.122508 1.54125 0.515008L9.495 5.13001C9.64855 5.21766 9.77618 5.34437 9.86496 5.49727C9.95373 5.65017 10.0005 5.82383 10.0005 6.00063C10.0005 6.17744 9.95373 6.3511 9.86496 6.504C9.77618 6.6569 9.64855 6.7836 9.495 6.87126Z" fill="#292D37"/>
<path d="M9.495 6.87126L1.54125 11.4863C0.86625 11.8775 0 11.4038 0 10.615V1.38501C0 0.597508 0.865 0.122508 1.54125 0.515008L9.495 5.13001C9.64855 5.21766 9.77618 5.34437 9.86496 5.49727C9.95373 5.65017 10.0005 5.82383 10.0005 6.00063C10.0005 6.17744 9.95373 6.3511 9.86496 6.504C9.77618 6.6569 9.64855 6.7836 9.495 6.87126Z" fill="#C1C8CD"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 447 B

After

Width:  |  Height:  |  Size: 447 B

6
frontend/assets/images/icons/eye1.svg Normal file
View file

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
<path d="M13.25 3.53894C13.25 3.12473 12.9142 2.78894 12.5 2.78894C12.0858 2.78894 11.75 3.12473 11.75 3.53894V5.53894C11.75 5.95315 12.0858 6.28894 12.5 6.28894C12.9142 6.28894 13.25 5.95315 13.25 5.53894V3.53894Z" fill="#11181C"/>
<path d="M4.03033 6.00861C3.73744 5.71572 3.26256 5.71572 2.96967 6.00861C2.67678 6.3015 2.67678 6.77638 2.96967 7.06927L4.46967 8.56927C4.76256 8.86216 5.23744 8.86216 5.53033 8.56927C5.82322 8.27638 5.82322 7.8015 5.53033 7.50861L4.03033 6.00861Z" fill="#11181C"/>
<path d="M22.0303 7.06927C22.3232 6.77638 22.3232 6.3015 22.0303 6.00861C21.7374 5.71572 21.2626 5.71572 20.9697 6.00861L19.4697 7.50861C19.1768 7.8015 19.1768 8.27638 19.4697 8.56927C19.7626 8.86216 20.2374 8.86216 20.5303 8.56927L22.0303 7.06927Z" fill="#11181C"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.3772 13.1102C22.8743 14.5433 22.8743 17.0349 21.3772 18.4679C19.3134 20.4436 16.1042 22.7891 12.5 22.7891C8.8958 22.7891 5.68661 20.4436 3.62281 18.4679C2.12573 17.0349 2.12573 14.5433 3.62281 13.1102C5.68661 11.1346 8.8958 8.78906 12.5 8.78906C16.1042 8.78906 19.3134 11.1346 21.3772 13.1102ZM15.5 15.7891C15.5 17.4459 14.1568 18.7891 12.5 18.7891C10.8431 18.7891 9.49997 17.4459 9.49997 15.7891C9.49997 14.1322 10.8431 12.7891 12.5 12.7891C14.1568 12.7891 15.5 14.1322 15.5 15.7891Z" fill="#11181C"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

4
frontend/assets/images/icons/filedownload.svg Normal file
View file

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.5 5.78906V18.0391C2.5 19.834 3.98027 21.2891 5.77519 21.2891C7.5425 21.2891 9 19.8564 9 18.0891C9 17.6472 9.35817 17.2891 9.8 17.2891H18.5V5.78906C18.5 4.13221 17.1569 2.78906 15.5 2.78906H5.5C3.84315 2.78906 2.5 4.13221 2.5 5.78906ZM9.75 11.9609C9.70334 11.9258 9.65858 11.887 9.61612 11.8446L8.03033 10.2588C7.73744 9.9659 7.26256 9.9659 6.96967 10.2588C6.67678 10.5517 6.67678 11.0266 6.96967 11.3195L8.55546 12.9052C9.6294 13.9792 11.3706 13.9792 12.4445 12.9052L14.0303 11.3195C14.3232 11.0266 14.3232 10.5517 14.0303 10.2588C13.7374 9.9659 13.2626 9.9659 12.9697 10.2588L11.3839 11.8446C11.3414 11.887 11.2967 11.9258 11.25 11.9609V7.78912C11.25 7.37491 10.9142 7.03912 10.5 7.03912C10.0858 7.03912 9.75 7.37491 9.75 7.78912V11.9609Z" fill="#11181C"/>
<path d="M22.3766 19.7789C21.9361 21.5093 20.3675 22.7891 18.5 22.7891H6.5C8.36748 22.7891 9.93606 21.5093 10.3766 19.7789C10.5128 19.2437 10.9477 18.7891 11.5 18.7891H21.5C22.0523 18.7891 22.5128 19.2437 22.3766 19.7789Z" fill="#11181C"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

6
frontend/assets/images/icons/plus.svg
View file

@ -1,5 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-plus" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 25 25" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.5 4.78906C13.0523 4.78906 13.5 5.23678 13.5 5.78906V11.7891H19.5C20.0523 11.7891 20.5 12.2368 20.5 12.7891C20.5 13.3413 20.0523 13.7891 19.5 13.7891H13.5V19.7891C13.5 20.3413 13.0523 20.7891 12.5 20.7891C11.9477 20.7891 11.5 20.3413 11.5 19.7891V13.7891H5.5C4.94772 13.7891 4.5 13.3413 4.5 12.7891C4.5 12.2368 4.94772 11.7891 5.5 11.7891H11.5V5.78906C11.5 5.23678 11.9477 4.78906 12.5 4.78906Z" fill="#11181C"/>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 387 B

After

Width:  |  Height:  |  Size: 570 B

3
frontend/assets/images/icons/widgets/Group.svg
View file

@ -1,3 +0,0 @@
<svg width="20" height="12" viewBox="0 0 20 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.71429 0C4.19876 0 2.74531 0.602039 1.67368 1.67368C0.602039 2.74531 0 4.19876 0 5.71429C0 7.22981 0.602039 8.68326 1.67368 9.7549C2.74531 10.8265 4.19876 11.4286 5.71429 11.4286H14.2857C15.8012 11.4286 17.2547 10.8265 18.3263 9.7549C19.398 8.68326 20 7.22981 20 5.71429C20 4.19876 19.398 2.74531 18.3263 1.67368C17.2547 0.602039 15.8012 0 14.2857 0H5.71429ZM14.2857 8.57143C13.528 8.57143 12.8012 8.27041 12.2654 7.73459C11.7296 7.19877 11.4286 6.47205 11.4286 5.71429C11.4286 4.95652 11.7296 4.2298 12.2654 3.69398C12.8012 3.15816 13.528 2.85714 14.2857 2.85714C15.0435 2.85714 15.7702 3.15816 16.306 3.69398C16.8418 4.2298 17.1429 4.95652 17.1429 5.71429C17.1429 6.47205 16.8418 7.19877 16.306 7.73459C15.7702 8.27041 15.0435 8.57143 14.2857 8.57143Z" fill="#61656F"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 886 B

27
frontend/assets/images/icons/widgets/boundedbox.jsx Normal file
View file

@ -0,0 +1,27 @@
import React from 'react';
const BoundedBox = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
fill={fill}
fillRule="evenodd"
d="M7.603 8.286A4.714 4.714 0 002.889 13v22a4.714 4.714 0 004.714 4.714h34.571A4.714 4.714 0 0046.89 35V13a4.714 4.714 0 00-4.715-4.714H7.603z"
clipRule="evenodd"
></path>
<path
fill="#3E63DD"
fillRule="evenodd"
d="M12.526 15.75c1.085 0 1.964.88 1.964 1.964v12.572a1.964 1.964 0 01-3.928 0V17.714c0-1.084.879-1.964 1.964-1.964zm12.363 0c1.084 0 1.964.88 1.964 1.964v12.572a1.964 1.964 0 11-3.929 0V17.714c0-1.084.88-1.964 1.965-1.964zm14.326 1.964a1.964 1.964 0 10-3.928 0v12.572a1.964 1.964 0 103.928 0V17.714z"
clipRule="evenodd"
></path>
</svg>
);
export default BoundedBox;

3
frontend/assets/images/icons/widgets/boundedbox.svg
View file

@ -1,3 +0,0 @@
<svg fill="#000000" width="44" height="44" viewBox="0 0 256 256" id="Flat" xmlns="http://www.w3.org/2000/svg" stroke-width="1.5" stroke="#2c3e50">
<path d="M208,92a12.01343,12.01343,0,0,0,12-12V48a12.01343,12.01343,0,0,0-12-12H176a12.01343,12.01343,0,0,0-12,12V60H92V48A12.01343,12.01343,0,0,0,80,36H48A12.01343,12.01343,0,0,0,36,48V80A12.01343,12.01343,0,0,0,48,92H60v72H48a12.01343,12.01343,0,0,0-12,12v32a12.01343,12.01343,0,0,0,12,12H80a12.01343,12.01343,0,0,0,12-12V196h72v12a12.01343,12.01343,0,0,0,12,12h32a12.01343,12.01343,0,0,0,12-12V176a12.01343,12.01343,0,0,0-12-12H196V92ZM172,48a4.00427,4.00427,0,0,1,4-4h32a4.00427,4.00427,0,0,1,4,4V80a4.00427,4.00427,0,0,1-4,4H176a4.00427,4.00427,0,0,1-4-4ZM44,80V48a4.00427,4.00427,0,0,1,4-4H80a4.00427,4.00427,0,0,1,4,4V80a4.00427,4.00427,0,0,1-4,4H48A4.00427,4.00427,0,0,1,44,80ZM84,208a4.00427,4.00427,0,0,1-4,4H48a4.00427,4.00427,0,0,1-4-4V176a4.00427,4.00427,0,0,1,4-4H80a4.00427,4.00427,0,0,1,4,4Zm128-32v32a4.00427,4.00427,0,0,1-4,4H176a4.00427,4.00427,0,0,1-4-4V176a4.00427,4.00427,0,0,1,4-4h32A4.00427,4.00427,0,0,1,212,176Zm-24-12H176a12.01343,12.01343,0,0,0-12,12v12H92V176a12.01343,12.01343,0,0,0-12-12H68V92H80A12.01343,12.01343,0,0,0,92,80V68h72V80a12.01343,12.01343,0,0,0,12,12h12Z"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.2 KiB

25
frontend/assets/images/icons/widgets/button.jsx Normal file
View file

@ -0,0 +1,25 @@
import React from 'react';
const Button = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
fill={fill}
d="M2.889 16.714A4.714 4.714 0 017.603 12h34.571a4.714 4.714 0 014.715 4.714v14.572A4.714 4.714 0 0142.174 36H7.603a4.714 4.714 0 01-4.714-4.714V16.714z"
></path>
<path
fill="#3E63DD"
fillRule="evenodd"
d="M18.603 24a3.143 3.143 0 11-6.286 0 3.143 3.143 0 016.286 0zm9.429 0a3.143 3.143 0 11-6.286 0 3.143 3.143 0 016.286 0zm6.285 3.143a3.143 3.143 0 100-6.286 3.143 3.143 0 000 6.286z"
clipRule="evenodd"
></path>
</svg>
);
export default Button;

11
frontend/assets/images/icons/widgets/button.svg
View file

@ -1,11 +0,0 @@
<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1_27)">
<path d="M15.6646 20.0731C15.3499 20.0716 15.4998 20.0723 15.4998 20.0723C15.3826 20.0718 15.2733 20.0712 15.2733 20.0712L14.9998 20.07L4.99995 20.0232L4.95034 20.0229C4.95034 20.0229 4.86323 20.0225 4.75385 20.022C4.62105 20.0214 4.5594 20.0211 4.3936 20.0203C4.22781 20.0196 3.99996 20.0185 3.99996 20.0185L3.8984 20.018L3.74996 20.0173L2.49998 20.0115C1.83699 20.0084 1.20241 19.7245 0.735853 19.2222C0.269398 18.7199 0.00917443 18.0404 0.0124838 17.3331L0.0811132 2.66664C0.0844224 1.95945 0.350994 1.28239 0.822129 0.784433C1.29336 0.28658 1.93057 0.00859812 2.59356 0.0117005L17.5934 0.0818897C18.2564 0.0849922 18.891 0.368925 19.3575 0.871166C19.824 1.37351 20.0842 2.05303 20.0809 2.76022L20.0123 17.4267C20.009 18.134 19.7424 18.811 19.2712 19.3089C18.8 19.8068 18.1628 20.0848 17.4998 20.0817L16.2498 20.0758L15.9998 20.0746C15.9998 20.0746 15.8303 20.0739 15.6646 20.0731ZM17.501 15.088C18.2081 15.0877 18.788 14.5275 18.8126 13.8208L18.8275 13.3941L18.8309 2.75438C18.8326 2.40078 18.7025 2.06097 18.4692 1.80985C18.236 1.55872 17.9187 1.41676 17.5872 1.41521L2.58732 1.34502C2.25583 1.34347 1.93717 1.48246 1.70161 1.73138C1.46604 1.98031 1.33275 2.31889 1.3311 2.67249L1.26918 13.3996L1.26909 13.6913C1.26888 14.4171 1.85728 15.0055 2.58304 15.0053V15.0053L9.5 15L17.501 15.088V15.088Z" fill="#61656F"/>
<path d="M9.44886 7.98864C9.44886 6.08523 8.26704 5 6.72443 5C5.17329 5 4 6.08523 4 7.98864C4 9.88353 5.17329 10.9772 6.72443 10.9772C8.26704 10.9772 9.44886 9.89205 9.44886 7.98864ZM8.2017 7.98864C8.2017 9.22159 7.61648 9.88921 6.72443 9.88921C5.82954 9.88921 5.24716 9.22159 5.24716 7.98864C5.24716 6.75568 5.82954 6.08807 6.72443 6.08807C7.61648 6.08807 8.2017 6.75568 8.2017 7.98864ZM10.2601 10.8977L11.4902 10.8977L11.4902 9.24432L12.0953 8.50568L13.6891 10.8977L15.1607 10.8977L12.976 7.68466L15.1351 5.07955L13.6607 5.07955L11.5669 7.64489L11.4902 7.64489L11.4902 5.07955L10.2601 5.07955L10.2601 10.8977Z" fill="#61656F"/>
</g>
<defs>
<clipPath id="clip0_1_27">
<rect width="20" height="20" fill="white" transform="translate(19.9998 20.0934) rotate(-179.732)"/>
</clipPath>
</defs>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 2.2 KiB

25
frontend/assets/images/icons/widgets/buttongroup.jsx Normal file
View file

@ -0,0 +1,25 @@
import React from 'react';
const ButtonGroup = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
fill={fill}
d="M2.889 16.964c0-2.603 1.558-4.714 3.48-4.714h14.038c1.922 0 3.48 2.11 3.48 4.714v14.572c0 2.603-1.558 4.714-3.48 4.714H6.37c-1.922 0-3.48-2.11-3.48-4.714V16.964zM25.893 16.964c0-2.603 1.558-4.714 3.48-4.714h14.034c1.922 0 3.48 2.11 3.48 4.714v14.572c0 2.603-1.558 4.714-3.48 4.714H29.373c-1.922 0-3.48-2.11-3.48-4.714V16.964z"
></path>
<path
fill="#3E63DD"
fillRule="evenodd"
d="M36.429 27.393a3.143 3.143 0 100-6.286 3.143 3.143 0 000 6.286zM13.511 27.393a3.143 3.143 0 100-6.286 3.143 3.143 0 000 6.286z"
clipRule="evenodd"
></path>
</svg>
);
export default ButtonGroup;

48
frontend/assets/images/icons/widgets/buttongroup.svg
View file

@ -1,48 +0,0 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 591.6 591.6" style="enable-background:new 0 0 591.6 591.6;" xml:space="preserve">
<g>
<g>
<path d="M540.6,0H153c-28.152,0-51,22.848-51,51v51H51c-28.152,0-51,22.848-51,51v387.6c0,28.152,22.848,51,51,51h387.6
c28.152,0,51-22.848,51-51v-51h51c28.152,0,51-22.848,51-51V51C591.6,22.848,568.752,0,540.6,0z M469.2,540.6
c0,16.932-13.668,30.6-30.6,30.6H51c-16.932,0-30.6-13.668-30.6-30.6V153c0-16.932,13.668-30.6,30.6-30.6h387.6
c16.932,0,30.6,13.668,30.6,30.6V540.6z M571.2,438.6c0,16.932-13.668,30.6-30.6,30.6h-51V153c0-28.152-22.848-51-51-51H122.4V51
c0-16.932,13.668-30.6,30.6-30.6h387.6c16.932,0,30.6,13.668,30.6,30.6V438.6z"/>
<path d="M193.8,147.9H51c-2.856,0-5.1,2.244-5.1,5.1v142.8c0,2.856,2.244,5.1,5.1,5.1s5.1-2.244,5.1-5.1V158.1h137.7
c2.856,0,5.1-2.244,5.1-5.1S196.656,147.9,193.8,147.9z"/>
<path d="M438.6,392.7c-2.856,0-5.1,2.244-5.1,5.1v137.7H295.8c-2.856,0-5.1,2.244-5.1,5.1c0,2.856,2.244,5.1,5.1,5.1h142.8
c2.856,0,5.1-2.244,5.1-5.1V397.8C443.7,394.944,441.456,392.7,438.6,392.7z"/>
</g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.5 KiB

15
frontend/assets/images/icons/widgets/calendar.jsx Normal file
View file

@ -0,0 +1,15 @@
import React from 'react';
const Calendar = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg xmlns="http://www.w3.org/2000/svg" width={width} height={width} viewBox={viewBox}>
<path fill={fill} d="M2.889 16.476V40.5a5.5 5.5 0 005.5 5.5h33a5.5 5.5 0 005.5-5.5V16.476h-44z"></path>
<path
fill="#3E63DD"
fillRule="evenodd"
d="M13.889 2a3.143 3.143 0 013.143 3.143v1.571h15.714V5.143a3.143 3.143 0 016.286 0v1.571h2.357c2.788 0 5.5 2.08 5.5 5.174v4.604H2.889v-4.604c0-3.093 2.711-5.174 5.5-5.174h2.357V5.143A3.143 3.143 0 0113.889 2zM24.888 21.967c1.085 0 1.965.88 1.965 1.965v12.177h2.75a1.964 1.964 0 010 3.929h-9.429a1.964 1.964 0 110-3.929h2.75v-6.905a5.5 5.5 0 01-1.571.227h-1.179a1.964 1.964 0 010-3.928h1.179c.867 0 1.571-.704 1.571-1.571 0-1.085.88-1.965 1.964-1.965z"
clipRule="evenodd"
></path>
</svg>
);
export default Calendar;

4
frontend/assets/images/icons/widgets/calendar.svg
View file

@ -1,4 +0,0 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.05625 14.61V7.9425H7.265C6.6983 8.24459 6.15062 8.58105 5.625 8.95V9.81875C6.09375 9.4975 6.83625 9.04375 7.1975 8.8475H7.2125V14.61H8.05625V14.61ZM9.54125 12.9788C9.6 13.7788 10.2838 14.7363 11.67 14.7363C13.2425 14.7363 14.17 13.4038 14.17 11.1475C14.17 8.73 13.1937 7.8125 11.7287 7.8125C10.5712 7.8125 9.4825 8.6525 9.4825 10.0738C9.4825 11.5238 10.5125 12.2863 11.5775 12.2863C12.51 12.2863 13.115 11.8162 13.3062 11.2987H13.34C13.335 12.9437 12.7637 14.0038 11.7087 14.0038C10.8787 14.0038 10.4488 13.4413 10.3963 12.9788H9.54125V12.9788ZM13.2325 10.0825C13.2325 10.9525 12.5337 11.5575 11.7525 11.5575C11.0013 11.5575 10.3225 11.0787 10.3225 10.0575C10.3225 9.02875 11.05 8.545 11.7825 8.545C12.5737 8.545 13.2325 9.0425 13.2325 10.0825Z" fill="#61656F"/>
<path d="M4.375 0C4.54076 0 4.69973 0.065848 4.81694 0.183058C4.93415 0.300269 5 0.45924 5 0.625V1.25H15V0.625C15 0.45924 15.0658 0.300269 15.1831 0.183058C15.3003 0.065848 15.4592 0 15.625 0C15.7908 0 15.9497 0.065848 16.0669 0.183058C16.1842 0.300269 16.25 0.45924 16.25 0.625V1.25H17.5C18.163 1.25 18.7989 1.51339 19.2678 1.98223C19.7366 2.45107 20 3.08696 20 3.75V17.5C20 18.163 19.7366 18.7989 19.2678 19.2678C18.7989 19.7366 18.163 20 17.5 20H2.5C1.83696 20 1.20107 19.7366 0.732233 19.2678C0.263392 18.7989 0 18.163 0 17.5V3.75C0 3.08696 0.263392 2.45107 0.732233 1.98223C1.20107 1.51339 1.83696 1.25 2.5 1.25H3.75V0.625C3.75 0.45924 3.81585 0.300269 3.93306 0.183058C4.05027 0.065848 4.20924 0 4.375 0V0ZM1.25 5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H17.5C17.8315 18.75 18.1495 18.6183 18.3839 18.3839C18.6183 18.1495 18.75 17.8315 18.75 17.5V5H1.25Z" fill="#61656F"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.8 KiB

27
frontend/assets/images/icons/widgets/chart.jsx Normal file
View file

@ -0,0 +1,27 @@
import React from 'react';
const Chart = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M34.3224 2.69424C34.9975 2.01676 36.0151 1.81372 36.8986 2.1801L43.5954 4.95701C44.7949 5.4544 45.3675 6.82726 44.8768 8.02956L42.1445 14.7248C41.7835 15.6094 40.9248 16.1891 39.9693 16.1934C39.014 16.1977 38.1503 15.6256 37.7815 14.7442L36.7003 12.1611L9.51308 23.7811C8.31427 24.2935 6.92706 23.737 6.41468 22.5382C5.9023 21.3394 6.45875 19.9522 7.65759 19.4398L34.8773 7.80587L33.8168 5.27207C33.4475 4.38971 33.6472 3.37172 34.3224 2.69424Z"
fill="#3E63DD"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M42.9868 19.2466C43.8216 19.2466 44.6223 19.5782 45.2124 20.1685C45.8026 20.7587 46.1343 21.5593 46.1343 22.394V44.4263C46.1343 45.2953 45.4296 46 44.5606 46H36.6919C35.8229 46 35.1182 45.2953 35.1182 44.4263V22.394C35.1182 21.5593 35.4499 20.7587 36.0401 20.1685C36.6302 19.5782 37.4309 19.2466 38.2656 19.2466H42.9868ZM27.2495 23.9678C28.0843 23.9678 28.8849 24.2994 29.4751 24.8897C30.0654 25.4799 30.397 26.2805 30.397 27.1152V44.4263C30.397 45.2953 29.6924 46 28.8233 46H20.9546C20.0855 46 19.3809 45.2953 19.3809 44.4263V27.1152C19.3809 26.2805 19.7125 25.4799 20.3027 24.8897C20.893 24.2994 21.6936 23.9678 22.5283 23.9678H27.2495ZM13.7378 29.6109C13.1475 29.0206 12.347 28.689 11.5122 28.689H6.79102C5.95626 28.689 5.15569 29.0206 4.56542 29.6109C3.97516 30.2011 3.64355 31.0017 3.64355 31.8364V44.4263C3.64355 45.2953 4.34814 46 5.21729 46H13.0859C13.9551 46 14.6597 45.2953 14.6597 44.4263V31.8364C14.6597 31.0017 14.3281 30.2011 13.7378 29.6109Z"
fill={fill}
/>
</svg>
);
export default Chart;

3
frontend/assets/images/icons/widgets/chart.svg
View file

@ -1,3 +0,0 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M17.3438 15.4688H3.90625V3.28125C3.90625 3.19531 3.83594 3.125 3.75 3.125H2.65625C2.57031 3.125 2.5 3.19531 2.5 3.28125V16.7188C2.5 16.8047 2.57031 16.875 2.65625 16.875H17.3438C17.4297 16.875 17.5 16.8047 17.5 16.7188V15.625C17.5 15.5391 17.4297 15.4688 17.3438 15.4688ZM5.3125 14.2188H15.7812C15.8672 14.2188 15.9375 14.1484 15.9375 14.0625V5.54688C15.9375 5.40625 15.7676 5.33789 15.6699 5.43555L11.5625 9.54297L9.11328 7.12109C9.08391 7.09202 9.04426 7.0757 9.00293 7.0757C8.9616 7.0757 8.92194 7.09202 8.89258 7.12109L5.20117 10.8242C5.18683 10.8386 5.17548 10.8556 5.16777 10.8744C5.16006 10.8932 5.15615 10.9133 5.15625 10.9336V14.0625C5.15625 14.1484 5.22656 14.2188 5.3125 14.2188Z" fill="#61656F"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 821 B

25
frontend/assets/images/icons/widgets/checkbox.jsx Normal file
View file

@ -0,0 +1,25 @@
import React from 'react';
const Checkbox = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
d="M35.8887 2H13.8887C7.81354 2 2.88867 6.92487 2.88867 13V35C2.88867 41.0751 7.81354 46 13.8887 46H35.8887C41.9638 46 46.8887 41.0751 46.8887 35V13C46.8887 6.92487 41.9638 2 35.8887 2Z"
fill={fill}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M35.307 12.8753C36.2442 13.4221 36.5604 14.625 36.0135 15.5619L25.9264 32.8453C25.6711 33.2836 25.3237 33.6634 24.9092 33.956C24.4979 34.2461 24.0295 34.4453 23.5352 34.5399C23.0334 34.6392 22.5158 34.6264 22.0195 34.5022C21.5243 34.3784 21.0625 34.1471 20.6671 33.8243L14.2329 28.677C13.3858 27.9994 13.2484 26.7632 13.9261 25.9161C14.6038 25.069 15.8399 24.9317 16.687 25.6094L22.7636 30.4706L32.6205 13.5817C33.1674 12.6447 34.3701 12.3285 35.307 12.8753Z"
fill="#3E63DD"
/>
</svg>
);
export default Checkbox;

4
frontend/assets/images/icons/widgets/checkbox.svg
View file

@ -1,4 +0,0 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.3333 0H1.66667C1.22464 0 0.800716 0.175595 0.488155 0.488155C0.175595 0.800716 0 1.22464 0 1.66667V18.3333C0 18.7754 0.175595 19.1993 0.488155 19.5118C0.800716 19.8244 1.22464 20 1.66667 20H18.3333C18.7754 20 19.1993 19.8244 19.5118 19.5118C19.8244 19.1993 20 18.7754 20 18.3333V1.66667C20 1.22464 19.8244 0.800716 19.5118 0.488155C19.1993 0.175595 18.7754 0 18.3333 0ZM1.66667 18.3333V1.66667H18.3333V18.3333H1.66667Z" fill="#61656F"/>
<path d="M8.33333 14.5833L4.16667 10.45L5.49167 9.16667L8.33333 11.9583L14.5083 5.83333L15.8333 7.15L8.33333 14.5833Z" fill="#61656F"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 689 B

39
frontend/assets/images/icons/widgets/circularprogressbar.jsx Normal file
View file

@ -0,0 +1,39 @@
import React from 'react';
const Circularprogressbar = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M30.7557 42.9109C30.9849 44.185 30.1415 45.4134 28.8582 45.6517C27.5749 45.8809 26.2457 46 24.889 46C23.5324 46 22.5332 44.9459 22.5332 43.6442C22.5332 42.3425 23.5874 41.2883 24.889 41.2883C25.9615 41.2883 27.0065 41.1967 28.0149 41.0133C29.2982 40.775 30.5174 41.6275 30.7557 42.9109Z"
fill="#3E63DD"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M43.0022 36.5034C41.4805 38.6942 39.583 40.5917 37.3922 42.1134C36.3197 42.8467 34.853 42.5809 34.1105 41.5084C33.3772 40.445 33.643 38.9692 34.7155 38.2359C36.4388 37.0442 37.933 35.55 39.1247 33.8267C39.858 32.7542 41.3338 32.4884 42.3972 33.2217C43.4697 33.9642 43.7355 35.4309 43.0022 36.5034Z"
fill="#3E63DD"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M17.6287 42.4159C17.0054 43.5617 15.5754 43.9834 14.4295 43.36C7.56368 39.6475 2.88867 32.3692 2.88867 24C2.88867 11.8542 12.7428 2 24.8887 2C33.2212 2 40.4629 6.62917 44.1937 13.44C44.8262 14.5858 44.4045 16.0158 43.2587 16.6392C42.122 17.2717 40.692 16.85 40.0595 15.7133C37.1262 10.3417 31.4337 6.72084 24.8887 6.72084C15.3462 6.72084 7.60951 14.4575 7.60951 24C7.60951 30.5725 11.267 36.2925 16.6754 39.2167C17.8212 39.84 18.252 41.27 17.6287 42.4159Z"
fill={fill}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M46.8889 23.9999C46.8889 25.3566 46.7698 26.6858 46.5406 27.9691C46.3023 29.2524 45.0739 30.0958 43.7998 29.8666C42.5164 29.6283 41.6639 28.4091 41.9023 27.1258C42.0856 26.1174 42.1773 25.0724 42.1773 23.9999C42.1773 22.6983 43.2314 21.6441 44.5331 21.6441C45.8348 21.6441 46.8889 22.6983 46.8889 23.9999Z"
fill="#3E63DD"
/>
</svg>
);
export default Circularprogressbar;

3
frontend/assets/images/icons/widgets/circularprogressbar.svg
View file

@ -1,3 +0,0 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z" stroke="#61656F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 310 B

31
frontend/assets/images/icons/widgets/codeeditor.jsx Normal file
View file

@ -0,0 +1,31 @@
import React from 'react';
const Codeeditor = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M8.28103 2C5.30291 2 2.88867 4.41424 2.88867 7.39235V40.6074C2.88867 43.5858 5.30291 46 8.28103 46H41.4963C44.4743 46 46.8885 43.5858 46.8885 40.6074V7.39235C46.8885 4.41424 44.4743 2 41.4963 2H8.28103Z"
fill={fill}
/>
<path
d="M8.28103 2C5.30291 2 2.88867 4.41424 2.88867 7.39235V12.9268H46.8885V7.39235C46.8885 4.41424 44.4743 2 41.4963 2H8.28103Z"
fill="#3E63DD"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M17.1446 22.6951C16.2577 21.7303 14.7567 21.6672 13.7919 22.5541C12.8271 23.4409 12.764 24.942 13.6508 25.9067L16.9203 29.4633L13.6508 33.0198C12.764 33.9845 12.8271 35.4857 13.7919 36.3725C14.7567 37.2593 16.2577 37.1963 17.1446 36.2314L21.8901 31.0691C22.7247 30.1612 22.7247 28.7654 21.8901 27.8575L17.1446 22.6951ZM29.6344 27.0904C28.324 27.0904 27.2616 28.1527 27.2616 29.4632C27.2616 30.7736 28.324 31.836 29.6344 31.836H35.9618C37.2723 31.836 38.3346 30.7736 38.3346 29.4632C38.3346 28.1527 37.2723 27.0904 35.9618 27.0904H29.6344Z"
fill="#3E63DD"
/>
</svg>
);
export default Codeeditor;

5
frontend/assets/images/icons/widgets/codeeditor.svg
View file

@ -1,5 +0,0 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.83333 6.66675L2.5 10.0001L5.83333 13.3334" stroke="#61656F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.1667 6.66675L17.5001 10.0001L14.1667 13.3334" stroke="#61656F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M11.6667 3.33337L8.33337 16.6667" stroke="#61656F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 509 B

25
frontend/assets/images/icons/widgets/colorpicker.jsx Normal file
View file

@ -0,0 +1,25 @@
import React from 'react';
const Colorpicker = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path
fill={fill}
d="M3.923 37.848l3.943-3.942c-2.177-4.1-1.398-9.283 1.886-12.562l9.311-9.31 17.793 17.792-9.312 9.31c-3.279 3.285-8.462 4.063-12.56 1.886l-3.944 3.943a3.56 3.56 0 01-5.017 0l-2.1-2.1a3.558 3.558 0 010-5.017z"
></path>
<path
fill="#3E63DD"
fillRule="evenodd"
d="M24.628 5.802C29.656.734 38.06.732 43.09 5.8c5.066 5.03 5.065 13.434-.004 18.462l-2.559 2.559 3.355 3.355a2.36 2.36 0 01-3.337 3.336L15.377 8.344a2.36 2.36 0 013.337-3.337l3.355 3.355 2.559-2.56z"
clipRule="evenodd"
></path>
</svg>
);
export default Colorpicker;

7
frontend/assets/images/icons/widgets/colorpicker.svg
View file

@ -1,7 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-palette" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M12 21a9 9 0 1 1 0 -18a9 8 0 0 1 9 8a4.5 4 0 0 1 -4.5 4h-2.5a2 2 0 0 0 -1 3.75a1.3 1.3 0 0 1 -1 2.25"></path>
<circle cx="7.5" cy="10.5" r=".5" fill="currentColor"></circle>
<circle cx="12" cy="7.5" r=".5" fill="currentColor"></circle>
<circle cx="16.5" cy="10.5" r=".5" fill="currentColor"></circle>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 617 B

22
frontend/assets/images/icons/widgets/container.jsx Normal file
View file

@ -0,0 +1,22 @@
import React from 'react';
const Container = ({ fill = '#D7DBDF', width = 24, className = '', viewBox = '0 0 49 48' }) => (
<svg
width={width}
height={width}
viewBox={viewBox}
fill="none"
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<path fill={fill} d="M41.389 7.5h-33v33h33v-33z"></path>
<path
fill="#3E63DD"
fillRule="evenodd"
d="M9.174 14.571A6.286 6.286 0 109.174 2a6.286 6.286 0 000 12.571zm31.429 0a6.286 6.286 0 100-12.57 6.286 6.286 0 000 12.57zM15.46 39.714a6.286 6.286 0 11-12.571 0 6.286 6.286 0 0112.571 0zM40.603 46a6.286 6.286 0 100-12.571 6.286 6.286 0 000 12.571zM16.639 16.929c0-1.085.88-1.965 1.964-1.965h12.571a1.964 1.964 0 110 3.929H18.603a1.964 1.964 0 01-1.964-1.964zm0 7.071c0-1.085.88-1.964 1.964-1.964h12.571a1.964 1.964 0 010 3.928H18.603A1.964 1.964 0 0116.639 24zm1.964 5.107a1.964 1.964 0 100 3.929h12.571a1.964 1.964 0 000-3.929H18.603z"
clipRule="evenodd"
></path>
</svg>
);
export default Container;

Some files were not shown because too many files have changed in this diff Show more