BUG Pro6.0.7 Woocommerce add to cart

Beta
#1

I have a shop archive page. In Woocommerce the site is set to go to the cart / basket after adding the product. In the archive there is an add to cart button that triggers the add to cart and then redirects to cart / basket.

There is an ajax icon that loads and uses the colours set up in the cart theme options.

The issue is that if you press back from the cart then the ajax icon is still loaded in the page and you need to do a page refresh to remove it.

I would recommend you hide this before doing the redirect so we don’t have this issue.

#2

We’re also having another weird issue with this. In one of my sites that actual add to cart (ajax icon / loader) that shows people they’ve added something to the cart often appears below the products on the archive page.

It’s a bit odd as it doesn’t always happen. I also thought I had fixed it with some CSS but seems I never did or the issue has crept back.

I’ve added a secure note with a brief explanation and link to each of the problem sites.

#3

I was not able to recreate, and I’m not sure how it would ever happen without it being a browser cache thing. You didn’t fix something in between sending this right? If all we need to do is hide before a redirect we will gladly do that thanks!

#4

Thanks for replying! Is that for both issues or just the one?

The first issue where the loader goes behind the products is definitely happening. The client keeps moaning about it and I can replicate it on my end. If you go to the shop page link, scroll down the page and add the “Bouncy Bean” product to the cart about 10 separate times at a certain point the loader goes behind the products. (Although I can replicate with any product.) I’ve tested in Chrome, Firefox and Edge on Windows 11. I’ve also tested on my M1 Macbook Pro in Safari, Chrome and Firefox.

The second issue, where the loader does not go away, is when I click the browsers back button. This seems to only happen on my Windows 11 machine in Google Chrome. Works fine on Firefox and Edge. On my Mac the issue is only present in Safari (works fine in Firefox and Chrome).

I have not tested on a phone or mobile device.

#5

Oh I gotcha, I read that as one issue. I’m sure it’s just not resetting correctly so both might be fixed together. I’ll test with those browsers as well. In the meantime that will fix the z-index issue.

.x-cart-notification {
  z-index: 100000 !important;
}
#6

Thanks for the feedback. I used to have this in

.x-cart-notification.bring-forward.appear.loading { z-index: 5000000 !important; }

But I see I commented it out so I’m thinking it may not have helped. Anyway I’ve added it back with the shortened version and it seems to be OK. Still seems strange that it only goes behind occasionally and not every time.

1 Like
#7

The WooCommerce cart AJAX loader will try to reset itself on redirect in the next release. Let me know if that fixes the issue you were having in that site. The z-index will also be raised. Have a great day!

1 Like