blocks|key|2992031|text|这是一个很好的设置，用于将带有模拟依赖项的模块插入到测试中。这是一个端到端的示例，如果您只想查看规范，请跳到最后。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2992032|文件夹结构：|offset|length|style|BOLD|2992033|Jasmine
%7C-lib
%7C%7C-jasmine++++++++++--+Contains+all+the+Jasmine+files
%7C%7C%7C-boot.js
%7C%7C%7C-jasmine-html.js
%7C%7C%7C-jasmine.js
%7C%7C%7C-jasmine.css
%7C%7C%7C-jasmine_favicon.png
%7C%7C%7C-...
%7C-spec++++++++++++++--+Spec+files+go+here
%7C%7C-hello-spec.js
%7CSpecRunner.html
%7CSpecRunner.js
%7Csquire.js
Scripts
%7Cknockout.js
%7Crequire.js
%7Cjquery.js
App
%7C-hello.js
%7C-foo.js|code-block|syntax|javascript|2992034|在您提出问题时，Jasmine+1.3是最新版本。从那时起，2.0发布了，并包含了一些异步改进。这两个版本都在这里，1.3被注释掉了。|2992035|SpecRunner.html:|2992036|<!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>
++++
++++<script+src="../Scripts/require.js"+data-main="SpecRunner.js"+type="text/javascript"+></script>
</body>
</html>|2992037|SpecRunner.js:|2992038|这个问题Does+Jasmine+2.0+really+not+work+with+require.js?对启动和运行它很有帮助。|2992039|(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
})();|2992040|foo.js:|2992041|define(['knockout'],+function+(ko)+{

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

++++return+{
++++++++message:+message()
++++};
});|2992042|hello.js:|2992043|define(['foo'],+function+(foo)+{

++++return+{
++++++++message+:+foo.message
++++};

});|2992044|hello-spec.js:|2992045|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!");
++++++++});
++++});
});|2992046|详细信息|2992047|线条|2992048|var+injector+=+new+Squire();
var+builder+=+injector
++++.mock('foo',+{
++++++++message:+"Hello,+World!"
++++});|2992049|模拟hello对foo的依赖，然后|2992050|builder.require(['hello'],+function+(hi)+{
++++hello+=+hi;
++++done();+//+...until+you+invoke+it.
});|2992051|使用模拟的foo加载hello模块。与在第二个测试中使用require本身加载hello进行比较：|2992052|+require(['hello'],+function+(hi)+{
+++++hello+=+hi;
+++++done();+//+...until+you+invoke+it.
+});|2992053|Jasmine文档http://jasmine.github.io/可以填写“完成()”功能(2.0)或“运行/等待”(1.3)。|2992054|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/19240302/does-jasmine-2-0-really-not-work-with-require-js|1|http://jasmine.github.io/^0|0|0|6|0|0|0|0|G|0|0|0|E|0|4|1D|0|0|0|0|7|0|0|0|9|0|0|0|E|0|0|0|4|0|0|0|0|0|0|0|9|P|1|0^^$0|@$1|2|3|4|5|6|7|20|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|21|8|@$D|22|E|23|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|24|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|25|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|26|8|@$D|27|E|28|F|G]]|9|@]|A|$]]|$1|Q|3|R|5|J|7|29|8|@]|9|@]|A|$K|L]]|$1|S|3|T|5|6|7|2A|8|@$D|2B|E|2C|F|G]]|9|@]|A|$]]|$1|U|3|V|5|6|7|2D|8|@]|9|@$D|2E|E|2F|1|2G]]|A|$]]|$1|W|3|X|5|J|7|2H|8|@]|9|@]|A|$K|L]]|$1|Y|3|Z|5|6|7|2I|8|@$D|2J|E|2K|F|G]]|9|@]|A|$]]|$1|10|3|11|5|J|7|2L|8|@]|9|@]|A|$K|L]]|$1|12|3|13|5|6|7|2M|8|@$D|2N|E|2O|F|G]]|9|@]|A|$]]|$1|14|3|15|5|J|7|2P|8|@]|9|@]|A|$K|L]]|$1|16|3|17|5|6|7|2Q|8|@$D|2R|E|2S|F|G]]|9|@]|A|$]]|$1|18|3|19|5|J|7|2T|8|@]|9|@]|A|$K|L]]|$1|1A|3|1B|5|6|7|2U|8|@$D|2V|E|2W|F|G]]|9|@]|A|$]]|$1|1C|3|1D|5|6|7|2X|8|@]|9|@]|A|$]]|$1|1E|3|1F|5|J|7|2Y|8|@]|9|@]|A|$K|L]]|$1|1G|3|1H|5|6|7|2Z|8|@]|9|@]|A|$]]|$1|1I|3|1J|5|J|7|30|8|@]|9|@]|A|$K|L]]|$1|1K|3|1L|5|6|7|31|8|@]|9|@]|A|$]]|$1|1M|3|1N|5|J|7|32|8|@]|9|@]|A|$K|L]]|$1|1O|3|1P|5|6|7|33|8|@]|9|@$D|34|E|35|1|36]]|A|$]]|$1|1Q|3|-4|5|6|7|37|8|@]|9|@]|A|$]]]|1R|$1S|$5|1T|1U|1V|A|$1W|1X]]|1Y|$5|1T|1U|1V|A|$1W|1Z]]]]

