Telerik blogs

Hi there. I am still kicking. It has been some time since my last post as most of my efforts were concentrated on the quarterly release (which is a lame excuse).

Anyway here is an interesting thing that I tackled a minute ago:

The following script closes immediately the latest installment of Netscape:

<html>
<body>
    <div id="div1">
        <div id="div2">
        </div>
    </div>
   
    <button onclick="return CloseNetscapeNow()">Close Netscape</button>
    <script type="text/javascript">
        function CloseNetscapeNow()
        {
            var div1 = document.getElementById("div1");
            var div2 = document.getElementById("div2");
            div1.appendChild(div2);
        }  
    </script>
</body>
</html>



Just click the button and enjoy. It turns out that the appendChild method does not work very well when you try to add a DOM node to the parent it already belongs to. However finding the reason why Netscape closes just after opening the page was not a pleasant experience. Me and Petyo used the famous "scatter-return-statements-until-it-starts-to-work" debugging technique. The rules are simple:

  1. Place a return statement somewhere in your JavaScript code (preferably some "likely-to-have-hacks-in-it" place, but a random place will do)
  2. Refresh Netscape to see if it shall close
  3. If it closes move the return statement one line above the current and go to step 2
  4. If it works move the return statement one line below and go to step 2. If you think you know where the problem is you can safely end that productive debugging session.

In our case the technique helped (it always does!). The problem can be easily fixed by removing the DOM node from its parent. Here is the fix (considering the example mentioned before):

        function CloseNetscapeNow()
        {
            var div1 = document.getElementById("div1");
            var div2 = document.getElementById("div2");

            div2.parentNode.removeChild(div2);
           
            div1.appendChild(div2);
        }


Maybe this info would spare someone a few hours of debugging.


rahnev
About the Author

Stefan Rahnev

Stefan Rahnev (@StDiR) is Product Manager for Telerik Kendo UI living in Sofia, Bulgaria. He has been working for the company since 2005, when he started out as a regular support officer. His next steps at Telerik took him through the positions of Technical Support Director, co-team leader in one of the ASP.NET AJAX teams and unit manager for UI for ASP.NET AJAX and Kendo UI. Stefan’s main interests are web development, agile processes planning and management, client services and psychology.

Comments

Comments are disabled in preview mode.