implement event shorthand

src/compile/Component.ts

@@ -69,6 +69,7 @@ export default class Component {
 	templateVars: Map<string, string>;
 	aliases: Map<string, string>;
 	usedNames: Set<string>;
+	init_uses_self = false;
 
 	locator: (search: number, startIndex?: number) => {
 		line: number,

src/compile/nodes/EventHandler.ts

@@ -3,6 +3,7 @@ import Expression from './shared/Expression';
 import flattenReference from '../../utils/flattenReference';
 import { createScopes } from '../../utils/annotateWithScopes';
 import { walk } from 'estree-walker';
+import Component from '../Component';
 
 export default class EventHandler extends Node {
 	name: string;
@@ -19,7 +20,7 @@ export default class EventHandler extends Node {
 	args: Expression[];
 	snippet: string;
 
-	constructor(component, parent, template_scope, info) {
+	constructor(component: Component, parent, template_scope, info) {
 		super(component, parent, template_scope, info);
 
 		this.name = info.name;
@@ -53,7 +54,8 @@ export default class EventHandler extends Node {
 				}
 			});
 		} else {
-			this.snippet = null; // TODO handle shorthand events here?
+			component.init_uses_self = true;
+			this.snippet = `e => @bubble($$self, e)`
 		}
 
 		// TODO figure out what to do about custom events

src/compile/render-dom/index.ts

@@ -121,6 +121,7 @@ export default function dom(
 		builder.addBlock(deindent`
 			class ${name} extends ${superclass} {
 				$$init($$make_dirty) {
+					${component.init_uses_self && `const $$self = this;`}
 					${component.javascript || component.exports.map(x => `let ${x.name};`)}
 
 					${component.event_handlers.map(handler => handler.body)}

src/compile/render-dom/wrappers/Element/index.ts

@@ -171,7 +171,9 @@ export default class ElementWrapper extends Wrapper {
 		});
 
 		node.handlers.forEach(handler => {
-			block.addDependencies(handler.expression.dependencies);
+			if (handler.expression) {
+				block.addDependencies(handler.expression.dependencies);
+			}
 		});
 
 		if (this.parent) {
@@ -662,7 +664,7 @@ export default class ElementWrapper extends Wrapper {
 
 				let name;
 
-				if (handler.expression.contextual_dependencies.size > 0) {
+				if (handler.expression && handler.expression.contextual_dependencies.size > 0) {
 					name = handler_name;
 
 					const deps = Array.from(handler.expression.contextual_dependencies);

src/internal/lifecycle.js

@@ -33,4 +33,15 @@ export function createEventDispatcher() {
 			callbacks.slice().forEach(fn => fn(event));
 		}
 	};
+}
+
+// TODO figure out if we still want to support
+// shorthand events, or if we want to implement
+// a real bubbling mechanism
+export function bubble(component, event) {
+	const callbacks = component.$$callbacks[event.type];
+
+	if (callbacks) {
+		callbacks.slice().forEach(fn => fn(event));
+	}
 }