2010-03-17 21 views
7

Estoy buscando una herramienta de prueba de regresión visual para la refactorización de CSS y ver si hay un comportamiento de cascada involuntario en un sitio web.herramienta de regresión CSS?

Idealmente, la herramienta que puede rastrear un sitio web (incluso localmente) y tomar instantáneas de cada página y almacenarla en un único repositorio.

Cuando se ejecuta por segunda vez, mostrará las páginas que son visualmente diferentes desde la última vez que se ejecutó.

Aún mejor:

  1. si puede mostrar la vista XOR overlapper de la versión 2 de la página.
  2. comparan los resultados de representación de diferentes navegadores (casi como una función de comparación automática de Microsoft Expression Web).

Respuesta

0

Consulte Litmus.

Arrastrará su sitio y tomará capturas de pantalla cerca de cada navegador que desee.

Además de la funcionalidad principal Litmus también le permite rastrear errores, iniciar sesión en sitios privados y le permite publicar informes de compatibilidad de sus pruebas.

+0

Parece que tiene los problemas que tienen los disparos en el navegador (el sitio debe estar en línea y no en el rastreador). Pero parece lo suficientemente extensible con soporte API. lo verá. Gracias – ronaldwidha

+2

Litmus ha pivotado para probar correos electrónicos HTML en lugar de sitios web/páginas web. – cvrebert

1

Echa un vistazo Browser Shots. Este es un servicio gratuito.

Existen algunas restricciones sobre la cantidad de pruebas que puede ejecutar cada día como usuario libre. Pero a diferencia de Litmus; puede ejecutar pruebas en todos los navegadores compatibles: Litmus solo permite que los usuarios libres prueben sus sitios web en Internet Explorer 7 y Mozilla Firefox 2.

+0

Parece que Browser Shots está teniendo algunas dificultades técnicas en este momento. He usado el servicio por mí mismo durante aproximadamente un año, y esta es la primera vez que encuentro algún problema. – roosteronacid

+0

Parece estar de nuevo ahora. Los problemas que tengo con él son: 1. el sitio que quiero verificar debe estar en línea 2. no tiene un rastreador integrado. El segundo punto que puedo tratar, mientras que el primero es un factor decisivo. Gracias por la respuesta sin embargo. es bueno saberlo, pero no es aplicable en mi situación. – ronaldwidha

+0

Sin preocupaciones. Siempre estoy contento de ayudar :) – roosteronacid

0

Lo que ha descrito es exactamente lo que Mogotest hace. Podemos iniciar sesión en su sitio, tomar capturas de pantalla para todas las páginas que ha configurado y hacer una comparación automática utilizando los principios de Web Consistency Testing.

También mantenemos un registro completo de la historia para que podamos decirle exactamente cuándo algo se rompió (y qué aspecto tenía su sitio en ese momento) y aún más frío, podemos detectar cuándo ha arreglado algo. Y finalmente, tomamos instantáneamente su código en cada ejecución de prueba para que podamos mostrarle exactamente qué cambió para cada problema.

Disculpa la naturaleza de auto promoción de esta respuesta. Solo quería ser minucioso al abordar lo que estás buscando.

+0

Desafortunadamente, Mogotest ha [desde que cerró.] (Http://nirvdrum.com/2014/11/20/open-sourcing-mogotest.html) – cvrebert

+0

Desafortunadamente, terminé cerrando Mogotest. Hice una gran cantidad del código disponible en https://bitbucket.org/mogotest/ y el sitio de prueba de consistencia web todavía está disponible (la información sigue siendo bastante relevante). – nirvdrum

6

Mi favorito actual es WebDriverCSS en combinación con BrowserStack Automate API. Este par de herramientas permite realizar pruebas de regresión multiplataforma y multi-navegador a través de la amplia gama de dispositivos compatibles con BrowserStack. Requiere escribir código pero es mucho más completo que cualquier solución vinculada a Phantom o Slimer.

Si está de acuerdo con que un antiguo WebKit sea su única prueba UA, aquí hay una gran reseña en CSS regression testing usando PhantomCSS. Su ejemplo básico proporciona exactamente lo que la pregunta original deseaba: diferencias visuales entre dos commits.

Para una herramienta más simple que no requiere codificación (solo configuración YAML), apunto a las personas hacia Wraith con más frecuencia que PhantomCSS. Responda a la respuesta de @ ericcraio si le gusta Wraith y no quiere escribir el código de Casper.