yisibl/resvg-js

Border render incorrectly on version `2.4.1`

Jackie1210 opened this issue · 4 comments

Hi! @yisibl

This is satori contributor. I am going to upgrade @resvg/resvg-js to 2.4.1 so that satori can support more css feature like mix-blend-mode, but it cause some bug unexpectedly. I'll split them into some issues so that we can track.

This issue shows that @resvg/resvg-js does not render top red border correctly like before.

<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><defs><clipPath id="satori_bc-id"><rect x="0" y="0" width="100" height="100"/></clipPath></defs><mask id="satori_om-id"><rect x="4" y="1" width="94" height="96" fill="#fff"/><path width="100" height="100" fill="none" stroke="#000" stroke-width="2" d="M0,0 A0,0 0 0 1 0,0 h100 A0,0 0 0 1 100,0"/><path width="100" height="100" fill="none" stroke="#000" stroke-width="4" d="M100,0 A0,0 0 0 1 100,0 v100 A0,0 0 0 1 100,100"/><path width="100" height="100" fill="none" stroke="#000" stroke-width="6" d="M100,100 A0,0 0 0 1 100,100 h-100 A0,0 0 0 1 0,100"/><path width="100" height="100" fill="none" stroke="#000" stroke-width="8" d="M0,100 A0,0 0 0 1 0,100 v-100 A0,0 0 0 1 0,0"/></mask><path width="100" height="100" clip-path="url(#satori_bc-id)" fill="none" stroke="red" stroke-width="2" d="M0,0 A0,0 0 0 1 0,0 h100 A0,0 0 0 1 100,0"/><path width="100" height="100" clip-path="url(#satori_bc-id)" fill="none" stroke="green" stroke-width="4" d="M100,0 A0,0 0 0 1 100,0 v100 A0,0 0 0 1 100,100"/><path width="100" height="100" clip-path="url(#satori_bc-id)" fill="none" stroke="blue" stroke-width="6" d="M100,100 A0,0 0 0 1 100,100 h-100 A0,0 0 0 1 0,100"/><path width="100" height="100" clip-path="url(#satori_bc-id)" fill="none" stroke="yellow" stroke-width="8" d="M0,100 A0,0 0 0 1 0,100 v-100 A0,0 0 0 1 0,0"/></svg>

You can see the result in playground with svg above generated by satori

yisibl commented

I have confirmed that there is no problem in the upstream resvg v0.35.0, due to more changes upstream, resvg-js needs some work to be upgraded to the latest version. I don't have the time at the moment.

yisibl commented

Good news, @zimond said he had time recently to work on upgrading resvg to the latest version.

Wow!Thank you guys!