Mini Checkout + Promo Code Engine
The public UI is easy. The hidden tests are the ecommerce edge cases a vague spec ships wrong without ever noticing. Your spec decides whether the money comes out right.
Build a single checkout page for a small online store. The page renders a cart of line items, each showing a product name, a unit price, and a quantity the shopper can edit. Alongside the cart, an order summary panel breaks the charge down into subtotal, shipping, tax, any applied discount, and a final total. A promo code field lets the shopper enter a code and apply it, after which the summary reflects the result. A confirm-order button completes the purchase and moves the page into a clear order-confirmation state.
The interface must keep the summary consistent with the cart at all times: when quantities change or a code is applied, the subtotal, shipping, tax, discount, and total recompute and display correctly. Promo codes are checked against a known set of offers, and an accepted code reduces what the shopper pays. The confirm action completes the purchase and lands the shopper on a confirmation that reflects the order they actually placed.
Treat the example below as illustrative of the happy path only. Your spec should describe the full checkout behavior precisely enough that an agent can build a correct, usable store, including the pricing rules, how the summary stays in sync as inputs change, and how the page behaves when shoppers do the unexpected.
A cart with one item priced at 12.00 at quantity 2 has a subtotal of 24.00. With shipping of 5.00, tax of 2.40, and no discount, the displayed total is 31.40.
- Display cart items with name, price, and quantity.
- Allow quantity changes.
- Show subtotal, shipping, tax, discount, and total.
- Accept promo codes.
- Provide a checkout/confirm order button and success state.
The functional tests are shown, and the model usually clears them on its own. The hidden tests are the twists this kind of system is full of. They are not listed. Your spec only passes them if it already knows where this domain breaks.
112 chars
Your build previews here
Write a spec, then run the tests to build and preview the app.