Как я могу проверить этот код в шутку?
Я довольно новичок в издевательстве, и я понимаю утверждения и нахожу их легкими. Однако насмешка мучает мой мозг. У меня есть проект Vue в машинопись. Дело в том, что я застрял и не знаю, как тестировать вызовы API, которые я выставил в качестве классов обслуживания.
Мое мышление и дизайн кода
apiClient
Я создал один экземпляр axios под названием "apiClient", поэтому я могу иметь пользовательскую конфигурацию, доступную в любое время. Я сохранил это в корне моего проекта.
Сервисы
Я создал каждую конечную точку API в качестве" службы "в папке" Мои службы Каждая служба-это класс с кучей функций, которые я буду использовать для получения необходимых мне данных.
мой вопрос
Я понимаю, что вы хотите издеваться над всеми зависимостями, поэтому мне нужно начать с моего пользовательского экземпляра axios?
Нужно ли мне также издеваться над классом?
- Как я буду издеваться над этим в целом? Я знаю, что в разработке самый общий ответ: "это зависит", но я прошел через документы jest, и я не нахожу некоторые из них ясными. (Может быть, это я подхожу к нему за ответом)
- Что все это мне нужно, чтобы издеваться?
мой код
ExampleService.тс
import Approval from '@/interfaces/Approval';
import apiClient from '@/axiosConfig';
import { AxiosResponse } from 'axios';
export default class ExampleService {
// Approvals
public async getApprovals(id?: string) {
if (id != null || id !== undefined) {
return await apiClient
.get(`/api//approval/${id}`)
.then((response: AxiosResponse<Approval>) => {
return response.data;
});
} else {
return await apiClient
.get('/api/approval')
.then((response: AxiosResponse<Approval[]>) => {
return response.data;
});
}
}
public async postApproval(approval: Approval) {
return await apiClient
.post('/api/approval', approval);
}
public async putAppoval(id: string, approval: Approval) {
return await apiClient
.put(`/api/approval/${id}`, approval);
}
public async deleteApproval(id: string) {
return await apiClient
.delete(`/api/approval/${id}`);
}
}
CustomAxiosInstance.тс
import axios, { AxiosResponse } from 'axios';
const apiClient = axios.create({
baseURL: `${process.env.VUE_APP_ROOT_API}`,
});
export default apiClient;
мои надежды
Хотелось бы получить пример кода того, как я буду издеваться над этим, и некоторое объяснение, почему вы выбрали метод, который выбрали. Пожалуйста, критикуйте и мой код. Я только хочу совершенствоваться.
Ответы - Как я могу проверить этот код в шутку? / How do I go about testing this code in jest?

18.09.2019 04:32:23
Модульный тест для этого класса не имеет ничего общего с Vue.js
, вот решение, структура папок:
├── ExampleService.ts
├── __tests__
│ └── ExampleService.spec.ts
├── axiosConfig.ts
└── interfaces
└── Approval.ts
2 directories, 4 files
Модульный тест, ExampleService.spec.ts
:
import ExampleService from '../ExampleService';
import axios, { AxiosResponse } from 'axios';
jest.mock('axios', () => {
return {
create: jest.fn().mockReturnThis(),
get: jest.fn()
};
});
const exampleService = new ExampleService();
describe('ExampleService', () => {
beforeEach(() => {
(axios.create().get as jest.MockedFunction<typeof axios.get>).mockReset();
});
describe('#getApprovals', () => {
const mockedResponse: AxiosResponse = {
data: 'mocked data',
status: 200,
statusText: 'ok',
headers: {},
config: {}
};
it('should get approvals by id correctly', async () => {
(axios.create().get as jest.MockedFunction<typeof axios.get>).mockResolvedValueOnce(mockedResponse);
const actualValue = await exampleService.getApprovals('1');
expect(actualValue).toEqual(mockedResponse.data);
expect(axios.create().get).toBeCalledWith(`/api/approval/1`);
});
it('should get approvals correctly', async () => {
(axios.create().get as jest.MockedFunction<typeof axios.get>).mockResolvedValueOnce(mockedResponse);
const actualValue = await exampleService.getApprovals();
expect(actualValue).toEqual(mockedResponse.data);
expect(axios.create().get).toBeCalledWith(`/api/approval`);
});
});
});
Результат модульного теста с отчетом о покрытии:
PASS src/stackoverflow/57992553/__tests__/ExampleService.spec.ts (7.041s)
ExampleService
#getApprovals
✓ should get approvals by id correctly (14ms)
✓ should get approvals correctly (3ms)
-------------------|----------|----------|----------|----------|-------------------|
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s |
-------------------|----------|----------|----------|----------|-------------------|
All files | 73.91 | 53.85 | 57.14 | 83.33 | |
ExampleService.ts | 70 | 53.85 | 57.14 | 80 | 19,23,27 |
axiosConfig.ts | 100 | 100 | 100 | 100 | |
-------------------|----------|----------|----------|----------|-------------------|
Test Suites: 1 passed, 1 total
Tests: 2 passed, 2 total
Snapshots: 0 total
Time: 8.532s
Я только тестирую getApprovals
Вот законченная демонстрация: https://github.com/mrdulin/jest-codelab/tree/master/src/stackoverflow/57992553





