CORS issues with e2e testing with Cypress and new accounts.myshopify.com login flow

dylanpierce
Shopify Partner
140 2 48

I've been meaning to get end to end (e2e) tests on my Shopify app to help detect and fix regressions before my customers have to experience them.

However I'm having issues getting the login to my development store working.

Below is my Cypress test that uses the new https://accounts.myshopify.com login:

describe("Integration testing an Shopify App", () => {
  it("Can login as a merchant and open the app", () => {
    cy.visit("https://accounts.shopify.com/store-login");
    cy.get('[name="shop[domain]"]').type("pierces-pretzels.myshopify.com");

    cy.contains("Next").click();

    cy.get('[name="account[email]"]').type("me@dylanjpierce.com");

    cy.contains("Next").click();

    cy.get('[name="account[password]"]').type("MY PASSWORD HERE");

    cy.get('[type="submit"]').click();

    cy.contains("Apps").click();

    cy.contains("Verdict Dev").click();
  });
});


It's able to submit my credentials just fine, but I'm getting a CORS error in the Cypress test immediately after:

 Screen Shot 2020-12-05 at 4.03.09 PM.png

It looks like after login, when the merchant's dashboard loads, because the domain has changed from accounts.myshopify.com to shopify.com, then you run into CORS issues. 

Founder of Verdict - Anti-Fraud Apps for Shopify
  • Blockade - Easily block countries, IP addresses, VPNs
  • Real ID - Verify your customer's real IDs easily & securely