fix parser tests

pull/1866/head
Rich Harris 7 years ago
parent cedbb28586
commit 1c81f85c11

@ -1,6 +1,7 @@
import Node from './shared/Node';
import getObject from '../../utils/getObject';
import Expression from './shared/Expression';
import Component from '../Component';
export default class Binding extends Node {
name: string;
@ -10,9 +11,16 @@ export default class Binding extends Node {
obj: string;
prop: string;
constructor(component, parent, scope, info) {
constructor(component: Component, parent, scope, info) {
super(component, parent, scope, info);
if (info.expression.type !== 'Identifier' && info.expression.node.type !== 'MemberExpression') {
component.error(info, {
code: 'invalid-directive-value',
message: 'Can only bind to an identifier (e.g. `foo`) or a member expression (e.g. `foo.bar` or `foo[baz]`)'
});
}
this.name = info.name;
this.expression = new Expression(component, this, scope, info.expression);

@ -220,6 +220,16 @@ export default function parse(
options: ParserOptions = {}
): Ast {
const parser = new Parser(template, options);
// TODO we way want to allow multiple <style> tags —
// one scoped, one global. for now, only allow one
if (parser.css.length > 1) {
parser.error({
code: 'duplicate-style',
message: 'You can only have one top-level <style> tag per component'
}, parser.css[1].start);
}
return {
html: parser.html,
css: parser.css,

@ -392,7 +392,7 @@ function readAttribute(parser: Parser, uniqueNames: Set<string>) {
end,
type,
name: directive_name,
expression: value[0] && value[0].expression
expression: (value[0] && value[0].expression) || null
};
if (type === 'Transition') {

@ -17,7 +17,7 @@ function getName(filename) {
return base[0].toUpperCase() + base.slice(1);
}
describe.only('hydration', () => {
describe('hydration', () => {
before(() => {
const svelte = loadSvelte();

@ -2,7 +2,7 @@ import * as assert from 'assert';
import * as fs from 'fs';
import { svelte, tryToLoadJson } from '../helpers.js';
describe('parse', () => {
describe.only('parse', () => {
fs.readdirSync('test/parser/samples').forEach(dir => {
if (dir[0] === '.') return;

@ -1 +1 @@
<input use:tooltip="t('tooltip msg')">
<input use:tooltip="{t('tooltip msg')}">

@ -1,35 +1,35 @@
{
"html": {
"start": 0,
"end": 38,
"end": 40,
"type": "Fragment",
"children": [
{
"start": 0,
"end": 38,
"end": 40,
"type": "Element",
"name": "input",
"attributes": [
{
"start": 7,
"end": 37,
"end": 39,
"type": "Action",
"name": "tooltip",
"expression": {
"type": "CallExpression",
"start": 20,
"end": 36,
"start": 21,
"end": 37,
"callee": {
"type": "Identifier",
"start": 20,
"end": 21,
"start": 21,
"end": 22,
"name": "t"
},
"arguments": [
{
"type": "Literal",
"start": 22,
"end": 35,
"start": 23,
"end": 36,
"value": "tooltip msg",
"raw": "'tooltip msg'"
}
@ -41,6 +41,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -1 +1 @@
<input use:tooltip="message">
<input use:tooltip={message}>

@ -27,6 +27,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -1 +1 @@
<input use:tooltip="'tooltip msg'">
<input use:tooltip="{'tooltip msg'}">

@ -1,24 +1,24 @@
{
"html": {
"start": 0,
"end": 35,
"end": 37,
"type": "Fragment",
"children": [
{
"start": 0,
"end": 35,
"end": 37,
"type": "Element",
"name": "input",
"attributes": [
{
"start": 7,
"end": 34,
"end": 36,
"type": "Action",
"name": "tooltip",
"expression": {
"type": "Literal",
"start": 20,
"end": 33,
"start": 21,
"end": 34,
"value": "tooltip msg",
"raw": "'tooltip msg'"
}
@ -28,6 +28,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -22,6 +22,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -54,6 +54,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -36,6 +36,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -34,6 +34,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -34,6 +34,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -58,6 +58,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -29,6 +29,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -43,6 +43,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -34,6 +34,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -22,6 +22,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -29,6 +29,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -29,6 +29,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -155,6 +155,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -15,10 +15,10 @@
"end": 16,
"type": "Binding",
"name": "foo",
"value": {
"type": "Identifier",
"expression": {
"start": 13,
"end": 16,
"type": "Identifier",
"name": "foo"
}
}
@ -27,6 +27,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -15,7 +15,7 @@
"end": 24,
"type": "Binding",
"name": "value",
"value": {
"expression": {
"type": "Identifier",
"start": 19,
"end": 23,
@ -27,6 +27,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -12,6 +12,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -37,6 +37,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -21,6 +21,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -12,6 +12,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -14,7 +14,8 @@
"start": 5,
"end": 12,
"type": "Ref",
"name": "foo"
"name": "foo",
"expression": null
}
],
"children": []
@ -27,69 +28,71 @@
}
]
},
"css": {
"start": 16,
"end": 60,
"attributes": [],
"children": [
{
"type": "Rule",
"selector": {
"type": "SelectorList",
"children": [
{
"type": "Selector",
"children": [
{
"type": "RefSelector",
"start": 25,
"end": 32,
"name": "foo"
}
],
"start": 25,
"end": 32
}
],
"start": 25,
"end": 32
},
"block": {
"type": "Block",
"children": [
{
"type": "Declaration",
"important": false,
"property": "color",
"value": {
"type": "Value",
"css": [
{
"start": 16,
"end": 60,
"attributes": [],
"children": [
{
"type": "Rule",
"selector": {
"type": "SelectorList",
"children": [
{
"type": "Selector",
"children": [
{
"type": "Identifier",
"name": "red",
"start": 44,
"end": 47
"type": "RefSelector",
"start": 25,
"end": 32,
"name": "foo"
}
],
"start": 43,
"start": 25,
"end": 32
}
],
"start": 25,
"end": 32
},
"block": {
"type": "Block",
"children": [
{
"type": "Declaration",
"important": false,
"property": "color",
"value": {
"type": "Value",
"children": [
{
"type": "Identifier",
"name": "red",
"start": 44,
"end": 47
}
],
"start": 43,
"end": 47
},
"start": 37,
"end": 47
},
"start": 37,
"end": 47
}
],
"start": 33,
}
],
"start": 33,
"end": 51
},
"start": 25,
"end": 51
},
"start": 25,
"end": 51
}
],
"content": {
"start": 23,
"end": 52,
"styles": "\n\tref:foo {\n\t\tcolor: red;\n\t}\n"
}
],
"content": {
"start": 23,
"end": 52,
"styles": "\n\tref:foo {\n\t\tcolor: red;\n\t}\n"
}
},
"js": null
],
"js": []
}

@ -27,69 +27,71 @@
}
]
},
"css": {
"start": 16,
"end": 56,
"attributes": [],
"children": [
{
"type": "Rule",
"selector": {
"type": "SelectorList",
"children": [
{
"type": "Selector",
"children": [
{
"type": "TypeSelector",
"name": "div",
"start": 25,
"end": 28
}
],
"start": 25,
"end": 28
}
],
"start": 25,
"end": 28
},
"block": {
"type": "Block",
"children": [
{
"type": "Declaration",
"important": false,
"property": "color",
"value": {
"type": "Value",
"css": [
{
"start": 16,
"end": 56,
"attributes": [],
"children": [
{
"type": "Rule",
"selector": {
"type": "SelectorList",
"children": [
{
"type": "Selector",
"children": [
{
"type": "Identifier",
"name": "red",
"start": 40,
"end": 43
"type": "TypeSelector",
"name": "div",
"start": 25,
"end": 28
}
],
"start": 39,
"start": 25,
"end": 28
}
],
"start": 25,
"end": 28
},
"block": {
"type": "Block",
"children": [
{
"type": "Declaration",
"important": false,
"property": "color",
"value": {
"type": "Value",
"children": [
{
"type": "Identifier",
"name": "red",
"start": 40,
"end": 43
}
],
"start": 39,
"end": 43
},
"start": 33,
"end": 43
},
"start": 33,
"end": 43
}
],
"start": 29,
}
],
"start": 29,
"end": 47
},
"start": 25,
"end": 47
},
"start": 25,
"end": 47
}
],
"content": {
"start": 23,
"end": 48,
"styles": "\n\tdiv {\n\t\tcolor: red;\n\t}\n"
}
],
"content": {
"start": 23,
"end": 48,
"styles": "\n\tdiv {\n\t\tcolor: red;\n\t}\n"
}
},
"js": null
],
"js": []
}

@ -1,9 +1,9 @@
<script>
export default {
oncreate() {
import('./foo.js').then(foo => {
console.log(foo.default);
});
}
}
import { onMount } from 'svelte';
onMount(() => {
import('./foo.js').then(foo => {
console.log(foo.default);
});
});
</script>

@ -5,43 +5,67 @@
"type": "Fragment",
"children": []
},
"css": null,
"js": {
"start": 0,
"end": 131,
"attributes": [],
"content": {
"type": "Program",
"start": 8,
"end": 122,
"body": [
{
"type": "ExportDefaultDeclaration",
"start": 10,
"end": 121,
"declaration": {
"type": "ObjectExpression",
"start": 25,
"end": 121,
"properties": [
"css": [],
"js": [
{
"start": 0,
"end": 146,
"attributes": [],
"content": {
"type": "Program",
"start": 8,
"end": 137,
"body": [
{
"type": "ImportDeclaration",
"start": 10,
"end": 43,
"specifiers": [
{
"type": "Property",
"start": 29,
"end": 118,
"method": true,
"shorthand": false,
"computed": false,
"key": {
"type": "ImportSpecifier",
"start": 19,
"end": 26,
"imported": {
"type": "Identifier",
"start": 29,
"end": 37,
"name": "oncreate"
"start": 19,
"end": 26,
"name": "onMount"
},
"kind": "init",
"value": {
"type": "FunctionExpression",
"start": 37,
"end": 118,
"local": {
"type": "Identifier",
"start": 19,
"end": 26,
"name": "onMount"
}
}
],
"source": {
"type": "Literal",
"start": 34,
"end": 42,
"value": "svelte",
"raw": "'svelte'"
}
},
{
"type": "ExpressionStatement",
"start": 46,
"end": 136,
"expression": {
"type": "CallExpression",
"start": 46,
"end": 135,
"callee": {
"type": "Identifier",
"start": 46,
"end": 53,
"name": "onMount"
},
"arguments": [
{
"type": "ArrowFunctionExpression",
"start": 54,
"end": 134,
"id": null,
"generator": false,
"expression": false,
@ -49,35 +73,35 @@
"params": [],
"body": {
"type": "BlockStatement",
"start": 40,
"end": 118,
"start": 60,
"end": 134,
"body": [
{
"type": "ExpressionStatement",
"start": 45,
"end": 114,
"start": 64,
"end": 131,
"expression": {
"type": "CallExpression",
"start": 45,
"end": 113,
"start": 64,
"end": 130,
"callee": {
"type": "MemberExpression",
"start": 45,
"end": 68,
"start": 64,
"end": 87,
"object": {
"type": "CallExpression",
"start": 45,
"end": 63,
"start": 64,
"end": 82,
"callee": {
"type": "Import",
"start": 45,
"end": 51
"start": 64,
"end": 70
},
"arguments": [
{
"type": "Literal",
"start": 52,
"end": 62,
"start": 71,
"end": 81,
"value": "./foo.js",
"raw": "'./foo.js'"
}
@ -85,8 +109,8 @@
},
"property": {
"type": "Identifier",
"start": 64,
"end": 68,
"start": 83,
"end": 87,
"name": "then"
},
"computed": false
@ -94,8 +118,8 @@
"arguments": [
{
"type": "ArrowFunctionExpression",
"start": 69,
"end": 112,
"start": 88,
"end": 129,
"id": null,
"generator": false,
"expression": false,
@ -103,38 +127,38 @@
"params": [
{
"type": "Identifier",
"start": 69,
"end": 72,
"start": 88,
"end": 91,
"name": "foo"
}
],
"body": {
"type": "BlockStatement",
"start": 76,
"end": 112,
"start": 95,
"end": 129,
"body": [
{
"type": "ExpressionStatement",
"start": 82,
"end": 107,
"start": 100,
"end": 125,
"expression": {
"type": "CallExpression",
"start": 82,
"end": 106,
"start": 100,
"end": 124,
"callee": {
"type": "MemberExpression",
"start": 82,
"end": 93,
"start": 100,
"end": 111,
"object": {
"type": "Identifier",
"start": 82,
"end": 89,
"start": 100,
"end": 107,
"name": "console"
},
"property": {
"type": "Identifier",
"start": 90,
"end": 93,
"start": 108,
"end": 111,
"name": "log"
},
"computed": false
@ -142,18 +166,18 @@
"arguments": [
{
"type": "MemberExpression",
"start": 94,
"end": 105,
"start": 112,
"end": 123,
"object": {
"type": "Identifier",
"start": 94,
"end": 97,
"start": 112,
"end": 115,
"name": "foo"
},
"property": {
"type": "Identifier",
"start": 98,
"end": 105,
"start": 116,
"end": 123,
"name": "default"
},
"computed": false
@ -170,12 +194,12 @@
]
}
}
}
]
]
}
}
}
],
"sourceType": "module"
],
"sourceType": "module"
}
}
}
]
}

@ -75,6 +75,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -67,6 +67,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -63,6 +63,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -63,6 +63,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -45,6 +45,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -38,6 +38,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -21,6 +21,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -22,6 +22,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -1,10 +0,0 @@
{
"code": "invalid-directive-value",
"message": "directive values should not be wrapped — use 'foo', not '{foo}'",
"start": {
"line": 1,
"column": 19,
"character": 19
},
"pos": 19
}

@ -1,10 +0,0 @@
{
"code": "invalid-directive-value",
"message": "Can only bind to an identifier (e.g. `foo`) or a member expression (e.g. `foo.bar` or `foo[baz]`)",
"pos": 19,
"start": {
"line": 1,
"column": 19,
"character": 19
}
}

@ -1,10 +0,0 @@
{
"code": "invalid-directive-value",
"message": "Expected a method call",
"start": {
"line": 1,
"column": 15,
"character": 15
},
"pos": 15
}

@ -1,10 +0,0 @@
{
"code": "invalid-directive-value",
"message": "ref directives cannot have a value",
"start": {
"line": 1,
"column": 14,
"character": 14
},
"pos": 14
}

@ -1,4 +1,4 @@
<button on:click='set({ visible: !visible })'>toggle</button>
<button on:click="{() => visible = !visible}">toggle</button>
{#if visible}
<p>hello!</p>

@ -15,54 +15,40 @@
"end": 45,
"type": "EventHandler",
"name": "click",
"modifiers": [],
"expression": {
"type": "CallExpression",
"start": 18,
"end": 44,
"callee": {
"type": "Identifier",
"start": 18,
"end": 21,
"name": "set"
},
"arguments": [
{
"type": "ObjectExpression",
"start": 22,
"type": "ArrowFunctionExpression",
"start": 19,
"end": 43,
"id": null,
"generator": false,
"expression": true,
"async": false,
"params": [],
"body": {
"type": "AssignmentExpression",
"start": 25,
"end": 43,
"operator": "=",
"left": {
"type": "Identifier",
"start": 25,
"end": 32,
"name": "visible"
},
"right": {
"type": "UnaryExpression",
"start": 35,
"end": 43,
"properties": [
{
"type": "Property",
"start": 24,
"end": 41,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "Identifier",
"start": 24,
"end": 31,
"name": "visible"
},
"value": {
"type": "UnaryExpression",
"start": 33,
"end": 41,
"operator": "!",
"prefix": true,
"argument": {
"type": "Identifier",
"start": 34,
"end": 41,
"name": "visible"
}
},
"kind": "init"
}
]
"operator": "!",
"prefix": true,
"argument": {
"type": "Identifier",
"start": 36,
"end": 43,
"name": "visible"
}
}
]
}
}
}
],
@ -111,6 +97,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -56,6 +56,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -96,6 +96,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -25,6 +25,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -66,6 +66,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -21,6 +21,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -55,6 +55,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -14,13 +14,14 @@
"start": 8,
"end": 15,
"type": "Ref",
"name": "foo"
"name": "foo",
"expression": null
}
],
"children": []
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -1,5 +1,5 @@
<div></div>
<script>
// TODO write some code
</script>
</script>
<div></div>

@ -1,25 +1,27 @@
{
"html": {
"start": 0,
"end": 11,
"start": 45,
"end": 56,
"type": "Fragment",
"children": [
{
"start": 0,
"end": 11,
"start": 43,
"end": 45,
"type": "Text",
"data": "\n\n"
},
{
"start": 45,
"end": 56,
"type": "Element",
"name": "div",
"attributes": [],
"children": []
},
{
"start": 11,
"end": 13,
"type": "Text",
"data": "\n\n"
}
]
},
"css": null,
"js": null
"css": [],
"js": [
null
]
}

@ -1,13 +1,9 @@
<h1>Hello {name}!</h1>
<script>
export default {
data: () => ({
name: 'world'
})
};
let name = 'world';
/*
trailing multiline comment
*/
</script>
<h1>Hello {name}!</h1>

@ -1,127 +1,89 @@
{
"html": {
"start": 0,
"end": 22,
"start": 79,
"end": 101,
"type": "Fragment",
"children": [
{
"start": 0,
"end": 22,
"start": 77,
"end": 79,
"type": "Text",
"data": "\n\n"
},
{
"start": 79,
"end": 101,
"type": "Element",
"name": "h1",
"attributes": [],
"children": [
{
"start": 4,
"end": 10,
"start": 83,
"end": 89,
"type": "Text",
"data": "Hello "
},
{
"start": 10,
"end": 16,
"start": 89,
"end": 95,
"type": "MustacheTag",
"expression": {
"type": "Identifier",
"start": 11,
"end": 15,
"start": 90,
"end": 94,
"name": "name"
}
},
{
"start": 16,
"end": 17,
"start": 95,
"end": 96,
"type": "Text",
"data": "!"
}
]
},
{
"start": 22,
"end": 24,
"type": "Text",
"data": "\n\n"
}
]
},
"css": null,
"js": {
"start": 24,
"end": 141,
"attributes": [],
"content": {
"type": "Program",
"start": 32,
"end": 132,
"body": [
{
"type": "ExportDefaultDeclaration",
"start": 34,
"end": 93,
"declaration": {
"type": "ObjectExpression",
"start": 49,
"end": 92,
"properties": [
"css": [],
"js": [
{
"start": 0,
"end": 77,
"attributes": [],
"content": {
"type": "Program",
"start": 8,
"end": 68,
"body": [
{
"type": "VariableDeclaration",
"start": 10,
"end": 29,
"declarations": [
{
"type": "Property",
"start": 53,
"end": 89,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "VariableDeclarator",
"start": 14,
"end": 28,
"id": {
"type": "Identifier",
"start": 53,
"end": 57,
"name": "data"
},
"value": {
"type": "ArrowFunctionExpression",
"start": 59,
"end": 89,
"id": null,
"generator": false,
"expression": true,
"async": false,
"params": [],
"body": {
"type": "ObjectExpression",
"start": 66,
"end": 88,
"properties": [
{
"type": "Property",
"start": 71,
"end": 84,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "Identifier",
"start": 71,
"end": 75,
"name": "name"
},
"value": {
"type": "Literal",
"start": 77,
"end": 84,
"value": "world",
"raw": "'world'"
},
"kind": "init"
}
]
}
"start": 14,
"end": 18,
"name": "name"
},
"kind": "init"
"init": {
"type": "Literal",
"start": 21,
"end": 28,
"value": "world",
"raw": "'world'"
}
}
]
],
"kind": "let"
}
}
],
"sourceType": "module"
],
"sourceType": "module"
}
}
}
]
}

@ -1,11 +1,7 @@
<h1>Hello {name}!</h1>
<script>
export default {
data: () => ({
name: 'world'
})
};
let name = 'world';
// trailing line comment
</script>
<h1>Hello {name}!</h1>

@ -1,127 +1,89 @@
{
"html": {
"start": 0,
"end": 22,
"start": 68,
"end": 90,
"type": "Fragment",
"children": [
{
"start": 0,
"end": 22,
"start": 66,
"end": 68,
"type": "Text",
"data": "\n\n"
},
{
"start": 68,
"end": 90,
"type": "Element",
"name": "h1",
"attributes": [],
"children": [
{
"start": 4,
"end": 10,
"start": 72,
"end": 78,
"type": "Text",
"data": "Hello "
},
{
"start": 10,
"end": 16,
"start": 78,
"end": 84,
"type": "MustacheTag",
"expression": {
"type": "Identifier",
"start": 11,
"end": 15,
"start": 79,
"end": 83,
"name": "name"
}
},
{
"start": 16,
"end": 17,
"start": 84,
"end": 85,
"type": "Text",
"data": "!"
}
]
},
{
"start": 22,
"end": 24,
"type": "Text",
"data": "\n\n"
}
]
},
"css": null,
"js": {
"start": 24,
"end": 130,
"attributes": [],
"content": {
"type": "Program",
"start": 32,
"end": 121,
"body": [
{
"type": "ExportDefaultDeclaration",
"start": 34,
"end": 93,
"declaration": {
"type": "ObjectExpression",
"start": 49,
"end": 92,
"properties": [
"css": [],
"js": [
{
"start": 0,
"end": 66,
"attributes": [],
"content": {
"type": "Program",
"start": 8,
"end": 57,
"body": [
{
"type": "VariableDeclaration",
"start": 10,
"end": 29,
"declarations": [
{
"type": "Property",
"start": 53,
"end": 89,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "VariableDeclarator",
"start": 14,
"end": 28,
"id": {
"type": "Identifier",
"start": 53,
"end": 57,
"name": "data"
},
"value": {
"type": "ArrowFunctionExpression",
"start": 59,
"end": 89,
"id": null,
"generator": false,
"expression": true,
"async": false,
"params": [],
"body": {
"type": "ObjectExpression",
"start": 66,
"end": 88,
"properties": [
{
"type": "Property",
"start": 71,
"end": 84,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "Identifier",
"start": 71,
"end": 75,
"name": "name"
},
"value": {
"type": "Literal",
"start": 77,
"end": 84,
"value": "world",
"raw": "'world'"
},
"kind": "init"
}
]
}
"start": 14,
"end": 18,
"name": "name"
},
"kind": "init"
"init": {
"type": "Literal",
"start": 21,
"end": 28,
"value": "world",
"raw": "'world'"
}
}
]
],
"kind": "let"
}
}
],
"sourceType": "module"
],
"sourceType": "module"
}
}
}
]
}

@ -1,9 +1,5 @@
<h1>Hello {name}!</h1>
<script>
export default {
data: () => ({
name: 'world'
})
};
let name = 'world';
</script>
<h1>Hello {name}!</h1>

@ -1,127 +1,89 @@
{
"html": {
"start": 0,
"end": 22,
"start": 41,
"end": 63,
"type": "Fragment",
"children": [
{
"start": 0,
"end": 22,
"start": 39,
"end": 41,
"type": "Text",
"data": "\n\n"
},
{
"start": 41,
"end": 63,
"type": "Element",
"name": "h1",
"attributes": [],
"children": [
{
"start": 4,
"end": 10,
"start": 45,
"end": 51,
"type": "Text",
"data": "Hello "
},
{
"start": 10,
"end": 16,
"start": 51,
"end": 57,
"type": "MustacheTag",
"expression": {
"type": "Identifier",
"start": 11,
"end": 15,
"start": 52,
"end": 56,
"name": "name"
}
},
{
"start": 16,
"end": 17,
"start": 57,
"end": 58,
"type": "Text",
"data": "!"
}
]
},
{
"start": 22,
"end": 24,
"type": "Text",
"data": "\n\n"
}
]
},
"css": null,
"js": {
"start": 24,
"end": 103,
"attributes": [],
"content": {
"type": "Program",
"start": 32,
"end": 94,
"body": [
{
"type": "ExportDefaultDeclaration",
"start": 34,
"end": 93,
"declaration": {
"type": "ObjectExpression",
"start": 49,
"end": 92,
"properties": [
"css": [],
"js": [
{
"start": 0,
"end": 39,
"attributes": [],
"content": {
"type": "Program",
"start": 8,
"end": 30,
"body": [
{
"type": "VariableDeclaration",
"start": 10,
"end": 29,
"declarations": [
{
"type": "Property",
"start": 53,
"end": 89,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "VariableDeclarator",
"start": 14,
"end": 28,
"id": {
"type": "Identifier",
"start": 53,
"end": 57,
"name": "data"
},
"value": {
"type": "ArrowFunctionExpression",
"start": 59,
"end": 89,
"id": null,
"generator": false,
"expression": true,
"async": false,
"params": [],
"body": {
"type": "ObjectExpression",
"start": 66,
"end": 88,
"properties": [
{
"type": "Property",
"start": 71,
"end": 84,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "Identifier",
"start": 71,
"end": 75,
"name": "name"
},
"value": {
"type": "Literal",
"start": 77,
"end": 84,
"value": "world",
"raw": "'world'"
},
"kind": "init"
}
]
}
"start": 14,
"end": 18,
"name": "name"
},
"kind": "init"
"init": {
"type": "Literal",
"start": 21,
"end": 28,
"value": "world",
"raw": "'world'"
}
}
]
],
"kind": "let"
}
}
],
"sourceType": "module"
],
"sourceType": "module"
}
}
}
]
}

@ -14,6 +14,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -73,6 +73,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -72,6 +72,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -26,6 +26,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -38,6 +38,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -31,6 +31,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -1 +1 @@
<div in:style='{opacity: 0}'>fades in</div>
<div in:style="{{opacity: 0}}">fades in</div>

@ -1,42 +1,42 @@
{
"html": {
"start": 0,
"end": 43,
"end": 45,
"type": "Fragment",
"children": [
{
"start": 0,
"end": 43,
"end": 45,
"type": "Element",
"name": "div",
"attributes": [
{
"start": 5,
"end": 28,
"end": 30,
"type": "Transition",
"name": "style",
"expression": {
"type": "ObjectExpression",
"start": 15,
"end": 27,
"start": 16,
"end": 28,
"properties": [
{
"type": "Property",
"start": 16,
"end": 26,
"start": 17,
"end": 27,
"method": false,
"shorthand": false,
"computed": false,
"key": {
"type": "Identifier",
"start": 16,
"end": 23,
"start": 17,
"end": 24,
"name": "opacity"
},
"value": {
"type": "Literal",
"start": 25,
"end": 26,
"start": 26,
"end": 27,
"value": 0,
"raw": "0"
},
@ -50,8 +50,8 @@
],
"children": [
{
"start": 29,
"end": 37,
"start": 31,
"end": 39,
"type": "Text",
"data": "fades in"
}
@ -59,6 +59,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -45,6 +45,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -27,6 +27,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -62,6 +62,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}

@ -17,6 +17,6 @@
}
]
},
"css": null,
"js": null
"css": [],
"js": []
}
Loading…
Cancel
Save