always use `set_attributes` for attribute of `<svelte:element>`

pull/7486/head
baseballyama 4 years ago
parent 0a086c85e4
commit ce8f48c23e

@ -750,7 +750,7 @@ export default class ElementWrapper extends Wrapper {
} }
}); });
if (this.node.attributes.some(attr => attr.is_spread)) { if (this.node.attributes.some(attr => attr.is_spread) || this.node.is_dynamic_element) {
this.add_spread_attributes(block); this.add_spread_attributes(block);
return; return;
} }

@ -0,0 +1,15 @@
export default {
props: {
disabled: false
},
html: '<button>Click me</button>',
test({ assert, component, target }) {
const button = target.querySelector('button');
assert.equal(button.disabled, false);
component.disabled = true;
assert.htmlEqual(target.innerHTML, '<button disabled>Click me</button>');
assert.equal(button.disabled, true);
}
};

@ -0,0 +1,5 @@
<script>
export let disabled = false;
</script>
<svelte:element {disabled} this="button">Click me</svelte:element>

@ -0,0 +1,23 @@
export default {
props: {
props: {
disabled: true,
type: 'button',
'data-named': 'foo'
}
},
html: '<button disabled type="button" data-named="foo">Click me</button>',
test({ assert, component, target }) {
const button = target.querySelector('button');
assert.equal(button.disabled, true);
assert.equal(button.type, 'button');
assert.equal(button.dataset.named, 'foo');
component.props = { type: 'submit' };
assert.htmlEqual(target.innerHTML, '<button type="submit">Click me</button>');
assert.equal(button.disabled, false);
assert.equal(button.type, 'submit');
assert.equal(button.dataset.named, undefined);
}
};

@ -0,0 +1,9 @@
<script>
export let props = {
disabled: false,
type: "button",
"data-named": "foo",
};
</script>
<svelte:element this="button" {...props}>Click me</svelte:element>
Loading…
Cancel
Save