From 17eafe10580f00351f8dca9f6d354efaa4c3cae6 Mon Sep 17 00:00:00 2001 From: danstarns Date: Fri, 16 Aug 2024 17:17:55 -0700 Subject: [PATCH] test: add datasources init Serialization --- test/specs/data_sources/serialization.ts | 64 ++++++++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 test/specs/data_sources/serialization.ts diff --git a/test/specs/data_sources/serialization.ts b/test/specs/data_sources/serialization.ts new file mode 100644 index 000000000..84214975b --- /dev/null +++ b/test/specs/data_sources/serialization.ts @@ -0,0 +1,64 @@ +import Editor from '../../../src/editor/model/Editor'; +import DataSourceManager from '../../../src/data_sources'; +import { DataSourceProps } from '../../../src/data_sources/types'; +import ComponentWrapper from '../../../src/dom_components/model/ComponentWrapper'; +import { DataVariableType } from '../../../src/data_sources/model/DataVariable'; + +describe('DataSource Serialization', () => { + let em: Editor; + let dsm: DataSourceManager; + let fixtures: HTMLElement; + let cmpRoot: ComponentWrapper; + const datasource: DataSourceProps = { + id: 'component-serialization', + records: [ + { id: 'id1', content: 'Hello World' }, + { id: 'id2', color: 'red' }, + ], + }; + + beforeEach(() => { + em = new Editor({ + mediaCondition: 'max-width', + avoidInlineStyle: true, + }); + dsm = em.DataSources; + document.body.innerHTML = '
'; + const { Pages, Components } = em; + Pages.onLoad(); + cmpRoot = Components.getWrapper()!; + const View = Components.getType('wrapper')!.view; + const wrapperEl = new View({ + model: cmpRoot, + config: { ...cmpRoot.config, em }, + }); + wrapperEl.render(); + fixtures = document.body.querySelector('#fixtures')!; + fixtures.appendChild(wrapperEl.el); + dsm.add(datasource); + }); + + afterEach(() => { + em.destroy(); + }); + + test('component .getHtml', () => { + const cmp = cmpRoot.append({ + tagName: 'h1', + type: 'text', + components: [ + { + type: DataVariableType, + value: 'default', + path: `${datasource.id}.id1.content`, + }, + ], + })[0]; + + const el = cmp.getEl(); + expect(el?.innerHTML).toContain('Hello World'); + + const html = em.getHtml(); + expect(html).toMatchInlineSnapshot('"

Hello World

"'); + }); +});