Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity
6d7ebf81b1
PromucFlow_constructor/app/client/src/utils/migrations/TableWidget.test.ts
ashit-rath 6d7ebf81b1
fix: New table widget migration to sanitize primaryColumn, columnOrder and binding paths (#7037) 
* Table widget migration to sanitize keys and binding paths

* added new test case

* modified the logic to sanitize dynamicBindingPathList

* fix calling migrateTableSanitizeColumnKeys on child and fix updating dsl version
2021-09-13 17:33:39 +05:30

1493 lines
46 KiB
TypeScript
Raw Blame History

import { DSLWidget } from "widgets/constants";
import {
tableWidgetPropertyPaneMigrations,
migrateTableWidgetParentRowSpaceProperty,
migrateTableWidgetHeaderVisibilityProperties,
migrateTableSanitizeColumnKeys,
} from "./TableWidget";
const input1: DSLWidget = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table1",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 19,
bottomRow: 26,
parentId: "0",
widgetId: "fs785w9gcy",
dynamicBindingPathList: [],
renderMode: "CANVAS",
version: 1,
},
],
};
const input2: DSLWidget = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table2",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 28,
bottomRow: 35,
parentId: "0",
widgetId: "l9i1e8ybkm",
dynamicBindingPathList: [],
dynamicTriggerPathList: [{ key: "columnActions" }],
columnActions: [
{
label: "Test",
id: "ezooq966rd",
actionPayloads: [],
dynamicTrigger: "{{showAlert('test','success')}}",
},
{
label: "Fail",
id: "1k8nkay5r6",
actionPayloads: [],
dynamicTrigger: "{{showAlert('Fail','error')}}",
},
],
renderMode: "CANVAS",
version: 1,
},
],
};
const input3: DSLWidget = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table3",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 37,
bottomRow: 44,
parentId: "0",
widgetId: "8mkidz550s",
dynamicBindingPathList: [],
dynamicTriggerPathList: [
{ key: "onRowSelected" },
{ key: "onSearchTextChanged" },
],
onRowSelected: "{{showAlert('test','success')}}",
onSearchTextChanged: "{{showAlert('fail','error')}}",
renderMode: "CANVAS",
version: 1,
},
],
};
const output1 = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table1",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 19,
bottomRow: 26,
parentId: "0",
widgetId: "fs785w9gcy",
dynamicBindingPathList: [],
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "id",
computedValue: "",
},
email: {
index: 1,
width: 150,
id: "email",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "email",
computedValue: "",
},
userName: {
index: 2,
width: 150,
id: "userName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "userName",
computedValue: "",
},
productName: {
index: 3,
width: 150,
id: "productName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "productName",
computedValue: "",
},
orderAmount: {
index: 4,
width: 150,
id: "orderAmount",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "orderAmount",
computedValue: "",
},
},
textSize: "PARAGRAPH",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
renderMode: "CANVAS",
version: 1,
},
],
};
const output2 = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table2",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 28,
bottomRow: 35,
parentId: "0",
widgetId: "l9i1e8ybkm",
dynamicBindingPathList: [],
dynamicTriggerPathList: [
{ key: "columnActions" },
{ key: "primaryColumns.customColumn1.onClick" },
{ key: "primaryColumns.customColumn2.onClick" },
],
columnActions: [
{
label: "Test",
id: "ezooq966rd",
actionPayloads: [],
dynamicTrigger: "{{showAlert('test','success')}}",
},
{
label: "Fail",
id: "1k8nkay5r6",
actionPayloads: [],
dynamicTrigger: "{{showAlert('Fail','error')}}",
},
],
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "id",
computedValue: "",
},
email: {
index: 1,
width: 150,
id: "email",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "email",
computedValue: "",
},
userName: {
index: 2,
width: 150,
id: "userName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "userName",
computedValue: "",
},
productName: {
index: 3,
width: 150,
id: "productName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "productName",
computedValue: "",
},
orderAmount: {
index: 4,
width: 150,
id: "orderAmount",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "orderAmount",
computedValue: "",
},
customColumn1: {
index: 5,
width: 150,
id: "ezooq966rd",
label: "Test",
columnType: "button",
isVisible: true,
isDerived: true,
buttonLabel: "Test",
buttonStyle: "rgb(3, 179, 101)",
buttonLabelColor: "#FFFFFF",
onClick: "{{showAlert('test','success')}}",
},
customColumn2: {
index: 6,
width: 150,
id: "1k8nkay5r6",
label: "Fail",
columnType: "button",
isVisible: true,
isDerived: true,
buttonLabel: "Fail",
buttonStyle: "rgb(3, 179, 101)",
buttonLabelColor: "#FFFFFF",
onClick: "{{showAlert('Fail','error')}}",
},
},
textSize: "PARAGRAPH",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
renderMode: "CANVAS",
version: 1,
},
],
};
const output3 = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table3",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 37,
bottomRow: 44,
parentId: "0",
widgetId: "8mkidz550s",
dynamicBindingPathList: [],
dynamicTriggerPathList: [
{ key: "onRowSelected" },
{ key: "onSearchTextChanged" },
],
onRowSelected: "{{showAlert('test','success')}}",
onSearchTextChanged: "{{showAlert('fail','error')}}",
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "id",
computedValue: "",
},
email: {
index: 1,
width: 150,
id: "email",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "email",
computedValue: "",
},
userName: {
index: 2,
width: 150,
id: "userName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "userName",
computedValue: "",
},
productName: {
index: 3,
width: 150,
id: "productName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "productName",
computedValue: "",
},
orderAmount: {
index: 4,
width: 150,
id: "orderAmount",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "orderAmount",
computedValue: "",
},
},
textSize: "PARAGRAPH",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
renderMode: "CANVAS",
version: 1,
},
],
};
describe("Table Widget Property Pane Upgrade", () => {
it("To test primaryColumns are created for a simple table", () => {
const newDsl = tableWidgetPropertyPaneMigrations(input1);
expect(JSON.stringify(newDsl) === JSON.stringify(output1));
});
it("To test columnActions are migrated derived primaryColumns", () => {
const newDsl = tableWidgetPropertyPaneMigrations(input2);
expect(JSON.stringify(newDsl) === JSON.stringify(output2));
});
it("To test table action are migrated", () => {
const newDsl = tableWidgetPropertyPaneMigrations(input3);
expect(JSON.stringify(newDsl) === JSON.stringify(output3));
});
it("To test table parentRowSpace is updated", () => {
const inputDsl: DSLWidget = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table1",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 19,
bottomRow: 26,
parentId: "0",
widgetId: "fs785w9gcy",
dynamicBindingPathList: [],
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "id",
computedValue: "",
},
email: {
index: 1,
width: 150,
id: "email",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "email",
computedValue: "",
},
userName: {
index: 2,
width: 150,
id: "userName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "userName",
computedValue: "",
},
productName: {
index: 3,
width: 150,
id: "productName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "productName",
computedValue: "",
},
orderAmount: {
index: 4,
width: 150,
id: "orderAmount",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "orderAmount",
computedValue: "",
},
},
textSize: "PARAGRAPH",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
renderMode: "CANVAS",
version: 1,
},
],
};
const outputDsl: DSLWidget = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table1",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 10,
leftColumn: 0,
rightColumn: 8,
topRow: 19,
bottomRow: 26,
parentId: "0",
widgetId: "fs785w9gcy",
dynamicBindingPathList: [],
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "id",
computedValue: "",
},
email: {
index: 1,
width: 150,
id: "email",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "email",
computedValue: "",
},
userName: {
index: 2,
width: 150,
id: "userName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "userName",
computedValue: "",
},
productName: {
index: 3,
width: 150,
id: "productName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "productName",
computedValue: "",
},
orderAmount: {
index: 4,
width: 150,
id: "orderAmount",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "orderAmount",
computedValue: "",
},
},
textSize: "PARAGRAPH",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
renderMode: "CANVAS",
version: 1,
},
],
};
const newDsl = migrateTableWidgetParentRowSpaceProperty(inputDsl);
expect(JSON.stringify(newDsl) === JSON.stringify(outputDsl));
});
it("TableWidget : should update header options visibilities", () => {
const inputDsl: DSLWidget = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table1",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 40,
leftColumn: 0,
rightColumn: 8,
topRow: 19,
bottomRow: 26,
parentId: "0",
widgetId: "fs785w9gcy",
dynamicBindingPathList: [],
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "id",
computedValue: "",
},
email: {
index: 1,
width: 150,
id: "email",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "email",
computedValue: "",
},
userName: {
index: 2,
width: 150,
id: "userName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "userName",
computedValue: "",
},
productName: {
index: 3,
width: 150,
id: "productName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "productName",
computedValue: "",
},
orderAmount: {
index: 4,
width: 150,
id: "orderAmount",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "orderAmount",
computedValue: "",
},
},
textSize: "PARAGRAPH",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
renderMode: "CANVAS",
version: 1,
},
],
};
const outputDsl: DSLWidget = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1224,
snapColumns: 16,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 1840,
containerStyle: "none",
snapRows: 33,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 7,
minHeight: 1292,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
isLoading: false,
parentId: "",
renderMode: "CANVAS",
children: [
{
isVisible: true,
label: "Data",
widgetName: "Table1",
searchKey: "",
tableData:
'[\n {\n "id": 2381224,\n "email": "michael.lawson@reqres.in",\n "userName": "Michael Lawson",\n "productName": "Chicken Sandwich",\n "orderAmount": 4.99\n },\n {\n "id": 2736212,\n "email": "lindsay.ferguson@reqres.in",\n "userName": "Lindsay Ferguson",\n "productName": "Tuna Salad",\n "orderAmount": 9.99\n },\n {\n "id": 6788734,\n "email": "tobias.funke@reqres.in",\n "userName": "Tobias Funke",\n "productName": "Beef steak",\n "orderAmount": 19.99\n }\n]',
type: "TABLE_WIDGET",
isLoading: false,
parentColumnSpace: 74,
parentRowSpace: 10,
leftColumn: 0,
rightColumn: 8,
topRow: 19,
bottomRow: 26,
parentId: "0",
widgetId: "fs785w9gcy",
dynamicBindingPathList: [],
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "id",
computedValue: "",
},
email: {
index: 1,
width: 150,
id: "email",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "email",
computedValue: "",
},
userName: {
index: 2,
width: 150,
id: "userName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "userName",
computedValue: "",
},
productName: {
index: 3,
width: 150,
id: "productName",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "productName",
computedValue: "",
},
orderAmount: {
index: 4,
width: 150,
id: "orderAmount",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textColor: "#231F20",
textSize: "PARAGRAPH",
fontStyle: "REGULAR",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "orderAmount",
computedValue: "",
},
},
textSize: "PARAGRAPH",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
renderMode: "CANVAS",
isVisibleSearch: true,
isVisibleFilters: true,
isVisibleDownload: true,
isVisibleCompactMode: true,
isVisiblePagination: true,
version: 1,
},
],
};
const newDsl = migrateTableWidgetHeaderVisibilityProperties(inputDsl);
expect(JSON.stringify(newDsl) === JSON.stringify(outputDsl));
});
});
describe("Table Widget Migration - #migrateTableSanitizeColumnKeys", () => {
it("sanitizes primaryColumns, dynamicBindingPathList, columnOrder", () => {
const inputDsl = ({
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1080,
snapColumns: 64,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 980,
containerStyle: "none",
snapRows: 125,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 34,
minHeight: 860,
parentColumnSpace: 1,
dynamicTriggerPathList: [],
dynamicBindingPathList: [],
leftColumn: 0,
children: [
{
widgetName: "Table1",
defaultPageSize: 0,
columnOrder: ["id", "name", "'random_header", "Employee.id"],
isVisibleDownload: true,
dynamicPropertyPathList: [],
topRow: 8,
bottomRow: 53,
parentRowSpace: 10,
type: "TABLE_WIDGET",
parentColumnSpace: 14.62421875,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{ key: "tableData" },
{ key: "primaryColumns.id.computedValue" },
{ key: "primaryColumns.name.computedValue" },
{ key: "primaryColumns.'random_header.computedValue" },
{ key: "primaryColumns.Employee.id.computedValue" },
],
leftColumn: 1,
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDisabled: false,
isCellVisible: true,
isDerived: false,
label: "id",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow.id))}}",
},
name: {
index: 14,
width: 150,
id: "name",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDisabled: false,
isCellVisible: true,
isDerived: false,
label: "name",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow.name))}}",
},
"'random_header": {
index: 20,
width: 150,
id: "'random_header",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "'random_header",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow.'random_header))}}",
},
"Employee.id": {
index: 20,
width: 150,
id: "Employee.id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "Employee.id",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow.Employee.id))}}",
},
},
delimiter: ",",
derivedColumns: {},
rightColumn: 63,
textSize: "PARAGRAPH",
widgetId: "oclzovhzgx",
isVisibleFilters: true,
tableData: '{{users.data.concat({ "\'random header": 100})}}',
isVisible: true,
label: "Data",
searchKey: "",
version: 1,
parentId: "0",
totalRecordCount: 0,
isLoading: false,
isVisibleCompactMode: true,
horizontalAlignment: "LEFT",
isVisibleSearch: true,
isVisiblePagination: true,
verticalAlignment: "CENTER",
columnSizeMap: {
task: 245,
step: 62,
status: 75,
email: 261,
},
},
],
} as unknown) as DSLWidget;
const outputDsl = {
widgetName: "MainContainer",
backgroundColor: "none",
rightColumn: 1080,
snapColumns: 64,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 980,
containerStyle: "none",
snapRows: 125,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: 34,
minHeight: 860,
parentColumnSpace: 1,
dynamicTriggerPathList: [],
dynamicBindingPathList: [],
leftColumn: 0,
children: [
{
widgetName: "Table1",
defaultPageSize: 0,
columnOrder: ["id", "name", "_random_header", "Employee_id"],
isVisibleDownload: true,
dynamicPropertyPathList: [],
topRow: 8,
bottomRow: 53,
parentRowSpace: 10,
type: "TABLE_WIDGET",
parentColumnSpace: 14.62421875,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{ key: "tableData" },
{ key: "primaryColumns.id.computedValue" },
{ key: "primaryColumns.name.computedValue" },
{ key: "primaryColumns._random_header.computedValue" },
{ key: "primaryColumns.Employee_id.computedValue" },
],
leftColumn: 1,
primaryColumns: {
id: {
index: 0,
width: 150,
id: "id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDisabled: false,
isCellVisible: true,
isDerived: false,
label: "id",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow.id))}}",
},
name: {
index: 14,
width: 150,
id: "name",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDisabled: false,
isCellVisible: true,
isDerived: false,
label: "name",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow.name))}}",
},
_random_header: {
index: 20,
width: 150,
id: "_random_header",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "'random_header",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow._random_header))}}",
},
Employee_id: {
index: 20,
width: 150,
id: "Employee_id",
horizontalAlignment: "LEFT",
verticalAlignment: "CENTER",
columnType: "text",
textSize: "PARAGRAPH",
enableFilter: true,
enableSort: true,
isVisible: true,
isDerived: false,
label: "Employee.id",
computedValue:
"{{Table1.sanitizedTableData.map((currentRow) => ( currentRow.Employee_id))}}",
},
},
delimiter: ",",
derivedColumns: {},
rightColumn: 63,
textSize: "PARAGRAPH",
widgetId: "oclzovhzgx",
isVisibleFilters: true,
tableData: '{{users.data.concat({ "\'random header": 100})}}',
isVisible: true,
label: "Data",
searchKey: "",
version: 1,
parentId: "0",
totalRecordCount: 0,
isLoading: false,
isVisibleCompactMode: true,
horizontalAlignment: "LEFT",
isVisibleSearch: true,
isVisiblePagination: true,
verticalAlignment: "CENTER",
columnSizeMap: {
task: 245,
step: 62,
status: 75,
email: 261,
},
},
],
};
const newDsl = migrateTableSanitizeColumnKeys(inputDsl);
expect(newDsl).toStrictEqual(outputDsl);
});
});
Reference in New Issue View Git Blame Copy Permalink