Почему создается кривой qr код (qr code styling)?

Question

[Максим Иванов]

На страничке два qr кода. Почему-то второй создается кривым (см. скриншот). Если убрать первый, то второй создается идеально. С классами все нормально.
Кто работал, у кого была проблема и как решили?

Код

function genQRVcard() {
    let wrapqr = document.querySelector(".agent__qr-generate"),
        qr = document.querySelector(".agent__qr svg");
    if (!qr) {
        const qrCode = new QRCodeStyling({
            width: '180',
            height: '180',
            type: "svg",
            data: window.location.href,
            image: "/public/icons/penthouse/qr-penthouse-icon.svg",
            dotsOptions: { color: "#333333", type: "extra-rounded" },
            backgroundOptions: { color: "#ffffff", },
            imageOptions: { crossOrigin: "anonymous", margin: 5 }
        });
        qrCode.append(wrapqr);
    }
}
function modarQR() {
    let wrapper = document.querySelector(".modal__qr-generate"),
        qrSvg = document.querySelector(".modal__qr svg");
    if (!qrSvg) {
        const qrCodeModar = new QRCodeStyling({
            width: '230',
            height: '230',
            type: "svg",
            data: window.location.href,
            image: "/public/icons/penthouse/qr-penthouse-icon.svg",
            dotsOptions: { color: "#333333", type: "extra-rounded" },
            backgroundOptions: { color: "transparent", },
            imageOptions: { crossOrigin: "anonymous", margin: 5 }
        });
        qrCodeModar.append(wrapper);
    }
}

https://imgur.com/a/2UnicV3

Answer 1

[MoralGray]

Из-за разных размеров и type svg.
Можно избежать поставив type canvas.

Comments

[MoralGray]

https://codesandbox.io/s/tender-resonance-wh2mms?f...

[Максим Иванов]

Спасибо, завтра ещё у себя проверю, но вопрос на который вы вряд-ли знаете ответ:
ПОЧЕМУ ТАК?!
Это считается недоработкой со стороны разработчика, или все таки какие-то внутренние конфликты?

[MoralGray]

ПОЧЕМУ ТАК?!

Да, не знаю.

https://github.com/kozakdenys/qr-code-styling/issues/72
Видел ты уже отписывал туда, там есть более ранний вопрос по похожей теме. При генерации с типом свг, независимо от даты(урла), генерится тот же qr.

Это считается недоработкой со стороны разработчика, или все таки какие-то внутренние конфликты?

Все возможно. Лично предпочитаю думать, что ошибка в либе.
Например в версии 1.3.0 такой проблемы нету, с типом свг все работает нормально, вроде. Проблема себя проявляет в версии 1.5.0.

Кст, тут для тебя второе решение, только заметил, можешь просто откатиться на версию 1.3.0, если будет работать.

[Максим Иванов]

MoralGray, Спасибо огромное :) В итоге откатился на 1.3.0
Первый раз встречаю чтобы был такой существенный баг о котором знают и даже задавали вопрос на гитхабе. Хотя у меня ещё не так много опыта работы и думаю ещё столкнусь с таким :D

[MoralGray]

думаю ещё столкнусь с таким

Более чем.