# Demo Store Preview Flow > How the Woo demo store builder seeds products, media, templates, pages, styles, and preview URLs for the component test flow. # Demo Store Preview Flow The demo store preview flow is the repo-backed reference for how all Woo component families fit together. It is created by `WooDemoStoreBuilder`, which seeds products and registers Etch templates/pages built from Woo testing patterns. ## Builder Sequence ```text WooDemoStoreBuilder::seed() reset Woo component family styles seed products and media register product archive template register single product template register cart page register checkout page register product loop preset register collected pattern styles configure Woo cart and checkout page IDs return product IDs, template IDs, page IDs, and preview URLs ``` The builder is intentionally a full flow instead of isolated fixture HTML. It registers real WordPress content and lets Woo render through the same runtime paths used by the component tests. ## Seeded Content `WooDemoStoreProductSeeder` creates the products used by the archive, single product, cart, and checkout scenarios. `WooDemoStoreMediaSeeder` provides product media. The result object exposes product IDs by key so scenarios can target the same seeded products consistently. The product loop preset uses the demo product marker meta, so the archive template only lists the seeded demo products. ## Registered Templates And Pages | Registered content | Source pattern | | --- | --- | | Product archive template | `TestWooProductList` | | Single product template | `TestSingleWooProductTemplate` | | Cart page | `TestCartDemo` | | Checkout page | `TestCheckoutDemo` | The cart and checkout page IDs are also written into Woo options, which lets Woo native URLs and Store API redirects resolve to the demo pages. ## Style Reset And Pattern Styles Before seeding, the builder resets mutable Woo component family style defaults. After building patterns, it registers all collected styles through the repo style builder. This keeps the demo pages aligned with current component defaults and current pattern CSS. ## Preview URLs The builder returns preview URLs for: - `archive`, - `single`, - `cart`, - `checkout`. The single product URL targets the seeded `ome-demo-shoe` product. The cart and checkout URLs are the registered demo pages. Tests can use those URLs for end-to-end preview flows, while component-level scenarios can still use `WooScenarioProvider` for smaller behavior cases. ## Why This Matters For Docs The demo store proves the relationship between component families: - product archive and single templates add items into shared cart state, - cart page rows, coupons, shipping, and totals read and mutate the same Store API cart, - checkout page consumes the same cart while submitting a Store API order, - order summary reuses cart atoms in a read-only checkout context, - native Woo hooks remain part of add-to-cart and checkout lifecycles. Use this flow as the reference when deciding whether a component belongs to the product purchase, cart, totals, coupon, shipping, checkout, payment, terms, or order summary family.