Incompatibility of QR code libraries with 2FA plugin

[Anonymous]

Hi Alex,

I hope you are doing well.

I am testing a two FA extnson (https://wordpress.org/plugins/two-factor-authentication/), and I found that the wallts plugin interferes with the q r code. In the user two FA settings page (frontend page), it does not show up correctly. Please refer to the attached screenshot.

When I deactivate the q r from wllets admin setting it showsu up correctly.

Please can you have a look?

Thank you in advance

Best regards

Attachments:

You must be logged in to view attached files.

[alexg]

Thank you very much for reporting this!

I will investigate. Looks like a name clash, in which case I will have to add some wallets_ prefixes. Will contact you again about this issue here.

with regards

[alexg]

Hello again,

I have installed the plugin and tried to reproduce the issue with no success yet. It’s true that both plugins use the jQuery.qrcode library. What’s more, the two plugins use two different jQuery.qrcode libraries with the same name. So an incompatibility is likely but I can’t see it yet.

2fa: v0.14.0 ​https://github.com/lrsjng/jquery-qrcode
wallets: 1.0 ​https://github.com/jeromeetienne/jquery-qrcode/

You mentioned that the issue is shown in the “user two FA settings page (frontend page)”. The user 2FA settings are a backend page (wp-admin/admin.php?page=two-factor-auth-user), while the wallets plugin loads its QR code library only in the frontend (used by the [wallets_deposit] shortcode and widget).

Can you please confirm if the issue is in the frontend or backend? The screenshot you show me looks like it’s from the backend if I am not mistaken. The QR code looks like it’s stretched horizontally in your screenshot but I do not see the same in my setup.

If you like I can also login to your site to look at it, but let me know first about whether the issue is in the frontend or backend.

EDIT: Also, if possible, could you check for any error messages in your JavaScript console, on the page where you see the problem?

Thank you!

[alexg]

OK I read some more about this plugin and I now realise that you can use the shortcode [twofactor_user_qrcode] in the frontend. Are you using the paid version of the plugin? If so, I would have to login to your site to see the problem, as I do not have the paid version of this plugin.

[Anonymous]

Sorry Alex about not being specific.

Yes, that’s right, it is a frontend issue, in backend there is no issue.

No, just the free version, using the shrtcde [twofactor_user_settings].

There is no errors in console.

Thanks Alex for looking into this

[alexg]

Ah OK, thank you for the clarification.

With the shortcode you mentioned, I was able to reproduce the problem. Therefore I will have a fix for this soon.

Will keep you updated about this.

with regards

[Anonymous]

Thanks Alex for this and for your help, greatly appreciated.

Looking forward for it.

Best regards

[alexg]

Hello,

Once you install the latest version 4.3.1 of the plugin, the incompatibility should now be fixed.

Just to make sure, try to not use the [wallets_deposit] shortcode in the same page where you use the [twofactor_user_qrcode] shortcode. If you do, then the QR codes might not appear with the correct size, but should otherwise be ok.

Again, thanks for spotting this issue!

with regards

[Anonymous]

Hello Alex,

I updated and it seems solved according to my tests.

Thank you very much!

Excellent

[Anonymous]

Hello Alex,

I hope you are doing well, splecially during this sanitary crisis we are facing.

After updating to Version 5.0.0 (big thank you for this release! excellent work), I noticed again the same reported conflict for the frontend QR code for the 2FA settings frontend page. The QR code does not show up properly.

Please Alex, could you have a look? and tell what should I do to fix it?

Thanks in advance

Best regards

[alexg]

Hello,

I’m very well, hope you are well too.

Thank you for spotting this regression. I have been able to reproduce the issue and find a fix.

The previous fix in version 4.3.1 was to only load the plugin’s qr code library if it was needed on the current page. This way, assuming you are not using the shortcodes [wallets_deposit] and [twofactor_user_settings] in the same page, the issue would not arise.

Some performance enhancements were added in 5.0.0, including lazy-loading the QR code library. The library is now registered always but only enqueued if needed. This causes the current issue, because the wallets plugin always registers (and therefore overrides) the library used by the 2FA plugin.

I have already accumulated some minor fixes on version 5.0.0 on several issues. I plan to release a patch to the plugin very soon, possibly today or tomorrow, where this issue is fixed. I will post again here when this is out. Until then, you can either revert to version 4.4.8 of wallets, or disable QR codes from the frontend settings.

I will notify you again here when this is out, and there will be an announcement on facebook and twitter as with all releases.

with regards

[alexg]

The fix is now out in version 5.0.1 of the plugin. Thank you.

[Anonymous]

Hello,

First of all, a big thank you for your help and for your excellent work.

I udated to 5.0.1 and it seems fixed.

Thank you

Best regards

[Author]

Posts