Using element.find() by class in Angular Unit testing

angularjs unit-testing jqlite
cusejuice picture cusejuice · Jul 7, 2015 · Viewed 8.7k times · Source

When running this test, I keep getting the error Expected undefined to be true. 

it('should have the right classes', function() {
   // this doesnt work
   expect(element.find('.exampleClass').hasClass('ng-hide')).toBe(true);

   // but this works
   expect(element.find('span').hasClass('ng-hide')).toBe(true);
});

How can I use jqlite to find an element by id and class?

Answer

PSL picture PSL · Jul 7, 2015

That is because angular-jqlite (very lightweight library when compared to jquery itself) find is limited to look up by tag names only. You can use element.querySelector(All) and wrap it in angular.element. i.e

  var elm = element[0];
  expect(angular.element(elm.querySelector('.exampleClass')).hasClass('ng-hide')).toBe(true);

  //Or even
  expect(elm.querySelector('.exampleClass.ng-hide')).toBeDefined();

See documentation

find() - Limited to lookups by tag name

Related questions

jasmine: Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL

I have an angular service called requestNotificationChannel: app.factory("requestNotificationChannel", function($rootScope) { var _DELETE_MESSAGE_ = "_DELETE_MESSAGE_"; function deleteMessage(id, index) { $rootScope.$broadcast(_DELETE_MESSAGE_, { id: id, index: index }); }; return { deleteMessage: deleteMessage }; }); I am trying to unit test this service …

Read More
How do I mock a service that returns promise in AngularJS Jasmine unit test?

I have myService that uses myOtherService, which makes a remote call, returning promise: angular.module('app.myService', ['app.myOtherService']) .factory('myService', [ myOtherService, function(myOtherService) { function makeRemoteCall() { return myOtherService.makeRemoteCallReturningPromise(); } return { makeRemoteCall: makeRemoteCall }; } ]) To make a unit test for myService I …

Read More
Mocking AngularJS module dependencies in Jasmine unit tests

I'm attempting to unit test controller code inside a module that takes other modules as dependencies, but haven't been able to figure out how to mock them properly. I'm using the Jasmine Framework and running my tests with Karma (Testacular). …

Read More