让requirejs与Jasmine一起工作 [英] Getting requirejs to work with Jasmine
问题描述
我首先想说的是我是RequireJS的新手，甚至是Jasmine的新手。
I first want to say that I am new to RequireJS and even newer to Jasmine.
我遇到了SpecRunner的一些问题，需要JS。我一直在关注Uzi Kilon和Ben Nadel（以及其他一些人）的教程，他们帮助了一些，但我仍然遇到了一些问题。
I am having some issues with the SpecRunner and require JS. I have been following the tutorials of Uzi Kilon and Ben Nadel (along with some others) and they helped some but I am still having some issues.
看来，如果测试中出现错误（我可以想到一个，特别是类型错误），将显示spec runner html。这告诉我，我在javascript中有一些问题。但是，在我修复这些错误后，不再显示HTML。 我根本无法让测试跑者显示出来。有人发现我的代码可能会导致此问题吗？
It seems that, if there is an error that is thrown in the test (I can think of one in particular, a type error) the spec runner html will display. This tells me that I have some issues in the javascript. However, after I fix those error no HTML is displayed anymore. I cannot get the test runner to display at all. Can someone find something wrong with my code that would cause this issue?
这是我的目录结构：
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
这里是 SpecRunner（索引）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>
这是 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'
}
}
});
这是一个规格：
require(["../lib/jasmine/src/notepad"], function (notepad) {
describe("returns titles", function() {
expect(notepad.noteTitles()).toEqual("");
});
});
记事本来源：
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;
}
};
});
注意来源（JIC）：
define(function (){
var note = function(title, content) {
this.title = title;
this.content = content;
};
return note;
});
我已经确定，就应用而言，路径是正确的。一旦我开始工作，我就可以配置这些路径，这样它就不那么令人讨厌了。
I have made sure that, as far as the app is concerned, the paths are correct. Once I get this working I can play with configuring that paths so that it isn't so yucky.
推荐答案
我设法通过一些试验和错误来解决这个问题。主要问题是当你编写规范时，它不是你想要创建的要求，你想使用define：
I managed to get this working with some trial and error. The main issue was that when you write specs it isn't a require that you want to create, you want to use define:
原文：
require(["/lib/jasmine/src/notepad"], function (notepad) {
describe("returns titles", function() {
expect(notepad.noteTitles()).toEqual("pick up the kids get milk");
});
});
工作：
define(["lib/jasmine/src/notepad"], function (notepad) {
describe("returns titles", function () {
it("something", function() {
expect(notepad.noteTitles()).toEqual("pick up the kids get milk ");
});
});
});
经过一些研究后，很明显，当使用RequireJS时，任何你想要的东西（）使用必须包装在一个定义（现在我猜似乎很明显）。您可以看到，在specRunner.js文件中，在执行测试时使用了需求（因此需要定义规范。
After doing some research it became clear that, when using RequireJS, Anything that you want the require() to use must be wrapped in a define (seems obvious now I guess). You can see that, in the specRunner.js file, a require is used when executing the tests (therefore the need to "define" the specs.
另一个问题是在创建规范时，必须使用describe（）和it（）（不仅仅是我在发布的示例中所描述的描述）。
The other issue is that, when creating specs, the describe() AND the it() are necessary (not just the describe like I had in the posted example).
原创：
describe("returns titles", function() {
expect(notepad.noteTitles()).toEqual("pick up the kids get milk");
});
工作：
describe("returns titles", function () {
it("something", function() {
expect(notepad.noteTitles()).toEqual("pick up the kids get milk ");
});
});
我也改变了测试运行器存在的地方，但这是一个重构，并没有改变测试的结果。
I also changed around where the test runner exists but this was a refactor and did not change the outcome of the tests.
再次，这里一个重新编辑文件和更改：
Again, here are the files and the changed:
note.js：保持不变
notepad.js：保持不变
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");
});
});
});
这篇关于让requirejs与Jasmine一起工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
