Endless recursion in compileNodes using angularJS in IE8

Question

I am working on an Angular application, and it works great in all browsers preserving for IE8. IE7 and IE9 are working correctly.

I was able to determine that the Angular compileNodes function is recursively recursively executed. For testing purposes, I changed the compileNodes function to track depth and just return with a certain threshold, and I confirmed that this makes the page load and work correctly, so obviously this mass recursion is not needed for the page to work.

Obviously, this is not a sustainable way around this, however, I wonder if anyone else encounters this behavior, and if so, could you find out what the problem is?

Edit: after some additional debugging, I think I narrowed it down to the user directive we use. The directive is really too long to be useful for me to insert it here, but when I narrow it down to a specific part, if I can find something representative, I will post it.

Answer 1

After the pile was digging more, I was able to determine the cause of the problem, at least enough for my purposes.

As mentioned in my edit, I narrowed it down to have something to do with a custom directive called form-field . Through some trial and error, I was also able to determine that the problem arose when the date-picker directive was on the form-field child.

While in most places this was done something like

 <div form-field> <date-picker></date-picker> </div> 

in the instance instance, the date picker used a self-closing tag

 <div form-field> <date-picker /> </div> 

Apparently, the form-field compilation could not handle it correctly and it managed to enter an endless loop, and I guess this only happened in IE8, because other newer browsers silently interpreted the self-closing tag as having a specific start and end tag .

In short, I changed the self-closing tag, and now everything works correctly.