Recent Changes -

2015.08.05 {Blog}

By MichaelPaulukonis, on August 05, 2015, at 09:19 AM

On this page... (hide)

dev grind

The other night I ported some node code to a small web-page.
I showed it off the next day to a friend, and after I hit SEND I though... why are the commit dates from 5 months ago?

I had re-invented my own wheel.

Re-ported it.

Anyway. It meant I was working on the project again, so that's good. I added all the new things I had introduced into the original project, and pushed it over to github.io, finally, as well: http://michaelpaulukonis.github.io/mispelr/

Linting the code for the browser. ("Helloooo, EsLint!"). Cleaning it up. Adding some functionality.

TODO: unit-testing the browser-based JS.

I haven't done this consistently.

I've unit-tested Node, but not the browser, outside of one-off code chunks for a few things.

So. High time I take care of this.

I've used vows in the past, but will try working with Mocha

http://blog.codeship.com/mocha-js-chai-sinon-frontend-javascript-code-testing-tutorial/

http://kirbysayshi.com/2013/07/01/mocha-tests-node-and-browser.html
http://ariya.ofilabs.com/2013/12/code-coverage-of-mocha-tests-using-istanbul-and-karma.html
http://stackoverflow.com/questions/22201885/mocha-browser-tests-with-node-js-command-line-runner

sample html-harness

This is pretty much based on the the one in this tutorial, but with some more annotations, and the mocha and chai dependencies pulled from a cdn instead of being local in the repo.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>mispelr tests</title>
  <link href="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.css" rel="stylesheet" />
</head>
<body>
  <div id="mocha"><p><a href=".">Index</a></p></div>
  <div id="messages"></div>
  <div id="fixtures"></div>

  <!-- test framework -->
  <script src="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/chai/3.2.0/chai.js"></script>

  <!-- scripts under test -->
  <script src="../js/maledict.js"></script>
  <script src="../js/lexer.js"></script>
  <script src="../js/mispel.js"></script>
  <!-- end scripts-under-test -->

  <script>mocha.setup('bdd')</script>

  <!-- test scripts -->
  <script src="mispelr_test.js"></script>

  <!-- end test scripts -->

  <script>mocha.run();</script>

</body>
</html>
Get Code
Tags: