Getting requirejs pracować z Jasmine

ja najpierw chcę powiedzieć, że jestem nowy na RequireJS a nawet nowsze do Jasmine.Getting requirejs pracować z Jasmine

Mam pewne problemy z SpecRunner i wymagają JS. Śledziłem tutoriale Uzi Kilona i Bena Nadela (wraz z kilkoma innymi) i pomogli niektórym, ale wciąż mam pewne problemy.

Wydaje się, że jeśli nie ma błędu, który jest wyrzucany w teście (mogę myśleć o jeden w szczególności rodzaj błędu) spec biegacz html będą wyświetlane. To mówi mi, że mam pewne problemy w javascript. Jednak po usunięciu tych błędów żaden HTML nie jest już wyświetlany. Nie mogę w ogóle uruchomić testera. Czy ktoś może znaleźć coś nie tak z moim kodem, który spowodowałby ten problem?

Oto moja konstrukcja katalog:

Root 
|-> lib 
    |-> jasmine 
     |-> lib (contains all of the jasmine lib) 
     |-> spec 
     |-> src 
    |-> jquery (jquery js file) 
    |-> require (require js file) 
index.html (spec runner) specRunner.js

Oto SpecRunner (indeks) HTML:

<!doctype html> 
<html lang="en"> 
    <head> 
     <title>Javascript Tests</title> 

     <link rel="stylesheet" href="lib/jasmine/lib/jasmine.css"> 

     <script src="lib/jasmine/lib/jasmine.js"></script> 
     <script src="lib/jasmine/lib/jasmine-html.js"></script> 
     <script src="lib/jquery/jquery.js"></script> 
     <script data-main="specRunner" src="lib/require/require.js"></script> 

     <script> 
      require({ paths: { spec: "lib/jasmine/spec" } }, [ 
        // Pull in all your modules containing unit tests here. 
        "spec/notepadSpec" 
       ], function() { 
        jasmine.getEnv().addReporter(new jasmine.HtmlReporter()); 
        jasmine.getEnv().execute(); 
       }); 
     </script> 

    </head> 

<body> 
</body> 
</html>

Oto specRunner.js (config)

require.config({ 
    urlArgs: 'cb=' + Math.random(), 
    paths: { 
     jquery: 'lib/jquery', 
     jasmine: 'lib/jasmine/lib/jasmine', 
     'jasmine-html': 'lib/jasmine/lib/jasmine-html', 
     spec: 'lib/jasmine/spec/' 
    }, 
    shim: { 
     jasmine: { 
      exports: 'jasmine' 
     }, 
     'jasmine-html': { 
      deps: ['jasmine'], 
      exports: 'jasmine' 
     } 
    } 
});

Oto specyfikacja:

require(["../lib/jasmine/src/notepad"], function (notepad) { 
    describe("returns titles", function() { 
     expect(notepad.noteTitles()).toEqual(""); 


    }); 
});

Źródłem schowek:

define(['lib/jasmine/src/note'], function (note) { 

    var notes = [ 
     new note('pick up the kids', 'dont forget to pick up the kids'), 
     new note('get milk', 'we need two gallons of milk') 
    ]; 


    return { 
     noteTitles: function() { 
      var val; 

      for (var i = 0, ii = notes.length; i < ii; i++) { 
       //alert(notes[i].title); 
       val += notes[i].title + ' '; 
      } 

      return val; 
     } 
    }; 
});

i źródłem Note (JIC):

define(function(){ 
    var note = function(title, content) { 
     this.title = title; 
     this.content = content; 
    }; 

    return note; 
});

Zrobiłem pewien, że o ile aplikacja jest zaniepokojona, ścieżki są poprawne. Kiedy już to zrobię, mogę grać, konfigurując te ścieżki, aby nie było tak paskudnie.

Źródło

2013-05-07 The Sheek Geek

można spróbować to? Zdefiniowany HtmlOdpowiedź poza wymaganiem. Zadzwoń tylko wykonaj wewnątrz. var jasmineEnv = jasmine.getEnv(); jasmineEnv.addReporter (new jaśmin.HtmlReporter()); require (['suites/aSpec.js'], function (spec) { jasmineEnv.execute(); }); – basos

Dla wersji autonomicznej Jasmine 2.0.0 ta odpowiedź zadziałała: http://stackoverflow.com/questions/19240302/does-jasmine-2-0-really-not-work-with-require-js/20851265#20851265 – shaunsantacruz

