Add more tests

test/sourcemaps/helpers.ts

@@ -1,4 +1,26 @@
-import MagicString from 'magic-string';
+import MagicString, { Bundle } from 'magic-string';
+
+export function magic_string_bundle(
+	inputs: Array<{ code: string | MagicString, filename: string }>,
+	filename = 'bundle.js',
+	separator = '\n'
+) {
+	const bundle = new Bundle({ separator });
+	inputs.forEach(({ code, filename }) => {
+		bundle.addSource({
+			filename,
+			content: typeof code === 'string' ? new MagicString(code) : code
+		});
+	});
+	return {
+		code: bundle.toString(),
+		map: bundle.generateMap({
+			source: filename,
+			hires: true,
+			includeContent: false
+		})
+	};
+}
 
 export function magic_string_preprocessor_result(filename: string, src: MagicString) {
 	return {

test/sourcemaps/samples/external/_config.js

@@ -0,0 +1,23 @@
+import { magic_string_bundle } from '../../helpers';
+
+export const COMMON = ':global(html) { height: 100%; }\n';
+
+// TODO: removing '\n' breaks test
+// - _actual.svelte.map looks correct
+// - _actual.css.map adds reference to </style> on input.svelte
+export const STYLES = '.awesome { color: orange; }\n';
+
+export default {
+	css_map_sources: ['common.scss', 'styles.scss'],
+	js_map_sources: [],
+	preprocess: [
+		{
+			style: () => {
+				return magic_string_bundle([
+					{ filename: 'common.scss', code: COMMON },
+					{ filename: 'styles.scss', code: STYLES }
+				]);
+			}
+		}
+	]
+};

test/sourcemaps/samples/external/input.svelte

@@ -0,0 +1,3 @@
+<style lang="scss" src="./styles.scss"></style>
+
+<div class="awesome">Divs ftw!</div>

test/sourcemaps/samples/external/test.js

@@ -0,0 +1,27 @@
+import { getLocator } from 'locate-character';
+import { COMMON, STYLES } from './_config';
+
+export function test({ assert, input, preprocessed }) {
+
+	const assertMapped = (locateInput, code, filename) => {
+		const sourceLoc = locateInput(code);
+		const transformedLoc = preprocessed.locate_1(code);
+		assert.deepEqual(
+			preprocessed.mapConsumer.originalPositionFor(transformedLoc),
+			{
+				source: filename,
+				name: null,
+				line: sourceLoc.line + 1,
+				column: sourceLoc.column
+			},
+			`failed to locate "${code}"`
+		);
+	};
+
+	// Transformed script, main file
+	assertMapped(input.locate, 'Divs ftw!', 'input.svelte');
+
+	// External files
+	assertMapped(getLocator(COMMON), 'height: 100%;', 'common.scss');
+	assertMapped(getLocator(STYLES), 'color: orange;', 'styles.scss');
+}

test/sourcemaps/samples/guess-source/_config.js

@@ -0,0 +1,19 @@
+import { magic_string_bundle } from '../../helpers';
+
+export const PREPEND = 'console.log("COUNTER_START")';
+export const APPEND = 'console.log("COUNTER_END")';
+
+export default {
+	js_map_sources: ['input.svelte', 'src/prepend.js', 'src/append.js'],
+	preprocess: [
+		{
+			script: ({ content }) => {
+				return magic_string_bundle([
+					{ filename: 'src/prepend.js', code: PREPEND },
+					{ filename: 'src/input.svelte', code: content },
+					{ filename: 'src/append.js', code: APPEND }
+				]);
+			}
+		}
+	]
+};

test/sourcemaps/samples/guess-source/input.svelte

@@ -0,0 +1,6 @@
+<script lang="ts">
+	let count = 3;
+</script>
+
+<h1>Hello world!</h1>
+<div>Counter value: {count}</div>

test/sourcemaps/samples/guess-source/test.js

@@ -0,0 +1,30 @@
+import { getLocator } from 'locate-character';
+import { APPEND, PREPEND } from './_config';
+
+export function test({ assert, input, preprocessed }) {
+
+	const assertMapped = (locateInput, code, filename) => {
+		const sourceLoc = locateInput(code);
+		const transformedLoc = preprocessed.locate_1(code);
+		assert.deepEqual(
+			preprocessed.mapConsumer.originalPositionFor(transformedLoc),
+			{
+				source: filename,
+				name: null,
+				line: sourceLoc.line + 1,
+				column: sourceLoc.column
+			},
+			`failed to locate "${code}"`
+		);
+	};
+	
+	// Transformed script, main file
+	assertMapped(input.locate, 'let count = 3;', 'input.svelte');
+
+	// Untouched markup, main file
+	assertMapped(input.locate, '<h1>Hello world!</h1>', 'input.svelte');
+
+	// External files
+	assertMapped(getLocator(PREPEND), '"COUNTER_START"', 'src/prepend.js');
+	assertMapped(getLocator(APPEND), '"COUNTER_END"', 'src/append.js');
+}

test/sourcemaps/samples/typescript/input.svelte

@@ -1,12 +1,17 @@
 <script lang="ts">
-  import { onMount } from 'svelte';
+	import { onMount } from 'svelte';
 
-  let count: number = 0;
+	let count: number = 0;
 
-  onMount(() => {
+	interface ITimeoutDestroyer {
-    const id = setInterval(() => count++, 1000);
+		(): void; // send timeout to the void!
-    return () => clearInterval(id);
+	}
-  });
+
+	onMount(() => {
+		const id = setInterval(() => count++, 1000);
+		const clear: ITimeoutDestroyer = () => clearInterval(id);
+		return clear;
+	});
 </script>
 
 <h1>Hello world!</h1>

test/sourcemaps/samples/typescript/test.js

@@ -1,17 +1,30 @@
 export function test({ assert, input, preprocessed }) {
-	const content = '<h1>Hello world!</h1>';
+	const assertMapped = (source, transformed) => {
+		const sourceLoc = input.locate(source);
+		const transformedLoc = preprocessed.locate_1(transformed);
+		assert.deepEqual(
+			preprocessed.mapConsumer.originalPositionFor(transformedLoc),
+			{
+				source: 'input.svelte',
+				name: null,
+				line: sourceLoc.line + 1,
+				column: sourceLoc.column
+			},
+			`failed to locate "${transformed}"`
+		);
+	};
 
-	const original = input.locate(content);
+	const assertNotMapped = (code) => {
-	const transformed = preprocessed.locate_1('<h1>Hello world!</h1>');
+		const transformedLoc = preprocessed.locate_1(code);
+		assert.strictEqual(transformedLoc, undefined, `failed to remove "${code}"`);
+	};
 
-	assert.deepEqual(
+	// TS => JS code
-		preprocessed.mapConsumer.originalPositionFor(transformed),
+	assertMapped('let count: number = 0;', 'let count = 0;');
-		{
+
-			source: 'input.svelte',
+	// Markup, not touched
-			name: null,
+	assertMapped('<h1>Hello world!</h1>', '<h1>Hello world!</h1>');
-			line: original.line + 1,
+
-			column: original.column
+	// TS types, removed
-		},
+	assertNotMapped('ITimeoutDestroyer');
-		`failed to locate "${content}"`
-	);
 }