0 оценок0% нашли этот документ полезным (0 голосов)
61 просмотров16 страниц
QUnit es una biblioteca para realizar pruebas unitarias de código JavaScript. Permite crear afirmaciones (assertions) para probar que funciones individuales funcionan como se espera. Ofrece funciones como ok() y equal() para verificar valores booleanos y de igualdad. Los tests se agrupan en módulos y QUnit muestra los resultados de las pruebas en el navegador.
QUnit es una biblioteca para realizar pruebas unitarias de código JavaScript. Permite crear afirmaciones (assertions) para probar que funciones individuales funcionan como se espera. Ofrece funciones como ok() y equal() para verificar valores booleanos y de igualdad. Los tests se agrupan en módulos y QUnit muestra los resultados de las pruebas en el navegador.
QUnit es una biblioteca para realizar pruebas unitarias de código JavaScript. Permite crear afirmaciones (assertions) para probar que funciones individuales funcionan como se espera. Ofrece funciones como ok() y equal() para verificar valores booleanos y de igualdad. Los tests se agrupan en módulos y QUnit muestra los resultados de las pruebas en el navegador.
QUnit es una completa suite para testear nuestras aplicaciones
Javascript desarrollada por el jQuery Team. En principio fue
concebida para usar sobre el propio cdigo jQuery pero su flexibilidad permite integrarla fcilmente en cualquier desarrollo tanto en cliente como en su versin servidor (Rhino, V8,node.js). QUnit utiliza para comprobar el funcionamiento del cdigo la metodologa conocida como Prueba Unitaria. Concepto de prueba unitaria En programacin, una prueba unitaria es una forma de probar el correcto funcionamiento de un mdulo de cdigo. Esto sirve para asegurar que cada una de las partes que integran nuestra aplicacin funcionen correctamente por separado. Las ventajas de las pruebas unitarias frente otras formas de test son el que pueden aplicarse de una forma automatizada con antelacin a la puesta en produccin de un cdigo. Esto quiere decir que no es necesario el reproducir de forma manual todo el flujo necesario que lleva a la obtencin del dato a verificar sino que en su lugar, delegamos esa tarea a nuestro framework de pruebas. Una ventaja aadida para los desarrolladores web es que pueden reproducir las bateras de test en cada uno de los diferentes navegadores de una forma casi desatendida. En caso de encontrarse un problema, como las pruebas se ejecutan aisladas, llegar al error resulta ms sencillo. Una vez reparado, se vuelven a ejecutar los tests para comprobar la integridad en el resto de la aplicacin. En cuanto a la calidad de nuestro cdigo, Javascript es un lenguaje muy apto para la refactorizacin. Al tratarse de un contenido que tiene que ser previamente descargado en cliente y ejecutado sobre una amplia variedad de plataformas, es imprescindible alcanzar el mayor rendimiento con el menor nmero de lneas posible. Para esta etapa en el desarrollo, contar con una batera consistente de test puede resultar de gran ayuda. Tras cada pequea modificacin del cdigo durante la refactorizacin, es muy recomendable lanzar los tests para comprobar que se mantienen las funcionalidades esperadas. El magnfico libro de Carlos Bl Jurado, Diseo gil con TDD, liberado bajo licencia Creative Commons y descargable desde su pgina oficial, explica en su captulo IV el concepto de test unitario a travs de sus caractersticas: Atmico. Significa que el test prueba la mmima cantidad de funcionalidad posible. Independiente. Significa que el test no depende de otros para producir un resultado: funciona con independencia de otros tests. Inocuo. Un test nunca altera el estado del sistema. Su ejecucin, por ejemplo, no crear nuevos ficheros o registros en una base de datos. Rpido. Debe realizarse lo ms rpido posible para no interrumpir una dinmica de trabajo. Para el caso de Javascript y las llamadas Ajax, esta caracterstica no siempre puede alcanzarse debido a latencias y tiempos de respuesta del servidor. Todos los puntos anteriores conforman el acrnimo ingls F.I.R.S.T con el que tambin pueden definirse las pruebas unitarias: Fast, Independent, Repeatable, Small y Transparent. Integrando QUnit en Javascript Para comenzar a utilizar QUnit, solo necesitamos incluir en nuestros ficheros dos archivos: un script con la librera y una hoja de estilos (opcional) que permite una correcta visualizacin de los resultados. <link rel="stylesheet" type="text/css" href="http://github.com/jquery/QUnit/raw/master/QUnit/QUnit.css" media="all" /> <script type="text/javascript" src="http://github.com/jquery/QUnit/raw/master/QUnit/QUnit.js"></script> Como puede verse por las URLs, podemos elegir no guardar la libreria en nuestro servidor y utilizar la ltima versin hospedada en el repositorio pblico de github. Si optamos por almacenar nuestra propia copia local, podemos descargar ambos archivos desde lapgina oficial de QUnit. Adems de estos archivos, nuestras aplicaciones tienen que contar con una serie de etiquetas HTML donde se mostrarn los resultados de nuestros tests: <h1 id="QUnit-header">QUnit Test Suite</h1> <h2 id="QUnit-banner"></h2> <div id="QUnit-testrunner-toolbar"></div> <h2 id="QUnit-userAgent"></h2> <ol id="QUnit-tests"></ol> Primeras pruebas Cada uno de los bloques que componen nuestros test se llaman afirmaciones (assertions). Una afirmacin puede definirse como un estamento que evala el resultado de una determinada porcin de un cdigo. Si el resultado obtenido es correcto (true), el test se supera; si obtenemos un valor falso (false), el test no se supera. Un test se compone de tres partes bsicas que se identifican mediante las siglas anglosajonas AAA :Arrange (Preparar), Act (Actuar) y Assert (Afirmar). La preparacin es imprescindible antes de comenzar a evaluar afirmaciones y su cometido es iniciar el contexto o marco de pruebas. En QUnit, utilizamos para ello la funcin test() cuya sintaxis es la siguiente: test( name, [expected], test ) Donde: name (String) Nombre del test. expected [opcional] (Number) Nmero de afirmaciones que se esperan ejecutar. Lo veremos ms adelante; de momento no lo usamos. test (Function) Conjunto de afirmaciones que van a evaluarse. Al menos, debemos contar con una. Una vez realizado el SetUp, pasamos al acto donde llamaremos al cdigo que queremos probar y que la terminologa denomina SUT, Subject/System Under Test (objeto bajo test). Finalmente, pasamos a la afirmacin, donde comprobamos que el SUT (el objeto que estamos comprobando) funciona como se espera. En QUnit, la afirmacin ms bsica la proporciona la funcin ok(), cuya sintaxis es la siguiente: ok( state, message ) Donde: state (Boolean) Expresin booleana o de cualquier otro tipo que ser evaluada. message [opcional] (String) Mensaje de salida que acompaa el resultado de la afirmacin. Es una afirmacin booleana, equivalente a assertTrue en JUnit. Si el argumento obtenido es un valortrue, el test se supera. Tomemos por ejemplo, la siguiente funcin: function checkNumber( my_string ){ return ( parseFloat( my_string ) == my_string ? true : false ); } La idea es comprobar si el argumento que pasamos a la funcin se corresponde con un nmero. Si se cumple la condicin, la funcin devuelve true, para el caso contrario, obtendramos false. Integremos ahora una serie de pruebas unitarias bsicas: test( 'Testing checkNumber()', function() { ok( checkNumber( 0 ) ); ok( checkNumber( 2 ) ); ok( checkNumber( -4 ) ); ok( checkNumber( 1 ) ); ok( checkNumber( 'asdf' ) ); ok( !checkNumber( 'asdf' ) ); } ); Para este caso, hemos escrito 6 afirmaciones de tipo booleano en el que comprobamos el valor obtenido con cada llamada a nuestra funcin (SUT). Cuando cargamos nuestro archivo en el navegador, obtenemos lo siguiente:
La afirmacin ok() equivale internamente a preguntar simplemente si el SUT es true o false, por lo que podra desarrollarse de la siguiente forma con idnticos resultados: test( 'Testing checkNumber() with true', function() { ok( checkNumber( 0 ) == true ); ok( checkNumber( 2 ) == true ); ok( checkNumber( -4 ) == true ); ok( checkNumber( 1 ) == true ); ok( checkNumber( 'asdf' ) == true ); ok( !checkNumber( 'asdf' ) == true ); } ); Afirmaciones ms flexibles Las anteriores afirmaciones solo evalan un valor booleano, pero no es difcil imaginar otros escenarios en los que se precisa mayor flexibilidad. Pensemos en aquellos casos donde una funcin devuelve un objeto, un literal u otra funcin. Para estos casos, contamos con distintos tipos de afirmaciones de igualdad. Tomemos ahora por ejemplo la siguiente funcin: function areaTriangle( tBase, tHeight ){ return ( tBase * tHeight ) / 2; } En este caso, no obtenemos un valor booleano sino numrico y por lo tanto, la funcin ok() no sera la ms adecuada. En su lugar, para verificar que el resultado obtenido es el esperado, recurrimos a la funcin equal(), cuya sintaxis es la siguiente: equal( actual, expected, [message] ) Donde: actual (Object) El objeto a evaluar. expected (Object) El resultado experado. message [opcional] (String) Mensaje que acompaa al resultado de la afirmacin. Bsicamente, el funcionamiento de esta afirmacin es el siguiente: si actual == expected el test se resuelve correctamente. test( 'Testing checkNumber()', function() { equal( areaTriangle( 4, 3 ), 6 ); equal( areaTriangle( null, 3 ), 6 ); } ); El resultado obtenido con esta batera es el siguiente:
Una forma de mantener todos nuestros tests organizados es definiendo mdulos que ms tarde podemos ejecutar de forma unitaria. Para definir mdulos en QUnit utilizamos la funcinmodule(): module( name, [lifecycle] ) Donde: name (String) es el nombre del mdulo. lifecycle [opcional] (Options) Permite establecer callbacks que se ejecutarn tanto antes como despus de cada test que compone este mdulo. De este modo, podramos reunir los dos test anteriores en dos mdulos independientes: module( "Test Module A" ); test( 'Testing checkNumber()', function() { ok( checkNumber( 0 ) ); ok( checkNumber( 2 ) ); ok( checkNumber( -4 ) ); ok( checkNumber( 1 ) ); ok( checkNumber( 'asdf' ) ); ok( !checkNumber( 'asdf' )); } );
Afirmaciones Estrictas Adems de las vistas anteriormente, QUnit permite otra serie de afirmaciones como strictEqual odeepEqual. strictEqual realiza una comprobacin estricta tanto de tipos de datos como de valores. Su uso es similar a equal: test('Comparing strict and no-strict modes', function() { equals( 0, false, 'true'); same( 0, false, 'false'); equals( null, undefined, 'true'); same( null, undefined, 'false'); }) El resultado es similar al de las comparaciones bsicas en Javascript:
deepEqual realiza una comparacin recursiva perfecta para su uso en objetos y arrays. var o1 = { 'foo' : 'First Property', 'bar' : 'Second Property' }; var o2 = { 'foo' : 'First Property', 'bar' : 'Second Property' };
Ampliando funcionalidades de QUnit Recientemente han aparecido algunos interesantes proyectos que pueden complementar las funcionalidades de QUnit como puede ser Sinon.js. Sinon.js es un framework completo para realizar bancos de test que pose un plugin (sinon-QUnit) para integrarlo con QUnit. Esta herramienta permite recoger los argumentos y los valores devueltos por aquellas funciones que comprobamos para reutilizarlos ms adelante. Toda la documentacin al respecto podemos encontrarla en su pgina oficial. Conclusin Contar con un banco de pruebas consistente es una garanta de que nuestras aplicaciones funcionarn correctamente antes de su puesta en un entorno de produccin. Las ventajas de esta metodologa frente a los mtodos tradicionales de ensayo y error son la capacidad de reproducir de forma desatendida el comportamiento de un usuario frente a la aplicacin final. En el desarrollo web, esta flexibilidad es especialmente interesante cuando queremos comprobar la respuesta del servidor ante un formulario enviado por el usuario, una combinacin de eventos tediosa de repetir o una arquitectura Javascript compleja. Prcticamente todos los lenguajes de programacin modernos cuentan con frameworks especializados en realizar este trabajo y Javascript, dada sus caractersticas y su dificultad natural para rastrear errores, no puede prescindir de uno. QUnit, desarrollado por el equipo de jQuery es una fantstica opcin para delegar este trabajo: su flexibilidad, basada en la misma librera jQuery, facilita la integracin de plataformas de terceros que pueden aportar nuevas funcionalidades. En este artculo, hemos repasado parte de la teora que hay detrs de las pruebas unitarias y las hemos aplicado al framework estudiado. Con estas herramientas, estamos en disposicin de crear nuestros propios tests y comenzar a disfrutar de los beneficios de esta metodologa ntimamente ligada con eldesarrollo gil de software.