Organization DepotDevelopers v1.3.0API 2026-12
All pages

Changelog

Every release of storefront.js, storefront.mjs and components.js. The newest is 1.3.0, served from /storefront/v1/; each release also stays at /storefront/{version}/ for sites that pin it.

1.3.0

Storefront API 2026-12.

  • Preview carts pay in test mode. The hosted checkout takes a preview cart through payment with Stripe's test cards: 4242 4242 4242 4242 succeeds, and 4000 0027 6000 3184 shows 3-D Secure. No order is placed and no money moves. Afterwards the cart is finished, so your site starts a new one. See Preview tokens.
  • <od-cart>: a preview cart shows "Preview cart: checkout takes test cards only" (part preview-note).
  • The scripts and the docs moved to https://developers.organizationdepot.com. The paths stay the same: /storefront/v1/storefront.js, /storefront/1.3.0/components.js and so on. The old host, cdn.organizationdepot.com, is gone, so change it in your script tags, your Content-Security-Policy and any links. Releases there before 1.3.0 weren't moved: pin 1.3.0 or later. The docs are at https://developers.organizationdepot.com/storefront/, beside guides every product shares: Tokens, Embedding and theming, Security, Versioning and Troubleshooting.
  • Pin storefront.mjs with integrity: the Security page shows a <link rel="modulepreload" integrity> that checks the module before your import runs it. The vite-ts starter adds it to every page when scriptBase is a release.
  • INVALID messages on fields a buyer fills in (code, quantity, lines[n].quantity, email, name) are sentences for the buyer, such as "Enter a quantity of 1 or more." Other INVALIDs are for developers. The JavaScript reference lists which messages to show a buyer.
  • CART_LOCKED and CART_CONVERTED messages are sentences for the buyer and don't contain the cart id.
  • The web components and the starters show an INVALID message when it's on a field the buyer fills in.
  • The checkout takes the cart id out of the address bar for a link that isn't valid too.
  • The type declarations no longer refer to internal documents.
  • The HTTP reference lists the form keys a shop form carries, including span and structural, and which field types and rules shop forms use.
  • tags.list(): every tag on your products with how many carry each, { tags: [{ name, productCount }] }, in your shop's display order. One request instead of reading the whole catalog. See GET /tags.
  • Storefront API 2026-12 gains GET /tags.
  • New types: Tag, TagList and TagsClient.
  • The starters build their tag links from tags.list(), with counts, so a tag on a product past the first 100 is no longer missed.

1.2.0

Storefront API 2026-12.

  • Preview tokens (odpv_…), made on the Headless page alongside public tokens, for building your site. Their carts work while the shop is closed (a draft, paused, or outside its sale window), go through the hosted checkout to the real totals, and can never be paid. createStorefrontClient({ token }) takes either kind; see Preview tokens.
  • Cart.preview: true on a cart made with a preview token.
  • Shop.preview: true when the client uses a preview token. shop.sale still reports the real sale; enable Add to cart when shop.sale.availableForSale || shop.preview.
  • Shop.sale.reason: why the sale is closed, NOT_OPEN_YET, PAUSED or ENDED, present only while sale.availableForSale is false.
  • A product's and a variant's availableForSale are about stock only, and no longer turn false while the sale is closed. shop.sale.availableForSale says whether the sale is open.
  • SALE_CLOSED messages are sentences for the buyer, one per reason ("This shop isn't taking orders right now.").
  • <od-product>: while the sale is closed, Add to cart says why: "Ordering opens soon", "Ordering paused" or "Sale ended". With a preview token it stays enabled whatever the sale says. "Sold out" comes from stock only.
  • <od-cart>: a preview cart shows "Preview cart: it can't be paid" (part preview-note).
  • The starters enable Add to cart when shop.sale.availableForSale || shop.preview.

1.1.0

Storefront API 2026-12.

  • Shop.url: the address of the shop's hosted page, for example https://papaswoodworks.storefront.organizationdepot.com/papas-woodworks.
  • Shop.handle is the shop's slug, and Shop.checkoutDomain is the host the hosted checkout runs on. cart.checkoutUrl is {shop.url}/c/{cartId}.

1.0.0

The first release. Storefront API 2026-12.

storefront.js and storefront.mjs

  • createStorefrontClient({ token, apiUrl?, apiVersion?, cartStorage?, fetch? }).
  • The shop: shop.get().
  • Products: products.list({ first?, after?, tag? }) with cursor paging and tags as collections, and products.get(handle).
  • The cart: cart.get(), addLine(), addLines(), updateLine(), removeLine(), setAnswers(), setContact(), applyDiscountCode(), removeDiscountCode(), checkout() and clear(). The cart id is kept in localStorage; converted carts start over, and locked carts are released and retried.
  • The cart:change event.
  • Helpers: formatMoney(), variantFor(), customizationFields() and imageUrl().
  • StorefrontError, with stable codes.
  • TypeScript declarations in types/.

components.js

  • <od-store>, <od-product>, <od-product-list>, <od-cart-button> and <od-cart>.
  • Styled from the shop's branding, with CSS custom properties, ::part() and slots.
  • Accessible: real buttons and labels, a modal cart drawer that keeps and returns focus, and counts and errors announced to screen readers.