<canvas> returns blank in React 17.0.2

[HypernovaTX]

Issue:
<canvas> returns blank:

Code used:

<ImageDepthMap
      originalImg={'../../resources/img/mountain-base.jpg'}
      depthImg={'../../resources/img/mountain-mask.jpg'}
      verticalThreshold={25}
      horizontalThreshold={25}
/>

Troubleshooting steps:

• Reinstall the NPM package
• Ensure all of the dependencies are not missing: glslify-loader and raw-loader
• Tried external, local sources for props: originalImg and depthImg
• Since /src/ImageDepthMap.js is called first and the elements is rendered from ImageDepthMap.js like <div> and <canvas>. I suspect the issue might be caused by /src/Sketch.js.

Comment:

• I have noticed this NPM package was last updated about 9 months ago. I would love to use this for one of my project but I am not sure if the author is open to have it fixed for newer version of React. I have tried to read the original source see if I can fix it but unfortunately I don't have much knowledge on fixing this.