parse attributes

compiler/generate/index.js

@@ -93,9 +93,7 @@ export default function generate ( parsed, template ) {
 			return `root.${flattened.keypath}`;
 		}
 
-		console.log( `node, contexts`, node, contexts )
+		return 'TODO';
-		return 'TODO'
-		throw new Error( 'TODO expressions' );
 	}
 
 	parsed.html.children.forEach( child => {

compiler/parse/read/directives.js

@@ -1,13 +1,13 @@
 import { tokenizer, tokTypes, parseExpressionAt } from 'acorn';
 
-export function readEventHandlerDirective ( parser, name ) {
+export function readEventHandlerDirective ( parser, start, name ) {
 	const quoteMark = (
 		parser.eat( `'` ) ? `'` :
 		parser.eat( `"` ) ? `"` :
 		null
 	);
 
-	const start = parser.index;
+	const expressionStart = parser.index;
 	let end = null;
 
 	let depth = 0;
@@ -16,17 +16,17 @@ export function readEventHandlerDirective ( parser, name ) {
 		if ( token.type === tokTypes.parenR ) {
 			depth -= 1;
 			if ( depth === 0 ) {
-				end = start + token.end;
+				end = expressionStart + token.end;
 				break;
 			}
 		}
 	}
 
-	const expression = parseExpressionAt( parser.template.slice( 0, end ), start );
+	const expression = parseExpressionAt( parser.template.slice( 0, end ), expressionStart );
 	parser.index = expression.end;
 
 	if ( expression.type !== 'CallExpression' ) {
-		parser.error( `Expected call expression`, start );
+		parser.error( `Expected call expression`, expressionStart );
 	}
 
 	if ( quoteMark ) {
@@ -34,6 +34,8 @@ export function readEventHandlerDirective ( parser, name ) {
 	}
 
 	return {
+		start,
+		end: parser.index,
 		type: 'EventHandler',
 		name,
 		expression

compiler/parse/read/style.js

@@ -0,0 +1,3 @@
+export default function readStyle () {
+	throw new Error( 'TODO <style>' );
+}

compiler/parse/state/tag.js

@@ -117,6 +117,8 @@ function readTagName ( parser ) {
 }
 
 function readAttribute ( parser ) {
+	const start = parser.index;
+
 	const name = parser.readUntil( /(\s|=|\/|>)/ );
 	if ( !name ) return null;
 
@@ -124,12 +126,14 @@ function readAttribute ( parser ) {
 
 	if ( /^on:/.test( name ) ) {
 		parser.eat( '=', true );
-		return readEventHandlerDirective( parser, name.slice( 3 ) );
+		return readEventHandlerDirective( parser, start, name.slice( 3 ) );
 	}
 
 	const value = parser.eat( '=' ) ? readAttributeValue( parser ) : true;
 
 	return {
+		start,
+		end: parser.index,
 		type: 'Attribute',
 		name,
 		value
@@ -147,7 +151,7 @@ function readQuotedAttributeValue ( parser, quoteMark ) {
 	let currentChunk = {
 		start: parser.index,
 		end: null,
-		type: 'AttributeText',
+		type: 'Text',
 		data: ''
 	};
 
@@ -185,21 +189,27 @@ function readQuotedAttributeValue ( parser, quoteMark ) {
 				currentChunk = {
 					start: parser.index,
 					end: null,
-					type: 'AttributeText',
+					type: 'Text',
 					data: ''
 				};
 			}
 
-			else if ( parser.match( '\\' ) ) {
+			else if ( parser.eat( '\\' ) ) {
 				escaped = true;
 			}
 
 			else if ( parser.match( quoteMark ) ) {
+				currentChunk.end = parser.index++;
+
 				if ( currentChunk.data ) {
 					chunks.push( currentChunk );
 					return chunks;
 				}
 			}
+
+			else {
+				currentChunk.data += parser.template[ parser.index++ ];
+			}
 		}
 	}
 

test/parser/attribute-static/input.svelte

@@ -0,0 +1 @@
+<div class='foo'></div>

test/parser/attribute-static/output.json

@@ -0,0 +1,34 @@
+{
+	"html": {
+		"start": 0,
+		"end": 23,
+		"type": "Fragment",
+		"children": [
+			{
+				"start": 0,
+				"end": 23,
+				"type": "Element",
+				"name": "div",
+				"attributes": [
+					{
+						"start": 5,
+						"end": 16,
+						"type": "Attribute",
+						"name": "class",
+						"value": [
+							{
+								"start": 12,
+								"end": 15,
+								"type": "Text",
+								"data": "foo"
+							}
+						]
+					}
+				],
+				"children": []
+			}
+		]
+	},
+	"css": null,
+	"js": null
+}

test/parser/event-handler/output.json

@@ -11,6 +11,8 @@
 				"name": "button",
 				"attributes": [
 					{
+						"start": 8,
+						"end": 45,
 						"type": "EventHandler",
 						"name": "click",
 						"expression": {