css transform with matrix3d does not work correctly on iPad

[phrixothrixa]

Hello! Css transform with matrix3d does not work correctly on iPad. There is screenshots how it looks (the top picture in the screenshots is how the original html that I tried to 'rasterize' to canvas looks). In the desktop it's OK, but in iPad z-part of transformation is not in canvas.

rasterizehtml version: 1.3.0
iPadOS version: 11.0

Desktop

iPad

[cburgmer]

If you have some simple source code, we could look at this.
However, my best guess is a browser bug in iOS here, with not much we can do on our side.

[phrixothrixa]

Hello! Here is an example.
https://jsbin.com/notefufanu/1/edit?html,js,output

[cburgmer]

Thanks, sorry for the late reply.

It is possible that during the processing of the HTML some style information gets lost. To rule this out I created the intermediate SVG manually using rasterizeHTML.js locally: https://jsbin.com/vohibojemu/1/edit?html,js,output

I don't have an iPad to check, could you check whether the a) SVG, b) Canvas, or c) Image render differently?
You'll notice that no dependency of rasterizeHTML.js is included.

[cburgmer]

It does look off on my latest Safari though, not just in the Canvas, but already in the image including the SVG as an data URI. This looks like a rendering error in Safari, and you could file a bug there.