Skip to content

test(e2e): add custom-cart-method recipe e2e tests#3546

Open
itsjustriley wants to merge 6 commits intorecipe-test-subscriptionsfrom
recipe-test-custom-cart-method
Open

test(e2e): add custom-cart-method recipe e2e tests#3546
itsjustriley wants to merge 6 commits intorecipe-test-subscriptionsfrom
recipe-test-custom-cart-method

Conversation

@itsjustriley
Copy link
Contributor

@itsjustriley itsjustriley commented Mar 6, 2026

Part of https://github.com/Shopify/developer-tools-team/issues/1057

WHY are these changes introduced?

Adds e2e test coverage for the custom-cart-method recipe, which enables customers to change product variants directly within the cart using inline dropdown selectors. This continues the systematic testing of recipes to ensure all user-facing changes are validated.

This PR is stacked on #3545 (subscriptions tests).

WHAT is this pull request doing?

Adds e2e/specs/recipes/custom-cart-method.spec.ts with 4 comprehensive tests covering:

  • Product option selectors display in cart line items
  • Variant changes update product link URLs to reflect new selection
  • Cart maintains single line item (no duplication) when variant changes
  • Updates happen without page reload (cart dialog stays visible)

Tests use locator('select') for dropdown elements, verify URL changes to confirm variant updates, check cart dialog visibility to ensure no reload, reuse CartUtil for cart operations, and follow established patterns from existing recipe tests.

The custom-cart-method recipe implements the updateLineByOptions cart method, allowing customers to change product variants (size, color, etc.) without removing and re-adding items.

HOW to test your changes?

# Run custom-cart-method recipe tests only
npx playwright test --project=recipes custom-cart-method

# Run all recipe tests
npx playwright test --project=recipes

All tests pass (34 total: 6 bundles + 6 combined-listings + 5 subscriptions + 4 custom-cart-method + 7 infinite-scroll + 6 markets).

Checklist

  • I've read the Contributing Guidelines
  • I've considered possible cross-platform impacts (Mac, Linux, Windows)
  • I've added a changeset if this PR contains user-facing or noteworthy changes
  • I've added tests to cover my changes
  • I've added or updated the documentation

@shopify
Copy link
Contributor

shopify bot commented Mar 6, 2026

Oxygen deployed a preview of your recipe-test-custom-cart-method branch. Details:

Storefront Status Preview link Deployment details Last update (UTC)
Skeleton (skeleton.hydrogen.shop) ✅ Successful (Logs) Preview deployment Inspect deployment March 19, 2026 1:29 PM

Learn more about Hydrogen's GitHub integration.

@binks-code-reviewer
Copy link

binks-code-reviewer bot commented Mar 6, 2026

🤖 Code Review · #projects-dev-ai for questions
React with 👍/👎 or reply — all feedback helps improve the agent.

Complete - No issues

📋 History

✅ 1 findings → ✅ No issues → ✅ No issues

@itsjustriley itsjustriley force-pushed the recipe-test-subscriptions branch from d4cf926 to 21cf381 Compare March 11, 2026 14:28
@itsjustriley itsjustriley force-pushed the recipe-test-custom-cart-method branch from 96db938 to 3077329 Compare March 11, 2026 14:39
@itsjustriley itsjustriley force-pushed the recipe-test-subscriptions branch from 21cf381 to ab4981c Compare March 11, 2026 17:04
@itsjustriley itsjustriley force-pushed the recipe-test-custom-cart-method branch from 3077329 to ac5373e Compare March 11, 2026 17:08
@itsjustriley itsjustriley requested a review from kdaviduik March 16, 2026 11:19
@itsjustriley itsjustriley marked this pull request as draft March 17, 2026 12:54
@itsjustriley itsjustriley force-pushed the recipe-test-subscriptions branch from 8cb5406 to 68e5086 Compare March 17, 2026 14:12
@itsjustriley itsjustriley force-pushed the recipe-test-custom-cart-method branch from 83f70e6 to 9fd5b97 Compare March 17, 2026 14:13
Adds end-to-end tests for the custom-cart-method recipe covering:
- Custom cart with product variant selection
- Cart quantity management (increase, decrease, remove)
- Variant change verification in cart
- Empty option filtering in cart variant selector

Also adds shared cart-utils fixture with reusable cart
assertion helpers (getCartLineItemByIndex, quantity checks).
@itsjustriley itsjustriley force-pushed the recipe-test-subscriptions branch from 68e5086 to 9ee6a3c Compare March 18, 2026 13:10
- Remove type assertion: use typed parameter `(el: HTMLSelectElement)`
  in evaluate callback instead of `as HTMLSelectElement`
- Promote `getFirstLineItem` free function to `CartUtil.getFirstLineItem()`
  method for better discoverability
- Strengthen first test assertion from `> 0` to `>= 2` to verify the
  recipe renders selectors for multiple product options
- Remove redundant `increaseButton.toBeEnabled()` assertion irrelevant
  to the test's purpose of verifying option selectors exist
The method blocks on a visibility assertion before returning, making
it a blocking wait rather than a pure getter. Renaming signals this
to callers and is consistent with the naming conventions of other
action methods in CartUtil (vs. pure locator getters like getLineItems).

Renaming now while only one spec uses it avoids a multi-file rename
once more recipe tests adopt this shared utility.
@itsjustriley itsjustriley force-pushed the recipe-test-custom-cart-method branch from 6e3a8af to d1b6b5a Compare March 18, 2026 13:10
…eservation properties

Tests 3 ("maintains single line item") and 4 ("updates without page reload")
previously asserted preservation/no-reload properties that were already true
before the variant change. If updateLineByOptions was completely broken, both
tests would pass vacuously since selectDifferentOption only confirms the DOM
<select> value changed, not that the async cart API round-trip completed.

Each test now captures the product link's initial href and polls for it to
change before asserting its core properties. This proves the cart update
completed — if the recipe is broken, the poll times out and the test fails.

Also tightened the productLink selector in all three tests from
getByRole('link').first() to getByRole('link', {name: ...}) so it targets the
product link specifically rather than relying on positional ordering.

Co-authored-by: Claude <claude@anthropic.com>
@itsjustriley itsjustriley marked this pull request as ready for review March 19, 2026 12:35
Copy link
Contributor

@fredericoo fredericoo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lfg

Move waitForOptionSelectors and selectDifferentOption into a dedicated
CustomCartMethodUtil class. These methods are only used by the
custom-cart-method recipe tests and don't belong in the generic cart
utility, which caused confusion about whether they were shared helpers.

Addresses fredericoo's review feedback on PR #3546.

Co-authored-by: Claude <noreply@anthropic.com>
@itsjustriley itsjustriley marked this pull request as draft March 19, 2026 13:27
@itsjustriley itsjustriley marked this pull request as ready for review March 19, 2026 13:27
@itsjustriley itsjustriley dismissed kdaviduik’s stale review March 19, 2026 13:29

Pair reviewed with Freddie

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants