Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expose function that returns list of IgnorePlugins needed for using enzyme with webpack #881

Closed
nfcampos opened this issue Apr 10, 2017 · 6 comments

Comments

@nfcampos
Copy link
Collaborator

nfcampos commented Apr 10, 2017

@ljharb @lelandrichardson @aweary @blainekasten

What do you guys think about exposing a function that returns an array of the IgnorePlugins needed to use enzyme with webpack and the currently installed react version, something like https://github.com/kentcdodds/enzyme/blob/296dc3090dd05c20a799af7d1478752a100e1a04/karma.conf.js#L9

It would make our docs for using enzyme with webpack / karma easier to maintain and always up-to-date (which it seems they rarely are). This function would be necessarily up-to-date because it'd be used in our own karma tests.

The documentation for eg. use with webpack would become something like:


Using Enzyme with Webpack

If you are using a test runner that runs code in a browser-based environment, you may be using
webpack in order to bundle your React code.

Webpack uses static analysis to create a dependency graph at build-time of your source code to
build a bundle. Enzyme has a handful of conditional require() calls in it in order to remain
compatible with React 0.13 and React 0.14.

Unfortunately, these conditional requires mean there is a bit of extra setup with bundlers like
webpack.

In your webpack configuration, you simply need to make sure that you include IgnorePlugins for the conditional dependencies not needed for your version of react. You can do this easily with the following additions to your webpack config:

{
  plugins: require('enzyme/webpack').getPluginsForInstalledReact(),
  loaders: {
    {
      test: /\.json$/,
      loader: 'json-loader',
    },
  }
}

@ljharb
Copy link
Member

ljharb commented Apr 10, 2017

That seems reasonable, especially if it's in a separate entry point.

However, I'd want some kind of CI enforcement to ensure that this plugin list was correct (ie, it'd have to fail if the list was incorrect)

@nfcampos
Copy link
Collaborator Author

@ljharb it'd fail because the karma tests (already run on CI) would use it and fail

@ljharb
Copy link
Member

ljharb commented Apr 10, 2017

@nfcampos as long as that's true for both webpack 1 and webpack 2 (since our docs describe both), and for every combination with react versions, then that sounds great.

@nfcampos
Copy link
Collaborator Author

currently only true for all versions of react with weback 1 as that's what we use with karma. ill have to think about how to enforce testing with webpack 2 (preferrably something lighter than re-running our karma tests compiled with webpack 2 I guess)

@ljharb
Copy link
Member

ljharb commented Apr 10, 2017

Let's start with webpack 1 for now then :-)

@ljharb
Copy link
Member

ljharb commented Sep 26, 2017

Done in #895, also no longer relevant in enzyme v3.

@ljharb ljharb closed this as completed Sep 26, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants