HTML Comment Parsing Defect in Firefox (as late as 3.6.6)

The Dilemma

I had to fix a defect today that was caused by an author putting extra hyphens within HTML comments who, I assume, didn't test their changes in Firefox. It caused a weird effect in the page where a bunch of JavaScript was rendered as text (but only part of the JavaScript.)

As I started experimenting to discover the cause, I found a couple of different side-effects to this defect (shown below in my Experiments section.)

Their comments (and my experiments) parsed the comments as one would expect in other latest versions of Windows browsers I tried:

• Internet Explorer 8.0.6001.18702
• Google Chrome 5.0.375.125
• Safari 5.0 (7533.16)
• Opera 10.60

In Firefox 3.6.6 however, the comments with at least two extra consecutive hyphens would cause weird anomalies, causing extra non-commented HTML to be considered part of the comment; until the browser's parsing decided the comment was finished.

The purpose of these experiments is was to figure out as much information as possible for the defect report I'm I was going to make to Bugzilla.
EDIT: Bugzilla already has a bunch of bugs filed for this, and the W3C standards say we shouldn't do this... so I'm not going to file anything; I'll just let this document serve as help for web authors that happen to search and find my page to understand what's going on.

The Conclusion

It seems that whenever there are two consecutive hyphens after the HTML comment start (<--) it screws Firefox up; unless there is another pair of two consecutive hyphens to "match" the first.

Following are test cases that reproduce the defect:

Failure Test Cases

Moral of the Story

According to the W3C, "Authors should avoid putting two or more adjacent hyphens inside comments."

The W3C's HTML Validator fails this page with errors related to having those hyphens in the comments (including showing errors that aren't real like omitting the end tag for body... it's there.) So if you want your stuff to work... DON'T USE THEM IN YOUR COMMENTS!

In my humble opinion, I think the standard is quite flawed in this case. No user-agent should care what comes between the <!-- and the --> in comment markup. There must be a method to the madness, but I haven't had time to look it up. The question is, is Firefox's behavior correct and acceptable? I'm going to have to with yes in this case, because they are following the standard.

The other browsers have decided to be extra-nice, which I think is both good and bad. Good because I think the standard is flawed... bad in that it doesn't help force authors to follow standards. Internet Explorer has been overly forgiving to web authors over the years and it has made for some really bad habits with all of us (myself included)

So the moral of the story is: follow the standard/best practice, avoid putting two adjacent hyphens in your comments (I'd even go as far as to say don't use hyphens in your comments at all, just to be safe.) Stupid, but it is what it is...

The Experiments

Extra hyphens in comment; matched amounts on each side of a word, odd number of hyphens on each side of the word

<!-- - Announcement - -->

This comment is parsed correctly in Firefox

Extra hyphens in comment; matched amounts on each side of a word, even number of hyphens on each side of the word

<!-- -- Announcement -- -->

This comment is parsed correctly in Firefox

Two comments with unmatched hyphens around text: Firefox incorrectly parses, the second counteracting the first, making a complete comment, hiding any HTML markup in-between.

First comment with extra hyphens: unmatched amounts on each side of text; one on the left side, two on the right

<!-- - COMMENT 1: Uneven extra hyphens; next comment counteracts -- -->
<p>This paragraph is hidden in Firefox, due to the HTML comment parsing defect.</p>
<!-- - COMMENT 2: Uneven extra hyphens; counteracts prior comment -- -->
<p>This paragraph is not hidden since the comment above this tag in the source counteracts the previously incorrectly parsed comment; thus "completing" the comment.</p>

This paragraph is hidden in Firefox, due to the HTML comment parsing defect.

This paragraph is not hidden since the comment above this tag in the source counteracts the previously incorrectly parsed comment; thus "completing" the comment.

Simple Test 1

<!-- - -->

This comment is parsed correctly in Firefox

Simple Test 2

<!-- - - -->

This comment is parsed correctly in Firefox

Simple Test 3: Simple comment with matching pairs of two consecutive hyphens

<!-- -- -- -->

This comment is parsed correctly in Firefox

Simple (but Complex) Test 4: Simple comment, not so simple counteracting closure

<!-- -- -- -- -->

This div isn't doesn't resemble a closing comment, but since there are two consecutive hyphens and a > shortly after (but not directly after) it will still "counteract" the prior two consecutive hyphens and thus "complete" the comment. (Viewing the source in Firefox shows this.) --

This comment is not parsed correctly in Firefox

The view source shows us:

Extra hyphens in comment: unmatched amounts on each side of text; one on the left side, two on the right

<-- - Uneven extra hyphens ... no "counter-action" comment -- -->

As you can see (in Firefox), the comment is rendered along with other visible HTML.

No extra experiments can follow or the above experiment will fail due to the "comment completion" stuff discovered above.