https://github.com/daffl/jqueryto
DailyJS survey from December 2012:
Set up a page:
!html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My QUnit Test</title>
<link rel="stylesheet" href="/resources/qunit.css">
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<script src="/resources/qunit.js"></script>
<script src="/resources/underscore.js"></script>
<script src="tests.js"></script>
</body>
</html>
And in tests.js:
!javascript
module("My Underscore Test");
test("values", function() {
equal(_.values({one: 1, two: 2}).join(', '), '1, 2',
'can extract the values from an object');
equal(_.values({one: 1, two: 2, length: 3}).join(', '),
'1, 2, 3', '... even when one of them is "length"');
});
- Build and use tools that make testing easier
- Simplify workflows
- Talk about it!
- Automate as much as possible
Adam Hawkins at RejectJS 2012 (watch)
- Browser independent
- All tests written in JavaScript
- Unit and functional testing
- Test against a single browser in development
- Test against all target browsers in CI
- Runs from the CLI
Open the test page URL in the target browser(s)
Automate with Launchpad:
- NodeJS module for starting browsers
- Common browser launching API
- Dynamic local browser discovery
- Launch BrowserStack workers
- BrowserStack API compatible server
- Remote Preview
Testee - A test reporter
Automated cross-browser test reporter for QUnit, Jasmine and Mocha
Some neat features:
- Runs on all browsers
- Many output formats
- Easy CI integration
- BrowserStack support
- Code coverage
- GruntJS task
Install:
npm install -g testee
Go to your project folder:
cd underscore
Point to your test page and run with PhantomJS:
testee test/index.html
Point to your test page and run with local Firefox:
testee test/index.html --browser firefox
Output XML test results for CI:
testee test/index.html --browser safari --reporter XUnit > testresults.xml
Run tests on Chrome Canary and output code coverage statistics:
testee test/index.html --browser canary --coverage
Test with IE 9.0 on BrowserStack:
testee test/index.html --browser ie:9.0@win --launch browserstack
Set up Remote Preview to open tests on other devices:
!javascript
{
"tunnel": {
"type": "local",
"hostname": "airblubber"
},
"launch": "remotePreview",
"browser": {
"file": "remote-preview/url.txt"
}
}
And run like:
testee --config testee.json
- Browser independent
- All tests written in JavaScript
- Unit and functional testing
- Test against a single browser in development
- Test against all target browsers in CI
- Runs from the CLI
Automated tests performed from a user perspective
- Emulate user input
- Examine the result
- Black box testing
Used for
- Testing component interaction
- Verifying UI heavy widgets
- Application smoke tests
Functional testing library built on top of jQuery and QUnit:
- Use jQuery syntax to emulate user input
- Write QUnit style tests
Testing a TodoMVC app
!javascript
test('TodoMVC app', function() {
S('#new-todo').click().type('Do some nerdy stuff\r').wait(500);
S('#todo-list li').size(1, 'Got one Todo');
S('#todo-list li:first label')
.html('Do some nerdy stuff', 'Todo has correct text');
S('#todo-count').html(/<strong>1<\/strong>(.*)item(.*)left/,
'Todo count text is correct');
});
- Browser independent
- All tests written in JavaScript
- Unit and functional testing
- Test against a single browser in development
- Test against all target browsers in CI
- Runs from the CLI