Я создал специальный плагин rolesAndPermissions.ts
, чтобы проверить, есть ли у пользователей разрешение c. Для этого мы проверяем, что массив permissions
модуля vue-x
user
содержит указанное значение.
rolesAndPermissions.ts
import Vue from 'vue';
import store from '@/store';
export default {
install: (V: typeof Vue) => {
function can(this: Vue, permissionToCheck: string) {
console.log(store.state.user.permissions)
return store.state.user.permissions.includes(permissionToCheck);
}
V.prototype.$can = can;
},
};
rolesAndPermissions.test. js
import { createLocalVue } from '@/test/testSetup';
import flushPromises from 'flush-promises';
import createTestStore from '@/store/store-test-config';
import rolesAndPermissions from '../rolesAndPermissions';
describe('Roles and Permissions plugin', () => {
let store;
let localVue;
beforeEach(async () => {
store = createTestStore();
localVue = createLocalVue();
localVue.use(rolesAndPermissions);
await flushPromises();
});
describe('Plugin is correctly installed', () => {
test('adds an $can method to the Vue prototype', () => {
expect(typeof localVue.prototype.$can).toBe('function');
});
});
describe('Logic for each method', () => {
test('Can method return true if user have the tested permission', async () => {
store.commit('user/setPermissions', {
permissions: ['permissionB'],
});
await flushPromises();
console.log(store.state.user.permissions);
expect(localVue.prototype.$can('permissionB')).toBe(true);
});
});
});
Что работает
Первый тест работает, и метод $can
правильно добавлен в vue
прототип
Что не работает
Второй тест не работает. console
в тесте возвращает ['permissionB']
, что нормально. Однако console
, расположенный в rolesAndPermissions.ts
, возвращает []
Таким образом, при достижении плагина разрешение, которое я установил в тесте, не учитывается
Вопросы
- Правильно ли я поступаю, чтобы проверить это?
- Что я пропустил?