Skip to content

Validator rules

The SSK rule catalog behind the Storesynk validator: what each code detects, why it breaks, and the fix.

@storesynk/elements is a tag-based, light-DOM web-component library. Components do not fetch their own world; they read it from @lit/context providers that must sit somewhere above them in the DOM tree:

  • <storesynk-store> provides storeContext - credentials, the storefront client, the cart, the rich cart, and the money format. It is the root; everything lives inside it.
  • <storesynk-product> provides productContext - the product plus its runtime selection state (chosen options, current variant, quantity, selected media).
  • <cart-line> provides cartLineContext - a single cart line.
  • <storesynk-collection> provides collectionContext - the products, facets, and filter/sort/paging state for the optional server-driven listing module. (Also <cart-discount>discountContext for one discount chip.)
  • <mix-match-offer> provides mixMatchContext - one build-your-own-box bundle and the customer’s selection/quote. Inside it, three per-clone contexts are attached by the cloning containers rather than by a tag you author: a section context on each <mix-match-section-list> clone, an item context on each <mix-match-item-list> pool card, and a pick context on each <mix-match-selection-list> thumbnail. That is why the mix & match leaves have such specific ancestor requirements (SSK-105).
  • <storesynk-addons> provides addonsContext - the one live product-addons offer for the current PDP and the customer’s checkbox selection/quote. Inside it, <addon-list> attaches a per-clone row context to each row card (the toggle state + the advisory ”+ price” for the card’s selected variant), which is why <select-addon> and the show-addon-* price leaves must live inside the row-card template (SSK-105).

The governing principle of this whole system, and the reason most rules exist: a consumer whose required provider ancestor is missing renders nothing - silently, with no console error and no thrown exception. A <show-price> with no <storesynk-product> above it does not warn; it simply stays blank. An entire product card placed outside <storesynk-store> never fetches and never paints. Because the failure is invisible at runtime, these rules catch it statically, from the markup alone.


Imported from the Storesynk skill v0.1.0 (references/structure-rules.md). To change this page, change it there.