Uncaught Error: NotFoundError: DOM Exception 8 in {{#each}}

[vp2177]

Uncaught Error: NotFoundError: DOM Exception 8, stack trace:

The relevant code looks like

<div class='tbody'>
 {{#each items as item, y}}
  <div class='tr'>
    {{y}}
  </div>
 {{/each}}
</div>

items is initially [], then it's this.set({items: someArray}).

I tried to reproduce in the REPL but it works there. (Managed to repro in the REPL)

Browser: Chrome v27
Svelte: v1.29.1

Sorry I realise this bug report is not 100%, what other info would be helpful?

[Rich-Harris]

This is a guess, but maybe target isn't a DOM node? This can happen if you do

import App from './App.html';

new App({
  target: document.querySelector('.does-not-exist')
});

Can happen if the selector contains a typo. Compiling with dev: true should catch this error, if that's what's happening.

[Conduitry]

I was able to reproduce this on the REPL actually (Firefox, if that matters), but I don't have time right now to dig into it.

[vp2177]

In the screenshot target is visible on the right (Scope Variables), it appears to be the outer div. However node is undefined

The component itself renders fine initially, this only happens at the this.set({items}) call

[vp2177]

Repro (also in Chrome v60): https://svelte.technology/repl?version=1.29.1&gist=b8e1568c2c7d28ddb171f02ef560ba70

[Conduitry]

I lied, I ended up digging into this very slightly - when a new value for items is set, we're running this code:

				for ( var i = each_block_iterations.length; i < each_block_value.length; i += 1 ) {
					each_block_iterations[i] = create_each_block( state, each_block_value, each_block_value[i], i, component );
					each_block_iterations[i].mount( div, null );
				}

We're not calling .create() on the each_block, so when we call .mount on it, we run insertNode( div, target, anchor );, and div is still undefined.

[Conduitry]

Inserting a .create() call here does seem to give us the correct behavior (and none of the unit tests fail) - but I'm still not sure why this didn't come up before now, it seems like a pretty normal usage of the framework. That's the code that's been getting generated for a while. Playing with this in the REPL, it looks like like this issue arose in 1.23.0, considerably later than the above code.

[Rich-Harris]

it seems like a pretty normal usage of the framework

It's slightly unusual to have an each block that doesn't use the actual data, which I suspect is why it hasn't come up already. I've put @Conduitry's fix in a PR — #764

[Rich-Harris]

Fixed in 1.29.2: https://svelte.technology/repl?version=1.29.2&gist=b8e1568c2c7d28ddb171f02ef560ba70