feat(editor): Add mapping support for data paths (#5191)
* feat: add data path flag * chore: update types * feat: use path for data * feat: add support for multiple values * fix: handle if not prev node * fix: update node * fix: handle multi part path * feat: add support for multiple vals for field * feat: add support for table transforms * feat: use dot notation * feat: fix bug where brackets removed * fix: handle dots, fix unit tests * test: update snapshot * test: fix tests * test: add test for edge case
This commit is contained in:
Mutasem Aldmour
GitHub
@@ -33,9 +33,9 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
|
||||
class="label"
|
||||
data-depth="1"
|
||||
data-name="name"
|
||||
data-path="[\\"name\\"]"
|
||||
data-path=".name"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"name\\"] }}"
|
||||
data-value="{{ $json.name }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
@@ -70,9 +70,9 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
|
||||
class="label"
|
||||
data-depth="1"
|
||||
data-name="age"
|
||||
data-path="[\\"age\\"]"
|
||||
data-path=".age"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"age\\"] }}"
|
||||
data-value="{{ $json.age }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="hashtag"
|
||||
@@ -107,9 +107,9 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
|
||||
class="label"
|
||||
data-depth="1"
|
||||
data-name="hobbies"
|
||||
data-path="[\\"hobbies\\"]"
|
||||
data-path=".hobbies"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hobbies\\"] }}"
|
||||
data-value="{{ $json.hobbies }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="list"
|
||||
@@ -152,9 +152,9 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
|
||||
class="label"
|
||||
data-depth="2"
|
||||
data-name="string[0]"
|
||||
data-path="[\\"hobbies\\"][0]"
|
||||
data-path=".hobbies[0]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hobbies\\"][0] }}"
|
||||
data-value="{{ $json.hobbies[0] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
@@ -191,9 +191,9 @@ exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
|
||||
class="label"
|
||||
data-depth="2"
|
||||
data-name="string[1]"
|
||||
data-path="[\\"hobbies\\"][1]"
|
||||
data-path=".hobbies[1]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hobbies\\"][1] }}"
|
||||
data-value="{{ $json.hobbies[1] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
@@ -259,3 +259,503 @@ exports[`RunDataJsonSchema.vue > renders schema for empty data 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`RunDataJsonSchema.vue > renders schema with spaces 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="_schemaWrapper_1mtap_1"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="_schema_1mtap_1"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="array"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="1"
|
||||
data-name="hello world"
|
||||
data-path="[\\"hello world\\"]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="list"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
hello world
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="array-0-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="_toggle_14xdy_20"
|
||||
for="array-0-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="object"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="2"
|
||||
data-name="object[0]"
|
||||
data-path="[\\"hello world\\"][0]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="cube"
|
||||
size="sm"
|
||||
/>
|
||||
<span>
|
||||
hello world
|
||||
</span>
|
||||
<span
|
||||
class="_arrayIndex_14xdy_94"
|
||||
>
|
||||
[0]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="object-1-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="_toggle_14xdy_20"
|
||||
for="object-1-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="object"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="3"
|
||||
data-name="test"
|
||||
data-path="[\\"hello world\\"][0].test"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0].test }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="cube"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
test
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="object-2-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="_toggle_14xdy_20"
|
||||
for="object-2-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="number"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="4"
|
||||
data-name="more to think about"
|
||||
data-path="[\\"hello world\\"][0].test[\\"more to think about\\"]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0].test[\\"more to think about\\"] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="hashtag"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
more to think about
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="_text_14xdy_100"
|
||||
>
|
||||
1
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0.033s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="string"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="3"
|
||||
data-name="test.how"
|
||||
data-path="[\\"hello world\\"][0][\\"test.how\\"]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0][\\"test.how\\"] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
test.how
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="_text_14xdy_100"
|
||||
>
|
||||
ignore
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="teleporter hidden"
|
||||
data-v-d4e6e290=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`RunDataJsonSchema.vue > renders schema with spaces and dots 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="_schemaWrapper_1mtap_1"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="_schema_1mtap_1"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="array"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="1"
|
||||
data-name="hello world"
|
||||
data-path="[\\"hello world\\"]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="list"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
hello world
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="array-0-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="_toggle_14xdy_20"
|
||||
for="array-0-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="object"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="2"
|
||||
data-name="object[0]"
|
||||
data-path="[\\"hello world\\"][0]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="cube"
|
||||
size="sm"
|
||||
/>
|
||||
<span>
|
||||
hello world
|
||||
</span>
|
||||
<span
|
||||
class="_arrayIndex_14xdy_94"
|
||||
>
|
||||
[0]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="object-1-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="_toggle_14xdy_20"
|
||||
for="object-1-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="object"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="3"
|
||||
data-name="test"
|
||||
data-path="[\\"hello world\\"][0].test"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0].test }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="cube"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
test
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="object-2-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="_toggle_14xdy_20"
|
||||
for="object-2-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="_sub_14xdy_14"
|
||||
>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="number"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="4"
|
||||
data-name="more to think about"
|
||||
data-path="[\\"hello world\\"][0].test[\\"more to think about\\"]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0].test[\\"more to think about\\"] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="hashtag"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
more to think about
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="_text_14xdy_100"
|
||||
>
|
||||
1
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="_item_14xdy_1"
|
||||
style="transition-delay: 0.033s;"
|
||||
>
|
||||
<div
|
||||
class="_pill_14xdy_51 _mappable_14xdy_70"
|
||||
title="string"
|
||||
>
|
||||
<span
|
||||
class="_label_14xdy_89"
|
||||
data-depth="3"
|
||||
data-name="test.how"
|
||||
data-path="[\\"hello world\\"][0][\\"test.how\\"]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json[\\"hello world\\"][0][\\"test.how\\"] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
test.how
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="_text_14xdy_100"
|
||||
>
|
||||
ignore
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="teleporter hidden"
|
||||
data-v-d4e6e290=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
Reference in New Issue
Block a user