-
-
Notifications
You must be signed in to change notification settings - Fork 147
/
renderer.spec.ts
166 lines (145 loc) · 6.92 KB
/
renderer.spec.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
import { PLATFORM, Registration } from '@aurelia/kernel';
import {
AccessScope,
BindingMode,
DelegationStrategy,
Interpolation,
InterpolationBinding,
IController,
IRenderContext,
IRenderer,
IRenderingEngine,
LifecycleFlags as LF
} from '@aurelia/runtime';
import { expect } from 'chai';
import { spy } from 'sinon';
import { IExpressionParserRegistration } from '@aurelia/jit';
import {
CaptureBindingInstruction,
DelegateBindingInstruction,
IListenerBindingInstruction,
Listener,
SetAttributeInstruction,
StylePropertyBindingInstruction,
TextBindingInstruction,
TriggerBindingInstruction
} from '@aurelia/runtime-html';
import { _, TestContext } from '@aurelia/testing';
describe('Renderer', function () {
function setup() {
const ctx = TestContext.createHTMLTestContext();
const { dom, container } = ctx;
IExpressionParserRegistration.register(container);
const renderable: IController = { $bindingHead: null, $bindingTail: null, $componentHead: null, $componentTail: null, $context: null, $nodes: null, $scope: null };
container.register(Registration.instance(IController, renderable));
const wrapper = ctx.createElementFromMarkup('<div><au-target class="au"></au-target> </div>');
dom.appendChild(ctx.doc.body, wrapper);
const target = wrapper.firstElementChild as HTMLElement;
const placeholder = target.nextSibling as HTMLElement;
const renderingEngine = container.get(IRenderingEngine);
const sut = container.get(IRenderer);
const renderContext: IRenderContext = {
get(key) {
return key === IRenderer ? sut : { $hydrate: spy(), key } as any;
},
beginComponentOperation() {
return {
dispose: spy()
} as any;
},
createChild: PLATFORM.noop as any,
render: PLATFORM.noop,
has: PLATFORM.noop as any,
getAll: PLATFORM.noop as any
};
spy(renderContext, 'get');
spy(renderContext, 'beginComponentOperation');
return { ctx, sut, dom, renderable, target, placeholder, wrapper, renderContext, renderingEngine };
}
function tearDown({ ctx, wrapper }: Partial<ReturnType<typeof setup>>) {
ctx.doc.body.removeChild(wrapper);
}
describe('handles ITextBindingInstruction', function () {
for (const from of ['${foo}', new Interpolation(['', ''], [new AccessScope('foo')])] as any[]) {
const instruction = new TextBindingInstruction(from) as any;
it(_`instruction=${instruction}`, function () {
const { ctx, sut, dom, renderable, target, placeholder, wrapper, renderContext } = setup();
sut.instructionRenderers[instruction.type].render(LF.none, dom, renderContext, renderable, target, instruction);
expect(renderable.$componentHead).to.equal(null);
expect(renderable.$componentTail).to.equal(null);
expect(renderable.$bindingHead).to.be.a('object', 'renderable.$componentHead');
expect(renderable.$bindingHead).to.equal(renderable.$bindingTail);
const bindable = renderable.$bindingHead as InterpolationBinding;
expect(bindable.target).to.equal(placeholder);
expect(bindable.interpolation['expressions'][0]['name']).to.equal('foo');
expect(bindable.interpolation['parts'][0]).to.equal('');
expect(bindable.interpolation['parts'][1]).to.equal('');
expect(bindable.mode).to.equal(BindingMode.toView);
//expect(target.isConnected).to.equal(false);
tearDown({ ctx, wrapper });
});
}
});
describe('handles IListenerBindingInstruction', function () {
for (const Instruction of [TriggerBindingInstruction, DelegateBindingInstruction, CaptureBindingInstruction] as any[]) {
for (const to of ['foo', 'bar']) {
for (const from of ['foo', new AccessScope('foo')]) {
const instruction = new (Instruction)(from, to) as IListenerBindingInstruction;
it(_`instruction=${instruction}`, function () {
const { ctx, sut, dom, renderable, target, wrapper, renderContext } = setup();
sut.instructionRenderers[instruction.type].render(LF.none, dom, renderContext, renderable, target, instruction);
expect(renderable.$componentHead).to.equal(null);
expect(renderable.$componentTail).to.equal(null);
expect(renderable.$bindingHead).to.be.a('object', 'renderable.$componentHead');
expect(renderable.$bindingHead).to.equal(renderable.$bindingTail);
const bindable = renderable.$bindingHead as Listener;
expect(bindable.target).to.equal(target);
expect(bindable.sourceExpression['name']).to.equal('foo');
expect(bindable.delegationStrategy).to.equal(instruction.strategy);
expect(bindable.targetEvent).to.equal(to);
expect(bindable.preventDefault).to.equal(instruction.strategy === DelegationStrategy.none);
tearDown({ ctx, wrapper });
});
}
}
}
});
describe('handles IStyleBindingInstruction', function () {
for (const to of ['foo', 'bar']) {
for (const from of ['foo', new AccessScope('foo')] as any[]) {
const instruction = new StylePropertyBindingInstruction(from, to) as any;
it(_`instruction=${instruction}`, function () {
const { ctx, sut, dom, renderable, target, wrapper, renderContext } = setup();
sut.instructionRenderers[instruction.type].render(LF.none, dom, renderContext, renderable, target, instruction);
expect(renderable.$componentHead).to.equal(null);
expect(renderable.$componentTail).to.equal(null);
expect(renderable.$bindingHead).to.be.a('object', 'renderable.$componentHead');
expect(renderable.$bindingHead).to.equal(renderable.$bindingTail);
const bindable = renderable.$bindingHead as InterpolationBinding;
expect(bindable.target).to.equal(target.style);
expect(bindable.sourceExpression['name']).to.equal('foo');
expect(bindable.mode).to.equal(BindingMode.toView);
expect(bindable.targetProperty).to.equal(to);
tearDown({ ctx, wrapper });
});
}
}
});
describe('handles ISetAttributeInstruction', function () {
for (const to of ['id', 'accesskey', 'slot', 'tabindex']) {
for (const value of ['foo', 42, null] as any[]) {
const instruction = new SetAttributeInstruction(value, to) as any;
it(_`instruction=${instruction}`, function () {
const { ctx, sut, dom, renderable, target, wrapper, renderContext } = setup();
sut.instructionRenderers[instruction.type].render(LF.none, dom, renderContext, renderable, target, instruction);
expect(renderable.$componentHead).to.equal(null);
expect(renderable.$componentTail).to.equal(null);
expect(renderable.$bindingHead).to.equal(null);
expect(renderable.$bindingTail).to.equal(null);
expect(target.getAttribute(to)).to.equal(`${value}`);
tearDown({ ctx, wrapper });
});
}
}
});
});