Shopify · andromia3 · Apr 14, 2026
@@ -7,8 +7,8 @@ export async function loader({params, context}: LoaderFunctionArgs) {
     params.locale &&
     params.locale.toLowerCase() !== `${language}-${country}`.toLowerCase()
   ) {
-    // If the locale URL param is defined, yet we still are still at the default locale
-    // then the the locale param must be invalid, send to the 404 page
+    // If the locale URL param is defined, yet we are still at the default locale
+    // then the locale param must be invalid, send to the 404 page
     throw new Response(null, {status: 404});
   }
 

@@ -135,7 +135,7 @@ describe('getAllEnvironmentVariables()', () => {
     });
   });
 
-  it('doest not fail on network errors', async () => {
+  it('does not fail on network errors', async () => {
     await inTemporaryDirectory(async (tmpDir) => {
       vi.mocked(getStorefrontEnvVariables).mockRejectedValue(
         new Error('Network error'),

@@ -56,14 +56,14 @@ describe('Client types', async () => {
       }>();
     });
 
-    it('fallsback to any for unknown queries', () => {
+    it('falls back to any for unknown queries', () => {
       expectTypeOf(clientQuery(Queries.Unknown)).resolves.not.toEqualTypeOf<{
         test: number;
       }>();
       expectTypeOf(clientQuery(Queries.Unknown)).resolves.toEqualTypeOf<any>();
     });
 
-    it('can be overriden', async () => {
+    it('can be overridden', async () => {
       // Non-recognized query, override return type
       expectTypeOf(
         clientQuery<{test: string}>(Queries.Unknown),

@@ -63,7 +63,7 @@ describe('<AddToCartButton/>', () => {
     expect(screen.getByRole('button')).toHaveClass('bg-blue-600');
   });
 
-  describe('when variantId is set explicity', () => {
+  describe('when variantId is set explicitly', () => {
     it('renders a disabled button if the variantId is null', () => {
       render(
         <MockWrapper>
@@ -176,7 +176,7 @@ describe('<AddToCartButton/>', () => {
       });
     });
 
-    describe('and the initialVariantId is explicity set to null', () => {
+    describe('and the initialVariantId is explicitly set to null', () => {
       it('disables the button', () => {
         const product = getProduct();
 

@@ -344,15 +344,15 @@
             "filePath": "src/analytics-manager/AnalyticsProvider.tsx",
             "syntaxKind": "TypeAliasDeclaration",
             "name": "AnalyticsProviderProps",
-            "value": "{\n  /** React children to render. */\n  children?: ReactNode;\n  /** The cart or cart promise to track for cart analytics. When there is a difference between the state of the cart, `AnalyticsProvider` will trigger a `cart_updated` event. It will also produce `product_added_to_cart` and `product_removed_from_cart` based on cart line quantity and cart line id changes. */\n  cart: Promise<CartReturn | null> | CartReturn | null;\n  /** An optional function to set wether the user can be tracked. Defaults to Customer Privacy API's `window.Shopify.customerPrivacy.analyticsProcessingAllowed()`. */\n  canTrack?: () => boolean;\n  /** An optional custom payload to pass to all events. e.g language/locale/currency. */\n  customData?: Record<string, unknown>;\n  /** The shop configuration required to publish analytics events to Shopify. Use [`getShopAnalytics`](/docs/api/hydrogen/utilities/getshopanalytics). */\n  shop: Promise<ShopAnalytics | null> | ShopAnalytics | null;\n  /** The customer privacy consent configuration and options. */\n  consent: Consent;\n  /** @deprecated Disable throwing errors when required props are missing. */\n  disableThrowOnError?: boolean;\n  /** The domain scope of the cookie set with `useShopifyCookies`. **/\n  cookieDomain?: string;\n}",
+            "value": "{\n  /** React children to render. */\n  children?: ReactNode;\n  /** The cart or cart promise to track for cart analytics. When there is a difference between the state of the cart, `AnalyticsProvider` will trigger a `cart_updated` event. It will also produce `product_added_to_cart` and `product_removed_from_cart` based on cart line quantity and cart line id changes. */\n  cart: Promise<CartReturn | null> | CartReturn | null;\n  /** An optional function to set whether the user can be tracked. Defaults to Customer Privacy API's `window.Shopify.customerPrivacy.analyticsProcessingAllowed()`. */\n  canTrack?: () => boolean;\n  /** An optional custom payload to pass to all events. e.g language/locale/currency. */\n  customData?: Record<string, unknown>;\n  /** The shop configuration required to publish analytics events to Shopify. Use [`getShopAnalytics`](/docs/api/hydrogen/utilities/getshopanalytics). */\n  shop: Promise<ShopAnalytics | null> | ShopAnalytics | null;\n  /** The customer privacy consent configuration and options. */\n  consent: Consent;\n  /** @deprecated Disable throwing errors when required props are missing. */\n  disableThrowOnError?: boolean;\n  /** The domain scope of the cookie set with `useShopifyCookies`. **/\n  cookieDomain?: string;\n}",
             "description": "",
             "members": [
               {
                 "filePath": "src/analytics-manager/AnalyticsProvider.tsx",
                 "syntaxKind": "PropertySignature",
                 "name": "canTrack",
                 "value": "() => boolean",
-                "description": "An optional function to set wether the user can be tracked. Defaults to Customer Privacy API's `window.Shopify.customerPrivacy.analyticsProcessingAllowed()`.",
+                "description": "An optional function to set whether the user can be tracked. Defaults to Customer Privacy API's `window.Shopify.customerPrivacy.analyticsProcessingAllowed()`.",
                 "isOptional": true
               },
               {
@@ -30567,7 +30567,7 @@
                     "description": "",
                     "tabs": [
                       {
-                        "code": "{\n  media: [\n    {\n      url: 'https://example.com/image.jpg',\n      type: 'image',\n      height: '400',\n      width: '400',\n      altText: 'A custom snowboard with an alpine color pallet.',\n    }\n  ]\n}",
+                        "code": "{\n  media: [\n    {\n      url: 'https://example.com/image.jpg',\n      type: 'image',\n      height: '400',\n      width: '400',\n      altText: 'A custom snowboard with an alpine color palette.',\n    }\n  ]\n}",
                         "title": "Example"
                       }
                     ]
@@ -30619,7 +30619,7 @@
                 "isOptional": true
               }
             ],
-            "value": "export interface SeoConfig {\n  /**\n   * The `title` HTML element defines the document's title that is shown in a browser's title bar or a page's tab. It\n   * only contains text; tags within the element are ignored.\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title\n   */\n  title?: Maybe<string>;\n  /**\n   * Generate the title from a template that includes a `%s` placeholder for the title.\n   *\n   * @example\n   * ```js\n   * {\n   *   title: 'My Page',\n   *   titleTemplate: 'My Site - %s',\n   * }\n   * ```\n   */\n  titleTemplate?: Maybe<string> | null;\n  /**\n   * The media associated with the given page (images, videos, etc). If you pass a string, it will be used as the\n   * `og:image` meta tag. If you pass an object or an array of objects, that will be used to generate `og:<type of\n   * media>` meta tags. The `url` property should be the URL of the media. The `height` and `width` properties are\n   * optional and should be the height and width of the media. The `altText` property is optional and should be a\n   * description of the media.\n   *\n   * @example\n   * ```js\n   * {\n   *   media: [\n   *     {\n   *       url: 'https://example.com/image.jpg',\n   *       type: 'image',\n   *       height: '400',\n   *       width: '400',\n   *       altText: 'A custom snowboard with an alpine color pallet.',\n   *     }\n   *   ]\n   * }\n   * ```\n   *\n   */\n  media?:\n    | Maybe<string>\n    | Partial<SeoMedia>\n    | (Partial<SeoMedia> | Maybe<string>)[];\n  /**\n   * The description of the page. This is used in the `name=\"description\"` meta tag as well as the `og:description` meta\n   * tag.\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta\n   */\n  description?: Maybe<string>;\n  /**\n   * The canonical URL of the page. This is used to tell search engines which URL is the canonical version of a page.\n   * This is useful when you have multiple URLs that point to the same page. The value here will be used in the\n   * `rel=\"canonical\"` link tag as well as the `og:url` meta tag.\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link\n   */\n  url?: Maybe<string>;\n  /**\n   * The handle is used to generate the `twitter:site` and `twitter:creator` meta tags. Include the `@` symbol in the\n   * handle.\n   *\n   * @example\n   * ```js\n   * {\n   *   handle: '@shopify'\n   * }\n   * ```\n   */\n  handle?: Maybe<string>;\n  /**\n   * The `jsonLd` property is used to generate the `application/ld+json` script tag. This is used to provide structured\n   * data to search engines. The value should be an object that conforms to the schema.org spec. The `type` property\n   * should be the type of schema you are using. The `type` property is required and should be one of the following:\n   *\n   * - `Product`\n   * - `ItemList`\n   * - `Organization`\n   * - `WebSite`\n   * - `WebPage`\n   * - `BlogPosting`\n   * - `Thing`\n   *\n   * The value is validated via [schema-dts](https://www.npmjs.com/package/schema-dts)\n   *\n   * @example\n   * ```js\n   * {\n   *   jsonLd: {\n   *     '@context': 'https://schema.org',\n   *     '@type': 'Product',\n   *     name: 'My Product',\n   *     image: 'https://hydrogen.shop/image.jpg',\n   *     description: 'A product that is great',\n   *     sku: '12345',\n   *     mpn: '12345',\n   *     brand: {\n   *       '@type': 'Thing',\n   *       name: 'My Brand',\n   *     },\n   *     aggregateRating: {\n   *       '@type': 'AggregateRating',\n   *       ratingValue: '4.5',\n   *       reviewCount: '100',\n   *     },\n   *     offers: {\n   *       '@type': 'Offer',\n   *       priceCurrency: 'USD',\n   *       price: '100',\n   *       priceValidUntil: '2020-11-05',\n   *       itemCondition: 'https://schema.org/NewCondition',\n   *       availability: 'https://schema.org/InStock',\n   *       seller: {\n   *         '@type': 'Organization',\n   *         name: 'My Brand',\n   *       },\n   *     },\n   *   }\n   * }\n   * ```\n   *\n   * @see https://schema.org/docs/schemas.html\n   * @see https://developers.google.com/search/docs/guides/intro-structured-data\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script\n   *\n   */\n  jsonLd?: WithContext<Thing> | WithContext<Thing>[];\n  /**\n   * The `alternates` property is used to specify the language and geographical targeting when you have multiple\n   * versions of the same page in different languages. The `url` property tells search engines about these variations\n   * and helps them to serve the correct version to their users.\n   *\n   * @example\n   * ```js\n   * {\n   *   alternates: [\n   *     {\n   *       language: 'en-US',\n   *       url: 'https://hydrogen.shop/en-us',\n   *       default: true,\n   *     },\n   *     {\n   *       language: 'fr-CA',\n   *       url: 'https://hydrogen.shop/fr-ca',\n   *     },\n   *   ]\n   * }\n   * ```\n   *\n   * @see https://support.google.com/webmasters/answer/189077?hl=en\n   */\n  alternates?: LanguageAlternate | LanguageAlternate[];\n  /**\n   * The `robots` property is used to specify the robots meta tag. This is used to tell search engines which pages\n   * should be indexed and which should not.\n   *\n   * @see https://developers.google.com/search/reference/robots_meta_tag\n   */\n  robots?: RobotsOptions;\n}"
+            "value": "export interface SeoConfig {\n  /**\n   * The `title` HTML element defines the document's title that is shown in a browser's title bar or a page's tab. It\n   * only contains text; tags within the element are ignored.\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title\n   */\n  title?: Maybe<string>;\n  /**\n   * Generate the title from a template that includes a `%s` placeholder for the title.\n   *\n   * @example\n   * ```js\n   * {\n   *   title: 'My Page',\n   *   titleTemplate: 'My Site - %s',\n   * }\n   * ```\n   */\n  titleTemplate?: Maybe<string> | null;\n  /**\n   * The media associated with the given page (images, videos, etc). If you pass a string, it will be used as the\n   * `og:image` meta tag. If you pass an object or an array of objects, that will be used to generate `og:<type of\n   * media>` meta tags. The `url` property should be the URL of the media. The `height` and `width` properties are\n   * optional and should be the height and width of the media. The `altText` property is optional and should be a\n   * description of the media.\n   *\n   * @example\n   * ```js\n   * {\n   *   media: [\n   *     {\n   *       url: 'https://example.com/image.jpg',\n   *       type: 'image',\n   *       height: '400',\n   *       width: '400',\n   *       altText: 'A custom snowboard with an alpine color palette.',\n   *     }\n   *   ]\n   * }\n   * ```\n   *\n   */\n  media?:\n    | Maybe<string>\n    | Partial<SeoMedia>\n    | (Partial<SeoMedia> | Maybe<string>)[];\n  /**\n   * The description of the page. This is used in the `name=\"description\"` meta tag as well as the `og:description` meta\n   * tag.\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta\n   */\n  description?: Maybe<string>;\n  /**\n   * The canonical URL of the page. This is used to tell search engines which URL is the canonical version of a page.\n   * This is useful when you have multiple URLs that point to the same page. The value here will be used in the\n   * `rel=\"canonical\"` link tag as well as the `og:url` meta tag.\n   *\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link\n   */\n  url?: Maybe<string>;\n  /**\n   * The handle is used to generate the `twitter:site` and `twitter:creator` meta tags. Include the `@` symbol in the\n   * handle.\n   *\n   * @example\n   * ```js\n   * {\n   *   handle: '@shopify'\n   * }\n   * ```\n   */\n  handle?: Maybe<string>;\n  /**\n   * The `jsonLd` property is used to generate the `application/ld+json` script tag. This is used to provide structured\n   * data to search engines. The value should be an object that conforms to the schema.org spec. The `type` property\n   * should be the type of schema you are using. The `type` property is required and should be one of the following:\n   *\n   * - `Product`\n   * - `ItemList`\n   * - `Organization`\n   * - `WebSite`\n   * - `WebPage`\n   * - `BlogPosting`\n   * - `Thing`\n   *\n   * The value is validated via [schema-dts](https://www.npmjs.com/package/schema-dts)\n   *\n   * @example\n   * ```js\n   * {\n   *   jsonLd: {\n   *     '@context': 'https://schema.org',\n   *     '@type': 'Product',\n   *     name: 'My Product',\n   *     image: 'https://hydrogen.shop/image.jpg',\n   *     description: 'A product that is great',\n   *     sku: '12345',\n   *     mpn: '12345',\n   *     brand: {\n   *       '@type': 'Thing',\n   *       name: 'My Brand',\n   *     },\n   *     aggregateRating: {\n   *       '@type': 'AggregateRating',\n   *       ratingValue: '4.5',\n   *       reviewCount: '100',\n   *     },\n   *     offers: {\n   *       '@type': 'Offer',\n   *       priceCurrency: 'USD',\n   *       price: '100',\n   *       priceValidUntil: '2020-11-05',\n   *       itemCondition: 'https://schema.org/NewCondition',\n   *       availability: 'https://schema.org/InStock',\n   *       seller: {\n   *         '@type': 'Organization',\n   *         name: 'My Brand',\n   *       },\n   *     },\n   *   }\n   * }\n   * ```\n   *\n   * @see https://schema.org/docs/schemas.html\n   * @see https://developers.google.com/search/docs/guides/intro-structured-data\n   * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script\n   *\n   */\n  jsonLd?: WithContext<Thing> | WithContext<Thing>[];\n  /**\n   * The `alternates` property is used to specify the language and geographical targeting when you have multiple\n   * versions of the same page in different languages. The `url` property tells search engines about these variations\n   * and helps them to serve the correct version to their users.\n   *\n   * @example\n   * ```js\n   * {\n   *   alternates: [\n   *     {\n   *       language: 'en-US',\n   *       url: 'https://hydrogen.shop/en-us',\n   *       default: true,\n   *     },\n   *     {\n   *       language: 'fr-CA',\n   *       url: 'https://hydrogen.shop/fr-ca',\n   *     },\n   *   ]\n   * }\n   * ```\n   *\n   * @see https://support.google.com/webmasters/answer/189077?hl=en\n   */\n  alternates?: LanguageAlternate | LanguageAlternate[];\n  /**\n   * The `robots` property is used to specify the robots meta tag. This is used to tell search engines which pages\n   * should be indexed and which should not.\n   *\n   * @see https://developers.google.com/search/reference/robots_meta_tag\n   */\n  robots?: RobotsOptions;\n}"
           },
           "LanguageAlternate": {
             "filePath": "src/seo/generate-seo-tags.ts",

@@ -72,7 +72,7 @@ export type AnalyticsProviderProps = {
   children?: ReactNode;
   /** The cart or cart promise to track for cart analytics. When there is a difference between the state of the cart, `AnalyticsProvider` will trigger a `cart_updated` event. It will also produce `product_added_to_cart` and `product_removed_from_cart` based on cart line quantity and cart line id changes. */
   cart: Promise<CartReturn | null> | CartReturn | null;
-  /** An optional function to set wether the user can be tracked. Defaults to Customer Privacy API's `window.Shopify.customerPrivacy.analyticsProcessingAllowed()`. */
+  /** An optional function to set whether the user can be tracked. Defaults to Customer Privacy API's `window.Shopify.customerPrivacy.analyticsProcessingAllowed()`. */
   canTrack?: () => boolean;
   /** An optional custom payload to pass to all events. e.g language/locale/currency. */
   customData?: Record<string, unknown>;

@@ -108,7 +108,7 @@ export interface SeoConfig {
    *       type: 'image',
    *       height: '400',
    *       width: '400',
-   *       altText: 'A custom snowboard with an alpine color pallet.',
+   *       altText: 'A custom snowboard with an alpine color palette.',
    *     }
    *   ]
    * }

@@ -80,7 +80,7 @@ describe('createStorefrontClient', () => {
       });
     });
 
-    it('fallsback to public token when private one is not provided', async () => {
+    it('falls back to public token when private one is not provided', async () => {
       const {storefront} = createStorefrontClient({
         storeDomain,
         storefrontId,