Question

正在寻找有关如何查明无效/意外令牌的实际来源的建议。

我正在使用赛普拉斯（cypress）进行测试，并且大多数时候（尽管不一致），我从所有测试中都得到了这个错误。

Uncaught SyntaxError: Invalid or unexpected token

This error originated from your application code, not from Cypress.

When Cypress detects uncaught errors originating from your application it will automatically fail the current test.

This behavior is configurable, and you can choose to turn this off by listening to the 'uncaught:exception' event.

https://on.cypress.io/uncaught-exception-from-application

所以我们要弄清楚；我确实知道这是我的应用程序代码而不是测试代码的问题。我的问题是我还没有看到指向语法错误的实际位置的任何内容。此外，我在Chrome中运行该应用程序（不是通过cypress） 72，并且没有问题。当我通过cypress运行该应用程序时似乎只有一个问题（也使用chrome 72 ，因为我在运行cypress规格时正在使用--browser chrome）。

我已经在测试中添加了fail和uncaught:exception处理程序以捕获输出，尽管我仍然找不到任何东西可以将我定向到错误的实际来源。 / p>

通过中断uncaught:exception处理程序，传递了两个参数， 1）错误（与上面相同）； 2）可运行的摩卡咖啡：

Hook {title: ""before all" hook", fn: ƒ, body: "function () {↵    var _this = this;↵↵    debugger;…   cy.visit("/#/account-management");↵    });↵  }", async: 0, sync: true, …}

    $events: {error: Array(1)}
    async: 0
    body: "function () {↵    var _this = this;↵↵    debugger;↵    cy.on('fail', event_handler_functions_1.failHandler.bind(this));↵    cy.on('uncaught:exception', function (e, r) {↵      console.log(e, r);↵      debugger;↵    });↵    cy.fixture(Cypress.env("environmentSettings")).then(function (fixture) {↵      _this.environmentData = environmentData = fixture;↵      cy.launchApp(environmentData.baseUrl, environmentData.username, environmentData.password↵      /*, 300000*/↵      );↵      cy.visit("/#/account-management");↵    });↵  }"
    callback: ƒ done(err)
    ctx: Context {currentTest: Test, _runnable: Hook, test: Hook, environmentData: {…}}
    fn: ƒ ()
    hookId: "h1"
    hookName: "before all"
    id: "r3"
    parent: Suite {title: "Account Management", ctx: Context, suites: Array(0), tests: Array(3), pending: false, …}
    pending: false
    sync: true
    timedOut: false
    timer: null
    title: ""before all" hook"
    type: "hook"
    _currentRetry: 0
    _enableTimeouts: false
    _retries: -1
    _slow: 75
    _timeout: 4000
    _trace: Error: done() called multiple times at Hook.Runnable (https://localhost:44399/__cypress/runner/cypress_runner.js:30161:17) at new Hook (https://localhost:44399/__cypress/runner/cypress_runner.js:26593:12) at Suite.beforeAll (https://localhost:44399/__cypress/runner/cypress_runner.js:31573:14) at before (https://localhost:44399/__cypress/runner/cypress_runner.js:26770:17) at context.describe.context.context (https://localhost:44399/__cypress/runner/cypress_runner.js:26666:10)
    __proto__: Runnable

我已经在测试中逐步完成了before()，并在chrome调试器中启用了“异常暂停”。在我逐步完成before()中的所有内容之后，然后必须“恢复脚本执行”，一切都不会出错。请注意，我的测试中没有beforeAll()钩子，只有before()。

我没有使用不寻常语法进行最近的更改（据我所知），并且我在本地环境中没有运行测试套件已有几个星期了，所以有很多更改-太多了对我来说，一遍一遍地筛选它们是值得的。

这是该错误实例的测试，仅供参考，尽管它们都存在相同的问题。

import { failHandler } from "..\\..\\support\\event-handler-functions"
describe('Account Management', function () {
    var environmentData: CypressTypings.EnvrionmentSettings;

    before(function () {
        debugger;
        cy.on('fail', failHandler.bind(this))
        cy.on('uncaught:exception', (e, r) => {console.log(e, r); debugger;})
        cy.fixture(Cypress.env("environmentSettings")).then((fixture) => {
            (<any>this).environmentData = environmentData = fixture

            cy.launchApp(environmentData.baseUrl, environmentData.username, environmentData.password/*, 300000*/);
            cy.visit("/#/account-management");
        });
    })

    beforeEach(() => {
        Cypress.Cookies.preserveOnce(environmentData.cookieName)
    })

    it('Loads Governments', function () {
        cy.get("[data-cy=government-panel]", { timeout: 20000 }).should("have.length.gte", 1);
    })

    it('Users Page Loads', function () {
        cy.get("[data-cy=government-panel]").first().find(".fa-users").click();
        cy.get("tbody", { timeout: 20000 }).find("tr").should("have.have.length.greaterThan", 0);
        cy.get("[data-cy=return-to-organization-button]").click();
        cy.get("[data-cy=government-panel]").should("exist");
    })
    it('Service Area Page Loads', function () {
        cy.get("[data-cy=government-panel]").first().find(".fa-globe").click();
        cy.get("tbody", { timeout: 20000 }).find("tr").should("have.have.length.greaterThan", 0);
        cy.get("[data-cy=return-to-organization-button]").click();
        cy.get("[data-cy=government-panel]").should("exist");
    })
})

还值得注意的是：launchApp()步骤实际上发生了-应用程序已登录，然后似乎是在应用程序加载时，语法出现了错误，而visit()步骤从未真正执行过。

Answer 1

如果将来有人遇到这种情况，我的任务就是尝试加载不存在的JS文件（从我的索引页开始）。

Cypress似乎隐藏了错误，因此对其进行记录很有帮助；

Cypress.on('uncaught:exception', (err, runnable) => {
  console.log(err);
  return false;
})

Answer 2

我整理了我们的 npm软件包，怀疑可能添加的软件包可能引入了SyntaxError。我删除了大约1/4的npm软件包（无论如何早就应该这样做），并清理了我们的依赖项。毕竟，Uncaught SyntaxError消失了。

我怀疑是以下引入错误的软件包之一，尽管我不能确切地说，因为我从未真正指出错误的来源。

我结束删除的软件包（其中一些我们最近可能已更新）：

@types/plotly.js
aurelia-animator-css
@types/jest
@types/node
@types/pikaday
ajv
d3
jest
jest-cli
jquery-sparkline
nps-utils
opn
protractor
ts-jest
ts-node
uglify-js
vinyl-fs
wait-on

找不到以下来源：“未捕获的语法错误”（仅在赛普拉斯中发生）

2 个答案: