search

vuestorefront / vue-storefront

Alokai is a Frontend as a Service solution that simplifies composable commerce. It connects all the technologies needed to build and deploy fast & scalable ecommerce frontends. It guides merchants to deliver exceptional customer experiences quickly and easily.
https://www.alokai.com
MIT License
10.61k stars 2.08k forks source link

Remove syncTasks from localStorage to not exceed the quota #2729

Closed nikhilbansal closed 5 years ago

nikhilbansal commented 5 years ago

Current behavior

Adding product to cart fails with the following error.

DOMException: Failed to execute 'setItem' on 'Storage': Setting the value of 'shop/syncTasks/1555264201406-98d5f556-671b-d61e-16c2-74f025933ffb' exceeded the quota.

The chrome storage shows 15.8MB used out of 7702MB storage.

Expected behavior

Should be able to add products to cart successfully.

Steps to reproduce the issue

This happens once the same idle browser window is accessed. The add to cart works in a new incognito browser window for the same product.

Screen Shot 2019-04-14 at 11 30 18 PM

Repository

This happens while queuing tasks to local storage in core/lib/sync/index.ts -> queue function

Can you handle fixing this bug by yourself?

Yes if I get some guidance.

Environment details

pkarw commented 5 years ago

syncTasks are stored within localStorage which is cleared out (LRU) after amount of data specified in the config. Please try to lower the https://github.com/DivanteLtd/vue-storefront/blob/159357fba37e1c9eecc1c4f128120d6964a64f24/config/default.json#L17

Another option is to set the storage to INNODB driver - https://github.com/DivanteLtd/vue-storefront/blob/159357fba37e1c9eecc1c4f128120d6964a64f24/config/default.json#L306

nikhilbansal commented 5 years ago

We never changed the default value of elasticCacheQuota and is still 4096 which means that LRU data is not getting cleared once it goes beyond the limit. Can you please point to the code which is responsible for clearing LRU data.

Don't know how to configure INNODB driver at chrome level. However when I changed the storage driver of syncTasks to INDEXED db and refreshed the same tab which was giving error, it added the product to the cart successfully! Thanks for the pointer. :)

pkarw commented 5 years ago

Acceptance criteria: