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

Add goto function (#46)

Browse Source 
* WIP

* programmatic navigation

* get tests working

* wait longer
This commit is contained in:
Rich Harris
2017-12-23 13:15:40 -05:00
committed by GitHub
parent e8d510b261
commit db1c1f332a
11 changed files with 1279 additions and 3764 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
test/app/routes/about.html
View File

@@ -6,14 +6,21 @@
<h1>About this site</h1>
<p>This is the 'about' page. There's not much here.</p>
<button on:click='goto("/blog/what-is-sapper")'>What is Sapper?</button>
</Layout>
<script>
import Layout from './_components/Layout.html';
import { goto } from '../../../runtime/app.js';
export default {
components: {
Layout
},
methods: {
goto
}
};
</script>

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

@@ -1,4 +1,4 @@
import { init } from '__app__';
import { init } from '../../../runtime/app.js';
// `routes` is an array of route objects injected by Sapper
init(document.querySelector('#sapper'), __routes__);

15
test/app/webpack.client.config.js
View File

@@ -1,7 +1,5 @@
const config = require('../../webpack/config.js');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
entry: config.client.entry(),
@@ -24,27 +22,18 @@ module.exports = {
}
}
},
config.dev && {
{
test: /\.css$/,
use: [
{ loader: "style-loader" },
{ loader: "css-loader" }
]
},
!config.dev && {
test: /\.css$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [{ loader: 'css-loader', options: { sourceMap: config.dev } }]
})
}
].filter(Boolean)
},
plugins: [
config.dev && new webpack.HotModuleReplacementPlugin(),
!config.dev && new ExtractTextPlugin('main.css'),
!config.dev && new webpack.optimize.ModuleConcatenationPlugin(),
!config.dev && new UglifyJSPlugin()
!config.dev && new webpack.optimize.ModuleConcatenationPlugin()
].filter(Boolean),
devtool: config.dev ? 'inline-source-map' : false
};

3
test/app/webpack.server.config.js
View File

@@ -1,7 +1,4 @@
const config = require('../../webpack/config.js');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
entry: config.server.entry(),

42
test/common/test.js
View File

@@ -1,4 +1,3 @@
const fs = require('fs');
const path = require('path');
const assert = require('assert');
const express = require('express');
@@ -12,7 +11,7 @@ run('development');
function run(env) {
describe(`env=${env}`, function () {
this.timeout(30000);
this.timeout(5000);
let PORT;
let server;
@@ -23,7 +22,7 @@ function run(env) {
let base;
function get(url) {
return new Promise((fulfil, reject) => {
return new Promise(fulfil => {
const req = {
url,
method: 'GET'
@@ -93,7 +92,7 @@ function run(env) {
return result;
};
app = express();
const app = express();
app.use(serve('assets'));
@@ -128,6 +127,14 @@ function run(env) {
nightmare.on('console', (type, ...args) => {
console[type](...args);
});
nightmare.on('page', (type, ...args) => {
if (type === 'error') {
console.error(args[1]);
} else {
console.warn(type, args);
}
});
});
afterEach(async () => {
@@ -177,6 +184,20 @@ function run(env) {
assert.deepEqual(requests.map(r => r.url), []);
});
it('navigates programmatically', async () => {
await nightmare
.goto(`${base}/about`)
.wait(() => window.READY)
.click('button')
.wait(() => window.location.pathname === '/blog/what-is-sapper')
.wait(100);
assert.equal(
await nightmare.evaluate(() => document.title),
'What is Sapper?'
);
});
});
describe('headers', () => {
@@ -188,8 +209,8 @@ function run(env) {
'text/html'
);
assert.ok
(/<\/client\/main.\w+\.js\>;rel="preload";as="script", <\/client\/_.\d+.\w+.js>;rel="preload";as="script"/.test(headers['Link']),
assert.ok(
/<\/client\/main.\w+\.js>;rel="preload";as="script", <\/client\/_.\d+.\w+.js>;rel="preload";as="script"/.test(headers['Link']),
headers['Link']
);
});
@@ -200,10 +221,13 @@ function run(env) {
function exec(cmd) {
return new Promise((fulfil, reject) => {
require('child_process').exec(cmd, (err, stdout, stderr) => {
if (err) return reject(err);
if (err) {
process.stdout.write(stdout);
process.stderr.write(stderr);
return reject(err);
}
process.stdout.write(stdout);
process.stderr.write(stderr);
fulfil();
});
});

75
test/launch.js
View File

@@ -1,75 +0,0 @@
const fs = require('fs');
const path = require('path');
const rimraf = require('rimraf');
const child_process = require('child_process');
// ensure sapper doesn't exist in app/node_modules
rimraf.sync(
path.join(__dirname, 'app/node_modules/sapper')
);
rimraf.sync(
path.join(__dirname, 'app/node_modules/.bin/sapper')
);
// create symlinks
fs.symlinkSync(
path.join(__dirname, '..'),
path.join(__dirname, 'app/node_modules/sapper')
);
fs.symlinkSync(
path.join(__dirname, '../cli/index.js'),
path.join(__dirname, 'app/node_modules/.bin/sapper')
);
const app_dir = path.join(__dirname, 'app');
function start_server() {
const server = child_process.spawn(process.execPath, ['server.js'], {
cwd: app_dir,
env: {
NODE_ENV: 'development'
},
stdio: 'pipe'
});
server.stdout.on('data', (data) => {
process.stdout.write(data);
});
server.stderr.on('data', (data) => {
process.stderr.write(data);
});
}
function launch() {
if (process.argv[2] === '--dev') {
start_server();
} else {
child_process.exec(`npm run build`, {
cwd: app_dir
}, (err, stdout, stderr) => {
if (err) throw err;
process.stdout.write(stdout);
process.stderr.write(stderr);
start_server();
});
}
}
// this is a terrible hack
if (process.env.APPVEYOR) {
child_process.exec(`npm install`, {
cwd: app_dir
}, (err, stdout, stderr) => {
if (err) throw err;
process.stdout.write(stdout);
process.stderr.write(stderr);
launch();
});
} else {
launch();
}