Unhandled error while running jest-puppeteer test

Question

I am trying to set up testing for my puppeteer project. I was following a basic guide and the test passes but there is 2 console errors in the terminal.

The error doesn't show up when using https://google.com or https://youtube.com. So it looks like it could be a thing with the specific site?

 console.error
    Unhandled error

      at process.uncaught (node_modules/jest-jasmine2/build/jasmine/Env.js:248:21)
      at handler (node_modules/jest-environment-puppeteer/lib/PuppeteerEnvironment.js:17:11)
      at map (node_modules/mitt/src/index.ts:74:75)
          at Array.map (<anonymous>)
      at Object.emit (node_modules/mitt/src/index.ts:74:56)
      at Page.emit (node_modules/puppeteer/lib/EventEmitter.js:72:22)

  console.error

      at process.uncaught (node_modules/jest-jasmine2/build/jasmine/Env.js:249:21)
      at handler (node_modules/jest-environment-puppeteer/lib/PuppeteerEnvironment.js:17:11)
      at map (node_modules/mitt/src/index.ts:74:75)
          at Array.map (<anonymous>)
      at Object.emit (node_modules/mitt/src/index.ts:74:56)
      at Page.emit (node_modules/puppeteer/lib/EventEmitter.js:72:22)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        5.613 s
Ran all test suites.

Here is my code

describe('NCAA Home', () => {
    beforeAll(async () => {
      await page.goto('http://stats.ncaa.org/rankings/change_sport_year_div');
    });
  
    it('should be titled "NCAA Statistics"', async () => {
      await expect(page.title()).resolves.toMatch('NCAA Statistics');
    });
});

Here is my jest.config.js

module.exports = {
    preset: "jest-puppeteer",
    testMatch: [
      "**/test/**/*.test.js"
    ],
    verbose: true
}

package.json

{
  "name": "stackoverflow",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "jest": {
    "preset": "jest-puppeteer"
  },
  "scripts": {
    "test": "jest"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "jest": "^26.1.0",
    "jest-puppeteer": "^4.4.0"
  },
  "dependencies": {
    "puppeteer": "^5.1.0"
  }
}

All of the things I have come across have mentioned an issue with async/await but anything I have tried produces the same, if not, more errors. I have made a new project with these files and I am getting the same error

Answer 1

I have created clean repo which reproduces issue. https://github.com/sergtimosh/jest-puppeteer-issue-reproduction.git

• clone repository
• npm i
• npm test test.spec.js

or

• HEADLESS=false npm test test.spec.js

A workaround is to create incognito browser context in jest-environment.js. Just uncomment two lines in this file and tests are passing with no issues. But problem is still here if you need to share browser context between test suites(files).

const PuppeteerEnvironment = require('jest-environment-puppeteer');


class JestEnvironment extends PuppeteerEnvironment {

  async setup() {
    await super.setup()
    //to fix issue uncomment next two lines
    // const incognitoContext = await this.global.browser.createIncognitoBrowserContext()
    // this.global.page = await incognitoContext.newPage()

  }

  async teardown() {
    await super.teardown()
  }

}

module.exports = JestEnvironment;

Answer 2

The error is from the website itself. Check the console of the website. Hence for a websites like google.com or youtube.com, it works without any errors.