Skip to content

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

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

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

Conversation

@itsjustriley
Copy link
Contributor

@itsjustriley itsjustriley commented Mar 6, 2026

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

Add comprehensive tests for inline variant editing in cart including option selector display, variant changes, and quantity maintenance after changes.
@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 9, 2026 2:00 PM

Learn more about Hydrogen's GitHub integration.

Add tests to verify line item URL updates and no page reload occurs when variants change, making tests more thorough and meaningful.
Eliminates non-deterministic variant selection and removes conditional branches that could let tests pass without exercising recipe behavior.

Moves cart option-selection helpers into CartUtil, switches to role-based combobox selectors, and strengthens checks for URL updates, quantity stability, and no-reload user-visible behavior.
Use quantity control state instead of matching "Quantity: 2" text so recipe coverage remains stable across copy or localization changes.

The test now verifies the decrease control stays enabled before and after variant changes while preserving the single-line-item assertion.
@itsjustriley itsjustriley marked this pull request as ready for review March 6, 2026 21:35
@itsjustriley itsjustriley requested a review from a team as a code owner March 6, 2026 21:35
@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


const nextValue = enabledOptionValues.find(
(value) => value !== initialValue,
);

Choose a reason for hiding this comment

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

selectDifferentOption can accidentally select placeholder/empty option

The helper builds enabledOptionValues from all non-disabled options and selects the first value different from initialValue. If the <select> contains an enabled placeholder option like <option value="">Select…</option>, nextValue may become an empty string. Selecting "" may be a no-op, fail validation, or cause UI reversion, leading to intermittent failures depending on product configuration.

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.

1 participant