I have a bug in the library Html2Canvas - Vue

Question

I want to make a screenshot on the google maps map. I implement the code, by default, of the library and I get the following error by console. Uncaught (in promise) Provided element is not within a Document. He tried to implement a promise with .then, but it does not work either. I do not know if the problem is understood.

I leave the code here below

HTML

<template>
  <div>
    <div ref="printMe">
      <h1>Print me!</h1>
    </div>
    <img :src="output">
  </div>
<template>

COMPONENT.VUE

<script>
export default {
  data() {
    return {
      output: null
    }
  },
  methods: {
    async print() {
      const el = this.$refs.printMe;
      const options = {
        type: 'dataURL'
      }
      this.output = await this.$html2canvas(el, options);
    }
  }
}
</script>

I show a bug Uncaught (in promise) Provided element is not within a Document

Answer 1

You have a template error that stops the Vue renderer </template>

<template>
  <div>
    <div ref="printMe">
      <h1>Print me!</h1>
    </div>
    <img :src="output">
  </div>
</template>

sandbox