-
-
Notifications
You must be signed in to change notification settings - Fork 4.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Over-permissive logic for .innerHTML optimizations #1581
Comments
Reduced example: {#each foo as bar, i}
<div><div title={i}>x</div></div>
{/each}
<script>
export default {
data: () => ({ foo: [0, 1, 2, 3, 4] }),
};
</script> So far it seems that the relevant factors seem to be: if we have an each loop, and we are only using its key (not its value), and that key is only being used in an attribute value, and the element with that attribute is nested inside another element, then Svelte incorrectly believes it is able to use |
To give a bit more of an idea of when this broke, it looks like it's fine in 2.1.1 but not in 2.2.0, meaning it happened in the big refactor in #1367, which is not incredibly helpful. |
There's a bit more than this going on, but I think much of it can be traced back to here. In non-keyed each blocks, the index variable is declared as having no dependencies, and so stuff containing the index variable isn't seen as dynamic. Getting rid of the |
Okay one last thing before bed: I'm now pretty sure it's that last thing about needing more nuance. This bug isn't even particularly related to each blocks. A very simple thing which broke between 2.1.1 and 2.2.0 (and which can be confirmed in the REPL) is <div><div title={'hello'}>x</div></div> The compiler (reasonably and correctly) sees that Edit: Okay it might not be all that complicated. I'm hoping that the only place this will affect us is in attribute values and that we'll just be able to check whether any of them have mustache expressions - but this should be investigated. I'll look into it tomorrow. |
Didn't mean to autoclose this until the fix is actually released. |
Fixed in 2.9.2. |
See https://github.com/simonlayfield/svelte-each-index - Svelte is using the .innerHTML optimization when it shouldn't. The
{i}
s in the loop should be dynamic.As of #1499 this won't be reproducible in dev mode / in the repl.
cc @simonlayfield
The text was updated successfully, but these errors were encountered: