Rick Strahl's Web Log

Wind, waves, code and everything in between...
ASP.NET • C# • HTML5 • JavaScript • AngularJs
Contact   •   Articles   •   Products   •   Support   •   Search
Ad-free experience sponsored by:
ASPOSE - the market leader of .NET and Java APIs for file formats – natively work with DOCX, XLSX, PPT, PDF, images and more

IE Lockup with createElement and appendChild


:P
On this page:

I've been working on some client side AJAX code in a photoalbum application and I ran into a horrible situation today with IE. This innocuous code which is part of my library code (which in this case pops up an opaque overlay ontop of the page generically to render another window with an image ontop) would cause IE to rev up to 100% CPU utilization:

   <script type="text/javascript">
   function TestClick(button)
   {
         // _wwUtils.showOpaqueOverlay(.55,1);
         
         var sx = document.createElement("div");
         sx.id="wwShadowOverlay";
         sx.style.background="black";
         document.body.appendChild(sx);
   }
   </script>

The code that performs this tasks (showOpaqueOverlay()) is fairly complex and I was working on that block when I ran into this issue and it first I suspected various event hookups (for resizing) that were causing the issue since that's what I had been working on. But it turns out that they dynamic creation of the element and attaching it to the document (which also changed) was the culprit and results in locking up one of my dual core processors...

The code works fine on FireFox and Opera, but IE consistently was going 100% when testing it in my fairly complex HTML document. Finally I broke out the code and dumped into a separate file to test and sure enough the problem went away - both the simplified and more complex scenario stopped failing.

As it turned out IE was choking on a missing </div> tag inside of some generated code. After carefully reviewing the page I found the problem and after fixing IE stopped acting up like this.

This is one of those scary things that can bite you in the middle of a nice client coding session. Everything's fine and all of a sudden wham one of the browsers blows you out of the water like this. I wasted well over an hour tracking this down.

Specialty case for sure but it's good to know that invalid documents in some situations can cause problems for createElement/appendChild.

Posted in AJAX  ASP.NET  West Wind Ajax Toolkit  

The Voices of Reason


 

# DotNetSlackers: IE Lockup with createElement and appendChild


Rob Conery
June 05, 2007

# re: IE Lockup with createElement and appendChild

I'd love to know how you tracked THAT down! Did you use Firebug? Seems like a fun way to send the "ping of death" if you felt malicious :).

Rick Strahl
June 05, 2007

# re: IE Lockup with createElement and appendChild

He he... Well, this is an IE problem so FireBug isn't much help.

I have some experience with nasty issues like this in IE so this is not new to me. Process of elimination and careful usage of VS script debugging. The really screwy part about this though was that I had changed some related code which deals with event hookups and those are the favorite culprit for sending IE into a tailspin (especially if you don't unhook the events). So I wasted about a half hour going down a completely wrong path removing code until it worked again doing about 20 IE Process Manager restarts in between... Fun stuff like that...

Sharma
June 27, 2007

# re: IE Lockup with createElement and appendChild

can u please publish the fix u did that helpa a lot...
 

West Wind  © Rick Strahl, West Wind Technologies, 2005 - 2019