Как протестировать магазин плагинов vuex - PullRequest
Новая
       8

Как протестировать магазин плагинов vuex

0 голосов
/ 05 июля 2018

Я использую jest для тестирования приложения vue, у меня есть сомнения, как я могу проверить код плагина. Вот код, который я пытаюсь проверить: 

export const persistPlugin = store => {
  store.subscribe(async (mutation, state) => {
    // filter all keys that start with `__`
    const _state = omitPrivate(state);
    const storedState = await storage.get('state');
    if (isEqual(_state, storedState)) return;
    storage.set(store, 'state', _state);
  });
};

То, на чем я застрял, это часть store.subscribe. store передается как аргумент метода плагина, но я не знаю, как вызвать этот метод из теста - это wat, который вызывает функциональный блок плагина.

1 Ответ

0 голосов
/ 16 июня 2019

Вы можете использовать testPlugin помощник для этого. Вот пример, который вы можете адаптировать для проверки состояния. Я предпочитаю отслеживать мутации вместо прямых изменений состояния: 

import { persistPlugin } from "@/store";

export const testPlugin = (plugin, state, expectedMutations, done) => {
  let count = 1;

  // mock commit
  const commit = (type, payload) => {
    const mutation = expectedMutations[count];

    try {
      expect(type).toEqual(mutation.type);
      if (payload) {
        expect(payload).toEqual(mutation.payload);
      }
    } catch (error) {
      done(error);
    }

    count++;
    if (count >= expectedMutations.length) {
      done();
    }
  };

  // call the action with mocked store and arguments
  plugin({
    commit,
    state,
    subscribe: cb =>
      cb(expectedMutations[count - 1], expectedMutations[count - 1].payload)
  });

  // check if no mutations should have been dispatched
  if (expectedMutations.length === 1) {
    expect(count).toEqual(1);
    done();
  }
};


describe("plugins", () => {
  it("commits mutations for some cases", done => {
    testPlugin(
      persistPlugin,
      { resume: { firstName: "Old Name" } },
      [{ type: "updateResume", payload: { firstName: "New Name" } }], // This is mutation which we pass to plugin, this is payload for plugin handler
      [{ type: "updateResume", payload: { firstName: "New Name" } }], // This is mutation we expects plugin will commit
      done
    );
  });
});
...