Update tests for dynamic component traits

packages/core/test/specs/data_sources/__snapshots__/serialization.ts.snap

@@ -126,13 +126,26 @@ exports[`DataSource Serialization .getProjectData TraitDataVariable 1`] = `
                 "attributes": {
                   "value": "test-value",
                 },
-                "attributes-dynamic-value": {
-                  "value": {
-                    "defaultValue": "default",
-                    "path": "test-input.id1.value",
-                    "type": "data-variable",
+                "attributes-dynamic-value": [
+                  {
+                    "category": "",
+                    "changeProp": false,
+                    "default": "",
+                    "id": "data-variable-id",
+                    "label": "Value",
+                    "name": "value",
+                    "options": [],
+                    "placeholder": "",
+                    "step": 1,
+                    "type": "text",
+                    "unit": "",
+                    "value": {
+                      "defaultValue": "default",
+                      "path": "test-input.id1.value",
+                      "type": "data-variable",
+                    },
                   },
-                },
+                ],
                 "tagName": "input",
                 "void": true,
               },

packages/core/test/specs/data_sources/serialization.ts

@@ -5,6 +5,7 @@ import { DataVariableType } from '../../../src/data_sources/model/DataVariable';
 import EditorModel from '../../../src/editor/model/Editor';
 import { ProjectData } from '../../../src/storage_manager';
 import { filterObjectForSnapshot, setupTestEditor } from '../../common';
+import { dynamicAttrKey } from '../../../src/dom_components/model/Component';
 describe('DataSource Serialization', () => {
   let editor: Editor;
   let em: EditorModel;
@@ -117,8 +118,7 @@ describe('DataSource Serialization', () => {
       expect(snapshot).toMatchSnapshot(``);
     });
 
-    // TODO: Should we keep or delete saving triats with dynamic values?
-    test.skip('TraitDataVariable', () => {
+    test('TraitDataVariable', () => {
       const dataVariable = {
         type: DataVariableType,
         defaultValue: 'default',
@@ -142,10 +142,13 @@ describe('DataSource Serialization', () => {
       const page = projectData.pages[0];
       const frame = page.frames[0];
       const component = frame.component.components[0];
-      // expect(component).toHaveProperty(dynamicAttrKey);
-      // expect(component[dynamicAttrKey]).toEqual({
-      //   value: dataVariable,
-      // });
+      expect(component).toHaveProperty(dynamicAttrKey);
+      expect(component[dynamicAttrKey][0]).toEqual(
+        expect.objectContaining({
+          name: 'value',
+          value: dataVariable,
+        })
+      );
       expect(component.attributes).toEqual({
         value: 'test-value',
       });
@@ -214,8 +217,7 @@ describe('DataSource Serialization', () => {
       expect(html).toContain('Hello World');
     });
 
-    // TODO: Should we keep or delete saving triats with dynamic values?
-    test.skip('StyleDataVariable', () => {
+    test('StyleDataVariable', () => {
       const componentProjectData: ProjectData = {
         assets: [],
         pages: [
@@ -284,8 +286,7 @@ describe('DataSource Serialization', () => {
       });
     });
 
-    // TODO: Decide what to do about traits
-    test.skip('TraitDataVariable', () => {
+    test('TraitDataVariable', () => {
       const componentProjectData: ProjectData = {
         assets: [],
         pages: [
@@ -295,16 +296,14 @@ describe('DataSource Serialization', () => {
                 component: {
                   components: [
                     {
-                      attributes: {
-                        value: 'default',
-                      },
-                      // [dynamicAttrKey]: {
-                      //   value: {
-                      //     path: 'test-input.id1.value',
-                      //     type: 'data-variable',
-                      //     defaultValue: 'default',
-                      //   },
-                      // },
+                      [dynamicAttrKey]: [{
+                        name: 'value',
+                        value: {
+                          path: 'test-input.id1.value',
+                          type: 'data-variable',
+                          defaultValue: 'default',
+                        },
+                      }],
                       tagName: 'input',
                       void: true,
                     },