diff --git a/src/data_sources/model/DataRecord.ts b/src/data_sources/model/DataRecord.ts index c2c6772f8..dd3cfe228 100644 --- a/src/data_sources/model/DataRecord.ts +++ b/src/data_sources/model/DataRecord.ts @@ -139,16 +139,27 @@ export default class DataRecord ext set(attributeName: unknown, value?: unknown, options?: SetOptions): DataRecord { const onRecordSet = this.dataSource?.transformers?.onRecordSet; - const newValue = - options?.avoidTransformers || !onRecordSet - ? value - : onRecordSet({ - id: this.id, - key: attributeName as string, - value, - }); + const applySet = (key: string, val: unknown) => { + const newValue = + options?.avoidTransformers || !onRecordSet + ? val + : onRecordSet({ + id: this.id, + key, + value: val, + }); - super.set(attributeName as string, newValue, options); + super.set(key, newValue, options); + }; + + if (typeof attributeName === 'object' && attributeName !== null) { + const attributes = attributeName as Partial; + for (const [key, val] of Object.entries(attributes)) { + applySet(key, val); + } + } else { + applySet(attributeName as string, value); + } return this; } diff --git a/test/specs/data_sources/model/ComponentDataVariable.ts b/test/specs/data_sources/model/ComponentDataVariable.ts index 09cffd731..b6e1a0b1b 100644 --- a/test/specs/data_sources/model/ComponentDataVariable.ts +++ b/test/specs/data_sources/model/ComponentDataVariable.ts @@ -257,4 +257,42 @@ describe('ComponentDataVariable', () => { expect(cmp.getEl()?.innerHTML).toContain('NestedItemName1-UP'); }); + + test('component initalizes and updates data on datarecord set object', () => { + const dataSource: DataSourceProps = { + id: 'setObject', + records: [{ id: 'id1', content: 'Hello World', color: 'red' }], + }; + dsm.add(dataSource); + + const cmp = cmpRoot.append({ + tagName: 'h1', + type: 'text', + components: [ + { + type: DataVariableType, + defaultValue: 'default', + path: `${dataSource.id}.id1.content`, + }, + ], + style: { + color: { + type: DataVariableType, + defaultValue: 'black', + path: `${dataSource.id}.id1.color`, + }, + }, + })[0]; + + const style = cmp.getStyle(); + expect(style).toHaveProperty('color', 'red'); + expect(cmp.getEl()?.innerHTML).toContain('Hello World'); + + const ds = dsm.get('setObject'); + ds.getRecord('id1')?.set({ content: 'Hello World UP', color: 'blue' }); + + const updatedStyle = cmp.getStyle(); + expect(updatedStyle).toHaveProperty('color', 'blue'); + expect(cmp.getEl()?.innerHTML).toContain('Hello World UP'); + }); }); diff --git a/test/specs/data_sources/transformers.ts b/test/specs/data_sources/transformers.ts index 785b5c086..4a67ed0ff 100644 --- a/test/specs/data_sources/transformers.ts +++ b/test/specs/data_sources/transformers.ts @@ -105,8 +105,9 @@ describe('DataSource Transformers', () => { const dr = ds.addRecord({ id: 'id1', content: 'i love grapes' }); expect(() => dr.set('content', 123)).toThrowError('Value must be a string'); + expect(() => dr.set({ content: 123 })).toThrowError('Value must be a string'); - dr.set('content', 'I LOVE GRAPES'); + dr.set({ content: 'I LOVE GRAPES' }); const el = cmp.getEl(); expect(el?.innerHTML).toContain('I LOVE GRAPES');