Search code examples
testingautomationautomated-testse2e-testingtestcafe

CORS Errors TestCafe Mock After Upgrade


I recently upgraded TestCafe on a project from 1.8.6 to 2.4.0 and now our mocks are failing due to CORS errors, however, I'm not sure how to resolve them. For the "OPTIONS" request I get the proper 200 status but the actual request is failing with a CORS error.

Here is the mock we use:

export function detailsMock(detailsMockData = {}) {
  return RequestMock()
    .onRequestTo(
      new RegExp(
        `^${env.API_URL}/orders/[0-9]+/disbursements/[0-9]+[\?disbursementId=[0-9]+]?$`
      )
    )
    .respond(detailsMockData, 200, {
      'access-control-allow-credentials': 'true',
      'access-control-allow-origin': `${env.BASE_URL}`
    });
}

And then in the test I have:

 await t.addRequestHooks(detailsMock(detailsMockData))
 await t.navigateTo(`${env.BASE_URL}/order/${orderData.fileId}/disbursements/123`)
    .expect(viewDisbursementPageSelectors.wireNotMatchToast.innerText)
    .eql(
      'Some message.'
    )
  await t.removeRequestHooks(disbursementListMock());

Here is the CORS error I'm seeing in the browser console:

Access to XMLHttpRequest at 'http://localhost:54392/QrHot6VR5HJPHVnKYb!a!0!sREMOVED-FOR-CONFIDENTIALITY/https://REMOVED-FOR-CONFIDENTIALITY/ncs/v1/orders/50612391/disbursements/123' from origin 'http://localhost:54391' has been blocked by CORS policy: Request header field pragma is not allowed by Access-Control-Allow-Headers in preflight response.


Solution

  • In this case, to solve this issue I had to add the g flag to the RegExp. I think the issue was that it was only matching the first one, but with the g flag it matches all. I'm not sure why this changed between TestCafe versions.