Expired Guest Cart Errors

[supernova-at]

Description

There were a handful of errors relating to stale data, specifically the cartId. This PR:

• Captures errors during addItemToCart, updateItemInCart, and removeItemFromCart so that the backstop reducer doesn't display an error toast
• Fixes bugs that lead to infinite retry loops (not clearing out data properly)
• Updates retry logic in updateItemInCart and removeItemFromCart to not actually retry these operations because when we determine that the guest cart has expired we get a new cart. Retrying these operations on a new cart doesn't make sense, as the cart will be empty. updateItemInCart instead attempts to addItemToCart to the new cart.

Related Issue

Closes #1143 .

Verification Steps

For each test case below, ensure that:

1. The red error toast does not appear
2. The action ultimately resolves (the app does not hang / infinite loop)

We will be testing a bad cartId in Local Storage and then in Redux.
For each, we will be testing adding, updating, and removing items from the cart.
We will also test the flows for both guest users and authenticated users.

Guest Users (Not Signed In)

Perform the following tests as a guest user. You may have to sign out first.

Test Case: Bad cartId in Local Storage

Page Load

1. Change the value of the cartId cookie to something bogus
2. Fully refresh the page
3. See that you get a new cartId and empty cart

Add Item

1. Change the value of the cartId cookie to something bogus
2. Attempt to add an item to your cart
3. See that the operation is successful

Update Item

1. Change the value of the cartId cookie to something bogus
2. Attempt to update an item in your cart
3. See that the operation is successful

Remove Item

1. Change the value of the cartId cookie to something bogus
2. Attempt to remove an item from your cart
3. See that the operation is successful

Test Case: Bad cartId in Redux

Prerequisite

1. Install the Redux DevTools Extension

Add Item

1. Launch Venia and wait for a successful initialization (look for a successful CART/GET_DETAILS/RECEIVE message in the console)
2. Open Redux DevTools
3. In the text area at the very bottom, enter the following:

{
type: 'CART/GET_CART/RECEIVE',
payload: 'Bogus!'
}

and click the small dispatch button in the lower right to dispatch an action that will set cart.cartId to "Bogus!"

1. Attempt to add an item to your cart
2. See that the item is eventually added, and that it is the only item in the cart (the old cart no longer exists).

Update Item

1. Open the cart item edit dialog from the mini cart
2. Open Redux DevTools
3. In the text area at the very bottom, enter the following:

{
type: 'CART/GET_CART/RECEIVE',
payload: 'Bogus!'
}

and click the small dispatch button in the lower right to dispatch an action that will set cart.cartId to "Bogus!"

1. Select some product options and click the Update Cart button
2. See that the item is eventually added to the cart, and that it is the only item in the cart (the old cart no longer exists).

Remove Item

1. Open the mini cart
2. Open Redux DevTools
3. In the text area at the very bottom, enter the following:

{
type: 'CART/GET_CART/RECEIVE',
payload: 'Bogus!'
}

and click the small dispatch button in the lower right to dispatch an action that will set cart.cartId to "Bogus!"

1. Select Remove Item for any item in the cart
2. See that you get a new, empty cart (the old cart no longer exists).

Authenticated Users (Signed In)

Perform the following tests as an authenticated user. You may have to sign in first.
You may also want to add an item to your cart so that you can be sure you're getting "your" cart back.

Test Case: Bad cartId in Local Storage

⚠️ Warning ⚠️
The cartId for authenticated users is a Number (ex: "2209"). For these steps either change it to another number or be sure to include escaped quotes if you change it to a string. Ex: {"value":"\"bogus\"" ...}. If you change it to the literal string "bogus" you will get JSON parse errors in the console and will invalidate the tests.

Page Load

1. Change the value of the cartId cookie to something bogus
2. Fully refresh the page
3. See that you (eventually) get your cart and that the cartId in local storage is updated back to the correct ID (yours).

Add Item

1. Change the value of the cartId cookie to something bogus
2. Attempt to add an item to your cart
3. See that the operation is successful

Update Item

1. Change the value of the cartId cookie to something bogus
2. Attempt to update an item in your cart
3. See that the operation is successful

Remove Item

1. Change the value of the cartId cookie to something bogus
2. Attempt to remove an item from your cart
3. See that the operation is successful

Test Case: Bad cartId in Redux

Add Item

1. Launch Venia and wait for a successful initialization (look for a successful CART/GET_DETAILS/RECEIVE message in the console)
2. Open Redux DevTools
3. In the text area at the very bottom, enter the following:

{
type: 'CART/GET_CART/RECEIVE',
payload: 'Bogus!'
}

and click the small dispatch button in the lower right to dispatch an action that will set cart.cartId to "Bogus!"

1. Attempt to add an item to your cart
2. See that the item is eventually added
3. See that the items previously in the cart are still there too

Update Item

1. Open the cart item edit dialog from the mini cart
2. Open Redux DevTools
3. In the text area at the very bottom, enter the following:

{
type: 'CART/GET_CART/RECEIVE',
payload: 'Bogus!'
}

and click the small dispatch button in the lower right to dispatch an action that will set cart.cartId to "Bogus!"

1. Select some product options and click the Update Cart button
2. See that the item is eventually updated
3. See that the items previously in the cart are still there too

Remove Item

1. Open the mini cart
2. Open Redux DevTools
3. In the text area at the very bottom, enter the following:

{
type: 'CART/GET_CART/RECEIVE',
payload: 'Bogus!'
}

and click the small dispatch button in the lower right to dispatch an action that will set cart.cartId to "Bogus!"

1. Select Remove Item for any item in the cart
2. See that the item is removed
3. See that the items previously in the cart are still there too

How Have YOU Tested this?

1. yarn test
2. Followed the reproduction steps above

Screenshots / Screen Captures (if appropriate):

This is what I'm referring to when I say "the red error toast":

Proposed Labels for Change Type/Package

• major (e.g x.0.0 - a breaking change)
• minor (e.g 0.x.0 - a backwards compatible addition)
• patch (e.g 0.0.x - a bug fix)

Checklist:

• I have updated the documentation accordingly, if necessary.
• I have added tests to cover my changes, if necessary.

[vercel]

This pull request is automatically deployed with Now.
To access deployments, click Details below or on the icon next to each push.

[coveralls]

Coverage decreased (-0.002%) to 77.128% when pulling 5c3e147 on supernova/1143-expired_guest_cart into 3cc4deb on develop.

[supernova-at]

We don't actually care about all the other calls to dispatch in this test ... the previous assertion is the only thing we're after here.

[supernova-at]

getState is now only called once and cart and user are destructured from there.

The tweak to the retry logic made it so that we don't need this third mock implementation.

[supernova-at]

This isn't anything special, I just rearranged the dispatches for consistency with other actions.

Previously we'd get an actions.getGuestCart.receive without a preceeding actions.getGuestCart.request in the case where we already had a guestCartId.

[supernova-at]

removeCart is new - it calls clearGuestCartId AND actions.reset to remove the guestCartId from redux.

[supernova-at]

removeItemFromCart is a little different in that the reducer handles clearing out the bad ID from redux, so we don't have to do it here.

[supernova-at]

No sense attempting to retry removing an item - we just got a brand new cart with nothing in it!

[supernova-at]

Nothing changed here, I just updated the comment to make this part clear because this function and removeItemFromCart differ from the others (they don't call removeCart).

[supernova-at]

We capture all these errors now to stop the backstop reducer from kicking in.

[supernova-at]

Other tests here pass but should probably be updated.

[supernova-at]

This may or may not be controversial so I'll point it out:

Here we've failed to update an item in the cart due to the cart having expired. We've just gotten a brand new (empty) cart, so there's no sense in retrying the update to this item because it won't exist. But we do know what the user wanted, so we add the updated item to the new cart.

Sucks that they lose anything else they had in the cart, but 🤷‍♂️

[jimbo]

Hmm, we'll have to think this one through.

[jimbo]

Makes sense to me. Let's discuss what we want to do about existing cart items (and pending cart modifications) when the cart expires.

[jimbo]

Hmm, we'll have to think this one through.

[jimbo]

Honestly, I don't think this change helps much—if anything, it makes it more obscure. If we want to make the message friendlier, let's do it right with a real design and some imagery. Until then, I'd rather leave it as is.

[supernova-at]

Makes sense. I do think the 500 Internal Server Error is misleading though, especially since that codepath can be executed without a 500 actually occurring.

Also misleading is that these are server-side error codes, when the problem (aside from the 404) can be in the client.

[jimbo]

Sure. They're not literally server error codes; they're intended to mimic what you'd see if this were a server-rendered app, so we know what case we're in. Ultimately, I don't mind changing the copy if it bothers you.

[jimbo]

Sure. They're not literally server error codes; they're intended to mimic what you'd see if this were a server-rendered app, so we know what case we're in. Ultimately, I don't mind changing the copy if it bothers you.

[supernova-at]

PR Updated:

• Merged changes from develop and resolved conflicts
• Updated verification steps

cc @dpatil-magento

[supernova-at]

PR Updated:

• We are actually able to retry some of the operations for authenticated users because we their cart doesn't get completely wiped out. If they have a cart, we retrieve it and then retry the operations (update & remove item)

[dpatil-magento]

QA Pass. @jimbo Can you please review the new changes and approve?

[jimbo]

Changes make sense. If this passes QA, thumbs up from me. 👍

[dpatil-magento]

pr-test and pr-build both pass bundlesize check, seems like webhook update is pending. Merging this.