mirrors/svelte
mirrors/svelte
0
0
Fork 0
mirror of https://github.com/sveltejs/svelte.git synced 2024-12-01 17:30:59 +01:00
Code Issues Releases Wiki Activity

Don't lose class: directive classes on an element with {...spread} attributes when updating (#3781)

Browse Source 
* include all class: directive updates on elements with spreads (#3421)

* add test

* update changelog
This commit is contained in:
Conduitry 2019-10-24 08:18:33 -04:00 committed by GitHub
parent 8c0c15c3aa
commit 0419039d26
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -5,6 +5,7 @@
* Fix `{#each}` context not shadowing outer scope when using `bind:` ([#1565](https://github.com/sveltejs/svelte/issues/1565))
* Fix edge cases in matching selectors against elements ([#1710](https://github.com/sveltejs/svelte/issues/1710))
* Allow exiting a reactive block early with `break $` ([#2828](https://github.com/sveltejs/svelte/issues/2828))
* Don't lose `class:` directive classes on an element with `{...spread}` attributes when updating ([#3421](https://github.com/sveltejs/svelte/issues/3421))
* Check attributes have changed before setting them to avoid image flicker ([#3579](https://github.com/sveltejs/svelte/pull/3579))
* Fix generating malformed code for `{@debug}` tags with no dependencies ([#3588](https://github.com/sveltejs/svelte/issue/3588))
* Fix generated code in specific case involving compound ifs and child components ([#3595](https://github.com/sveltejs/svelte/issue/3595))

5
src/compiler/compile/render_dom/wrappers/Element/index.ts
View File

@ -809,6 +809,7 @@ export default class ElementWrapper extends Wrapper {
}
add_classes(block: Block) {
const has_spread = this.node.attributes.some(attr => attr.is_spread);
this.node.classes.forEach(class_directive => {
const { expression, name } = class_directive;
let snippet;
@ -824,7 +825,9 @@ export default class ElementWrapper extends Wrapper {
block.chunks.hydrate.push(updater);
if ((dependencies && dependencies.size > 0) || this.class_dependencies.length) {
if (has_spread) {
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);

7
test/runtime/samples/spread-element-class/_config.js Normal file
View File

@ -0,0 +1,7 @@
export default {
html: `<div class='foo bar'>hello</div>`,
test({ assert, component, target }) {
component.blah = 'goodbye';
assert.htmlEqual(target.innerHTML, `<div class='foo bar'>goodbye</div>`);
}
};

5
test/runtime/samples/spread-element-class/main.svelte Normal file
View File

@ -0,0 +1,5 @@
<script>
export let blah = 'hello';
</script>
<div class='foo' class:bar={true} {...{}}>{blah}</div>