Why do headless Shopify storefronts fail AI agent catalog inspection?

// Next.js App Router (app/products/[handle]/page.tsx)
// ALWAYS render Schema.org JSON-LD statically in the server component!
export default async function ProductPage({ params }: { params: { handle: string } }) {
  const product = await getProduct(params.handle);

  const jsonLd = {
    "@context": "https://schema.org",
    "@type": "Product",
    "name": product.title,
    "offers": product.variants.map((v) => ({
      "@type": "Offer",
      "sku": v.sku,
      "price": v.price.amount,
      "priceCurrency": v.price.currencyCode,
      "availability": v.availableForSale ? "https://schema.org/InStock" : "https://schema.org/OutOfStock",
    })),
  };

  return (
    <>
      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }} />
      <ProductDetails product={product} />
    </>
  );
}