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

chore: Add data property in entity explorer as part of "show bindings" (#12590)

Browse Source 
* include JSAction data in show-bindings
This commit is contained in:
Favour Ohanekwu 2022-04-07 13:37:03 -07:00 committed by GitHub
parent 7807d5f5c6
commit dcddf4cb86
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 75 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
app/client/cypress/support/Pages/JSEditor.ts
View File

@ -1,7 +1,6 @@
import { ObjectsRegistry } from "../Objects/Registry" import { ObjectsRegistry } from "../Objects/Registry";
export class JSEditor { export class JSEditor {
public agHelper = ObjectsRegistry.AggregateHelper;
public agHelper = ObjectsRegistry.AggregateHelper
public locator = ObjectsRegistry.CommonLocators; public locator = ObjectsRegistry.CommonLocators;
public ee = ObjectsRegistry.EntityExplorer; public ee = ObjectsRegistry.EntityExplorer;
@ -16,6 +15,7 @@ export class JSEditor {
_dialog = (dialogHeader: string) => "//div[contains(@class, 'bp3-dialog')]//h4[contains(text(), '" + dialogHeader + "')]" _dialog = (dialogHeader: string) => "//div[contains(@class, 'bp3-dialog')]//h4[contains(text(), '" + dialogHeader + "')]"
private _closeSettings = "span[icon='small-cross']" private _closeSettings = "span[icon='small-cross']"
public NavigateToJSEditor() { public NavigateToJSEditor() {
cy.get(this.locator._createNew) cy.get(this.locator._createNew)
.last() .last()
@ -24,24 +24,33 @@ export class JSEditor {
//cy.waitUntil(() => cy.get(this.locator._toastMsg).should('not.be.visible')) // fails sometimes //cy.waitUntil(() => cy.get(this.locator._toastMsg).should('not.be.visible')) // fails sometimes
//this.agHelper.WaitUntilEleDisappear(this.locator._toastMsg, 'created successfully') //this.agHelper.WaitUntilEleDisappear(this.locator._toastMsg, 'created successfully')
this.agHelper.Sleep() this.agHelper.Sleep();
} }
public CreateJSObject(JSCode: string, paste = true, completeReplace = false, toRun = true) { public CreateJSObject(
JSCode: string,
paste = true,
completeReplace = false,
toRun = true,
) {
this.NavigateToJSEditor(); this.NavigateToJSEditor();
if (!completeReplace) { if (!completeReplace) {
cy.get(this.locator._codeMirrorTextArea) cy.get(this.locator._codeMirrorTextArea)
.first() .first()
.focus() .focus()
.type("{downarrow}{downarrow}{downarrow}{downarrow} ") .type("{downarrow}{downarrow}{downarrow}{downarrow} ");
} } else {
else {
cy.get(this.locator._codeMirrorTextArea) cy.get(this.locator._codeMirrorTextArea)
.first() .first()
.focus() .focus()
.type("{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}") .type(
.type("{shift}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}", { force: true }) "{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}",
)
.type(
"{shift}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}{uparrow}",
{ force: true },
)
.type("{backspace}", { force: true }); .type("{backspace}", { force: true });
// .type("{uparrow}", { force: true }) // .type("{uparrow}", { force: true })
@ -53,7 +62,6 @@ export class JSEditor {
// .type("{ctrl}{shift}{downarrow}", { force: true }) // .type("{ctrl}{shift}{downarrow}", { force: true })
// .type("{backspace}",{ force: true }); // .type("{backspace}",{ force: true });
//.type("{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow} ") //.type("{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow}{downarrow} ")
} }
cy.get(this.locator._codeMirrorTextArea) cy.get(this.locator._codeMirrorTextArea)
@ -62,15 +70,16 @@ export class JSEditor {
const input = cy.get(el); const input = cy.get(el);
if (paste) { if (paste) {
//input.invoke("val", value); //input.invoke("val", value);
this.agHelper.Paste(el, JSCode) this.agHelper.Paste(el, JSCode);
} else { } else {
input.type(JSCode, { input.type(JSCode, {
parseSpecialCharSequences: false, delay: 150 parseSpecialCharSequences: false,
delay: 150,
}); });
} }
}); });
this.agHelper.AssertAutoSave()//Ample wait due to open bug # 10284 this.agHelper.AssertAutoSave(); //Ample wait due to open bug # 10284
//this.agHelper.Sleep(5000)//Ample wait due to open bug # 10284 //this.agHelper.Sleep(5000)//Ample wait due to open bug # 10284
if (toRun) { if (toRun) {
@ -79,22 +88,31 @@ export class JSEditor {
cy.xpath(this._runButton) cy.xpath(this._runButton)
.first() .first()
.click() .click()
.wait(3000) .wait(3000);
}) });
cy.get(this.locator._empty).should('not.exist') cy.get(this.locator._empty).should("not.exist");
cy.get(this.locator._toastMsg).should("have.length", 0) cy.get(this.locator._toastMsg).should("have.length", 0);
} }
this.GetJSObjectName() this.GetJSObjectName();
} }
//Not working - To improve! //Not working - To improve!
public EditJSObj(existingTxt: string, newTxt: string) { public EditJSObj(existingTxt: string, newTxt: string) {
cy.get(this.locator._codeEditorTarget).contains(existingTxt).dblclick()//.type("{backspace}").type(newTxt) cy.get(this.locator._codeEditorTarget)
cy.get('body').type("{backspace}").type(newTxt) .contains(existingTxt)
this.agHelper.AssertAutoSave()//Ample wait due to open bug # 10284 .dblclick(); //.type("{backspace}").type(newTxt)
cy.get("body")
.type("{backspace}")
.type(newTxt);
this.agHelper.AssertAutoSave(); //Ample wait due to open bug # 10284
} }
public EnterJSContext(endp: string, value: string, paste = true, toToggleOnJS = false) { public EnterJSContext(
endp: string,
value: string,
paste = true,
toToggleOnJS = false,
) {
if (toToggleOnJS) { if (toToggleOnJS) {
cy.get(this.locator._jsToggle(endp.replace(/ +/g, "").toLowerCase())) cy.get(this.locator._jsToggle(endp.replace(/ +/g, "").toLowerCase()))
.invoke("attr", "class") .invoke("attr", "class")
@ -106,7 +124,6 @@ export class JSEditor {
} }
}); });
} }
// cy.get(this.locator._propertyControl + endp + " " + this.locator._codeMirrorTextArea) // cy.get(this.locator._propertyControl + endp + " " + this.locator._codeMirrorTextArea)
// .first() // .first()
// .focus() // .focus()
@ -162,6 +179,7 @@ export class JSEditor {
// }); // });
this.agHelper.AssertAutoSave()//Allowing time for Evaluate value to capture value this.agHelper.AssertAutoSave()//Allowing time for Evaluate value to capture value
} }
public RenameJSObjFromForm(renameVal: string) { public RenameJSObjFromForm(renameVal: string) {
@ -184,14 +202,16 @@ export class JSEditor {
} }
public GetJSObjectName() { public GetJSObjectName() {
cy.get(this._jsObjName).invoke("text").then((text) => cy.wrap(text).as("jsObjName") cy.get(this._jsObjName)
); .invoke("text")
.then((text) => cy.wrap(text).as("jsObjName"));
} }
public validateDefaultJSObjProperties(jsObjName: string) { public validateDefaultJSObjProperties(jsObjName: string) {
this.ee.ActionContextMenuByEntityName(jsObjName, "Show Bindings"); this.ee.ActionContextMenuByEntityName(jsObjName, "Show Bindings");
cy.get(this._propertyList).then(function ($lis) { cy.get(this._propertyList).then(function($lis) {
expect($lis).to.have.length(4); const bindingsLength = $lis.length;
expect(bindingsLength).to.be.at.least(4);
expect($lis.eq(0).text()).to.be.oneOf([ expect($lis.eq(0).text()).to.be.oneOf([
"{{" + jsObjName + ".myFun2()}}", "{{" + jsObjName + ".myFun2()}}",
"{{" + jsObjName + ".myFun1()}}", "{{" + jsObjName + ".myFun1()}}",
@ -199,13 +219,20 @@ export class JSEditor {
expect($lis.eq(1).text()).to.be.oneOf([ expect($lis.eq(1).text()).to.be.oneOf([
"{{" + jsObjName + ".myFun2()}}", "{{" + jsObjName + ".myFun2()}}",
"{{" + jsObjName + ".myFun1()}}", "{{" + jsObjName + ".myFun1()}}",
"{{" + jsObjName + ".myFun2.data}}",
"{{" + jsObjName + ".myFun1.data}}",
]); ]);
expect($lis.eq(2).text()).to.contain("{{" + jsObjName + ".myVar1}}"); expect($lis.eq(bindingsLength - 2).text()).to.contain(
expect($lis.eq(3).text()).to.contain("{{" + jsObjName + ".myVar2}}"); "{{" + jsObjName + ".myVar1}}",
);
expect($lis.eq(bindingsLength - 1).text()).to.contain(
"{{" + jsObjName + ".myVar2}}",
);
}); });
cy.get(this._bindingsClose).click({ force: true }); cy.get(this._bindingsClose).click({ force: true });
} }
public EnableOnPageLoad(funName: string, onLoad = true, bfrCalling = true) { public EnableOnPageLoad(funName: string, onLoad = true, bfrCalling = true) {
this.agHelper.XpathNClick(this._responseTabAction(funName)) this.agHelper.XpathNClick(this._responseTabAction(funName))
@ -217,4 +244,5 @@ export class JSEditor {
this.agHelper.GetNClick(this._closeSettings) this.agHelper.GetNClick(this._closeSettings)
} }
} }

8
app/client/src/pages/Editor/Explorer/Entity/EntityProperties.tsx
View File

@ -14,10 +14,10 @@ import { getPropsForJSActionEntity } from "utils/autocomplete/EntityDefinitions"
import { isEmpty } from "lodash"; import { isEmpty } from "lodash";
import { getCurrentPageId } from "selectors/editorSelectors"; import { getCurrentPageId } from "selectors/editorSelectors";
import classNames from "classnames"; import classNames from "classnames";
import { JSCollection } from "entities/JSCollection";
import styled from "styled-components"; import styled from "styled-components";
import { ControlIcons } from "icons/ControlIcons"; import { ControlIcons } from "icons/ControlIcons";
import { ReduxActionTypes } from "constants/ReduxActionConstants"; import { ReduxActionTypes } from "constants/ReduxActionConstants";
import { JSCollectionData } from "reducers/entityReducers/jsActionsReducer";
const CloseIcon = ControlIcons.CLOSE_CONTROL; const CloseIcon = ControlIcons.CLOSE_CONTROL;
@ -122,15 +122,15 @@ export function EntityProperties() {
if (!entity) return null; if (!entity) return null;
switch (entityType) { switch (entityType) {
case ENTITY_TYPE.JSACTION: case ENTITY_TYPE.JSACTION:
const jsAction = entity.config as JSCollection; const jsCollection = entity as JSCollectionData;
const properties = getPropsForJSActionEntity(jsAction); const properties = getPropsForJSActionEntity(jsCollection);
if (properties) { if (properties) {
entityProperties = Object.keys(properties).map( entityProperties = Object.keys(properties).map(
(actionProperty: string) => { (actionProperty: string) => {
const value = properties[actionProperty]; const value = properties[actionProperty];
return { return {
propertyName: actionProperty, propertyName: actionProperty,
entityName: jsAction.name, entityName: jsCollection.config.name,
value: value, value: value,
}; };
}, },

22
app/client/src/utils/autocomplete/EntityDefinitions.ts
View File

@ -4,8 +4,8 @@ import {
DataTreeAppsmith, DataTreeAppsmith,
} from "entities/DataTree/dataTreeFactory"; } from "entities/DataTree/dataTreeFactory";
import _ from "lodash"; import _ from "lodash";
import { JSCollection } from "entities/JSCollection";
import { EVALUATION_PATH } from "utils/DynamicBindingUtils"; import { EVALUATION_PATH } from "utils/DynamicBindingUtils";
import { JSCollectionData } from "reducers/entityReducers/jsActionsReducer";
const isVisible = { const isVisible = {
"!type": "bool", "!type": "bool",
@ -669,17 +669,21 @@ export const GLOBAL_FUNCTIONS = {
}, },
}; };
export const getPropsForJSActionEntity = ( export const getPropsForJSActionEntity = ({
entity: JSCollection, config,
): Record<string, string> => { data,
const properties: Record<string, string> = {}; }: JSCollectionData): Record<string, string> => {
const actions = entity.actions; const properties: Record<string, any> = {};
const actions = config.actions;
if (actions && actions.length > 0) if (actions && actions.length > 0)
for (let i = 0; i < entity.actions.length; i++) { for (let i = 0; i < config.actions.length; i++) {
const action = entity.actions[i]; const action = config.actions[i];
properties[action.name + "()"] = "Function"; properties[action.name + "()"] = "Function";
if (data && action.id in data) {
properties[action.name + ".data"] = data[action.id];
}
} }
const variablesProps = entity.variables; const variablesProps = config.variables;
if (variablesProps && variablesProps.length > 0) { if (variablesProps && variablesProps.length > 0) {
for (let i = 0; i < variablesProps.length; i++) { for (let i = 0; i < variablesProps.length; i++) {
const variableProp = variablesProps[i]; const variableProp = variablesProps[i];