test-utils: 0.8.6 version breaks tests

After upgrading to 0.8.6 ot 0.8.7 some of the tests fail with errors. And test task does not stop

TypeError: The "obj" argument must be an instance of Blob. Received an instance of Blob
    at new NodeError (node:internal/errors:405:5)
    at Function.createObjectURL (node:internal/url:1056:13)
[Vue warn]: Unhandled error during execution of setup function 
  at <Anonymous> 
  at <Anonymous ref="VTU_COMPONENT" > 
  at <VTUROOT>

Error: Test timed out in 2000ms.
If this is a long-running test, pass a timeout value as the last argument or configure it globally with "testTimeout".
(node:78788) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 1)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:78788) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 1)
(Use `node --trace-warnings ...` to show where the warning was created)
[Vue warn]: Unhandled error during execution of setup function 
  at <Anonymous> 
  at <Anonymous ref="VTU_COMPONENT" > 
  at <VTUROOT>
(node:78788) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 1)
(Use `node --trace-warnings ...` to show where the warning was created)

Error: Test timed out in 2000ms.
Снимок экрана 2023-07-01 в 12 13 42

Here is vitest.config.ts:

import { resolve as pathResolve } from 'node:path'
import { defineVitestConfig } from 'nuxt-vitest/config'
import AutoImport from 'unplugin-auto-import/vite'
import vuetify from 'vite-plugin-vuetify'

export default defineVitestConfig({
  plugins: [
    vuetify(),
    AutoImport({ imports: ['vue'], dirs: ['./composables/'] })
  ],
  resolve: { alias: { '@': pathResolve(__dirname), '~': pathResolve(__dirname) } },
  test: {
    dir: 'tests',
    testTimeout: 2000,
    environment: 'nuxt',
    globals: true,
    deps: { inline: ['vuetify'] },
    setupFiles: ['./tests/setup.ts'],
    coverage: {
      all: true,
      enabled: true,
      reporter: ['text', 'text-summary', 'cobertura'],
      exclude: ['api', '.nuxt', 'server', 'middleware', 'layouts', 'pages', 'tests', '*.config.ts', '*.d.ts', 'app.vue'],
      include: ['**/*.ts', '**/*.vue']
    }
  }
})

This is setup file:

import { Blob } from 'node:buffer'
import { afterEach, beforeAll, vi } from 'vitest'

beforeAll(() => {
  // vuetify hack
  globalThis.Blob = Blob
})

afterEach(() => { vi.clearAllMocks() })

Here is an example of failed test:

import { describe, expect, test } from 'vitest'
import { mountSuspended } from 'vitest-environment-nuxt/utils'
import LogoMain from '~/components/main/LogoMain.vue'

describe('🪐 Main logo tests', () => {
  test('Main logo test', async () => {
    const component = await mountSuspended(LogoMain)

    const rootEl = component.find('a')
    expect(rootEl.attributes().href).toBe('/')

    const imgEl = component.find('img')
    const imgAttr = imgEl.attributes()
    expect(imgAttr.src).toContain('/static/img/logo/png/logo_text.png')
    expect(imgAttr.alt).toBeDefined()

    expect(component.html()).toMatchInlineSnapshot(`
     "<a href=\\"/\\"><img src=\\"https://fyi.know/static/img/logo/png/logo_text.png\\" height=\\"28\\" alt=\\"Go to main\\"></a>"
    `)
  })
})

These are failed tests:

https://github.com/danielroe/nuxt-vitest/assets/29500153/2946f0b3-7daa-4873-ba01-0025e0529123

Theese are working tests with version 0.8.5

https://github.com/danielroe/nuxt-vitest/assets/29500153/6b824fcd-d1eb-4800-8168-6deb922016f8

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Comments: 15 (6 by maintainers)

Most upvoted comments

With happy-dom it does not work. The error is attached in first message of the issue. Only this row makes tests working:

environmentOptions: { nuxt: { domEnvironment: 'jsdom' } }