@shopify/ui-extensions 2025.10.0-rc.45 → 2025.10.0-rc.47

package/src/surfaces/checkout/preact/api.ts

@@ -26,7 +26,7 @@ export function useApi<
 
   if (!api) {
     throw new CheckoutUIExtensionError(
-      'You can only call this hook when running as a checkout UI extension on at least API version 2025-07.',
+      'You can only call this hook when running as a checkout UI extension on at least API version 2025-10.',
     );
   }
   return api;

package/src/surfaces/checkout/preact/tests/api.test.tsx

@@ -1,30 +1,39 @@
-/* eslint-disable jest/no-disabled-tests */
 import {useApi} from '../api';
 
-import {mount} from './mount';
+import {
+  mount,
+  setupGlobalShopifyMock,
+  tearDownGlobalShopifyMock,
+} from './mount';
+
+describe('useApi', () => {
+  beforeEach(() => {
+    setupGlobalShopifyMock({});
+  });
+
+  afterEach(tearDownGlobalShopifyMock);
 
-describe.skip('useApi', () => {
   it('returns api', async () => {
-    const extensionApi = {
-      extension: {target: 'purchase.checkout.block.render' as const},
-    };
-    const {value} = mount.hook(
-      () => useApi<'purchase.checkout.block.render'>(),
-      {
-        extensionApi,
-      },
+    const {value} = mount.hook(() =>
+      useApi<'purchase.checkout.block.render'>(),
     );
 
-    expect(value).toMatchObject(extensionApi);
+    expect(value).toMatchObject({
+      extension: {target: 'purchase.checkout.block.render'},
+    });
   });
 
   it('throws when not run inside a checkout UI extension', async () => {
+    tearDownGlobalShopifyMock();
+
     const runner = async () => {
       return mount.hook(() => useApi());
     };
 
     await expect(runner).rejects.toThrow(
-      'You can only call this hook when running as a checkout UI extension.',
+      expect.objectContaining({
+        name: 'CheckoutUIExtensionError',
+      }),
     );
   });
 });

package/src/surfaces/checkout/preact/tests/app-metafields.test.ts

@@ -1,22 +1,28 @@
 import {faker} from '@faker-js/faker';
 
-import type {Metafield} from '@shopify/ui-extensions/checkout';
-
+import type {AppMetafield} from '../../api/standard/standard';
 import {useAppMetafields} from '../app-metafields';
 
-import {mount, createMockStatefulRemoteSubscribable} from './mount';
+import {
+  mount,
+  createMockSubscribableSignalLike,
+  setupGlobalShopifyMock,
+  tearDownGlobalShopifyMock,
+} from './mount';
 
-describe.skip('useAppMetafields', () => {
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
+// See __mocks__/preact/hooks
+jest.mock('preact/hooks');
+
+describe('useAppMetafields', () => {
+  afterEach(tearDownGlobalShopifyMock);
 
-  function createMetafield(props: Partial<Metafield> = {}): Metafield {
+  function createMetafield(props: Partial<AppMetafield> = {}): AppMetafield {
     return {
       key: `key-${faker.string.uuid()}`,
       namespace: 'example-namespace',
       value: 'example-value',
       valueType: 'string',
+      type: 'string' as const,
       ...props,
     };
   }
@@ -33,25 +39,23 @@ describe.skip('useAppMetafields', () => {
 
   it('returns all app metafield entries', () => {
     const appMetaFieldEntries = [productEntry, variantEntry];
-    const extensionApi = {
-      appMetafields: createMockStatefulRemoteSubscribable(appMetaFieldEntries),
-    };
+    setupGlobalShopifyMock({
+      appMetafields: createMockSubscribableSignalLike(appMetaFieldEntries),
+    });
 
-    const {value} = mount.hook(() => useAppMetafields(), {extensionApi});
+    const {value} = mount.hook(() => useAppMetafields());
 
     expect(value).toMatchObject(appMetaFieldEntries);
   });
 
   it('returns filtered app metafield entries based on type', () => {
     const appMetaFieldEntries = [productEntry, variantEntry];
-    const extensionApi = {
-      appMetafields: createMockStatefulRemoteSubscribable(appMetaFieldEntries),
-    };
-
-    const {value} = mount.hook(() => useAppMetafields({type: 'product'}), {
-      extensionApi,
+    setupGlobalShopifyMock({
+      appMetafields: createMockSubscribableSignalLike(appMetaFieldEntries),
     });
 
+    const {value} = mount.hook(() => useAppMetafields({type: 'product'}));
+
     expect(value).toMatchObject([productEntry]);
   });
 
@@ -63,14 +67,12 @@ describe.skip('useAppMetafields', () => {
     };
 
     const appMetaFieldEntries = [newEntry, variantEntry];
-    const extensionApi = {
-      appMetafields: createMockStatefulRemoteSubscribable(appMetaFieldEntries),
-    };
-
-    const {value} = mount.hook(() => useAppMetafields({id: testId}), {
-      extensionApi,
+    setupGlobalShopifyMock({
+      appMetafields: createMockSubscribableSignalLike(appMetaFieldEntries),
     });
 
+    const {value} = mount.hook(() => useAppMetafields({id: testId}));
+
     expect(value).toMatchObject([newEntry]);
   });
 
@@ -82,13 +84,12 @@ describe.skip('useAppMetafields', () => {
     };
 
     const appMetaFieldEntries = [newEntry, productEntry, variantEntry];
-    const extensionApi = {
-      appMetafields: createMockStatefulRemoteSubscribable(appMetaFieldEntries),
-    };
+    setupGlobalShopifyMock({
+      appMetafields: createMockSubscribableSignalLike(appMetaFieldEntries),
+    });
 
-    const {value} = mount.hook(
-      () => useAppMetafields({namespace: testNamespace}),
-      {extensionApi},
+    const {value} = mount.hook(() =>
+      useAppMetafields({namespace: testNamespace}),
     );
 
     expect(value).toMatchObject([newEntry]);
@@ -103,13 +104,12 @@ describe.skip('useAppMetafields', () => {
     };
 
     const appMetaFieldEntries = [newEntry, productEntry, variantEntry];
-    const extensionApi = {
-      appMetafields: createMockStatefulRemoteSubscribable(appMetaFieldEntries),
-    };
+    setupGlobalShopifyMock({
+      appMetafields: createMockSubscribableSignalLike(appMetaFieldEntries),
+    });
 
-    const {value} = mount.hook(
-      () => useAppMetafields({namespace: testNamespace, key: testKey}),
-      {extensionApi},
+    const {value} = mount.hook(() =>
+      useAppMetafields({namespace: testNamespace, key: testKey}),
     );
 
     expect(value).toMatchObject([newEntry]);
@@ -119,15 +119,13 @@ describe.skip('useAppMetafields', () => {
     jest.spyOn(console, 'error').mockImplementation();
 
     const appMetaFieldEntries = [productEntry, variantEntry];
-    const extensionApi = {
-      appMetafields: createMockStatefulRemoteSubscribable(appMetaFieldEntries),
-    };
+    setupGlobalShopifyMock({
+      appMetafields: createMockSubscribableSignalLike(appMetaFieldEntries),
+    });
 
-    expect(() =>
-      mount.hook(() => useAppMetafields({key: 'test_key'}), {
-        extensionApi,
-      }),
-    ).toThrow('You must pass in a namespace with a key');
+    expect(() => mount.hook(() => useAppMetafields({key: 'test_key'}))).toThrow(
+      'You must pass in a namespace with a key',
+    );
   });
 
   it('returns filtered app metafield entries based on all searchable fields', () => {
@@ -141,19 +139,17 @@ describe.skip('useAppMetafields', () => {
     };
 
     const appMetaFieldEntries = [newEntry, productEntry, variantEntry];
-    const extensionApi = {
-      appMetafields: createMockStatefulRemoteSubscribable(appMetaFieldEntries),
-    };
+    setupGlobalShopifyMock({
+      appMetafields: createMockSubscribableSignalLike(appMetaFieldEntries),
+    });
 
-    const {value} = mount.hook(
-      () =>
-        useAppMetafields({
-          namespace: testNamespace,
-          key: testKey,
-          id: testId,
-          type: 'product',
-        }),
-      {extensionApi},
+    const {value} = mount.hook(() =>
+      useAppMetafields({
+        namespace: testNamespace,
+        key: testKey,
+        id: testId,
+        type: 'product',
+      }),
     );
 
     expect(value).toMatchObject([newEntry]);

package/src/surfaces/checkout/preact/tests/attributes.test.ts

@@ -1,54 +1,64 @@
 import {useAttributeValues, useAttributes} from '../attributes';
 
-import {mount, createMockStatefulRemoteSubscribable} from './mount';
+// See __mocks__/preact/hooks
+jest.mock('preact/hooks');
+
+import {
+  mount,
+  createMockSubscribableSignalLike,
+  setupGlobalShopifyMock,
+  tearDownGlobalShopifyMock,
+} from './mount';
+
+describe('Attributes API hooks', () => {
+  afterEach(tearDownGlobalShopifyMock);
 
-describe.skip('Attributes API hooks', () => {
   describe('useAttributes', () => {
     it('returns an empty array if no attributes are available', () => {
-      const {value} = mount.hook(() => useAttributes(), {
-        extensionApi: {
-          attributes: createMockStatefulRemoteSubscribable([]),
-        },
+      setupGlobalShopifyMock({
+        attributes: createMockSubscribableSignalLike([]),
       });
 
+      const {value} = mount.hook(() => useAttributes());
+
       expect(value).toStrictEqual([]);
     });
 
     it('returns an array of attributes if available', () => {
-      const {value} = mount.hook(() => useAttributes(), {
-        extensionApi: {
-          attributes: createMockStatefulRemoteSubscribable([
-            {key: 'foo', value: 'bar'},
-          ]),
-        },
+      setupGlobalShopifyMock({
+        attributes: createMockSubscribableSignalLike([
+          {key: 'foo', value: 'bar'},
+        ]),
       });
 
+      const {value} = mount.hook(() => useAttributes());
+
       expect(value).toStrictEqual([{key: 'foo', value: 'bar'}]);
     });
   });
 
   describe('useAttributeValues', () => {
     it('returns an array of attribute values if available', () => {
-      const {value} = mount.hook(() => useAttributeValues(['foo']), {
-        extensionApi: {
-          attributes: createMockStatefulRemoteSubscribable([
-            {key: 'foo', value: 'bar'},
-          ]),
-        },
+      setupGlobalShopifyMock({
+        attributes: createMockSubscribableSignalLike([
+          {key: 'foo', value: 'bar'},
+        ]),
       });
 
+      const {value} = mount.hook(() => useAttributeValues(['foo']));
+
       expect(value).toStrictEqual(['bar']);
     });
 
     it('returns an array with undefined values if a non-existent attribute is requested', () => {
-      const {value} = mount.hook(() => useAttributeValues(['foo', 'bar']), {
-        extensionApi: {
-          attributes: createMockStatefulRemoteSubscribable([
-            {key: 'bar', value: 'baz'},
-          ]),
-        },
+      setupGlobalShopifyMock({
+        attributes: createMockSubscribableSignalLike([
+          {key: 'bar', value: 'baz'},
+        ]),
       });
 
+      const {value} = mount.hook(() => useAttributeValues(['foo', 'bar']));
+
       expect(value).toStrictEqual([undefined, 'baz']);
     });
   });

package/src/surfaces/checkout/preact/tests/billing-address.test.ts

@@ -1,17 +1,27 @@
-import type {MailingAddress} from '@shopify/ui-extensions/checkout';
+import type {MailingAddress} from '../../api/shared';
 
 import {useBillingAddress} from '../billing-address';
 
-import {mount, createMockStatefulRemoteSubscribable} from './mount';
+// See __mocks__/preact/hooks
+jest.mock('preact/hooks');
+
+import {
+  mount,
+  createMockSubscribableSignalLike,
+  setupGlobalShopifyMock,
+  tearDownGlobalShopifyMock,
+} from './mount';
+
+describe('useBillingAddress', () => {
+  afterEach(tearDownGlobalShopifyMock);
 
-describe.skip('useBillingAddress', () => {
   it('returns latest billing address', async () => {
     const address: MailingAddress = {countryCode: 'CA'};
-    const extensionApi = {
-      billingAddress: createMockStatefulRemoteSubscribable(address),
-    };
+    setupGlobalShopifyMock({
+      billingAddress: createMockSubscribableSignalLike(address),
+    });
 
-    const {value} = mount.hook(() => useBillingAddress(), {extensionApi});
+    const {value} = mount.hook(() => useBillingAddress());
 
     expect(value).toMatchObject(address);
   });

package/src/surfaces/checkout/preact/tests/buyer-identity-businessCustomer.test.ts

@@ -1,8 +1,18 @@
 import {usePurchasingCompany} from '../buyer-identity';
 
-import {mount, createMockStatefulRemoteSubscribable} from './mount';
+// See __mocks__/preact/hooks
+jest.mock('preact/hooks');
+
+import {
+  mount,
+  createMockSubscribableSignalLike,
+  setupGlobalShopifyMock,
+  tearDownGlobalShopifyMock,
+} from './mount';
+
+describe('usePurchasingCompany', () => {
+  afterEach(tearDownGlobalShopifyMock);
 
-describe.skip('usePurchasingCompany', () => {
   it('returns purchasing company from the api', () => {
     const purchasingCompany = {
       company: {
@@ -17,17 +27,14 @@ describe.skip('usePurchasingCompany', () => {
       },
     };
 
-    const extensionApi = {
+    setupGlobalShopifyMock({
       buyerIdentity: {
-        purchasingCompany:
-          createMockStatefulRemoteSubscribable(purchasingCompany),
+        purchasingCompany: createMockSubscribableSignalLike(purchasingCompany),
       },
-    };
-
-    const {value} = mount.hook(() => usePurchasingCompany(), {
-      extensionApi,
     });
 
+    const {value} = mount.hook(() => usePurchasingCompany());
+
     expect(value).toStrictEqual(purchasingCompany);
   });
 });

package/src/surfaces/checkout/preact/tests/buyer-identity.test.tsx

@@ -1,11 +1,18 @@
-import type {SubscribableSignalLike} from '../../shared';
 import {faker} from '@faker-js/faker';
 
-import {ScopeNotGrantedError} from '../../errors';
+import type {SubscribableSignalLike} from '../../shared';
 import {useCustomer, useEmail, usePhone} from '../buyer-identity';
 
-import {mount} from './mount';
-function createMockCustomer(customer = {}) {
+import {
+  mount,
+  setupGlobalShopifyMock,
+  tearDownGlobalShopifyMock,
+} from './mount';
+
+// See __mocks__/preact/hooks
+jest.mock('preact/hooks');
+
+function createMockCustomer(customer = {}): any {
   const firstName = faker.person.firstName();
   const lastName = faker.person.lastName();
 
@@ -21,26 +28,29 @@ function createMockCustomer(customer = {}) {
 }
 
 function createEmptyContext() {
-  return {
-    extensionApi: {
-      buyerIdentity: undefined,
-    },
-  };
+  // Set up a global shopify object without buyerIdentity to trigger ScopeNotGrantedError
+  setupGlobalShopifyMock({
+    buyerIdentity: undefined,
+  });
+  return {};
 }
 
 function createUseEmailContext(email?: string) {
-  return createMockHookContext(email, undefined, undefined);
+  setupGlobalShopify(email, undefined, undefined);
+  return {};
 }
 
 function createUseCustomerContext(customer = {}) {
-  return createMockHookContext(undefined, undefined, customer);
+  setupGlobalShopify(undefined, undefined, customer);
+  return {};
 }
 
 function createUsePhoneContext(phone?: string) {
-  return createMockHookContext(undefined, phone, undefined);
+  setupGlobalShopify(undefined, phone, undefined);
+  return {};
 }
 
-function createMockSuscribable<T>(data: T): SubscribableSignalLike<T> {
+function createMockSubscribable<T>(data: T): SubscribableSignalLike<T> {
   return {
     current: data,
     value: data,
@@ -49,24 +59,37 @@ function createMockSuscribable<T>(data: T): SubscribableSignalLike<T> {
   };
 }
 
-function createMockHookContext(email?: string, phone?: string, customer = {}) {
-  return {
-    extensionApi: {
-      buyerIdentity: {
-        customer: createMockSuscribable(customer),
-        email: createMockSuscribable(email),
-        phone: createMockSuscribable(phone),
-      },
+function setupGlobalShopify(
+  email?: string,
+  phone?: string,
+  customer: any = {},
+) {
+  const customerData =
+    email || Object.keys(customer).length > 0
+      ? createMockCustomer(customer)
+      : undefined;
+  setupGlobalShopifyMock({
+    buyerIdentity: {
+      customer: createMockSubscribable(customerData),
+      email: createMockSubscribable(email),
+      phone: createMockSubscribable(phone),
+      purchasingCompany: createMockSubscribable(undefined),
     },
-  };
+  });
 }
 
-describe.skip('buyerIdentity Hooks', () => {
+describe('buyerIdentity Hooks', () => {
+  afterEach(tearDownGlobalShopifyMock);
+
   describe('useCustomer()', () => {
     it('raises an exception without CustomerPersonalData ApprovalScope', () => {
       expect(() => {
         mount.hook(() => useCustomer(), createEmptyContext());
-      }).toThrow(ScopeNotGrantedError);
+      }).toThrow(
+        expect.objectContaining({
+          name: 'ScopeNotGrantedError',
+        }),
+      );
     });
 
     it('returns undefined fields with CustomerPersonalData ApprovalScopes only', () => {
@@ -113,7 +136,11 @@ describe.skip('buyerIdentity Hooks', () => {
     it('raises an exception without CustomerPersonalData ApprovalScope', () => {
       expect(() => {
         mount.hook(() => useEmail(), createEmptyContext());
-      }).toThrow(ScopeNotGrantedError);
+      }).toThrow(
+        expect.objectContaining({
+          name: 'ScopeNotGrantedError',
+        }),
+      );
     });
 
     it('returns undefined with CustomerPersonalData ApprovalScope only', () => {
@@ -135,7 +162,11 @@ describe.skip('buyerIdentity Hooks', () => {
     it('raises an exception without CustomerPersonalData ApprovalScope', () => {
       expect(() => {
         mount.hook(() => usePhone(), createEmptyContext());
-      }).toThrow(ScopeNotGrantedError);
+      }).toThrow(
+        expect.objectContaining({
+          name: 'ScopeNotGrantedError',
+        }),
+      );
     });
 
     it('returns undefined with CustomerPersonalData ApprovalScope only', () => {