svelte/test/sourcemaps/index.js

import * as fs from "fs";
import * as path from "path";
import * as assert from "assert";
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 { getLocator } from "locate-character";

describe("sourcemaps", () => {
	fs.readdirSync(`${__dirname}/samples`).forEach(dir => {
		if (dir[0] === ".") return;

		const config = loadConfig(`${__dirname}/samples/${dir}/_config.js`);

		// add .solo to a sample directory name to only run that test
		const solo = config.solo || /\.solo/.test(dir);
		const skip = config.skip || /\.skip/.test(dir);

		if (solo && process.env.CI) {
			throw new Error("Forgot to remove `solo: true` from test");
		}

		(solo ? it.only : skip ? it.skip : it)(dir, async () => {
			const inputFile = path.resolve(`${__dirname}/samples/${dir}/input.svelte`);
			const outputBase = path.resolve(`${__dirname}/samples/${dir}/_actual`);

			const input = {};
			input.code = fs.readFileSync(inputFile, "utf-8");
			input.locate = getLocator(input.code);

			const preprocessed = await svelte.preprocess(
				input.code,
				config.preprocess, {
				filename: "input.svelte"
			});

			const { js, css } = svelte.compile(
				preprocessed.code, {
				filename: "input.svelte",
				sourcemap: preprocessed.map,
				// filenames for sourcemaps
				outputFilename: "output.js",
				cssOutputFilename: "output.css",
			});

			js.code = js.code.replace(
				/generated by Svelte v\d+\.\d+\.\d+/,
				match => match.replace(/\d/g, "x")
			);

			fs.writeFileSync(`${outputBase}.svelte`, preprocessed.code);
			if (preprocessed.map) {
				fs.writeFileSync(`${outputBase}.svelte.map`, JSON.stringify(preprocessed.map, null, 2));
			}
			fs.writeFileSync(
				`${outputBase}.js`,
				`${js.code}\n//# sourceMappingURL=output.js.map`
			);
			fs.writeFileSync(
				`${outputBase}.js.map`,
				JSON.stringify(js.map, 0, 2)
			);
			if (css.code) {
				fs.writeFileSync(
					`${outputBase}.css`,
					`${css.code}\n/*# sourceMappingURL=output.css.map */`
				);
				fs.writeFileSync(
					`${outputBase}.css.map`,
					JSON.stringify(css.map, 0, 2)
				);
			}

			assert.deepEqual(js.map.sources, ["input.svelte"]);
			if (css.map) assert.deepEqual(css.map.sources, ["input.svelte"]);

			const { test } = require(`./samples/${dir}/test.js`);

			preprocessed.mapConsumer = preprocessed.map && await new SourceMapConsumer(preprocessed.map);
			preprocessed.locate = getLocator(preprocessed.code);

			js.mapConsumer = js.map && await new SourceMapConsumer(js.map);
			js.locate = getLocator(js.code);

			css.mapConsumer = css.map && await new SourceMapConsumer(css.map);
			css.locate = getLocator(css.code || "");

			test({ assert, input, preprocessed, js, css });

		});
	});
});