Use o painel Condições de solicitação para testar o comportamento da página se determinados recursos, como imagens ou folhas de estilo, não forem carregados ou se o carregamento for mais lento.
Visão geral
Com o painel Condições de solicitação, é possível bloquear vários recursos ou "padrões" ao mesmo tempo e alternar entre eles em uma lista. Também é possível bloquear domínios ou URLs de solicitações de rede no painel Rede. Os padrões correspondentes vão aparecer no gaveteiro Condições de solicitação.
Com a gaveta Condições de solicitação, é possível:
- Adicione ou remova padrões.
- Edite padrões.
- Remova todos os padrões.
- Ative ou desative o bloqueio ou a limitação de solicitações de rede. Depois de ativado, é possível ativar ou desativar o bloqueio ou a limitação de um padrão individual.
Fechar o DevTools desativa o bloqueio e a limitação de solicitações de rede. Você precisa abrir o painel e ativar o bloqueio de novo. No entanto, o DevTools salva os padrões mesmo depois que o navegador é fechado.
Bloquear ou limitar uma solicitação de rede
É possível bloquear solicitações de rede no painel Rede do DevTools.
- No painel Rede, na seção Nome, clique com o botão direito do mouse em uma solicitação e selecione "Bloquear solicitação" ou "Limitar solicitação".
- O painel Condições de solicitação é aberto automaticamente e lista o padrão relevante como bloqueado ou limitado. Isso também ativa automaticamente a caixa de seleção "Ativar bloqueio e limitação".
Entender quais solicitações são limitadas ou bloqueadas
Para distinguir entre solicitações lentas e aquelas que estão sendo limitadas pelo DevTools, verifique os painéis "Rede" e "Desempenho".
No painel "Rede":
- Solicitações bloqueadas:verifique a coluna Status. As solicitações bloqueadas vão aparecer explicitamente (blocked:devtools) e em vermelho.
- Solicitações limitadas:um ícone dourado ou marrom aparece ao lado do URL da solicitação. Você também pode verificar a coluna Hora. O ícone vai aparecer ao lado do tempo.
- Passe o cursor sobre o ícone para ver exatamente qual condição de rede foi aplicada.
- Clique no ícone para abrir imediatamente a gaveta Condições de solicitação e destacar a regra responsável pela limitação.
No painel "Performance": Você também pode procurar condições de rede ao gravar um perfil de performance. Para fazer isso, siga estas etapas:
- Acesse o painel Performance e capture uma gravação.
- Localize a solicitação na faixa "Rede".
- Passe o cursor sobre a solicitação para ver uma dica de ferramenta com detalhes sobre as condições de rede aplicadas.
Abrir a gaveta de condições de solicitação
Para abrir a gaveta Condições de solicitação:
- Abra o DevTools.
- Abra o menu de comandos pressionando:
- macOS: Command+Shift+P
- Windows, Linux, ChromeOS: Control+Shift+P
- Comece a digitar
Request conditions, selecione Mostrar condições de solicitação e pressione Enter. O DevTools mostra o painel Condições de solicitação na parte de baixo da janela do DevTools.
Como alternativa, no canto superior direito, selecione Mais ferramentas > Condições de solicitação.
Modificar uma configuração de limitação
Para personalizar uma configuração de limitação:
- Abra o painel Condições de solicitação e acesse a solicitação específica.
- Na coluna "Restrição", selecione uma predefinição no menu suspenso (por exemplo, "3G lento", "3G rápido"). Também é possível adicionar um perfil de rede personalizado.
Modificar um padrão de solicitação
Para modificar um padrão, no painel Condições de solicitação, clique no botão Editar ao lado do padrão, faça as mudanças e clique em Salvar. Você também pode clicar no botão Adicionar condição para criar uma.
Ao inserir um padrão de URL, você pode usar caracteres curinga (*) para corresponder a partes dinâmicas do URL. Por exemplo, *://example.com vai corresponder a todas as solicitações de API para esse domínio. É possível usar caracteres curinga para aplicar condições a vários recursos de uma só vez usando a API URL Pattern.
Alternar o bloqueio de solicitações de rede
A caixa de seleção Ativar bloqueio e limitação permite ativar e desativar o bloqueio de solicitações de rede para todos os padrões de uma só vez.
Reordenar padrões de correspondência de URL
Se uma solicitação corresponder a vários padrões, o DevTools vai aplicar a primeira regra encontrada. Para controlar essa precedência, clique nos botões de seta ao lado da regra específica no gaveta Condições de solicitação e mova as regras de alta prioridade para a parte de cima da lista.
Remover um padrão de bloqueio de solicitações de rede
Para remover um padrão específico de bloqueio de solicitações de rede da lista:
- No painel Condições de solicitação, clique no botão Excluir.
Para remover todos os padrões de bloqueio de solicitações de rede, clique no botão Remover todos os padrões de bloqueio de rede na barra de atividades.