diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts
index 3b5001d483f1..95209b822377 100644
--- a/src/compiler/compile/render_dom/index.ts
+++ b/src/compiler/compile/render_dom/index.ts
@@ -86,6 +86,7 @@ export default function dom(
const set = (uses_props || uses_rest || writable_props.length > 0 || component.slots.size > 0)
? x`
${$$props} => {
+ if (@is_empty(${$$props})) return;
${uses_props && renderer.invalidate('$$props', x`$$props = @assign(@assign({}, $$props), @exclude_internal_props($$new_props))`)}
${uses_rest && !uses_props && x`$$props = @assign(@assign({}, $$props), @exclude_internal_props($$new_props))`}
${uses_rest && renderer.invalidate('$$restProps', x`$$restProps = ${compute_rest}`)}
diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
index 271b3de1e1c3..814f365a848e 100644
--- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
+++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts
@@ -468,7 +468,7 @@ export default class InlineComponentWrapper extends Wrapper {
${name} = null;
}
} else if (${switch_value}) {
- ${updates.length && b`${name}.$set(${name_changes});`}
+ ${updates.length > 0 && b`${name}.$set(${name_changes});`}
}
`);
diff --git a/src/runtime/internal/utils.ts b/src/runtime/internal/utils.ts
index d752c9de9d83..3fd0a2b70166 100644
--- a/src/runtime/internal/utils.ts
+++ b/src/runtime/internal/utils.ts
@@ -42,6 +42,10 @@ export function not_equal(a, b) {
return a != a ? b == b : a !== b;
}
+export function is_empty(obj) {
+ return Object.keys(obj).length === 0;
+}
+
export function validate_store(store, name) {
if (store != null && typeof store.subscribe !== 'function') {
throw new Error(`'${name}' is not a store with a 'subscribe' method`);
diff --git a/test/runtime/samples/props-reactive-only-with-change/Comp.svelte b/test/runtime/samples/props-reactive-only-with-change/Comp.svelte
new file mode 100644
index 000000000000..0eaf8a40d48a
--- /dev/null
+++ b/test/runtime/samples/props-reactive-only-with-change/Comp.svelte
@@ -0,0 +1,6 @@
+
\ No newline at end of file
diff --git a/test/runtime/samples/props-reactive-only-with-change/_config.js b/test/runtime/samples/props-reactive-only-with-change/_config.js
new file mode 100644
index 000000000000..04170620c817
--- /dev/null
+++ b/test/runtime/samples/props-reactive-only-with-change/_config.js
@@ -0,0 +1,30 @@
+let callbacks = [];
+
+export default {
+ props: {
+ callback: (value) => callbacks.push(value),
+ val1: "1",
+ val2: "2",
+ },
+
+ before_test() {
+ callbacks = [];
+ },
+
+ async test({ assert, component, target }) {
+ assert.equal(callbacks.length, 2);
+ assert.equal(JSON.stringify(callbacks), '["1","2"]');
+
+ component.val1 = "3";
+ assert.equal(callbacks.length, 3);
+ assert.equal(JSON.stringify(callbacks), '["1","2","1"]');
+
+ component.val1 = "4";
+ assert.equal(callbacks.length, 4);
+ assert.equal(JSON.stringify(callbacks), '["1","2","1","1"]');
+
+ component.val2 = "5";
+ assert.equal(callbacks.length, 5);
+ assert.equal(JSON.stringify(callbacks), '["1","2","1","1","2"]');
+ },
+};
diff --git a/test/runtime/samples/props-reactive-only-with-change/main.svelte b/test/runtime/samples/props-reactive-only-with-change/main.svelte
new file mode 100644
index 000000000000..73ddd137f5bc
--- /dev/null
+++ b/test/runtime/samples/props-reactive-only-with-change/main.svelte
@@ -0,0 +1,8 @@
+
+
+
+
\ No newline at end of file