udało mi się uzyskać tej pracy z niektórych prób i błędów. Głównym problemem było to, że podczas pisania specyfikacji nie jest to, że wymagają chcesz utworzyć, którego chcesz użyć określić:

oryginalny:

require(["/lib/jasmine/src/notepad"], function (notepad) { 
    describe("returns titles", function() { 
     expect(notepad.noteTitles()).toEqual("pick up the kids get milk"); 


    }); 
});

robocza:

define(["lib/jasmine/src/notepad"], function (notepad) { 
    describe("returns titles", function() { 

     it("something", function() { 

      expect(notepad.noteTitles()).toEqual("pick up the kids get milk "); 
     }); 

    }); 
});

Po wykonaniu niektórych badań stało się jasne, że podczas korzystania RequireJS wszystko, co chcesz, require() należy użyć owinięty w define (wydaje się oczywiste, teraz chyba). Widać, że w pliku specRunner.js podczas przeprowadzania testów wymagane jest wymaganie (dlatego trzeba "zdefiniować" specyfikację.)

Inną kwestią jest to, że podczas tworzenia specyfikacji, opis() I the() są niezbędne (nie tylko opis jak miałem w zamieszczonym przykładzie).

oryginalny:

describe("returns titles", function() { 
     expect(notepad.noteTitles()).toEqual("pick up the kids get milk"); 


    });

robocza:

describe("returns titles", function() { 

     it("something", function() { 

      expect(notepad.noteTitles()).toEqual("pick up the kids get milk "); 
     }); 

    });

Ja również zmienił wokół gdzie istnieje runner testu, ale to był Refactor i nie zmieniło wyniku testów.

Ponownie, tutaj są pliki i zmienionych:

note.js: pozostał taki sam

notepad.js: pozostał taki sam

index.html:

<!doctype html> 
<html lang="en"> 
    <head> 
     <title>Javascript Tests</title> 
     <link rel="stylesheet" href="lib/jasmine/lib/jasmine.css"> 
     <script data-main="specRunner" src="lib/require/require.js"></script> 
    </head> 

    <body> 
    </body> 
</html>

specRunner.js:

require.config({ 
    urlArgs: 'cb=' + Math.random(), 
    paths: { 
     jquery: 'lib/jquery', 
     'jasmine': 'lib/jasmine/lib/jasmine', 
     'jasmine-html': 'lib/jasmine/lib/jasmine-html', 
     spec: 'lib/jasmine/spec/' 
    }, 
    shim: { 
     jasmine: { 
      exports: 'jasmine' 
     }, 
     'jasmine-html': { 
      deps: ['jasmine'], 
      exports: 'jasmine' 
     } 
    } 
}); 


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); 
    }; 

    var specs = []; 

    specs.push('lib/jasmine/spec/notepadSpec'); 



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

});

notepadSpec.js:

define(["lib/jasmine/src/notepad"], function (notepad) { 
    describe("returns titles", function() { 

     it("something", function() { 

      expect(notepad.noteTitles()).toEqual("pick up the kids get milk"); 
     }); 

    }); 
});

Źródło

2013-05-13 16:49:37

+1 dla _ Głównym problemem było to, że kiedy piszesz specyfikacje, nie jest to wymaganiem, które chcesz utworzyć, chcesz użyć define_. Jeśli użyjesz opcji wymaganie, twoje testy czasami będą działać, a czasem nie z błędem _no znaleziono specyfikację_. –

Wystarczy dodać to jako odpowiedź alternatywnym dla osób, które używasz Jasmine 2.0 samodzielnie. Wierzę, że to może działać również dla Jasmine 1.3, ale składnia asynchroniczna jest inna i trochę brzydka.

