2013-09-30 19 views
18

Voglio scrivere test JS. Il codice di produzione è scritto con RequireJS. Ho trovato un lib prova di nome Squire.js: https://github.com/iammerrick/Squire.js/Esempio di Squire.js con Jasmine e RequireJS

dal sito web Squire.js

Run genera una funzione che riceverà un callback fatto e eseguirlo dopo la vostra funzione di test è completo. Particolarmente utile per i framework in cui l'asincronia viene gestita con un callback. Ecco un esempio con Mocha.js. Gelsomino propone questo approccio callback utilizzando Jasmin.Async."

non so come usare questo con Jasmine asincrono. Un piccolo esempio potrebbe essere molto utile.

risposta

21

Questa è una bella messa a punto per l'inserimento . moduli con le dipendenze deriso in test Questo è un esempio end to end per ottenere qualcuno ha iniziato, saltare alla fine, se si desidera solo per vedere le specifiche Struttura

cartella:.

Jasmine 
|-lib 
||-jasmine   -- Contains all the Jasmine files 
|||-boot.js 
|||-jasmine-html.js 
|||-jasmine.js 
|||-jasmine.css 
|||-jasmine_favicon.png 
|||-... 
|-spec    -- Spec files go here 
||-hello-spec.js 
|SpecRunner.html 
|SpecRunner.js 
|squire.js 
Scripts 
|knockout.js 
|require.js 
|jquery.js 
App 
|-hello.js 
|-foo.js 

Al momento della domanda, Jasmine 1.3 era l'ultima versione. Da allora è stato rilasciato 2.0 e contiene alcuni miglioramenti asincroni. Entrambe le versioni sono incluse qui, 1.3 è commentato.

SpecRunner.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <title>Hello Spec Runner</title> 

    <link rel="shortcut icon" type="image/png" href="lib/jasmine/jasmine_favicon.png"> 
    <link rel="stylesheet" type="text/css" href="lib/jasmine/jasmine.css"> 
</head> 
<body> 
    <!-- Load RequireJS & the testsuite --> 
    <script src="../Scripts/require.js" data-main="SpecRunner.js" type="text/javascript" ></script> 
</body> 
</html> 

SpecRunner.js:

Questa domanda Does Jasmine 2.0 really not work with require.js? è stato utile per ottenere questo installato e funzionante.

(function() { 
    'use strict'; 

    // Configure RequireJS to shim Jasmine 
    requirejs.config({ 
     baseUrl: "../App", 
     paths: { 
      'jasmine' : '../Jasmine/lib/jasmine/jasmine', 
      'jasmine-html': '../Jasmine/lib/jasmine/jasmine-html', 
      'boot': '../Jasmine/lib/jasmine/boot', // This is not present in Jasmine 1.3 
      'spec' : '../Jasmine/spec', 
      'squire': '../Jasmine/squire', 
      'knockout': '../Scripts/knockout-2.3.0', 
      'jquery': '../Scripts/jquery-1.10.2' // This only used in the Jasmine 1.3 case. 
     }, 
     shim: { 
      'jasmine': { 
       exports: 'jasmine' 
      }, 
      'jasmine-html': { 
       deps: ['jasmine'], 
       exports: 'jasmine' 
      }, 
      'boot': { 
       deps: ['jasmine', 'jasmine-html'], 
       exports: 'jasmine' 
      }, 
      "squire": { 
       exports: "squire" 
      } 
     } 
    }); 

    // Define all of your specs here. These are RequireJS modules. 
    var specs = [ 
     'spec/hello-spec' 
    ]; 

    // Load Jasmine - This will still create all of the normal Jasmine browser globals unless `boot.js` is re-written to use the 
    // AMD or UMD specs. `boot.js` will do a bunch of configuration and attach it's initializers to `window.onload()`. Because 
    // we are using RequireJS `window.onload()` has already been triggered so we have to manually call it again. This will 
    // initialize the HTML Reporter and execute the environment. 
    require(['boot'], function() { 

     // Load the specs 
     require(specs, function() { 

      // Initialize the HTML Reporter and execute the environment (setup by `boot.js`) 
      window.onload(); 
     }); 
    }); 

    /****** 
    * Use this require if you're on Jasmine 1.3 
    ******/ 
    //require(['jquery', 'jasmine-html'], function ($, jasmine) { 
    // var jasmineEnv = jasmine.getEnv(); 
    // jasmineEnv.updateInterval = 1000; 

    // var htmlReporter = new jasmine.HtmlReporter(); 

    // jasmineEnv.addReporter(htmlReporter); 

    // jasmineEnv.specFilter = function(spec) { 
    //  return htmlReporter.specFilter(spec); 
    // }; 

    // $(function() { 
    //  require(specs, function(spec) { 
    //   jasmineEnv.execute(); 
    //  }); 
    // }); 
    //}); 

    // end 1.3 
})(); 

foo.js:

define(['knockout'], function (ko) { 

    var message = ko.observable("Go away, World!"); 

    return { 
     message: message() 
    }; 
}); 

hello.js:

define(['foo'], function (foo) { 

    return { 
     message : foo.message 
    }; 

}); 

Hello-spec.js:

define(['squire'], function (Squire) { 

    var injector = new Squire(); 
    var builder = injector 
     .mock('foo', { 
       message: "Hello, World!" 
     }); 

    describe('hello', function() { 
     var hello; 

     beforeEach(function (done) { 
      // For async: 
      // accept a "done" parameter and Jasmine will wait... 
      builder.require(['hello'], function (hi) { 
       hello = hi; 
       done(); // ...until you invoke it. 
      }); 

      /******* 
      * Use the following if you're on 1.3 
      *********/ 
      //var done; 
      //runs(function() { 
      // builder.require(['hello'], function (hi) { 
      //  hello = hi; 
      //  done = true; 
      // }); 
      //}); 

      //waitsFor(function() { 
      // return done; 
      //}, "Unable to load dependency not loaded", 750); 

      // end 1.3 
     }); 

     it('is welcoming', function() { 
      expect(hello.message).toBe("Hello, World!"); 
     }); 
    }); 

    describe('hello no mock foo', function() { 
     var hello; 

     beforeEach(function (done) { 
      // For async: 
      // accept a "done" parameter and Jasmine will wait... 
      require(['hello'], function (hi) { 
       hello = hi; 
       done(); // ...until you invoke it. 
      }); 

      /******* 
      * Use the following if you're on 1.3 
      *********/ 
      //var done; 
      //runs(function() { 
      // require(['hello'], function (hi) { 
      //  hello = hi; 
      //  done = true; 
      // }); 
      //}); 

      //waitsFor(function() { 
      // return done; 
      //}, "Unable to load dependency not loaded", 750); 

      // end 1.3 
     }); 

     it('is less than welcoming', function() { 
      expect(hello.message).toBe("Go away, World!"); 
     }); 
    }); 
}); 

Dettagli

Lines

var injector = new Squire(); 
var builder = injector 
    .mock('foo', { 
     message: "Hello, World!" 
    }); 

dipendenza mock up di ciao su foo e poi

builder.require(['hello'], function (hi) { 
    hello = hi; 
    done(); // ...until you invoke it. 
}); 

carica il modulo ciao con il foo deriso. Confronta all'utilizzo di richiedere per sé per caricare ciao nella seconda prova:

require(['hello'], function (hi) { 
    hello = hi; 
    done(); // ...until you invoke it. 
}); 

documenti gelsomino http://jasmine.github.io/ può riempire voi nella funzionalità "done()" (2.0) o "piste/waitsFor" (1,3).