https://github.com/wallabyjs/wallaby-requirejs-sample
Testing require.js app with wallaby.js
https://github.com/wallabyjs/wallaby-requirejs-sample
Last synced: 9 months ago
JSON representation
Testing require.js app with wallaby.js
- Host: GitHub
- URL: https://github.com/wallabyjs/wallaby-requirejs-sample
- Owner: wallabyjs
- Created: 2015-02-20T02:02:25.000Z (almost 11 years ago)
- Default Branch: master
- Last Pushed: 2016-03-15T04:34:53.000Z (almost 10 years ago)
- Last Synced: 2024-04-10T11:11:47.477Z (over 1 year ago)
- Language: JavaScript
- Homepage: http://wallabyjs.com
- Size: 110 KB
- Stars: 2
- Watchers: 4
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Testing require.js code with wallaby.js
==================================
To get Wallaby.js to run with require.js we need two files:
* `wallaby.js` — which configures wallaby.js
* `test-main.js` — which configures require.js for the tests
Let's say our app has a directory structure which looks something like this:
```bash
$ tree
.
|-- index.html
|-- wallaby.js
|-- lib
| |-- jquery.js
| |-- require.js
| `-- underscore.js
|-- src
| |-- app.js
| `-- main.js
`-- test
|-- appSpec.js
`-- test-main.js
3 directories, 9 files
```
## Configure wallaby.js
The first step is creating our `wallaby.js`.
```javascript
module.exports = function () {
return {
files: [
{pattern: 'lib/require.js', instrument: false},
{pattern: 'lib/*.js', instrument: false, load: false},
{pattern: 'src/app.js', load: false},
{pattern: 'test/test-main.js', instrument: false}
],
tests: [
{pattern: 'test/appSpec.js', load: false}
]
};
};
```
Please notice that we need set `load: false` to all the files and tests except `test/test-main.js`, everything else is loaded by require.js.
In this example we'll use Jasmine (wallaby.js is using it by default), but other test frameworks works just
as well.
## Configuring require.js
Just like any require.js project, you need a main module to bootstrap
your tests. We do this is `test/test-main.js`.
### Require Each Test File
With wallaby.js we don't need to list all test files ourselves as we can
easily find them from the files specified in `test-main.js`: wallaby
includes all the files in `window.wallaby.tests`.
Now we can tell Require.js to load our tests, which must be done
asynchronously as dependencies must be fetched before the tests are run.
The `test/test-main.js` file ends up looking like this:
```javascript
// delaying wallaby automatic start
wallaby.delayStart();
requirejs.config({
baseUrl: '/src',
paths: {
'jquery': '../lib/jquery',
'underscore': '../lib/underscore'
},
shim: {
'underscore': {
exports: '_'
}
}
});
require(wallaby.tests, function () {
wallaby.start();
});
```
## Using Require.js in tests
Tests can now be written as regular Require.js modules. We wrap
everything in `define`, and inside we can use the regular test methods,
such as `describe` and `it`. Example:
```javascript
define(['app', 'jquery', 'underscore'], function(App, $, _) {
describe('just checking', function() {
it('works for app', function() {
var el = $('
');
var app = new App(el);
app.render();
expect(el.text()).toEqual('require.js up and running');
});
it('works for underscore', function() {
// just checking that _ works
expect(_.size([1,2,3])).toEqual(3);
});
});
});
```
---
Based on [Karma with require.js repository](https://github.com/kjbekkelund/karma-requirejs), with some wallaby specific changes.