Oto mój zmodyfikowany plik SpecRunner.html:

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>Jasmine Spec Runner v2.0.0</title> 

    <link rel="shortcut icon" type="image/png" href="lib/jasmine-2.0.0/jasmine_favicon.png"> 
    <link rel="stylesheet" type="text/css" href="lib/jasmine-2.0.0/jasmine.css"> 

    <!-- 
    Notice that I just load Jasmine normally 
    -->  
    <script type="text/javascript" src="lib/jasmine-2.0.0/jasmine.js"></script> 
    <script type="text/javascript" src="lib/jasmine-2.0.0/jasmine-html.js"></script> 
    <script type="text/javascript" src="lib/jasmine-2.0.0/boot.js"></script> 

    <!-- 
    Here we load require.js but we do not use data-main. Instead we will load the 
    the specs separately. In short we need to load the spec files synchronously for this 
    to work. 
    --> 
    <script type="text/javascript" src="js/vendor/require.min.js"></script> 

    <!-- 
    I put my require js config inline for simplicity 
    --> 
    <script type="text/javascript"> 
    require.config({ 
     baseUrl: 'js', 
     shim: { 
      'underscore': { 
       exports: '_' 
      }, 
      'react': { 
       exports: 'React' 
      } 
     }, 
     paths: { 
      jquery: 'vendor/jquery.min', 
      underscore: 'vendor/underscore.min', 
      react: 'vendor/react.min' 
     } 
    }); 
    </script> 

    <!-- 
    I put my spec files here 
    --> 
    <script type="text/javascript" src="spec/a-spec.js"></script> 
    <script type="text/javascript" src="spec/some-other-spec.js"></script> 
</head> 

<body> 
</body> 
</html>

Teraz tutaj jest przykładowy plik Spec:

describe("Circular List Operation", function() { 

    // The CircularList object needs to be loaded by RequireJs 
    // before we can use it. 
    var CircularList; 

    // require.js loads scripts asynchronously, so we can use 
    // Jasmine 2.0's async support. Basically it entails calling 
    // the done function once require js finishes loading our asset. 
    // 
    // Here I put the require in the beforeEach function to make sure the 
    // Circular list object is loaded each time. 
    beforeEach(function(done) { 
     require(['lib/util'], function(util) { 
      CircularList = util.CircularList; 
      done(); 
     }); 
    }); 

    it("should know if list is empty", function() { 
     var list = new CircularList(); 
     expect(list.isEmpty()).toBe(true); 
    }); 

    // We can also use the async feature on the it function 
    // to require assets for a specific test. 
    it("should know if list is not empty", function(done) { 
     require(['lib/entity'], function(entity) { 
      var list = new CircularList([new entity.Cat()]); 
      expect(list.isEmpty()).toBe(false); 
      done(); 
     }); 
    }); 
});

Oto odcinek wsparcie asynchroniczny z docs Jasmine 2,0 link: http://jasmine.github.io/2.0/introduction.html#section-Asynchronous_Support

Źródło

2014-01-24 23:30:40 Gohn67

