refactor test/sourcemaps

use _config.js, indent with tabs, rename variables,
pull/5428/head
Milan Hauth 5 years ago
parent e753489455
commit 6d06b7b8da

@ -1,7 +1,9 @@
import * as fs from "fs"; import * as fs from "fs";
import * as path from "path"; import * as path from "path";
import * as assert from "assert"; import * as assert from "assert";
import { svelte } from "../helpers.js"; import { loadConfig, svelte } from "../helpers.js";
// keep source-map at version 0.7.x
// https://github.com/mozilla/source-map/issues/400
import { SourceMapConsumer } from "source-map"; import { SourceMapConsumer } from "source-map";
import { getLocator } from "locate-character"; import { getLocator } from "locate-character";
@ -9,81 +11,80 @@ describe("sourcemaps", () => {
fs.readdirSync(`${__dirname}/samples`).forEach(dir => { fs.readdirSync(`${__dirname}/samples`).forEach(dir => {
if (dir[0] === ".") return; if (dir[0] === ".") return;
const config = loadConfig(`${__dirname}/samples/${dir}/_config.js`);
// add .solo to a sample directory name to only run that test // add .solo to a sample directory name to only run that test
const solo = /\.solo/.test(dir); const solo = config.solo || /\.solo/.test(dir);
const skip = /\.skip/.test(dir); const skip = config.skip || /\.skip/.test(dir);
if (solo && process.env.CI) { if (solo && process.env.CI) {
throw new Error("Forgot to remove `solo: true` from test"); throw new Error("Forgot to remove `solo: true` from test");
} }
(solo ? it.only : skip ? it.skip : it)(dir, async () => { (solo ? it.only : skip ? it.skip : it)(dir, async () => {
const filename = path.resolve( const inputFile = path.resolve(`${__dirname}/samples/${dir}/input.svelte`);
`${__dirname}/samples/${dir}/input.svelte` const outputBase = path.resolve(`${__dirname}/samples/${dir}/_actual`);
);
const outputFilename = path.resolve(
`${__dirname}/samples/${dir}/output`
);
const preprocessorFilename = path.resolve( const input = {};
`${__dirname}/samples/${dir}/_preprocessor.js` input.code = fs.readFileSync(inputFile, "utf-8");
) input.locate = getLocator(input.code);
const input = fs.readFileSync(filename, "utf-8").replace(/\s+$/, ""); const preprocessed = await svelte.preprocess(
let processed_input = input; input.code,
let processed_map = null; config.preprocess, {
filename: "input.svelte"
});
if (fs.existsSync(preprocessorFilename)) { const { js, css } = svelte.compile(
let { preprocessors } = require(preprocessorFilename); preprocessed.code, {
if (preprocessors.length > 0) { filename: "input.svelte",
({ code: processed_input, map: processed_map } = await svelte.preprocess(input, preprocessors, { filename: 'input.svelte' })); sourcemap: preprocessed.map,
} // filenames for sourcemaps
} outputFilename: "output.js",
cssOutputFilename: "output.css",
const { js, css } = svelte.compile(processed_input, {
filename,
sourcemap: processed_map,
outputFilename: `${outputFilename}.js`,
cssOutputFilename: `${outputFilename}.css`
}); });
const _code = js.code.replace(/Svelte v\d+\.\d+\.\d+/, match => match.replace(/\d/g, 'x')); js.code = js.code.replace(
/generated by Svelte v\d+\.\d+\.\d+/,
match => match.replace(/\d/g, "x")
);
fs.writeFileSync(`${outputBase}.html`, preprocessed.code);
if (preprocessed.map) {
fs.writeFileSync(`${outputBase}.html.map`, JSON.stringify(preprocessed.map, null, 2));
}
fs.writeFileSync( fs.writeFileSync(
`${outputFilename}.js`, `${outputBase}.js`,
`${_code}\n//# sourceMappingURL=output.js.map` `${js.code}\n//# sourceMappingURL=output.js.map`
); );
fs.writeFileSync( fs.writeFileSync(
`${outputFilename}.js.map`, `${outputBase}.js.map`,
JSON.stringify(js.map, null, " ") JSON.stringify(js.map, 0, 2)
); );
if (css.code) { if (css.code) {
fs.writeFileSync( fs.writeFileSync(
`${outputFilename}.css`, `${outputBase}.css`,
`${css.code}\n/*# sourceMappingURL=output.css.map */` `${css.code}\n/*# sourceMappingURL=output.css.map */`
); );
fs.writeFileSync( fs.writeFileSync(
`${outputFilename}.css.map`, `${outputBase}.css.map`,
JSON.stringify(css.map, null, " ") JSON.stringify(css.map, 0, 2)
); );
} }
assert.deepEqual(js.map.sources, ["input.svelte"]); assert.deepEqual(js.map.sources, ["input.svelte"]);
if (css.map) assert.deepEqual(css.map.sources, ["input.svelte"]); if (css.map) assert.deepEqual(css.map.sources, ["input.svelte"]);
const { test } = require(`./samples/${dir}/test.js`); const { test } = require(`./samples/${dir}/test.js`);
const locateInSource = getLocator(input); js.mapConsumer = await new SourceMapConsumer(js.map);
js.locate = getLocator(js.code);
const smc = await new SourceMapConsumer(js.map); css.mapConsumer = css.map && await new SourceMapConsumer(css.map);
const locateInGenerated = getLocator(_code); css.locate = getLocator(css.code || "");
const smcCss = css.map && await new SourceMapConsumer(css.map); test({ assert, input, js, css });
const locateInGeneratedCss = getLocator(css.code || '');
test({ assert, code: _code, map: js.map, smc, smcCss, locateInSource, locateInGenerated, locateInGeneratedCss });
}); });
}); });
}); });

