Forums Développement Multimédia

Les formations Mediabox
Les formations Mediabox

FlexUnit

Compatible Flash Builder 4. Cliquer pour en savoir plus sur les compatibilités.Compatible ActionScript 3. Cliquer pour en savoir plus sur les compatibilités.Par d.exter (Denis exter), le 21 février 2010

Présentation

FlexUnit est un framework open source créé par Adobe pour effectuer des tests unitaires d’applications et de librairies Flex et actionscript.

Ce framework est basé sur JUnit, qui est le framework le plus populaire pour effectuer des tests unitaires en Java.

Un test unitaire est un procédé permettant de s’assurer du fonctionnement correct d’une partie déterminée d’un logiciel ou d’une partie de programme. Les tests sont écrits pour confronter une réalisation à sa spécification. Le test définit un critère d’arrêt (état ou sorties à l’issue de l’exécution) permettant de statuer sur le succès ou l’échec d’une vérification. Grâce à la spécification, on est en mesure de faire correspondre un état d’entrée donné à un résultat ou à une sortie. Le test permet de vérifier que la relation entrée / sortie donnée par la spécification est bien réalisée.

On effectuera les tests unitaires avant la mise en production d’une application, mais également lorsque l’on effectue une modification de code, afin de vérifier que ces nouvelles modifications n’ont pas affecté d’autres parties de l’application.

FlexUnit permet de développer des procédures de tests automatiques, qui permettent de débugger facilement des applications qui ont été développées avec Flex, de produire des applications plus robustes, et d’en faciliter la maintenance.

Nous écrivons souvent les tests après que le code ait été écrit, cependant, préparer les tests avant d’écrire le code permet de mieux partitionner le code en différentes étapes, ce qui est un avantage lorsque l’on doit effectuer des modifications ou effectuer une démonstration à un client, car il n’aura pas besoin d’attendre que l’application soit terminée.

Cette librairie est basée sur l’idée que tout ce qui est développé doit être testé, et que si l’on n’est pas capable de le tester, il faut se demander deux fois, si l’on a réellement besoin de développer cela.

Flash builder 4.0 beta 2 offre des services de support intégré à FlexUnit et permet de créer des tests unitaires automatiques, sans avoir besoin de recréer les mêmes classes encore et encore.

Il existe 2 versions de FlexUnit, FlexUnit 0.9 et FlexUnit 4 (en version RC1 au moment de l’écriture de ce tutoriel). Dans ce tutoriel nous utiliserons FlexUnit 4.0 qui englobe FlexUnit 0.9.

Flash builder 4 existe maintenant en version stable. Vous pourrez trouver comment mettre en place des test unitaires avec cette version ici: Tests Unitaires avec Flash Builder et FlexUnit 4

Installation

Vous pouvez télécharger la librairie à l’adresse suivante :

http://opensource.adobe.com/wiki/display/flexunit/FlexUnit

Dans ce tutoriel, nous allons voir comment utilisé cette librairie, et l’intégrer dans un projet Flex, avec Flash Builder. Il vous faudra donc :

