Shopify Visual Change Workflow

Outcome

Create one Storefront purchase flow Finding with current homepage, PLP, PDP, cart and checkout screenshots, plus meaningful compatible drift. This is a visual record, not a comprehensive audit.

Resolve target and baseline

Use the configured storefront/preview URL and its public market/locale, never an ambient connected store. Find the latest same-target visual report. Compare only matching route purpose, market/locale, customer state, viewport, capture method, dynamic normalization and known theme/revision.

Choose the canonical homepage; a populated primary collection from navigation (search grid only when it is the main listing pattern); an available representative product with media/variants where supported; its real add-to-cart drawer/page; and checkout reached from that cart through payment options.

Guest cart and checkout setup

Guest setup is part of the journey and needs no account, credentials or integration. Missing incognito/context APIs, retained cookies or a nonzero cart alone do not block it.

1. Prefer a fresh anonymous context. Otherwise verify signed-out storefront guest state; a new tab alone proves no isolation. Never use an ambient customer/Shop account, log the user out, clear cookies or bypass guards.
2. Record starting cart lines/quantities. Add one available chosen PDP configuration through visible controls or reuse a matching guest line, recording which. Prefer a distinct configuration to identify owned additions. Preserve unrelated lines and quantities.
3. Use the cart's normal checkout/guest path. Fill only empty required guest contact/shipping fields with fictional data. Never use/overwrite retained personal details, read customer/order records, create an account, enter payment, activate a wallet or order. If authenticated/personal state appears, try a supported fresh guest route; block only affected states without a safe path.
4. Remove only additions with verified ownership/current state. Empty only a wholly run-created cart. Never overwrite concurrent quantity changes, delete checkout records or log out as cleanup.
5. Before blocking cart/checkout, attempt the supported visible guest path and record the failed step, restriction or requirement. Account-only checkout, unsafe retained data, access denial or unavailable cart actions can block; preserve independent captures.

Capture contract

Use the browser's full-page capture for each surface, matching a compatible baseline's viewport/method or recording one representative viewport for future runs. Full-page means document extent, not a taller viewport. Extra responsive/section images are supplementary.

• Use verified signed-out guest state; record starting cart/cookies and never claim unverified isolation.
• Match market, locale, consent, product, variant, quantity and route parameters across comparisons.
• Let fonts, images, layout and loaders settle without hiding defects. Dismiss ordinary overlays only through visible controls, recording the action. Do not alter DOM/CSS.
• Record unstable personalized, rotating, inventory/time-sensitive or animated regions. Use masks/crops only when explicitly reproducible and supported; record each one.
• Scroll as needed for ordinary lazy content, retain bounded pagination/loaded state, return to capture start and settle. Capture top through final content/footer. Record document/image dimensions and scale to verify full extent.
• Retry supported full-page/tiled methods after truncation/failure. Retain viewport/section evidence as partial with the exact tool limit; never promote it to full-page or discard successes.
• Record route, state, viewport, timestamp, browser, theme/revision, artifact and normalization. Inspect actual images for blank, broken, secret-bearing or wrong-route output before reporting.

Journey procedure

Homepage

Capture the initial full page: header, announcement, hero, merchandising, editorial/trust content and footer. Interact only as needed for stable initial layout.

PLP

Capture the default populated listing through rendered grid, pagination/load-more and footer, including navigation, collection identity, merchandising, filters and sort. Match any baseline filter state; keep the full-page primary rather than replacing it with a crop.

PDP

Capture the same product/variant from header through final content/footer, retaining identity, media, price, availability, options, purchase controls, decision content and recommendations. Purchase-panel crops are supplementary. Record price/inventory changes that prevent comparison.

Cart

Verify the selected product, variant, quantity and price. Capture the full populated cart page or, for drawer-only carts, the complete drawer including its own scroll area. A full document behind a clipped drawer is insufficient. Use supported full-content capture or retain labeled partial evidence and the missing extent. Include lines, totals, add-ons, messages and checkout action; preserve starting items and clean up only verified owned additions.

Checkout

Use the captured cart's guest path and fictional details to render payment options. Capture the full stable document through payment options and final content without retained personal data. Stop before payment entry, wallet activation, submission or ordering. A scrolled contact-field viewport is not full checkout. Try a fresh guest path if personal details make capture unsafe. If payment options remain unreachable, retain the current safe image as partial and record the exact blocker; do not mark completion or discard it.

Compare

Persist route/variant/quantity, viewport, customer/consent state, revision/theme, timestamp, normalization/loading decisions and the actual artifact before comparison. Inspect the image to verify identity; one surface cannot stand in for another.

Pair the same region/state in compatible captures. Distinguish reproduced errors from changed product, offer, viewport, session or loading state; safely reopen transient-looking differences. A prior error needs an exact current retest before claiming it gone. Missing/incomparable images prove no fix; retain successful current captures.

Inspect layout, hierarchy, spacing, typography, color, imagery, responsiveness, overlays, clipping/stacking, missing/duplicate elements, sticky controls and surface content. Classify within the single Finding:

• Reproducible difference: state surface, viewport and before/after evidence.
• Actionable error: retain its image and create one Issue with action/retest.
• Intended, neutral, improved, resolved or unchanged: retain current imagery without recommendations.
• Incomparable: establish the current baseline and explain incompatibility in Check details/supporting evidence.
• Capture noise: normalize/exclude declared loading, animation, rotation, time, inventory/price, personalization or masked regions.

A pixel difference alone is insufficient. Issues need stable meaningful errors such as clipping, overlap, missing critical content, broken responsiveness, illegibility, obstructed purchase controls or materially unintended hierarchy. Expected updates and cosmetic preferences do not qualify.

Reporting contract

Follow Glue JSON output: save and validate complete JSON and references, then summarize in chat. Glue retains bare-object/host-storage behavior. Raw images/measurements are supporting artifacts; missing measurements remain absent from Data and explained, never zero.

• Findings: one Storefront purchase flow when at least one captured Completed/Fail Check can reference it. Keep current images in journey order; mark the record partial and name blocked/not-applicable surfaces. State route/state/viewport and compatible drift, without priority/impact/recommendation language. No separate image/route/viewport/difference Findings.
• Completed/failed captures reference the Finding; blocked Checks reference only Limitations. If all surfaces are Blocked/Not applicable, keep Findings empty, retain partial images externally and link them from blocked details/Limitations. Never fabricate Completed outcomes or orphan Findings to attach images.
• Issues: meaningful errors only, grouped by root cause/action/retest. Each failed surface references exactly one Issue. Attach only its proving image; retain the complete gallery on the Finding.
• Changes: empty; drift belongs in the Finding.
• Checks: one terminal outcome per active surface, including unchanged/first-baseline states.
• Limitations: precise shared blockers linked only to undecidable Checks. An incompatible prior baseline does not block a successful current capture.

Show the five-surface gallery in chat

Display actual saved full-page primary artifacts inline as Homepage, Collection, Product, Cart, Checkout. Resolve them through Finding/provenance rather than selecting same-route viewport images. Use real local paths/approved URLs; link useful supplementary captures. If inline display is unsupported, provide a labeled direct image link per surface. A report link or screenshot-link pair does not replace the gallery.

Keep a missing surface's position as “Not captured” with its exact blocker. Label viewport/section substitutes “Partial capture — full page unavailable” and explain the missing extent; label checkout short of payment options “Partial checkout — payment options not reached.” Never substitute another surface or claim full completion. Include report.json, actual coverage and the shared guide's Issue summary. In Glue, keep the bare object and ordered images on the referenceable Finding; all-blocked partial images stay linked in blocked detail/Limitations.

Completion

Finish when every active surface has one evidenced outcome, successful captures are retained in the single Finding, comparisons are compatible, failed Checks map to meaningful Issues, blocked Checks map to precise Limitations and Changes is empty. Continue independent surfaces.

A partial report is valid. Claim the full purchase flow only with all five full-page/full-cart-content images and checkout at payment options. Required captures with only partial images are Blocked unless an independently proved Issue establishes Fail. Retain partial images for compatible future surface comparisons; missing surfaces are not baselines.