Como desabilitar JavaScript no Chrome (Chrome Developer Tools)

Neste artigo você vai aprender a como desabilitar JavaScript no Chrome, para realizar testes sem os scripts habilitados!

desabilitar JavaScript no Chrome capa

Fala programador(a), beleza? Bora aprender mais sobre o Chrome!

Para desabilitar a execução de scripts pelo Chrome Developer Tools teremos que seguir alguns passos

O primeiro é abrir o Developer Tools, o que pode ser feito com a tecla F12

Depois você deve clicar no ícone de engrenagem, na parte superior direita do Tools

Vá na aba de Preferências, é a aba que abre por default

Procure pela seção Debugger ou Depuração, onde há uma ou mais checkboxes

A primeira deve ser “Disable JavaScript”, você deve selecioná-la

Após este procedimento o JS deve estar desabilitado do seu navegador

Como indicado pelo Chrome, é uma opção de debug, ou seja, para testar seu site com o JS desativado

Geralmente desenvolvedores colocam a tag noscript para prever estes casos

Formação Claude Code
Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

  • 116 aulas
  • 4 projetos
  • 9h 23min

Conclusão

Neste artigo você aprendeu a como desabilitar JavaScript no Chrome

Utilizamos o console do Developer Tools, que possui uma opção para desativar a execução de scripts no navegador

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologiasO link acima contém um cupom de desconto para os cursos!

Por que desabilitar o JavaScript no Chrome?

Antes do passo a passo, vale entender o porquê

Desligar o JS por um instante é o jeito mais rápido de ver o que da sua página existe SEM depender de script

E isso responde várias perguntas de uma vez só:

  • o conteúdo principal continua aparecendo, ou a tela fica em branco?
  • os links funcionam como link de verdade, ou só respondem a um clique via script?
  • o formulário envia, ou trava?
  • a navegação continua possível pelo teclado?

Se você já mexeu com acessibilidade, o raciocínio é o mesmo: a página precisa entregar o essencial mesmo quando alguma peça falha

Não é sobre odiar JavaScript, é sobre saber em que ponto a sua página deixa de existir sem ele 🙂

Como saber se o JavaScript foi desabilitado mesmo?

Recarregue a página e olhe justamente para as partes que dependem de script: menu que abre no clique, carrossel, botão de "carregar mais", conteúdo que só aparece depois que a tela já desenhou

Se tudo isso parou, deu certo

Um jeito ainda mais direto de sentir a diferença: escolha um site que você sabe que é pesado de JS e compare o antes e o depois

Bora ver na prática? Abre o seu próprio projeto e faz o teste, quase sempre é uma surpresa haha

Como reativar o JavaScript depois do teste:

É a mesma caixa de seleção do passo anterior: volte nela e desmarque

Tome cuidado! Essa é a pegadinha clássica do tutorial: a pessoa esquece a opção marcada, volta a navegar normal e acha que a internet inteira quebrou

Então fica a regra de bolso: se algum site começar a se comportar de um jeito estranho logo depois do seu teste, a primeira coisa a conferir é essa caixinha 😀

O que é a tag noscript?

O post citou a noscript ali em cima, então bora abrir esse parêntese

Que tag é essa? É o pedaço de HTML que o navegador só mostra quando o JavaScript não roda

Ou seja, é o seu plano B: em vez da tela em branco, o visitante lê um aviso ou vê uma versão simples do conteúdo

Na prática, ela fica mais ou menos assim:

<noscript>
Este site precisa de JavaScript para funcionar por completo
</noscript>

E é exatamente aqui que o teste deste artigo brilha: sem desligar os scripts, você nunca vai ver o seu próprio noscript entrando em cena

E se a opção não estiver onde este artigo diz?

O Chrome muda de visual de tempos em tempos, e o painel de desenvolvedor muda junto

Então, se o caminho descrito aqui não bater com o que você está vendo na sua tela, não se apega ao lugar, se apega ao NOME da opção: "Disable JavaScript"

Procure por esse texto nas preferências do painel, o rótulo costuma sobreviver às reorganizações de layout muito mais que a posição do botão

Mesma lógica para a engrenagem: ela pode mudar de canto, o que não muda é que a configuração vive dentro das preferências do próprio painel

Perguntas frequentes sobre desabilitar o JavaScript

Isso afeta o site para os outros visitantes?

Não

O que você faz no painel de desenvolvedor é um teste local, do lado do seu navegador

O site em si continua igual, o que muda é só a forma como a SUA janela monta a página

Testar com o JS desligado é a mesma coisa que ver o site como o Google vê?

Não é a mesma coisa, e prometer isso seria enganação

O que o teste entrega é uma pista muito boa: o que existe na sua página ANTES de qualquer script rodar

Se o conteúdo principal só aparece depois do JS, isso é um sinal para investigar, não um veredito

Por que meu site fica completamente em branco sem JavaScript?

Geralmente porque a página é montada inteira no navegador, e não entregue já pronta em HTML

Não é necessariamente errado, mas é bom saber

É aí que entram a noscript e a decisão de entregar pelo menos o essencial sem depender de script

Preciso desabilitar o JavaScript para testar acessibilidade?

Não é obrigatório, e nem cobre tudo

Mas é um teste rápido e honesto: se a página some sem script, provavelmente ela também quebra em situações mais comuns do que se imagina, tipo conexão ruim e script que não carrega

Leia também

Escrito por | Matheus Battisti

Matheus Battisti
Fundador da Hora de Codar

Programador apaixonado pelo mundo das tecnologias, sempre buscando em aprender e se aprofundar em linguagens, frameworks e o que mais for necessário para executar um bom trabalho. Agora tem uma nova missão que é de passar seu conhecimento adiante para formar novos programadores e especializar mais os que já são.

Subscribe
Notify of
guest

0 Comentários
Oldest
Newest Most Voted

Formações

Formação Vibe Coding

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

  • 474 aulas
  • 20 projetos
  • 39h 27min

Blog | Mais populares