Mock Requests

Calma commiteiro rei, não vou falar do JSON-Server, mas vale a pena ficar!

Todo front passa pela necessidade de mockar as requisições de endpoint, as vezes porque o back ainda não finalizou seu trabalho, as vezes pra debugar e simular situações específicas e isso é muito comum no dia a dia.

Sim, o JSON-Server é incrível e muito simples de usar, mas dias atrás eu vivi um problema que era bem específico, e acabei descobrindo uma extensão pro browser incrível.

O Problema

Primeiro vou falar sobre o problema que tive, e vai entender porque o JSON-Server não serviria nessa situação.

Na aplicação eu tinha que consumir dois endpoints diferentes. Um primeiro que carregava algumas informações no dashboard, mas um dos cards nesse dash abre um Modal, que dependia de outro endpoint.

Tinhamos alguns tratamentos caso a API estivesse fora, mas num certo momento peguei um problema não previsto de delay no retorno da segunda API. Não deveria ser assim, mas foi!

O primeiro endpoint do Dashboard deu o retorno, mas a API do modal demorou alguns bons segundos, foi o tempo suficiente pra eu abrir o modal e não ter nada na table.

Demorei um pouco pra entender o que estava acontecendo, até que entendi que era um problema na API.

Mas aí surgiu um novo problema!!

Como simular isso?
Como mockar um delay no retorno.

Começei as pesquisas e achei o Tweak, uma extensão pro Chrome (e outros), que é muito simples e poderosa.

Minha ideia não é dar um treinamento, só quero compartilhar uma das funções que me chamaram muita atenção nessa extensão.

Delay no response

Aqui estava a solução do meu problema

Agora o Tweak passa a monitorar a URL e quando ela é requisitada, (1) ele cuida de gerenciar o tempo que determinei pra trazer o retorno da request, e (2) eu posso mockar os dados no corpo do response.

Outras features

• Posso ligar ou desligar determinado mock
• Posso mockar não apenas dados, mas os erros também, só alterar o status.
• Posso mockar os dados de forma bem simples, diretamente na extensão
• Posso mockar diferentes métodos (GET, POST...)

Essas são as coisas legais e simples de usar. Caso já conheça a extensão e tenha outras dicas compartilha aqui commiteiro.

Abraço!