Practico dos formas diferentes de probar las extensiones de mi navegador:

• Pruebas unitarias
• Prueba de integración

Introducción

Usaré la extensión cross-browser YouTube Lyrics by Rob W como ejemplo a lo largo de esta respuesta. El núcleo de esta extensión está escrito en JavaScript y organizado con módulos AMD. Un script de compilación genera los archivos de extensión para cada navegador. Con r. js , agilizo la inclusión de navegadores específicos módulos, como el de solicitudes HTTP de origen cruzado y almacenamiento persistente (para preferencias), y un módulo con toneladas de polyfills para IE.

La extensión inserta un panel con la letra de la canción reproducida actualmente en YouTube, Grooveshark y Spotify. No tengo control sobre estos sitios de terceros, por lo que necesito una forma automatizada de verificar que la extensión todavía funciona bien.

Flujo de trabajo

Durante el desarrollo:

1. Implementar / editar característica, y escribir una unidad prueba si la característica no es trivial.
2. Ejecute todas las pruebas unitarias para ver si algo se rompió. Si algo está mal, vuelva a 1.
3. Confirmar a git.

Antes de la liberación:

1. Ejecute todas las pruebas unitarias para verificar que los módulos individuales siguen funcionando.
2. Ejecute todas las pruebas de integración para verificar que la extensión en su conjunto sigue funcionando.
3. Bump versiones, construir extensiones.
4. Subir actualización a la extensión oficial galerías y mi sitio web (las extensiones de Safari e IE tienen que ser alojadas por ti mismo) y confirmar a git.

Pruebas unitarias

Yo uso mocha + esperar.js para escribir pruebas. No pruebo todos los métodos para cada módulo, solo los que importan. Por ejemplo:

• El método de análisis DOM. La mayoría de los métodos de análisis de DOM en la naturaleza (incluyendo jQuery) son defectuosos: Se cargan los recursos externos y se ejecuta JavaScript.
  Verifico que el DOM el método de análisis analiza correctamente DOM sin efectos secundarios negativos.

• El módulo de preferencias: Compruebo que los datos se pueden guardar y devolver.

• Mi extensión obtiene letras de fuentes externas. Estas fuentes se definen en módulos separados. Estas definiciones son reconocidas y utilizadas por el módulo InfoProvider, que toma una consulta (caja negra) y produce los resultados de la búsqueda.

  • Primero pruebo si el módulo InfoProvider funciona correctamente.
  • Entonces, para cada una de las 17 fuentes, paso una consulta predefinida a la fuente (con InfoProvider) y verifico que se esperan los resultados:
    • La consulta tiene éxito
    • El título de la canción devuelta coincide (por aplicando un algoritmo de similitud de palabras)
    • La longitud de la letra devuelta cae dentro del rango esperado.

• Si la interfaz de usuario no está obviamente rota, por ejemplo, haciendo clic en el botón Cerrar.

Estas pruebas se pueden ejecutar directamente desde un servidor local o dentro de una extensión de navegador. La ventaja del servidor local es que puede editar la prueba y actualizar el navegador para ver los resultados. Si todas estas pruebas pasan, ejecutaré las pruebas desde la extensión del navegador.
Al pasar un parámetro adicional debug a mi script de compilación, las pruebas unitarias se incluyen con mi extensión.

Ejecutar las pruebas dentro de una página web no es suficiente, porque el entorno de la extensión puede diferir de la página normal. Por ejemplo, en una extensión Opera 12, no hay un objeto global location.

Observación: No incluyo las pruebas en la compilación de la versión. La mayoría de los usuarios no se esfuerzan por informar e investigar errores, solo darán una calificación baja y dirán algo como "No funciona". Asegúrese de que su extensión funciona sin errores obvios antes de enviarla.

Resumen

• Ver los módulos como cajas negras. No te importa lo que hay dentro, siempre y cuando se espera que la salida coincida con un determinado entrada.
• Comience con probar las partes críticas de su extensión.
• Asegúrese de que las pruebas se puedan compilar y ejecutar fácilmente, posiblemente en un entorno que no sea de extensión.
• No olvide ejecutar las pruebas dentro del contexto de ejecución de la extensión, para asegurarse de que no haya restricciones o condiciones inesperadas dentro del contexto de la extensión que rompan su código.

Pruebas de integración

Uso Selenium 2 para probar si mi extensión todavía funciona en YouTube, Grooveshark (3x) y Spotify.

Inicialmente, solo usé el IDE de Selenio para registrar pruebas y ver si funcionaba. Eso fue bien, hasta que necesité más flexibilidad: quería ejecutar una prueba condicionalmente dependiendo de si la cuenta de prueba estaba iniciada o no. Eso no es posible con el IDE Selenium predeterminado (se dice que es posible con el complemento FlowControl - no lo he intentado).

El Selenium IDE ofrece una opción para exportar las pruebas existentes en otros formatos, incluyendo pruebas JUnit 4 (Java). Desafortunadamente, este resultado no fue satisfactorio. Muchos comandos no fueron reconocidos.

Así que abandoné el IDE de Selenio y cambié a Selenio.
Tenga en cuenta que cuando busque "Selenium", encontrará información sobre Selenium RC (Selenium 1) y Selenium WebDriver (Selenium 2). El primero es el viejo y obsoleto, el segundo (Selenium WebDriver) debe usarse para nuevos proyectos.

Una vez que descubriste cómo funciona la documentación, es bastante fácil de usar.
Prefiero la documentación en la página del proyecto, porque es generalmente concisa (la wiki ) y completa (la documentación de Java ).

Si quieres empezar rápidamente, lee la página wiki de Getting Started. Si tiene tiempo libre, consulte la documentación en SeleniumHQ, en particular el Selenium WebDriver y WebDriver: Advanced Usage.
Selenium Grid también vale la pena lectura. Esta característica le permite distribuir pruebas entre diferentes máquinas (virtuales). Excelente si desea probar su extensión en IE8, 9 y 10, simultáneamente (para ejecutar varias versiones de Internet Explorer, necesita virtualización).

Automatizar las pruebas es bueno. ¿Qué es más agradable? Automatización de la instalación de extensiones!
El ChromeDriver y FirefoxDriver admite la instalación de extensiones, como se ve en este ejemplo.

Para el SafariDriver, he escrito dos clases para instalar una extensión de Safari personalizada. Lo he publicado y enviado un PR a Selenium, por lo que podría estar disponible para todos en el futuro: https://github.com/SeleniumHQ/selenium/pull/87

El OperaDriver no soporta la instalación de extensiones personalizadas (técnicamente, debería ser posible).
Tenga en cuenta que con el advenimiento de Cromo-powered Opera , el el viejo OperaDriver ya no funciona.

Hay un controlador de Internet Explorer , y este definitivamente no permite instalar una extensión personalizada. Internet Explorer no tiene soporte incorporado para extensiones. Las extensiones se instalan a través de instaladores MSI o EXE, que ni siquiera están integrados en Internet Explorer. Por lo tanto, con el fin de instalar automáticamente su extensión en IE, es necesario ser capaz de ejecutar silenciosamente un instalador que instala su plugin de IE. No he probé esto todavía.