I have recently started to write some tests using jest and I need to run some code in a real browser, so I decided to go with jest-puppeteer, the problem I have with the package is when we use jsdom we have access to the globalThis that has everything a browser has, in other words, the code executed in a context of a pseudo-browser, which is accepted.
// example.test.js
/**
* @jest-environment jsdom
*/
test('something', () => {
expect(navigator.vendor).toBeDefined() // Will Pass Successfully
})
but when using jest-puppeteer we don't have a similar effect.
// example.test.js
/**
* @jest-environment puppeteer
*/
test('something', () => {
expect(navigator.vendor).toBeDefined() // Will Fail
})
it offers browser, page and context to use, which nullify the reason we use the real browser to test in the first place because we don't have direct access to the browser context, and, if we needed to test some HTMLless code, we should serialize and inject the code which losses all the good features of jest, like coverage and mocking, it doesn't act like what we have with jsdom environment. no matter how much similar jsdom to real browser is, the result of tests might be different in some situations.