Fix state initialization (#1652)

* Add test-utils/components.js and its tests

* Tests: group together tests with/without components

* Tests: factory => closure components

* Tests: add dummy forEach blocks around sections with components

* Tests: render/test-components tweaks

* Tests: Wrap some component definitions in `createComponent()` calls

These are the ones that would have been tedious to automate.
jscodeshift will handle the remaining ones

* Tests: wrap the rest of the components definitions

* Tests: enable the three kind of components in all related files but api/tests/test-route.js

* Add test-utils/components.js to index.html where needed

* Tests: Some more render/tests/test-component.js refactoring

* Tests: enable tests for #1638

* fix #1638

* Test: ensure that recycled components get a fresh state

* Tests: add a test for onbeforeupdate and recycled nodes

* Fix recycled components initialization
fix #1641
This commit is contained in:
Pierre-Yves Gérardy 2017-02-25 21:53:51 +01:00 committed by Isiah Meadows
parent 3786373b58
commit 60e8f307f1
15 changed files with 1615 additions and 1406 deletions

27
test-utils/components.js Normal file
View file

@ -0,0 +1,27 @@
module.exports = [
{
kind: 'POJO',
create: function(methods) {
var res = {view: function() {return {tag:'div'}}}
Object.keys(methods || {}).forEach(function(m){res[m] = methods[m]})
return res
}
}, {
kind: 'constructible',
create: function(methods) {
function res(){}
res.prototype.view = function() {return {tag:'div'}}
Object.keys(methods || {}).forEach(function(m){res.prototype[m] = methods[m]})
return res
}
}, {
kind: 'closure',
create: function(methods) {
return function() {
var res = {view: function() {return {tag:'div'}}}
Object.keys(methods || {}).forEach(function(m){res[m] = methods[m]})
return res
}
}
}
]

View file

@ -14,12 +14,14 @@
<script src="../../test-utils/xhrMock.js"></script>
<script src="../../test-utils/domMock.js"></script>
<script src="../../test-utils/browserMock.js"></script>
<script src="../../test-utils/component.js"></script>
<script src="test-callAsync.js"></script>
<script src="test-parseURL.js"></script>
<script src="test-pushStateMock.js"></script>
<script src="test-xhrMock.js"></script>
<script src="test-domMock.js"></script>
<script src="test-browserMock.js"></script>
<script src="test-component.js"></script>
<script>require("../../ospec/ospec").run()</script>
</body>

View file

@ -0,0 +1,54 @@
"use strict"
var o = require("../../ospec/ospec")
var components = require("../../test-utils/components")
o.spec("test-utils/components", function() {
var test = o.spy(function(component) {
return function() {
o('works', function() {
o(typeof component.kind).equals('string')
var methods = {oninit: function(){}, view: function(){}}
var cmp1, cmp2
if (component.kind === "POJO") {
cmp1 = component.create()
cmp2 = component.create(methods)
} else if (component.kind === "constructible") {
cmp1 = new (component.create())
cmp2 = new (component.create(methods))
} else if (component.kind === "closure") {
cmp1 = component.create()()
cmp2 = component.create(methods)()
} else {
throw new Error("unexpected component kind")
}
o(cmp1 != null).equals(true)
o(typeof cmp1.view).equals("function")
var vnode = cmp1.view()
o(vnode != null).equals(true)
o(vnode).deepEquals({tag: "div"})
if (component.kind !== 'constructible') {
o(cmp2).deepEquals(methods)
} else {
// deepEquals doesn't search the prototype, do it manually
o(cmp2 != null).equals(true)
o(cmp2.view).equals(methods.view)
o(cmp2.oninit).equals(methods.oninit)
}
})
}
})
o.after(function(){
o(test.callCount).equals(3)
})
components.forEach(function(component) {
o.spec(component.kind, test(component))
})
})