Shopping Cart Change Tracker

Build a shopping cart system that tracks and logs all changes to cart items using browser storage. The system should automatically monitor when items are added, updated, or removed from the cart and maintain a history of these changes.

Requirements

Cart Operations

Implement basic cart operations:

• Add items to the cart (storing them with a key pattern like "cart_item_{itemId}")
• Update existing items in the cart
• Remove items from the cart
• Clear all cart items

Change Tracking

Implement automatic change tracking for all cart items:

• Track all changes to cart item keys (any key starting with "cart_item_")
• Each change record must include: key, oldValue, newValue, and timestamp
• Store the change history in a "cart_changes" key as an array
• Change history must persist across page reloads

API

Implement the following functions:

/**
 * Adds or updates an item in the cart
 * @param {string} itemId - Unique identifier for the item
 * @param {Object} itemData - Item details including quantity
 */
function addToCart(itemId, itemData) {}

/**
 * Removes an item from the cart
 * @param {string} itemId - Unique identifier for the item
 */
function removeFromCart(itemId) {}

/**
 * Clears all items from the cart
 */
function clearCart() {}

/**
 * Gets the change history for cart items
 * @returns {Array} Array of change records
 */
function getChangeHistory() {}

Test Cases

• Adding an item to the cart records a change with null as old value and the item data as new value @test
• Updating an existing item records a change with the previous value and new value @test
• Removing an item records a change with the item data as old value and null as new value @test
• The change history persists after clearing and reinitializing @test

Implementation

@generates

Dependencies { .dependencies }

store { .dependency }

Provides cross-browser local storage with change tracking capabilities.