Cart item ids might be causing more problems than expected?

[rkeeves]

TLDR

PR #115 introduced a new private route **/inventory-long.html. Now 'bug looking' behaviors can be triggered more easily.

The PR didn't introduce these bugs. It just made them more 'visible'.

I know there are other PRs in plans, which are going to do refactors. I just wanted to bring some symptoms up.

I don't know the specification of this software, and given the software's purpose (browser-based testing demo), maybe some or all of these behaviors are actual features?! (I mean this app's primary purpose is to be tested to evaluate some testing tool/service etc.)

Symptom A - Counter goes to 69

1. Login as standard_user
2. Goto https://www.saucedemo.com/inventory-item.html?id=foo
3. Click Add, click remove 69 times
4. See counter at 69
5. Goto Cart
6. See error

Symptom B - InventoryItem page allows adding/removing unknown item

1. Login as standard_user
2. Goto https://www.saucedemo.com/inventory-item.html?id=69
3. Click Add
4. Click Remove
5. Click Add
6. Goto Cart
7. See error

Symptom C - InventoryItem does not display known item

1. Login as standard_user
2. Navigate to https://www.saucedemo.com/inventory-long.html
3. Visit last item via link
4. See InventoryItem page not displaying the item details and instead show 'Item Not Found'

Symptom D - Cart throws error

1. Login as standard_user
2. Navigate to https://www.saucedemo.com/inventory-long.html
3. Add last item
4. Goto Cart
5. See error

Symptom E - CheckOutStepTwo throws error

1. Login as standard_user
2. Navigate to https://www.saucedemo.com/inventory-long.html
3. Add last item
4. Navigate to https://www.saucedemo.com/checkout-step-two.html
5. See error

Symptom F - React components' and localstorage's state diverges (missing updates?!)

1. Login as standard_user
2. Navigate to https://www.saucedemo.com/inventory.html
3. Add last item
4. Reset app state
5. Still see 'Remove' buttons
6. See counter 0

Background

There's no single root cause.

Different things together cause these problems:

• nulls and invalid ids can be written into local storage
• shopping-cart.js uses observer pattern which causes components to not be in sync
• some React components and pages index into a specific array (constant) unsafely
• queryParam and parseInt can result in weird values (which will reach shopping-cart.js and then localstorage)
• all Pages except for InventoryItem have no way of graceful error handling (related to cart item id array)
• there are two different sets of items (yep, I know the refactoring is currently under way, but now it is easy to trigger strange behavior)
• ui and state is not decoupled, so it is a bit hard to judge what is a real bug and what is a 'built in' bug

[diemol]

Thank you for taking the time to raise this issue.

This application is meant to be a sample and display happy paths and bugs to allow users to catch bugs through their testing. There are several places where bugs exist; this is intended, as this is simply a demo application.

[rkeeves]

Yep, I'll go away:

Here's the spec.

Here's where NaN is assigned.

parseInt('') is NaN

NaN >= 0 && 6 > NaN is false

JSON.parse(JSON.stringify([NaN])) is [null]

[null].indexOf(NaN) is -1