- Flash Builder (http://labs.adobe.com/technologies/flashbuilder4/)

Nous allons commencer par créer un nouveau projet sous Flash builder, pour ce faire, cliquez sur :

- Fichier –> Nouveau –> Projet Flex

- Nommer le Flexunit4

- Sélectionner Application web

- Cliquez sur Terminer.

Le projet est ainsi créer.

Dans les précédentes versions de Flex builder, vous deviez télécharger les librairies depuis l’adresse :

http://opensource.adobe.com/wiki/display/flexunit/Downloads

et extraire les 5 librairies :

- Flexunit_0.9.swc

- Hamcrest.swc

- FlexUnit4_1.0.swc

- Flexunitextended.swc

- FlexUnitTestRunner_rb.swc

depuis le fichier .zip puis les ajouter dans le répertoire /libs de votre projet.

Ces librairies font maintenant partie du SDK 4.0 de Flex, vous n’avez donc pas besoin de les télécharger avec Flash Builder 4.0 bêta 2. Elles seront ajoutées automatiquement au projet lorsque vous ajouterez des tests.

Mise en application: simple tests de fonctions

Nous allons commencer par créer un nouveau package en cliquant sur Fichier –> Nouveau –> Package, nommer le « com.exemple ».

Faites ensuite un clique droit sur ce package, et choisissez Nouveau –> Class actionscript et nommer la « Language ».

Cette classe, sera la classe qui contiendra les fonctions que nous allons tester, nous allons commencer par définir un simple tableau contenant des langages informatiques (actionscript, asp.net,etc…), puis une fonction permettant d’ajouter un langage à notre tableau, une fonction permettant de retirer le dernier élément entré dans le tableau, et enfin une fonction permettant de retourner tous les langages contenu dans le tableau.

 
package com.exemple
{
	public class Language
	{
		private var _languages:Array;
 
		public function Language()
		{
			_languages = ['ActionScript','ASP.NET', 'PHP', 'Java'];
		}
 
 
		public function addLanguage(name:String):void{
			_languages.push(name);
		}
 
		public function removeLanguage():void{
			_languages.pop();
		}
 
		public function getLanguages():Array{
			return _languages;
		}
	}
}

Nous allons ensuite créer notre FlexUnit test, pour ce faire, il suffit simplement de cliquer sur Fichier –> Nouveau –> Classe de script de test, nommez la «FlexUnit4Test ».

Sélectionnez l’option « New FlexUnit 4 Test ».

Cocher la case «Sélectionnez la classe à tester » et cliquez sur le bouton « Browse » et rechercher votre class « Language », puis cliquez sur terminer.

C’est dans cette classe que nous allons écrire nos tests. Pour notre exemple, nous allons tester les fonctions « addLanguage » & « removeLanguage ».

Pour ce faire, nous allons créer une fonction nommée « testAddLanguage » qui va appeler la fonction « addLanguage » de notre classe « Language » et ajouter le langage « Python », notre tableau devrait donc contenir 5 langages maintenant.

Un test unitaire est composé d’affirmations. Si une affirmation est vraie, le test passe, si l’affirmation est fausse, le test échoue. FlexUnit offre différentes affirmations, dépendant du type de test que vous voulez effectuer. Les différentes affirmations existantes sont :

- assertEquals affirme que deux valeurs sont égales.

- assertContained affirme que la première chaîne de caractères est contenue dans la deuxième.

- assertNotContained affirme que la première chaîne de caractères n’est pas contenue dans la deuxième.

- assertFalse affirme que la condition est fausse.

- assertTrue affirme que la condition est vraie.

- assertMatch affirme que la chaîne de caractères correspond à l’expression régulière (regexp).

- assertNoMatch affirme que la chaîne de caractères ne correspond pas à l’expression régulière (regexp).

- assertNull affirme qu’un objet est nul.

- assertNotNull affirme qu’un objet n’est pas nul.

- assertNotUndefined affirme qu’un objet est défini.

- assertUndefined affirme qu’un objet est indéfini.

- assertStrictlyEquals affirme que deux objets sont strictement égales.

- assertObjectEquals affirme que deux objets sont égales.

Pour tester le résultat de cette fonction, nous allons utiliser la méthode « asserTrue » pour tester le nombre de langages contenu dans notre tableau après ajout du nouveau langage « Phyton », mais nous allons volontairement générer une erreur en affirmant que le résultat devrait être égal 7 au lieu de 5.

Pour notre deuxième test, nous allons créer la fonction « testRemoveLanguage » afin de tester notre fonction « removeLanguage ». Nous allons utiliser la même affirmation. Notre tableau contenant 4 langages, si nous en enlevons 1, il ne devrait rester plus que 3, c’est ce que nous allons tester.

package flexUnitTests
{
	import com.exemple.Language;
 
	import flexunit.framework.Assert;
	import flexunit.framework.TestCase;
 
 
	public class FlexUnit4Test extends TestCase
	{
		// Reference declaration for class to test
		private var classToTestRef : com.exemple.Language;
 
		public function FlexUnit4Test()
		{
		}
 
		public function testAddLanguage():void
		{
			var language:Language=new Language();
			language.addLanguage('Python');
			/*cette ligne va généré une erreur, le nombre de langages devraient être 5*/
			Assert.assertTrue("Language total should be 7", language.getLanguages().length==7);
		}
 
		public function testRemoveLanguage():void
		{
			var language:Language=new Language();
			language.removeLanguage();
			Assert.assertTrue("Language count after remove should be 3", language.getLanguages().length==3);
		}
	}
}

Il nous faut maintenant écrire le code nous permettant de lancer le test, et faire afficher le résultat dans notre navigateur.

Pour cela, nous allons utiliser le composant « FlexUnitTestRunnerUI “ qui a des fonctionnalités similaires à la classe TestRunner dans FlexUnit 0.9. Ce composant va créer une instance de la suite de tests et nous permettra d’ajouter tous les tests que l’on désire. Il affichera également les résultats dans notre navigateur. Dans notre exemple les testes démarrent sur l'événement “creationComplete”.

Il n’y a actuellement pas de « test runner » pour des applications en pure actionscript, mais vous pouvez néanmoins créer un projet Flex pour effectuer les tests ou utiliser Ant tasks (http://docs.flexunit.org/index.php?title=Ant_Task)

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/halo" 
			   xmlns:flexunit="flexunit.flexui.*" minWidth="1024" minHeight="768" creationComplete="init()">
 
 
			<fx:Script>
				<![CDATA[
				import flexUnitTests.FlexUnit4Test;
 
				private function init():void{
					test.runWithFlexUnit4Runner(runTestSuite(),"Language");
				}
 
				private function runTestSuite():Array{
					var testsToRun:Array=new Array();
					testsToRun.push(FlexUnit4Test);
					return testsToRun;
				}
		]]>
	</fx:Script>
	<flexunit:FlexUnitTestRunnerUI id="test" width="100%" height="100%"/>
 
</s:Application>

Pour lancer les tests, il suffit maintenant de lancer le projet en mode « debug », et vous verrez alors le résultats des tests dans votre navigateur, vous devriez obtenir ceci :

Comme prévu, on a un test qui a réussi, et un test qui a échoué. Pour voir les détails concernant l’échec, il vous faut ouvrir la vue « Résultats des tests unitaires FlexUnit ».

Pour ce faire, cliquez sur « Fenêtre » –> « Autres vues » et sélectionnez sous « Flash Builder> la vue « Résultats des tests unitaires FlexUnit ». Relancez le test.

Vous devriez maintenant être à même d’intégrer FlexUnit à vos projets, et créer vos propres tests unitaires, conformément à vos besoins.

Je vous joins comme à l’habitude, le fichier du projet.

flexunit4.zip

Il y a également un tutoriel écrit par Iteratif sur deux méthodes de tests plus avancées que je vous conseille de lire :

Les bouchons de test