vitest icon indicating copy to clipboard operation
vitest copied to clipboard

Environment options are not parsed from comments

Open nickserv opened this issue 3 years ago • 8 comments

Describe the bug

Vitest supports parsing @{vitest,jest}-environment comments to set an environment, but it should also support @{vitest,jest}-environment-options comments for compatibility with Jest.

Reproduction

index.test.js

/**
 * @jest-environment jsdom
 * @jest-environment-options {"url": "https://example.com/"}
 */
test("use jsdom and set the URL in this test file", () => {
  expect(location.href).toBe("https://example.com/")
})

vite.config.js

export default {
  test: {
    globals: true,
  },
}

Expected result from Jest

 PASS  ./index.test.js
  ✓ use jsdom and set the URL in this test file (2 ms)

Actual result from Vitest

 FAIL  index.test.js > use jsdom and set the URL in this test file
AssertionError: expected 'http://localhost:3000/' to be 'https://example.com/' // Object.is equality
 ❯ index.test.js:6:25
      4|  */
      5| test("use jsdom and set the URL in this test file", () => {
      6|   expect(location.href).toBe("https://example.com/")
       |                         ^
      7| })
      8| 

  - Expected   "https://example.com/"
  + Received   "http://localhost:3000/"

System Info

System:
    OS: macOS 12.5.1
    CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
    Memory: 43.91 MB / 8.00 GB
    Shell: 3.5.1 - /usr/local/bin/fish
  Binaries:
    Node: 18.8.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.19.1 - /usr/local/bin/npm
    Watchman: 2022.08.29.00 - /usr/local/bin/watchman
  npmPackages:
    vitest: ^0.18.0 => 0.18.1

Used Package Manager

npm

Validations

nickserv avatar Sep 03 '22 11:09 nickserv

I just noticed that the JSDOM options are scoped under a jsdom property in setup, so there would have to be a change or adapter for that API to fix this.

nickserv avatar Sep 03 '22 11:09 nickserv

I just noticed that the JSDOM options are scoped under a jsdom property in setup, so there would have to be a change or adapter for that API to fix this.

We can just put options inside a key of current env:

/**
 * @jest-environment jsdom
 * @jest-environment-options {"url": "https://example.com/"}
 */
// environmentOptions -> { jsdom: { url: string } }
/**
 * @jest-environment-options {"url": "https://example.com/"}
 */
// node is default environment. if config is used, will put into the one specified with config
// environmentOptions -> { node: { url: string } }

All spec files have environment, so should not be a problem.

sheremet-va avatar Sep 03 '22 11:09 sheremet-va

I'm mostly thinking about Jest compatibility, and it doesn't use a jsdom property. Can you pass top level options to an environment?

nickserv avatar Sep 03 '22 14:09 nickserv

I'm mostly thinking about Jest compatibility, and it doesn't use a jsdom property.

environment will never be jest compatible, so I don't see any reason to think about jest compatibility here.

sheremet-va avatar Sep 03 '22 15:09 sheremet-va

The environment API may not be compatible, but we already document compatibility with the @jest-environment comment, so I would prefer to to find a way where we can also be compatible with using @jest-environment-options with JSDOM without an intermediate property.

nickserv avatar Sep 04 '22 07:09 nickserv

The environment API may not be compatible, but we already document compatibility with the @jest-environment comment, so I would prefer to to find a way where we can also be compatible with using @jest-environment-options with JSDOM without an intermediate property.

You wouldn't need to write @jest-environment-options { jsdom: { option } }, you would write @jest-environment-options { option }, since we already know the environment for the file.

sheremet-va avatar Sep 04 '22 07:09 sheremet-va

Oh sorry, I think I misunderstood the purpose of the key. Is it just there so options other than those in the comments can be passed to the environment? Also can I still use that with a custom environment without having a 2D object?

nickserv avatar Sep 04 '22 07:09 nickserv

Oh sorry, I think I misunderstood the purpose of the key. Is it just there so options other than those in the comments can be passed to the environment?

Yes, you can have multiple environments, so you need a key for each.

Also can I still use that with a custom environment without having a 2D object?

You would use it like this:

// config
export default {
  test: {
    environmentOptions: {
       custom: {} // your options
    }
  }
}

// or inside a spec file
/**
 * @vitest-environment custom
 * @vitest-environment-options { url: "http://example.com" } 
 */ 

sheremet-va avatar Sep 04 '22 07:09 sheremet-va