← Back to the atlas
vuoriclothing.com

Vuori

sightmap atlas add vuori

Shopify storefront on Next.js — collections, product pages, search, and a 404 with an empty document title.

commerce
Vuori screenshot 1
FIG. 01collection
Vuori screenshot 2
FIG. 02product detail

Views

ViewRouteComponentsRequests
Collection/collections/:handle101
Home/70
NotFound/**10
ProductDetail/products/:handle101
SearchResults/search51

Vuori

A direct-to-consumer apparel storefront, mapped as a signed-out shopper: Shopify behind a Next.js front end with MUI components.

Coverage

View Route What it holds
Home / Hero carousel, featured products, tabbed category carousel
Collection /collections/:handle Headline, subcategory carousel, filter bar, product grid
ProductDetail /products/:handle Media grid, title and price, options, spec accordions
SearchResults /search The same filter bar and grid as a collection
NotFound /** Apology heading, empty title

PromoBanner, DesktopHeader, MobileDrawer, MainContent, Breadcrumbs, SkipNavigation, RouteAnnouncer, CookieConsent, NewsletterOverlay, GlobalFooter, FeedbackWidget, and BuildStamp are global. All five views report 0 orphaned coverage, with every selector sel-probed on 2026-08-06.

Hazards

The 404 has an empty document title. document.title is "". Any agent that identifies pages by title gets nothing, and code branching on a title containing "404" or "not found" never fires. The only text signal is the h1, "The page you're looking for cannot be found", which also avoids the number. An unknown collection handle lands here too rather than redirecting.

Some data-testid values are content, and one kind is unusable. Carousel slides are labelled with the product name and colourway (data-testid='Seaside Short 8" | Nautical') and category cards with the category label (data-testid="Athletic Shorts"). They change whenever merchandising does, and the product ones contain a double quote for the inch mark, so they cannot be written as a CSS attribute selector without escaping. Treat any testid that reads like a sentence as data.

The skip-navigation link is broken. Its href resolves to /products/meta-pant-oxblood.json#main-content rather than to #main-content on the current page, so following it navigates to an unrelated product's JSON endpoint. Present on every route, including the 404.

The page prints its own render time. #buildTime holds a timestamp that changed on every load observed, which makes it a per-request server-render time rather than a build stamp — a direct read on whether a response was cached or freshly generated.

The product card is the anchor. There is no inner link to descend into; the href is on [data-testid="productCard"] itself. Card text runs badge, name, and price together with no separator.

Collection handles resolve loosely. /collections/mens-shorts serves /collections/shorts and rewrites the path, so read [data-testid="plp-headline-container"] rather than trusting the URL.

The mobile drawer renders on desktop. It ships closed at full viewport size and contains its own copy of the whole navigation, so menu links match twice on every route.

Known gaps

Cart and checkout stop at the product options. Going further means adding items to a real cart on a live storefront.

Accounts, order status, and anything behind Sign In are out of scope per docs/POLICY.md.

MediaGrid uses #media-grid-desktop, a desktop-only id. The mobile gallery is a separate element, so this corpus describes the desktop viewport. Everything else mapped here is viewport-independent.

ProductDetail is pinned to one colourway, since the handle encodes colour and each colour is its own URL.

Screenshots

Signed-out views of public catalog pages.