Is protractor Angular's new scenario runner? - angularjs

I heard recently that, Angular is switching to Protractor as the new end to end testing tool, is my understanding correct? I cloned and looked at the sample. I am able to run jasmine-node to see all the tests run fine. I am able to follow the example code, but just curious, Is there any write up available on this? I did not find any good documentation on it.
Thanks

In the AngularJS 1.2 and Beyond meetup last night they talked about Protractor and said that they are migrating all of their end to end tests to Protractor. It sounded like this is in the early stages but is the direction they are going. The slides are at: https://docs.google.com/presentation/d/1WHCcp3G3HxoE7b_ut_ERKJF4zQK_P4qFlESjE2E9AUQ/edit and I assume the video will be available in a couple of days. Here's the link to the meetup:
http://www.meetup.com/AngularJS-MTV/events/120927882/
btw, there was a ton of really interesting info in the meetup -- well worth the watch.

Yes it is since AngularJS 1.2. As you may see here, protractor is now part of the Angular's GitHub repository:
https://github.com/angular/protractor
You can start reading here:
https://github.com/angular/protractor/blob/master/docs/getting-started.md

Related

How to upgrade from angular 1.4 to angular 5?

To upgrade from angular 1.4 to Angular 5 is it possible to use ngupgrade and follow incremental approach or it is strictly applicable to use ngupgrade from version 1.5. According to the image the prerequisites mentioned 1.5 is used for ngUpgrade.
There is official upgrade guide:
https://angular.io/guide/upgrade or https://angular.io/guide/upgrade-performance
But as a person who have written a big AngularJS application and now is working on a big Angular project, I recommend to start a new fresh project and step-by-step write a complete new application in the newest Angular. By my experience, switching between both frameworks is really hard and time-consuming.
In Angular things work totally different (better) and the framework itself offers much more than AngularJS.
If you still want to go the upgrade way, do it in 2 steps:
Upgrade to 1.5 (because there must be a reason why it is required)
Upgrade to Angular
Take a look at this article: https://angular.io/guide/upgrade
And you can upgrade or downgrade services and components between two frameworks.
You should know that there are two ways to bootstrap a Hybrid App:
Using UpgradeModule - Bootstraps both the AngularJS (v1) and Angular (v6) frameworks in the Angular zone
Using DowngradeModule - Bootstraps AngularJS outside of the Angular zone and keeps the two change detection systems separate.
I have tried both ways. And I recommend using DowngradeModule - it's better for performance and memory leaks.
If you google angular hybrid you will find a lot of articles and examples on github
Certainly look at https://angular.io/guide/upgrade to start. It's been a while since I've looked at it and it appears to have significant updates, which is nice. The "Preparation" section still reminds me of the joke: "How to be a millionaire and not pay taxes? Step 1: Get a million dollars." One section of preparation is "Using a Module Loader" which tells you why, but you're still on your own to figure out how to go from, say, grunt to webpack. It's beyond the scope of that page, sure, but that feels like big amorphous step to sort out.
I did find a developer, Sam Julien, that put together a guided video "course" which takes an app and walks through converting it. It is at https://www.upgradingangularjs.com and is certainly more comprehensive than any blog post I've seen. I'm not affiliated but it has gotten me started on laying out some of what we need to change.
It's not a trivial undertaking but being able to see the stages laid out ahead of time has made it seem incrementally possible. (Luckily, we are pretty close to the angularjs style guide already, which is another preparation step.) Good luck!

Why the famo.us/angular is no longer supported by Famo.us

I've found Famo.us when I try to make better animation on mobile devices. But as a angular developer, I still want to use ionic in my next App, so the famo.us/angular comes to me.
When I starting to research it on github, it says
This integration library is no longer supported by Famo.us
Github link : famous-angular
But I can't find any more explanation about the statement.
Can anyone give me some information about that statement? Are there any risks or issues if I still use it?
Here's what happened.
It's up to you whether you use it, but my feelings would be no. To be honest I'm sure if you hunt around you'll find something much more up to date anyway.
I know a few people have success with the Ionic framework, another could be ngFX. Personally I've been pretty happy with Angular's native ngAnimate of late, it's definitely been improved in most recent releases. Combining this with css animation and you have everything you need.

How can I select a value in a <select> list using Angular's Protractor 0.24 version?

Protractor seems to be getting better every week and I am now using the 0.24 version. Unfortunately I was not able to find out how I can simulate clicking a value from a <select> list.
Can someone give me an example of how they select a value from a populated <select> or even better point me to a place in the documentation where this is explained. For reference I did see the question: How to select option in drop down protractorjs e2e tests however as things are changing so quickly I would like to know is if using xpath is still the recommended way to do a select or have any users come up with a better solutions with the latest version of Protractor. As I have a lot of coding to do I would like to be sure I am using the best approach.
I have adapted the code from #PaulL in How to select option in drop down protractorjs e2e tests.
var selectDropdownbyNum = function (selectElement, optionNum) {
if (optionNum){
selectElement.all(by.tagName('option'))
.then(function(options){
options[optionNum].click();
});
}
};
Protractor 0.24.0 "is a big change with lots of breaking stuff". There are described by Julie Ralph (the protractor main developer) in this g+ post.
I follow her on google+ to be notified of the new releases.
In this case findElements have been replaced by all.
Finding good documentations is quite difficult. Often, i walk through the protractor specs on github to find working examples.
I used by.css and it worked fine for me.
actionPage.findElement(protractor.By.css('.NEW_CLAUSE_PANEL div:nth-child(2) span select option:nth-child(3)')).click()

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.

Integrating karma-runner and cucumberjs

Has anyone used karma-runner/testacular to execute cucumberjs tests? I suspect that I may have to write an adapter like the Jasmine adapter. Any knowledge on integrating a test library with karam-runner would be much appreciated.
I'm currently using an adapter I wrote: https://npmjs.org/package/karma-cucumberjs
It's been working fine for me, I'm now using it on a second project. But I am sure there are changes that I could do to it once people start using it and finding things they wish it did. Let me know if there are any problems, you can email me at s9tpepper#apache.org or just use the GitHub issues on the repository. I don't check StackOverflow all that much unless I'm looking for an answer to a specific question.
This seems to be something people want. Jon Perl started karma-cucumber recently. It does not include a Karma reporter for Cucumber.js yet but seems to be the plan.
I'll also be looking into this in the near future.

Resources