Saltar al contenido
SilktideAyuda

JavaScript personalizado

El personalizado es una comprobación que creas tú mismo. Escribes un fragmento de JavaScript, Silktide lo ejecuta en el navegador en cada página que prueba y lo que tu fragmento informe se convierte en hallazgos en esas páginas.

Esto permite comprobar cualquier cosa que le importe a tu organización y que Silktide no compruebe de forma nativa: una regla de estilo interna, un fragmento de seguimiento obligatorio, un componente obsoleto que ya no debería aparecer, etc.

Cómo solucionarlo

Los hallazgos de esta comprobación significan lo que tu fragmento decida que significan, así que la solución la defines tú. Escribe el message de cada hallazgo de forma que un compañero que nunca haya visto el fragmento sepa qué cambiar.

Cómo lo prueba Silktide

  1. Tu fragmento se ejecuta en el navegador en cada página que Silktide prueba, una vez que la página se ha cargado, como el cuerpo de una función de JavaScript async, por lo que puedes usar await y return directamente.
  2. Lo que tu fragmento devuelva se convierte en hallazgos:
    • Devuelve un array de objetos para informar de varios hallazgos, cada uno resaltando un elemento de la página:
\/\/ Informar de cada imagen con más de 500 px de ancho como un hallazgo
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: 'La imagen es más ancha que 500 px',
}));
  • Cada objeto puede incluir un selector (un selector CSS del elemento que se va a resaltar), text (lo que se mostrará para el hallazgo), severity (low, medium o high) y un message que explique el problema.
  • Devuelve una cadena simple para informar de un único hallazgo de baja gravedad en la página.
  • Devuelve un array vacío, o nada, para indicar que la página está bien.
  1. Si el fragmento produce un error o devuelve algo no compatible, la comprobación informa del error en la página para que puedas depurar el fragmento.

Como el fragmento se ejecuta en el navegador cuando se descarga la página, cambiar el fragmento surtirá efecto la próxima vez que se vuelvan a probar las páginas, no de forma instantánea.

Solución de problemas

Mi fragmento funciona en la consola del navegador pero no aquí

El fragmento es el cuerpo de una función, por lo que se esperan sentencias como return a nivel superior. Asegúrate de que el fragmento devuelve sus hallazgos en lugar de registrarlos con console.log, que no se recopila.

Los hallazgos no resaltan el elemento correcto

El selector que devuelvas debe coincidir de forma única con el elemento de la página en el momento en que se probó. Prefiere atributos estables (identificadores id, atributos data-*) frente a selectores posicionales como :nth-child, que dejan de funcionar cuando el contenido cambia.

Más información

Última actualización

¿Le ha resultado útil esta página?