Bringerr Inc.

Amazing legacy bug in Google Chrome!


From 2011-11-22

So you thought Google Chrome is almost perfect, bullet-proof, iz-da-browser, and, what say you? Sure, it would be unfair, almost untrue to claim the opposite, however, there is a neat bug, and you could argue that it's not a bug but a feature, and I could argue back, and... you got it.

But since the people who wrote the Chrome are from Venus and Mars, just like you and me, their main belief is that user's experience should be comfortable, easy, and fun. You could think that I'm getting paid for this implicit advertisement, but I'm not. What they did to Chrome is this: they taught him to automatically fix errors that a programmer presumably created. And since they're awesome, all this error fixing is of course super fast, it's realtime.

The problem? Sure there's a problem. It goes like that: when you have written some Javascript code which updates the innerHTML with some, say, unclosed <table> element, at this point of time, the browser will fix that line, and add the closing tag somewhere at the end. But hey - you would say - what if I provide the innerHTML with the closing tag on the next line? Well, it's too late, because, Google Chrome is amazing.

        element.innerHTML = '<table class="someclass">' + "Some text with or withot HTML tags ";
        element.innerHTML += "Another textual string with or withot HTML tags";
        element.innerHTML += '</table>';

And with legacy code, things like these can take a long time to determine. Days. Weeks. Don't believe me? Try to hide this somewhere in your website and tell your friends about amazing bug, which happens only in Chrome, and, surprisingly, not in IEs. But luckily, there's this article, so we're safe. The solution? Well, you already guessed. If not, here it comes:

        var long_string = '<table class="someclass">' + "Some text with or withot HTML tags ";
        long_string += "Another textual string with or withot HTML tags";
        long_string += '</table>';
        element.innerHTML = long_string;

In this case, the browser eats the whole thing like a creamy chocolate cake with a lot of ganache, and everybody's happy.

So if you don't think it's a bug, please debug. But if you think it is a bug, please don't debug. In any case, I will be happy if you leave a comment, because, well, why not?

Also, by this chance, I'd like to introduce you our new project, and it's called Open Website Project. It is a place where the good people (!!), or in other words professionals like you can find fellows, and build something different together or just discuss interesting topic.. It's small, almost private, and that's the big difference. So long.

Add new comment

Filtered HTML

  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <c>, <cpp>, <drupal5>, <drupal6>, <java>, <javascript>, <php>, <python>, <ruby>. The supported tag styles are: <foo>, [foo].
  • Allowed HTML tags: <a> <p> <span> <div> <h1> <h2> <h3> <h4> <h5> <h6> <img> <map> <area> <hr><br> <br /> <ul> <ol> <li> <dl> <dt> <dd> <table> <tr> <td> <em> <b> <u> <i> <strong><font> <del> <ins> <sub> <sup> <quote> <blockquote> <pre><address> <code><cite> <embed> <object> <param> <strike> <caption>

Plain text

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.
By submitting this form, you accept the Mollom privacy policy.