Svelte: From 3.6.0: "TypeError: Cannot read property 'block' of null"

Created on 25 Jun 2019  路  10Comments  路  Source: sveltejs/svelte

I'm using it with svelte-apollo but I cannot create now reproduction on codesandbox.

Uncaught (in promise) TypeError: Cannot read property 'block' of null
    at Object.destroy [as d] (PlayersPage.svelte:14)
    at destroy_component (index.mjs:1185)
    at App.svelte:31
    at index.mjs:633
    at run (index.mjs:18)
    at Array.forEach (<anonymous>)
    at run_all (index.mjs:24)
    at check_outros (index.mjs:615)
    at Object.update [as p] (App.svelte:31)
    at update (index.mjs:586)

Maybe something related to Object.destroy from 3.6.0 (https://github.com/sveltejs/svelte/issues/3058)?

bug

Most helpful comment

Reduced repro: A <svelte:component> that displays a component with an {#await} block.

App.svelte

<script>
  let flag = false;
  import Widget from './Widget.svelte';
</script>

<input type='checkbox' bind:checked={flag}>

<svelte:component this={flag && Widget}/>

Widget.svelte

{#await null}{/await}

Toggling the checkbox on and off to display and destroy the child component throws this exception.

All 10 comments

I can confirm this. Downgrading to 3.5.4 fixes the issue. I am using page.js for routing and 3.6.0 breaks it.

We'll need a repro to debug this. It doesn't have to be on codesandbox, it can be a git repo.

Is this still present on the latest version?

I cannot create gist now. The problem is still on 3.6.2 (I try every time new Svelte versions).

Downgrading to 3.5.4 fix the issue also for me.

I also caught this issue. Seems it somehow depends on https://github.com/sveltejs/svelte/issues/3058

After a small investigation, I'm sure it also depends on {#await /} block.

@Conduitry, I have a reproduction: https://codesandbox.io/s/vigilant-cache-4rtqy

Open browser console, not the codesandbox's one.

@radarsh, @PaulMaly can you confirm it is the same problem?

@frederikhors yup, same error.

image

Reduced repro: A <svelte:component> that displays a component with an {#await} block.

App.svelte

<script>
  let flag = false;
  import Widget from './Widget.svelte';
</script>

<input type='checkbox' bind:checked={flag}>

<svelte:component this={flag && Widget}/>

Widget.svelte

{#await null}{/await}

Toggling the checkbox on and off to display and destroy the child component throws this exception.

Auto-closed by #3172, but re-opening because the repro at https://codesandbox.io/s/vigilant-cache-4rtqy is still buggy

I take it back, it does appear to be fixed.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

thoughtspile picture thoughtspile  路  3Comments

angelozehr picture angelozehr  路  3Comments

AntoninBeaufort picture AntoninBeaufort  路  3Comments

davidcallanan picture davidcallanan  路  3Comments

Rich-Harris picture Rich-Harris  路  3Comments