chore(deps): update dependency @types/jsdom to v28 (#9672)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Vladimir Sheremet <[email protected]>

packages/vitest/package.json

@@ -190,7 +190,7 @@
     "@sinonjs/fake-timers": "15.4.0",
     "@types/istanbul-lib-coverage": "catalog:",
     "@types/istanbul-reports": "catalog:",
-    "@types/jsdom": "^27.0.0",
+    "@types/jsdom": "^28.0.3",
     "@types/node": "^24.13.3",
     "@types/picomatch": "^4.0.3",
     "@types/prompts": "^2.4.9",

packages/vitest/src/integrations/env/jsdom.ts

@@ -1,4 +1,4 @@
-import type { DOMWindow, VirtualConsole as IVirtualConsole } from 'jsdom'
+import type { ConstructorOptions, DOMWindow, VirtualConsole as IVirtualConsole } from 'jsdom'
 import type { Environment } from '../../types/environment'
 import type { JSDOMOptions } from '../../types/jsdom-options'
 import { URL as NodeURL } from 'node:url'
@@ -40,6 +40,34 @@ let NodeFormData_!: typeof FormData
 let NodeBlob_!: typeof Blob
 let NodeRequest_!: typeof Request
 
+interface LegacyResourceLoader {
+  new (options?: { userAgent?: string }): NonNullable<ConstructorOptions['resources']>
+}
+
+function getResourceOptions(
+  jsdom: typeof import('jsdom'),
+  resources: JSDOMOptions['resources'],
+  userAgent: string | undefined,
+) {
+  const ResourceLoader = (jsdom as typeof jsdom & {
+    ResourceLoader?: LegacyResourceLoader
+  }).ResourceLoader
+
+  // jsdom 28 replaced ResourceLoader with a resources options object.
+  if (!ResourceLoader) {
+    return {
+      resources: userAgent ? { userAgent } : resources,
+    }
+  }
+
+  return {
+    resources:
+      resources
+      ?? (userAgent ? new ResourceLoader({ userAgent }) : undefined),
+    userAgent,
+  }
+}
+
 export default <Environment>{
   name: 'jsdom',
   viteEnvironment: 'client',
@@ -49,9 +77,8 @@ export default <Environment>{
     NodeBlob_ = globalThis.Blob
     NodeRequest_ = globalThis.Request
 
-    const { CookieJar, JSDOM, ResourceLoader, VirtualConsole } = await import(
-      'jsdom',
-    )
+    const jsdomModule = await import('jsdom')
+    const { CookieJar, JSDOM, VirtualConsole } = jsdomModule
     const {
       html = '<!DOCTYPE html>',
       userAgent,
@@ -79,16 +106,13 @@ export default <Environment>{
     }
     let dom = new JSDOM(html, {
       pretendToBeVisual,
-      resources:
-        resources
-        ?? (userAgent ? new ResourceLoader({ userAgent }) : undefined),
       runScripts,
       url,
       virtualConsole,
       cookieJar: cookieJar ? new CookieJar() : undefined,
       includeNodeLocations,
       contentType,
-      userAgent,
+      ...getResourceOptions(jsdomModule, resources, userAgent),
       ...restOptions,
     })
 
@@ -162,9 +186,8 @@ export default <Environment>{
     NodeBlob_ = globalThis.Blob
     NodeRequest_ = globalThis.Request
 
-    const { CookieJar, JSDOM, ResourceLoader, VirtualConsole } = await import(
-      'jsdom',
-    )
+    const jsdomModule = await import('jsdom')
+    const { CookieJar, JSDOM, VirtualConsole } = jsdomModule
     const {
       html = '<!DOCTYPE html>',
       userAgent,
@@ -192,16 +215,13 @@ export default <Environment>{
     }
     const dom = new JSDOM(html, {
       pretendToBeVisual,
-      resources:
-        resources
-        ?? (userAgent ? new ResourceLoader({ userAgent }) : undefined),
       runScripts,
       url,
       virtualConsole,
       cookieJar: cookieJar ? new CookieJar() : undefined,
       includeNodeLocations,
       contentType,
-      userAgent,
+      ...getResourceOptions(jsdomModule, resources, userAgent),
       ...restOptions,
     })
 

pnpm-lock.yaml

@@ -1067,8 +1067,8 @@ importers:
         specifier: 'catalog:'
         version: 3.0.4
       '@types/jsdom':
-        specifier: ^27.0.0
-        version: 27.0.0
+        specifier: ^28.0.3
+        version: 28.0.3
       '@types/node':
         specifier: 24.13.3
         version: 24.13.3
@@ -5064,8 +5064,8 @@ packages:
   '@types/[email protected]':
     resolution: {integrity: sha512-pk2B1NWalF9toCRu6gjBzR69syFjP4Od8WRAX+0mmf9lAjCRicLOWc+ZrxZHx/0XRjotgkF9t6iaMJ+aXcOdZQ==}
 
-  '@types/jsdom@27.0.0':
-    resolution: {integrity: sha512-NZyFl/PViwKzdEkQg96gtnB8wm+1ljhdDay9ahn4hgb+SfVtPCbm3TlmDUFXTA+MGN3CijicnMhG18SI5H3rFw==}
+  '@types/jsdom@28.0.3':
+    resolution: {integrity: sha512-/HQ2uFoetFTXuye8vzIcHw2z6Fwi7Hi/qcgC+RoS9NCyewiqxhVGqlG+ViGB6lkax481R6dmhf1I7lIGlzJStQ==}
 
   '@types/[email protected]':
     resolution: {integrity: sha512-9VN+6yxLOPLOav+7PwjZbxiID2bVaeq0ED4qSQmdQTdjnXJSaCVKTR58t15oqH1H5t8Ng2ZX1SabJVoN9Q34bw==}
@@ -9996,6 +9996,9 @@ packages:
   [email protected]:
     resolution: {integrity: sha512-AsuCzffGHJybSaRrmr5eHr81mwJU3kjw6M+uprWvCXiNeN9SOGwQ3Jn8jb8m3Z6izVgknn1R0FTCEAP2QrLY/w==}
 
+  [email protected]:
+    resolution: {integrity: sha512-vamA8dGlzMwhpyYpQp9d8vka3o4D/yn5I7ez7Or+msDA4bZ8Uh+Zy91WvWf3I73gDAkFha9JcYRqm2li0Npfgg==}
+
   [email protected]:
     resolution: {integrity: sha512-YmfV3YnEDzXRC5lZ2jWtWWHKGUm1zIt8AhesR1tens+HTNv+YZlN/dp6G727LOvMJ8xjP9Be7Y2Sdr96LDm+pg==}
     engines: {node: '>=18.17'}
@@ -13701,11 +13704,12 @@ snapshots:
     dependencies:
       '@types/istanbul-lib-report': 3.0.3
 
-  '@types/jsdom@27.0.0':
+  '@types/jsdom@28.0.3':
     dependencies:
       '@types/node': 24.13.3
       '@types/tough-cookie': 4.0.5
-      parse5: 7.3.0
+      parse5: 8.0.1
+      undici-types: 7.29.0
 
   '@types/[email protected]': {}
 
@@ -19579,6 +19583,8 @@ snapshots:
 
   [email protected]: {}
 
+  [email protected]: {}
+
   [email protected]: {}
 
   [email protected]: {}

test/unit/test/environments/jsdom-options.test.ts

@@ -0,0 +1,34 @@
+import { expect, test } from 'vitest'
+import { getWorkerState } from '../../../../packages/vitest/src/runtime/utils'
+
+const userAgent = 'Vitest jsdom environment'
+const isThreads = getWorkerState().config.pool === 'threads'
+
+test.runIf(isThreads)('sets userAgent during global setup', async () => {
+  const { default: jsdom } = await import('../../../../packages/vitest/src/integrations/env/jsdom')
+  const global = {} as typeof globalThis
+  const environment = await jsdom.setup(global, {
+    jsdom: { userAgent },
+  })
+
+  try {
+    expect(global.navigator.userAgent).toBe(userAgent)
+  }
+  finally {
+    await environment.teardown(global)
+  }
+})
+
+test.runIf(isThreads)('sets userAgent during VM setup', async () => {
+  const { default: jsdom } = await import('../../../../packages/vitest/src/integrations/env/jsdom')
+  const environment = await jsdom.setupVM!({
+    jsdom: { userAgent },
+  })
+
+  try {
+    expect(environment.getVmContext().navigator.userAgent).toBe(userAgent)
+  }
+  finally {
+    await environment.teardown()
+  }
+})