Posts

Showing posts from September, 2014

angularjs and karma performance memory problems

Give me the answer now : switch Karma to run Firefox not Chrome More details Our team is building a pretty complex angularjs app. We write unit tests and run them using Karma. The unit tests are run on a file change watch and just run in the background. We have almost 2000 unit tests. Its all been working great until recently when the test run gets much slower after each run. Its now at a point that by the 3rd karma run, karma grounds to a halt i.e. 1 run 15 secs, 2nd run 30 secs, 3rd run 1min + I should not the app itself is not exhibiting significant memory issues (although profiling and tuning is needed) just the unit tests. Step 1 - find out whats happening with our Karma tests? Using google Chrome Task Manager, monitor the Karma browser tab. The monitor shows us memory and cpu (you can also right click and add more columns). This is a rough measure but we could see karma tab: - memory almost doubled each run 300mb, 600mb, 800mb. - cpu was maxing out after 3rd run S

jasmine spy access individual arguments passed to spy

Jasmine spies are super useful when writing unit tests You can check arguments passed to a spy x with:  expect(x).toHaveBeenCalledWith(arguments) toHaveBeenCalledWith() expects a match on all arguments But what if you don't know all the arguments e.g. only sure of the 1st but not the rest? There is a way,  heres the fiddle and code below: describe("Spy argumnts access", function() {   it("should access 1st argument to spy", function() {     var mockCallback = jasmine.createSpy("mockCallback");         mockCallback("denis", 22, {unknown: 1})       expect(mockCallback).toHaveBeenCalled();       expect(mockCallback.argsForCall[0][0]).toBe("denis");       }); }); FYI Add Jasmine as an external library, I found this on other examples: http://searls.github.io/jasmine-all/jasmine-all-min.js

angularjs select: watch the ng-model versus use ng-change

Been wondering about the best approach when using angulars select. You pass it an ng-model to hold the currently selected choice (including initialization). Angular provides at least 2 options for being notified of changes in the dropdown: 1. use ng-change on the select and have it call a method on scope to handle the change 2. watch the ng-model and when it changes then handle the change So which is better? A typical mvc approach is to listen to the model and respond to changes. Angular allows us to watch the model and do same. For watch read listen. One downside of watching the selects ngModel is that watch fires a lot. You do get new and prev values passed in the watch so you could compare both and do nothing if same and thus save some cycles. Using ng-change is simpler, it only fires when the drop down changes. You can see whats happening by looking at the html (although it should not be so difficult to understand by looking at the watch code either) I prefer #2 watch t