Identificar erros de layout ocasionados por arquivos JavaScript

Aparência da Loja

VTEX Team

VTEX Team

Última atualização

Uma maneira de identificar se um erro apresentado no layout é ocasionado por um controle padrão da VTEX ou por um arquivo Javascript personalizado na loja é utilizar o /tools.html.

Para isso faça os seguintes passos :

  1. Para desabilitar o JS da página basta colocar o /tools.html no fim da URL. Ex: {AccountName}.vtexcommercestable.com.br/tools.html
  2. Clique em Disable na aba Client JavaScript is.
  3. Após isso, retire o /tools.html da URL e atualize a página.

Se o erro que estava sendo apresentado é ocasionado por um Javascript externo, o mesmo não irá aparecer mais. Com isso é necessário ajustar esse arquivo.

Sobre arquivos JavaScript inseridos na página é importante seguir algumas premissas:

  • Utilizar JavaScript externo, e não inline.
  • Verificar se o mesmo não irá interferi na performance da loja.

Lembrando que temos também o Vtex Speed ferramenta que possibilita o desenvolvimento local com um tempo de cache menor. Vtex Speed - Download e Execução

Para investigar possíveis problemas envolvendo CSS recomendamos o uso do plugin WebDeveloper - veja aqui algumas ferramentas para melhorar a debugar problemas de customização.