diff --git a/src/compiler/compile/nodes/shared/Context.ts b/src/compiler/compile/nodes/shared/Context.ts index 3957ed2173..560b0a97ab 100644 --- a/src/compiler/compile/nodes/shared/Context.ts +++ b/src/compiler/compile/nodes/shared/Context.ts @@ -11,7 +11,7 @@ export type Context = DestructuredVariable | ComputedProperty; interface ComputedProperty { type: 'ComputedProperty'; - property_name: string; + property_name: Identifier; key: Expression | PrivateIdentifier; } @@ -30,8 +30,7 @@ export function unpack_destructuring({ default_modifier = (node) => node, scope, component, - context_rest_properties, - number_of_computed_props = { n: 0 } + context_rest_properties }: { contexts: Context[]; node: Node; @@ -40,10 +39,6 @@ export function unpack_destructuring({ scope: TemplateScope; component: Component; context_rest_properties: Map; - // we want to pass this by reference, as a sort of global variable, because - // if we pass this by value, we could get computed_property_# variable collisions - // when we deal with nested object destructuring - number_of_computed_props?: { n: number }; }) { if (!node) return; @@ -72,8 +67,7 @@ export function unpack_destructuring({ default_modifier, scope, component, - context_rest_properties, - number_of_computed_props + context_rest_properties }); context_rest_properties.set((element.argument as Identifier).name, element); } else if (element && element.type === 'AssignmentPattern') { @@ -93,8 +87,7 @@ export function unpack_destructuring({ )}` as Node, scope, component, - context_rest_properties, - number_of_computed_props + context_rest_properties }); } else { unpack_destructuring({ @@ -104,8 +97,7 @@ export function unpack_destructuring({ default_modifier, scope, component, - context_rest_properties, - number_of_computed_props + context_rest_properties }); } }); @@ -124,8 +116,7 @@ export function unpack_destructuring({ default_modifier, scope, component, - context_rest_properties, - number_of_computed_props + context_rest_properties }); context_rest_properties.set((property.argument as Identifier).name, property); } else if (property.type === 'Property') { @@ -136,8 +127,7 @@ export function unpack_destructuring({ if (property.computed) { // e.g { [computedProperty]: ... } - const property_name = `computed_property_${number_of_computed_props.n}`; - number_of_computed_props.n += 1; + const property_name = x`computed_property` as Identifier; contexts.push({ type: 'ComputedProperty', @@ -178,8 +168,7 @@ export function unpack_destructuring({ )}` as Node, scope, component, - context_rest_properties, - number_of_computed_props + context_rest_properties }); } else { // e.g. { property } or { property: newName } @@ -190,8 +179,7 @@ export function unpack_destructuring({ default_modifier, scope, component, - context_rest_properties, - number_of_computed_props + context_rest_properties }); } } diff --git a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts index 534595f4a9..abd8b1b632 100644 --- a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts @@ -12,6 +12,7 @@ import { Context } from '../../nodes/shared/Context'; import { Identifier, Literal, Node } from 'estree'; import { add_const_tags, add_const_tags_context } from './shared/add_const_tags'; import Expression from '../../nodes/shared/Expression'; +import { resolve_computed_prop_conflicts } from '../../utils/resolve_computed_props'; type Status = 'pending' | 'then' | 'catch'; @@ -98,6 +99,10 @@ class AwaitBlockBranch extends Wrapper { } render_get_context() { + if (this.has_consts(this.node)) { + resolve_computed_prop_conflicts(this.block, this.value_contexts, this.node.const_tags); + } + const props = this.is_destructured ? this.value_contexts.map(prop => { if (prop.type === 'ComputedProperty') { const expression = new Expression(this.renderer.component, this.node, this.has_consts(this.node) ? this.node.scope : null, prop.key); diff --git a/src/compiler/compile/render_dom/wrappers/EachBlock.ts b/src/compiler/compile/render_dom/wrappers/EachBlock.ts index 9c1af7ce44..b37bee08f7 100644 --- a/src/compiler/compile/render_dom/wrappers/EachBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/EachBlock.ts @@ -10,6 +10,7 @@ import { Identifier, Node } from 'estree'; import get_object from '../../utils/get_object'; import { add_const_tags, add_const_tags_context } from './shared/add_const_tags'; import Expression from '../../nodes/shared/Expression'; +import { resolve_computed_prop_conflicts } from '../../utils/resolve_computed_props'; export class ElseBlockWrapper extends Wrapper { node: ElseBlock; @@ -364,6 +365,8 @@ export default class EachBlockWrapper extends Wrapper { this.else.fragment.render(this.else.block, null, x`#nodes` as Identifier); } + resolve_computed_prop_conflicts(this.block, this.node.contexts, this.node.const_tags); + this.context_props = this.node.contexts.map(prop => { if (prop.type === 'DestructuredVariable') { const to_ctx = (name: string) => renderer.context_lookup.has(name) ? x`child_ctx[${renderer.context_lookup.get(name).index}]` : { type: 'Identifier', name } as Node; diff --git a/src/compiler/compile/utils/resolve_computed_props.ts b/src/compiler/compile/utils/resolve_computed_props.ts new file mode 100644 index 0000000000..a6725dfe92 --- /dev/null +++ b/src/compiler/compile/utils/resolve_computed_props.ts @@ -0,0 +1,19 @@ +import { Context } from '../nodes/shared/Context'; +import ConstTag from '../nodes/ConstTag'; +import Block from '../render_dom/Block'; + +export function resolve_computed_prop_conflicts(block: Block, node_contexts: Context[], node_const_tags: ConstTag[]) { + node_contexts.forEach((context: Context) => { + if (context.type === 'ComputedProperty') { + context.property_name.name = block.get_unique_name('computed_prop').name; + } + }); + + node_const_tags.forEach((const_tag: ConstTag) => { + const_tag.contexts.forEach((context: Context) => { + if (context.type === 'ComputedProperty') { + context.property_name.name = block.get_unique_name('computed_prop').name; + } + }); + }); +}