Search code examples
vue.jshtml2canvas

Cannot read properties of undefined (reading 'ownerDocument')


I'm trying to use htlm2canvas in Vue.js to take a screenshot of a div, but it gives the following error:

Cannot read properties of undefined (reading 'ownerDocument')

Do I have to import something inside the component I want to use it? I didn't find any documentation for this library.

Main.js:

    import Vue from 'vue'
    import VueHtml2Canvas from 'vue-html2canvas'
    import BabelPolyfill from '@babel/polyfill'
    Vue.use(BabelPolyfill)
    Vue.use(VueHtml2Canvas)
    new Vue({
      router,
      store,
      render: h => h(App),
}).$mount('#app')

Target div:

<div ref="printme" class="content">
///elements
</div>

Method:

async print() {
  const el = this.$refs.printMe

  const options = {
    type: 'dataURL',
  }
  this.output = await this.$html2canvas(el, options)
},

Mounted:

mounted() {
    this.print()
  },

Solution

  • There is a typo

    <div ref="printMe" class="content">
    ///elements
    </div>
    

    Note: I have changed printme to printMe