Run JavaScript unit tests inside of Visual Studio - javascript

I have been searching for a good way to run JavaScript unit tests inside of the Visual Studio IDE. I currently use TestDriven.net to run my C# units tests and it is very convenient to be able to quickly get the result of my tests in the output pane. I would love to find a similar experience for JavaScript (ideally working with TestDriven.net).
I have read about different solutions that let you execute JavaScrpt unit tests. Some have their own JS engine while others like JS-Test-Driver are able to send the code to the browsers and fetch the results. But I have yet to see something that is integrated into VS.
Does anyone know of an extension that might do this?

After nine months there are now a couple answers to this question.
I created an open source project called Chutzpah - A JavaScript Test Runner. Chutzpah enables you to run JavaScript unit tests from the command line and from inside of Visual Studio. It also supports running in the TeamCity continuous integration server.
Another solution is part of the next version of Resharper. In Resharper 6 there is an integrated QUnit test runner.

It is possible to use JsTestDriver to be a test-runner in Visual Studio. Once a server has been started, with browsers attached, one can run tests directly from within Visual Studio.
The Console-window will then give the output of the test results. I won't go to implementation details here, but the following how-to should be enough to get you started on the actual setup of Visual Studio / JsTestRunner.
Console output from chrome and internet explorer (ignore my bad test-names):
JsTestDriver is mainly a test-running tool to verify multiple browsers. To get good unit-tests on the javascript itself, one can plug in other test-specific tools like JasmineBDD (jasmine to jstestdriver adapter).
JsTestDriver also opens up for the possibility to test against multiple browsers as a build step on your continuous integration server ie: Hudson (Continuous Integration with Hudson and jstestdriver). This then allows a dev to test against a certain browser or two while developing locally, but then verify the result against any range of OS / browser combinations on the build server.

Just found this article (and this question) when looking for the same thing.
Integrating JavaScript Unit Tests with Visual Studio - Steven Walther
It does have a lot of work onto it, but it seems that it really brings a nice interaction. For sure worth the hassle if you're working on a JavaScript heavy application.

Microsoft has a link recommending the use a NodeJS app to run our JavaScript Unit Tests. Visual Studio's test window can now see tests we write in that project even when the overall project is in C#:
https://learn.microsoft.com/en-us/visualstudio/javascript/unit-testing-javascript-with-visual-studio?view=vs-2019&tabs=mocha
One of the testing library combos (unit testing / mocking / assertions) recommended is using Mocha / Sinon / Chai. For this flavor there's a useful tutorial located here:
https://scotch.io/tutorials/how-to-test-nodejs-apps-using-mocha-chai-and-sinonjs
And another link for getting vanilla JS to work in the node environment:
https://dev.to/thawkin3/how-to-unit-test-html-and-vanilla-javascript-without-a-ui-framework-4io

Related

Chrome Debugger for JS file only

So. Dumb question.
I am using developer tools on chrome as essentially my IDE in the source tab. I have a JS file writing a program with no associated html/css files. Is there anyway for me to utilize the debugger for my JS file? Specifically I want to step into a function
In developer mode, select Sources tab, then navigate to your JS files in the left side. In the right panel, you can add a breakpoint to any line by pressing the line number which has a real js statement. Then you can run your application again to debug your js scripts.
The picture below is an example(Line 33 of assert.js is selected).
There are a number of different ways to debug/test your JS code, Chrome is only one of them.
QUOKKA
Quokka.js is a developer productivity tool for rapid JavaScript / TypeScript prototyping. Runtime values are updated and displayed in your IDE next to your code, as you type.
Runkit notebook
RunKit notebooks completely remove the friction of trying new ideas. With one click you’ll have a sandboxed JavaScript environment where you can instantly switch node versions, use every npm module without having to wait to install it, and even visualize your results. No more configuration, just straight to coding.
Hopa
Hopa is a zero config JavaScript/TypeScript runner right in your terminal.
JSComplete playground
This is a playground for JavaScript and React. You can use it to test simple code or prototype ideas. It requires a modern browser that understands ES2015 (ES6).
VSCode extensions Javascript REPL
Javascript REPL is a javascript playground for Visual Studio Code with live feedback(logs or errors) as you type, besides your code, in a log explorer, or in an output channel. It supports Javascript, TypeScript, CoffeeScript and it can be used for development in Node.js projects or with front-end frameworks like React, Vue, Angular, Svelte etc.

Does Protractor JS works for native mobile apps

I kind of think that answer of this question would be No by going through Protractor issue 1798 and Protractor vs Webdriver-IO comparisions.
I want to write automated tests cases for a hybrid mobile app in JavaScript which will run on Appium.
Currently I have both Protractor and Appium configured in same project to run those End-to-End test cases, and they work.
Problems are that,
I have to write separate test cases for each of them.
Cases should also work on mobile devices(Android and iOS) and protractor doesn't support native apps tests.
Situation is, I am more comfortable with Protractor's settings in my current project than Webdriver-IO which Appium uses (just a personal preference).
Question-
Is there a way of using only Protractor while writing test cases which would work using Appium and work perfectly on Devices/Emulators?
I am also open for any suggestion(s).
If answer remains No, I will change my codes to only use WebdriverIO in order to keep my test cases reusable and only once.
The answer is still NO protractor currently does not have support for mobile native apps but you can use it for automating browsers in your mobile.
Better use WebdriverIO but it also has its own limitations, please do check its changelog and github issues before deciding it as your webdriver framework.

