WooCommerce 11.1 changes the quantity stepper DOM order to match its visual order. The change improves logical navigation, but themes and extensions may target old child positions, sibling combinators, flex order values, or delegated events. A control can look correct while keyboard focus, screen-reader reading, mobile layout, cart updates, or analytics still follow broken assumptions.
Use this for stores with custom quantity CSS, mini-cart controls, product bundles, subscriptions, quick view, product tables, side carts, or JavaScript that watches plus and minus buttons.
Quick answer
Capture old and new markup, computed styles, focus sequence, accessible names, click targets, input values, update requests, cart totals, and event counts. Search theme and extension code for nth-child, first-child, last-child, adjacent-sibling selectors, flex order, and selectors tied to quantity button position. Test product, cart, mini-cart, mobile, right-to-left, keyboard, screen reader, maximum, minimum, step, disabled, and rapid-click states. Fix selectors by role or class rather than source position.
What to check first
- Save the rendered quantity markup and computed CSS before and after WooCommerce 11.1.
- Search custom CSS and JavaScript for positional selectors, sibling assumptions, and delegated events tied to old order.
- Verify keyboard focus and screen-reader reading follow minus, input, plus in the intended logical sequence.
- Test min, max, decimal step, sold individually, backorder, variation, bundle, subscription, mini-cart, and checkout updates.
- Confirm one user action creates one cart request, one value change, and one analytics event.
Test scenarios to run
Run the same controlled fixture across these branches. Write down the expected result before testing so a surprising response is easy to identify.
| Scenario | Fixture | Expected result |
|---|
| Keyboard | Tab and activate each control | Logical focus and one change |
| Mobile | 390px product and cart | No overlap or clipped target |
| Constraint | Min, max, decimal step | Valid value and clear state |
| Rapid input | Three quick plus actions | Final quantity and total agree |
Decision rule
Promote the update only when visual, source, focus, and reading order agree, all quantity constraints pass, and one accepted action creates one cart mutation and one analytics event.
Safe fix order
Use a sequence that makes each result easy to prove. Stop when new evidence changes the scope or owner of the problem.
- Freeze old and new markup plus affected selectors and handlers.
- Replace source-position selectors with stable classes, roles, and control relationships.
- Remove visual reorder rules that conflict with the new logical order.
- Retest accessibility, constraints, cart totals, requests, and analytics across surfaces.
- Purge generated CSS and CDN caches, then monitor quantity errors and abandonment.
Diagnostic table
Use this table to connect the observed behavior to evidence and a verification step.
| Action | Evidence to collect | How to verify |
|---|
| Freeze old and new markup plus affected selectors and handlers. | Save the rendered quantity markup and computed CSS before and after WooCommerce 11.1. | Minus, input, and plus appear and read in the intended order. |
| Replace source-position selectors with stable classes, roles, and control relationships. | Search custom CSS and JavaScript for positional selectors, sibling assumptions, and delegated events tied to old order. | No positional selector or handler depends on the old DOM structure. |
| Remove visual reorder rules that conflict with the new logical order. | Verify keyboard focus and screen-reader reading follow minus, input, plus in the intended logical sequence. | Cart state, totals, inventory rules, and analytics reconcile after rapid input. |
| Retest accessibility, constraints, cart totals, requests, and analytics across surfaces. | Test min, max, decimal step, sold individually, backorder, variation, bundle, subscription, mini-cart, and checkout updates. | Mobile, RTL, mini-cart, bundles, and subscriptions remain usable. |
Useful command or data shape
Adapt paths, IDs, and privacy handling to the site before running commands or storing data on production.
# Find position-dependent customization
rg "quantity.*(nth-child|first-child|last-child|\+|~)|flex-order|order:" wp-content/themes wp-content/plugins
Expected focus: minus -> quantity input -> plus
Expected event: one quantity_change per accepted value
Production verification checklist
- Minus, input, and plus appear and read in the intended order.
- No positional selector or handler depends on the old DOM structure.
- Cart state, totals, inventory rules, and analytics reconcile after rapid input.
- Mobile, RTL, mini-cart, bundles, and subscriptions remain usable.
Why this usually happens
- A theme styles :first-child as minus even after source order changes.
- Flex order hides a source-order problem from visual review.
- Delegated JavaScript matches a sibling relationship that no longer exists.
- A click and input listener both report the same quantity change.
Field notes
- Use synthetic IDs and examples that can be traced from the first request or interaction to the final record.
- Keep a before and after result for every changed setting, package, selector, route, or deployed version.
- Separate user-visible success from internal success so a green interface cannot hide a failed request or inaccessible control.
- Review the evidence again after caches, queues, browser history, and scheduled work have had time to settle.
Mistakes to avoid
- Changing production before recording exact versions, UTC timestamps, settings, stable fixture IDs, and a reproducible baseline.
- Treating one successful screen as proof that keyboard access, APIs, caches, jobs, reports, analytics, and downstream records agree.
- Testing only an administrator session instead of the devices, roles, networks, consent states, and failure branches customers use.
- Closing the work without a named owner, rollback point, observation window, and contextual incoming link from an established guide.
What to tell the client or owner
Give the site owner the affected versions, exact synthetic fixture, UTC timeline, before and after evidence, cause class, decision, rollback point, unresolved risks, and next review date. State which measurements prove success and which observation window remains open.
Questions teams ask during testing
Can this be tested on production?
Use production for read-only checks and one narrow synthetic fixture that cannot charge a card, send real customer email, expose personal data, or change inventory. Run upgrades, package changes, cache changes, and destructive repairs on staging first.
What evidence should the test report keep?
Keep exact versions, UTC timestamps, stable synthetic IDs, expected and actual results, screenshots or response excerpts, the decision owner, rollback point, and final verification. Redact credentials, tokens, customer data, private addresses, and infrastructure details.
How long should the observation window stay open?
Keep it open long enough to include at least one cache cycle, scheduled job cycle, and representative traffic period. For release changes, include both logged-in and logged-out use plus the first real operational handoff.
When is the task complete?
Complete it when the primary user path passes, downstream records reconcile, failure branches are understood, monitoring is active, and an established owner page links to this guide in context.
When HandL WP should help
Bring in help when this affects leads, checkout, search visibility, security, paid media reporting, or a client production site. HandL WP can trace the issue through WordPress, hosting, cache, tracking, and Search Console, then verify the workflow after the technical fix.
If this is active on a production site, fix a WooCommerce theme regression.
Related HandL WP guides
Use these related guides when the same issue touches tracking, security, checkout, or crawler visibility.
Verify decimal quantities and locale parsing
Stores selling fractional units should add the WooCommerce 11.1 decimal quantity locale test for dot and comma input, precision, cart totals, stock, orders, refunds, analytics, and rapid interaction.
Helpful references