Eyes in QR code get slanted/mangled (elliptic arcs are rendered incorrectly?)

[jonaslm]

Hello

Updated dompdf recently (to v3.1.0) and this started happening to our QR codes. I assume the root cause is something in this lib, so I'm reporting the issue here.

Here's what the QR codes now look like:

and what they usually look like:

The PDF:

example_qrcode_bug.pdf

The SVG:

<?xml version="1.0" encoding="UTF-8"?>


<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="400" height="400" viewBox="0 0 400 400"><rect x="0" y="0" width="400" height="400" fill="#fefefe"/><g transform="scale(16)"><g transform="translate(0,0)"><g><g transform="translate(3.5,3.5)"><path fill-rule="evenodd" d="M0 3.5L2.9 3.5C2.9 3.5 3.5 3.5 3.5 2.9L3.5 0L3.5 -2.9C3.5 -2.9 3.5 -3.5 2.9 -3.5L0 -3.5L-2.9 -3.5C-2.9 -3.5 -3.5 -3.5 -3.5 -2.9L-3.5 0L-3.5 2.9C-3.5 2.9 -3.5 3.5 -2.9 3.5L0 3.5ZM2.75 0A2.75 2.75 0 0 1 0 2.75A2.75 2.75 0 0 1 -2.75 0A2.75 2.75 0 0 1 0 -2.75A2.75 2.75 0 0 1 2.75 0Z" fill="#611cf2"/><path fill-rule="evenodd" d="M1.3 0A1.3 1.3 0 0 1 0 1.3A1.3 1.3 0 0 1 -1.3 0A1.3 1.3 0 0 1 0 -1.3A1.3 1.3 0 0 1 1.3 0Z" fill="#000000"/></g></g><g><g transform="translate(21.5,3.5)"><g transform="rotate(90)"><path fill-rule="evenodd" d="M0 3.5L2.9 3.5C2.9 3.5 3.5 3.5 3.5 2.9L3.5 0L3.5 -2.9C3.5 -2.9 3.5 -3.5 2.9 -3.5L0 -3.5L-2.9 -3.5C-2.9 -3.5 -3.5 -3.5 -3.5 -2.9L-3.5 0L-3.5 2.9C-3.5 2.9 -3.5 3.5 -2.9 3.5L0 3.5ZM2.75 0A2.75 2.75 0 0 1 0 2.75A2.75 2.75 0 0 1 -2.75 0A2.75 2.75 0 0 1 0 -2.75A2.75 2.75 0 0 1 2.75 0Z" fill="#611cf2"/><path fill-rule="evenodd" d="M1.3 0A1.3 1.3 0 0 1 0 1.3A1.3 1.3 0 0 1 -1.3 0A1.3 1.3 0 0 1 0 -1.3A1.3 1.3 0 0 1 1.3 0Z" fill="#000000"/></g></g></g><g><g transform="translate(3.5,21.5)"><g transform="rotate(-90)"><path fill-rule="evenodd" d="M0 3.5L2.9 3.5C2.9 3.5 3.5 3.5 3.5 2.9L3.5 0L3.5 -2.9C3.5 -2.9 3.5 -3.5 2.9 -3.5L0 -3.5L-2.9 -3.5C-2.9 -3.5 -3.5 -3.5 -3.5 -2.9L-3.5 0L-3.5 2.9C-3.5 2.9 -3.5 3.5 -2.9 3.5L0 3.5ZM2.75 0A2.75 2.75 0 0 1 0 2.75A2.75 2.75 0 0 1 -2.75 0A2.75 2.75 0 0 1 0 -2.75A2.75 2.75 0 0 1 2.75 0Z" fill="#611cf2"/><path fill-rule="evenodd" d="M1.3 0A1.3 1.3 0 0 1 0 1.3A1.3 1.3 0 0 1 -1.3 0A1.3 1.3 0 0 1 0 -1.3A1.3 1.3 0 0 1 1.3 0Z" fill="#000000"/></g></g></g><path fill-rule="evenodd" d="M8 0L8 4L10 4L10 3L11 3L11 4L12 4L12 2L11 2L11 0ZM12 0L12 1L13 1L13 2L15 2L15 3L13 3L13 4L14 4L14 5L11 5L11 6L10 6L10 7L9 7L9 5L8 5L8 7L9 7L9 8L10 8L10 7L11 7L11 6L12 6L12 8L11 8L11 9L9 9L9 10L8 10L8 9L7 9L7 8L4 8L4 9L2 9L2 8L0 8L0 10L1 10L1 13L0 13L0 14L1 14L1 13L3 13L3 14L2 14L2 16L0 16L0 17L2 17L2 16L3 16L3 17L4 17L4 15L5 15L5 14L6 14L6 15L7 15L7 16L5 16L5 17L8 17L8 18L9 18L9 19L8 19L8 21L9 21L9 19L10 19L10 17L12 17L12 18L11 18L11 20L10 20L10 21L11 21L11 20L12 20L12 21L13 21L13 20L14 20L14 21L18 21L18 22L17 22L17 23L16 23L16 24L15 24L15 23L14 23L14 25L17 25L17 24L18 24L18 25L19 25L19 22L20 22L20 25L21 25L21 23L22 23L22 25L23 25L23 24L24 24L24 25L25 25L25 23L24 23L24 22L25 22L25 20L24 20L24 21L23 21L23 19L22 19L22 18L23 18L23 17L24 17L24 19L25 19L25 16L24 16L24 15L25 15L25 13L24 13L24 11L25 11L25 8L21 8L21 9L20 9L20 8L19 8L19 10L17 10L17 5L16 5L16 2L17 2L17 1L16 1L16 2L15 2L15 1L14 1L14 0ZM9 2L9 3L10 3L10 2ZM15 5L15 7L14 7L14 6L13 6L13 7L14 7L14 8L12 8L12 9L11 9L11 10L9 10L9 11L8 11L8 10L7 10L7 9L5 9L5 11L4 11L4 10L2 10L2 9L1 9L1 10L2 10L2 12L3 12L3 11L4 11L4 13L6 13L6 14L7 14L7 15L8 15L8 14L11 14L11 15L9 15L9 17L10 17L10 16L12 16L12 15L13 15L13 18L12 18L12 20L13 20L13 18L14 18L14 19L15 19L15 20L16 20L16 17L15 17L15 15L16 15L16 13L17 13L17 15L19 15L19 16L21 16L21 15L23 15L23 12L22 12L22 14L21 14L21 15L20 15L20 14L19 14L19 13L18 13L18 12L17 12L17 10L15 10L15 9L16 9L16 5ZM12 9L12 10L11 10L11 11L10 11L10 13L11 13L11 12L12 12L12 13L13 13L13 12L12 12L12 11L13 11L13 9ZM22 9L22 10L19 10L19 12L20 12L20 11L24 11L24 10L23 10L23 9ZM6 10L6 11L5 11L5 12L6 12L6 13L7 13L7 14L8 14L8 13L7 13L7 12L8 12L8 11L7 11L7 10ZM6 11L6 12L7 12L7 11ZM14 11L14 12L15 12L15 11ZM3 14L3 15L4 15L4 14ZM13 14L13 15L15 15L15 14ZM22 16L22 17L21 17L21 18L22 18L22 17L23 17L23 16ZM14 17L14 18L15 18L15 17ZM17 17L17 20L20 20L20 17ZM18 18L18 19L19 19L19 18ZM20 21L20 22L21 22L21 21ZM9 22L9 23L8 23L8 25L11 25L11 24L12 24L12 25L13 25L13 22L12 22L12 23L11 23L11 24L10 24L10 22ZM22 22L22 23L23 23L23 22Z" fill="#000000"/></g></g></svg>

EDIT: Upon further debugging, it seems this is due to the elliptical arcs used to render the circles. They somehow get rendered wrong. Since the arcs here were just supposed to be round anyway, replacing them with simple curves makes it render correctly.

[bsweeney]

I guess they are at least consistently rendered poorly? I'll take a look and see if I can identify where things are going wrong in the interpretation of the instruction.