Warto zauważyć, że jest to jedyne rozwiązanie, które znalazłem, które działa z [web-węzeł-węzła] (https://github.com/rogerwang/node-webkit), połączone z wtyczką [RequireJS r.js] (http://requirejs.org/docs/1.0/docs/node.html), dzięki czemu mógłbym przetestować mój kod, który importuje oba moduły AMD i Node.js. – jmort253

Twoje specyfikacje nie używają amd, co moim zdaniem jest celem tego pytania. – cancerbero

Inną opcją samodzielnej wersji Jasmine 2.0 jest utworzenie pliku boot.js i skonfigurowanie go do uruchamiania testów po załadowaniu wszystkich modułów AMD.

Idealny przypadek użytkownika końcowego do pisania testów w naszym przypadku polegał na tym, że nie musielibyśmy wylistować wszystkich naszych plików spec lub zależności na liście jawnej, a jedynie wymagać zadeklarowania plików * spec jako modułów AMD z zależnościami .

Przykład idealny Spec: Spec/javascript/sampleController_spec.js

require(['app/controllers/SampleController'], function(SampleController) { 
    describe('SampleController', function() { 
     it('should construct an instance of a SampleController', function() { 
     expect(new SampleController() instanceof SampleController).toBeTruthy(); 
     }); 
    }); 
});

Idealnie zachowanie tło ładowania zależność i działa widowisko byłoby całkowicie nieprzezroczysta ktoś zbliża się do projektu, którzy chcą pisz testy i nie będą musieli robić nic poza tworzeniem pliku * spec.js z zależnościami AMD.

Aby to wszystko roboczego dostać, stworzyliśmy plik startowy i skonfigurowany Jasmine go używać (http://jasmine.github.io/2.0/boot.html), i dodaje trochę magii do zawinięcia wymagają, aby tymczasowo opóźnić prowadzenie badań aż po mamy deps załadowany:

Nasz boot.js sekcja "«Execution»:

/** 
* ## Execution 
* 
* Replace the browser window's `onload`, ensure it's called, and then run all of the loaded specs. This includes initializing the `HtmlReporter` instance and then executing the loaded Jasmine environment. All of this will happen after all of the specs are loaded. 
*/ 

var currentWindowOnload = window.onload; 

// Stack of AMD spec definitions 
var specDefinitions = []; 

// Store a ref to the current require function 
window.oldRequire = require; 

// Shim in our Jasmine spec require helper, which will queue up all of the definitions to be loaded in later. 
require = function(deps, specCallback){ 
    //push any module defined using require([deps], callback) onto the specDefinitions stack. 
    specDefinitions.push({ 'deps' : deps, 'specCallback' : specCallback }); 
}; 

// 
window.onload = function() { 

    // Restore original require functionality 
    window.require = oldRequire; 
    // Keep a ref to Jasmine context for when we execute later 
    var context = this, 
     requireCalls = 0, // counter of (successful) require callbacks 
     specCount = specDefinitions.length; // # of AMD specs we're expecting to load 

    // func to execute the AMD callbacks for our test specs once requireJS has finished loading our deps 
    function execSpecDefinitions() { 
    //exec the callback of our AMD defined test spec, passing in the returned modules. 
    this.specCallback.apply(context, arguments);   
    requireCalls++; // inc our counter for successful AMD callbacks. 
    if(requireCalls === specCount){ 
     //do the normal Jamsine HTML reporter initialization 
     htmlReporter.initialize.call(context); 
     //execute our Jasmine Env, now that all of our dependencies are loaded and our specs are defined. 
     env.execute.call(context); 
    } 
    } 

    var specDefinition; 
    // iterate through all of our AMD specs and call require with our spec execution callback 
    for (var i = specDefinitions.length - 1; i >= 0; i--) { 
    require(specDefinitions[i].deps, execSpecDefinitions.bind(specDefinitions[i])); 
    } 

    //keep original onload in case we set one in the HTML 
    if (currentWindowOnload) { 
    currentWindowOnload(); 
    } 

};

My w zasadzie utrzymać nasze widowisko składniowe AMD w stosie, pop je, wymagają modułów, należy wykonać zwrotnego z naszych twierdzeń w nim, a następnie uruchomić Jasmine po zakończeniu ładowania.

Ta konfiguracja pozwala nam czekać, aż wszystkie moduły AMD wymagane przez nasze indywidualne testy zostaną załadowane i nie złamie wzorców AMD, tworząc globale. Jest trochę hackery w tym, że chwilowo nadpisujemy, wymagamy i ładujemy tylko kod aplikacji za pomocą require (nasz `src_dir: w jasmine.yml jest pusty), ale ogólnym celem jest zmniejszenie narzutu pisania specyfikacji.

Źródło

2014-02-07 19:14:54 TopherBullock

Świetna odpowiedź, jeśli używasz Jasmine 2.0. Pracował jak urok ... – mehrandvd

można użyć done w kombi z przed filtrami przetestować asynchronicznych wywołań zwrotnych:

beforeEach(function(done) { 
    return require(['dist/sem-campaign'], function(campaign) { 
     module = campaign; 
     return done(); 
    }); 
    });

Źródło

2014-08-28 20:09:17 lfender6445

ten sposób zrobić, aby uruchomić spec jaśmin w HTML za pomocą AMD/requirejs dla wszystkich moich źródeł i specyfikacji.

To jest mój plik index.html, który ładuje jaśminu i wtedy mój „testową rozrusznik jednostkowej”:

<html><head><title>unit test</title><head> 
<link rel="shortcut icon" type="image/png" href="/jasmine/lib/jasmine-2.1.3/jasmine_favicon.png"> 
<link rel="stylesheet" href="/jasmine/lib/jasmine-2.1.3/jasmine.css"> 
<script src="/jasmine/lib/jasmine-2.1.3/jasmine.js"></script> 
<script src="/jasmine/lib/jasmine-2.1.3/jasmine-html.js"></script> 
<script src="/jasmine/lib/jasmine-2.1.3/boot.js"></script> 
</head><body> 
<script data-main="javascript/UnitTestStarter.js" src="javascript/require.js"></script> 
</body></html>

i wtedy moje UnitTestStarter.js jest coś takiego:

require.config({ 
    "paths": { 
     .... 
}); 
require(['MySpec.js'], function() 
{ 
    jasmine.getEnv().execute(); 
})

Źródło

2016-02-03 02:19:28 cancerbero

Getting requirejs pracować z Jasmine

Odpowiedz

Powiązane problemy