diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index 3890146550..45a8f3ae96 100644 --- a/src/compiler/compile/nodes/shared/Expression.ts +++ b/src/compiler/compile/nodes/shared/Expression.ts @@ -268,8 +268,8 @@ export default class Expression { // function can be hoisted inside the component init component.partly_hoisted.push(declaration); - const i = block.renderer.add_to_context(id.name); - this.replace(x`#ctx[${i}]` as any); + block.renderer.add_to_context(id.name); + this.replace(block.renderer.reference(id.name)); } else { @@ -285,20 +285,21 @@ export default class Expression { component.partly_hoisted.push(declaration); - const i = block.renderer.add_to_context(id.name); + block.renderer.add_to_context(id.name); + const callee = block.renderer.reference(id.name); this.replace(id as any); if ((node as FunctionExpression).params.length > 0) { declarations.push(b` function ${id}(...args) { - return #ctx[${i}](${context_args}, ...args); + return ${callee}(${context_args}, ...args); } `); } else { declarations.push(b` function ${id}() { - return #ctx[${i}](${context_args}); + return ${callee}(${context_args}); } `); } diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index b049f7aa29..cc0bd37723 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -460,7 +460,7 @@ export default class ElementWrapper extends Wrapper { groups.forEach(group => { const handler = renderer.component.get_unique_name(`${this.var.name}_${group.events.join('_')}_handler`); - const i = renderer.add_to_context(handler.name); + renderer.add_to_context(handler.name); // TODO figure out how to handle locks const needs_lock = group.bindings.some(binding => binding.needs_lock); @@ -488,7 +488,7 @@ export default class ElementWrapper extends Wrapper { const has_local_function = contextual_dependencies.size > 0 || needs_lock || animation_frame; - let callee; + let callee = renderer.reference(handler.name); // TODO dry this out — similar code for event handlers and component bindings if (has_local_function) { @@ -503,21 +503,19 @@ export default class ElementWrapper extends Wrapper { ${animation_frame} = @raf(${handler}); ${needs_lock && b`${lock} = true;`} } - #ctx[${i}].call(${this.var}, ${args}); + ${callee}.call(${this.var}, ${args}); } `); } else { block.chunks.init.push(b` function ${handler}() { ${needs_lock && b`${lock} = true;`} - #ctx[${i}].call(${this.var}, ${args}); + ${callee}.call(${this.var}, ${args}); } `); } callee = handler; - } else { - callee = x`#ctx[${i}]`; } const params = Array.from(contextual_dependencies).map(name => ({ diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index 38daf5e291..b42302b222 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -280,7 +280,8 @@ export default class InlineComponentWrapper extends Wrapper { } const id = component.get_unique_name(`${this.var.name}_${binding.name}_binding`); - const i = renderer.add_to_context(id.name); + renderer.add_to_context(id.name); + const callee = renderer.reference(id.name); const updating = block.get_unique_name(`updating_${binding.name}`); block.add_variable(updating); @@ -333,7 +334,7 @@ export default class InlineComponentWrapper extends Wrapper { block.chunks.init.push(b` function ${id}(${value}) { - #ctx[${i}].call(null, ${value}, ${args}); + ${callee}.call(null, ${value}, ${args}); } `); @@ -341,7 +342,7 @@ export default class InlineComponentWrapper extends Wrapper { } else { block.chunks.init.push(b` function ${id}(${value}) { - #ctx[${i}].call(null, ${value}); + ${callee}.call(null, ${value}); } `); } diff --git a/src/compiler/compile/render_dom/wrappers/Window.ts b/src/compiler/compile/render_dom/wrappers/Window.ts index 26042fa84a..b13d4dd043 100644 --- a/src/compiler/compile/render_dom/wrappers/Window.ts +++ b/src/compiler/compile/render_dom/wrappers/Window.ts @@ -124,7 +124,8 @@ export default class WindowWrapper extends Wrapper { `); } - const i = renderer.add_to_context(id.name); + renderer.add_to_context(id.name); + const reference = renderer.reference(id.name); component.partly_hoisted.push(b` function ${id}() { @@ -133,7 +134,7 @@ export default class WindowWrapper extends Wrapper { `); block.chunks.init.push(b` - @add_render_callback(#ctx[${i}]); + @add_render_callback(${reference}); `); component.has_reactive_assignments = true; @@ -161,7 +162,8 @@ export default class WindowWrapper extends Wrapper { const id = block.get_unique_name(`onlinestatuschanged`); const name = bindings.online; - const i = renderer.add_to_context(id.name); + renderer.add_to_context(id.name); + const reference = renderer.reference(id.name); component.partly_hoisted.push(b` function ${id}() { @@ -170,12 +172,12 @@ export default class WindowWrapper extends Wrapper { `); block.chunks.init.push(b` - @add_render_callback(#ctx[${i}]); + @add_render_callback(${reference}); `); block.event_listeners.push( - x`@listen(@_window, "online", #ctx[${i}])`, - x`@listen(@_window, "offline", #ctx[${i}])` + x`@listen(@_window, "online", ${reference})`, + x`@listen(@_window, "offline", ${reference})` ); component.has_reactive_assignments = true; diff --git a/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts b/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts index e46f7b59f0..97199a71c2 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts @@ -7,7 +7,9 @@ import { Identifier } from 'estree'; export default function bind_this(component: Component, block: Block, binding: Binding, variable: Identifier) { const fn = component.get_unique_name(`${variable.name}_binding`); - const i = block.renderer.add_to_context(fn.name); + + block.renderer.add_to_context(fn.name); + const callee = block.renderer.reference(fn.name); let lhs; let object; @@ -60,8 +62,8 @@ export default function bind_this(component: Component, block: Block, binding: B const unassign = block.get_unique_name(`unassign_${variable.name}`); block.chunks.init.push(b` - const ${assign} = () => #ctx[${i}](${variable}, ${args}); - const ${unassign} = () => #ctx[${i}](null, ${args}); + const ${assign} = () => ${callee}(${variable}, ${args}); + const ${unassign} = () => ${callee}(null, ${args}); `); const condition = Array.from(contextual_dependencies) @@ -91,6 +93,6 @@ export default function bind_this(component: Component, block: Block, binding: B } `); - block.chunks.destroy.push(b`#ctx[${i}](null);`); - return b`#ctx[${i}](${variable});`; + block.chunks.destroy.push(b`${callee}(null);`); + return b`${callee}(${variable});`; } \ No newline at end of file