diff --git a/frontend/puppeteer/e2e/missions.spec.ts b/frontend/puppeteer/e2e/missions.spec.ts index 9d024d5881..5d758e5135 100644 --- a/frontend/puppeteer/e2e/missions.spec.ts +++ b/frontend/puppeteer/e2e/missions.spec.ts @@ -1,8 +1,8 @@ -import { beforeEach, describe, expect, it } from '@jest/globals' +import { afterEach, beforeEach, describe, expect, it } from '@jest/globals' import { platform } from 'os' import { Page } from 'puppeteer' -import { getFirstTab, getInputContent, listenToConsole, wait, waitForSelectorWithText } from './utils' +import { consoleListener, getFirstTab, getInputContent, wait, waitForSelectorWithText } from './utils' // /!\ Do not shorten imports, it will fail the run import { SeafrontGroup } from '../../src/constants/seafront' @@ -21,10 +21,10 @@ let pageB: Page describe('Missions Form', () => { beforeEach(async () => { pageA = await getFirstTab(browsers[0]) - listenToConsole(pageA, 1) + consoleListener.start(pageA, 1) pageB = await getFirstTab(browsers[1]) - listenToConsole(pageB, 2) + consoleListener.start(pageB, 2) /* eslint-disable no-restricted-syntax */ for (const page of [pageA, pageB]) { @@ -49,6 +49,10 @@ describe('Missions Form', () => { } }, 50000) + afterEach(async () => { + consoleListener.stop() + }) + it( 'Two windows must be synchronized on form update', async () => { diff --git a/frontend/puppeteer/e2e/utils.ts b/frontend/puppeteer/e2e/utils.ts index 141e6bf52d..be93144864 100644 --- a/frontend/puppeteer/e2e/utils.ts +++ b/frontend/puppeteer/e2e/utils.ts @@ -1,34 +1,51 @@ import assert from 'assert' import { Page, Browser, type FrameWaitForFunctionOptions } from 'puppeteer' -export function listenToConsole(page: Page, index: number) { - page - .on('console', async message => { - // Ignore SmallChat - if (message.text().includes('static.small.chat')) { - return - } - - const messageType = message.type().substr(0, 3).toUpperCase() - console.log(`[Page ${index}] ${messageType}: ${message.text()}`) - - if (messageType === 'ERR') { - console.log(message.args(), message.stackTrace()) - if (message.text().includes('/sse')) { - // If the SSE connection fails, the browser will restart it, it is not an application error - return - } - - throw new Error(message.text()) - } - }) - .on('response', async response => { - if (response.url().includes('/bff/') || response.url().includes('/api/')) { - console.log(`[Page ${index}] HTTP ${response.request().method()} ${response.status()}: ${response.url()}`) - } - }) +class ConsoleListener { + #isStopped = false + + start(page: Page, index: number) { + page + .on('console', message => { + setImmediate(async () => { + if (this.#isStopped) { + return + } + + const messageType = message.type().substr(0, 3).toUpperCase() + console.log(`[Page ${index}] ${messageType}: ${message.text()}`) + + if (messageType === 'ERR') { + console.log(message.args(), message.stackTrace()) + if (message.text().includes('/sse')) { + // If the SSE connection fails, the browser will restart it, it is not an application error + return + } + + throw new Error(message.text()) + } + }) + }) + .on('response', async response => { + setImmediate(async () => { + if (this.#isStopped) { + return + } + + if (response.url().includes('/bff/') || response.url().includes('/api/')) { + console.log(`[Page ${index}] HTTP ${response.request().method()} ${response.status()}: ${response.url()}`) + } + }) + }) + } + + stop() { + this.#isStopped = true + } } +export const consoleListener = new ConsoleListener() + export async function assertContains(page: Page, selector: string, text: string) { // TODO Remove ts-ignore when TS version is 4.9.3: // @ts-ignore: https://github.com/puppeteer/puppeteer/issues/9369 diff --git a/frontend/puppeteer/setup.ts b/frontend/puppeteer/setup.ts index 299229ab6c..f6852975fd 100644 --- a/frontend/puppeteer/setup.ts +++ b/frontend/puppeteer/setup.ts @@ -3,12 +3,13 @@ import os from 'os' import path from 'path' import puppeteer from 'puppeteer' +const IS_HEADLESS = process.env.IS_HEADLESS === 'true' const TEMP_DIRECTORY = path.join(os.tmpdir(), 'jest_puppeteer_global_setup') const NUMBER_OF_BROWSERS = 2 const WIDTH = 1020 const HEIGHT = 880 -console.log(`Running in ${process.env.CI ? 'headless' : 'browser'} mode.`) +console.log(`Running in ${IS_HEADLESS ? 'headless' : 'browser'} mode.`) export default async () => { const browsers = [] @@ -24,7 +25,8 @@ export default async () => { '--enable-features=ExperimentalJavaScript' ], defaultViewport: null, - headless: process.env.IS_HEADLESS === 'true', + devtools: !IS_HEADLESS, + headless: IS_HEADLESS, product: 'firefox' })