title: karma & jasmine & browserify state leaking?
body: <p>I have two karma tests (for vuejs) which work correctly if run on their own, but, if I run them as part of a suite, then one of them will fail.</p>
  
  <p>I'm quite new to JS testing so I suspect there's an issue with imports being shared somehow?! though that does seem a bit odd.</p>
  
  <p>Anyway, here are the two tests, if someone can explain why they don't work when run together I'd love to hear it.</p>
  
  <pre><code>import Vue from 'vue'
  import CastList from '../../../frontend/components/Cast-List.vue'
  
  describe('CastList2.vue', () =&gt; {
    var vm;
    var component;
  
    beforeEach(() =&gt; {
      CastList.data = function () {
        return {
          initialFetchComplete: true,
          refreshable: true
        }
      };
      vm = new Vue({
        template: '&lt;div&gt;&lt;test v-ref:component&gt;&lt;/test&gt;&lt;/div&gt;',
        components: { test: CastList }
      }).$mount();
  
      component = vm.$refs.component;
    })
  
    it('should have a refresh button', (done) =&gt; {
      expect(vm.$el.querySelector('button[name=refresh]')).toBeTruthy();
      component.refreshable = false;
      component.$nextTick(() =&gt; {
        expect(vm.$el.querySelector('button[name=refresh]')).toBeFalsy();
        done();
      });
    });
  });
  </code></pre>
  
  <p>and...</p>
  
  <pre><code>import Vue from 'vue'
  import CastList from '../../../frontend/components/Cast-List.vue'
  
  describe('CastList.vue', () =&gt; {
    var vm;
    var component;
  
    beforeEach(() =&gt; {
      CastList.data = function () {
        return {
          initialFetchComplete: true,
          refreshable: false
        }
      };
      vm = new Vue({
        template: '&lt;div&gt;&lt;test v-ref:component&gt;&lt;/test&gt;&lt;/div&gt;',
        components: { test: CastList }
      }).$mount();
  
      component = vm.$refs.component;
    })
  
    it('should have a refresh button', (done) =&gt; {
      expect(vm.$el.querySelector('button[name=refresh]')).toBeFalsy();
      component.refreshable = true;
      component.$nextTick(() =&gt; {
        expect(vm.$el.querySelector('button[name=refresh]')).toBeTruthy();
        done();
      });
    });
  });
  </code></pre>
  
  <p>my karma.conf looks like this:</p>
  
  <pre><code>// https://github.com/Nikku/karma-browserify
  module.exports = function (config) {
    config.set({
      browsers: ['PhantomJS'],
      frameworks: ['browserify', 'jasmine'],
      files: ['spec/frontend/**/*.js'],
      reporters: ['spec'],
      preprocessors: {
        'spec/frontend/**/*.js': ['browserify']
      },
      browserify: {
        debug: true,
        // needed to enable mocks
        plugin: [require('proxyquireify').plugin]
      },
      // if you want to continuously re-run tests on file-save,
      // replace the following line with `autoWatch: true`
      singleRun: true
    })
  }
  </code></pre>
  
  <p>I've named the two test files "Cast-List" and "Blah" and looking at the error message it does seem that the two files are conflicting.</p>
  
  <pre><code>1) should not have a refresh button
       CastList2.vue
       Expected null to be truthy.
  /var/folders/tz/9v8nv4t92mq5np77n3tqgr_00000gn/T/057de4a9f4398d04398e527f6243d941.browserify:14898:68 &lt;- spec/frontend/unit/Cast-List.spec.js:28:4
  /var/folders/tz/9v8nv4t92mq5np77n3tqgr_00000gn/T/057de4a9f4398d04398e527f6243d941.browserify:14856:11 &lt;- spec/frontend/unit/Blah.spec.js:28:6
  /var/folders/tz/9v8nv4t92mq5np77n3tqgr_00000gn/T/057de4a9f4398d04398e527f6243d941.browserify:5218:14 &lt;- node_modules/vue/dist/vue.common.js:470:0
  nextTickHandler@/var/folders/tz/9v8nv4t92mq5np77n3tqgr_00000gn/T/057de4a9f4398d04398e527f6243d941.browserify:5193:16 &lt;- node_modules/vue/dist/vue.common.js:445:0
  </code></pre>
  
  <p>I think the issue is that I'm being somewhat evil over-riding the imported <code>CastList</code> es6 module import, and <a href="http://exploringjs.com/es6/ch_modules.html" rel="nofollow">modules are live not copies</a>.</p>