dothtml 5.2.2 → 5.2.4
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/lib/dothtml.js +1 -1
- package/package.json +2 -1
- package/.vscode/launch.json +0 -34
- package/.vscode/settings.json +0 -6
- package/azure-pipelines.yml +0 -14
- package/babel.config.js +0 -1
- package/jest.config.ts +0 -207
- package/out.md +0 -1340
- package/src/arg-callback-obj.ts +0 -76
- package/src/built-in-components/nav-link.ts +0 -21
- package/src/built-in-components/router.ts +0 -315
- package/src/component.ts +0 -415
- package/src/dot-util.ts +0 -69
- package/src/dot.ts +0 -1147
- package/src/dothtml.ts +0 -39
- package/src/err.ts +0 -22
- package/src/event-bus.ts +0 -39
- package/src/i-dot.ts +0 -787
- package/src/node-polyfill.ts +0 -11
- package/src/observable-array.ts +0 -289
- package/src/styling/css-types.ts/css-angle.ts +0 -18
- package/src/styling/css-types.ts/css-color.ts +0 -233
- package/src/styling/css-types.ts/css-complex.ts +0 -20
- package/src/styling/css-types.ts/css-data-type.ts +0 -9
- package/src/styling/css-types.ts/css-filter.ts +0 -134
- package/src/styling/css-types.ts/css-length.ts +0 -20
- package/src/styling/css-types.ts/css-number.ts +0 -12
- package/src/styling/css-types.ts/css-percentage.ts +0 -10
- package/src/styling/css-types.ts/css-transform.ts +0 -220
- package/src/styling/css-types.ts/css-unknown.ts +0 -13
- package/src/styling/css-types.ts/css-url.ts +0 -41
- package/src/styling/i-dotcss.ts +0 -1198
- package/src/styling/style-builder.ts +0 -967
- package/src/styling/unit-function-tables.ts +0 -24
- package/tsconfig.json +0 -99
- package/unittests/advanced-bindings.test.ts +0 -421
- package/unittests/array-evaluation.test.ts +0 -7
- package/unittests/basic-functionality.test.ts +0 -88
- package/unittests/calc.test.ts +0 -6
- package/unittests/class-binding.test.ts +0 -227
- package/unittests/components/component-decorator.-.ts +0 -14
- package/unittests/components/components-data.test.ts +0 -153
- package/unittests/components/components.test.ts +0 -258
- package/unittests/computed.test.ts +0 -35
- package/unittests/core.ts +0 -66
- package/unittests/element-and-attribute-coverage.test.ts +0 -472
- package/unittests/hooks.test.ts +0 -67
- package/unittests/immutable-if.test.ts +0 -19
- package/unittests/input-bindings.test.ts +0 -166
- package/unittests/integration.test.ts +0 -5
- package/unittests/iterations.test.ts +0 -18
- package/unittests/logic.test.ts +0 -18
- package/unittests/non-function-props-rerender.test.ts +0 -86
- package/unittests/refs.test.ts +0 -36
- package/unittests/routing.-.ts +0 -56
- package/unittests/scopes.test.ts +0 -22
- package/unittests/special-tags.test.ts +0 -39
- package/unittests/styles.test.ts +0 -9
- package/unittests/styling/animations.test.ts +0 -14
- package/unittests/styling/filters.test.ts +0 -23
- package/unittests/styling/inline-styling.test.ts +0 -18
- package/unittests/styling/pseudo-selectors.test.ts +0 -33
- package/unittests/styling/transformations.test.ts +0 -234
- package/unittests/styling/value-interpretation.test.ts +0 -3
- package/unittests/testpage.ts +0 -5
- package/unittests/wait.test.ts +0 -31
- package/webpack.config.js +0 -28
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
export const AllLengthUnits = [
|
|
2
|
-
{unit:"Em"},
|
|
3
|
-
{unit:"Ex"},
|
|
4
|
-
{unit:"Ch"},
|
|
5
|
-
{unit:"Rem"},
|
|
6
|
-
{unit:"Vw"},
|
|
7
|
-
{unit:"Vh"},
|
|
8
|
-
{unit:"Vmin"},
|
|
9
|
-
{unit:"Vmax"},
|
|
10
|
-
{unit:"%", jsName:"P"},
|
|
11
|
-
{unit:"Cm"},
|
|
12
|
-
{unit:"Mm"},
|
|
13
|
-
{unit:"In"},
|
|
14
|
-
{unit:"Px"},
|
|
15
|
-
{unit:"Pt"},
|
|
16
|
-
{unit:"Pc"}
|
|
17
|
-
];
|
|
18
|
-
|
|
19
|
-
export const AllAngleUnits = [
|
|
20
|
-
{unit:"Deg"},
|
|
21
|
-
{unit:"Grad"},
|
|
22
|
-
{unit:"Rad"},
|
|
23
|
-
{unit:"Turn"}
|
|
24
|
-
];
|
package/tsconfig.json
DELETED
|
@@ -1,99 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"compilerOptions": {
|
|
3
|
-
/* Basic Options */
|
|
4
|
-
// "incremental": true, /* Enable incremental compilation */
|
|
5
|
-
"target": "ESNEXT", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
|
|
6
|
-
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
|
|
7
|
-
// "lib": [], /* Specify library files to be included in the compilation. */
|
|
8
|
-
"allowJs": false, /* Allow javascript files to be compiled. */
|
|
9
|
-
// "checkJs": true, /* Report errors in .js files. */
|
|
10
|
-
// "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
|
|
11
|
-
"declaration": true, /* Generates corresponding '.d.ts' file. */
|
|
12
|
-
// "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
|
|
13
|
-
// "sourceMap": true, /* Generates corresponding '.map' file. */
|
|
14
|
-
// "outFile": "./tsout/dot.js", /* Concatenate and emit output to single file. */
|
|
15
|
-
"outDir": "./lib", /* Redirect output structure to the directory. */
|
|
16
|
-
"rootDir": "./src", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
|
|
17
|
-
// "rootDir": ".", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
|
|
18
|
-
// "composite": true, /* Enable project compilation */
|
|
19
|
-
// "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */
|
|
20
|
-
// "removeComments": true, /* Do not emit comments to output. */
|
|
21
|
-
// "noEmit": true, /* Do not emit outputs. */
|
|
22
|
-
// "importHelpers": true, /* Import emit helpers from 'tslib'. */
|
|
23
|
-
// "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
|
|
24
|
-
// "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
|
|
25
|
-
|
|
26
|
-
/* Strict Type-Checking Options */
|
|
27
|
-
// "strict": true, /* Enable all strict type-checking options. */
|
|
28
|
-
"noImplicitAny": false, /* Raise error on expressions and declarations with an implied 'any' type. */
|
|
29
|
-
// "strictNullChecks": true, /* Enable strict null checks. */
|
|
30
|
-
// "strictFunctionTypes": true, /* Enable strict checking of function types. */
|
|
31
|
-
// "strictBindCallApply": true, /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
|
|
32
|
-
"strictPropertyInitialization": false, /* Enable strict checking of property initialization in classes. */
|
|
33
|
-
// "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
|
|
34
|
-
// "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
|
|
35
|
-
|
|
36
|
-
/* Additional Checks */
|
|
37
|
-
// "noUnusedLocals": true, /* Report errors on unused locals. */
|
|
38
|
-
// "noUnusedParameters": true, /* Report errors on unused parameters. */
|
|
39
|
-
// "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
|
|
40
|
-
// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
|
|
41
|
-
|
|
42
|
-
/* Module Resolution Options */
|
|
43
|
-
// "moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
|
|
44
|
-
// "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
|
|
45
|
-
// "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
|
|
46
|
-
// "typeRoots": [], /* List of folders to include type definitions from. */
|
|
47
|
-
//"types": [], /* Type declaration files to be included in compilation. */
|
|
48
|
-
// "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
|
|
49
|
-
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
|
|
50
|
-
// "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
|
|
51
|
-
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
|
|
52
|
-
|
|
53
|
-
/* Source Map Options */
|
|
54
|
-
// "sourceRoot": "", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
|
|
55
|
-
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
|
|
56
|
-
// "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
|
|
57
|
-
// "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
|
|
58
|
-
|
|
59
|
-
/* Experimental Options */
|
|
60
|
-
"experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
|
|
61
|
-
"emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
|
|
62
|
-
|
|
63
|
-
/* Advanced Options */
|
|
64
|
-
// "forceConsistentCasingInFileNames": true, /* Disallow inconsistently-cased references to the same file. */
|
|
65
|
-
// "baseUrl": "./src", /* Don't use this. Base directory to resolve non-absolute module names. */
|
|
66
|
-
// "paths": {
|
|
67
|
-
// "*": ["../../../src/"], // This mapping is relative to "baseUrl"
|
|
68
|
-
// },
|
|
69
|
-
"useDefineForClassFields": false, // Important. Without this default values of undefined are auto-assigned after the factory setter.
|
|
70
|
-
},
|
|
71
|
-
|
|
72
|
-
// "include": [
|
|
73
|
-
// "public/scripts/**/*"
|
|
74
|
-
// ],
|
|
75
|
-
"exclude": [
|
|
76
|
-
"node_modules",
|
|
77
|
-
"lib",
|
|
78
|
-
"tsout",
|
|
79
|
-
"unittests",
|
|
80
|
-
"**/*.spec.ts",
|
|
81
|
-
"webpack.config.js",
|
|
82
|
-
"jest.config.ts"
|
|
83
|
-
],
|
|
84
|
-
// "references": [
|
|
85
|
-
// //{ "path": "../../tsconfig.json" },
|
|
86
|
-
// { "path": "../.." },
|
|
87
|
-
// ]
|
|
88
|
-
/*"files": [
|
|
89
|
-
"./src/index.ts",
|
|
90
|
-
"./src/game-instance.ts",
|
|
91
|
-
"./src/game-object.ts",
|
|
92
|
-
"./src/i-draw-engine.ts",
|
|
93
|
-
"./src/physical-object.ts",
|
|
94
|
-
"./src/util.ts",
|
|
95
|
-
"./src/core/fixed-timer.ts",
|
|
96
|
-
"./src/physics-manager.ts",
|
|
97
|
-
"./src/game-object-factory.ts",
|
|
98
|
-
],*/
|
|
99
|
-
}
|
|
@@ -1,421 +0,0 @@
|
|
|
1
|
-
import addTest from "./core";
|
|
2
|
-
import dot from "../src/dothtml";
|
|
3
|
-
import Component from "../src/component";
|
|
4
|
-
|
|
5
|
-
abstract class BaseComp extends Component{
|
|
6
|
-
args: Array<any>
|
|
7
|
-
|
|
8
|
-
props:{
|
|
9
|
-
propA: string,
|
|
10
|
-
propB: string,
|
|
11
|
-
propC: string,
|
|
12
|
-
prop1: number,
|
|
13
|
-
prop2: number,
|
|
14
|
-
prop3: number,
|
|
15
|
-
propYN1: boolean,
|
|
16
|
-
propYN2: boolean,
|
|
17
|
-
propYN3: boolean,
|
|
18
|
-
propAbc: Array<{[key: string]: any}>,
|
|
19
|
-
propXyz: Array<{[key: string]: any}>,
|
|
20
|
-
}={
|
|
21
|
-
propA: "",
|
|
22
|
-
propB: "",
|
|
23
|
-
propC: "",
|
|
24
|
-
prop1: 0,
|
|
25
|
-
prop2: 0,
|
|
26
|
-
prop3: 0,
|
|
27
|
-
propYN1: false,
|
|
28
|
-
propYN2: false,
|
|
29
|
-
propYN3: false,
|
|
30
|
-
propAbc: [],
|
|
31
|
-
propXyz: [],
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
constructor(...args: Array<any>){
|
|
35
|
-
super();
|
|
36
|
-
this.args = args;
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
addTest("Bind to number prop.", function(){
|
|
41
|
-
class MyComp extends BaseComp{
|
|
42
|
-
builder(){
|
|
43
|
-
var ret = dot.span(()=>this.props.prop1);
|
|
44
|
-
return ret;
|
|
45
|
-
}
|
|
46
|
-
ready(){
|
|
47
|
-
this.props.prop1++;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
return dot.h(new MyComp());
|
|
53
|
-
}, "<span>1</span>");
|
|
54
|
-
|
|
55
|
-
addTest("Bind to calculated prop.", function(){
|
|
56
|
-
class MyComp extends BaseComp{
|
|
57
|
-
builder(){
|
|
58
|
-
var ret = dot.div(()=>dot.p("I have " + this.props.prop1 + "!"));
|
|
59
|
-
return ret;
|
|
60
|
-
}
|
|
61
|
-
ready(){
|
|
62
|
-
this.props.prop1+=10;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
return dot.h(new MyComp());
|
|
68
|
-
}, "<div><p>I have 10!</p></div>");
|
|
69
|
-
|
|
70
|
-
addTest("Bind to array.", function(){
|
|
71
|
-
class MyComp extends BaseComp{
|
|
72
|
-
builder(){
|
|
73
|
-
return dot.ul(
|
|
74
|
-
dot.each(()=>this.props.propXyz, (v, i)=>{
|
|
75
|
-
return dot.li(v.value)
|
|
76
|
-
})
|
|
77
|
-
);
|
|
78
|
-
}
|
|
79
|
-
ready(){
|
|
80
|
-
this.props.propXyz.push({value: 5});
|
|
81
|
-
this.props.propXyz.push({value: 3});
|
|
82
|
-
this.props.propXyz.push({value: 1});
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
var data = [];
|
|
88
|
-
|
|
89
|
-
return dot.h(new MyComp(data));
|
|
90
|
-
|
|
91
|
-
}, "<ul><li>5</li><li>3</li><li>1</li></ul>"); // If stops working, add a delay.
|
|
92
|
-
|
|
93
|
-
addTest("Bind to array, modify original.", function(){
|
|
94
|
-
class MyComp extends BaseComp{
|
|
95
|
-
builder(){
|
|
96
|
-
this.props.propAbc = this.props.propXyz;
|
|
97
|
-
return dot.ul(
|
|
98
|
-
dot.each(()=>this.props.propAbc, (v, i)=>{
|
|
99
|
-
return dot.li(v.value)
|
|
100
|
-
})
|
|
101
|
-
);
|
|
102
|
-
}
|
|
103
|
-
ready(){
|
|
104
|
-
this.props.propXyz.push({value: 5});
|
|
105
|
-
this.props.propXyz.push({value: 3});
|
|
106
|
-
this.props.propXyz.push({value: 1});
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
var data = [];
|
|
112
|
-
|
|
113
|
-
return dot.h(new MyComp(data));
|
|
114
|
-
|
|
115
|
-
}, "<ul><li>5</li><li>3</li><li>1</li></ul>"); // If stops working, add a delay.
|
|
116
|
-
|
|
117
|
-
addTest("Bind to start of array.", function(){
|
|
118
|
-
class MyComp extends BaseComp{
|
|
119
|
-
builder(){
|
|
120
|
-
return dot.ul(
|
|
121
|
-
dot.each(()=>this.props.propAbc, (v, i)=>{
|
|
122
|
-
return dot.li(v.value)
|
|
123
|
-
})
|
|
124
|
-
);
|
|
125
|
-
}
|
|
126
|
-
ready(){
|
|
127
|
-
this.props.propAbc.push({value: 5});
|
|
128
|
-
this.props.propAbc.push({value: 3});
|
|
129
|
-
this.props.propAbc.unshift({value: 1});
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
return dot.h(new MyComp());
|
|
135
|
-
|
|
136
|
-
}, "<ul><li>1</li><li>5</li><li>3</li></ul>");
|
|
137
|
-
|
|
138
|
-
addTest("Bind to array out of order.", function(){
|
|
139
|
-
class MyComp extends BaseComp{
|
|
140
|
-
builder(){
|
|
141
|
-
return dot.ul(
|
|
142
|
-
dot.each(()=>this.props.propAbc, (v, i)=>{
|
|
143
|
-
return dot.li(v.value)
|
|
144
|
-
})
|
|
145
|
-
);
|
|
146
|
-
}
|
|
147
|
-
ready(){
|
|
148
|
-
this.props.propAbc.push({value: 5});
|
|
149
|
-
this.props.propAbc.push({value: 3});
|
|
150
|
-
this.props.propAbc.splice(1, 0, {value: 1});
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
return dot.h(new MyComp());
|
|
156
|
-
|
|
157
|
-
}, "<ul><li>5</li><li>1</li><li>3</li></ul>");
|
|
158
|
-
|
|
159
|
-
addTest("Bind 2 to array out of order.", function(){
|
|
160
|
-
class MyComp extends BaseComp{
|
|
161
|
-
builder(){
|
|
162
|
-
return dot.ul(
|
|
163
|
-
dot.each(()=>this.props.propAbc, (v, i)=>{
|
|
164
|
-
return dot.li(v.value)
|
|
165
|
-
})
|
|
166
|
-
);
|
|
167
|
-
}
|
|
168
|
-
ready(){
|
|
169
|
-
this.props.propAbc.push({value: 5});
|
|
170
|
-
this.props.propAbc.push({value: 3});
|
|
171
|
-
this.props.propAbc.splice(1, 0, {value: "a"}, {value: "b"});
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
return dot.h(new MyComp());
|
|
177
|
-
|
|
178
|
-
}, "<ul><li>5</li><li>a</li><li>b</li><li>3</li></ul>");
|
|
179
|
-
|
|
180
|
-
addTest("Remove from bound array.", function(){
|
|
181
|
-
class MyComp extends BaseComp{
|
|
182
|
-
builder(){
|
|
183
|
-
return dot.ul(
|
|
184
|
-
dot.each(()=>this.props.propAbc, (v, i)=>{
|
|
185
|
-
return dot.li(v.value)
|
|
186
|
-
})
|
|
187
|
-
);
|
|
188
|
-
}
|
|
189
|
-
ready(){
|
|
190
|
-
this.props.propAbc.push({value: 5});
|
|
191
|
-
this.props.propAbc.push({value: "A"});
|
|
192
|
-
this.props.propAbc.push({value: "B"});
|
|
193
|
-
this.props.propAbc.push({value: 1});
|
|
194
|
-
// this.props.propAbc.splice(1,2);
|
|
195
|
-
this.props.propAbc.splice(1,2, {value: 3});
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
}
|
|
199
|
-
|
|
200
|
-
return dot.h(new MyComp());
|
|
201
|
-
|
|
202
|
-
}, "<ul><li>5</li><li>3</li><li>1</li></ul>");
|
|
203
|
-
|
|
204
|
-
addTest("Set value in bound array.", function(){
|
|
205
|
-
class MyComp extends BaseComp{
|
|
206
|
-
builder(){
|
|
207
|
-
return dot.ul(
|
|
208
|
-
dot.each(()=>this.props.propAbc, (v, i)=>{
|
|
209
|
-
return dot.li(v.value)
|
|
210
|
-
})
|
|
211
|
-
);
|
|
212
|
-
}
|
|
213
|
-
ready(){
|
|
214
|
-
this.props.propAbc.push({value: 5});
|
|
215
|
-
this.props.propAbc.push({value: 3});
|
|
216
|
-
this.props.propAbc.push({value: 1});
|
|
217
|
-
|
|
218
|
-
this.props.propAbc[1] = {value: "YES!"};
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
return dot.h(new MyComp());
|
|
224
|
-
|
|
225
|
-
}, "<ul><li>5</li><li>YES!</li><li>1</li></ul>"); // If stops working, add a delay.
|
|
226
|
-
|
|
227
|
-
addTest("Conditional rendering.", function(){
|
|
228
|
-
class MyComp extends BaseComp{
|
|
229
|
-
builder(){
|
|
230
|
-
this.props.propYN1 = false;
|
|
231
|
-
this.props.propYN2 = true;
|
|
232
|
-
var ret = dot.div(
|
|
233
|
-
dot.div("OUTER1")
|
|
234
|
-
.when(()=>this.props.propYN1, ()=>dot
|
|
235
|
-
.p("A"))
|
|
236
|
-
.when(()=>this.props.propYN2, ()=>dot
|
|
237
|
-
.p("B"))
|
|
238
|
-
.div("OUTER2")
|
|
239
|
-
);
|
|
240
|
-
return ret;
|
|
241
|
-
}
|
|
242
|
-
ready(){
|
|
243
|
-
this.props.propYN1 = !this.props.propYN1;
|
|
244
|
-
this.props.propYN2 = !this.props.propYN2;
|
|
245
|
-
}
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
return dot.h(new MyComp());
|
|
249
|
-
}, "<div><div>OUTER1</div><p>A</p><div>OUTER2</div></div>");
|
|
250
|
-
|
|
251
|
-
addTest("Conditional rendering - out of order.", function(){
|
|
252
|
-
class MyComp extends BaseComp{
|
|
253
|
-
builder(){
|
|
254
|
-
this.props.propYN1 = false;
|
|
255
|
-
this.props.propYN2 = false;
|
|
256
|
-
this.props.propYN3 = false;
|
|
257
|
-
var ret = dot.div(dot.div().when(()=>this.props.propYN1, ()=>dot.p("A")).when(()=>this.props.propYN2, ()=>dot.p("B")).when(()=>this.props.propYN3, ()=>dot.p("C")).div());
|
|
258
|
-
return ret;
|
|
259
|
-
}
|
|
260
|
-
ready(){
|
|
261
|
-
this.props.propYN2 = true;
|
|
262
|
-
this.props.propYN3 = true;
|
|
263
|
-
this.props.propYN1 = true;
|
|
264
|
-
}
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
return dot.h(new MyComp());
|
|
268
|
-
}, "<div><div></div><p>A</p><p>B</p><p>C</p><div></div></div>");
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
addTest("Conditional rendering - if true->false else.", function(){
|
|
272
|
-
class MyComp extends BaseComp{
|
|
273
|
-
builder(){
|
|
274
|
-
this.props.propYN1 = false;
|
|
275
|
-
var ret = dot.div(
|
|
276
|
-
dot.div("OUTER1")
|
|
277
|
-
.when(()=>this.props.propYN1, ()=>dot
|
|
278
|
-
.p("A"))
|
|
279
|
-
.otherwise(()=>dot
|
|
280
|
-
.p("B"))
|
|
281
|
-
.div("OUTER2")
|
|
282
|
-
);
|
|
283
|
-
return ret;
|
|
284
|
-
}
|
|
285
|
-
ready(){
|
|
286
|
-
this.props.propYN1 = !this.props.propYN1;
|
|
287
|
-
}
|
|
288
|
-
|
|
289
|
-
}
|
|
290
|
-
|
|
291
|
-
return dot.h(new MyComp());
|
|
292
|
-
}, "<div><div>OUTER1</div><p>A</p><div>OUTER2</div></div>");
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
addTest("Conditional rendering - if true->false elseif true.", function(){
|
|
296
|
-
class MyComp extends BaseComp{
|
|
297
|
-
builder(){
|
|
298
|
-
this.props.propYN1 = true;
|
|
299
|
-
this.props.propYN2 = true;
|
|
300
|
-
var ret = dot.div(
|
|
301
|
-
dot.div("OUTER1")
|
|
302
|
-
.when(()=>this.props.propYN1, ()=>dot
|
|
303
|
-
.p("A"))
|
|
304
|
-
.otherwiseWhen(()=>this.props.propYN2, ()=>dot
|
|
305
|
-
.p("B"))
|
|
306
|
-
.otherwise(()=>dot
|
|
307
|
-
.p("C"))
|
|
308
|
-
.div("OUTER2")
|
|
309
|
-
);
|
|
310
|
-
return ret;
|
|
311
|
-
}
|
|
312
|
-
ready(){
|
|
313
|
-
this.props.propYN1 = false;
|
|
314
|
-
}
|
|
315
|
-
}
|
|
316
|
-
|
|
317
|
-
return dot.h(new MyComp());
|
|
318
|
-
}, "<div><div>OUTER1</div><p>B</p><div>OUTER2</div></div>");
|
|
319
|
-
|
|
320
|
-
addTest("Conditional rendering - if true->false elseif true->false.", function(){
|
|
321
|
-
class MyComp extends BaseComp{
|
|
322
|
-
builder(){
|
|
323
|
-
this.props.propYN1 = true;
|
|
324
|
-
this.props.propYN2 = true;
|
|
325
|
-
var ret = dot.div(
|
|
326
|
-
dot.div("OUTER1")
|
|
327
|
-
.when(()=>this.props.propYN1, ()=>dot
|
|
328
|
-
.p("A"))
|
|
329
|
-
.otherwiseWhen(()=>this.props.propYN2, ()=>dot
|
|
330
|
-
.p("B"))
|
|
331
|
-
.otherwise(()=>dot
|
|
332
|
-
.p("C"))
|
|
333
|
-
.div("OUTER2")
|
|
334
|
-
);
|
|
335
|
-
return ret;
|
|
336
|
-
}
|
|
337
|
-
ready(){
|
|
338
|
-
this.props.propYN1 = false;
|
|
339
|
-
this.props.propYN2 = false;
|
|
340
|
-
}
|
|
341
|
-
}
|
|
342
|
-
|
|
343
|
-
return dot.h(new MyComp());
|
|
344
|
-
}, "<div><div>OUTER1</div><p>C</p><div>OUTER2</div></div>");
|
|
345
|
-
|
|
346
|
-
addTest("Conditional rendering - if true->false elseif false->true.", function(){
|
|
347
|
-
class MyComp extends BaseComp{
|
|
348
|
-
builder(){
|
|
349
|
-
this.props.propYN1 = true;
|
|
350
|
-
this.props.propYN2 = false;
|
|
351
|
-
var ret = dot.div(
|
|
352
|
-
dot.div("OUTER1")
|
|
353
|
-
.when(()=>this.props.propYN1, ()=>dot
|
|
354
|
-
.p("A"))
|
|
355
|
-
.otherwiseWhen(()=>this.props.propYN2, ()=>dot
|
|
356
|
-
.p("B"))
|
|
357
|
-
.otherwise(()=>dot
|
|
358
|
-
.p("C"))
|
|
359
|
-
.div("OUTER2")
|
|
360
|
-
);
|
|
361
|
-
return ret;
|
|
362
|
-
}
|
|
363
|
-
ready(){
|
|
364
|
-
this.props.propYN1 = false;
|
|
365
|
-
this.props.propYN2 = true;
|
|
366
|
-
}
|
|
367
|
-
}
|
|
368
|
-
|
|
369
|
-
return dot.h(new MyComp());
|
|
370
|
-
}, "<div><div>OUTER1</div><p>B</p><div>OUTER2</div></div>");
|
|
371
|
-
|
|
372
|
-
addTest("Conditional rendering - if true else true.", function(){
|
|
373
|
-
class MyComp extends BaseComp{
|
|
374
|
-
builder(){
|
|
375
|
-
this.props.propYN1 = false;
|
|
376
|
-
this.props.propYN2 = true;
|
|
377
|
-
var ret = dot.div(
|
|
378
|
-
dot.div("OUTER1")
|
|
379
|
-
.when(()=>this.props.propYN1, ()=>dot
|
|
380
|
-
.p("A"))
|
|
381
|
-
.otherwiseWhen(()=>this.props.propYN2, ()=>dot
|
|
382
|
-
.p("B"))
|
|
383
|
-
.otherwise(()=>dot
|
|
384
|
-
.p("C"))
|
|
385
|
-
.div("OUTER2")
|
|
386
|
-
);
|
|
387
|
-
return ret;
|
|
388
|
-
}
|
|
389
|
-
ready(){
|
|
390
|
-
this.props.propYN1 = true;
|
|
391
|
-
}
|
|
392
|
-
}
|
|
393
|
-
|
|
394
|
-
return dot.h(new MyComp());
|
|
395
|
-
}, "<div><div>OUTER1</div><p>A</p><div>OUTER2</div></div>");
|
|
396
|
-
|
|
397
|
-
addTest("Conditional rendering - if true else false->true.", function(){
|
|
398
|
-
class MyComp extends BaseComp{
|
|
399
|
-
builder(){
|
|
400
|
-
this.props.propYN1 = false;
|
|
401
|
-
this.props.propYN2 = false;
|
|
402
|
-
var ret = dot.div(
|
|
403
|
-
dot.div("OUTER1")
|
|
404
|
-
.when(()=>this.props.propYN1, ()=>dot
|
|
405
|
-
.p("A"))
|
|
406
|
-
.otherwiseWhen(()=>this.props.propYN2, ()=>dot
|
|
407
|
-
.p("B"))
|
|
408
|
-
.otherwise(()=>dot
|
|
409
|
-
.p("C"))
|
|
410
|
-
.div("OUTER2")
|
|
411
|
-
);
|
|
412
|
-
return ret;
|
|
413
|
-
}
|
|
414
|
-
ready(){
|
|
415
|
-
this.props.propYN1 = true;
|
|
416
|
-
|
|
417
|
-
}
|
|
418
|
-
}
|
|
419
|
-
|
|
420
|
-
return dot.h(new MyComp());
|
|
421
|
-
}, "<div><div>OUTER1</div><p>A</p><div>OUTER2</div></div>");
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import addTest from "./core";
|
|
2
|
-
import dot from "../src/dothtml";
|
|
3
|
-
|
|
4
|
-
addTest("Evaluate array.", function(){ return dot.div([1, 2, 3, 4]); }, "<div>1234</div>");
|
|
5
|
-
addTest("Evaluate array of functions..", function(){ return dot.div([function(){return 1}, function(){return 2}]); }, "<div>12</div>");
|
|
6
|
-
addTest("Evaluate array of dot.", function(){ return dot.div([dot.div(1), dot.div(2), dot.div(3), dot.div(4)]); }, "<div><div>1</div><div>2</div><div>3</div><div>4</div></div>");
|
|
7
|
-
addTest("Evaluate array of dot into h.", function(){ return dot.h([dot.div(1), dot.div(2), dot.div(3), dot.div(4)]); }, "<div>1</div><div>2</div><div>3</div><div>4</div>");
|
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
import addTest from "./core";
|
|
2
|
-
import dot from "../src/dothtml";
|
|
3
|
-
|
|
4
|
-
addTest("Dot object.", function(){ return dot; }, "");
|
|
5
|
-
addTest("Calling dot as a function.", function(){ return dot(); }, "");
|
|
6
|
-
//addTest("Targeting.", function(){ return dot("body"); }, "");
|
|
7
|
-
addTest("Write text.", function(){ return dot.h(1); }, "1");
|
|
8
|
-
addTest("Write 2 texts.", function(){ return dot.h(1).h(2); }, "12");
|
|
9
|
-
addTest("Write HTML.", function(){ return dot.h("<div></div>"); }, "<div></div>");
|
|
10
|
-
addTest("Escape HTML.", function(){ return dot.t("<div></div>"); }, "<div></div>");
|
|
11
|
-
addTest("Div.", function(){ return dot.div(); }, "<div></div>");
|
|
12
|
-
addTest("Number in a div.", function(){ return dot.div(1); }, "<div>1</div>");
|
|
13
|
-
addTest("String in a div.", function(){ return dot.div("1"); }, "<div>1</div>");
|
|
14
|
-
addTest("Boolean in a div.", function(){ return dot.div(true); }, "<div>true</div>");
|
|
15
|
-
// addTest("JSON object in a div.", function(){ return dot.div({}); }, "<div></div>"); // Not supported anymore.
|
|
16
|
-
addTest("Function in a div.", function(){ return dot.div(function(){return dot.h(1)}) }, "<div>1</div>");
|
|
17
|
-
addTest("HTML in a div.", function(){ return dot.div("<div></div>"); }, "<div><div></div></div>");
|
|
18
|
-
addTest("Nested content.", function(){ return dot.div(dot.div(1)); }, "<div><div>1</div></div>");
|
|
19
|
-
addTest("Side by side divs.", function(){ return dot.div().div(); }, "<div></div><div></div>");
|
|
20
|
-
addTest("Side by side w/ content.", function(){ return dot.div(1).div(2); }, "<div>1</div><div>2</div>");
|
|
21
|
-
addTest("Outside the box.", function(){ return dot.h(1).div(2).h(3); }, "1<div>2</div>3");
|
|
22
|
-
addTest("Irregular nesting.", function(){
|
|
23
|
-
return dot.h(1)
|
|
24
|
-
.div(2)
|
|
25
|
-
.h(3)
|
|
26
|
-
.div(
|
|
27
|
-
dot.h(4)
|
|
28
|
-
.div(5)
|
|
29
|
-
.h(6)
|
|
30
|
-
.div(dot.div(7))
|
|
31
|
-
.h(8)
|
|
32
|
-
).h(9); }, "1<div>2</div>3<div>4<div>5</div>6<div><div>7</div></div>8</div>9");
|
|
33
|
-
addTest("Class.", function(){ return dot.div()["class"](1); }, "<div class=\"1\"></div>");
|
|
34
|
-
addTest("2nd class.", function(){ return dot.div().div()["class"](2).div(); }, "<div></div><div class=\"2\"></div><div></div>");
|
|
35
|
-
addTest("Failing class.", function(){ return dot.h(1)["class"](2); }, "1");
|
|
36
|
-
// addTest("In class.", function(){ return dot.div(dot["class"](1)); }, "<div class=\"1\"></div>");
|
|
37
|
-
addTest("Wrong class.", function(){ return dot.div(dot.h("2")["class"](1)); }, "<div>2</div>");
|
|
38
|
-
// addTest("Wrong class 2.", function(){ return dot.h(dot["class"](1).h(2)); }, "2");
|
|
39
|
-
|
|
40
|
-
// not supported.
|
|
41
|
-
// addTest("Classception.", function(){ return dot.div(dot.div(dot["class"](1))); }, "<div><div class=\"1\"></div></div>");
|
|
42
|
-
// addTest("Classception.", function(){ return dot.div(dot.h(dot["class"](1).h(2))); }, "<div>2</div>");
|
|
43
|
-
// addTest("Classception - parallel classy divs.", function(){ return dot.div([dot.div(dot["class"](1)), dot.div(dot["class"](2))]); }, "<div><div class=\"1\"></div><div class=\"2\"></div></div>");
|
|
44
|
-
// addTest("One class at a time.", function(){ return dot.div(dot["class"](1)); }, "<div class=\"1\"></div>");
|
|
45
|
-
addTest("Skipped class.", function(){ return dot.div().h(1)["class"](2); }, "<div></div>1");
|
|
46
|
-
// Not supported.
|
|
47
|
-
// addTest("Missed class.", function(){ return dot["class"](1); }, "");
|
|
48
|
-
//addTest("Conflicting classes.", function(){ return dot.div(dot)["class"](1)["class"](2); }, "<div class=\"2\"></div>"); // DEPRECATED
|
|
49
|
-
addTest("Conflicting classes.", function(){ return dot.div(dot)["class"](1)["class"](2); }, "<div class=\"1 2\"></div>");
|
|
50
|
-
addTest("Void element.", function(){ return dot.img(); }, "<img>");
|
|
51
|
-
addTest("Self-explaining attribute.", function(){ return dot.button().disabled(); }, "<button disabled=\"disabled\"></button>");
|
|
52
|
-
addTest("Not a self-explaining attribute..", function(){ return dot.input().value(""); }, "<input value=\"\">");
|
|
53
|
-
addTest("Passing dot to h.", function(){ return dot.h(dot.div()); }, "<div></div>");
|
|
54
|
-
addTest("Passing function to h.", function(){ return dot.h(function(){return "<div></div>"}); }, "<div></div>");
|
|
55
|
-
// Not supported.
|
|
56
|
-
// addTest("Two internal attributes.", function(){ return dot.div(dot["class"]("1").id("two-internal-attributes")); }, "<div class=\"1\" id=\"two-internal-attributes\"></div>");
|
|
57
|
-
// Note that empty is required for the core tests to work, but I also want an explicit test for it here in case the core tests change.
|
|
58
|
-
addTest("Empty an element.", function(){ return dot.h(function(){ var ret = dot.i().div(
|
|
59
|
-
dot.span("123").span("abc")
|
|
60
|
-
); var del = ret.getLast();
|
|
61
|
-
ret = ret.b(); setTimeout(function(){dot(del).empty() }, 0); return ret; }) }, "<i></i><div></div><b></b>");
|
|
62
|
-
addTest("Remove an element.", function(){ return dot.h(function(){ var ret = dot.i().div(
|
|
63
|
-
dot.span("123").span("abc")
|
|
64
|
-
); var del = ret.getLast();
|
|
65
|
-
ret = ret.b(); setTimeout(function(){dot(del).remove() }, 0); return ret; }) }, "<i></i><b></b>");
|
|
66
|
-
|
|
67
|
-
// Undefined:
|
|
68
|
-
|
|
69
|
-
addTest("Undefined div.", function(){ return dot.div(undefined) }, "<div></div>");
|
|
70
|
-
addTest("Undefined html.", function(){ return dot.h(undefined) }, ""); //On the fence about this.
|
|
71
|
-
addTest("Undefined text.", function(){ return dot.t(undefined) }, "undefined"); //If the user really wants to print out undefined.
|
|
72
|
-
|
|
73
|
-
// Last node:
|
|
74
|
-
|
|
75
|
-
//addTest("Get Last Node.", function(){ return dot.h(dot.div("text").__lastNode.innerHTML)}, "text"); // No longer supported.
|
|
76
|
-
//addTest("Get Last Node - h.", function(){ return dot.h(dot.h("<div>text</div>").__lastNode.innerHTML)}, "text"); // No longer supported.
|
|
77
|
-
addTest("Get Last Node - h.", function(){ return dot.h(dot.h("<div>text</div>").getLast().innerHTML);}, "text");
|
|
78
|
-
addTest("Using getLast() function.", function(){ return dot.h(dot.div("text").getLast().innerHTML);}, "text");
|
|
79
|
-
|
|
80
|
-
// Script
|
|
81
|
-
|
|
82
|
-
//The expected functionality of these test cases changed in version 1.3.0.
|
|
83
|
-
addTest("Script, no return.", function(){ return dot.script(function(){1 + 1;}).div(1); }, "<div>1</div>");
|
|
84
|
-
addTest("Script, return dot.", function(){ return dot.script(function(){return 2;}).div(1); }, "<div>1</div>");
|
|
85
|
-
addTest("Script, return function.", function(){ return dot.script(function(){return function(){return 2};}).div(1); }, "<div>1</div>");
|
|
86
|
-
|
|
87
|
-
// CSS
|
|
88
|
-
addTest("CSS module included.", function(){ return dot.h(dot["css"] ? "yes" : "no"); }, "yes");
|