Datakick Critical Error on Mobile (big screen) - Checkout module (Chex)

[Herrosik]

We are using Chex module from @datakick in our online store, unfortunately we are encountering a very strange and serious problem, related to floating on mobile devices with larger screen. For example, this is seen in Samsung Galaxy Note 10+, which makes it virtually impossible to place an order on mobile. Important note: you won't see this on Chrome, only on mobile is it visible.

Interestingly, in a way it is random, because for many refreshes of the page it happens once or twice that such a problem does not occur, however, in the vast majority it is visible. For smaller screens, everything is fine.

Has anyone encountered this problem and possibly is able to suggest what it could be related to? I am attaching a screenshot showing the problem.

All the best!

[datakick]

There will be some screen resolution glitch. It's hard to investigate if it's reproducible on this device only, and I don't have it. 

Anyway, you can disable floating cart in the module settings, that should help mitigate the problem.

[Herrosik]

@datakick thank you for your feedback. Maybe I was not precise enough - the problem affects not only strictly Samsung Galaxy Note 10 Plus, but all devices with larger screens, on the market currently quite a lot of this type, since problem is critical.

Disabling floating on mobile fixes the problem, but floating is a great feature, that looks good on the desktop, hence I'd rather avoid it.

The strangest thing in all this is that this problem is caused randomly - once it is, once it is not, more often it occurs, unfortunately. Do you have any more ideas?

[datakick]

The module contains js library to determine screen resolution, and use it to determine if the floating cart is supported or not. On small displays it's automatically disabled. I guess there is some bug in the library itself, or in the browser on the devices, that reports wrong screen size sometimes. The size detection seems to be working correctly when testing on desktop browser in mobile mode. 

It will be hard to fix, as debugging in mobile is very limited, ... and I don't have such device that is affected by this problem.

I could implement a feature that would force-disable cart floating on specific device(s), based navigator.userAgent browser property

[Herrosik]

@datakick Is it possible to fix this on our side? If so, how would you suggest solving this problem? The problem probably lies in the js at the beginning of the code, although understanding it is hard.