Jest CI issues

[nihalgonsalves]

Creating this to keep track of the problems.

Prior related PRs: #3056, #3096, #3097, #3098

I still get an error sometimes, while running yarn test (i.e. in concurrent mode). This doesn't fail with yarn test-serve --runInBand or yarn test-build --runInBand

The root cause still seems to be that the teardown is initiated before ssr-vue.spec.ts runs.

I wonder if a better strategy would be to use one page per test suite, as described here: https://playwright.dev/docs/test-runners#jest--jasmine

However, when changing the setup to match that, many tests fail (on assertions), possibly because they rely on the page being changed by previous tests in the same test suite (spec file).

 FAIL  packages/playground/ssr-vue/__tests__/ssr-vue.spec.ts (26.31 s)
  ● client navigation

    page.click: Execution context was destroyed, most likely because of a navigation.
    =========================== logs ===========================
    waiting for selector "a[href="/about"]"
      selector resolved to visible <a class="" href="/about">About</a>
    attempting click action
      waiting for element to be visible, enabled and stable
    ============================================================
    Note: use DEBUG=pw:api environment variable to capture Playwright logs.page.click: Execution context was destroyed, most likely because of a navigation.
    =========================== logs ===========================
    waiting for selector "a[href="/about"]"
      selector resolved to visible <a class="" href="/about">About</a>
    attempting click action
      waiting for element to be visible, enabled and stable
    ============================================================
    Note: use DEBUG=pw:api environment variable to capture Playwright logs.

      111 | test('client navigation', async () => {
      112 |   await untilUpdated(() => page.textContent('a[href="/about"]'), 'About')
    > 113 |   await page.click('a[href="/about"]')
          |              ^
      114 |   await untilUpdated(() => page.textContent('h1'), 'About')
      115 |   editFile('src/pages/About.vue', (code) => code.replace('About', 'changed'))
      116 |   await untilUpdated(() => page.textContent('h1'), 'changed')

[brillout]

I wonder if a better strategy would be to use one page per test suite

Why would that be better? Do you know if there are performance implications?

[nihalgonsalves]

Just something to try out, because it's incredibly hard to isolate why the teardown seems to happen before the test finishes running. I don't think opening a new window per spec file has much of a performance penalty, but we'd have to check.

You could help with the debugging by running:

DEBUG=pw:api PW_DEBUG=1 VITE_DEBUG_SERVE=1 yarn test-serve

You can also enable slowMo: 1000 here:

https://github.com/vitejs/vite/blob/ffa03ad/scripts/jestGlobalSetup.js#L9-L14

[haoqunjiang]

Closing as we've migrated to Vitest #8076