Saw a really wierd error today, as you can guess from the title of the post it has to do with Maximum Call stack size exceeded, modals and AngularJS. First a bit about the app. I’m currently building a table of data, its basically a status report, so the url might be http://mysite.com/#/report/myreport which would show you the list of data. However I’m also building a detail page that will use a modal popup when you double click on a given row of the report. I wanted this to be addressable so it would have its own url. So basically i’ve got my angularjs route setup with an optional rowid parameter.
Request this: http://mysite.com/#/report/myreport and you see the report show up.
Request this: http://mysite.com/#/report/myreport/32 and you see the report in the background with a modal overlay showing the details of row 32.
You can close the modal, view other records, the url changes as you do so. All in all, its a pretty simple angularjs app. No new concepts for me, I’ve used modal before, controllers etc all of it. However, today when i wired up my code to load the modal when the page first loads, I saw an evil error in chrome:
Uncaught RangeError: Maximum call stack size exceeded. jQuery.event.special.focus.trigger…. tons of jquery calls ….
Only in chrome, FIrefox acted a bit wierd, and IE well IE i’ll save for another day. I tried googling it, all the results pointed to a recursive loop, but i had no recursive code. Google was actually pretty unhelpful for this error. I backed out all my changes for the instant modal popup functionality, and instead just wrote a log entry to the console.
The error didn’t appear, the log entry did appear, twice. Somehow my controller was loading and running twice. Googling that was helpful, I found this: http://stackoverflow.com/questions/15535336/combating-angularjs-executing-controller-twice
It turned out I was doing the exact same thing. I had no idea you were not supposed to register the controller at the top of the page if you were using routing. Removing that single html attribute solved the dual log entry problem. I then re-enabled my instant modal on load code, and that all worked without error as well. Somehow with the controller loading twice and my code running at startup caused some wierd stack overflow.
Once it was loading only once the problem went away. So here’s another post for google, I’m sure I’ll make this mistake again sometime, probably in about three months or so. Hopefully then I’ll google it and find my own blog post.
Mythical Code 