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
- 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 usarawaitereturndiretamente. - 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,mediumouhigh) e umamessageexplicando 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.
- 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.