beyonk-group/svelte-carousel

Uncaught (in promise) TypeError: Cannot read property 'removeChild' of null

jemikanegara opened this issue · 2 comments

jemikanegara commented

I love this module but I got an error when use #each on slide content on Sapper v0.27.4

Uncaught (in promise) TypeError: Cannot read property 'removeChild' of null

btw I have found similar issue on svelte repo sveltejs/svelte#2086, maybe upgrading svelte version in this module can fix the issue

My code :

<script>
  import Carousel from "@beyonk/svelte-carousel";
  import SingleCard from "./SingleCard.svelte";
  export let windowWidth;

  const singleMaterials = {
    title: "Just a title",
    author: "authorx",
    description: "card description"  };
  const materials = [
    singleMaterials,
    singleMaterials,
    singleMaterials,
    singleMaterials,
    singleMaterials,
    singleMaterials
  ];
</script>

<Carousel loop={false} perPage={windowWidth}>
  {#each materials as material}
    <SingleCard {material} />
  {/each}
</Carousel>
jemikanegara commented

I did try update the svelte version but still not working, the error still showing and the slider won't sliding so I decide to use plain siema

  • 👍1
masrlinu commented

Hi! I need to open this issue again!

Here is an example that there is an error:
https://svelte.dev/repl/dfa92aa40f134954bac5cec617f2d44b?version=3

If I make the innerWidth of the output smaller than 768 (so that the breakpoint gets triggered), the error appears and the reactivity of the page does not work anymore. The number on the top, which shows the innerWidth, does not get updated anymore. You see it in the attached video.

Bildschirmvideo.aufnehmen.2021-01-09.um.18.15.18.mov