An Ember Ecosystem
For Spree Commerce

spree-ember-checkouts

The checkouts service is a Stateful global for progressing an Order through the Spree checkout, via the Checkouts endpoint. It also serves as the "canonical" state for a Checkout frontend, and should be used to progress forward and backward through an order's steps.

It's designed to allow a reactive programming style for the checkout frontend. The spree-checkout component from the Spree Ember Storefronts package is an example of this style.

var checkouts = this.get('spree.checkouts');

checkouts.get('currentState');
// => "address"

checkouts.transition().then(function() {
  checkouts.get('currentOrder.state');
  // => "delivery"
  checkouts.get('currentState');
  // => "delivery"

  checkouts.transition("address").then(function() {

    // Here, the Checkout and Current Order state has diverged.  This is
    // expected behaviour, and their states will reconcile when the 
    // checkout progresses forward again.
    
    checkouts.get('currentOrder.state');
    // => "delivery"
    checkouts.get('currentState');
    // => "address"
  });
});

Methods

Show Private Methods

_ensurePaymentExists

private

Called whenever the State Machine enters "Payment". Ensures that a payment and source object exists for the currentOrder.

_ensureShipAddressExists

private

Called whenever the State Machine enters "Address". Ensures that an address object exists for the order's shipAddress.

_resetStateMachine

private

When validateOrder fails, the State Machine will automatically transition to "failed". Here, we listen to that transition, and then automatically run this method, to reset the State Machine to the State of the currentOrder.

Note: Because Ember QUnit relies on returned promise for Unit tests, we disable this method in test, and manually reset the State Machine when testing failed transitions.

_validateOrder

(
  • transition
)
private

Used to save changes to the currentOrder to Spree's Checkouts API. Is only called by the state machine when advancing to a later state in the flow.

Parameters:

  • transition Transition

    The current state machine transition.


Returns:

Ember.RSVP.Promise:

A promise that resolves when the server response returns.

transition

(
  • stateName
)

If a state name is passed to this method, the state machine will attempt to transition directly to that state. If not, we will attempt to transition to the next state in the checkout flow.

Parameters:

  • stateName String

    Optional, a state to attempt transition to.


Returns:

Ember.RSVP.Promise:

A promise that resolves when the State Machine resolves it's transition.

Properties

Show Private Properties

currentOrder

DS.Model

A reference to the Spree Object's currentOrder.


currentState

String

Provided by Ember FSM, the current state of the checkout. This will often diverge from the currentOrder.get('state'), and will be reconsoidated when the state machine calls validateOrder. This is what we use as the cononical "state" for a frontend's Checkout flow.


Default: "idle"

fsmEvents

Object

Used by Ember FSM to describe the checkout flow.


fsmStates

Object

Used by Ember FSM to name the initialState.


isLoading

Boolean

Provided by Ember FSM, returns true when there's an active transition. Handy for showing customers loading states during the checkout.


Default: false

spree

Ember.Service

A reference to the Spree Service.