Remove babel-plugin-rewire
We added babel-plugin-rewire
in !18116 (merged) several months ago because we had an issue with our Jasmine spies being unable to override behavior in our utility classes and this was effecting our ability to write good tests.
The plugin allows us to "rewire" the root scope of any given module, effectively allowing us to spy on or replace any modules it imports. This would allow us to override the behavior of something like visitUrl
so that it doesn't actually change window.location
which would break our karma environment.
This, however, came with many downsides:
-
It vastly increases the size of the karma-generated webpack bundle. Every module now has several new "rewire" functions added to it which are not able to be deduped by webpack. This increases build time and execution time.
-
It leads to a greater number of out-of-memory errors. Related to point 1 above, this increased size means webpack has to hold more data in memory for every module it handles, and the heap will sometimes run out of memory.
-
It adds a
default
export to any module which does not already have one. This causes problems with our current pattern of usingimport * as getters from './getters.js'
for Vuex resources becausedefault
will end up being an unexpected data type (object, not function). As a result we've had to addexport default function() {}
to each of our getters to ensure this doesn't cause Vuex to complain. -
It appears to mess up line-number associations in our sourcemaps. When setting breakpoints and debugging with Chrome's devtools, the line numbers are occasionally off due to the added functions from
babel-plugin-rewire
. (there appear to be other factors as well)
I'm fairly certain that we can create work-arounds for the few places in our test suite that depend on spyOnDependency
, and if/when we switch from karma/jasmine to jest we will have other options at our disposal to replace this functionality as well.