fix DebugTag etc

package-lock.json

@@ -507,9 +507,9 @@
       "dev": true
     },
     "code-red": {
-      "version": "0.0.13",
+      "version": "0.0.15",
-      "resolved": "https://registry.npmjs.org/code-red/-/code-red-0.0.13.tgz",
+      "resolved": "https://registry.npmjs.org/code-red/-/code-red-0.0.15.tgz",
-      "integrity": "sha512-cBYTCCcEuxdkIvK7LnDlZslan3NoYCV4YAH0xVkePuCD7/TOKg/vWXug7TNjKePLJEnc9isgeK76RzsBy1pShA==",
+      "integrity": "sha512-r3c5r7IFsgKw3IE+F1wkTOezvwZ1N6xXKAJ0Dfyrs+JxHVEWbPU+goKwbo6XCCc8ykO5IU5Pofq1BvuxiXMQHQ==",
       "dev": true,
       "requires": {
         "acorn": "^7.0.0",

package.json

@@ -63,7 +63,7 @@
     "acorn": "^7.0.0",
     "agadoo": "^1.0.1",
     "c8": "^5.0.1",
-    "code-red": "0.0.13",
+    "code-red": "0.0.15",
     "codecov": "^3.5.0",
     "css-tree": "1.0.0-alpha22",
     "eslint": "^6.3.0",

src/compiler/compile/render_dom/index.ts

@@ -497,7 +497,7 @@ export default function dom(
 					super(${options.dev && `options`});
 					${should_add_css && b`if (!@_document.getElementById("${component.stylesheet.id}-style")) ${add_css}();`}
 					@init(this, options, ${definition}, create_fragment, ${not_equal}, ${prop_names});
-					${options.dev && b`@dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "${name}", options, id: create_fragment.name });`}
+					${options.dev && b`@dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "${name.name}", options, id: create_fragment.name });`}
 
 					${dev_props_check}
 				}

src/compiler/compile/render_dom/wrappers/DebugTag.ts

@@ -2,9 +2,10 @@ import Renderer from '../Renderer';
 import Wrapper from './shared/Wrapper';
 import Block from '../Block';
 import DebugTag from '../../nodes/DebugTag';
-// import add_to_set from '../../utils/add_to_set';
+import add_to_set from '../../utils/add_to_set';
-import { b } from 'code-red';
+import { b, p } from 'code-red';
-import { Identifier } from 'estree';
+import { Identifier, DebuggerStatement } from 'estree';
+import { changed } from './shared/changed';
 
 export default class DebugTagWrapper extends Wrapper {
 	node: DebugTag;
@@ -22,61 +23,65 @@ export default class DebugTagWrapper extends Wrapper {
 
 	render(block: Block, _parent_node: Identifier, _parent_nodes: Identifier) {
 		const { renderer } = this;
-		// const { component } = renderer;
+		const { component } = renderer;
 
 		if (!renderer.options.dev) return;
 
-		// const { var_lookup } = component;
+		const { var_lookup } = component;
+
+		const start = component.locate(this.node.start + 1);
+		start.line += 1;
+		const end = { line: start.line, column: start.column + 6 };
+
+		const loc = { start, end };
+
+		const debug: DebuggerStatement = {
+			type: 'DebuggerStatement',
+			loc
+		};
 
 		if (this.node.expressions.length === 0) {
 			// Debug all
-			// code.overwrite(this.node.start + 1, this.node.start + 7, 'debugger', {
+			block.chunks.create.push(debug);
-			// 	storeName: true
+			block.chunks.update.push(debug);
-			// });
-			// const statement = `[✂${this.node.start + 1}-${this.node.start + 7}✂];`;
-
-			block.chunks.create.push(b`debugger`);
-			block.chunks.update.push(b`debugger`);
 		} else {
-			// TODO
+			const log: Identifier = {
+				type: 'Identifier',
+				name: 'log',
+				loc
+			};
 
-			// const { code } = component;
+			const dependencies: Set<string> = new Set();
-			// code.overwrite(this.node.start + 1, this.node.start + 7, 'log', {
+			this.node.expressions.forEach(expression => {
-			// 	storeName: true
+				add_to_set(dependencies, expression.dependencies);
-			// });
+			});
-			// const log = `[✂${this.node.start + 1}-${this.node.start + 7}✂]`;
 
-			// const dependencies = new Set();
+			const condition = changed(Array.from(dependencies));
-			// this.node.expressions.forEach(expression => {
-			// 	add_to_set(dependencies, expression.dependencies);
-			// });
 
-			// const condition = Array.from(dependencies).map(d => `changed.${d}`).join(' || ');
+			const contextual_identifiers = this.node.expressions
+				.filter(e => {
+					const variable = var_lookup.get(e.node.name);
+					return !(variable && variable.hoistable);
+				})
+				.map(e => p`${e.node.name}`);
 
-			// const ctx_identifiers = this.node.expressions
+			const logged_identifiers = this.node.expressions.map(e => p`${e.node.name}`);
-			// 	.filter(e => {
-			// 		const looked_up_var = var_lookup.get(e.node.name);
-			// 		return !(looked_up_var && looked_up_var.hoistable);
-			// 	})
-			// 	.map(e => e.node.name)
-			// 	.join(', ');
-			// const logged_identifiers = this.node.expressions.map(e => e.node.name).join(', ');
 
-			// block.chunks.update.push(b`
+			block.chunks.update.push(b`
-			// 	if (${condition}) {
+				if (${condition}) {
-			// 		const { ${ctx_identifiers} } = #ctx;
+					const { ${contextual_identifiers} } = #ctx;
-			// 		@_console.${log}({ ${logged_identifiers} });
+					@_console.${log}({ ${logged_identifiers} });
-			// 		debugger;
+					${debug};
-			// 	}
+				}
-			// `);
+			`);
 
-			// block.chunks.create.push(b`
+			block.chunks.create.push(b`
-			// 	{
+				{
-			// 		const { ${ctx_identifiers} } = #ctx;
+					const { ${contextual_identifiers} } = #ctx;
-			// 		@_console.${log}({ ${logged_identifiers} });
+					@_console.${log}({ ${logged_identifiers} });
-			// 		debugger;
+					${debug};
-			// 	}
+				}
-			// `);
+			`);
 		}
 	}
 }