Large-scale applications using protractor? - angularjs

I would like to see source code of large applications (if possible, in production) with e2e tests using protractor.
Could anybody provide links to such apps?

As others have said, finding such source code with associated tests may prove to be difficult.
After doing some searching, this is the closest thing I could find.
http://product.moveline.com/testing-angular-apps-end-to-end-with-protractor.html
Perhaps you would be better off finding the differences between how unit tests and e2e tests using Protractor are performed and go from there?
For unit tests, I have found the AngularUI/Bootstrap source and tests to be an invaluable resource. Good luck!

Related

How to measure code coverage in a webapp through unit and functional tests

I'm a little bit stuck with a task that I have been researching. It's about code coverage in a react webapp.
I implemented a few unit tests using jest + enzyme. also some functional test, using cucumber to get gherkin features and puppeteer for browser automation.
I have able to get the coverage from the code built by webpack and served on my localhost using puppeteer and istanbul through functional tests. Also, I get code coverage from unit test using jest (btw, it include istanbul to do that).
The problem is: I feel those are two diferents metrics, because I test components with jest + enzyme file by file, and in the other hand, I have code coverage from puppeteer that actually is a single built js file.
The goal should be get code coverage from unit tests and functional tests.
So, my questions are:
has sense, mesure the code coverage on unit tests and functional tests?
has sense, merge code coverage from unit tests and functional tests? and if has sense how to do that?
what is the best aproach to get code coverage from a webapp?
Overall your approach to measuring, recording and reporting code coverage will be tailored to your use case. This means that there aren't clear right or wrong answers to your question. I am going to try to give you ideas that help you decide the best approach for you and your team.
I would start by asking yourself why are we measuring code coverage? I.E. what is the change in how the team operates that you are trying to create? I will come back to this question while answering your specific questions.
It is worth at this point making sure that code coverage will encourage the behavior you are looking for. For more on this look at this paper. I have tried to tackle this question in a recent blog post.
I am making a few assumptions here about the layout of the team that you are working in so please forgive me if the assumptions are wrong.
measure the code coverage on unit tests and functional tests?
If you want to encourage the team to write tests, or, automate a significant portion of testing then yes it is appropriate to measure code coverage as it is a great measure of whether people are adding tests at the same rate as the code is changing.
merge code coverage from unit tests and functional tests?
Let's consider the example where you want to encourage developers to write more unit tests. In this case, I would say no, don't merge coverage. The desired behavior change is for the developers to write more tests, therefore, you don't want to mask their lack of testing by reporting a metric that includes functional tests from a QA team.
However, if you are considering the Software Engineering team and would like more testing from the whole team (Developers and QA) then absolutely combine the coverage numbers and report the total coverage.
if has sense how to do that?
There are plenty of tools out there that will allow you to combine coverage information from multiple runs. One of my favorites (assuming you can use cloud-based services) is CodeCov. This is a great way of visualizing your code coverage with minimal setup effort.
what is the best approach to get code coverage from a webapp?
I am going to leave this one for someone who understands in more detail than I do the technologies that you are using.

Automated Accessibilty Testing Tools For Angular SPAs

I am wondering if anyone has experience with an automated accessibility testing tool for Angular Single Page Applications (SPA).
I have tried pa11y and it does not seem to be working consistently. Just wondering if there are any other tools out there which are comparable to pa11y in ease of use, but which work with Angular.
#Estus raised a good point in the comment — "does not seem to be working consistently" is not a lot to go on. Regardless, a couple options:
Take a look at protractor-accessibility-plugin for NPM which can lean on the Chrome Accessibility Developer Tools or Tenon.
Related, there is a tutorial on using Tenon as a Grunt task.
Level Access offers an implementation example of Continuum called 'Continuum for Protractor' that might be a good place to get started. It's available for free at webaccessibility.com. You can use it as a template or as a reference to integrate automated accessibility testing into your existing Protractor tests. Here's some more information if you're interested. I also help maintain Continuum Explorer, which is a free extension for Google Chrome that is framework-agnostic and more interactive if you think that might be a better match for your use case.

Adding functional tests to a Backbone.js application

