vsn 0.1.125 → 0.1.127
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/demo/demo.html +4 -8
- package/demo/examples/component-slots.html +16 -22
- package/demo/examples/loop.html +21 -0
- package/demo/resources/xhr-test-component.html +4 -0
- package/demo/vsn.js +2 -2
- package/dist/AST/ElementQueryNode.d.ts +2 -1
- package/dist/AST/ElementQueryNode.js +5 -5
- package/dist/AST/ElementQueryNode.js.map +1 -1
- package/dist/AST/FunctionNode.d.ts +1 -1
- package/dist/AST/LoopNode.d.ts +12 -0
- package/dist/AST/LoopNode.js +121 -0
- package/dist/AST/LoopNode.js.map +1 -0
- package/dist/AST/OnNode.d.ts +1 -1
- package/dist/AST/OnNode.js.map +1 -1
- package/dist/AST.d.ts +64 -62
- package/dist/AST.js +82 -69
- package/dist/AST.js.map +1 -1
- package/dist/Attribute.d.ts +1 -0
- package/dist/Attribute.js +6 -1
- package/dist/Attribute.js.map +1 -1
- package/dist/Component.d.ts +2 -0
- package/dist/Component.js +12 -27
- package/dist/Component.js.map +1 -1
- package/dist/DOM/AbstractDOM.d.ts +48 -0
- package/dist/DOM/AbstractDOM.js +937 -0
- package/dist/DOM/AbstractDOM.js.map +1 -0
- package/dist/DOM/ShadowDOM.d.ts +5 -0
- package/dist/DOM/ShadowDOM.js +32 -0
- package/dist/DOM/ShadowDOM.js.map +1 -0
- package/dist/DOM.d.ts +3 -48
- package/dist/DOM.js +6 -913
- package/dist/DOM.js.map +1 -1
- package/dist/Tag.d.ts +2 -0
- package/dist/Tag.js +119 -20
- package/dist/Tag.js.map +1 -1
- package/dist/helpers/VisionHelper.d.ts +1 -0
- package/dist/helpers/VisionHelper.js +45 -0
- package/dist/helpers/VisionHelper.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/dist/vsn.js +2 -7
- package/dist/vsn.js.map +1 -1
- package/package.json +1 -1
- package/src/AST/ElementQueryNode.ts +2 -1
- package/src/AST/FunctionNode.ts +1 -1
- package/src/AST/LoopNode.ts +35 -0
- package/src/AST/OnNode.ts +2 -2
- package/src/AST.ts +19 -7
- package/src/Attribute.ts +3 -1
- package/src/Component.ts +15 -13
- package/src/DOM/AbstractDOM.ts +389 -0
- package/src/DOM/ShadowDOM.ts +15 -0
- package/src/DOM.ts +4 -385
- package/src/Tag.ts +31 -0
- package/src/helpers/VisionHelper.ts +6 -0
- package/src/version.ts +1 -1
- package/src/vsn.ts +2 -5
- package/test/AST/ClassNode.spec.ts +5 -5
- package/test/AST.spec.ts +21 -21
- package/test/Controller.spec.ts +1 -1
- package/test/DOM.spec.ts +3 -3
- package/test/Tag/TagList.spec.ts +1 -1
- package/test/attributes/Bind.spec.ts +12 -12
- package/test/attributes/JSONAttribute.spec.ts +5 -5
- package/test/attributes/ListItem.spec.ts +6 -6
- package/test/attributes/ScopeAttribute.spec.ts +2 -2
- package/test/attributes/ServiceAttribute.spec.ts +1 -1
- package/test/attributes/SetAttribute.spec.ts +3 -3
- package/test/attributes/Styles.spec.ts +2 -2
package/test/AST.spec.ts
CHANGED
|
@@ -28,7 +28,7 @@ describe('Tree', () => {
|
|
|
28
28
|
it("should parse number literals correctly", async () => {
|
|
29
29
|
scope = new Scope();
|
|
30
30
|
let tree: Tree = new Tree('foo = 5;baz=-15;');
|
|
31
|
-
const dom: DOM = new DOM(document, false);
|
|
31
|
+
const dom: DOM = new DOM(document.body, false);
|
|
32
32
|
await tree.evaluate(scope, dom)
|
|
33
33
|
expect(scope.get('baz')).toBe(-15);
|
|
34
34
|
expect(scope.get('foo')).toBe(5);
|
|
@@ -41,7 +41,7 @@ describe('Tree', () => {
|
|
|
41
41
|
|
|
42
42
|
it("should evaluate scope variables correctly", async () => {
|
|
43
43
|
let tree: Tree = new Tree('foo');
|
|
44
|
-
const dom: DOM = new DOM(document, false);
|
|
44
|
+
const dom: DOM = new DOM(document.body, false);
|
|
45
45
|
expect(await tree.evaluate(scope, dom)).toBe(2);
|
|
46
46
|
|
|
47
47
|
tree = new Tree('bar');
|
|
@@ -50,7 +50,7 @@ describe('Tree', () => {
|
|
|
50
50
|
|
|
51
51
|
it("should be able to call functions within the scope", async () => {
|
|
52
52
|
const tree: Tree = new Tree('baz.add(foo, bar)');
|
|
53
|
-
const dom: DOM = new DOM(document, false);
|
|
53
|
+
const dom: DOM = new DOM(document.body, false);
|
|
54
54
|
expect(await tree.evaluate(scope, dom)).toBe(5);
|
|
55
55
|
|
|
56
56
|
scope.set('foo', 15);
|
|
@@ -60,7 +60,7 @@ describe('Tree', () => {
|
|
|
60
60
|
|
|
61
61
|
it("should be able to call functions with literals", async () => {
|
|
62
62
|
let tree: Tree = new Tree('baz.add(foo, 5)');
|
|
63
|
-
const dom: DOM = new DOM(document, false);
|
|
63
|
+
const dom: DOM = new DOM(document.body, false);
|
|
64
64
|
expect(await tree.evaluate(scope, dom)).toBe(7);
|
|
65
65
|
|
|
66
66
|
scope.set('foo', 15);
|
|
@@ -72,7 +72,7 @@ describe('Tree', () => {
|
|
|
72
72
|
|
|
73
73
|
it("should be able to call member variable of value returned from function call", async () => {
|
|
74
74
|
const tree: Tree = new Tree('baz.generate("test", foo).test');
|
|
75
|
-
const dom: DOM = new DOM(document, false);
|
|
75
|
+
const dom: DOM = new DOM(document.body, false);
|
|
76
76
|
expect(await tree.evaluate(scope, dom)).toBe(2);
|
|
77
77
|
|
|
78
78
|
scope.set('foo', 15);
|
|
@@ -81,7 +81,7 @@ describe('Tree', () => {
|
|
|
81
81
|
|
|
82
82
|
it("should be able to call nested functions within the scope", async () => {
|
|
83
83
|
const tree: Tree = new Tree('baz.add(baz.add(foo, foo), baz.add(bar, bar))');
|
|
84
|
-
const dom: DOM = new DOM(document, false);
|
|
84
|
+
const dom: DOM = new DOM(document.body, false);
|
|
85
85
|
expect(await tree.evaluate(scope, dom)).toBe(10);
|
|
86
86
|
|
|
87
87
|
scope.set('foo', 15);
|
|
@@ -96,13 +96,13 @@ describe('Tree', () => {
|
|
|
96
96
|
baz.add(100, 5);
|
|
97
97
|
5;
|
|
98
98
|
`);
|
|
99
|
-
const dom: DOM = new DOM(document, false);
|
|
99
|
+
const dom: DOM = new DOM(document.body, false);
|
|
100
100
|
expect(await tree.evaluate(scope, dom)).toBe(5);
|
|
101
101
|
});
|
|
102
102
|
|
|
103
103
|
it("should be able to compare properly", async () => {
|
|
104
104
|
let tree: Tree = new Tree(`1!='1'`);
|
|
105
|
-
const dom: DOM = new DOM(document, false);
|
|
105
|
+
const dom: DOM = new DOM(document.body, false);
|
|
106
106
|
expect(await tree.evaluate(scope, dom)).toBe(true);
|
|
107
107
|
tree = new Tree(`1==1`);
|
|
108
108
|
expect(await tree.evaluate(scope, dom)).toBe(true);
|
|
@@ -114,7 +114,7 @@ describe('Tree', () => {
|
|
|
114
114
|
|
|
115
115
|
it("should be able to execute if statements properly",async () => {
|
|
116
116
|
let tree: Tree = new Tree('if (true) { return true; } else { return false; }');
|
|
117
|
-
const dom: DOM = new DOM(document, false);
|
|
117
|
+
const dom: DOM = new DOM(document.body, false);
|
|
118
118
|
expect(await tree.evaluate(scope, dom)).toBe(true);
|
|
119
119
|
tree = new Tree('if (false) { return true; } else { return false; }');
|
|
120
120
|
expect(await tree.evaluate(scope, dom)).toBe(false);
|
|
@@ -187,7 +187,7 @@ describe('Tree', () => {
|
|
|
187
187
|
|
|
188
188
|
it("should be able to assign variables properly", async () => {
|
|
189
189
|
let tree: Tree = new Tree(`something = 5;somethingElse=6;return something;`);
|
|
190
|
-
const dom: DOM = new DOM(document, false);
|
|
190
|
+
const dom: DOM = new DOM(document.body, false);
|
|
191
191
|
expect(await tree.evaluate(scope, dom)).toBe(5);
|
|
192
192
|
expect(scope.get('something')).toBe(5);
|
|
193
193
|
tree = new Tree(`something = somethingElse = 5;return something;`);
|
|
@@ -201,7 +201,7 @@ describe('Tree', () => {
|
|
|
201
201
|
|
|
202
202
|
it("should be able to execute basic arithmetic", async () => {
|
|
203
203
|
let tree: Tree = new Tree('5 + 3');
|
|
204
|
-
const dom: DOM = new DOM(document, false);
|
|
204
|
+
const dom: DOM = new DOM(document.body, false);
|
|
205
205
|
expect(await tree.evaluate(scope, dom)).toBe(8);
|
|
206
206
|
tree = new Tree('8 - 3');
|
|
207
207
|
expect(await tree.evaluate(scope, dom)).toBe(5);
|
|
@@ -209,7 +209,7 @@ describe('Tree', () => {
|
|
|
209
209
|
|
|
210
210
|
it("should be able to assign with incrementing/decrementing variables properly", async () => {
|
|
211
211
|
let tree: Tree = new Tree(`something = 5;something += 10;`);
|
|
212
|
-
const dom: DOM = new DOM(document, false);
|
|
212
|
+
const dom: DOM = new DOM(document.body, false);
|
|
213
213
|
expect(await tree.evaluate(scope, dom)).toBe(15);
|
|
214
214
|
expect(scope.get('something')).toBe(15);
|
|
215
215
|
tree = new Tree(`something = 5;something -= 10;`);
|
|
@@ -225,7 +225,7 @@ describe('Tree', () => {
|
|
|
225
225
|
|
|
226
226
|
it("should be able to assign arrays with incrementing/decrementing variables properly", async () => {
|
|
227
227
|
let tree: Tree = new Tree(`something = [5,6];something += 10;`);
|
|
228
|
-
const dom: DOM = new DOM(document, false);
|
|
228
|
+
const dom: DOM = new DOM(document.body, false);
|
|
229
229
|
await tree.evaluate(scope, dom);
|
|
230
230
|
const something = scope.get('something');
|
|
231
231
|
expect(something.length).toEqual(3);
|
|
@@ -260,7 +260,7 @@ describe('Tree', () => {
|
|
|
260
260
|
test = blockingFunction(test, 1, true);
|
|
261
261
|
}
|
|
262
262
|
`);
|
|
263
|
-
const dom: DOM = new DOM(document, false);
|
|
263
|
+
const dom: DOM = new DOM(document.body, false);
|
|
264
264
|
await tree.evaluate(scope, dom);
|
|
265
265
|
});
|
|
266
266
|
|
|
@@ -272,14 +272,14 @@ describe('Tree', () => {
|
|
|
272
272
|
test += var;
|
|
273
273
|
}
|
|
274
274
|
`);
|
|
275
|
-
const dom: DOM = new DOM(document, false);
|
|
275
|
+
const dom: DOM = new DOM(document.body, false);
|
|
276
276
|
await tree.evaluate(scope, dom);
|
|
277
277
|
expect(scope.get('test')).toBe(46);
|
|
278
278
|
});
|
|
279
279
|
|
|
280
280
|
it("should be able parse an array of numbers", async () => {
|
|
281
281
|
let tree: Tree = new Tree(`test = [0,1,2,3,4,5];`);
|
|
282
|
-
const dom: DOM = new DOM(document, false);
|
|
282
|
+
const dom: DOM = new DOM(document.body, false);
|
|
283
283
|
await tree.evaluate(scope, dom);
|
|
284
284
|
|
|
285
285
|
expect(scope.get('test').length).toBe(6);
|
|
@@ -290,7 +290,7 @@ describe('Tree', () => {
|
|
|
290
290
|
|
|
291
291
|
it("should be able parse an array of strings", async () => {
|
|
292
292
|
let tree: Tree = new Tree(`test = ["one","two","three"];`);
|
|
293
|
-
const dom: DOM = new DOM(document, false);
|
|
293
|
+
const dom: DOM = new DOM(document.body, false);
|
|
294
294
|
await tree.evaluate(scope, dom);
|
|
295
295
|
|
|
296
296
|
expect(scope.get('test').length).toBe(3);
|
|
@@ -302,7 +302,7 @@ describe('Tree', () => {
|
|
|
302
302
|
|
|
303
303
|
it("should be able parse an object literal", async () => {
|
|
304
304
|
let tree: Tree = new Tree(`test = {"x":0,"y":1,"z":2};`);
|
|
305
|
-
const dom: DOM = new DOM(document, false);
|
|
305
|
+
const dom: DOM = new DOM(document.body, false);
|
|
306
306
|
await tree.evaluate(scope, dom);
|
|
307
307
|
expect(scope.get('test').get('x')).toBe(0);
|
|
308
308
|
expect(scope.get('test').get('y')).toBe(1);
|
|
@@ -311,7 +311,7 @@ describe('Tree', () => {
|
|
|
311
311
|
|
|
312
312
|
it("should be able parse an object literal with a key from the scope", async () => {
|
|
313
313
|
let tree: Tree = new Tree(`xKey = 'x'; test = {xKey:120,"y":1,"z":2};`);
|
|
314
|
-
const dom: DOM = new DOM(document, false);
|
|
314
|
+
const dom: DOM = new DOM(document.body, false);
|
|
315
315
|
await tree.evaluate(scope, dom);
|
|
316
316
|
expect(scope.get('test').get('y')).toBe(1);
|
|
317
317
|
expect(scope.get('test').get('z')).toBe(2);
|
|
@@ -320,7 +320,7 @@ describe('Tree', () => {
|
|
|
320
320
|
|
|
321
321
|
it("should be able parse an object literal containing arrays", async () => {
|
|
322
322
|
let tree: Tree = new Tree(`test = {"test_1": ["test", "testing"], "test_2": ["foo", "bar"]}`);
|
|
323
|
-
const dom: DOM = new DOM(document, false);
|
|
323
|
+
const dom: DOM = new DOM(document.body, false);
|
|
324
324
|
await tree.evaluate(scope, dom);
|
|
325
325
|
expect(scope.get('test').get('test_1')[0]).toBe("test");
|
|
326
326
|
expect(scope.get('test').get('test_1')[1]).toBe("testing");
|
|
@@ -330,7 +330,7 @@ describe('Tree', () => {
|
|
|
330
330
|
|
|
331
331
|
it("should be able to check if item is in an array", async () => {
|
|
332
332
|
let tree: Tree = new Tree(`a in [1,2,3]`);
|
|
333
|
-
const dom: DOM = new DOM(document, false);
|
|
333
|
+
const dom: DOM = new DOM(document.body, false);
|
|
334
334
|
scope.set('a', 1);
|
|
335
335
|
expect(await tree.evaluate(scope, dom)).toBe(true);
|
|
336
336
|
scope.set('a', 4);
|
package/test/Controller.spec.ts
CHANGED
|
@@ -30,7 +30,7 @@ describe('Controller', () => {
|
|
|
30
30
|
document.body.innerHTML = `
|
|
31
31
|
<div id="controller" vsn-controller:test="ControllerTestController" vsn-set:test.test="notTest" vsn-bind="test.test"></div>
|
|
32
32
|
`;
|
|
33
|
-
const dom = new DOM(document);
|
|
33
|
+
const dom = new DOM(document.body);
|
|
34
34
|
const deferred = SimplePromise.defer();
|
|
35
35
|
dom.once('built', async () => {
|
|
36
36
|
const tag = await dom.exec('#controller');
|
package/test/DOM.spec.ts
CHANGED
|
@@ -10,7 +10,7 @@ describe('DOM', () => {
|
|
|
10
10
|
document.body.innerHTML = `
|
|
11
11
|
<div vsn-controller:test="TestController"></div>
|
|
12
12
|
`;
|
|
13
|
-
const dom = new DOM(document);
|
|
13
|
+
const dom = new DOM(document.body);
|
|
14
14
|
dom.once('built', async () => {
|
|
15
15
|
const bodyTag = await dom.getTagForElement(document.body);
|
|
16
16
|
expect(bodyTag.hasAttribute('vsn-root')).toBe(true)
|
|
@@ -26,7 +26,7 @@ describe('DOM', () => {
|
|
|
26
26
|
</div>
|
|
27
27
|
</div>
|
|
28
28
|
`;
|
|
29
|
-
const dom = new DOM(document);
|
|
29
|
+
const dom = new DOM(document.body);
|
|
30
30
|
dom.once('built', async () => {
|
|
31
31
|
expect(await dom.exec('?(#parent).asd')).toBe(123);
|
|
32
32
|
expect(await dom.exec('?(#testing).asd')).toBe(345);
|
|
@@ -49,7 +49,7 @@ describe('DOM', () => {
|
|
|
49
49
|
</main>
|
|
50
50
|
</div>
|
|
51
51
|
`;
|
|
52
|
-
const dom = new DOM(document);
|
|
52
|
+
const dom = new DOM(document.body);
|
|
53
53
|
dom.once('built', async () => {
|
|
54
54
|
const root = await dom.exec('#root');
|
|
55
55
|
const child = await dom.exec('#child');
|
package/test/Tag/TagList.spec.ts
CHANGED
|
@@ -11,7 +11,7 @@ describe('TagList', () => {
|
|
|
11
11
|
<p class="test">Test 3</p>
|
|
12
12
|
<p class="testing">Test 4</p>
|
|
13
13
|
`;
|
|
14
|
-
const dom = new DOM(document);
|
|
14
|
+
const dom = new DOM(document.body);
|
|
15
15
|
dom.once('built', async () => {
|
|
16
16
|
let tags: TagList | DOMObject = await Query('p.test', dom) as TagList;
|
|
17
17
|
expect(tags.length).toBe(2);
|
|
@@ -8,7 +8,7 @@ describe('Bind', () => {
|
|
|
8
8
|
document.body.innerHTML = `
|
|
9
9
|
<span id="test" vsn-name="test" vsn-bind="test.value">testing</span>
|
|
10
10
|
`;
|
|
11
|
-
const dom = new DOM(document);
|
|
11
|
+
const dom = new DOM(document.body);
|
|
12
12
|
dom.once('built', async () => {
|
|
13
13
|
const tag = await dom.getTagForElement(document.getElementById('test'));
|
|
14
14
|
expect(tag).toBeTruthy();
|
|
@@ -22,7 +22,7 @@ describe('Bind', () => {
|
|
|
22
22
|
document.body.innerHTML = `
|
|
23
23
|
<span id="test" test="testing" vsn-bind="@test"></span>
|
|
24
24
|
`;
|
|
25
|
-
const dom = new DOM(document);
|
|
25
|
+
const dom = new DOM(document.body);
|
|
26
26
|
dom.once('built', async () => {
|
|
27
27
|
const tag = await dom.getTagForElement(document.getElementById('test'));
|
|
28
28
|
expect(tag).toBeTruthy();
|
|
@@ -37,7 +37,7 @@ describe('Bind', () => {
|
|
|
37
37
|
<span id="test2" vsn-bind="test.id">arg</span>
|
|
38
38
|
`;
|
|
39
39
|
|
|
40
|
-
const dom = new DOM(document);
|
|
40
|
+
const dom = new DOM(document.body);
|
|
41
41
|
dom.once('built', async () => {
|
|
42
42
|
const test = document.getElementById('arg');
|
|
43
43
|
const tag = await dom.getTagForElement(test);
|
|
@@ -55,7 +55,7 @@ describe('Bind', () => {
|
|
|
55
55
|
<span id="test" vsn-name="test" vsn-bind:id="test.id"></span>
|
|
56
56
|
`;
|
|
57
57
|
|
|
58
|
-
const dom = new DOM(document);
|
|
58
|
+
const dom = new DOM(document.body);
|
|
59
59
|
dom.once('built', async () => {
|
|
60
60
|
const test = document.getElementById('test');
|
|
61
61
|
const tag = await dom.getTagForElement(test);
|
|
@@ -75,7 +75,7 @@ describe('Bind', () => {
|
|
|
75
75
|
<span id="test" vsn-name="test" vsn-bind="test.val">testing</span>
|
|
76
76
|
`;
|
|
77
77
|
|
|
78
|
-
const dom = new DOM(document, false);
|
|
78
|
+
const dom = new DOM(document.body, false);
|
|
79
79
|
dom.once('built', async () => {
|
|
80
80
|
const test = document.getElementById('test');
|
|
81
81
|
const tag = await dom.getTagForElement(test);
|
|
@@ -88,7 +88,7 @@ describe('Bind', () => {
|
|
|
88
88
|
|
|
89
89
|
test.innerHTML = 'new-val';
|
|
90
90
|
});
|
|
91
|
-
dom.buildFrom(document, true);
|
|
91
|
+
dom.buildFrom(document.body, true);
|
|
92
92
|
});
|
|
93
93
|
|
|
94
94
|
it("vsn-bind input value changes trigger updating scope with new value", (done) => {
|
|
@@ -96,7 +96,7 @@ describe('Bind', () => {
|
|
|
96
96
|
<input id="test" value="testing" vsn-name="test" vsn-bind="test.val"/>
|
|
97
97
|
`;
|
|
98
98
|
|
|
99
|
-
const dom = new DOM(document, false);
|
|
99
|
+
const dom = new DOM(document.body, false);
|
|
100
100
|
dom.once('built', async () => {
|
|
101
101
|
const test = document.getElementById('test');
|
|
102
102
|
const tag = await dom.getTagForElement(test);
|
|
@@ -113,7 +113,7 @@ describe('Bind', () => {
|
|
|
113
113
|
test.dispatchEvent(new KeyboardEvent('keyup', {key: 'w'}));
|
|
114
114
|
});
|
|
115
115
|
|
|
116
|
-
dom.buildFrom(document, true);
|
|
116
|
+
dom.buildFrom(document.body, true);
|
|
117
117
|
});
|
|
118
118
|
|
|
119
119
|
it("vsn-bind element innerHTML should change when scope value is changed", (done) => {
|
|
@@ -121,7 +121,7 @@ describe('Bind', () => {
|
|
|
121
121
|
<span id="test" vsn-name="test" vsn-bind="test.val">testing</span>
|
|
122
122
|
`;
|
|
123
123
|
|
|
124
|
-
const dom = new DOM(document, false);
|
|
124
|
+
const dom = new DOM(document.body, false);
|
|
125
125
|
dom.once('built', async () => {
|
|
126
126
|
const test = document.getElementById('test');
|
|
127
127
|
const tag = await dom.getTagForElement(test);
|
|
@@ -134,7 +134,7 @@ describe('Bind', () => {
|
|
|
134
134
|
|
|
135
135
|
tag.scope.get('test').set('val', 'new-val');
|
|
136
136
|
});
|
|
137
|
-
dom.buildFrom(document, true);
|
|
137
|
+
dom.buildFrom(document.body, true);
|
|
138
138
|
});
|
|
139
139
|
|
|
140
140
|
it("vsn-bind input value should change when scope value is changed", (done) => {
|
|
@@ -142,7 +142,7 @@ describe('Bind', () => {
|
|
|
142
142
|
<input id="test" value="testing" vsn-name="test" vsn-bind="test.val" />
|
|
143
143
|
`;
|
|
144
144
|
|
|
145
|
-
const dom = new DOM(document);
|
|
145
|
+
const dom = new DOM(document.body);
|
|
146
146
|
dom.once('built', async () => {
|
|
147
147
|
const test = document.getElementById('test');
|
|
148
148
|
const tag = await dom.getTagForElement(test);
|
|
@@ -161,7 +161,7 @@ describe('Bind', () => {
|
|
|
161
161
|
document.body.innerHTML = `
|
|
162
162
|
<span id="test" vsn-name="test" vsn-bind="test.value" vsn-format="currency" vsn-type:test.value="float">1.5</span>
|
|
163
163
|
`;
|
|
164
|
-
const dom = new DOM(document);
|
|
164
|
+
const dom = new DOM(document.body);
|
|
165
165
|
dom.once('built', async () => {
|
|
166
166
|
const tag = await dom.getTagForElement(document.getElementById('test'));
|
|
167
167
|
expect(tag).toBeTruthy();
|
|
@@ -7,7 +7,7 @@ describe('JSONAttribute', () => {
|
|
|
7
7
|
[1,2,3,"four"]
|
|
8
8
|
</script>
|
|
9
9
|
`;
|
|
10
|
-
const dom = new DOM(document);
|
|
10
|
+
const dom = new DOM(document.body);
|
|
11
11
|
dom.once('built', async () => {
|
|
12
12
|
expect(dom.root.scope.get('t0')[0]).toBe(1);
|
|
13
13
|
expect(dom.root.scope.get('t0')[1]).toBe(2);
|
|
@@ -27,7 +27,7 @@ describe('JSONAttribute', () => {
|
|
|
27
27
|
}
|
|
28
28
|
</script>
|
|
29
29
|
`;
|
|
30
|
-
const dom = new DOM(document);
|
|
30
|
+
const dom = new DOM(document.body);
|
|
31
31
|
dom.once('built', async () => {
|
|
32
32
|
expect(dom.root.scope.get('t1').get("testing")[0]).toBe(1);
|
|
33
33
|
expect(dom.root.scope.get('t1').get("testing")[1]).toBe(2);
|
|
@@ -47,7 +47,7 @@ describe('JSONAttribute', () => {
|
|
|
47
47
|
<div vsn-json:t2="[1,2,3,"four"]"></div>
|
|
48
48
|
`;
|
|
49
49
|
|
|
50
|
-
const dom = new DOM(document);
|
|
50
|
+
const dom = new DOM(document.body);
|
|
51
51
|
dom.once('built', async () => {
|
|
52
52
|
console.log('scope keys', dom.root.scope.keys);
|
|
53
53
|
expect(dom.root.scope.get('t2')[0]).toBe(1);
|
|
@@ -62,7 +62,7 @@ describe('JSONAttribute', () => {
|
|
|
62
62
|
document.body.innerHTML = `
|
|
63
63
|
<div vsn-json:t3="{"testing": [1,2,3,"four"],"test": ["one","two","three",4]}"></div>
|
|
64
64
|
`;
|
|
65
|
-
const dom = new DOM(document);
|
|
65
|
+
const dom = new DOM(document.body);
|
|
66
66
|
dom.once('built', async () => {
|
|
67
67
|
expect(dom.root.scope.get('t3').get("testing")[0]).toBe(1);
|
|
68
68
|
expect(dom.root.scope.get('t3').get("testing")[1]).toBe(2);
|
|
@@ -82,7 +82,7 @@ describe('JSONAttribute', () => {
|
|
|
82
82
|
<div vsn-json:testing.test='{"testing": 123}'></div>
|
|
83
83
|
</div>
|
|
84
84
|
`;
|
|
85
|
-
const dom = new DOM(document);
|
|
85
|
+
const dom = new DOM(document.body);
|
|
86
86
|
dom.once('built', async () => {
|
|
87
87
|
expect(dom.root.scope.get('testing').get("test").get('testing')).toBe(123);
|
|
88
88
|
done();
|
|
@@ -30,8 +30,8 @@ describe('ListItem', () => {
|
|
|
30
30
|
`;
|
|
31
31
|
let errorThrown: boolean = false;
|
|
32
32
|
try {
|
|
33
|
-
const dom = new DOM(document, false);
|
|
34
|
-
await dom.buildFrom(document);
|
|
33
|
+
const dom = new DOM(document.body, false);
|
|
34
|
+
await dom.buildFrom(document.body);
|
|
35
35
|
} catch (e) {
|
|
36
36
|
expect(e.message).toBe(ListItem.ERROR_NO_PARENT);
|
|
37
37
|
errorThrown = true;
|
|
@@ -44,7 +44,7 @@ describe('ListItem', () => {
|
|
|
44
44
|
<ul vsn-list:list list-item-model="ListItemSpecTestItem" id="test"><li vsn-list-item id="test-item"></li></ul>
|
|
45
45
|
`;
|
|
46
46
|
|
|
47
|
-
const dom = new DOM(document);
|
|
47
|
+
const dom = new DOM(document.body);
|
|
48
48
|
dom.once('built', async () => {
|
|
49
49
|
const list = await dom.getTagForElement(document.getElementById('test'));
|
|
50
50
|
const listItem = await dom.getTagForElement(document.getElementById('test-item'));
|
|
@@ -63,7 +63,7 @@ describe('ListItem', () => {
|
|
|
63
63
|
</ul>
|
|
64
64
|
</div>
|
|
65
65
|
`;
|
|
66
|
-
const dom = new DOM(document);
|
|
66
|
+
const dom = new DOM(document.body);
|
|
67
67
|
dom.once('built', async () => {
|
|
68
68
|
const list = await dom.getTagForElement(document.getElementById('test'));
|
|
69
69
|
const controller: ListItemController = list.scope.get('controller').wrapped;
|
|
@@ -92,7 +92,7 @@ describe('ListItem', () => {
|
|
|
92
92
|
<ul vsn-list:list list-item-model="ListItemSpecTestItem" id="test"><li vsn-list-item id="test-item" vsn-set:item.testing|integer="1"></li></ul>
|
|
93
93
|
`;
|
|
94
94
|
|
|
95
|
-
const dom = new DOM(document);
|
|
95
|
+
const dom = new DOM(document.body);
|
|
96
96
|
dom.once('built', async () => {
|
|
97
97
|
const listItem = await dom.getTagForElement(document.getElementById('test-item'));
|
|
98
98
|
expect(listItem.scope.get('item').get('testing')).toBe(1);
|
|
@@ -107,7 +107,7 @@ describe('ListItem', () => {
|
|
|
107
107
|
</ul>
|
|
108
108
|
`;
|
|
109
109
|
|
|
110
|
-
const dom = new DOM(document);
|
|
110
|
+
const dom = new DOM(document.body);
|
|
111
111
|
dom.once('built', async () => {
|
|
112
112
|
const listItem = await dom.getTagForElement(document.getElementById('test-item'));
|
|
113
113
|
console.log('test keys', listItem.scope.keys);
|
|
@@ -10,7 +10,7 @@ describe('ScopeAttribute', () => {
|
|
|
10
10
|
<span vsn-bind="asd"></span>
|
|
11
11
|
</div>
|
|
12
12
|
`;
|
|
13
|
-
const dom = new DOM(document);
|
|
13
|
+
const dom = new DOM(document.body);
|
|
14
14
|
dom.once('built', async () => {
|
|
15
15
|
const element = (await dom.exec('?(div)'))[0];
|
|
16
16
|
expect(element.scope.get('asd')).toBe(123);
|
|
@@ -25,7 +25,7 @@ describe('ScopeAttribute', () => {
|
|
|
25
25
|
document.body.innerHTML = `
|
|
26
26
|
<div vsn-scope></div>
|
|
27
27
|
`;
|
|
28
|
-
const dom = new DOM(document);
|
|
28
|
+
const dom = new DOM(document.body);
|
|
29
29
|
dom.once('built', async () => {
|
|
30
30
|
const element = (await dom.exec('?(div)'))[0];
|
|
31
31
|
expect(element.uniqueScope).toBe(true);
|
|
@@ -24,7 +24,7 @@ describe('ServiceAttribute', () => {
|
|
|
24
24
|
<div vsn-service:test1="TestService" id="test"></div>
|
|
25
25
|
<div vsn-service:test2="TestService" vsn-set:test2.test="testing" id="test2"></div>
|
|
26
26
|
`;
|
|
27
|
-
const dom = new DOM(document);
|
|
27
|
+
const dom = new DOM(document.body);
|
|
28
28
|
dom.once('built', async () => {
|
|
29
29
|
const service1 = await dom.exec('test1');
|
|
30
30
|
const service2 = await dom.exec('test2');
|
|
@@ -8,7 +8,7 @@ describe('Bind', () => {
|
|
|
8
8
|
document.body.innerHTML = `
|
|
9
9
|
<span id="test" vsn-name="test" vsn-set:val="hello world">testing</span>
|
|
10
10
|
`;
|
|
11
|
-
const dom = new DOM(document);
|
|
11
|
+
const dom = new DOM(document.body);
|
|
12
12
|
dom.once('built', async () => {
|
|
13
13
|
const tag = await dom.getTagForElement(document.getElementById('test'));
|
|
14
14
|
expect(tag).toBeTruthy();
|
|
@@ -24,7 +24,7 @@ describe('Bind', () => {
|
|
|
24
24
|
<span id="test-inner-1" vsn-name="testInner1" vsn-set:val="hi mom"></span>
|
|
25
25
|
</span>
|
|
26
26
|
`;
|
|
27
|
-
const dom = new DOM(document);
|
|
27
|
+
const dom = new DOM(document.body);
|
|
28
28
|
dom.once('built', async () => {
|
|
29
29
|
const tag = await dom.getTagForElement(document.getElementById('test'));
|
|
30
30
|
const inner1 = await dom.getTagForElement(document.getElementById('test-inner-1'));
|
|
@@ -41,7 +41,7 @@ describe('Bind', () => {
|
|
|
41
41
|
<span id="test-float" vsn-set:float|float="142.3">testing</span>
|
|
42
42
|
<span id="test-bool" vsn-set:bool|boolean="false">testing</span>
|
|
43
43
|
`;
|
|
44
|
-
const dom = new DOM(document);
|
|
44
|
+
const dom = new DOM(document.body);
|
|
45
45
|
dom.once('built', async () => {
|
|
46
46
|
const intTag = await dom.getTagForElement(document.getElementById('test-int'));
|
|
47
47
|
const floatTag = await dom.getTagForElement(document.getElementById('test-float'));
|
|
@@ -11,7 +11,7 @@ describe('Styles', () => {
|
|
|
11
11
|
<span id="styling-dupe" vsn-styles="testing.styles" style="margin-top: 50px;">testing 2</span>
|
|
12
12
|
</div>
|
|
13
13
|
`;
|
|
14
|
-
const dom = new DOM(document);
|
|
14
|
+
const dom = new DOM(document.body);
|
|
15
15
|
dom.once('built', async () => {
|
|
16
16
|
const ele1 = (await dom.get('#styling'))[0];
|
|
17
17
|
const ele2 = (await dom.get('#styling-dupe'))[0];
|
|
@@ -33,7 +33,7 @@ describe('Styles', () => {
|
|
|
33
33
|
document.body.innerHTML = `
|
|
34
34
|
<span id="styling">testing</span>
|
|
35
35
|
`;
|
|
36
|
-
const dom = new DOM(document);
|
|
36
|
+
const dom = new DOM(document.body);
|
|
37
37
|
dom.once('built', async () => {
|
|
38
38
|
await dom.exec('?(#styling).$marginTop = "50px"');
|
|
39
39
|
expect((await dom.get('#styling'))[0].element.style.marginTop).toBe('50px');
|