JavaScript unit testing tools for Visual Studio / Build Server - any consensus yet?

Here's the situation:
We're a Microsoft shop using Visual Studio / TFS etc.
We have a build server that nightly performs builds for us and runs various tests to ensure nothing has been broken during the day
We're now doing more and more JavaScript and this is likely to continue.
None of our JavaScript is currently tested because as I've looked around I've found the JavaScript testing world is in a state of flux. There are lots of offerings which I've read about and I'm not sure which path to take. I found this question quite helpful in terms of just raw info:
JavaScript unit test tools for TDD
Ideally I'd like to use something which integrates nicely into Visual Studio and our TFS build server. Most of the JavaScript testing options do not seem to support this.
I found this article: (but I'm not too keen on using jscript for testing)
http://stephenwalther.com/blog/archive/2010/12/20/integrating-javascript-unit-tests-with-visual-studio.aspx
And I found this - which looks quite promising:
http://chutzpah.codeplex.com/
So what I'm wondering is, is there any consensus yet? Are people adopting one tool over another, is any approach gaining critical mass yet? I'm keen to make use of something which is clearly working for a lot of people already.
Is it worthwhile me sticking it out for a JavaScript testing framework that plays nice with Visual Studio / TFS or should I look to use one of the non Microsoft friendly offerings instead?
All insights appreciated!
I wouldn't got that far and state that I'm moving away from developing in MS environment.
I think Visual Studio is a great tool. Working a little with Eclipse & XCode, for PhoneGap development even gave me another perspective as to how Visual Studio really rocks.
Regarding JavaScript, there are many enhancements in Visual Studio 2012, but integral solution for Unit Testing is not yet part of it.
After being involved in some JavaScript heavy projects, also felt the need for Unit Testing, so started with In-Browser tests with QUnit and Sinon.JS.
I went out there to find the right stack to meet my expectations:
Seamless integration with Visual Studio.
So we can run tests without leaving the IDE.
Headless testing.
Against multiple browsers at the same time if possible.
Support for AMD (Asynchronous Module Definition) / Require.JS.
Support for Async Tests.
Documented libraries & Tools.
Free Tools are preferred.
Eventually find my perfect combination for Headless testing from inside the IDE with JS-Test-Driver.
I've written a 3 parts series on my blog:
Part I - Expectations & the selected Stack
Part II - Setting up the environment for Headless tests
Part III - Testing AMD/Require.JS Modules
You can find the last part here, with links to first 2 posts:
http://www.upstruct.net/2013/02/javascript-unit-testing-in-visual-part-3.html
Been using this combination in several projects, and got a very good feedback from the teams so far.
Let me know if it suits you...
I've been looking around for the same answer but am now wondering if I should move away from developing in an MS environment altogether. As more and more of what I do is on the client side, Visual Studio seems less relevant. Funnily enough though, since I've been playing with Eclipse I've had the same problem - lack of JS testing plugins! So I'm not sure there's a consensus outside of MS development. I think part of this is a reluctance of seasoned developers of C# / Java to use JS but rather they want to use a strongly typed language which compiles (using tools like GWT and Script Sharp). The result is confusion about what comprises best practice. But since the tools for JS seem to be improving I'm somewhat reluctantly coming to the conclusion that JS should be the first point for coding rather than adding another layer of abstraction. Thus I'm resigned to using their available tools - QUnit for the moment is my choise.
In 2021 it seems that Microsoft is recommending we use a NodeJS app to run our JavaScript Unit Tests. Visual Studio's test window can now see tests we write in that project even when the overall project is in C#:
https://learn.microsoft.com/en-us/visualstudio/javascript/unit-testing-javascript-with-visual-studio?view=vs-2019&tabs=mocha
One of the testing library combos (unit testing / mocking / assertions) recommended is using Mocha / Sinon / Chai. For this flavor there's a useful tutorial located here:
https://scotch.io/tutorials/how-to-test-nodejs-apps-using-mocha-chai-and-sinonjs

How to run unit-tests in all browsers?

I've never used Selenium but I guess it's for simulating user interaction in all browsers.
That's like integration tests.
But how do you test your js libraries/frameworks (unit testing) on all the browsers in an automated way?
For unit-testing you can try http://code.google.com/p/js-test-driver/
JsTestDriver consist of a single JAR file which contains everything you need to get started. For in depth discussion of command line option see GettingStarted.
Here is an overview of how JsTestDriver works at runtime...
You can have a look at TestSwarm:
project that I’m working on: TestSwarm...
Its construction is very simple. It’s a dumb JavaScript client that continually pings a central server looking for more tests to run. The server collects test suites and sends them out to the respective clients.
All the test suites are collected. For example, 1 “commit” can have 10 test suites associated with it (and be distributed to a selection of browsers)...
The nice thing about this construction is that it’s able to work in a fault-tolerant manner. Clients can come-and-go. At any given time there might be no Firefox 2s connected, at another time there could be thirty. The jobs are queued and divvied out as the load requires it. Additionally, the client is simple enough to be able to run on mobile devices (while being completely test framework agnostic)...
The best one imo is the one from YUI : http://developer.yahoo.com/yui/3/test/
But doing unit-testing in every browser is kind of hard... Most people just test with it during development and just use node.js to test later on in case they broke something.
As the referenced post in a previous article suggests, you could use js-test-driver.
Its specifically for JavaScript unit testing across multiple browsers, exactly what you want. I have messed around with it and it is pretty good. I haven't done any serious commercial testing in it though.
For unit testing you should look at solutions that do not load up a browser to do the tests.
You can look at something like RhinoUnit for that - http://code.google.com/p/rhinounit
Also have a look at Dojo Object Harness (DOH) unit test framework http://dojotoolkit.org/reference-guide/util/doh.html
Look at a similar question here which can give you an idea on how to TDD js - JavaScript unit test tools for TDD
It's no longer actively maintained, but I've still been happy with JSUnit for Javascript unit testing: https://github.com/pivotal/jsunit
It includes both an HTML/Javascript framework you can run in the browser, and a java-based test runner that you can invoke from ant.
To test multiple browsers in parallel you would Selenium Grid. Please take a look here: http://selenium-grid.seleniumhq.org/step_by_step_installation_instructions_for_windows.html for step by step instructions on how to use it.
I haven't used it so far, and it is still in beta, but FuncUnit declares itself as "A functional test suite based of qUnit, Selenium and jQuery".
There is also an infographic explaining how it works
Maybe it is something what you want? The github repo seems to be quite active.
You should check http://saucelabs.com its a cloud base selenium environment that allow you to build your test and then upload them, run them in as many browsers as you want.
You should consider the capabilities offered by crossbrowsertesting.com
(It is not for free). For js testing try JsUnit (http://www.jsunit.net/).
Quoted from its homepage
JsUnit is a Unit Testing framework for client-side (in-browser) JavaScript. It is essentially a port of JUnit to JavaScript. Also included is a platform for automating the execution of tests on multiple browsers and mutiple machines running different OSs.
As people have already said so, you should use JsTestDriver. It has it's own test system, but you can use other test libraries with it, for example Jasmine ( http://pivotal.github.com/jasmine/ ). You can find a list of adaptors for JsTestDriver here: http://code.google.com/p/js-test-driver/wiki/XUnitCompatibility
I'd go for QUnit, which is what jQuery uses. I've ran it on lots of desktop browsers as well as iPhones and Android phones.
There's some great tutorials and it can be integrated easily with things like js-test-driver. QUnit is modeled after JUnit and all the other xUnit testing frameworks (like PHPUnit) so it's easy to pick up the API.
The basic syntax is as follows:
test("my first test", function() {
var str = "hello";
equals( "hello", str, "Should be hello" );
});
It also looks quite nice:
There are few companies that specialize in cross browser testing.
http://browserling.com/
http://www.browserstack.com/
http://saucelabs.com/ (already mentioned here)
http://browsershots.org/
http://www.browsercam.com/
http://browserseal.com/
Use whatever testing lib you want.
Selenium or SauceLabs etc are not unit testing. They are functional/integration testing solutions.
You need to abstract your external usages like DOM to unit test javascript.
Write your tests so that they can use any external library like jquery by configuration. So that, you can unit test your logic without touching any externality and you can also both test cross-browser testing.

What is a good tool for unit testing javascript in a maven webapp / liftweb project?

I want to unit test the javascript I have embedded in the webapp portion of my liftweb project. Liftweb is a subset of the maven webapp archetype, so my question applies to that framework as well.
By 'good', I mean that the tests can be integrated into the maven automated testing.
I understand that different browsers support different versions of ecmascript, so I am okay with a testing solution that restricts itself to one specific version.
JSUnit might help with JavaScript testing.
I like QUnit for testing javascript. I have no idea how well it fits in with the maven test automation tools. I do know that you can extract the test results in a format that is more friendly to automated builds.
Typical solutions I've seen for including javascript with other forms of automated testing utilize a tool like Selenium or WATiR/WATiN to fire up a browser and execute the tests. Of course there is also TestSwarm if you want a way to test javascript against multiple browsers in an automated fashion, but again I am not sure what the capabilities are as far as integrating with other automated testing systems.
Some things that you may find helpful in testing your javascript applications:
QUnit http://docs.jquery.com/QUnit
Env.js http://github.com/thatcher/env-js

Categories