Just a quick tip for those of you using Bower to install Sinon.JS for unit testing in the browser. Hopefully you’ll avoid scratching your head like I did when things didn’t work out as expected when using the registered Bower package. The solution is sometimes so easy, but it can still take a little time to find.
Installing Using The Registered Sinon.JS Bower Package
If you do a standard:
[code_highlight language=”shell”]$ bower install sinon[/code_highlight]
You will be successful in installing Sinon.JS, however, you will have trouble using it in the browser. This is because the Bower package is not a built version. What you’re given is all the components, not a complete file ready for use in the browser.
So if you’ve already installed it go ahead and uninstall it using:
[code_highlight language=”shell”]$ bower uninstall sinon[/code_highlight]
(Note: Remember to use the –save-dev flag if you used it when installing. This will make sure that you remove the dependency in your bower.json file as well.)
Alternative Bower Package Installation Methods
So to solve the problem we need to install a built version. Remember that Bower install API allows us to install dependencies using any of the following for <package>:
| Registered package name | jquerynormalize.css |
| Git endpoint | https://github.com/user/package.gitgit@github.com:user/package.git |
| Local folder | my/local/folder/ |
| Public Subversion endpoint | svn+http://package.googlecode.com/svn/ |
| Private Subversion endpoint | svn+ssh://package.googlecode.com/svn/svn+https://package.googlecode.com/svn/ |
| Shorthand (defaults to GitHub) | user/package |
| URL | http://example.com/script.jshttp://example.com/style.csshttp://example.com/package.zip (contents will be extracted)http://example.com/package.tar (contents will be extracted) |
Installing Sinon.JS Using Release URLs
Normally if I don’t find the package I need in Bower, I try to use a Git endpoint. Sinon.JS did not seem to offer one for built versions of the file, so I used the URL of the current release (v1.12.2 at the time I wrote this post).
[code_highlight language=”shell”]$ bower install http://sinonjs.org/releases/sinon-1.12.2.js[/code_highlight]
You can replace the version sinon-1.12.2.js with sinon-x.x.x.js where x.x.x = the major.minor.patch of the version you’re wanting to use. For a full listing of versions current and old visit the Sinon.JS download page.
Finding The Path To Use In Your HTML
You can quickly find the path to use in your HTML page using:
[code_highlight language=”shell”]$ bower list -p [/code_highlight]
That will list out the paths for all of your current installed Bower packages. Copy and paste the path for Sinon.JS (it will probably show up as ‘sinon-1.12.2’) into your HTML page and start unit testing away.
I hope this saves you some time.
Leave a Reply