Тестирование: Jest, Mocha, chai, sinon, testing-library

📚 Почему тестирование — это круто?

Представь: ты написал супер-сложный код, и он работает... пока не работает. Внезапно что-то ломается, и ты тратишь часы, чтобы найти крошечную ошибку. Тестирование — это страховка от такого кошмара.

🔹 Преимущества тестирования:
✅ Предсказуемость: код работает так, как ты ожидаешь.
✅ Быстрый фидбэк: находишь баги до того, как их найдут пользователи.
✅ Рефакторинг без страха: меняешь код и уверен, что ничего не сломал.

💡 Совет: Начни с небольших тестов, даже если проект маленький. Привычка тестировать — навык топовых разработчиков!

🛠️ Инструменты тестирования: кто есть кто

🔹 Jest — фаворит React-разработчиков

Простой, мощный и «из коробки» готовый к работе. Подходит для unit- и integration-тестов.

test('2 + 2 должно быть 4', () => {
  expect(2 + 2).toBe(4);
});

Плюсы:
- Встроенные моки и spy-функции (jest.fn()).
- Поддержка TypeScript.
- Быстрый и удобный для фронтенда.

🔹 Mocha + Chai — классика гибкости

Mocha — это «движок» тестов, а Chai добавляет удобные assertions (проверки).

const { expect } = require('chai');

describe('Math operations', () => {
  it('should return 4 when adding 2 + 2', () => {
    expect(2 + 2).to.equal(4);
  });
});

Почему Mocha?
- Гибкость: можно подключать любые библиотеки (Chai для проверок, Sinon для моков).
- Подходит для Node.js и браузерных тестов.

🔹 Sinon — мастер моков и стабов

Помогает изолировать код, подменяя зависимости.

const sinon = require('sinon');
const userService = {
  getName: () => 'Danila'
};

test('should mock userService', () => {
  const stub = sinon.stub(userService, 'getName').returns('Mocked!');
  expect(userService.getName()).toBe('Mocked!');
  stub.restore(); // Важно очистить!
});

🔹 Testing Library — тестируй как пользователь

Фокусируется на поведении, а не на внутренней реализации. Идеально для React/Vue.

import { render, screen } from '@testing-library/react';
import Button from './Button';

test('button has correct text', () => {
  render(<Button>Click me</Button>);
  expect(screen.getByText('Click me')).toBeInTheDocument();
});

🎯 Как выбрать инструмент?

Инструмент Когда использовать? Пример использования
Jest React/Vue, простота expect(component).toMatchSnapshot()
Mocha + Chai Гибкость, Node.js expect(response).to.have.status(200)
Sinon Моки, стабы, таймеры sinon.fakeServer.create()
Testing Library Тесты, близкие к пользовательскому опыту screen.getByRole('button')

🚀 Практика: тестируем функцию

Допустим, у нас есть функция formatUser, которая обрабатывает данные пользователя:

function formatUser(user) {
  if (!user.name || !user.age) {
    throw new Error('Invalid user data');
  }
  return `${user.name}, ${user.age} years old`;
}

Тест с Jest:

test('formatUser returns correct string', () => {
  const user = { name: 'Danila', age: 30 };
  expect(formatUser(user)).toBe('Danila, 30 years old');
});

test('formatUser throws error if data is invalid', () => {
  expect(() => formatUser({})).toThrow('Invalid user data');
});

Тест с Mocha + Chai:

describe('formatUser', () => {
  it('returns correct string', () => {
    const user = { name: 'Danila', age: 30 };
    expect(formatUser(user)).to.equal('Danila, 30 years old');
  });

  it('throws error if data is invalid', () => {
    expect(() => formatUser({})).to.throw('Invalid user data');
  });
});

🔥 Что дальше?

  • Начни с малого: протестируй одну функцию сегодня.
  • Изучи Jest для фронтенда или Mocha для бэкенда.
  • Попробуй Testing Library, если работаешь с React.

Тестирование — это не «надо», а «круто». Чем больше тестов, тем увереннее ты себя чувствуешь! 🚀

Скрыть рекламу навсегда

🎥 YouTube: программирование простым языком

Канал, где я спокойно и по шагам объясняю сложные темы — без заумных терминов и лишней теории.

Подходит, если раньше «не заходило», но хочется наконец понять.

▶️ Смотреть курсы на YouTube