@api-client/ui 0.5.39 → 0.5.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/src/elements/contextual-menu/{internals/ContextualMenu.d.ts → ContextualMenu.d.ts} +11 -6
- package/build/src/elements/contextual-menu/ContextualMenu.d.ts.map +1 -0
- package/build/src/elements/contextual-menu/{internals/ContextualMenu.js → ContextualMenu.js} +25 -3
- package/build/src/elements/contextual-menu/ContextualMenu.js.map +1 -0
- package/build/src/elements/contextual-menu/internals/types.d.ts +16 -7
- package/build/src/elements/contextual-menu/internals/types.d.ts.map +1 -1
- package/build/src/elements/contextual-menu/internals/types.js.map +1 -1
- package/build/tsconfig.tsbuildinfo +1 -0
- package/package.json +1 -1
- package/src/elements/contextual-menu/{internals/ContextualMenu.ts → ContextualMenu.ts} +31 -7
- package/src/elements/contextual-menu/internals/types.ts +17 -7
- package/.aiexclude +0 -3
- package/.cursor/rules/html-and-css-best-practices.mdc +0 -63
- package/.cursor/rules/lit-best-practices.mdc +0 -89
- package/.editorconfig +0 -29
- package/.github/CONTRIBUTING.md +0 -24
- package/.github/instructions/html-and-css-best-practices.instructions.md +0 -70
- package/.github/instructions/lit-best-practices.instructions.md +0 -90
- package/.github/release.yml +0 -14
- package/.github/stale.yml +0 -23
- package/.github/workflows/auto-release.yml +0 -182
- package/.github/workflows/release.yml +0 -82
- package/.prettierrc.js +0 -14
- package/.vscode/settings.json +0 -18
- package/RELEASE.md +0 -163
- package/RELEASE_SETUP.md +0 -235
- package/build/src/demo/DemoPage.d.ts +0 -81
- package/build/src/demo/DemoPage.d.ts.map +0 -1
- package/build/src/demo/DemoPage.js +0 -175
- package/build/src/demo/DemoPage.js.map +0 -1
- package/build/src/demo/DemoStyles.d.ts +0 -3
- package/build/src/demo/DemoStyles.d.ts.map +0 -1
- package/build/src/demo/DemoStyles.js +0 -60
- package/build/src/demo/DemoStyles.js.map +0 -1
- package/build/src/elements/contextual-menu/internals/ContextualMenu.d.ts.map +0 -1
- package/build/src/elements/contextual-menu/internals/ContextualMenu.js.map +0 -1
- package/build/test/elements/navigation/Navigation.test.d.ts +0 -3
- package/build/test/elements/navigation/Navigation.test.d.ts.map +0 -1
- package/build/test/elements/navigation/Navigation.test.js +0 -113
- package/build/test/elements/navigation/Navigation.test.js.map +0 -1
- package/commitlint.config.cjs +0 -2
- package/demo/elements/authorization/AuthPlugin.js +0 -57
- package/demo/elements/authorization/AuthProxy.js +0 -215
- package/demo/elements/authorization/api-key.html +0 -27
- package/demo/elements/authorization/api-key.ts +0 -44
- package/demo/elements/authorization/basic.html +0 -27
- package/demo/elements/authorization/basic.ts +0 -43
- package/demo/elements/authorization/bearer.html +0 -27
- package/demo/elements/authorization/bearer.ts +0 -43
- package/demo/elements/authorization/env.js +0 -8
- package/demo/elements/authorization/index.html +0 -44
- package/demo/elements/authorization/ntlm.html +0 -27
- package/demo/elements/authorization/ntlm.ts +0 -43
- package/demo/elements/authorization/oauth-authorize.html +0 -75
- package/demo/elements/authorization/oauth-authorize.ts +0 -40
- package/demo/elements/authorization/oauth-error.html +0 -18
- package/demo/elements/authorization/oauth-error.ts +0 -10
- package/demo/elements/authorization/oauth-popup.html +0 -36
- package/demo/elements/authorization/oauth2.html +0 -27
- package/demo/elements/authorization/oauth2.ts +0 -100
- package/demo/elements/authorization/oidc.html +0 -27
- package/demo/elements/authorization/oidc.ts +0 -139
- package/demo/elements/authorization/private.crt +0 -31
- package/demo/elements/authorization/private.csr +0 -28
- package/demo/elements/authorization/private.key +0 -51
- package/demo/elements/authorization/private.pem +0 -31
- package/demo/elements/authorization/redirect.html +0 -20
- package/demo/elements/authorization/ssl-commands.sh +0 -30
- package/demo/elements/authorization/ssl.conf +0 -24
- package/demo/elements/autocomplete/index.html +0 -64
- package/demo/elements/autocomplete/index.ts +0 -171
- package/demo/elements/code-editor/CodeEditorDemo.ts +0 -173
- package/demo/elements/code-editor/index.html +0 -19
- package/demo/elements/context-menu/DemoIcons.ts +0 -21
- package/demo/elements/context-menu/basic.html +0 -25
- package/demo/elements/context-menu/basic.ts +0 -119
- package/demo/elements/context-menu/custom-data.html +0 -25
- package/demo/elements/context-menu/custom-data.ts +0 -62
- package/demo/elements/context-menu/demo.css +0 -28
- package/demo/elements/context-menu/enabled-state.html +0 -25
- package/demo/elements/context-menu/enabled-state.ts +0 -73
- package/demo/elements/context-menu/icons.html +0 -25
- package/demo/elements/context-menu/icons.ts +0 -64
- package/demo/elements/context-menu/index.html +0 -43
- package/demo/elements/context-menu/nested.html +0 -25
- package/demo/elements/context-menu/nestedt.ts +0 -152
- package/demo/elements/context-menu/no-execute.html +0 -25
- package/demo/elements/context-menu/no-execute.ts +0 -134
- package/demo/elements/context-menu/radio-menu.html +0 -25
- package/demo/elements/context-menu/radio-menu.ts +0 -83
- package/demo/elements/context-menu/separators.html +0 -25
- package/demo/elements/context-menu/separators.ts +0 -172
- package/demo/elements/currency/index.html +0 -91
- package/demo/elements/currency/index.ts +0 -352
- package/demo/elements/environment/environment-editor.html +0 -20
- package/demo/elements/environment/environment-editor.ts +0 -49
- package/demo/elements/environment/index.html +0 -33
- package/demo/elements/environment/server-editor.html +0 -20
- package/demo/elements/environment/server-editor.ts +0 -67
- package/demo/elements/environment/variables-editor.html +0 -20
- package/demo/elements/environment/variables-editor.ts +0 -94
- package/demo/elements/har/har-viewer.html +0 -20
- package/demo/elements/har/har-viewer.ts +0 -76
- package/demo/elements/har/har1.har +0 -3044
- package/demo/elements/har/har2.json +0 -439
- package/demo/elements/har/index.html +0 -26
- package/demo/elements/highlight/example.md +0 -27
- package/demo/elements/highlight/index.html +0 -31
- package/demo/elements/highlight/marked-highlight.html +0 -132
- package/demo/elements/highlight/marked-highlight.ts +0 -22
- package/demo/elements/highlight/prism-highlight.html +0 -62
- package/demo/elements/highlight/prism-highlight.ts +0 -17
- package/demo/elements/http/body-editor.html +0 -17
- package/demo/elements/http/body-editor.ts +0 -115
- package/demo/elements/http/headers.html +0 -17
- package/demo/elements/http/headers.ts +0 -59
- package/demo/elements/http/http-assertions.html +0 -20
- package/demo/elements/http/http-assertions.ts +0 -89
- package/demo/elements/http/http-flows.html +0 -23
- package/demo/elements/http/http-flows.ts +0 -89
- package/demo/elements/http/index.html +0 -45
- package/demo/elements/http/request-editor.html +0 -26
- package/demo/elements/http/request-editor.ts +0 -197
- package/demo/elements/http/request-log.html +0 -16
- package/demo/elements/http/request-log.ts +0 -136
- package/demo/elements/http/url-editing.html +0 -17
- package/demo/elements/http/url-editing.ts +0 -112
- package/demo/elements/icons/index.html +0 -81
- package/demo/elements/icons/index.ts +0 -52
- package/demo/elements/index.html +0 -72
- package/demo/elements/mention-textarea/index.html +0 -19
- package/demo/elements/mention-textarea/index.ts +0 -205
- package/demo/elements/navigation/navigation-item.html +0 -49
- package/demo/elements/navigation/navigation-item.ts +0 -131
- package/demo/elements/navigation/navigation.html +0 -20
- package/demo/elements/navigation/navigation.ts +0 -45
- package/demo/elements/project/index.html +0 -29
- package/demo/elements/project/project-run-report.html +0 -20
- package/demo/elements/project/project-run-report.ts +0 -132
- package/demo/elements/project/request-editor.html +0 -23
- package/demo/elements/project/request-editor.ts +0 -232
- package/demo/elements/user/user-avatar.html +0 -17
- package/demo/elements/user/user-avatar.ts +0 -60
- package/demo/env.js +0 -4
- package/demo/index.html +0 -34
- package/demo/layout/index.html +0 -94
- package/demo/layout/index.ts +0 -190
- package/demo/md/DemoStyles.ts +0 -61
- package/demo/md/UiDemoPage.ts +0 -6
- package/demo/md/buttons/button.html +0 -121
- package/demo/md/buttons/button.ts +0 -246
- package/demo/md/buttons/group.html +0 -36
- package/demo/md/buttons/group.ts +0 -171
- package/demo/md/checkbox/index.html +0 -39
- package/demo/md/checkbox/index.ts +0 -220
- package/demo/md/chip/chip.html +0 -70
- package/demo/md/chip/chip.ts +0 -219
- package/demo/md/chip/pawel6c9a.jpg +0 -0
- package/demo/md/collapse/CustomDetail.ts +0 -89
- package/demo/md/collapse/collapse.html +0 -21
- package/demo/md/collapse/collapse.ts +0 -78
- package/demo/md/date-picker/date-picker.ts +0 -336
- package/demo/md/date-picker/index.html +0 -171
- package/demo/md/dialog/confirm-dialog.html +0 -49
- package/demo/md/dialog/confirm-dialog.ts +0 -121
- package/demo/md/dialog/dialog.html +0 -25
- package/demo/md/dialog/dialog.ts +0 -468
- package/demo/md/dropdown-list/index.html +0 -31
- package/demo/md/dropdown-list/index.ts +0 -158
- package/demo/md/icon-button/index.html +0 -122
- package/demo/md/icon-button/index.ts +0 -132
- package/demo/md/index.html +0 -73
- package/demo/md/inputs/input.html +0 -73
- package/demo/md/inputs/input.ts +0 -278
- package/demo/md/inputs/radio.html +0 -39
- package/demo/md/inputs/radio.ts +0 -156
- package/demo/md/inputs/switch.html +0 -45
- package/demo/md/inputs/switch.ts +0 -144
- package/demo/md/list/list.html +0 -65
- package/demo/md/list/list.ts +0 -204
- package/demo/md/listbox/listbox.html +0 -31
- package/demo/md/listbox/listbox.ts +0 -27
- package/demo/md/menu/index.html +0 -19
- package/demo/md/menu/index.ts +0 -514
- package/demo/md/notification/snack.html +0 -21
- package/demo/md/notification/snack.ts +0 -70
- package/demo/md/progress/progress.html +0 -46
- package/demo/md/progress/progress.ts +0 -161
- package/demo/md/segmented-button/index.html +0 -21
- package/demo/md/segmented-button/index.ts +0 -55
- package/demo/md/select/index.html +0 -16
- package/demo/md/select/index.ts +0 -217
- package/demo/md/tabs/tabs.html +0 -40
- package/demo/md/tabs/tabs.ts +0 -214
- package/demo/oauth-popup.html +0 -36
- package/demo/page.css +0 -8
- package/demo/resources/calendar-month.png +0 -0
- package/demo/resources/favorite.png +0 -0
- package/demo/resources/fingerprint.png +0 -0
- package/demo/resources/home-work.png +0 -0
- package/demo/resources/mood.png +0 -0
- package/demo/resources/print.png +0 -0
- package/demo/resources/stars.png +0 -0
- package/demo/resources/theaters.png +0 -0
- package/demo/tsconfig.json +0 -4
- package/eslint.config.js +0 -97
- package/scripts/copy-assets.js +0 -21
- package/scripts/release.js +0 -66
- package/src/demo/DemoPage.ts +0 -169
- package/src/demo/DemoStyles.ts +0 -60
- package/test/README.md +0 -375
- package/test/contextual-menu/ContextMenu.test.ts +0 -760
- package/test/contextual-menu/ContextMenuElement.test.ts +0 -569
- package/test/core/activity.spec.ts +0 -413
- package/test/core/activity_manager.spec.ts +0 -544
- package/test/core/application.spec.ts +0 -218
- package/test/core/fragment.spec.ts +0 -565
- package/test/core/fragment_manager.spec.ts +0 -404
- package/test/core/live_data.spec.ts +0 -558
- package/test/core/renderer.spec.ts +0 -113
- package/test/dom-assertions.test.ts +0 -182
- package/test/elements/MonacoSetup.ts +0 -65
- package/test/elements/authorization/basic-method.test.ts +0 -177
- package/test/elements/authorization/bearer-method.test.ts +0 -143
- package/test/elements/authorization/ntlm-method.test.ts +0 -219
- package/test/elements/authorization/oauth2-client-credentials-method.test.ts +0 -334
- package/test/elements/authorization/oauth2-code-method.test.ts +0 -320
- package/test/elements/authorization/oauth2-custom-grant-method.test.ts +0 -255
- package/test/elements/authorization/oauth2-device-code-method.test.ts +0 -371
- package/test/elements/authorization/oauth2-implicit-method.test.ts +0 -407
- package/test/elements/authorization/oauth2-jwt-method.test.ts +0 -217
- package/test/elements/authorization/oauth2-password-method.test.ts +0 -275
- package/test/elements/authorization/openid-method.test.ts +0 -591
- package/test/elements/autocomplete/autocomplete-input.spec.ts +0 -646
- package/test/elements/code-editor/code-editor.accessibility.test.ts +0 -298
- package/test/elements/code-editor/code-editor.test.ts +0 -574
- package/test/elements/currency/CurrencyPicker.accessibility.test.ts +0 -328
- package/test/elements/currency/CurrencyPicker.core.test.ts +0 -318
- package/test/elements/currency/CurrencyPicker.integration.test.ts +0 -482
- package/test/elements/currency/CurrencyPicker.test.ts +0 -486
- package/test/elements/data-table/DataTable.browser.test.ts +0 -649
- package/test/elements/har/HarUtils.test.ts +0 -45
- package/test/elements/har/HarViewerElement.test.ts +0 -687
- package/test/elements/har/test-data/har1.har +0 -3044
- package/test/elements/highlight/MarkedHighlightElement.test.ts +0 -452
- package/test/elements/highlight/PrismHighlightElement.test.ts +0 -79
- package/test/elements/highlight/PrismHighlighter.test.ts +0 -94
- package/test/elements/highlight/remoteSanitization.md +0 -1
- package/test/elements/highlight/test.md +0 -3
- package/test/elements/highlight/test1.md +0 -3
- package/test/elements/highlight/test2.md +0 -1
- package/test/elements/http/BodyFormdataEditorElement.test.ts +0 -482
- package/test/elements/http/BodyMultipartEditorElement.test.ts +0 -658
- package/test/elements/http/BodyRawEditorElement.test.ts +0 -90
- package/test/elements/http/CertificateAdd.test.ts +0 -457
- package/test/elements/http/HttpAssertions.test.ts +0 -994
- package/test/elements/http/HttpFlows.test.ts +0 -502
- package/test/elements/http/UrlEncodeUtils.test.ts +0 -202
- package/test/elements/layout/SplitItem.test.ts +0 -440
- package/test/elements/layout/SplitLayoutManager.test.ts +0 -1501
- package/test/elements/layout/SplitPanel.test.ts +0 -1109
- package/test/elements/mention-textarea/MentionTextArea.basic.test.ts +0 -114
- package/test/elements/mention-textarea/MentionTextArea.test.ts +0 -613
- package/test/elements/navigation/Navigation.test.ts +0 -120
- package/test/env.ts +0 -15
- package/test/events/EventTypes.test.ts +0 -363
- package/test/events/EventsTestHelpers.ts +0 -16
- package/test/helpers/TestUtils.ts +0 -243
- package/test/helpers/UiMock.ts +0 -185
- package/test/lib/Dom.test.ts +0 -231
- package/test/md/button/UiButton.test.ts +0 -347
- package/test/md/button/UiIconButton.test.ts +0 -155
- package/test/md/chip/UiChip.test.ts +0 -219
- package/test/md/collapse/UiCollapse.test.ts +0 -250
- package/test/md/collapse/flex-layout.test.ts +0 -105
- package/test/md/date-time/DateTime.test.ts +0 -348
- package/test/md/dialog/UiConfirmDialog.test.ts +0 -131
- package/test/md/dialog/UiDialog.test.ts +0 -759
- package/test/md/menu/Menu.test.ts +0 -855
- package/test/md/menu/MenuIntegration.test.ts +0 -426
- package/test/md/menu/MenuItem.test.ts +0 -652
- package/test/md/menu/SubMenu.test.ts +0 -410
- package/test/md/progress/UiCircularProgressElement.test.ts +0 -481
- package/test/md/progress/UiProgressElement.test.ts +0 -117
- package/test/md/progress/UiRangeElement.test.ts +0 -156
- package/test/md/select/Select.test.ts +0 -925
- package/test/plugins/takeScreenshotPlugin.js +0 -35
- package/test/setup.test.ts +0 -217
- package/test/setup.ts +0 -117
- package/test/tsconfig.json +0 -7
- package/web-dev-server.config.js +0 -21
- package/web-test-runner.config.js +0 -90
|
@@ -1,558 +0,0 @@
|
|
|
1
|
-
import { assert } from '@open-wc/testing'
|
|
2
|
-
import sinon from 'sinon'
|
|
3
|
-
import { LiveData } from '../../src/reactive/LiveData.js'
|
|
4
|
-
|
|
5
|
-
describe('LiveData Basic', () => {
|
|
6
|
-
it('should initialize with the given object', () => {
|
|
7
|
-
const data = { name: 'John Doe', age: 30 }
|
|
8
|
-
const liveData = new LiveData(data)
|
|
9
|
-
assert.deepEqual(liveData.value, data)
|
|
10
|
-
})
|
|
11
|
-
|
|
12
|
-
it('should update the value when a property is changed', () => {
|
|
13
|
-
const data = { name: 'John Doe', age: 30 }
|
|
14
|
-
const liveData = new LiveData(data)
|
|
15
|
-
liveData.value.name = 'Jane Doe'
|
|
16
|
-
assert.equal(liveData.value.name, 'Jane Doe')
|
|
17
|
-
})
|
|
18
|
-
|
|
19
|
-
it('should dispatch an update event when a property is changed', () => {
|
|
20
|
-
const data = { name: 'John Doe', age: 30 }
|
|
21
|
-
const liveData = new LiveData(data)
|
|
22
|
-
const spy = sinon.spy()
|
|
23
|
-
liveData.addEventListener('update', spy)
|
|
24
|
-
|
|
25
|
-
liveData.value.name = 'Jane Doe'
|
|
26
|
-
|
|
27
|
-
assert.isTrue(spy.calledOnce)
|
|
28
|
-
const args = spy.args[0][0].detail
|
|
29
|
-
assert.equal(args.path, 'name')
|
|
30
|
-
assert.equal(args.value, 'Jane Doe')
|
|
31
|
-
})
|
|
32
|
-
|
|
33
|
-
it('should track the last changed path', () => {
|
|
34
|
-
const data = { name: 'John Doe', address: { city: 'New York' } }
|
|
35
|
-
const liveData = new LiveData(data)
|
|
36
|
-
|
|
37
|
-
liveData.value.name = 'Jane Doe'
|
|
38
|
-
assert.equal(liveData.lastChangedPath, 'name')
|
|
39
|
-
liveData.value.address.city = 'Los Angeles'
|
|
40
|
-
assert.equal(liveData.lastChangedPath, 'address.city')
|
|
41
|
-
})
|
|
42
|
-
|
|
43
|
-
it('should handle nested objects', () => {
|
|
44
|
-
const data = { user: { name: 'John Doe' } }
|
|
45
|
-
const liveData = new LiveData(data)
|
|
46
|
-
const spy = sinon.spy()
|
|
47
|
-
liveData.addEventListener('update', spy)
|
|
48
|
-
|
|
49
|
-
liveData.value.user.name = 'Jane Doe'
|
|
50
|
-
const args = spy.args[0][0].detail
|
|
51
|
-
assert.equal(args.path, 'user.name')
|
|
52
|
-
assert.equal(args.value, 'Jane Doe')
|
|
53
|
-
})
|
|
54
|
-
|
|
55
|
-
it('should handle arrays', () => {
|
|
56
|
-
const data = { items: ['apple', 'banana'] }
|
|
57
|
-
const liveData = new LiveData(data)
|
|
58
|
-
|
|
59
|
-
const spy = sinon.spy()
|
|
60
|
-
liveData.addEventListener('update', spy)
|
|
61
|
-
|
|
62
|
-
liveData.value.items.push('orange')
|
|
63
|
-
|
|
64
|
-
assert.equal(spy.callCount, 1, 'called once for the push')
|
|
65
|
-
const args = spy.args[0][0].detail
|
|
66
|
-
assert.equal(args.path, 'items.2', 'path is correct')
|
|
67
|
-
assert.equal(args.value, 'orange', 'value is correct')
|
|
68
|
-
})
|
|
69
|
-
|
|
70
|
-
it('should handle sets', () => {
|
|
71
|
-
const data = { set: new Set(['apple', 'banana']) }
|
|
72
|
-
const liveData = new LiveData(data)
|
|
73
|
-
|
|
74
|
-
const spy = sinon.spy()
|
|
75
|
-
liveData.addEventListener('update', spy)
|
|
76
|
-
|
|
77
|
-
liveData.value.set.add('orange')
|
|
78
|
-
|
|
79
|
-
assert.equal(spy.callCount, 1, 'called once for the add')
|
|
80
|
-
const args = spy.args[0][0].detail
|
|
81
|
-
assert.equal(args.path, 'set', 'path is correct')
|
|
82
|
-
assert.deepEqual(args.value, data.set, 'value is correct')
|
|
83
|
-
})
|
|
84
|
-
|
|
85
|
-
it('should handle maps', () => {
|
|
86
|
-
const data = { map: new Map([['a', 'b']]) }
|
|
87
|
-
const liveData = new LiveData(data)
|
|
88
|
-
|
|
89
|
-
const spy = sinon.spy()
|
|
90
|
-
liveData.addEventListener('update', spy)
|
|
91
|
-
|
|
92
|
-
liveData.value.map.set('c', 'd')
|
|
93
|
-
|
|
94
|
-
assert.equal(spy.callCount, 1, 'called once for the add')
|
|
95
|
-
const args = spy.args[0][0].detail
|
|
96
|
-
assert.equal(args.path, 'map', 'path is correct')
|
|
97
|
-
assert.deepEqual(args.value, data.map, 'value is correct')
|
|
98
|
-
})
|
|
99
|
-
|
|
100
|
-
it('should handle arrays with array index', () => {
|
|
101
|
-
const data = { items: ['apple', 'banana'] }
|
|
102
|
-
const liveData = new LiveData(data)
|
|
103
|
-
|
|
104
|
-
const spy = sinon.spy()
|
|
105
|
-
liveData.addEventListener('update', spy)
|
|
106
|
-
|
|
107
|
-
liveData.value.items[0] = 'orange'
|
|
108
|
-
|
|
109
|
-
assert.equal(spy.callCount, 1)
|
|
110
|
-
const args = spy.args[0][0].detail
|
|
111
|
-
assert.equal(args.path, 'items.0')
|
|
112
|
-
assert.equal(args.value, 'orange')
|
|
113
|
-
})
|
|
114
|
-
|
|
115
|
-
// it('should call parent callback when child LiveData is updated', () => {
|
|
116
|
-
// const childData = new LiveData({ value: 'Initial Value' })
|
|
117
|
-
// const parentData = { child: childData }
|
|
118
|
-
// const parentLiveData = new LiveData(parentData)
|
|
119
|
-
|
|
120
|
-
// const spy = sinon.spy()
|
|
121
|
-
// parentLiveData.addEventListener('update', spy)
|
|
122
|
-
|
|
123
|
-
// childData.value.value = 'New Value'
|
|
124
|
-
|
|
125
|
-
// assert.equal(spy.callCount, 1)
|
|
126
|
-
// const args = spy.args[0][0].detail
|
|
127
|
-
// assert.equal(args.path, 'child.value')
|
|
128
|
-
// assert.equal(args.value, 'New Value')
|
|
129
|
-
// })
|
|
130
|
-
|
|
131
|
-
// it('should unhook child from parent when child LiveData is replaced', () => {
|
|
132
|
-
// const childData = new LiveData({ value: 'Initial Value' })
|
|
133
|
-
// const parentData = new LiveData({ child: childData })
|
|
134
|
-
// let parentUpdateCount = 0
|
|
135
|
-
|
|
136
|
-
// parentData.addEventListener('update', (event) => {
|
|
137
|
-
// parentUpdateCount++
|
|
138
|
-
// if (parentUpdateCount === 1) {
|
|
139
|
-
// assert.equal((event as CustomEvent).detail.path, 'child.value')
|
|
140
|
-
// } else if (parentUpdateCount === 2) {
|
|
141
|
-
// assert.equal((event as CustomEvent).detail.path, 'child')
|
|
142
|
-
// }
|
|
143
|
-
// })
|
|
144
|
-
|
|
145
|
-
// childData.value.value = 'New Value'
|
|
146
|
-
|
|
147
|
-
// // @ts-expect-error For testing
|
|
148
|
-
// parentData.value.child = { value: 'New Child' }
|
|
149
|
-
// childData.value.value = 'Another New Value'
|
|
150
|
-
|
|
151
|
-
// // the first one is when changing the name
|
|
152
|
-
// // and the second happens when replacing the child.
|
|
153
|
-
// assert.equal(parentUpdateCount, 2)
|
|
154
|
-
// })
|
|
155
|
-
|
|
156
|
-
// it('should unhook child from parent when child LiveData is removed', () => {
|
|
157
|
-
// const childData = new LiveData({ value: 'Initial Value' })
|
|
158
|
-
// const parentData = { child: childData }
|
|
159
|
-
// const parentLiveData = new LiveData(parentData)
|
|
160
|
-
// let parentUpdateCount = 0
|
|
161
|
-
|
|
162
|
-
// parentLiveData.addEventListener('update', (event) => {
|
|
163
|
-
// parentUpdateCount++
|
|
164
|
-
// if (parentUpdateCount === 1) {
|
|
165
|
-
// assert.equal((event as CustomEvent).detail.path, 'child.value')
|
|
166
|
-
// }
|
|
167
|
-
// })
|
|
168
|
-
|
|
169
|
-
// childData.value.value = 'New Value'
|
|
170
|
-
|
|
171
|
-
// // @ts-expect-error This is for testing.
|
|
172
|
-
// delete parentLiveData.value.child
|
|
173
|
-
// childData.value.value = 'Another New Value'
|
|
174
|
-
|
|
175
|
-
// assert.equal(parentUpdateCount, 1)
|
|
176
|
-
// })
|
|
177
|
-
|
|
178
|
-
// it('should unhook child from parent when removeParentCallback is called', () => {
|
|
179
|
-
// const childData = new LiveData({ value: 'Initial Value' })
|
|
180
|
-
// const parentData = { child: childData }
|
|
181
|
-
// const parentLiveData = new LiveData(parentData)
|
|
182
|
-
// let parentUpdateCount = 0
|
|
183
|
-
|
|
184
|
-
// parentLiveData.addEventListener('update', (event) => {
|
|
185
|
-
// parentUpdateCount++
|
|
186
|
-
// if (parentUpdateCount === 1) {
|
|
187
|
-
// assert.equal((event as CustomEvent).detail.path, 'child.value')
|
|
188
|
-
// }
|
|
189
|
-
// })
|
|
190
|
-
|
|
191
|
-
// childData.value.value = 'New Value'
|
|
192
|
-
|
|
193
|
-
// childData.removeParentCallback(parentLiveData)
|
|
194
|
-
// childData.value.value = 'Another New Value'
|
|
195
|
-
|
|
196
|
-
// assert.equal(parentUpdateCount, 1)
|
|
197
|
-
// })
|
|
198
|
-
|
|
199
|
-
// it('should filter updates with observeProperties', () => {
|
|
200
|
-
// const data = { name: 'John Doe', age: 30, city: 'New York' }
|
|
201
|
-
// const liveData = new LiveData(data)
|
|
202
|
-
|
|
203
|
-
// const spy = sinon.spy()
|
|
204
|
-
// const unsubscribe = liveData.observeProperties(['name', 'age'], spy)
|
|
205
|
-
|
|
206
|
-
// liveData.value.name = 'Jane Doe'
|
|
207
|
-
// liveData.value.age = 31
|
|
208
|
-
// liveData.value.city = 'Los Angeles'
|
|
209
|
-
// unsubscribe()
|
|
210
|
-
// liveData.value.name = 'Another New Name' // Should not trigger the callback
|
|
211
|
-
// assert.equal(spy.callCount, 2, 'has only requested changes')
|
|
212
|
-
// const args1 = spy.args[0][0]
|
|
213
|
-
// assert.equal(args1.path, 'name')
|
|
214
|
-
// assert.equal(args1.value, 'Jane Doe')
|
|
215
|
-
// assert.equal(args1.previousValue, 'John Doe')
|
|
216
|
-
// const args2 = spy.args[1][0]
|
|
217
|
-
// assert.equal(args2.path, 'age')
|
|
218
|
-
// assert.equal(args2.value, 31)
|
|
219
|
-
// assert.equal(args2.previousValue, 30)
|
|
220
|
-
// })
|
|
221
|
-
|
|
222
|
-
// it('should filter updates with observeProperties and deep properties', () => {
|
|
223
|
-
// const data = { user: { address: { city: 'New York' } } }
|
|
224
|
-
// const liveData = new LiveData(data)
|
|
225
|
-
|
|
226
|
-
// const spy = sinon.spy()
|
|
227
|
-
// const unsubscribe = liveData.observeProperties(['user.address.city'], spy)
|
|
228
|
-
|
|
229
|
-
// liveData.value.user.address.city = 'Los Angeles'
|
|
230
|
-
// unsubscribe()
|
|
231
|
-
// assert.equal(spy.callCount, 1, 'has only requested changes')
|
|
232
|
-
// const args1 = spy.args[0][0]
|
|
233
|
-
// assert.equal(args1.path, 'user.address.city')
|
|
234
|
-
// assert.equal(args1.value, 'Los Angeles')
|
|
235
|
-
// assert.equal(args1.previousValue, 'New York')
|
|
236
|
-
// })
|
|
237
|
-
|
|
238
|
-
// it('should filter updates with observeProperties and wildcard', () => {
|
|
239
|
-
// const data = { items: ['apple', 'banana'] }
|
|
240
|
-
// const liveData = new LiveData(data)
|
|
241
|
-
|
|
242
|
-
// const spy = sinon.spy()
|
|
243
|
-
// const unsubscribe = liveData.observeProperties(['items.*'], spy)
|
|
244
|
-
|
|
245
|
-
// liveData.value.items[0] = 'orange'
|
|
246
|
-
// liveData.value.items.push('pear')
|
|
247
|
-
// unsubscribe()
|
|
248
|
-
|
|
249
|
-
// assert.equal(spy.callCount, 2, 'has only requested changes')
|
|
250
|
-
// const args1 = spy.args[0][0]
|
|
251
|
-
// assert.equal(args1.path, 'items.0')
|
|
252
|
-
// assert.equal(args1.value, 'orange')
|
|
253
|
-
// assert.equal(args1.previousValue, 'apple')
|
|
254
|
-
// const args2 = spy.args[1][0]
|
|
255
|
-
// assert.equal(args2.path, 'items.2')
|
|
256
|
-
// assert.equal(args2.value, 'pear')
|
|
257
|
-
// assert.equal(args2.previousValue, undefined)
|
|
258
|
-
// })
|
|
259
|
-
|
|
260
|
-
it('should return correct value using get() with deep path', () => {
|
|
261
|
-
const data = { user: { address: { city: 'New York' } } }
|
|
262
|
-
const liveData = new LiveData(data)
|
|
263
|
-
const city = liveData.get('user.address.city')
|
|
264
|
-
assert.equal(city, 'New York')
|
|
265
|
-
})
|
|
266
|
-
|
|
267
|
-
it('should return correct value using get() with array index', () => {
|
|
268
|
-
const data = { items: ['apple', 'banana'] }
|
|
269
|
-
const liveData = new LiveData(data)
|
|
270
|
-
const item0 = liveData.get('items.0')
|
|
271
|
-
assert.equal(item0, 'apple')
|
|
272
|
-
|
|
273
|
-
const item1 = liveData.get('items.1')
|
|
274
|
-
assert.equal(item1, 'banana')
|
|
275
|
-
})
|
|
276
|
-
|
|
277
|
-
it('should return undefined using get() with wrong path', () => {
|
|
278
|
-
const data = { user: { address: { city: 'New York' } } }
|
|
279
|
-
const liveData = new LiveData(data)
|
|
280
|
-
const street = liveData.get('user.address.street')
|
|
281
|
-
assert.isUndefined(street)
|
|
282
|
-
})
|
|
283
|
-
|
|
284
|
-
// it('should handle replacing the entire object with set', () => {
|
|
285
|
-
// const initialData = { a: 1 } as { a?: number; b?: number }
|
|
286
|
-
// const liveData = new LiveData(initialData)
|
|
287
|
-
|
|
288
|
-
// const spy = sinon.spy()
|
|
289
|
-
// liveData.addEventListener('update', spy)
|
|
290
|
-
|
|
291
|
-
// liveData.set({ b: 2 })
|
|
292
|
-
// assert.isTrue(spy.calledOnce)
|
|
293
|
-
// const args = spy.args[0][0].detail
|
|
294
|
-
// assert.equal(args.path, '')
|
|
295
|
-
// assert.deepEqual(args.value, { b: 2 })
|
|
296
|
-
// assert.deepEqual(args.previousValue, { a: 1 })
|
|
297
|
-
// })
|
|
298
|
-
|
|
299
|
-
// it('should handle replacing the entire object with set and trigger observeProperties', () => {
|
|
300
|
-
// const initialData = { a: 1 } as { a?: number; b?: number }
|
|
301
|
-
// const liveData = new LiveData(initialData)
|
|
302
|
-
|
|
303
|
-
// const spy = sinon.spy()
|
|
304
|
-
// const unsubscribe = liveData.observeProperties(['a', 'b'], spy)
|
|
305
|
-
|
|
306
|
-
// liveData.set({ b: 2 })
|
|
307
|
-
// liveData.value.b = 3
|
|
308
|
-
// unsubscribe()
|
|
309
|
-
|
|
310
|
-
// assert.equal(spy.callCount, 1, 'has only requested changes')
|
|
311
|
-
// const args = spy.args[0][0]
|
|
312
|
-
// assert.equal(args.path, 'b')
|
|
313
|
-
// assert.equal(args.value, 3)
|
|
314
|
-
// assert.equal(args.previousValue, 2)
|
|
315
|
-
// })
|
|
316
|
-
})
|
|
317
|
-
|
|
318
|
-
describe('LiveData Advanced', () => {
|
|
319
|
-
beforeEach(() => {
|
|
320
|
-
sinon.restore()
|
|
321
|
-
})
|
|
322
|
-
|
|
323
|
-
// it('createRecursiveProxy - Correct Passing of parentLiveData', () => {
|
|
324
|
-
// const parentLiveData = new LiveData({
|
|
325
|
-
// level1: {
|
|
326
|
-
// level2: {
|
|
327
|
-
// level3: new LiveData({ value: 'Initial Value' }),
|
|
328
|
-
// },
|
|
329
|
-
// },
|
|
330
|
-
// })
|
|
331
|
-
|
|
332
|
-
// const spy = sinon.spy()
|
|
333
|
-
// parentLiveData.addEventListener('update', spy)
|
|
334
|
-
// parentLiveData.value.level1.level2.level3.value.value = 'New Value'
|
|
335
|
-
|
|
336
|
-
// assert.isTrue(spy.calledOnce)
|
|
337
|
-
// const args = spy.args[0][0].detail
|
|
338
|
-
// assert.equal(args.path, 'level1.level2.level3.value')
|
|
339
|
-
// assert.equal(args.value, 'New Value')
|
|
340
|
-
// })
|
|
341
|
-
|
|
342
|
-
// it('createRecursiveProxy - Multiple Child LiveData', () => {
|
|
343
|
-
// const parentLiveData = new LiveData({
|
|
344
|
-
// child1: new LiveData({ value: 'Initial Value 1' }),
|
|
345
|
-
// child2: new LiveData({ value: 'Initial Value 2' }),
|
|
346
|
-
// })
|
|
347
|
-
// const spy = sinon.spy()
|
|
348
|
-
// parentLiveData.addEventListener('update', spy)
|
|
349
|
-
|
|
350
|
-
// parentLiveData.value.child1.value.value = 'New Value 1'
|
|
351
|
-
// assert.isTrue(spy.calledOnce)
|
|
352
|
-
// let args = spy.args[0][0].detail
|
|
353
|
-
// assert.equal(args.path, 'child1.value')
|
|
354
|
-
// assert.equal(args.value, 'New Value 1')
|
|
355
|
-
|
|
356
|
-
// parentLiveData.value.child2.value.value = 'New Value 2'
|
|
357
|
-
// assert.equal(spy.callCount, 2)
|
|
358
|
-
// args = spy.args[1][0].detail
|
|
359
|
-
// assert.equal(args.path, 'child2.value')
|
|
360
|
-
// assert.equal(args.value, 'New Value 2')
|
|
361
|
-
// })
|
|
362
|
-
|
|
363
|
-
it('createRecursiveProxy - Objects inside LiveData', () => {
|
|
364
|
-
const parentLiveData = new LiveData({
|
|
365
|
-
child1: { value: 'Initial Value 1' },
|
|
366
|
-
child2: { nested: { value: 'Initial Nested Value 2' } },
|
|
367
|
-
})
|
|
368
|
-
const spy = sinon.spy()
|
|
369
|
-
parentLiveData.addEventListener('update', spy)
|
|
370
|
-
|
|
371
|
-
parentLiveData.value.child1.value = 'New Value 1'
|
|
372
|
-
assert.isTrue(spy.calledOnce)
|
|
373
|
-
let args = spy.args[0][0].detail
|
|
374
|
-
assert.equal(args.path, 'child1.value')
|
|
375
|
-
assert.equal(args.value, 'New Value 1')
|
|
376
|
-
|
|
377
|
-
parentLiveData.value.child2.nested.value = 'New Value 2'
|
|
378
|
-
assert.equal(spy.callCount, 2)
|
|
379
|
-
args = spy.args[1][0].detail
|
|
380
|
-
assert.equal(args.path, 'child2.nested.value')
|
|
381
|
-
assert.equal(args.value, 'New Value 2')
|
|
382
|
-
})
|
|
383
|
-
it('observeProperties - Unsubscribe Handling', () => {
|
|
384
|
-
const data = { name: 'John Doe' }
|
|
385
|
-
const liveData = new LiveData(data)
|
|
386
|
-
const spy = sinon.spy()
|
|
387
|
-
|
|
388
|
-
const unsubscribe = liveData.observeProperties(['name'], spy)
|
|
389
|
-
liveData.value.name = 'Jane Doe'
|
|
390
|
-
assert.isTrue(spy.calledOnce)
|
|
391
|
-
|
|
392
|
-
unsubscribe()
|
|
393
|
-
liveData.value.name = 'Another New Name' // Should not trigger the callback
|
|
394
|
-
assert.isTrue(spy.calledOnce)
|
|
395
|
-
})
|
|
396
|
-
|
|
397
|
-
// it('set() - Correct Behavior with Existing Child LiveData', () => {
|
|
398
|
-
// const childData = new LiveData({ value: 'Initial Value' })
|
|
399
|
-
// const parentData = new LiveData({ child: childData })
|
|
400
|
-
// const spy = sinon.spy()
|
|
401
|
-
// parentData.addEventListener('update', spy)
|
|
402
|
-
|
|
403
|
-
// parentData.value.child.value.value = 'New Value'
|
|
404
|
-
// assert.equal(spy.callCount, 1)
|
|
405
|
-
|
|
406
|
-
// // @ts-expect-error It is for testing.
|
|
407
|
-
// parentData.set({ child: { value: 'New Child' } })
|
|
408
|
-
// childData.value.value = 'Another New Value'
|
|
409
|
-
// // setting value should not trigger any change.
|
|
410
|
-
|
|
411
|
-
// assert.equal(spy.callCount, 2)
|
|
412
|
-
// assert.equal(spy.args[0][0].detail.path, 'child.value')
|
|
413
|
-
// assert.equal(spy.args[0][0].detail.value, 'New Value')
|
|
414
|
-
// assert.equal(spy.args[1][0].detail.path, '')
|
|
415
|
-
// assert.deepEqual(spy.args[1][0].detail.value, { child: { value: 'New Child' } })
|
|
416
|
-
// })
|
|
417
|
-
|
|
418
|
-
it('set() with nested objects', () => {
|
|
419
|
-
const data = { user: { address: { city: 'New York' } } }
|
|
420
|
-
const liveData = new LiveData(data)
|
|
421
|
-
|
|
422
|
-
const spy = sinon.spy()
|
|
423
|
-
liveData.addEventListener('update', spy)
|
|
424
|
-
liveData.set({ user: { address: { city: 'New York2' } } })
|
|
425
|
-
assert.equal(spy.callCount, 1)
|
|
426
|
-
const args = spy.args[0][0].detail
|
|
427
|
-
assert.equal(args.path, '')
|
|
428
|
-
assert.deepEqual(args.value, { user: { address: { city: 'New York2' } } })
|
|
429
|
-
})
|
|
430
|
-
|
|
431
|
-
// it('Array length check', () => {
|
|
432
|
-
// const data = { items: ['apple', 'banana'] }
|
|
433
|
-
// const liveData = new LiveData(data)
|
|
434
|
-
|
|
435
|
-
// const spy = sinon.spy()
|
|
436
|
-
// liveData.addEventListener('update', spy)
|
|
437
|
-
|
|
438
|
-
// liveData.value.items.push('orange')
|
|
439
|
-
// assert.equal(spy.callCount, 1)
|
|
440
|
-
// assert.equal(spy.args[0][0].detail.path, 'items.2')
|
|
441
|
-
|
|
442
|
-
// liveData.value.items.length = 0
|
|
443
|
-
// assert.equal(spy.callCount, 1, 'no extra call for the `length`')
|
|
444
|
-
// })
|
|
445
|
-
|
|
446
|
-
it('get() with non existing nested properties', () => {
|
|
447
|
-
const data = { user: { address: {} } }
|
|
448
|
-
const liveData = new LiveData(data)
|
|
449
|
-
const city = liveData.get('user.address.city')
|
|
450
|
-
assert.isUndefined(city)
|
|
451
|
-
})
|
|
452
|
-
|
|
453
|
-
it('set() - should unhook LiveData instances in replaced object', () => {
|
|
454
|
-
const childData1 = new LiveData({ value: 'Initial Value 1' })
|
|
455
|
-
const childData2 = new LiveData({ value: 'Initial Value 2' })
|
|
456
|
-
const initialData = {
|
|
457
|
-
child1: childData1,
|
|
458
|
-
child2: childData2,
|
|
459
|
-
}
|
|
460
|
-
const liveData = new LiveData(initialData)
|
|
461
|
-
|
|
462
|
-
const child1Spy = sinon.spy()
|
|
463
|
-
const child2Spy = sinon.spy()
|
|
464
|
-
|
|
465
|
-
liveData.addEventListener('update', child1Spy)
|
|
466
|
-
liveData.addEventListener('update', child2Spy)
|
|
467
|
-
|
|
468
|
-
// We need to create a nested object to test the recursivelyRemoveParentCallbacks
|
|
469
|
-
const newObject = {
|
|
470
|
-
child1: { value: 'test' },
|
|
471
|
-
child2: { value: 'test' },
|
|
472
|
-
}
|
|
473
|
-
|
|
474
|
-
// @ts-expect-error it is for testing
|
|
475
|
-
liveData.set(newObject)
|
|
476
|
-
|
|
477
|
-
childData1.value.value = 'Changed 1'
|
|
478
|
-
childData2.value.value = 'Changed 2'
|
|
479
|
-
|
|
480
|
-
assert.equal(child1Spy.callCount, 1)
|
|
481
|
-
assert.equal(child2Spy.callCount, 1)
|
|
482
|
-
})
|
|
483
|
-
|
|
484
|
-
it('Should correctly handle multiple observeProperties on the same property', () => {
|
|
485
|
-
const data = { value: 0 }
|
|
486
|
-
const liveData = new LiveData(data)
|
|
487
|
-
|
|
488
|
-
const spy1 = sinon.spy()
|
|
489
|
-
const spy2 = sinon.spy()
|
|
490
|
-
|
|
491
|
-
liveData.observeProperties(['value'], spy1)
|
|
492
|
-
liveData.observeProperties(['value'], spy2)
|
|
493
|
-
|
|
494
|
-
liveData.value.value = 1
|
|
495
|
-
|
|
496
|
-
assert.equal(spy1.callCount, 1)
|
|
497
|
-
assert.equal(spy2.callCount, 1)
|
|
498
|
-
assert.equal(spy1.args[0][0].value, 1)
|
|
499
|
-
assert.equal(spy2.args[0][0].value, 1)
|
|
500
|
-
})
|
|
501
|
-
|
|
502
|
-
it('Should correctly handle multiple observeProperties on different properties', () => {
|
|
503
|
-
const data = { value1: 0, value2: 0 }
|
|
504
|
-
const liveData = new LiveData(data)
|
|
505
|
-
|
|
506
|
-
const spy1 = sinon.spy()
|
|
507
|
-
const spy2 = sinon.spy()
|
|
508
|
-
|
|
509
|
-
liveData.observeProperties(['value1'], spy1)
|
|
510
|
-
liveData.observeProperties(['value2'], spy2)
|
|
511
|
-
|
|
512
|
-
liveData.value.value1 = 1
|
|
513
|
-
liveData.value.value2 = 2
|
|
514
|
-
|
|
515
|
-
assert.equal(spy1.callCount, 1)
|
|
516
|
-
assert.equal(spy2.callCount, 1)
|
|
517
|
-
assert.equal(spy1.args[0][0].value, 1)
|
|
518
|
-
assert.equal(spy2.args[0][0].value, 2)
|
|
519
|
-
})
|
|
520
|
-
|
|
521
|
-
it('Should handle setting null', () => {
|
|
522
|
-
const liveData = new LiveData({ value: 0 })
|
|
523
|
-
const spy = sinon.spy()
|
|
524
|
-
liveData.addEventListener('update', spy)
|
|
525
|
-
// @ts-expect-error it is for testing
|
|
526
|
-
liveData.value.value = null
|
|
527
|
-
assert.equal(spy.callCount, 1)
|
|
528
|
-
assert.equal(spy.args[0][0].detail.value, null)
|
|
529
|
-
})
|
|
530
|
-
it('Should handle setting undefined', () => {
|
|
531
|
-
const liveData = new LiveData({ value: 0 })
|
|
532
|
-
const spy = sinon.spy()
|
|
533
|
-
liveData.addEventListener('update', spy)
|
|
534
|
-
// @ts-expect-error it is for testing
|
|
535
|
-
liveData.value.value = undefined
|
|
536
|
-
assert.equal(spy.callCount, 1)
|
|
537
|
-
assert.isUndefined(spy.args[0][0].detail.value)
|
|
538
|
-
})
|
|
539
|
-
it('Should handle setting null nested', () => {
|
|
540
|
-
const liveData = new LiveData({ user: { name: 'test' } })
|
|
541
|
-
const spy = sinon.spy()
|
|
542
|
-
liveData.addEventListener('update', spy)
|
|
543
|
-
// @ts-expect-error it is for testing
|
|
544
|
-
liveData.value.user.name = null
|
|
545
|
-
assert.equal(spy.callCount, 1)
|
|
546
|
-
assert.equal(spy.args[0][0].detail.value, null)
|
|
547
|
-
})
|
|
548
|
-
|
|
549
|
-
it('Should handle setting undefined nested', () => {
|
|
550
|
-
const liveData = new LiveData({ user: { name: 'test' } })
|
|
551
|
-
const spy = sinon.spy()
|
|
552
|
-
liveData.addEventListener('update', spy)
|
|
553
|
-
// @ts-expect-error it is for testing
|
|
554
|
-
liveData.value.user.name = undefined
|
|
555
|
-
assert.equal(spy.callCount, 1)
|
|
556
|
-
assert.isUndefined(spy.args[0][0].detail.value)
|
|
557
|
-
})
|
|
558
|
-
})
|
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
import { html } from 'lit'
|
|
2
|
-
import { assert, nextFrame } from '@open-wc/testing'
|
|
3
|
-
import sinon from 'sinon'
|
|
4
|
-
import { ApplicationRenderer } from '../../src/core/renderer/ApplicationRenderer.js'
|
|
5
|
-
import { type Application } from '../../src/core/Application.js'
|
|
6
|
-
import { FragmentRenderer } from '../../src/core/renderer/FragmentRenderer.js'
|
|
7
|
-
import { Renderer } from '../../src/core/renderer/Renderer.js'
|
|
8
|
-
import { type Fragment } from '../../src/core/Fragment.js'
|
|
9
|
-
|
|
10
|
-
describe('Renderer', () => {
|
|
11
|
-
class TestRenderer extends Renderer {
|
|
12
|
-
public renderCalled = false
|
|
13
|
-
public renderArgs: unknown[] = []
|
|
14
|
-
protected renderer(): void {
|
|
15
|
-
this.renderCalled = true
|
|
16
|
-
// eslint-disable-next-line prefer-rest-params
|
|
17
|
-
this.renderArgs = [...arguments]
|
|
18
|
-
this.resolveUpdatePromise()
|
|
19
|
-
}
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
it('should set renderRoot from HTMLElement', () => {
|
|
23
|
-
const el = document.createElement('div')
|
|
24
|
-
const renderer = new TestRenderer()
|
|
25
|
-
renderer.setRenderRoot(el)
|
|
26
|
-
assert.strictEqual(renderer.renderRoot, el)
|
|
27
|
-
})
|
|
28
|
-
|
|
29
|
-
it('should set renderRoot from selector', () => {
|
|
30
|
-
const el = document.createElement('div')
|
|
31
|
-
el.id = 'test-root'
|
|
32
|
-
document.body.appendChild(el)
|
|
33
|
-
const renderer = new TestRenderer()
|
|
34
|
-
renderer.setRenderRoot('#test-root')
|
|
35
|
-
assert.strictEqual(renderer.renderRoot, el)
|
|
36
|
-
document.body.removeChild(el)
|
|
37
|
-
})
|
|
38
|
-
|
|
39
|
-
it('should call renderer() on requestUpdate()', () => {
|
|
40
|
-
const renderer = new TestRenderer()
|
|
41
|
-
const spy = sinon.spy(renderer as unknown as { renderer: () => void }, 'renderer')
|
|
42
|
-
renderer.requestUpdate()
|
|
43
|
-
// Wait for animation frame
|
|
44
|
-
return new Promise<void>((resolve) => {
|
|
45
|
-
requestAnimationFrame(() => {
|
|
46
|
-
assert.isTrue(spy.calledOnce)
|
|
47
|
-
resolve()
|
|
48
|
-
})
|
|
49
|
-
})
|
|
50
|
-
})
|
|
51
|
-
|
|
52
|
-
it('should not schedule multiple renders if already rendering', async () => {
|
|
53
|
-
const renderer = new TestRenderer()
|
|
54
|
-
renderer.requestUpdate()
|
|
55
|
-
const spy = sinon.spy(renderer as unknown as { renderer: () => void }, 'renderer')
|
|
56
|
-
renderer.requestUpdate()
|
|
57
|
-
assert.isTrue(spy.notCalled)
|
|
58
|
-
})
|
|
59
|
-
|
|
60
|
-
it('should clear root with _clearRoot()', () => {
|
|
61
|
-
const el = document.createElement('div')
|
|
62
|
-
el.appendChild(document.createElement('span'))
|
|
63
|
-
const renderer = new TestRenderer()
|
|
64
|
-
renderer['_clearRoot'](el)
|
|
65
|
-
assert.strictEqual(el.childNodes.length, 0)
|
|
66
|
-
})
|
|
67
|
-
|
|
68
|
-
it('should resolve updateComplete after _render()', async () => {
|
|
69
|
-
const el = document.createElement('div')
|
|
70
|
-
const renderer = new TestRenderer()
|
|
71
|
-
renderer.setRenderRoot(el)
|
|
72
|
-
renderer.requestUpdate()
|
|
73
|
-
await renderer.updateComplete
|
|
74
|
-
assert.isFalse(renderer.firstRendered) // firstRenderedFlag is not set in TestRenderer
|
|
75
|
-
})
|
|
76
|
-
})
|
|
77
|
-
|
|
78
|
-
describe('ApplicationRenderer', () => {
|
|
79
|
-
it('should call _handleFirstRender and _render', async () => {
|
|
80
|
-
const app = {
|
|
81
|
-
onFirstRender: sinon.spy(),
|
|
82
|
-
onRendered: sinon.spy(),
|
|
83
|
-
manager: { getTopActivity: () => null },
|
|
84
|
-
render: () => html`<div>app</div>`,
|
|
85
|
-
}
|
|
86
|
-
const renderer = new ApplicationRenderer(app as unknown as Application)
|
|
87
|
-
const root = document.createElement('div')
|
|
88
|
-
renderer.setRenderRoot(root)
|
|
89
|
-
const spyRender = sinon.spy(renderer as unknown as { _render: () => void }, '_render')
|
|
90
|
-
renderer['renderer']()
|
|
91
|
-
await nextFrame()
|
|
92
|
-
assert.isTrue(app.onFirstRender.called, 'onFirstRender should be called')
|
|
93
|
-
assert.isTrue(app.onRendered.called, 'onRendered should be called')
|
|
94
|
-
assert.isTrue(spyRender.called, '_render should be called')
|
|
95
|
-
})
|
|
96
|
-
})
|
|
97
|
-
|
|
98
|
-
describe('FragmentRenderer', () => {
|
|
99
|
-
it('should call _clearRoot and _render on first render', async () => {
|
|
100
|
-
const fragment = {
|
|
101
|
-
getSingleVisibleFragment: () => null,
|
|
102
|
-
render: () => html`<div>fragment</div>`,
|
|
103
|
-
onFirstRender: sinon.spy(),
|
|
104
|
-
}
|
|
105
|
-
const renderer = new FragmentRenderer(fragment as unknown as Fragment)
|
|
106
|
-
const root = document.createElement('div')
|
|
107
|
-
renderer.setRenderRoot(root)
|
|
108
|
-
renderer['renderer']()
|
|
109
|
-
await nextFrame()
|
|
110
|
-
assert.isTrue(fragment.onFirstRender.called, 'onFirstRender should be called')
|
|
111
|
-
assert.strictEqual(root.childElementCount, 1, 'Root should have one child after rendering')
|
|
112
|
-
})
|
|
113
|
-
})
|