How do I generate a specific cart for testing in dev mode?

Extensions
1

When running shopify app dev with my test storefront I am given a pre-generated cart. Specifically, it has a gift card. How can I customize what sort of cart is created?

My usecase is testing my ui-extensions with different cart contents.

Related, I would preferably be able to create a custom cart with specific lines and line item properties and cart properties that my ui-extensions are informed from.

FWIW this is for an internal app I am developing for my own headless storefront.

2

I have come up with a solution.

Requirement: Have the Shopify GraphiQL app installed on your test store.

Solution:

  1. Deploy your app to your store or run in dev mode.
  2. Create a cart with the attached GraphQL mutation via the app Shopify GraphiQL.
  3. The response from that mutation will include a checkout URL that you can use to test the specific scenario that you are interested in testing.
mutation MockCart {
  cartCreate(input: {
    attributes: [
      { key: "some-key", value: "some-value" }
    ],
    lines: [
      {
        quantity: 1,
        merchandiseId: "gid://shopify/ProductVariant/45259914707130",
        attributes: [
          { key: "some-key", value: "some-value" },
        ]
      },
      {
        quantity: 1,
        merchandiseId: "gid://shopify/ProductVariant/45259914674362",
        attributes: [
          { key: "some-key", value: "some-value" },
        ]
      },
      {
        quantity: 1,
        merchandiseId: "gid://shopify/ProductVariant/45259914150074",
        attributes: [
          { key: "some-key", value: "some-value" },
        ]
      },
    ],
    buyerIdentity: {
      email: "Russel.winfield@example.com"
    },
  }) {
    cart {
      checkoutUrl
    }
  }
}