totole/sapper
1
0
Fork 0
mirror of https://github.com/kevin-DL/sapper.git synced 2026-01-22 15:15:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

add hydration test, add window.init function to make it possible

Browse Source
This commit is contained in:
Rich Harris
2018-01-20 12:40:31 -05:00
parent a305d3cea1
commit 61daba7a64
2 changed files with 33 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
test/app/templates/main.js
View File

@@ -1,6 +1,6 @@
import { init } from '../../../runtime.js'; import { init } from '../../../runtime.js';
// `routes` is an array of route objects injected by Sapper window.init = () => {
init(document.querySelector('#sapper'), __routes__); init(document.querySelector('#sapper'), __routes__);
window.READY = true;
window.READY = true; };

37
test/common/test.js
View File

@@ -92,6 +92,10 @@ function run(env) {
PORT = port; PORT = port;
base = `http://localhost:${PORT}`; base = `http://localhost:${PORT}`;
Nightmare.action('init', function(done) {
this.evaluate_now(() => window.init(), done);
});
global.fetch = (url, opts) => { global.fetch = (url, opts) => {
if (url[0] === '/') url = `${base}${url}`; if (url[0] === '/') url = `${base}${url}`;
return fetch(url, opts); return fetch(url, opts);
@@ -175,7 +179,7 @@ function run(env) {
}); });
it('navigates to a new page without reloading', () => { it('navigates to a new page without reloading', () => {
return nightmare.goto(base).wait(() => window.READY).wait(200) return nightmare.goto(base).init().wait(200)
.then(() => { .then(() => {
return capture(() => nightmare.click('a[href="/about"]')); return capture(() => nightmare.click('a[href="/about"]'));
}) })
@@ -195,7 +199,8 @@ function run(env) {
it('navigates programmatically', () => { it('navigates programmatically', () => {
return nightmare return nightmare
.goto(`${base}/about`) .goto(`${base}/about`)
.wait(() => window.READY) .init()
.wait(100)
.click('.goto') .click('.goto')
.wait(() => window.location.pathname === '/blog/what-is-sapper') .wait(() => window.location.pathname === '/blog/what-is-sapper')
.wait(100) .wait(100)
@@ -208,7 +213,8 @@ function run(env) {
it('prefetches programmatically', () => { it('prefetches programmatically', () => {
return nightmare return nightmare
.goto(`${base}/about`) .goto(`${base}/about`)
.wait(() => window.READY) .init()
.wait(100)
.then(() => { .then(() => {
return capture(() => { return capture(() => {
return nightmare return nightmare
@@ -224,7 +230,7 @@ function run(env) {
it('scrolls to active deeplink', () => { it('scrolls to active deeplink', () => {
return nightmare return nightmare
.goto(`${base}/blog/a-very-long-post#four`) .goto(`${base}/blog/a-very-long-post#four`)
.wait(() => window.READY) .init()
.wait(100) .wait(100)
.evaluate(() => window.scrollY) .evaluate(() => window.scrollY)
.then(scrollY => { .then(scrollY => {
@@ -235,7 +241,7 @@ function run(env) {
it('reuses prefetch promise', () => { it('reuses prefetch promise', () => {
return nightmare return nightmare
.goto(`${base}/blog`) .goto(`${base}/blog`)
.wait(() => window.READY) .init()
.wait(200) .wait(200)
.then(() => { .then(() => {
return capture(() => { return capture(() => {
@@ -263,7 +269,7 @@ function run(env) {
it('cancels navigation if subsequent navigation occurs during preload', () => { it('cancels navigation if subsequent navigation occurs during preload', () => {
return nightmare return nightmare
.goto(base) .goto(base)
.wait(() => window.READY) .init()
.click('a[href="/slow-preload"]') .click('a[href="/slow-preload"]')
.wait(100) .wait(100)
.click('a[href="/about"]') .click('a[href="/about"]')
@@ -290,7 +296,7 @@ function run(env) {
it('passes entire request object to preload', () => { it('passes entire request object to preload', () => {
return nightmare return nightmare
.goto(`${base}/show-url`) .goto(`${base}/show-url`)
.wait(() => window.READY) .init()
.evaluate(() => document.querySelector('p').innerHTML) .evaluate(() => document.querySelector('p').innerHTML)
.end().then(html => { .end().then(html => {
assert.equal(html, `URL is /show-url`); assert.equal(html, `URL is /show-url`);
@@ -300,7 +306,7 @@ function run(env) {
it('calls a delete handler', () => { it('calls a delete handler', () => {
return nightmare return nightmare
.goto(`${base}/delete-test`) .goto(`${base}/delete-test`)
.wait(() => window.READY) .init().wait(100)
.click('.del') .click('.del')
.wait(() => window.deleted) .wait(() => window.deleted)
.evaluate(() => window.deleted.id) .evaluate(() => window.deleted.id)
@@ -308,6 +314,21 @@ function run(env) {
assert.equal(id, 42); assert.equal(id, 42);
}); });
}); });
it('hydrates initial route', () => {
return nightmare.goto(base)
.wait('h1')
.evaluate(() => {
window.h1 = document.querySelector('h1');
})
.init().wait(100)
.evaluate(() => {
return document.querySelector('h1') === window.h1;
})
.then(matches => {
assert.ok(matches);
});
});
}); });
describe('headers', () => { describe('headers', () => {