diff --git a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts index c85f47cd54..c5cd58af0e 100644 --- a/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts +++ b/src/compiler/compile/render_dom/wrappers/InlineComponent/index.ts @@ -195,8 +195,11 @@ export default class InlineComponentWrapper extends Wrapper { if (attr.is_spread) { const value = attr.expression.render(block); initial_props.push(value); - - changes.push(condition ? `${condition} && ${value}` : value); + let value_object_check = value + if (attr.expression.node.type !== 'ObjectExpression') { + value_object_check = `typeof ${value} === 'object' && ${value} !== null ? ${value} : {}`; + } + changes.push(condition ? `${condition} && (${value_object_check})` : value_object_check); } else { const obj = `{ ${quote_name_if_necessary(name)}: ${attr.get_value(block)} }`; initial_props.push(obj); diff --git a/test/runtime/samples/spread-component-dynamic-non-object-boolean/Widget.svelte b/test/runtime/samples/spread-component-dynamic-non-object-boolean/Widget.svelte new file mode 100644 index 0000000000..bc168d4956 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-boolean/Widget.svelte @@ -0,0 +1,9 @@ + + +

foo: {foo}

+

baz: {baz}

+

qux: {qux}

diff --git a/test/runtime/samples/spread-component-dynamic-non-object-boolean/_config.js b/test/runtime/samples/spread-component-dynamic-non-object-boolean/_config.js new file mode 100644 index 0000000000..f4f79052a5 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-boolean/_config.js @@ -0,0 +1,24 @@ +export default { + props: { + props: { + foo: 'lol', + baz: 40 + 2, + } + }, + + html: ` +

foo: lol

+

baz: 42

+

qux: named

+ `, + + test({ assert, component, target }) { + component.props = true; + + assert.htmlEqual(target.innerHTML, ` +

foo: undefined

+

baz: undefined

+

qux: named

+ `); + } +}; diff --git a/test/runtime/samples/spread-component-dynamic-non-object-boolean/main.svelte b/test/runtime/samples/spread-component-dynamic-non-object-boolean/main.svelte new file mode 100644 index 0000000000..3ca281903e --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-boolean/main.svelte @@ -0,0 +1,9 @@ + + +
+ +
diff --git a/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/Widget.svelte b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/Widget.svelte new file mode 100644 index 0000000000..373bf23f51 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/Widget.svelte @@ -0,0 +1,6 @@ + + +{foo} {baz} diff --git a/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/_config.js b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/_config.js new file mode 100644 index 0000000000..d69c6b96ba --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/_config.js @@ -0,0 +1,10 @@ +export default { + html: `b baz`, + test({ assert, component, target }) { + component.bar = undefined; + assert.htmlEqual( + target.innerHTML, + `b undefined` + ); + }, +}; diff --git a/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/main.svelte b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/main.svelte new file mode 100644 index 0000000000..a60043391a --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-multiple-dependencies/main.svelte @@ -0,0 +1,10 @@ + + + diff --git a/test/runtime/samples/spread-component-dynamic-non-object-null/Widget.svelte b/test/runtime/samples/spread-component-dynamic-non-object-null/Widget.svelte new file mode 100644 index 0000000000..bc168d4956 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-null/Widget.svelte @@ -0,0 +1,9 @@ + + +

foo: {foo}

+

baz: {baz}

+

qux: {qux}

diff --git a/test/runtime/samples/spread-component-dynamic-non-object-null/_config.js b/test/runtime/samples/spread-component-dynamic-non-object-null/_config.js new file mode 100644 index 0000000000..4569ba2cbc --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-null/_config.js @@ -0,0 +1,24 @@ +export default { + props: { + props: { + foo: 'lol', + baz: 40 + 2, + } + }, + + html: ` +

foo: lol

+

baz: 42

+

qux: named

+ `, + + test({ assert, component, target }) { + component.props = null; + + assert.htmlEqual(target.innerHTML, ` +

foo: undefined

+

baz: undefined

+

qux: named

+ `); + } +}; diff --git a/test/runtime/samples/spread-component-dynamic-non-object-null/main.svelte b/test/runtime/samples/spread-component-dynamic-non-object-null/main.svelte new file mode 100644 index 0000000000..3ca281903e --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-null/main.svelte @@ -0,0 +1,9 @@ + + +
+ +
diff --git a/test/runtime/samples/spread-component-dynamic-non-object-number/Widget.svelte b/test/runtime/samples/spread-component-dynamic-non-object-number/Widget.svelte new file mode 100644 index 0000000000..bc168d4956 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-number/Widget.svelte @@ -0,0 +1,9 @@ + + +

foo: {foo}

+

baz: {baz}

+

qux: {qux}

diff --git a/test/runtime/samples/spread-component-dynamic-non-object-number/_config.js b/test/runtime/samples/spread-component-dynamic-non-object-number/_config.js new file mode 100644 index 0000000000..0f34e93ac4 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-number/_config.js @@ -0,0 +1,24 @@ +export default { + props: { + props: { + foo: 'lol', + baz: 40 + 2, + } + }, + + html: ` +

foo: lol

+

baz: 42

+

qux: named

+ `, + + test({ assert, component, target }) { + component.props = 1337; + + assert.htmlEqual(target.innerHTML, ` +

foo: undefined

+

baz: undefined

+

qux: named

+ `); + } +}; diff --git a/test/runtime/samples/spread-component-dynamic-non-object-number/main.svelte b/test/runtime/samples/spread-component-dynamic-non-object-number/main.svelte new file mode 100644 index 0000000000..3ca281903e --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-number/main.svelte @@ -0,0 +1,9 @@ + + +
+ +
diff --git a/test/runtime/samples/spread-component-dynamic-non-object-undefined/Widget.svelte b/test/runtime/samples/spread-component-dynamic-non-object-undefined/Widget.svelte new file mode 100644 index 0000000000..bc168d4956 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-undefined/Widget.svelte @@ -0,0 +1,9 @@ + + +

foo: {foo}

+

baz: {baz}

+

qux: {qux}

diff --git a/test/runtime/samples/spread-component-dynamic-non-object-undefined/_config.js b/test/runtime/samples/spread-component-dynamic-non-object-undefined/_config.js new file mode 100644 index 0000000000..ecae122755 --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-undefined/_config.js @@ -0,0 +1,24 @@ +export default { + props: { + props: { + foo: 'lol', + baz: 40 + 2, + } + }, + + html: ` +

foo: lol

+

baz: 42

+

qux: named

+ `, + + test({ assert, component, target }) { + component.props = undefined; + + assert.htmlEqual(target.innerHTML, ` +

foo: undefined

+

baz: undefined

+

qux: named

+ `); + } +}; diff --git a/test/runtime/samples/spread-component-dynamic-non-object-undefined/main.svelte b/test/runtime/samples/spread-component-dynamic-non-object-undefined/main.svelte new file mode 100644 index 0000000000..3ca281903e --- /dev/null +++ b/test/runtime/samples/spread-component-dynamic-non-object-undefined/main.svelte @@ -0,0 +1,9 @@ + + +
+ +