This is a nice setup for inserting modules with mocked dependencies into tests. This is an end to end example to get someone started, skip to the end if you just want to see the spec.

Folder Structure:

<pre><code>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
</code></pre>

At the time of your question, Jasmine 1.3 was the latest version. Since then 2.0 was released and contains some async improvements. Both versions are included here, 1.3 is commented out. 

SpecRunner.html:

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

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

SpecRunner.js:

This question <a href="https://stackoverflow.com/questions/19240302/does-jasmine-2-0-really-not-work-with-require-js">Does Jasmine 2.0 really not work with require.js?</a> was helpful in getting this up and running.

<pre><code>(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
})();
</code></pre>

foo.js:

<pre><code>define(['knockout'], function (ko) {

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

 return {
 message: message()
 };
});
</code></pre>

hello.js:

<pre><code>define(['foo'], function (foo) {

 return {
 message : foo.message
 };

});
</code></pre>

hello-spec.js:

<pre><code>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!");
 });
 });
});
</code></pre>

Details

Lines

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

mock up hello's dependency on foo and then

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

loads the hello module using the mocked foo. Compare to using require itself to load hello in the second test:

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

The Jasmine docs <a href="http://jasmine.github.io/" rel="nofollow noreferrer">http://jasmine.github.io/</a> can fill you in on the "done()" functionality (2.0) or "runs/waitsFor" (1.3).

I want to write JS tests. The production code is written with RequireJS.
I found a test lib named Squire.js: <a href="https://github.com/iammerrick/Squire.js/" rel="noreferrer">https://github.com/iammerrick/Squire.js/</a>

From the Squire.js website

<blockquote>
 Run generates a function that will receive a done callback and execute it after your test function is complete. Particularly useful for frameworks where asynchrony is handled with a callback. Here is an example with Mocha.js. Jasmine can offer this callback approach using Jasmin.Async."
</blockquote>

I don't know how to use this with Jasmine async. A small example would be very useful.

Squire.js example with Jasmine and RequireJS

我想写JS测试。生产代码是用RequireJS编写的。我找到了一个名为Squire.js：的测试库来自Squire.js网站 Run生成一个函数，该函数将接收完成的回调，并在测试函数完成后执行它。对于使用回调处理异步的框架特别有用。下面是一个使用Mocha.js的示例。Jasmine可以使用Jasmin.Async提供...

问使用Jasmine和RequireJS的Squire.js示例
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Jasmine和RequireJS的Squire.js示例EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Jasmine和RequireJS的Squire.js示例
EN