[web-test-runner-plugin] How to set up global assertions #3208

IanVS · 2021-04-25T04:36:13Z

IanVS
Apr 25, 2021

I'd like to set up an assertion library on the global window scope so that I can polyfill a few things in one place and have them available everywhere (essentially jestjs/jest#11065 (comment), but I don't want to import buffer and expect in each of my tests, if possible). In normal node mocha tests, I'd set up a --require to set some variables on the global scope. I can't figure out how to do that with web test runner, though.

I've tried adding my setup as the first file in my list of files to test, but it seems that the global scope is not shared with other tests. This is nice, in terms of sandboxing, but I was really hoping for a nice method to inject this.

I've also tried using the testRunnerHtml option of the web-test-runner config, but I can't figure out how to mix that with snowpack, so that snowpack processes my setup file, and then I import it into the html.

Can anyone think of a good way to accomplish this?

Answered by IanVS

Apr 25, 2021

I think I've figured this out, actually. I've added a file called src/test-setup/expect.ts. It has to be in one of the mounted directories, that tripped me up a bit at first. Then, I can use testRunnerHtml and point to /dist/test-setup/expect.js, which is the name of the file after snowpack transforms it. So, I end up with something like:

/* src/test-setup/expect.ts */

import 'buffer';
import expect from 'expect';

window.expect = expect;

and

/* web-test-runner.config.cjs */
module.exports = {
  files: ['src/**/*.test.{ts,tsx}'],
  plugins: [require('@snowpack/web-test-runner-plugin')()],
  testRunnerHtml: (testFramework) => `<html>
    <body>
      <script type="module" src="/dist/test…

View full answer

IanVS · 2021-04-25T05:00:59Z

IanVS
Apr 25, 2021
Author

I think I've figured this out, actually. I've added a file called src/test-setup/expect.ts. It has to be in one of the mounted directories, that tripped me up a bit at first. Then, I can use testRunnerHtml and point to /dist/test-setup/expect.js, which is the name of the file after snowpack transforms it. So, I end up with something like:

/* src/test-setup/expect.ts */

import 'buffer';
import expect from 'expect';

window.expect = expect;

and

/* web-test-runner.config.cjs */
module.exports = {
  files: ['src/**/*.test.{ts,tsx}'],
  plugins: [require('@snowpack/web-test-runner-plugin')()],
  testRunnerHtml: (testFramework) => `<html>
    <body>
      <script type="module" src="/dist/test-setup/expect.js"></script>
      <script type="module" src="${testFramework}"></script>
    </body>
  </html>`,
};

Which seems to put my modified expect() onto the global scope for each of my tests. \o/

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[web-test-runner-plugin] How to set up global assertions #3208

{{title}}

Replies: 1 comment

{{title}}

Select a reply

[web-test-runner-plugin] How to set up global assertions #3208

IanVS Apr 25, 2021

Replies: 1 comment

IanVS Apr 25, 2021 Author

IanVS
Apr 25, 2021

IanVS
Apr 25, 2021
Author