cx 26.0.9 → 26.0.10
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/ui/Controller.d.ts +2 -2
- package/build/ui/index.d.ts +2 -1
- package/build/ui/index.js +2 -1
- package/build.js +133 -133
- package/dist/manifest.js +818 -921
- package/dist/ui.js +1 -1
- package/package.json +2 -2
- package/src/ui/Controller.ts +2 -2
- package/src/ui/index.ts +2 -1
- package/src/widgets/HtmlElement.spec.tsx +8 -6
- package/build/charts/Bar.scss +0 -29
- package/build/charts/BarGraph.scss +0 -29
- package/build/charts/BubbleGraph.scss +0 -32
- package/build/charts/Column.scss +0 -29
- package/build/charts/ColumnGraph.scss +0 -30
- package/build/charts/Gridlines.scss +0 -25
- package/build/charts/Legend.scss +0 -50
- package/build/charts/LegendEntry.scss +0 -29
- package/build/charts/LineGraph.scss +0 -25
- package/build/charts/Marker.scss +0 -44
- package/build/charts/MarkerLine.scss +0 -20
- package/build/charts/PieChart.scss +0 -29
- package/build/charts/Range.scss +0 -20
- package/build/charts/RangeMarker.scss +0 -17
- package/build/charts/ScatterGraph.scss +0 -24
- package/build/charts/Swimlane.scss +0 -16
- package/build/charts/Swimlanes.scss +0 -16
- package/build/charts/axis/Axis.scss +0 -23
- package/build/charts/axis/CategoryAxis.scss +0 -35
- package/build/charts/axis/NumericAxis.scss +0 -35
- package/build/charts/axis/TimeAxis.scss +0 -34
- package/build/charts/axis/index.scss +0 -5
- package/build/charts/axis/variables.scss +0 -3
- package/build/charts/index.scss +0 -22
- package/build/charts/palette.scss +0 -97
- package/build/charts/variables.scss +0 -22
- package/build/data/ArrayElementView.spec.d.ts +0 -1
- package/build/data/ArrayElementView.spec.js +0 -81
- package/build/data/Binding.spec.d.ts +0 -1
- package/build/data/Binding.spec.js +0 -61
- package/build/data/Expression.spec.d.ts +0 -1
- package/build/data/Expression.spec.js +0 -196
- package/build/data/Grouper.spec.d.ts +0 -1
- package/build/data/Grouper.spec.js +0 -48
- package/build/data/Ref.spec.d.ts +0 -1
- package/build/data/Ref.spec.js +0 -72
- package/build/data/Store.spec.d.ts +0 -1
- package/build/data/Store.spec.js +0 -19
- package/build/data/StoreRef.spec.d.ts +0 -1
- package/build/data/StoreRef.spec.js +0 -22
- package/build/data/StringTemplate.spec.d.ts +0 -1
- package/build/data/StringTemplate.spec.js +0 -112
- package/build/data/StructuredSelector.spec.d.ts +0 -1
- package/build/data/StructuredSelector.spec.js +0 -102
- package/build/data/View.spec.d.ts +0 -1
- package/build/data/View.spec.js +0 -44
- package/build/data/ZoomIntoPropertyView.spec.d.ts +0 -1
- package/build/data/ZoomIntoPropertyView.spec.js +0 -54
- package/build/data/comparer.spec.d.ts +0 -1
- package/build/data/comparer.spec.js +0 -50
- package/build/data/computable.spec.d.ts +0 -1
- package/build/data/computable.spec.js +0 -56
- package/build/data/createAccessorModelProxy.spec.d.ts +0 -1
- package/build/data/createAccessorModelProxy.spec.js +0 -30
- package/build/data/createStructuredSelector.spec.d.ts +0 -1
- package/build/data/createStructuredSelector.spec.js +0 -42
- package/build/data/diff/diffs.spec.d.ts +0 -1
- package/build/data/diff/diffs.spec.js +0 -45
- package/build/data/getAccessor.spec.d.ts +0 -1
- package/build/data/getAccessor.spec.js +0 -10
- package/build/data/getSelector.spec.d.ts +0 -1
- package/build/data/getSelector.spec.js +0 -36
- package/build/data/ops/append.spec.d.ts +0 -1
- package/build/data/ops/append.spec.js +0 -24
- package/build/data/ops/filter.spec.d.ts +0 -1
- package/build/data/ops/filter.spec.js +0 -25
- package/build/data/ops/findTreeNode.spec.d.ts +0 -1
- package/build/data/ops/findTreeNode.spec.js +0 -20
- package/build/data/ops/merge.spec.d.ts +0 -1
- package/build/data/ops/merge.spec.js +0 -23
- package/build/data/ops/removeTreeNodes.spec.d.ts +0 -1
- package/build/data/ops/removeTreeNodes.spec.js +0 -35
- package/build/data/ops/updateArray.spec.d.ts +0 -1
- package/build/data/ops/updateArray.spec.js +0 -33
- package/build/data/ops/updateTree.spec.d.ts +0 -1
- package/build/data/ops/updateTree.spec.js +0 -44
- package/build/global.scss +0 -14
- package/build/hooks/invokeCallback.spec.d.ts +0 -1
- package/build/hooks/invokeCallback.spec.js +0 -44
- package/build/hooks/resolveCallback.spec.d.ts +0 -1
- package/build/hooks/resolveCallback.spec.js +0 -35
- package/build/hooks/store.spec.d.ts +0 -1
- package/build/hooks/store.spec.js +0 -48
- package/build/hooks/useTrigger.spec.d.ts +0 -1
- package/build/hooks/useTrigger.spec.js +0 -59
- package/build/index.scss +0 -6
- package/build/svg/Svg.scss +0 -28
- package/build/svg/index.scss +0 -9
- package/build/ui/Controller.spec.d.ts +0 -1
- package/build/ui/Controller.spec.js +0 -251
- package/build/ui/Cx.spec.d.ts +0 -1
- package/build/ui/Cx.spec.js +0 -153
- package/build/ui/DataProxy.spec.d.ts +0 -1
- package/build/ui/DataProxy.spec.js +0 -208
- package/build/ui/IsolatedScope.spec.d.ts +0 -1
- package/build/ui/IsolatedScope.spec.js +0 -42
- package/build/ui/Repeater.spec.d.ts +0 -1
- package/build/ui/Repeater.spec.js +0 -109
- package/build/ui/Rescope.spec.d.ts +0 -1
- package/build/ui/Rescope.spec.js +0 -134
- package/build/ui/Restate.spec.d.ts +0 -1
- package/build/ui/Restate.spec.js +0 -257
- package/build/ui/adapter/ArrayAdapter.spec.d.ts +0 -1
- package/build/ui/adapter/ArrayAdapter.spec.js +0 -44
- package/build/ui/adapter/TreeAdapter.spec.d.ts +0 -1
- package/build/ui/adapter/TreeAdapter.spec.js +0 -71
- package/build/ui/app/Url.spec.d.ts +0 -1
- package/build/ui/app/Url.spec.js +0 -43
- package/build/ui/createFunctionalComponent.spec.d.ts +0 -1
- package/build/ui/createFunctionalComponent.spec.js +0 -272
- package/build/ui/index.scss +0 -2
- package/build/ui/layout/ContentPlaceholder.spec.d.ts +0 -1
- package/build/ui/layout/ContentPlaceholder.spec.js +0 -333
- package/build/ui/layout/FirstVisibleChildLayout.spec.d.ts +0 -1
- package/build/ui/layout/FirstVisibleChildLayout.spec.js +0 -101
- package/build/ui/layout/LabelsLeftLayout.scss +0 -47
- package/build/ui/layout/LabelsTopLayout.scss +0 -65
- package/build/ui/layout/index.scss +0 -3
- package/build/ui/layout/variables.scss +0 -2
- package/build/ui/variables.scss +0 -2
- package/build/util/Format.spec.d.ts +0 -1
- package/build/util/Format.spec.js +0 -58
- package/build/util/TraversalStack.spec.d.ts +0 -1
- package/build/util/TraversalStack.spec.js +0 -43
- package/build/util/call-once.scss +0 -7
- package/build/util/date/upperBoundCheck.spec.d.ts +0 -1
- package/build/util/date/upperBoundCheck.spec.js +0 -22
- package/build/util/getSearchQueryPredicate.spec.d.ts +0 -1
- package/build/util/getSearchQueryPredicate.spec.js +0 -33
- package/build/util/index.scss +0 -11
- package/build/util/isValidIdentifierName.spec.d.ts +0 -1
- package/build/util/isValidIdentifierName.spec.js +0 -28
- package/build/util/routeAppend.spec.d.ts +0 -1
- package/build/util/routeAppend.spec.js +0 -14
- package/build/util/scss/add-rules.scss +0 -40
- package/build/util/scss/calc.scss +0 -45
- package/build/util/scss/call-once.scss +0 -13
- package/build/util/scss/clockwise.scss +0 -49
- package/build/util/scss/colors.scss +0 -10
- package/build/util/scss/deep-get.scss +0 -12
- package/build/util/scss/deep-merge.scss +0 -21
- package/build/util/scss/divide.scss +0 -3
- package/build/util/scss/include.scss +0 -48
- package/build/util/scss/index.scss +0 -9
- package/build/variables.scss +0 -217
- package/build/widgets/AccessorBindings.spec.d.ts +0 -1
- package/build/widgets/AccessorBindings.spec.js +0 -40
- package/build/widgets/Button.scss +0 -119
- package/build/widgets/Button.variables.scss +0 -117
- package/build/widgets/CxCredit.scss +0 -39
- package/build/widgets/FlexBox.scss +0 -148
- package/build/widgets/Heading.scss +0 -40
- package/build/widgets/HighlightedSearchText.scss +0 -20
- package/build/widgets/HtmlElement.spec.d.ts +0 -1
- package/build/widgets/HtmlElement.spec.js +0 -38
- package/build/widgets/Icon.scss +0 -22
- package/build/widgets/List.scss +0 -93
- package/build/widgets/ProgressBar.scss +0 -51
- package/build/widgets/Resizer.scss +0 -44
- package/build/widgets/Section.scss +0 -56
- package/build/widgets/animations.scss +0 -11
- package/build/widgets/drag-drop/DragClone.scss +0 -36
- package/build/widgets/drag-drop/DragHandle.scss +0 -19
- package/build/widgets/drag-drop/DragSource.scss +0 -27
- package/build/widgets/drag-drop/DropZone.scss +0 -77
- package/build/widgets/drag-drop/index.scss +0 -4
- package/build/widgets/drag-drop/variables.scss +0 -15
- package/build/widgets/form/Calendar.scss +0 -199
- package/build/widgets/form/Calendar.variables.scss +0 -64
- package/build/widgets/form/Checkbox.scss +0 -129
- package/build/widgets/form/Checkbox.variables.scss +0 -40
- package/build/widgets/form/ColorField.scss +0 -98
- package/build/widgets/form/ColorPicker.scss +0 -285
- package/build/widgets/form/ColorPicker.variables.scss +0 -22
- package/build/widgets/form/DateTimeField.scss +0 -92
- package/build/widgets/form/DateTimePicker.scss +0 -47
- package/build/widgets/form/Field.scss +0 -164
- package/build/widgets/form/HelpText.scss +0 -24
- package/build/widgets/form/Label.scss +0 -38
- package/build/widgets/form/LookupField.scss +0 -221
- package/build/widgets/form/MonthField.scss +0 -100
- package/build/widgets/form/MonthPicker.scss +0 -125
- package/build/widgets/form/NumberField.scss +0 -63
- package/build/widgets/form/Radio.scss +0 -123
- package/build/widgets/form/Radio.variables.scss +0 -46
- package/build/widgets/form/Select.scss +0 -101
- package/build/widgets/form/Slider.scss +0 -121
- package/build/widgets/form/Switch.scss +0 -142
- package/build/widgets/form/TextArea.scss +0 -45
- package/build/widgets/form/TextField.scss +0 -57
- package/build/widgets/form/UploadButton.scss +0 -49
- package/build/widgets/form/ValidationError.scss +0 -23
- package/build/widgets/form/ValidationGroup.spec.d.ts +0 -1
- package/build/widgets/form/ValidationGroup.spec.js +0 -62
- package/build/widgets/form/Wheel.scss +0 -152
- package/build/widgets/form/index.scss +0 -24
- package/build/widgets/form/variables.scss +0 -355
- package/build/widgets/grid/Grid.scss +0 -640
- package/build/widgets/grid/Pagination.scss +0 -115
- package/build/widgets/grid/TreeNode.scss +0 -90
- package/build/widgets/grid/index.scss +0 -4
- package/build/widgets/grid/variables.scss +0 -137
- package/build/widgets/index.scss +0 -16
- package/build/widgets/nav/Link.scss +0 -20
- package/build/widgets/nav/Menu.scss +0 -76
- package/build/widgets/nav/Menu.variables.scss +0 -25
- package/build/widgets/nav/MenuItem.scss +0 -130
- package/build/widgets/nav/Route.spec.d.ts +0 -1
- package/build/widgets/nav/Route.spec.js +0 -15
- package/build/widgets/nav/Scroller.scss +0 -148
- package/build/widgets/nav/Tab.scss +0 -82
- package/build/widgets/nav/Tab.variables.scss +0 -84
- package/build/widgets/nav/cover.scss +0 -22
- package/build/widgets/nav/index.scss +0 -6
- package/build/widgets/nav/variables.scss +0 -27
- package/build/widgets/overlay/Dropdown.scss +0 -186
- package/build/widgets/overlay/Overlay.scss +0 -68
- package/build/widgets/overlay/Toast.scss +0 -164
- package/build/widgets/overlay/Tooltip.scss +0 -177
- package/build/widgets/overlay/Window.scss +0 -129
- package/build/widgets/overlay/Window.variables.scss +0 -62
- package/build/widgets/overlay/captureMouse.scss +0 -13
- package/build/widgets/overlay/index.scss +0 -15
- package/build/widgets/overlay/variables.scss +0 -85
- package/build/widgets/variables.scss +0 -146
|
@@ -1,251 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "cx/jsx-runtime";
|
|
2
|
-
import { Store } from "../data/Store";
|
|
3
|
-
import { Controller } from "./Controller";
|
|
4
|
-
import { createTestRenderer } from "../util/test/createTestRenderer";
|
|
5
|
-
import { Widget } from "./Widget";
|
|
6
|
-
import { bind } from "./bind";
|
|
7
|
-
import assert from "assert";
|
|
8
|
-
describe("Controller", () => {
|
|
9
|
-
it("invokes lifetime methods", () => {
|
|
10
|
-
let init = 0, prepare = 0, explore = 0, cleanup = 0;
|
|
11
|
-
class TestController extends Controller {
|
|
12
|
-
onInit() {
|
|
13
|
-
init++;
|
|
14
|
-
}
|
|
15
|
-
onExplore() {
|
|
16
|
-
explore++;
|
|
17
|
-
}
|
|
18
|
-
onPrepare() {
|
|
19
|
-
prepare++;
|
|
20
|
-
}
|
|
21
|
-
onCleanup() {
|
|
22
|
-
cleanup++;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
let store = new Store();
|
|
26
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: TestController }) }));
|
|
27
|
-
let tree = component.toJSON();
|
|
28
|
-
assert.equal(init, 1);
|
|
29
|
-
assert.equal(explore, 1);
|
|
30
|
-
assert.equal(prepare, 1);
|
|
31
|
-
assert.equal(cleanup, 1);
|
|
32
|
-
});
|
|
33
|
-
it("widgets invoke controller methods specified as strings", () => {
|
|
34
|
-
let callback = 0;
|
|
35
|
-
class TestController extends Controller {
|
|
36
|
-
callback() {
|
|
37
|
-
++callback;
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
class Cmp extends Widget {
|
|
41
|
-
render(context, instance, key) {
|
|
42
|
-
return null;
|
|
43
|
-
}
|
|
44
|
-
onInit(context, instance) {
|
|
45
|
-
instance.invoke("onTest");
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
let store = new Store();
|
|
49
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx(Cmp, { controller: TestController, onTest: "callback" }) }));
|
|
50
|
-
let tree = component.toJSON();
|
|
51
|
-
assert.equal(callback, 1);
|
|
52
|
-
});
|
|
53
|
-
it("widgets can access controller methods specified in ancestor controllers", () => {
|
|
54
|
-
let callback1 = 0;
|
|
55
|
-
let callback2 = 0;
|
|
56
|
-
class TestController1 extends Controller {
|
|
57
|
-
callback1() {
|
|
58
|
-
++callback1;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
class TestController2 extends Controller {
|
|
62
|
-
callback2() {
|
|
63
|
-
++callback2;
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
class Cmp extends Widget {
|
|
67
|
-
render(context, instance, key) {
|
|
68
|
-
return null;
|
|
69
|
-
}
|
|
70
|
-
onInit(context, instance) {
|
|
71
|
-
instance.invoke("onTest");
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
let store = new Store();
|
|
75
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: TestController1, children: _jsx(Cmp, { controller: TestController2, onTest: "callback1" }) }) }));
|
|
76
|
-
let tree = component.toJSON();
|
|
77
|
-
assert.equal(callback1, 1);
|
|
78
|
-
assert.equal(callback2, 0);
|
|
79
|
-
});
|
|
80
|
-
it("ancestor controllers are initialized first", () => {
|
|
81
|
-
let order = [];
|
|
82
|
-
class TestController1 extends Controller {
|
|
83
|
-
onInit() {
|
|
84
|
-
order.push("1");
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
class TestController2 extends Controller {
|
|
88
|
-
onInit() {
|
|
89
|
-
order.push("2");
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
let store = new Store();
|
|
93
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: TestController1, children: _jsx("div", { controller: TestController2 }) }) }));
|
|
94
|
-
let tree = component.toJSON();
|
|
95
|
-
assert.deepEqual(order, ["1", "2"]);
|
|
96
|
-
});
|
|
97
|
-
it("controllers on invisible elements are not initialized", () => {
|
|
98
|
-
let order = [];
|
|
99
|
-
class TestController1 extends Controller {
|
|
100
|
-
onInit() {
|
|
101
|
-
order.push("1");
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
class TestController2 extends Controller {
|
|
105
|
-
onInit() {
|
|
106
|
-
order.push("2");
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
let store = new Store();
|
|
110
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: TestController1, children: _jsx("div", { visible: false, controller: TestController2 }) }) }));
|
|
111
|
-
let tree = component.toJSON();
|
|
112
|
-
assert.deepEqual(order, ["1"]);
|
|
113
|
-
});
|
|
114
|
-
it("invokes triggers and computables in order of definition", () => {
|
|
115
|
-
let log = [];
|
|
116
|
-
class TestController extends Controller {
|
|
117
|
-
onInit() {
|
|
118
|
-
this.addTrigger("t1", [], () => {
|
|
119
|
-
log.push("t1");
|
|
120
|
-
}, true);
|
|
121
|
-
this.addComputable("c1", [], () => {
|
|
122
|
-
log.push("c1");
|
|
123
|
-
return null;
|
|
124
|
-
});
|
|
125
|
-
this.addTrigger("t2", [], () => {
|
|
126
|
-
log.push("t2");
|
|
127
|
-
}, true);
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
let store = new Store();
|
|
131
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: TestController }) }));
|
|
132
|
-
let tree = component.toJSON();
|
|
133
|
-
assert.deepEqual(log, ["t1", "c1", "t2"]);
|
|
134
|
-
});
|
|
135
|
-
it("is recreated if a component is hidden and shown", () => {
|
|
136
|
-
let initCount = 0;
|
|
137
|
-
class TestController extends Controller {
|
|
138
|
-
onInit() {
|
|
139
|
-
initCount++;
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
let store = new Store();
|
|
143
|
-
store.set("visible", true);
|
|
144
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { visible: bind("visible"), controller: TestController }) }));
|
|
145
|
-
let tree1 = component.toJSON();
|
|
146
|
-
assert.equal(initCount, 1);
|
|
147
|
-
store.set("visible", false);
|
|
148
|
-
let tree2 = component.toJSON();
|
|
149
|
-
assert.equal(tree2, null);
|
|
150
|
-
store.set("visible", true);
|
|
151
|
-
let tree3 = component.toJSON();
|
|
152
|
-
assert.equal(initCount, 2);
|
|
153
|
-
});
|
|
154
|
-
it("allows creation through a factory", () => {
|
|
155
|
-
let store = new Store({ data: { x: 0 } });
|
|
156
|
-
const controllerFactory = ({ store }) => {
|
|
157
|
-
return {
|
|
158
|
-
increment() {
|
|
159
|
-
store.update("x", (x) => x + 1);
|
|
160
|
-
},
|
|
161
|
-
};
|
|
162
|
-
};
|
|
163
|
-
let c = Controller.create(controllerFactory, { store });
|
|
164
|
-
c.increment();
|
|
165
|
-
assert.equal(store.get("x"), 1);
|
|
166
|
-
});
|
|
167
|
-
it("lifetime methods of a functional controller are properly invoked", () => {
|
|
168
|
-
let initCount = 0, destroyCount = 0;
|
|
169
|
-
const testController = () => ({
|
|
170
|
-
onInit() {
|
|
171
|
-
initCount++;
|
|
172
|
-
},
|
|
173
|
-
onDestroy() {
|
|
174
|
-
destroyCount++;
|
|
175
|
-
},
|
|
176
|
-
});
|
|
177
|
-
let store = new Store();
|
|
178
|
-
store.set("visible", true);
|
|
179
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { visible: bind("visible"), controller: testController }) }));
|
|
180
|
-
let tree1 = component.toJSON();
|
|
181
|
-
assert.equal(initCount, 1);
|
|
182
|
-
store.set("visible", false);
|
|
183
|
-
let tree2 = component.toJSON();
|
|
184
|
-
assert.equal(destroyCount, 1);
|
|
185
|
-
store.set("visible", true);
|
|
186
|
-
let tree3 = component.toJSON();
|
|
187
|
-
assert.equal(initCount, 2);
|
|
188
|
-
});
|
|
189
|
-
it("widgets can easily define controller methods", () => {
|
|
190
|
-
let store = new Store({ data: { x: 0 } });
|
|
191
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: {
|
|
192
|
-
increment(count) {
|
|
193
|
-
this.store.update("x", (x) => x + count);
|
|
194
|
-
},
|
|
195
|
-
}, children: _jsx("div", { controller: {
|
|
196
|
-
onInit() {
|
|
197
|
-
this.invokeParentMethod("increment", 1);
|
|
198
|
-
},
|
|
199
|
-
} }) }) }));
|
|
200
|
-
let tree1 = component.toJSON();
|
|
201
|
-
assert.equal(store.get("x"), 1);
|
|
202
|
-
});
|
|
203
|
-
it("functional controllers get store methods through configuration", () => {
|
|
204
|
-
let store = new Store({ data: { x: 0 } });
|
|
205
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: ({ update }) => ({
|
|
206
|
-
increment(count) {
|
|
207
|
-
update("x", (x) => x + count);
|
|
208
|
-
},
|
|
209
|
-
}), children: _jsx("div", { controller: {
|
|
210
|
-
onInit() {
|
|
211
|
-
this.invokeParentMethod("increment", 1);
|
|
212
|
-
},
|
|
213
|
-
} }) }) }));
|
|
214
|
-
let tree1 = component.toJSON();
|
|
215
|
-
assert.equal(store.get("x"), 1);
|
|
216
|
-
});
|
|
217
|
-
it("addComputable accepts refs", () => {
|
|
218
|
-
let store = new Store({ data: { x: 0 } });
|
|
219
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: ({ ref }) => {
|
|
220
|
-
let x = ref("x");
|
|
221
|
-
return {
|
|
222
|
-
onInit() {
|
|
223
|
-
this.addComputable("y", [x], (x) => x + 1);
|
|
224
|
-
},
|
|
225
|
-
};
|
|
226
|
-
} }) }));
|
|
227
|
-
let tree1 = component.toJSON();
|
|
228
|
-
assert.equal(store.get("y"), 1);
|
|
229
|
-
});
|
|
230
|
-
it("invokeParentMethod is invoked on parent instance", () => {
|
|
231
|
-
let testValid = [];
|
|
232
|
-
class TestController1 extends Controller {
|
|
233
|
-
onInit() {
|
|
234
|
-
this.test();
|
|
235
|
-
}
|
|
236
|
-
test() {
|
|
237
|
-
testValid.push(1);
|
|
238
|
-
this.invokeParentMethod("test", 2);
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
class TestController2 extends Controller {
|
|
242
|
-
test(val) {
|
|
243
|
-
testValid.push(val);
|
|
244
|
-
}
|
|
245
|
-
}
|
|
246
|
-
let store = new Store();
|
|
247
|
-
const component = createTestRenderer(store, _jsx("cx", { children: _jsx("div", { controller: TestController2, children: _jsx("div", { controller: TestController1 }) }) }));
|
|
248
|
-
// let tree = component.toJSON();
|
|
249
|
-
assert.deepStrictEqual(testValid, [1, 2]);
|
|
250
|
-
});
|
|
251
|
-
});
|
package/build/ui/Cx.spec.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/build/ui/Cx.spec.js
DELETED
|
@@ -1,153 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "cx/jsx-runtime";
|
|
2
|
-
import { VDOM } from "./VDOM";
|
|
3
|
-
import { ContainerBase } from "./Container";
|
|
4
|
-
import { Store } from "../data/Store";
|
|
5
|
-
import { bind } from "./bind";
|
|
6
|
-
import { createTestRenderer, createTestWidget } from "../util/test/createTestRenderer";
|
|
7
|
-
import assert from "assert";
|
|
8
|
-
describe("Cx", () => {
|
|
9
|
-
it("can render cx content", () => {
|
|
10
|
-
let widget = (_jsx("cx", { children: _jsx("div", { children: "Test" }) }));
|
|
11
|
-
let store = new Store();
|
|
12
|
-
const component = createTestRenderer(store, widget);
|
|
13
|
-
let tree = component.toJSON();
|
|
14
|
-
assert.deepEqual(tree, {
|
|
15
|
-
type: "div",
|
|
16
|
-
props: {},
|
|
17
|
-
children: ["Test"],
|
|
18
|
-
});
|
|
19
|
-
});
|
|
20
|
-
it("store changes preserve the instance", () => {
|
|
21
|
-
let instanceLog = [];
|
|
22
|
-
let storeLog = [];
|
|
23
|
-
let widget = (_jsx("cx", { children: _jsx("div", { text: bind("text"), onExplore: (context, instance) => {
|
|
24
|
-
instanceLog.push(instance);
|
|
25
|
-
storeLog.push(instance.store);
|
|
26
|
-
} }) }));
|
|
27
|
-
let store1 = new Store({ data: { text: "Test1" } });
|
|
28
|
-
let store2 = new Store({ data: { text: "Test2" } });
|
|
29
|
-
const component = createTestRenderer(store1, widget);
|
|
30
|
-
let tree1 = component.toJSON();
|
|
31
|
-
assert.deepEqual(tree1, {
|
|
32
|
-
type: "div",
|
|
33
|
-
props: {},
|
|
34
|
-
children: ["Test1"],
|
|
35
|
-
});
|
|
36
|
-
component.update(createTestWidget(store2, widget));
|
|
37
|
-
let tree2 = component.toJSON();
|
|
38
|
-
assert.deepEqual(tree2, {
|
|
39
|
-
type: "div",
|
|
40
|
-
props: {},
|
|
41
|
-
children: ["Test2"],
|
|
42
|
-
});
|
|
43
|
-
assert.equal(instanceLog.length, 2);
|
|
44
|
-
assert.equal(instanceLog[0], instanceLog[1]); //store changes should preserve the instance
|
|
45
|
-
assert(storeLog[0] === store1);
|
|
46
|
-
assert(storeLog[1] === store2);
|
|
47
|
-
});
|
|
48
|
-
it("invokes lifetime methods in the right order", () => {
|
|
49
|
-
let events = [];
|
|
50
|
-
class TestWidget extends ContainerBase {
|
|
51
|
-
explore(context, instance) {
|
|
52
|
-
super.explore(context, instance);
|
|
53
|
-
events.push(["explore", this.id]);
|
|
54
|
-
}
|
|
55
|
-
exploreCleanup(context, instance) {
|
|
56
|
-
//super.exploreCleanup(context, instance);
|
|
57
|
-
events.push(["exploreCleanup", this.id]);
|
|
58
|
-
}
|
|
59
|
-
prepare(context, instance) {
|
|
60
|
-
//super.prepare(context, instance);
|
|
61
|
-
events.push(["prepare", this.id]);
|
|
62
|
-
}
|
|
63
|
-
prepareCleanup(context, instance) {
|
|
64
|
-
//super.prepareCleanup(context, instance);
|
|
65
|
-
events.push(["prepareCleanup", this.id]);
|
|
66
|
-
}
|
|
67
|
-
render(context, instance, key) {
|
|
68
|
-
events.push(["render", this.id]);
|
|
69
|
-
return VDOM.createElement("div", { key }, this.renderChildren(context, instance));
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
let widget = (_jsx("cx", { children: _jsxs(TestWidget, { id: "0", children: [_jsx(TestWidget, { id: "0.0" }), _jsxs(TestWidget, { id: "0.1", children: [_jsx(TestWidget, { id: "0.1.0" }), _jsx(TestWidget, { id: "0.1.1" })] }), _jsx(TestWidget, { id: "0.2", children: _jsx(TestWidget, { id: "0.2.0" }) })] }) }));
|
|
73
|
-
let store = new Store();
|
|
74
|
-
const component = createTestRenderer(store, widget);
|
|
75
|
-
let tree = component.toJSON();
|
|
76
|
-
assert.deepEqual(tree, {
|
|
77
|
-
type: "div",
|
|
78
|
-
props: {},
|
|
79
|
-
children: [
|
|
80
|
-
{
|
|
81
|
-
type: "div",
|
|
82
|
-
props: {},
|
|
83
|
-
children: null,
|
|
84
|
-
},
|
|
85
|
-
{
|
|
86
|
-
type: "div",
|
|
87
|
-
props: {},
|
|
88
|
-
children: [
|
|
89
|
-
{
|
|
90
|
-
type: "div",
|
|
91
|
-
props: {},
|
|
92
|
-
children: null,
|
|
93
|
-
},
|
|
94
|
-
{
|
|
95
|
-
type: "div",
|
|
96
|
-
props: {},
|
|
97
|
-
children: null,
|
|
98
|
-
},
|
|
99
|
-
],
|
|
100
|
-
},
|
|
101
|
-
{
|
|
102
|
-
type: "div",
|
|
103
|
-
props: {},
|
|
104
|
-
children: [
|
|
105
|
-
{
|
|
106
|
-
type: "div",
|
|
107
|
-
props: {},
|
|
108
|
-
children: null,
|
|
109
|
-
},
|
|
110
|
-
],
|
|
111
|
-
},
|
|
112
|
-
],
|
|
113
|
-
});
|
|
114
|
-
//console.log(events);
|
|
115
|
-
assert.deepEqual(events, [
|
|
116
|
-
["explore", "0"],
|
|
117
|
-
["explore", "0.0"],
|
|
118
|
-
["exploreCleanup", "0.0"],
|
|
119
|
-
["explore", "0.1"],
|
|
120
|
-
["explore", "0.1.0"],
|
|
121
|
-
["exploreCleanup", "0.1.0"],
|
|
122
|
-
["explore", "0.1.1"],
|
|
123
|
-
["exploreCleanup", "0.1.1"],
|
|
124
|
-
["exploreCleanup", "0.1"],
|
|
125
|
-
["explore", "0.2"],
|
|
126
|
-
["explore", "0.2.0"],
|
|
127
|
-
["exploreCleanup", "0.2.0"],
|
|
128
|
-
["exploreCleanup", "0.2"],
|
|
129
|
-
["exploreCleanup", "0"],
|
|
130
|
-
["prepare", "0"],
|
|
131
|
-
["prepare", "0.0"],
|
|
132
|
-
["prepareCleanup", "0.0"],
|
|
133
|
-
["prepare", "0.1"],
|
|
134
|
-
["prepare", "0.1.0"],
|
|
135
|
-
["prepareCleanup", "0.1.0"],
|
|
136
|
-
["prepare", "0.1.1"],
|
|
137
|
-
["prepareCleanup", "0.1.1"],
|
|
138
|
-
["prepareCleanup", "0.1"],
|
|
139
|
-
["prepare", "0.2"],
|
|
140
|
-
["prepare", "0.2.0"],
|
|
141
|
-
["prepareCleanup", "0.2.0"],
|
|
142
|
-
["prepareCleanup", "0.2"],
|
|
143
|
-
["prepareCleanup", "0"],
|
|
144
|
-
["render", "0.2.0"],
|
|
145
|
-
["render", "0.2"],
|
|
146
|
-
["render", "0.1.1"],
|
|
147
|
-
["render", "0.1.0"],
|
|
148
|
-
["render", "0.1"],
|
|
149
|
-
["render", "0.0"],
|
|
150
|
-
["render", "0"],
|
|
151
|
-
]);
|
|
152
|
-
});
|
|
153
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,208 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "cx/jsx-runtime";
|
|
2
|
-
import { Store } from "../data/Store";
|
|
3
|
-
import { createTestRenderer } from "../util/test/createTestRenderer";
|
|
4
|
-
import assert from "assert";
|
|
5
|
-
import { Controller } from "./Controller";
|
|
6
|
-
import { DataProxy } from "./DataProxy";
|
|
7
|
-
import { computable } from "../data/computable";
|
|
8
|
-
import { useState } from "../hooks";
|
|
9
|
-
import { createFunctionalComponent } from "./createFunctionalComponent";
|
|
10
|
-
import { Widget } from "./Widget";
|
|
11
|
-
import { bind } from "./bind";
|
|
12
|
-
import { tpl } from "./tpl";
|
|
13
|
-
describe("DataProxy", () => {
|
|
14
|
-
it("can calculate values", () => {
|
|
15
|
-
let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
|
|
16
|
-
$value: { bind: "value" },
|
|
17
|
-
}, children: _jsx("span", { text: bind("$value") }) }) }));
|
|
18
|
-
let store = new Store({
|
|
19
|
-
data: {
|
|
20
|
-
value: "good",
|
|
21
|
-
},
|
|
22
|
-
});
|
|
23
|
-
const component = createTestRenderer(store, widget);
|
|
24
|
-
let tree = component.toJSON();
|
|
25
|
-
assert.deepEqual(tree, {
|
|
26
|
-
type: "span",
|
|
27
|
-
props: {},
|
|
28
|
-
children: ["good"],
|
|
29
|
-
});
|
|
30
|
-
});
|
|
31
|
-
it("can write into values aliased with bind", () => {
|
|
32
|
-
class TestController extends Controller {
|
|
33
|
-
onInit() {
|
|
34
|
-
this.store.set("$value", "excellent");
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
|
|
38
|
-
$value: { bind: "value" },
|
|
39
|
-
}, controller: TestController, children: _jsx("span", { text: bind("$value") }) }) }));
|
|
40
|
-
let store = new Store({
|
|
41
|
-
data: {
|
|
42
|
-
value: "good",
|
|
43
|
-
},
|
|
44
|
-
});
|
|
45
|
-
const component = createTestRenderer(store, widget);
|
|
46
|
-
let tree = component.toJSON();
|
|
47
|
-
assert(store.get("value"), "excellent");
|
|
48
|
-
assert.deepEqual(tree, {
|
|
49
|
-
type: "span",
|
|
50
|
-
props: {},
|
|
51
|
-
children: ["excellent"],
|
|
52
|
-
});
|
|
53
|
-
});
|
|
54
|
-
it("can write into aliased values using provided setters", () => {
|
|
55
|
-
class TestController extends Controller {
|
|
56
|
-
onInit() {
|
|
57
|
-
this.store.set("$value", "excellent");
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
|
|
61
|
-
$value: {
|
|
62
|
-
expr: computable("value", (value) => value),
|
|
63
|
-
set: (value, { store }) => {
|
|
64
|
-
store.set("value", value);
|
|
65
|
-
},
|
|
66
|
-
},
|
|
67
|
-
}, controller: TestController, children: _jsx("span", { text: bind("$value") }) }) }));
|
|
68
|
-
let store = new Store({
|
|
69
|
-
data: {
|
|
70
|
-
value: "good",
|
|
71
|
-
},
|
|
72
|
-
});
|
|
73
|
-
const component = createTestRenderer(store, widget);
|
|
74
|
-
let tree = component.toJSON();
|
|
75
|
-
assert(store.get("value"), "excellent");
|
|
76
|
-
assert.deepEqual(tree, {
|
|
77
|
-
type: "span",
|
|
78
|
-
props: {},
|
|
79
|
-
children: ["excellent"],
|
|
80
|
-
});
|
|
81
|
-
});
|
|
82
|
-
it("allows shorter syntax", () => {
|
|
83
|
-
let widget = (_jsx("cx", { children: _jsx(DataProxy, { alias: "$value", value: bind("value"), children: _jsx("span", { text: bind("$value") }) }) }));
|
|
84
|
-
let store = new Store({
|
|
85
|
-
data: {
|
|
86
|
-
value: "good",
|
|
87
|
-
},
|
|
88
|
-
});
|
|
89
|
-
const component = createTestRenderer(store, widget);
|
|
90
|
-
let tree = component.toJSON();
|
|
91
|
-
assert.deepEqual(tree, {
|
|
92
|
-
type: "span",
|
|
93
|
-
props: {},
|
|
94
|
-
children: ["good"],
|
|
95
|
-
});
|
|
96
|
-
});
|
|
97
|
-
it("correctly updates aliased data after write", () => {
|
|
98
|
-
class TestController extends Controller {
|
|
99
|
-
onInit() {
|
|
100
|
-
this.store.set("$value", "excellent");
|
|
101
|
-
assert.equal(this.store.get("$value"), "excellent");
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
|
|
105
|
-
$value: { bind: "value" },
|
|
106
|
-
}, controller: TestController, children: _jsx("span", { text: bind("$value") }) }) }));
|
|
107
|
-
let store = new Store({
|
|
108
|
-
data: {
|
|
109
|
-
value: "good",
|
|
110
|
-
},
|
|
111
|
-
});
|
|
112
|
-
const component = createTestRenderer(store, widget);
|
|
113
|
-
let tree = component.toJSON();
|
|
114
|
-
assert(store.get("value"), "excellent");
|
|
115
|
-
assert.deepEqual(tree, {
|
|
116
|
-
type: "span",
|
|
117
|
-
props: {},
|
|
118
|
-
children: ["excellent"],
|
|
119
|
-
});
|
|
120
|
-
});
|
|
121
|
-
it("properly binds structures", () => {
|
|
122
|
-
class TestController extends Controller {
|
|
123
|
-
onInit() {
|
|
124
|
-
this.store.set("$person.firstName", "Jim");
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
|
|
128
|
-
$person: { bind: "person" },
|
|
129
|
-
}, controller: TestController, children: _jsx("span", { text: tpl("{$person.firstName} {$person.lastName}") }) }) }));
|
|
130
|
-
let store = new Store({
|
|
131
|
-
data: {
|
|
132
|
-
person: { firstName: "John", lastName: "Smith" },
|
|
133
|
-
},
|
|
134
|
-
});
|
|
135
|
-
const component = createTestRenderer(store, widget);
|
|
136
|
-
let tree = component.toJSON();
|
|
137
|
-
assert(store.get("person.firstName"), "Jim");
|
|
138
|
-
assert.deepEqual(tree, {
|
|
139
|
-
type: "span",
|
|
140
|
-
props: {},
|
|
141
|
-
children: ["Jim Smith"],
|
|
142
|
-
});
|
|
143
|
-
});
|
|
144
|
-
it("works with Store refs", () => {
|
|
145
|
-
let widget = createFunctionalComponent(() => {
|
|
146
|
-
let valueRef = useState("a");
|
|
147
|
-
return (_jsx("cx", { children: _jsx(DataProxy, { data: {
|
|
148
|
-
$value: valueRef,
|
|
149
|
-
}, children: _jsx("span", { text: bind("$value"), controller: {
|
|
150
|
-
onInit() {
|
|
151
|
-
valueRef.set("b");
|
|
152
|
-
},
|
|
153
|
-
} }) }) }));
|
|
154
|
-
});
|
|
155
|
-
let store = new Store({
|
|
156
|
-
data: {
|
|
157
|
-
//value: "good"
|
|
158
|
-
},
|
|
159
|
-
});
|
|
160
|
-
const component = createTestRenderer(store, widget);
|
|
161
|
-
let tree = component.toJSON();
|
|
162
|
-
assert.deepEqual(tree, {
|
|
163
|
-
type: "span",
|
|
164
|
-
props: {},
|
|
165
|
-
children: ["b"],
|
|
166
|
-
});
|
|
167
|
-
});
|
|
168
|
-
it("controllers set on the DataProxy can see calculated values", () => {
|
|
169
|
-
let value;
|
|
170
|
-
let widget = Widget.create(_jsx("cx", { children: _jsx(DataProxy, { data: {
|
|
171
|
-
$value: 5,
|
|
172
|
-
}, controller: {
|
|
173
|
-
onInit() {
|
|
174
|
-
value = this.store.get("$value");
|
|
175
|
-
},
|
|
176
|
-
} }) }));
|
|
177
|
-
let store = new Store();
|
|
178
|
-
const component = createTestRenderer(store, widget);
|
|
179
|
-
let tree = component.toJSON();
|
|
180
|
-
assert.equal(value, 5);
|
|
181
|
-
});
|
|
182
|
-
it("correctly propagates undefined values over a previous value (bug)", () => {
|
|
183
|
-
let widget = (_jsxs("cx", { children: [_jsx(DataProxy, { data: {
|
|
184
|
-
$value: { bind: "value" },
|
|
185
|
-
}, children: _jsx("span", { text: bind("$value") }) }), _jsx(DataProxy, { data: {
|
|
186
|
-
$value: { bind: "dummy" },
|
|
187
|
-
}, children: _jsx("span", { text: bind("$value") }) })] }));
|
|
188
|
-
let store = new Store({
|
|
189
|
-
data: {
|
|
190
|
-
value: "initial",
|
|
191
|
-
},
|
|
192
|
-
});
|
|
193
|
-
const component = createTestRenderer(store, widget);
|
|
194
|
-
let tree = component.toJSON();
|
|
195
|
-
assert.deepEqual(tree, [
|
|
196
|
-
{
|
|
197
|
-
type: "span",
|
|
198
|
-
props: {},
|
|
199
|
-
children: ["initial"],
|
|
200
|
-
},
|
|
201
|
-
{
|
|
202
|
-
type: "span",
|
|
203
|
-
props: {},
|
|
204
|
-
children: null,
|
|
205
|
-
},
|
|
206
|
-
]);
|
|
207
|
-
});
|
|
208
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "cx/jsx-runtime";
|
|
2
|
-
import { Store } from "../data/Store";
|
|
3
|
-
import { createTestRenderer } from "../util/test/createTestRenderer";
|
|
4
|
-
import assert from "assert";
|
|
5
|
-
import { IsolatedScope } from "./IsolatedScope";
|
|
6
|
-
import { bind } from "./bind";
|
|
7
|
-
describe("IsolatedScope", () => {
|
|
8
|
-
it("prevents multiple re-renders", () => {
|
|
9
|
-
let list = [];
|
|
10
|
-
let widget = (_jsx("cx", { children: _jsx(IsolatedScope, { data: {
|
|
11
|
-
value: { bind: 'value' }
|
|
12
|
-
}, children: _jsx("span", { text: bind("value"), onExplore: (context, { store }) => {
|
|
13
|
-
list.push(store.get("value"));
|
|
14
|
-
} }) }) }));
|
|
15
|
-
let store = new Store({
|
|
16
|
-
data: {
|
|
17
|
-
value: "bad",
|
|
18
|
-
},
|
|
19
|
-
});
|
|
20
|
-
const component = createTestRenderer(store, widget);
|
|
21
|
-
let tree = component.toJSON();
|
|
22
|
-
assert.deepEqual(list, ["bad"]);
|
|
23
|
-
assert.deepEqual(tree, {
|
|
24
|
-
type: "span",
|
|
25
|
-
props: {},
|
|
26
|
-
children: ["bad"],
|
|
27
|
-
});
|
|
28
|
-
//component should not re-render if unrelated data changes
|
|
29
|
-
store.set("dummy", "dummy");
|
|
30
|
-
tree = component.toJSON();
|
|
31
|
-
assert.deepEqual(list, ["bad"]);
|
|
32
|
-
//component should not re-render if unrelated data changes
|
|
33
|
-
store.set("value", "good");
|
|
34
|
-
tree = component.toJSON();
|
|
35
|
-
assert.deepEqual(list, ["bad", "good"]);
|
|
36
|
-
assert.deepEqual(tree, {
|
|
37
|
-
type: "span",
|
|
38
|
-
props: {},
|
|
39
|
-
children: ["good"],
|
|
40
|
-
});
|
|
41
|
-
});
|
|
42
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|