search

vuestorefront / vue-storefront-1

The open-source frontend for any eCommerce. Built with a PWA and headless approach, using a modern JS stack. We have custom integrations with Magento, commercetools, Shopware and Shopify and total coverage is just a matter of time. The API approach also allows you to merge VSF with any third-party tool like CMS, payment gateways or analytics. Newest updates: https://blog.vuestorefront.io. Always Open Source, MIT license.
https://www.vuestorefront.io
MIT License
19 stars 13 forks source link

Totals not updated after logging in and merging cart #400

Open revlis-x opened 4 years ago

revlis-x commented 4 years ago

Current behavior

When a guest cart with items gets merged with previously added account cart items after login, cart totals are not updated.

Expected behavior

Cart Totals should be updated after merging the cart,

Steps to reproduce the issue

  1. Have an account with items in cart and be logged out.
  2. Put item in your guest cart.
  3. Log-In -> Items of both carts are merged but totals are not updated afterwards.

Version of Vue Storefront

Additional information

isTotalsSyncRequired Getter is false when updateTotalsAfterMerge is called in this scenario.

ghost commented 4 years ago

Facing the same issue. getting the isTotalsSyncRequired, which is causing the cart not to update the totals if magento value is updated and i call the 'cart/sync'

pschaub commented 4 years ago

We have seen this issue also in our project so I investigated some time to find the issue.

The bug has occured since the change https://github.com/DivanteLtd/vue-storefront/pull/4387. With this change the cart hash changes too early inside the flow of the function updateTotalsAfterMerge and so results into not finishing the total sync.

Debugging (how I found the reason)

  1. The function updateTotalsAfterMerge is checking for getters.isTotalsSyncRequired, which is true because the cart hash changed.
  2. It triggers the dispatch syncTotals
  3. Inside syncTotals the getters.isTotalsSyncRequired is still true
  4. It triggers the dispatch pullMethods
  5. Inside pullMethods the getters.isTotalsSyncRequired is still true
  6. It triggers the dispatch syncShippingMethods
  7. After the dispatch of syncShippingMethods finished, the getters.isTotalsSyncRequired is false instead of true.
  8. The function syncTotals will NOT continue because getters.isTotalsSyncRequired is false. But we would expect that it should continue, we want a sync.

Workaround

force the server sync inside updateTotalsAfterMerge:

if (getters.isTotalsSyncRequired && clientItems.length > 0) {
  await dispatch('syncTotals', { forceServerSync: true })
}

Another workaround could be to revert https://github.com/DivanteLtd/vue-storefront/pull/4387. But I would expect that this results into other bugs, that are currently unknown to me.

Final fix

I don't know how to finally fix this. Hopefully a core developer may help here.

revlis-x commented 4 years ago

@pschaub I came to the same workaround with forceServerSync: true when i debugged this. Thanks for your time to write this down. I just wanted to add, I also had to await the 'addItem' calls in mergeServerItem to make i work consistently...

pschaub commented 4 years ago

@revlis-x thank you for the hint. I've created an additional issue to be sure that the missing await will be investigated: https://github.com/DivanteLtd/vue-storefront/issues/5165