Testing JavaScript Written for the Browser in Node JS

Question

I have some JavaScript that is going to run in the browser, but I have broken the logic based functions that have nothing to do with the DOM into their own js files.

If it's possible, I would prefer to test these files via command line, why have to open a browser just to test code logic? After digging through multiple testing libraries for Node.js. I suppose it's not a big deal, but that seems to require that I build a whole node project, which requires that I provide a main, which doesn't really exist in my project since it's just functions that get fired from a web page.

Is there a solution for testing JavaScript functions that can be as simple as just writing a .js file with tests in it and calling a utility to run those tests? Something more simple than having to set up a runner, or build a project and manage dependencies? Something that feels like writing and running JUnit Tests in Eclipse, and a little less like having to set up a Maven project just to run MVN test?

As a follow-up question, is this even the right way to go about it? Is it normal to be running tests for JavaScript that is meant to run in the browser in Node.js?

I had thought this, but it is my understanding that this only works for a standalone file, right? So if I want to test function bar in foo.js, I can't do a var foo = require('./foo.js') in a test_foo.js file. Right? — rhamilton
– rhamilton, Commented Feb 15, 2018 at 4:16
you can, you just need to run that command and provide the name of the entry point of your code — Ayush Gupta
– Ayush Gupta, Commented Feb 15, 2018 at 4:16
that command is the standard way to start node.js applications — Ayush Gupta
– Ayush Gupta, Commented Feb 15, 2018 at 4:17

Ari Singh · Accepted Answer · 2018-02-15 04:43:29Z

Use test runners like mocha or jasmine. Very easy to setup and start writing test code. In mocha for example, you can write simple test cases like

var assert = require('assert');
var helper = require('../src/scripts/modules/helper.js');
var model = require('../src/scripts/modules/model.js');

model.first.setMenuItem ({
  'title': 'Veggie Burger',
  'count': 257,
  'id': 1
});

describe('increment', function(){
  console.log ("Count : " + model.first.getMenuItem().count);

  it('should increment the menu item', function(){
    helper.increment();
    assert.equal(model.first.getMenuItem().count, 258);
  });

});

and run them like

$ ./node_modules/mocha/bin/mocha test/*.js

where test/*.js are the specifications file (unit test file like the one above)

the output will be something like:

Count : 257


  increment
    ✓ should increment the menu item


  1 passing (5ms)

You can even use headless browser like PhantomJS to test containing DOM manipulation code.

rhamilton · Accepted Answer · 2018-02-15 05:45:04Z

I'm going to accept Ari Singh's answer for recommending Mocha, and special kudos to Ayush Gupta for leading me down a road that eventually let me write my js files in a format that could be ran in the browser and node.js.

Just to expand on Ari's answer a bit on some things that made life a little easier.

I installed mocha globally using npm install -g mocha. Additionally, I created a test directory that I put all my test in. By doing this, all I had to do to run my unit tests was call mocha test. No package.json, no lengthy paths into node_modules to run mocha.
Node js requires you to export the functions in one file that you want to use in another file, which JavaScript in browsers does not. In order to support both Node.js and JavaScript, I did the following:

In my root directory, I have foo.js with the following contents:

function bar() {
    console.log("Hi")
}

module.export = bar

Then in the test directory I have test_foo.js with the following contents (Note this example doesn't have a test, see Ari's answer for an example of writing tests in Mocha):

var bar = require('../foo.js')

bar()

Using this approach, I can test the bar function in node using mocha test and still use it in my HTML page by importing it as a script.

Moika Turns · Accepted Answer · 2024-09-19 14:42:26Z

Had similar issue.

Wanted a way to unit test browser based files so I didn't have to modify original JavaScript. Way I resolved it was to synchronously load the script to be tested and wrap it inside a new function, this provided a way to not only export things from the script (so they can be unit tested) but also supply dependencies too (whose absense would otherwise cause an error to be thrown when the script is run e.g. 3rd party libraries like JQuery or DOM objects).

The code is in an npm package, made public since this question is asked a few times:

https://www.npmjs.com/package/@moikaturns/import-pob-code

Often the answer is to modify the original JavaScript, if this can be avoided I think it's preferable as the code added tends to serve no functional purpose.

So, if using node the package can be imported and used with a test platform like Jest or Mocha, alternatively copy the code from git and adapt for specific needs. It's just a few lines. Nothing complicated.

Collectives™ on Stack Overflow

Testing JavaScript Written for the Browser in Node JS

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related