Mocking é o processo de substituir dados reais por dados falsos que simulam o comportamento de componentes reais. Isso permite que testadores e desenvolvedores testem componentes específicos na aplicação sem precisar depender de dependências externas. Um caso comum de uso para simular dados seria ao lidar com chamadas de API. Imagine que você tenha uma chamada fetch assim na sua aplicação:

export const postService = {
  async getPosts() {
    const response = await fetch("https://api.example.com/posts");
    return response.json();
  },
};

Se você precisar testar a função postService, pode simular a resposta da API em vez de fazer chamadas contínuas à API para buscar os dados. Buscar de uma API leva tempo e depende de fatores externos como disponibilidade da rede e respostas do servidor. Simular a resposta da API elimina esses fatores externos e permite que os testadores trabalhem com um conjunto de dados previsível e controlado. Aqui está um exemplo de resposta simulada da API:

[
  {
    "id": 1,
    "title": "Understanding Async/Await in JavaScript",
    "content": "Async/Await makes asynchronous code look and behave like synchronous code...",
    "author": "Jane Doe",
    "created_at": "2025-04-10T14:32:00Z"
  },
  {
    "id": 2,
    "title": "10 Tips for Writing Clean Code",
    "content": "Clean code is not just about code formatting. It involves naming, architecture...",
    "author": "John Smith",
    "created_at": "2025-04-08T09:21:00Z"
  },
  {
    "id": 3,
    "title": "Exploring React 19 Features",
    "content": "React 19 comes with exciting features like new hooks and better performance...",
    "author": "Alex Lee",
    "created_at": "2025-04-07T18:47:00Z"
  }
]

Agora que entendemos o que é mocking, vamos compará-lo com stubbing. Stubs são objetos que retornam respostas pré-definidas ou dados fictícios para um comportamento esperado em uma aplicação. Por exemplo, você pode simular o comportamento de uma conexão de banco de dados nos seus testes sem precisar depender de uma conexão de banco de dados real. Aqui está um exemplo de um stub no Jest:

import { postService } from "./postService";
import { db } from "./db";

jest.mock("./db", () => ({
  db: {
    fetchPosts: jest.fn(),
  },
}));

test("should return stubbed posts", async () => {
  const fakePosts = [
    { id: 1, title: "Stubbed Post", content: "This is a stubbed post." },
  ];

  db.fetchPosts.mockResolvedValue(fakePosts);

  const posts = await postService.getPosts();

  expect(posts).toEqual(fakePosts);
});

db.fetchPosts.mockResolvedValue(fakePosts); é o stub neste exemplo. O último componente a ser discutido são os fakes. Fakes são versões simplificadas de componentes reais sem a complexidade ou efeitos colaterais da coisa real. Por exemplo, você pode simular um banco de dados armazenando os dados na memória em vez de interagir com o banco de dados real. Isso permitirá que você simule operações de banco de dados na memória, o que será muito mais rápido do que lidar com o banco de dados real. Outro exemplo comum seria usar fakes ao trabalhar com sistemas de arquivos. Você pode criar um sistema de arquivos falso no lugar do real quando se trata de testes. À medida que você continua a desenvolver aplicações de software mais complexas, considere usar mocks, stubs ou fakes quando apropriado em seus testes.