diff --git a/.changeset/itchy-weeks-search.md b/.changeset/itchy-weeks-search.md new file mode 100644 index 0000000000..e76d6e90b5 --- /dev/null +++ b/.changeset/itchy-weeks-search.md @@ -0,0 +1,27 @@ +--- +'@shopify/hydrogen': patch +--- + +Allow calling the cart `.get()` method right after creating a new cart with +one of the mutation methods: `create()`, `addLines()`, `updateDiscountCodes()`, `updateBuyerIdentity()`, `updateNote()`, `updateAttributes()`, `setMetafields()`. + +```ts +import { + createCartHandler, + cartGetIdDefault, + cartSetIdDefault, +} from '@shopify/hydrogen'; + +const cartHandler = createCartHandler({ + storefront, + getCartId: cartGetIdDefault(request.headers), + setCartId: cartSetIdDefault(), + cartQueryFragment: CART_QUERY_FRAGMENT, + cartMutateFragment: CART_MUTATE_FRAGMENT, +}); + +await cartHandler.addLines([{merchandiseId: '...'}]); +// This change fixes a bug where `cart` would be null, even though a +// new cart was created when adding a line item +const cart = await cartHandler.get(); +``` diff --git a/packages/hydrogen/src/cart/createCartHandler.test.ts b/packages/hydrogen/src/cart/createCartHandler.test.ts index e32784a7e3..56755d018e 100644 --- a/packages/hydrogen/src/cart/createCartHandler.test.ts +++ b/packages/hydrogen/src/cart/createCartHandler.test.ts @@ -399,4 +399,17 @@ describe('createCartHandler', () => { expect(result.cart).toHaveProperty('id', 'gid://shopify/Cart/c1-456'); }); + + it('stores the cartId in memory when a new cart is created and returns that result if available', async () => { + const cart = getCartHandler(); + + await cart.addLines([ + { + merchandiseId: '1', + quantity: 1, + }, + ]); + + expect(await cart.get()).toHaveProperty('id', 'c1-new-cart-id'); + }); }); diff --git a/packages/hydrogen/src/cart/createCartHandler.ts b/packages/hydrogen/src/cart/createCartHandler.ts index 89a6139409..1fbd719e67 100644 --- a/packages/hydrogen/src/cart/createCartHandler.ts +++ b/packages/hydrogen/src/cart/createCartHandler.ts @@ -96,7 +96,7 @@ export function createCartHandler( options: CartHandlerOptions | CartHandlerOptionsWithCustom, ): CartHandlerReturn { const { - getCartId, + getCartId: _getCartId, setCartId, storefront, customerAccount, @@ -104,14 +104,23 @@ export function createCartHandler( cartMutateFragment, } = options; + let cartId = _getCartId(); + + const getCartId = () => cartId || _getCartId(); + const mutateOptions = { storefront, getCartId, cartFragment: cartMutateFragment, }; - const cartId = getCartId(); - const cartCreate = cartCreateDefault(mutateOptions); + const _cartCreate = cartCreateDefault(mutateOptions); + + const cartCreate: CartCreateFunction = async function (...args) { + const result = await _cartCreate(...args); + cartId = result?.cart?.id; + return result; + }; const methods: HydrogenCart = { get: cartGetDefault({