Avançar para o conteúdo
SilktideAjuda

JavaScript personalizado

O personalizado é uma verificação que você mesmo cria. Você escreve um trecho de JavaScript, o Silktide o executa no navegador em todas as páginas que testa, e tudo o que o seu trecho indicar se torna um resultado nessas páginas.

Isso permite testar qualquer coisa importante para a sua organização que o Silktide não testa por padrão: uma regra de estilo interna, um trecho de código de rastreamento obrigatório, um componente obsoleto que não deveria mais aparecer e assim por diante.

Como corrigir

Os resultados dessa verificação significam o que o seu trecho determinar, portanto, a correção é definida por você. Escreva a message de cada resultado para que um colega que nunca tenha visto o trecho saiba o que alterar.

Como o Silktide testa isso

  1. O seu trecho é executado no navegador em cada página que o Silktide testa, depois que a página é carregada, como o corpo de uma função JavaScript async — portanto, você pode usar await e return diretamente.
  2. Tudo o que o seu trecho retornar será transformado em resultados:
    • Retorne uma matriz de objetos para informar vários resultados, cada um destacando um elemento na página:
// Informa todas as imagens com mais de 500px de largura como resultados
const wide = [...document.querySelectorAll('img')].filter(img => img.width > 500);
return wide.map(img => ({
  selector: 'img[src="' + img.getAttribute('src') + '"]',
  text: img.getAttribute('src'),
  severity: 'medium',
  message: 'A imagem tem mais de 500px de largura',
}));
  • Cada objeto pode incluir um selector (um seletor CSS para o elemento a destacar), text (o que mostrar para o resultado), severity (low, medium ou high) e uma message explicando o problema.
  • Retorne uma string simples para informar um único resultado de baixa gravidade para a página.
  • Retorne uma matriz vazia ou não retorne nada para informar que a página está correta.
  1. Se o trecho gerar um erro ou retornar algo não compatível, a verificação informará o erro na página para que você possa depurar o trecho.

Como o trecho é executado no navegador quando a página é baixada, alterar o trecho só terá efeito na próxima vez que as páginas forem testadas novamente, e não instantaneamente.

Solução de problemas

Meu trecho funciona no console do navegador, mas não aqui

O trecho é o corpo de uma função, portanto, instruções como return são esperadas no nível superior. Certifique-se de que o trecho retorne os resultados em vez de registrá-los com console.log, que não é coletado.

Os resultados não destacam o elemento correto

O selector retornado deve corresponder exclusivamente ao elemento da página no momento em que ela foi testada. Prefira atributos estáveis (IDs, atributos data-*) a seletores posicionais como :nth-child, que deixam de funcionar quando o conteúdo muda.

Saiba mais

Última atualização

Esta página foi útil?