Recently I had the privilege of setting up a unit testing suite for a front-end application I work on. I thought that the setup might be useful for other folks looking to do the same thing so I decided to write up a blog post detailing the setup. I’m writing tests in this post for the ExtJS enterprise web framework by Sencha, and there are a few prerequisites that you need before you can start writing tests. You’ll need:
- NPM or Yarn (I prefer yarn)
- Sencha Cmd
- The ExtJS framework
Great! Now we can initialize the NPM/Yarn package.json for our dependencies. Run npm or yarn init but pass it the -y flag to ignore any questions. We won’t actually be using Yarn or NPM to package our application, but we will use them to run tests. Once your package has been initialized, install the mocha, mocha-chrome, and chai packages. If it’s not clear already, you will also need chrome to run mocha-chrome tests. Once the packages are installed we can start writing and running tests.
This will open up headless chrome and execute the tests inside chrome. This strategy works great for quickly unit testing projects that aren’t node based and need DOM APIs. If you’d like to see the project in action you can clone it here!