diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index 6ff3c37fc1..be143c04b1 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -71,10 +71,16 @@ export default function dom( } const uses_slots = component.var_lookup.has('$$slots'); - let slots = null + let slots = null; + let slots_update = null; if (uses_slots) { - slots = b`let { $$slots, update: #update_$$slots } = @create_slots_accessor(#slots, $$scope)` + slots = b`let { $$slots, update: #update_$$slots } = @create_slots_accessor(#slots, $$scope)`; + slots_update = b` + if (${renderer.dirty(['$$scope'], true)}) { + #update_$$slots($$scope) + } + `; renderer.add_to_context('$$scope'); } @@ -454,9 +460,7 @@ export default function dom( ${(reactive_declarations.length > 0 || uses_slots) && b` $$self.$$.update = () => { - if (${renderer.dirty(['$$scope'], true)}) { - #update_$$slots($$scope) - } + ${slots_update} ${reactive_declarations} }; diff --git a/test/js/samples/capture-inject-state/expected.js b/test/js/samples/capture-inject-state/expected.js index cd719ac5d2..8ca9ada6a1 100644 --- a/test/js/samples/capture-inject-state/expected.js +++ b/test/js/samples/capture-inject-state/expected.js @@ -103,6 +103,7 @@ function instance($$self, $$props, $$invalidate) { $$subscribe_prop = () => ($$unsubscribe_prop(), $$unsubscribe_prop = subscribe(prop, $$value => $$invalidate(2, $prop = $$value)), prop); $$self.$$.on_destroy.push(() => $$unsubscribe_prop()); + let { $$slots: slots = {}, $$scope } = $$props; let { prop } = $$props; validate_store(prop, "prop"); $$subscribe_prop(); @@ -115,8 +116,7 @@ function instance($$self, $$props, $$invalidate) { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); $$self.$set = $$props => { if ("prop" in $$props) $$subscribe_prop($$invalidate(0, prop = $$props.prop)); diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js index dd142adb26..282e325cfe 100644 --- a/test/js/samples/debug-empty/expected.js +++ b/test/js/samples/debug-empty/expected.js @@ -69,6 +69,7 @@ function create_fragment(ctx) { } function instance($$self, $$props, $$invalidate) { + let { $$slots: slots = {}, $$scope } = $$props; let { name } = $$props; const writable_props = ["name"]; @@ -76,8 +77,7 @@ function instance($$self, $$props, $$invalidate) { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); $$self.$set = $$props => { if ("name" in $$props) $$invalidate(0, name = $$props.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 977702b99f..29d557b658 100644 --- a/test/js/samples/debug-foo-bar-baz-things/expected.js +++ b/test/js/samples/debug-foo-bar-baz-things/expected.js @@ -170,6 +170,7 @@ function create_fragment(ctx) { } function instance($$self, $$props, $$invalidate) { + let { $$slots: slots = {}, $$scope } = $$props; let { things } = $$props; let { foo } = $$props; let { bar } = $$props; @@ -180,8 +181,7 @@ function instance($$self, $$props, $$invalidate) { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); $$self.$set = $$props => { if ("things" in $$props) $$invalidate(0, things = $$props.things); diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js index fe62ff77bf..427ffe3dea 100644 --- a/test/js/samples/debug-foo/expected.js +++ b/test/js/samples/debug-foo/expected.js @@ -164,6 +164,7 @@ function create_fragment(ctx) { } function instance($$self, $$props, $$invalidate) { + let { $$slots: slots = {}, $$scope } = $$props; let { things } = $$props; let { foo } = $$props; const writable_props = ["things", "foo"]; @@ -172,8 +173,7 @@ function instance($$self, $$props, $$invalidate) { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); $$self.$set = $$props => { if ("things" in $$props) $$invalidate(0, things = $$props.things); diff --git a/test/js/samples/debug-hoisted/expected.js b/test/js/samples/debug-hoisted/expected.js index 0e634297f0..8d8f0f432b 100644 --- a/test/js/samples/debug-hoisted/expected.js +++ b/test/js/samples/debug-hoisted/expected.js @@ -49,6 +49,7 @@ function create_fragment(ctx) { } function instance($$self, $$props, $$invalidate) { + let { $$slots: slots = {}, $$scope } = $$props; let obj = { x: 5 }; let kobzol = 5; const writable_props = []; @@ -57,8 +58,7 @@ function instance($$self, $$props, $$invalidate) { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); $$self.$capture_state = () => ({ obj, kobzol }); $$self.$inject_state = $$props => { diff --git a/test/js/samples/debug-no-dependencies/expected.js b/test/js/samples/debug-no-dependencies/expected.js index 76068e8cf4..d041757dee 100644 --- a/test/js/samples/debug-no-dependencies/expected.js +++ b/test/js/samples/debug-no-dependencies/expected.js @@ -136,14 +136,14 @@ function create_fragment(ctx) { } function instance($$self, $$props) { + let { $$slots: slots = {}, $$scope } = $$props; const writable_props = []; Object.keys($$props).forEach(key => { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); return []; } 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 0a50e2cd97..c0e75490ea 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected.js @@ -65,6 +65,7 @@ function create_fragment(ctx) { } function instance($$self, $$props, $$invalidate) { + let { $$slots: slots = {}, $$scope } = $$props; let { foo } = $$props; let bar; const writable_props = ["foo"]; @@ -73,8 +74,7 @@ function instance($$self, $$props, $$invalidate) { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); $$self.$set = $$props => { if ("foo" in $$props) $$invalidate(0, foo = $$props.foo); diff --git a/test/js/samples/loop-protect/expected.js b/test/js/samples/loop-protect/expected.js index c52d9df437..8c1d805894 100644 --- a/test/js/samples/loop-protect/expected.js +++ b/test/js/samples/loop-protect/expected.js @@ -67,6 +67,7 @@ function foo() { } function instance($$self, $$props, $$invalidate) { + let { $$slots: slots = {}, $$scope } = $$props; let node; { @@ -111,8 +112,7 @@ function instance($$self, $$props, $$invalidate) { if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console_1.warn(` was created with unknown prop '${key}'`); }); - let { $$slots = {}, $$scope } = $$props; - validate_slots("Component", $$slots, []); + validate_slots("Component", slots, []); function div_binding($$value) { binding_callbacks[$$value ? "unshift" : "push"](() => { diff --git a/test/runtime/samples/$$slots/_config.js b/test/runtime/samples/$$slots/_config.js index 999fb03589..e9418487ea 100644 --- a/test/runtime/samples/$$slots/_config.js +++ b/test/runtime/samples/$$slots/_config.js @@ -3,7 +3,7 @@ export default { assert.htmlEqual(target.innerHTML, `

Value: a

bar

- `) + `); const btn = target.querySelector('button'); const clickEvent = new window.MouseEvent('click');