diff --git a/src/compiler/compile/nodes/AwaitBlock.ts b/src/compiler/compile/nodes/AwaitBlock.ts index a7b8fb815e4e..fea3944d07e6 100644 --- a/src/compiler/compile/nodes/AwaitBlock.ts +++ b/src/compiler/compile/nodes/AwaitBlock.ts @@ -3,17 +3,21 @@ import PendingBlock from './PendingBlock'; import ThenBlock from './ThenBlock'; import CatchBlock from './CatchBlock'; import Expression from './shared/Expression'; -import { Pattern } from 'estree'; import Component from '../Component'; import TemplateScope from './shared/TemplateScope'; import { TemplateNode } from '../../interfaces'; -import traverse_destructure_pattern from '../utils/traverse_destructure_pattern'; +import { Context, unpack_destructuring } from './shared/Context'; +import { Node as ESTreeNode } from 'estree'; export default class AwaitBlock extends Node { type: 'AwaitBlock'; expression: Expression; - value: DestructurePattern; - error: DestructurePattern; + + value_contexts: Context[]; + error_contexts: Context[]; + + value_node: ESTreeNode | null; + error_node: ESTreeNode | null; pending: PendingBlock; then: ThenBlock; @@ -24,24 +28,21 @@ export default class AwaitBlock extends Node { this.expression = new Expression(component, this, scope, info.expression); - this.value = info.value && new DestructurePattern(info.value); - this.error = info.error && new DestructurePattern(info.error); + this.value_node = info.value; + this.error_node = info.error; + + if (this.value_node) { + this.value_contexts = []; + unpack_destructuring(this.value_contexts, info.value, node => node); + } + + if (this.error_node) { + this.error_contexts = []; + unpack_destructuring(this.error_contexts, info.error, node => node); + } this.pending = new PendingBlock(component, this, scope, info.pending); this.then = new ThenBlock(component, this, scope, info.then); this.catch = new CatchBlock(component, this, scope, info.catch); } } - -export class DestructurePattern { - pattern: Pattern; - expressions: string[]; - identifier_name: string | undefined; - - constructor(pattern: Pattern) { - this.pattern = pattern; - this.expressions = []; - traverse_destructure_pattern(pattern, (node) => this.expressions.push(node.name)); - this.identifier_name = this.pattern.type === 'Identifier' ? this.pattern.name : undefined; - } -} diff --git a/src/compiler/compile/nodes/CatchBlock.ts b/src/compiler/compile/nodes/CatchBlock.ts index 8b3736a2b990..d9fb7f4537d4 100644 --- a/src/compiler/compile/nodes/CatchBlock.ts +++ b/src/compiler/compile/nodes/CatchBlock.ts @@ -13,9 +13,9 @@ export default class CatchBlock extends AbstractBlock { super(component, parent, scope, info); this.scope = scope.child(); - if (parent.error) { - parent.error.expressions.forEach(expression => { - this.scope.add(expression, parent.expression.dependencies, this); + if (parent.error_node) { + parent.error_contexts.forEach(context => { + this.scope.add(context.key.name, parent.expression.dependencies, this); }); } this.children = map_children(component, parent, this.scope, info.children); diff --git a/src/compiler/compile/nodes/EachBlock.ts b/src/compiler/compile/nodes/EachBlock.ts index 31850f874546..6458ea002019 100644 --- a/src/compiler/compile/nodes/EachBlock.ts +++ b/src/compiler/compile/nodes/EachBlock.ts @@ -4,56 +4,8 @@ import map_children from './shared/map_children'; import TemplateScope from './shared/TemplateScope'; import AbstractBlock from './shared/AbstractBlock'; import Element from './Element'; -import { x } from 'code-red'; -import { Node, Identifier, RestElement } from 'estree'; - -interface Context { - key: Identifier; - name?: string; - modifier: (node: Node) => Node; -} - -function unpack_destructuring(contexts: Context[], node: Node, modifier: (node: Node) => Node) { - if (!node) return; - - if (node.type === 'Identifier' || (node as any).type === 'RestIdentifier') { // TODO is this right? not RestElement? - contexts.push({ - key: node as Identifier, - modifier - }); - } else if (node.type === 'ArrayPattern') { - node.elements.forEach((element, i) => { - if (element && (element as any).type === 'RestIdentifier') { - unpack_destructuring(contexts, element, node => x`${modifier(node)}.slice(${i})` as Node); - } else { - unpack_destructuring(contexts, element, node => x`${modifier(node)}[${i}]` as Node); - } - }); - } else if (node.type === 'ObjectPattern') { - const used_properties = []; - - node.properties.forEach((property, i) => { - if ((property as any).kind === 'rest') { // TODO is this right? - const replacement: RestElement = { - type: 'RestElement', - argument: property.key as Identifier - }; - - node.properties[i] = replacement as any; - - unpack_destructuring( - contexts, - property.value, - node => x`@object_without_properties(${modifier(node)}, [${used_properties}])` as Node - ); - } else { - used_properties.push(x`"${(property.key as Identifier).name}"`); - - unpack_destructuring(contexts, property.value, node => x`${modifier(node)}.${(property.key as Identifier).name}` as Node); - } - }); - } -} +import { Context, unpack_destructuring } from './shared/Context'; +import { Node } from 'estree'; export default class EachBlock extends AbstractBlock { type: 'EachBlock'; diff --git a/src/compiler/compile/nodes/ThenBlock.ts b/src/compiler/compile/nodes/ThenBlock.ts index 7eefe2e6fb59..f0712ced4abd 100644 --- a/src/compiler/compile/nodes/ThenBlock.ts +++ b/src/compiler/compile/nodes/ThenBlock.ts @@ -13,9 +13,9 @@ export default class ThenBlock extends AbstractBlock { super(component, parent, scope, info); this.scope = scope.child(); - if (parent.value) { - parent.value.expressions.forEach(expression => { - this.scope.add(expression, parent.expression.dependencies, this); + if (parent.value_node) { + parent.value_contexts.forEach(context => { + this.scope.add(context.key.name, parent.expression.dependencies, this); }); } this.children = map_children(component, parent, this.scope, info.children); diff --git a/src/compiler/compile/nodes/shared/Context.ts b/src/compiler/compile/nodes/shared/Context.ts new file mode 100644 index 000000000000..9f4df533ae09 --- /dev/null +++ b/src/compiler/compile/nodes/shared/Context.ts @@ -0,0 +1,50 @@ +import { x } from 'code-red'; +import { Node, Identifier, RestElement, Property } from 'estree'; + +export interface Context { + key: Identifier; + name?: string; + modifier: (node: Node) => Node; +} + +export function unpack_destructuring(contexts: Context[], node: Node, modifier: (node: Node) => Node) { + if (!node) return; + + if (node.type === 'Identifier') { + contexts.push({ + key: node as Identifier, + modifier + }); + } else if (node.type === 'RestElement') { + contexts.push({ + key: node.argument as Identifier, + modifier + }); + } else if (node.type === 'ArrayPattern') { + node.elements.forEach((element, i) => { + if (element && (element as any).type === 'RestElement') { + unpack_destructuring(contexts, element, node => x`${modifier(node)}.slice(${i})` as Node); + } else { + unpack_destructuring(contexts, element, node => x`${modifier(node)}[${i}]` as Node); + } + }); + } else if (node.type === 'ObjectPattern') { + const used_properties = []; + + node.properties.forEach((property) => { + const props: (RestElement | Property) = (property as any); + + if (props.type === 'RestElement') { + unpack_destructuring( + contexts, + props.argument, + node => x`@object_without_properties(${modifier(node)}, [${used_properties}])` as Node + ); + } else { + used_properties.push(x`"${(property.key as Identifier).name}"`); + + unpack_destructuring(contexts, property.value, node => x`${modifier(node)}.${(property.key as Identifier).name}` as Node); + } + }); + } +} diff --git a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts index d6ac17f0ced4..389e67a1dc69 100644 --- a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts @@ -8,8 +8,8 @@ import FragmentWrapper from './Fragment'; import PendingBlock from '../../nodes/PendingBlock'; import ThenBlock from '../../nodes/ThenBlock'; import CatchBlock from '../../nodes/CatchBlock'; -import { Identifier } from 'estree'; -import traverse_destructure_pattern from '../../utils/traverse_destructure_pattern'; +import { Context } from '../../nodes/shared/Context'; +import { Identifier, Literal, Node } from 'estree'; class AwaitBlockBranch extends Wrapper { node: PendingBlock | ThenBlock | CatchBlock; @@ -18,6 +18,12 @@ class AwaitBlockBranch extends Wrapper { is_dynamic: boolean; var = null; + status: string; + + value: string; + value_index: Literal; + value_contexts: Context[]; + is_destructured: boolean; constructor( status: string, @@ -29,6 +35,7 @@ class AwaitBlockBranch extends Wrapper { next_sibling: Wrapper ) { super(renderer, block, parent, node); + this.status = status; this.block = block.child({ comment: create_debugging_comment(node, this.renderer.component), @@ -48,20 +55,43 @@ class AwaitBlockBranch extends Wrapper { this.is_dynamic = this.block.dependencies.size > 0; } + add_context(node: Node | null, contexts: Context[]) { + if (!node) return; + + if (node.type === 'Identifier') { + this.value = node.name; + this.block.renderer.add_to_context(this.value, true); + } else { + contexts.forEach(context => { + this.block.renderer.add_to_context(context.key.name, true); + }); + this.value = this.block.parent.get_unique_name('value').name; + this.value_contexts = contexts; + this.block.renderer.add_to_context(this.value, true); + this.is_destructured = true; + } + this.value_index = this.block.renderer.context_lookup.get(this.value).index; + } + render(block: Block, parent_node: Identifier, parent_nodes: Identifier) { this.fragment.render(block, parent_node, parent_nodes); - } - render_destructure(block: Block, value, node, index) { - if (value && node.pattern.type !== 'Identifier') { - traverse_destructure_pattern(node.pattern, (node, parent, index) => { - parent[index] = x`#ctx[${block.renderer.context_lookup.get(node.name).index}]`; - }); + if (this.is_destructured) { + this.render_destructure(); + } + } - this.block.chunks.declarations.push(b`(${node.pattern} = #ctx[${index}])`); - if (this.block.has_update_method) { - this.block.chunks.update.push(b`(${node.pattern} = #ctx[${index}])`); + render_destructure() { + const props = this.value_contexts.map(prop => b`#ctx[${this.block.renderer.context_lookup.get(prop.key.name).index}] = ${prop.modifier(x`#ctx[${this.value_index}]`)};`); + const get_context = this.block.renderer.component.get_unique_name(`get_${this.status}_context`); + this.block.renderer.blocks.push(b` + function ${get_context}(#ctx) { + ${props} } + `); + this.block.chunks.declarations.push(b`${get_context}(#ctx)`); + if (this.block.has_update_method) { + this.block.chunks.update.push(b`${get_context}(#ctx)`); } } } @@ -73,9 +103,6 @@ export default class AwaitBlockWrapper extends Wrapper { then: AwaitBlockBranch; catch: AwaitBlockBranch; - value: string; - error: string; - var: Identifier = { type: 'Identifier', name: 'await_block' }; constructor( @@ -92,20 +119,6 @@ export default class AwaitBlockWrapper extends Wrapper { this.not_static_content(); block.add_dependencies(this.node.expression.dependencies); - if (this.node.value) { - for (const ctx of this.node.value.expressions) { - block.renderer.add_to_context(ctx, true); - } - this.value = this.node.value.identifier_name || block.get_unique_name('value').name; - block.renderer.add_to_context(this.value, true); - } - if (this.node.error) { - for (const ctx of this.node.error.expressions) { - block.renderer.add_to_context(ctx, true); - } - this.error = this.node.error.identifier_name || block.get_unique_name('error').name; - block.renderer.add_to_context(this.error, true); - } let is_dynamic = false; let has_intros = false; @@ -144,6 +157,9 @@ export default class AwaitBlockWrapper extends Wrapper { this[status].block.has_outro_method = has_outros; }); + this.then.add_context(this.node.value_node, this.node.value_contexts); + this.catch.add_context(this.node.error_node, this.node.error_contexts); + if (has_outros) { block.add_outro(); } @@ -166,9 +182,6 @@ export default class AwaitBlockWrapper extends Wrapper { block.maintain_context = true; - const value_index = this.value && block.renderer.context_lookup.get(this.value).index; - const error_index = this.error && block.renderer.context_lookup.get(this.error).index; - const info_props: any = x`{ ctx: #ctx, current: null, @@ -176,8 +189,8 @@ export default class AwaitBlockWrapper extends Wrapper { pending: ${this.pending.block.name}, then: ${this.then.block.name}, catch: ${this.catch.block.name}, - value: ${value_index}, - error: ${error_index}, + value: ${this.then.value_index}, + error: ${this.catch.value_index}, blocks: ${this.pending.block.has_outro_method && x`[,,,]`} }`; @@ -232,7 +245,7 @@ export default class AwaitBlockWrapper extends Wrapper { } else { const #child_ctx = #ctx.slice(); - ${this.value && b`#child_ctx[${value_index}] = ${info}.resolved;`} + ${this.then.value && b`#child_ctx[${this.then.value_index}] = ${info}.resolved;`} ${info}.block.p(#child_ctx, #dirty); } `); @@ -246,7 +259,7 @@ export default class AwaitBlockWrapper extends Wrapper { block.chunks.update.push(b` { const #child_ctx = #ctx.slice(); - ${this.value && b`#child_ctx[${value_index}] = ${info}.resolved;`} + ${this.then.value && b`#child_ctx[${this.then.value_index}] = ${info}.resolved;`} ${info}.block.p(#child_ctx, #dirty); } `); @@ -271,7 +284,5 @@ export default class AwaitBlockWrapper extends Wrapper { [this.pending, this.then, this.catch].forEach(branch => { branch.render(branch.block, null, x`#nodes` as Identifier); }); - this.then.render_destructure(block, this.value, this.node.value, value_index); - this.catch.render_destructure(block, this.error, this.node.error, error_index); } } diff --git a/src/compiler/compile/render_ssr/handlers/AwaitBlock.ts b/src/compiler/compile/render_ssr/handlers/AwaitBlock.ts index d6bb86f1a4d3..0488948c7e36 100644 --- a/src/compiler/compile/render_ssr/handlers/AwaitBlock.ts +++ b/src/compiler/compile/render_ssr/handlers/AwaitBlock.ts @@ -14,7 +14,7 @@ export default function(node: AwaitBlock, renderer: Renderer, options: RenderOpt renderer.add_expression(x` function(__value) { if (@is_promise(__value)) return ${pending}; - return (function(${node.value ? node.value.pattern : ''}) { return ${then}; }(__value)); + return (function(${node.value_node ? node.value_node : ''}) { return ${then}; }(__value)); }(${node.expression.node}) `); } diff --git a/src/compiler/compile/utils/traverse_destructure_pattern.ts b/src/compiler/compile/utils/traverse_destructure_pattern.ts deleted file mode 100644 index 6c918c28c07f..000000000000 --- a/src/compiler/compile/utils/traverse_destructure_pattern.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { Pattern, Identifier, RestElement } from "estree"; -import { Node } from "acorn"; - -export default function traverse_destructure_pattern( - node: Pattern, - callback: (node: Identifier, parent: Node, key: string | number) => void -) { - function traverse(node: Pattern, parent, key) { - switch (node.type) { - case "Identifier": - return callback(node, parent, key); - case "ArrayPattern": - for (let i = 0; i < node.elements.length; i++) { - const element = node.elements[i]; - traverse(element, node.elements, i); - } - break; - case "ObjectPattern": - for (let i = 0; i < node.properties.length; i++) { - const property = node.properties[i]; - if (property.type === "Property") { - traverse(property.value, property, "value"); - } else { - traverse((property as any) as RestElement, node.properties, i); - } - } - break; - case "RestElement": - return traverse(node.argument, node, 'argument'); - case "AssignmentPattern": - return traverse(node.left, node, 'left'); - } - } - traverse(node, null, null); -} diff --git a/src/compiler/parse/index.ts b/src/compiler/parse/index.ts index c21e6d6f7968..a809eeebeb31 100644 --- a/src/compiler/parse/index.ts +++ b/src/compiler/parse/index.ts @@ -5,9 +5,6 @@ import { reserved } from '../utils/names'; import full_char_code_at from '../utils/full_char_code_at'; import { TemplateNode, Ast, ParserOptions, Fragment, Style, Script } from '../interfaces'; import error from '../utils/error'; -import { is_bracket_open, is_bracket_close, is_bracket_pair, get_bracket_close } from './utils/bracket'; -import { parse_expression_at } from './acorn'; -import { Pattern } from 'estree'; type ParserState = (parser: Parser) => (ParserState | void); @@ -173,51 +170,6 @@ export class Parser { return identifier; } - read_destructure_pattern(): Pattern { - const start = this.index; - let i = this.index; - - const code = full_char_code_at(this.template, i); - if (isIdentifierStart(code, true)) { - return { type: 'Identifier', name: this.read_identifier() }; - } - - if (!is_bracket_open(code)) { - this.error({ - code: 'unexpected-token', - message: 'Expected identifier or destructure pattern', - }); - } - - const bracket_stack = [code]; - i += code <= 0xffff ? 1 : 2; - - while (i < this.template.length) { - const code = full_char_code_at(this.template, i); - if (is_bracket_open(code)) { - bracket_stack.push(code); - } else if (is_bracket_close(code)) { - if (!is_bracket_pair(bracket_stack[bracket_stack.length - 1], code)) { - this.error({ - code: 'unexpected-token', - message: `Expected ${String.fromCharCode(get_bracket_close(bracket_stack[bracket_stack.length - 1]))}` - }); - } - bracket_stack.pop(); - if (bracket_stack.length === 0) { - i += code <= 0xffff ? 1 : 2; - break; - } - } - i += code <= 0xffff ? 1 : 2; - } - - this.index = i; - - const pattern_string = this.template.slice(start, i); - return (parse_expression_at(`(${pattern_string} = 1)`, 0) as any).left as Pattern; - } - read_until(pattern: RegExp) { if (this.index >= this.template.length) this.error({ diff --git a/src/compiler/parse/read/context.ts b/src/compiler/parse/read/context.ts index fe666467f803..1a641ba927d1 100644 --- a/src/compiler/parse/read/context.ts +++ b/src/compiler/parse/read/context.ts @@ -18,13 +18,21 @@ interface Property { value: Context; } +interface RestElement { + start: number; + end: number; + type: 'RestElement'; + argument: Identifier; +} + interface Context { start: number; end: number; - type: 'Identifier' | 'ArrayPattern' | 'ObjectPattern' | 'RestIdentifier'; + type: 'Identifier' | 'ArrayPattern' | 'ObjectPattern' | 'RestElement'; name?: string; + argument?: Context; elements?: Context[]; - properties?: Property[]; + properties?: Array; } function error_on_assignment_pattern(parser: Parser) { @@ -58,7 +66,7 @@ export default function read_context(parser: Parser) { parser.allow_whitespace(); const lastContext = context.elements[context.elements.length - 1]; - if (lastContext && lastContext.type === 'RestIdentifier') { + if (lastContext && lastContext.type === 'RestElement') { error_on_rest_pattern_not_last(parser); } @@ -93,14 +101,11 @@ export default function read_context(parser: Parser) { type: 'Identifier', name }; - const property: Property = { + const property: RestElement = { start, end: parser.index, - type: 'Property', - kind: 'rest', - shorthand: true, - key, - value: key + type: 'RestElement', + argument: key, }; context.properties.push(property); @@ -167,9 +172,14 @@ export default function read_context(parser: Parser) { else if (parser.eat('...')) { const name = parser.read_identifier(); if (name) { - context.type = 'RestIdentifier'; + context.type = 'RestElement'; context.end = parser.index; - context.name = name; + context.argument = { + type: 'Identifier', + start: context.start + 3, + end: parser.index, + name, + }; } else { diff --git a/src/compiler/parse/state/mustache.ts b/src/compiler/parse/state/mustache.ts index 28ef853f8e1d..3033a8969ed8 100644 --- a/src/compiler/parse/state/mustache.ts +++ b/src/compiler/parse/state/mustache.ts @@ -196,7 +196,7 @@ export default function mustache(parser: Parser) { if (!parser.eat('}')) { parser.require_whitespace(); - await_block[is_then ? 'value': 'error'] = parser.read_destructure_pattern(); + await_block[is_then ? 'value': 'error'] = read_context(parser); parser.allow_whitespace(); parser.eat('}', true); } @@ -305,7 +305,7 @@ export default function mustache(parser: Parser) { const await_block_shorthand = type === 'AwaitBlock' && parser.eat('then'); if (await_block_shorthand) { parser.require_whitespace(); - block.value = parser.read_destructure_pattern(); + block.value = read_context(parser); parser.allow_whitespace(); } diff --git a/test/parser/samples/each-block-destructured/output.json b/test/parser/samples/each-block-destructured/output.json index 425c609a2ccd..d7aa7d613754 100644 --- a/test/parser/samples/each-block-destructured/output.json +++ b/test/parser/samples/each-block-destructured/output.json @@ -104,8 +104,8 @@ { "start": 31, "end": 38, - "type": "RestIdentifier", - "name": "rest" + "type": "RestElement", + "argument": "rest" } ] } diff --git a/test/runtime/samples/await-then-destruct-default/_config.js b/test/runtime/samples/await-then-destruct-default.skip/_config.js similarity index 100% rename from test/runtime/samples/await-then-destruct-default/_config.js rename to test/runtime/samples/await-then-destruct-default.skip/_config.js diff --git a/test/runtime/samples/await-then-destruct-default/main.svelte b/test/runtime/samples/await-then-destruct-default.skip/main.svelte similarity index 100% rename from test/runtime/samples/await-then-destruct-default/main.svelte rename to test/runtime/samples/await-then-destruct-default.skip/main.svelte