"Uncaught SyntaxError: Invalid or unexpected token" occurs when running e2e test for the angular app using cypress framework

Question

I'm using cypress to do e2e testing for our angular app, when cypress auto-open the app home page，the error occurs,and in the browser console print "Uncaught SyntaxError: Invalid or unexpected token" just as show in the screenshot attached, it's seems messy code is catched in the vendor.xxx.js file, but the file is auto compiled and generated by angular framework and is no problem in our everyday using. The error it's not happening every time start running by cypress, and if I manually input the URL into the browser to visit the application,this error will disappear, I'm not sure whether it's the cypress bug when it trigger or start the browser for test, after all it's the cypress framework manipulate the browser. The error happens in both built-in Eletron browser and chrome browser which controled by cypress. The version of cypress used is 3.4.0, I will be very appreciated if anyone try to give some advise,thanks.

Answer 1

It might not be ideal but have you tried to add

Cypress.on('uncaught:exception', (err, runnable) => {
    // returning false here prevents Cypress from
    // failing the test
    return false
  })

to your index.js under support folder?

This will stop failing your test if there is uncaught exception.

Answer 2

You can Solve it by changing name of file browserlist to .browserlistrc . i had the same issue it helped me. look into following issue:

https://github.com/cypress-io/cypress/issues/8864

Answer 3

function d3_asin(x){
  return x > 1 half ??: x < -1 ? half :math.asin(x);
}

 function d3_asin(x){
   return ((x = Math.exp(x)) - 1 / x) / 2;
 }

The same file run on the standalone Chrome was loaded correctly,so it had to be issue with Cypress encoding. After some googling we found that Cypress settings has default settings with this property:

"modifyObstructiveCode": true

after setting it to false it work well.