Merge pull request #1647 from sveltejs/debugger-source-maps

add sourcemaps to debug tags

src/compile/nodes/DebugTag.ts

@@ -7,13 +7,10 @@ import addToSet from '../../utils/addToSet';
 
 export default class DebugTag extends Node {
 	expressions: Expression[];
-	shouldSkip: boolean;
 
 	constructor(compiler, parent, scope, info) {
 		super(compiler, parent, scope, info);
 
-		this.shouldSkip = !compiler.options.dev;
-
 		this.expressions = info.identifiers.map(node => {
 			return new Expression(compiler, parent, scope, node);
 		});
@@ -24,13 +21,26 @@ export default class DebugTag extends Node {
 		parentNode: string,
 		parentNodes: string,
 	) {
-		if (this.shouldSkip) return;
+		if (!this.compiler.options.dev) return;
+
+		const { code } = this.compiler;
 
 		// Debug all
 		if (this.expressions.length === 0) {
-			block.builders.create.addLine('debugger;');
+			code.overwrite(this.start + 1, this.start + 7, 'debugger', {
-			block.builders.update.addLine('debugger;');
+				storeName: true
+			});
+			const statement = `[✂${this.start + 1}-${this.start + 7}✂];`;
+
+			block.builders.create.addLine(statement);
+			block.builders.update.addLine(statement);
 		} else {
+			const { code } = this.compiler;
+			code.overwrite(this.start + 1, this.start + 7, 'log', {
+				storeName: true
+			});
+			const log = `[✂${this.start + 1}-${this.start + 7}✂]`;
+
 			const dependencies = new Set();
 			this.expressions.forEach(expression => {
 				addToSet(dependencies, expression.dependencies);
@@ -43,15 +53,17 @@ export default class DebugTag extends Node {
 			block.builders.update.addBlock(deindent`
 				if (${condition}) {
 					const { ${identifiers} } = ctx;
-					console.log({ ${identifiers} });
+					console.${log}({ ${identifiers} });
 					debugger;
 				}
 			`);
 
 			block.builders.create.addBlock(deindent`
-				const { ${identifiers} } = ctx;
+				{
-				console.log({ ${identifiers} });
+					const { ${identifiers} } = ctx;
-				debugger;
+					console.${log}({ ${identifiers} });
+					debugger;
+				}
 			`);
 		}
 	}

test/js/samples/debug-foo-bar-baz-things/expected-bundle.js

@@ -259,9 +259,11 @@ function create_each_block(component, ctx) {
 			text = createText(text_value);
 			text_1 = createText("\n\t");
 
-			const { foo, bar, baz, thing } = ctx;
+			{
-			console.log({ foo, bar, baz, thing });
+				const { foo, bar, baz, thing } = ctx;
-			debugger;
+				console.log({ foo, bar, baz, thing });
+				debugger;
+			}
 			addLoc(span, file, 1, 1, 25);
 		},
 

test/js/samples/debug-foo-bar-baz-things/expected.js

@@ -86,9 +86,11 @@ function create_each_block(component, ctx) {
 			text = createText(text_value);
 			text_1 = createText("\n\t");
 
-			const { foo, bar, baz, thing } = ctx;
+			{
-			console.log({ foo, bar, baz, thing });
+				const { foo, bar, baz, thing } = ctx;
-			debugger;
+				console.log({ foo, bar, baz, thing });
+				debugger;
+			}
 			addLoc(span, file, 1, 1, 25);
 		},
 

test/js/samples/debug-foo/expected-bundle.js

@@ -259,9 +259,11 @@ function create_each_block(component, ctx) {
 			text = createText(text_value);
 			text_1 = createText("\n\t");
 
-			const { foo } = ctx;
+			{
-			console.log({ foo });
+				const { foo } = ctx;
-			debugger;
+				console.log({ foo });
+				debugger;
+			}
 			addLoc(span, file, 1, 1, 25);
 		},
 

test/js/samples/debug-foo/expected.js

@@ -86,9 +86,11 @@ function create_each_block(component, ctx) {
 			text = createText(text_value);
 			text_1 = createText("\n\t");
 
-			const { foo } = ctx;
+			{
-			console.log({ foo });
+				const { foo } = ctx;
-			debugger;
+				console.log({ foo });
+				debugger;
+			}
 			addLoc(span, file, 1, 1, 25);
 		},