mirror of https://github.com/sveltejs/svelte
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
145 lines
3.2 KiB
145 lines
3.2 KiB
import * as path from 'path';
|
|
import * as fs from 'fs';
|
|
|
|
import {
|
|
assert,
|
|
showOutput,
|
|
loadConfig,
|
|
loadSvelte,
|
|
env,
|
|
setupHtmlEqual,
|
|
shouldUpdateExpected
|
|
} from '../helpers';
|
|
|
|
let compileOptions = null;
|
|
|
|
const sveltePath = process.cwd();
|
|
|
|
describe('hydration', () => {
|
|
before(() => {
|
|
const svelte = loadSvelte();
|
|
|
|
require.extensions['.svelte'] = function (module, filename) {
|
|
const options = Object.assign(
|
|
{
|
|
filename,
|
|
hydratable: true,
|
|
format: 'cjs',
|
|
sveltePath
|
|
},
|
|
compileOptions
|
|
);
|
|
|
|
const { js } = svelte.compile(fs.readFileSync(filename, 'utf-8'), options);
|
|
|
|
return module._compile(js.code, filename);
|
|
};
|
|
|
|
return setupHtmlEqual();
|
|
});
|
|
|
|
function runTest(dir) {
|
|
if (dir[0] === '.') return;
|
|
|
|
const config = loadConfig(`./hydration/samples/${dir}/_config.js`);
|
|
const solo = config.solo || /\.solo/.test(dir);
|
|
|
|
if (solo && process.env.CI) {
|
|
throw new Error('Forgot to remove `solo: true` from test');
|
|
}
|
|
|
|
(config.skip ? it.skip : solo ? it.only : it)(dir, () => {
|
|
const cwd = path.resolve(`${__dirname}/samples/${dir}`);
|
|
|
|
compileOptions = config.compileOptions || {};
|
|
compileOptions.accessors = 'accessors' in config ? config.accessors : true;
|
|
|
|
const window = env();
|
|
|
|
try {
|
|
global.window = window;
|
|
|
|
const SvelteComponent = require(`${cwd}/main.svelte`).default;
|
|
|
|
const target = window.document.body;
|
|
const head = window.document.head;
|
|
|
|
target.innerHTML = fs.readFileSync(`${cwd}/_before.html`, 'utf-8');
|
|
|
|
let before_head;
|
|
try {
|
|
before_head = fs.readFileSync(`${cwd}/_before_head.html`, 'utf-8');
|
|
head.innerHTML = before_head;
|
|
} catch (err) {
|
|
// continue regardless of error
|
|
}
|
|
|
|
const snapshot = config.snapshot ? config.snapshot(target) : {};
|
|
|
|
const component = new SvelteComponent({
|
|
target,
|
|
hydrate: true,
|
|
props: config.props
|
|
});
|
|
|
|
try {
|
|
assert.htmlEqual(target.innerHTML, fs.readFileSync(`${cwd}/_after.html`, 'utf-8'));
|
|
} catch (error) {
|
|
if (shouldUpdateExpected()) {
|
|
fs.writeFileSync(`${cwd}/_after.html`, target.innerHTML);
|
|
console.log(`Updated ${cwd}/_after.html.`);
|
|
} else {
|
|
throw error;
|
|
}
|
|
}
|
|
|
|
if (before_head) {
|
|
try {
|
|
assert.htmlEqual(head.innerHTML, fs.readFileSync(`${cwd}/_after_head.html`, 'utf-8'));
|
|
} catch (error) {
|
|
if (shouldUpdateExpected()) {
|
|
fs.writeFileSync(`${cwd}/_after_head.html`, head.innerHTML);
|
|
console.log(`Updated ${cwd}/_after_head.html.`);
|
|
} else {
|
|
throw error;
|
|
}
|
|
}
|
|
}
|
|
|
|
if (config.snapshot) {
|
|
const snapshot_after = config.snapshot(target);
|
|
for (const s in snapshot_after) {
|
|
assert.equal(
|
|
snapshot_after[s],
|
|
snapshot[s],
|
|
`Expected snapshot key "${s}" to have same value/reference`
|
|
);
|
|
}
|
|
}
|
|
|
|
if (config.test) {
|
|
config.test(assert, target, snapshot, component, window);
|
|
} else {
|
|
component.$destroy();
|
|
assert.equal(target.innerHTML, '');
|
|
}
|
|
} catch (err) {
|
|
showOutput(cwd, {
|
|
hydratable: true
|
|
});
|
|
throw err;
|
|
}
|
|
|
|
if (config.show) {
|
|
showOutput(cwd, {
|
|
hydratable: true
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
fs.readdirSync(`${__dirname}/samples`).forEach((dir) => {
|
|
runTest(dir);
|
|
});
|
|
});
|