CanvasTexture won't give me an image on WebGL

https://codepen.io/oL_web/pen/zXEvzL

What I want to do is create a single spritesheet out of different images of the same height and width.
The code above is what I ended up with but despite calling .refresh() like the docs say I still get a transparent image on WebGL. It works in Canvas mode. What am I doing wrong here?