cancel
Showing results for 
Search instead for 
Did you mean: 

AcceptUI has issues loading initially on low bandwidth clients

It seems that the AcceptUI modal has problems doing initial loading  on low bandwidth clients.

 

The issue can be verified with browser cache disabled (Test Case is: new initial donation from client) and throttling via either:

chrome developer tools throttling (Slow 3G and sometimes Fast 3G as well)

or via third party software (NetLimiter download setting below 100-120 KB/s)

 

Given the following simple example below and the conditions mentioned above:

 

 

<!DOCTYPE html>
<head>
    <title>Accept UI test</title>
    <script type="text/javascript" src="https://js.authorize.net/v3/AcceptUI.js" charset="utf-8"></script>
    <script type="text/javascript">
        handler = function(){
            console.log(arguments);
        }
    </script>
</head>
<body>
<div>
    <button type="button"
            class="AcceptUI"
            data-billingAddressOptions='{"show":false}'
            data-apiLoginID="{hidden}"
            data-clientKey="{hidden}"
            data-acceptUIFormBtnTxt="Submit"
            data-acceptUIFormHeaderTxt="Card Information"
            data-responseHandler="handler">Add Card
    </button>
</div>
</body>

 

By clicking the button the result is always in a popup that has the loading message and no way to close it.

It's basically stuck in loading.

 

With browser cache enabled the second time the page is refreshed it loads without issues.

With bandwidth download above 120 KB/s there are no issues whatsoever.

 

I've received several reports of this happening from various users.

 

Essentially at some point there's a checkout page the user arrives at (which has the accept library) and if it's the first time they are there and they have a slow connection, they will end up with this issue.

 

Please let me know if I'm missing something or if there's something I can do to prevent this from happening.

 

zakel
Member
3 REPLIES 3

Did you end up finding a solution for this problem? We're having the exact same issue and having no luck coming up with a solution. 

justing95
Member

One possible workaround (kind of bad / sadly not quite works for me) to this is leveraging browser caching by making sure the AcceptUI library resources loaded at least once so that when you land on your checkout page it loads the AcceptUI resources from browser cache instead of network. The button may need to be present on those pages as well as far as I recall (hidden or something similar).

This means having the library placed on every possible page that may send you to your checkout page where the visible AcceptUI button is placed.

 

I tried so many tests to figure out the issue and the only thing I could determine is that resources loaded in a different way on slow networks as opposed to normal (they were in a different order or some missing in respect to normal load)

Hope this helps your scenario. (It does not really help mine)

We are seeing the same issue.  It seems to be some sort of timing issue with slow connections (or page loads from people who have never loaded other site assets).  Thus far we haven't found an acceptable workaround but I'm adding this +1 to see if it will spark any replies and to add to the list of folks seeing the issue.

rlindner
Member