Como identificar qual arquivo JavaScript está sendo aplicado em uma página?

Aparência da Loja

Thomas Low-Beer

Thomas Low-Beer

Última atualização

A plataforma VTEX é extremamente flexível. Por isso, é comum que os clientes tenham diversas customizações no front-end do e-commerce. Diferentes ferramentas podem ser responsáveis por essas customizações, entre as quais o Google Tag Manager ou mesmo arquivos JavaScript incluídos no Portal.

Muitas vezes, o número de customizações é tão grande que, com o tempo, o próprio lojista esquece o que cada um desses arquivos faz, certo?

Uma forma de identificar qual arquivo javascript está aplicando determinado efeito é por meio do caminho abaixo.

Este exemplo seria usado para mudar o texto contido num efeito de “mouse over”.

O texto atual é “Você ainda não possui produtos no carrinho”, e queremos encontrar o JavaScript responsável por essa customização para conseguir alterá-lo.

  1. Com sua página aberta, clique em F12 ou escolha Inspecionar página;
  2. Abra a aba Network;
  3. Use o campo de busca do console e insira a frase “Você ainda não possui produtos no carrinho”;
  4. A lista mostrará o arquivo que contém a string buscada;
  5. Procure pelo arquivo no CMS, pelo seguinte caminho:

CMS -> Portal -> Gerenciamento de Arquivos -> .js -> _nome_do_arquivo_.js

Caso queira investigar se uma customização de javascript está causando um erro de layout, clique aqui para saber como identificar erros de JavaScript.