How do browsers parse a script tag exactly?

Question

I've just run into a pathological case with HTML parsing. I've always thought that a <script> tag would run until the first closing </script> tag. But it turns out this is not always the case.

This is valid:

<script><!--
alert('<script></script>');
--></script>

And even this is valid:

<script><!--
alert('<script></script>');
</script>

But this is not:

<script><!--
alert('</script>');
--></script>

And neither is this:

<script>
alert('<script></script>');
</script>

This behavior is consistent in Firefox and Chrome. So, as hard as it is to believe, browsers seem to accept an open+close script tag inside an html comment inside a script tag. So the question is how do browser really parse script tags? This matters because the HTML parsing library I'm using, Nokogiri, assumed the obvious (but incorrect) until-the-first-closing-tag rule and did not handle this edge case. I imagine most other libraries would not handle it either.

Answer 1

After poring over the links given by Tim and Jukka I came to the following answer:

• after the opening <script> tag, the parser goes to data1 state
• if <!-- is encountered while in data1 state, switch to data2 state
• if --> is encountered while in any state, switch to data1 state
• if <script[\s/>] is encountered while in data2 state, switch to data3 state
• if </script[\s/>] is encountered while in data3 state, switch to data2 state
• if </script[\s/>] is encountered while in any other state, stop parsing

Answer 2

All the examples are invalid as per the HTML 4.01 specification: the content of script is declared as CDATA, and the description of CDATA says:

“Although the STYLE and SCRIPT elements use CDATA for their data model, for these elements, CDATA must be handled differently by user agents. Markup and entities must be treated as raw text and passed to the application as is. The first occurrence of the character sequence "</" (end-tag open delimiter) is treated as terminating the end of the element's content. In valid documents, this would be the end tag for the element.”

As you have observed, browsers might not enforce this rule but instead recognize pairs of start and end tags, in some situations. From the spec perspective, this is handling of invalid documents, i.e. error processing. It is not clear what exactly they are doing here and why. It seems to depend on the presence of <!--, which should not have any effect on HTML 4.01 parsing (it is not a comment opener in CDATA content).

In XHTML, partly different rules apply, because in XHTML, <!-- opens a comment within the content of a script element.

As an aside, all the examples are invalid HTML 4.01 and invalid XHTML due to the lack of the type attribute in script. The attribute is not needed (browsers default to treating the content as JavaScript), but it’s required by those specs.

In HTML5, other rules apply. They are rather complicated, and they are supposed to describe browser behavior. In addition to imposing restrictions on content (forbidding e.g. <!-- without matching -->), HTML5 also specifies parsing rules.