I'm trying to stick to the pure angular recommendations for unit testing:
https://docs.angularjs.org/guide/unit-testing
But it really doesn't tell me where they should live. My guess would be inside an angular service, probably segregated by page or in the same file as the base controller, sort of a base testing factory or service.
If you use the CLI to create your app and new objects, it will automatically create all of the tests as separate files with the .spec.ts extension.
So if the CLI does it that way, that is probably the recommended way.
Related
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.
There are 2 things available in angular :
1.angular cli
2.angularjs
please describe briefly. thanks
Angular-cli a command line interface. and it helps to add new components, directives, and services, from the command line;
it builds application based on your input. you can add code, test cases via command itself...
AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your ... you need angularjs library to develop application
Angular-CLI is a TOOL to create your angular 2 application. It provides commands to generate code such as components, services and directives to make angular 2 development easier to the developer. It also allows you to build your application and serve your application as you are developing.
AngularJS : Is the famous JavaScript based framework.
Resume : In general we install Angular-CLI globally to help us in initialization or modification of our Angular projects
In a very simple words,
Angular CLI is a command line interface for writing or easily setting/building up an angular application.
Its just like building a java application from a simple notepad (even though we have other IDEs to help)
Angular js - is a older version of Angular (version 1.x) which is a open-source JavaScript-based front-end web application framework.
AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly.It controlls the code to what it actually to do...
Angular CLI is "Command Line Interface".it needs command to run and perform any operations and it is mandatory for angular 2 and not for angular 1.
The CLI is used to start an Angular 2 application, and add new components, directives, and services, from the command line; it builds application “scaffolding” based on your input. It lets you add code, and unit tests, to an application quickly. Afterward, you fill in the actual business code.
The quick start is just a pre-coded application to give you an idea of what you can do with Angular 2 without having to write any code of you own.
Angualrjs- is nothing but just angular package which you can install in your system for further development.
Angular-cli- comes up with additional feature to make developer life easy it basically create a boilerplate code for you
for ex: structure of your project and you want to add ant component class or service class in project so you can point to your directory and run this command
"ng generate service [name]" it will automatically create a service class for you with initial configuration.
I have this app module
angular
.module('history.components.genericAddress', ['history.filters']);
.service('constantsSrv', ConstantsServiceController)
.service('addressesService', AddressesServiceController)
and another one
angular
.module('APP')
.service('constantsSrv', ConstantsServiceController)
.service('addressesService', AddressesServiceController);
in two diff files and folders, because there are two diff applications.
I have two services that I use in both modules. I want to put in separate file both services and not anymore inside of each module body. Because each module depends on diff app I don't know how what to put in the top of the new file with both services.
One has module('history.components.genericAddress') and another .module('APP').
I ask this question because I want to make a ver 1.5 angular component and to put that component in many apps. Those 2 services are important for the component.
Please someone give me an idea how to do this because I don't know how to make this service file that will work in any app without changing anything.
So my question is only about how module('what to put here') and not how to make the code for services.
Try this.
angular
.module('Service_module')
.service('service1', function(){});
use in any module like.
1. angular
.module('FirstAPP',['Service_module'])
2. angular
.module('SecondAPP',['Service_module'])
how to access this variable "process.env.endPointAPI" in yeoman
in the factories Services ?
I want to call the API from different server?
To complement my comment to the question and to provide a more detailed answer:
It is necessary more info regarding your code. I guess you are using a yeoman generator with nodejs server side, maybe with expressjs. If that is the case then you need to pass process.env.endPointAPI via express with the help of your templating engine or change your grunt/gulp tasks to include it in a custom angular factory (for example) when you serve/build your app.
This article describes some of these situations step-by-step.
If the options in the article above don't work for you for some reason, and you are using grunt, maybe you can give grunt-ng-constant a try. Basically, it will generate you a custom constant-value utility for Angular. Once injected in your app module you can access those values from your controllers for example.
I want to know what's the difference between JASMINE_ADAPTER and ANGULAR_SCENARIO_ADAPTER ?
Because i'm using yeoman with angular and i've got two karma config files one with JASMINE_ADAPTER and other with ANGULAR_SCENARIO_ADAPTER.
Thanks for your answers.
Tom
Jasmine and Angular Scenario are two different things. Angular Scenario is simply built to look like Jasmine testing code. They both use describe(), it(), and have similar "framework" styles.
The fundamental difference is that Jasmine is more Javascript-testing oriented while Angular Scenario is more DOM oriented.
For example, Angular Scenario can be used to test whether or not your AngularJs code correctly creates DOM objects, while Jasmine tests the Javascript itself.
A big difference between the two is that Angular Scenario allows you to open a "browser" (as a frame) and fully load the page, whereas Jasmine just loads Javascript.
browser().navigateTo("http://www.stackoverflow.com");
can only be done in Angular Scenario.
Similarly, Angular Scenario can manipulate DOM objects. You can fill out forms and select objects, like:
input("username").enter("my_username");
input("password").enter("my_password");
element(".submitButton").click();
I highly recommend you look at:
http://docs.angularjs.org/guide/dev_guide.e2e-testing and http://pivotal.github.io/jasmine/