I'm sorry if this question isn't appropriate: I'm new to test-driven development, especially on JavaScript.
I have a working Backbone.js application, and I'd like to add some JavaScript tests to it. But I don't really know where to start.
Specifically, I'd like to write tests that are passed a URL, and check that the rendered page contains particular DOM elements. (So functional tests, rather than unit tests, I guess.)
What is a good way to do this? Could anyone recommend good practical resources for getting tests like this up and running?
Apologies for the newbie question.
I have faced the same problem lately and Ryan Roemer book Backbone.js Testing (http://backbone-testing.com/) is a great place to start.
His process is not purely TDD, but he gives some nice tips.
When taking it to practice, I will recommend a Yeoman generator like:
https://github.com/mrichard/generator-marionette (Marionette)
https://github.com/revathskumar/generator-backbone-mocha (Backbone and Mocha)
https://github.com/richistron/generator-cornelio (Karma and Backbone)
They will save you some time on the setup. Also, if you are using Rails, Konacha https://github.com/jfirebaugh/konacha has been pretty handy for me.
Good testing!
Selenium is on de-factor way to run functional tests in the browser. Selenium has a firefox plugin that will record actions and replay them. That would be the easiest way to start. You can look at Selenium's API docs to write code to interact with the browser.
Sause Labs (http://saucelabs.com/docs/quickstart) has selenium in the cloud which is useful so you don't need to have a browser window open on you desktop and run the tests. PhantomJS can also run a "headless" browser (it does't open a window on you computer, just runs in the background).
Once you have selenium working you might want to look into acceptance testing. The tests are written in plain english use Gherkin (or similar) syntax and it runs functions to run the test and output reports if there were errors or not.
I wrote an article how to use Selenium for Acceptance Testing http://alex-craft.com/blog/2014/acceptance-testing-for-web-app
Tools: WebDriver (Selenium or Phantom.js), wd.js, node.js, mocha.js.
There's an example with explanation how to use meaningful names instead of CSS selectors, eventual conditions, etc.

What are the differences between Selenium Webdriver and angular e2e and when should each be used?

I need to test an angular application and I'm thinking which testing framework to use.
Can someone please list the differences between those 2 testing framework, what is good / bad in each. when should each of them should be used? can the one replace the second?
Edit 1:
I'll try to focus my question. what I'm really interested in is the technical abilities of the 2 frameworks.
for example, some of the differences I have found:
selenium webdriver has the ability to run on grid in parallel on multiple machines, on the other side, angular scenarios runs much faster than selenium.
with selenium I can use keyboard keys such as Enter, Backspace and more and also do drag and drop actions.
selenium is not dependent on the app technology, angular is for angular apps only
Those are the type of differences I'm looking for - what can be done with one and can't be done with the other
thanks
Both should be used for testing an angular application. However, in my experience, they serve different purposes.
Angular e2e tests are your best friends when integrating new features into your application, or changing already existing features. They are there to make sure your application still behaves as expected if you are making changes to your code. These tests are much faster than selenium, do not need to be as in-depth, and, in my experience, are best executed before you push a new feature to your version control server.
Selenium tests should be used for regression testing. These tests should be far more in-depth than Angular e2e tests, and should be performed before pushing code into production.
UPDATE: This question may be less relevant now. As of January 2014, Angular plans to move from their own E2E suite to the protractor library for function tests, which use Selenium Webdriver.
If you're starting a new Angular project, you may want to look into using Protractor, as it is going to replace the current method of E2E Testing in the near future.
(Source: http://docs.angularjs.org/guide/dev_guide.e2e-testing)
I am struggling with this question as well.
Here is my thinking today:
1) Use Angular e2e testing for integration/regression testing the UI with mocks of your external dependencies (like the app server).
2) Use Selenium for integration/regression testing the complete system in a test/qa environment.
It seems Angular e2e testing helps fill in the gaps that unit testing leaves in testing view and controller logic that is tied to UI events. All of the Angular tests should mock external dependencies.
Selenium seems like the best fit for testing the entire system as the user will experience it.
This is such a subjective question, and therefore I'd first tell you to do some research. There is not much difference.
It is a very new project, whereas Selenium is a lot more mature. For instance, the JSON Wire Protocol that WebDriver is built on top of, is an actual W3C spec. This shows the project is very mature and very stable.
Due to the above, Selenium has a much much wider set of documentation, and a much wider community.
With Selenium you have a variety of different languages to use to code the tests in, as well as use the IDE. Angular limits use to pure JavaScript. For a lot of manual testers, this is a skill most do not have.
Both Selenium and Angular are open source, which (believe me) helps tremendously in debugging problems and understanding design decisions in their respective API's.

First time unit testing (in silverlight)

Hi I've searched some other posts, but most of them assumed that people knew what they were doing in their unit testing, and frankly I don't. I see the idea behind unit testing, and I'm coding an silverlight application much in the blind right now, and I'd like to write some unit tests to kind of be sure I'm on the right path. I'd like to be able to use the SL4 vs 2010 silverlight unit test project template, to keep it simple and not use external tools. So what I need an answer for are questions like:
what are the methods of unit testing?
what are the differences between unit tests, and automated unit tests?
How do I meaningfully unit test in silverlight?
What should I be aware of while unit testing (in silverlight) ?
Also should I implement some kind of IRepository pattern in my silverlight app to make unit testing easier?
EDIT:
I will be posting useful links here as I explore this along the way:
Implementing MVVM in silverlight - http://community.infragistics.com/pixel8/media/p/91949.aspx
Mix10 MVVM talk - http://live.visitmix.com/MIX10/Sessions/EX14
Unit testing Ria apps - Link
PK's great resource: http://dotenetscribbles.blogspot.com/2009/12/unit-testing-dependency-injection-and.html
I have never used silverlight unit test project template. I have only used nunit to do unit testing in silverlight. So, I will leave that for someone else to answer.
As far as your other questions are concerned:
Unit testing should drive your design. Your unit tests are first users of your code. Your code is based on some expectation and unit tests verify that expectations are being met. Using MVVM pattern (as you are using silverlight), facilitates unit testing. The most important thing to remember is that you have to write testable code. And to write testable code, the most important thing to remember is to inject dependencies. For example, if your code makes a call to the db. You, can't have a unit test making a call to the DB. Instead, you will mock your data acccess layer. This is where concepts like mocks and stubs come into picture. I use moq for mocking in my sivlerlight unit tests. Another, important thing I follow which I think facilitates unit testing is single responsibility principle. Finally, treat your test code as production code, else your tests might give you a false notion, that expectations are being met. Your unit tests are code and hence can have bugs.
what are the differences between unit
tests, and automated unit tests?
I am not very sure what do you mean by this. Unit tests are an automated way of white box testing. You can have scripts which run all unit tests, every time you checkin any code in the repository. This can be part of continuous integration.
How do I meaningfully unit test in
silverlight
In silverlight, to facilitate testing you should use commands, instead of writing code in code-behind files. This allows you to simulate button click and other GUI events while unit testing. Using MVVM pattern along with commands, you can test all of C# code (not xaml), right up to UI (Converter, VMs, etc).
It is very difficult to mention everything in this one answer. I would suggest, you google for MVVM, commands in Silverlight, Martin fowler - mock are not stubs, mocking frameworks for silverlight, dependency injection

Resources