Runtime environments
By default, Peeky use the native Node.js environment to run your tests. You can however chose another environment, for example to test Web components in a browser-like environment.
Global config
In your Peeky config, you can specify the environment to use with the runtimeEnv option:
import { defineConfig } from '@peeky/test'
export default defineConfig({
  runtimeEnv: 'dom', // Default is 'node'
})
This will ensure that all your tests are using a browser-like environment.
Specific to a test
In a test file, you can use comments pragma to specify the runtime environment to use:
/* @peeky {
  runtimeEnv: 'dom'
} */
describe('DOM', () => {
  test('create a div', () => {
    // Dumb example test
    const el = document.createElement('div')
    el.innerText = 'hello'
    document.body.appendChild(el)
    expect(el.innerHTML).toBe('<div>hello</div>')
    // Test your Vue, React, etc. components here
  })
})
Built-in environments
The following environments are available by default:
- node(default): native Node.js environment
- dom: browser-like environment with a simulated DOM interface
Custom environment
You can create a custom runtime environment by extending the TestEnvironmentBase abstract class and putting it in the runtimeEnv option:
import { defineConfig, TestEnvironmentBase } from '@peeky/test'
class MyEnv extends TestEnvironmentBase {
  constructor (config, context) {
    super(config, context)
  }
  create () {
    // do something
  }
  destroy () {
    // do something
  }
}
export default defineConfig({
  runtimeEnv: MyEnv,
})
It should implement the create() and destroy() methods which will be called automatically by Peeky.
Use in a specific test
If you don't want to use your custom environment for all your tests, you can use the runtimeAvailableEnvs option to specify which environments are available for your tests:
export default defineConfig({
  runtimeAvailableEnvs: {
    'my-env': MyEnv,
  },
})
Then in a test you can use the comment pragma to use it:
/* @peeky {
  runtimeEnv: 'my-env'
} */
describe('Using my custom env', () => {
  // ...
})