d3 Automation Testing - angularjs

I need to test some d3 based Angular components and had thought to use Selenium IDE or Kantu, but it seems that these tools cannot record interactions with SVG elements. Are there any tools that would allow me test in this way? Or will I need to rethink the problem and use a different type of testing?

There is a tool specifically made for UI testing of angular.js pages. It's called protractor . In this, test scripts have to be written in Javascript. Protractor is for end-to-end testing.
If you are going to do unit testing , then the gold standard for unit testing angular code is Karma. Karma was created and is maintained by the core Angular team and provides many utilities that make it easy to test angular apps.
A combination of both protractor and karma can completely cover an angular app functionality.

Related

what are options for automated unit testing in angular js

I'm new for unit testing so i want to know best automated option for angular js app testing.
I found some framework call Jasmine and Karma but I want to know best option.

unit testing of AngularJS code deployed under JBoss 7.1EAP

We all know that one of the best combination for Unit testing for AngularJS code is NodeJS, Jasmine and Karma js framework .
However challenge with our project is that client doesn’t want to use two containers i.e. NodeJS for testing and Jboss for deployment. Reason is the way Angular JS components are packaged for nodeJS is very different from Jboss. Also another angle to this problem is that angular components should be tested in a continuous integration environment. If you have two containers it makes whole CI/CD cycle complex.
Hence we are trying to find out a way on to how to execute these unit test cases with only Jasmine with JBoss 7.1EAP. And without using Nodes and Karma.
Please let us know if someone has faced this issue and let us know the steps for the resolution.
Regards
Debashish

how to test angularjs app using Protractor

I am currently using Karma and Jasmine for doing the unit test my first angular App.
Now I want to test my App's HTML elements but I couldn't find any way to do that in karma test runner. I read that this is only possible with protractor. I have no idea of writing and running test in protractor, can anyone help me out?
OR
Suggest if there is a way to test HTML in karma?
Because I am using Karma for controller testing, is it possible to test HTML as well in Karma then it'll be super helpful.
For protractor, can I test my controller as well in protractor??
First of all, there are two very different major types of tests/categories that are usually written for AngularJS applications: unit tests and end-to-end tests.
For unit testing of your directives, controllers, services - use karma.
For end-to-end testing - use protractor.
Related quote from the Protractor's FAQ:
Karma is a great tool for unit testing, and Protractor is intended for
end to end or integration testing. This means that small tests for the
logic of your individual controllers, directives, and services should
be run using Karma. Big tests in which you have a running instance of
your entire application should be run using Protractor. Protractor is
intended to run tests from a user's point of view - if your test could
be written down as instructions for a human interacting with your
application, it should be an end to end test written with Protractor.
See also:
Should I be using Protractor or Karma for my end-to-end testing?
Can Protractor and Karma be used together?
Advanced Testing and Debugging in AngularJS

Can angularjs apps be automated with selenium? if yes, why should we use protractor?

I know that we can automate AngularJs apps with Selenium. But we have a separate E2E testing framework that is Protractor for AngularJs apps automation.
Can anyone help me understand why we should use Protractor? Why not Selenium?
Not sure I understand your question. Am I right to assume you'd rather use Selenium - but want to understand what you're missing?
Well - Selenium provides means to automate web browsers - and thus used for automated e2e tests. Selenium API has implementations in several major programming languages - allowing you to write your tests in Java, C#, python, ruby, JavaScript and more.
If you already have a selenium-based e2e testing framework in place - you can use it also for AngularJS web-apps. You can also write the necessary JavaScript scripts that, once ran using the webdriver - will let you do all that Protractor does - but you'll have to do it yourself (just borrow from Protractor source code).
Why is it doable? Because Protractor basically took the JavaScript implementation of Selenium Webdriver and wrapped it in a way that makes your life a bit easier when testing Angular JS web apps.
You can see specific explanations in this old post of mine:
http://testautomation.applitools.com/post/94994807787/protractor-vs-selenium-which-is-easier
I'd say that if you:
1. want to write your test code in JavaScript
2. are focused on mainly Angular JS apps
You might want to consider using Protractor. Again - no magic there. Everything they did is there in their source code - so you can just take your picks if you'd rather stick with selenium.
protractor is an end-to-end browser automation testing framework that works through WebDriverJs which is a javascript selenium webdriver.
Quote from How it works? documentation page:
Selenium is a browser automation framework. Selenium includes the
Selenium Server, the WebDriver APIs, and the WebDriver browser
drivers.
Protractor works in conjunction with Selenium to provide an automated
test infrastructure that can simulate a user’s interaction with an
Angular application running in a browser or mobile device.
Protractor is a wrapper around WebDriverJS, the JavaScript bindings
for the Selenium WebDriver API.
Also see:
Automated e2e testing- WebDriverJS, Jasmine and Protractor
With protractor, you can write e2e tests with JavaScript, the language you write with Angular app.
Also, it has Angular-specific features.
Its element finders wait for Angular's $digest loop and $http to finish. So you'll have less chance to struggle with sleep and timing issues.
You can select elements with some of common directives such as ng-model, ng-repeat, ng-bind and etc. This is somewhat handy because you may have relatively less ids and classes in Angular apps because you need them only for CSS.

Is there a code coverage for HTML using Karma when doing angular e2e test?

We can use coverage to see how much javascript code is covered with our unit testing. With e2e testing we are literally testing view components in HTML code against controller. So the question is, is there same code coverage available for how much of HTML DOM elements are covered or touched in our e2e testing? I agree, there is a big difference in the execution path testing and UI testing. but curious.
Thanks
As I know e2e testing use your files served by your web server, for unit test they are served directly by karma, e2e testing is mostly used to be sure your page work like you expect, end-to-end test use your server side and client side. That's why you typically never expected to have 100% e2e coverage because they are more fragile.
So people focus on unit test (testing all edge-cases), and they add e2e test to be sure the behavior of the page works correctly.
You can use istanbul and build the coverage report with karma.
http://gotwarlost.github.io/istanbul/
Or this article : http://lkrnac.net/blog/2014/04/measuring-code-coverage-by-protractor/ sum up how to use protractor e2e to generate coverage report of your e2e tests. Using using this tool : https://github.com/r3b/grunt-protractor-coverage
Hope it's help.

Resources