Introducción a las pruebas unitarias en WordPress – JavaScript con Qunit

¿Todavía estás interesado en las pruebas unitarias en WordPress? Es bueno, porque hoy pasaremos de PHP a JavaScript y, por lo tanto, en el frente! Bastante genial, ¿verdad? ? En esta publicación presentaré algunos cuadros para la prueba unitaria del código JavaScript y veré un ejemplo paso a paso. ¿Y ahora que eres un (casi) experto en pruebas unitarias?, Compartiré algunos videos de YouTube que me gustaron y te enseñaré más perspectivas sobre el tema. Pero antes de sumergirnos en el mundo de JavaScript … la solución de nuestro problema PhPunit en la publicación anterior que le di alguna tarea, ¿recuerdas? Esto es lo que te pedí que hicieras:
Reescribe la función nelivat_get_vat de modo que las cantidades de dinero expresadas como cadenas de caracteres como 15.20, 1,000 o € 3 (donde el separador opcional es. El separador decimal es, podría ser un símbolo de moneda extranjera) no hay prueba. La función original que presenté fue:
y la prueba fallida fue:
Entonces, ¿cómo resolvemos eso? La idea es bastante simple: tienes una cadena con algunos caracteres “adicionales” que necesitas para escapar (como los separadores de miles o moneda) y cambia el separador decimal de una coma a un punto. Si hace esto, el número puede ser entendido por PHP como un número flotante y, por lo tanto, se puede calcular su IVA. La función resultante se ve así:
Y los resultados que obtienes después de ejecutar la prueba nuevamente son:

¿Ver? ¿Ahora la prueba pasa y sabemos que nuestra función cumple con nuestros requisitos? Marcos de prueba de JavaScript Si desea probar PHP, la solución más obvia es PHAPIT: no hay alternativas “reales” para probar su unidad. Pero si hablamos de JavaScript, la realidad es completamente diferente: hay muchas opciones que puede elegir. En StateFJS hay una comparación detallada de los cuadros de prueba de JavaScript y, hombre, es enorme! Comparación entre diferentes pruebas de JavaScript (fuente). Moca Mocha es un marco de prueba JavaScript rico en funciones, que puede ejecutar Node.js y su navegador, creado para ser un conjunto de pruebas simple, extensible y rápida. Se utiliza para una prueba de integración unitaria y también es un excelente candidato para el comportamiento basado en el comportamiento (BDD).

Mocha es una prueba fantástica de Javascript Jasmie Otro marco de moda es Jasmine. Como dicen en su sitio, es un marco de desarrollo basado en las pruebas del código JavaScript. Jasmine no requiere una cúpula, no tiene adicciones y tiene una sintaxis limpia y clara. Su documentación también es bastante buena, por lo que puede aprender rápidamente a usarla.

Jasmine es otro marco de prueba de moda para JavaScript. Si te preguntas cuál es mejor, hay muchas publicaciones de blog que las comparan (y otras). Pero si quieres mi opinión, debes probarlos todos y mantenerte el que te haga más feliz. Sin embargo, es posible que desee echar un vistazo a Qunit.

QUNIT QUNIT es el último marco de prueba de JavaScript que quería mencionar hoy. Su objetivo era probar a JQue (estás familiarizado con él, ¿verdad?) Y ha estado con nosotros durante algún tiempo. Por lo que puedo darme cuenta, parece que Qunit ha perdido la espalda, pero vale la pena hablar de ello, porque Qunit es el marco utilizado en WordPress para probar su JavaScript. Qunit sigue siendo un marco de prueba de JavaScript. Es especial porque (a) nació para probar jquey y (b) se usa actualmente en el núcleo de WordPress. Configuración de nuestra primera prueba QUNIT para suponer que tenemos nuestra querida función NELI_GET_VAT escrita en un archivo JavaScript llamado funciones.js:
Como puede ver, no hay nada elegante: es exactamente la función que vi en PHP, pero escrita en JavaScript. Por lo tanto, esta función se comportará (probablemente) como la contraparte de PHP, calculará el IVA del 21% de cualquier cantidad de dinero dada, independientemente de su formato. La función acepta tanto números como cadenas, y las cadenas de caracteres pueden … bueno, ya está familiarizado con nuestra función, ¿no? Las pruebas que queremos pasar esta función podrían escribirse de la siguiente manera en un archivo llamado, por ejemplo, Tests.js:

He cambiado un poco sus pruebas privadas, pero estoy seguro de que no tiene ningún problema para comprender lo que está sucediendo. Para verificar si nuestra función puede pasar estas pruebas o no, debemos crear un pequeño documento HTML que incluya todos los requisitos: la biblioteca QUNIT, la función JavaScript que queremos probar y las pruebas en sí misma:
Si ahora abrimos este documento en nuestro navegador web, obtendremos lo siguiente:
¡Odio! Nuestras pruebas de QUNIT fueron un éxito total. Hombre, ¿me gusta este verde? ¡Lo que significa que todas nuestras pruebas fueron un éxito total! Algunos consejos y trucos para convertirse en un mejor programador y probador, como puede ver, no hay magia detrás de una prueba unitaria sobre cómo configurar un entorno con datos ya existentes), pero todo se trata de usar el marco de prueba y sus funcionalidades correctamente. La verdad es que realmente no importa el lenguaje que pruebe: lo importante es creer en las pruebas como un concepto y tratar de ser lo más eficiente posible cuando lo haga. La parte más difícil es, como siempre, comenzar y Manténgase al día con la iniciativa. Preguntas como “¿Pruebo el componente correcto?”, “¿Me olvido de algo importante?”, “¿Son estas pruebas realmente útiles?”, “¿Le importaría a alguien si omitirá esta prueba?” Y entonces no siempre son fáciles. Responder y las respuestas pueden ser desalentadoras. Pero si les preguntas tú mismo, al menos está claro que te importa. Para responder a la mayoría de ellos, recomiendo ver los siguientes videos. Los amaba a ambos y todavía los veo de nuevo. En este primer video, Roy Osherove habla sobre buenas prácticas y errores horribles al probar el código JavaScript (pero, como dije antes, sus ideas se aplican a todos los idiomas y marcos de prueba). Realmente te animo a pasar una hora de tiempo y ver el video; te enseña cómo mejorar tus habilidades de prueba de prueba y eficiencia.
En mi opinión, las partes más interesantes de su discurso son: una buena prueba unitaria tiene tres propiedades básicas (ver en el video)

Es confiable. Si la prueba le dice que todo está bien y que no confía en ella, querrá verificar el código nuevamente para asegurarse de que lo sea. O si él te dice que algo anda mal y que no crees, es posible que te sientas tentado a decir “Oye, las pruebas a veces fallan; Estoy seguro de que todo está bien “. ¿Ver? Si no confía en los resultados de su prueba, ¿por qué le importaría crearlos primero?

Es mantenible. Las pruebas eventualmente cambiarán, porque su código probado probablemente cambiará, así que asegúrese de que estén limpios y claros. No mezcle demasiada información en una prueba única, manténgalas limpias y cortas para que puedan adaptarse fácilmente a sus necesidades futuras.
Es legible. Si una prueba falla, un programador querrá saber por qué. En otras palabras, probablemente tendrán que echar un vistazo a la prueba, leerla y comprender qué debería haber estado probando (si se llama correctamente, incluso podría omitir el código fuente). Si su prueba no se puede leer, usted y los futuros programadores tendrán problemas con el mantenimiento de su código.
Las pruebas deben ser simples (ver en el video). Cuanto más código agregue en una prueba, más probable es que la prueba en sí tenga errores. ¡Y eso es un poco raro! No desea que su código de prueba contenga errores en sí. La forma más fácil de “garantizar” es escribiendo pruebas simples. Así que trate de escribir breves, simples, sin bucles, sin declaraciones si/else, etc.
Use nombres significativos (ver en el video). Esta es probablemente la parte más esclarecedora del video. Si realmente quieres que la gente entienda lo que está haciendo una prueba, llámelo correctamente. Para hacer esto, asegúrese de que las siguientes tres facetas estén perfectamente especificadas: la unidad de trabajo: lo que probamos. Esto puede ser una clase, una función, un módulo … cualquier cosa, pero asegúrese de que se mencione claramente.
Escenario: cuándo y cómo ejecutamos la prueba, que es el contexto. Hay funciones que se comportan exactamente lo mismo independientemente de lo que, otros dependan de los tipos de atributos, otros en el estado de la base de datos. Por ejemplo, guardar una publicación que no existe es diferente de guardar una publicación que ya existe, por lo que este es el escenario: ¿ahorramos una nueva instancia o anulamos un tribunal existente?
Comportamiento esperado: ¿Qué debería (o no) suceder como resultado de nuestra prueba? La parte más importante aquí es decir que usar los verbos debería y no debería. Por ejemplo, la siguiente prueba es muy clara: “Dada la función wp_post_save (unidad de trabajo), cuando guardamos una publicación existente (script), la identificación posterior debe ser la misma que antes de guardarla (comportamiento esperado)”. Si, por otro lado, el comportamiento esperado se afirmó que “…, la identificación posterior es la misma que antes de guardarlo”, no está claro si señalamos un problema (la identificación posterior es la misma y no debería)) O si ya decimos lo que esperamos.
El segundo video es muy útil para principiantes. Recuerdo que una de las cosas que más luché cuando comencé a probar mi código era que no se podía probar mi código no era tan complicado, ¡pero no sabía cómo probarlo! ¡Y luego Rebecca mostró mi luz! A las 4:43, Rebecca muestra una pequeña aplicación de JavaScript y revela su código fuente: no es muy elegante, pero no es un desastre. ¿O es eso? Este era el tipo de código que escribí (y, tengo que confesar, a veces todavía lo hago), ¡pero este código no se puede probar en absoluto! Se mezclan diferentes funcionalidades, no hay una distinción clara entre la interfaz de usuario y el estado de la aplicación, entre la comunicación y la configuración del servidor, hay muchas funciones de lambda … unos minutos después, el altavoz le muestra la luz y le dice cómo escribir la prueba, para que se vuelva comprobable y, como resultado, legible y mantenida:
Use constructores para crear instancias
Admite la configuración
Mantenga los métodos simples
No mezcle las responsabilidades