PromucFlow_constructor/app/client/src/utils/DSLMigrationsUtils.test.ts
Rajat Agrawal fadf712833
fix: Add current index property to min max fields (#22556)
Fixes #20231 

- It is a new feature (non-breaking change which adds functionality)

This pull request adds support for currentIndex/currentRow properties
for editable columns in a table widget. This property has been
specifically added for min/max/regex/Error Message/Required properties
of a column.

This change has been made to achieve consistency in the implementation
and API of a table widget column for various properties that it has.

This pull request has a migration which has been unit tested by me.
Cypress tests for the feature have also been added.

## Test Plan
> https://github.com/appsmithorg/TestSmith/issues/2380

## Checklist:
### Dev activity
- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [x] I have commented my code, particularly in hard-to-understand areas
- [x] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


### QA activity:
- [x] Test plan has been approved by relevant developers
- [x] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test



Testing Plan - by developer

1. Make a column editable.
2. Check `currentIndex` and `currentRow` are available for checking
validations in min/max/errorMessage/regex/required fields.
3. Since this PR also involves a migration, please check existing values
in min/max/errorMessage/regex/required fields don't break after
migration. Existing values in validations can include validations values
of type string, boolean and other data type possible, like
`{currentIndex == 1}`
2023-05-05 19:25:10 +05:30

3221 lines
140 KiB
TypeScript

import { transformDSL } from "./DSLMigrations";
import { LATEST_PAGE_VERSION, RenderModes } from "constants/WidgetConstants";
import type { ContainerWidgetProps } from "widgets/ContainerWidget/widget";
import type { WidgetProps } from "widgets/BaseWidget";
import { OverflowTypes } from "widgets/TextWidget/constants";
import { migrateRadioGroupAlignmentProperty } from "./migrations/RadioGroupWidget";
import { ASSETS_CDN_URL } from "constants/ThirdPartyConstants";
describe("correctly migrate dsl", () => {
it("transformDSL for private widget", () => {
const currentVersion = 49; // before adding privateWidgets to all List widgets
const nextVersion = LATEST_PAGE_VERSION; // It runs Two Migrations, Always Update as migration increases
const currentDSL: ContainerWidgetProps<WidgetProps> = {
backgroundColor: "none",
bottomRow: 740,
canExtend: true,
children: [
{
widgetName: "Input1",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 18,
bottomRow: 22,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 15.0625,
dynamicTriggerPathList: [],
resetOnSubmit: true,
leftColumn: 23,
dynamicBindingPathList: [],
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "ftefjorusw",
isRequired: false,
rightColumn: 43,
widgetId: "lz9hvhcltl",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
},
{
widgetName: "Button1",
onClick:
'{{Api1.run(()=>{\ndownload((\nfunction(){\nreturn "data:image/jpeg;base64,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"\n}\n)(), "test.png", "image/png")\n})}}',
buttonColor: "#03B365",
dynamicPropertyPathList: [
{
key: "onClick",
},
],
displayName: "Button",
iconSVG: "/static/media/icon.cca02633.svg",
topRow: 29,
bottomRow: 33,
tooltip: "",
parentRowSpace: 10,
type: "BUTTON_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
dynamicTriggerPathList: [
{
key: "onClick",
},
],
leftColumn: 20,
dynamicBindingPathList: [],
text: "Submit",
isDisabled: false,
key: "pg01cxraj1",
rightColumn: 36,
isDefaultClickDisabled: true,
widgetId: "d229q1ydul",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
buttonVariant: "PRIMARY",
placement: "CENTER",
},
{
widgetName: "Input2",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 44,
bottomRow: 48,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
resetOnSubmit: true,
leftColumn: 9,
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "519sr07k1u",
isRequired: false,
rightColumn: 29,
widgetId: "eenq4c022d",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
},
{
version: 1,
template: {
Image1: {
isVisible: true,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
imageShape: "RECTANGLE",
maxZoomLevel: 1,
enableRotation: false,
enableDownload: false,
objectFit: "contain",
image: "{{List1.listData.map((currentItem) => currentItem.img)}}",
widgetName: "Image1",
version: 1,
animateLoading: true,
type: "IMAGE_WIDGET",
hideCard: false,
displayName: "Image",
key: "9cn4ooadxj",
iconSVG: "/static/media/icon.52d8fb96.svg",
dynamicBindingPathList: [
{
key: "image",
},
],
dynamicTriggerPathList: [],
widgetId: "yqofym38tn",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 0,
rightColumn: 16,
topRow: 0,
bottomRow: 8.4,
parentId: "vqn2okwc6a",
},
Text1: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.name)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text1",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "HEADING",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "zeqf6yfm3s",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 28,
topRow: 0,
bottomRow: 4,
parentId: "vqn2okwc6a",
},
Text2: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.id)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text2",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "BODY",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "8wyekp2o6e",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 24,
topRow: 4,
bottomRow: 8,
parentId: "vqn2okwc6a",
},
},
widgetName: "List1",
listData: [
{
id: "001",
name: "Blue",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "002",
name: "Green",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "003",
name: "Red",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
],
isCanvas: true,
displayName: "List",
iconSVG: "/static/media/icon.9925ee17.svg",
topRow: 34,
bottomRow: 74,
parentRowSpace: 10,
type: "LIST_WIDGET",
hideCard: false,
gridGap: 0,
animateLoading: true,
parentColumnSpace: 14.0625,
leftColumn: 39,
dynamicBindingPathList: [
{
key: "template.Image1.image",
},
{
key: "template.Text1.text",
},
{
key: "template.Text2.text",
},
],
gridType: "vertical",
enhancements: true,
children: [
{
widgetName: "Canvas1",
displayName: "Canvas",
topRow: 0,
bottomRow: 400,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: false,
hideCard: true,
dropDisabled: true,
openParentPropertyPane: true,
minHeight: 400,
noPad: true,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
boxShadow: "NONE",
widgetName: "Container1",
borderColor: "transparent",
disallowCopy: true,
isCanvas: true,
displayName: "Container",
iconSVG: "/static/media/icon.1977dca3.svg",
topRow: 0,
bottomRow: 12,
dragDisabled: true,
type: "CONTAINER_WIDGET",
hideCard: false,
openParentPropertyPane: true,
isDeletable: false,
animateLoading: true,
leftColumn: 0,
children: [
{
widgetName: "Canvas2",
detachFromLayout: true,
displayName: "Canvas",
widgetId: "vqn2okwc6a",
containerStyle: "none",
topRow: 0,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "9e77epyavg",
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "Image1",
displayName: "Image",
iconSVG: "/static/media/icon.52d8fb96.svg",
topRow: 0,
bottomRow: 8.4,
type: "IMAGE_WIDGET",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
imageShape: "RECTANGLE",
dynamicBindingPathList: [
{
key: "image",
},
],
leftColumn: 0,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
key: "9cn4ooadxj",
image: "{{currentItem.img}}",
rightColumn: 16,
objectFit: "contain",
widgetId: "yqofym38tn",
logBlackList: {
isVisible: true,
defaultImage: true,
imageShape: true,
maxZoomLevel: true,
enableRotation: true,
enableDownload: true,
objectFit: true,
image: true,
widgetName: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
maxZoomLevel: 1,
enableDownload: false,
enableRotation: false,
},
{
widgetName: "Text1",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 0,
bottomRow: 4,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
leftColumn: 16,
shouldTruncate: false,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.name}}",
key: "yd217bk315",
rightColumn: 28,
textAlign: "LEFT",
widgetId: "zeqf6yfm3s",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
shouldScroll: false,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
fontSize: "PARAGRAPH",
textStyle: "HEADING",
},
{
widgetName: "Text2",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 4,
bottomRow: 8,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
leftColumn: 16,
shouldTruncate: false,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.id}}",
dynamicHeight: "FIXED",
maxDynamicHeight: 9000,
minDynamicHeight: 4,
key: "yd217bk315",
rightColumn: 24,
textAlign: "LEFT",
widgetId: "8wyekp2o6e",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
shouldScroll: false,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
fontSize: "PARAGRAPH",
textStyle: "BODY",
},
],
key: "omhgz5cakp",
},
],
borderWidth: "0",
key: "ca3a42k2a4",
disablePropertyPane: true,
backgroundColor: "white",
rightColumn: 64,
widgetId: "9e77epyavg",
containerStyle: "card",
isVisible: true,
version: 1,
parentId: "q3ype57cdo",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0",
},
],
key: "omhgz5cakp",
rightColumn: 337.5,
detachFromLayout: true,
widgetId: "q3ype57cdo",
containerStyle: "none",
isVisible: true,
version: 1,
parentId: "iupz1d99ka",
renderMode: "CANVAS",
isLoading: false,
},
],
key: "axex98spx3",
backgroundColor: "transparent",
rightColumn: 63,
itemBackgroundColor: "#FFFFFF",
widgetId: "iupz1d99ka",
isVisible: true,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
},
],
containerStyle: "none",
detachFromLayout: true,
dynamicBindingPathList: [],
dynamicTriggerPathList: [],
leftColumn: 0,
minHeight: 640,
parentColumnSpace: 1,
parentRowSpace: 1,
rightColumn: 912,
snapColumns: 64,
snapRows: 125,
topRow: 0,
type: "CANVAS_WIDGET",
version: currentVersion,
widgetId: "0",
widgetName: "MainContainer",
renderMode: "CANVAS",
isLoading: false,
};
const expectedNextDSL: ContainerWidgetProps<WidgetProps> = {
backgroundColor: "none",
bottomRow: 740,
canExtend: true,
version: nextVersion,
children: [
{
widgetName: "Input1",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 18,
bottomRow: 22,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 15.0625,
dynamicTriggerPathList: [],
resetOnSubmit: true,
leftColumn: 23,
labelTextSize: "0.875rem",
dynamicBindingPathList: [
{
key: "accentColor",
},
],
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "ftefjorusw",
isRequired: false,
rightColumn: 43,
widgetId: "lz9hvhcltl",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
borderRadius: "0px",
boxShadow: "none",
accentColor: "{{appsmith.theme.colors.primaryColor}}",
},
{
widgetName: "Button1",
onClick:
'{{Api1.run(()=>{\ndownload((\nfunction(){\nreturn "data:image/jpeg;base64,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"\n}\n)(), "test.png", "image/png")\n})}}',
buttonColor: "#03B365",
dynamicPropertyPathList: [
{
key: "onClick",
},
],
displayName: "Button",
iconSVG: "/static/media/icon.cca02633.svg",
topRow: 29,
bottomRow: 33,
tooltip: "",
parentRowSpace: 10,
type: "BUTTON_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
dynamicTriggerPathList: [
{
key: "onClick",
},
],
leftColumn: 20,
dynamicBindingPathList: [],
text: "Submit",
isDisabled: false,
key: "pg01cxraj1",
labelTextSize: "0.875rem",
rightColumn: 36,
isDefaultClickDisabled: true,
widgetId: "d229q1ydul",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
buttonVariant: "PRIMARY",
placement: "CENTER",
borderRadius: "0px",
boxShadow: "none",
},
{
widgetName: "Input2",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 44,
bottomRow: 48,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
resetOnSubmit: true,
leftColumn: 9,
labelTextSize: "0.875rem",
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "519sr07k1u",
isRequired: false,
rightColumn: 29,
widgetId: "eenq4c022d",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
borderRadius: "0px",
boxShadow: "none",
accentColor: "{{appsmith.theme.colors.primaryColor}}",
dynamicBindingPathList: [
{
key: "accentColor",
},
],
},
{
widgetName: "List1",
template: {
Image1: {
isVisible: true,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
imageShape: "RECTANGLE",
maxZoomLevel: 1,
enableRotation: false,
enableDownload: false,
objectFit: "contain",
image: "{{List1.listData.map((currentItem) => currentItem.img)}}",
widgetName: "Image1",
version: 1,
animateLoading: true,
type: "IMAGE_WIDGET",
hideCard: false,
displayName: "Image",
key: "9cn4ooadxj",
iconSVG: "/static/media/icon.52d8fb96.svg",
dynamicBindingPathList: [
{
key: "image",
},
],
dynamicTriggerPathList: [],
widgetId: "yqofym38tn",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 0,
rightColumn: 16,
topRow: 0,
bottomRow: 8.4,
parentId: "vqn2okwc6a",
},
Text1: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.name)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text1",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "HEADING",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "zeqf6yfm3s",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 28,
topRow: 0,
bottomRow: 4,
parentId: "vqn2okwc6a",
},
Text2: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.id)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text2",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "BODY",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "8wyekp2o6e",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 24,
topRow: 4,
bottomRow: 8,
parentId: "vqn2okwc6a",
},
},
listData: [
{
id: "001",
name: "Blue",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "002",
name: "Green",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "003",
name: "Red",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
],
isCanvas: true,
displayName: "List",
iconSVG: "/static/media/icon.9925ee17.svg",
topRow: 34,
bottomRow: 74,
parentRowSpace: 10,
type: "LIST_WIDGET",
hideCard: false,
gridGap: 0,
animateLoading: true,
parentColumnSpace: 14.0625,
leftColumn: 39,
dynamicBindingPathList: [
{
key: "template.Image1.image",
},
{
key: "template.Text1.text",
},
{
key: "template.Text2.text",
},
{
key: "accentColor",
},
],
gridType: "vertical",
enhancements: true,
children: [
{
widgetName: "Canvas1",
displayName: "Canvas",
topRow: 0,
bottomRow: 400,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: false,
hideCard: true,
dropDisabled: true,
openParentPropertyPane: true,
minHeight: 400,
noPad: true,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
boxShadow: "none",
widgetName: "Container1",
borderColor: "transparent",
disallowCopy: true,
isCanvas: true,
displayName: "Container",
iconSVG: "/static/media/icon.1977dca3.svg",
dynamicPropertyPathList: [
{
key: "borderRadius",
},
],
topRow: 0,
bottomRow: 12,
dragDisabled: true,
type: "CONTAINER_WIDGET",
hideCard: false,
openParentPropertyPane: true,
isDeletable: false,
animateLoading: true,
leftColumn: 0,
dynamicHeight: "FIXED",
maxDynamicHeight: 9000,
minDynamicHeight: 4,
children: [
{
widgetName: "Canvas2",
detachFromLayout: true,
displayName: "Canvas",
widgetId: "vqn2okwc6a",
containerStyle: "none",
topRow: 0,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "9e77epyavg",
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "Image1",
displayName: "Image",
iconSVG: "/static/media/icon.52d8fb96.svg",
topRow: 0,
bottomRow: 8.4,
type: "IMAGE_WIDGET",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
imageShape: "RECTANGLE",
dynamicBindingPathList: [
{
key: "image",
},
],
leftColumn: 0,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
key: "9cn4ooadxj",
labelTextSize: "0.875rem",
image: "{{currentItem.img}}",
rightColumn: 16,
objectFit: "contain",
widgetId: "yqofym38tn",
logBlackList: {
isVisible: true,
defaultImage: true,
imageShape: true,
maxZoomLevel: true,
enableRotation: true,
enableDownload: true,
objectFit: true,
image: true,
widgetName: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
maxZoomLevel: 1,
enableDownload: false,
enableRotation: false,
borderRadius: "0px",
boxShadow: "none",
dynamicHeight: "FIXED",
},
{
widgetName: "Text1",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 0,
bottomRow: 4,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicHeight: "FIXED",
maxDynamicHeight: 9000,
minDynamicHeight: 4,
leftColumn: 16,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.name}}",
key: "yd217bk315",
labelTextSize: "0.875rem",
rightColumn: 28,
textAlign: "LEFT",
widgetId: "zeqf6yfm3s",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
overflow: OverflowTypes.NONE,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
fontSize: "0.875rem",
textStyle: "HEADING",
borderRadius: "0px",
boxShadow: "none",
},
{
widgetName: "Text2",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 4,
bottomRow: 8,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicHeight: "FIXED",
maxDynamicHeight: 9000,
minDynamicHeight: 4,
leftColumn: 16,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.id}}",
key: "yd217bk315",
labelTextSize: "0.875rem",
rightColumn: 24,
textAlign: "LEFT",
widgetId: "8wyekp2o6e",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
overflow: OverflowTypes.NONE,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
fontSize: "0.875rem",
textStyle: "BODY",
borderRadius: "0px",
boxShadow: "none",
},
],
key: "omhgz5cakp",
labelTextSize: "0.875rem",
borderRadius: "0px",
boxShadow: "none",
},
],
borderWidth: "0",
key: "ca3a42k2a4",
labelTextSize: "0.875rem",
disablePropertyPane: true,
backgroundColor: "white",
rightColumn: 64,
widgetId: "9e77epyavg",
containerStyle: "card",
isVisible: true,
version: 1,
parentId: "q3ype57cdo",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0px",
},
],
key: "omhgz5cakp",
labelTextSize: "0.875rem",
rightColumn: 337.5,
detachFromLayout: true,
widgetId: "q3ype57cdo",
containerStyle: "none",
isVisible: true,
version: 1,
parentId: "iupz1d99ka",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0px",
boxShadow: "none",
},
],
privateWidgets: {
Image1: true,
Text1: true,
Text2: true,
},
key: "axex98spx3",
labelTextSize: "0.875rem",
backgroundColor: "transparent",
rightColumn: 63,
itemBackgroundColor: "#FFFFFF",
widgetId: "iupz1d99ka",
isVisible: true,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
version: 1,
borderRadius: "0px",
boxShadow: "none",
accentColor: "{{appsmith.theme.colors.primaryColor}}",
},
],
containerStyle: "none",
detachFromLayout: true,
dynamicBindingPathList: [],
dynamicTriggerPathList: [],
leftColumn: 0,
minHeight: 640,
parentColumnSpace: 1,
parentRowSpace: 1,
rightColumn: 912,
snapColumns: 64,
snapRows: 125,
topRow: 0,
type: "CANVAS_WIDGET",
widgetId: "0",
widgetName: "MainContainer",
renderMode: RenderModes.CANVAS,
isLoading: false,
};
const actualNextDsl = transformDSL(currentDSL);
expect(actualNextDsl).toEqual(expectedNextDSL);
});
it("transformDSL for theming v1", () => {
const currentVersion = 53;
const nextVersion = LATEST_PAGE_VERSION;
const currentDSL: ContainerWidgetProps<WidgetProps> = {
backgroundColor: "none",
bottomRow: 740,
canExtend: true,
children: [
{
widgetName: "Input1",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 18,
bottomRow: 22,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 15.0625,
dynamicTriggerPathList: [],
resetOnSubmit: true,
leftColumn: 23,
dynamicBindingPathList: [],
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "ftefjorusw",
isRequired: false,
rightColumn: 43,
widgetId: "lz9hvhcltl",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
},
{
widgetName: "Button1",
onClick:
'{{Api1.run(()=>{\ndownload((\nfunction(){\nreturn "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxQUExYUFBQWFhYYGBgYGBYWFhgWFhgYFhYYGBYYGBgZHioiGR4nHhgWIzMjJystMDAwGCE2OzYvOiovMC0BCwsLDw4PGBERGC8eHh4vLS8vLy0vLS8tLy8tLy8vLy8vLy8vLy8vLy8vLy8vLS0vLy8vLS8vLS8vLy0vLS8vL//AABEIAMEBBQMBIgACEQEDEQH/xAAbAAACAwEBAQAAAAAAAAAAAAADBAACBQEGB//EAEcQAAICAQICBQYKBwYGAwAAAAECAAMRBCExQQUGElFhE3GBkdHwByIjMnOSobGywRQkQlJUcvEzU2KCk+FDY6KzwtIVFjT/xAAaAQEBAAMBAQAAAAAAAAAAAAABAAIEBQMG/8QAOREAAgECAgUJBQcFAAAAAAAAAAECAxEEQRIhMVFxBRMyYYGRsdHxI1KhwfAUIjNCcpKyBjRTguH/2gAMAwEAAhEDEQA/APkYEus4sJiBkQCXScSFQQZFwsIolqwIcJMRIghVGZwLCKICWUQi5la+MP2fvmIoGsvjf33hQvLE5jl/WQlexKEd2Yf1wTbSIXskWvaGde0TJUp3HKLBCxHn4y1PHeHK45en2SImTsD7+5kVihEIhzyhBueEsPNAQfku/wD2nbKcQ3OduQ4OPfeRCAlmrndwcn8vRCPvIAGBylHEPK2pMgF7RtANGLgRABc7yIC0G0PYsC8SBEQTCHIgXSQA8SToPm9MkiAJDIJRFh0mVwLpXLqsgha1mIl0WHVJxFh1gJFEv2d+EuiQ9dffMRQFE3xD9jeEFXhCVLg8JCD7Mqyc+Xn3hyn2SKnhAQTCVJPdGVUzlj44SIzwpzGEq2M4wycQ66fA3iwFmX0yVHfh64Ypz2h0r8PXARQqe6EVGh3U851QYgAqrORC30bZkAOYR2wPTARZVzynGq24Q/ZE5bjEiFvJeEC6RoD84NlOIhYStSBAjlyDIwc7Z4Y3xuIIrMgFbFgXTEZcGCdcyAUKyjLDkESjRIWKyS5E7IBcQglAJYCIBkEaSKrD0DeBkOIsNUspXtGFExIJWIwq+ECvH/eM1t4QMglHmlipzwna17hGBw74CDWDdiN8GMLXtBsTjHvwmNyApnl64K2neMVVnl77y/OZXIBXT4CNNRgcpCsOa1xvz/KTZCVaHfbxh0yeCy9anlCIDjOw8ZEK2qeYAgy7bYx7Y4zDEBZjYbf1kQFVJ39+U7aNsY/2hgNgNtsngM795xk8JLk229xIhUDffh9stgHuEs7YAzjj98pZZ5pEVZOUo1e0J2sn7fuBl2UY7ogZzjeBeNPx4wL98iFXJgWBjLcYG2KAXYGBeNMTiLOYgAMk605EhdYTM4ISJiWVuENVyglaEpaAjdbQ62RMWTotgI+j7xquzeZK2jMMl0LFc26bYXtnlwmJXqR3xyjWg93viFjK5reUOIsbMwbajaLfpAx7+MLFc0FYg7b/ANZV3JOTExqhjxljdnj4SsVx7te4hydth6fPEhYIWu4cM+yRDSvkDA4ZkdxmIW244Hvi9+pbOM7+ErEOW6jHLbw80G9g7+6ZrazvnH1XgJlZhdGp5c+jH5yxvGMEDfnvtMc6rxEYN+QPP+UNFjcZvbHOCFu35Stt+3KJPqPNJK4GgpPfKtd4xD9K7yIFtVHRZXGLH39Mp29ouLwZDbKzK4ex+EBk98gaQmQHX4ROxSYwzZg2ESFnWSWaSJAmXul+zOYlmBiBZRIDK4MjcIEWqcdoL3nHrj66Qd0zNEmbkHiT9VS35T0AaaOLnKMkk8jZoRTTvvE10y/uiMJpU5gQi1kkBQSeQAyT5gIevRW5/srP9NvZNSdZrbK3abKgt3wBU6JDxUTa60dEUU6dLa07D/FB7JOG7RwSwPE+MDXonH7D/Vb2R74QM/oi/wCT8QmqsRN4iiozdnLe/iZunHm53jk8gWi0Nb10sV+dWCdzue0wzx8BHR0Lp/7ses+2LdEPjT6cf8lfxPNHT2Ca1WvV05Wm+lLN+8xpQjoR1LZuRK+gNP8A3Y9Z9s7b0BQdux9p9s0KWHj6toSxsHBBE1ftVbStzkv3PzPTm4+6u5GBrOq22aWOf3W4HzNPOmwoSrqQw2IO2/5z6RWhMwOuvRQeprlHylY7Rx+0g+dnxA3/AMs6GA5UmpqnWd09V808rvNZa9m01a1CNnKKs0ePt1WJ7boPofT20V2PUpLKCSc53E+aWX5E+t9Ul/U9P41IfWoM2uW6kqdKGi2m3k7ZHnhVdyv1BK+rmkxvQnn39sYfq1o8jFCH63tjJXEpbqVXYsAfE4nzPPVm9VSXe/M3NCO4tV1S0THPkKwBy39s8h160enqosampUKvWARn9p8c+E9Q+uXHzx9YTyXXlw2kswQT26eB/wCZNvk+Vb7RT05ya0o6m5W2rvPKpBKEn1bjI6jU13WuLF7XYTtKG3Ha3AJHPHjPZ6LoTRtVk0VluZ3yftnjPg1X5a76L8zPT6LWhMqRxPGb3KjqPETUZNW0djayHCxhzaut/ix5+r+gdT2aVDDz+2ZnRHQWlJc2VoQOG0F0l0oyMccDC9H6lFrJYHtH1+qalq6pv78ne2bfzNtRp3tbwFOmNFpVHxKFG3ECeK6RtHkwwQL8oQMDGR2c+/nn0a/X12VBOx2SOZG5nhOtNJVK1x+2SPN2ceydLk2pLTjGV73zd8ma+KiubbXhwMuq3MMpitKRhVn0JyTpEpmWYwbLIgVmCZJwtJEgiCWaVRcmE7MgBNBuIYwTCQnei1zeg/nPqqc/lNmszG6Nfs3IT/jH1q3UfaRNlROdjL872LxZtYboviaXQh/WK/OfwNBdeumr63ArvsQdojCsRtgwWnZkYMpKsOBBwR5jNA32Pu7u38zE/fOa4xVaNSSUklaz9GbileDhe18/q3ieMHWjV/xVv1ob/wCavuUrZc1ijkxB3nttAoLpn95ePnEX+E1ALKiABntcv5Zt0cTReIhSVFJu+tW1W/1+aNepRmoSlzjdsn6sLo2PktP9Cv4njgBgujKs00fQr+J4+tG85VSSU5/ql/Jm1S6EeB5z4RsjSU7n555wHwU9IXNbbQWL1CvymGJbybB1UFcnbPaII54HdPTdM9Apq60rdnTsEnKhd8+eavVjq/VpEZKgfjEF3bBdscASANhvsNt5lLF0o4KVFq8m77NS13unvtu7dVzzqU5SrKaepJGrSMQWoqDK4PAo4PmKGOOm0x+tWtWjS2uT8ZlNdY73cY28wyfROPSi6k1GO2TS7z0lJRTbPjVeSoJ5ifaup/8A+LTfQVf9tZ8asTAn2jqef1LS/QU/9tZ9H/UPQpvrZp4P83Z8zRsM+U/Cv0hdVrKhXZYgOnQkIzAZ8tcMkDnsPVPrFm/CL6jHMAnxAM4GDrKjVjNx0rX1dluvwNqpBzVk7fXYfAq+nNV/EX/6r+2aS622xB5S135gO5IHmBM+vWKP3V9Qnk/hDAWinAA+WPAYz8nPocLyjSqVoQjQUW3tTW5v3Vu3mrVoyjBtzb+uLA/Bqvy130X5mbGvUYyBgjjMb4MW+Xu+i/Mzc1qzUx7tjZ8I+BsYd+yXb4syHGcg7908P1p6T1Caq1UuuVQVACWOFHya8ADie7uTEQ1b+J9c9sNOMZ3lFSVtj7Nex7iqRclZSa4eqPC0dM6r+J1H+tZ7Yeu53OXZ2Pe7Fj62M3b7m7z6zM3X2/2YPc2/fvOvh5w0vu01G+7v3I0qsHa7k3bf6sIghAIvWYfM2zwKwNmYaBdu+RA2klSJ2JBKxCkwVcIZAUaBcwrQLyEpph8qn809JXPP9H/2yec/hM9EiETnY7prh82bWG6L4+Q5pqu0QoG54cvtMd1OlNWPKGtM7Dt21rk9w7TRXo3JtQZxv+Rml8KWlGKvGw/hM5N3LEQpJ20r9eztRuaowctwpTqqwyk207EH+2r7/Bov8IGsquevyVtdnZ7Xa8m6uBsuM9knHAzzNekHdDCkDOxnUo8nKFaNXTvo3y39rNOeKcouNtp7noLAo04P9yPxPNErjhM7oofIUfRD8TTTqUmfPVvxJ/ql/Jm9S6EeCGNOMcY1Vd4xDXa1UeittvKKQh73BY9j0gHHiAOcKtXOaskntz87fIzuC6xdYhpavKGt3+MF+LjAJGxYngDwzvvtifO+kOmbdU4e0gAAhEX5qA8cd5O2TzwPAT6kNGtisjgMrAqVPAg8RPmXTnQzaS7yZyUbJrb95eYP+IbA+g852uRZYfTcWvaZN7s0tz35tdVzTxalZNbM+Jl3gmfX+qQ/U9N9DT+BZ8gcz671UP6npvoa/wACzP8AqBezp8X4GGE/N2fM03bEyOk+l6K27FtqI2O1hjgkEkAjPEZBHoM0XfPCfNPhN6D1N+prenT2WqKFUsikgMLbiRnvwR65xMFRhUqqNSWinnq1d+o2ak3CN0rnqz09pv4iv6wmB1219V1FQrsVyLSSFOTgpjPrnja+qGvHHR3fU/3mieir6UBtodBnGWXbzE8BPoMNgsLCrGcK6k09SvHc1xzNarWnKDTg13+SPSfBkmL7vofzm7q15zF+Ddvl7voT95mzqMYnP5Q/vZ8I+B74f8JdvizL1JHfMPW3ICVLoCOILKCPQTNHXNjltPHdO9XdVbe9lemtdG7JVghwR2FGx58JtYWFO/35qK3v1RVZNK6i3w9GPWYPBk+untifSSjFXAkB84IOMsMcIDT9Uddy0d2P5D7Z2zQXVYFtNteeHlK3TOO4sAD6J06Doaa0asZPcmr7H1s06k5NNOLXH0LoIVTKVmXm8eBYwTrzhczh4SIAxknTiSJHEM7mUUywkBINxCqJCkiLdBrnU1edvsRp6yx1NngBPN9D9hL63c4UFsnBOMow4DfnN63V0E5Fyj/Lb/6Tk8oRlKqmotrRyTeb3Jm9hZKMGm0teb6kaXRmj7Vi44529U1fhKpytf0h/CZkaDpmlHVvKjA44WzuI/djnWPpqrU9kVhsI2e0wx2tsbDj6wJzqFGu8ZSm4SUY3u2mrd9j2rVIKDSau+vgebq0gAgtRQN5qqggdRp1PCfSXObY3uh9P8jRv+x/5NNmqjHPMxtF0rTXVWhbdUwdm45J7vGXTrBQDntn6reyfJV8PiJVJ+zl0pflfvPqOrSnDQjeS2LMzfhNpP6NSwJBW0YI2I+eQQeRBm31V6U/SaA+3lB8W1eGHA+cB+6w+MO7ccpk9aukKtRQlaEsws7R+KQAADxJ78/ZM3q3adNaH37LYWwd69/nU7j0jnNyGBqVcDZxanFycU9V1mu22rrSy2+FSso1rp3Vkn9dR9ErUiD6b6EXVUGttjxRuavyP5Hwio6z6UcbD9VvZD09cNGP+IfqN7JxPs+LhJThSmmtaejLyPedSFmrp9x8a1tL1WPVavZdDhh4947wRgjzz7L1cq/UdJj+GoPrpUzynXqzR6vs21WYuXCn4jDyiE8M4xkZz65s9FdZdPTp6KWc9quilD8VsdpKlVvtBnX5SdfF0KMlSkpJy0loy1PVr2bH/wA2o1aCjCo9eqxudnAleXHHpmTZ1s0x4OfqN7IN+tGm/vD9UzlLB4j/ABS/a/I3dOHvLvRsWPtxPrnl+vAJ0rnP7dfP/FGf/sdGfn/9JiHTevpvoatW3LIdwR8055zcweFqwr024SSUk9j3mFacObkk1seYh8GYzqLR31gf9U9Jq2C5BHMj1GYfU+yrTags7dlXHZyRsCDn4xHAeMb6S6YoYt2XB+MSDgjme+bWPoVJYyTUG4tR1pO3eeeGnFU0r7PMU6RqJGTwmfqrrG7K9twBt85uHdxjOp6TrZcGweuZv6WmQe2uB4iZ0qU0tcdnU/I9ZSjk/ijpttq2WyzHg7D7jMjrJezInasdsMR8d2bGRvjtHbhNnUaqpjkWKPTMjpVEZAA4J7edjy7Jm3hYe1jJxs99up52PCvbQlZmXQ3njIMqmmA5wgq8Z2TnnR595wnxnQnjKlTzkQMkyThE7IgawglEAhVEgIsuonawIQVyEqE7pdasxmmuXrXeBFtNQOc1dMAOEWpXwjdbiYMyDKBJYnGWXfhDqgJ9UhEf0YESi6Md00vJ7yOm28gsKVacCFZPDf7BkQqpwhQNt5EZdul8OXtiv6LNll39EGtfhyjcDKq0e/v798O+kyOEdSowgp++A2MptHjaDbS7bDebj05OeG/v90lmn24d/wB0bhYxF0vhDrSABtNKrT+HfL2UA8vfELjYQaoEYiVmlHDvm+te233Qd2m23lcjzVujEWfSz0dunERuoEbhZGE+i8JQ6fHGadiYi7KJkAFKxIU9/NLtWD/WVdMeaRA3XEA5h2H3QDRIE0k5Yd5JEcUwqsIqDDdqQDScYZHi1ZhkkQ2LdoStjFkjKNCwjdJjdXjEkeM1tMRNGuwCM12DeZvlJxn+LvxhYTZa5cemDZxEq32xL2Nt5pCN6dgeUK4HDaI0uRvD32wzII4GB9sCDKmyLl4kMq06WixecL5zIh7ymcGX7WceYxSttoU3CYsjpswZxre8y1jjGwgewo48e4SIbpbhJcwitTnx9YgrbNzv6pEXsIiVlYwYYWZ5+iJ3NMiAsBEXURpeMAV++IAnA5CLsYeyAZZkYgLDAMYexRF2EQKMZ2UIkkQIGFSABl1MQGqodDFUaFrMBGQ8ZqaJKYYNAR5XjanMy63jdVhgxNFfCVsJ4RYWnzSPqDwELDcdV8cZfymRMw6gnjtGA8rEP1WYEs9mYiH9/RL+U29UCGnb8/ugleBtslO3wiQwXnA/3xI2Sy27GRD5sxKpbmKmzaUFnCRD/lJTyxPDjAG8TotG0LCHVjznO2IFngncCRBbLYOy2AL5kdxIDpeAeyVsaCZ/f0zJIDlrwNhl7Gi7tEAdrQBMJbA2GIA+1JKmSJAwZdTBAy6zIA6GHSK1mHQzFiMK0MrRZWl+1ARhWEPW/dE8w9ZgQ4rnad7We6K9vhOo8LEOGdFnGADyduRBvKS5siZfhLCzb1SsIyz+/olS8ExxKF9pEwwaW7XKKB5dHlYkHV5HaABlGJ2lYrjAaXDxZGlw20iDq8DZZvKdqccwEODtBWPOB+UE7RSA41kEbJR2g2aIBS8E5g8yjtIjrGL2S5aUZpkgBsZJQmSQFRLrJJMiLrDLJJMSLmEHH375JIGQVff7YVeEkkCCCTnJJIg44Tj+/wBkkkiKHlOj2SSSIJbBSSSFlRzlzykkkBw8pySSRFhxljJJIiCVs4SSTEUVgrZJJkAJ+coeEkkSByjSSQIEeEo0kkyAFJJJID//2Q=="\n}\n)(), "test.png", "image/png")\n})}}',
buttonColor: "#03B365",
dynamicPropertyPathList: [
{
key: "onClick",
},
],
displayName: "Button",
iconSVG: "/static/media/icon.cca02633.svg",
topRow: 29,
bottomRow: 33,
tooltip: "",
parentRowSpace: 10,
type: "BUTTON_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
dynamicTriggerPathList: [
{
key: "onClick",
},
],
leftColumn: 20,
dynamicBindingPathList: [],
text: "Submit",
isDisabled: false,
key: "pg01cxraj1",
rightColumn: 36,
isDefaultClickDisabled: true,
widgetId: "d229q1ydul",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
buttonVariant: "PRIMARY",
placement: "CENTER",
},
{
widgetName: "Input2",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 44,
bottomRow: 48,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
resetOnSubmit: true,
leftColumn: 9,
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "519sr07k1u",
isRequired: false,
rightColumn: 29,
widgetId: "eenq4c022d",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
},
{
version: 1,
template: {
Image1: {
isVisible: true,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
imageShape: "RECTANGLE",
maxZoomLevel: 1,
enableRotation: false,
enableDownload: false,
objectFit: "contain",
image: "{{List1.listData.map((currentItem) => currentItem.img)}}",
widgetName: "Image1",
version: 1,
animateLoading: true,
type: "IMAGE_WIDGET",
hideCard: false,
displayName: "Image",
key: "9cn4ooadxj",
iconSVG: "/static/media/icon.52d8fb96.svg",
dynamicBindingPathList: [
{
key: "image",
},
],
dynamicTriggerPathList: [],
widgetId: "yqofym38tn",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 0,
rightColumn: 16,
topRow: 0,
bottomRow: 8.4,
parentId: "vqn2okwc6a",
},
Text1: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.name)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text1",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "HEADING",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "zeqf6yfm3s",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 28,
topRow: 0,
bottomRow: 4,
parentId: "vqn2okwc6a",
},
Text2: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.id)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text2",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "BODY",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "8wyekp2o6e",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 24,
topRow: 4,
bottomRow: 8,
parentId: "vqn2okwc6a",
},
},
widgetName: "List1",
listData: [
{
id: "001",
name: "Blue",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "002",
name: "Green",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "003",
name: "Red",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
],
isCanvas: true,
displayName: "List",
iconSVG: "/static/media/icon.9925ee17.svg",
topRow: 34,
bottomRow: 74,
parentRowSpace: 10,
type: "LIST_WIDGET",
hideCard: false,
gridGap: 0,
animateLoading: true,
parentColumnSpace: 14.0625,
leftColumn: 39,
dynamicBindingPathList: [
{
key: "template.Image1.image",
},
{
key: "template.Text1.text",
},
{
key: "template.Text2.text",
},
],
gridType: "vertical",
enhancements: true,
children: [
{
widgetName: "Canvas1",
displayName: "Canvas",
topRow: 0,
bottomRow: 400,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: false,
hideCard: true,
dropDisabled: true,
openParentPropertyPane: true,
minHeight: 400,
noPad: true,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
boxShadow: "NONE",
widgetName: "Container1",
borderColor: "transparent",
disallowCopy: true,
isCanvas: true,
displayName: "Container",
iconSVG: "/static/media/icon.1977dca3.svg",
topRow: 0,
bottomRow: 12,
dragDisabled: true,
type: "CONTAINER_WIDGET",
hideCard: false,
openParentPropertyPane: true,
isDeletable: false,
animateLoading: true,
leftColumn: 0,
children: [
{
widgetName: "Canvas2",
detachFromLayout: true,
displayName: "Canvas",
widgetId: "vqn2okwc6a",
containerStyle: "none",
topRow: 0,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "9e77epyavg",
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "Image1",
displayName: "Image",
iconSVG: "/static/media/icon.52d8fb96.svg",
topRow: 0,
bottomRow: 8.4,
type: "IMAGE_WIDGET",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
imageShape: "RECTANGLE",
dynamicBindingPathList: [
{
key: "image",
},
],
leftColumn: 0,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
key: "9cn4ooadxj",
image: "{{currentItem.img}}",
rightColumn: 16,
objectFit: "contain",
widgetId: "yqofym38tn",
logBlackList: {
isVisible: true,
defaultImage: true,
imageShape: true,
maxZoomLevel: true,
enableRotation: true,
enableDownload: true,
objectFit: true,
image: true,
widgetName: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
maxZoomLevel: 1,
enableDownload: false,
enableRotation: false,
dynamicHeight: "FIXED",
},
{
widgetName: "Text1",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 0,
bottomRow: 4,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
leftColumn: 16,
shouldTruncate: false,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.name}}",
key: "yd217bk315",
rightColumn: 28,
textAlign: "LEFT",
widgetId: "zeqf6yfm3s",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
shouldScroll: false,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
fontSize: "PARAGRAPH",
textStyle: "HEADING",
dynamicHeight: "FIXED",
},
{
widgetName: "Text2",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 4,
bottomRow: 8,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
leftColumn: 16,
shouldTruncate: false,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.id}}",
key: "yd217bk315",
rightColumn: 24,
textAlign: "LEFT",
widgetId: "8wyekp2o6e",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
shouldScroll: false,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
fontSize: "PARAGRAPH",
textStyle: "BODY",
dynamicHeight: "FIXED",
},
],
key: "omhgz5cakp",
},
],
borderWidth: "0",
key: "ca3a42k2a4",
disablePropertyPane: true,
backgroundColor: "white",
rightColumn: 64,
widgetId: "9e77epyavg",
containerStyle: "card",
isVisible: true,
version: 1,
parentId: "q3ype57cdo",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0",
},
],
key: "omhgz5cakp",
rightColumn: 337.5,
detachFromLayout: true,
widgetId: "q3ype57cdo",
containerStyle: "none",
isVisible: true,
version: 1,
parentId: "iupz1d99ka",
renderMode: "CANVAS",
isLoading: false,
},
],
key: "axex98spx3",
backgroundColor: "transparent",
rightColumn: 63,
itemBackgroundColor: "#FFFFFF",
widgetId: "iupz1d99ka",
isVisible: true,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
},
],
containerStyle: "none",
detachFromLayout: true,
dynamicBindingPathList: [],
dynamicTriggerPathList: [],
leftColumn: 0,
minHeight: 640,
parentColumnSpace: 1,
parentRowSpace: 1,
rightColumn: 912,
snapColumns: 64,
snapRows: 125,
topRow: 0,
type: "CANVAS_WIDGET",
version: currentVersion,
widgetId: "0",
widgetName: "MainContainer",
renderMode: "CANVAS",
isLoading: false,
};
const expectedNextDSL: ContainerWidgetProps<WidgetProps> = {
backgroundColor: "none",
bottomRow: 740,
canExtend: true,
version: nextVersion,
children: [
{
widgetName: "Input1",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 18,
bottomRow: 22,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 15.0625,
dynamicTriggerPathList: [],
resetOnSubmit: true,
leftColumn: 23,
dynamicBindingPathList: [
{
key: "accentColor",
},
],
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "ftefjorusw",
labelTextSize: "0.875rem",
isRequired: false,
rightColumn: 43,
widgetId: "lz9hvhcltl",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
borderRadius: "0px",
boxShadow: "none",
accentColor: "{{appsmith.theme.colors.primaryColor}}",
},
{
widgetName: "Button1",
onClick:
'{{Api1.run(()=>{\ndownload((\nfunction(){\nreturn "data:image/jpeg;base64,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"\n}\n)(), "test.png", "image/png")\n})}}',
buttonColor: "#03B365",
dynamicPropertyPathList: [
{
key: "onClick",
},
],
displayName: "Button",
iconSVG: "/static/media/icon.cca02633.svg",
topRow: 29,
bottomRow: 33,
tooltip: "",
parentRowSpace: 10,
type: "BUTTON_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
dynamicTriggerPathList: [
{
key: "onClick",
},
],
leftColumn: 20,
dynamicBindingPathList: [],
text: "Submit",
isDisabled: false,
key: "pg01cxraj1",
labelTextSize: "0.875rem",
rightColumn: 36,
isDefaultClickDisabled: true,
widgetId: "d229q1ydul",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
buttonVariant: "PRIMARY",
placement: "CENTER",
borderRadius: "0px",
boxShadow: "none",
},
{
widgetName: "Input2",
displayName: "Input",
iconSVG: "/static/media/icon.9f505595.svg",
topRow: 44,
bottomRow: 48,
parentRowSpace: 10,
autoFocus: false,
type: "INPUT_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.0625,
resetOnSubmit: true,
leftColumn: 9,
labelStyle: "",
inputType: "TEXT",
isDisabled: false,
key: "519sr07k1u",
labelTextSize: "0.875rem",
isRequired: false,
rightColumn: 29,
widgetId: "eenq4c022d",
isVisible: true,
label: "",
allowCurrencyChange: false,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
iconAlign: "left",
defaultText: "",
borderRadius: "0px",
boxShadow: "none",
accentColor: "{{appsmith.theme.colors.primaryColor}}",
dynamicBindingPathList: [
{
key: "accentColor",
},
],
},
{
widgetName: "List1",
template: {
Image1: {
isVisible: true,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
imageShape: "RECTANGLE",
maxZoomLevel: 1,
enableRotation: false,
enableDownload: false,
objectFit: "contain",
image: "{{List1.listData.map((currentItem) => currentItem.img)}}",
widgetName: "Image1",
version: 1,
animateLoading: true,
type: "IMAGE_WIDGET",
hideCard: false,
displayName: "Image",
key: "9cn4ooadxj",
iconSVG: "/static/media/icon.52d8fb96.svg",
dynamicBindingPathList: [
{
key: "image",
},
],
dynamicTriggerPathList: [],
widgetId: "yqofym38tn",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 0,
rightColumn: 16,
topRow: 0,
bottomRow: 8.4,
parentId: "vqn2okwc6a",
},
Text1: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.name)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text1",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "HEADING",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "zeqf6yfm3s",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 28,
topRow: 0,
bottomRow: 4,
parentId: "vqn2okwc6a",
},
Text2: {
isVisible: true,
text: "{{List1.listData.map((currentItem) => currentItem.id)}}",
fontSize: "PARAGRAPH",
fontStyle: "BOLD",
textAlign: "LEFT",
textColor: "#231F20",
truncateButtonColor: "#FFC13D",
widgetName: "Text2",
shouldScroll: false,
shouldTruncate: false,
version: 1,
animateLoading: true,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
displayName: "Text",
key: "yd217bk315",
iconSVG: "/static/media/icon.97c59b52.svg",
textStyle: "BODY",
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicTriggerPathList: [],
widgetId: "8wyekp2o6e",
renderMode: "CANVAS",
isLoading: false,
leftColumn: 16,
rightColumn: 24,
topRow: 4,
bottomRow: 8,
parentId: "vqn2okwc6a",
},
},
listData: [
{
id: "001",
name: "Blue",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "002",
name: "Green",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
{
id: "003",
name: "Red",
img: `${ASSETS_CDN_URL}/widgets/default.png`,
},
],
isCanvas: true,
displayName: "List",
iconSVG: "/static/media/icon.9925ee17.svg",
topRow: 34,
bottomRow: 74,
parentRowSpace: 10,
type: "LIST_WIDGET",
hideCard: false,
gridGap: 0,
animateLoading: true,
parentColumnSpace: 14.0625,
leftColumn: 39,
dynamicBindingPathList: [
{
key: "template.Image1.image",
},
{
key: "template.Text1.text",
},
{
key: "template.Text2.text",
},
{
key: "accentColor",
},
],
gridType: "vertical",
enhancements: true,
children: [
{
widgetName: "Canvas1",
displayName: "Canvas",
topRow: 0,
bottomRow: 400,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: false,
hideCard: true,
dropDisabled: true,
openParentPropertyPane: true,
minHeight: 400,
noPad: true,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
boxShadow: "none",
widgetName: "Container1",
borderColor: "transparent",
disallowCopy: true,
isCanvas: true,
displayName: "Container",
iconSVG: "/static/media/icon.1977dca3.svg",
dynamicPropertyPathList: [
{
key: "borderRadius",
},
],
topRow: 0,
bottomRow: 12,
dragDisabled: true,
type: "CONTAINER_WIDGET",
hideCard: false,
openParentPropertyPane: true,
isDeletable: false,
animateLoading: true,
leftColumn: 0,
dynamicHeight: "FIXED",
maxDynamicHeight: 9000,
minDynamicHeight: 4,
children: [
{
widgetName: "Canvas2",
detachFromLayout: true,
displayName: "Canvas",
widgetId: "vqn2okwc6a",
containerStyle: "none",
topRow: 0,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "9e77epyavg",
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "Image1",
displayName: "Image",
iconSVG: "/static/media/icon.52d8fb96.svg",
topRow: 0,
bottomRow: 8.4,
type: "IMAGE_WIDGET",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
imageShape: "RECTANGLE",
dynamicBindingPathList: [
{
key: "image",
},
],
leftColumn: 0,
defaultImage: `${ASSETS_CDN_URL}/widgets/default.png`,
key: "9cn4ooadxj",
labelTextSize: "0.875rem",
image: "{{currentItem.img}}",
rightColumn: 16,
objectFit: "contain",
widgetId: "yqofym38tn",
logBlackList: {
isVisible: true,
defaultImage: true,
imageShape: true,
maxZoomLevel: true,
enableRotation: true,
enableDownload: true,
objectFit: true,
image: true,
widgetName: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
version: 1,
parentId: "vqn2okwc6a",
renderMode: "CANVAS",
isLoading: false,
maxZoomLevel: 1,
enableDownload: false,
enableRotation: false,
borderRadius: "0px",
boxShadow: "none",
dynamicHeight: "FIXED",
},
{
widgetName: "Text1",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 0,
bottomRow: 4,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicHeight: "FIXED",
maxDynamicHeight: 9000,
minDynamicHeight: 4,
leftColumn: 16,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.name}}",
key: "yd217bk315",
labelTextSize: "0.875rem",
rightColumn: 28,
textAlign: "LEFT",
widgetId: "zeqf6yfm3s",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
version: 1,
parentId: "vqn2okwc6a",
overflow: "NONE",
renderMode: "CANVAS",
isLoading: false,
fontSize: "0.875rem",
textStyle: "HEADING",
borderRadius: "0px",
boxShadow: "none",
},
{
widgetName: "Text2",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 4,
bottomRow: 8,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
dynamicTriggerPathList: [],
dynamicBindingPathList: [
{
key: "text",
},
],
dynamicHeight: "FIXED",
maxDynamicHeight: 9000,
minDynamicHeight: 4,
leftColumn: 16,
truncateButtonColor: "#FFC13D",
text: "{{currentItem.id}}",
key: "yd217bk315",
labelTextSize: "0.875rem",
rightColumn: 24,
textAlign: "LEFT",
widgetId: "8wyekp2o6e",
logBlackList: {
isVisible: true,
text: true,
fontSize: true,
fontStyle: true,
textAlign: true,
textColor: true,
truncateButtonColor: true,
widgetName: true,
shouldScroll: true,
shouldTruncate: true,
version: true,
animateLoading: true,
type: true,
hideCard: true,
displayName: true,
key: true,
iconSVG: true,
isCanvas: true,
textStyle: true,
dynamicBindingPathList: true,
dynamicTriggerPathList: true,
minHeight: true,
widgetId: true,
renderMode: true,
isLoading: true,
parentColumnSpace: true,
parentRowSpace: true,
leftColumn: true,
rightColumn: true,
topRow: true,
bottomRow: true,
parentId: true,
},
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
version: 1,
parentId: "vqn2okwc6a",
overflow: "NONE",
renderMode: "CANVAS",
isLoading: false,
fontSize: "0.875rem",
textStyle: "BODY",
borderRadius: "0px",
boxShadow: "none",
},
],
key: "omhgz5cakp",
labelTextSize: "0.875rem",
borderRadius: "0px",
boxShadow: "none",
},
],
borderWidth: "0",
key: "ca3a42k2a4",
labelTextSize: "0.875rem",
disablePropertyPane: true,
backgroundColor: "white",
rightColumn: 64,
widgetId: "9e77epyavg",
containerStyle: "card",
isVisible: true,
version: 1,
parentId: "q3ype57cdo",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0px",
},
],
key: "omhgz5cakp",
labelTextSize: "0.875rem",
rightColumn: 337.5,
detachFromLayout: true,
widgetId: "q3ype57cdo",
containerStyle: "none",
isVisible: true,
version: 1,
parentId: "iupz1d99ka",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0px",
boxShadow: "none",
},
],
key: "axex98spx3",
backgroundColor: "transparent",
labelTextSize: "0.875rem",
rightColumn: 63,
itemBackgroundColor: "#FFFFFF",
widgetId: "iupz1d99ka",
isVisible: true,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
version: 1,
borderRadius: "0px",
boxShadow: "none",
accentColor: "{{appsmith.theme.colors.primaryColor}}",
},
],
containerStyle: "none",
detachFromLayout: true,
dynamicBindingPathList: [],
dynamicTriggerPathList: [],
leftColumn: 0,
minHeight: 640,
parentColumnSpace: 1,
parentRowSpace: 1,
rightColumn: 912,
snapColumns: 64,
snapRows: 125,
topRow: 0,
type: "CANVAS_WIDGET",
widgetId: "0",
widgetName: "MainContainer",
renderMode: RenderModes.CANVAS,
isLoading: false,
};
const actualNextDsl = transformDSL(currentDSL);
expect(actualNextDsl).toEqual(expectedNextDSL);
});
it("RadioGroupWidget: Add alignment property, set to LEFT", () => {
const currentVersion = 51;
const currentDSL: ContainerWidgetProps<WidgetProps> = {
widgetName: "MainContainer",
renderMode: RenderModes.CANVAS,
isLoading: false,
backgroundColor: "none",
rightColumn: 909,
snapColumns: 64,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 710,
containerStyle: "none",
snapRows: 125,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: currentVersion,
minHeight: 690,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
children: [
{
widgetName: "RadioGroup1",
displayName: "Radio Group",
iconSVG: "/static/media/icon.ba2b2ee0.svg",
topRow: 6,
bottomRow: 14,
parentRowSpace: 10,
type: "RADIO_GROUP_WIDGET",
hideCard: false,
defaultOptionValue: "Y",
animateLoading: true,
parentColumnSpace: 14.015625,
leftColumn: 3,
options: [
{
label: "Yes",
value: "Y",
},
{
label: "No",
value: "N",
},
],
isDisabled: false,
key: "pfm838nmst",
isRequired: false,
rightColumn: 27,
widgetId: "zo3fvq3exo",
isVisible: true,
label: "",
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
},
{
boxShadow: "NONE",
widgetName: "Container1",
borderColor: "transparent",
isCanvas: true,
displayName: "Container",
iconSVG: "/static/media/icon.1977dca3.svg",
topRow: 17,
bottomRow: 35,
parentRowSpace: 10,
type: "CONTAINER_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.015625,
leftColumn: 3,
children: [
{
widgetName: "Canvas1",
rightColumn: 336.375,
detachFromLayout: true,
displayName: "Canvas",
widgetId: "07bpn6tbfi",
containerStyle: "none",
topRow: 0,
bottomRow: 390,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "tt24x0w1w8",
minHeight: 400,
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "RadioGroup2",
displayName: "Radio Group",
iconSVG: "/static/media/icon.ba2b2ee0.svg",
topRow: 2,
bottomRow: 10,
parentRowSpace: 10,
type: "RADIO_GROUP_WIDGET",
hideCard: false,
defaultOptionValue: "Y",
animateLoading: true,
parentColumnSpace: 4.943359375,
leftColumn: 2,
options: [
{
label: "Yes",
value: "Y",
},
{
label: "No",
value: "N",
},
],
isDisabled: false,
key: "pfm838nmst",
isRequired: false,
rightColumn: 64,
widgetId: "cu4xgfuj9c",
isVisible: true,
label: "",
version: 1,
parentId: "07bpn6tbfi",
renderMode: "CANVAS",
isLoading: false,
},
],
key: "xtt3p4czog",
},
],
borderWidth: "0",
key: "0s5opm25jx",
backgroundColor: "#FFFFFF",
rightColumn: 27,
widgetId: "tt24x0w1w8",
containerStyle: "card",
isVisible: true,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0",
},
{
widgetName: "Form1",
version: 1,
backgroundColor: "white",
rightColumn: 54,
isCanvas: true,
displayName: "Form",
iconSVG: "/static/media/icon.ea3e08d1.svg",
widgetId: "ybeukm257w",
topRow: 6,
bottomRow: 46,
parentRowSpace: 10,
isVisible: true,
type: "FORM_WIDGET",
hideCard: false,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
animateLoading: true,
parentColumnSpace: 14.015625,
leftColumn: 30,
children: [
{
widgetName: "Canvas2",
rightColumn: 336.375,
detachFromLayout: true,
displayName: "Canvas",
widgetId: "ilkump68xe",
containerStyle: "none",
topRow: 0,
bottomRow: 390,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "ybeukm257w",
minHeight: 400,
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "Text1",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 1,
bottomRow: 5,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
leftColumn: 1.5,
shouldTruncate: false,
truncateButtonColor: "#FFC13D",
text: "Form",
key: "jh3gip369p",
rightColumn: 25.5,
textAlign: "LEFT",
widgetId: "yp585y41d6",
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
shouldScroll: false,
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
fontSize: "HEADING1",
},
{
resetFormOnClick: true,
widgetName: "FormButton1",
buttonColor: "#03B365",
displayName: "FormButton",
iconSVG: "/static/media/icon.c8f649ed.svg",
topRow: 33,
bottomRow: 37,
type: "FORM_BUTTON_WIDGET",
hideCard: true,
animateLoading: true,
leftColumn: 46,
text: "Submit",
key: "ahb522obua",
rightColumn: 62,
isDefaultClickDisabled: true,
widgetId: "jrpy8ke6tw",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
disabledWhenInvalid: true,
buttonVariant: "PRIMARY",
},
{
resetFormOnClick: true,
widgetName: "FormButton2",
buttonColor: "#03B365",
displayName: "FormButton",
iconSVG: "/static/media/icon.c8f649ed.svg",
topRow: 33,
bottomRow: 37,
type: "FORM_BUTTON_WIDGET",
hideCard: true,
animateLoading: true,
leftColumn: 30,
text: "Reset",
key: "ahb522obua",
rightColumn: 46,
isDefaultClickDisabled: true,
widgetId: "j1uwneh0zn",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
disabledWhenInvalid: false,
buttonVariant: "SECONDARY",
},
{
widgetName: "RadioGroup3",
displayName: "Radio Group",
iconSVG: "/static/media/icon.ba2b2ee0.svg",
topRow: 7,
bottomRow: 15,
parentRowSpace: 10,
type: "RADIO_GROUP_WIDGET",
hideCard: false,
defaultOptionValue: "Y",
animateLoading: true,
parentColumnSpace: 4.943359375,
leftColumn: 1,
options: [
{
label: "Yes",
value: "Y",
},
{
label: "No",
value: "N",
},
],
isDisabled: false,
key: "pfm838nmst",
isRequired: false,
rightColumn: 64,
widgetId: "d3orpb3ele",
isVisible: true,
label: "",
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
},
],
key: "xtt3p4czog",
},
],
key: "04103tgkwj",
},
],
};
const expectedNextDSL: ContainerWidgetProps<WidgetProps> = {
widgetName: "MainContainer",
renderMode: RenderModes.CANVAS,
isLoading: false,
backgroundColor: "none",
rightColumn: 909,
snapColumns: 64,
detachFromLayout: true,
widgetId: "0",
topRow: 0,
bottomRow: 710,
containerStyle: "none",
snapRows: 125,
parentRowSpace: 1,
type: "CANVAS_WIDGET",
canExtend: true,
version: currentVersion,
minHeight: 690,
parentColumnSpace: 1,
dynamicBindingPathList: [],
leftColumn: 0,
children: [
{
widgetName: "RadioGroup1",
displayName: "Radio Group",
iconSVG: "/static/media/icon.ba2b2ee0.svg",
topRow: 6,
bottomRow: 14,
parentRowSpace: 10,
type: "RADIO_GROUP_WIDGET",
hideCard: false,
defaultOptionValue: "Y",
animateLoading: true,
parentColumnSpace: 14.015625,
leftColumn: 3,
options: [
{
label: "Yes",
value: "Y",
},
{
label: "No",
value: "N",
},
],
isDisabled: false,
key: "pfm838nmst",
isRequired: false,
rightColumn: 27,
widgetId: "zo3fvq3exo",
isVisible: true,
label: "",
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
alignment: "left",
},
{
boxShadow: "NONE",
widgetName: "Container1",
borderColor: "transparent",
isCanvas: true,
displayName: "Container",
iconSVG: "/static/media/icon.1977dca3.svg",
topRow: 17,
bottomRow: 35,
parentRowSpace: 10,
type: "CONTAINER_WIDGET",
hideCard: false,
animateLoading: true,
parentColumnSpace: 14.015625,
leftColumn: 3,
children: [
{
widgetName: "Canvas1",
rightColumn: 336.375,
detachFromLayout: true,
displayName: "Canvas",
widgetId: "07bpn6tbfi",
containerStyle: "none",
topRow: 0,
bottomRow: 390,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "tt24x0w1w8",
minHeight: 400,
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "RadioGroup2",
displayName: "Radio Group",
iconSVG: "/static/media/icon.ba2b2ee0.svg",
topRow: 2,
bottomRow: 10,
parentRowSpace: 10,
type: "RADIO_GROUP_WIDGET",
hideCard: false,
defaultOptionValue: "Y",
animateLoading: true,
parentColumnSpace: 4.943359375,
leftColumn: 2,
options: [
{
label: "Yes",
value: "Y",
},
{
label: "No",
value: "N",
},
],
isDisabled: false,
key: "pfm838nmst",
isRequired: false,
rightColumn: 64,
widgetId: "cu4xgfuj9c",
isVisible: true,
label: "",
version: 1,
parentId: "07bpn6tbfi",
renderMode: "CANVAS",
isLoading: false,
alignment: "left",
},
],
key: "xtt3p4czog",
},
],
borderWidth: "0",
key: "0s5opm25jx",
backgroundColor: "#FFFFFF",
rightColumn: 27,
widgetId: "tt24x0w1w8",
containerStyle: "card",
isVisible: true,
version: 1,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
borderRadius: "0",
},
{
widgetName: "Form1",
version: 1,
backgroundColor: "white",
rightColumn: 54,
isCanvas: true,
displayName: "Form",
iconSVG: "/static/media/icon.ea3e08d1.svg",
widgetId: "ybeukm257w",
topRow: 6,
bottomRow: 46,
parentRowSpace: 10,
isVisible: true,
type: "FORM_WIDGET",
hideCard: false,
parentId: "0",
renderMode: "CANVAS",
isLoading: false,
animateLoading: true,
parentColumnSpace: 14.015625,
leftColumn: 30,
children: [
{
widgetName: "Canvas2",
rightColumn: 336.375,
detachFromLayout: true,
displayName: "Canvas",
widgetId: "ilkump68xe",
containerStyle: "none",
topRow: 0,
bottomRow: 390,
parentRowSpace: 1,
isVisible: true,
type: "CANVAS_WIDGET",
canExtend: false,
version: 1,
hideCard: true,
parentId: "ybeukm257w",
minHeight: 400,
renderMode: "CANVAS",
isLoading: false,
parentColumnSpace: 1,
leftColumn: 0,
children: [
{
widgetName: "Text1",
displayName: "Text",
iconSVG: "/static/media/icon.97c59b52.svg",
topRow: 1,
bottomRow: 5,
type: "TEXT_WIDGET",
fontFamily: "System Default",
hideCard: false,
animateLoading: true,
leftColumn: 1.5,
shouldTruncate: false,
truncateButtonColor: "#FFC13D",
text: "Form",
key: "jh3gip369p",
rightColumn: 25.5,
textAlign: "LEFT",
widgetId: "yp585y41d6",
isVisible: true,
fontStyle: "BOLD",
textColor: "#231F20",
shouldScroll: false,
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
fontSize: "HEADING1",
},
{
resetFormOnClick: true,
widgetName: "FormButton1",
buttonColor: "#03B365",
displayName: "FormButton",
iconSVG: "/static/media/icon.c8f649ed.svg",
topRow: 33,
bottomRow: 37,
type: "FORM_BUTTON_WIDGET",
hideCard: true,
animateLoading: true,
leftColumn: 46,
text: "Submit",
key: "ahb522obua",
rightColumn: 62,
isDefaultClickDisabled: true,
widgetId: "jrpy8ke6tw",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
disabledWhenInvalid: true,
buttonVariant: "PRIMARY",
},
{
resetFormOnClick: true,
widgetName: "FormButton2",
buttonColor: "#03B365",
displayName: "FormButton",
iconSVG: "/static/media/icon.c8f649ed.svg",
topRow: 33,
bottomRow: 37,
type: "FORM_BUTTON_WIDGET",
hideCard: true,
animateLoading: true,
leftColumn: 30,
text: "Reset",
key: "ahb522obua",
rightColumn: 46,
isDefaultClickDisabled: true,
widgetId: "j1uwneh0zn",
isVisible: true,
recaptchaType: "V3",
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
disabledWhenInvalid: false,
buttonVariant: "SECONDARY",
},
{
widgetName: "RadioGroup3",
displayName: "Radio Group",
iconSVG: "/static/media/icon.ba2b2ee0.svg",
topRow: 7,
bottomRow: 15,
parentRowSpace: 10,
type: "RADIO_GROUP_WIDGET",
hideCard: false,
defaultOptionValue: "Y",
animateLoading: true,
parentColumnSpace: 4.943359375,
leftColumn: 1,
options: [
{
label: "Yes",
value: "Y",
},
{
label: "No",
value: "N",
},
],
isDisabled: false,
key: "pfm838nmst",
isRequired: false,
rightColumn: 64,
widgetId: "d3orpb3ele",
isVisible: true,
label: "",
version: 1,
parentId: "ilkump68xe",
renderMode: "CANVAS",
isLoading: false,
alignment: "left",
},
],
key: "xtt3p4czog",
},
],
key: "04103tgkwj",
},
],
};
const actualNextDSL = migrateRadioGroupAlignmentProperty(currentDSL);
expect(actualNextDSL).toEqual(expectedNextDSL);
});
it("correctly migrates currentIndex/currentRow properties for validations in table view", () => {
const currentVersion = 78;
const currentDSL: ContainerWidgetProps<WidgetProps> = {
bottomRow: 740,
containerStyle: "none",
detachFromLayout: true,
dynamicBindingPathList: [],
dynamicTriggerPathList: [],
leftColumn: 0,
minHeight: 640,
parentColumnSpace: 1,
parentRowSpace: 1,
rightColumn: 912,
snapColumns: 64,
snapRows: 125,
topRow: 0,
type: "CANVAS_WIDGET",
version: currentVersion,
widgetId: "0",
widgetName: "MainContainer",
renderMode: "CANVAS",
isLoading: false,
children: [
{
widgetName: "Table1",
type: "TABLE_WIDGET_V2",
widgetId: "123",
renderMode: "CANVAS",
version: 1,
parentColumnSpace: 15.0623,
leftColumn: 1,
rightColumn: 1,
topRow: 1,
bottomRow: 1,
parentRowSpace: 10,
isLoading: false,
primaryColumns: {
column1: {
validation: {
min: "{{\n (\n (isNewRow) => (\nisNewRow ? 1 : 0\n ))\n (\n Table1.isAddRowInProgress\n )\n }}\n ",
max: 1,
regex:
"{{\n (\n (isNewRow) => (\nisNewRow ? 1 : 0\n ))\n (\n Table1.isAddRowInProgress\n )\n }}\n ",
errorMessage: true,
isColumnEditableCellRequired:
"{{\n (\n (isNewRow) => (\nisNewRow ? true : false\n ))\n (\n Table1.isAddRowInProgress\n )\n }}\n ",
randomValidation: "hello",
isColumnEditableCellValid: `
{{
(
(editedValue, currentRow, currentIndex, isNewRow) => (
isNewRow ? true : false
))
(
(Table1.isAddRowInProgress ? Table1.newRow.orderAmount : Table1.columnEditableCellValue.orderAmount) || "",
Table1.isAddRowInProgress ? Table1.newRow : (Table1.processedTableData[Table1.editableCell.index] ||
Object.keys(Table1.processedTableData[0])
.filter(key => ["__originalIndex__", "__primaryKey__"].indexOf(key) === -1)
.reduce((prev, curr) => {
prev[curr] = "";
return prev;
}, {})),
Table1.isAddRowInProgress ? -1 : Table1.editableCell.index,
Table1.isAddRowInProgress
)
}}
`,
},
},
},
},
],
};
const nextDSL = transformDSL(currentDSL);
const validations = (nextDSL.children || [])[0].primaryColumns.column1
.validation;
for (const validationName in validations) {
const validation = validations[validationName];
if (
validationName == "min" ||
validationName == "regex" ||
validationName == "isColumnEditableCellRequired"
) {
expect(
validation.indexOf("(isNewRow, currentIndex, currentRow)"),
).toBeGreaterThan(-1);
expect(
validation.indexOf(
`.filter(key => ["__originalIndex__", "__primaryKey__"].indexOf(key) === -1)`,
),
).toBeGreaterThan(-1);
}
if (validationName == "errorMessage") {
expect(validation).toEqual(true);
}
if (validationName == "max") {
expect(validation).toEqual(1);
}
if (validationName == "isColumnEditableCellValid") {
expect(
validation.indexOf(
"(editedValue, currentRow, currentIndex, isNewRow)",
),
).toBeGreaterThan(-1);
expect(
validation.indexOf(
`.filter(key => ["__originalIndex__", "__primaryKey__"].indexOf(key) === -1)`,
),
).toBeGreaterThan(-1);
}
}
});
});