I'm trying to set up my end-to-end testing and I hear that we should be using protractor now, https://docs.angularjs.org/guide/e2e-testing
However, my entire project is CoffeeScript based and I'd hate to have just a little bit of JS if I can avoid it. Any way for me to use protractor with CoffeeScript?
Yes you can. (Thanks #rjferguson21 for the update on By being global).
Your main difficulty lies in the fact that by (lower-case "B") is a reserved word in CoffeeScript. But By (upper-case "B") is a global and is not reserved.
describe 'such and such', ->
describe 'with protractor', ->
testElement = element By.model('testElement')
testElement.clear()
testElement.sendKeys('123')
expect(testelement.getAttribute('value')).toEqual '123'
All the protractor tutorials refer to by so be mindful to change them to By in your CoffeeScript files.
Support for CoffeeScript should work out of the box for both configuration files, as well as your spec files.
I am running version 0.20.1 of protractor with CoffeeScript 1.7.1
Related
I am writing a Ruby gem where in I provide many angular directives.
Directives are written using the following folder structure, e.g.
app
- assets
- javascripts
- components
- dropdown
- dropdown.html
- dropdown.service.coffee
- index.coffee (this has directive code)
spec
- javascripts
- dropdown
- dropdown.service_spec.coffee (jasmine test)
Now since this is a gem, I want to keep it so and not make it a Rails app. It will make it harder for people to use it as gem
But I want to able to test the directives. I cannot do so automatically.
I want to know how can I run these Jasmine tests written in coffeescript locally/ manually by firing up an HTML page?
You'll need to create a HTML file that adds your files, jasmine, and run tests.
Instead of doing that yourself, you can use one of the numerous existing boilerplates, like this one:
https://github.com/andrewvida/coffeescript-jasmine-boilerplate
I have some Jasmine tests for my (currently) very simple site consisting of a Rails back end and an AngularJS front end. I'm trying to do some Jasmine end-to-end testing, but including angular-scenario.js makes my tests not run. It doesn't make them fail. It makes them not start at all.
I'm using version 1.0.7, and all the Angular files are from the same version (and all from the official Angular site. The version of Rails I'm using is 3.1.3 with Ruby 1.9.3. I'm also using the jasmine gem version 1.3.2 and jasmine-rails 0.4.5.
spec/javascripts/support/jasmine.yml:
src_files:
- assets/application.{js,coffee}
stylesheets:
- stylesheets/**/*.css
helpers:
- helpers/**/*.{js,coffee}
- lib/angular-scenario.js
spec_files:
- '**/*[sS]pec.{js,coffee}'
src_dir: 'app/assets/javascripts'
spec_dir: spec/javascripts
spec/javascripts/spec_helper.coffee:
#= require angular.min
#= require angular-mocks
spec/javascripts/templates/brands/index_spec.coffee:
describe 'test', () ->
it 'works', () ->
expect(true).toEqual(true)
Of course, that's just a placeholder until I can get the test work correctly with angular-scenario.js in place.
Without angular-scenario.js, the tests run. With it, nothing.
To test, I typically run RAILS_ENV=test rake spec:javascript, but I've also tried from the web server interface.
The output without angular-secnario.js:
Starting...
Finished
-----------------
1 spec, 0 failures in 0.005s.
ConsoleReporter finished
The output with angular-scenario.js:
Starting...
Finished
-----------------
0 specs, 0 failures in 0s.
ConsoleReporter finished
Things I've tried:
Moving angular-scenario.js to vendor/assets/javacripts and requiring it from spec_helper.coffee.
Removing either other Angular-related requirement from spec_helper.coffee.
angular-scenario.js comes with jQuery packaged with it. Commenting out the jQuery bit, oddly enough, makes the tests run, though they fail because angular-scenario needs jQuery, apparently. I also tried commenting out the jQuery in angular-scenario and including jQuery from the jquery-rails gem. (That was a shot in the dark. I didn't think that would actually work.)
Thank you very much to whoever wants to take a swing at this one.
Jasmine and angular-scenario.js (e2e runner) are two different things and they should be run separately. Angular e2e test framework uses syntax which is very similar to jasmine. Probably when you include it along with jasmine it overrides some jasmine's methods like describe, it and beforeEach.
I am having a problem to figure out how to setup Jasmine with modules from RequireJS.
Basically, I want to test a first view:
it("can load sandbox", function() {
var view = new ItemView();
node = view.render().el;
expect(node).toContain("<li>Test</li>");
});
I don't see that ItemView can be defined as Backbone view, or how to inject Backbone into my tests with requirejs. Now, I see some discussions on using testr.js on one hand, on the other hand, I've found a git repo that does a setup of SpecRunner.js : http://github.com/uzikilon/Todos.git
Ideally, I would just be running
rake jasmine
from my project directory, but how would should Jasmine and Require.js be talking to each other?
Many thanks if someone has feedback, eventually, with a pull request on this experimental repo: https://github.com/mulderp/backbone-require-test
Uzi Kilon, who is the author of the github repo you linked to, wrote an article about how to set the two up together, here.
The other part of your question seems to suggest you want to automate the running of the tests, one way to do that is using PhantomJS the headless webkit implementation. You'll find an article about that here
How is backbone.js is getting loaded in your ItemView? If you define require.js configuration that could be shared between your production code and Jasmine tests. Again there are different ways developers do to achieve this.
I'm trying to setup my AngularJS application to test out controllers, routes, templates and so on, but I'm having an issue getting some of the helper methods provided by the angular-mocks.js to work (namely module and inject).
I'm using testacular to load up the test suite with the following files added before the specs:
files = [
MOCHA,
MOCHA_ADAPTER,
'../application/lib/angular.min.js',
'./lib/angular/angular-mocks.js',
'./lib/angular/angular-scenario.js',
'../application/application.js',
'./lib/chai.js',
'./lib/chai-should.js',
'./lib/chai-expect.js',
'./spec/**/*.js'
];
So far so good, but when I run the tests I get this issue:
ReferenceError: Can't find variable: module
Not sure where this is loaded. Am I missing something?
First thing to check is that all those files are getting loaded in the test browser. It's surprisingly easy to get a path wrong in your config and not realize it. If you're running testacular with autowatch, you can navigate to http://localhost:9876/context.html with a browser and use developer tools inspect elements/resources/network and see if anything is missing.
If everything is good there and you're still having problems, post some of your test code and I'll take a look.
UPDATE: It appears (strangely) from the comments in the source for angular-mocks.js (line 1635) that window.module is only available with Jasmine. It looks like you're using Mocha instead of Jasmine. This is very likely the culprit.
ANSWER:
I can't rightly take credit for this Matsko, since you figured it out yourself... but it turns out that the current AngularJS stable download and angular-seed contain an older version of ngMock that doesn't support Mocha. Manually replacing the mock file with the latest from the github repo solves the problem. Glad I could help ;-)
I ran into this issue today and I wanted to provide others with a complete summary of the required steps to get this working. First let's say you have a module named myApp. Inside that that module there is a service called myModel. the myModel service has a method named getItems().
Currently, the angular-mocks.js (I am using AngularJS 1.0.6) does not support Mocha. You will need to visit this link and replace the 1.0.6 version with the one in the master branch from the AngularJS GitHub project. An easy way to do this (if you have wget) is wget https://raw.github.com/angular/angular.js/master/src/ngMock/angular-mocks.js in the correct directory. If you use a properly configured Sublime or vim it can also easily pull it down for you.
Make sure your karma.conf.js file includes the angular-mocks.js file in files array
Somewhere in your tests.js file (maybe at the top level describe) include beforeEach(module('myApp')); or whatever you named your main module.
If you plan to use the service (or whatever you want to include in the test) in more than one place you can call another beforeEach where needed like this:
beforeEach(inject(function(myModel) {
mymodel = myModel;
}));
otherwise you just can inject where it is needed. Now the mymodel variable (notice this is the variable you assigned in the beforeEach above) will be available to you for testing in your next blocks. For example, you can now write:
describe('when fetched', function() {
it('should return 3 items', function() {
// console.log(mymodel.getItems());
expect(mymodel.getItems()).to.have.length(3);
});
});
I'm trying to get Jasmine (jasmine-headless-webkit), coffeescript and backbone to work together.
I'm close - I've got my site running on coffeescript and backbone, and I can run coffeescript written tests - but my problem is, I can't get my coffeescript tests to do anything interesting.
If I try create an instance of a model in a test, I'll get an error:
ReferenceError: Can't find variable: xxxx
FYI - I'm using this with guard-jasmine-headless-webkit...
I've been working with the Jasmine.yml file - but still can't get these tests to work. Does anyone have any advice?
Trevor was right - the issue was the order in which scripts were loaded (in my jasmine.yml)
I wound up cleaning it out for the most part...
helpers:
- helpers/**/*.js
src_dir:
- app/assets/javascripts
- vendor/assets/javascripts
src_files:
- "**/*.*"
spec_dir: spec/javascripts
spec_files:
- "**/*[Ss]pec.*"
stylesheets:
- stylesheets/**/*.css
Friendly update: if you're using Rails asset pipeline for coffeescript compilation, a recent release of the Jasmine gem adds support for coffeescript via rails asset pipeline. huge improvement. its the 1.2.0 version (not the release candidates, the official 1.2.0 release)
https://github.com/pivotal/jasmine-gem