mercredi 21 novembre 2018

Ember & Cypress | Integration test failing likely due to lack of store context

I am working with Ember.js on the frontend and using Cypress.io for integration testing. I have a "Order Status" button that upon click is supposed to use data within the store to access the specific order and navigate to the Order Status page.

However within the test, upon click from the modal, the Order Status page cannot load and my test throws this error in the console, which I think likely has to do with that route's model not finding the order from within the store and loading.

In the Cypress test, I've created the necessary routes to pass in session data, but am struggling to understand if the lack of store data is throwing this error and how to fix. Important to note that this whole flow 100% works, I'm just trying to get test coverage.

I'll attach snippets from the relevant files / functions below -- please do let me know if more information is needed. I really suspect that Cypress cannot access the Ember store, but after much research and experimenting not exactly sure what the issue is. Thanks so much for your help :)

order-status.js - model function from route

async model({ order_id: orderId }) {
    let cachedOrder = this.get('store').peekRecord('order', orderId);
    return cachedOrder
      ? cachedOrder
      : await this.get('store').findRecord('order', orderId);
  },

modal.hbs - where we navigate from current page to order-status route

<fieldset>
  <span class="modal-text">See order status</span>
  <div class="inline-button-wrap">
    <button 
       
      class="close-btn button-hollow-green">
        Close
    </button>
    <button 
       
      class="order-status-btn">
       Order Status
     </button>
  </div>
</fieldset>

test.js - test that simulates clicking order status button above

it('order status btn navigates to order status page', () => {
  cy.server();
  cy.route('GET', '/api/session', sessionResponse);
  cy.route('GET', `/api/orders/*`, order);
  cy.visit('/');
  cy.get('.delivery-card .button-cta').click(); //opens modal 
  cy.get('#modal .order-status-btn').click(); //navigates to order-status
});



Aucun commentaire:

Enregistrer un commentaire