Couldnt convert the Image: Cannot read properties of undefined (reading 'defaultView')

[Parathantl]

Summary of Issue: I am using React and wanted to download the parsed HTML element as an Image when the button clicks. But, it doesn't do as expected. In the console, it gives an error.

Expected Behavior

It should download the image version of parsed HTML content

Current Behavior

It gives error as: TypeError: Cannot read properties of undefined (reading 'defaultView')

Steps To Reproduce

1. Create a new React Project
2. Install the library and import as follow: import { toPng } from 'html-to-image';

3. ` const onButtonClick = (htmlContent) => { if (htmlContent === null) { return; }

   console.log('on button click::', htmlContent); // Content consoles here...

   toPng(htmlContent, { cacheBust: true }) .then((dataUrl) => { const link = document.createElement('a'); link.download = 'my-image-name.png'; link.href = dataUrl; link.click(); }) .catch((err) => { console.log(err); }); };`

• "html-to-image": "^1.11.11",
• OS: Windows 10
• Browser: Google Chrome

[vivcat[bot]]

👋 @Parathantl

Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. To help make it easier for us to investigate your issue, please follow the contributing guidelines.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

[hylarucoder]

@Parathantl

wrapping your component in a div may helps

in my vue case，

          <div >
            <UCard ref={elShare}

to

          <div ref={elShare}>
            <UCard

solved

[Parathantl]

@hylarucoder Thanks it solved to me.

[Matteobikk90]

still broken to me