Failed to execute 'drawImage' on 'CanvasRenderingContext2D'

[JaPod993]

Hi, I'm having trouble implementing your game in my vue project.

im tring to use this ad component like that:

 <puzzle-board
            :src="img" :cols="3" :rows="3" :autoResize="true" :showNumber="true"  :width="300" :height="300" />

But whatever i do there is always this error: DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The image argument is a canvas element with a width or height of 0.

When I inspect the network it seems taht my image is loading fine so i don't know what's the problem. Can yiu give me any clues?

[meganetaaan]

Thank you for using vue-8-puzzle and giving feedback.

DOMException: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The image argument is a canvas element with a width or height of 0.

In my component this error occurs when

1. The puzzle-board component is set autoResize to "true".
2. The container of puzzle-board has 0 width/height calculated.

<template>
    <div class="container">
      <puzzle-board v-if="show"
        :autoResize="true"
        :src="src"
      />
    </div>
</template>
<style>
  .container {
    width: 0px; /* this causes error */
  }
</style>

Could you check if the container's size has zero value? If it still does not work, I'd like to have more detail (The code to reproduce and full client log).