Add tests and fixes for rehydration
* Barracks must get an initial state or state.location is undefined * Replaces document.addEventListener w/ pkg handling existing ready doc
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
const history = require('sheet-router/history')
|
const history = require('sheet-router/history')
|
||||||
const sheetRouter = require('sheet-router')
|
const sheetRouter = require('sheet-router')
|
||||||
const document = require('global/document')
|
const document = require('global/document')
|
||||||
|
const onReady = require('document-ready')
|
||||||
const href = require('sheet-router/href')
|
const href = require('sheet-router/href')
|
||||||
const hash = require('sheet-router/hash')
|
const hash = require('sheet-router/hash')
|
||||||
const hashMatch = require('hash-match')
|
const hashMatch = require('hash-match')
|
||||||
@@ -61,14 +62,14 @@ function choo (opts) {
|
|||||||
_store.model(appInit(startOpts))
|
_store.model(appInit(startOpts))
|
||||||
const createSend = _store.start(startOpts)
|
const createSend = _store.start(startOpts)
|
||||||
_router = start._router = createRouter(_defaultRoute, _routes, createSend)
|
_router = start._router = createRouter(_defaultRoute, _routes, createSend)
|
||||||
const state = _store.state()
|
const state = _store.state({state: {}})
|
||||||
|
|
||||||
if (!selector) {
|
if (!selector) {
|
||||||
const tree = _router(state.location.pathname, state)
|
const tree = _router(state.location.pathname, state)
|
||||||
_rootNode = tree
|
_rootNode = tree
|
||||||
return tree
|
return tree
|
||||||
} else {
|
} else {
|
||||||
document.addEventListener('DOMContentLoaded', function (event) {
|
onReady(function onReady () {
|
||||||
const oldTree = document.querySelector(selector)
|
const oldTree = document.querySelector(selector)
|
||||||
assert.ok(oldTree, 'could not query selector: ' + selector)
|
assert.ok(oldTree, 'could not query selector: ' + selector)
|
||||||
const newTree = _router(state.location.pathname, state)
|
const newTree = _router(state.location.pathname, state)
|
||||||
|
|||||||
@@ -25,6 +25,7 @@
|
|||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"barracks": "^7.0.3",
|
"barracks": "^7.0.3",
|
||||||
|
"document-ready": "~1.0.1",
|
||||||
"global": "^4.3.0",
|
"global": "^4.3.0",
|
||||||
"hash-match": "^1.0.2",
|
"hash-match": "^1.0.2",
|
||||||
"sheet-router": "^3.1.0",
|
"sheet-router": "^3.1.0",
|
||||||
|
|||||||
@@ -0,0 +1,28 @@
|
|||||||
|
const test = require('tape')
|
||||||
|
const onReady = require('document-ready')
|
||||||
|
const choo = require('../../')
|
||||||
|
const view = require('../../html')
|
||||||
|
|
||||||
|
test('rehydration', function (t) {
|
||||||
|
t.plan(2)
|
||||||
|
|
||||||
|
const app = choo()
|
||||||
|
|
||||||
|
app.router((route) => [
|
||||||
|
route('/', function (state, prev, send) {
|
||||||
|
return view`<div id="app-root" onclick=${() => send('test')}>Hello world!</span>`
|
||||||
|
})
|
||||||
|
])
|
||||||
|
|
||||||
|
var node = document.createElement('div')
|
||||||
|
node.innerHTML = app.toString('/')
|
||||||
|
node = node.childNodes[0]
|
||||||
|
document.body.appendChild(node)
|
||||||
|
|
||||||
|
app.start('#app-root')
|
||||||
|
|
||||||
|
onReady(function () {
|
||||||
|
t.equal(node.innerHTML, 'Hello world!', 'same content')
|
||||||
|
t.equal(typeof node.onclick, 'function', 'attaches dom listeners')
|
||||||
|
})
|
||||||
|
})
|
||||||
Reference in New Issue
Block a user