From 17f0e4247e6a0ac14735316608ebb81d5f446f11 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Sat, 16 Nov 2019 15:26:40 -0500 Subject: [PATCH 01/43] start updating tests --- .../action-custom-event-handler/expected.js | 12 ++++++------ test/js/samples/bind-online/expected.js | 10 +++++----- test/js/samples/bind-open/expected.js | 17 +++++++---------- 3 files changed, 18 insertions(+), 21 deletions(-) diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js index 3fad4fb8cc8d..917cbf6cb23b 100644 --- a/test/js/samples/action-custom-event-handler/expected.js +++ b/test/js/samples/action-custom-event-handler/expected.js @@ -21,10 +21,10 @@ function create_fragment(ctx) { }, m(target, anchor) { insert(target, button, anchor); - foo_action = foo.call(null, button, ctx.foo_function) || ({}); + foo_action = foo.call(null, button, ctx[1]) || ({}); }, - p(changed, ctx) { - if (is_function(foo_action.update) && changed.bar) foo_action.update.call(null, ctx.foo_function); + p(ctx) { + if (is_function(foo_action.update)) foo_action.update.call(null, ctx[1]); }, i: noop, o: noop, @@ -40,7 +40,7 @@ function handleFoo(bar) { } function foo(node, callback) { - + } function instance($$self, $$props, $$invalidate) { @@ -48,10 +48,10 @@ function instance($$self, $$props, $$invalidate) { const foo_function = () => handleFoo(bar); $$self.$set = $$props => { - if ("bar" in $$props) $$invalidate("bar", bar = $$props.bar); + if ("bar" in $$props) $$invalidate(0, bar = $$props.bar); }; - return { bar, foo_function }; + return [bar, foo_function]; } class Component extends SvelteComponent { diff --git a/test/js/samples/bind-online/expected.js b/test/js/samples/bind-online/expected.js index d34e84330f77..278d80700192 100644 --- a/test/js/samples/bind-online/expected.js +++ b/test/js/samples/bind-online/expected.js @@ -11,13 +11,13 @@ import { function create_fragment(ctx) { let dispose; - add_render_callback(ctx.onlinestatuschanged); + add_render_callback(ctx[1]); return { c() { dispose = [ - listen(window, "online", ctx.onlinestatuschanged), - listen(window, "offline", ctx.onlinestatuschanged) + listen(window, "online", ctx[1]), + listen(window, "offline", ctx[1]) ]; }, m: noop, @@ -34,10 +34,10 @@ function instance($$self, $$props, $$invalidate) { let online; function onlinestatuschanged() { - $$invalidate("online", online = navigator.onLine); + $$invalidate(0, online = navigator.onLine); } - return { online, onlinestatuschanged }; + return [online, onlinestatuschanged]; } class Component extends SvelteComponent { diff --git a/test/js/samples/bind-open/expected.js b/test/js/samples/bind-open/expected.js index f7bede2b4ef7..f235b21f7bb3 100644 --- a/test/js/samples/bind-open/expected.js +++ b/test/js/samples/bind-open/expected.js @@ -21,16 +21,14 @@ function create_fragment(ctx) { details.innerHTML = `summarycontent `; - dispose = listen(details, "toggle", ctx.details_toggle_handler); + dispose = listen(details, "toggle", ctx[1]); }, m(target, anchor) { insert(target, details, anchor); - details.open = ctx.open; + details.open = ctx[0]; }, - p(changed, ctx) { - if (changed.open) { - details.open = ctx.open; - } + p(ctx) { + details.open = ctx[0]; }, i: noop, o: noop, @@ -45,15 +43,14 @@ function instance($$self, $$props, $$invalidate) { let { open } = $$props; function details_toggle_handler() { - open = this.open; - $$invalidate("open", open); + $$invalidate(0, open = this.open); } $$self.$set = $$props => { - if ("open" in $$props) $$invalidate("open", open = $$props.open); + if ("open" in $$props) $$invalidate(0, open = $$props.open); }; - return { open, details_toggle_handler }; + return [open, details_toggle_handler]; } class Component extends SvelteComponent { From 71183182246e9f4738abdca60a2d121effa39910 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Sun, 17 Nov 2019 17:09:24 -0500 Subject: [PATCH 02/43] start implementing bitmask-based change tracking (#1943) --- src/compiler/compile/Component.ts | 63 +----------- src/compiler/compile/nodes/Action.ts | 2 +- src/compiler/compile/nodes/Animation.ts | 2 +- src/compiler/compile/nodes/Transition.ts | 2 +- .../compile/nodes/shared/Expression.ts | 45 ++++----- src/compiler/compile/render_dom/Block.ts | 2 +- src/compiler/compile/render_dom/Renderer.ts | 96 +++++++++++++++++++ src/compiler/compile/render_dom/index.ts | 49 +++++----- .../{utils => render_dom}/invalidate.ts | 17 ++-- .../compile/render_dom/wrappers/AwaitBlock.ts | 7 +- .../compile/render_dom/wrappers/DebugTag.ts | 3 +- .../compile/render_dom/wrappers/EachBlock.ts | 23 +++-- .../render_dom/wrappers/Element/Attribute.ts | 15 ++- .../render_dom/wrappers/Element/Binding.ts | 3 +- .../wrappers/Element/EventHandler.ts | 11 ++- .../wrappers/Element/StyleAttribute.ts | 3 +- .../render_dom/wrappers/Element/index.ts | 43 ++++----- .../compile/render_dom/wrappers/IfBlock.ts | 23 +++-- .../wrappers/InlineComponent/index.ts | 26 ++--- .../compile/render_dom/wrappers/Slot.ts | 7 +- .../compile/render_dom/wrappers/Title.ts | 3 +- .../compile/render_dom/wrappers/Window.ts | 29 ++---- .../compile/render_dom/wrappers/shared/Tag.ts | 3 +- .../render_dom/wrappers/shared/add_actions.ts | 12 +-- .../render_dom/wrappers/shared/bind_this.ts | 21 ++-- .../render_dom/wrappers/shared/changed.ts | 7 -- src/runtime/internal/Component.ts | 22 ++--- src/runtime/internal/keyed_each.ts | 2 +- src/runtime/internal/scheduler.ts | 4 +- .../action-custom-event-handler/expected.js | 4 +- test/runtime/index.js | 2 +- .../action-custom-event-handler/_config.js | 2 +- 32 files changed, 276 insertions(+), 277 deletions(-) rename src/compiler/compile/{utils => render_dom}/invalidate.ts (73%) delete mode 100644 src/compiler/compile/render_dom/wrappers/shared/changed.ts diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts index 2d696ad306c7..ff63e7718e5d 100644 --- a/src/compiler/compile/Component.ts +++ b/src/compiler/compile/Component.ts @@ -889,48 +889,8 @@ export default class Component { return null; } - invalidate(name, value?) { - const variable = this.var_lookup.get(name); - - if (variable && (variable.subscribable && (variable.reassigned || variable.export_name))) { - return x`${`$$subscribe_${name}`}($$invalidate('${name}', ${value || name}))`; - } - - if (name[0] === '$' && name[1] !== '$') { - return x`${name.slice(1)}.set(${value || name})`; - } - - if ( - variable && - !variable.referenced && - !variable.is_reactive_dependency && - !variable.export_name && - !name.startsWith('$$') - ) { - return value || name; - } - - if (value) { - return x`$$invalidate('${name}', ${value})`; - } - - // if this is a reactive declaration, invalidate dependencies recursively - const deps = new Set([name]); - - deps.forEach(name => { - const reactive_declarations = this.reactive_declarations.filter(x => - x.assignees.has(name) - ); - reactive_declarations.forEach(declaration => { - declaration.dependencies.forEach(name => { - deps.add(name); - }); - }); - }); - - return Array.from(deps) - .map(n => x`$$invalidate('${n}', ${n})`) - .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); + invalidate(_name, _value?) { + throw new Error(`invalidate method now belongs to Renderer`); } rewrite_props(get_insert: (variable: Var) => Node[]) { @@ -1325,23 +1285,8 @@ export default class Component { }); } - qualify(name) { - if (name === `$$props`) return x`#ctx.$$props`; - - let [head, ...tail] = name.split('.'); - - const variable = this.var_lookup.get(head); - - if (variable) { - this.add_reference(name); // TODO we can probably remove most other occurrences of this - - if (!variable.hoistable) { - tail.unshift(head); - head = '#ctx'; - } - } - - return [head, ...tail].reduce((lhs, rhs) => x`${lhs}.${rhs}`); + qualify(_name) { + throw new Error(`component.qualify is now renderer.reference`); } warn_if_undefined(name: string, node, template_scope: TemplateScope) { diff --git a/src/compiler/compile/nodes/Action.ts b/src/compiler/compile/nodes/Action.ts index 77b9e3c8461b..86aefa0cedac 100644 --- a/src/compiler/compile/nodes/Action.ts +++ b/src/compiler/compile/nodes/Action.ts @@ -14,7 +14,7 @@ export default class Action extends Node { component.warn_if_undefined(info.name, info, scope); this.name = info.name; - component.qualify(info.name); + component.add_reference(info.name.split('.')[0]); this.expression = info.expression ? new Expression(component, this, scope, info.expression) diff --git a/src/compiler/compile/nodes/Animation.ts b/src/compiler/compile/nodes/Animation.ts index ef48b4d745dc..10cc9364a02e 100644 --- a/src/compiler/compile/nodes/Animation.ts +++ b/src/compiler/compile/nodes/Animation.ts @@ -13,7 +13,7 @@ export default class Animation extends Node { component.warn_if_undefined(info.name, info, scope); this.name = info.name; - component.qualify(info.name); + component.add_reference(info.name.split('.')[0]); if (parent.animation) { component.error(this, { diff --git a/src/compiler/compile/nodes/Transition.ts b/src/compiler/compile/nodes/Transition.ts index ceb5880e647f..a680fde46e97 100644 --- a/src/compiler/compile/nodes/Transition.ts +++ b/src/compiler/compile/nodes/Transition.ts @@ -15,7 +15,7 @@ export default class Transition extends Node { component.warn_if_undefined(info.name, info, scope); this.name = info.name; - component.qualify(info.name); + component.add_reference(info.name.split('.')[0]); this.directive = info.intro && info.outro ? 'transition' : info.intro ? 'in' : 'out'; this.is_local = info.modifiers.includes('local'); diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index ad4a1bc24d88..5d8ee18c0f95 100644 --- a/src/compiler/compile/nodes/shared/Expression.ts +++ b/src/compiler/compile/nodes/shared/Expression.ts @@ -9,9 +9,9 @@ import TemplateScope from './TemplateScope'; import get_object from '../../utils/get_object'; import Block from '../../render_dom/Block'; import is_dynamic from '../../render_dom/wrappers/shared/is_dynamic'; -import { x, b, p } from 'code-red'; -import { invalidate } from '../../utils/invalidate'; -import { Node, FunctionExpression } from 'estree'; +import { x, b } from 'code-red'; +import { invalidate } from '../../render_dom/invalidate'; +import { Node, FunctionExpression, Identifier } from 'estree'; import { TemplateNode } from '../../../interfaces'; type Owner = Wrapper | TemplateNode; @@ -213,7 +213,9 @@ export default class Expression { component.add_reference(name); // TODO is this redundant/misplaced? } } else if (is_contextual(component, template_scope, name)) { - this.replace(x`#ctx.${node}`); + if (block) { // TODO not sure what's going on here — DOM only, maybe? + this.replace(block.renderer.reference(name)); + } } this.skip(); @@ -260,42 +262,37 @@ export default class Expression { // function can be hoisted inside the component init component.partly_hoisted.push(declaration); - this.replace(x`#ctx.${id}` as any); - - component.add_var({ - name: id.name, - internal: true, - referenced: true - }); + const i = block.renderer.add_to_context(id.name); + this.replace(x`#ctx[${i}]` as any); } else { // we need a combo block/init recipe - (node as FunctionExpression).params.unshift({ - type: 'ObjectPattern', - properties: Array.from(contextual_dependencies).map(name => p`${name}` as any) - }); + const deps = Array.from(contextual_dependencies); + + (node as FunctionExpression).params = [ + ...deps.map(name => ({ type: 'Identifier', name } as Identifier)), + ...(node as FunctionExpression).params + ]; + + const context_args = deps.map(name => block.renderer.reference(name)); component.partly_hoisted.push(declaration); - this.replace(id as any); + const i = block.renderer.add_to_context(id.name); - component.add_var({ - name: id.name, - internal: true, - referenced: true - }); + this.replace(id as any); if ((node as FunctionExpression).params.length > 0) { declarations.push(b` function ${id}(...args) { - return #ctx.${id}(#ctx, ...args); + return #ctx[${i}](${context_args}, ...args); } `); } else { declarations.push(b` function ${id}() { - return #ctx.${id}(#ctx); + return #ctx[${i}](${context_args}); } `); } @@ -329,7 +326,7 @@ export default class Expression { } }); - this.replace(invalidate(component, scope, node, traced)); + this.replace(invalidate(block.renderer, scope, node, traced)); } } }); diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts index 74822ef9bed0..01359b7c18da 100644 --- a/src/compiler/compile/render_dom/Block.ts +++ b/src/compiler/compile/render_dom/Block.ts @@ -302,7 +302,7 @@ export default class Block { properties.update = noop; } else { const ctx = this.maintain_context ? x`#new_ctx` : x`#ctx`; - properties.update = x`function #update(#changed, ${ctx}) { + properties.update = x`function #update(${ctx}, #changed) { ${this.maintain_context && b`#ctx = ${ctx};`} ${this.chunks.update} }`; diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 624886c2c722..40c2d9234ee7 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -9,6 +9,8 @@ export default class Renderer { component: Component; // TODO Maybe Renderer shouldn't know about Component? options: CompileOptions; + context: string[] = []; + context_lookup: Map = new Map(); blocks: Array = []; readonly: Set = new Set(); meta_bindings: Array = []; // initial values for e.g. window.innerWidth, if there's a meta tag @@ -27,6 +29,11 @@ export default class Renderer { this.file_var = options.dev && this.component.get_unique_name('file'); + // TODO sort vars, most frequently referenced first? + component.vars + .filter(v => ((v.referenced || v.export_name) && !v.hoistable)) + .forEach(v => this.add_to_context(v.name)); + // main block this.block = new Block({ renderer: this, @@ -61,4 +68,93 @@ export default class Renderer { this.fragment.render(this.block, null, x`#nodes` as Identifier); } + + add_to_context(name: string, contextual = false) { + if (!this.context_lookup.has(name)) { + const i = this.context.length; + + this.context_lookup.set(name, i); + this.context.push(contextual ? null : name); + } + + return this.context_lookup.get(name); + } + + invalidate(name: string, value?) { + const variable = this.component.var_lookup.get(name); + const i = this.context_lookup.get(name); + + if (variable && (variable.subscribable && (variable.reassigned || variable.export_name))) { + return x`${`$$subscribe_${name}`}($$invalidate(${i}, ${value || name}))`; + } + + if (name[0] === '$' && name[1] !== '$') { + return x`${name.slice(1)}.set(${value || name})`; + } + + if ( + variable && + !variable.referenced && + !variable.is_reactive_dependency && + !variable.export_name && + !name.startsWith('$$') + ) { + return value || name; + } + + if (value) { + return x`$$invalidate(${i}, ${value})`; + } + + // if this is a reactive declaration, invalidate dependencies recursively + const deps = new Set([name]); + + deps.forEach(name => { + const reactive_declarations = this.component.reactive_declarations.filter(x => + x.assignees.has(name) + ); + reactive_declarations.forEach(declaration => { + declaration.dependencies.forEach(name => { + deps.add(name); + }); + }); + }); + + return Array.from(deps) + .map(n => x`$$invalidate(${i}, ${n})`) + .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); + } + + changed(names) { + const bitmask = names.reduce((bits, name) => { + const bit = 1 << this.context_lookup.get(name); + return bits | bit; + }, 0); + + return x`#changed & ${bitmask}`; + } + + reference(name) { + const i = this.context_lookup.get(name); + + if (name === `$$props`) return x`#ctx[${i}]`; + + let [head, ...tail] = name.split('.'); + + const variable = this.component.var_lookup.get(head); + + // TODO this feels woolly. might encounter false positive + // if each context shadows top-level var + if (variable) { + this.component.add_reference(name); // TODO we can probably remove most other occurrences of this + + if (!variable.hoistable) { + head = x`#ctx[${i}]`; + } + } else { + head = x`#ctx[${i}]`; + } + + return [head, ...tail].reduce((lhs, rhs) => x`${lhs}.${rhs}`); + } } diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index cc0c7dfe315d..18f21e276a98 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -5,9 +5,9 @@ import { CompileOptions } from '../../interfaces'; import { walk } from 'estree-walker'; import add_to_set from '../utils/add_to_set'; import { extract_names } from '../utils/scope'; -import { invalidate } from '../utils/invalidate'; +import { invalidate } from './invalidate'; import Block from './Block'; -import { ClassDeclaration, FunctionExpression, Node, Statement, ObjectExpression } from 'estree'; +import { ClassDeclaration, FunctionExpression, Node, Statement, ObjectExpression, Expression } from 'estree'; export default function dom( component: Component, @@ -80,12 +80,12 @@ export default function dom( const set = (uses_props || writable_props.length > 0 || component.slots.size > 0) ? x` ${$$props} => { - ${uses_props && component.invalidate('$$props', x`$$props = @assign(@assign({}, $$props), $$new_props)`)} + ${uses_props && renderer.invalidate('$$props', x`$$props = @assign(@assign({}, $$props), $$new_props)`)} ${writable_props.map(prop => - b`if ('${prop.export_name}' in ${$$props}) ${component.invalidate(prop.name, x`${prop.name} = ${$$props}.${prop.export_name}`)};` + b`if ('${prop.export_name}' in ${$$props}) ${renderer.invalidate(prop.name, x`${prop.name} = ${$$props}.${prop.export_name}`)};` )} ${component.slots.size > 0 && - b`if ('$$scope' in ${$$props}) ${component.invalidate('$$scope', x`$$scope = ${$$props}.$$scope`)};`} + b`if ('$$scope' in ${$$props}) ${renderer.invalidate('$$scope', x`$$scope = ${$$props}.$$scope`)};`} } ` : null; @@ -105,7 +105,7 @@ export default function dom( kind: 'get', key: { type: 'Identifier', name: prop.export_name }, value: x`function() { - return ${prop.hoistable ? prop.name : x`this.$$.ctx.${prop.name}`} + return ${prop.hoistable ? prop.name : x`this.$$.ctx[${renderer.context_lookup.get(prop.name)}]`} }` }); } else if (component.compile_options.dev) { @@ -180,9 +180,9 @@ export default function dom( const writable_vars = component.vars.filter(variable => !variable.module && variable.writable); inject_state = (uses_props || writable_vars.length > 0) ? x` ${$$props} => { - ${uses_props && component.invalidate('$$props', x`$$props = @assign(@assign({}, $$props), $$new_props)`)} + ${uses_props && renderer.invalidate('$$props', x`$$props = @assign(@assign({}, $$props), $$new_props)`)} ${writable_vars.map(prop => b` - if ('${prop.name}' in $$props) ${component.invalidate(prop.name, x`${prop.name} = ${$$props}.${prop.name}`)}; + if ('${prop.name}' in $$props) ${renderer.invalidate(prop.name, x`${prop.name} = ${$$props}.${prop.name}`)}; `)} } ` : x` @@ -216,17 +216,18 @@ export default function dom( // onto the initial function call const names = new Set(extract_names(assignee)); - this.replace(invalidate(component, scope, node, names)); + this.replace(invalidate(renderer, scope, node, names)); } } }); component.rewrite_props(({ name, reassigned, export_name }) => { const value = `$${name}`; + const i = renderer.context_lookup.get(name); const insert = (reassigned || export_name) ? b`${`$$subscribe_${name}`}()` - : b`@component_subscribe($$self, ${name}, #value => $$invalidate('${value}', ${value} = #value))`; + : b`@component_subscribe($$self, ${name}, #value => $$invalidate(${i}, ${value} = #value))`; if (component.compile_options.dev) { return b`@validate_store(${name}, '${name}'); ${insert}`; @@ -256,11 +257,13 @@ export default function dom( ${component.fully_hoisted} `); - const filtered_declarations = component.vars - .filter(v => ((v.referenced || v.export_name) && !v.hoistable)) - .map(v => p`${v.name}`); + const filtered_declarations = renderer.context + .map(name => name ? ({ + type: 'Identifier', + name + }) as Expression : x`null`); - if (uses_props) filtered_declarations.push(p`$$props: $$props = @exclude_internal_props($$props)`); + if (uses_props) filtered_declarations.push(x`$$props = @exclude_internal_props($$props)`); const filtered_props = props.filter(prop => { const variable = component.var_lookup.get(prop.name); @@ -273,11 +276,11 @@ export default function dom( const reactive_stores = component.vars.filter(variable => variable.name[0] === '$' && variable.name[1] !== '$'); if (component.slots.size > 0) { - filtered_declarations.push(p`$$slots`, p`$$scope`); + filtered_declarations.push(x`$$slots`, x`$$scope`); } if (renderer.binding_groups.length > 0) { - filtered_declarations.push(p`$$binding_groups`); + filtered_declarations.push(x`$$binding_groups`); } const instance_javascript = component.extract_javascript(component.ast.instance); @@ -307,7 +310,7 @@ export default function dom( }) .map(({ name }) => b` ${component.compile_options.dev && b`@validate_store(${name.slice(1)}, '${name.slice(1)}');`} - @component_subscribe($$self, ${name.slice(1)}, $$value => $$invalidate('${name}', ${name} = $$value)); + @component_subscribe($$self, ${name.slice(1)}, $$value => $$invalidate(${renderer.context_lookup.get(name)}, ${name} = $$value)); `); const resubscribable_reactive_store_unsubscribers = reactive_stores @@ -330,9 +333,7 @@ export default function dom( return variable && (variable.writable || variable.mutated); }); - const condition = !uses_props && writable.length > 0 && (writable - .map(n => x`#changed.${n}`) - .reduce((lhs, rhs) => x`${lhs} || ${rhs}`)); + const condition = !uses_props && writable.length > 0 && renderer.changed(writable); let statement = d.node; // TODO remove label (use d.node.body) if it's not referenced @@ -358,7 +359,9 @@ export default function dom( if (store && (store.reassigned || store.export_name)) { const unsubscribe = `$$unsubscribe_${name}`; const subscribe = `$$subscribe_${name}`; - return b`let ${$name}, ${unsubscribe} = @noop, ${subscribe} = () => (${unsubscribe}(), ${unsubscribe} = @subscribe(${name}, $$value => $$invalidate('${$name}', ${$name} = $$value)), ${name})`; + const i = renderer.context_lookup.get($name); + + return b`let ${$name}, ${unsubscribe} = @noop, ${subscribe} = () => (${unsubscribe}(), ${unsubscribe} = @subscribe(${name}, $$value => $$invalidate(${i}, ${$name} = $$value)), ${name})`; } return b`let ${$name};`; @@ -375,8 +378,8 @@ export default function dom( } const return_value = { - type: 'ObjectExpression', - properties: filtered_declarations + type: 'ArrayExpression', + elements: filtered_declarations }; const reactive_dependencies = { diff --git a/src/compiler/compile/utils/invalidate.ts b/src/compiler/compile/render_dom/invalidate.ts similarity index 73% rename from src/compiler/compile/utils/invalidate.ts rename to src/compiler/compile/render_dom/invalidate.ts index f386991d0438..d51d7fe78763 100644 --- a/src/compiler/compile/utils/invalidate.ts +++ b/src/compiler/compile/render_dom/invalidate.ts @@ -1,10 +1,12 @@ -import Component from '../Component'; import { nodes_match } from '../../utils/nodes_match'; -import { Scope } from './scope'; +import { Scope } from '../utils/scope'; import { x } from 'code-red'; import { Node } from 'estree'; +import Renderer from './Renderer'; + +export function invalidate(renderer: Renderer, scope: Scope, node: Node, names: Set) { + const { component } = renderer; -export function invalidate(component: Component, scope: Scope, node: Node, names: Set) { const [head, ...tail] = Array.from(names).filter(name => { const owner = scope.find_owner(name); if (owner && owner !== component.instance_scope) return false; @@ -28,12 +30,12 @@ export function invalidate(component: Component, scope: Scope, node: Node, names component.has_reactive_assignments = true; if (node.type === 'AssignmentExpression' && node.operator === '=' && nodes_match(node.left, node.right) && tail.length === 0) { - return component.invalidate(head); + return renderer.invalidate(head); } else { const is_store_value = head[0] === '$'; const variable = component.var_lookup.get(head); - const extra_args = tail.map(name => component.invalidate(name)); + const extra_args = tail.map(name => renderer.invalidate(name)); const pass_value = ( extra_args.length > 0 || @@ -48,8 +50,9 @@ export function invalidate(component: Component, scope: Scope, node: Node, names }); } - const callee = is_store_value ? `@set_store_value` : `$$invalidate`; - let invalidate = x`${callee}(${is_store_value ? head.slice(1) : x`"${head}"`}, ${node}, ${extra_args})`; + let invalidate = is_store_value + ? x`@set_store_value(${head.slice(1)}, ${node}, ${extra_args})` + : x`$$invalidate(${renderer.context_lookup.get(head)}, ${node}, ${extra_args})`; if (variable.subscribable && variable.reassigned) { const subscribe = `$$subscribe_${head}`; diff --git a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts index d20d8f6f949f..e6dac09a1157 100644 --- a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts @@ -8,7 +8,6 @@ import FragmentWrapper from './Fragment'; import PendingBlock from '../../nodes/PendingBlock'; import ThenBlock from '../../nodes/ThenBlock'; import CatchBlock from '../../nodes/CatchBlock'; -import { changed } from './shared/changed'; import { Identifier } from 'estree'; class AwaitBlockBranch extends Wrapper { @@ -187,7 +186,7 @@ export default class AwaitBlockWrapper extends Wrapper { if (dependencies.length > 0) { const condition = x` - ${changed(dependencies)} && + ${block.renderer.changed(dependencies)} && ${promise} !== (${promise} = ${snippet}) && @handle_promise(${promise}, ${info})`; @@ -200,7 +199,7 @@ export default class AwaitBlockWrapper extends Wrapper { if (${condition}) { // nothing } else { - ${info}.block.p(#changed, @assign(@assign({}, #ctx), ${info}.resolved)); + ${info}.block.p(@assign(@assign({}, #ctx), ${info}.resolved), #changed); } `); } else { @@ -211,7 +210,7 @@ export default class AwaitBlockWrapper extends Wrapper { } else { if (this.pending.block.has_update_method) { block.chunks.update.push(b` - ${info}.block.p(#changed, @assign(@assign({}, #ctx), ${info}.resolved)); + ${info}.block.p(@assign(@assign({}, #ctx), ${info}.resolved), #changed); `); } } diff --git a/src/compiler/compile/render_dom/wrappers/DebugTag.ts b/src/compiler/compile/render_dom/wrappers/DebugTag.ts index dc3a2f2857c6..4e8fe1e07db6 100644 --- a/src/compiler/compile/render_dom/wrappers/DebugTag.ts +++ b/src/compiler/compile/render_dom/wrappers/DebugTag.ts @@ -5,7 +5,6 @@ import DebugTag from '../../nodes/DebugTag'; import add_to_set from '../../utils/add_to_set'; import { b, p } from 'code-red'; import { Identifier, DebuggerStatement } from 'estree'; -import { changed } from './shared/changed'; export default class DebugTagWrapper extends Wrapper { node: DebugTag; @@ -70,7 +69,7 @@ export default class DebugTagWrapper extends Wrapper { debugger;`; if (dependencies.size) { - const condition = changed(Array.from(dependencies)); + const condition = renderer.changed(Array.from(dependencies)); block.chunks.update.push(b` if (${condition}) { diff --git a/src/compiler/compile/render_dom/wrappers/EachBlock.ts b/src/compiler/compile/render_dom/wrappers/EachBlock.ts index 33b4a9cbd55b..244e879e81c1 100644 --- a/src/compiler/compile/render_dom/wrappers/EachBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/EachBlock.ts @@ -7,7 +7,6 @@ import FragmentWrapper from './Fragment'; import { b, x } from 'code-red'; import ElseBlock from '../../nodes/ElseBlock'; import { Identifier, Node } from 'estree'; -import { changed } from './shared/changed'; export class ElseBlockWrapper extends Wrapper { node: ElseBlock; @@ -81,6 +80,10 @@ export default class EachBlockWrapper extends Wrapper { const { dependencies } = node.expression; block.add_dependencies(dependencies); + this.node.contexts.forEach(context => { + renderer.add_to_context(context.key.name, true); + }); + this.block = block.child({ comment: create_debugging_comment(this.node, this.renderer.component), name: renderer.component.get_unique_name('create_each_block'), @@ -119,6 +122,9 @@ export default class EachBlockWrapper extends Wrapper { const each_block_value = renderer.component.get_unique_name(`${this.var.name}_value`); const iterations = block.get_unique_name(`${this.var.name}_blocks`); + renderer.add_to_context(each_block_value.name, true); + renderer.add_to_context(this.index_name.name, true); + this.vars = { create_each_block: this.block.name, each_block_value, @@ -190,18 +196,19 @@ export default class EachBlockWrapper extends Wrapper { ? !this.next.is_dom_node() : !parent_node || !this.parent.is_dom_node(); - this.context_props = this.node.contexts.map(prop => b`child_ctx.${prop.key.name} = ${prop.modifier(x`list[i]`)};`); + this.context_props = this.node.contexts.map(prop => b`child_ctx[${renderer.context_lookup.get(prop.key.name)}] = ${prop.modifier(x`list[i]`)};`); - if (this.node.has_binding) this.context_props.push(b`child_ctx.${this.vars.each_block_value} = list;`); - if (this.node.has_binding || this.node.index) this.context_props.push(b`child_ctx.${this.index_name} = i;`); + if (this.node.has_binding) this.context_props.push(b`child_ctx[${renderer.context_lookup.get(this.vars.each_block_value.name)}] = list;`); + if (this.node.has_binding || this.node.index) this.context_props.push(b`child_ctx[${renderer.context_lookup.get(this.index_name.name)}] = i;`); const snippet = this.node.expression.manipulate(block); block.chunks.init.push(b`let ${this.vars.each_block_value} = ${snippet};`); + // TODO which is better — Object.create(array) or array.slice()? renderer.blocks.push(b` function ${this.vars.get_each_context}(#ctx, list, i) { - const child_ctx = @_Object.create(#ctx); + const child_ctx = #ctx.slice(); ${this.context_props} return child_ctx; } @@ -270,7 +277,7 @@ export default class EachBlockWrapper extends Wrapper { if (this.else.block.has_update_method) { block.chunks.update.push(b` if (!${this.vars.data_length} && ${each_block_else}) { - ${each_block_else}.p(#changed, #ctx); + ${each_block_else}.p(#ctx, #changed); } else if (!${this.vars.data_length}) { ${each_block_else} = ${this.else.block.name}(#ctx); ${each_block_else}.c(); @@ -481,7 +488,7 @@ export default class EachBlockWrapper extends Wrapper { const for_loop_body = this.block.has_update_method ? b` if (${iterations}[#i]) { - ${iterations}[#i].p(#changed, child_ctx); + ${iterations}[#i].p(child_ctx, #changed); ${has_transitions && b`@transition_in(${this.vars.iterations}[#i], 1);`} } else { ${iterations}[#i] = ${create_each_block}(child_ctx); @@ -554,7 +561,7 @@ export default class EachBlockWrapper extends Wrapper { `; block.chunks.update.push(b` - if (${changed(Array.from(all_dependencies))}) { + if (${block.renderer.changed(Array.from(all_dependencies))}) { ${update} } `); diff --git a/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts b/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts index db3cf7a66251..eb9dfe8e4711 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts @@ -6,7 +6,6 @@ import { string_literal } from '../../../utils/stringify'; import { b, x } from 'code-red'; import Expression from '../../../nodes/shared/Expression'; import Text from '../../../nodes/Text'; -import { changed } from '../shared/changed'; export default class AttributeWrapper { node: Attribute; @@ -140,7 +139,7 @@ export default class AttributeWrapper { } if (dependencies.length > 0) { - let condition = changed(dependencies); + let condition = block.renderer.changed(dependencies); if (should_cache) { condition = is_src @@ -197,8 +196,8 @@ export default class AttributeWrapper { } let value = this.node.name === 'class' - ? this.get_class_name_text() - : this.render_chunks().reduce((lhs, rhs) => x`${lhs} + ${rhs}`); + ? this.get_class_name_text(block) + : this.render_chunks(block).reduce((lhs, rhs) => x`${lhs} + ${rhs}`); // '{foo} {bar}' — treat as string concatenation if (this.node.chunks[0].type !== 'Text') { @@ -208,9 +207,9 @@ export default class AttributeWrapper { return value; } - get_class_name_text() { + get_class_name_text(block) { const scoped_css = this.node.chunks.some((chunk: Text) => chunk.synthetic); - const rendered = this.render_chunks(); + const rendered = this.render_chunks(block); if (scoped_css && rendered.length === 2) { // we have a situation like class={possiblyUndefined} @@ -220,13 +219,13 @@ export default class AttributeWrapper { return rendered.reduce((lhs, rhs) => x`${lhs} + ${rhs}`); } - render_chunks() { + render_chunks(block: Block) { return this.node.chunks.map((chunk) => { if (chunk.type === 'Text') { return string_literal(chunk.data); } - return chunk.manipulate(); + return chunk.manipulate(block); }); } diff --git a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts index 9618ad3c2cc0..50436f35887e 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts @@ -6,7 +6,6 @@ import Block from '../../Block'; import Renderer from '../../Renderer'; import flatten_reference from '../../../utils/flatten_reference'; import EachBlock from '../../../nodes/EachBlock'; -import { changed } from '../shared/changed'; import { Node, Identifier } from 'estree'; export default class BindingWrapper { @@ -91,7 +90,7 @@ export default class BindingWrapper { const dependency_array = [...this.node.expression.dependencies]; if (dependency_array.length > 0) { - update_conditions.push(changed(dependency_array)); + update_conditions.push(block.renderer.changed(dependency_array)); } if (parent.node.name === 'input') { diff --git a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts index 37089e74932d..d76b4ce54d4c 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts @@ -15,6 +15,7 @@ export default class EventHandlerWrapper { this.parent = parent; if (!node.expression) { + // TODO use renderer.add_to_context this.parent.renderer.component.add_var({ name: node.handler_name.name, internal: true, @@ -22,10 +23,10 @@ export default class EventHandlerWrapper { }); this.parent.renderer.component.partly_hoisted.push(b` - function ${node.handler_name.name}(event) { - @bubble($$self, event); - } - `); + function ${node.handler_name.name}(event) { + @bubble($$self, event); + } + `); } } @@ -45,7 +46,7 @@ export default class EventHandlerWrapper { if (this.node.modifiers.has('preventDefault')) snippet = x`@prevent_default(${snippet})`; if (this.node.modifiers.has('stopPropagation')) snippet = x`@stop_propagation(${snippet})`; if (this.node.modifiers.has('self')) snippet = x`@self(${snippet})`; - + const args = []; const opts = ['passive', 'once', 'capture'].filter(mod => this.node.modifiers.has(mod)); diff --git a/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts b/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts index c60a89f66f03..828df569658a 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts @@ -7,7 +7,6 @@ import { string_literal } from '../../../utils/stringify'; import add_to_set from '../../../utils/add_to_set'; import Expression from '../../../nodes/shared/Expression'; import Text from '../../../nodes/Text'; -import { changed } from '../shared/changed'; export interface StyleProp { key: string; @@ -46,7 +45,7 @@ export default class StyleAttributeWrapper extends AttributeWrapper { // } if (prop_dependencies.size) { - let condition = changed(Array.from(prop_dependencies)); + let condition = block.renderer.changed(Array.from(prop_dependencies)); if (block.has_outros) { condition = x`!#current || ${condition}`; diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index 0c3b05a6bf16..a0859cfced83 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -21,7 +21,6 @@ import add_actions from '../shared/add_actions'; import create_debugging_comment from '../shared/create_debugging_comment'; import { get_context_merger } from '../shared/get_context_merger'; import bind_this from '../shared/bind_this'; -import { changed } from '../shared/changed'; import { is_head } from '../shared/is_head'; import { Identifier } from 'estree'; import EventHandler from './EventHandler'; @@ -282,7 +281,7 @@ export default class ElementWrapper extends Wrapper { const children = x`@children(${this.node.name === 'template' ? x`${node}.content` : node})`; block.add_variable(node); - const render_statement = this.get_render_statement(); + const render_statement = this.get_render_statement(block); block.chunks.create.push( b`${node} = ${render_statement};` ); @@ -398,7 +397,7 @@ export default class ElementWrapper extends Wrapper { return this.is_static_content && this.fragment.nodes.every(node => node.node.type === 'Text' || node.node.type === 'MustacheTag'); } - get_render_statement() { + get_render_statement(block: Block) { const { name, namespace } = this.node; if (namespace === 'http://www.w3.org/2000/svg') { @@ -411,7 +410,7 @@ export default class ElementWrapper extends Wrapper { const is = this.attributes.find(attr => attr.node.name === 'is'); if (is) { - return x`@element_is("${name}", ${is.render_chunks().reduce((lhs, rhs) => x`${lhs} + ${rhs}`)});`; + return x`@element_is("${name}", ${is.render_chunks(block).reduce((lhs, rhs) => x`${lhs} + ${rhs}`)});`; } return x`@element("${name}")`; @@ -455,18 +454,13 @@ export default class ElementWrapper extends Wrapper { groups.forEach(group => { const handler = renderer.component.get_unique_name(`${this.var.name}_${group.events.join('_')}_handler`); - - renderer.component.add_var({ - name: handler.name, - internal: true, - referenced: true - }); + const i = renderer.add_to_context(handler.name); // TODO figure out how to handle locks const needs_lock = group.bindings.some(binding => binding.needs_lock); - const dependencies = new Set(); - const contextual_dependencies = new Set(); + const dependencies: Set = new Set(); + const contextual_dependencies: Set = new Set(); group.bindings.forEach(binding => { // TODO this is a mess @@ -501,21 +495,21 @@ export default class ElementWrapper extends Wrapper { ${animation_frame} = @raf(${handler}); ${needs_lock && b`${lock} = true;`} } - #ctx.${handler}.call(${this.var}, ${contextual_dependencies.size > 0 ? '#ctx' : null}); + #ctx[${i}].call(${this.var}, ${contextual_dependencies.size > 0 ? '#ctx' : null}); } `); } else { block.chunks.init.push(b` function ${handler}() { ${needs_lock && b`${lock} = true;`} - #ctx.${handler}.call(${this.var}, ${contextual_dependencies.size > 0 ? '#ctx' : null}); + #ctx[${i}].call(${this.var}, ${contextual_dependencies.size > 0 ? '#ctx' : null}); } `); } callee = handler; } else { - callee = x`#ctx.${handler}`; + callee = x`#ctx[${i}]`; } const arg = contextual_dependencies.size > 0 && { @@ -537,7 +531,7 @@ export default class ElementWrapper extends Wrapper { ${Array.from(dependencies) .filter(dep => dep[0] !== '$') .filter(dep => !contextual_dependencies.has(dep)) - .map(dep => b`${this.renderer.component.invalidate(dep)};`)} + .map(dep => b`${this.renderer.invalidate(dep)};`)} } `); @@ -632,7 +626,7 @@ export default class ElementWrapper extends Wrapper { this.attributes .forEach(attr => { const condition = attr.node.dependencies.size > 0 - ? changed(Array.from(attr.node.dependencies)) + ? block.renderer.changed(Array.from(attr.node.dependencies)) : null; if (attr.node.is_spread) { @@ -685,8 +679,6 @@ export default class ElementWrapper extends Wrapper { const { intro, outro } = this.node; if (!intro && !outro) return; - const { component } = this.renderer; - if (intro === outro) { // bidirectional transition const name = block.get_unique_name(`${this.var.name}_transition`); @@ -696,7 +688,7 @@ export default class ElementWrapper extends Wrapper { block.add_variable(name); - const fn = component.qualify(intro.name); + const fn = this.renderer.reference(intro.name); const intro_block = b` @add_render_callback(() => { @@ -740,7 +732,7 @@ export default class ElementWrapper extends Wrapper { ? intro.expression.manipulate(block) : x`{}`; - const fn = component.qualify(intro.name); + const fn = this.renderer.reference(intro.name); let intro_block; @@ -782,7 +774,7 @@ export default class ElementWrapper extends Wrapper { ? outro.expression.manipulate(block) : x`{}`; - const fn = component.qualify(outro.name); + const fn = this.renderer.reference(outro.name); if (!intro) { block.chunks.intro.push(b` @@ -814,7 +806,6 @@ export default class ElementWrapper extends Wrapper { add_animation(block: Block) { if (!this.node.animation) return; - const { component } = this.renderer; const { outro } = this.node; const rect = block.get_unique_name('rect'); @@ -835,7 +826,7 @@ export default class ElementWrapper extends Wrapper { const params = this.node.animation.expression ? this.node.animation.expression.manipulate(block) : x`{}`; - const name = component.qualify(this.node.animation.name); + const name = this.renderer.reference(this.node.animation.name); block.chunks.animate.push(b` ${stop_animation}(); @@ -844,7 +835,7 @@ export default class ElementWrapper extends Wrapper { } add_actions(block: Block) { - add_actions(this.renderer.component, block, this.var, this.node.actions); + add_actions(block, this.var, this.node.actions); } add_classes(block: Block) { @@ -868,7 +859,7 @@ export default class ElementWrapper extends Wrapper { block.chunks.update.push(updater); } else if ((dependencies && dependencies.size > 0) || this.class_dependencies.length) { const all_dependencies = this.class_dependencies.concat(...dependencies); - const condition = changed(all_dependencies); + const condition = block.renderer.changed(all_dependencies); block.chunks.update.push(b` if (${condition}) { diff --git a/src/compiler/compile/render_dom/wrappers/IfBlock.ts b/src/compiler/compile/render_dom/wrappers/IfBlock.ts index 6ef505cd3bd9..4d61aa006d41 100644 --- a/src/compiler/compile/render_dom/wrappers/IfBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/IfBlock.ts @@ -10,7 +10,6 @@ import { b, x } from 'code-red'; import { walk } from 'estree-walker'; import { is_head } from './shared/is_head'; import { Identifier, Node } from 'estree'; -import { changed } from './shared/changed'; function is_else_if(node: ElseBlock) { return ( @@ -272,7 +271,7 @@ export default class IfBlockWrapper extends Wrapper { ? b` ${snippet && ( dependencies.length > 0 - ? b`if (${condition} == null || ${changed(dependencies)}) ${condition} = !!${snippet}` + ? b`if (${condition} == null || ${block.renderer.changed(dependencies)}) ${condition} = !!${snippet}` : b`if (${condition} == null) ${condition} = !!${snippet}` )} if (${condition}) return ${block.name};` @@ -323,21 +322,21 @@ export default class IfBlockWrapper extends Wrapper { if (dynamic) { block.chunks.update.push(b` - if (${current_block_type} === (${current_block_type} = ${select_block_type}(#changed, #ctx)) && ${name}) { - ${name}.p(#changed, #ctx); + if (${current_block_type} === (${current_block_type} = ${select_block_type}(#ctx, #changed)) && ${name}) { + ${name}.p(#ctx, #changed); } else { ${change_block} } `); } else { block.chunks.update.push(b` - if (${current_block_type} !== (${current_block_type} = ${select_block_type}(#changed, #ctx))) { + if (${current_block_type} !== (${current_block_type} = ${select_block_type}(#ctx, #changed))) { ${change_block} } `); } } else if (dynamic) { - block.chunks.update.push(b`${name}.p(#changed, #ctx);`); + block.chunks.update.push(b`${name}.p(#ctx, #changed);`); } if (if_exists_condition) { @@ -391,7 +390,7 @@ export default class IfBlockWrapper extends Wrapper { ? b` ${snippet && ( dependencies.length > 0 - ? b`if (${condition} == null || ${changed(dependencies)}) ${condition} = !!${snippet}` + ? b`if (${condition} == null || ${block.renderer.changed(dependencies)}) ${condition} = !!${snippet}` : b`if (${condition} == null) ${condition} = !!${snippet}` )} if (${condition}) return ${i};` @@ -476,7 +475,7 @@ export default class IfBlockWrapper extends Wrapper { let ${previous_block_index} = ${current_block_type_index}; ${current_block_type_index} = ${select_block_type}(#changed, #ctx); if (${current_block_type_index} === ${previous_block_index}) { - ${if_current_block_type_index(b`${if_blocks}[${current_block_type_index}].p(#changed, #ctx);`)} + ${if_current_block_type_index(b`${if_blocks}[${current_block_type_index}].p(#ctx, #changed);`)} } else { ${change_block} } @@ -491,7 +490,7 @@ export default class IfBlockWrapper extends Wrapper { `); } } else if (dynamic) { - block.chunks.update.push(b`${name}.p(#changed, #ctx);`); + block.chunks.update.push(b`${name}.p(#ctx, #changed);`); } block.chunks.destroy.push( @@ -528,7 +527,7 @@ export default class IfBlockWrapper extends Wrapper { const enter = dynamic ? b` if (${name}) { - ${name}.p(#changed, #ctx); + ${name}.p(#ctx, #changed); ${has_transitions && b`@transition_in(${name}, 1);`} } else { ${name} = ${branch.block.name}(#ctx); @@ -549,7 +548,7 @@ export default class IfBlockWrapper extends Wrapper { `; if (branch.snippet) { - block.chunks.update.push(b`if (${changed(branch.dependencies)}) ${branch.condition} = ${branch.snippet}`); + block.chunks.update.push(b`if (${block.renderer.changed(branch.dependencies)}) ${branch.condition} = ${branch.snippet}`); } // no `p()` here — we don't want to update outroing nodes, @@ -578,7 +577,7 @@ export default class IfBlockWrapper extends Wrapper { } } else if (dynamic) { block.chunks.update.push(b` - if (${branch.condition}) ${name}.p(#changed, #ctx); + if (${branch.condition}) ${name}.p(#ctx, #changed); `); } diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index cc02c171edad..bc6d32c524ca 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -14,7 +14,6 @@ import EachBlock from '../../../nodes/EachBlock'; import TemplateScope from '../../../nodes/shared/TemplateScope'; import is_dynamic from '../shared/is_dynamic'; import bind_this from '../shared/bind_this'; -import { changed } from '../shared/changed'; import { Node, Identifier, ObjectExpression } from 'estree'; import EventHandler from '../Element/EventHandler'; @@ -206,7 +205,7 @@ export default class InlineComponentWrapper extends Wrapper { const { name, dependencies } = attr; const condition = dependencies.size > 0 && (dependencies.size !== all_dependencies.size) - ? changed(Array.from(dependencies)) + ? renderer.changed(Array.from(dependencies)) : null; if (attr.is_spread) { @@ -239,7 +238,7 @@ export default class InlineComponentWrapper extends Wrapper { `); if (all_dependencies.size) { - const condition = changed(Array.from(all_dependencies)); + const condition = renderer.changed(Array.from(all_dependencies)); updates.push(b` const ${name_changes} = ${condition} ? @get_spread_update(${levels}, [ @@ -255,7 +254,7 @@ export default class InlineComponentWrapper extends Wrapper { dynamic_attributes.forEach((attribute: Attribute) => { const dependencies = attribute.get_dependencies(); if (dependencies.length > 0) { - const condition = changed(dependencies); + const condition = renderer.changed(dependencies); updates.push(b` if (${condition}) ${name_changes}.${attribute.name} = ${attribute.get_value(block)}; @@ -267,7 +266,7 @@ export default class InlineComponentWrapper extends Wrapper { if (non_let_dependencies.length > 0) { updates.push(b` - if (${changed(non_let_dependencies)}) { + if (${renderer.changed(non_let_dependencies)}) { ${name_changes}.$$scope = { changed: #changed, ctx: #ctx }; }`); } @@ -280,12 +279,7 @@ export default class InlineComponentWrapper extends Wrapper { } const id = component.get_unique_name(`${this.var.name}_${binding.name}_binding`); - - component.add_var({ - name: id.name, - internal: true, - referenced: true - }); + const i = renderer.add_to_context(id.name); const updating = block.get_unique_name(`updating_${binding.name}`); block.add_variable(updating); @@ -299,7 +293,7 @@ export default class InlineComponentWrapper extends Wrapper { ); updates.push(b` - if (!${updating} && ${changed(Array.from(binding.expression.dependencies))}) { + if (!${updating} && ${renderer.changed(Array.from(binding.expression.dependencies))}) { ${updating} = true; ${name_changes}.${binding.name} = ${snippet}; @add_flush_callback(() => ${updating} = false); @@ -338,7 +332,7 @@ export default class InlineComponentWrapper extends Wrapper { block.chunks.init.push(b` function ${id}(${value}) { - #ctx.${id}.call(null, ${value}, #ctx); + #ctx[${i}].call(null, ${value}, #ctx); } `); @@ -346,7 +340,7 @@ export default class InlineComponentWrapper extends Wrapper { } else { block.chunks.init.push(b` function ${id}(${value}) { - #ctx.${id}.call(null, ${value}); + #ctx[${i}].call(null, ${value}); } `); } @@ -354,7 +348,7 @@ export default class InlineComponentWrapper extends Wrapper { const body = b` function ${id}(${args}) { ${lhs} = ${value}; - ${component.invalidate(dependencies[0])}; + ${renderer.invalidate(dependencies[0])}; } `; @@ -460,7 +454,7 @@ export default class InlineComponentWrapper extends Wrapper { } else { const expression = this.node.name === 'svelte:self' ? component.name - : component.qualify(this.node.name); + : this.renderer.reference(this.node.name); block.chunks.init.push(b` ${(this.node.attributes.length > 0 || this.node.bindings.length > 0) && b` diff --git a/src/compiler/compile/render_dom/wrappers/Slot.ts b/src/compiler/compile/render_dom/wrappers/Slot.ts index 4d575d21d305..95680107328b 100644 --- a/src/compiler/compile/render_dom/wrappers/Slot.ts +++ b/src/compiler/compile/render_dom/wrappers/Slot.ts @@ -10,7 +10,6 @@ import get_slot_data from '../../utils/get_slot_data'; import Expression from '../../nodes/shared/Expression'; import is_dynamic from './shared/is_dynamic'; import { Identifier, ObjectExpression } from 'estree'; -import { changed } from './shared/changed'; export default class SlotWrapper extends Wrapper { node: Slot; @@ -184,10 +183,10 @@ export default class SlotWrapper extends Wrapper { }); block.chunks.update.push(b` - if (${slot} && ${slot}.p && ${changed(dynamic_dependencies)}) { + if (${slot} && ${slot}.p && ${renderer.changed(dynamic_dependencies)}) { ${slot}.p( - @get_slot_changes(${slot_definition}, #ctx, #changed, ${get_slot_changes}), - @get_slot_context(${slot_definition}, #ctx, ${get_slot_context}) + @get_slot_context(${slot_definition}, #ctx, ${get_slot_context}), + @get_slot_changes(${slot_definition}, #ctx, #changed, ${get_slot_changes}) ); } `); diff --git a/src/compiler/compile/render_dom/wrappers/Title.ts b/src/compiler/compile/render_dom/wrappers/Title.ts index 2a02f1bc0843..610575a47964 100644 --- a/src/compiler/compile/render_dom/wrappers/Title.ts +++ b/src/compiler/compile/render_dom/wrappers/Title.ts @@ -7,7 +7,6 @@ import { string_literal } from '../../utils/stringify'; import add_to_set from '../../utils/add_to_set'; import Text from '../../nodes/Text'; import { Identifier } from 'estree'; -import { changed } from './shared/changed'; import MustacheTag from '../../nodes/MustacheTag'; export default class TitleWrapper extends Wrapper { @@ -76,7 +75,7 @@ export default class TitleWrapper extends Wrapper { if (all_dependencies.size) { const dependencies = Array.from(all_dependencies); - let condition = changed(dependencies); + let condition = block.renderer.changed(dependencies); if (block.has_outros) { condition = x`!#current || ${condition}`; diff --git a/src/compiler/compile/render_dom/wrappers/Window.ts b/src/compiler/compile/render_dom/wrappers/Window.ts index 7594adee6747..d34af6582945 100644 --- a/src/compiler/compile/render_dom/wrappers/Window.ts +++ b/src/compiler/compile/render_dom/wrappers/Window.ts @@ -5,7 +5,6 @@ import { b, x } from 'code-red'; import add_event_handlers from './shared/add_event_handlers'; import Window from '../../nodes/Window'; import add_actions from './shared/add_actions'; -import { changed } from './shared/changed'; import { Identifier } from 'estree'; import { TemplateNode } from '../../../interfaces'; import EventHandler from './Element/EventHandler'; @@ -49,7 +48,7 @@ export default class WindowWrapper extends Wrapper { const events = {}; const bindings: Record = {}; - add_actions(component, block, '@_window', this.node.actions); + add_actions(block, '@_window', this.node.actions); add_event_handlers(block, '@_window', this.handlers); this.node.bindings.forEach(binding => { @@ -122,20 +121,16 @@ export default class WindowWrapper extends Wrapper { `); } - component.add_var({ - name: id.name, - internal: true, - referenced: true - }); + const i = renderer.add_to_context(id.name); component.partly_hoisted.push(b` function ${id}() { - ${props.map(prop => component.invalidate(prop.name, x`${prop.name} = @_window.${prop.value}`))} + ${props.map(prop => renderer.invalidate(prop.name, x`${prop.name} = @_window.${prop.value}`))} } `); block.chunks.init.push(b` - @add_render_callback(#ctx.${id}); + @add_render_callback(#ctx[${i}]); `); component.has_reactive_assignments = true; @@ -143,7 +138,7 @@ export default class WindowWrapper extends Wrapper { // special case... might need to abstract this out if we add more special cases if (bindings.scrollX || bindings.scrollY) { - const condition = changed([bindings.scrollX, bindings.scrollY].filter(Boolean)); + const condition = renderer.changed([bindings.scrollX, bindings.scrollY].filter(Boolean)); const scrollX = bindings.scrollX ? x`#ctx.${bindings.scrollX}` : x`@_window.pageXOffset`; const scrollY = bindings.scrollY ? x`#ctx.${bindings.scrollY}` : x`@_window.pageYOffset`; @@ -162,25 +157,21 @@ export default class WindowWrapper extends Wrapper { const id = block.get_unique_name(`onlinestatuschanged`); const name = bindings.online; - component.add_var({ - name: id.name, - internal: true, - referenced: true - }); + const i = renderer.add_to_context(id.name); component.partly_hoisted.push(b` function ${id}() { - ${component.invalidate(name, x`${name} = @_navigator.onLine`)} + ${renderer.invalidate(name, x`${name} = @_navigator.onLine`)} } `); block.chunks.init.push(b` - @add_render_callback(#ctx.${id}); + @add_render_callback(#ctx[${i}]); `); block.event_listeners.push( - x`@listen(@_window, "online", #ctx.${id})`, - x`@listen(@_window, "offline", #ctx.${id})` + x`@listen(@_window, "online", #ctx[${i}])`, + x`@listen(@_window, "offline", #ctx[${i}])` ); component.has_reactive_assignments = true; diff --git a/src/compiler/compile/render_dom/wrappers/shared/Tag.ts b/src/compiler/compile/render_dom/wrappers/shared/Tag.ts index ccb7c6ea40f4..e49bdc098263 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/Tag.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/Tag.ts @@ -5,7 +5,6 @@ import Block from '../../Block'; import MustacheTag from '../../../nodes/MustacheTag'; import RawMustacheTag from '../../../nodes/RawMustacheTag'; import { Node } from 'estree'; -import { changed } from './changed'; export default class Tag extends Wrapper { node: MustacheTag | RawMustacheTag; @@ -40,7 +39,7 @@ export default class Tag extends Wrapper { if (this.node.should_cache) block.add_variable(value, snippet); // TODO may need to coerce snippet to string if (dependencies.length > 0) { - let condition = changed(dependencies); + let condition = block.renderer.changed(dependencies); if (block.has_outros) { condition = x`!#current || ${condition}`; diff --git a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts index 538bfc7a9558..57453cb0f223 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts @@ -1,10 +1,8 @@ import { b, x } from 'code-red'; import Block from '../../Block'; import Action from '../../../nodes/Action'; -import Component from '../../../Component'; export default function add_actions( - component: Component, block: Block, target: string, actions: Action[] @@ -25,7 +23,7 @@ export default function add_actions( block.add_variable(id); - const fn = component.qualify(action.name); + const fn = block.renderer.reference(action.name); block.chunks.mount.push( b`${id} = ${fn}.call(null, ${target}, ${snippet}) || {};` @@ -34,14 +32,8 @@ export default function add_actions( if (dependencies && dependencies.length > 0) { let condition = x`@is_function(${id}.update)`; - // TODO can this case be handled more elegantly? if (dependencies.length > 0) { - let changed = x`#changed.${dependencies[0]}`; - for (let i = 1; i < dependencies.length; i += 1) { - changed = x`${changed} || #changed.${dependencies[i]}`; - } - - condition = x`${condition} && ${changed}`; + condition = x`${condition} && ${block.renderer.changed(dependencies)}`; } block.chunks.update.push( 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 504e20976364..646252259016 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts @@ -7,12 +7,7 @@ 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`); - - component.add_var({ - name: fn.name, - internal: true, - referenced: true - }); + const i = block.renderer.add_to_context(fn.name); let lhs; let object; @@ -32,11 +27,11 @@ export default function bind_this(component: Component, block: Block, binding: B body = binding.raw_expression.type === 'Identifier' ? b` - ${component.invalidate(object, x`${lhs} = $$value`)}; + ${block.renderer.invalidate(object, x`${lhs} = $$value`)}; ` : b` ${lhs} = $$value; - ${component.invalidate(object)}; + ${block.renderer.invalidate(object)}; `; } @@ -65,12 +60,12 @@ 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.${fn}(${variable}, ${args}); - const ${unassign} = () => #ctx.${fn}(null, ${args}); + const ${assign} = () => #ctx[${i}](${variable}, ${args}); + const ${unassign} = () => #ctx[${i}](null, ${args}); `); const condition = Array.from(contextual_dependencies) - .map(name => x`${name} !== #ctx.${name}`) + .map(name => x`${name} !== #ctx.${name}`) // TODO figure out contextual deps .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); // we push unassign and unshift assign so that references are @@ -96,6 +91,6 @@ export default function bind_this(component: Component, block: Block, binding: B } `); - block.chunks.destroy.push(b`#ctx.${fn}(null);`); - return b`#ctx.${fn}(${variable});`; + block.chunks.destroy.push(b`#ctx[${i}](null);`); + return b`#ctx[${i}](${variable});`; } \ No newline at end of file diff --git a/src/compiler/compile/render_dom/wrappers/shared/changed.ts b/src/compiler/compile/render_dom/wrappers/shared/changed.ts deleted file mode 100644 index b7dc12e53fbb..000000000000 --- a/src/compiler/compile/render_dom/wrappers/shared/changed.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { x } from 'code-red'; - -export function changed(dependencies: string[]) { - return dependencies - .map(d => x`#changed.${d}`) - .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); -} \ No newline at end of file diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index 0ce3b3209bb6..b035d958ed27 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -21,7 +21,7 @@ interface Fragment { } // eslint-disable-next-line @typescript-eslint/class-name-casing interface T$$ { - dirty: null; + dirty: number; ctx: null|any; bound: any; update: () => void; @@ -87,13 +87,13 @@ export function destroy_component(component, detaching) { } } -function make_dirty(component, key) { - if (!component.$$.dirty) { +function make_dirty(component, i) { + if (component.$$.dirty === -1) { dirty_components.push(component); schedule_update(); - component.$$.dirty = blank_object(); + component.$$.dirty = 0; } - component.$$.dirty[key] = true; + component.$$.dirty |= (1 << i); } export function init(component, options, instance, create_fragment, not_equal, props) { @@ -121,16 +121,16 @@ export function init(component, options, instance, create_fragment, not_equal, p // everything else callbacks: blank_object(), - dirty: null + dirty: -1 }; let ready = false; $$.ctx = instance - ? instance(component, prop_values, (key, ret, value = ret) => { - if ($$.ctx && not_equal($$.ctx[key], $$.ctx[key] = value)) { - if ($$.bound[key]) $$.bound[key](value); - if (ready) make_dirty(component, key); + ? instance(component, prop_values, (i, ret, value = ret) => { + if ($$.ctx && not_equal($$.ctx[i], $$.ctx[i] = value)) { + if ($$.bound[i]) $$.bound[i](value); + if (ready) make_dirty(component, i); } return ret; }) @@ -139,7 +139,7 @@ export function init(component, options, instance, create_fragment, not_equal, p $$.update(); ready = true; run_all($$.before_update); - + // `false` as a special case of no DOM component $$.fragment = create_fragment ? create_fragment($$.ctx) : false; diff --git a/src/runtime/internal/keyed_each.ts b/src/runtime/internal/keyed_each.ts index 76708c93dbd4..d3a161c6b47e 100644 --- a/src/runtime/internal/keyed_each.ts +++ b/src/runtime/internal/keyed_each.ts @@ -43,7 +43,7 @@ export function update_keyed_each(old_blocks, changed, get_key, dynamic, ctx, li block = create_each_block(key, child_ctx); block.c(); } else if (dynamic) { - block.p(changed, child_ctx); + block.p(child_ctx, changed); } new_lookup.set(key, new_blocks[i] = block); diff --git a/src/runtime/internal/scheduler.ts b/src/runtime/internal/scheduler.ts index 7cb00c085bbc..99feb14152d2 100644 --- a/src/runtime/internal/scheduler.ts +++ b/src/runtime/internal/scheduler.ts @@ -73,8 +73,8 @@ function update($$) { if ($$.fragment !== null) { $$.update($$.dirty); run_all($$.before_update); - $$.fragment && $$.fragment.p($$.dirty, $$.ctx); - $$.dirty = null; + $$.fragment && $$.fragment.p($$.ctx, $$.dirty); + $$.dirty = -1; $$.after_update.forEach(add_render_callback); } diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js index 917cbf6cb23b..5ed38de87c95 100644 --- a/test/js/samples/action-custom-event-handler/expected.js +++ b/test/js/samples/action-custom-event-handler/expected.js @@ -23,8 +23,8 @@ function create_fragment(ctx) { insert(target, button, anchor); foo_action = foo.call(null, button, ctx[1]) || ({}); }, - p(ctx) { - if (is_function(foo_action.update)) foo_action.update.call(null, ctx[1]); + p(ctx, changed) { + if (is_function(foo_action.update) && changed.bar) foo_action.update.call(null, ctx[1]); }, i: noop, o: noop, diff --git a/test/runtime/index.js b/test/runtime/index.js index fc989d352f1d..79dfd9e05082 100644 --- a/test/runtime/index.js +++ b/test/runtime/index.js @@ -26,7 +26,7 @@ process.on('unhandledRejection', err => { unhandled_rejection = err; }); -describe("runtime", () => { +describe.only("runtime", () => { before(() => { svelte = loadSvelte(false); svelte$ = loadSvelte(true); diff --git a/test/runtime/samples/action-custom-event-handler/_config.js b/test/runtime/samples/action-custom-event-handler/_config.js index ad13d900b21a..b132223e321f 100644 --- a/test/runtime/samples/action-custom-event-handler/_config.js +++ b/test/runtime/samples/action-custom-event-handler/_config.js @@ -1,7 +1,7 @@ export default { html: '', - async test({ assert, component, target, window }) { + async test({ assert, target, window }) { const event = new window.MouseEvent('click', { clientX: 42, clientY: 42 From 1a81878f2ba7c9b4f706b993acb2d8aeed95f025 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Sun, 17 Nov 2019 17:27:10 -0500 Subject: [PATCH 03/43] oops --- src/compiler/compile/nodes/shared/Expression.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index 5d8ee18c0f95..3890146550e7 100644 --- a/src/compiler/compile/nodes/shared/Expression.ts +++ b/src/compiler/compile/nodes/shared/Expression.ts @@ -213,8 +213,14 @@ export default class Expression { component.add_reference(name); // TODO is this redundant/misplaced? } } else if (is_contextual(component, template_scope, name)) { - if (block) { // TODO not sure what's going on here — DOM only, maybe? - this.replace(block.renderer.reference(name)); + const reference = block.renderer.reference(name); + if (node.type === 'Identifier') { + this.replace(reference); + } else { + while (node.object.type === 'MemberExpression') { + node = node.object; + } + node.object = reference; } } From 1d7dd6a6d309555058782afb1cd13d5bada9902e Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Sun, 17 Nov 2019 20:09:46 -0500 Subject: [PATCH 04/43] fix some await block stuff --- .../compile/render_dom/wrappers/AwaitBlock.ts | 19 ++++++++++++++----- .../render_dom/wrappers/Element/Binding.ts | 7 +++++-- src/runtime/internal/await_block.ts | 12 +++++++++--- .../await-component-oncreate/_config.js | 2 +- .../await-then-blowback-reactive/main.svelte | 2 +- 5 files changed, 30 insertions(+), 12 deletions(-) diff --git a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts index e6dac09a1157..caf216174681 100644 --- a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts @@ -137,6 +137,9 @@ export default class AwaitBlockWrapper extends Wrapper { block.maintain_context = true; + const value_index = this.node.value && block.renderer.add_to_context(this.node.value, true); + const error_index = this.node.error && block.renderer.add_to_context(this.node.error, true); + const info_props: any = x`{ ctx: #ctx, current: null, @@ -144,8 +147,8 @@ export default class AwaitBlockWrapper extends Wrapper { pending: ${this.pending.block.name}, then: ${this.then.block.name}, catch: ${this.catch.block.name}, - value: ${this.then.block.name && x`"${this.node.value}"`}, - error: ${this.catch.block.name && x`"${this.node.error}"`}, + value: ${value_index}, + error: ${error_index}, blocks: ${this.pending.block.has_outro_method && x`[,,,]`} }`; @@ -197,9 +200,11 @@ export default class AwaitBlockWrapper extends Wrapper { if (this.pending.block.has_update_method) { block.chunks.update.push(b` if (${condition}) { - // nothing + } else { - ${info}.block.p(@assign(@assign({}, #ctx), ${info}.resolved), #changed); + const #child_ctx = #ctx.slice(); + #child_ctx[${value_index}] = ${info}.resolved; + ${info}.block.p(#child_ctx, #changed); } `); } else { @@ -210,7 +215,11 @@ export default class AwaitBlockWrapper extends Wrapper { } else { if (this.pending.block.has_update_method) { block.chunks.update.push(b` - ${info}.block.p(@assign(@assign({}, #ctx), ${info}.resolved), #changed); + { + const #child_ctx = #ctx.slice(); + #child_ctx[${value_index}] = ${info}.resolved; + ${info}.block.p(#child_ctx, #changed); + } `); } } diff --git a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts index 50436f35887e..bd244cf559b0 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts @@ -111,12 +111,15 @@ export default class BindingWrapper { { const binding_group = get_binding_group(parent.renderer, this.node.expression.node); + block.renderer.add_to_context(`$$binding_groups`); + const reference = block.renderer.reference(`$$binding_groups`); + block.chunks.hydrate.push( - b`#ctx.$$binding_groups[${binding_group}].push(${parent.var});` + b`${reference}[${binding_group}].push(${parent.var});` ); block.chunks.destroy.push( - b`#ctx.$$binding_groups[${binding_group}].splice(#ctx.$$binding_groups[${binding_group}].indexOf(${parent.var}), 1);` + b`${reference}[${binding_group}].splice(${reference}[${binding_group}].indexOf(${parent.var}), 1);` ); break; } diff --git a/src/runtime/internal/await_block.ts b/src/runtime/internal/await_block.ts index 6cd7ee5cb454..f44c5ce9d308 100644 --- a/src/runtime/internal/await_block.ts +++ b/src/runtime/internal/await_block.ts @@ -9,9 +9,15 @@ export function handle_promise(promise, info) { function update(type, index, key?, value?) { if (info.token !== token) return; - info.resolved = key && { [key]: value }; + info.resolved = value; + + let child_ctx = info.ctx; + + if (key !== undefined) { + child_ctx = child_ctx.slice(); + child_ctx[key] = value; + } - const child_ctx = assign(assign({}, info.ctx), info.resolved); const block = type && (info.current = type)(child_ctx); let needs_flush = false; @@ -69,6 +75,6 @@ export function handle_promise(promise, info) { return true; } - info.resolved = { [info.value]: promise }; + info.resolved = promise; } } diff --git a/test/runtime/samples/await-component-oncreate/_config.js b/test/runtime/samples/await-component-oncreate/_config.js index 8b6f4e939e2f..3cb8fa0864ea 100644 --- a/test/runtime/samples/await-component-oncreate/_config.js +++ b/test/runtime/samples/await-component-oncreate/_config.js @@ -5,7 +5,7 @@ export default { promise }, - test({ assert, component, target }) { + test({ assert, target }) { return promise.then(() => { assert.htmlEqual(target.innerHTML, `

42

diff --git a/test/runtime/samples/await-then-blowback-reactive/main.svelte b/test/runtime/samples/await-then-blowback-reactive/main.svelte index ee212ef6b50a..eb55465de09d 100644 --- a/test/runtime/samples/await-then-blowback-reactive/main.svelte +++ b/test/runtime/samples/await-then-blowback-reactive/main.svelte @@ -1,6 +1,6 @@ From ab8ca084315afb8239751d193fb6464f0e31fa5b Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Sun, 17 Nov 2019 21:18:40 -0500 Subject: [PATCH 05/43] slots --- src/compiler/compile/render_dom/Renderer.ts | 13 ++++++++++ src/compiler/compile/render_dom/index.ts | 26 ++++++------------- .../wrappers/Element/EventHandler.ts | 21 ++++++--------- .../wrappers/InlineComponent/index.ts | 2 +- .../compile/render_dom/wrappers/Slot.ts | 24 ++++++++--------- src/runtime/internal/Component.ts | 6 ++--- src/runtime/internal/utils.ts | 16 ++++++------ 7 files changed, 53 insertions(+), 55 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 40c2d9234ee7..98e846478c05 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -34,6 +34,19 @@ export default class Renderer { .filter(v => ((v.referenced || v.export_name) && !v.hoistable)) .forEach(v => this.add_to_context(v.name)); + if (component.var_lookup.has('$$props')) { + this.add_to_context('$$props'); + } + + if (component.slots.size > 0) { + this.add_to_context('$$slots'); + this.add_to_context('$$scope'); + } + + if (this.binding_groups.length > 0) { + this.add_to_context('$$binding_groups'); + } + // main block this.block = new Block({ renderer: this, diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index 18f21e276a98..b4f716a9b2b3 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -257,14 +257,6 @@ export default function dom( ${component.fully_hoisted} `); - const filtered_declarations = renderer.context - .map(name => name ? ({ - type: 'Identifier', - name - }) as Expression : x`null`); - - if (uses_props) filtered_declarations.push(x`$$props = @exclude_internal_props($$props)`); - const filtered_props = props.filter(prop => { const variable = component.var_lookup.get(prop.name); @@ -275,14 +267,6 @@ export default function dom( const reactive_stores = component.vars.filter(variable => variable.name[0] === '$' && variable.name[1] !== '$'); - if (component.slots.size > 0) { - filtered_declarations.push(x`$$slots`, x`$$scope`); - } - - if (renderer.binding_groups.length > 0) { - filtered_declarations.push(x`$$binding_groups`); - } - const instance_javascript = component.extract_javascript(component.ast.instance); const has_definition = ( @@ -290,7 +274,7 @@ export default function dom( filtered_props.length > 0 || uses_props || component.partly_hoisted.length > 0 || - filtered_declarations.length > 0 || + renderer.context.length > 0 || component.reactive_declarations.length > 0 ); @@ -379,7 +363,11 @@ export default function dom( const return_value = { type: 'ArrayExpression', - elements: filtered_declarations + elements: renderer.context + .map(name => name ? ({ + type: 'Identifier', + name + }) as Expression : x`null`) }; const reactive_dependencies = { @@ -428,6 +416,8 @@ export default function dom( ${fixed_reactive_declarations} + ${uses_props && b`$$props = @exclude_internal_props($$props);`} + return ${return_value}; } `); diff --git a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts index d76b4ce54d4c..e247156f8bb6 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts @@ -15,12 +15,7 @@ export default class EventHandlerWrapper { this.parent = parent; if (!node.expression) { - // TODO use renderer.add_to_context - this.parent.renderer.component.add_var({ - name: node.handler_name.name, - internal: true, - referenced: true, - }); + this.parent.renderer.add_to_context(node.handler_name.name); this.parent.renderer.component.partly_hoisted.push(b` function ${node.handler_name.name}(event) { @@ -30,26 +25,26 @@ export default class EventHandlerWrapper { } } - get_snippet(block) { - const snippet = this.node.expression ? this.node.expression.manipulate(block) : x`#ctx.${this.node.handler_name}`; + get_snippet(block) { + const snippet = this.node.expression ? this.node.expression.manipulate(block) : block.renderer.reference(this.node.handler_name.name); if (this.node.reassigned) { block.maintain_context = true; return x`function () { ${snippet}.apply(this, arguments); }`; } return snippet; - } + } render(block: Block, target: string) { let snippet = this.get_snippet(block); - if (this.node.modifiers.has('preventDefault')) snippet = x`@prevent_default(${snippet})`; + if (this.node.modifiers.has('preventDefault')) snippet = x`@prevent_default(${snippet})`; if (this.node.modifiers.has('stopPropagation')) snippet = x`@stop_propagation(${snippet})`; if (this.node.modifiers.has('self')) snippet = x`@self(${snippet})`; - const args = []; + const args = []; - const opts = ['passive', 'once', 'capture'].filter(mod => this.node.modifiers.has(mod)); + const opts = ['passive', 'once', 'capture'].filter(mod => this.node.modifiers.has(mod)); if (opts.length) { args.push((opts.length === 1 && opts[0] === 'capture') ? TRUE @@ -63,7 +58,7 @@ export default class EventHandlerWrapper { args.push(this.node.modifiers.has('preventDefault') ? TRUE : FALSE); } - block.event_listeners.push( + block.event_listeners.push( x`@listen(${target}, "${this.node.name}", ${snippet}, ${args})` ); } diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index bc6d32c524ca..69cb0f8d5a13 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -354,7 +354,7 @@ export default class InlineComponentWrapper extends Wrapper { component.partly_hoisted.push(body); - return b`@binding_callbacks.push(() => @bind(${this.var}, '${binding.name}', ${id}));`; + return b`@binding_callbacks.push(() => @bind(${this.var}, '${binding.name}', ${renderer.context_lookup.get(binding.name)}, ${id}));`; }); const munged_handlers = this.node.handlers.map(handler => { diff --git a/src/compiler/compile/render_dom/wrappers/Slot.ts b/src/compiler/compile/render_dom/wrappers/Slot.ts index 95680107328b..761652b1735b 100644 --- a/src/compiler/compile/render_dom/wrappers/Slot.ts +++ b/src/compiler/compile/render_dom/wrappers/Slot.ts @@ -59,12 +59,12 @@ export default class SlotWrapper extends Wrapper { const { slot_name } = this.node; - let get_slot_changes; - let get_slot_context; + let get_slot_changes_fn; + let get_slot_context_fn; if (this.node.values.size > 0) { - get_slot_changes = renderer.component.get_unique_name(`get_${sanitize(slot_name)}_slot_changes`); - get_slot_context = renderer.component.get_unique_name(`get_${sanitize(slot_name)}_slot_context`); + get_slot_changes_fn = renderer.component.get_unique_name(`get_${sanitize(slot_name)}_slot_changes`); + get_slot_context_fn = renderer.component.get_unique_name(`get_${sanitize(slot_name)}_slot_context`); const context = get_slot_data(this.node.values); const changes = x`{}` as ObjectExpression; @@ -105,20 +105,20 @@ export default class SlotWrapper extends Wrapper { }; renderer.blocks.push(b` - const ${get_slot_changes} = (${arg}) => (${changes}); - const ${get_slot_context} = (${arg}) => (${context}); + const ${get_slot_changes_fn} = (${arg}) => (${changes}); + const ${get_slot_context_fn} = (${arg}) => (${context}); `); } else { - get_slot_changes = 'null'; - get_slot_context = 'null'; + get_slot_changes_fn = 'null'; + get_slot_context_fn = 'null'; } const slot = block.get_unique_name(`${sanitize(slot_name)}_slot`); const slot_definition = block.get_unique_name(`${sanitize(slot_name)}_slot_template`); block.chunks.init.push(b` - const ${slot_definition} = #ctx.$$slots.${slot_name}; - const ${slot} = @create_slot(${slot_definition}, #ctx, ${get_slot_context}); + const ${slot_definition} = ${renderer.reference('$$slots')}.${slot_name}; + const ${slot} = @create_slot(${slot_definition}, #ctx, ${renderer.reference('$$scope')}, ${get_slot_context_fn}); `); // TODO this is a dreadful hack! Should probably make this nicer @@ -185,8 +185,8 @@ export default class SlotWrapper extends Wrapper { block.chunks.update.push(b` if (${slot} && ${slot}.p && ${renderer.changed(dynamic_dependencies)}) { ${slot}.p( - @get_slot_context(${slot_definition}, #ctx, ${get_slot_context}), - @get_slot_changes(${slot_definition}, #ctx, #changed, ${get_slot_changes}) + @get_slot_context(${slot_definition}, #ctx, ${renderer.reference('$$scope')}, ${get_slot_context_fn}), + @get_slot_changes(${slot_definition}, #ctx, ${renderer.reference('$$scope')}, #changed, ${get_slot_changes_fn}) ); } `); diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index b035d958ed27..6d8f49957e96 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -36,11 +36,11 @@ interface T$$ { on_destroy: any[]; } -export function bind(component, name, callback) { +export function bind(component, name, index, callback) { if (has_prop(component.$$.props, name)) { name = component.$$.props[name] || name; - component.$$.bound[name] = callback; - callback(component.$$.ctx[name]); + component.$$.bound[index] = callback; + callback(component.$$.ctx[index]); } } diff --git a/src/runtime/internal/utils.ts b/src/runtime/internal/utils.ts index 6816f8684adc..22b58adc9429 100644 --- a/src/runtime/internal/utils.ts +++ b/src/runtime/internal/utils.ts @@ -63,23 +63,23 @@ export function component_subscribe(component, store, callback) { component.$$.on_destroy.push(subscribe(store, callback)); } -export function create_slot(definition, ctx, fn) { +export function create_slot(definition, ctx, $$scope, fn) { if (definition) { - const slot_ctx = get_slot_context(definition, ctx, fn); + const slot_ctx = get_slot_context(definition, ctx, $$scope, fn); return definition[0](slot_ctx); } } -export function get_slot_context(definition, ctx, fn) { +export function get_slot_context(definition, ctx, $$scope, fn) { return definition[1] - ? assign({}, assign(ctx.$$scope.ctx, definition[1](fn ? fn(ctx) : {}))) - : ctx.$$scope.ctx; + ? assign({}, assign($$scope.ctx, definition[1](fn ? fn(ctx) : {}))) + : $$scope.ctx; } -export function get_slot_changes(definition, ctx, changed, fn) { +export function get_slot_changes(definition, ctx, $$scope, changed, fn) { return definition[1] - ? assign({}, assign(ctx.$$scope.changed || {}, definition[1](fn ? fn(changed) : {}))) - : ctx.$$scope.changed || {}; + ? assign({}, assign($$scope.changed || {}, definition[1](fn ? fn(changed) : {}))) + : $$scope.changed || {}; } export function exclude_internal_props(props) { From a74cc6996e2de6d4766a8b91770d3fc153f139a5 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 13:33:03 -0500 Subject: [PATCH 06/43] reactive declarations --- .../compile/nodes/shared/Expression.ts | 2 +- src/compiler/compile/render_dom/Renderer.ts | 6 +++-- src/compiler/compile/render_dom/index.ts | 22 ++----------------- .../compile/render_dom/wrappers/Slot.ts | 2 +- src/runtime/internal/Component.ts | 6 ++--- src/runtime/internal/await_block.ts | 2 +- src/runtime/internal/utils.ts | 2 +- 7 files changed, 13 insertions(+), 29 deletions(-) diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index 3890146550e7..0b4e9624f074 100644 --- a/src/compiler/compile/nodes/shared/Expression.ts +++ b/src/compiler/compile/nodes/shared/Expression.ts @@ -332,7 +332,7 @@ export default class Expression { } }); - this.replace(invalidate(block.renderer, scope, node, traced)); + this.replace(invalidate(block.renderer, scope, node, traced, false)); } } }); diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 98e846478c05..76500bef1d6f 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -138,13 +138,15 @@ export default class Renderer { .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); } - changed(names) { + changed(names, needs_update) { const bitmask = names.reduce((bits, name) => { const bit = 1 << this.context_lookup.get(name); return bits | bit; }, 0); - return x`#changed & ${bitmask}`; + return needs_update + ? x`(#changed = $$self.$$.dirty) & ${bitmask}` + : x`#changed & ${bitmask}`; } reference(name) { diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index b4f716a9b2b3..9f67eb250444 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -3,7 +3,6 @@ import Component from '../Component'; import Renderer from './Renderer'; import { CompileOptions } from '../../interfaces'; import { walk } from 'estree-walker'; -import add_to_set from '../utils/add_to_set'; import { extract_names } from '../utils/scope'; import { invalidate } from './invalidate'; import Block from './Block'; @@ -282,11 +281,6 @@ export default function dom( ? component.alias('instance') : { type: 'Literal', value: null }; - const all_reactive_dependencies = new Set(); - component.reactive_declarations.forEach(d => { - add_to_set(all_reactive_dependencies, d.dependencies); - }); - const reactive_store_subscriptions = reactive_stores .filter(store => { const variable = component.var_lookup.get(store.name.slice(1)); @@ -317,7 +311,7 @@ export default function dom( return variable && (variable.writable || variable.mutated); }); - const condition = !uses_props && writable.length > 0 && renderer.changed(writable); + const condition = !uses_props && writable.length > 0 && renderer.changed(writable, true); let statement = d.node; // TODO remove label (use d.node.body) if it's not referenced @@ -370,18 +364,6 @@ export default function dom( }) as Expression : x`null`) }; - const reactive_dependencies = { - type: 'ObjectPattern', - properties: Array.from(all_reactive_dependencies).map(name => { - return { - type: 'Property', - kind: 'init', - key: { type: 'Identifier', name }, - value: { type: 'Literal', value: 1 } - }; - }) - }; - body.push(b` function ${definition}(${args}) { ${reactive_store_declarations} @@ -409,7 +391,7 @@ export default function dom( ${injected.map(name => b`let ${name};`)} ${reactive_declarations.length > 0 && b` - $$self.$$.update = (#changed = ${reactive_dependencies}) => { + $$self.$$.update = #changed => { ${reactive_declarations} }; `} diff --git a/src/compiler/compile/render_dom/wrappers/Slot.ts b/src/compiler/compile/render_dom/wrappers/Slot.ts index 761652b1735b..dc0905f076a9 100644 --- a/src/compiler/compile/render_dom/wrappers/Slot.ts +++ b/src/compiler/compile/render_dom/wrappers/Slot.ts @@ -186,7 +186,7 @@ export default class SlotWrapper extends Wrapper { if (${slot} && ${slot}.p && ${renderer.changed(dynamic_dependencies)}) { ${slot}.p( @get_slot_context(${slot_definition}, #ctx, ${renderer.reference('$$scope')}, ${get_slot_context_fn}), - @get_slot_changes(${slot_definition}, #ctx, ${renderer.reference('$$scope')}, #changed, ${get_slot_changes_fn}) + @get_slot_changes(${slot_definition}, ${renderer.reference('$$scope')}, #changed, ${get_slot_changes_fn}) ); } `); diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index 6d8f49957e96..18d40356eec8 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -24,7 +24,7 @@ interface T$$ { dirty: number; ctx: null|any; bound: any; - update: () => void; + update: (n: number) => number; callbacks: any; after_update: any[]; props: Record; @@ -108,7 +108,7 @@ export function init(component, options, instance, create_fragment, not_equal, p // state props, - update: noop, + update: (noop as unknown as (n: number) => number), not_equal, bound: blank_object(), @@ -136,7 +136,7 @@ export function init(component, options, instance, create_fragment, not_equal, p }) : prop_values; - $$.update(); + $$.update(-1); ready = true; run_all($$.before_update); diff --git a/src/runtime/internal/await_block.ts b/src/runtime/internal/await_block.ts index f44c5ce9d308..f70cbd6c2c7d 100644 --- a/src/runtime/internal/await_block.ts +++ b/src/runtime/internal/await_block.ts @@ -1,4 +1,4 @@ -import { assign, is_promise } from './utils'; +import { is_promise } from './utils'; import { check_outros, group_outros, transition_in, transition_out } from './transitions'; import { flush } from './scheduler'; import { get_current_component, set_current_component } from './lifecycle'; diff --git a/src/runtime/internal/utils.ts b/src/runtime/internal/utils.ts index 22b58adc9429..f5269262298b 100644 --- a/src/runtime/internal/utils.ts +++ b/src/runtime/internal/utils.ts @@ -76,7 +76,7 @@ export function get_slot_context(definition, ctx, $$scope, fn) { : $$scope.ctx; } -export function get_slot_changes(definition, ctx, $$scope, changed, fn) { +export function get_slot_changes(definition, $$scope, changed, fn) { return definition[1] ? assign({}, assign($$scope.changed || {}, definition[1](fn ? fn(changed) : {}))) : $$scope.changed || {}; From 6c3c3bbf2a101eb9facf705589bf0f7f73da5001 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 14:47:12 -0500 Subject: [PATCH 07/43] component bindings etc --- .../compile/nodes/shared/Expression.ts | 2 +- src/compiler/compile/render_dom/Renderer.ts | 2 +- src/compiler/compile/render_dom/index.ts | 10 +++---- .../wrappers/InlineComponent/index.ts | 30 +++++++++---------- .../compile/render_dom/wrappers/Window.ts | 12 +++++--- .../render_dom/wrappers/shared/bind_this.ts | 6 ++-- .../compile/render_ssr/handlers/Element.ts | 2 +- src/runtime/internal/Component.ts | 6 ++-- 8 files changed, 37 insertions(+), 33 deletions(-) diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index 0b4e9624f074..3890146550e7 100644 --- a/src/compiler/compile/nodes/shared/Expression.ts +++ b/src/compiler/compile/nodes/shared/Expression.ts @@ -332,7 +332,7 @@ export default class Expression { } }); - this.replace(invalidate(block.renderer, scope, node, traced, false)); + this.replace(invalidate(block.renderer, scope, node, traced)); } } }); diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 76500bef1d6f..a50e78662f95 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -138,7 +138,7 @@ export default class Renderer { .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); } - changed(names, needs_update) { + changed(names, needs_update = false) { const bitmask = names.reduce((bits, name) => { const bit = 1 << this.context_lookup.get(name); return bits | bit; diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index 9f67eb250444..54303fd334b0 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -160,7 +160,7 @@ export default function dom( const { ctx: #ctx } = this.$$; const props = ${options.customElement ? x`this.attributes` : x`options.props || {}`}; ${expected.map(prop => b` - if (#ctx.${prop.name} === undefined && !('${prop.export_name}' in props)) { + if (${renderer.reference(prop.name)} === undefined && !('${prop.export_name}' in props)) { @_console.warn("<${component.tag}> was created without expected prop '${prop.export_name}'"); }`)} `; @@ -405,8 +405,8 @@ export default function dom( `); } - const prop_names = x`{ - ${props.map(v => p`${v.export_name}: ${v.export_name === v.name ? 0 : x`"${v.name}"`}}`)} + const prop_indexes = x`{ + ${props.map(v => p`${v.export_name}: ${renderer.context_lookup.get(v.name)}`)} }` as ObjectExpression; if (options.customElement) { @@ -417,7 +417,7 @@ export default function dom( ${css.code && b`this.shadowRoot.innerHTML = \`\`;`} - @init(this, { target: this.shadowRoot }, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_names}); + @init(this, { target: this.shadowRoot }, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_indexes}); ${dev_props_check} @@ -469,7 +469,7 @@ export default function dom( constructor(options) { super(${options.dev && `options`}); ${should_add_css && b`if (!@_document.getElementById("${component.stylesheet.id}-style")) ${add_css}();`} - @init(this, options, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_names}); + @init(this, options, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_indexes}); ${options.dev && b`@dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "${name.name}", options, id: create_fragment.name });`} ${dev_props_check} diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index 69cb0f8d5a13..023f258dd204 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -315,24 +315,24 @@ export default class InlineComponentWrapper extends Wrapper { } const value = block.get_unique_name('value'); - const args: any[] = [value]; + const params: any[] = [value]; if (contextual_dependencies.length > 0) { - args.push({ - type: 'ObjectPattern', - properties: contextual_dependencies.map(name => { - const id = { type: 'Identifier', name }; - return { - type: 'Property', - kind: 'init', - key: id, - value: id - }; - }) + const args = []; + + contextual_dependencies.forEach(name => { + params.push({ + type: 'Identifier', + name + }); + + renderer.add_to_context(name, true); + args.push(renderer.reference(name)); }); + block.chunks.init.push(b` function ${id}(${value}) { - #ctx[${i}].call(null, ${value}, #ctx); + #ctx[${i}].call(null, ${value}, ${args}); } `); @@ -346,7 +346,7 @@ export default class InlineComponentWrapper extends Wrapper { } const body = b` - function ${id}(${args}) { + function ${id}(${params}) { ${lhs} = ${value}; ${renderer.invalidate(dependencies[0])}; } @@ -354,7 +354,7 @@ export default class InlineComponentWrapper extends Wrapper { component.partly_hoisted.push(body); - return b`@binding_callbacks.push(() => @bind(${this.var}, '${binding.name}', ${renderer.context_lookup.get(binding.name)}, ${id}));`; + return b`@binding_callbacks.push(() => @bind(${this.var}, '${binding.name}', ${id}));`; }); const munged_handlers = this.node.handlers.map(handler => { diff --git a/src/compiler/compile/render_dom/wrappers/Window.ts b/src/compiler/compile/render_dom/wrappers/Window.ts index d34af6582945..26042fa84ac9 100644 --- a/src/compiler/compile/render_dom/wrappers/Window.ts +++ b/src/compiler/compile/render_dom/wrappers/Window.ts @@ -80,6 +80,9 @@ export default class WindowWrapper extends Wrapper { const id = block.get_unique_name(`onwindow${event}`); const props = events[event]; + renderer.add_to_context(id.name); + const fn = renderer.reference(id.name); + if (event === 'scroll') { // TODO other bidirectional bindings... block.add_variable(scrolling, x`false`); @@ -106,7 +109,7 @@ export default class WindowWrapper extends Wrapper { ${scrolling} = true; @_clearTimeout(${scrolling_timeout}); ${scrolling_timeout} = @_setTimeout(${clear_scrolling}, 100); - #ctx.${id}(); + ${fn}(); }) `); } else { @@ -117,7 +120,7 @@ export default class WindowWrapper extends Wrapper { }); block.event_listeners.push(x` - @listen(@_window, "${event}", #ctx.${id}) + @listen(@_window, "${event}", ${fn}) `); } @@ -139,8 +142,9 @@ export default class WindowWrapper extends Wrapper { // special case... might need to abstract this out if we add more special cases if (bindings.scrollX || bindings.scrollY) { const condition = renderer.changed([bindings.scrollX, bindings.scrollY].filter(Boolean)); - const scrollX = bindings.scrollX ? x`#ctx.${bindings.scrollX}` : x`@_window.pageXOffset`; - const scrollY = bindings.scrollY ? x`#ctx.${bindings.scrollY}` : x`@_window.pageYOffset`; + + const scrollX = bindings.scrollX ? renderer.reference(bindings.scrollX) : x`@_window.pageXOffset`; + const scrollY = bindings.scrollY ? renderer.reference(bindings.scrollY) : x`@_window.pageYOffset`; block.chunks.update.push(b` if (${condition} && !${scrolling}) { 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 646252259016..46cb561ef435 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts @@ -53,7 +53,7 @@ export default function bind_this(component: Component, block: Block, binding: B const args = []; for (const id of contextual_dependencies) { args.push(id); - block.add_variable(id, x`#ctx.${id}`); + block.add_variable(id, block.renderer.reference(id)); } const assign = block.get_unique_name(`assign_${variable.name}`); @@ -65,7 +65,7 @@ export default function bind_this(component: Component, block: Block, binding: B `); const condition = Array.from(contextual_dependencies) - .map(name => x`${name} !== #ctx.${name}`) // TODO figure out contextual deps + .map(name => x`${name} !== ${block.renderer.reference(name)}`) // TODO figure out contextual deps .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); // we push unassign and unshift assign so that references are @@ -74,7 +74,7 @@ export default function bind_this(component: Component, block: Block, binding: B block.chunks.update.push(b` if (${condition}) { ${unassign}(); - ${args.map(a => b`${a} = #ctx.${a}`)}; + ${args.map(a => b`${a} = ${block.renderer.reference(a)}`)}; ${assign}(); }` ); diff --git a/src/compiler/compile/render_ssr/handlers/Element.ts b/src/compiler/compile/render_ssr/handlers/Element.ts index c77a44990ca9..81b8801686e1 100644 --- a/src/compiler/compile/render_ssr/handlers/Element.ts +++ b/src/compiler/compile/render_ssr/handlers/Element.ts @@ -30,7 +30,7 @@ export default function(node: Element, renderer: Renderer, options: RenderOption const class_expression_list = node.classes.map(class_directive => { const { expression, name } = class_directive; - const snippet = expression ? expression.node : x`#ctx.${name}`; + const snippet = expression ? expression.node : x`#ctx.${name}`; // TODO is this right? return x`${snippet} ? "${name}" : ""`; }); if (node.needs_manual_style_scoping) { diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index 18d40356eec8..778428439f84 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -36,9 +36,9 @@ interface T$$ { on_destroy: any[]; } -export function bind(component, name, index, callback) { - if (has_prop(component.$$.props, name)) { - name = component.$$.props[name] || name; +export function bind(component, name, callback) { + const index = component.$$.props[name]; + if (index !== undefined) { component.$$.bound[index] = callback; callback(component.$$.ctx[index]); } From 12b9733bbd535b20262634b95039e34d8a17a40a Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 15:45:47 -0500 Subject: [PATCH 08/43] start fixing slots --- src/compiler/compile/render_dom/Renderer.ts | 4 ++++ .../render_dom/wrappers/Element/index.ts | 2 +- .../wrappers/InlineComponent/index.ts | 6 +++++- .../compile/render_dom/wrappers/Slot.ts | 10 ++-------- .../wrappers/shared/get_context_merger.ts | 18 +++++------------- src/compiler/compile/utils/get_slot_data.ts | 9 +++++---- src/runtime/internal/utils.ts | 10 +++++----- 7 files changed, 27 insertions(+), 32 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index a50e78662f95..9618a0d854d3 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -167,6 +167,10 @@ export default class Renderer { head = x`#ctx[${i}]`; } } else { + if (i === undefined) { + throw new Error(`attempted to reference unknown value`); + } + head = x`#ctx[${i}]`; } diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index a0859cfced83..3f82bfb58421 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -191,7 +191,7 @@ export default class ElementWrapper extends Wrapper { if (!seen.has(l.name.name)) lets.push(l); }); - const fn = get_context_merger(lets); + const fn = get_context_merger(this.renderer, lets); (owner as unknown as InlineComponentWrapper).slots.set(name, { block: child_block, diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index 023f258dd204..b4a2d13d53ad 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -73,6 +73,10 @@ export default class InlineComponentWrapper extends Wrapper { }; if (this.node.children.length) { + this.node.lets.forEach(l => { + renderer.add_to_context(l.value.name, true); + }); + const default_slot = block.child({ comment: create_debugging_comment(node, renderer.component), name: renderer.component.get_unique_name(`create_default_slot`), @@ -81,7 +85,7 @@ export default class InlineComponentWrapper extends Wrapper { this.renderer.blocks.push(default_slot); - const fn = get_context_merger(this.node.lets); + const fn = get_context_merger(this.renderer, this.node.lets); this.slots.set('default', { block: default_slot, diff --git a/src/compiler/compile/render_dom/wrappers/Slot.ts b/src/compiler/compile/render_dom/wrappers/Slot.ts index dc0905f076a9..044eb04583ad 100644 --- a/src/compiler/compile/render_dom/wrappers/Slot.ts +++ b/src/compiler/compile/render_dom/wrappers/Slot.ts @@ -66,7 +66,6 @@ export default class SlotWrapper extends Wrapper { get_slot_changes_fn = renderer.component.get_unique_name(`get_${sanitize(slot_name)}_slot_changes`); get_slot_context_fn = renderer.component.get_unique_name(`get_${sanitize(slot_name)}_slot_context`); - const context = get_slot_data(this.node.values); const changes = x`{}` as ObjectExpression; const dependencies = new Set(); @@ -99,14 +98,9 @@ export default class SlotWrapper extends Wrapper { } }); - const arg = dependencies.size > 0 && { - type: 'ObjectPattern', - properties: Array.from(dependencies).map(name => p`${name}`) - }; - renderer.blocks.push(b` - const ${get_slot_changes_fn} = (${arg}) => (${changes}); - const ${get_slot_context_fn} = (${arg}) => (${context}); + const ${get_slot_changes_fn} = #changes => #changes; + const ${get_slot_context_fn} = #ctx => ${get_slot_data(block, this.node.values)}; `); } else { get_slot_changes_fn = 'null'; diff --git a/src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts b/src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts index 8c27e8b503d1..e6b4d9a42088 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts @@ -1,7 +1,8 @@ import Let from '../../../nodes/Let'; -import { x } from 'code-red'; +import { x, p } from 'code-red'; +import Renderer from '../../Renderer'; -export function get_context_merger(lets: Let[]) { +export function get_context_merger(renderer: Renderer, lets: Let[]) { if (lets.length === 0) return null; const input = { @@ -14,7 +15,7 @@ export function get_context_merger(lets: Let[]) { })) }; - const names = new Set(); + const names: Set = new Set(); lets.forEach(l => { l.names.forEach(name => { names.add(name); @@ -23,16 +24,7 @@ export function get_context_merger(lets: Let[]) { const output = { type: 'ObjectExpression', - properties: Array.from(names).map(name => { - const id = { type: 'Identifier', name }; - - return { - type: 'Property', - kind: 'init', - key: id, - value: id - }; - }) + properties: Array.from(names).map(name => p`${renderer.context_lookup.get(name)}: ${name}`) }; return x`(${input}) => (${output})`; diff --git a/src/compiler/compile/utils/get_slot_data.ts b/src/compiler/compile/utils/get_slot_data.ts index 936dc85977cf..87811684a314 100644 --- a/src/compiler/compile/utils/get_slot_data.ts +++ b/src/compiler/compile/utils/get_slot_data.ts @@ -1,26 +1,27 @@ import Attribute from '../nodes/Attribute'; import { p, x } from 'code-red'; import { string_literal } from './stringify'; +import Block from '../render_dom/Block'; -export default function get_slot_data(values: Map) { +export default function get_slot_data(block: Block, values: Map) { return { type: 'ObjectExpression', properties: Array.from(values.values()) .filter(attribute => attribute.name !== 'name') .map(attribute => { - const value = get_value(attribute); + const value = get_value(block, attribute); return p`${attribute.name}: ${value}`; }) }; } // TODO fairly sure this is duplicated at least once -function get_value(attribute: Attribute) { +function get_value(block: Block, attribute: Attribute) { if (attribute.is_true) return x`true`; if (attribute.chunks.length === 0) return x`""`; let value = attribute.chunks - .map(chunk => chunk.type === 'Text' ? string_literal(chunk.data) : chunk.node) + .map(chunk => chunk.type === 'Text' ? string_literal(chunk.data) : chunk.manipulate(block)) .reduce((lhs, rhs) => x`${lhs} + ${rhs}`); if (attribute.chunks.length > 1 && attribute.chunks[0].type !== 'Text') { diff --git a/src/runtime/internal/utils.ts b/src/runtime/internal/utils.ts index f5269262298b..fab44f80dbf5 100644 --- a/src/runtime/internal/utils.ts +++ b/src/runtime/internal/utils.ts @@ -71,15 +71,15 @@ export function create_slot(definition, ctx, $$scope, fn) { } export function get_slot_context(definition, ctx, $$scope, fn) { - return definition[1] - ? assign({}, assign($$scope.ctx, definition[1](fn ? fn(ctx) : {}))) + return definition[1] && fn + ? assign($$scope.ctx.slice(), definition[1](fn(ctx))) : $$scope.ctx; } export function get_slot_changes(definition, $$scope, changed, fn) { - return definition[1] - ? assign({}, assign($$scope.changed || {}, definition[1](fn ? fn(changed) : {}))) - : $$scope.changed || {}; + return definition[1] && fn + ? $$scope.changed | definition[1](fn(changed)) + : $$scope.changed; } export function exclude_internal_props(props) { From b7634b8d6bcd038c1d51c5ac253594cfc6c634ae Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 16:29:14 -0500 Subject: [PATCH 09/43] fix store value invalidations --- src/compiler/compile/render_dom/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index 54303fd334b0..da5fdf102537 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -222,7 +222,7 @@ export default function dom( component.rewrite_props(({ name, reassigned, export_name }) => { const value = `$${name}`; - const i = renderer.context_lookup.get(name); + const i = renderer.context_lookup.get(`$${name}`); const insert = (reassigned || export_name) ? b`${`$$subscribe_${name}`}()` From 0f7a42d92a9f1f51045a5975170917a8d3a1fb5a Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 17:10:11 -0500 Subject: [PATCH 10/43] slot stuff --- src/compiler/compile/render_dom/Renderer.ts | 8 +++- .../wrappers/InlineComponent/index.ts | 42 ++++++++++++++++--- .../compile/render_dom/wrappers/Slot.ts | 9 ++-- src/runtime/internal/utils.ts | 4 +- 4 files changed, 47 insertions(+), 16 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 9618a0d854d3..543d6b00665c 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -138,11 +138,15 @@ export default class Renderer { .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); } - changed(names, needs_update = false) { - const bitmask = names.reduce((bits, name) => { + get_bitmask(names) { + return names.reduce((bits, name) => { const bit = 1 << this.context_lookup.get(name); return bits | bit; }, 0); + } + + changed(names, needs_update = false) { + const bitmask = this.get_bitmask(names); return needs_update ? x`(#changed = $$self.$$.dirty) & ${bitmask}` diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index b4a2d13d53ad..155612e878da 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -16,10 +16,41 @@ import is_dynamic from '../shared/is_dynamic'; import bind_this from '../shared/bind_this'; import { Node, Identifier, ObjectExpression } from 'estree'; import EventHandler from '../Element/EventHandler'; +import Let from '../../../nodes/Let'; + +function get_changes_merger(renderer: Renderer, lets: Let[]) { + if (lets.length === 0) return null; + + const input = { + type: 'ObjectPattern', + properties: lets.map(l => ({ + type: 'Property', + kind: 'init', + key: l.name, + value: l.value || l.name + })) + }; + + const names: Set = new Set(); + lets.forEach(l => { + l.names.forEach(name => { + names.add(name); + }); + }); + + const expressions = Array.from(names).map(name => { + const i = renderer.context_lookup.get(name); + return x`${name} ? ${1 << i} : 0`; + }); + + const output = expressions.reduce((lhs, rhs) => x`${lhs} | ${rhs}`); + + return x`(${input}) => (${output})`; +} export default class InlineComponentWrapper extends Wrapper { var: Identifier; - slots: Map = new Map(); + slots: Map = new Map(); node: InlineComponent; fragment: FragmentWrapper; @@ -74,7 +105,7 @@ export default class InlineComponentWrapper extends Wrapper { if (this.node.children.length) { this.node.lets.forEach(l => { - renderer.add_to_context(l.value.name, true); + renderer.add_to_context((l.value || l.name).name, true); }); const default_slot = block.child({ @@ -85,12 +116,11 @@ export default class InlineComponentWrapper extends Wrapper { this.renderer.blocks.push(default_slot); - const fn = get_context_merger(this.renderer, this.node.lets); - this.slots.set('default', { block: default_slot, scope: this.node.scope, - fn + get_context: get_context_merger(this.renderer, this.node.lets), + get_changes: get_changes_merger(this.renderer, this.node.lets) }); this.fragment = new FragmentWrapper(renderer, default_slot, node.children, this, strip_whitespace, next_sibling); @@ -133,7 +163,7 @@ export default class InlineComponentWrapper extends Wrapper { ? [ p`$$slots: { ${Array.from(this.slots).map(([name, slot]) => { - return p`${name}: [${slot.block.name}, ${slot.fn || null}]`; + return p`${name}: [${slot.block.name}, ${slot.get_context || null}, ${slot.get_changes || null}]`; })} }`, p`$$scope: { diff --git a/src/compiler/compile/render_dom/wrappers/Slot.ts b/src/compiler/compile/render_dom/wrappers/Slot.ts index 044eb04583ad..123b6776e863 100644 --- a/src/compiler/compile/render_dom/wrappers/Slot.ts +++ b/src/compiler/compile/render_dom/wrappers/Slot.ts @@ -90,16 +90,13 @@ export default class SlotWrapper extends Wrapper { }); if (dynamic_dependencies.length > 0) { - const expression = dynamic_dependencies - .map(name => ({ type: 'Identifier', name } as any)) - .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); - - changes.properties.push(p`${attribute.name}: ${expression}`); + const bitmask = renderer.get_bitmask(dynamic_dependencies); + changes.properties.push(p`${attribute.name}: #changes & ${bitmask}`); } }); renderer.blocks.push(b` - const ${get_slot_changes_fn} = #changes => #changes; + const ${get_slot_changes_fn} = #changes => ${changes}; const ${get_slot_context_fn} = #ctx => ${get_slot_data(block, this.node.values)}; `); } else { diff --git a/src/runtime/internal/utils.ts b/src/runtime/internal/utils.ts index fab44f80dbf5..97b83f360f52 100644 --- a/src/runtime/internal/utils.ts +++ b/src/runtime/internal/utils.ts @@ -77,8 +77,8 @@ export function get_slot_context(definition, ctx, $$scope, fn) { } export function get_slot_changes(definition, $$scope, changed, fn) { - return definition[1] && fn - ? $$scope.changed | definition[1](fn(changed)) + return definition[2] && fn + ? $$scope.changed | definition[2](fn(changed)) : $$scope.changed; } From ec2704412ab94df70930466272afb848abeed41a Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 17:40:56 -0500 Subject: [PATCH 11/43] fixes --- src/compiler/compile/render_dom/Renderer.ts | 11 ++++++++--- src/compiler/compile/render_dom/index.ts | 4 ++-- src/runtime/internal/Component.ts | 6 +++--- src/runtime/internal/scheduler.ts | 2 +- 4 files changed, 14 insertions(+), 9 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 543d6b00665c..a9c56cfa558e 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -34,6 +34,11 @@ export default class Renderer { .filter(v => ((v.referenced || v.export_name) && !v.hoistable)) .forEach(v => this.add_to_context(v.name)); + // ensure store values are included in context + component.vars + .filter(v => v.subscribable) + .forEach(v => this.add_to_context(`$${v.name}`)); + if (component.var_lookup.has('$$props')) { this.add_to_context('$$props'); } @@ -145,11 +150,11 @@ export default class Renderer { }, 0); } - changed(names, needs_update = false) { + changed(names, is_reactive_declaration = false) { const bitmask = this.get_bitmask(names); - return needs_update - ? x`(#changed = $$self.$$.dirty) & ${bitmask}` + return is_reactive_declaration + ? x`$$self.$$.dirty & ${bitmask}` : x`#changed & ${bitmask}`; } diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index da5fdf102537..a26bb7722310 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -391,7 +391,7 @@ export default function dom( ${injected.map(name => b`let ${name};`)} ${reactive_declarations.length > 0 && b` - $$self.$$.update = #changed => { + $$self.$$.update = () => { ${reactive_declarations} }; `} @@ -406,7 +406,7 @@ export default function dom( } const prop_indexes = x`{ - ${props.map(v => p`${v.export_name}: ${renderer.context_lookup.get(v.name)}`)} + ${props.filter(v => !v.hoistable).map(v => p`${v.export_name}: ${renderer.context_lookup.get(v.name)}`)} }` as ObjectExpression; if (options.customElement) { diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index 778428439f84..533377412577 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -24,7 +24,7 @@ interface T$$ { dirty: number; ctx: null|any; bound: any; - update: (n: number) => number; + update: () => void; callbacks: any; after_update: any[]; props: Record; @@ -108,7 +108,7 @@ export function init(component, options, instance, create_fragment, not_equal, p // state props, - update: (noop as unknown as (n: number) => number), + update: noop, not_equal, bound: blank_object(), @@ -136,7 +136,7 @@ export function init(component, options, instance, create_fragment, not_equal, p }) : prop_values; - $$.update(-1); + $$.update(); ready = true; run_all($$.before_update); diff --git a/src/runtime/internal/scheduler.ts b/src/runtime/internal/scheduler.ts index 99feb14152d2..46b52e1d8aa6 100644 --- a/src/runtime/internal/scheduler.ts +++ b/src/runtime/internal/scheduler.ts @@ -71,7 +71,7 @@ export function flush() { function update($$) { if ($$.fragment !== null) { - $$.update($$.dirty); + $$.update(); run_all($$.before_update); $$.fragment && $$.fragment.p($$.ctx, $$.dirty); $$.dirty = -1; From bf49717f99bd6d8be34309a7d076a3e5280f6170 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 17:56:44 -0500 Subject: [PATCH 12/43] fix --- .../compile/render_dom/wrappers/shared/bind_this.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) 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 46cb561ef435..e46f7b59f0d9 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/bind_this.ts @@ -53,7 +53,7 @@ export default function bind_this(component: Component, block: Block, binding: B const args = []; for (const id of contextual_dependencies) { args.push(id); - block.add_variable(id, block.renderer.reference(id)); + block.add_variable(id, block.renderer.reference(id.name)); } const assign = block.get_unique_name(`assign_${variable.name}`); @@ -65,7 +65,7 @@ export default function bind_this(component: Component, block: Block, binding: B `); const condition = Array.from(contextual_dependencies) - .map(name => x`${name} !== ${block.renderer.reference(name)}`) // TODO figure out contextual deps + .map(name => x`${name} !== ${block.renderer.reference(name.name)}`) .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); // we push unassign and unshift assign so that references are @@ -74,7 +74,7 @@ export default function bind_this(component: Component, block: Block, binding: B block.chunks.update.push(b` if (${condition}) { ${unassign}(); - ${args.map(a => b`${a} = ${block.renderer.reference(a)}`)}; + ${args.map(a => b`${a} = ${block.renderer.reference(a.name)}`)}; ${assign}(); }` ); From c59c1530d61d050f81d7ee1c13c3d078808805c0 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 18 Nov 2019 18:13:06 -0500 Subject: [PATCH 13/43] fixes --- .../render_dom/wrappers/Element/index.ts | 24 +++++++------------ .../_config.js | 1 - 2 files changed, 9 insertions(+), 16 deletions(-) diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index 3f82bfb58421..2f90806673cd 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -486,6 +486,8 @@ export default class ElementWrapper extends Wrapper { // TODO dry this out — similar code for event handlers and component bindings if (has_local_function) { + const args = Array.from(contextual_dependencies).map(name => renderer.reference(name)); + // need to create a block-local function that calls an instance-level function if (animation_frame) { block.chunks.init.push(b` @@ -495,14 +497,14 @@ export default class ElementWrapper extends Wrapper { ${animation_frame} = @raf(${handler}); ${needs_lock && b`${lock} = true;`} } - #ctx[${i}].call(${this.var}, ${contextual_dependencies.size > 0 ? '#ctx' : null}); + #ctx[${i}].call(${this.var}, ${args}); } `); } else { block.chunks.init.push(b` function ${handler}() { ${needs_lock && b`${lock} = true;`} - #ctx[${i}].call(${this.var}, ${contextual_dependencies.size > 0 ? '#ctx' : null}); + #ctx[${i}].call(${this.var}, ${args}); } `); } @@ -512,21 +514,13 @@ export default class ElementWrapper extends Wrapper { callee = x`#ctx[${i}]`; } - const arg = contextual_dependencies.size > 0 && { - type: 'ObjectPattern', - properties: Array.from(contextual_dependencies).map(name => { - const id = { type: 'Identifier', name }; - return { - type: 'Property', - kind: 'init', - key: id, - value: id - }; - }) - }; + const params = Array.from(contextual_dependencies).map(name => ({ + type: 'Identifier', + name + })); this.renderer.component.partly_hoisted.push(b` - function ${handler}(${arg}) { + function ${handler}(${params}) { ${group.bindings.map(b => b.handler.mutation)} ${Array.from(dependencies) .filter(dep => dep[0] !== '$') diff --git a/test/runtime/samples/binding-input-text-contextual-deconflicted/_config.js b/test/runtime/samples/binding-input-text-contextual-deconflicted/_config.js index 37af5080b906..28cffdfa5772 100644 --- a/test/runtime/samples/binding-input-text-contextual-deconflicted/_config.js +++ b/test/runtime/samples/binding-input-text-contextual-deconflicted/_config.js @@ -16,7 +16,6 @@ export default { async test({ assert, component, target, window }) { const inputs = [...target.querySelectorAll('input')]; - const items = component.items; const event = new window.Event('input'); assert.equal(inputs[0].value, 'a'); From b6d6053166fca293b2d0a19ff6cb81d27b455451 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 19 Nov 2019 10:49:38 -0500 Subject: [PATCH 14/43] fix some slot stuff --- .../render_dom/wrappers/Element/index.ts | 21 +++++---- .../wrappers/InlineComponent/index.ts | 40 +---------------- .../wrappers/shared/get_context_merger.ts | 31 ------------- .../wrappers/shared/get_slot_definition.ts | 44 +++++++++++++++++++ 4 files changed, 58 insertions(+), 78 deletions(-) delete mode 100644 src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts create mode 100644 src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index 2f90806673cd..fae252d3f521 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -19,7 +19,7 @@ import add_to_set from '../../../utils/add_to_set'; import add_event_handlers from '../shared/add_event_handlers'; import add_actions from '../shared/add_actions'; import create_debugging_comment from '../shared/create_debugging_comment'; -import { get_context_merger } from '../shared/get_context_merger'; +import { get_slot_definition } from '../shared/get_slot_definition'; import bind_this from '../shared/bind_this'; import { is_head } from '../shared/is_head'; import { Identifier } from 'estree'; @@ -158,6 +158,12 @@ export default class ElementWrapper extends Wrapper { this.class_dependencies = []; + if (this.node.children.length) { + this.node.lets.forEach(l => { + renderer.add_to_context((l.value || l.name).name, true); + }); + } + this.attributes = this.node.attributes.map(attribute => { if (attribute.name === 'slot') { // TODO make separate subclass for this? @@ -184,20 +190,17 @@ export default class ElementWrapper extends Wrapper { type: 'slot' }); - const lets = this.node.lets; + const { scope, lets } = this.node; const seen = new Set(lets.map(l => l.name.name)); (owner as unknown as InlineComponentWrapper).node.lets.forEach(l => { if (!seen.has(l.name.name)) lets.push(l); }); - const fn = get_context_merger(this.renderer, lets); - - (owner as unknown as InlineComponentWrapper).slots.set(name, { - block: child_block, - scope: this.node.scope, - fn - }); + (owner as unknown as InlineComponentWrapper).slots.set( + name, + get_slot_definition(child_block, scope, lets) + ); this.renderer.blocks.push(child_block); } diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index 155612e878da..db9ecae392b6 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -9,44 +9,13 @@ import { b, x, p } from 'code-red'; import Attribute from '../../../nodes/Attribute'; import get_object from '../../../utils/get_object'; import create_debugging_comment from '../shared/create_debugging_comment'; -import { get_context_merger } from '../shared/get_context_merger'; +import { get_slot_definition } from '../shared/get_slot_definition'; import EachBlock from '../../../nodes/EachBlock'; import TemplateScope from '../../../nodes/shared/TemplateScope'; import is_dynamic from '../shared/is_dynamic'; import bind_this from '../shared/bind_this'; import { Node, Identifier, ObjectExpression } from 'estree'; import EventHandler from '../Element/EventHandler'; -import Let from '../../../nodes/Let'; - -function get_changes_merger(renderer: Renderer, lets: Let[]) { - if (lets.length === 0) return null; - - const input = { - type: 'ObjectPattern', - properties: lets.map(l => ({ - type: 'Property', - kind: 'init', - key: l.name, - value: l.value || l.name - })) - }; - - const names: Set = new Set(); - lets.forEach(l => { - l.names.forEach(name => { - names.add(name); - }); - }); - - const expressions = Array.from(names).map(name => { - const i = renderer.context_lookup.get(name); - return x`${name} ? ${1 << i} : 0`; - }); - - const output = expressions.reduce((lhs, rhs) => x`${lhs} | ${rhs}`); - - return x`(${input}) => (${output})`; -} export default class InlineComponentWrapper extends Wrapper { var: Identifier; @@ -116,12 +85,7 @@ export default class InlineComponentWrapper extends Wrapper { this.renderer.blocks.push(default_slot); - this.slots.set('default', { - block: default_slot, - scope: this.node.scope, - get_context: get_context_merger(this.renderer, this.node.lets), - get_changes: get_changes_merger(this.renderer, this.node.lets) - }); + this.slots.set('default', get_slot_definition(default_slot, this.node.scope, this.node.lets)); this.fragment = new FragmentWrapper(renderer, default_slot, node.children, this, strip_whitespace, next_sibling); const dependencies: Set = new Set(); diff --git a/src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts b/src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts deleted file mode 100644 index e6b4d9a42088..000000000000 --- a/src/compiler/compile/render_dom/wrappers/shared/get_context_merger.ts +++ /dev/null @@ -1,31 +0,0 @@ -import Let from '../../../nodes/Let'; -import { x, p } from 'code-red'; -import Renderer from '../../Renderer'; - -export function get_context_merger(renderer: Renderer, lets: Let[]) { - if (lets.length === 0) return null; - - const input = { - type: 'ObjectPattern', - properties: lets.map(l => ({ - type: 'Property', - kind: 'init', - key: l.name, - value: l.value || l.name - })) - }; - - const names: Set = new Set(); - lets.forEach(l => { - l.names.forEach(name => { - names.add(name); - }); - }); - - const output = { - type: 'ObjectExpression', - properties: Array.from(names).map(name => p`${renderer.context_lookup.get(name)}: ${name}`) - }; - - return x`(${input}) => (${output})`; -} \ No newline at end of file diff --git a/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts b/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts new file mode 100644 index 000000000000..170e9d87db26 --- /dev/null +++ b/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts @@ -0,0 +1,44 @@ +import Let from '../../../nodes/Let'; +import { x, p } from 'code-red'; +import Block from '../../Block'; +import TemplateScope from '../../../nodes/shared/TemplateScope'; + +export function get_slot_definition(block: Block, scope: TemplateScope, lets: Let[]) { + if (lets.length === 0) return { block, scope }; + + const input = { + type: 'ObjectPattern', + properties: lets.map(l => ({ + type: 'Property', + kind: 'init', + key: l.name, + value: l.value || l.name + })) + }; + + const names: Set = new Set(); + lets.forEach(l => { + l.names.forEach(name => { + names.add(name); + }); + }); + + const context = { + type: 'ObjectExpression', + properties: Array.from(names).map(name => p`${block.renderer.context_lookup.get(name)}: ${name}`) + }; + + const changes = Array.from(names) + .map(name => { + const i = block.renderer.context_lookup.get(name); + return x`${name} ? ${1 << i} : 0`; + }) + .reduce((lhs, rhs) => x`${lhs} | ${rhs}`); + + return { + block, + scope, + get_context: x`${input} => ${context}`, + get_changes: x`${input} => ${changes}` + }; +} \ No newline at end of file From a8dca8c59906bf1571a563efc1032f64a622427b Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 19 Nov 2019 11:03:25 -0500 Subject: [PATCH 15/43] fix some invalidations --- src/compiler/compile/Component.ts | 8 -------- src/compiler/compile/render_dom/Renderer.ts | 2 +- 2 files changed, 1 insertion(+), 9 deletions(-) diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts index ff63e7718e5d..c40b7b51f103 100644 --- a/src/compiler/compile/Component.ts +++ b/src/compiler/compile/Component.ts @@ -889,10 +889,6 @@ export default class Component { return null; } - invalidate(_name, _value?) { - throw new Error(`invalidate method now belongs to Renderer`); - } - rewrite_props(get_insert: (variable: Var) => Node[]) { if (!this.ast.instance) return; @@ -1285,10 +1281,6 @@ export default class Component { }); } - qualify(_name) { - throw new Error(`component.qualify is now renderer.reference`); - } - warn_if_undefined(name: string, node, template_scope: TemplateScope) { if (name[0] === '$') { if (name === '$' || name[1] === '$' && name !== '$$props') { diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index a9c56cfa558e..146e6f80a8f1 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -139,7 +139,7 @@ export default class Renderer { }); return Array.from(deps) - .map(n => x`$$invalidate(${i}, ${n})`) + .map(n => x`$$invalidate(${this.context_lookup.get(n)}, ${n})`) .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); } From 3ff1cffb4f095ab562025ec40277edb3e78f9b0c Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 19 Nov 2019 11:23:01 -0500 Subject: [PATCH 16/43] fix if blocks --- .../compile/render_dom/wrappers/IfBlock.ts | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/src/compiler/compile/render_dom/wrappers/IfBlock.ts b/src/compiler/compile/render_dom/wrappers/IfBlock.ts index 4d61aa006d41..80f9ad52f6a4 100644 --- a/src/compiler/compile/render_dom/wrappers/IfBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/IfBlock.ts @@ -266,7 +266,7 @@ export default class IfBlockWrapper extends Wrapper { /* eslint-disable @typescript-eslint/indent,indent */ if (this.needs_update) { block.chunks.init.push(b` - function ${select_block_type}(#changed, #ctx) { + function ${select_block_type}(#ctx, #changed) { ${this.branches.map(({ dependencies, condition, snippet, block }) => condition ? b` ${snippet && ( @@ -280,7 +280,7 @@ export default class IfBlockWrapper extends Wrapper { `); } else { block.chunks.init.push(b` - function ${select_block_type}(#changed, #ctx) { + function ${select_block_type}(#ctx, #changed) { ${this.branches.map(({ condition, snippet, block }) => condition ? b`if (${snippet || condition}) return ${block.name};` : b`return ${block.name};`)} @@ -290,7 +290,7 @@ export default class IfBlockWrapper extends Wrapper { /* eslint-enable @typescript-eslint/indent,indent */ block.chunks.init.push(b` - let ${current_block_type} = ${select_block_type}(null, #ctx); + let ${current_block_type} = ${select_block_type}(#ctx, -1); let ${name} = ${get_block}; `); @@ -385,13 +385,13 @@ export default class IfBlockWrapper extends Wrapper { ${this.needs_update ? b` - function ${select_block_type}(#changed, #ctx) { + function ${select_block_type}(#ctx, #changed) { ${this.branches.map(({ dependencies, condition, snippet }, i) => condition ? b` ${snippet && ( dependencies.length > 0 - ? b`if (${condition} == null || ${block.renderer.changed(dependencies)}) ${condition} = !!${snippet}` - : b`if (${condition} == null) ${condition} = !!${snippet}` + ? b`if (${block.renderer.changed(dependencies)}) ${condition} = !!${snippet}` + : b`if (${condition} == -1) ${condition} = !!${snippet}` )} if (${condition}) return ${i};` : b`return ${i};`)} @@ -411,12 +411,12 @@ export default class IfBlockWrapper extends Wrapper { if (has_else) { block.chunks.init.push(b` - ${current_block_type_index} = ${select_block_type}(null, #ctx); + ${current_block_type_index} = ${select_block_type}(#ctx, -1); ${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}](#ctx); `); } else { block.chunks.init.push(b` - if (~(${current_block_type_index} = ${select_block_type}(null, #ctx))) { + if (~(${current_block_type_index} = ${select_block_type}(#ctx, -1))) { ${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}](#ctx); } `); @@ -473,7 +473,7 @@ export default class IfBlockWrapper extends Wrapper { if (dynamic) { block.chunks.update.push(b` let ${previous_block_index} = ${current_block_type_index}; - ${current_block_type_index} = ${select_block_type}(#changed, #ctx); + ${current_block_type_index} = ${select_block_type}(#ctx, #changed); if (${current_block_type_index} === ${previous_block_index}) { ${if_current_block_type_index(b`${if_blocks}[${current_block_type_index}].p(#ctx, #changed);`)} } else { @@ -483,7 +483,7 @@ export default class IfBlockWrapper extends Wrapper { } else { block.chunks.update.push(b` let ${previous_block_index} = ${current_block_type_index}; - ${current_block_type_index} = ${select_block_type}(#changed, #ctx); + ${current_block_type_index} = ${select_block_type}(#ctx, #changed); if (${current_block_type_index} !== ${previous_block_index}) { ${change_block} } From acdf8928b17998c3e4f98204867fb93a6a77cbaf Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 19 Nov 2019 11:30:11 -0500 Subject: [PATCH 17/43] fix a test --- src/compiler/compile/render_dom/Renderer.ts | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 146e6f80a8f1..842bd90f0aa3 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -175,11 +175,7 @@ export default class Renderer { if (!variable.hoistable) { head = x`#ctx[${i}]`; } - } else { - if (i === undefined) { - throw new Error(`attempted to reference unknown value`); - } - + } else if (i !== undefined) { head = x`#ctx[${i}]`; } From 904ca7d0b5f749c9c6591b51151147097a568a09 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 19 Nov 2019 11:53:46 -0500 Subject: [PATCH 18/43] destructuring in lets --- package.json | 2 +- src/compiler/compile/render_dom/wrappers/Element/index.ts | 5 ++++- .../compile/render_dom/wrappers/InlineComponent/index.ts | 5 ++++- 3 files changed, 9 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 8584ac6ff867..91723ee71403 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,7 @@ "coverage": "c8 report --reporter=text-lcov > coverage.lcov && c8 report --reporter=html", "codecov": "codecov", "precodecov": "npm run coverage", - "build": "rollup -c && npm run tsd", + "build": "rollup -c", "prepare": "npm run build", "dev": "rollup -cw", "pretest": "npm run build", diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index fae252d3f521..b049f7aa297f 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -24,6 +24,7 @@ import bind_this from '../shared/bind_this'; import { is_head } from '../shared/is_head'; import { Identifier } from 'estree'; import EventHandler from './EventHandler'; +import { extract_names } from 'periscopic'; const events = [ { @@ -160,7 +161,9 @@ export default class ElementWrapper extends Wrapper { if (this.node.children.length) { this.node.lets.forEach(l => { - renderer.add_to_context((l.value || l.name).name, true); + extract_names(l.value || l.name).forEach(name => { + renderer.add_to_context(name, true); + }); }); } diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index db9ecae392b6..38daf5e29105 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -16,6 +16,7 @@ import is_dynamic from '../shared/is_dynamic'; import bind_this from '../shared/bind_this'; import { Node, Identifier, ObjectExpression } from 'estree'; import EventHandler from '../Element/EventHandler'; +import { extract_names } from 'periscopic'; export default class InlineComponentWrapper extends Wrapper { var: Identifier; @@ -74,7 +75,9 @@ export default class InlineComponentWrapper extends Wrapper { if (this.node.children.length) { this.node.lets.forEach(l => { - renderer.add_to_context((l.value || l.name).name, true); + extract_names(l.value || l.name).forEach(name => { + renderer.add_to_context(name, true); + }); }); const default_slot = block.child({ From 3cd8f35e1aa7167014c1b44d150e5dbc9bf76a5d Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 19 Nov 2019 11:59:41 -0500 Subject: [PATCH 19/43] fix shadowing --- src/compiler/compile/render_dom/Renderer.ts | 20 +++++++++++++------ .../each-block-scope-shadow/_config.js | 2 +- .../each-block-scope-shadow/main.svelte | 2 ++ 3 files changed, 17 insertions(+), 7 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 842bd90f0aa3..27895e2f9c53 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -167,15 +167,23 @@ export default class Renderer { const variable = this.component.var_lookup.get(head); - // TODO this feels woolly. might encounter false positive - // if each context shadows top-level var + // // TODO this feels woolly. might encounter false positive + // // if each context shadows top-level var + // if (variable) { + // this.component.add_reference(name); // TODO we can probably remove most other occurrences of this + + // if (!variable.hoistable) { + // head = x`#ctx[${i}]`; + // } + // } else if (i !== undefined) { + // head = x`#ctx[${i}]`; + // } + if (variable) { this.component.add_reference(name); // TODO we can probably remove most other occurrences of this + } - if (!variable.hoistable) { - head = x`#ctx[${i}]`; - } - } else if (i !== undefined) { + if (i !== undefined) { head = x`#ctx[${i}]`; } diff --git a/test/runtime/samples/each-block-scope-shadow/_config.js b/test/runtime/samples/each-block-scope-shadow/_config.js index 8005bc93d5b7..dff254a7c488 100644 --- a/test/runtime/samples/each-block-scope-shadow/_config.js +++ b/test/runtime/samples/each-block-scope-shadow/_config.js @@ -1,3 +1,3 @@ export default { - html: '(alpaca)(baboon)(capybara)' + html: '(alpaca)(baboon)(capybara) (lemur)' }; diff --git a/test/runtime/samples/each-block-scope-shadow/main.svelte b/test/runtime/samples/each-block-scope-shadow/main.svelte index b6c256e14f00..645538a1257b 100644 --- a/test/runtime/samples/each-block-scope-shadow/main.svelte +++ b/test/runtime/samples/each-block-scope-shadow/main.svelte @@ -2,6 +2,8 @@ ({animal}) {/each} +({animal}) + \ No newline at end of file From 7963b4b404be15ce8fd6b06d2b0d8d36fcbf583a Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Wed, 20 Nov 2019 09:09:50 -0500 Subject: [PATCH 26/43] always use renderer.reference --- src/compiler/compile/nodes/shared/Expression.ts | 11 ++++++----- .../compile/render_dom/wrappers/Element/index.ts | 10 ++++------ .../render_dom/wrappers/InlineComponent/index.ts | 7 ++++--- src/compiler/compile/render_dom/wrappers/Window.ts | 14 ++++++++------ .../render_dom/wrappers/shared/bind_this.ts | 12 +++++++----- 5 files changed, 29 insertions(+), 25 deletions(-) diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index 3890146550e7..45a8f3ae96e5 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 b049f7aa297f..cc0bd377237b 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 38daf5e29105..b42302b2227a 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 26042fa84ac9..b13d4dd04306 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 e46f7b59f0d9..97199a71c2e3 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 From 4338d2e64db532a40e4f99e53d232b6bfec4e136 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Wed, 20 Nov 2019 12:12:16 -0500 Subject: [PATCH 27/43] fix sourcemaps --- .../compile/nodes/shared/Expression.ts | 15 +++------- src/compiler/compile/render_dom/Renderer.ts | 30 +++++++++++-------- .../wrappers/Element/EventHandler.ts | 2 +- .../render_dom/wrappers/Element/index.ts | 2 +- .../wrappers/InlineComponent/index.ts | 2 +- 5 files changed, 25 insertions(+), 26 deletions(-) diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index 45a8f3ae96e5..aa25b8977198 100644 --- a/src/compiler/compile/nodes/shared/Expression.ts +++ b/src/compiler/compile/nodes/shared/Expression.ts @@ -213,15 +213,8 @@ export default class Expression { component.add_reference(name); // TODO is this redundant/misplaced? } } else if (is_contextual(component, template_scope, name)) { - const reference = block.renderer.reference(name); - if (node.type === 'Identifier') { - this.replace(reference); - } else { - while (node.object.type === 'MemberExpression') { - node = node.object; - } - node.object = reference; - } + const reference = block.renderer.reference(node); + this.replace(reference); } this.skip(); @@ -269,7 +262,7 @@ export default class Expression { component.partly_hoisted.push(declaration); block.renderer.add_to_context(id.name); - this.replace(block.renderer.reference(id.name)); + this.replace(block.renderer.reference(id)); } else { @@ -286,7 +279,7 @@ export default class Expression { component.partly_hoisted.push(declaration); block.renderer.add_to_context(id.name); - const callee = block.renderer.reference(id.name); + const callee = block.renderer.reference(id); this.replace(id as any); diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index c015bcfdb544..b7c91eede0ce 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -3,7 +3,8 @@ import { CompileOptions } from '../../interfaces'; import Component from '../Component'; import FragmentWrapper from './wrappers/Fragment'; import { x } from 'code-red'; -import { Node, Identifier } from 'estree'; +import { Node, Identifier, MemberExpression } from 'estree'; +import flatten_reference from '../utils/flatten_reference'; export default class Renderer { component: Component; // TODO Maybe Renderer shouldn't know about Component? @@ -158,23 +159,28 @@ export default class Renderer { : x`#changed & ${bitmask}`; } - reference(name) { - const i = this.context_lookup.get(name); - - if (name === `$$props`) return x`#ctx[${i}]`; - - let [head, ...tail] = name.split('.'); + reference(node: string | Identifier | MemberExpression) { + if (typeof node === 'string') { + node = { type: 'Identifier', name: node }; + } - const variable = this.component.var_lookup.get(head); + const { name, nodes } = flatten_reference(node); + const i = this.context_lookup.get(name); - if (variable) { - this.component.add_reference(name); // TODO we can probably remove most other occurrences of this + // TODO is this correct? + if (this.component.var_lookup.get(name)) { + this.component.add_reference(name); } if (i !== undefined) { - head = x`#ctx[${i}]`; + const replacement = x`#ctx[${i}]` as MemberExpression; + + replacement.object.loc = nodes[0].loc; + nodes[0] = replacement; + + return nodes.reduce((lhs, rhs) => x`${lhs}.${rhs}`); } - return [head, ...tail].reduce((lhs, rhs) => x`${lhs}.${rhs}`); + return node; } } diff --git a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts index e247156f8bb6..bc798d2e530d 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts @@ -26,7 +26,7 @@ export default class EventHandlerWrapper { } get_snippet(block) { - const snippet = this.node.expression ? this.node.expression.manipulate(block) : block.renderer.reference(this.node.handler_name.name); + const snippet = this.node.expression ? this.node.expression.manipulate(block) : block.renderer.reference(this.node.handler_name); if (this.node.reassigned) { block.maintain_context = true; diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index cc0bd377237b..467578abf9c7 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -488,7 +488,7 @@ export default class ElementWrapper extends Wrapper { const has_local_function = contextual_dependencies.size > 0 || needs_lock || animation_frame; - let callee = renderer.reference(handler.name); + let callee = renderer.reference(handler); // TODO dry this out — similar code for event handlers and component bindings if (has_local_function) { diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index b42302b2227a..3417b563e200 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -281,7 +281,7 @@ export default class InlineComponentWrapper extends Wrapper { const id = component.get_unique_name(`${this.var.name}_${binding.name}_binding`); renderer.add_to_context(id.name); - const callee = renderer.reference(id.name); + const callee = renderer.reference(id); const updating = block.get_unique_name(`updating_${binding.name}`); block.add_variable(updating); From 3d8bd5ddad2ef42a6b8bb8441bb7a223f9e2264f Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Wed, 20 Nov 2019 17:55:38 -0500 Subject: [PATCH 28/43] ugh so close --- src/compiler/compile/Component.ts | 2 +- src/compiler/compile/render_dom/Block.ts | 4 +- src/compiler/compile/render_dom/Renderer.ts | 127 ++++++++++++++---- src/compiler/compile/render_dom/index.ts | 42 ++++-- src/compiler/compile/render_dom/invalidate.ts | 2 +- .../compile/render_dom/wrappers/AwaitBlock.ts | 7 +- .../compile/render_dom/wrappers/EachBlock.ts | 11 +- .../wrappers/InlineComponent/index.ts | 1 + .../compile/render_dom/wrappers/Window.ts | 5 +- .../wrappers/shared/get_slot_definition.ts | 15 ++- src/runtime/internal/Component.ts | 4 +- .../expected.js | 8 +- .../debug-foo-bar-baz-things/expected.js | 2 +- test/js/samples/debug-foo/expected.js | 2 +- .../samples/debug-no-dependencies/expected.js | 2 +- .../samples/deconflict-builtins/expected.js | 2 +- .../each-block-array-literal/expected.js | 2 +- .../each-block-changed-check/expected.js | 2 +- .../each-block-keyed-animated/expected.js | 2 +- test/js/samples/each-block-keyed/expected.js | 2 +- .../expected.js | 4 +- test/js/samples/setup-method/expected.js | 6 +- .../expected.js | 7 +- .../input.svelte | 2 +- 24 files changed, 181 insertions(+), 82 deletions(-) diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts index 920b0c39272a..46704fd7ff4c 100644 --- a/src/compiler/compile/Component.ts +++ b/src/compiler/compile/Component.ts @@ -209,7 +209,7 @@ export default class Component { }); const subscribable_name = name.slice(1); - this.add_reference(subscribable_name); + // this.add_reference(subscribable_name); const variable = this.var_lookup.get(subscribable_name); if (variable) variable.subscribable = true; diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts index 01359b7c18da..b69955abaea3 100644 --- a/src/compiler/compile/render_dom/Block.ts +++ b/src/compiler/compile/render_dom/Block.ts @@ -34,7 +34,7 @@ export default class Block { key: Identifier; first: Identifier; - dependencies: Set; + dependencies: Set = new Set(); bindings: Map = new Map(); + context: ContextMember[] = []; + context_lookup: Map = new Map(); blocks: Array = []; readonly: Set = new Set(); meta_bindings: Array = []; // initial values for e.g. window.innerWidth, if there's a meta tag @@ -31,22 +40,18 @@ export default class Renderer { this.file_var = options.dev && this.component.get_unique_name('file'); // TODO sort vars, most frequently referenced first? - component.vars - .filter(v => ((v.referenced || v.export_name) && !v.hoistable)) - .forEach(v => this.add_to_context(v.name)); + component.vars.filter(v => !v.hoistable || (v.export_name && !v.module)).forEach(v => this.add_to_context(v.name)); // ensure store values are included in context - component.vars - .filter(v => v.subscribable) - .forEach(v => this.add_to_context(`$${v.name}`)); + component.vars.filter(v => v.subscribable).forEach(v => this.add_to_context(`$${v.name}`)); if (component.var_lookup.has('$$props')) { this.add_to_context('$$props'); } if (component.slots.size > 0) { - this.add_to_context('$$slots'); this.add_to_context('$$scope'); + this.add_to_context('$$slots'); } if (this.binding_groups.length > 0) { @@ -86,25 +91,62 @@ export default class Renderer { this.block.assign_variable_names(); this.fragment.render(this.block, null, x`#nodes` as Identifier); + + this.context.forEach(member => { + const { variable } = member; + if (variable) { + member.priority += 2; + if (variable.mutated || variable.reassigned) member.priority += 4; + + // these determine whether variable is included in initial context + // array, so must have the highest priority + if (variable.export_name) member.priority += 8; + if (variable.referenced) member.priority += 16; + } + + if (!member.is_contextual) { + member.priority += 1; + } + }); + + this.context.sort((a, b) => b.priority - a.priority); + this.context.forEach((member, i) => member.index.value = i); } add_to_context(name: string, contextual = false) { if (!this.context_lookup.has(name)) { - const i = this.context.length; + const member: ContextMember = { + name, + index: { type: 'Literal', value: -1 }, // set later + is_contextual: false, + is_non_contextual: false, // shadowed vars could be contextual and non-contextual + variable: null, + priority: 0 + }; + + this.context_lookup.set(name, member); + this.context.push(member); + } + + const member = this.context_lookup.get(name); - this.context_lookup.set(name, i); - this.context.push(contextual ? null : name); + if (contextual) { + member.is_contextual = true; + } else { + member.is_non_contextual = true; + const variable = this.component.var_lookup.get(name); + member.variable = variable; } - return this.context_lookup.get(name); + return member; } invalidate(name: string, value?) { const variable = this.component.var_lookup.get(name); - const i = this.context_lookup.get(name); + const member = this.context_lookup.get(name); if (variable && (variable.subscribable && (variable.reassigned || variable.export_name))) { - return x`${`$$subscribe_${name}`}($$invalidate(${i}, ${value || name}))`; + return x`${`$$subscribe_${name}`}($$invalidate(${member.index}, ${value || name}))`; } if (name[0] === '$' && name[1] !== '$') { @@ -122,7 +164,7 @@ export default class Renderer { } if (value) { - return x`$$invalidate(${i}, ${value})`; + return x`$$invalidate(${member.index}, ${value})`; } // if this is a reactive declaration, invalidate dependencies recursively @@ -140,15 +182,46 @@ export default class Renderer { }); return Array.from(deps) - .map(n => x`$$invalidate(${this.context_lookup.get(n)}, ${n})`) + .map(n => x`$$invalidate(${this.context_lookup.get(n).index}, ${n})`) .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); } get_bitmask(names) { - return names.reduce((bits, name) => { - const bit = 1 << this.context_lookup.get(name); - return bits | bit; - }, 0); + const { context_lookup } = this; + + // names.forEach(name => { + // if (!context_lookup.has(name)) { + // console.log({ names }); + // throw new Error(`wut ${name}`); + // } + // }); + + return { + type: 'Literal', + + // we need to use a getter so that bitmasks can be determined + // lazily, once context has fully shaken out. TODO would be nice + // to do everything in a different order so that this isn't necessary + get value() { + return names.reduce((bits, name) => { + const member = context_lookup.get(name); + + if (!member) return bits; + + if (member.index.value === -1) { + throw new Error(`unset index`); + } + + // if (!member) { + // console.log({ names }); + // throw new Error(`wut ${name}`); + // } + + const bit = 1 << (member.index.value as number); + return bits | bit; + }, 0); + } + }; } changed(names, is_reactive_declaration = false) { @@ -165,17 +238,17 @@ export default class Renderer { } const { name, nodes } = flatten_reference(node); - const i = this.context_lookup.get(name); + const member = this.context_lookup.get(name); // TODO is this correct? if (this.component.var_lookup.get(name)) { this.component.add_reference(name); } - if (i !== undefined) { - const replacement = x`#ctx[${i}]` as MemberExpression; + if (member !== undefined) { + const replacement = x`#ctx[${member.index}]` as MemberExpression; - replacement.object.loc = nodes[0].loc; + if (nodes[0].loc) replacement.object.loc = nodes[0].loc; nodes[0] = replacement; return nodes.reduce((lhs, rhs) => x`${lhs}.${rhs}`); diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index d775abca47fa..f2b203a60bd7 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -104,7 +104,7 @@ export default function dom( kind: 'get', key: { type: 'Identifier', name: prop.export_name }, value: x`function() { - return ${prop.hoistable ? prop.name : x`this.$$.ctx[${renderer.context_lookup.get(prop.name)}]`} + return ${prop.hoistable ? prop.name : x`this.$$.ctx[${renderer.context_lookup.get(prop.name).index}]`} }` }); } else if (component.compile_options.dev) { @@ -222,7 +222,7 @@ export default function dom( component.rewrite_props(({ name, reassigned, export_name }) => { const value = `$${name}`; - const i = renderer.context_lookup.get(`$${name}`); + const i = renderer.context_lookup.get(`$${name}`).index; const insert = (reassigned || export_name) ? b`${`$$subscribe_${name}`}()` @@ -268,12 +268,31 @@ export default function dom( const instance_javascript = component.extract_javascript(component.ast.instance); + let i = renderer.context.length; + while (i--) { + const member = renderer.context[i]; + if (member.variable) { + if (member.variable.referenced || member.variable.export_name) break; + } else if (member.is_non_contextual) { + break; + } + } + const initial_context = renderer.context.slice(0, i + 1); + + // const initial_context = renderer.context.filter(member => { + // // return member.variable + // // ? (member.variable.referenced || member.variable.export_name) + // // : !member.is_contextual; + + // return member.variable || !member.is_contextual; + // }); + const has_definition = ( (instance_javascript && instance_javascript.length > 0) || filtered_props.length > 0 || uses_props || component.partly_hoisted.length > 0 || - renderer.context.length > 0 || + initial_context.length > 0 || component.reactive_declarations.length > 0 ); @@ -288,7 +307,7 @@ export default function dom( }) .map(({ name }) => b` ${component.compile_options.dev && b`@validate_store(${name.slice(1)}, '${name.slice(1)}');`} - @component_subscribe($$self, ${name.slice(1)}, $$value => $$invalidate(${renderer.context_lookup.get(name)}, ${name} = $$value)); + @component_subscribe($$self, ${name.slice(1)}, $$value => $$invalidate(${renderer.context_lookup.get(name).index}, ${name} = $$value)); `); const resubscribable_reactive_store_unsubscribers = reactive_stores @@ -308,7 +327,7 @@ export default function dom( const writable = dependencies.filter(n => { const variable = component.var_lookup.get(n); - return variable && (variable.writable || variable.mutated); + return variable && (variable.export_name || variable.mutated || variable.reassigned); }); const condition = !uses_props && writable.length > 0 && renderer.changed(writable, true); @@ -337,7 +356,7 @@ export default function dom( if (store && (store.reassigned || store.export_name)) { const unsubscribe = `$$unsubscribe_${name}`; const subscribe = `$$subscribe_${name}`; - const i = renderer.context_lookup.get($name); + const i = renderer.context_lookup.get($name).index; return b`let ${$name}, ${unsubscribe} = @noop, ${subscribe} = () => (${unsubscribe}(), ${unsubscribe} = @subscribe(${name}, $$value => $$invalidate(${i}, ${$name} = $$value)), ${name})`; } @@ -357,11 +376,10 @@ export default function dom( const return_value = { type: 'ArrayExpression', - elements: renderer.context - .map(name => name ? ({ - type: 'Identifier', - name - }) as Expression : x`null`) + elements: initial_context.map(member => ({ + type: 'Identifier', + name: member.name + }) as Expression) }; body.push(b` @@ -406,7 +424,7 @@ export default function dom( } const prop_indexes = x`{ - ${props.filter(v => !v.hoistable).map(v => p`${v.export_name}: ${renderer.context_lookup.get(v.name)}`)} + ${props.filter(v => v.export_name && !v.module).map(v => p`${v.export_name}: ${renderer.context_lookup.get(v.name).index}`)} }` as ObjectExpression; if (options.customElement) { diff --git a/src/compiler/compile/render_dom/invalidate.ts b/src/compiler/compile/render_dom/invalidate.ts index d51d7fe78763..ba72f9b7f143 100644 --- a/src/compiler/compile/render_dom/invalidate.ts +++ b/src/compiler/compile/render_dom/invalidate.ts @@ -52,7 +52,7 @@ export function invalidate(renderer: Renderer, scope: Scope, node: Node, names: let invalidate = is_store_value ? x`@set_store_value(${head.slice(1)}, ${node}, ${extra_args})` - : x`$$invalidate(${renderer.context_lookup.get(head)}, ${node}, ${extra_args})`; + : x`$$invalidate(${renderer.context_lookup.get(head).index}, ${node}, ${extra_args})`; if (variable.subscribable && variable.reassigned) { const subscribe = `$$subscribe_${head}`; diff --git a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts index caf216174681..9e2e657c47a3 100644 --- a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts @@ -118,6 +118,9 @@ export default class AwaitBlockWrapper extends Wrapper { if (has_outros) { block.add_outro(); } + + if (this.node.value) block.renderer.add_to_context(this.node.value, true); + if (this.node.error) block.renderer.add_to_context(this.node.error, true); } render( @@ -137,8 +140,8 @@ export default class AwaitBlockWrapper extends Wrapper { block.maintain_context = true; - const value_index = this.node.value && block.renderer.add_to_context(this.node.value, true); - const error_index = this.node.error && block.renderer.add_to_context(this.node.error, true); + const value_index = this.node.value && block.renderer.context_lookup.get(this.node.value).index; + const error_index = this.node.error && block.renderer.context_lookup.get(this.node.error).index; const info_props: any = x`{ ctx: #ctx, diff --git a/src/compiler/compile/render_dom/wrappers/EachBlock.ts b/src/compiler/compile/render_dom/wrappers/EachBlock.ts index 244e879e81c1..d1d55b1e5c29 100644 --- a/src/compiler/compile/render_dom/wrappers/EachBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/EachBlock.ts @@ -196,10 +196,10 @@ export default class EachBlockWrapper extends Wrapper { ? !this.next.is_dom_node() : !parent_node || !this.parent.is_dom_node(); - this.context_props = this.node.contexts.map(prop => b`child_ctx[${renderer.context_lookup.get(prop.key.name)}] = ${prop.modifier(x`list[i]`)};`); + this.context_props = this.node.contexts.map(prop => b`child_ctx[${renderer.context_lookup.get(prop.key.name).index}] = ${prop.modifier(x`list[i]`)};`); - if (this.node.has_binding) this.context_props.push(b`child_ctx[${renderer.context_lookup.get(this.vars.each_block_value.name)}] = list;`); - if (this.node.has_binding || this.node.index) this.context_props.push(b`child_ctx[${renderer.context_lookup.get(this.index_name.name)}] = i;`); + if (this.node.has_binding) this.context_props.push(b`child_ctx[${renderer.context_lookup.get(this.vars.each_block_value.name).index}] = list;`); + if (this.node.has_binding || this.node.index) this.context_props.push(b`child_ctx[${renderer.context_lookup.get(this.index_name.name).index}] = i;`); const snippet = this.node.expression.manipulate(block); @@ -476,9 +476,8 @@ export default class EachBlockWrapper extends Wrapper { } `); - const all_dependencies = new Set(this.block.dependencies); - const { dependencies } = this.node.expression; - dependencies.forEach((dependency: string) => { + const all_dependencies = new Set(this.block.dependencies); // TODO should be dynamic deps only + this.node.expression.dynamic_dependencies().forEach((dependency: string) => { all_dependencies.add(dependency); }); diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index 3417b563e200..315b347ef6ea 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -156,6 +156,7 @@ export default class InlineComponentWrapper extends Wrapper { } if (this.fragment) { + this.renderer.add_to_context('$$scope', true); const default_slot = this.slots.get('default'); this.fragment.nodes.forEach((child) => { diff --git a/src/compiler/compile/render_dom/wrappers/Window.ts b/src/compiler/compile/render_dom/wrappers/Window.ts index b13d4dd04306..9cd05fa2e85b 100644 --- a/src/compiler/compile/render_dom/wrappers/Window.ts +++ b/src/compiler/compile/render_dom/wrappers/Window.ts @@ -124,9 +124,6 @@ export default class WindowWrapper extends Wrapper { `); } - renderer.add_to_context(id.name); - const reference = renderer.reference(id.name); - component.partly_hoisted.push(b` function ${id}() { ${props.map(prop => renderer.invalidate(prop.name, x`${prop.name} = @_window.${prop.value}`))} @@ -134,7 +131,7 @@ export default class WindowWrapper extends Wrapper { `); block.chunks.init.push(b` - @add_render_callback(${reference}); + @add_render_callback(${fn}); `); component.has_reactive_assignments = true; diff --git a/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts b/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts index 170e9d87db26..082ac6f84127 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts @@ -25,13 +25,22 @@ export function get_slot_definition(block: Block, scope: TemplateScope, lets: Le const context = { type: 'ObjectExpression', - properties: Array.from(names).map(name => p`${block.renderer.context_lookup.get(name)}: ${name}`) + properties: Array.from(names).map(name => p`${block.renderer.context_lookup.get(name).index}: ${name}`) }; const changes = Array.from(names) .map(name => { - const i = block.renderer.context_lookup.get(name); - return x`${name} ? ${1 << i} : 0`; + const { context_lookup } = block.renderer; + + const literal = { + type: 'Literal', + get value() { + const i = context_lookup.get(name).index.value; + return 1 << i; + } + }; + + return x`${name} ? ${literal} : 0`; }) .reduce((lhs, rhs) => x`${lhs} | ${rhs}`); diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index 533377412577..9f9d43fd2df6 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -83,7 +83,7 @@ export function destroy_component(component, detaching) { // TODO null out other refs, including component.$$ (but need to // preserve final state?) $$.on_destroy = $$.fragment = null; - $$.ctx = {}; + $$.ctx = []; } } @@ -134,7 +134,7 @@ export function init(component, options, instance, create_fragment, not_equal, p } return ret; }) - : prop_values; + : []; $$.update(); ready = true; diff --git a/test/js/samples/component-store-access-invalidate/expected.js b/test/js/samples/component-store-access-invalidate/expected.js index b31c1e1a6ae5..36952ab21134 100644 --- a/test/js/samples/component-store-access-invalidate/expected.js +++ b/test/js/samples/component-store-access-invalidate/expected.js @@ -22,14 +22,14 @@ function create_fragment(ctx) { return { c() { h1 = element("h1"); - t = text(ctx[1]); + t = text(ctx[0]); }, m(target, anchor) { insert(target, h1, anchor); append(h1, t); }, p(ctx, changed) { - if (changed & 2) set_data(t, ctx[1]); + if (changed & 1) set_data(t, ctx[0]); }, i: noop, o: noop, @@ -42,8 +42,8 @@ function create_fragment(ctx) { function instance($$self, $$props, $$invalidate) { let $foo; const foo = writable(0); - component_subscribe($$self, foo, value => $$invalidate(1, $foo = value)); - return [foo, $foo]; + component_subscribe($$self, foo, value => $$invalidate(0, $foo = value)); + return [$foo]; } class Component extends SvelteComponent { diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js index ee34ad39aab0..11143ba909f6 100644 --- a/test/js/samples/debug-foo-bar-baz-things/expected.js +++ b/test/js/samples/debug-foo-bar-baz-things/expected.js @@ -194,7 +194,7 @@ function instance($$self, $$props, $$invalidate) { if ("baz" in $$props) $$invalidate(3, baz = $$props.baz); }; - return [things, foo, bar, baz, null, null, null]; + return [things, foo, bar, baz]; } class Component extends SvelteComponentDev { diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js index aae080ffef90..87e2927c0643 100644 --- a/test/js/samples/debug-foo/expected.js +++ b/test/js/samples/debug-foo/expected.js @@ -182,7 +182,7 @@ function instance($$self, $$props, $$invalidate) { if ("foo" in $$props) $$invalidate(1, foo = $$props.foo); }; - return [things, foo, null, null, null]; + return [things, foo]; } class Component extends SvelteComponentDev { diff --git a/test/js/samples/debug-no-dependencies/expected.js b/test/js/samples/debug-no-dependencies/expected.js index 0de3a53f858c..247e3eabdb24 100644 --- a/test/js/samples/debug-no-dependencies/expected.js +++ b/test/js/samples/debug-no-dependencies/expected.js @@ -89,7 +89,7 @@ function create_fragment(ctx) { insert_dev(target, each_1_anchor, anchor); }, p: function update(ctx, changed) { - if (changed & 1) { + if (changed & 0) { each_value = things; let i; diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js index 1f13224b30a6..07295eefbe18 100644 --- a/test/js/samples/deconflict-builtins/expected.js +++ b/test/js/samples/deconflict-builtins/expected.js @@ -108,7 +108,7 @@ function instance($$self, $$props, $$invalidate) { if ("createElement" in $$props) $$invalidate(0, createElement = $$props.createElement); }; - return [createElement, null, null, null]; + return [createElement]; } class Component extends SvelteComponent { diff --git a/test/js/samples/each-block-array-literal/expected.js b/test/js/samples/each-block-array-literal/expected.js index 8f6e902c217e..16f14910dc36 100644 --- a/test/js/samples/each-block-array-literal/expected.js +++ b/test/js/samples/each-block-array-literal/expected.js @@ -114,7 +114,7 @@ function instance($$self, $$props, $$invalidate) { if ("e" in $$props) $$invalidate(4, e = $$props.e); }; - return [a, b, c, d, e, null, null, null]; + return [a, b, c, d, e]; } class Component extends SvelteComponent { diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index 56c399cdc57e..38e839612669 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -159,7 +159,7 @@ function instance($$self, $$props, $$invalidate) { if ("foo" in $$props) $$invalidate(3, foo = $$props.foo); }; - return [comments, elapsed, time, foo, null, null, null]; + return [comments, elapsed, time, foo]; } class Component extends SvelteComponent { diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js index 780f5c6db267..463a63e88e1b 100644 --- a/test/js/samples/each-block-keyed-animated/expected.js +++ b/test/js/samples/each-block-keyed-animated/expected.js @@ -130,7 +130,7 @@ function instance($$self, $$props, $$invalidate) { if ("things" in $$props) $$invalidate(0, things = $$props.things); }; - return [things, null, null, null]; + return [things]; } class Component extends SvelteComponent { diff --git a/test/js/samples/each-block-keyed/expected.js b/test/js/samples/each-block-keyed/expected.js index dd72e418c7e1..80369af9f054 100644 --- a/test/js/samples/each-block-keyed/expected.js +++ b/test/js/samples/each-block-keyed/expected.js @@ -99,7 +99,7 @@ function instance($$self, $$props, $$invalidate) { if ("things" in $$props) $$invalidate(0, things = $$props.things); }; - return [things, null, null, null]; + return [things]; } class Component extends SvelteComponent { diff --git a/test/js/samples/reactive-values-non-topologically-ordered/expected.js b/test/js/samples/reactive-values-non-topologically-ordered/expected.js index e4a4cc6605b7..a98e81293f65 100644 --- a/test/js/samples/reactive-values-non-topologically-ordered/expected.js +++ b/test/js/samples/reactive-values-non-topologically-ordered/expected.js @@ -12,10 +12,10 @@ function instance($$self, $$props, $$invalidate) { $$self.$$.update = () => { if ($$self.$$.dirty & 1) { - $: $$invalidate("b", b = x); + $: $$invalidate(2, b = x); } - if ($$self.$$.dirty & 2) { + if ($$self.$$.dirty & 4) { $: a = b; } }; diff --git a/test/js/samples/setup-method/expected.js b/test/js/samples/setup-method/expected.js index 5ee43a9f1f16..8e30a03a7dd4 100644 --- a/test/js/samples/setup-method/expected.js +++ b/test/js/samples/setup-method/expected.js @@ -7,10 +7,14 @@ function foo(bar) { console.log(bar); } +function instance($$self, $$props, $$invalidate) { + return [foo]; +} + class Component extends SvelteComponent { constructor(options) { super(); - init(this, options, null, null, safe_not_equal, { foo: 0 }); + init(this, options, instance, null, safe_not_equal, { foo: 0 }); } get foo() { diff --git a/test/js/samples/unreferenced-state-not-invalidated/expected.js b/test/js/samples/unreferenced-state-not-invalidated/expected.js index f85026bc9bc0..0bd2531008b6 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/expected.js +++ b/test/js/samples/unreferenced-state-not-invalidated/expected.js @@ -39,7 +39,7 @@ function create_fragment(ctx) { } function instance($$self, $$props, $$invalidate) { - let a, b, c; + let a = 1, b = 2, c = 3; onMount(() => { const interval = setInterval( @@ -58,15 +58,12 @@ function instance($$self, $$props, $$invalidate) { let y; $$self.$$.update = () => { - if ($$self.$$.dirty === -1) { - $: x = a * 2; - } - if ($$self.$$.dirty & 2) { $: $$invalidate(0, y = b * 2); } }; + $: x = a * 2; return [y]; } diff --git a/test/js/samples/unreferenced-state-not-invalidated/input.svelte b/test/js/samples/unreferenced-state-not-invalidated/input.svelte index fff60f181d4c..a453f9a23e27 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/input.svelte +++ b/test/js/samples/unreferenced-state-not-invalidated/input.svelte @@ -1,7 +1,7 @@ + +

{_0}

+

{_1}

+

{_2}

+

{_3}

+

{_4}

+

{_5}

+

{_6}

+

{_7}

+

{_8}

+

{_9}

+

{_10}

+

{_11}

+

{_12}

+

{_13}

+

{_14}

+

{_15}

+

{_16}

+

{_17}

+

{_18}

+

{_19}

+

{_20}

+

{_21}

+

{_22}

+

{_23}

+

{_24}

+

{_25}

+

{_26}

+

{_27}

+

{_28}

+

{_29}

+

{_30}

+

{_31}

+

{_32}

+

{_33}

+

{_34}

+

{_35}

+

{_36}

+

{_37}

+

{_38}

+

{_39}

+

{_40}

\ No newline at end of file From aa6ad39a1d39a0458a28ba66af334d6fadad85ac Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 21 Nov 2019 14:31:51 -0500 Subject: [PATCH 31/43] stable sort --- src/compiler/compile/render_dom/Renderer.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 0c3574cd49fc..d800e670a111 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -39,7 +39,6 @@ export default class Renderer { this.file_var = options.dev && this.component.get_unique_name('file'); - // TODO sort vars, most frequently referenced first? component.vars.filter(v => !v.hoistable || (v.export_name && !v.module)).forEach(v => this.add_to_context(v.name)); // ensure store values are included in context @@ -109,7 +108,7 @@ export default class Renderer { } }); - this.context.sort((a, b) => b.priority - a.priority); + this.context.sort((a, b) => (b.priority - a.priority) || (a.name < b.name ? -1 : 1)); this.context.forEach((member, i) => member.index.value = i); } From 32421f66012fda81616e4ccba8f2ea903fec2bae Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 21 Nov 2019 14:46:39 -0500 Subject: [PATCH 32/43] stable sort that preserves order --- src/compiler/compile/render_dom/Renderer.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index d800e670a111..67e4640a5114 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -108,7 +108,7 @@ export default class Renderer { } }); - this.context.sort((a, b) => (b.priority - a.priority) || (a.name < b.name ? -1 : 1)); + this.context.sort((a, b) => (b.priority - a.priority) || ((a.index.value as number) - (b.index.value as number))); this.context.forEach((member, i) => member.index.value = i); } @@ -116,7 +116,7 @@ export default class Renderer { if (!this.context_lookup.has(name)) { const member: ContextMember = { name, - index: { type: 'Literal', value: -1 }, // set later + index: { type: 'Literal', value: this.context.length }, // index is updated later, but set here to preserve order within groups is_contextual: false, is_non_contextual: false, // shadowed vars could be contextual and non-contextual variable: null, From d475162f056e39063a243d52f7a2b6e9d42b2c27 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 21 Nov 2019 15:55:56 -0500 Subject: [PATCH 33/43] linting --- .eslintrc.js | 7 +------ package.json | 2 +- src/compiler/compile/nodes/shared/Expression.ts | 2 +- src/compiler/compile/render_dom/Renderer.ts | 4 ++-- src/compiler/compile/render_dom/wrappers/EachBlock.ts | 2 +- .../compile/render_dom/wrappers/InlineComponent/index.ts | 2 +- .../render_dom/wrappers/shared/get_slot_definition.ts | 2 +- src/runtime/internal/Component.ts | 2 +- 8 files changed, 9 insertions(+), 14 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 2023207f74de..c8ec8d1d01b0 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -35,12 +35,7 @@ module.exports = { argsIgnorePattern: '^_' } ], - '@typescript-eslint/no-object-literal-type-assertion': [ - 'error', - { - allowAsParameter: true - } - ], + '@typescript-eslint/no-object-literal-type-assertion': 'off', '@typescript-eslint/no-unused-vars': 'off' }, globals: { diff --git a/package.json b/package.json index 91723ee71403..8584ac6ff867 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,7 @@ "coverage": "c8 report --reporter=text-lcov > coverage.lcov && c8 report --reporter=html", "codecov": "codecov", "precodecov": "npm run coverage", - "build": "rollup -c", + "build": "rollup -c && npm run tsd", "prepare": "npm run build", "dev": "rollup -cw", "pretest": "npm run build", diff --git a/src/compiler/compile/nodes/shared/Expression.ts b/src/compiler/compile/nodes/shared/Expression.ts index aa25b8977198..1882c19267cd 100644 --- a/src/compiler/compile/nodes/shared/Expression.ts +++ b/src/compiler/compile/nodes/shared/Expression.ts @@ -9,7 +9,7 @@ import TemplateScope from './TemplateScope'; import get_object from '../../utils/get_object'; import Block from '../../render_dom/Block'; import is_dynamic from '../../render_dom/wrappers/shared/is_dynamic'; -import { x, b } from 'code-red'; +import { b } from 'code-red'; import { invalidate } from '../../render_dom/invalidate'; import { Node, FunctionExpression, Identifier } from 'estree'; import { TemplateNode } from '../../../interfaces'; diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 67e4640a5114..672eb3217da6 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -6,14 +6,14 @@ import { x } from 'code-red'; import { Node, Identifier, MemberExpression, Literal } from 'estree'; import flatten_reference from '../utils/flatten_reference'; -type ContextMember = { +interface ContextMember { name: string; index: Literal; is_contextual: boolean; is_non_contextual: boolean; variable: Var; priority: number; -}; +} export default class Renderer { component: Component; // TODO Maybe Renderer shouldn't know about Component? diff --git a/src/compiler/compile/render_dom/wrappers/EachBlock.ts b/src/compiler/compile/render_dom/wrappers/EachBlock.ts index d1d55b1e5c29..82e8e9abfd64 100644 --- a/src/compiler/compile/render_dom/wrappers/EachBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/EachBlock.ts @@ -205,7 +205,7 @@ export default class EachBlockWrapper extends Wrapper { block.chunks.init.push(b`let ${this.vars.each_block_value} = ${snippet};`); - // TODO which is better — Object.create(array) or array.slice()? + // TODO which is better — Object.create(array) or array.slice()? renderer.blocks.push(b` function ${this.vars.get_each_context}(#ctx, list, i) { const child_ctx = #ctx.slice(); diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index 315b347ef6ea..e093ade56c60 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -20,7 +20,7 @@ import { extract_names } from 'periscopic'; export default class InlineComponentWrapper extends Wrapper { var: Identifier; - slots: Map = new Map(); + slots: Map = new Map(); node: InlineComponent; fragment: FragmentWrapper; diff --git a/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts b/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts index 082ac6f84127..24ca813684b8 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/get_slot_definition.ts @@ -35,7 +35,7 @@ export function get_slot_definition(block: Block, scope: TemplateScope, lets: Le const literal = { type: 'Literal', get value() { - const i = context_lookup.get(name).index.value; + const i = context_lookup.get(name).index.value as number; return 1 << i; } }; diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index 9f9d43fd2df6..09368a4a2bc6 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -1,6 +1,6 @@ import { add_render_callback, flush, schedule_update, dirty_components } from './scheduler'; import { current_component, set_current_component } from './lifecycle'; -import { blank_object, is_function, run, run_all, noop, has_prop } from './utils'; +import { blank_object, is_function, run, run_all, noop } from './utils'; import { children } from './dom'; import { transition_in } from './transitions'; From ba9d5e16a325c6cc4554f181bf12aecedec5990e Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 21 Nov 2019 18:02:02 -0500 Subject: [PATCH 34/43] failing test for bitmask overflow --- .../samples/bitmask-overflow/_config.js | 10 ++ .../samples/bitmask-overflow/main.svelte | 91 ++++++++++--------- 2 files changed, 60 insertions(+), 41 deletions(-) diff --git a/test/runtime/samples/bitmask-overflow/_config.js b/test/runtime/samples/bitmask-overflow/_config.js index 7d550da0565c..7e9ad4d33bf7 100644 --- a/test/runtime/samples/bitmask-overflow/_config.js +++ b/test/runtime/samples/bitmask-overflow/_config.js @@ -44,6 +44,8 @@ export default { `, test({ assert, component, target }) { + component.reads = {}; + component._0 = 'a'; component._30 = 'b'; component._31 = 'c'; @@ -93,5 +95,13 @@ export default {

39

e

`); + + assert.deepEqual(component.reads, { + _0: 1, + _30: 1, + _31: 1, + _32: 1, + _40: 1 + }); } }; \ No newline at end of file diff --git a/test/runtime/samples/bitmask-overflow/main.svelte b/test/runtime/samples/bitmask-overflow/main.svelte index 20216786c206..c40c45e749c1 100644 --- a/test/runtime/samples/bitmask-overflow/main.svelte +++ b/test/runtime/samples/bitmask-overflow/main.svelte @@ -1,4 +1,6 @@ -

{_0}

-

{_1}

-

{_2}

-

{_3}

-

{_4}

-

{_5}

-

{_6}

-

{_7}

-

{_8}

-

{_9}

-

{_10}

-

{_11}

-

{_12}

-

{_13}

-

{_14}

-

{_15}

-

{_16}

-

{_17}

-

{_18}

-

{_19}

-

{_20}

-

{_21}

-

{_22}

-

{_23}

-

{_24}

-

{_25}

-

{_26}

-

{_27}

-

{_28}

-

{_29}

-

{_30}

-

{_31}

-

{_32}

-

{_33}

-

{_34}

-

{_35}

-

{_36}

-

{_37}

-

{_38}

-

{_39}

-

{_40}

\ No newline at end of file +

{read(_0, '_0')}

+

{read(_1, '_1')}

+

{read(_2, '_2')}

+

{read(_3, '_3')}

+

{read(_4, '_4')}

+

{read(_5, '_5')}

+

{read(_6, '_6')}

+

{read(_7, '_7')}

+

{read(_8, '_8')}

+

{read(_9, '_9')}

+

{read(_10, '_10')}

+

{read(_11, '_11')}

+

{read(_12, '_12')}

+

{read(_13, '_13')}

+

{read(_14, '_14')}

+

{read(_15, '_15')}

+

{read(_16, '_16')}

+

{read(_17, '_17')}

+

{read(_18, '_18')}

+

{read(_19, '_19')}

+

{read(_20, '_20')}

+

{read(_21, '_21')}

+

{read(_22, '_22')}

+

{read(_23, '_23')}

+

{read(_24, '_24')}

+

{read(_25, '_25')}

+

{read(_26, '_26')}

+

{read(_27, '_27')}

+

{read(_28, '_28')}

+

{read(_29, '_29')}

+

{read(_30, '_30')}

+

{read(_31, '_31')}

+

{read(_32, '_32')}

+

{read(_33, '_33')}

+

{read(_34, '_34')}

+

{read(_35, '_35')}

+

{read(_36, '_36')}

+

{read(_37, '_37')}

+

{read(_38, '_38')}

+

{read(_39, '_39')}

+

{read(_40, '_40')}

\ No newline at end of file From 0ad02a50975a11d50a0465044cd6949c4e7cac5b Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 14:40:31 -0500 Subject: [PATCH 35/43] ok i think this is it --- src/compiler/compile/render_dom/Block.ts | 10 +- src/compiler/compile/render_dom/Renderer.ts | 92 +++++++++++-------- src/compiler/compile/render_dom/index.ts | 12 ++- .../compile/render_dom/wrappers/Slot.ts | 5 +- src/runtime/internal/Component.ts | 12 +-- src/runtime/internal/scheduler.ts | 2 +- .../action-custom-event-handler/expected.js | 4 +- test/js/samples/bind-open/expected.js | 2 +- .../capture-inject-dev-only/expected.js | 2 +- .../expected.js | 2 +- .../samples/component-static-var/expected.js | 2 +- .../expected.js | 2 +- .../expected.js | 2 +- test/js/samples/data-attribute/expected.js | 2 +- test/js/samples/debug-empty/expected.js | 2 +- .../debug-foo-bar-baz-things/expected.js | 2 +- test/js/samples/debug-foo/expected.js | 2 +- test/js/samples/debug-hoisted/expected.js | 2 +- .../samples/debug-no-dependencies/expected.js | 2 +- .../samples/deconflict-builtins/expected.js | 2 +- .../expected.js | 2 +- .../each-block-array-literal/expected.js | 2 +- .../each-block-changed-check/expected.js | 2 +- .../each-block-keyed-animated/expected.js | 2 +- test/js/samples/each-block-keyed/expected.js | 2 +- .../samples/event-handler-dynamic/expected.js | 2 +- .../js/samples/if-block-no-update/expected.js | 2 +- test/js/samples/if-block-simple/expected.js | 4 +- .../expected.js | 2 +- .../inline-style-optimized-url/expected.js | 2 +- .../inline-style-optimized/expected.js | 2 +- .../inline-style-unoptimized/expected.js | 2 +- .../input-no-initial-value/expected.js | 2 +- test/js/samples/input-range/expected.js | 2 +- .../input-without-blowback-guard/expected.js | 2 +- .../expected.js | 2 +- .../expected.js | 2 +- .../expected.js | 2 +- .../expected.js | 2 +- test/js/samples/loop-protect/expected.js | 2 +- test/js/samples/media-bindings/expected.js | 2 +- .../samples/select-dynamic-value/expected.js | 2 +- .../samples/src-attribute-check/expected.js | 2 +- test/js/samples/title/expected.js | 2 +- test/js/samples/transition-local/expected.js | 4 +- .../transition-repeated-outro/expected.js | 2 +- .../samples/unchanged-expression/expected.js | 2 +- .../expected.js | 2 +- .../use-elements-as-anchors/expected.js | 12 +-- test/js/samples/video-bindings/expected.js | 2 +- .../samples/window-binding-scroll/expected.js | 2 +- .../samples/bitmask-overflow/_config.js | 23 ++++- .../samples/bitmask-overflow/main.svelte | 9 +- 53 files changed, 163 insertions(+), 108 deletions(-) diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts index b69955abaea3..a074eacc6615 100644 --- a/src/compiler/compile/render_dom/Block.ts +++ b/src/compiler/compile/render_dom/Block.ts @@ -1,7 +1,7 @@ import Renderer from './Renderer'; import Wrapper from './wrappers/shared/Wrapper'; import { b, x } from 'code-red'; -import { Node, Identifier } from 'estree'; +import { Node, Identifier, ArrayPattern } from 'estree'; import { is_head } from './wrappers/shared/is_head'; export interface BlockOptions { @@ -300,7 +300,13 @@ export default class Block { properties.update = noop; } else { const ctx = this.maintain_context ? x`#new_ctx` : x`#ctx`; - properties.update = x`function #update(${ctx}, #changed) { + + let changed: Identifier | ArrayPattern = { type: 'Identifier', name: '#changed' }; + if (!this.renderer.context_overflow && !this.parent) { + changed = { type: 'ArrayPattern', elements: [changed] } + } + + properties.update = x`function #update(${ctx}, ${changed}) { ${this.maintain_context && b`#ctx = ${ctx};`} ${this.chunks.update} }`; diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 672eb3217da6..44b9b1a8cba3 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -3,7 +3,7 @@ import { CompileOptions, Var } from '../../interfaces'; import Component from '../Component'; import FragmentWrapper from './wrappers/Fragment'; import { x } from 'code-red'; -import { Node, Identifier, MemberExpression, Literal } from 'estree'; +import { Node, Identifier, MemberExpression, Literal, Expression, BinaryExpression } from 'estree'; import flatten_reference from '../utils/flatten_reference'; interface ContextMember { @@ -21,6 +21,7 @@ export default class Renderer { context: ContextMember[] = []; context_lookup: Map = new Map(); + context_overflow: boolean; blocks: Array = []; readonly: Set = new Set(); meta_bindings: Array = []; // initial values for e.g. window.innerWidth, if there's a meta tag @@ -80,6 +81,8 @@ export default class Renderer { null ); + this.context_overflow = this.context.length > 31; + // TODO messy this.blocks.forEach(block => { if (block instanceof Block) { @@ -189,50 +192,67 @@ export default class Renderer { .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); } - get_bitmask(names) { - const { context_lookup } = this; + changed(names, is_reactive_declaration = false): Expression { + const renderer = this; - // names.forEach(name => { - // if (!context_lookup.has(name)) { - // console.log({ names }); - // throw new Error(`wut ${name}`); - // } - // }); + let changed = (is_reactive_declaration + ? x`$$self.$$.dirty` + : x`#changed`) as Identifier | MemberExpression; - return { - type: 'Literal', + const get_bitmask = () => names.reduce((bits, name) => { + const member = renderer.context_lookup.get(name); - // we need to use a getter so that bitmasks can be determined - // lazily, once context has fully shaken out. TODO would be nice - // to do everything in a different order so that this isn't necessary - get value() { - return names.reduce((bits, name) => { - const member = context_lookup.get(name); + if (!member) return bits; - if (!member) return bits; + if (member.index.value === -1) { + throw new Error(`unset index`); + } - if (member.index.value === -1) { - throw new Error(`unset index`); - } + const value = member.index.value as number; + const i = (value / 31) | 0; + const j = 1 << (value % 31); - // if (!member) { - // console.log({ names }); - // throw new Error(`wut ${name}`); - // } + bits[i] |= j; - const bit = 1 << (member.index.value as number); - return bits | bit; - }, 0); - } - }; - } + return bits; + }, Array((this.context.length / 31) | 0).fill(0)); - changed(names, is_reactive_declaration = false) { - const bitmask = this.get_bitmask(names); + let operator; + let left; + let right; - return is_reactive_declaration - ? x`$$self.$$.dirty & ${bitmask}` - : x`#changed & ${bitmask}`; + return { + get type() { + // we make the type a getter, even though it's always + // a BinaryExpression, because it gives us an opportunity + // to lazily create the node + + const bitmask = get_bitmask(); + + if (renderer.context_overflow) { + const expression = bitmask + .map((bits, i) => ({ bits, i })) + .filter(({ bits }) => bits) + .map(({ bits, i }) => x`${changed}[${i}] & ${bits}`) + .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); + + ({ operator, left, right } = expression); + } else { + ({ operator, left, right } = x`${changed} & ${bitmask[0] || 0}` as BinaryExpression); // TODO the `|| 0` case should never apply + } + + return 'BinaryExpression'; + }, + get operator() { + return operator; + }, + get left() { + return left; + }, + get right() { + return right; + } + } as Expression; } reference(node: string | Identifier | MemberExpression) { diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index f2b203a60bd7..c157077ef487 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -427,6 +427,14 @@ export default function dom( ${props.filter(v => v.export_name && !v.module).map(v => p`${v.export_name}: ${renderer.context_lookup.get(v.name).index}`)} }` as ObjectExpression; + let dirty; + if (renderer.context_overflow) { + dirty = x`[]`; + for (let i = 0; i < renderer.context.length; i += 31) { + dirty.elements.push(x`-1`); + } + } + if (options.customElement) { const declaration = b` class ${name} extends @SvelteElement { @@ -435,7 +443,7 @@ export default function dom( ${css.code && b`this.shadowRoot.innerHTML = \`\`;`} - @init(this, { target: this.shadowRoot }, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_indexes}); + @init(this, { target: this.shadowRoot }, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_indexes}, ${dirty}); ${dev_props_check} @@ -487,7 +495,7 @@ export default function dom( constructor(options) { super(${options.dev && `options`}); ${should_add_css && b`if (!@_document.getElementById("${component.stylesheet.id}-style")) ${add_css}();`} - @init(this, options, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_indexes}); + @init(this, options, ${definition}, ${has_create_fragment ? 'create_fragment': 'null'}, ${not_equal}, ${prop_indexes}, ${dirty}); ${options.dev && b`@dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "${name.name}", options, id: create_fragment.name });`} ${dev_props_check} diff --git a/src/compiler/compile/render_dom/wrappers/Slot.ts b/src/compiler/compile/render_dom/wrappers/Slot.ts index a477c6c006a4..d3583f3a6cf8 100644 --- a/src/compiler/compile/render_dom/wrappers/Slot.ts +++ b/src/compiler/compile/render_dom/wrappers/Slot.ts @@ -119,13 +119,12 @@ export default class SlotWrapper extends Wrapper { }); if (dynamic_dependencies.length > 0) { - const bitmask = renderer.get_bitmask(dynamic_dependencies); - changes.properties.push(p`${attribute.name}: #changes & ${bitmask}`); + changes.properties.push(p`${attribute.name}: ${renderer.changed(dynamic_dependencies)}`); } }); renderer.blocks.push(b` - const ${get_slot_changes_fn} = #changes => ${changes}; + const ${get_slot_changes_fn} = #changed => ${changes}; const ${get_slot_context_fn} = #ctx => ${get_slot_data(block, this.node.values)}; `); } else { diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index 09368a4a2bc6..a36ac237e215 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -21,7 +21,7 @@ interface Fragment { } // eslint-disable-next-line @typescript-eslint/class-name-casing interface T$$ { - dirty: number; + dirty: number[]; ctx: null|any; bound: any; update: () => void; @@ -88,15 +88,15 @@ export function destroy_component(component, detaching) { } function make_dirty(component, i) { - if (component.$$.dirty === -1) { + if (component.$$.dirty[0] === -1) { dirty_components.push(component); schedule_update(); - component.$$.dirty = 0; + component.$$.dirty.fill(0); } - component.$$.dirty |= (1 << i); + component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31)); } -export function init(component, options, instance, create_fragment, not_equal, props) { +export function init(component, options, instance, create_fragment, not_equal, props, dirty = [-1]) { const parent_component = current_component; set_current_component(component); @@ -121,7 +121,7 @@ export function init(component, options, instance, create_fragment, not_equal, p // everything else callbacks: blank_object(), - dirty: -1 + dirty }; let ready = false; diff --git a/src/runtime/internal/scheduler.ts b/src/runtime/internal/scheduler.ts index 46b52e1d8aa6..2f864743a2f4 100644 --- a/src/runtime/internal/scheduler.ts +++ b/src/runtime/internal/scheduler.ts @@ -74,7 +74,7 @@ function update($$) { $$.update(); run_all($$.before_update); $$.fragment && $$.fragment.p($$.ctx, $$.dirty); - $$.dirty = -1; + $$.dirty = [-1]; $$.after_update.forEach(add_render_callback); } diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js index f4120f5b50e3..00c4a1facc87 100644 --- a/test/js/samples/action-custom-event-handler/expected.js +++ b/test/js/samples/action-custom-event-handler/expected.js @@ -23,7 +23,7 @@ function create_fragment(ctx) { insert(target, button, anchor); foo_action = foo.call(null, button, ctx[1]) || ({}); }, - p(ctx, changed) { + p(ctx, [changed]) { if (is_function(foo_action.update) && changed & 1) foo_action.update.call(null, ctx[1]); }, i: noop, @@ -40,7 +40,7 @@ function handleFoo(bar) { } function foo(node, callback) { - + } function instance($$self, $$props, $$invalidate) { diff --git a/test/js/samples/bind-open/expected.js b/test/js/samples/bind-open/expected.js index d5680c0aa7ac..11299362f9c2 100644 --- a/test/js/samples/bind-open/expected.js +++ b/test/js/samples/bind-open/expected.js @@ -27,7 +27,7 @@ function create_fragment(ctx) { insert(target, details, anchor); details.open = ctx[0]; }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { details.open = ctx[0]; } diff --git a/test/js/samples/capture-inject-dev-only/expected.js b/test/js/samples/capture-inject-dev-only/expected.js index c1c81a1c4223..c001b97677f1 100644 --- a/test/js/samples/capture-inject-dev-only/expected.js +++ b/test/js/samples/capture-inject-dev-only/expected.js @@ -37,7 +37,7 @@ function create_fragment(ctx) { insert(target, input, anchor); set_input_value(input, ctx[0]); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) set_data(t0, ctx[0]); if (changed & 1 && input.value !== ctx[0]) { diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 0819a0de0123..8fd562b475d3 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -34,7 +34,7 @@ function create_fragment(ctx) { insert(target, p, anchor); append(p, t); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) set_data(t, ctx[0]); }, i: noop, diff --git a/test/js/samples/component-static-var/expected.js b/test/js/samples/component-static-var/expected.js index fcbc1306761b..c38660469302 100644 --- a/test/js/samples/component-static-var/expected.js +++ b/test/js/samples/component-static-var/expected.js @@ -46,7 +46,7 @@ function create_fragment(ctx) { set_input_value(input, ctx[0]); current = true; }, - p(ctx, changed) { + p(ctx, [changed]) { const bar_changes = {}; if (changed & 1) bar_changes.x = ctx[0]; bar.$set(bar_changes); diff --git a/test/js/samples/component-store-access-invalidate/expected.js b/test/js/samples/component-store-access-invalidate/expected.js index 36952ab21134..e84a0bc8fe4e 100644 --- a/test/js/samples/component-store-access-invalidate/expected.js +++ b/test/js/samples/component-store-access-invalidate/expected.js @@ -28,7 +28,7 @@ function create_fragment(ctx) { insert(target, h1, anchor); append(h1, t); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) set_data(t, ctx[0]); }, i: noop, diff --git a/test/js/samples/component-store-reassign-invalidate/expected.js b/test/js/samples/component-store-reassign-invalidate/expected.js index a36c37577de9..c878b19cc2ea 100644 --- a/test/js/samples/component-store-reassign-invalidate/expected.js +++ b/test/js/samples/component-store-reassign-invalidate/expected.js @@ -39,7 +39,7 @@ function create_fragment(ctx) { insert(target, t1, anchor); insert(target, button, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 2) set_data(t0, ctx[1]); }, i: noop, diff --git a/test/js/samples/data-attribute/expected.js b/test/js/samples/data-attribute/expected.js index 86ecc3716603..4a574b68ae61 100644 --- a/test/js/samples/data-attribute/expected.js +++ b/test/js/samples/data-attribute/expected.js @@ -29,7 +29,7 @@ function create_fragment(ctx) { insert(target, t, anchor); insert(target, div1, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { attr(div1, "data-foo", ctx[0]); } diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js index 572c33d73299..ad9949fe2ad6 100644 --- a/test/js/samples/debug-empty/expected.js +++ b/test/js/samples/debug-empty/expected.js @@ -44,7 +44,7 @@ function create_fragment(ctx) { append_dev(h1, t2); insert_dev(target, t3, anchor); }, - p: function update(ctx, changed) { + p: function update(ctx, [changed]) { if (changed & 1) set_data_dev(t1, ctx[0]); debugger; }, diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js index 11143ba909f6..d85fb1c0dcc8 100644 --- a/test/js/samples/debug-foo-bar-baz-things/expected.js +++ b/test/js/samples/debug-foo-bar-baz-things/expected.js @@ -119,7 +119,7 @@ function create_fragment(ctx) { append_dev(p, t1); append_dev(p, t2); }, - p: function update(ctx, changed) { + p: function update(ctx, [changed]) { if (changed & 1) { each_value = ctx[0]; let i; diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js index 87e2927c0643..2eeaf317361a 100644 --- a/test/js/samples/debug-foo/expected.js +++ b/test/js/samples/debug-foo/expected.js @@ -113,7 +113,7 @@ function create_fragment(ctx) { append_dev(p, t1); append_dev(p, t2); }, - p: function update(ctx, changed) { + p: function update(ctx, [changed]) { if (changed & 1) { each_value = ctx[0]; let i; diff --git a/test/js/samples/debug-hoisted/expected.js b/test/js/samples/debug-hoisted/expected.js index 22a5d21cdaac..7115f75cdcb8 100644 --- a/test/js/samples/debug-hoisted/expected.js +++ b/test/js/samples/debug-hoisted/expected.js @@ -23,7 +23,7 @@ function create_fragment(ctx) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); }, m: noop, - p: function update(ctx, changed) { + p: function update(ctx, [changed]) { if (changed & 3) { const obj = ctx[0]; const kobzol = ctx[1]; diff --git a/test/js/samples/debug-no-dependencies/expected.js b/test/js/samples/debug-no-dependencies/expected.js index 247e3eabdb24..107768317211 100644 --- a/test/js/samples/debug-no-dependencies/expected.js +++ b/test/js/samples/debug-no-dependencies/expected.js @@ -88,7 +88,7 @@ function create_fragment(ctx) { insert_dev(target, each_1_anchor, anchor); }, - p: function update(ctx, changed) { + p: function update(ctx, [changed]) { if (changed & 0) { each_value = things; let i; diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js index 07295eefbe18..2c64724ea1f1 100644 --- a/test/js/samples/deconflict-builtins/expected.js +++ b/test/js/samples/deconflict-builtins/expected.js @@ -68,7 +68,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { each_value = ctx[0]; let i; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index 42c0f17a415d..544759d9c752 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { append_dev(p, t1); append_dev(p, t2); }, - p: function update(ctx, changed) { + p: function update(ctx, [changed]) { if (changed & 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); if (changed & 2) set_data_dev(t2, ctx[1]); }, diff --git a/test/js/samples/each-block-array-literal/expected.js b/test/js/samples/each-block-array-literal/expected.js index 16f14910dc36..e59a929b22fe 100644 --- a/test/js/samples/each-block-array-literal/expected.js +++ b/test/js/samples/each-block-array-literal/expected.js @@ -68,7 +68,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 31) { each_value = [ctx[0], ctx[1], ctx[2], ctx[3], ctx[4]]; let i; diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index 38e839612669..4c27763200d6 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -110,7 +110,7 @@ function create_fragment(ctx) { insert(target, p, anchor); append(p, t1); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 7) { each_value = ctx[0]; let i; diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js index 463a63e88e1b..9033ead1c84f 100644 --- a/test/js/samples/each-block-keyed-animated/expected.js +++ b/test/js/samples/each-block-keyed-animated/expected.js @@ -91,7 +91,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { const each_value = ctx[0]; for (let i = 0; i < each_blocks.length; i += 1) each_blocks[i].r(); each_blocks = update_keyed_each(each_blocks, changed, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, fix_and_destroy_block, create_each_block, each_1_anchor, get_each_context); diff --git a/test/js/samples/each-block-keyed/expected.js b/test/js/samples/each-block-keyed/expected.js index 80369af9f054..6eb20971c352 100644 --- a/test/js/samples/each-block-keyed/expected.js +++ b/test/js/samples/each-block-keyed/expected.js @@ -76,7 +76,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { const each_value = ctx[0]; each_blocks = update_keyed_each(each_blocks, changed, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, destroy_block, create_each_block, each_1_anchor, get_each_context); }, diff --git a/test/js/samples/event-handler-dynamic/expected.js b/test/js/samples/event-handler-dynamic/expected.js index 77786162478e..ea76b5d4dc0a 100644 --- a/test/js/samples/event-handler-dynamic/expected.js +++ b/test/js/samples/event-handler-dynamic/expected.js @@ -61,7 +61,7 @@ function create_fragment(ctx) { insert(target, t5, anchor); insert(target, button2, anchor); }, - p(new_ctx, changed) { + p(new_ctx, [changed]) { ctx = new_ctx; if (changed & 2) set_data(t4, ctx[1]); }, diff --git a/test/js/samples/if-block-no-update/expected.js b/test/js/samples/if-block-no-update/expected.js index a7982a1f7de1..0db08dad9e10 100644 --- a/test/js/samples/if-block-no-update/expected.js +++ b/test/js/samples/if-block-no-update/expected.js @@ -65,7 +65,7 @@ function create_fragment(ctx) { if_block.m(target, anchor); insert(target, if_block_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (current_block_type !== (current_block_type = select_block_type(ctx, changed))) { if_block.d(1); if_block = current_block_type(ctx); diff --git a/test/js/samples/if-block-simple/expected.js b/test/js/samples/if-block-simple/expected.js index af311c43fee7..62e233f20943 100644 --- a/test/js/samples/if-block-simple/expected.js +++ b/test/js/samples/if-block-simple/expected.js @@ -40,14 +40,14 @@ function create_fragment(ctx) { if (if_block) if_block.m(target, anchor); insert(target, if_block_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (ctx[0]) { if (!if_block) { if_block = create_if_block(ctx); if_block.c(); if_block.m(if_block_anchor.parentNode, if_block_anchor); } else { - + } } else if (if_block) { if_block.d(1); diff --git a/test/js/samples/inline-style-optimized-multiple/expected.js b/test/js/samples/inline-style-optimized-multiple/expected.js index efb363729726..5bfe82497437 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected.js +++ b/test/js/samples/inline-style-optimized-multiple/expected.js @@ -22,7 +22,7 @@ function create_fragment(ctx) { m(target, anchor) { insert(target, div, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { set_style(div, "color", ctx[0]); } diff --git a/test/js/samples/inline-style-optimized-url/expected.js b/test/js/samples/inline-style-optimized-url/expected.js index 9d11d960557b..3710db996911 100644 --- a/test/js/samples/inline-style-optimized-url/expected.js +++ b/test/js/samples/inline-style-optimized-url/expected.js @@ -21,7 +21,7 @@ function create_fragment(ctx) { m(target, anchor) { insert(target, div, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { set_style(div, "background", "url(data:image/png;base64," + ctx[0] + ")"); } diff --git a/test/js/samples/inline-style-optimized/expected.js b/test/js/samples/inline-style-optimized/expected.js index f9def765d1ca..a5c160841c30 100644 --- a/test/js/samples/inline-style-optimized/expected.js +++ b/test/js/samples/inline-style-optimized/expected.js @@ -21,7 +21,7 @@ function create_fragment(ctx) { m(target, anchor) { insert(target, div, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { set_style(div, "color", ctx[0]); } diff --git a/test/js/samples/inline-style-unoptimized/expected.js b/test/js/samples/inline-style-unoptimized/expected.js index a40e0e7e7382..c244c332fa02 100644 --- a/test/js/samples/inline-style-unoptimized/expected.js +++ b/test/js/samples/inline-style-unoptimized/expected.js @@ -30,7 +30,7 @@ function create_fragment(ctx) { insert(target, t, anchor); insert(target, div1, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { attr(div0, "style", ctx[0]); } diff --git a/test/js/samples/input-no-initial-value/expected.js b/test/js/samples/input-no-initial-value/expected.js index 15f87b1d8115..0fe216292eff 100644 --- a/test/js/samples/input-no-initial-value/expected.js +++ b/test/js/samples/input-no-initial-value/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(form, t0); append(form, button); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } diff --git a/test/js/samples/input-range/expected.js b/test/js/samples/input-range/expected.js index ecf36ab2f619..db30d7c7838b 100644 --- a/test/js/samples/input-range/expected.js +++ b/test/js/samples/input-range/expected.js @@ -28,7 +28,7 @@ function create_fragment(ctx) { insert(target, input, anchor); set_input_value(input, ctx[0]); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { set_input_value(input, ctx[0]); } diff --git a/test/js/samples/input-without-blowback-guard/expected.js b/test/js/samples/input-without-blowback-guard/expected.js index aa52f72040b4..1a9459809cfe 100644 --- a/test/js/samples/input-without-blowback-guard/expected.js +++ b/test/js/samples/input-without-blowback-guard/expected.js @@ -25,7 +25,7 @@ function create_fragment(ctx) { insert(target, input, anchor); input.checked = ctx[0]; }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) { input.checked = ctx[0]; } diff --git a/test/js/samples/instrumentation-script-if-no-block/expected.js b/test/js/samples/instrumentation-script-if-no-block/expected.js index 70c5e25e8d3e..ca289069f939 100644 --- a/test/js/samples/instrumentation-script-if-no-block/expected.js +++ b/test/js/samples/instrumentation-script-if-no-block/expected.js @@ -39,7 +39,7 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) set_data(t3, ctx[0]); }, i: noop, diff --git a/test/js/samples/instrumentation-script-x-equals-x/expected.js b/test/js/samples/instrumentation-script-x-equals-x/expected.js index 9b25a9c4442e..3d43d2570031 100644 --- a/test/js/samples/instrumentation-script-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-script-x-equals-x/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, diff --git a/test/js/samples/instrumentation-template-if-no-block/expected.js b/test/js/samples/instrumentation-template-if-no-block/expected.js index 18dc615adfd6..7ef6bd8c9ab2 100644 --- a/test/js/samples/instrumentation-template-if-no-block/expected.js +++ b/test/js/samples/instrumentation-template-if-no-block/expected.js @@ -39,7 +39,7 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) set_data(t3, ctx[0]); }, i: noop, diff --git a/test/js/samples/instrumentation-template-x-equals-x/expected.js b/test/js/samples/instrumentation-template-x-equals-x/expected.js index 0b71f86a5b27..bd5bf249fae1 100644 --- a/test/js/samples/instrumentation-template-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-template-x-equals-x/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, diff --git a/test/js/samples/loop-protect/expected.js b/test/js/samples/loop-protect/expected.js index e2df5820e144..093cccf63c66 100644 --- a/test/js/samples/loop-protect/expected.js +++ b/test/js/samples/loop-protect/expected.js @@ -68,7 +68,7 @@ function instance($$self) { }; $$self.$inject_state = $$props => { - + }; $: { diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js index 0ebd19b4da05..6387e0ca31aa 100644 --- a/test/js/samples/media-bindings/expected.js +++ b/test/js/samples/media-bindings/expected.js @@ -67,7 +67,7 @@ function create_fragment(ctx) { audio.playbackRate = ctx[7]; } }, - p(ctx, changed) { + p(ctx, [changed]) { if (!audio_updating && changed & 8 && !isNaN(ctx[3])) { audio.currentTime = ctx[3]; } diff --git a/test/js/samples/select-dynamic-value/expected.js b/test/js/samples/select-dynamic-value/expected.js index efa4662297b5..03a7fc2b57ed 100644 --- a/test/js/samples/select-dynamic-value/expected.js +++ b/test/js/samples/select-dynamic-value/expected.js @@ -43,7 +43,7 @@ function create_fragment(ctx) { } } }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1 && select_value_value !== (select_value_value = ctx[0])) { for (var i = 0; i < select.options.length; i += 1) { var option = select.options[i]; diff --git a/test/js/samples/src-attribute-check/expected.js b/test/js/samples/src-attribute-check/expected.js index bf11b3821dce..bfdf7a01c842 100644 --- a/test/js/samples/src-attribute-check/expected.js +++ b/test/js/samples/src-attribute-check/expected.js @@ -44,7 +44,7 @@ function create_fragment(ctx) { insert(target, t, anchor); insert(target, img1, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1 && img0.src !== (img0_src_value = ctx[0])) { attr(img0, "src", img0_src_value); } diff --git a/test/js/samples/title/expected.js b/test/js/samples/title/expected.js index b091b2a5164d..800bf9801a4b 100644 --- a/test/js/samples/title/expected.js +++ b/test/js/samples/title/expected.js @@ -8,7 +8,7 @@ function create_fragment(ctx) { return { c: noop, m: noop, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { document.title = title_value; } diff --git a/test/js/samples/transition-local/expected.js b/test/js/samples/transition-local/expected.js index 63f3ec4692b9..c93f66026b70 100644 --- a/test/js/samples/transition-local/expected.js +++ b/test/js/samples/transition-local/expected.js @@ -91,7 +91,7 @@ function create_fragment(ctx) { if (if_block) if_block.m(target, anchor); insert(target, if_block_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (ctx[0]) { if (if_block) { if_block.p(ctx, changed); @@ -115,7 +115,7 @@ function create_fragment(ctx) { } function foo() { - + } function instance($$self, $$props, $$invalidate) { diff --git a/test/js/samples/transition-repeated-outro/expected.js b/test/js/samples/transition-repeated-outro/expected.js index 898bfb63a5ea..62f0e86bd853 100644 --- a/test/js/samples/transition-repeated-outro/expected.js +++ b/test/js/samples/transition-repeated-outro/expected.js @@ -61,7 +61,7 @@ function create_fragment(ctx) { insert(target, if_block_anchor, anchor); current = true; }, - p(ctx, changed) { + p(ctx, [changed]) { if (ctx[0] < 5) { if (!if_block) { if_block = create_if_block(ctx); diff --git a/test/js/samples/unchanged-expression/expected.js b/test/js/samples/unchanged-expression/expected.js index f726af14a12d..9c4e31aa691d 100644 --- a/test/js/samples/unchanged-expression/expected.js +++ b/test/js/samples/unchanged-expression/expected.js @@ -56,7 +56,7 @@ function create_fragment(ctx) { append(p3, t8); append(p3, t9); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) set_data(t9, ctx[0]); }, i: noop, diff --git a/test/js/samples/unreferenced-state-not-invalidated/expected.js b/test/js/samples/unreferenced-state-not-invalidated/expected.js index 0bd2531008b6..b4e74b1a85d2 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/expected.js +++ b/test/js/samples/unreferenced-state-not-invalidated/expected.js @@ -27,7 +27,7 @@ function create_fragment(ctx) { insert(target, p, anchor); append(p, t); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1) set_data(t, ctx[0]); }, i: noop, diff --git a/test/js/samples/use-elements-as-anchors/expected.js b/test/js/samples/use-elements-as-anchors/expected.js index fc77218bf81c..a5db96f4fecc 100644 --- a/test/js/samples/use-elements-as-anchors/expected.js +++ b/test/js/samples/use-elements-as-anchors/expected.js @@ -155,14 +155,14 @@ function create_fragment(ctx) { if (if_block4) if_block4.m(target, anchor); insert(target, if_block4_anchor, anchor); }, - p(ctx, changed) { + p(ctx, [changed]) { if (ctx[0]) { if (!if_block0) { if_block0 = create_if_block_4(ctx); if_block0.c(); if_block0.m(div, t0); } else { - + } } else if (if_block0) { if_block0.d(1); @@ -175,7 +175,7 @@ function create_fragment(ctx) { if_block1.c(); if_block1.m(div, t3); } else { - + } } else if (if_block1) { if_block1.d(1); @@ -188,7 +188,7 @@ function create_fragment(ctx) { if_block2.c(); if_block2.m(div, t4); } else { - + } } else if (if_block2) { if_block2.d(1); @@ -201,7 +201,7 @@ function create_fragment(ctx) { if_block3.c(); if_block3.m(div, null); } else { - + } } else if (if_block3) { if_block3.d(1); @@ -214,7 +214,7 @@ function create_fragment(ctx) { if_block4.c(); if_block4.m(if_block4_anchor.parentNode, if_block4_anchor); } else { - + } } else if (if_block4) { if_block4.d(1); diff --git a/test/js/samples/video-bindings/expected.js b/test/js/samples/video-bindings/expected.js index 43241d51ffc0..6f19bc9d49f7 100644 --- a/test/js/samples/video-bindings/expected.js +++ b/test/js/samples/video-bindings/expected.js @@ -47,7 +47,7 @@ function create_fragment(ctx) { insert(target, video, anchor); video_resize_listener = add_resize_listener(video, ctx[4].bind(video)); }, - p(ctx, changed) { + p(ctx, [changed]) { if (!video_updating && changed & 1 && !isNaN(ctx[0])) { video.currentTime = ctx[0]; } diff --git a/test/js/samples/window-binding-scroll/expected.js b/test/js/samples/window-binding-scroll/expected.js index 254fb81966d6..09041d17b44d 100644 --- a/test/js/samples/window-binding-scroll/expected.js +++ b/test/js/samples/window-binding-scroll/expected.js @@ -46,7 +46,7 @@ function create_fragment(ctx) { append(p, t0); append(p, t1); }, - p(ctx, changed) { + p(ctx, [changed]) { if (changed & 1 && !scrolling) { scrolling = true; clearTimeout(scrolling_timeout); diff --git a/test/runtime/samples/bitmask-overflow/_config.js b/test/runtime/samples/bitmask-overflow/_config.js index 7e9ad4d33bf7..fdd7bff81368 100644 --- a/test/runtime/samples/bitmask-overflow/_config.js +++ b/test/runtime/samples/bitmask-overflow/_config.js @@ -41,6 +41,9 @@ export default {

38

39

40

+

5:36

+

6:37

+

38

`, test({ assert, component, target }) { @@ -52,14 +55,19 @@ export default { component._32 = 'd'; component._40 = 'e'; + component._5 = 'f'; + component._6 = 'g'; + component._36 = 'h'; + component._37 = 'i'; + assert.htmlEqual(target.innerHTML, `

a

1

2

3

4

-

5

-

6

+

f

+

g

7

8

9

@@ -89,18 +97,25 @@ export default {

33

34

35

-

36

-

37

+

h

+

i

38

39

e

+

f:h

+

g:i

+

38

`); assert.deepEqual(component.reads, { _0: 1, + _5: 2, + _6: 3, _30: 1, _31: 1, _32: 1, + _36: 2, + _37: 3, _40: 1 }); } diff --git a/test/runtime/samples/bitmask-overflow/main.svelte b/test/runtime/samples/bitmask-overflow/main.svelte index c40c45e749c1..32eb8802daab 100644 --- a/test/runtime/samples/bitmask-overflow/main.svelte +++ b/test/runtime/samples/bitmask-overflow/main.svelte @@ -43,6 +43,9 @@ export let _39 = '39'; export let _40 = '40'; + $: foo = read(_6, '_6') + ':' + read(_37, '_37'); + $: bar = read(_38, '_38'); + const read = (value, label) => { if (!reads[label]) reads[label] = 0; reads[label] += 1; @@ -91,4 +94,8 @@

{read(_37, '_37')}

{read(_38, '_38')}

{read(_39, '_39')}

-

{read(_40, '_40')}

\ No newline at end of file +

{read(_40, '_40')}

+ +

{read(_5, '_5') + ':' + read(_36, '_36')}

+

{foo}

+

{bar}

\ No newline at end of file From fb732e5b5bc9eed14ce0c3a0e82aebabe0918922 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 14:47:57 -0500 Subject: [PATCH 36/43] lint --- src/compiler/compile/render_dom/Block.ts | 2 +- src/compiler/compile/render_dom/Renderer.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts index a074eacc6615..9e22e6be4422 100644 --- a/src/compiler/compile/render_dom/Block.ts +++ b/src/compiler/compile/render_dom/Block.ts @@ -303,7 +303,7 @@ export default class Block { let changed: Identifier | ArrayPattern = { type: 'Identifier', name: '#changed' }; if (!this.renderer.context_overflow && !this.parent) { - changed = { type: 'ArrayPattern', elements: [changed] } + changed = { type: 'ArrayPattern', elements: [changed] }; } properties.update = x`function #update(${ctx}, ${changed}) { diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 44b9b1a8cba3..fb56be160fa9 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -195,7 +195,7 @@ export default class Renderer { changed(names, is_reactive_declaration = false): Expression { const renderer = this; - let changed = (is_reactive_declaration + const changed = (is_reactive_declaration ? x`$$self.$$.dirty` : x`#changed`) as Identifier | MemberExpression; From 9659602d4f7a009ea7afa851274fafb4484be9b2 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 14:55:47 -0500 Subject: [PATCH 37/43] rename changed to dirty, for more internal consistency --- src/compiler/compile/Component.ts | 1 - src/compiler/compile/render_dom/Block.ts | 6 ++-- src/compiler/compile/render_dom/Renderer.ts | 14 ++++---- src/compiler/compile/render_dom/index.ts | 10 +----- .../compile/render_dom/wrappers/AwaitBlock.ts | 6 ++-- .../compile/render_dom/wrappers/DebugTag.ts | 2 +- .../compile/render_dom/wrappers/EachBlock.ts | 8 ++--- .../render_dom/wrappers/Element/Attribute.ts | 2 +- .../render_dom/wrappers/Element/Binding.ts | 2 +- .../wrappers/Element/StyleAttribute.ts | 2 +- .../render_dom/wrappers/Element/index.ts | 4 +-- .../compile/render_dom/wrappers/IfBlock.ts | 34 +++++++++---------- .../wrappers/InlineComponent/index.ts | 12 +++---- .../compile/render_dom/wrappers/Slot.ts | 8 ++--- .../compile/render_dom/wrappers/Title.ts | 2 +- .../compile/render_dom/wrappers/Window.ts | 2 +- .../compile/render_dom/wrappers/shared/Tag.ts | 2 +- .../render_dom/wrappers/shared/add_actions.ts | 2 +- src/runtime/internal/Component.ts | 2 +- src/runtime/internal/keyed_each.ts | 4 +-- src/runtime/internal/utils.ts | 6 ++-- 21 files changed, 62 insertions(+), 69 deletions(-) diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts index 46704fd7ff4c..0df89a25de4a 100644 --- a/src/compiler/compile/Component.ts +++ b/src/compiler/compile/Component.ts @@ -209,7 +209,6 @@ export default class Component { }); const subscribable_name = name.slice(1); - // this.add_reference(subscribable_name); const variable = this.var_lookup.get(subscribable_name); if (variable) variable.subscribable = true; diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts index 9e22e6be4422..c8fa88472161 100644 --- a/src/compiler/compile/render_dom/Block.ts +++ b/src/compiler/compile/render_dom/Block.ts @@ -301,12 +301,12 @@ export default class Block { } else { const ctx = this.maintain_context ? x`#new_ctx` : x`#ctx`; - let changed: Identifier | ArrayPattern = { type: 'Identifier', name: '#changed' }; + let dirty: Identifier | ArrayPattern = { type: 'Identifier', name: '#dirty' }; if (!this.renderer.context_overflow && !this.parent) { - changed = { type: 'ArrayPattern', elements: [changed] }; + dirty = { type: 'ArrayPattern', elements: [dirty] }; } - properties.update = x`function #update(${ctx}, ${changed}) { + properties.update = x`function #update(${ctx}, ${dirty}) { ${this.maintain_context && b`#ctx = ${ctx};`} ${this.chunks.update} }`; diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index fb56be160fa9..90c4aec234fc 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -192,12 +192,12 @@ export default class Renderer { .reduce((lhs, rhs) => x`${lhs}, ${rhs}}`); } - changed(names, is_reactive_declaration = false): Expression { + dirty(names, is_reactive_declaration = false): Expression { const renderer = this; - const changed = (is_reactive_declaration + const dirty = (is_reactive_declaration ? x`$$self.$$.dirty` - : x`#changed`) as Identifier | MemberExpression; + : x`#dirty`) as Identifier | MemberExpression; const get_bitmask = () => names.reduce((bits, name) => { const member = renderer.context_lookup.get(name); @@ -225,7 +225,9 @@ export default class Renderer { get type() { // we make the type a getter, even though it's always // a BinaryExpression, because it gives us an opportunity - // to lazily create the node + // to lazily create the node. TODO would be better if + // context was determined before rendering, so that + // this indirection was unnecessary const bitmask = get_bitmask(); @@ -233,12 +235,12 @@ export default class Renderer { const expression = bitmask .map((bits, i) => ({ bits, i })) .filter(({ bits }) => bits) - .map(({ bits, i }) => x`${changed}[${i}] & ${bits}`) + .map(({ bits, i }) => x`${dirty}[${i}] & ${bits}`) .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); ({ operator, left, right } = expression); } else { - ({ operator, left, right } = x`${changed} & ${bitmask[0] || 0}` as BinaryExpression); // TODO the `|| 0` case should never apply + ({ operator, left, right } = x`${dirty} & ${bitmask[0] || 0}` as BinaryExpression); // TODO the `|| 0` case should never apply } return 'BinaryExpression'; diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index c157077ef487..559b99f85a1a 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -279,14 +279,6 @@ export default function dom( } const initial_context = renderer.context.slice(0, i + 1); - // const initial_context = renderer.context.filter(member => { - // // return member.variable - // // ? (member.variable.referenced || member.variable.export_name) - // // : !member.is_contextual; - - // return member.variable || !member.is_contextual; - // }); - const has_definition = ( (instance_javascript && instance_javascript.length > 0) || filtered_props.length > 0 || @@ -330,7 +322,7 @@ export default function dom( return variable && (variable.export_name || variable.mutated || variable.reassigned); }); - const condition = !uses_props && writable.length > 0 && renderer.changed(writable, true); + const condition = !uses_props && writable.length > 0 && renderer.dirty(writable, true); let statement = d.node; // TODO remove label (use d.node.body) if it's not referenced diff --git a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts index 9e2e657c47a3..8ce7495fd7bf 100644 --- a/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/AwaitBlock.ts @@ -192,7 +192,7 @@ export default class AwaitBlockWrapper extends Wrapper { if (dependencies.length > 0) { const condition = x` - ${block.renderer.changed(dependencies)} && + ${block.renderer.dirty(dependencies)} && ${promise} !== (${promise} = ${snippet}) && @handle_promise(${promise}, ${info})`; @@ -207,7 +207,7 @@ export default class AwaitBlockWrapper extends Wrapper { } else { const #child_ctx = #ctx.slice(); #child_ctx[${value_index}] = ${info}.resolved; - ${info}.block.p(#child_ctx, #changed); + ${info}.block.p(#child_ctx, #dirty); } `); } else { @@ -221,7 +221,7 @@ export default class AwaitBlockWrapper extends Wrapper { { const #child_ctx = #ctx.slice(); #child_ctx[${value_index}] = ${info}.resolved; - ${info}.block.p(#child_ctx, #changed); + ${info}.block.p(#child_ctx, #dirty); } `); } diff --git a/src/compiler/compile/render_dom/wrappers/DebugTag.ts b/src/compiler/compile/render_dom/wrappers/DebugTag.ts index f3a626c76859..442b548994f2 100644 --- a/src/compiler/compile/render_dom/wrappers/DebugTag.ts +++ b/src/compiler/compile/render_dom/wrappers/DebugTag.ts @@ -69,7 +69,7 @@ export default class DebugTagWrapper extends Wrapper { debugger;`; if (dependencies.size) { - const condition = renderer.changed(Array.from(dependencies)); + const condition = renderer.dirty(Array.from(dependencies)); block.chunks.update.push(b` if (${condition}) { diff --git a/src/compiler/compile/render_dom/wrappers/EachBlock.ts b/src/compiler/compile/render_dom/wrappers/EachBlock.ts index 82e8e9abfd64..5b13b486e61d 100644 --- a/src/compiler/compile/render_dom/wrappers/EachBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/EachBlock.ts @@ -277,7 +277,7 @@ export default class EachBlockWrapper extends Wrapper { if (this.else.block.has_update_method) { block.chunks.update.push(b` if (!${this.vars.data_length} && ${each_block_else}) { - ${each_block_else}.p(#ctx, #changed); + ${each_block_else}.p(#ctx, #dirty); } else if (!${this.vars.data_length}) { ${each_block_else} = ${this.else.block.name}(#ctx); ${each_block_else}.c(); @@ -403,7 +403,7 @@ export default class EachBlockWrapper extends Wrapper { ${this.block.has_outros && b`@group_outros();`} ${this.node.has_animation && b`for (let #i = 0; #i < ${view_length}; #i += 1) ${iterations}[#i].r();`} - ${iterations} = @update_keyed_each(${iterations}, #changed, ${get_key}, ${dynamic ? 1 : 0}, #ctx, ${this.vars.each_block_value}, ${lookup}, ${update_mount_node}, ${destroy}, ${create_each_block}, ${update_anchor_node}, ${this.vars.get_each_context}); + ${iterations} = @update_keyed_each(${iterations}, #dirty, ${get_key}, ${dynamic ? 1 : 0}, #ctx, ${this.vars.each_block_value}, ${lookup}, ${update_mount_node}, ${destroy}, ${create_each_block}, ${update_anchor_node}, ${this.vars.get_each_context}); ${this.node.has_animation && b`for (let #i = 0; #i < ${view_length}; #i += 1) ${iterations}[#i].a();`} ${this.block.has_outros && b`@check_outros();`} `); @@ -487,7 +487,7 @@ export default class EachBlockWrapper extends Wrapper { const for_loop_body = this.block.has_update_method ? b` if (${iterations}[#i]) { - ${iterations}[#i].p(child_ctx, #changed); + ${iterations}[#i].p(child_ctx, #dirty); ${has_transitions && b`@transition_in(${this.vars.iterations}[#i], 1);`} } else { ${iterations}[#i] = ${create_each_block}(child_ctx); @@ -560,7 +560,7 @@ export default class EachBlockWrapper extends Wrapper { `; block.chunks.update.push(b` - if (${block.renderer.changed(Array.from(all_dependencies))}) { + if (${block.renderer.dirty(Array.from(all_dependencies))}) { ${update} } `); diff --git a/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts b/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts index eb9dfe8e4711..d796dc2ab33c 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/Attribute.ts @@ -139,7 +139,7 @@ export default class AttributeWrapper { } if (dependencies.length > 0) { - let condition = block.renderer.changed(dependencies); + let condition = block.renderer.dirty(dependencies); if (should_cache) { condition = is_src diff --git a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts index bd244cf559b0..7244d9203d55 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/Binding.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/Binding.ts @@ -90,7 +90,7 @@ export default class BindingWrapper { const dependency_array = [...this.node.expression.dependencies]; if (dependency_array.length > 0) { - update_conditions.push(block.renderer.changed(dependency_array)); + update_conditions.push(block.renderer.dirty(dependency_array)); } if (parent.node.name === 'input') { diff --git a/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts b/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts index 828df569658a..9dc36dabf58c 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/StyleAttribute.ts @@ -45,7 +45,7 @@ export default class StyleAttributeWrapper extends AttributeWrapper { // } if (prop_dependencies.size) { - let condition = block.renderer.changed(Array.from(prop_dependencies)); + let condition = block.renderer.dirty(Array.from(prop_dependencies)); if (block.has_outros) { condition = x`!#current || ${condition}`; diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index 467578abf9c7..cd660f202c08 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -624,7 +624,7 @@ export default class ElementWrapper extends Wrapper { this.attributes .forEach(attr => { const condition = attr.node.dependencies.size > 0 - ? block.renderer.changed(Array.from(attr.node.dependencies)) + ? block.renderer.dirty(Array.from(attr.node.dependencies)) : null; if (attr.node.is_spread) { @@ -857,7 +857,7 @@ export default class ElementWrapper extends Wrapper { block.chunks.update.push(updater); } else if ((dependencies && dependencies.size > 0) || this.class_dependencies.length) { const all_dependencies = this.class_dependencies.concat(...dependencies); - const condition = block.renderer.changed(all_dependencies); + const condition = block.renderer.dirty(all_dependencies); block.chunks.update.push(b` if (${condition}) { diff --git a/src/compiler/compile/render_dom/wrappers/IfBlock.ts b/src/compiler/compile/render_dom/wrappers/IfBlock.ts index 0a09a3ffa1af..d2d4c7948609 100644 --- a/src/compiler/compile/render_dom/wrappers/IfBlock.ts +++ b/src/compiler/compile/render_dom/wrappers/IfBlock.ts @@ -266,12 +266,12 @@ export default class IfBlockWrapper extends Wrapper { /* eslint-disable @typescript-eslint/indent,indent */ if (this.needs_update) { block.chunks.init.push(b` - function ${select_block_type}(#ctx, #changed) { + function ${select_block_type}(#ctx, #dirty) { ${this.branches.map(({ dependencies, condition, snippet, block }) => condition ? b` ${snippet && ( dependencies.length > 0 - ? b`if (${condition} == null || ${block.renderer.changed(dependencies)}) ${condition} = !!${snippet}` + ? b`if (${condition} == null || ${block.renderer.dirty(dependencies)}) ${condition} = !!${snippet}` : b`if (${condition} == null) ${condition} = !!${snippet}` )} if (${condition}) return ${block.name};` @@ -280,7 +280,7 @@ export default class IfBlockWrapper extends Wrapper { `); } else { block.chunks.init.push(b` - function ${select_block_type}(#ctx, #changed) { + function ${select_block_type}(#ctx, #dirty) { ${this.branches.map(({ condition, snippet, block }) => condition ? b`if (${snippet || condition}) return ${block.name};` : b`return ${block.name};`)} @@ -322,21 +322,21 @@ export default class IfBlockWrapper extends Wrapper { if (dynamic) { block.chunks.update.push(b` - if (${current_block_type} === (${current_block_type} = ${select_block_type}(#ctx, #changed)) && ${name}) { - ${name}.p(#ctx, #changed); + if (${current_block_type} === (${current_block_type} = ${select_block_type}(#ctx, #dirty)) && ${name}) { + ${name}.p(#ctx, #dirty); } else { ${change_block} } `); } else { block.chunks.update.push(b` - if (${current_block_type} !== (${current_block_type} = ${select_block_type}(#ctx, #changed))) { + if (${current_block_type} !== (${current_block_type} = ${select_block_type}(#ctx, #dirty))) { ${change_block} } `); } } else if (dynamic) { - block.chunks.update.push(b`${name}.p(#ctx, #changed);`); + block.chunks.update.push(b`${name}.p(#ctx, #dirty);`); } if (if_exists_condition) { @@ -385,12 +385,12 @@ export default class IfBlockWrapper extends Wrapper { ${this.needs_update ? b` - function ${select_block_type}(#ctx, #changed) { + function ${select_block_type}(#ctx, #dirty) { ${this.branches.map(({ dependencies, condition, snippet }, i) => condition ? b` ${snippet && ( dependencies.length > 0 - ? b`if (${block.renderer.changed(dependencies)}) ${condition} = !!${snippet}` + ? b`if (${block.renderer.dirty(dependencies)}) ${condition} = !!${snippet}` : b`if (${condition} == -1) ${condition} = !!${snippet}` )} if (${condition}) return ${i};` @@ -399,7 +399,7 @@ export default class IfBlockWrapper extends Wrapper { } ` : b` - function ${select_block_type}(#ctx, #changed) { + function ${select_block_type}(#ctx, #dirty) { ${this.branches.map(({ condition, snippet }, i) => condition ? b`if (${snippet || condition}) return ${i};` : b`return ${i};`)} @@ -473,9 +473,9 @@ export default class IfBlockWrapper extends Wrapper { if (dynamic) { block.chunks.update.push(b` let ${previous_block_index} = ${current_block_type_index}; - ${current_block_type_index} = ${select_block_type}(#ctx, #changed); + ${current_block_type_index} = ${select_block_type}(#ctx, #dirty); if (${current_block_type_index} === ${previous_block_index}) { - ${if_current_block_type_index(b`${if_blocks}[${current_block_type_index}].p(#ctx, #changed);`)} + ${if_current_block_type_index(b`${if_blocks}[${current_block_type_index}].p(#ctx, #dirty);`)} } else { ${change_block} } @@ -483,14 +483,14 @@ export default class IfBlockWrapper extends Wrapper { } else { block.chunks.update.push(b` let ${previous_block_index} = ${current_block_type_index}; - ${current_block_type_index} = ${select_block_type}(#ctx, #changed); + ${current_block_type_index} = ${select_block_type}(#ctx, #dirty); if (${current_block_type_index} !== ${previous_block_index}) { ${change_block} } `); } } else if (dynamic) { - block.chunks.update.push(b`${name}.p(#ctx, #changed);`); + block.chunks.update.push(b`${name}.p(#ctx, #dirty);`); } block.chunks.destroy.push( @@ -527,7 +527,7 @@ export default class IfBlockWrapper extends Wrapper { const enter = dynamic ? b` if (${name}) { - ${name}.p(#ctx, #changed); + ${name}.p(#ctx, #dirty); ${has_transitions && b`@transition_in(${name}, 1);`} } else { ${name} = ${branch.block.name}(#ctx); @@ -548,7 +548,7 @@ export default class IfBlockWrapper extends Wrapper { `; if (branch.snippet) { - block.chunks.update.push(b`if (${block.renderer.changed(branch.dependencies)}) ${branch.condition} = ${branch.snippet}`); + block.chunks.update.push(b`if (${block.renderer.dirty(branch.dependencies)}) ${branch.condition} = ${branch.snippet}`); } // no `p()` here — we don't want to update outroing nodes, @@ -577,7 +577,7 @@ export default class IfBlockWrapper extends Wrapper { } } else if (dynamic) { block.chunks.update.push(b` - if (${branch.condition}) ${name}.p(#ctx, #changed); + if (${branch.condition}) ${name}.p(#ctx, #dirty); `); } diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index e093ade56c60..13c96d0065ae 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -207,7 +207,7 @@ export default class InlineComponentWrapper extends Wrapper { const { name, dependencies } = attr; const condition = dependencies.size > 0 && (dependencies.size !== all_dependencies.size) - ? renderer.changed(Array.from(dependencies)) + ? renderer.dirty(Array.from(dependencies)) : null; if (attr.is_spread) { @@ -240,7 +240,7 @@ export default class InlineComponentWrapper extends Wrapper { `); if (all_dependencies.size) { - const condition = renderer.changed(Array.from(all_dependencies)); + const condition = renderer.dirty(Array.from(all_dependencies)); updates.push(b` const ${name_changes} = ${condition} ? @get_spread_update(${levels}, [ @@ -256,7 +256,7 @@ export default class InlineComponentWrapper extends Wrapper { dynamic_attributes.forEach((attribute: Attribute) => { const dependencies = attribute.get_dependencies(); if (dependencies.length > 0) { - const condition = renderer.changed(dependencies); + const condition = renderer.dirty(dependencies); updates.push(b` if (${condition}) ${name_changes}.${attribute.name} = ${attribute.get_value(block)}; @@ -268,8 +268,8 @@ export default class InlineComponentWrapper extends Wrapper { if (non_let_dependencies.length > 0) { updates.push(b` - if (${renderer.changed(non_let_dependencies)}) { - ${name_changes}.$$scope = { changed: #changed, ctx: #ctx }; + if (${renderer.dirty(non_let_dependencies)}) { + ${name_changes}.$$scope = { dirty: #dirty, ctx: #ctx }; }`); } @@ -296,7 +296,7 @@ export default class InlineComponentWrapper extends Wrapper { ); updates.push(b` - if (!${updating} && ${renderer.changed(Array.from(binding.expression.dependencies))}) { + if (!${updating} && ${renderer.dirty(Array.from(binding.expression.dependencies))}) { ${updating} = true; ${name_changes}.${binding.name} = ${snippet}; @add_flush_callback(() => ${updating} = false); diff --git a/src/compiler/compile/render_dom/wrappers/Slot.ts b/src/compiler/compile/render_dom/wrappers/Slot.ts index d3583f3a6cf8..0443ecc2e56f 100644 --- a/src/compiler/compile/render_dom/wrappers/Slot.ts +++ b/src/compiler/compile/render_dom/wrappers/Slot.ts @@ -119,12 +119,12 @@ export default class SlotWrapper extends Wrapper { }); if (dynamic_dependencies.length > 0) { - changes.properties.push(p`${attribute.name}: ${renderer.changed(dynamic_dependencies)}`); + changes.properties.push(p`${attribute.name}: ${renderer.dirty(dynamic_dependencies)}`); } }); renderer.blocks.push(b` - const ${get_slot_changes_fn} = #changed => ${changes}; + const ${get_slot_changes_fn} = #dirty => ${changes}; const ${get_slot_context_fn} = #ctx => ${get_slot_data(block, this.node.values)}; `); } else { @@ -202,10 +202,10 @@ export default class SlotWrapper extends Wrapper { }); block.chunks.update.push(b` - if (${slot} && ${slot}.p && ${renderer.changed(dynamic_dependencies)}) { + if (${slot} && ${slot}.p && ${renderer.dirty(dynamic_dependencies)}) { ${slot}.p( @get_slot_context(${slot_definition}, #ctx, ${renderer.reference('$$scope')}, ${get_slot_context_fn}), - @get_slot_changes(${slot_definition}, ${renderer.reference('$$scope')}, #changed, ${get_slot_changes_fn}) + @get_slot_changes(${slot_definition}, ${renderer.reference('$$scope')}, #dirty, ${get_slot_changes_fn}) ); } `); diff --git a/src/compiler/compile/render_dom/wrappers/Title.ts b/src/compiler/compile/render_dom/wrappers/Title.ts index 610575a47964..428073ddd228 100644 --- a/src/compiler/compile/render_dom/wrappers/Title.ts +++ b/src/compiler/compile/render_dom/wrappers/Title.ts @@ -75,7 +75,7 @@ export default class TitleWrapper extends Wrapper { if (all_dependencies.size) { const dependencies = Array.from(all_dependencies); - let condition = block.renderer.changed(dependencies); + let condition = block.renderer.dirty(dependencies); if (block.has_outros) { condition = x`!#current || ${condition}`; diff --git a/src/compiler/compile/render_dom/wrappers/Window.ts b/src/compiler/compile/render_dom/wrappers/Window.ts index 9cd05fa2e85b..18691ae9a82b 100644 --- a/src/compiler/compile/render_dom/wrappers/Window.ts +++ b/src/compiler/compile/render_dom/wrappers/Window.ts @@ -139,7 +139,7 @@ export default class WindowWrapper extends Wrapper { // special case... might need to abstract this out if we add more special cases if (bindings.scrollX || bindings.scrollY) { - const condition = renderer.changed([bindings.scrollX, bindings.scrollY].filter(Boolean)); + const condition = renderer.dirty([bindings.scrollX, bindings.scrollY].filter(Boolean)); const scrollX = bindings.scrollX ? renderer.reference(bindings.scrollX) : x`@_window.pageXOffset`; const scrollY = bindings.scrollY ? renderer.reference(bindings.scrollY) : x`@_window.pageYOffset`; diff --git a/src/compiler/compile/render_dom/wrappers/shared/Tag.ts b/src/compiler/compile/render_dom/wrappers/shared/Tag.ts index e49bdc098263..10e2a4a18d1b 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/Tag.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/Tag.ts @@ -39,7 +39,7 @@ export default class Tag extends Wrapper { if (this.node.should_cache) block.add_variable(value, snippet); // TODO may need to coerce snippet to string if (dependencies.length > 0) { - let condition = block.renderer.changed(dependencies); + let condition = block.renderer.dirty(dependencies); if (block.has_outros) { condition = x`!#current || ${condition}`; diff --git a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts index 57453cb0f223..e8f1ecb916e8 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts @@ -33,7 +33,7 @@ export default function add_actions( let condition = x`@is_function(${id}.update)`; if (dependencies.length > 0) { - condition = x`${condition} && ${block.renderer.changed(dependencies)}`; + condition = x`${condition} && ${block.renderer.dirty(dependencies)}`; } block.chunks.update.push( diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts index a36ac237e215..c1d2f80101b1 100644 --- a/src/runtime/internal/Component.ts +++ b/src/runtime/internal/Component.ts @@ -11,7 +11,7 @@ interface Fragment { /* claim */ l: (nodes: any) => void; /* hydrate */ h: () => void; /* mount */ m: (target: HTMLElement, anchor: any) => void; - /* update */ p: (changed: any, ctx: any) => void; + /* update */ p: (ctx: any, dirty: any) => void; /* measure */ r: () => void; /* fix */ f: () => void; /* animate */ a: () => void; diff --git a/src/runtime/internal/keyed_each.ts b/src/runtime/internal/keyed_each.ts index d3a161c6b47e..8382a2f76a3f 100644 --- a/src/runtime/internal/keyed_each.ts +++ b/src/runtime/internal/keyed_each.ts @@ -21,7 +21,7 @@ export function fix_and_outro_and_destroy_block(block, lookup) { outro_and_destroy_block(block, lookup); } -export function update_keyed_each(old_blocks, changed, get_key, dynamic, ctx, list, lookup, node, destroy, create_each_block, next, get_context) { +export function update_keyed_each(old_blocks, dirty, get_key, dynamic, ctx, list, lookup, node, destroy, create_each_block, next, get_context) { let o = old_blocks.length; let n = list.length; @@ -43,7 +43,7 @@ export function update_keyed_each(old_blocks, changed, get_key, dynamic, ctx, li block = create_each_block(key, child_ctx); block.c(); } else if (dynamic) { - block.p(child_ctx, changed); + block.p(child_ctx, dirty); } new_lookup.set(key, new_blocks[i] = block); diff --git a/src/runtime/internal/utils.ts b/src/runtime/internal/utils.ts index 97b83f360f52..7e8769cd885e 100644 --- a/src/runtime/internal/utils.ts +++ b/src/runtime/internal/utils.ts @@ -76,10 +76,10 @@ export function get_slot_context(definition, ctx, $$scope, fn) { : $$scope.ctx; } -export function get_slot_changes(definition, $$scope, changed, fn) { +export function get_slot_changes(definition, $$scope, dirty, fn) { return definition[2] && fn - ? $$scope.changed | definition[2](fn(changed)) - : $$scope.changed; + ? $$scope.dirty | definition[2](fn(dirty)) + : $$scope.dirty; } export function exclude_internal_props(props) { From b574b705a96106cf02b4e0de76e28402558e5b6f Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 15:22:36 -0500 Subject: [PATCH 38/43] update tests --- .../action-custom-event-handler/expected.js | 4 ++-- test/js/samples/bind-open/expected.js | 4 ++-- .../samples/capture-inject-dev-only/expected.js | 6 +++--- .../collapses-text-around-comments/expected.js | 4 ++-- test/js/samples/component-static-var/expected.js | 6 +++--- .../expected.js | 4 ++-- .../expected.js | 4 ++-- test/js/samples/data-attribute/expected.js | 4 ++-- test/js/samples/debug-empty/expected.js | 4 ++-- .../samples/debug-foo-bar-baz-things/expected.js | 14 +++++++------- test/js/samples/debug-foo/expected.js | 14 +++++++------- test/js/samples/debug-hoisted/expected.js | 4 ++-- .../js/samples/debug-no-dependencies/expected.js | 6 +++--- test/js/samples/deconflict-builtins/expected.js | 10 +++++----- .../expected.js | 6 +++--- .../samples/each-block-array-literal/expected.js | 10 +++++----- .../samples/each-block-changed-check/expected.js | 16 ++++++++-------- .../each-block-keyed-animated/expected.js | 8 ++++---- test/js/samples/each-block-keyed/expected.js | 8 ++++---- .../js/samples/event-handler-dynamic/expected.js | 4 ++-- test/js/samples/if-block-no-update/expected.js | 6 +++--- test/js/samples/if-block-simple/expected.js | 2 +- .../inline-style-optimized-multiple/expected.js | 6 +++--- .../inline-style-optimized-url/expected.js | 4 ++-- .../samples/inline-style-optimized/expected.js | 4 ++-- .../samples/inline-style-unoptimized/expected.js | 6 +++--- .../samples/input-no-initial-value/expected.js | 4 ++-- test/js/samples/input-range/expected.js | 4 ++-- .../input-without-blowback-guard/expected.js | 4 ++-- .../expected.js | 4 ++-- .../expected.js | 4 ++-- .../expected.js | 4 ++-- .../expected.js | 4 ++-- test/js/samples/media-bindings/expected.js | 10 +++++----- test/js/samples/select-dynamic-value/expected.js | 4 ++-- test/js/samples/src-attribute-check/expected.js | 6 +++--- test/js/samples/title/expected.js | 4 ++-- test/js/samples/transition-local/expected.js | 6 +++--- .../transition-repeated-outro/expected.js | 2 +- test/js/samples/unchanged-expression/expected.js | 4 ++-- .../expected.js | 4 ++-- .../samples/use-elements-as-anchors/expected.js | 2 +- test/js/samples/video-bindings/expected.js | 4 ++-- .../js/samples/window-binding-scroll/expected.js | 6 +++--- 44 files changed, 124 insertions(+), 124 deletions(-) diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js index 00c4a1facc87..d21b16571d9d 100644 --- a/test/js/samples/action-custom-event-handler/expected.js +++ b/test/js/samples/action-custom-event-handler/expected.js @@ -23,8 +23,8 @@ function create_fragment(ctx) { insert(target, button, anchor); foo_action = foo.call(null, button, ctx[1]) || ({}); }, - p(ctx, [changed]) { - if (is_function(foo_action.update) && changed & 1) foo_action.update.call(null, ctx[1]); + p(ctx, [dirty]) { + if (is_function(foo_action.update) && dirty & 1) foo_action.update.call(null, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/bind-open/expected.js b/test/js/samples/bind-open/expected.js index 11299362f9c2..e99c3bbd6b4c 100644 --- a/test/js/samples/bind-open/expected.js +++ b/test/js/samples/bind-open/expected.js @@ -27,8 +27,8 @@ function create_fragment(ctx) { insert(target, details, anchor); details.open = ctx[0]; }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { details.open = ctx[0]; } }, diff --git a/test/js/samples/capture-inject-dev-only/expected.js b/test/js/samples/capture-inject-dev-only/expected.js index c001b97677f1..d3b175862d01 100644 --- a/test/js/samples/capture-inject-dev-only/expected.js +++ b/test/js/samples/capture-inject-dev-only/expected.js @@ -37,10 +37,10 @@ function create_fragment(ctx) { insert(target, input, anchor); set_input_value(input, ctx[0]); }, - p(ctx, [changed]) { - if (changed & 1) set_data(t0, ctx[0]); + p(ctx, [dirty]) { + if (dirty & 1) set_data(t0, ctx[0]); - if (changed & 1 && input.value !== ctx[0]) { + if (dirty & 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 8fd562b475d3..9f2ab90797b4 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -34,8 +34,8 @@ function create_fragment(ctx) { insert(target, p, anchor); append(p, t); }, - p(ctx, [changed]) { - if (changed & 1) set_data(t, ctx[0]); + p(ctx, [dirty]) { + if (dirty & 1) set_data(t, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-static-var/expected.js b/test/js/samples/component-static-var/expected.js index c38660469302..4785fc9527d7 100644 --- a/test/js/samples/component-static-var/expected.js +++ b/test/js/samples/component-static-var/expected.js @@ -46,12 +46,12 @@ function create_fragment(ctx) { set_input_value(input, ctx[0]); current = true; }, - p(ctx, [changed]) { + p(ctx, [dirty]) { const bar_changes = {}; - if (changed & 1) bar_changes.x = ctx[0]; + if (dirty & 1) bar_changes.x = ctx[0]; bar.$set(bar_changes); - if (changed & 1 && input.value !== ctx[0]) { + if (dirty & 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/component-store-access-invalidate/expected.js b/test/js/samples/component-store-access-invalidate/expected.js index e84a0bc8fe4e..639404b4bb49 100644 --- a/test/js/samples/component-store-access-invalidate/expected.js +++ b/test/js/samples/component-store-access-invalidate/expected.js @@ -28,8 +28,8 @@ function create_fragment(ctx) { insert(target, h1, anchor); append(h1, t); }, - p(ctx, [changed]) { - if (changed & 1) set_data(t, ctx[0]); + p(ctx, [dirty]) { + if (dirty & 1) set_data(t, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-store-reassign-invalidate/expected.js b/test/js/samples/component-store-reassign-invalidate/expected.js index c878b19cc2ea..9876626cf9df 100644 --- a/test/js/samples/component-store-reassign-invalidate/expected.js +++ b/test/js/samples/component-store-reassign-invalidate/expected.js @@ -39,8 +39,8 @@ function create_fragment(ctx) { insert(target, t1, anchor); insert(target, button, anchor); }, - p(ctx, [changed]) { - if (changed & 2) set_data(t0, ctx[1]); + p(ctx, [dirty]) { + if (dirty & 2) set_data(t0, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/data-attribute/expected.js b/test/js/samples/data-attribute/expected.js index 4a574b68ae61..d7edc739e8c5 100644 --- a/test/js/samples/data-attribute/expected.js +++ b/test/js/samples/data-attribute/expected.js @@ -29,8 +29,8 @@ function create_fragment(ctx) { insert(target, t, anchor); insert(target, div1, anchor); }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { attr(div1, "data-foo", ctx[0]); } }, diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js index ad9949fe2ad6..0f55de4df975 100644 --- a/test/js/samples/debug-empty/expected.js +++ b/test/js/samples/debug-empty/expected.js @@ -44,8 +44,8 @@ function create_fragment(ctx) { append_dev(h1, t2); insert_dev(target, t3, anchor); }, - p: function update(ctx, [changed]) { - if (changed & 1) set_data_dev(t1, ctx[0]); + p: function update(ctx, [dirty]) { + if (dirty & 1) set_data_dev(t1, ctx[0]); debugger; }, i: noop, diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js index d85fb1c0dcc8..11ff13bb46dc 100644 --- a/test/js/samples/debug-foo-bar-baz-things/expected.js +++ b/test/js/samples/debug-foo-bar-baz-things/expected.js @@ -53,10 +53,10 @@ function create_each_block(ctx) { append_dev(span, t0); insert_dev(target, t1, anchor); }, - p: function update(ctx, changed) { - if (changed & 1 && t0_value !== (t0_value = ctx[4].name + "")) set_data_dev(t0, t0_value); + p: function update(ctx, dirty) { + if (dirty & 1 && t0_value !== (t0_value = ctx[4].name + "")) set_data_dev(t0, t0_value); - if (changed & 15) { + if (dirty & 15) { const foo = ctx[1]; const bar = ctx[2]; const baz = ctx[3]; @@ -119,8 +119,8 @@ function create_fragment(ctx) { append_dev(p, t1); append_dev(p, t2); }, - p: function update(ctx, [changed]) { - if (changed & 1) { + p: function update(ctx, [dirty]) { + if (dirty & 1) { each_value = ctx[0]; let i; @@ -128,7 +128,7 @@ function create_fragment(ctx) { const child_ctx = get_each_context(ctx, each_value, i); if (each_blocks[i]) { - each_blocks[i].p(child_ctx, changed); + each_blocks[i].p(child_ctx, dirty); } else { each_blocks[i] = create_each_block(child_ctx); each_blocks[i].c(); @@ -143,7 +143,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (changed & 2) set_data_dev(t2, ctx[1]); + if (dirty & 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js index 2eeaf317361a..a2b19de8cde8 100644 --- a/test/js/samples/debug-foo/expected.js +++ b/test/js/samples/debug-foo/expected.js @@ -50,10 +50,10 @@ function create_each_block(ctx) { append_dev(span, t0); insert_dev(target, t1, anchor); }, - p: function update(ctx, changed) { - if (changed & 1 && t0_value !== (t0_value = ctx[2].name + "")) set_data_dev(t0, t0_value); + p: function update(ctx, dirty) { + if (dirty & 1 && t0_value !== (t0_value = ctx[2].name + "")) set_data_dev(t0, t0_value); - if (changed & 2) { + if (dirty & 2) { const foo = ctx[1]; console.log({ foo }); debugger; @@ -113,8 +113,8 @@ function create_fragment(ctx) { append_dev(p, t1); append_dev(p, t2); }, - p: function update(ctx, [changed]) { - if (changed & 1) { + p: function update(ctx, [dirty]) { + if (dirty & 1) { each_value = ctx[0]; let i; @@ -122,7 +122,7 @@ function create_fragment(ctx) { const child_ctx = get_each_context(ctx, each_value, i); if (each_blocks[i]) { - each_blocks[i].p(child_ctx, changed); + each_blocks[i].p(child_ctx, dirty); } else { each_blocks[i] = create_each_block(child_ctx); each_blocks[i].c(); @@ -137,7 +137,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (changed & 2) set_data_dev(t2, ctx[1]); + if (dirty & 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/debug-hoisted/expected.js b/test/js/samples/debug-hoisted/expected.js index 7115f75cdcb8..37b983c8cc99 100644 --- a/test/js/samples/debug-hoisted/expected.js +++ b/test/js/samples/debug-hoisted/expected.js @@ -23,8 +23,8 @@ function create_fragment(ctx) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); }, m: noop, - p: function update(ctx, [changed]) { - if (changed & 3) { + p: function update(ctx, [dirty]) { + if (dirty & 3) { const obj = ctx[0]; const kobzol = ctx[1]; console.log({ obj, kobzol }); diff --git a/test/js/samples/debug-no-dependencies/expected.js b/test/js/samples/debug-no-dependencies/expected.js index 107768317211..28c5b35dc501 100644 --- a/test/js/samples/debug-no-dependencies/expected.js +++ b/test/js/samples/debug-no-dependencies/expected.js @@ -88,8 +88,8 @@ function create_fragment(ctx) { insert_dev(target, each_1_anchor, anchor); }, - p: function update(ctx, [changed]) { - if (changed & 0) { + p: function update(ctx, [dirty]) { + if (dirty & 0) { each_value = things; let i; @@ -97,7 +97,7 @@ function create_fragment(ctx) { const child_ctx = get_each_context(ctx, each_value, i); if (each_blocks[i]) { - each_blocks[i].p(child_ctx, changed); + each_blocks[i].p(child_ctx, dirty); } else { each_blocks[i] = create_each_block(child_ctx); each_blocks[i].c(); diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js index 2c64724ea1f1..9e4763be65b5 100644 --- a/test/js/samples/deconflict-builtins/expected.js +++ b/test/js/samples/deconflict-builtins/expected.js @@ -35,8 +35,8 @@ function create_each_block(ctx) { insert(target, span, anchor); append(span, t); }, - p(ctx, changed) { - if (changed & 1 && t_value !== (t_value = ctx[1] + "")) set_data(t, t_value); + p(ctx, dirty) { + if (dirty & 1 && t_value !== (t_value = ctx[1] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -68,8 +68,8 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { each_value = ctx[0]; let i; @@ -77,7 +77,7 @@ function create_fragment(ctx) { const child_ctx = get_each_context(ctx, each_value, i); if (each_blocks[i]) { - each_blocks[i].p(child_ctx, changed); + each_blocks[i].p(child_ctx, dirty); } else { each_blocks[i] = create_each_block(child_ctx); each_blocks[i].c(); diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index 544759d9c752..c18817c8122b 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -41,9 +41,9 @@ function create_fragment(ctx) { append_dev(p, t1); append_dev(p, t2); }, - p: function update(ctx, [changed]) { - if (changed & 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); - if (changed & 2) set_data_dev(t2, ctx[1]); + p: function update(ctx, [dirty]) { + if (dirty & 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); + if (dirty & 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/each-block-array-literal/expected.js b/test/js/samples/each-block-array-literal/expected.js index e59a929b22fe..b47b1cca954e 100644 --- a/test/js/samples/each-block-array-literal/expected.js +++ b/test/js/samples/each-block-array-literal/expected.js @@ -35,8 +35,8 @@ function create_each_block(ctx) { insert(target, span, anchor); append(span, t); }, - p(ctx, changed) { - if (changed & 31 && t_value !== (t_value = ctx[5] + "")) set_data(t, t_value); + p(ctx, dirty) { + if (dirty & 31 && t_value !== (t_value = ctx[5] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -68,8 +68,8 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, [changed]) { - if (changed & 31) { + p(ctx, [dirty]) { + if (dirty & 31) { each_value = [ctx[0], ctx[1], ctx[2], ctx[3], ctx[4]]; let i; @@ -77,7 +77,7 @@ function create_fragment(ctx) { const child_ctx = get_each_context(ctx, each_value, i); if (each_blocks[i]) { - each_blocks[i].p(child_ctx, changed); + each_blocks[i].p(child_ctx, dirty); } else { each_blocks[i] = create_each_block(child_ctx); each_blocks[i].c(); diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index 4c27763200d6..f98c738203e2 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -69,10 +69,10 @@ function create_each_block(ctx) { append(div, t6); html_tag.m(div); }, - p(ctx, changed) { - if (changed & 1 && t2_value !== (t2_value = ctx[4].author + "")) set_data(t2, t2_value); - if (changed & 7 && t4_value !== (t4_value = ctx[1](ctx[4].time, ctx[2]) + "")) set_data(t4, t4_value); - if (changed & 1 && raw_value !== (raw_value = ctx[4].html + "")) html_tag.p(raw_value); + p(ctx, dirty) { + if (dirty & 1 && t2_value !== (t2_value = ctx[4].author + "")) set_data(t2, t2_value); + if (dirty & 7 && t4_value !== (t4_value = ctx[1](ctx[4].time, ctx[2]) + "")) set_data(t4, t4_value); + if (dirty & 1 && raw_value !== (raw_value = ctx[4].html + "")) html_tag.p(raw_value); }, d(detaching) { if (detaching) detach(div); @@ -110,8 +110,8 @@ function create_fragment(ctx) { insert(target, p, anchor); append(p, t1); }, - p(ctx, [changed]) { - if (changed & 7) { + p(ctx, [dirty]) { + if (dirty & 7) { each_value = ctx[0]; let i; @@ -119,7 +119,7 @@ function create_fragment(ctx) { const child_ctx = get_each_context(ctx, each_value, i); if (each_blocks[i]) { - each_blocks[i].p(child_ctx, changed); + each_blocks[i].p(child_ctx, dirty); } else { each_blocks[i] = create_each_block(child_ctx); each_blocks[i].c(); @@ -134,7 +134,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (changed & 8) set_data(t1, ctx[3]); + if (dirty & 8) set_data(t1, ctx[3]); }, i: noop, o: noop, diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js index 9033ead1c84f..4aa238963f31 100644 --- a/test/js/samples/each-block-keyed-animated/expected.js +++ b/test/js/samples/each-block-keyed-animated/expected.js @@ -43,8 +43,8 @@ function create_each_block(key_1, ctx) { insert(target, div, anchor); append(div, t); }, - p(ctx, changed) { - if (changed & 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + p(ctx, dirty) { + if (dirty & 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); }, r() { rect = div.getBoundingClientRect(); @@ -91,10 +91,10 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, [changed]) { + p(ctx, [dirty]) { const each_value = ctx[0]; for (let i = 0; i < each_blocks.length; i += 1) each_blocks[i].r(); - each_blocks = update_keyed_each(each_blocks, changed, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, fix_and_destroy_block, create_each_block, each_1_anchor, get_each_context); + each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, fix_and_destroy_block, create_each_block, each_1_anchor, get_each_context); for (let i = 0; i < each_blocks.length; i += 1) each_blocks[i].a(); }, i: noop, diff --git a/test/js/samples/each-block-keyed/expected.js b/test/js/samples/each-block-keyed/expected.js index 6eb20971c352..aa949e95b9a8 100644 --- a/test/js/samples/each-block-keyed/expected.js +++ b/test/js/samples/each-block-keyed/expected.js @@ -39,8 +39,8 @@ function create_each_block(key_1, ctx) { insert(target, div, anchor); append(div, t); }, - p(ctx, changed) { - if (changed & 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + p(ctx, dirty) { + if (dirty & 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(div); @@ -76,9 +76,9 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, - p(ctx, [changed]) { + p(ctx, [dirty]) { const each_value = ctx[0]; - each_blocks = update_keyed_each(each_blocks, changed, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, destroy_block, create_each_block, each_1_anchor, get_each_context); + each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, destroy_block, create_each_block, each_1_anchor, get_each_context); }, i: noop, o: noop, diff --git a/test/js/samples/event-handler-dynamic/expected.js b/test/js/samples/event-handler-dynamic/expected.js index ea76b5d4dc0a..adf88c5e0888 100644 --- a/test/js/samples/event-handler-dynamic/expected.js +++ b/test/js/samples/event-handler-dynamic/expected.js @@ -61,9 +61,9 @@ function create_fragment(ctx) { insert(target, t5, anchor); insert(target, button2, anchor); }, - p(new_ctx, [changed]) { + p(new_ctx, [dirty]) { ctx = new_ctx; - if (changed & 2) set_data(t4, ctx[1]); + if (dirty & 2) set_data(t4, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/if-block-no-update/expected.js b/test/js/samples/if-block-no-update/expected.js index 0db08dad9e10..5600712e5be4 100644 --- a/test/js/samples/if-block-no-update/expected.js +++ b/test/js/samples/if-block-no-update/expected.js @@ -48,7 +48,7 @@ function create_if_block(ctx) { function create_fragment(ctx) { let if_block_anchor; - function select_block_type(ctx, changed) { + function select_block_type(ctx, dirty) { if (ctx[0]) return create_if_block; return create_else_block; } @@ -65,8 +65,8 @@ function create_fragment(ctx) { if_block.m(target, anchor); insert(target, if_block_anchor, anchor); }, - p(ctx, [changed]) { - if (current_block_type !== (current_block_type = select_block_type(ctx, changed))) { + p(ctx, [dirty]) { + if (current_block_type !== (current_block_type = select_block_type(ctx, dirty))) { if_block.d(1); if_block = current_block_type(ctx); diff --git a/test/js/samples/if-block-simple/expected.js b/test/js/samples/if-block-simple/expected.js index 62e233f20943..9c1b6abd312b 100644 --- a/test/js/samples/if-block-simple/expected.js +++ b/test/js/samples/if-block-simple/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { if (if_block) if_block.m(target, anchor); insert(target, if_block_anchor, anchor); }, - p(ctx, [changed]) { + p(ctx, [dirty]) { if (ctx[0]) { if (!if_block) { if_block = create_if_block(ctx); diff --git a/test/js/samples/inline-style-optimized-multiple/expected.js b/test/js/samples/inline-style-optimized-multiple/expected.js index 5bfe82497437..f9ff9721ba7e 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected.js +++ b/test/js/samples/inline-style-optimized-multiple/expected.js @@ -22,12 +22,12 @@ function create_fragment(ctx) { m(target, anchor) { insert(target, div, anchor); }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { set_style(div, "color", ctx[0]); } - if (changed & 6) { + if (dirty & 6) { set_style(div, "transform", "translate(" + ctx[1] + "px," + ctx[2] + "px)"); } }, diff --git a/test/js/samples/inline-style-optimized-url/expected.js b/test/js/samples/inline-style-optimized-url/expected.js index 3710db996911..806ced193fb3 100644 --- a/test/js/samples/inline-style-optimized-url/expected.js +++ b/test/js/samples/inline-style-optimized-url/expected.js @@ -21,8 +21,8 @@ function create_fragment(ctx) { m(target, anchor) { insert(target, div, anchor); }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { set_style(div, "background", "url(data:image/png;base64," + ctx[0] + ")"); } }, diff --git a/test/js/samples/inline-style-optimized/expected.js b/test/js/samples/inline-style-optimized/expected.js index a5c160841c30..d3f8e789be46 100644 --- a/test/js/samples/inline-style-optimized/expected.js +++ b/test/js/samples/inline-style-optimized/expected.js @@ -21,8 +21,8 @@ function create_fragment(ctx) { m(target, anchor) { insert(target, div, anchor); }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { set_style(div, "color", ctx[0]); } }, diff --git a/test/js/samples/inline-style-unoptimized/expected.js b/test/js/samples/inline-style-unoptimized/expected.js index c244c332fa02..48da85ede981 100644 --- a/test/js/samples/inline-style-unoptimized/expected.js +++ b/test/js/samples/inline-style-unoptimized/expected.js @@ -30,12 +30,12 @@ function create_fragment(ctx) { insert(target, t, anchor); insert(target, div1, anchor); }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { attr(div0, "style", ctx[0]); } - if (changed & 6 && div1_style_value !== (div1_style_value = "" + (ctx[1] + ": " + ctx[2]))) { + if (dirty & 6 && div1_style_value !== (div1_style_value = "" + (ctx[1] + ": " + ctx[2]))) { attr(div1, "style", div1_style_value); } }, diff --git a/test/js/samples/input-no-initial-value/expected.js b/test/js/samples/input-no-initial-value/expected.js index 0fe216292eff..0ac875a15abd 100644 --- a/test/js/samples/input-no-initial-value/expected.js +++ b/test/js/samples/input-no-initial-value/expected.js @@ -40,8 +40,8 @@ function create_fragment(ctx) { append(form, t0); append(form, button); }, - p(ctx, [changed]) { - if (changed & 1 && input.value !== ctx[0]) { + p(ctx, [dirty]) { + if (dirty & 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/input-range/expected.js b/test/js/samples/input-range/expected.js index db30d7c7838b..4693a0b707a0 100644 --- a/test/js/samples/input-range/expected.js +++ b/test/js/samples/input-range/expected.js @@ -28,8 +28,8 @@ function create_fragment(ctx) { insert(target, input, anchor); set_input_value(input, ctx[0]); }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/input-without-blowback-guard/expected.js b/test/js/samples/input-without-blowback-guard/expected.js index 1a9459809cfe..5a730a697398 100644 --- a/test/js/samples/input-without-blowback-guard/expected.js +++ b/test/js/samples/input-without-blowback-guard/expected.js @@ -25,8 +25,8 @@ function create_fragment(ctx) { insert(target, input, anchor); input.checked = ctx[0]; }, - p(ctx, [changed]) { - if (changed & 1) { + p(ctx, [dirty]) { + if (dirty & 1) { input.checked = ctx[0]; } }, diff --git a/test/js/samples/instrumentation-script-if-no-block/expected.js b/test/js/samples/instrumentation-script-if-no-block/expected.js index ca289069f939..74d9ab46b8bc 100644 --- a/test/js/samples/instrumentation-script-if-no-block/expected.js +++ b/test/js/samples/instrumentation-script-if-no-block/expected.js @@ -39,8 +39,8 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, [changed]) { - if (changed & 1) set_data(t3, ctx[0]); + p(ctx, [dirty]) { + if (dirty & 1) set_data(t3, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-script-x-equals-x/expected.js b/test/js/samples/instrumentation-script-x-equals-x/expected.js index 3d43d2570031..0a1e271cbee1 100644 --- a/test/js/samples/instrumentation-script-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-script-x-equals-x/expected.js @@ -40,8 +40,8 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, [changed]) { - if (changed & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + p(ctx, [dirty]) { + if (dirty & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-if-no-block/expected.js b/test/js/samples/instrumentation-template-if-no-block/expected.js index 7ef6bd8c9ab2..4452b54aac0a 100644 --- a/test/js/samples/instrumentation-template-if-no-block/expected.js +++ b/test/js/samples/instrumentation-template-if-no-block/expected.js @@ -39,8 +39,8 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, [changed]) { - if (changed & 1) set_data(t3, ctx[0]); + p(ctx, [dirty]) { + if (dirty & 1) set_data(t3, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-x-equals-x/expected.js b/test/js/samples/instrumentation-template-x-equals-x/expected.js index bd5bf249fae1..474d78ca7cd7 100644 --- a/test/js/samples/instrumentation-template-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-template-x-equals-x/expected.js @@ -40,8 +40,8 @@ function create_fragment(ctx) { append(p, t2); append(p, t3); }, - p(ctx, [changed]) { - if (changed & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + p(ctx, [dirty]) { + if (dirty & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js index 6387e0ca31aa..dcca20b24837 100644 --- a/test/js/samples/media-bindings/expected.js +++ b/test/js/samples/media-bindings/expected.js @@ -67,20 +67,20 @@ function create_fragment(ctx) { audio.playbackRate = ctx[7]; } }, - p(ctx, [changed]) { - if (!audio_updating && changed & 8 && !isNaN(ctx[3])) { + p(ctx, [dirty]) { + if (!audio_updating && dirty & 8 && !isNaN(ctx[3])) { audio.currentTime = ctx[3]; } - if (changed & 32 && audio_is_paused !== (audio_is_paused = ctx[5])) { + if (dirty & 32 && audio_is_paused !== (audio_is_paused = ctx[5])) { audio[audio_is_paused ? "pause" : "play"](); } - if (changed & 64 && !isNaN(ctx[6])) { + if (dirty & 64 && !isNaN(ctx[6])) { audio.volume = ctx[6]; } - if (changed & 128 && !isNaN(ctx[7])) { + if (dirty & 128 && !isNaN(ctx[7])) { audio.playbackRate = ctx[7]; } diff --git a/test/js/samples/select-dynamic-value/expected.js b/test/js/samples/select-dynamic-value/expected.js index 03a7fc2b57ed..8f309aaed224 100644 --- a/test/js/samples/select-dynamic-value/expected.js +++ b/test/js/samples/select-dynamic-value/expected.js @@ -43,8 +43,8 @@ function create_fragment(ctx) { } } }, - p(ctx, [changed]) { - if (changed & 1 && select_value_value !== (select_value_value = ctx[0])) { + p(ctx, [dirty]) { + if (dirty & 1 && select_value_value !== (select_value_value = ctx[0])) { for (var i = 0; i < select.options.length; i += 1) { var option = select.options[i]; diff --git a/test/js/samples/src-attribute-check/expected.js b/test/js/samples/src-attribute-check/expected.js index bfdf7a01c842..ab73564ab388 100644 --- a/test/js/samples/src-attribute-check/expected.js +++ b/test/js/samples/src-attribute-check/expected.js @@ -44,12 +44,12 @@ function create_fragment(ctx) { insert(target, t, anchor); insert(target, img1, anchor); }, - p(ctx, [changed]) { - if (changed & 1 && img0.src !== (img0_src_value = ctx[0])) { + p(ctx, [dirty]) { + if (dirty & 1 && img0.src !== (img0_src_value = ctx[0])) { attr(img0, "src", img0_src_value); } - if (changed & 2 && img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) { + if (dirty & 2 && img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) { attr(img1, "src", img1_src_value); } }, diff --git a/test/js/samples/title/expected.js b/test/js/samples/title/expected.js index 800bf9801a4b..3d29c496a42b 100644 --- a/test/js/samples/title/expected.js +++ b/test/js/samples/title/expected.js @@ -8,8 +8,8 @@ function create_fragment(ctx) { return { c: noop, m: noop, - p(ctx, [changed]) { - if (changed & 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { + p(ctx, [dirty]) { + if (dirty & 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { document.title = title_value; } }, diff --git a/test/js/samples/transition-local/expected.js b/test/js/samples/transition-local/expected.js index c93f66026b70..8d72e7471816 100644 --- a/test/js/samples/transition-local/expected.js +++ b/test/js/samples/transition-local/expected.js @@ -26,7 +26,7 @@ function create_if_block(ctx) { if (if_block) if_block.m(target, anchor); insert(target, if_block_anchor, anchor); }, - p(ctx, changed) { + p(ctx, dirty) { if (ctx[1]) { if (!if_block) { if_block = create_if_block_1(ctx); @@ -91,10 +91,10 @@ function create_fragment(ctx) { if (if_block) if_block.m(target, anchor); insert(target, if_block_anchor, anchor); }, - p(ctx, [changed]) { + p(ctx, [dirty]) { if (ctx[0]) { if (if_block) { - if_block.p(ctx, changed); + if_block.p(ctx, dirty); } else { if_block = create_if_block(ctx); if_block.c(); diff --git a/test/js/samples/transition-repeated-outro/expected.js b/test/js/samples/transition-repeated-outro/expected.js index 62f0e86bd853..536cb95b2ccb 100644 --- a/test/js/samples/transition-repeated-outro/expected.js +++ b/test/js/samples/transition-repeated-outro/expected.js @@ -61,7 +61,7 @@ function create_fragment(ctx) { insert(target, if_block_anchor, anchor); current = true; }, - p(ctx, [changed]) { + p(ctx, [dirty]) { if (ctx[0] < 5) { if (!if_block) { if_block = create_if_block(ctx); diff --git a/test/js/samples/unchanged-expression/expected.js b/test/js/samples/unchanged-expression/expected.js index 9c4e31aa691d..eee0079a71b8 100644 --- a/test/js/samples/unchanged-expression/expected.js +++ b/test/js/samples/unchanged-expression/expected.js @@ -56,8 +56,8 @@ function create_fragment(ctx) { append(p3, t8); append(p3, t9); }, - p(ctx, [changed]) { - if (changed & 1) set_data(t9, ctx[0]); + p(ctx, [dirty]) { + if (dirty & 1) set_data(t9, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/unreferenced-state-not-invalidated/expected.js b/test/js/samples/unreferenced-state-not-invalidated/expected.js index b4e74b1a85d2..5fa679aecfee 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/expected.js +++ b/test/js/samples/unreferenced-state-not-invalidated/expected.js @@ -27,8 +27,8 @@ function create_fragment(ctx) { insert(target, p, anchor); append(p, t); }, - p(ctx, [changed]) { - if (changed & 1) set_data(t, ctx[0]); + p(ctx, [dirty]) { + if (dirty & 1) set_data(t, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/use-elements-as-anchors/expected.js b/test/js/samples/use-elements-as-anchors/expected.js index a5db96f4fecc..36344982bcb1 100644 --- a/test/js/samples/use-elements-as-anchors/expected.js +++ b/test/js/samples/use-elements-as-anchors/expected.js @@ -155,7 +155,7 @@ function create_fragment(ctx) { if (if_block4) if_block4.m(target, anchor); insert(target, if_block4_anchor, anchor); }, - p(ctx, [changed]) { + p(ctx, [dirty]) { if (ctx[0]) { if (!if_block0) { if_block0 = create_if_block_4(ctx); diff --git a/test/js/samples/video-bindings/expected.js b/test/js/samples/video-bindings/expected.js index 6f19bc9d49f7..4149d950591f 100644 --- a/test/js/samples/video-bindings/expected.js +++ b/test/js/samples/video-bindings/expected.js @@ -47,8 +47,8 @@ function create_fragment(ctx) { insert(target, video, anchor); video_resize_listener = add_resize_listener(video, ctx[4].bind(video)); }, - p(ctx, [changed]) { - if (!video_updating && changed & 1 && !isNaN(ctx[0])) { + p(ctx, [dirty]) { + if (!video_updating && dirty & 1 && !isNaN(ctx[0])) { video.currentTime = ctx[0]; } diff --git a/test/js/samples/window-binding-scroll/expected.js b/test/js/samples/window-binding-scroll/expected.js index 09041d17b44d..886c0653335c 100644 --- a/test/js/samples/window-binding-scroll/expected.js +++ b/test/js/samples/window-binding-scroll/expected.js @@ -46,15 +46,15 @@ function create_fragment(ctx) { append(p, t0); append(p, t1); }, - p(ctx, [changed]) { - if (changed & 1 && !scrolling) { + p(ctx, [dirty]) { + if (dirty & 1 && !scrolling) { scrolling = true; clearTimeout(scrolling_timeout); scrollTo(window.pageXOffset, ctx[0]); scrolling_timeout = setTimeout(clear_scrolling, 100); } - if (changed & 1) set_data(t1, ctx[0]); + if (dirty & 1) set_data(t1, ctx[0]); }, i: noop, o: noop, From 8c50a443b061d37d3a7cb79fe1a6fda44020b417 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 16:15:38 -0500 Subject: [PATCH 39/43] use bitwise comparison --- src/compiler/compile/render_dom/Renderer.ts | 2 +- test/runtime/samples/bitmask-overflow/_config.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 90c4aec234fc..058746d4e9f4 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -236,7 +236,7 @@ export default class Renderer { .map((bits, i) => ({ bits, i })) .filter(({ bits }) => bits) .map(({ bits, i }) => x`${dirty}[${i}] & ${bits}`) - .reduce((lhs, rhs) => x`${lhs} || ${rhs}`); + .reduce((lhs, rhs) => x`${lhs} | ${rhs}`); ({ operator, left, right } = expression); } else { diff --git a/test/runtime/samples/bitmask-overflow/_config.js b/test/runtime/samples/bitmask-overflow/_config.js index fdd7bff81368..ada3195c8134 100644 --- a/test/runtime/samples/bitmask-overflow/_config.js +++ b/test/runtime/samples/bitmask-overflow/_config.js @@ -109,12 +109,12 @@ export default { assert.deepEqual(component.reads, { _0: 1, - _5: 2, + _5: 3, _6: 3, _30: 1, _31: 1, _32: 1, - _36: 2, + _36: 3, _37: 3, _40: 1 }); From b8a829e240d92d9deee2efc88d0837633ec06d60 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 16:52:37 -0500 Subject: [PATCH 40/43] add comments... sort of --- src/compiler/compile/render_dom/Renderer.ts | 23 +++++++++++-------- .../action-custom-event-handler/expected.js | 2 +- test/js/samples/bind-open/expected.js | 2 +- .../capture-inject-dev-only/expected.js | 4 ++-- .../expected.js | 2 +- .../samples/component-static-var/expected.js | 4 ++-- .../expected.js | 2 +- .../expected.js | 2 +- test/js/samples/data-attribute/expected.js | 2 +- test/js/samples/debug-empty/expected.js | 2 +- .../debug-foo-bar-baz-things/expected.js | 8 +++---- test/js/samples/debug-foo/expected.js | 8 +++---- test/js/samples/debug-hoisted/expected.js | 2 +- .../samples/debug-no-dependencies/expected.js | 2 +- .../samples/deconflict-builtins/expected.js | 4 ++-- .../expected.js | 6 ++--- .../each-block-array-literal/expected.js | 4 ++-- .../each-block-changed-check/expected.js | 10 ++++---- .../each-block-keyed-animated/expected.js | 2 +- test/js/samples/each-block-keyed/expected.js | 2 +- .../samples/event-handler-dynamic/expected.js | 2 +- .../expected.js | 4 ++-- .../inline-style-optimized-url/expected.js | 2 +- .../inline-style-optimized/expected.js | 2 +- .../inline-style-unoptimized/expected.js | 4 ++-- .../input-no-initial-value/expected.js | 2 +- test/js/samples/input-range/expected.js | 2 +- .../input-without-blowback-guard/expected.js | 2 +- .../expected.js | 2 +- .../expected.js | 2 +- .../expected.js | 2 +- .../expected.js | 2 +- test/js/samples/media-bindings/expected.js | 8 +++---- .../expected.js | 4 ++-- .../expected.js | 2 +- .../samples/select-dynamic-value/expected.js | 2 +- .../samples/src-attribute-check/expected.js | 4 ++-- test/js/samples/title/expected.js | 2 +- .../samples/unchanged-expression/expected.js | 2 +- .../expected.js | 4 ++-- test/js/samples/video-bindings/expected.js | 2 +- .../samples/window-binding-scroll/expected.js | 4 ++-- 42 files changed, 79 insertions(+), 76 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 058746d4e9f4..262297bd169d 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -199,10 +199,10 @@ export default class Renderer { ? x`$$self.$$.dirty` : x`#dirty`) as Identifier | MemberExpression; - const get_bitmask = () => names.reduce((bits, name) => { + const get_bitmask = () => names.reduce((bitmask, name) => { const member = renderer.context_lookup.get(name); - if (!member) return bits; + if (!member) return bitmask; if (member.index.value === -1) { throw new Error(`unset index`); @@ -210,12 +210,15 @@ export default class Renderer { const value = member.index.value as number; const i = (value / 31) | 0; - const j = 1 << (value % 31); + const n = 1 << (value % 31); - bits[i] |= j; + if (!bitmask[i]) bitmask[i] = { n: 0, names: [] }; - return bits; - }, Array((this.context.length / 31) | 0).fill(0)); + bitmask[i].n |= n; + bitmask[i].names.push(name); + + return bitmask; + }, Array((this.context.length / 31) | 0).fill(null)); let operator; let left; @@ -233,14 +236,14 @@ export default class Renderer { if (renderer.context_overflow) { const expression = bitmask - .map((bits, i) => ({ bits, i })) - .filter(({ bits }) => bits) - .map(({ bits, i }) => x`${dirty}[${i}] & ${bits}`) + .map((b, i) => ({ b, i })) + .filter(({ b }) => b) + .map(({ b, i }) => x`${dirty}[${i}] & /* ${b.names.join(', ')} */ ${b.n}`) .reduce((lhs, rhs) => x`${lhs} | ${rhs}`); ({ operator, left, right } = expression); } else { - ({ operator, left, right } = x`${dirty} & ${bitmask[0] || 0}` as BinaryExpression); // TODO the `|| 0` case should never apply + ({ operator, left, right } = x`${dirty} & /* ${names.join(', ')} */ ${bitmask[0] ? bitmask[0].n : 0}` as BinaryExpression); // TODO the `: 0` case should never apply } return 'BinaryExpression'; diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js index d21b16571d9d..2f863217b6ce 100644 --- a/test/js/samples/action-custom-event-handler/expected.js +++ b/test/js/samples/action-custom-event-handler/expected.js @@ -24,7 +24,7 @@ function create_fragment(ctx) { foo_action = foo.call(null, button, ctx[1]) || ({}); }, p(ctx, [dirty]) { - if (is_function(foo_action.update) && dirty & 1) foo_action.update.call(null, ctx[1]); + if (is_function(foo_action.update) && dirty & /* _id9uocqrtmw00_1_ */ 1) foo_action.update.call(null, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/bind-open/expected.js b/test/js/samples/bind-open/expected.js index e99c3bbd6b4c..a2bc78f5d9ad 100644 --- a/test/js/samples/bind-open/expected.js +++ b/test/js/samples/bind-open/expected.js @@ -28,7 +28,7 @@ function create_fragment(ctx) { details.open = ctx[0]; }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { details.open = ctx[0]; } }, diff --git a/test/js/samples/capture-inject-dev-only/expected.js b/test/js/samples/capture-inject-dev-only/expected.js index d3b175862d01..fd5ee97ce38a 100644 --- a/test/js/samples/capture-inject-dev-only/expected.js +++ b/test/js/samples/capture-inject-dev-only/expected.js @@ -38,9 +38,9 @@ function create_fragment(ctx) { set_input_value(input, ctx[0]); }, p(ctx, [dirty]) { - if (dirty & 1) set_data(t0, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t0, ctx[0]); - if (dirty & 1 && input.value !== ctx[0]) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 9f2ab90797b4..59bf38e900ca 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -35,7 +35,7 @@ function create_fragment(ctx) { append(p, t); }, p(ctx, [dirty]) { - if (dirty & 1) set_data(t, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-static-var/expected.js b/test/js/samples/component-static-var/expected.js index 4785fc9527d7..f5ec221c02a1 100644 --- a/test/js/samples/component-static-var/expected.js +++ b/test/js/samples/component-static-var/expected.js @@ -48,10 +48,10 @@ function create_fragment(ctx) { }, p(ctx, [dirty]) { const bar_changes = {}; - if (dirty & 1) bar_changes.x = ctx[0]; + if (dirty & /* _id9uocqrtmw00_1_ */ 1) bar_changes.x = ctx[0]; bar.$set(bar_changes); - if (dirty & 1 && input.value !== ctx[0]) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/component-store-access-invalidate/expected.js b/test/js/samples/component-store-access-invalidate/expected.js index 639404b4bb49..e1dae76e898f 100644 --- a/test/js/samples/component-store-access-invalidate/expected.js +++ b/test/js/samples/component-store-access-invalidate/expected.js @@ -29,7 +29,7 @@ function create_fragment(ctx) { append(h1, t); }, p(ctx, [dirty]) { - if (dirty & 1) set_data(t, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-store-reassign-invalidate/expected.js b/test/js/samples/component-store-reassign-invalidate/expected.js index 9876626cf9df..ff30f3a2a807 100644 --- a/test/js/samples/component-store-reassign-invalidate/expected.js +++ b/test/js/samples/component-store-reassign-invalidate/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { insert(target, button, anchor); }, p(ctx, [dirty]) { - if (dirty & 2) set_data(t0, ctx[1]); + if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data(t0, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/data-attribute/expected.js b/test/js/samples/data-attribute/expected.js index d7edc739e8c5..424799fdf33c 100644 --- a/test/js/samples/data-attribute/expected.js +++ b/test/js/samples/data-attribute/expected.js @@ -30,7 +30,7 @@ function create_fragment(ctx) { insert(target, div1, anchor); }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { attr(div1, "data-foo", ctx[0]); } }, diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js index 0f55de4df975..8865fb332e77 100644 --- a/test/js/samples/debug-empty/expected.js +++ b/test/js/samples/debug-empty/expected.js @@ -45,7 +45,7 @@ function create_fragment(ctx) { insert_dev(target, t3, anchor); }, p: function update(ctx, [dirty]) { - if (dirty & 1) set_data_dev(t1, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data_dev(t1, ctx[0]); debugger; }, i: noop, diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js index 11ff13bb46dc..0dfe1a082918 100644 --- a/test/js/samples/debug-foo-bar-baz-things/expected.js +++ b/test/js/samples/debug-foo-bar-baz-things/expected.js @@ -54,9 +54,9 @@ function create_each_block(ctx) { insert_dev(target, t1, anchor); }, p: function update(ctx, dirty) { - if (dirty & 1 && t0_value !== (t0_value = ctx[4].name + "")) set_data_dev(t0, t0_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t0_value !== (t0_value = ctx[4].name + "")) set_data_dev(t0, t0_value); - if (dirty & 15) { + if (dirty & /* _id9uocqrtmw00_1_ */ 15) { const foo = ctx[1]; const bar = ctx[2]; const baz = ctx[3]; @@ -120,7 +120,7 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { each_value = ctx[0]; let i; @@ -143,7 +143,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & 2) set_data_dev(t2, ctx[1]); + if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js index a2b19de8cde8..21fe13073e96 100644 --- a/test/js/samples/debug-foo/expected.js +++ b/test/js/samples/debug-foo/expected.js @@ -51,9 +51,9 @@ function create_each_block(ctx) { insert_dev(target, t1, anchor); }, p: function update(ctx, dirty) { - if (dirty & 1 && t0_value !== (t0_value = ctx[2].name + "")) set_data_dev(t0, t0_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t0_value !== (t0_value = ctx[2].name + "")) set_data_dev(t0, t0_value); - if (dirty & 2) { + if (dirty & /* _id9uocqrtmw00_1_ */ 2) { const foo = ctx[1]; console.log({ foo }); debugger; @@ -114,7 +114,7 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { each_value = ctx[0]; let i; @@ -137,7 +137,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & 2) set_data_dev(t2, ctx[1]); + if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/debug-hoisted/expected.js b/test/js/samples/debug-hoisted/expected.js index 37b983c8cc99..324c02e2c558 100644 --- a/test/js/samples/debug-hoisted/expected.js +++ b/test/js/samples/debug-hoisted/expected.js @@ -24,7 +24,7 @@ function create_fragment(ctx) { }, m: noop, p: function update(ctx, [dirty]) { - if (dirty & 3) { + if (dirty & /* _id9uocqrtmw00_1_ */ 3) { const obj = ctx[0]; const kobzol = ctx[1]; console.log({ obj, kobzol }); diff --git a/test/js/samples/debug-no-dependencies/expected.js b/test/js/samples/debug-no-dependencies/expected.js index 28c5b35dc501..1c1835292c06 100644 --- a/test/js/samples/debug-no-dependencies/expected.js +++ b/test/js/samples/debug-no-dependencies/expected.js @@ -89,7 +89,7 @@ function create_fragment(ctx) { insert_dev(target, each_1_anchor, anchor); }, p: function update(ctx, [dirty]) { - if (dirty & 0) { + if (dirty & /* _id9uocqrtmw00_1_ */ 0) { each_value = things; let i; diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js index 9e4763be65b5..5436bbefcf2b 100644 --- a/test/js/samples/deconflict-builtins/expected.js +++ b/test/js/samples/deconflict-builtins/expected.js @@ -36,7 +36,7 @@ function create_each_block(ctx) { append(span, t); }, p(ctx, dirty) { - if (dirty & 1 && t_value !== (t_value = ctx[1] + "")) set_data(t, t_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t_value !== (t_value = ctx[1] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -69,7 +69,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { each_value = ctx[0]; let i; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index c18817c8122b..c5050dc4b645 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -42,8 +42,8 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); - if (dirty & 2) set_data_dev(t2, ctx[1]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, @@ -86,7 +86,7 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & 1) { + if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 1) { $: $$invalidate(1, bar = foo * 2); } }; diff --git a/test/js/samples/each-block-array-literal/expected.js b/test/js/samples/each-block-array-literal/expected.js index b47b1cca954e..ee0c9a3b4e7b 100644 --- a/test/js/samples/each-block-array-literal/expected.js +++ b/test/js/samples/each-block-array-literal/expected.js @@ -36,7 +36,7 @@ function create_each_block(ctx) { append(span, t); }, p(ctx, dirty) { - if (dirty & 31 && t_value !== (t_value = ctx[5] + "")) set_data(t, t_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 31 && t_value !== (t_value = ctx[5] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -69,7 +69,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - if (dirty & 31) { + if (dirty & /* _id9uocqrtmw00_1_ */ 31) { each_value = [ctx[0], ctx[1], ctx[2], ctx[3], ctx[4]]; let i; diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index f98c738203e2..aed0fae12a77 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -70,9 +70,9 @@ function create_each_block(ctx) { html_tag.m(div); }, p(ctx, dirty) { - if (dirty & 1 && t2_value !== (t2_value = ctx[4].author + "")) set_data(t2, t2_value); - if (dirty & 7 && t4_value !== (t4_value = ctx[1](ctx[4].time, ctx[2]) + "")) set_data(t4, t4_value); - if (dirty & 1 && raw_value !== (raw_value = ctx[4].html + "")) html_tag.p(raw_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t2_value !== (t2_value = ctx[4].author + "")) set_data(t2, t2_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 7 && t4_value !== (t4_value = ctx[1](ctx[4].time, ctx[2]) + "")) set_data(t4, t4_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && raw_value !== (raw_value = ctx[4].html + "")) html_tag.p(raw_value); }, d(detaching) { if (detaching) detach(div); @@ -111,7 +111,7 @@ function create_fragment(ctx) { append(p, t1); }, p(ctx, [dirty]) { - if (dirty & 7) { + if (dirty & /* _id9uocqrtmw00_1_ */ 7) { each_value = ctx[0]; let i; @@ -134,7 +134,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & 8) set_data(t1, ctx[3]); + if (dirty & /* _id9uocqrtmw00_1_ */ 8) set_data(t1, ctx[3]); }, i: noop, o: noop, diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js index 4aa238963f31..7ffde4a8b856 100644 --- a/test/js/samples/each-block-keyed-animated/expected.js +++ b/test/js/samples/each-block-keyed-animated/expected.js @@ -44,7 +44,7 @@ function create_each_block(key_1, ctx) { append(div, t); }, p(ctx, dirty) { - if (dirty & 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); }, r() { rect = div.getBoundingClientRect(); diff --git a/test/js/samples/each-block-keyed/expected.js b/test/js/samples/each-block-keyed/expected.js index aa949e95b9a8..23b294afd9b5 100644 --- a/test/js/samples/each-block-keyed/expected.js +++ b/test/js/samples/each-block-keyed/expected.js @@ -40,7 +40,7 @@ function create_each_block(key_1, ctx) { append(div, t); }, p(ctx, dirty) { - if (dirty & 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(div); diff --git a/test/js/samples/event-handler-dynamic/expected.js b/test/js/samples/event-handler-dynamic/expected.js index adf88c5e0888..4d1e9eb6b6ef 100644 --- a/test/js/samples/event-handler-dynamic/expected.js +++ b/test/js/samples/event-handler-dynamic/expected.js @@ -63,7 +63,7 @@ function create_fragment(ctx) { }, p(new_ctx, [dirty]) { ctx = new_ctx; - if (dirty & 2) set_data(t4, ctx[1]); + if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data(t4, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/inline-style-optimized-multiple/expected.js b/test/js/samples/inline-style-optimized-multiple/expected.js index f9ff9721ba7e..6af193263a4f 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected.js +++ b/test/js/samples/inline-style-optimized-multiple/expected.js @@ -23,11 +23,11 @@ function create_fragment(ctx) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { set_style(div, "color", ctx[0]); } - if (dirty & 6) { + if (dirty & /* _id9uocqrtmw00_1_ */ 6) { set_style(div, "transform", "translate(" + ctx[1] + "px," + ctx[2] + "px)"); } }, diff --git a/test/js/samples/inline-style-optimized-url/expected.js b/test/js/samples/inline-style-optimized-url/expected.js index 806ced193fb3..627f22d693f3 100644 --- a/test/js/samples/inline-style-optimized-url/expected.js +++ b/test/js/samples/inline-style-optimized-url/expected.js @@ -22,7 +22,7 @@ function create_fragment(ctx) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { set_style(div, "background", "url(data:image/png;base64," + ctx[0] + ")"); } }, diff --git a/test/js/samples/inline-style-optimized/expected.js b/test/js/samples/inline-style-optimized/expected.js index d3f8e789be46..948735aace0c 100644 --- a/test/js/samples/inline-style-optimized/expected.js +++ b/test/js/samples/inline-style-optimized/expected.js @@ -22,7 +22,7 @@ function create_fragment(ctx) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { set_style(div, "color", ctx[0]); } }, diff --git a/test/js/samples/inline-style-unoptimized/expected.js b/test/js/samples/inline-style-unoptimized/expected.js index 48da85ede981..5d55aa84f275 100644 --- a/test/js/samples/inline-style-unoptimized/expected.js +++ b/test/js/samples/inline-style-unoptimized/expected.js @@ -31,11 +31,11 @@ function create_fragment(ctx) { insert(target, div1, anchor); }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { attr(div0, "style", ctx[0]); } - if (dirty & 6 && div1_style_value !== (div1_style_value = "" + (ctx[1] + ": " + ctx[2]))) { + if (dirty & /* _id9uocqrtmw00_1_ */ 6 && div1_style_value !== (div1_style_value = "" + (ctx[1] + ": " + ctx[2]))) { attr(div1, "style", div1_style_value); } }, diff --git a/test/js/samples/input-no-initial-value/expected.js b/test/js/samples/input-no-initial-value/expected.js index 0ac875a15abd..24e2ede21ff2 100644 --- a/test/js/samples/input-no-initial-value/expected.js +++ b/test/js/samples/input-no-initial-value/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(form, button); }, p(ctx, [dirty]) { - if (dirty & 1 && input.value !== ctx[0]) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/input-range/expected.js b/test/js/samples/input-range/expected.js index 4693a0b707a0..38ce1087dc47 100644 --- a/test/js/samples/input-range/expected.js +++ b/test/js/samples/input-range/expected.js @@ -29,7 +29,7 @@ function create_fragment(ctx) { set_input_value(input, ctx[0]); }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/input-without-blowback-guard/expected.js b/test/js/samples/input-without-blowback-guard/expected.js index 5a730a697398..02b3463be19c 100644 --- a/test/js/samples/input-without-blowback-guard/expected.js +++ b/test/js/samples/input-without-blowback-guard/expected.js @@ -26,7 +26,7 @@ function create_fragment(ctx) { input.checked = ctx[0]; }, p(ctx, [dirty]) { - if (dirty & 1) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1) { input.checked = ctx[0]; } }, diff --git a/test/js/samples/instrumentation-script-if-no-block/expected.js b/test/js/samples/instrumentation-script-if-no-block/expected.js index 74d9ab46b8bc..893c331b449e 100644 --- a/test/js/samples/instrumentation-script-if-no-block/expected.js +++ b/test/js/samples/instrumentation-script-if-no-block/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & 1) set_data(t3, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t3, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-script-x-equals-x/expected.js b/test/js/samples/instrumentation-script-x-equals-x/expected.js index 0a1e271cbee1..4b3f7a2c2d55 100644 --- a/test/js/samples/instrumentation-script-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-script-x-equals-x/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-if-no-block/expected.js b/test/js/samples/instrumentation-template-if-no-block/expected.js index 4452b54aac0a..291fc9aa33a5 100644 --- a/test/js/samples/instrumentation-template-if-no-block/expected.js +++ b/test/js/samples/instrumentation-template-if-no-block/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & 1) set_data(t3, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t3, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-x-equals-x/expected.js b/test/js/samples/instrumentation-template-x-equals-x/expected.js index 474d78ca7cd7..b3e5f59ea3ee 100644 --- a/test/js/samples/instrumentation-template-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-template-x-equals-x/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js index dcca20b24837..b5b8450216f2 100644 --- a/test/js/samples/media-bindings/expected.js +++ b/test/js/samples/media-bindings/expected.js @@ -68,19 +68,19 @@ function create_fragment(ctx) { } }, p(ctx, [dirty]) { - if (!audio_updating && dirty & 8 && !isNaN(ctx[3])) { + if (!audio_updating && dirty & /* _id9uocqrtmw00_1_ */ 8 && !isNaN(ctx[3])) { audio.currentTime = ctx[3]; } - if (dirty & 32 && audio_is_paused !== (audio_is_paused = ctx[5])) { + if (dirty & /* _id9uocqrtmw00_1_ */ 32 && audio_is_paused !== (audio_is_paused = ctx[5])) { audio[audio_is_paused ? "pause" : "play"](); } - if (dirty & 64 && !isNaN(ctx[6])) { + if (dirty & /* _id9uocqrtmw00_1_ */ 64 && !isNaN(ctx[6])) { audio.volume = ctx[6]; } - if (dirty & 128 && !isNaN(ctx[7])) { + if (dirty & /* _id9uocqrtmw00_1_ */ 128 && !isNaN(ctx[7])) { audio.playbackRate = ctx[7]; } diff --git a/test/js/samples/reactive-values-non-topologically-ordered/expected.js b/test/js/samples/reactive-values-non-topologically-ordered/expected.js index a98e81293f65..2c1f2ace9f37 100644 --- a/test/js/samples/reactive-values-non-topologically-ordered/expected.js +++ b/test/js/samples/reactive-values-non-topologically-ordered/expected.js @@ -11,11 +11,11 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & 1) { + if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 1) { $: $$invalidate(2, b = x); } - if ($$self.$$.dirty & 4) { + if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 4) { $: a = b; } }; diff --git a/test/js/samples/reactive-values-non-writable-dependencies/expected.js b/test/js/samples/reactive-values-non-writable-dependencies/expected.js index 9c29f8510e3e..a12d9cb6977e 100644 --- a/test/js/samples/reactive-values-non-writable-dependencies/expected.js +++ b/test/js/samples/reactive-values-non-writable-dependencies/expected.js @@ -11,7 +11,7 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & 3) { + if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 3) { $: console.log("max", Math.max(a, b)); } }; diff --git a/test/js/samples/select-dynamic-value/expected.js b/test/js/samples/select-dynamic-value/expected.js index 8f309aaed224..44e343c5ef78 100644 --- a/test/js/samples/select-dynamic-value/expected.js +++ b/test/js/samples/select-dynamic-value/expected.js @@ -44,7 +44,7 @@ function create_fragment(ctx) { } }, p(ctx, [dirty]) { - if (dirty & 1 && select_value_value !== (select_value_value = ctx[0])) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && select_value_value !== (select_value_value = ctx[0])) { for (var i = 0; i < select.options.length; i += 1) { var option = select.options[i]; diff --git a/test/js/samples/src-attribute-check/expected.js b/test/js/samples/src-attribute-check/expected.js index ab73564ab388..7d04c4a3504c 100644 --- a/test/js/samples/src-attribute-check/expected.js +++ b/test/js/samples/src-attribute-check/expected.js @@ -45,11 +45,11 @@ function create_fragment(ctx) { insert(target, img1, anchor); }, p(ctx, [dirty]) { - if (dirty & 1 && img0.src !== (img0_src_value = ctx[0])) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && img0.src !== (img0_src_value = ctx[0])) { attr(img0, "src", img0_src_value); } - if (dirty & 2 && img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) { + if (dirty & /* _id9uocqrtmw00_1_ */ 2 && img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) { attr(img1, "src", img1_src_value); } }, diff --git a/test/js/samples/title/expected.js b/test/js/samples/title/expected.js index 3d29c496a42b..3bc02f60c671 100644 --- a/test/js/samples/title/expected.js +++ b/test/js/samples/title/expected.js @@ -9,7 +9,7 @@ function create_fragment(ctx) { c: noop, m: noop, p(ctx, [dirty]) { - if (dirty & 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { document.title = title_value; } }, diff --git a/test/js/samples/unchanged-expression/expected.js b/test/js/samples/unchanged-expression/expected.js index eee0079a71b8..0c0b779270f6 100644 --- a/test/js/samples/unchanged-expression/expected.js +++ b/test/js/samples/unchanged-expression/expected.js @@ -57,7 +57,7 @@ function create_fragment(ctx) { append(p3, t9); }, p(ctx, [dirty]) { - if (dirty & 1) set_data(t9, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t9, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/unreferenced-state-not-invalidated/expected.js b/test/js/samples/unreferenced-state-not-invalidated/expected.js index 5fa679aecfee..c0f6da2928aa 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/expected.js +++ b/test/js/samples/unreferenced-state-not-invalidated/expected.js @@ -28,7 +28,7 @@ function create_fragment(ctx) { append(p, t); }, p(ctx, [dirty]) { - if (dirty & 1) set_data(t, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t, ctx[0]); }, i: noop, o: noop, @@ -58,7 +58,7 @@ function instance($$self, $$props, $$invalidate) { let y; $$self.$$.update = () => { - if ($$self.$$.dirty & 2) { + if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 2) { $: $$invalidate(0, y = b * 2); } }; diff --git a/test/js/samples/video-bindings/expected.js b/test/js/samples/video-bindings/expected.js index 4149d950591f..71ab2c545d6a 100644 --- a/test/js/samples/video-bindings/expected.js +++ b/test/js/samples/video-bindings/expected.js @@ -48,7 +48,7 @@ function create_fragment(ctx) { video_resize_listener = add_resize_listener(video, ctx[4].bind(video)); }, p(ctx, [dirty]) { - if (!video_updating && dirty & 1 && !isNaN(ctx[0])) { + if (!video_updating && dirty & /* _id9uocqrtmw00_1_ */ 1 && !isNaN(ctx[0])) { video.currentTime = ctx[0]; } diff --git a/test/js/samples/window-binding-scroll/expected.js b/test/js/samples/window-binding-scroll/expected.js index 886c0653335c..11e7160646d4 100644 --- a/test/js/samples/window-binding-scroll/expected.js +++ b/test/js/samples/window-binding-scroll/expected.js @@ -47,14 +47,14 @@ function create_fragment(ctx) { append(p, t1); }, p(ctx, [dirty]) { - if (dirty & 1 && !scrolling) { + if (dirty & /* _id9uocqrtmw00_1_ */ 1 && !scrolling) { scrolling = true; clearTimeout(scrolling_timeout); scrollTo(window.pageXOffset, ctx[0]); scrolling_timeout = setTimeout(clear_scrolling, 100); } - if (dirty & 1) set_data(t1, ctx[0]); + if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t1, ctx[0]); }, i: noop, o: noop, From 32099d922c3f3196b7254bb27f05624953c3717f Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 17:41:59 -0500 Subject: [PATCH 41/43] update tests --- package-lock.json | 6 +++--- package.json | 2 +- .../js/samples/action-custom-event-handler/expected.js | 2 +- test/js/samples/bind-open/expected.js | 2 +- test/js/samples/capture-inject-dev-only/expected.js | 4 ++-- .../samples/collapses-text-around-comments/expected.js | 2 +- test/js/samples/component-static-var/expected.js | 4 ++-- .../component-store-access-invalidate/expected.js | 2 +- .../component-store-reassign-invalidate/expected.js | 2 +- test/js/samples/data-attribute/expected.js | 2 +- test/js/samples/debug-empty/expected.js | 2 +- test/js/samples/debug-foo-bar-baz-things/expected.js | 8 ++++---- test/js/samples/debug-foo/expected.js | 8 ++++---- test/js/samples/debug-hoisted/expected.js | 2 +- test/js/samples/debug-no-dependencies/expected.js | 2 +- test/js/samples/deconflict-builtins/expected.js | 4 ++-- .../dev-warning-missing-data-computed/expected.js | 6 +++--- test/js/samples/each-block-array-literal/expected.js | 4 ++-- test/js/samples/each-block-changed-check/expected.js | 10 +++++----- test/js/samples/each-block-keyed-animated/expected.js | 2 +- test/js/samples/each-block-keyed/expected.js | 2 +- test/js/samples/event-handler-dynamic/expected.js | 2 +- .../inline-style-optimized-multiple/expected.js | 4 ++-- test/js/samples/inline-style-optimized-url/expected.js | 2 +- test/js/samples/inline-style-optimized/expected.js | 2 +- test/js/samples/inline-style-unoptimized/expected.js | 4 ++-- test/js/samples/input-no-initial-value/expected.js | 2 +- test/js/samples/input-range/expected.js | 2 +- .../samples/input-without-blowback-guard/expected.js | 2 +- .../instrumentation-script-if-no-block/expected.js | 2 +- .../instrumentation-script-x-equals-x/expected.js | 2 +- .../instrumentation-template-if-no-block/expected.js | 2 +- .../instrumentation-template-x-equals-x/expected.js | 2 +- test/js/samples/media-bindings/expected.js | 8 ++++---- .../expected.js | 4 ++-- .../expected.js | 2 +- test/js/samples/select-dynamic-value/expected.js | 2 +- test/js/samples/src-attribute-check/expected.js | 4 ++-- test/js/samples/title/expected.js | 2 +- test/js/samples/unchanged-expression/expected.js | 2 +- .../unreferenced-state-not-invalidated/expected.js | 4 ++-- test/js/samples/video-bindings/expected.js | 2 +- test/js/samples/window-binding-scroll/expected.js | 4 ++-- 43 files changed, 70 insertions(+), 70 deletions(-) diff --git a/package-lock.json b/package-lock.json index 1af50ed64291..dd9d418f1873 100644 --- a/package-lock.json +++ b/package-lock.json @@ -500,9 +500,9 @@ "dev": true }, "code-red": { - "version": "0.0.25", - "resolved": "https://registry.npmjs.org/code-red/-/code-red-0.0.25.tgz", - "integrity": "sha512-KxR5fi6hN3Lhg/VFBaucVaWe5LT8HvgKE7+q09ZV73PbBuuLWSK8DKeOtZTbpZ41BLimaggzawSgK7HQr+m1DA==", + "version": "0.0.26", + "resolved": "https://registry.npmjs.org/code-red/-/code-red-0.0.26.tgz", + "integrity": "sha512-W4t68vk3xJjmkbuAKfEtaj7E+K82BtV+A4VjBlxHA6gDoSLc+sTB643JdJMSk27vpp5iEqHFuGnHieQGy/GmUQ==", "dev": true, "requires": { "acorn": "^7.1.0", diff --git a/package.json b/package.json index 8584ac6ff867..27ee2f5f9496 100644 --- a/package.json +++ b/package.json @@ -64,7 +64,7 @@ "acorn": "^7.1.0", "agadoo": "^1.1.0", "c8": "^5.0.1", - "code-red": "0.0.25", + "code-red": "0.0.26", "codecov": "^3.5.0", "css-tree": "1.0.0-alpha22", "eslint": "^6.3.0", diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js index 2f863217b6ce..60de12116542 100644 --- a/test/js/samples/action-custom-event-handler/expected.js +++ b/test/js/samples/action-custom-event-handler/expected.js @@ -24,7 +24,7 @@ function create_fragment(ctx) { foo_action = foo.call(null, button, ctx[1]) || ({}); }, p(ctx, [dirty]) { - if (is_function(foo_action.update) && dirty & /* _id9uocqrtmw00_1_ */ 1) foo_action.update.call(null, ctx[1]); + if (is_function(foo_action.update) && dirty & /* bar */ 1) foo_action.update.call(null, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/bind-open/expected.js b/test/js/samples/bind-open/expected.js index a2bc78f5d9ad..d64715f1af8f 100644 --- a/test/js/samples/bind-open/expected.js +++ b/test/js/samples/bind-open/expected.js @@ -28,7 +28,7 @@ function create_fragment(ctx) { details.open = ctx[0]; }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* open */ 1) { details.open = ctx[0]; } }, diff --git a/test/js/samples/capture-inject-dev-only/expected.js b/test/js/samples/capture-inject-dev-only/expected.js index fd5ee97ce38a..58660caf7e4b 100644 --- a/test/js/samples/capture-inject-dev-only/expected.js +++ b/test/js/samples/capture-inject-dev-only/expected.js @@ -38,9 +38,9 @@ function create_fragment(ctx) { set_input_value(input, ctx[0]); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t0, ctx[0]); + if (dirty & /* foo */ 1) set_data(t0, ctx[0]); - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && input.value !== ctx[0]) { + if (dirty & /* foo */ 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 59bf38e900ca..8e9aa91bb0c8 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -35,7 +35,7 @@ function create_fragment(ctx) { append(p, t); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t, ctx[0]); + if (dirty & /* foo */ 1) set_data(t, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-static-var/expected.js b/test/js/samples/component-static-var/expected.js index f5ec221c02a1..d28cec4f70a9 100644 --- a/test/js/samples/component-static-var/expected.js +++ b/test/js/samples/component-static-var/expected.js @@ -48,10 +48,10 @@ function create_fragment(ctx) { }, p(ctx, [dirty]) { const bar_changes = {}; - if (dirty & /* _id9uocqrtmw00_1_ */ 1) bar_changes.x = ctx[0]; + if (dirty & /* z */ 1) bar_changes.x = ctx[0]; bar.$set(bar_changes); - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && input.value !== ctx[0]) { + if (dirty & /* z */ 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/component-store-access-invalidate/expected.js b/test/js/samples/component-store-access-invalidate/expected.js index e1dae76e898f..abbb3f6e7c9b 100644 --- a/test/js/samples/component-store-access-invalidate/expected.js +++ b/test/js/samples/component-store-access-invalidate/expected.js @@ -29,7 +29,7 @@ function create_fragment(ctx) { append(h1, t); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t, ctx[0]); + if (dirty & /* $foo */ 1) set_data(t, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-store-reassign-invalidate/expected.js b/test/js/samples/component-store-reassign-invalidate/expected.js index ff30f3a2a807..8c8dec8d4431 100644 --- a/test/js/samples/component-store-reassign-invalidate/expected.js +++ b/test/js/samples/component-store-reassign-invalidate/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { insert(target, button, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data(t0, ctx[1]); + if (dirty & /* $foo */ 2) set_data(t0, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/data-attribute/expected.js b/test/js/samples/data-attribute/expected.js index 424799fdf33c..0a8b3e5a4e5a 100644 --- a/test/js/samples/data-attribute/expected.js +++ b/test/js/samples/data-attribute/expected.js @@ -30,7 +30,7 @@ function create_fragment(ctx) { insert(target, div1, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* bar */ 1) { attr(div1, "data-foo", ctx[0]); } }, diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js index 8865fb332e77..e47424edc431 100644 --- a/test/js/samples/debug-empty/expected.js +++ b/test/js/samples/debug-empty/expected.js @@ -45,7 +45,7 @@ function create_fragment(ctx) { insert_dev(target, t3, anchor); }, p: function update(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data_dev(t1, ctx[0]); + if (dirty & /* name */ 1) set_data_dev(t1, ctx[0]); debugger; }, i: noop, diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js index 0dfe1a082918..1f371e777ce0 100644 --- a/test/js/samples/debug-foo-bar-baz-things/expected.js +++ b/test/js/samples/debug-foo-bar-baz-things/expected.js @@ -54,9 +54,9 @@ function create_each_block(ctx) { insert_dev(target, t1, anchor); }, p: function update(ctx, dirty) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t0_value !== (t0_value = ctx[4].name + "")) set_data_dev(t0, t0_value); + if (dirty & /* things */ 1 && t0_value !== (t0_value = ctx[4].name + "")) set_data_dev(t0, t0_value); - if (dirty & /* _id9uocqrtmw00_1_ */ 15) { + if (dirty & /* foo, bar, baz, things */ 15) { const foo = ctx[1]; const bar = ctx[2]; const baz = ctx[3]; @@ -120,7 +120,7 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* things */ 1) { each_value = ctx[0]; let i; @@ -143,7 +143,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data_dev(t2, ctx[1]); + if (dirty & /* foo */ 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js index 21fe13073e96..996c99a05f9e 100644 --- a/test/js/samples/debug-foo/expected.js +++ b/test/js/samples/debug-foo/expected.js @@ -51,9 +51,9 @@ function create_each_block(ctx) { insert_dev(target, t1, anchor); }, p: function update(ctx, dirty) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t0_value !== (t0_value = ctx[2].name + "")) set_data_dev(t0, t0_value); + if (dirty & /* things */ 1 && t0_value !== (t0_value = ctx[2].name + "")) set_data_dev(t0, t0_value); - if (dirty & /* _id9uocqrtmw00_1_ */ 2) { + if (dirty & /* foo */ 2) { const foo = ctx[1]; console.log({ foo }); debugger; @@ -114,7 +114,7 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* things */ 1) { each_value = ctx[0]; let i; @@ -137,7 +137,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data_dev(t2, ctx[1]); + if (dirty & /* foo */ 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/debug-hoisted/expected.js b/test/js/samples/debug-hoisted/expected.js index 324c02e2c558..bc0a4d701c86 100644 --- a/test/js/samples/debug-hoisted/expected.js +++ b/test/js/samples/debug-hoisted/expected.js @@ -24,7 +24,7 @@ function create_fragment(ctx) { }, m: noop, p: function update(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 3) { + if (dirty & /* obj, kobzol */ 3) { const obj = ctx[0]; const kobzol = ctx[1]; console.log({ obj, kobzol }); diff --git a/test/js/samples/debug-no-dependencies/expected.js b/test/js/samples/debug-no-dependencies/expected.js index 1c1835292c06..87555e023da6 100644 --- a/test/js/samples/debug-no-dependencies/expected.js +++ b/test/js/samples/debug-no-dependencies/expected.js @@ -89,7 +89,7 @@ function create_fragment(ctx) { insert_dev(target, each_1_anchor, anchor); }, p: function update(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 0) { + if (dirty & /* things */ 0) { each_value = things; let i; diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js index 5436bbefcf2b..93aee0f931e3 100644 --- a/test/js/samples/deconflict-builtins/expected.js +++ b/test/js/samples/deconflict-builtins/expected.js @@ -36,7 +36,7 @@ function create_each_block(ctx) { append(span, t); }, p(ctx, dirty) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t_value !== (t_value = ctx[1] + "")) set_data(t, t_value); + if (dirty & /* createElement */ 1 && t_value !== (t_value = ctx[1] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -69,7 +69,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* createElement */ 1) { each_value = ctx[0]; let i; diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index c5050dc4b645..b189b3ba4d48 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -42,8 +42,8 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); - if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data_dev(t2, ctx[1]); + if (dirty & /* foo */ 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); + if (dirty & /* bar */ 2) set_data_dev(t2, ctx[1]); }, i: noop, o: noop, @@ -86,7 +86,7 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 1) { + if ($$self.$$.dirty & /* foo */ 1) { $: $$invalidate(1, bar = foo * 2); } }; diff --git a/test/js/samples/each-block-array-literal/expected.js b/test/js/samples/each-block-array-literal/expected.js index ee0c9a3b4e7b..7438540bcc65 100644 --- a/test/js/samples/each-block-array-literal/expected.js +++ b/test/js/samples/each-block-array-literal/expected.js @@ -36,7 +36,7 @@ function create_each_block(ctx) { append(span, t); }, p(ctx, dirty) { - if (dirty & /* _id9uocqrtmw00_1_ */ 31 && t_value !== (t_value = ctx[5] + "")) set_data(t, t_value); + if (dirty & /* a, b, c, d, e */ 31 && t_value !== (t_value = ctx[5] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -69,7 +69,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 31) { + if (dirty & /* a, b, c, d, e */ 31) { each_value = [ctx[0], ctx[1], ctx[2], ctx[3], ctx[4]]; let i; diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index aed0fae12a77..e7cfc3143c68 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -70,9 +70,9 @@ function create_each_block(ctx) { html_tag.m(div); }, p(ctx, dirty) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t2_value !== (t2_value = ctx[4].author + "")) set_data(t2, t2_value); - if (dirty & /* _id9uocqrtmw00_1_ */ 7 && t4_value !== (t4_value = ctx[1](ctx[4].time, ctx[2]) + "")) set_data(t4, t4_value); - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && raw_value !== (raw_value = ctx[4].html + "")) html_tag.p(raw_value); + if (dirty & /* comments */ 1 && t2_value !== (t2_value = ctx[4].author + "")) set_data(t2, t2_value); + if (dirty & /* elapsed, comments, time */ 7 && t4_value !== (t4_value = ctx[1](ctx[4].time, ctx[2]) + "")) set_data(t4, t4_value); + if (dirty & /* comments */ 1 && raw_value !== (raw_value = ctx[4].html + "")) html_tag.p(raw_value); }, d(detaching) { if (detaching) detach(div); @@ -111,7 +111,7 @@ function create_fragment(ctx) { append(p, t1); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 7) { + if (dirty & /* comments, elapsed, time */ 7) { each_value = ctx[0]; let i; @@ -134,7 +134,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & /* _id9uocqrtmw00_1_ */ 8) set_data(t1, ctx[3]); + if (dirty & /* foo */ 8) set_data(t1, ctx[3]); }, i: noop, o: noop, diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js index 7ffde4a8b856..6df3a817c09d 100644 --- a/test/js/samples/each-block-keyed-animated/expected.js +++ b/test/js/samples/each-block-keyed-animated/expected.js @@ -44,7 +44,7 @@ function create_each_block(key_1, ctx) { append(div, t); }, p(ctx, dirty) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + if (dirty & /* things */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); }, r() { rect = div.getBoundingClientRect(); diff --git a/test/js/samples/each-block-keyed/expected.js b/test/js/samples/each-block-keyed/expected.js index 23b294afd9b5..025e08d4f3e6 100644 --- a/test/js/samples/each-block-keyed/expected.js +++ b/test/js/samples/each-block-keyed/expected.js @@ -40,7 +40,7 @@ function create_each_block(key_1, ctx) { append(div, t); }, p(ctx, dirty) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + if (dirty & /* things */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(div); diff --git a/test/js/samples/event-handler-dynamic/expected.js b/test/js/samples/event-handler-dynamic/expected.js index 4d1e9eb6b6ef..552c48f9dde5 100644 --- a/test/js/samples/event-handler-dynamic/expected.js +++ b/test/js/samples/event-handler-dynamic/expected.js @@ -63,7 +63,7 @@ function create_fragment(ctx) { }, p(new_ctx, [dirty]) { ctx = new_ctx; - if (dirty & /* _id9uocqrtmw00_1_ */ 2) set_data(t4, ctx[1]); + if (dirty & /* number */ 2) set_data(t4, ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/inline-style-optimized-multiple/expected.js b/test/js/samples/inline-style-optimized-multiple/expected.js index 6af193263a4f..ba173ffc3888 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected.js +++ b/test/js/samples/inline-style-optimized-multiple/expected.js @@ -23,11 +23,11 @@ function create_fragment(ctx) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* color */ 1) { set_style(div, "color", ctx[0]); } - if (dirty & /* _id9uocqrtmw00_1_ */ 6) { + if (dirty & /* x, y */ 6) { set_style(div, "transform", "translate(" + ctx[1] + "px," + ctx[2] + "px)"); } }, diff --git a/test/js/samples/inline-style-optimized-url/expected.js b/test/js/samples/inline-style-optimized-url/expected.js index 627f22d693f3..862d16421f90 100644 --- a/test/js/samples/inline-style-optimized-url/expected.js +++ b/test/js/samples/inline-style-optimized-url/expected.js @@ -22,7 +22,7 @@ function create_fragment(ctx) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* data */ 1) { set_style(div, "background", "url(data:image/png;base64," + ctx[0] + ")"); } }, diff --git a/test/js/samples/inline-style-optimized/expected.js b/test/js/samples/inline-style-optimized/expected.js index 948735aace0c..cf5241153cd3 100644 --- a/test/js/samples/inline-style-optimized/expected.js +++ b/test/js/samples/inline-style-optimized/expected.js @@ -22,7 +22,7 @@ function create_fragment(ctx) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* color */ 1) { set_style(div, "color", ctx[0]); } }, diff --git a/test/js/samples/inline-style-unoptimized/expected.js b/test/js/samples/inline-style-unoptimized/expected.js index 5d55aa84f275..b31160fb7fc4 100644 --- a/test/js/samples/inline-style-unoptimized/expected.js +++ b/test/js/samples/inline-style-unoptimized/expected.js @@ -31,11 +31,11 @@ function create_fragment(ctx) { insert(target, div1, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* style */ 1) { attr(div0, "style", ctx[0]); } - if (dirty & /* _id9uocqrtmw00_1_ */ 6 && div1_style_value !== (div1_style_value = "" + (ctx[1] + ": " + ctx[2]))) { + if (dirty & /* key, value */ 6 && div1_style_value !== (div1_style_value = "" + (ctx[1] + ": " + ctx[2]))) { attr(div1, "style", div1_style_value); } }, diff --git a/test/js/samples/input-no-initial-value/expected.js b/test/js/samples/input-no-initial-value/expected.js index 24e2ede21ff2..30deda64f13a 100644 --- a/test/js/samples/input-no-initial-value/expected.js +++ b/test/js/samples/input-no-initial-value/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(form, button); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && input.value !== ctx[0]) { + if (dirty & /* test */ 1 && input.value !== ctx[0]) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/input-range/expected.js b/test/js/samples/input-range/expected.js index 38ce1087dc47..85d784a17c0d 100644 --- a/test/js/samples/input-range/expected.js +++ b/test/js/samples/input-range/expected.js @@ -29,7 +29,7 @@ function create_fragment(ctx) { set_input_value(input, ctx[0]); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* value */ 1) { set_input_value(input, ctx[0]); } }, diff --git a/test/js/samples/input-without-blowback-guard/expected.js b/test/js/samples/input-without-blowback-guard/expected.js index 02b3463be19c..bc9566071341 100644 --- a/test/js/samples/input-without-blowback-guard/expected.js +++ b/test/js/samples/input-without-blowback-guard/expected.js @@ -26,7 +26,7 @@ function create_fragment(ctx) { input.checked = ctx[0]; }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) { + if (dirty & /* foo */ 1) { input.checked = ctx[0]; } }, diff --git a/test/js/samples/instrumentation-script-if-no-block/expected.js b/test/js/samples/instrumentation-script-if-no-block/expected.js index 893c331b449e..753b09031a6b 100644 --- a/test/js/samples/instrumentation-script-if-no-block/expected.js +++ b/test/js/samples/instrumentation-script-if-no-block/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t3, ctx[0]); + if (dirty & /* x */ 1) set_data(t3, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-script-x-equals-x/expected.js b/test/js/samples/instrumentation-script-x-equals-x/expected.js index 4b3f7a2c2d55..d867e0cddb88 100644 --- a/test/js/samples/instrumentation-script-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-script-x-equals-x/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + if (dirty & /* things */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-if-no-block/expected.js b/test/js/samples/instrumentation-template-if-no-block/expected.js index 291fc9aa33a5..3305db76cb25 100644 --- a/test/js/samples/instrumentation-template-if-no-block/expected.js +++ b/test/js/samples/instrumentation-template-if-no-block/expected.js @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t3, ctx[0]); + if (dirty & /* x */ 1) set_data(t3, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-x-equals-x/expected.js b/test/js/samples/instrumentation-template-x-equals-x/expected.js index b3e5f59ea3ee..6e9b20db6be5 100644 --- a/test/js/samples/instrumentation-template-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-template-x-equals-x/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + if (dirty & /* things */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js index b5b8450216f2..11201eb4bef5 100644 --- a/test/js/samples/media-bindings/expected.js +++ b/test/js/samples/media-bindings/expected.js @@ -68,19 +68,19 @@ function create_fragment(ctx) { } }, p(ctx, [dirty]) { - if (!audio_updating && dirty & /* _id9uocqrtmw00_1_ */ 8 && !isNaN(ctx[3])) { + if (!audio_updating && dirty & /* currentTime */ 8 && !isNaN(ctx[3])) { audio.currentTime = ctx[3]; } - if (dirty & /* _id9uocqrtmw00_1_ */ 32 && audio_is_paused !== (audio_is_paused = ctx[5])) { + if (dirty & /* paused */ 32 && audio_is_paused !== (audio_is_paused = ctx[5])) { audio[audio_is_paused ? "pause" : "play"](); } - if (dirty & /* _id9uocqrtmw00_1_ */ 64 && !isNaN(ctx[6])) { + if (dirty & /* volume */ 64 && !isNaN(ctx[6])) { audio.volume = ctx[6]; } - if (dirty & /* _id9uocqrtmw00_1_ */ 128 && !isNaN(ctx[7])) { + if (dirty & /* playbackRate */ 128 && !isNaN(ctx[7])) { audio.playbackRate = ctx[7]; } diff --git a/test/js/samples/reactive-values-non-topologically-ordered/expected.js b/test/js/samples/reactive-values-non-topologically-ordered/expected.js index 2c1f2ace9f37..8b7cbf344261 100644 --- a/test/js/samples/reactive-values-non-topologically-ordered/expected.js +++ b/test/js/samples/reactive-values-non-topologically-ordered/expected.js @@ -11,11 +11,11 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 1) { + if ($$self.$$.dirty & /* x */ 1) { $: $$invalidate(2, b = x); } - if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 4) { + if ($$self.$$.dirty & /* b */ 4) { $: a = b; } }; diff --git a/test/js/samples/reactive-values-non-writable-dependencies/expected.js b/test/js/samples/reactive-values-non-writable-dependencies/expected.js index a12d9cb6977e..4a53580adcbc 100644 --- a/test/js/samples/reactive-values-non-writable-dependencies/expected.js +++ b/test/js/samples/reactive-values-non-writable-dependencies/expected.js @@ -11,7 +11,7 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 3) { + if ($$self.$$.dirty & /* a, b */ 3) { $: console.log("max", Math.max(a, b)); } }; diff --git a/test/js/samples/select-dynamic-value/expected.js b/test/js/samples/select-dynamic-value/expected.js index 44e343c5ef78..d9102dbb3882 100644 --- a/test/js/samples/select-dynamic-value/expected.js +++ b/test/js/samples/select-dynamic-value/expected.js @@ -44,7 +44,7 @@ function create_fragment(ctx) { } }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && select_value_value !== (select_value_value = ctx[0])) { + if (dirty & /* current */ 1 && select_value_value !== (select_value_value = ctx[0])) { for (var i = 0; i < select.options.length; i += 1) { var option = select.options[i]; diff --git a/test/js/samples/src-attribute-check/expected.js b/test/js/samples/src-attribute-check/expected.js index 7d04c4a3504c..23ed56772e1d 100644 --- a/test/js/samples/src-attribute-check/expected.js +++ b/test/js/samples/src-attribute-check/expected.js @@ -45,11 +45,11 @@ function create_fragment(ctx) { insert(target, img1, anchor); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && img0.src !== (img0_src_value = ctx[0])) { + if (dirty & /* url */ 1 && img0.src !== (img0_src_value = ctx[0])) { attr(img0, "src", img0_src_value); } - if (dirty & /* _id9uocqrtmw00_1_ */ 2 && img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) { + if (dirty & /* slug */ 2 && img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) { attr(img1, "src", img1_src_value); } }, diff --git a/test/js/samples/title/expected.js b/test/js/samples/title/expected.js index 3bc02f60c671..06755a7f9768 100644 --- a/test/js/samples/title/expected.js +++ b/test/js/samples/title/expected.js @@ -9,7 +9,7 @@ function create_fragment(ctx) { c: noop, m: noop, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { + if (dirty & /* custom */ 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { document.title = title_value; } }, diff --git a/test/js/samples/unchanged-expression/expected.js b/test/js/samples/unchanged-expression/expected.js index 0c0b779270f6..3539d115d68e 100644 --- a/test/js/samples/unchanged-expression/expected.js +++ b/test/js/samples/unchanged-expression/expected.js @@ -57,7 +57,7 @@ function create_fragment(ctx) { append(p3, t9); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t9, ctx[0]); + if (dirty & /* world3 */ 1) set_data(t9, ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/unreferenced-state-not-invalidated/expected.js b/test/js/samples/unreferenced-state-not-invalidated/expected.js index c0f6da2928aa..ff3c3e597f6d 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/expected.js +++ b/test/js/samples/unreferenced-state-not-invalidated/expected.js @@ -28,7 +28,7 @@ function create_fragment(ctx) { append(p, t); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t, ctx[0]); + if (dirty & /* y */ 1) set_data(t, ctx[0]); }, i: noop, o: noop, @@ -58,7 +58,7 @@ function instance($$self, $$props, $$invalidate) { let y; $$self.$$.update = () => { - if ($$self.$$.dirty & /* _id9uocqrtmw00_1_ */ 2) { + if ($$self.$$.dirty & /* b */ 2) { $: $$invalidate(0, y = b * 2); } }; diff --git a/test/js/samples/video-bindings/expected.js b/test/js/samples/video-bindings/expected.js index 71ab2c545d6a..0b318bddc09c 100644 --- a/test/js/samples/video-bindings/expected.js +++ b/test/js/samples/video-bindings/expected.js @@ -48,7 +48,7 @@ function create_fragment(ctx) { video_resize_listener = add_resize_listener(video, ctx[4].bind(video)); }, p(ctx, [dirty]) { - if (!video_updating && dirty & /* _id9uocqrtmw00_1_ */ 1 && !isNaN(ctx[0])) { + if (!video_updating && dirty & /* currentTime */ 1 && !isNaN(ctx[0])) { video.currentTime = ctx[0]; } diff --git a/test/js/samples/window-binding-scroll/expected.js b/test/js/samples/window-binding-scroll/expected.js index 11e7160646d4..b7b46033562d 100644 --- a/test/js/samples/window-binding-scroll/expected.js +++ b/test/js/samples/window-binding-scroll/expected.js @@ -47,14 +47,14 @@ function create_fragment(ctx) { append(p, t1); }, p(ctx, [dirty]) { - if (dirty & /* _id9uocqrtmw00_1_ */ 1 && !scrolling) { + if (dirty & /* y */ 1 && !scrolling) { scrolling = true; clearTimeout(scrolling_timeout); scrollTo(window.pageXOffset, ctx[0]); scrolling_timeout = setTimeout(clear_scrolling, 100); } - if (dirty & /* _id9uocqrtmw00_1_ */ 1) set_data(t1, ctx[0]); + if (dirty & /* y */ 1) set_data(t1, ctx[0]); }, i: noop, o: noop, From e0eddb5beb24b7746922709620d11b4943f8a317 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 22 Nov 2019 17:48:20 -0500 Subject: [PATCH 42/43] moar comments --- src/compiler/compile/render_dom/Renderer.ts | 6 +- .../action-custom-event-handler/expected.js | 4 +- test/js/samples/bind-online/expected.js | 7 ++- test/js/samples/bind-open/expected.js | 8 +-- test/js/samples/bind-width-height/expected.js | 4 +- .../bindings-readonly-order/expected.js | 6 +- .../capture-inject-dev-only/expected.js | 12 ++-- .../expected.js | 6 +- .../component-static-array/expected.js | 2 +- .../component-static-immutable/expected.js | 2 +- .../component-static-immutable2/expected.js | 2 +- .../samples/component-static-var/expected.js | 12 ++-- test/js/samples/component-static/expected.js | 2 +- .../expected.js | 4 +- .../expected.js | 6 +- test/js/samples/css-media-query/expected.js | 4 +- .../css-shadow-dom-keyframes/expected.js | 6 +- test/js/samples/data-attribute/expected.js | 6 +- test/js/samples/debug-empty/expected.js | 6 +- .../debug-foo-bar-baz-things/expected.js | 40 ++++++------- test/js/samples/debug-foo/expected.js | 24 ++++---- test/js/samples/debug-hoisted/expected.js | 10 ++-- .../samples/debug-no-dependencies/expected.js | 6 +- .../samples/deconflict-builtins/expected.js | 10 ++-- .../expected.js | 12 ++-- .../each-block-array-literal/expected.js | 10 ++-- .../each-block-changed-check/expected.js | 24 ++++---- .../each-block-keyed-animated/expected.js | 10 ++-- test/js/samples/each-block-keyed/expected.js | 10 ++-- .../samples/event-handler-dynamic/expected.js | 10 ++-- test/js/samples/if-block-complex/expected.js | 2 +- .../js/samples/if-block-no-update/expected.js | 2 +- test/js/samples/if-block-simple/expected.js | 4 +- .../expected.js | 12 ++-- .../inline-style-optimized-url/expected.js | 6 +- .../inline-style-optimized/expected.js | 6 +- .../inline-style-unoptimized/expected.js | 10 ++-- test/js/samples/input-files/expected.js | 2 +- .../input-no-initial-value/expected.js | 12 ++-- test/js/samples/input-range/expected.js | 12 ++-- .../input-without-blowback-guard/expected.js | 8 +-- .../expected.js | 6 +- .../expected.js | 6 +- .../expected.js | 6 +- .../expected.js | 6 +- test/js/samples/media-bindings/expected.js | 56 +++++++++---------- .../expected.js | 4 +- .../expected.js | 2 +- .../samples/select-dynamic-value/expected.js | 4 +- .../samples/src-attribute-check/expected.js | 8 +-- test/js/samples/title/expected.js | 4 +- test/js/samples/transition-local/expected.js | 8 +-- .../transition-repeated-outro/expected.js | 4 +- .../samples/unchanged-expression/expected.js | 4 +- .../expected.js | 6 +- .../use-elements-as-anchors/expected.js | 20 +++---- test/js/samples/video-bindings/expected.js | 14 ++--- .../samples/window-binding-online/expected.js | 7 ++- .../samples/window-binding-scroll/expected.js | 12 ++-- 59 files changed, 272 insertions(+), 252 deletions(-) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index 262297bd169d..6de1c92f0794 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -238,12 +238,12 @@ export default class Renderer { const expression = bitmask .map((b, i) => ({ b, i })) .filter(({ b }) => b) - .map(({ b, i }) => x`${dirty}[${i}] & /* ${b.names.join(', ')} */ ${b.n}`) + .map(({ b, i }) => x`${dirty}[${i}] & /*${b.names.join(', ')}*/ ${b.n}`) .reduce((lhs, rhs) => x`${lhs} | ${rhs}`); ({ operator, left, right } = expression); } else { - ({ operator, left, right } = x`${dirty} & /* ${names.join(', ')} */ ${bitmask[0] ? bitmask[0].n : 0}` as BinaryExpression); // TODO the `: 0` case should never apply + ({ operator, left, right } = x`${dirty} & /*${names.join(', ')}*/ ${bitmask[0] ? bitmask[0].n : 0}` as BinaryExpression); // TODO the `: 0` case should never apply } return 'BinaryExpression'; @@ -274,7 +274,7 @@ export default class Renderer { } if (member !== undefined) { - const replacement = x`#ctx[${member.index}]` as MemberExpression; + const replacement = x`/*${member.name}*/ #ctx[${member.index}]` as MemberExpression; if (nodes[0].loc) replacement.object.loc = nodes[0].loc; nodes[0] = replacement; diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js index 60de12116542..6c3a2a5b0b30 100644 --- a/test/js/samples/action-custom-event-handler/expected.js +++ b/test/js/samples/action-custom-event-handler/expected.js @@ -21,10 +21,10 @@ function create_fragment(ctx) { }, m(target, anchor) { insert(target, button, anchor); - foo_action = foo.call(null, button, ctx[1]) || ({}); + foo_action = foo.call(null, button, /*foo_function*/ ctx[1]) || ({}); }, p(ctx, [dirty]) { - if (is_function(foo_action.update) && dirty & /* bar */ 1) foo_action.update.call(null, ctx[1]); + if (is_function(foo_action.update) && dirty & /*bar*/ 1) foo_action.update.call(null, /*foo_function*/ ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/bind-online/expected.js b/test/js/samples/bind-online/expected.js index a2e0c0b89d57..8285646481a2 100644 --- a/test/js/samples/bind-online/expected.js +++ b/test/js/samples/bind-online/expected.js @@ -11,11 +11,14 @@ import { function create_fragment(ctx) { let dispose; - add_render_callback(ctx[1]); + add_render_callback(/*onlinestatuschanged*/ ctx[1]); return { c() { - dispose = [listen(window, "online", ctx[1]), listen(window, "offline", ctx[1])]; + dispose = [ + listen(window, "online", /*onlinestatuschanged*/ ctx[1]), + listen(window, "offline", /*onlinestatuschanged*/ ctx[1]) + ]; }, m: noop, p: noop, diff --git a/test/js/samples/bind-open/expected.js b/test/js/samples/bind-open/expected.js index d64715f1af8f..d4f148cac9d0 100644 --- a/test/js/samples/bind-open/expected.js +++ b/test/js/samples/bind-open/expected.js @@ -21,15 +21,15 @@ function create_fragment(ctx) { details.innerHTML = `summarycontent `; - dispose = listen(details, "toggle", ctx[1]); + dispose = listen(details, "toggle", /*details_toggle_handler*/ ctx[1]); }, m(target, anchor) { insert(target, details, anchor); - details.open = ctx[0]; + details.open = /*open*/ ctx[0]; }, p(ctx, [dirty]) { - if (dirty & /* open */ 1) { - details.open = ctx[0]; + if (dirty & /*open*/ 1) { + details.open = /*open*/ ctx[0]; } }, i: noop, diff --git a/test/js/samples/bind-width-height/expected.js b/test/js/samples/bind-width-height/expected.js index 551f05fd76ed..5c1888b7db02 100644 --- a/test/js/samples/bind-width-height/expected.js +++ b/test/js/samples/bind-width-height/expected.js @@ -19,11 +19,11 @@ function create_fragment(ctx) { c() { div = element("div"); div.textContent = "some content"; - add_render_callback(() => ctx[2].call(div)); + add_render_callback(() => /*div_elementresize_handler*/ ctx[2].call(div)); }, m(target, anchor) { insert(target, div, anchor); - div_resize_listener = add_resize_listener(div, ctx[2].bind(div)); + div_resize_listener = add_resize_listener(div, /*div_elementresize_handler*/ ctx[2].bind(div)); }, p: noop, i: noop, diff --git a/test/js/samples/bindings-readonly-order/expected.js b/test/js/samples/bindings-readonly-order/expected.js index 99078890f0a4..cf3068666215 100644 --- a/test/js/samples/bindings-readonly-order/expected.js +++ b/test/js/samples/bindings-readonly-order/expected.js @@ -26,7 +26,11 @@ function create_fragment(ctx) { input1 = element("input"); attr(input0, "type", "file"); attr(input1, "type", "file"); - dispose = [listen(input0, "change", ctx[1]), listen(input1, "change", ctx[2])]; + + dispose = [ + listen(input0, "change", /*input0_change_handler*/ ctx[1]), + listen(input1, "change", /*input1_change_handler*/ ctx[2]) + ]; }, m(target, anchor) { insert(target, input0, anchor); diff --git a/test/js/samples/capture-inject-dev-only/expected.js b/test/js/samples/capture-inject-dev-only/expected.js index 58660caf7e4b..6c639d9207f6 100644 --- a/test/js/samples/capture-inject-dev-only/expected.js +++ b/test/js/samples/capture-inject-dev-only/expected.js @@ -25,23 +25,23 @@ function create_fragment(ctx) { return { c() { p = element("p"); - t0 = text(ctx[0]); + t0 = text(/*foo*/ ctx[0]); t1 = space(); input = element("input"); - dispose = listen(input, "input", ctx[1]); + dispose = listen(input, "input", /*input_input_handler*/ ctx[1]); }, m(target, anchor) { insert(target, p, anchor); append(p, t0); insert(target, t1, anchor); insert(target, input, anchor); - set_input_value(input, ctx[0]); + set_input_value(input, /*foo*/ ctx[0]); }, p(ctx, [dirty]) { - if (dirty & /* foo */ 1) set_data(t0, ctx[0]); + if (dirty & /*foo*/ 1) set_data(t0, /*foo*/ ctx[0]); - if (dirty & /* foo */ 1 && input.value !== ctx[0]) { - set_input_value(input, ctx[0]); + if (dirty & /*foo*/ 1 && input.value !== /*foo*/ ctx[0]) { + set_input_value(input, /*foo*/ ctx[0]); } }, i: noop, diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 8e9aa91bb0c8..24f2703f0a05 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -16,7 +16,7 @@ import { function add_css() { var style = element("style"); style.id = "svelte-1a7i8ec-style"; - style.textContent = "p.svelte-1a7i8ec{color:red}"; + style.textContent = "p.svelte-1a7i8ec{\n\t\tcolor: red;\n\t}"; append(document.head, style); } @@ -27,7 +27,7 @@ function create_fragment(ctx) { return { c() { p = element("p"); - t = text(ctx[0]); + t = text(/*foo*/ ctx[0]); attr(p, "class", "svelte-1a7i8ec"); }, m(target, anchor) { @@ -35,7 +35,7 @@ function create_fragment(ctx) { append(p, t); }, p(ctx, [dirty]) { - if (dirty & /* foo */ 1) set_data(t, ctx[0]); + if (dirty & /*foo*/ 1) set_data(t, /*foo*/ ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-static-array/expected.js b/test/js/samples/component-static-array/expected.js index 7948ecd171fa..44e8dbfe330f 100644 --- a/test/js/samples/component-static-array/expected.js +++ b/test/js/samples/component-static-array/expected.js @@ -13,7 +13,7 @@ import { function create_fragment(ctx) { let current; - const nested = new ctx[0]({ props: { foo: [1, 2, 3] } }); + const nested = new /*Nested*/ ctx[0]({ props: { foo: [1, 2, 3] } }); return { c() { diff --git a/test/js/samples/component-static-immutable/expected.js b/test/js/samples/component-static-immutable/expected.js index 80d531b79341..a7dd8128fa94 100644 --- a/test/js/samples/component-static-immutable/expected.js +++ b/test/js/samples/component-static-immutable/expected.js @@ -13,7 +13,7 @@ import { function create_fragment(ctx) { let current; - const nested = new ctx[0]({ props: { foo: "bar" } }); + const nested = new /*Nested*/ ctx[0]({ props: { foo: "bar" } }); return { c() { diff --git a/test/js/samples/component-static-immutable2/expected.js b/test/js/samples/component-static-immutable2/expected.js index 80d531b79341..a7dd8128fa94 100644 --- a/test/js/samples/component-static-immutable2/expected.js +++ b/test/js/samples/component-static-immutable2/expected.js @@ -13,7 +13,7 @@ import { function create_fragment(ctx) { let current; - const nested = new ctx[0]({ props: { foo: "bar" } }); + const nested = new /*Nested*/ ctx[0]({ props: { foo: "bar" } }); return { c() { diff --git a/test/js/samples/component-static-var/expected.js b/test/js/samples/component-static-var/expected.js index d28cec4f70a9..e01402b6d445 100644 --- a/test/js/samples/component-static-var/expected.js +++ b/test/js/samples/component-static-var/expected.js @@ -26,7 +26,7 @@ function create_fragment(ctx) { let current; let dispose; const foo = new Foo({ props: { x: y } }); - const bar = new Bar({ props: { x: ctx[0] } }); + const bar = new Bar({ props: { x: /*z*/ ctx[0] } }); return { c() { @@ -35,7 +35,7 @@ function create_fragment(ctx) { create_component(bar.$$.fragment); t1 = space(); input = element("input"); - dispose = listen(input, "input", ctx[1]); + dispose = listen(input, "input", /*input_input_handler*/ ctx[1]); }, m(target, anchor) { mount_component(foo, target, anchor); @@ -43,16 +43,16 @@ function create_fragment(ctx) { mount_component(bar, target, anchor); insert(target, t1, anchor); insert(target, input, anchor); - set_input_value(input, ctx[0]); + set_input_value(input, /*z*/ ctx[0]); current = true; }, p(ctx, [dirty]) { const bar_changes = {}; - if (dirty & /* z */ 1) bar_changes.x = ctx[0]; + if (dirty & /*z*/ 1) bar_changes.x = /*z*/ ctx[0]; bar.$set(bar_changes); - if (dirty & /* z */ 1 && input.value !== ctx[0]) { - set_input_value(input, ctx[0]); + if (dirty & /*z*/ 1 && input.value !== /*z*/ ctx[0]) { + set_input_value(input, /*z*/ ctx[0]); } }, i(local) { diff --git a/test/js/samples/component-static/expected.js b/test/js/samples/component-static/expected.js index c242bf0bf50f..26c63f550b65 100644 --- a/test/js/samples/component-static/expected.js +++ b/test/js/samples/component-static/expected.js @@ -13,7 +13,7 @@ import { function create_fragment(ctx) { let current; - const nested = new ctx[0]({ props: { foo: "bar" } }); + const nested = new /*Nested*/ ctx[0]({ props: { foo: "bar" } }); return { c() { diff --git a/test/js/samples/component-store-access-invalidate/expected.js b/test/js/samples/component-store-access-invalidate/expected.js index abbb3f6e7c9b..151bd6ed0e87 100644 --- a/test/js/samples/component-store-access-invalidate/expected.js +++ b/test/js/samples/component-store-access-invalidate/expected.js @@ -22,14 +22,14 @@ function create_fragment(ctx) { return { c() { h1 = element("h1"); - t = text(ctx[0]); + t = text(/*$foo*/ ctx[0]); }, m(target, anchor) { insert(target, h1, anchor); append(h1, t); }, p(ctx, [dirty]) { - if (dirty & /* $foo */ 1) set_data(t, ctx[0]); + if (dirty & /*$foo*/ 1) set_data(t, /*$foo*/ ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/component-store-reassign-invalidate/expected.js b/test/js/samples/component-store-reassign-invalidate/expected.js index 8c8dec8d4431..02a74cf22eb3 100644 --- a/test/js/samples/component-store-reassign-invalidate/expected.js +++ b/test/js/samples/component-store-reassign-invalidate/expected.js @@ -27,11 +27,11 @@ function create_fragment(ctx) { return { c() { h1 = element("h1"); - t0 = text(ctx[1]); + t0 = text(/*$foo*/ ctx[1]); t1 = space(); button = element("button"); button.textContent = "reset"; - dispose = listen(button, "click", ctx[2]); + dispose = listen(button, "click", /*click_handler*/ ctx[2]); }, m(target, anchor) { insert(target, h1, anchor); @@ -40,7 +40,7 @@ function create_fragment(ctx) { insert(target, button, anchor); }, p(ctx, [dirty]) { - if (dirty & /* $foo */ 2) set_data(t0, ctx[1]); + if (dirty & /*$foo*/ 2) set_data(t0, /*$foo*/ ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/css-media-query/expected.js b/test/js/samples/css-media-query/expected.js index f4776700599d..7efd6abd05fc 100644 --- a/test/js/samples/css-media-query/expected.js +++ b/test/js/samples/css-media-query/expected.js @@ -2,7 +2,6 @@ import { SvelteComponent, append, - attr, detach, element, init, @@ -14,7 +13,7 @@ import { function add_css() { var style = element("style"); style.id = "svelte-1slhpfn-style"; - style.textContent = "@media(min-width: 1px){div.svelte-1slhpfn{color:red}}"; + style.textContent = "@media(min-width: 1px){}"; append(document.head, style); } @@ -24,7 +23,6 @@ function create_fragment(ctx) { return { c() { div = element("div"); - attr(div, "class", "svelte-1slhpfn"); }, m(target, anchor) { insert(target, div, anchor); diff --git a/test/js/samples/css-shadow-dom-keyframes/expected.js b/test/js/samples/css-shadow-dom-keyframes/expected.js index a0a0ebe0211b..ae4e151e91cd 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected.js @@ -33,7 +33,11 @@ function create_fragment(ctx) { class Component extends SvelteElement { constructor(options) { super(); - this.shadowRoot.innerHTML = ``; + + this.shadowRoot.innerHTML = ``; + init(this, { target: this.shadowRoot }, null, create_fragment, safe_not_equal, {}); if (options) { diff --git a/test/js/samples/data-attribute/expected.js b/test/js/samples/data-attribute/expected.js index 0a8b3e5a4e5a..49ad2f2626ba 100644 --- a/test/js/samples/data-attribute/expected.js +++ b/test/js/samples/data-attribute/expected.js @@ -22,7 +22,7 @@ function create_fragment(ctx) { t = space(); div1 = element("div"); attr(div0, "data-foo", "bar"); - attr(div1, "data-foo", ctx[0]); + attr(div1, "data-foo", /*bar*/ ctx[0]); }, m(target, anchor) { insert(target, div0, anchor); @@ -30,8 +30,8 @@ function create_fragment(ctx) { insert(target, div1, anchor); }, p(ctx, [dirty]) { - if (dirty & /* bar */ 1) { - attr(div1, "data-foo", ctx[0]); + if (dirty & /*bar*/ 1) { + attr(div1, "data-foo", /*bar*/ ctx[0]); } }, i: noop, diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js index e47424edc431..5821faadf1e8 100644 --- a/test/js/samples/debug-empty/expected.js +++ b/test/js/samples/debug-empty/expected.js @@ -28,7 +28,7 @@ function create_fragment(ctx) { c: function create() { h1 = element("h1"); t0 = text("Hello "); - t1 = text(ctx[0]); + t1 = text(/*name*/ ctx[0]); t2 = text("!"); t3 = space(); debugger; @@ -45,7 +45,7 @@ function create_fragment(ctx) { insert_dev(target, t3, anchor); }, p: function update(ctx, [dirty]) { - if (dirty & /* name */ 1) set_data_dev(t1, ctx[0]); + if (dirty & /*name*/ 1) set_data_dev(t1, /*name*/ ctx[0]); debugger; }, i: noop, @@ -105,7 +105,7 @@ class Component extends SvelteComponentDev { const { ctx } = this.$$; const props = options.props || ({}); - if (ctx[0] === undefined && !("name" in props)) { + if (/*name*/ ctx[0] === undefined && !("name" in props)) { console.warn(" was created without expected prop 'name'"); } } diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js index 1f371e777ce0..a1d6dba3b355 100644 --- a/test/js/samples/debug-foo-bar-baz-things/expected.js +++ b/test/js/samples/debug-foo-bar-baz-things/expected.js @@ -27,7 +27,7 @@ function get_each_context(ctx, list, i) { // (8:0) {#each things as thing} function create_each_block(ctx) { let span; - let t0_value = ctx[4].name + ""; + let t0_value = /*thing*/ ctx[4].name + ""; let t0; let t1; @@ -38,10 +38,10 @@ function create_each_block(ctx) { t1 = space(); { - const foo = ctx[1]; - const bar = ctx[2]; - const baz = ctx[3]; - const thing = ctx[4]; + const foo = /*foo*/ ctx[1]; + const bar = /*bar*/ ctx[2]; + const baz = /*baz*/ ctx[3]; + const thing = /*thing*/ ctx[4]; console.log({ foo, bar, baz, thing }); debugger; } @@ -54,13 +54,13 @@ function create_each_block(ctx) { insert_dev(target, t1, anchor); }, p: function update(ctx, dirty) { - if (dirty & /* things */ 1 && t0_value !== (t0_value = ctx[4].name + "")) set_data_dev(t0, t0_value); + if (dirty & /*things*/ 1 && t0_value !== (t0_value = /*thing*/ ctx[4].name + "")) set_data_dev(t0, t0_value); - if (dirty & /* foo, bar, baz, things */ 15) { - const foo = ctx[1]; - const bar = ctx[2]; - const baz = ctx[3]; - const thing = ctx[4]; + if (dirty & /*foo, bar, baz, things*/ 15) { + const foo = /*foo*/ ctx[1]; + const bar = /*bar*/ ctx[2]; + const baz = /*baz*/ ctx[3]; + const thing = /*thing*/ ctx[4]; console.log({ foo, bar, baz, thing }); debugger; } @@ -87,7 +87,7 @@ function create_fragment(ctx) { let p; let t1; let t2; - let each_value = ctx[0]; + let each_value = /*things*/ ctx[0]; let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { @@ -103,7 +103,7 @@ function create_fragment(ctx) { t0 = space(); p = element("p"); t1 = text("foo: "); - t2 = text(ctx[1]); + t2 = text(/*foo*/ ctx[1]); add_location(p, file, 12, 0, 182); }, l: function claim(nodes) { @@ -120,8 +120,8 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & /* things */ 1) { - each_value = ctx[0]; + if (dirty & /*things*/ 1) { + each_value = /*things*/ ctx[0]; let i; for (i = 0; i < each_value.length; i += 1) { @@ -143,7 +143,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & /* foo */ 2) set_data_dev(t2, ctx[1]); + if (dirty & /*foo*/ 2) set_data_dev(t2, /*foo*/ ctx[1]); }, i: noop, o: noop, @@ -212,19 +212,19 @@ class Component extends SvelteComponentDev { const { ctx } = this.$$; const props = options.props || ({}); - if (ctx[0] === undefined && !("things" in props)) { + if (/*things*/ ctx[0] === undefined && !("things" in props)) { console.warn(" was created without expected prop 'things'"); } - if (ctx[1] === undefined && !("foo" in props)) { + if (/*foo*/ ctx[1] === undefined && !("foo" in props)) { console.warn(" was created without expected prop 'foo'"); } - if (ctx[2] === undefined && !("bar" in props)) { + if (/*bar*/ ctx[2] === undefined && !("bar" in props)) { console.warn(" was created without expected prop 'bar'"); } - if (ctx[3] === undefined && !("baz" in props)) { + if (/*baz*/ ctx[3] === undefined && !("baz" in props)) { console.warn(" was created without expected prop 'baz'"); } } diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js index 996c99a05f9e..af79667cc237 100644 --- a/test/js/samples/debug-foo/expected.js +++ b/test/js/samples/debug-foo/expected.js @@ -27,7 +27,7 @@ function get_each_context(ctx, list, i) { // (6:0) {#each things as thing} function create_each_block(ctx) { let span; - let t0_value = ctx[2].name + ""; + let t0_value = /*thing*/ ctx[2].name + ""; let t0; let t1; @@ -38,7 +38,7 @@ function create_each_block(ctx) { t1 = space(); { - const foo = ctx[1]; + const foo = /*foo*/ ctx[1]; console.log({ foo }); debugger; } @@ -51,10 +51,10 @@ function create_each_block(ctx) { insert_dev(target, t1, anchor); }, p: function update(ctx, dirty) { - if (dirty & /* things */ 1 && t0_value !== (t0_value = ctx[2].name + "")) set_data_dev(t0, t0_value); + if (dirty & /*things*/ 1 && t0_value !== (t0_value = /*thing*/ ctx[2].name + "")) set_data_dev(t0, t0_value); - if (dirty & /* foo */ 2) { - const foo = ctx[1]; + if (dirty & /*foo*/ 2) { + const foo = /*foo*/ ctx[1]; console.log({ foo }); debugger; } @@ -81,7 +81,7 @@ function create_fragment(ctx) { let p; let t1; let t2; - let each_value = ctx[0]; + let each_value = /*things*/ ctx[0]; let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { @@ -97,7 +97,7 @@ function create_fragment(ctx) { t0 = space(); p = element("p"); t1 = text("foo: "); - t2 = text(ctx[1]); + t2 = text(/*foo*/ ctx[1]); add_location(p, file, 10, 0, 131); }, l: function claim(nodes) { @@ -114,8 +114,8 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & /* things */ 1) { - each_value = ctx[0]; + if (dirty & /*things*/ 1) { + each_value = /*things*/ ctx[0]; let i; for (i = 0; i < each_value.length; i += 1) { @@ -137,7 +137,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & /* foo */ 2) set_data_dev(t2, ctx[1]); + if (dirty & /*foo*/ 2) set_data_dev(t2, /*foo*/ ctx[1]); }, i: noop, o: noop, @@ -200,11 +200,11 @@ class Component extends SvelteComponentDev { const { ctx } = this.$$; const props = options.props || ({}); - if (ctx[0] === undefined && !("things" in props)) { + if (/*things*/ ctx[0] === undefined && !("things" in props)) { console.warn(" was created without expected prop 'things'"); } - if (ctx[1] === undefined && !("foo" in props)) { + if (/*foo*/ ctx[1] === undefined && !("foo" in props)) { console.warn(" was created without expected prop 'foo'"); } } diff --git a/test/js/samples/debug-hoisted/expected.js b/test/js/samples/debug-hoisted/expected.js index bc0a4d701c86..eeb946549965 100644 --- a/test/js/samples/debug-hoisted/expected.js +++ b/test/js/samples/debug-hoisted/expected.js @@ -13,8 +13,8 @@ function create_fragment(ctx) { const block = { c: function create() { { - const obj = ctx[0]; - const kobzol = ctx[1]; + const obj = /*obj*/ ctx[0]; + const kobzol = /*kobzol*/ ctx[1]; console.log({ obj, kobzol }); debugger; } @@ -24,9 +24,9 @@ function create_fragment(ctx) { }, m: noop, p: function update(ctx, [dirty]) { - if (dirty & /* obj, kobzol */ 3) { - const obj = ctx[0]; - const kobzol = ctx[1]; + if (dirty & /*obj, kobzol*/ 3) { + const obj = /*obj*/ ctx[0]; + const kobzol = /*kobzol*/ ctx[1]; console.log({ obj, kobzol }); debugger; } diff --git a/test/js/samples/debug-no-dependencies/expected.js b/test/js/samples/debug-no-dependencies/expected.js index 87555e023da6..054dda795328 100644 --- a/test/js/samples/debug-no-dependencies/expected.js +++ b/test/js/samples/debug-no-dependencies/expected.js @@ -25,13 +25,13 @@ function get_each_context(ctx, list, i) { // (4:0) {#each things as thing, index} function create_each_block(ctx) { let t0; - let t1_value = ctx[0] + ""; + let t1_value = /*thing*/ ctx[0] + ""; let t1; const block = { c: function create() { { - const index = ctx[2]; + const index = /*index*/ ctx[2]; console.log({ index }); debugger; } @@ -89,7 +89,7 @@ function create_fragment(ctx) { insert_dev(target, each_1_anchor, anchor); }, p: function update(ctx, [dirty]) { - if (dirty & /* things */ 0) { + if (dirty & /*things*/ 0) { each_value = things; let i; diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js index 93aee0f931e3..fb98844ef7a9 100644 --- a/test/js/samples/deconflict-builtins/expected.js +++ b/test/js/samples/deconflict-builtins/expected.js @@ -23,7 +23,7 @@ function get_each_context(ctx, list, i) { // (5:0) {#each createElement as node} function create_each_block(ctx) { let span; - let t_value = ctx[1] + ""; + let t_value = /*node*/ ctx[1] + ""; let t; return { @@ -36,7 +36,7 @@ function create_each_block(ctx) { append(span, t); }, p(ctx, dirty) { - if (dirty & /* createElement */ 1 && t_value !== (t_value = ctx[1] + "")) set_data(t, t_value); + if (dirty & /*createElement*/ 1 && t_value !== (t_value = /*node*/ ctx[1] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -46,7 +46,7 @@ function create_each_block(ctx) { function create_fragment(ctx) { let each_1_anchor; - let each_value = ctx[0]; + let each_value = /*createElement*/ ctx[0]; let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { @@ -69,8 +69,8 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - if (dirty & /* createElement */ 1) { - each_value = ctx[0]; + if (dirty & /*createElement*/ 1) { + each_value = /*createElement*/ ctx[0]; let i; for (i = 0; i < each_value.length; i += 1) { diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js index b189b3ba4d48..beb794a50c7a 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -19,7 +19,7 @@ const file = undefined; function create_fragment(ctx) { let p; - let t0_value = Math.max(0, ctx[0]) + ""; + let t0_value = Math.max(0, /*foo*/ ctx[0]) + ""; let t0; let t1; let t2; @@ -29,7 +29,7 @@ function create_fragment(ctx) { p = element("p"); t0 = text(t0_value); t1 = space(); - t2 = text(ctx[1]); + t2 = text(/*bar*/ ctx[1]); add_location(p, file, 7, 0, 67); }, l: function claim(nodes) { @@ -42,8 +42,8 @@ function create_fragment(ctx) { append_dev(p, t2); }, p: function update(ctx, [dirty]) { - if (dirty & /* foo */ 1 && t0_value !== (t0_value = Math.max(0, ctx[0]) + "")) set_data_dev(t0, t0_value); - if (dirty & /* bar */ 2) set_data_dev(t2, ctx[1]); + if (dirty & /*foo*/ 1 && t0_value !== (t0_value = Math.max(0, /*foo*/ ctx[0]) + "")) set_data_dev(t0, t0_value); + if (dirty & /*bar*/ 2) set_data_dev(t2, /*bar*/ ctx[1]); }, i: noop, o: noop, @@ -86,7 +86,7 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & /* foo */ 1) { + if ($$self.$$.dirty & /*foo*/ 1) { $: $$invalidate(1, bar = foo * 2); } }; @@ -109,7 +109,7 @@ class Component extends SvelteComponentDev { const { ctx } = this.$$; const props = options.props || ({}); - if (ctx[0] === undefined && !("foo" in props)) { + if (/*foo*/ ctx[0] === undefined && !("foo" in props)) { console.warn(" was created without expected prop 'foo'"); } } diff --git a/test/js/samples/each-block-array-literal/expected.js b/test/js/samples/each-block-array-literal/expected.js index 7438540bcc65..10d835cf7805 100644 --- a/test/js/samples/each-block-array-literal/expected.js +++ b/test/js/samples/each-block-array-literal/expected.js @@ -23,7 +23,7 @@ function get_each_context(ctx, list, i) { // (9:0) {#each [a, b, c, d, e] as num} function create_each_block(ctx) { let span; - let t_value = ctx[5] + ""; + let t_value = /*num*/ ctx[5] + ""; let t; return { @@ -36,7 +36,7 @@ function create_each_block(ctx) { append(span, t); }, p(ctx, dirty) { - if (dirty & /* a, b, c, d, e */ 31 && t_value !== (t_value = ctx[5] + "")) set_data(t, t_value); + if (dirty & /*a, b, c, d, e*/ 31 && t_value !== (t_value = /*num*/ ctx[5] + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(span); @@ -46,7 +46,7 @@ function create_each_block(ctx) { function create_fragment(ctx) { let each_1_anchor; - let each_value = [ctx[0], ctx[1], ctx[2], ctx[3], ctx[4]]; + let each_value = [/*a*/ ctx[0], /*b*/ ctx[1], /*c*/ ctx[2], /*d*/ ctx[3], /*e*/ ctx[4]]; let each_blocks = []; for (let i = 0; i < 5; i += 1) { @@ -69,8 +69,8 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - if (dirty & /* a, b, c, d, e */ 31) { - each_value = [ctx[0], ctx[1], ctx[2], ctx[3], ctx[4]]; + if (dirty & /*a, b, c, d, e*/ 31) { + each_value = [/*a*/ ctx[0], /*b*/ ctx[1], /*c*/ ctx[2], /*d*/ ctx[3], /*e*/ ctx[4]]; let i; for (i = 0; i < 5; i += 1) { diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index e7cfc3143c68..5d88032b8794 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -30,21 +30,21 @@ function create_each_block(ctx) { let t0; let t1; let span; - let t2_value = ctx[4].author + ""; + let t2_value = /*comment*/ ctx[4].author + ""; let t2; let t3; - let t4_value = ctx[1](ctx[4].time, ctx[2]) + ""; + let t4_value = /*elapsed*/ ctx[1](/*comment*/ ctx[4].time, /*time*/ ctx[2]) + ""; let t4; let t5; let t6; let html_tag; - let raw_value = ctx[4].html + ""; + let raw_value = /*comment*/ ctx[4].html + ""; return { c() { div = element("div"); strong = element("strong"); - t0 = text(ctx[6]); + t0 = text(/*i*/ ctx[6]); t1 = space(); span = element("span"); t2 = text(t2_value); @@ -70,9 +70,9 @@ function create_each_block(ctx) { html_tag.m(div); }, p(ctx, dirty) { - if (dirty & /* comments */ 1 && t2_value !== (t2_value = ctx[4].author + "")) set_data(t2, t2_value); - if (dirty & /* elapsed, comments, time */ 7 && t4_value !== (t4_value = ctx[1](ctx[4].time, ctx[2]) + "")) set_data(t4, t4_value); - if (dirty & /* comments */ 1 && raw_value !== (raw_value = ctx[4].html + "")) html_tag.p(raw_value); + if (dirty & /*comments*/ 1 && t2_value !== (t2_value = /*comment*/ ctx[4].author + "")) set_data(t2, t2_value); + if (dirty & /*elapsed, comments, time*/ 7 && t4_value !== (t4_value = /*elapsed*/ ctx[1](/*comment*/ ctx[4].time, /*time*/ ctx[2]) + "")) set_data(t4, t4_value); + if (dirty & /*comments*/ 1 && raw_value !== (raw_value = /*comment*/ ctx[4].html + "")) html_tag.p(raw_value); }, d(detaching) { if (detaching) detach(div); @@ -84,7 +84,7 @@ function create_fragment(ctx) { let t0; let p; let t1; - let each_value = ctx[0]; + let each_value = /*comments*/ ctx[0]; let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { @@ -99,7 +99,7 @@ function create_fragment(ctx) { t0 = space(); p = element("p"); - t1 = text(ctx[3]); + t1 = text(/*foo*/ ctx[3]); }, m(target, anchor) { for (let i = 0; i < each_blocks.length; i += 1) { @@ -111,8 +111,8 @@ function create_fragment(ctx) { append(p, t1); }, p(ctx, [dirty]) { - if (dirty & /* comments, elapsed, time */ 7) { - each_value = ctx[0]; + if (dirty & /*comments, elapsed, time*/ 7) { + each_value = /*comments*/ ctx[0]; let i; for (i = 0; i < each_value.length; i += 1) { @@ -134,7 +134,7 @@ function create_fragment(ctx) { each_blocks.length = each_value.length; } - if (dirty & /* foo */ 8) set_data(t1, ctx[3]); + if (dirty & /*foo*/ 8) set_data(t1, /*foo*/ ctx[3]); }, i: noop, o: noop, diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js index 6df3a817c09d..3b697d68607e 100644 --- a/test/js/samples/each-block-keyed-animated/expected.js +++ b/test/js/samples/each-block-keyed-animated/expected.js @@ -26,7 +26,7 @@ function get_each_context(ctx, list, i) { // (19:0) {#each things as thing (thing.id)} function create_each_block(key_1, ctx) { let div; - let t_value = ctx[1].name + ""; + let t_value = /*thing*/ ctx[1].name + ""; let t; let rect; let stop_animation = noop; @@ -44,7 +44,7 @@ function create_each_block(key_1, ctx) { append(div, t); }, p(ctx, dirty) { - if (dirty & /* things */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + if (dirty & /*things*/ 1 && t_value !== (t_value = /*thing*/ ctx[1].name + "")) set_data(t, t_value); }, r() { rect = div.getBoundingClientRect(); @@ -67,8 +67,8 @@ function create_fragment(ctx) { let each_blocks = []; let each_1_lookup = new Map(); let each_1_anchor; - let each_value = ctx[0]; - const get_key = ctx => ctx[1].id; + let each_value = /*things*/ ctx[0]; + const get_key = ctx => /*thing*/ ctx[1].id; for (let i = 0; i < each_value.length; i += 1) { let child_ctx = get_each_context(ctx, each_value, i); @@ -92,7 +92,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - const each_value = ctx[0]; + const each_value = /*things*/ ctx[0]; for (let i = 0; i < each_blocks.length; i += 1) each_blocks[i].r(); each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, fix_and_destroy_block, create_each_block, each_1_anchor, get_each_context); for (let i = 0; i < each_blocks.length; i += 1) each_blocks[i].a(); diff --git a/test/js/samples/each-block-keyed/expected.js b/test/js/samples/each-block-keyed/expected.js index 025e08d4f3e6..1cd9a31ecee3 100644 --- a/test/js/samples/each-block-keyed/expected.js +++ b/test/js/samples/each-block-keyed/expected.js @@ -24,7 +24,7 @@ function get_each_context(ctx, list, i) { // (5:0) {#each things as thing (thing.id)} function create_each_block(key_1, ctx) { let div; - let t_value = ctx[1].name + ""; + let t_value = /*thing*/ ctx[1].name + ""; let t; return { @@ -40,7 +40,7 @@ function create_each_block(key_1, ctx) { append(div, t); }, p(ctx, dirty) { - if (dirty & /* things */ 1 && t_value !== (t_value = ctx[1].name + "")) set_data(t, t_value); + if (dirty & /*things*/ 1 && t_value !== (t_value = /*thing*/ ctx[1].name + "")) set_data(t, t_value); }, d(detaching) { if (detaching) detach(div); @@ -52,8 +52,8 @@ function create_fragment(ctx) { let each_blocks = []; let each_1_lookup = new Map(); let each_1_anchor; - let each_value = ctx[0]; - const get_key = ctx => ctx[1].id; + let each_value = /*things*/ ctx[0]; + const get_key = ctx => /*thing*/ ctx[1].id; for (let i = 0; i < each_value.length; i += 1) { let child_ctx = get_each_context(ctx, each_value, i); @@ -77,7 +77,7 @@ function create_fragment(ctx) { insert(target, each_1_anchor, anchor); }, p(ctx, [dirty]) { - const each_value = ctx[0]; + const each_value = /*things*/ ctx[0]; each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, destroy_block, create_each_block, each_1_anchor, get_each_context); }, i: noop, diff --git a/test/js/samples/event-handler-dynamic/expected.js b/test/js/samples/event-handler-dynamic/expected.js index 552c48f9dde5..34c33151bf2b 100644 --- a/test/js/samples/event-handler-dynamic/expected.js +++ b/test/js/samples/event-handler-dynamic/expected.js @@ -37,16 +37,16 @@ function create_fragment(ctx) { button1.textContent = "set handler 2"; t3 = space(); p1 = element("p"); - t4 = text(ctx[1]); + t4 = text(/*number*/ ctx[1]); t5 = space(); button2 = element("button"); button2.textContent = "click"; dispose = [ - listen(button0, "click", ctx[2]), - listen(button1, "click", ctx[3]), + listen(button0, "click", /*updateHandler1*/ ctx[2]), + listen(button1, "click", /*updateHandler2*/ ctx[3]), listen(button2, "click", function () { - ctx[0].apply(this, arguments); + /*clickHandler*/ ctx[0].apply(this, arguments); }) ]; }, @@ -63,7 +63,7 @@ function create_fragment(ctx) { }, p(new_ctx, [dirty]) { ctx = new_ctx; - if (dirty & /* number */ 2) set_data(t4, ctx[1]); + if (dirty & /*number*/ 2) set_data(t4, /*number*/ ctx[1]); }, i: noop, o: noop, diff --git a/test/js/samples/if-block-complex/expected.js b/test/js/samples/if-block-complex/expected.js index a40e0e8afbc7..a8244de8b02d 100644 --- a/test/js/samples/if-block-complex/expected.js +++ b/test/js/samples/if-block-complex/expected.js @@ -29,7 +29,7 @@ function create_if_block(ctx) { } function create_fragment(ctx) { - let show_if = ctx[0].divider && ctx[0].divider.includes(1); + let show_if = /*item*/ ctx[0].divider && /*item*/ ctx[0].divider.includes(1); let if_block_anchor; let if_block = show_if && create_if_block(ctx); diff --git a/test/js/samples/if-block-no-update/expected.js b/test/js/samples/if-block-no-update/expected.js index 5600712e5be4..f225c221bfe3 100644 --- a/test/js/samples/if-block-no-update/expected.js +++ b/test/js/samples/if-block-no-update/expected.js @@ -49,7 +49,7 @@ function create_fragment(ctx) { let if_block_anchor; function select_block_type(ctx, dirty) { - if (ctx[0]) return create_if_block; + if (/*foo*/ ctx[0]) return create_if_block; return create_else_block; } diff --git a/test/js/samples/if-block-simple/expected.js b/test/js/samples/if-block-simple/expected.js index 9c1b6abd312b..b9fad863e2c0 100644 --- a/test/js/samples/if-block-simple/expected.js +++ b/test/js/samples/if-block-simple/expected.js @@ -29,7 +29,7 @@ function create_if_block(ctx) { function create_fragment(ctx) { let if_block_anchor; - let if_block = ctx[0] && create_if_block(ctx); + let if_block = /*foo*/ ctx[0] && create_if_block(ctx); return { c() { @@ -41,7 +41,7 @@ function create_fragment(ctx) { insert(target, if_block_anchor, anchor); }, p(ctx, [dirty]) { - if (ctx[0]) { + if (/*foo*/ ctx[0]) { if (!if_block) { if_block = create_if_block(ctx); if_block.c(); diff --git a/test/js/samples/inline-style-optimized-multiple/expected.js b/test/js/samples/inline-style-optimized-multiple/expected.js index ba173ffc3888..84a38abd7bbe 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected.js +++ b/test/js/samples/inline-style-optimized-multiple/expected.js @@ -16,19 +16,19 @@ function create_fragment(ctx) { return { c() { div = element("div"); - set_style(div, "color", ctx[0]); - set_style(div, "transform", "translate(" + ctx[1] + "px," + ctx[2] + "px)"); + set_style(div, "color", /*color*/ ctx[0]); + set_style(div, "transform", "translate(" + /*x*/ ctx[1] + "px," + /*y*/ ctx[2] + "px)"); }, m(target, anchor) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & /* color */ 1) { - set_style(div, "color", ctx[0]); + if (dirty & /*color*/ 1) { + set_style(div, "color", /*color*/ ctx[0]); } - if (dirty & /* x, y */ 6) { - set_style(div, "transform", "translate(" + ctx[1] + "px," + ctx[2] + "px)"); + if (dirty & /*x, y*/ 6) { + set_style(div, "transform", "translate(" + /*x*/ ctx[1] + "px," + /*y*/ ctx[2] + "px)"); } }, i: noop, diff --git a/test/js/samples/inline-style-optimized-url/expected.js b/test/js/samples/inline-style-optimized-url/expected.js index 862d16421f90..77870348a572 100644 --- a/test/js/samples/inline-style-optimized-url/expected.js +++ b/test/js/samples/inline-style-optimized-url/expected.js @@ -16,14 +16,14 @@ function create_fragment(ctx) { return { c() { div = element("div"); - set_style(div, "background", "url(data:image/png;base64," + ctx[0] + ")"); + set_style(div, "background", "url(data:image/png;base64," + /*data*/ ctx[0] + ")"); }, m(target, anchor) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & /* data */ 1) { - set_style(div, "background", "url(data:image/png;base64," + ctx[0] + ")"); + if (dirty & /*data*/ 1) { + set_style(div, "background", "url(data:image/png;base64," + /*data*/ ctx[0] + ")"); } }, i: noop, diff --git a/test/js/samples/inline-style-optimized/expected.js b/test/js/samples/inline-style-optimized/expected.js index cf5241153cd3..5bef284f0946 100644 --- a/test/js/samples/inline-style-optimized/expected.js +++ b/test/js/samples/inline-style-optimized/expected.js @@ -16,14 +16,14 @@ function create_fragment(ctx) { return { c() { div = element("div"); - set_style(div, "color", ctx[0]); + set_style(div, "color", /*color*/ ctx[0]); }, m(target, anchor) { insert(target, div, anchor); }, p(ctx, [dirty]) { - if (dirty & /* color */ 1) { - set_style(div, "color", ctx[0]); + if (dirty & /*color*/ 1) { + set_style(div, "color", /*color*/ ctx[0]); } }, i: noop, diff --git a/test/js/samples/inline-style-unoptimized/expected.js b/test/js/samples/inline-style-unoptimized/expected.js index b31160fb7fc4..fdff685eade2 100644 --- a/test/js/samples/inline-style-unoptimized/expected.js +++ b/test/js/samples/inline-style-unoptimized/expected.js @@ -22,8 +22,8 @@ function create_fragment(ctx) { div0 = element("div"); t = space(); div1 = element("div"); - attr(div0, "style", ctx[0]); - attr(div1, "style", div1_style_value = "" + (ctx[1] + ": " + ctx[2])); + attr(div0, "style", /*style*/ ctx[0]); + attr(div1, "style", div1_style_value = "" + (/*key*/ ctx[1] + ": " + /*value*/ ctx[2])); }, m(target, anchor) { insert(target, div0, anchor); @@ -31,11 +31,11 @@ function create_fragment(ctx) { insert(target, div1, anchor); }, p(ctx, [dirty]) { - if (dirty & /* style */ 1) { - attr(div0, "style", ctx[0]); + if (dirty & /*style*/ 1) { + attr(div0, "style", /*style*/ ctx[0]); } - if (dirty & /* key, value */ 6 && div1_style_value !== (div1_style_value = "" + (ctx[1] + ": " + ctx[2]))) { + if (dirty & /*key, value*/ 6 && div1_style_value !== (div1_style_value = "" + (/*key*/ ctx[1] + ": " + /*value*/ ctx[2]))) { attr(div1, "style", div1_style_value); } }, diff --git a/test/js/samples/input-files/expected.js b/test/js/samples/input-files/expected.js index 08745fa730f4..c3e46f0c798a 100644 --- a/test/js/samples/input-files/expected.js +++ b/test/js/samples/input-files/expected.js @@ -20,7 +20,7 @@ function create_fragment(ctx) { input = element("input"); attr(input, "type", "file"); input.multiple = true; - dispose = listen(input, "change", ctx[1]); + dispose = listen(input, "change", /*input_change_handler*/ ctx[1]); }, m(target, anchor) { insert(target, input, anchor); diff --git a/test/js/samples/input-no-initial-value/expected.js b/test/js/samples/input-no-initial-value/expected.js index 30deda64f13a..8ff2b2798b74 100644 --- a/test/js/samples/input-no-initial-value/expected.js +++ b/test/js/samples/input-no-initial-value/expected.js @@ -31,18 +31,22 @@ function create_fragment(ctx) { button.textContent = "Store"; attr(input, "type", "text"); input.required = true; - dispose = [listen(input, "input", ctx[2]), listen(form, "submit", ctx[1])]; + + dispose = [ + listen(input, "input", /*input_input_handler*/ ctx[2]), + listen(form, "submit", /*handleSubmit*/ ctx[1]) + ]; }, m(target, anchor) { insert(target, form, anchor); append(form, input); - set_input_value(input, ctx[0]); + set_input_value(input, /*test*/ ctx[0]); append(form, t0); append(form, button); }, p(ctx, [dirty]) { - if (dirty & /* test */ 1 && input.value !== ctx[0]) { - set_input_value(input, ctx[0]); + if (dirty & /*test*/ 1 && input.value !== /*test*/ ctx[0]) { + set_input_value(input, /*test*/ ctx[0]); } }, i: noop, diff --git a/test/js/samples/input-range/expected.js b/test/js/samples/input-range/expected.js index 85d784a17c0d..5a074d9754b3 100644 --- a/test/js/samples/input-range/expected.js +++ b/test/js/samples/input-range/expected.js @@ -22,15 +22,19 @@ function create_fragment(ctx) { c() { input = element("input"); attr(input, "type", "range"); - dispose = [listen(input, "change", ctx[1]), listen(input, "input", ctx[1])]; + + dispose = [ + listen(input, "change", /*input_change_input_handler*/ ctx[1]), + listen(input, "input", /*input_change_input_handler*/ ctx[1]) + ]; }, m(target, anchor) { insert(target, input, anchor); - set_input_value(input, ctx[0]); + set_input_value(input, /*value*/ ctx[0]); }, p(ctx, [dirty]) { - if (dirty & /* value */ 1) { - set_input_value(input, ctx[0]); + if (dirty & /*value*/ 1) { + set_input_value(input, /*value*/ ctx[0]); } }, i: noop, diff --git a/test/js/samples/input-without-blowback-guard/expected.js b/test/js/samples/input-without-blowback-guard/expected.js index bc9566071341..344976ade602 100644 --- a/test/js/samples/input-without-blowback-guard/expected.js +++ b/test/js/samples/input-without-blowback-guard/expected.js @@ -19,15 +19,15 @@ function create_fragment(ctx) { c() { input = element("input"); attr(input, "type", "checkbox"); - dispose = listen(input, "change", ctx[1]); + dispose = listen(input, "change", /*input_change_handler*/ ctx[1]); }, m(target, anchor) { insert(target, input, anchor); - input.checked = ctx[0]; + input.checked = /*foo*/ ctx[0]; }, p(ctx, [dirty]) { - if (dirty & /* foo */ 1) { - input.checked = ctx[0]; + if (dirty & /*foo*/ 1) { + input.checked = /*foo*/ ctx[0]; } }, i: noop, diff --git a/test/js/samples/instrumentation-script-if-no-block/expected.js b/test/js/samples/instrumentation-script-if-no-block/expected.js index 753b09031a6b..4127a6d7d693 100644 --- a/test/js/samples/instrumentation-script-if-no-block/expected.js +++ b/test/js/samples/instrumentation-script-if-no-block/expected.js @@ -29,8 +29,8 @@ function create_fragment(ctx) { t1 = space(); p = element("p"); t2 = text("x: "); - t3 = text(ctx[0]); - dispose = listen(button, "click", ctx[1]); + t3 = text(/*x*/ ctx[0]); + dispose = listen(button, "click", /*foo*/ ctx[1]); }, m(target, anchor) { insert(target, button, anchor); @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* x */ 1) set_data(t3, ctx[0]); + if (dirty & /*x*/ 1) set_data(t3, /*x*/ ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-script-x-equals-x/expected.js b/test/js/samples/instrumentation-script-x-equals-x/expected.js index d867e0cddb88..0d4493baf3c0 100644 --- a/test/js/samples/instrumentation-script-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-script-x-equals-x/expected.js @@ -19,7 +19,7 @@ function create_fragment(ctx) { let t1; let p; let t2; - let t3_value = ctx[0].length + ""; + let t3_value = /*things*/ ctx[0].length + ""; let t3; let dispose; @@ -31,7 +31,7 @@ function create_fragment(ctx) { p = element("p"); t2 = text("number of things: "); t3 = text(t3_value); - dispose = listen(button, "click", ctx[1]); + dispose = listen(button, "click", /*foo*/ ctx[1]); }, m(target, anchor) { insert(target, button, anchor); @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* things */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + if (dirty & /*things*/ 1 && t3_value !== (t3_value = /*things*/ ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-if-no-block/expected.js b/test/js/samples/instrumentation-template-if-no-block/expected.js index 3305db76cb25..0bd627eb87b3 100644 --- a/test/js/samples/instrumentation-template-if-no-block/expected.js +++ b/test/js/samples/instrumentation-template-if-no-block/expected.js @@ -29,8 +29,8 @@ function create_fragment(ctx) { t1 = space(); p = element("p"); t2 = text("x: "); - t3 = text(ctx[0]); - dispose = listen(button, "click", ctx[1]); + t3 = text(/*x*/ ctx[0]); + dispose = listen(button, "click", /*click_handler*/ ctx[1]); }, m(target, anchor) { insert(target, button, anchor); @@ -40,7 +40,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* x */ 1) set_data(t3, ctx[0]); + if (dirty & /*x*/ 1) set_data(t3, /*x*/ ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/instrumentation-template-x-equals-x/expected.js b/test/js/samples/instrumentation-template-x-equals-x/expected.js index 6e9b20db6be5..e049a6d39be8 100644 --- a/test/js/samples/instrumentation-template-x-equals-x/expected.js +++ b/test/js/samples/instrumentation-template-x-equals-x/expected.js @@ -19,7 +19,7 @@ function create_fragment(ctx) { let t1; let p; let t2; - let t3_value = ctx[0].length + ""; + let t3_value = /*things*/ ctx[0].length + ""; let t3; let dispose; @@ -31,7 +31,7 @@ function create_fragment(ctx) { p = element("p"); t2 = text("number of things: "); t3 = text(t3_value); - dispose = listen(button, "click", ctx[1]); + dispose = listen(button, "click", /*click_handler*/ ctx[1]); }, m(target, anchor) { insert(target, button, anchor); @@ -41,7 +41,7 @@ function create_fragment(ctx) { append(p, t3); }, p(ctx, [dirty]) { - if (dirty & /* things */ 1 && t3_value !== (t3_value = ctx[0].length + "")) set_data(t3, t3_value); + if (dirty & /*things*/ 1 && t3_value !== (t3_value = /*things*/ ctx[0].length + "")) set_data(t3, t3_value); }, i: noop, o: noop, diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js index 11201eb4bef5..bfb1b8911d39 100644 --- a/test/js/samples/media-bindings/expected.js +++ b/test/js/samples/media-bindings/expected.js @@ -29,59 +29,59 @@ function create_fragment(ctx) { audio_updating = true; } - ctx[10].call(audio); + /*audio_timeupdate_handler*/ ctx[10].call(audio); } return { c() { audio = element("audio"); - if (ctx[2] === void 0 || ctx[3] === void 0 || ctx[9] === void 0) add_render_callback(audio_timeupdate_handler); - if (ctx[4] === void 0) add_render_callback(() => ctx[11].call(audio)); - if (ctx[0] === void 0) add_render_callback(() => ctx[13].call(audio)); - if (ctx[0] === void 0 || ctx[1] === void 0) add_render_callback(() => ctx[14].call(audio)); - if (ctx[8] === void 0) add_render_callback(() => ctx[17].call(audio)); - if (ctx[9] === void 0) add_render_callback(() => ctx[18].call(audio)); + if (/*played*/ ctx[2] === void 0 || /*currentTime*/ ctx[3] === void 0 || /*ended*/ ctx[9] === void 0) add_render_callback(audio_timeupdate_handler); + if (/*duration*/ ctx[4] === void 0) add_render_callback(() => /*audio_durationchange_handler*/ ctx[11].call(audio)); + if (/*buffered*/ ctx[0] === void 0) add_render_callback(() => /*audio_progress_handler*/ ctx[13].call(audio)); + if (/*buffered*/ ctx[0] === void 0 || /*seekable*/ ctx[1] === void 0) add_render_callback(() => /*audio_loadedmetadata_handler*/ ctx[14].call(audio)); + if (/*seeking*/ ctx[8] === void 0) add_render_callback(() => /*audio_seeking_seeked_handler*/ ctx[17].call(audio)); + if (/*ended*/ ctx[9] === void 0) add_render_callback(() => /*audio_ended_handler*/ ctx[18].call(audio)); dispose = [ listen(audio, "timeupdate", audio_timeupdate_handler), - listen(audio, "durationchange", ctx[11]), - listen(audio, "play", ctx[12]), - listen(audio, "pause", ctx[12]), - listen(audio, "progress", ctx[13]), - listen(audio, "loadedmetadata", ctx[14]), - listen(audio, "volumechange", ctx[15]), - listen(audio, "ratechange", ctx[16]), - listen(audio, "seeking", ctx[17]), - listen(audio, "seeked", ctx[17]), - listen(audio, "ended", ctx[18]) + listen(audio, "durationchange", /*audio_durationchange_handler*/ ctx[11]), + listen(audio, "play", /*audio_play_pause_handler*/ ctx[12]), + listen(audio, "pause", /*audio_play_pause_handler*/ ctx[12]), + listen(audio, "progress", /*audio_progress_handler*/ ctx[13]), + listen(audio, "loadedmetadata", /*audio_loadedmetadata_handler*/ ctx[14]), + listen(audio, "volumechange", /*audio_volumechange_handler*/ ctx[15]), + listen(audio, "ratechange", /*audio_ratechange_handler*/ ctx[16]), + listen(audio, "seeking", /*audio_seeking_seeked_handler*/ ctx[17]), + listen(audio, "seeked", /*audio_seeking_seeked_handler*/ ctx[17]), + listen(audio, "ended", /*audio_ended_handler*/ ctx[18]) ]; }, m(target, anchor) { insert(target, audio, anchor); - if (!isNaN(ctx[6])) { - audio.volume = ctx[6]; + if (!isNaN(/*volume*/ ctx[6])) { + audio.volume = /*volume*/ ctx[6]; } - if (!isNaN(ctx[7])) { - audio.playbackRate = ctx[7]; + if (!isNaN(/*playbackRate*/ ctx[7])) { + audio.playbackRate = /*playbackRate*/ ctx[7]; } }, p(ctx, [dirty]) { - if (!audio_updating && dirty & /* currentTime */ 8 && !isNaN(ctx[3])) { - audio.currentTime = ctx[3]; + if (!audio_updating && dirty & /*currentTime*/ 8 && !isNaN(/*currentTime*/ ctx[3])) { + audio.currentTime = /*currentTime*/ ctx[3]; } - if (dirty & /* paused */ 32 && audio_is_paused !== (audio_is_paused = ctx[5])) { + if (dirty & /*paused*/ 32 && audio_is_paused !== (audio_is_paused = /*paused*/ ctx[5])) { audio[audio_is_paused ? "pause" : "play"](); } - if (dirty & /* volume */ 64 && !isNaN(ctx[6])) { - audio.volume = ctx[6]; + if (dirty & /*volume*/ 64 && !isNaN(/*volume*/ ctx[6])) { + audio.volume = /*volume*/ ctx[6]; } - if (dirty & /* playbackRate */ 128 && !isNaN(ctx[7])) { - audio.playbackRate = ctx[7]; + if (dirty & /*playbackRate*/ 128 && !isNaN(/*playbackRate*/ ctx[7])) { + audio.playbackRate = /*playbackRate*/ ctx[7]; } audio_updating = false; diff --git a/test/js/samples/reactive-values-non-topologically-ordered/expected.js b/test/js/samples/reactive-values-non-topologically-ordered/expected.js index 8b7cbf344261..3d266f10acfb 100644 --- a/test/js/samples/reactive-values-non-topologically-ordered/expected.js +++ b/test/js/samples/reactive-values-non-topologically-ordered/expected.js @@ -11,11 +11,11 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & /* x */ 1) { + if ($$self.$$.dirty & /*x*/ 1) { $: $$invalidate(2, b = x); } - if ($$self.$$.dirty & /* b */ 4) { + if ($$self.$$.dirty & /*b*/ 4) { $: a = b; } }; diff --git a/test/js/samples/reactive-values-non-writable-dependencies/expected.js b/test/js/samples/reactive-values-non-writable-dependencies/expected.js index 4a53580adcbc..38bd356d85e4 100644 --- a/test/js/samples/reactive-values-non-writable-dependencies/expected.js +++ b/test/js/samples/reactive-values-non-writable-dependencies/expected.js @@ -11,7 +11,7 @@ function instance($$self, $$props, $$invalidate) { }; $$self.$$.update = () => { - if ($$self.$$.dirty & /* a, b */ 3) { + if ($$self.$$.dirty & /*a, b*/ 3) { $: console.log("max", Math.max(a, b)); } }; diff --git a/test/js/samples/select-dynamic-value/expected.js b/test/js/samples/select-dynamic-value/expected.js index d9102dbb3882..a93a47bd3ac4 100644 --- a/test/js/samples/select-dynamic-value/expected.js +++ b/test/js/samples/select-dynamic-value/expected.js @@ -32,7 +32,7 @@ function create_fragment(ctx) { insert(target, select, anchor); append(select, option0); append(select, option1); - select_value_value = ctx[0]; + select_value_value = /*current*/ ctx[0]; for (var i = 0; i < select.options.length; i += 1) { var option = select.options[i]; @@ -44,7 +44,7 @@ function create_fragment(ctx) { } }, p(ctx, [dirty]) { - if (dirty & /* current */ 1 && select_value_value !== (select_value_value = ctx[0])) { + if (dirty & /*current*/ 1 && select_value_value !== (select_value_value = /*current*/ ctx[0])) { for (var i = 0; i < select.options.length; i += 1) { var option = select.options[i]; diff --git a/test/js/samples/src-attribute-check/expected.js b/test/js/samples/src-attribute-check/expected.js index 23ed56772e1d..e03b3a6ba7ee 100644 --- a/test/js/samples/src-attribute-check/expected.js +++ b/test/js/samples/src-attribute-check/expected.js @@ -35,9 +35,9 @@ function create_fragment(ctx) { }, h() { attr(img0, "alt", "potato"); - if (img0.src !== (img0_src_value = ctx[0])) attr(img0, "src", img0_src_value); + if (img0.src !== (img0_src_value = /*url*/ ctx[0])) attr(img0, "src", img0_src_value); attr(img1, "alt", "potato"); - if (img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) attr(img1, "src", img1_src_value); + if (img1.src !== (img1_src_value = "" + (/*slug*/ ctx[1] + ".jpg"))) attr(img1, "src", img1_src_value); }, m(target, anchor) { insert(target, img0, anchor); @@ -45,11 +45,11 @@ function create_fragment(ctx) { insert(target, img1, anchor); }, p(ctx, [dirty]) { - if (dirty & /* url */ 1 && img0.src !== (img0_src_value = ctx[0])) { + if (dirty & /*url*/ 1 && img0.src !== (img0_src_value = /*url*/ ctx[0])) { attr(img0, "src", img0_src_value); } - if (dirty & /* slug */ 2 && img1.src !== (img1_src_value = "" + (ctx[1] + ".jpg"))) { + if (dirty & /*slug*/ 2 && img1.src !== (img1_src_value = "" + (/*slug*/ ctx[1] + ".jpg"))) { attr(img1, "src", img1_src_value); } }, diff --git a/test/js/samples/title/expected.js b/test/js/samples/title/expected.js index 06755a7f9768..d4e7e1a58491 100644 --- a/test/js/samples/title/expected.js +++ b/test/js/samples/title/expected.js @@ -3,13 +3,13 @@ import { SvelteComponent, init, noop, safe_not_equal } from "svelte/internal"; function create_fragment(ctx) { let title_value; - document.title = title_value = "a " + ctx[0] + " title"; + document.title = title_value = "a " + /*custom*/ ctx[0] + " title"; return { c: noop, m: noop, p(ctx, [dirty]) { - if (dirty & /* custom */ 1 && title_value !== (title_value = "a " + ctx[0] + " title")) { + if (dirty & /*custom*/ 1 && title_value !== (title_value = "a " + /*custom*/ ctx[0] + " title")) { document.title = title_value; } }, diff --git a/test/js/samples/transition-local/expected.js b/test/js/samples/transition-local/expected.js index 8d72e7471816..a5d3b6318fe5 100644 --- a/test/js/samples/transition-local/expected.js +++ b/test/js/samples/transition-local/expected.js @@ -15,7 +15,7 @@ import { function create_if_block(ctx) { let if_block_anchor; - let if_block = ctx[1] && create_if_block_1(ctx); + let if_block = /*y*/ ctx[1] && create_if_block_1(ctx); return { c() { @@ -27,7 +27,7 @@ function create_if_block(ctx) { insert(target, if_block_anchor, anchor); }, p(ctx, dirty) { - if (ctx[1]) { + if (/*y*/ ctx[1]) { if (!if_block) { if_block = create_if_block_1(ctx); if_block.c(); @@ -80,7 +80,7 @@ function create_if_block_1(ctx) { function create_fragment(ctx) { let if_block_anchor; - let if_block = ctx[0] && create_if_block(ctx); + let if_block = /*x*/ ctx[0] && create_if_block(ctx); return { c() { @@ -92,7 +92,7 @@ function create_fragment(ctx) { insert(target, if_block_anchor, anchor); }, p(ctx, [dirty]) { - if (ctx[0]) { + if (/*x*/ ctx[0]) { if (if_block) { if_block.p(ctx, dirty); } else { diff --git a/test/js/samples/transition-repeated-outro/expected.js b/test/js/samples/transition-repeated-outro/expected.js index 536cb95b2ccb..6f071328a491 100644 --- a/test/js/samples/transition-repeated-outro/expected.js +++ b/test/js/samples/transition-repeated-outro/expected.js @@ -49,7 +49,7 @@ function create_if_block(ctx) { function create_fragment(ctx) { let if_block_anchor; let current; - let if_block = ctx[0] < 5 && create_if_block(ctx); + let if_block = /*num*/ ctx[0] < 5 && create_if_block(ctx); return { c() { @@ -62,7 +62,7 @@ function create_fragment(ctx) { current = true; }, p(ctx, [dirty]) { - if (ctx[0] < 5) { + if (/*num*/ ctx[0] < 5) { if (!if_block) { if_block = create_if_block(ctx); if_block.c(); diff --git a/test/js/samples/unchanged-expression/expected.js b/test/js/samples/unchanged-expression/expected.js index 3539d115d68e..673d5b6abc8d 100644 --- a/test/js/samples/unchanged-expression/expected.js +++ b/test/js/samples/unchanged-expression/expected.js @@ -41,7 +41,7 @@ function create_fragment(ctx) { div1 = element("div"); p3 = element("p"); t8 = text("Hello "); - t9 = text(ctx[0]); + t9 = text(/*world3*/ ctx[0]); }, m(target, anchor) { insert(target, div0, anchor); @@ -57,7 +57,7 @@ function create_fragment(ctx) { append(p3, t9); }, p(ctx, [dirty]) { - if (dirty & /* world3 */ 1) set_data(t9, ctx[0]); + if (dirty & /*world3*/ 1) set_data(t9, /*world3*/ ctx[0]); }, i: noop, o: noop, diff --git a/test/js/samples/unreferenced-state-not-invalidated/expected.js b/test/js/samples/unreferenced-state-not-invalidated/expected.js index ff3c3e597f6d..b10ea815b966 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/expected.js +++ b/test/js/samples/unreferenced-state-not-invalidated/expected.js @@ -21,14 +21,14 @@ function create_fragment(ctx) { return { c() { p = element("p"); - t = text(ctx[0]); + t = text(/*y*/ ctx[0]); }, m(target, anchor) { insert(target, p, anchor); append(p, t); }, p(ctx, [dirty]) { - if (dirty & /* y */ 1) set_data(t, ctx[0]); + if (dirty & /*y*/ 1) set_data(t, /*y*/ ctx[0]); }, i: noop, o: noop, @@ -58,7 +58,7 @@ function instance($$self, $$props, $$invalidate) { let y; $$self.$$.update = () => { - if ($$self.$$.dirty & /* b */ 2) { + if ($$self.$$.dirty & /*b*/ 2) { $: $$invalidate(0, y = b * 2); } }; diff --git a/test/js/samples/use-elements-as-anchors/expected.js b/test/js/samples/use-elements-as-anchors/expected.js index 36344982bcb1..52635e9b7878 100644 --- a/test/js/samples/use-elements-as-anchors/expected.js +++ b/test/js/samples/use-elements-as-anchors/expected.js @@ -112,11 +112,11 @@ function create_fragment(ctx) { let t6; let t7; let if_block4_anchor; - let if_block0 = ctx[0] && create_if_block_4(ctx); - let if_block1 = ctx[1] && create_if_block_3(ctx); - let if_block2 = ctx[2] && create_if_block_2(ctx); - let if_block3 = ctx[3] && create_if_block_1(ctx); - let if_block4 = ctx[4] && create_if_block(ctx); + let if_block0 = /*a*/ ctx[0] && create_if_block_4(ctx); + let if_block1 = /*b*/ ctx[1] && create_if_block_3(ctx); + let if_block2 = /*c*/ ctx[2] && create_if_block_2(ctx); + let if_block3 = /*d*/ ctx[3] && create_if_block_1(ctx); + let if_block4 = /*e*/ ctx[4] && create_if_block(ctx); return { c() { @@ -156,7 +156,7 @@ function create_fragment(ctx) { insert(target, if_block4_anchor, anchor); }, p(ctx, [dirty]) { - if (ctx[0]) { + if (/*a*/ ctx[0]) { if (!if_block0) { if_block0 = create_if_block_4(ctx); if_block0.c(); @@ -169,7 +169,7 @@ function create_fragment(ctx) { if_block0 = null; } - if (ctx[1]) { + if (/*b*/ ctx[1]) { if (!if_block1) { if_block1 = create_if_block_3(ctx); if_block1.c(); @@ -182,7 +182,7 @@ function create_fragment(ctx) { if_block1 = null; } - if (ctx[2]) { + if (/*c*/ ctx[2]) { if (!if_block2) { if_block2 = create_if_block_2(ctx); if_block2.c(); @@ -195,7 +195,7 @@ function create_fragment(ctx) { if_block2 = null; } - if (ctx[3]) { + if (/*d*/ ctx[3]) { if (!if_block3) { if_block3 = create_if_block_1(ctx); if_block3.c(); @@ -208,7 +208,7 @@ function create_fragment(ctx) { if_block3 = null; } - if (ctx[4]) { + if (/*e*/ ctx[4]) { if (!if_block4) { if_block4 = create_if_block(ctx); if_block4.c(); diff --git a/test/js/samples/video-bindings/expected.js b/test/js/samples/video-bindings/expected.js index 0b318bddc09c..e3d48f9922cd 100644 --- a/test/js/samples/video-bindings/expected.js +++ b/test/js/samples/video-bindings/expected.js @@ -29,27 +29,27 @@ function create_fragment(ctx) { video_updating = true; } - ctx[5].call(video); + /*video_timeupdate_handler*/ ctx[5].call(video); } return { c() { video = element("video"); - add_render_callback(() => ctx[4].call(video)); - if (ctx[1] === void 0 || ctx[2] === void 0) add_render_callback(() => ctx[6].call(video)); + add_render_callback(() => /*video_elementresize_handler*/ ctx[4].call(video)); + if (/*videoHeight*/ ctx[1] === void 0 || /*videoWidth*/ ctx[2] === void 0) add_render_callback(() => /*video_resize_handler*/ ctx[6].call(video)); dispose = [ listen(video, "timeupdate", video_timeupdate_handler), - listen(video, "resize", ctx[6]) + listen(video, "resize", /*video_resize_handler*/ ctx[6]) ]; }, m(target, anchor) { insert(target, video, anchor); - video_resize_listener = add_resize_listener(video, ctx[4].bind(video)); + video_resize_listener = add_resize_listener(video, /*video_elementresize_handler*/ ctx[4].bind(video)); }, p(ctx, [dirty]) { - if (!video_updating && dirty & /* currentTime */ 1 && !isNaN(ctx[0])) { - video.currentTime = ctx[0]; + if (!video_updating && dirty & /*currentTime*/ 1 && !isNaN(/*currentTime*/ ctx[0])) { + video.currentTime = /*currentTime*/ ctx[0]; } video_updating = false; diff --git a/test/js/samples/window-binding-online/expected.js b/test/js/samples/window-binding-online/expected.js index a2e0c0b89d57..8285646481a2 100644 --- a/test/js/samples/window-binding-online/expected.js +++ b/test/js/samples/window-binding-online/expected.js @@ -11,11 +11,14 @@ import { function create_fragment(ctx) { let dispose; - add_render_callback(ctx[1]); + add_render_callback(/*onlinestatuschanged*/ ctx[1]); return { c() { - dispose = [listen(window, "online", ctx[1]), listen(window, "offline", ctx[1])]; + dispose = [ + listen(window, "online", /*onlinestatuschanged*/ ctx[1]), + listen(window, "offline", /*onlinestatuschanged*/ ctx[1]) + ]; }, m: noop, p: noop, diff --git a/test/js/samples/window-binding-scroll/expected.js b/test/js/samples/window-binding-scroll/expected.js index b7b46033562d..f79212e25e66 100644 --- a/test/js/samples/window-binding-scroll/expected.js +++ b/test/js/samples/window-binding-scroll/expected.js @@ -26,19 +26,19 @@ function create_fragment(ctx) { let t0; let t1; let dispose; - add_render_callback(ctx[1]); + add_render_callback(/*onwindowscroll*/ ctx[1]); return { c() { p = element("p"); t0 = text("scrolled to "); - t1 = text(ctx[0]); + t1 = text(/*y*/ ctx[0]); dispose = listen(window, "scroll", () => { scrolling = true; clearTimeout(scrolling_timeout); scrolling_timeout = setTimeout(clear_scrolling, 100); - ctx[1](); + /*onwindowscroll*/ ctx[1](); }); }, m(target, anchor) { @@ -47,14 +47,14 @@ function create_fragment(ctx) { append(p, t1); }, p(ctx, [dirty]) { - if (dirty & /* y */ 1 && !scrolling) { + if (dirty & /*y*/ 1 && !scrolling) { scrolling = true; clearTimeout(scrolling_timeout); - scrollTo(window.pageXOffset, ctx[0]); + scrollTo(window.pageXOffset, /*y*/ ctx[0]); scrolling_timeout = setTimeout(clear_scrolling, 100); } - if (dirty & /* y */ 1) set_data(t1, ctx[0]); + if (dirty & /*y*/ 1) set_data(t1, /*y*/ ctx[0]); }, i: noop, o: noop, From bb17583ed53bd1d99450f8356fa90d9c29aec2b5 Mon Sep 17 00:00:00 2001 From: Conduitry Date: Fri, 22 Nov 2019 18:01:57 -0500 Subject: [PATCH 43/43] I don't know what happened to these tests --- test/js/samples/collapses-text-around-comments/expected.js | 2 +- test/js/samples/css-media-query/expected.js | 4 +++- test/js/samples/css-shadow-dom-keyframes/expected.js | 6 +----- 3 files changed, 5 insertions(+), 7 deletions(-) diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js index 24f2703f0a05..6fef0f9490d8 100644 --- a/test/js/samples/collapses-text-around-comments/expected.js +++ b/test/js/samples/collapses-text-around-comments/expected.js @@ -16,7 +16,7 @@ import { function add_css() { var style = element("style"); style.id = "svelte-1a7i8ec-style"; - style.textContent = "p.svelte-1a7i8ec{\n\t\tcolor: red;\n\t}"; + style.textContent = "p.svelte-1a7i8ec{color:red}"; append(document.head, style); } diff --git a/test/js/samples/css-media-query/expected.js b/test/js/samples/css-media-query/expected.js index 7efd6abd05fc..f4776700599d 100644 --- a/test/js/samples/css-media-query/expected.js +++ b/test/js/samples/css-media-query/expected.js @@ -2,6 +2,7 @@ import { SvelteComponent, append, + attr, detach, element, init, @@ -13,7 +14,7 @@ import { function add_css() { var style = element("style"); style.id = "svelte-1slhpfn-style"; - style.textContent = "@media(min-width: 1px){}"; + style.textContent = "@media(min-width: 1px){div.svelte-1slhpfn{color:red}}"; append(document.head, style); } @@ -23,6 +24,7 @@ function create_fragment(ctx) { return { c() { div = element("div"); + attr(div, "class", "svelte-1slhpfn"); }, m(target, anchor) { insert(target, div, anchor); diff --git a/test/js/samples/css-shadow-dom-keyframes/expected.js b/test/js/samples/css-shadow-dom-keyframes/expected.js index ae4e151e91cd..a0a0ebe0211b 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected.js @@ -33,11 +33,7 @@ function create_fragment(ctx) { class Component extends SvelteElement { constructor(options) { super(); - - this.shadowRoot.innerHTML = ``; - + this.shadowRoot.innerHTML = ``; init(this, { target: this.shadowRoot }, null, create_fragment, safe_not_equal, {}); if (options) {