Node.js and Mocha Tests from the Browser - node.js

This is probably a really dumb question, but I'm not sure. If I have a node.js application and a much of tests built with Mocha, I can run them on my server no problems, using mocha. However, is there any way to invoke the unit tests through a browser and just pipe the results to the page? For development, I'd like to have a page on my website that shows the results of the tests.
Every time I search for how to do this, it's testing the actual browser code I'm finding (the dom, the UI etc), but it's actually just that I want to see the results of the tests run server-side but from the browser!
Thanks in advance!

Sure, create a route in Express that executes mocha and returns the result to the browser. Take a look at child_process.fork to execute mocha: http://nodejs.org/api/child_process.html#child_process_child_process_fork_modulepath_args_options
And don't forget to turn it off before going into production!
Separately, I would highly recommend to you the concept of continuous deployment, and specifically the service CircleCI, which for $19 automatically runs all of your tests every time you push to Github.

Related

Checking what methods were invoked during execution typescript on node js server (debugging nodejs)

I am developer with poor experience, however with strong academic CS background.
So please be patient where I am wrong somewhere.
As far I know, typescript can be executed on JS server and it works in this way in my case. Namely, I execute e2e tests with protactor (angular test framework).
I would like to debug it and check what methods was called during such execution on nodejs. To give you more details, I would like if (and possibly parameters) was invoked
waitForAngular(rootSelector, callback) method.
I know that it is possible to dump a variety of traces and debugging info from JVM, however I have no idea how can I do it with nodejs in my specific case.
Could you help me, please?
Around where you have your calls to waitForAngular (or any other code that you want to check), add a console.trace(), which will display a stack trace at that exact line of code.
You can read more about console.trace() and other console API methods at this document by the Chrome project (node.js uses the JS engine that Chrome uses): https://developers.google.com/web/tools/chrome-devtools/console/api#trace
You can sprinkle debugger statements in your code to stop execution which will allow you to step through your code. Similarly, you could start your Node process with the --inspect-brk argument to use Chrome DevTools to step through your code.

Can Jest be used as browser based testing tool?

I understand that Jest is a unit testing tool for developers used for JavaScript. Is Jest a browser based testing tool similar to Selenium or a functional testing tool?
As you mention, Jest is meant to be a unit testing tool. Normally you'd write small tests for parts/components of a web-page. I'm not exactly sure what you mean by "Is Jest can be used as Browser based Testing tool?" but I've found there are two relevant areas where Jest can come into contact with browser based testing
You can use a virtual DOM (like JSDOM) to render your components and test them in an environment similar to a browser. These are still unit tests but you'll have access to window and document and can test things like document click, window navigation, focused element etc.
You can debug your Jest tests in browser. Follow the instructions here if that is what you want. I've tried this but it was really slow and not very useful for me so I wouldn't recommend it
You can probably render your entire application and test it with Jest, but I wouldn't recommend that either. Jest tests should be designed to run fast and should only tests small units of your code. If you try and build tests that take a long time to run then there is an argument stating that your unit tests will become useless and developers will eventually not run them anymore.
If you are looking for tests that start an actual browser and click around like a user then have a look at Selenium which I would think is the most common approach these days
This npm library can be integrated with your jest tests to run them in a browser :) :
https://www.npmjs.com/package/jest-browser
I can't say how good it is/what the cons are but it looks like it is worth a try!
Yes, you can use Jest Preview (https://github.com/nvh95/jest-preview) to debug your Jest test in a browser like Google Chrome.
You don't have to debug a long HTML text when using Jest Preview anymore.
Read more at https://www.jest-preview.com/docs/getting-started/intro

API testing using protractor+jasmine

Does anybody using protractor with jasmine to do API testing. While searching for this I get to know that using frisby.js we can do API testing. But, my doubt is that whether protractor or jasmine directly supports/provides functions for API testing. Did anybody tried this? If so, what is the approach that I need to follow ?
Thanks in advance.
Protractor is meant for e2e testing and e2e tests are supposed to test the flow of an application from user standpoint, in spite of that you should test your API calls not directly but rather through testing user actions and if actions perform as intended it means the API that they rely on work.
If you want to do tests for API to catch errors early without having to run full e2e test suite you should use frisby.js as you've mentioned to confirm all APIs are A-OK and you can follow then with e2e tests when you are sure that all should be working.
IMO it's better to use the tools for what they were designed.

node-qunit, code coverage tool

For nodejs backend server code Unit Testing, I am using node-qunit with grunt.
Is there any code coverage tool using node-qunit module?
Maximum code coverage tool I am seeing needs headless browser support, ex. PhantomJS, but if I run using this, then I get syntax errors for nodejs keywords, like "ReferenceError: Can't find variable: require" etc.
So which tool I can use for code coverage for nodejs backend code testing using node-qunit.
If you're solely testing backend code, there's no need to run the tests in a headless browser like PhantomJS. For running code coverage analysis in node, I can recommend istanbul.
But I'm not sure if it works out of the box with node-qunit. However mocha is a popular node.js test runner with a qunit-interface, and qunit-mocha-ui delivers QUnit's assertions for mocha. So you could migrate your tests with only little effort.

How to debug tests with karma.js + require.js

I have a setup basically described here - http://karma-runner.github.io/0.8/plus/RequireJS.html
Problem is that I can't see source files of my tests in Chrome dev tools. So I can't debug it. Adding debugger; works but it is very uncomfortable, almost unusable since I can't browse any other file except the one with debugger; currently fired
Seems like karma load files, parse them, wrap each test and then unload files before run.
ng-boilerplate has a grunt build that will put all your plain js files into a build directory for testing and debugging.
Take a look at the Gruntfile and karma/karma-unit.tpl.js for how this is done.
Running grunt watch will leave your browser in a state where you can debug all your tests. Just click the debug button, set your break point(s) and reload the page.
Suddenly, you are debugging any or all your js files.
If you need to debug your test deeply, this is generally an indicator of badly organized code or badly made unit test. If you follow a TDD workflow, taking small step will help you prevent any major issue with your code. I warmly recommend you watch this video: http://blog.testdouble.com/posts/2013-10-03-javascript-testing-tactics.html?utm_source=javascriptweekly&utm_medium=email (it doesn't use Karma, but you should watch it for the workflow/the principles presented)
Then, if you really want to debug your test code, nothing beat the browser. As so, you should set up your test in a manner it can be runned both in Karma and the browser. We implemented this for QUnit, Jasmine and Mocha on the Backbone-Boilerplate. Feel free to base yourself on these settings to set up your own environment.

Resources