Сбросить Vue для каждого шутливого теста? - PullRequest
Новая
       52

Сбросить Vue для каждого шутливого теста?

0 голосов
/ 18 марта 2020

Я использую Vue JS с @ vue / test-utils и jest. Для моих тестов я звоню: 

let localVue = createLocalVue();
vueMount(MyComponent, { localVue: localVue, options });

Проблема в том, что я ссылаюсь на библиотеки, которые делают что-то вроде этого: 

import Vue from 'vue'
import Msal from 'vue-msal'
//...
Vue.use(Msal, {...});

Vue .use () регистрирует некоторые глобальные материал по прототипу и др. c. В целях тестирования мне нужно это, чтобы начать fre sh каждый тест. Единственное, о чем я мог подумать, это использовать mockImplementation () с jest для объекта Vue. Но я не совсем уверен, как я мог сделать это, если это вообще возможно.

Есть ли способ сделать это? Спасибо!

1 Ответ

0 голосов
/ 21 марта 2020

Это заняло у меня некоторое время, но вот как я решил это ... 

let setupComplete = false;
let setupFailure = false;
let testContext = {};

function resetTestContext() {
  Object.keys(testContext).forEach(function(key) { delete testContext[key]; });
}

function createTestContext(configureTestContext) {
  beforeEach(() => {
    jest.isolateModules(() => {
      setupFailure = true;
      jest.unmock('vue');
      resetTestContext();
      testContext.vueTestUtils = require('@vue/test-utils');
      testContext.vue = testContext.vueTestUtils.createLocalVue();
      jest.doMock('vue', () => testContext.vue);
      testContext.vuetify = require('vuetify');
      testContext.vue.use(testContext.vuetify);
      testContext.vuetifyInstance = new testContext.vuetify();
      if (configureTestContext) {
        configureTestContext(testContext);
      }
      setupComplete = true;
      setupFailure = false;
    });
  });

  afterEach(() => {
    setupComplete = false;
    resetTestContext();
    jest.resetModules();
    setupFailure = false;
  });

  return testContext;
},

То, что сделало это возможным, был метод jest.isolateModules (). При таком подходе Vue и его прототип, а также Vuetify полностью воссоздаются и обновляются с каждым тестовым примером.

Для того, чтобы он работал, тестовая версия c и библиотека, содержащая приведенную выше утилиту не может 'импортировать' Vue или любой модуль, который зависит от Vue. Вместо этого его необходимо указать в функции configureTestContext () или в самом тестовом примере.

Мои тестовые спецификации выглядят так: 

import createTestContext from '@/scripts/createTestContext'

describe('sample', () => {
  const testContext = createTestContext(function configureTestContext(testContext)
  {
    testContext.vueDependency = require('@/scripts/vueDependency').default;
  });

  test('demo', () => {
    // I added a helper to more easily do this in the test context...
    const sample = testContext.vueTestUtils.mount(require('@/components/Sample').default, {
      localVue: testContext.vue,
      vuetify: testContext.vuetifyInstance
    });

    expect(testContext.vueDependency.doSomething(sample)).toBe(true);
    expect(sample.isVueInstance()).toBeTruthy();
  });
});
...