@ -1,12 +1,12 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expected = locateInSource('foo.bar.baz'); const expected = input.locate('foo.bar.baz');
let start; let start;
let actual; let actual;
start = locateInGenerated('ctx[0].bar.baz'); start = js.locate('ctx[0].bar.baz');
actual = smc.originalPositionFor({ actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -18,9 +18,9 @@ export function test({ assert, smc, locateInSource, locateInGenerated }) {
column: expected.column column: expected.column
}); });
start = locateInGenerated('ctx[0].bar.baz', start.character + 1); start = js.locate('ctx[0].bar.baz', start.character + 1);
actual = smc.originalPositionFor({ actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });

@ -1,13 +1,14 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expected = locateInSource('potato'); const expected = input.locate('potato');
let start; let start;
start = locateInGenerated('potato'); start = js.locate('potato');
start = locateInGenerated('potato', start.character + 1); start = js.locate('potato', start.character + 1);
start = locateInGenerated('potato', start.character + 1); // we need the third instance of 'potato' start = js.locate('potato', start.character + 1);
// we need the third instance of 'potato'
const actual = smc.originalPositionFor({ const actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });

@ -1,12 +1,12 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expected = locateInSource('bar.baz'); const expected = input.locate('bar.baz');
let start; let start;
let actual; let actual;
start = locateInGenerated('bar.baz'); start = js.locate('bar.baz');
actual = smc.originalPositionFor({ actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -18,9 +18,9 @@ export function test({ assert, smc, locateInSource, locateInGenerated }) {
column: expected.column column: expected.column
}); });
start = locateInGenerated('bar.baz', start.character + 1); start = js.locate('bar.baz', start.character + 1);
actual = smc.originalPositionFor({ actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });

@ -4,4 +4,4 @@
.foo { .foo {
color: red; color: red;
} }
</style> </style>

@ -1,14 +1,14 @@
export function test({ assert, smcCss, locateInSource, locateInGeneratedCss }) { export function test({ assert, input, css }) {
const expected = locateInSource( '.foo' ); const expected = input.locate('.foo');
const start = locateInGeneratedCss( '.foo' ); const start = css.locate('.foo');
const actual = smcCss.originalPositionFor({ const actual = css.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
assert.deepEqual( actual, { assert.deepEqual(actual, {
source: 'input.svelte', source: 'input.svelte',
name: null, name: null,
line: expected.line + 1, line: expected.line + 1,

@ -1,3 +1,3 @@
{#each foo as bar} {#each foo as bar}
<span>{bar}</span> <span>{bar}</span>
{/each} {/each}

@ -1,10 +1,10 @@
export function test({ assert, code, smc, map, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const startIndex = code.indexOf('create_main_fragment'); const startIndex = js.code.indexOf('create_main_fragment');
const expected = locateInSource('each'); const expected = input.locate('each');
const start = locateInGenerated('length', startIndex); const start = js.locate('length', startIndex);
const actual = smc.originalPositionFor({ const actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });

@ -1,16 +1,18 @@
import MagicString from 'magic-string'; import MagicString from 'magic-string';
export const preprocessors = [{ export default {
markup: ({content, filename}) => { preprocess: {
const src = new MagicString(content); markup: ({ content, filename }) => {
const idx = content.indexOf("baritone"); const src = new MagicString(content);
src.overwrite(idx, idx+"baritone".length, "bar"); const idx = content.indexOf("baritone");
return { src.overwrite(idx, idx+"baritone".length, "bar");
code: src.toString(), return {
map: src.generateMap({ code: src.toString(),
source: filename, map: src.generateMap({
includeContent: false source: filename,
}) includeContent: false
}; })
} };
}]; }
}
};

@ -1,10 +1,10 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expectedBar = locateInSource('baritone.baz'); const expectedBar = input.locate('baritone.baz');
const expectedBaz = locateInSource('.baz'); const expectedBaz = input.locate('.baz');
let start = locateInGenerated('bar.baz'); let start = js.locate('bar.baz');
const actualbar = smc.originalPositionFor({ const actualbar = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -16,9 +16,9 @@ export function test({ assert, smc, locateInSource, locateInGenerated }) {
column: expectedBar.column column: expectedBar.column
}); });
start = locateInGenerated('.baz'); start = js.locate('.baz');
const actualbaz = smc.originalPositionFor({ const actualbaz = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });

@ -1,51 +1,48 @@
import MagicString from 'magic-string'; import MagicString from 'magic-string';
export const preprocessors = [{ export default {
markup: ({ content, filename }) => { preprocess: {
const src = new MagicString(content); markup: ({ content, filename }) => {
const idx = content.indexOf("baritone"); const src = new MagicString(content);
src.overwrite(idx, idx + "baritone".length, "bar"); const idx = content.indexOf("baritone");
src.overwrite(idx, idx + "baritone".length, "bar");
const css_idx = content.indexOf("--bazitone"); const css_idx = content.indexOf("--bazitone");
src.overwrite(css_idx, css_idx + "--bazitone".length, "--baz"); src.overwrite(css_idx, css_idx + "--bazitone".length, "--baz");
return { return {
code: src.toString(), code: src.toString(),
map: src.generateMap({ map: src.generateMap({
source: filename, source: filename,
hires: true, hires: true,
includeContent: false includeContent: false
}) })
}; };
} },
}, script: ({ content, filename }) => {
{ const src = new MagicString(content);
script: ({ content, filename }) => { const idx = content.indexOf("bar");
const src = new MagicString(content); src.prependLeft(idx, " ");
const idx = content.indexOf("bar"); return {
src.prependLeft(idx, " "); code: src.toString(),
return { map: src.generateMap({
code: src.toString(), source: filename,
map: src.generateMap({ hires: true,
source: filename, includeContent: false
hires: true, })
includeContent: false };
}) },
}; style: ({ content, filename }) => {
} const src = new MagicString(content);
}, const idx = content.indexOf("--baz");
{ src.prependLeft(idx, " ");
style: ({ content, filename }) => { return {
const src = new MagicString(content); code: src.toString(),
const idx = content.indexOf("--baz"); map: src.generateMap({
src.prependLeft(idx, " "); source: filename,
return { hires: true,
code: src.toString(), includeContent: false
map: src.generateMap({ })
source: filename, };
hires: true, }
includeContent: false }
}) };
};
}
}
];

@ -1,10 +1,10 @@
export function test({ assert, smc, smcCss, locateInSource, locateInGenerated, locateInGeneratedCss }) { export function test({ assert, input, js, css }) {
const expectedBar = locateInSource('baritone'); const expectedBar = input.locate('baritone');
const expectedBaz = locateInSource('--bazitone'); const expectedBaz = input.locate('--bazitone');
let start = locateInGenerated('bar');
const actualbar = smc.originalPositionFor({ let start = js.locate('bar');
const actualbar = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -16,9 +16,9 @@ export function test({ assert, smc, smcCss, locateInSource, locateInGenerated, l
column: expectedBar.column column: expectedBar.column
}); });
start = locateInGeneratedCss('--baz'); start = css.locate('--baz');
const actualbaz = smcCss.originalPositionFor({ const actualbaz = css.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -28,5 +28,10 @@ export function test({ assert, smc, smcCss, locateInSource, locateInGenerated, l
name: null, name: null,
line: expectedBaz.line + 1, line: expectedBaz.line + 1,
column: expectedBaz.column column: expectedBaz.column
}, `couldn't find baz in css,\n gen:${JSON.stringify(start)}\n actual:${JSON.stringify(actualbaz)}\n expected:${JSON.stringify(expectedBaz)}`); }, `\
couldn't find baz in css,
gen: ${JSON.stringify(start)}
actual: ${JSON.stringify(actualbaz)}
expected: ${JSON.stringify(expectedBaz)}\
`);
} }

@ -1,17 +1,19 @@
import MagicString from 'magic-string'; import MagicString from 'magic-string';
export const preprocessors = [{ export default {
script: ({content, filename}) => { preprocess: {
const src = new MagicString(content); script: ({ content, filename }) => {
const idx = content.indexOf("baritone"); const src = new MagicString(content);
src.overwrite(idx, idx+"baritone".length, "bar"); const idx = content.indexOf("baritone");
return { src.overwrite(idx, idx+"baritone".length, "bar");
code: src.toString(), return {
map: src.generateMap({ code: src.toString(),
source: filename, map: src.generateMap({
hires: true, source: filename,
includeContent: false hires: true,
}) includeContent: false
}; })
} };
}]; }
}
};

@ -1,10 +1,10 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expectedBar = locateInSource('baritone:'); const expectedBar = input.locate('baritone:');
const expectedBaz = locateInSource('baz:'); const expectedBaz = input.locate('baz:');
let start = locateInGenerated('bar:'); let start = js.locate('bar:');
const actualbar = smc.originalPositionFor({ const actualbar = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -14,11 +14,11 @@ export function test({ assert, smc, locateInSource, locateInGenerated }) {
name: null, name: null,
line: expectedBar.line + 1, line: expectedBar.line + 1,
column: expectedBar.column column: expectedBar.column
}, `couldn't find bar: in source` ); }, "couldn't find bar: in source");
start = locateInGenerated('baz:'); start = js.locate('baz:');
const actualbaz = smc.originalPositionFor({ const actualbaz = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -28,5 +28,5 @@ export function test({ assert, smc, locateInSource, locateInGenerated }) {
name: null, name: null,
line: expectedBaz.line + 1, line: expectedBaz.line + 1,
column: expectedBaz.column column: expectedBaz.column
}, `couldn't find baz: in source` ); }, "couldn't find baz: in source");
} }

@ -1,17 +1,19 @@
import MagicString from 'magic-string'; import MagicString from 'magic-string';
export const preprocessors = [{ export default {
style: ({content, filename}) => { preprocess: {
const src = new MagicString(content); style: ({ content, filename }) => {
const idx = content.indexOf("baritone"); const src = new MagicString(content);
src.overwrite(idx, idx+"baritone".length, "bar"); const idx = content.indexOf("baritone");
return { src.overwrite(idx, idx+"baritone".length, "bar");
code: src.toString(), return {
map: src.generateMap({ code: src.toString(),
source: filename, map: src.generateMap({
hires: true, source: filename,
includeContent: false hires: true,
}) includeContent: false
}; })
} };
}]; }
}
};

@ -10,4 +10,3 @@
--baz: blue; --baz: blue;
} }
</style> </style>

@ -1,10 +1,10 @@
export function test({ assert, smcCss, locateInSource, locateInGeneratedCss }) { export function test({ assert, input, css }) {
const expectedBar = locateInSource('--baritone'); const expectedBar = input.locate('--baritone');
const expectedBaz = locateInSource('--baz'); const expectedBaz = input.locate('--baz');
let start = locateInGeneratedCss('--bar');
const actualbar = smcCss.originalPositionFor({ let start = css.locate('--bar');
const actualbar = css.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -14,11 +14,11 @@ export function test({ assert, smcCss, locateInSource, locateInGeneratedCss }) {
name: null, name: null,
line: expectedBar.line + 1, line: expectedBar.line + 1,
column: expectedBar.column column: expectedBar.column
}, `couldn't find bar in source` ); }, "couldn't find bar in source");
start = locateInGeneratedCss('--baz'); start = css.locate('--baz');
const actualbaz = smcCss.originalPositionFor({ const actualbaz = css.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
@ -28,5 +28,5 @@ export function test({ assert, smcCss, locateInSource, locateInGeneratedCss }) {
name: null, name: null,
line: expectedBaz.line + 1, line: expectedBaz.line + 1,
column: expectedBaz.column column: expectedBaz.column
}, `couldn't find baz in source` ); }, "couldn't find baz in source");
} }

@ -1,13 +1,13 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expected = locateInSource( 'assertThisLine' ); const expected = input.locate('assertThisLine');
const start = locateInGenerated( 'assertThisLine' ); const start = js.locate('assertThisLine');
const actual = smc.originalPositionFor({ const actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });
assert.deepEqual( actual, { assert.deepEqual(actual, {
source: 'input.svelte', source: 'input.svelte',
name: null, name: null,
line: expected.line + 1, line: expected.line + 1,

@ -1,8 +1,8 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expected = locateInSource( '42' ); const expected = input.locate('42');
const start = locateInGenerated( '42' ); const start = js.locate('42');
const actual = smc.originalPositionFor({ const actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });

@ -1 +1 @@
<p>no moving parts</p> <p>no moving parts</p>

@ -1,9 +1,9 @@
const fs = require( 'fs' ); const fs = require('fs');
const path = require( 'path' ); const path = require('path');
export function test({ assert, map }) { export function test({ assert, js }) {
assert.deepEqual( map.sources, [ 'input.svelte' ]); assert.deepEqual(js.map.sources, ['input.svelte']);
assert.deepEqual( map.sourcesContent, [ assert.deepEqual(js.map.sourcesContent, [
fs.readFileSync( path.join( __dirname, 'input.svelte' ), 'utf-8' ) fs.readFileSync(path.join(__dirname, 'input.svelte'), 'utf-8')
]); ]);
} }

@ -1,8 +1,8 @@
export function test({ assert, smc, locateInSource, locateInGenerated }) { export function test({ assert, input, js }) {
const expected = locateInSource( 'assertThisLine' ); const expected = input.locate( 'assertThisLine' );
const start = locateInGenerated( 'assertThisLine' ); const start = js.locate( 'assertThisLine' );
const actual = smc.originalPositionFor({ const actual = js.mapConsumer.originalPositionFor({
line: start.line + 1, line: start.line + 1,
column: start.column column: start.column
}); });

Loading…
Cancel
Save