pa7 / heatmap.js

🔥 JavaScript Library for HTML5 canvas based heatmaps
https://www.patrick-wied.at/static/heatmapjs/
MIT License
6.24k stars 1.33k forks source link

'TypeError: offset required' when using Heatmap.js with local tests #330

Open jesuino opened 3 years ago

jesuino commented 3 years ago

Using latest heatmap.js with Canvas in a jest test leads to errors. It fails with:

TypeError: offset required

      43 | function createHeatmap(parent: HTMLElement, heatData: HeatData[]) {
      44 |   return heatmap
    > 45 |     .create({
         |      ^
      46 |       container: parent
      47 |     })
      48 |     .setData({

      at _getColorPalette (../../node_modules/heatmap.js/build/heatmap.js:262:16)
      at new Canvas2dRenderer (../../node_modules/heatmap.js/build/heatmap.js:355:21)
      at new Heatmap (../../node_modules/heatmap.js/build/heatmap.js:650:24)
      at Object.create (../../node_modules/heatmap.js/build/heatmap.js:715:12)
      at createHeatmap (src/SVGHeatmap.tsx:45:6)
      at src/SVGHeatmap.tsx:81:21
      at commitHookEffectList (../../node_modules/react-dom/cjs/react-dom.development.js:22030:26)
      at commitPassiveHookEffects (../../node_modules/react-dom/cjs/react-dom.development.js:22064:11)
      at HTMLUnknownElement.callCallback (../../node_modules/react-dom/cjs/react-dom.development.js:336:14)
      at innerInvokeEventListeners (../../node_modules/jsdom/lib/jsdom/living/events/EventTarget-impl.js:316:27)

This is the line that throws the error:

https://github.com/pa7/heatmap.js/blob/master/src/renderer/canvas2d.js#L14

The reason is explained here:

https://stackoverflow.com/questions/62332852/how-to-create-gradient-text-in-canvas-nodejs

And you can see that in the node js canvas there's indeed a type check:

https://github.com/Automattic/node-canvas/blob/fe186e5f1e720eca598212fdc6edf16766c21ec0/src/CanvasGradient.cc#L77

Solution is simple parse the string to number.

Khalilw1 commented 3 years ago

I came up against the same issue too while testing using jest on my vue project hopefully your PR gets quickly merged

EDIT: Just realized this is from December well let us not lose hope