Web Inspector: Formatter: Pretty Print HTML resources (including inline <script>...
authorpecoraro@apple.com <pecoraro@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 13 Sep 2019 10:05:36 +0000 (10:05 +0000)
committerpecoraro@apple.com <pecoraro@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 13 Sep 2019 10:05:36 +0000 (10:05 +0000)
https://bugs.webkit.org/show_bug.cgi?id=201535
<rdar://problem/29119232>

Reviewed by Devin Rousso.

Source/JavaScriptCore:

* debugger/Debugger.cpp:
(JSC::Debugger::resolveBreakpoint):
When resolving a breakpoint inside of an inline <script> we need to adjust
based on the starting position of the <script> in the HTML resource.

Source/WebInspectorUI:

Introduce HTMLFormatter, HTMLParser, and HTMLTreeBuilderFormatter.

    - HTMLParser tokenizes HTML content and passes it to a tree builder.
    - HTMLTreeBuilderFormatter uses those tokens to create a formatted dom tree of fake nodes.
    - HTMLFormatter then builds formatted content and a FormatterSourceMap from that DOM tree.

The output of HTMLFormatter is intended to just modify whitespace. So it won't be a
100% compatible DOM, but will be useful for debugging and reading inline <style>
and <script>, which is a more common debugging scenario. It also maintains original
author attribute quotations or lack therefore, because again it tries to only
change whitespace. A separate tree builder could be used for tidying content.

This introduces a few tools for working with formatting:

    - Tools/HTMLFormatter - debug the parser, tree builder, and output format
    - Tools/SourceMaps - debug formatted content and source mappings

This also:

    - renames "EsprimaFormatter" to "JSFormatter"
    - eliminates an extra trailing newline in CSSFormatter output

* Tools/HTMLFormatter/HTMLTreeBuilderDebug.js: Added.
* Tools/HTMLFormatter/index.html: Added.
* Tools/HTMLFormatter/styles.css: Added.
Tool for debugging the HTML formatter components.

* Tools/SourceMaps/.gitignore: Added.
* Tools/SourceMaps/index.html: Added.
* Tools/SourceMaps/setup.sh: Added.
* Tools/SourceMaps/styles.css: Added.
Tool for debugging Formatter generated Source Maps.

* Tools/JSFormatter/JSFormatterDebug.js: Renamed from Source/WebInspectorUI/Tools/Formatting/EsprimaFormatterDebug.js.
* Tools/JSFormatter/codemirror-additions.css: Renamed from Source/WebInspectorUI/Tools/Formatting/codemirror-additions.css.
* Tools/JSFormatter/index.html: Renamed from Source/WebInspectorUI/Tools/Formatting/index.html.
Renamed this tool. EsprimaFormatter => JSFormatter.

* UserInterface/Controllers/FormatterSourceMap.js:
(WI.FormatterSourceMap.prototype.originalPositionToFormattedPosition):
(WI.FormatterSourceMap.prototype.formattedPositionToOriginalPosition):
New APIs used by tools and tests for translating "position" offsets and not line/columns.

* UserInterface/Workers/Formatter/JSFormatter.js: Renamed from Source/WebInspectorUI/UserInterface/Workers/Formatter/EsprimaFormatter.js.
(JSFormatter):
* UserInterface/Workers/Formatter/CSSFormatter.js:
(CSSFormatter):
Allow using a supplied builder, which is useful when formatting
inline content from HTMLFormatter (<style> / <script>).

* UserInterface/Workers/Formatter/FormatterContentBuilder.js:
(FormatterContentBuilder.prototype.get indentString):
(FormatterContentBuilder.prototype.get originalContent):
(FormatterContentBuilder.prototype.get indentLevel):
(FormatterContentBuilder.prototype.get originalOffset):
(FormatterContentBuilder.prototype.set originalOffset):
(FormatterContentBuilder.prototype.appendNonToken):
(FormatterContentBuilder.prototype.appendToken):
(FormatterContentBuilder.prototype.appendTokenWithPossibleNewlines):
(FormatterContentBuilder.prototype.appendMapping):
(FormatterContentBuilder.prototype.indentToLevel):
(FormatterContentBuilder.prototype.finish):
Provide API for getting / setting the original offset and indent level.
This is useful when the HTMLFormatter runs the CSSFormatter/JSFormatter
in a nested context (<style> / <script>). Add a few more APIs for
conveniences when appending tokens or important positions.

* UserInterface/Workers/Formatter/HTMLParser.js: Added.
(HTMLParser.prototype.parseDocument):
(HTMLParser.prototype._isEOF):
(HTMLParser.prototype._peek):
(HTMLParser.prototype._peekCharacterRegex):
(HTMLParser.prototype._peekString):
(HTMLParser.prototype._peekCaseInsensitiveString):
(HTMLParser.prototype._consumeWhitespace):
(HTMLParser.prototype._consumeUntilString):
(HTMLParser.prototype._consumeUntilRegex):
(HTMLParser.prototype._consumeDoubleQuotedString):
(HTMLParser):
Tokenize HTML content into nodes.

* UserInterface/Workers/Formatter/HTMLTreeBuilderFormatter.js: Added.
(HTMLTreeBuilderFormatter.prototype.get dom):
(HTMLTreeBuilderFormatter.prototype.begin):
(HTMLTreeBuilderFormatter.prototype.pushParserNode):
(HTMLTreeBuilderFormatter.prototype.end):
(HTMLTreeBuilderFormatter.prototype._pushParserNodeTopLevel):
(HTMLTreeBuilderFormatter.prototype._pushParserNodeStack):
(HTMLTreeBuilderFormatter.prototype._isEmptyNode):
(HTMLTreeBuilderFormatter.prototype._buildDOMNodeFromOpenTag):
(HTMLTreeBuilderFormatter.prototype._buildErrorNodeFromCloseTag):
(HTMLTreeBuilderFormatter.prototype._buildSimpleNodeFromParserNode):
(HTMLTreeBuilderFormatter):
Build a simple DOM tree from parser nodes.

* UserInterface/Workers/Formatter/HTMLFormatter.js: Added.
(HTMLFormatter.let.dom):
(HTMLFormatter):
(HTMLFormatter.prototype.get success):
(HTMLFormatter.prototype.get formattedText):
(HTMLFormatter.prototype.get sourceMapData):
(HTMLFormatter.prototype._walk):
(HTMLFormatter.prototype._walkChildren):
(HTMLFormatter.prototype._isNodeSelfClosing):
(HTMLFormatter.prototype._shouldHaveInlineContent):
(HTMLFormatter.prototype._hasMultipleNewLines):
(HTMLFormatter.prototype._buildAttributeString):
(HTMLFormatter.prototype._before):
(HTMLFormatter.prototype._after):
(HTMLFormatter.prototype._formatWithNestedFormatter):
(HTMLFormatter.prototype._formatScript):
(HTMLFormatter.prototype._formatStyle):
Output pretty printed text from a HTMLTreeBuilderFormatter dom tree.

* UserInterface/Proxies/FormatterWorkerProxy.js:
(WI.FormatterWorkerProxy.prototype.formatHTML):
* UserInterface/Workers/Formatter/FormatterWorker.js:
(FormatterWorker.prototype.formatJavaScript):
(FormatterWorker.prototype.formatCSS):
(FormatterWorker.prototype.formatHTML):
* UserInterface/Views/TextEditor.js:
(WI.TextEditor.prototype.hasFormatter):
(WI.TextEditor.prototype._canUseFormatterWorker):
(WI.TextEditor.prototype._startWorkerPrettyPrint):
Allow pretty printing HTML resources.

* UserInterface/Main.html:
* UserInterface/Test.html:
New resources.

LayoutTests:

* TestExpectations:
Mark slow test.

* inspector/formatting/formatting-css.html:
* inspector/formatting/formatting-html-expected.txt: Added.
* inspector/formatting/formatting-html.html: Added.
* inspector/formatting/formatting-javascript-expected.txt:
* inspector/formatting/formatting-javascript.html:
* inspector/formatting/formatting-json-expected.txt:
* inspector/formatting/formatting-json.html:
* inspector/formatting/resources/formatting-utilities.js: Renamed from LayoutTests/inspector/formatting/resources/utilities.js.
Update formatting tests to use new path to utilities.

* inspector/formatting/resources/css-tests/basic-expected.css:
* inspector/formatting/resources/css-tests/gradient-expected.css:
* inspector/formatting/resources/css-tests/keyframes-expected.css:
* inspector/formatting/resources/css-tests/media-query-expected.css:
* inspector/formatting/resources/css-tests/selectors-expected.css:
* inspector/formatting/resources/css-tests/wrapping-expected.css:
* inspector/codemirror/resources/prettyprinting/css-tests/basic-expected.css:
* inspector/codemirror/resources/prettyprinting/css-tests/calc-expected.css:
* inspector/codemirror/resources/prettyprinting/css-tests/gradient-expected.css:
* inspector/codemirror/resources/prettyprinting/css-tests/keyframes-expected.css:
* inspector/codemirror/resources/prettyprinting/css-tests/media-query-expected.css:
* inspector/codemirror/resources/prettyprinting/css-tests/selectors-expected.css:
* inspector/codemirror/resources/prettyprinting/css-tests/wrapping-expected.css:
Eliminate an extra trailing newline in CSS formatted results.

* inspector/formatting/resources/html-tests/attributes-expected.html: Added.
* inspector/formatting/resources/html-tests/attributes.html: Added.
* inspector/formatting/resources/html-tests/auto-close-expected.html: Added.
* inspector/formatting/resources/html-tests/auto-close.html: Added.
* inspector/formatting/resources/html-tests/basic-1-expected.html: Added.
* inspector/formatting/resources/html-tests/basic-1.html: Added.
* inspector/formatting/resources/html-tests/basic-2-expected.html: Added.
* inspector/formatting/resources/html-tests/basic-2.html: Added.
* inspector/formatting/resources/html-tests/comments-expected.html: Added.
* inspector/formatting/resources/html-tests/comments.html: Added.
* inspector/formatting/resources/html-tests/eof-1-expected.html: Added.
* inspector/formatting/resources/html-tests/eof-1.html: Added.
* inspector/formatting/resources/html-tests/eof-2-expected.html: Added.
* inspector/formatting/resources/html-tests/eof-2.html: Added.
* inspector/formatting/resources/html-tests/eof-3-expected.html: Added.
* inspector/formatting/resources/html-tests/eof-3.html: Added.
* inspector/formatting/resources/html-tests/eof-4-expected.html: Added.
* inspector/formatting/resources/html-tests/eof-4.html: Added.
* inspector/formatting/resources/html-tests/eof-5-expected.html: Added.
* inspector/formatting/resources/html-tests/eof-5.html: Added.
* inspector/formatting/resources/html-tests/eof-6-expected.html: Added.
* inspector/formatting/resources/html-tests/eof-6.html: Added.
* inspector/formatting/resources/html-tests/inline-script-expected.html: Added.
* inspector/formatting/resources/html-tests/inline-script.html: Added.
* inspector/formatting/resources/html-tests/inline-style-expected.html: Added.
* inspector/formatting/resources/html-tests/inline-style.html: Added.
* inspector/formatting/resources/html-tests/list-expected.html: Added.
* inspector/formatting/resources/html-tests/list.html: Added.
* inspector/formatting/resources/html-tests/not-well-formed-1-expected.html: Added.
* inspector/formatting/resources/html-tests/not-well-formed-1.html: Added.
* inspector/formatting/resources/html-tests/not-well-formed-2-expected.html: Added.
* inspector/formatting/resources/html-tests/not-well-formed-2.html: Added.
* inspector/formatting/resources/html-tests/not-well-formed-3-expected.html: Added.
* inspector/formatting/resources/html-tests/not-well-formed-3.html: Added.
* inspector/formatting/resources/html-tests/self-closing-expected.html: Added.
* inspector/formatting/resources/html-tests/self-closing.html: Added.
HTMLFormatter tests.

* inspector/formatting/resources/html-source-map-tests/1.html: Added.
* inspector/formatting/resources/html-source-map-tests/2.html: Added.
* inspector/formatting/resources/css-source-map-tests/1.css: Added.
* inspector/formatting/resources/javascript-source-map-tests/1.js: Added.
* inspector/formatting/source-map-css-1-expected.txt: Added.
* inspector/formatting/source-map-css-1.html: Added.
* inspector/formatting/source-map-html-1-expected.txt: Added.
* inspector/formatting/source-map-html-1.html: Added.
* inspector/formatting/source-map-html-2-expected.txt: Added.
* inspector/formatting/source-map-html-2.html: Added.
* inspector/formatting/source-map-javascript-1-expected.txt: Added.
* inspector/formatting/source-map-javascript-1.html: Added.
* inspector/formatting/resources/source-map-utilities.js: Added.
(TestPage.registerInitializer.logLocationWithContext):
(TestPage.registerInitializer.async.runSourceMapTest):
(TestPage.registerInitializer.):
(TestPage.registerInitializer.async.loadFormattedContentAndSourceMap):
(TestPage.registerInitializer.async.loadSourceMapTestResource):
(TestPage.registerInitializer.window.addSourceMapTest):
(TestPage.registerInitializer):
New formatter source map tests to ensure we can go back and forth reasonably
between formatted content and original content.

* inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations-expected.txt: Added.
* inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations.html: Added.
* inspector/debugger/breakpoints/resources/dump-inline-scripts.html: Added.
* inspector/debugger/breakpoints/resources/dump.js:
(TestPage.registerInitializer.window.addDumpAllPauseLocationsTestCase):
(TestPage.registerInitializer.addDumpAllPauseLocationsTestCaseForScript):
(TestPage.registerInitializer):
* inspector/debugger/resources/log-pause-location.js:
(TestPage.registerInitializer.window.findScript):
(TestPage.registerInitializer.window.findResource):
Test for resolving breakpoints at column locations in <script> which was
not previously possible and would not have worked previously.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@249831 268f45cc-cd09-0410-ab3c-d52691b4dbfc

102 files changed:
LayoutTests/ChangeLog
LayoutTests/TestExpectations
LayoutTests/inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations-expected.txt [new file with mode: 0644]
LayoutTests/inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations.html [new file with mode: 0644]
LayoutTests/inspector/debugger/breakpoints/resources/dump-inline-scripts.html [new file with mode: 0644]
LayoutTests/inspector/debugger/breakpoints/resources/dump.js
LayoutTests/inspector/debugger/resources/log-pause-location.js
LayoutTests/inspector/debugger/tail-deleted-frames/tail-deleted-frames-vm-entry.html
LayoutTests/inspector/formatting/formatting-css.html
LayoutTests/inspector/formatting/formatting-html-expected.txt [new file with mode: 0644]
LayoutTests/inspector/formatting/formatting-html.html [new file with mode: 0644]
LayoutTests/inspector/formatting/formatting-javascript-expected.txt
LayoutTests/inspector/formatting/formatting-javascript.html
LayoutTests/inspector/formatting/formatting-json-expected.txt
LayoutTests/inspector/formatting/formatting-json.html
LayoutTests/inspector/formatting/resources/css-source-map-tests/1.css [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/css-tests/basic-expected.css
LayoutTests/inspector/formatting/resources/css-tests/gradient-expected.css
LayoutTests/inspector/formatting/resources/css-tests/keyframes-expected.css
LayoutTests/inspector/formatting/resources/css-tests/media-query-expected.css
LayoutTests/inspector/formatting/resources/css-tests/selectors-expected.css
LayoutTests/inspector/formatting/resources/css-tests/wrapping-expected.css
LayoutTests/inspector/formatting/resources/formatting-utilities.js [moved from LayoutTests/inspector/formatting/resources/utilities.js with 95% similarity]
LayoutTests/inspector/formatting/resources/html-source-map-tests/1.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-source-map-tests/2.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/attributes-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/attributes.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/auto-close-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/auto-close.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/basic-1-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/basic-1.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/basic-2-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/basic-2.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/comments-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/comments.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-1-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-1.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-2-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-2.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-3-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-3.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-4-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-4.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-5-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-5.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-6-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/eof-6.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/inline-script-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/inline-script.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/inline-style-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/inline-style.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/list-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/list.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-1-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-1.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-2-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-2.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-3-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-3.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/self-closing-expected.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/html-tests/self-closing.html [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/javascript-source-map-tests/1.js [new file with mode: 0644]
LayoutTests/inspector/formatting/resources/source-map-utilities.js [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-css-1-expected.txt [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-css-1.html [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-html-1-expected.txt [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-html-1.html [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-html-2-expected.txt [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-html-2.html [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-javascript-1-expected.txt [new file with mode: 0644]
LayoutTests/inspector/formatting/source-map-javascript-1.html [new file with mode: 0644]
Source/JavaScriptCore/ChangeLog
Source/JavaScriptCore/debugger/Debugger.cpp
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/Tools/HTMLFormatter/HTMLTreeBuilderDebug.js [new file with mode: 0644]
Source/WebInspectorUI/Tools/HTMLFormatter/index.html [new file with mode: 0644]
Source/WebInspectorUI/Tools/HTMLFormatter/styles.css [new file with mode: 0644]
Source/WebInspectorUI/Tools/JSFormatter/JSFormatterDebug.js [moved from Source/WebInspectorUI/Tools/Formatting/EsprimaFormatterDebug.js with 98% similarity]
Source/WebInspectorUI/Tools/JSFormatter/codemirror-additions.css [moved from Source/WebInspectorUI/Tools/Formatting/codemirror-additions.css with 100% similarity]
Source/WebInspectorUI/Tools/JSFormatter/index.html [moved from Source/WebInspectorUI/Tools/Formatting/index.html with 92% similarity]
Source/WebInspectorUI/Tools/SourceMaps/.gitignore [new file with mode: 0644]
Source/WebInspectorUI/Tools/SourceMaps/index.html [new file with mode: 0644]
Source/WebInspectorUI/Tools/SourceMaps/setup.sh [new file with mode: 0755]
Source/WebInspectorUI/Tools/SourceMaps/styles.css [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Controllers/FormatterSourceMap.js
Source/WebInspectorUI/UserInterface/Models/Resource.js
Source/WebInspectorUI/UserInterface/Proxies/FormatterWorkerProxy.js
Source/WebInspectorUI/UserInterface/Test.html
Source/WebInspectorUI/UserInterface/Views/DebuggerSidebarPanel.js
Source/WebInspectorUI/UserInterface/Views/LocalResourceOverridePopover.js
Source/WebInspectorUI/UserInterface/Views/LocalResourceOverrideTreeElement.js
Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js
Source/WebInspectorUI/UserInterface/Views/SourcesNavigationSidebarPanel.js
Source/WebInspectorUI/UserInterface/Views/TextEditor.js
Source/WebInspectorUI/UserInterface/Views/TextResourceContentView.js
Source/WebInspectorUI/UserInterface/Workers/Formatter/CSSFormatter.js
Source/WebInspectorUI/UserInterface/Workers/Formatter/FormatterContentBuilder.js
Source/WebInspectorUI/UserInterface/Workers/Formatter/FormatterWorker.js
Source/WebInspectorUI/UserInterface/Workers/Formatter/HTMLFormatter.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Workers/Formatter/HTMLParser.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Workers/Formatter/HTMLTreeBuilderFormatter.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Workers/Formatter/JSFormatter.js [moved from Source/WebInspectorUI/UserInterface/Workers/Formatter/EsprimaFormatter.js with 98% similarity]

index f11c3d97aa1ae0dded7ff46ab3f5d4fc088237c9..3966253ef173d166cabeab17e508db9cfc44eebf 100644 (file)
@@ -1,3 +1,113 @@
+2019-09-13  Joseph Pecoraro  <pecoraro@apple.com>
+
+        Web Inspector: Formatter: Pretty Print HTML resources (including inline <script>/<style>)
+        https://bugs.webkit.org/show_bug.cgi?id=201535
+        <rdar://problem/29119232>
+
+        Reviewed by Devin Rousso.
+
+        * TestExpectations:
+        Mark slow test.
+
+        * inspector/formatting/formatting-css.html:
+        * inspector/formatting/formatting-html-expected.txt: Added.
+        * inspector/formatting/formatting-html.html: Added.
+        * inspector/formatting/formatting-javascript-expected.txt:
+        * inspector/formatting/formatting-javascript.html:
+        * inspector/formatting/formatting-json-expected.txt:
+        * inspector/formatting/formatting-json.html:
+        * inspector/formatting/resources/formatting-utilities.js: Renamed from LayoutTests/inspector/formatting/resources/utilities.js.
+        Update formatting tests to use new path to utilities.
+
+        * inspector/formatting/resources/css-tests/basic-expected.css:
+        * inspector/formatting/resources/css-tests/gradient-expected.css:
+        * inspector/formatting/resources/css-tests/keyframes-expected.css:
+        * inspector/formatting/resources/css-tests/media-query-expected.css:
+        * inspector/formatting/resources/css-tests/selectors-expected.css:
+        * inspector/formatting/resources/css-tests/wrapping-expected.css:
+        * inspector/codemirror/resources/prettyprinting/css-tests/basic-expected.css:
+        * inspector/codemirror/resources/prettyprinting/css-tests/calc-expected.css:
+        * inspector/codemirror/resources/prettyprinting/css-tests/gradient-expected.css:
+        * inspector/codemirror/resources/prettyprinting/css-tests/keyframes-expected.css:
+        * inspector/codemirror/resources/prettyprinting/css-tests/media-query-expected.css:
+        * inspector/codemirror/resources/prettyprinting/css-tests/selectors-expected.css:
+        * inspector/codemirror/resources/prettyprinting/css-tests/wrapping-expected.css:
+        Eliminate an extra trailing newline in CSS formatted results.
+
+        * inspector/formatting/resources/html-tests/attributes-expected.html: Added.
+        * inspector/formatting/resources/html-tests/attributes.html: Added.
+        * inspector/formatting/resources/html-tests/auto-close-expected.html: Added.
+        * inspector/formatting/resources/html-tests/auto-close.html: Added.
+        * inspector/formatting/resources/html-tests/basic-1-expected.html: Added.
+        * inspector/formatting/resources/html-tests/basic-1.html: Added.
+        * inspector/formatting/resources/html-tests/basic-2-expected.html: Added.
+        * inspector/formatting/resources/html-tests/basic-2.html: Added.
+        * inspector/formatting/resources/html-tests/comments-expected.html: Added.
+        * inspector/formatting/resources/html-tests/comments.html: Added.
+        * inspector/formatting/resources/html-tests/eof-1-expected.html: Added.
+        * inspector/formatting/resources/html-tests/eof-1.html: Added.
+        * inspector/formatting/resources/html-tests/eof-2-expected.html: Added.
+        * inspector/formatting/resources/html-tests/eof-2.html: Added.
+        * inspector/formatting/resources/html-tests/eof-3-expected.html: Added.
+        * inspector/formatting/resources/html-tests/eof-3.html: Added.
+        * inspector/formatting/resources/html-tests/eof-4-expected.html: Added.
+        * inspector/formatting/resources/html-tests/eof-4.html: Added.
+        * inspector/formatting/resources/html-tests/eof-5-expected.html: Added.
+        * inspector/formatting/resources/html-tests/eof-5.html: Added.
+        * inspector/formatting/resources/html-tests/eof-6-expected.html: Added.
+        * inspector/formatting/resources/html-tests/eof-6.html: Added.
+        * inspector/formatting/resources/html-tests/inline-script-expected.html: Added.
+        * inspector/formatting/resources/html-tests/inline-script.html: Added.
+        * inspector/formatting/resources/html-tests/inline-style-expected.html: Added.
+        * inspector/formatting/resources/html-tests/inline-style.html: Added.
+        * inspector/formatting/resources/html-tests/list-expected.html: Added.
+        * inspector/formatting/resources/html-tests/list.html: Added.
+        * inspector/formatting/resources/html-tests/not-well-formed-1-expected.html: Added.
+        * inspector/formatting/resources/html-tests/not-well-formed-1.html: Added.
+        * inspector/formatting/resources/html-tests/not-well-formed-2-expected.html: Added.
+        * inspector/formatting/resources/html-tests/not-well-formed-2.html: Added.
+        * inspector/formatting/resources/html-tests/not-well-formed-3-expected.html: Added.
+        * inspector/formatting/resources/html-tests/not-well-formed-3.html: Added.
+        * inspector/formatting/resources/html-tests/self-closing-expected.html: Added.
+        * inspector/formatting/resources/html-tests/self-closing.html: Added.
+        HTMLFormatter tests.
+
+        * inspector/formatting/resources/html-source-map-tests/1.html: Added.
+        * inspector/formatting/resources/html-source-map-tests/2.html: Added.
+        * inspector/formatting/resources/css-source-map-tests/1.css: Added.
+        * inspector/formatting/resources/javascript-source-map-tests/1.js: Added.
+        * inspector/formatting/source-map-css-1-expected.txt: Added.
+        * inspector/formatting/source-map-css-1.html: Added.
+        * inspector/formatting/source-map-html-1-expected.txt: Added.
+        * inspector/formatting/source-map-html-1.html: Added.
+        * inspector/formatting/source-map-html-2-expected.txt: Added.
+        * inspector/formatting/source-map-html-2.html: Added.
+        * inspector/formatting/source-map-javascript-1-expected.txt: Added.
+        * inspector/formatting/source-map-javascript-1.html: Added.
+        * inspector/formatting/resources/source-map-utilities.js: Added.
+        (TestPage.registerInitializer.logLocationWithContext):
+        (TestPage.registerInitializer.async.runSourceMapTest):
+        (TestPage.registerInitializer.):
+        (TestPage.registerInitializer.async.loadFormattedContentAndSourceMap):
+        (TestPage.registerInitializer.async.loadSourceMapTestResource):
+        (TestPage.registerInitializer.window.addSourceMapTest):
+        (TestPage.registerInitializer):
+        New formatter source map tests to ensure we can go back and forth reasonably
+        between formatted content and original content.
+
+        * inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations-expected.txt: Added.
+        * inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations.html: Added.
+        * inspector/debugger/breakpoints/resources/dump-inline-scripts.html: Added.
+        * inspector/debugger/breakpoints/resources/dump.js:
+        (TestPage.registerInitializer.window.addDumpAllPauseLocationsTestCase):
+        (TestPage.registerInitializer.addDumpAllPauseLocationsTestCaseForScript):
+        (TestPage.registerInitializer):
+        * inspector/debugger/resources/log-pause-location.js:
+        (TestPage.registerInitializer.window.findScript):
+        (TestPage.registerInitializer.window.findResource):
+        Test for resolving breakpoints at column locations in <script> which was
+        not previously possible and would not have worked previously.
+
 2019-09-12  Ryan Haddad  <ryanhaddad@apple.com>
 
         Unreviewed test gardening, rebaseline inspector/model/remote-object.html for WK1 after r249808.
index 22915c742057ec304636a77393d376e2e8cc67de..a5589cdcf64a8f10b133bfd039d9f86d11d836d5 100644 (file)
@@ -740,6 +740,14 @@ webkit.org/b/148036 http/tests/inspector/page/ [ Skip ]
 webkit.org/b/161951 [ Debug ] inspector/debugger/stepping [ Skip ]
 webkit.org/b/161951 [ Release ] inspector/debugger/stepping [ Slow Pass Failure ]
 
+# Source map tests produce a lot of output.
+inspector/formatting/source-map-css-1.html [ Slow ]
+inspector/formatting/source-map-javascript-1.html [ Slow ]
+[ Debug ] inspector/formatting/source-map-html-1.html [ Skip ]
+[ Debug ] inspector/formatting/source-map-html-2.html [ Skip ]
+[ Release ] inspector/formatting/source-map-html-1.html [ Slow ]
+[ Release ] inspector/formatting/source-map-html-2.html [ Slow ]
+
 [ Debug ] inspector/debugger/breakpoints [ Skip ]
 [ Release ] inspector/debugger/breakpoints [ Slow ]
 
diff --git a/LayoutTests/inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations-expected.txt b/LayoutTests/inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations-expected.txt
new file mode 100644 (file)
index 0000000..cb9cffe
--- /dev/null
@@ -0,0 +1,233 @@
+CONSOLE MESSAGE: line 4: here 1
+CONSOLE MESSAGE: line 6: here 2
+Checking all resolved breakpoint locations in a script.
+
+
+
+== Running test suite: Debugger.resolvedBreakpoint.dumpAllLocations
+-- Running test case: Debugger.resolvedBreakpoint.dumpAllLocations.InlineScript
+
+INSERTING AT: 3:0
+PAUSES AT: 3:0
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3    |    <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:1
+PAUSES AT: 3:12
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3     #   <script>|console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:13
+PAUSES AT: 3:34
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>c#onsole.log("here 1");|document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:35
+PAUSES AT: 3:104
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>console.log("here 1");d#ocument.getElementById("one").addEventListener("click", (event) => { |console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:105
+PAUSES AT: 3:124
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { c#onsole.log("one"); |console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:125
+PAUSES AT: 3:144
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); c#onsole.log(event); |});</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 4:0
+PAUSES AT: 5:4
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+ ->   4    #    <script>
+ =>   5        |console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:5
+PAUSES AT: 5:26
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        c#onsole.log("here 2");|document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:27
+PAUSES AT: 5:96
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        console.log("here 2");d#ocument.getElementById("two").addEventListener("click", (event) => { |console.log("two"); console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:97
+PAUSES AT: 5:116
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { c#onsole.log("two"); |console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:117
+PAUSES AT: 5:136
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); c#onsole.log(event); |});
+      6        </script>
+      7    </body>
+      8    
+
+
+INSERTING AT: 3:0
+PAUSES AT: 3:0
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3    |    <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:1
+PAUSES AT: 3:12
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3     #   <script>|console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:13
+PAUSES AT: 3:34
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>c#onsole.log("here 1");|document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:35
+PAUSES AT: 3:104
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>console.log("here 1");d#ocument.getElementById("one").addEventListener("click", (event) => { |console.log("one"); console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:105
+PAUSES AT: 3:124
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { c#onsole.log("one"); |console.log(event); });</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 3:125
+PAUSES AT: 3:144
+      0    <body>
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+-=>   3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); c#onsole.log(event); |});</script>
+      4        <script>
+      5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+
+INSERTING AT: 4:0
+PAUSES AT: 5:4
+      1        <button id="one">One</button>
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+ ->   4    #    <script>
+ =>   5        |console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:5
+PAUSES AT: 5:26
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        c#onsole.log("here 2");|document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:27
+PAUSES AT: 5:96
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        console.log("here 2");d#ocument.getElementById("two").addEventListener("click", (event) => { |console.log("two"); console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:97
+PAUSES AT: 5:116
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { c#onsole.log("two"); |console.log(event); });
+      6        </script>
+      7    </body>
+      8    
+
+INSERTING AT: 5:117
+PAUSES AT: 5:136
+      2        <button id="two">Two</button>
+      3        <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+      4        <script>
+-=>   5        console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); c#onsole.log(event); |});
+      6        </script>
+      7    </body>
+      8    
+
+
diff --git a/LayoutTests/inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations.html b/LayoutTests/inspector/debugger/breakpoints/resolved-dump-all-inline-script-pause-locations.html
new file mode 100644 (file)
index 0000000..5bb10e2
--- /dev/null
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<script src="../../../http/tests/inspector/resources/inspector-test.js"></script>
+<script src="../resources/log-pause-location.js"></script>
+<script src="resources/dump.js"></script>
+<script>
+function test()
+{
+    let suite = InspectorTest.createAsyncSuite("Debugger.resolvedBreakpoint.dumpAllLocations");
+
+    window.addDumpAllPauseLocationsTestCase(suite, {
+        name: "Debugger.resolvedBreakpoint.dumpAllLocations.InlineScript",
+        resourceRegex: /dump-inline-scripts\.html$/,
+    });
+
+    suite.runTestCasesAndFinish();
+}
+</script>
+</head>
+<body onload="runTest()">
+<p>Checking all resolved breakpoint locations in a script.</p>
+<iframe src="resources/dump-inline-scripts.html"></iframe>
+</body>
+</html>
diff --git a/LayoutTests/inspector/debugger/breakpoints/resources/dump-inline-scripts.html b/LayoutTests/inspector/debugger/breakpoints/resources/dump-inline-scripts.html
new file mode 100644 (file)
index 0000000..d140d31
--- /dev/null
@@ -0,0 +1,8 @@
+<body>
+    <button id="one">One</button>
+    <button id="two">Two</button>
+    <script>console.log("here 1");document.getElementById("one").addEventListener("click", (event) => { console.log("one"); console.log(event); });</script>
+    <script>
+    console.log("here 2");document.getElementById("two").addEventListener("click", (event) => { console.log("two"); console.log(event); });
+    </script>
+</body>
index 554895f8bdb2ae893046b840f7427fa00316c266..32c6d28b05b297ea6d2507cff39a888d784392ff 100644 (file)
@@ -7,10 +7,23 @@ TestPage.registerInitializer(() => {
     // Dump all pause locations test.
     // Tries to set a breakpoint at every line:column in the file and
     // logs all unique pause locations with the originator line:column.
-    window.addDumpAllPauseLocationsTestCase = function(suite, {name, scriptRegex}) {
+    window.addDumpAllPauseLocationsTestCase = function(suite, {name, scriptRegex, resourceRegex}) {
+        if (scriptRegex) {
+            let script = window.findScript(scriptRegex);
+            addDumpAllPauseLocationsTestCaseForScript(suite, name, script);
+            return;
+        }
+        if (resourceRegex) {
+            let resource = window.findResource(resourceRegex);
+            addDumpAllPauseLocationsTestCaseForResource(suite, name, resource);
+            return;
+        }
+        throw "Missing scriptRegex or resourceRegex argument";
+    };
+
+    function addDumpAllPauseLocationsTestCaseForScript(suite, name, script) {
         suite.addTestCase({
             name, test(resolve, reject) {
-                let script = window.findScript(scriptRegex);
                 window.loadLinesFromSourceCode(script).then((lines) => {
                     // Iterate all possible pause locations in this file.
                     let pauseLocations = new Map;
@@ -47,6 +60,53 @@ TestPage.registerInitializer(() => {
         });
     }
 
+    function addDumpAllPauseLocationsTestCaseForResource(suite, name, resource) {
+        suite.addTestCase({
+            name, test(resolve, reject) {
+                window.loadLinesFromSourceCode(resource).then((lines) => {
+                    // Iterate all possible pause locations in this file.
+                    let pauseLocations = new Map;
+                    let seenPauseLocations = new Set;
+
+                    let scripts = resource.scripts.slice();
+                    scripts.sort((a, b) => a.range.startLine - b.range.startLine);
+
+                    for (let script of scripts) {
+                        for (let line = script.range.startLine; line <= script.range.endLine; ++line) {
+                            let max = lines[line].length;
+                            for (let column = 0; column <= max; ++column) {
+                                DebuggerAgent.setBreakpointByUrl.invoke({url: resource.url, lineNumber: line, columnNumber: column}, (error, breakpointId, locations) => {
+                                    if (error)
+                                        return;
+                                    if (!locations.length)
+                                        return;
+                                    let location = locations[0];
+                                    let key = JSON.stringify(location);
+                                    if (seenPauseLocations.has(key))
+                                        return;
+                                    pauseLocations.set({lineNumber: line, columnNumber: column}, location);
+                                });
+                            }
+                        }
+
+                        // Log the unique locations and the first input that produced it.
+                        InspectorBackend.runAfterPendingDispatches(() => {
+                            InspectorTest.log("");
+                            for (let [inputLocation, payload] of pauseLocations) {
+                                InspectorTest.log(`INSERTING AT: ${inputLocation.lineNumber}:${inputLocation.columnNumber}`);
+                                InspectorTest.log(`PAUSES AT: ${payload.lineNumber}:${payload.columnNumber}`);
+                                let resolvedLocation = resource.createSourceCodeLocation(payload.lineNumber, payload.columnNumber);
+                                window.logResolvedBreakpointLinesWithContext(inputLocation, resolvedLocation, 3);
+                                InspectorTest.log("");
+                            }
+                            resolve();
+                        });
+                    }
+                });
+            }
+        });
+    }
+
     // Dump each line test.
     // Tries to set a breakpoint at every line:0 in the file and
     // logs its pause location. Clears breakpoints before each line.
index 12c1d4433b0427bd9bcdd60f082416244f715d15..5514c64f0b9473f64c75c239590f8a6133fdc278 100644 (file)
@@ -11,6 +11,19 @@ TestPage.registerInitializer(() => {
             if (regex.test(resource.url))
                 return resource.scripts[0];
         }
+        return null;
+    }
+
+    window.findResource = function(regex) {
+        for (let frame of WI.networkManager.frames) {
+            if (regex.test(frame.mainResource.url))
+                return frame.mainResource;
+            for (let resource of frame.resourceCollection) {
+                if (regex.test(resource.url))
+                    return resource;
+            }            
+        }
+        return null;
     }
 
     window.loadLinesFromSourceCode = function(sourceCode) {
index 5b2be0ac6568e00fb616bcb034b668671706875b..64912e5f689a1b690efb4858521eb0923b2a644b 100644 (file)
@@ -7,7 +7,6 @@
 <script>
 function test()
 {
-    InspectorTest.debug();
     let suite = InspectorTest.createAsyncSuite("Debugger.TailDeletedFrames.VMEntry");
 
     suite.addTestCase({
index 807b2d4a7d8bc67d8d917e60067f277ccddd03ed..f6526ad5492d5b08931dd1689d37fa7120c7d2a8 100644 (file)
@@ -2,7 +2,7 @@
 <html>
 <head>
 <script src="../../http/tests/inspector/resources/inspector-test.js"></script>
-<script src="resources/utilities.js"></script>
+<script src="resources/formatting-utilities.js"></script>
 <script>
 function test()
 {
diff --git a/LayoutTests/inspector/formatting/formatting-html-expected.txt b/LayoutTests/inspector/formatting/formatting-html-expected.txt
new file mode 100644 (file)
index 0000000..70f0ba9
--- /dev/null
@@ -0,0 +1,24 @@
+Test HTML formatting.
+
+
+== Running test suite: HTMLFormatter
+-- Running test case: HTMLFormatter
+PASS: attributes.html
+PASS: auto-close.html
+PASS: basic-1.html
+PASS: basic-2.html
+PASS: comments.html
+PASS: eof-1.html
+PASS: eof-2.html
+PASS: eof-3.html
+PASS: eof-4.html
+PASS: eof-5.html
+PASS: eof-6.html
+PASS: inline-script.html
+PASS: inline-style.html
+PASS: list.html
+PASS: not-well-formed-1.html
+PASS: not-well-formed-2.html
+PASS: not-well-formed-3.html
+PASS: self-closing.html
+
diff --git a/LayoutTests/inspector/formatting/formatting-html.html b/LayoutTests/inspector/formatting/formatting-html.html
new file mode 100644 (file)
index 0000000..989b22e
--- /dev/null
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<script src="resources/formatting-utilities.js"></script>
+<script>
+function test()
+{
+    let suite = InspectorTest.createAsyncSuite("HTMLFormatter");
+
+    addFormattingTests(suite, "text/html", [
+        "resources/html-tests/attributes.html",
+        "resources/html-tests/auto-close.html",
+        "resources/html-tests/basic-1.html",
+        "resources/html-tests/basic-2.html",
+        "resources/html-tests/comments.html",
+        "resources/html-tests/eof-1.html",
+        "resources/html-tests/eof-2.html",
+        "resources/html-tests/eof-3.html",
+        "resources/html-tests/eof-4.html",
+        "resources/html-tests/eof-5.html",
+        "resources/html-tests/eof-6.html",
+        "resources/html-tests/inline-script.html",
+        "resources/html-tests/inline-style.html",
+        "resources/html-tests/list.html",
+        "resources/html-tests/not-well-formed-1.html",
+        "resources/html-tests/not-well-formed-2.html",
+        "resources/html-tests/not-well-formed-3.html",
+        "resources/html-tests/self-closing.html",
+    ]);
+
+    suite.runTestCasesAndFinish();
+}
+</script>
+</head>
+<body onload="runTest()">
+<p>Test HTML formatting.</p>
+</body>
+</html>
index c4cbb6d3bd47f3a7d7b1bea62f68b2068b3338e3..ee10613d0f8117ad0e748f7691a4ea2f3ac5b03c 100644 (file)
@@ -1,8 +1,8 @@
 Test JavaScript formatting.
 
 
-== Running test suite: EsprimaFormatter.JavaScript
--- Running test case: EsprimaFormatter.JavaScript
+== Running test suite: JSFormatter
+-- Running test case: JSFormatter
 PASS: arrow-functions.js
 PASS: classes.js
 PASS: comments-and-preserve-newlines.js
index c654c7ab2809d524c821cae048d07419ec5cc3be..f682216fef1a6e7e5b247552469870da34676a28 100644 (file)
@@ -2,11 +2,11 @@
 <html>
 <head>
 <script src="../../http/tests/inspector/resources/inspector-test.js"></script>
-<script src="resources/utilities.js"></script>
+<script src="resources/formatting-utilities.js"></script>
 <script>
 function test()
 {
-    let suite = InspectorTest.createAsyncSuite("EsprimaFormatter.JavaScript");
+    let suite = InspectorTest.createAsyncSuite("JSFormatter");
 
     addFormattingTests(suite, "text/javascript", [
         "resources/javascript-tests/arrow-functions.js",
index 42b58069905fda32e990a72cbe8eea6e4b41b09a..3fedb75b572885f3dacb3d9226bfb475f0d16d2c 100644 (file)
@@ -1,8 +1,8 @@
 Test JSON formatting.
 
 
-== Running test suite: EsprimaFormatter.JSON
--- Running test case: EsprimaFormatter.ValidJSON
+== Running test suite: JSFormatter.JSON
+-- Running test case: JSFormatter.ValidJSON
 JSON: "{\"a\":123,\"b\":[1,2,3],\"c\":{\"d\":\"e\"}}"
 PASS: JSON should be valid.
 FORMATTED:
@@ -18,7 +18,7 @@ FORMATTED:
     }
 }
 
--- Running test case: EsprimaFormatter.InvalidButObject
+-- Running test case: JSFormatter.InvalidButObject
 JSON: "{a:123,b:[1,2,3],c:{d:\"e\"}}"
 PASS: JSON should be invalid.
 PASS: Should be able to be evaluated to an object.
@@ -31,7 +31,7 @@ FORMATTED:
     }
 }
 
--- Running test case: EsprimaFormatter.InvalidWithComments
+-- Running test case: JSFormatter.InvalidWithComments
 JSON: "{\"a\":123,\"b\":[1,2,3],\"c\":{\"d\":\"e\"}}/*Comment*/"
 PASS: JSON should be invalid.
 PASS: Should be able to be evaluated to an object.
@@ -45,7 +45,7 @@ FORMATTED:
 } /*Comment*/
 
 
--- Running test case: EsprimaFormatter.Invalid
+-- Running test case: JSFormatter.Invalid
 INPUT: "{a:1 b:2}"
 PASS: JSON should be invalid.
 PASS: Should not be able to be evaluated to an object.
index 0c8731e013772755aa2e37d0ab4358d580f47d9b..46d25195d3ea6a8c1fd07419f8059003625766d3 100644 (file)
@@ -32,14 +32,14 @@ function test()
     }
 
 
-    let suite = InspectorTest.createAsyncSuite("EsprimaFormatter.JSON");
+    let suite = InspectorTest.createAsyncSuite("JSFormatter.JSON");
 
     const isModule = false;
     const indentString = "    ";
     let workerProxy = WI.FormatterWorkerProxy.singleton();
 
     suite.addTestCase({
-        name: "EsprimaFormatter.ValidJSON",
+        name: "JSFormatter.ValidJSON",
         description: "Format valid JSON",
         test(resolve, reject) {
             let validJSON = JSON.stringify({"a":123,"b":[1,2,3],"c":{"d":"e"}});
@@ -54,7 +54,7 @@ function test()
     });
 
     suite.addTestCase({
-        name: "EsprimaFormatter.InvalidButObject",
+        name: "JSFormatter.InvalidButObject",
         description: "Format invalid JSON due to literal keys, but it can be evaluated as a valid JavaScript Object",
         test(resolve, reject) {
             let invalidJSON = `{a:123,b:[1,2,3],c:{d:"e"}}`;
@@ -70,7 +70,7 @@ function test()
     });
 
     suite.addTestCase({
-        name: "EsprimaFormatter.InvalidWithComments",
+        name: "JSFormatter.InvalidWithComments",
         description: "Format invalid JSON due to comments, but it can be evaluated as a valid JavaScript Object",
         test(resolve, reject) {
             let invalidJSON = JSON.stringify({"a":123,"b":[1,2,3],"c":{"d":"e"}}) + "/*Comment*/";
@@ -86,7 +86,7 @@ function test()
     });
 
     suite.addTestCase({
-        name: "EsprimaFormatter.Invalid",
+        name: "JSFormatter.Invalid",
         description: "Format invalid JSON, that is not a valid JavaScript Object",
         test(resolve, reject) {
             let invalid = `{a:1 b:2}`;
diff --git a/LayoutTests/inspector/formatting/resources/css-source-map-tests/1.css b/LayoutTests/inspector/formatting/resources/css-source-map-tests/1.css
new file mode 100644 (file)
index 0000000..bcb1114
--- /dev/null
@@ -0,0 +1 @@
+@media(max-device-width:480px){body{color:red;background:blue}}
\ No newline at end of file
index 73358173407cac0c0b3b7478b2e0fa1eb9d982a6..0f4edd4ea1746ec556aac821904ebf9c917b07fb 100644 (file)
@@ -6,4 +6,3 @@
     background: -moz-linear-gradient(top, rgb(126, 198, 234) 0%, rgb(70, 179, 234) 45%, rgb(3, 135, 201) 100%);
     background: linear-gradient(top, rgb(126, 198, 234) 0%, rgb(70, 179, 234) 45%, rgb(3, 135, 201) 100%);
 }
-
index ca38fa083ebc4ed33db3aa0033ca7a4f5e83752d..b348e87e15e8acb14a37d77c178a59849d1cebd7 100644 (file)
@@ -17,4 +17,3 @@
         -webkit-transform: rotate(180deg) translate(10px, 75px);
     }
 }
-
index f3b745e3e1c65a7af9abd06a8fe171d0fb847092..a700c1dd90222404a28ef74ea8dd959354d34874 100644 (file)
@@ -34,4 +34,3 @@ div div > div#id.foo.bar:hover .something > .child ~ .sibling + :matches(.siblin
 div div > div#id.foo.bar:hover .something > .child ~ .sibling + :matches(.sibling)::after {
     color: red;
 }
-
index ccdf7133ddc4cafb60eb3f587832ca8800090f84..1ddc4c3f2f9e2763f2966f9a910b79f8d5c11076 100644 (file)
@@ -11,4 +11,3 @@ a.browsewebappss:hover, a.businessstores:hover, a.buyiphones:hover, a.buynows:ho
 h1, h2, h3, h4, h5, h6 {
     font-size: 1em
 }
-
similarity index 95%
rename from LayoutTests/inspector/formatting/resources/utilities.js
rename to LayoutTests/inspector/formatting/resources/formatting-utilities.js
index 14caef84f467c86fb514aa06dc4665cba90a6290..248061238b08b690795a5804164164fb1251f5c6 100644 (file)
@@ -45,10 +45,12 @@ TestPage.registerInitializer(function() {
                 workerProxy.formatJavaScript(testText, isModule, indentString, callback);
                 break;
             }
-
             case "text/css":
                 workerProxy.formatCSS(testText, indentString, callback);
                 break;
+            case "text/html":
+                workerProxy.formatHTML(testText, indentString, callback);
+                break;
             }
         });
     }
diff --git a/LayoutTests/inspector/formatting/resources/html-source-map-tests/1.html b/LayoutTests/inspector/formatting/resources/html-source-map-tests/1.html
new file mode 100644 (file)
index 0000000..284e089
--- /dev/null
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<head><title>Test Page</title></head>
+<body><style>a{color:red}body,*{color:blue}</style>
+<div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+</body></html>
diff --git a/LayoutTests/inspector/formatting/resources/html-source-map-tests/2.html b/LayoutTests/inspector/formatting/resources/html-source-map-tests/2.html
new file mode 100644 (file)
index 0000000..65aa27c
--- /dev/null
@@ -0,0 +1,11 @@
+<body>
+<!--
+Test
+-->
+<p
+attr
+attr=value
+attr="
+value"
+attr='
+value'>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/attributes-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/attributes-expected.html
new file mode 100644 (file)
index 0000000..4314765
--- /dev/null
@@ -0,0 +1,24 @@
+<p></p>
+<p></p>
+<p attr></p>
+<p attr></p>
+<p></p>
+<p attr=value></p>
+<p attr=value></p>
+<p attr=""></p>
+<p attr="value"></p>
+<p attr="value 1 2 3"></p>
+<p attr="value"></p>
+<p attr=''></p>
+<p attr='value'></p>
+<p attr='value'></p>
+<p attr='value 1 2 3'></p>
+<p attr=value1 attr=value2></p>
+<p a=1 b=2></p>
+
+<p a=1 b=2></p>
+
+<!-- Invalid -->
+<p "value"></p>
+<p 1></p>
+</p attr="value">
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/attributes.html b/LayoutTests/inspector/formatting/resources/html-tests/attributes.html
new file mode 100644 (file)
index 0000000..d5085db
--- /dev/null
@@ -0,0 +1,32 @@
+<p></p>
+<p  ></p>
+<p attr></p>
+<p attr ></p>
+<p attr=></p>
+<p attr=value></p>
+<p attr=value ></p>
+<p attr=""></p>
+<p attr="value"></p>
+<p attr="value 1 2 3"></p>
+<p attr= "value" ></p>
+<p attr=''></p>
+<p attr='value'></p>
+<p attr= 'value' ></p>
+<p attr= 'value 1 2 3' ></p>
+<p attr=value1 attr=value2></p>
+<p a=1 b=2></p>
+
+<p
+a
+=
+1
+b
+=
+2
+>
+</p>
+
+<!-- Invalid -->
+<p "value"></p>
+<p 1></p>
+</p attr="value">
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/auto-close-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/auto-close-expected.html
new file mode 100644 (file)
index 0000000..ca84d5f
--- /dev/null
@@ -0,0 +1,6 @@
+<a>
+    <b>
+        <c>
+            <d>
+                <e>foo
+</a>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/auto-close.html b/LayoutTests/inspector/formatting/resources/html-tests/auto-close.html
new file mode 100644 (file)
index 0000000..1177b33
--- /dev/null
@@ -0,0 +1 @@
+<a><b><c><d><e>foo</a>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/basic-1-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/basic-1-expected.html
new file mode 100644 (file)
index 0000000..77c8ac0
--- /dev/null
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Test</title>
+    <script src="js/script.js"></script>
+</head>
+<body>
+    <!-- Comment -->
+    <div class="foo">
+        <input type=text>
+        <br>
+        <p>Test</p>
+    </div>
+</body>
+</html>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/basic-1.html b/LayoutTests/inspector/formatting/resources/html-tests/basic-1.html
new file mode 100644 (file)
index 0000000..1e995e4
--- /dev/null
@@ -0,0 +1 @@
+<!DOCTYPE html><html><head><title>Test</title><script src="js/script.js"></script></head><body><!-- Comment --><div class="foo"><input type=text><br><p>Test</p></div></body></html>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/basic-2-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/basic-2-expected.html
new file mode 100644 (file)
index 0000000..37913f0
--- /dev/null
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Test</title>
+    <script src="js/script.js"></script>
+</head>
+<body>
+
+    <!-- Section One -->
+    <div class="main">
+        <h1>Test</h1>
+    </div>
+
+    <!-- Section Two -->
+    <ul>
+        <li>One</li>
+        <li>Two</li>
+        <li>Three</li>
+    </ul>
+
+</body>
+</html>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/basic-2.html b/LayoutTests/inspector/formatting/resources/html-tests/basic-2.html
new file mode 100644 (file)
index 0000000..e42f8b8
--- /dev/null
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head><title>Test</title><script src="js/script.js"></script></head>
+<body>
+
+    <!-- Section One -->
+    <div class="main"><h1>Test</h1></div>
+
+    <!-- Section Two -->
+    <ul><li>One</li><li>Two</li><li>Three</li></ul>
+
+</body>
+</html>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/comments-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/comments-expected.html
new file mode 100644 (file)
index 0000000..c17404d
--- /dev/null
@@ -0,0 +1,15 @@
+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<!DOCTYPE html>
+<!doctype html>
+<!dOcTyPe html>
+<?xml version="1.0"?>
+<?xml version="1.0" encoding="utf-8"?>
+<!--Text-->
+<!-- Copyright © 2019 Apple Inc. All rights reserved. -->
+<p>
+    <![CDATA[Test]]>
+</p>
+<p>
+    <![CDATA[ Test ]]>
+</p>
+<!--asdf-->
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/comments.html b/LayoutTests/inspector/formatting/resources/html-tests/comments.html
new file mode 100644 (file)
index 0000000..879a769
--- /dev/null
@@ -0,0 +1,11 @@
+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<!DOCTYPE html>
+<!doctype html>
+<!dOcTyPe html>
+<?xml version="1.0"?>
+<?xml version="1.0" encoding="utf-8"?>
+<!--Text-->
+<!-- Copyright © 2019 Apple Inc. All rights reserved. -->
+<p><![CDATA[Test]]></p>
+<p><![CDATA[ Test ]]></p>
+<!asdf>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-1-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-1-expected.html
new file mode 100644 (file)
index 0000000..14c795b
--- /dev/null
@@ -0,0 +1,2 @@
+<p>
+    foo<a
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-1.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-1.html
new file mode 100644 (file)
index 0000000..6f2792a
--- /dev/null
@@ -0,0 +1 @@
+<p>foo<a
\ No newline at end of file
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-2-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-2-expected.html
new file mode 100644 (file)
index 0000000..cdcf74e
--- /dev/null
@@ -0,0 +1,2 @@
+<p>
+    foo<div attr="
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-2.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-2.html
new file mode 100644 (file)
index 0000000..e946a81
--- /dev/null
@@ -0,0 +1 @@
+<p>foo<div attr="
\ No newline at end of file
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-3-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-3-expected.html
new file mode 100644 (file)
index 0000000..774fdd9
--- /dev/null
@@ -0,0 +1,2 @@
+<p>
+    foo<div attr
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-3.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-3.html
new file mode 100644 (file)
index 0000000..4f501e4
--- /dev/null
@@ -0,0 +1 @@
+<p>foo<div attr
\ No newline at end of file
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-4-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-4-expected.html
new file mode 100644 (file)
index 0000000..93b6509
--- /dev/null
@@ -0,0 +1,2 @@
+<p>
+    foo<div attr=value
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-4.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-4.html
new file mode 100644 (file)
index 0000000..45a08b7
--- /dev/null
@@ -0,0 +1 @@
+<p>foo<div attr=value
\ No newline at end of file
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-5-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-5-expected.html
new file mode 100644 (file)
index 0000000..0795c54
--- /dev/null
@@ -0,0 +1 @@
+<!--foo
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-5.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-5.html
new file mode 100644 (file)
index 0000000..f421abb
--- /dev/null
@@ -0,0 +1 @@
+<!--foo
\ No newline at end of file
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-6-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-6-expected.html
new file mode 100644 (file)
index 0000000..9318418
--- /dev/null
@@ -0,0 +1 @@
+<
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/eof-6.html b/LayoutTests/inspector/formatting/resources/html-tests/eof-6.html
new file mode 100644 (file)
index 0000000..c5fa784
--- /dev/null
@@ -0,0 +1 @@
+<
\ No newline at end of file
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/inline-script-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/inline-script-expected.html
new file mode 100644 (file)
index 0000000..074d57a
--- /dev/null
@@ -0,0 +1,39 @@
+<script></script>
+<script type="module"></script>
+
+<script>
+(function(a, b, c) {
+    let sum = a;
+    sum += b;
+    sum += c;
+    return sum;
+})()
+</script>
+<script type="module">
+import { a, b, c } from "module";
+let x = a + b + c;
+</script>
+
+<div>
+    <script>
+    (function(a, b, c) {
+        let sum = a;
+        sum += b;
+        sum += c;
+        return sum;
+    })()
+    </script>
+    <script type="module">
+    import { a, b, c } from "module";
+    let x = a + b + c;
+    </script>
+</div>
+
+<!-- Script is: `<a><b></a></b>` -->
+<script><a><b></a></b></script>
+
+<!-- Script is: `let str = "` -->
+<script>let str = "</script>
+";
+<p>Test</p>
+</script>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/inline-script.html b/LayoutTests/inspector/formatting/resources/html-tests/inline-script.html
new file mode 100644 (file)
index 0000000..7650cf3
--- /dev/null
@@ -0,0 +1,15 @@
+<script></script>
+<script type="module"></script>
+
+<script>(function(a,b,c){let sum=a;sum+=b;sum+=c;return sum;})()</script>
+<script type="module">import{a,b,c}from"module";let x=a+b+c;</script>
+
+<div>
+<script>(function(a,b,c){let sum=a;sum+=b;sum+=c;return sum;})()</script><script type="module">import{a,b,c}from"module";let x=a+b+c;</script>
+</div>
+
+<!-- Script is: `<a><b></a></b>` -->
+<script><a><b></a></b></script>
+
+<!-- Script is: `let str = "` -->
+<script>let str = "</script>";<p>Test</p></script>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/inline-style-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/inline-style-expected.html
new file mode 100644 (file)
index 0000000..b118802
--- /dev/null
@@ -0,0 +1,38 @@
+<style></style>
+<style>
+body {
+    color: red
+}
+</style>
+<style>
+body {
+    color:red
+}
+
+p {
+    color: blue;
+    background: blue;
+}
+
+div, * {
+    color: red;
+}
+</style>
+
+<div>
+    <style></style>
+    <style>
+    body {
+        color: red
+    }
+    </style>
+</div>
+
+<!-- Style is: `body { background: url("` -->
+<style>
+body {
+    background: url("
+    </style>
+");
+<p>Test</p>
+</style>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/inline-style.html b/LayoutTests/inspector/formatting/resources/html-tests/inline-style.html
new file mode 100644 (file)
index 0000000..2f8359c
--- /dev/null
@@ -0,0 +1,11 @@
+<style></style>
+<style>body{color:red}</style>
+<style>body{color:red}p{color:blue;background:blue;}div,*{color:red;}</style>
+
+<div>
+<style></style>
+<style>body{color:red}</style>
+</div>
+
+<!-- Style is: `body { background: url("` -->
+<style>body { background: url("</style>");<p>Test</p></style>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/list-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/list-expected.html
new file mode 100644 (file)
index 0000000..adc8ce4
--- /dev/null
@@ -0,0 +1,25 @@
+<ul>
+    <li>One</li>
+    <li>Two</li>
+    <li>Three</li>
+</ul>
+<ol>
+    <li>One</li>
+    <li>Two</li>
+    <li>Three</li>
+</ol>
+
+<ul>
+    <li>
+        One
+        <li>
+            Two
+            <li>Three
+</ul>
+<ol>
+    <li>
+        One
+        <li>
+            Two
+            <li>Three
+</ol>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/list.html b/LayoutTests/inspector/formatting/resources/html-tests/list.html
new file mode 100644 (file)
index 0000000..1e90797
--- /dev/null
@@ -0,0 +1,5 @@
+<ul><li>One</li><li>Two</li><li>Three</li></ul>
+<ol><li>One</li><li>Two</li><li>Three</li></ol>
+
+<ul><li>One<li>Two<li>Three</ul>
+<ol><li>One<li>Two<li>Three</ol>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-1-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-1-expected.html
new file mode 100644 (file)
index 0000000..3e49d06
--- /dev/null
@@ -0,0 +1,3 @@
+<p>
+    </br>
+    <p>Test</p>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-1.html b/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-1.html
new file mode 100644 (file)
index 0000000..f6be40c
--- /dev/null
@@ -0,0 +1 @@
+<p></br><p>Test</p>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-2-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-2-expected.html
new file mode 100644 (file)
index 0000000..2e4c0fa
--- /dev/null
@@ -0,0 +1,9 @@
+<a>
+    </z>
+    <b>
+        </z>
+        <c>
+            </z>
+        </c>
+    </b>
+</a>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-2.html b/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-2.html
new file mode 100644 (file)
index 0000000..d497363
--- /dev/null
@@ -0,0 +1 @@
+<a></z><b></z><c></z></c></b></a>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-3-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-3-expected.html
new file mode 100644 (file)
index 0000000..ae22fcb
--- /dev/null
@@ -0,0 +1,9 @@
+<
+<a>
+    ><
+    <b>
+        ><
+    </b>
+    ><
+</a>
+>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-3.html b/LayoutTests/inspector/formatting/resources/html-tests/not-well-formed-3.html
new file mode 100644 (file)
index 0000000..4b6898b
--- /dev/null
@@ -0,0 +1 @@
+<<a>><<b>><</b>><</a>>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/self-closing-expected.html b/LayoutTests/inspector/formatting/resources/html-tests/self-closing-expected.html
new file mode 100644 (file)
index 0000000..7d48da6
--- /dev/null
@@ -0,0 +1,14 @@
+<meta charset="utf-8">
+<link rel="stylesheet" href="foo.css">
+<img src="foo.png">
+<img src="foo.png"/>
+<p>
+    a
+    <br>
+    b
+</p>
+<p>
+    a
+    <br/>
+    b
+</p>
diff --git a/LayoutTests/inspector/formatting/resources/html-tests/self-closing.html b/LayoutTests/inspector/formatting/resources/html-tests/self-closing.html
new file mode 100644 (file)
index 0000000..2fbabc0
--- /dev/null
@@ -0,0 +1,6 @@
+<meta charset="utf-8">
+<link rel="stylesheet" href="foo.css">
+<img src="foo.png">
+<img src="foo.png"/>
+<p>a<br>b</p>
+<p>a<br/>b</p>
diff --git a/LayoutTests/inspector/formatting/resources/javascript-source-map-tests/1.js b/LayoutTests/inspector/formatting/resources/javascript-source-map-tests/1.js
new file mode 100644 (file)
index 0000000..c56cff8
--- /dev/null
@@ -0,0 +1 @@
+(function(a,b,c){let sum=a;sum+=b;sum+=c;return sum;})()
\ No newline at end of file
diff --git a/LayoutTests/inspector/formatting/resources/source-map-utilities.js b/LayoutTests/inspector/formatting/resources/source-map-utilities.js
new file mode 100644 (file)
index 0000000..8bb1382
--- /dev/null
@@ -0,0 +1,140 @@
+TestPage.registerInitializer(function() {
+    const caret = "#";
+    const linesOfContext = 2;
+
+    function logLocationWithContext(line, column, sourceLines) {
+        let startLine = Math.max(0, line - linesOfContext);
+        let endLine = Math.min(line + linesOfContext, sourceLines.length - 1);
+        for (let currentLine = startLine; currentLine <= endLine; ++currentLine) {
+            let text = sourceLines[currentLine];
+            let output = ("" + currentLine).padStart(3, " ") + "| ";
+            if (currentLine === line) {
+                // Line with the column to highlight.
+                for (let i = 0; i < column; ++i)
+                    output += text[i];
+                output += caret;
+                for (let i = column; i < text.length; ++i)
+                    output += text[i];
+            } else {
+                // Simple line.
+                output += text;
+            }
+            InspectorTest.log(output);
+        }
+    }
+
+    async function loadFormattedContentAndSourceMap(mode, testText, testName, testURL) {
+        return await new Promise((resolve, reject) => {
+            let workerProxy = WI.FormatterWorkerProxy.singleton();
+            const includeSourceMapData = true;
+            const indentString = "    ";
+            function callback(result) {
+                resolve(result);
+            }
+
+            switch (mode) {
+            case "text/javascript": {
+                let isModule = /^module/.test(testName);
+                workerProxy.formatJavaScript(testText, isModule, indentString, includeSourceMapData, callback);
+                break;
+            }
+            case "text/css":
+                workerProxy.formatCSS(testText, indentString, includeSourceMapData, callback);
+                break;
+            case "text/html":
+                workerProxy.formatHTML(testText, indentString, includeSourceMapData, callback);
+                break;
+            }
+        });
+    }
+
+    async function loadSourceMapTestResource(testURL) {
+        let result = await NetworkAgent.loadResource(WI.networkManager.mainFrame.id, testURL);
+        return result.content;
+    }
+
+    async function runSourceMapTest(mode, testName, testURL) {
+        let testText = await loadSourceMapTestResource(testURL);
+        let {formattedText, sourceMapData} = await loadFormattedContentAndSourceMap(mode, testText, testName, testURL);
+        let formatterSourceMap = WI.FormatterSourceMap.fromSourceMapData(sourceMapData);
+
+        let originalLines = testText.split("\n");
+        let formattedLines = formattedText.split("\n");
+
+        InspectorTest.log("Original Content Length", testText.length);
+        InspectorTest.log("Formatted Content Length", formattedText.length);
+
+        InspectorTest.log("---- Original to Formatted ----");
+        {
+            let line = 0;
+            let column = 0;
+            for (let i = 0; i < testText.length; ++i) {
+                let c = testText[i];
+                if (c === "\n") {
+                    line++;
+                    column = 0;
+                } else
+                    column++;
+
+                let formattedLocation = formatterSourceMap.originalToFormatted(line, column);
+                let formattedPosition = formatterSourceMap.originalPositionToFormattedPosition(i);
+                let formattedLine = formattedLocation.lineNumber;
+                let formattedColumn = formattedLocation.columnNumber;
+
+                InspectorTest.log(`Original: ${i} (${line}, ${column})`);
+                logLocationWithContext(line, column, originalLines);
+                InspectorTest.log(`Formatted: ${formattedPosition} (${formattedLine}, ${formattedColumn})`);
+                logLocationWithContext(formattedLine, formattedColumn, formattedLines);
+
+                let nextOriginalChar = originalLines[line][column];
+                let nextFormattedChar = formattedLines[formattedLine][formattedColumn];
+                if (nextOriginalChar !== undefined)
+                    InspectorTest.assert(nextOriginalChar === nextFormattedChar, `FAIL: Mapping appears to be to a different token. ${JSON.stringify(nextOriginalChar)} => ${JSON.stringify(nextFormattedChar)}`);
+
+                InspectorTest.log("");
+            }
+        }
+
+        InspectorTest.log("");
+        InspectorTest.log("---- Formatted to Original ----");
+        {
+            let line = 0;
+            let column = 0;
+            for (let i = 0; i < formattedText.length; ++i) {
+                let c = formattedText[i];
+                if (c === "\n") {
+                    line++;
+                    column = 0;
+                } else
+                    column++;
+
+                let originalLocation = formatterSourceMap.formattedToOriginal(line, column);
+                let originalPosition = formatterSourceMap.formattedPositionToOriginalPosition(i);
+                let originalLine = originalLocation.lineNumber;
+                let originalColumn = originalLocation.columnNumber;
+
+                InspectorTest.log(`Formatted: ${i} (${line}, ${column})`);
+                logLocationWithContext(line, column, formattedLines);
+                InspectorTest.log(`Original: ${originalPosition} (${originalLine}, ${originalColumn})`);
+                logLocationWithContext(originalLine, originalColumn, originalLines);
+
+                InspectorTest.log("");
+            }
+        }
+    }
+
+    window.addSourceMapTest = function(suite, mode, name, test) {
+        let testPageURL = WI.networkManager.mainFrame.mainResource.url;
+        let testPageResourcesURL = testPageURL.substring(0, testPageURL.lastIndexOf("/"));
+
+        suite.addTestCase({
+            name: suite.name + "." + name,
+            timeout: -1,
+            async test(resolve, reject) {
+                let testName = test.substring(test.lastIndexOf("/") + 1);
+                let testURL = testPageResourcesURL + "/" + test;
+                await runSourceMapTest(mode, testName, testURL);
+            }
+        });
+    };
+});
diff --git a/LayoutTests/inspector/formatting/source-map-css-1-expected.txt b/LayoutTests/inspector/formatting/source-map-css-1-expected.txt
new file mode 100644 (file)
index 0000000..7a002c3
--- /dev/null
@@ -0,0 +1,1319 @@
+Test CSS SourceMap.
+
+
+== Running test suite: SourceMaps.CSS
+-- Running test case: SourceMaps.CSS.1
+Original Content Length
+Formatted Content Length
+---- Original to Formatted ----
+Original: 0 (0, 1)
+  0| @#media(max-device-width:480px){body{color:red;background:blue}}
+Formatted: 0 (0, 1)
+  0| @#media (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 1 (0, 2)
+  0| @m#edia(max-device-width:480px){body{color:red;background:blue}}
+Formatted: 1 (0, 2)
+  0| @m#edia (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 2 (0, 3)
+  0| @me#dia(max-device-width:480px){body{color:red;background:blue}}
+Formatted: 2 (0, 3)
+  0| @me#dia (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 3 (0, 4)
+  0| @med#ia(max-device-width:480px){body{color:red;background:blue}}
+Formatted: 3 (0, 4)
+  0| @med#ia (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 4 (0, 5)
+  0| @medi#a(max-device-width:480px){body{color:red;background:blue}}
+Formatted: 4 (0, 5)
+  0| @medi#a (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 5 (0, 6)
+  0| @media#(max-device-width:480px){body{color:red;background:blue}}
+Formatted: 5 (0, 7)
+  0| @media #(max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 6 (0, 7)
+  0| @media(#max-device-width:480px){body{color:red;background:blue}}
+Formatted: 7 (0, 8)
+  0| @media (#max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 7 (0, 8)
+  0| @media(m#ax-device-width:480px){body{color:red;background:blue}}
+Formatted: 8 (0, 9)
+  0| @media (m#ax-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 8 (0, 9)
+  0| @media(ma#x-device-width:480px){body{color:red;background:blue}}
+Formatted: 9 (0, 10)
+  0| @media (ma#x-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 9 (0, 10)
+  0| @media(max#-device-width:480px){body{color:red;background:blue}}
+Formatted: 10 (0, 11)
+  0| @media (max#-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 10 (0, 11)
+  0| @media(max-#device-width:480px){body{color:red;background:blue}}
+Formatted: 11 (0, 12)
+  0| @media (max-#device-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 11 (0, 12)
+  0| @media(max-d#evice-width:480px){body{color:red;background:blue}}
+Formatted: 12 (0, 13)
+  0| @media (max-d#evice-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 12 (0, 13)
+  0| @media(max-de#vice-width:480px){body{color:red;background:blue}}
+Formatted: 13 (0, 14)
+  0| @media (max-de#vice-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 13 (0, 14)
+  0| @media(max-dev#ice-width:480px){body{color:red;background:blue}}
+Formatted: 14 (0, 15)
+  0| @media (max-dev#ice-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 14 (0, 15)
+  0| @media(max-devi#ce-width:480px){body{color:red;background:blue}}
+Formatted: 15 (0, 16)
+  0| @media (max-devi#ce-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 15 (0, 16)
+  0| @media(max-devic#e-width:480px){body{color:red;background:blue}}
+Formatted: 16 (0, 17)
+  0| @media (max-devic#e-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 16 (0, 17)
+  0| @media(max-device#-width:480px){body{color:red;background:blue}}
+Formatted: 17 (0, 18)
+  0| @media (max-device#-width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 17 (0, 18)
+  0| @media(max-device-#width:480px){body{color:red;background:blue}}
+Formatted: 18 (0, 19)
+  0| @media (max-device-#width: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 18 (0, 19)
+  0| @media(max-device-w#idth:480px){body{color:red;background:blue}}
+Formatted: 19 (0, 20)
+  0| @media (max-device-w#idth: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 19 (0, 20)
+  0| @media(max-device-wi#dth:480px){body{color:red;background:blue}}
+Formatted: 20 (0, 21)
+  0| @media (max-device-wi#dth: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 20 (0, 21)
+  0| @media(max-device-wid#th:480px){body{color:red;background:blue}}
+Formatted: 21 (0, 22)
+  0| @media (max-device-wid#th: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 21 (0, 22)
+  0| @media(max-device-widt#h:480px){body{color:red;background:blue}}
+Formatted: 22 (0, 23)
+  0| @media (max-device-widt#h: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 22 (0, 23)
+  0| @media(max-device-width#:480px){body{color:red;background:blue}}
+Formatted: 23 (0, 24)
+  0| @media (max-device-width#: 480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 23 (0, 24)
+  0| @media(max-device-width:#480px){body{color:red;background:blue}}
+Formatted: 24 (0, 26)
+  0| @media (max-device-width: #480px) {
+  1|     body {
+  2|         color: red;
+
+Original: 24 (0, 25)
+  0| @media(max-device-width:4#80px){body{color:red;background:blue}}
+Formatted: 26 (0, 27)
+  0| @media (max-device-width: 4#80px) {
+  1|     body {
+  2|         color: red;
+
+Original: 25 (0, 26)
+  0| @media(max-device-width:48#0px){body{color:red;background:blue}}
+Formatted: 27 (0, 28)
+  0| @media (max-device-width: 48#0px) {
+  1|     body {
+  2|         color: red;
+
+Original: 26 (0, 27)
+  0| @media(max-device-width:480#px){body{color:red;background:blue}}
+Formatted: 28 (0, 29)
+  0| @media (max-device-width: 480#px) {
+  1|     body {
+  2|         color: red;
+
+Original: 27 (0, 28)
+  0| @media(max-device-width:480p#x){body{color:red;background:blue}}
+Formatted: 29 (0, 30)
+  0| @media (max-device-width: 480p#x) {
+  1|     body {
+  2|         color: red;
+
+Original: 28 (0, 29)
+  0| @media(max-device-width:480px#){body{color:red;background:blue}}
+Formatted: 30 (0, 31)
+  0| @media (max-device-width: 480px#) {
+  1|     body {
+  2|         color: red;
+
+Original: 29 (0, 30)
+  0| @media(max-device-width:480px)#{body{color:red;background:blue}}
+Formatted: 31 (0, 33)
+  0| @media (max-device-width: 480px) #{
+  1|     body {
+  2|         color: red;
+
+Original: 30 (0, 31)
+  0| @media(max-device-width:480px){#body{color:red;background:blue}}
+Formatted: 33 (1, 4)
+  0| @media (max-device-width: 480px) {
+  1|     #body {
+  2|         color: red;
+  3|         background: blue
+
+Original: 31 (0, 32)
+  0| @media(max-device-width:480px){b#ody{color:red;background:blue}}
+Formatted: 39 (1, 5)
+  0| @media (max-device-width: 480px) {
+  1|     b#ody {
+  2|         color: red;
+  3|         background: blue
+
+Original: 32 (0, 33)
+  0| @media(max-device-width:480px){bo#dy{color:red;background:blue}}
+Formatted: 40 (1, 6)
+  0| @media (max-device-width: 480px) {
+  1|     bo#dy {
+  2|         color: red;
+  3|         background: blue
+
+Original: 33 (0, 34)
+  0| @media(max-device-width:480px){bod#y{color:red;background:blue}}
+Formatted: 41 (1, 7)
+  0| @media (max-device-width: 480px) {
+  1|     bod#y {
+  2|         color: red;
+  3|         background: blue
+
+Original: 34 (0, 35)
+  0| @media(max-device-width:480px){body#{color:red;background:blue}}
+Formatted: 42 (1, 9)
+  0| @media (max-device-width: 480px) {
+  1|     body #{
+  2|         color: red;
+  3|         background: blue
+
+Original: 35 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+Formatted: 44 (2, 8)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         #color: red;
+  3|         background: blue
+  4|     }
+
+Original: 36 (0, 37)
+  0| @media(max-device-width:480px){body{c#olor:red;background:blue}}
+Formatted: 54 (2, 9)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         c#olor: red;
+  3|         background: blue
+  4|     }
+
+Original: 37 (0, 38)
+  0| @media(max-device-width:480px){body{co#lor:red;background:blue}}
+Formatted: 55 (2, 10)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         co#lor: red;
+  3|         background: blue
+  4|     }
+
+Original: 38 (0, 39)
+  0| @media(max-device-width:480px){body{col#or:red;background:blue}}
+Formatted: 56 (2, 11)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         col#or: red;
+  3|         background: blue
+  4|     }
+
+Original: 39 (0, 40)
+  0| @media(max-device-width:480px){body{colo#r:red;background:blue}}
+Formatted: 57 (2, 12)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         colo#r: red;
+  3|         background: blue
+  4|     }
+
+Original: 40 (0, 41)
+  0| @media(max-device-width:480px){body{color#:red;background:blue}}
+Formatted: 58 (2, 13)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color#: red;
+  3|         background: blue
+  4|     }
+
+Original: 41 (0, 42)
+  0| @media(max-device-width:480px){body{color:#red;background:blue}}
+Formatted: 59 (2, 15)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: #red;
+  3|         background: blue
+  4|     }
+
+Original: 42 (0, 43)
+  0| @media(max-device-width:480px){body{color:r#ed;background:blue}}
+Formatted: 61 (2, 16)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: r#ed;
+  3|         background: blue
+  4|     }
+
+Original: 43 (0, 44)
+  0| @media(max-device-width:480px){body{color:re#d;background:blue}}
+Formatted: 62 (2, 17)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: re#d;
+  3|         background: blue
+  4|     }
+
+Original: 44 (0, 45)
+  0| @media(max-device-width:480px){body{color:red#;background:blue}}
+Formatted: 63 (2, 18)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: red#;
+  3|         background: blue
+  4|     }
+
+Original: 45 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+Formatted: 64 (3, 8)
+  1|     body {
+  2|         color: red;
+  3|         #background: blue
+  4|     }
+  5| }
+
+Original: 46 (0, 47)
+  0| @media(max-device-width:480px){body{color:red;b#ackground:blue}}
+Formatted: 74 (3, 9)
+  1|     body {
+  2|         color: red;
+  3|         b#ackground: blue
+  4|     }
+  5| }
+
+Original: 47 (0, 48)
+  0| @media(max-device-width:480px){body{color:red;ba#ckground:blue}}
+Formatted: 75 (3, 10)
+  1|     body {
+  2|         color: red;
+  3|         ba#ckground: blue
+  4|     }
+  5| }
+
+Original: 48 (0, 49)
+  0| @media(max-device-width:480px){body{color:red;bac#kground:blue}}
+Formatted: 76 (3, 11)
+  1|     body {
+  2|         color: red;
+  3|         bac#kground: blue
+  4|     }
+  5| }
+
+Original: 49 (0, 50)
+  0| @media(max-device-width:480px){body{color:red;back#ground:blue}}
+Formatted: 77 (3, 12)
+  1|     body {
+  2|         color: red;
+  3|         back#ground: blue
+  4|     }
+  5| }
+
+Original: 50 (0, 51)
+  0| @media(max-device-width:480px){body{color:red;backg#round:blue}}
+Formatted: 78 (3, 13)
+  1|     body {
+  2|         color: red;
+  3|         backg#round: blue
+  4|     }
+  5| }
+
+Original: 51 (0, 52)
+  0| @media(max-device-width:480px){body{color:red;backgr#ound:blue}}
+Formatted: 79 (3, 14)
+  1|     body {
+  2|         color: red;
+  3|         backgr#ound: blue
+  4|     }
+  5| }
+
+Original: 52 (0, 53)
+  0| @media(max-device-width:480px){body{color:red;backgro#und:blue}}
+Formatted: 80 (3, 15)
+  1|     body {
+  2|         color: red;
+  3|         backgro#und: blue
+  4|     }
+  5| }
+
+Original: 53 (0, 54)
+  0| @media(max-device-width:480px){body{color:red;backgrou#nd:blue}}
+Formatted: 81 (3, 16)
+  1|     body {
+  2|         color: red;
+  3|         backgrou#nd: blue
+  4|     }
+  5| }
+
+Original: 54 (0, 55)
+  0| @media(max-device-width:480px){body{color:red;backgroun#d:blue}}
+Formatted: 82 (3, 17)
+  1|     body {
+  2|         color: red;
+  3|         backgroun#d: blue
+  4|     }
+  5| }
+
+Original: 55 (0, 56)
+  0| @media(max-device-width:480px){body{color:red;background#:blue}}
+Formatted: 83 (3, 18)
+  1|     body {
+  2|         color: red;
+  3|         background#: blue
+  4|     }
+  5| }
+
+Original: 56 (0, 57)
+  0| @media(max-device-width:480px){body{color:red;background:#blue}}
+Formatted: 84 (3, 20)
+  1|     body {
+  2|         color: red;
+  3|         background: #blue
+  4|     }
+  5| }
+
+Original: 57 (0, 58)
+  0| @media(max-device-width:480px){body{color:red;background:b#lue}}
+Formatted: 86 (3, 21)
+  1|     body {
+  2|         color: red;
+  3|         background: b#lue
+  4|     }
+  5| }
+
+Original: 58 (0, 59)
+  0| @media(max-device-width:480px){body{color:red;background:bl#ue}}
+Formatted: 87 (3, 22)
+  1|     body {
+  2|         color: red;
+  3|         background: bl#ue
+  4|     }
+  5| }
+
+Original: 59 (0, 60)
+  0| @media(max-device-width:480px){body{color:red;background:blu#e}}
+Formatted: 88 (3, 23)
+  1|     body {
+  2|         color: red;
+  3|         background: blu#e
+  4|     }
+  5| }
+
+Original: 60 (0, 61)
+  0| @media(max-device-width:480px){body{color:red;background:blue#}}
+Formatted: 89 (4, 4)
+  2|         color: red;
+  3|         background: blue
+  4|     #}
+  5| }
+  6| 
+
+Original: 61 (0, 62)
+  0| @media(max-device-width:480px){body{color:red;background:blue}#}
+Formatted: 95 (5, 0)
+  3|         background: blue
+  4|     }
+  5| #}
+  6| 
+
+Original: 62 (0, 63)
+  0| @media(max-device-width:480px){body{color:red;background:blue}}#
+Formatted: 97 (5, 1)
+  3|         background: blue
+  4|     }
+  5| }#
+  6| 
+
+
+---- Formatted to Original ----
+Formatted: 0 (0, 1)
+  0| @#media (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 0 (0, 1)
+  0| @#media(max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 1 (0, 2)
+  0| @m#edia (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 1 (0, 2)
+  0| @m#edia(max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 2 (0, 3)
+  0| @me#dia (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 2 (0, 3)
+  0| @me#dia(max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 3 (0, 4)
+  0| @med#ia (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 3 (0, 4)
+  0| @med#ia(max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 4 (0, 5)
+  0| @medi#a (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 4 (0, 5)
+  0| @medi#a(max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 5 (0, 6)
+  0| @media# (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 5 (0, 6)
+  0| @media#(max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 6 (0, 7)
+  0| @media #(max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 6 (0, 6)
+  0| @media#(max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 7 (0, 8)
+  0| @media (#max-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 6 (0, 7)
+  0| @media(#max-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 8 (0, 9)
+  0| @media (m#ax-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 7 (0, 8)
+  0| @media(m#ax-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 9 (0, 10)
+  0| @media (ma#x-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 8 (0, 9)
+  0| @media(ma#x-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 10 (0, 11)
+  0| @media (max#-device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 9 (0, 10)
+  0| @media(max#-device-width:480px){body{color:red;background:blue}}
+
+Formatted: 11 (0, 12)
+  0| @media (max-#device-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 10 (0, 11)
+  0| @media(max-#device-width:480px){body{color:red;background:blue}}
+
+Formatted: 12 (0, 13)
+  0| @media (max-d#evice-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 11 (0, 12)
+  0| @media(max-d#evice-width:480px){body{color:red;background:blue}}
+
+Formatted: 13 (0, 14)
+  0| @media (max-de#vice-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 12 (0, 13)
+  0| @media(max-de#vice-width:480px){body{color:red;background:blue}}
+
+Formatted: 14 (0, 15)
+  0| @media (max-dev#ice-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 13 (0, 14)
+  0| @media(max-dev#ice-width:480px){body{color:red;background:blue}}
+
+Formatted: 15 (0, 16)
+  0| @media (max-devi#ce-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 14 (0, 15)
+  0| @media(max-devi#ce-width:480px){body{color:red;background:blue}}
+
+Formatted: 16 (0, 17)
+  0| @media (max-devic#e-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 15 (0, 16)
+  0| @media(max-devic#e-width:480px){body{color:red;background:blue}}
+
+Formatted: 17 (0, 18)
+  0| @media (max-device#-width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 16 (0, 17)
+  0| @media(max-device#-width:480px){body{color:red;background:blue}}
+
+Formatted: 18 (0, 19)
+  0| @media (max-device-#width: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 17 (0, 18)
+  0| @media(max-device-#width:480px){body{color:red;background:blue}}
+
+Formatted: 19 (0, 20)
+  0| @media (max-device-w#idth: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 18 (0, 19)
+  0| @media(max-device-w#idth:480px){body{color:red;background:blue}}
+
+Formatted: 20 (0, 21)
+  0| @media (max-device-wi#dth: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 19 (0, 20)
+  0| @media(max-device-wi#dth:480px){body{color:red;background:blue}}
+
+Formatted: 21 (0, 22)
+  0| @media (max-device-wid#th: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 20 (0, 21)
+  0| @media(max-device-wid#th:480px){body{color:red;background:blue}}
+
+Formatted: 22 (0, 23)
+  0| @media (max-device-widt#h: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 21 (0, 22)
+  0| @media(max-device-widt#h:480px){body{color:red;background:blue}}
+
+Formatted: 23 (0, 24)
+  0| @media (max-device-width#: 480px) {
+  1|     body {
+  2|         color: red;
+Original: 22 (0, 23)
+  0| @media(max-device-width#:480px){body{color:red;background:blue}}
+
+Formatted: 24 (0, 25)
+  0| @media (max-device-width:# 480px) {
+  1|     body {
+  2|         color: red;
+Original: 23 (0, 24)
+  0| @media(max-device-width:#480px){body{color:red;background:blue}}
+
+Formatted: 25 (0, 26)
+  0| @media (max-device-width: #480px) {
+  1|     body {
+  2|         color: red;
+Original: 24 (0, 24)
+  0| @media(max-device-width:#480px){body{color:red;background:blue}}
+
+Formatted: 26 (0, 27)
+  0| @media (max-device-width: 4#80px) {
+  1|     body {
+  2|         color: red;
+Original: 24 (0, 25)
+  0| @media(max-device-width:4#80px){body{color:red;background:blue}}
+
+Formatted: 27 (0, 28)
+  0| @media (max-device-width: 48#0px) {
+  1|     body {
+  2|         color: red;
+Original: 25 (0, 26)
+  0| @media(max-device-width:48#0px){body{color:red;background:blue}}
+
+Formatted: 28 (0, 29)
+  0| @media (max-device-width: 480#px) {
+  1|     body {
+  2|         color: red;
+Original: 26 (0, 27)
+  0| @media(max-device-width:480#px){body{color:red;background:blue}}
+
+Formatted: 29 (0, 30)
+  0| @media (max-device-width: 480p#x) {
+  1|     body {
+  2|         color: red;
+Original: 27 (0, 28)
+  0| @media(max-device-width:480p#x){body{color:red;background:blue}}
+
+Formatted: 30 (0, 31)
+  0| @media (max-device-width: 480px#) {
+  1|     body {
+  2|         color: red;
+Original: 28 (0, 29)
+  0| @media(max-device-width:480px#){body{color:red;background:blue}}
+
+Formatted: 31 (0, 32)
+  0| @media (max-device-width: 480px)# {
+  1|     body {
+  2|         color: red;
+Original: 29 (0, 30)
+  0| @media(max-device-width:480px)#{body{color:red;background:blue}}
+
+Formatted: 32 (0, 33)
+  0| @media (max-device-width: 480px) #{
+  1|     body {
+  2|         color: red;
+Original: 30 (0, 30)
+  0| @media(max-device-width:480px)#{body{color:red;background:blue}}
+
+Formatted: 33 (0, 34)
+  0| @media (max-device-width: 480px) {#
+  1|     body {
+  2|         color: red;
+Original: 30 (0, 31)
+  0| @media(max-device-width:480px){#body{color:red;background:blue}}
+
+Formatted: 34 (1, 0)
+  0| @media (max-device-width: 480px) {
+  1| #    body {
+  2|         color: red;
+  3|         background: blue
+Original: 31 (0, 31)
+  0| @media(max-device-width:480px){#body{color:red;background:blue}}
+
+Formatted: 35 (1, 1)
+  0| @media (max-device-width: 480px) {
+  1|  #   body {
+  2|         color: red;
+  3|         background: blue
+Original: 31 (0, 31)
+  0| @media(max-device-width:480px){#body{color:red;background:blue}}
+
+Formatted: 36 (1, 2)
+  0| @media (max-device-width: 480px) {
+  1|   #  body {
+  2|         color: red;
+  3|         background: blue
+Original: 31 (0, 31)
+  0| @media(max-device-width:480px){#body{color:red;background:blue}}
+
+Formatted: 37 (1, 3)
+  0| @media (max-device-width: 480px) {
+  1|    # body {
+  2|         color: red;
+  3|         background: blue
+Original: 31 (0, 31)
+  0| @media(max-device-width:480px){#body{color:red;background:blue}}
+
+Formatted: 38 (1, 4)
+  0| @media (max-device-width: 480px) {
+  1|     #body {
+  2|         color: red;
+  3|         background: blue
+Original: 31 (0, 31)
+  0| @media(max-device-width:480px){#body{color:red;background:blue}}
+
+Formatted: 39 (1, 5)
+  0| @media (max-device-width: 480px) {
+  1|     b#ody {
+  2|         color: red;
+  3|         background: blue
+Original: 31 (0, 32)
+  0| @media(max-device-width:480px){b#ody{color:red;background:blue}}
+
+Formatted: 40 (1, 6)
+  0| @media (max-device-width: 480px) {
+  1|     bo#dy {
+  2|         color: red;
+  3|         background: blue
+Original: 32 (0, 33)
+  0| @media(max-device-width:480px){bo#dy{color:red;background:blue}}
+
+Formatted: 41 (1, 7)
+  0| @media (max-device-width: 480px) {
+  1|     bod#y {
+  2|         color: red;
+  3|         background: blue
+Original: 33 (0, 34)
+  0| @media(max-device-width:480px){bod#y{color:red;background:blue}}
+
+Formatted: 42 (1, 8)
+  0| @media (max-device-width: 480px) {
+  1|     body# {
+  2|         color: red;
+  3|         background: blue
+Original: 34 (0, 35)
+  0| @media(max-device-width:480px){body#{color:red;background:blue}}
+
+Formatted: 43 (1, 9)
+  0| @media (max-device-width: 480px) {
+  1|     body #{
+  2|         color: red;
+  3|         background: blue
+Original: 35 (0, 35)
+  0| @media(max-device-width:480px){body#{color:red;background:blue}}
+
+Formatted: 44 (1, 10)
+  0| @media (max-device-width: 480px) {
+  1|     body {#
+  2|         color: red;
+  3|         background: blue
+Original: 35 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 45 (2, 0)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2| #        color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 46 (2, 1)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|  #       color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 47 (2, 2)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|   #      color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 48 (2, 3)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|    #     color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 49 (2, 4)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|     #    color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 50 (2, 5)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|      #   color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 51 (2, 6)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|       #  color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 52 (2, 7)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|        # color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 53 (2, 8)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         #color: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 36)
+  0| @media(max-device-width:480px){body{#color:red;background:blue}}
+
+Formatted: 54 (2, 9)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         c#olor: red;
+  3|         background: blue
+  4|     }
+Original: 36 (0, 37)
+  0| @media(max-device-width:480px){body{c#olor:red;background:blue}}
+
+Formatted: 55 (2, 10)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         co#lor: red;
+  3|         background: blue
+  4|     }
+Original: 37 (0, 38)
+  0| @media(max-device-width:480px){body{co#lor:red;background:blue}}
+
+Formatted: 56 (2, 11)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         col#or: red;
+  3|         background: blue
+  4|     }
+Original: 38 (0, 39)
+  0| @media(max-device-width:480px){body{col#or:red;background:blue}}
+
+Formatted: 57 (2, 12)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         colo#r: red;
+  3|         background: blue
+  4|     }
+Original: 39 (0, 40)
+  0| @media(max-device-width:480px){body{colo#r:red;background:blue}}
+
+Formatted: 58 (2, 13)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color#: red;
+  3|         background: blue
+  4|     }
+Original: 40 (0, 41)
+  0| @media(max-device-width:480px){body{color#:red;background:blue}}
+
+Formatted: 59 (2, 14)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color:# red;
+  3|         background: blue
+  4|     }
+Original: 41 (0, 42)
+  0| @media(max-device-width:480px){body{color:#red;background:blue}}
+
+Formatted: 60 (2, 15)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: #red;
+  3|         background: blue
+  4|     }
+Original: 42 (0, 42)
+  0| @media(max-device-width:480px){body{color:#red;background:blue}}
+
+Formatted: 61 (2, 16)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: r#ed;
+  3|         background: blue
+  4|     }
+Original: 42 (0, 43)
+  0| @media(max-device-width:480px){body{color:r#ed;background:blue}}
+
+Formatted: 62 (2, 17)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: re#d;
+  3|         background: blue
+  4|     }
+Original: 43 (0, 44)
+  0| @media(max-device-width:480px){body{color:re#d;background:blue}}
+
+Formatted: 63 (2, 18)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: red#;
+  3|         background: blue
+  4|     }
+Original: 44 (0, 45)
+  0| @media(max-device-width:480px){body{color:red#;background:blue}}
+
+Formatted: 64 (2, 19)
+  0| @media (max-device-width: 480px) {
+  1|     body {
+  2|         color: red;#
+  3|         background: blue
+  4|     }
+Original: 45 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 65 (3, 0)
+  1|     body {
+  2|         color: red;
+  3| #        background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 66 (3, 1)
+  1|     body {
+  2|         color: red;
+  3|  #       background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 67 (3, 2)
+  1|     body {
+  2|         color: red;
+  3|   #      background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 68 (3, 3)
+  1|     body {
+  2|         color: red;
+  3|    #     background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 69 (3, 4)
+  1|     body {
+  2|         color: red;
+  3|     #    background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 70 (3, 5)
+  1|     body {
+  2|         color: red;
+  3|      #   background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 71 (3, 6)
+  1|     body {
+  2|         color: red;
+  3|       #  background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 72 (3, 7)
+  1|     body {
+  2|         color: red;
+  3|        # background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 73 (3, 8)
+  1|     body {
+  2|         color: red;
+  3|         #background: blue
+  4|     }
+  5| }
+Original: 46 (0, 46)
+  0| @media(max-device-width:480px){body{color:red;#background:blue}}
+
+Formatted: 74 (3, 9)
+  1|     body {
+  2|         color: red;
+  3|         b#ackground: blue
+  4|     }
+  5| }
+Original: 46 (0, 47)
+  0| @media(max-device-width:480px){body{color:red;b#ackground:blue}}
+
+Formatted: 75 (3, 10)
+  1|     body {
+  2|         color: red;
+  3|         ba#ckground: blue
+  4|     }
+  5| }
+Original: 47 (0, 48)
+  0| @media(max-device-width:480px){body{color:red;ba#ckground:blue}}
+
+Formatted: 76 (3, 11)
+  1|     body {
+  2|         color: red;
+  3|         bac#kground: blue
+  4|     }
+  5| }
+Original: 48 (0, 49)
+  0| @media(max-device-width:480px){body{color:red;bac#kground:blue}}
+
+Formatted: 77 (3, 12)
+  1|     body {
+  2|         color: red;
+  3|         back#ground: blue
+  4|     }
+  5| }
+Original: 49 (0, 50)
+  0| @media(max-device-width:480px){body{color:red;back#ground:blue}}
+
+Formatted: 78 (3, 13)
+  1|     body {
+  2|         color: red;
+  3|         backg#round: blue
+  4|     }
+  5| }
+Original: 50 (0, 51)
+  0| @media(max-device-width:480px){body{color:red;backg#round:blue}}
+
+Formatted: 79 (3, 14)
+  1|     body {
+  2|         color: red;
+  3|         backgr#ound: blue
+  4|     }
+  5| }
+Original: 51 (0, 52)
+  0| @media(max-device-width:480px){body{color:red;backgr#ound:blue}}
+
+Formatted: 80 (3, 15)
+  1|     body {
+  2|         color: red;
+  3|         backgro#und: blue
+  4|     }
+  5| }
+Original: 52 (0, 53)
+  0| @media(max-device-width:480px){body{color:red;backgro#und:blue}}
+
+Formatted: 81 (3, 16)
+  1|     body {
+  2|         color: red;
+  3|         backgrou#nd: blue
+  4|     }
+  5| }
+Original: 53 (0, 54)
+  0| @media(max-device-width:480px){body{color:red;backgrou#nd:blue}}
+
+Formatted: 82 (3, 17)
+  1|     body {
+  2|         color: red;
+  3|         backgroun#d: blue
+  4|     }
+  5| }
+Original: 54 (0, 55)
+  0| @media(max-device-width:480px){body{color:red;backgroun#d:blue}}
+
+Formatted: 83 (3, 18)
+  1|     body {
+  2|         color: red;
+  3|         background#: blue
+  4|     }
+  5| }
+Original: 55 (0, 56)
+  0| @media(max-device-width:480px){body{color:red;background#:blue}}
+
+Formatted: 84 (3, 19)
+  1|     body {
+  2|         color: red;
+  3|         background:# blue
+  4|     }
+  5| }
+Original: 56 (0, 57)
+  0| @media(max-device-width:480px){body{color:red;background:#blue}}
+
+Formatted: 85 (3, 20)
+  1|     body {
+  2|         color: red;
+  3|         background: #blue
+  4|     }
+  5| }
+Original: 57 (0, 57)
+  0| @media(max-device-width:480px){body{color:red;background:#blue}}
+
+Formatted: 86 (3, 21)
+  1|     body {
+  2|         color: red;
+  3|         background: b#lue
+  4|     }
+  5| }
+Original: 57 (0, 58)
+  0| @media(max-device-width:480px){body{color:red;background:b#lue}}
+
+Formatted: 87 (3, 22)
+  1|     body {
+  2|         color: red;
+  3|         background: bl#ue
+  4|     }
+  5| }
+Original: 58 (0, 59)
+  0| @media(max-device-width:480px){body{color:red;background:bl#ue}}
+
+Formatted: 88 (3, 23)
+  1|     body {
+  2|         color: red;
+  3|         background: blu#e
+  4|     }
+  5| }
+Original: 59 (0, 60)
+  0| @media(max-device-width:480px){body{color:red;background:blu#e}}
+
+Formatted: 89 (3, 24)
+  1|     body {
+  2|         color: red;
+  3|         background: blue#
+  4|     }
+  5| }
+Original: 60 (0, 61)
+  0| @media(max-device-width:480px){body{color:red;background:blue#}}
+
+Formatted: 90 (4, 0)
+  2|         color: red;
+  3|         background: blue
+  4| #    }
+  5| }
+  6| 
+Original: 61 (0, 61)
+  0| @media(max-device-width:480px){body{color:red;background:blue#}}
+
+Formatted: 91 (4, 1)
+  2|         color: red;
+  3|         background: blue
+  4|  #   }
+  5| }
+  6| 
+Original: 61 (0, 61)
+  0| @media(max-device-width:480px){body{color:red;background:blue#}}
+
+Formatted: 92 (4, 2)
+  2|         color: red;
+  3|         background: blue
+  4|   #  }
+  5| }
+  6| 
+Original: 61 (0, 61)
+  0| @media(max-device-width:480px){body{color:red;background:blue#}}
+
+Formatted: 93 (4, 3)
+  2|         color: red;
+  3|         background: blue
+  4|    # }
+  5| }
+  6| 
+Original: 61 (0, 61)
+  0| @media(max-device-width:480px){body{color:red;background:blue#}}
+
+Formatted: 94 (4, 4)
+  2|         color: red;
+  3|         background: blue
+  4|     #}
+  5| }
+  6| 
+Original: 61 (0, 61)
+  0| @media(max-device-width:480px){body{color:red;background:blue#}}
+
+Formatted: 95 (4, 5)
+  2|         color: red;
+  3|         background: blue
+  4|     }#
+  5| }
+  6| 
+Original: 61 (0, 62)
+  0| @media(max-device-width:480px){body{color:red;background:blue}#}
+
+Formatted: 96 (5, 0)
+  3|         background: blue
+  4|     }
+  5| #}
+  6| 
+Original: 62 (0, 62)
+  0| @media(max-device-width:480px){body{color:red;background:blue}#}
+
+Formatted: 97 (5, 1)
+  3|         background: blue
+  4|     }
+  5| }#
+  6| 
+Original: 62 (0, 63)
+  0| @media(max-device-width:480px){body{color:red;background:blue}}#
+
+Formatted: 98 (6, 0)
+  4|     }
+  5| }
+  6| #
+Original: 63 (1, 0)
+  0| @media(max-device-width:480px){body{color:red;background:blue}}
+
+
diff --git a/LayoutTests/inspector/formatting/source-map-css-1.html b/LayoutTests/inspector/formatting/source-map-css-1.html
new file mode 100644 (file)
index 0000000..b09f579
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<script src="resources/source-map-utilities.js"></script>
+<script>
+function test()
+{
+    let suite = InspectorTest.createAsyncSuite("SourceMaps.CSS");
+    addSourceMapTest(suite, "text/css", "1", "resources/css-source-map-tests/1.css");
+    suite.runTestCasesAndFinish();
+}
+</script>
+</head>
+<body onload="runTest()">
+<p>Test CSS SourceMap.</p>
+</body>
+</html>
diff --git a/LayoutTests/inspector/formatting/source-map-html-1-expected.txt b/LayoutTests/inspector/formatting/source-map-html-1-expected.txt
new file mode 100644 (file)
index 0000000..1b26eda
--- /dev/null
@@ -0,0 +1,6410 @@
+Test HTML SourceMap.
+
+
+== Running test suite: SourceMaps.HTML
+-- Running test case: SourceMaps.HTML.1
+Original Content Length
+Formatted Content Length
+---- Original to Formatted ----
+Original: 0 (0, 1)
+  0| <#!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 0 (0, 1)
+  0| <#!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 1 (0, 2)
+  0| <!#DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 1 (0, 2)
+  0| <!#DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 2 (0, 3)
+  0| <!D#OCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 2 (0, 3)
+  0| <!D#OCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 3 (0, 4)
+  0| <!DO#CTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 3 (0, 4)
+  0| <!DO#CTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 4 (0, 5)
+  0| <!DOC#TYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 4 (0, 5)
+  0| <!DOC#TYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 5 (0, 6)
+  0| <!DOCT#YPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 5 (0, 6)
+  0| <!DOCT#YPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 6 (0, 7)
+  0| <!DOCTY#PE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 6 (0, 7)
+  0| <!DOCTY#PE html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 7 (0, 8)
+  0| <!DOCTYP#E html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 7 (0, 8)
+  0| <!DOCTYP#E html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 8 (0, 9)
+  0| <!DOCTYPE# html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 8 (0, 9)
+  0| <!DOCTYPE# html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 9 (0, 10)
+  0| <!DOCTYPE #html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 9 (0, 10)
+  0| <!DOCTYPE #html>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 10 (0, 11)
+  0| <!DOCTYPE h#tml>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 10 (0, 11)
+  0| <!DOCTYPE h#tml>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 11 (0, 12)
+  0| <!DOCTYPE ht#ml>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 11 (0, 12)
+  0| <!DOCTYPE ht#ml>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 12 (0, 13)
+  0| <!DOCTYPE htm#l>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 12 (0, 13)
+  0| <!DOCTYPE htm#l>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 13 (0, 14)
+  0| <!DOCTYPE html#>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 13 (0, 14)
+  0| <!DOCTYPE html#>
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 14 (0, 15)
+  0| <!DOCTYPE html>#
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+Formatted: 14 (0, 15)
+  0| <!DOCTYPE html>#
+  1| <head>
+  2|     <title>Test Page</title>
+
+Original: 15 (1, 0)
+  0| <!DOCTYPE html>
+  1| #<head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 15 (1, 0)
+  0| <!DOCTYPE html>
+  1| #<head>
+  2|     <title>Test Page</title>
+  3| </head>
+
+Original: 16 (1, 1)
+  0| <!DOCTYPE html>
+  1| <#head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 16 (1, 1)
+  0| <!DOCTYPE html>
+  1| <#head>
+  2|     <title>Test Page</title>
+  3| </head>
+
+Original: 17 (1, 2)
+  0| <!DOCTYPE html>
+  1| <h#ead><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 17 (1, 2)
+  0| <!DOCTYPE html>
+  1| <h#ead>
+  2|     <title>Test Page</title>
+  3| </head>
+
+Original: 18 (1, 3)
+  0| <!DOCTYPE html>
+  1| <he#ad><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 18 (1, 3)
+  0| <!DOCTYPE html>
+  1| <he#ad>
+  2|     <title>Test Page</title>
+  3| </head>
+
+Original: 19 (1, 4)
+  0| <!DOCTYPE html>
+  1| <hea#d><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 19 (1, 4)
+  0| <!DOCTYPE html>
+  1| <hea#d>
+  2|     <title>Test Page</title>
+  3| </head>
+
+Original: 20 (1, 5)
+  0| <!DOCTYPE html>
+  1| <head#><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 20 (1, 5)
+  0| <!DOCTYPE html>
+  1| <head#>
+  2|     <title>Test Page</title>
+  3| </head>
+
+Original: 21 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#<title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 21 (2, 4)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     #<title>Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 22 (1, 7)
+  0| <!DOCTYPE html>
+  1| <head><#title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 27 (2, 5)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <#title>Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 23 (1, 8)
+  0| <!DOCTYPE html>
+  1| <head><t#itle>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 28 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <t#itle>Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 24 (1, 9)
+  0| <!DOCTYPE html>
+  1| <head><ti#tle>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 29 (2, 7)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <ti#tle>Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 25 (1, 10)
+  0| <!DOCTYPE html>
+  1| <head><tit#le>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 30 (2, 8)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <tit#le>Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 26 (1, 11)
+  0| <!DOCTYPE html>
+  1| <head><titl#e>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 31 (2, 9)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <titl#e>Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 27 (1, 12)
+  0| <!DOCTYPE html>
+  1| <head><title#>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 32 (2, 10)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title#>Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 28 (1, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>#Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 33 (2, 11)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>#Test Page</title>
+  3| </head>
+  4| <body>
+
+Original: 29 (1, 14)
+  0| <!DOCTYPE html>
+  1| <head><title>T#est Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 34 (2, 12)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>T#est Page</title>
+  3| </head>
+  4| <body>
+
+Original: 30 (1, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Te#st Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 35 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Te#st Page</title>
+  3| </head>
+  4| <body>
+
+Original: 31 (1, 16)
+  0| <!DOCTYPE html>
+  1| <head><title>Tes#t Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 36 (2, 14)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Tes#t Page</title>
+  3| </head>
+  4| <body>
+
+Original: 32 (1, 17)
+  0| <!DOCTYPE html>
+  1| <head><title>Test# Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 37 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test# Page</title>
+  3| </head>
+  4| <body>
+
+Original: 33 (1, 18)
+  0| <!DOCTYPE html>
+  1| <head><title>Test #Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 38 (2, 16)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test #Page</title>
+  3| </head>
+  4| <body>
+
+Original: 34 (1, 19)
+  0| <!DOCTYPE html>
+  1| <head><title>Test P#age</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 39 (2, 17)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test P#age</title>
+  3| </head>
+  4| <body>
+
+Original: 35 (1, 20)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Pa#ge</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 40 (2, 18)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Pa#ge</title>
+  3| </head>
+  4| <body>
+
+Original: 36 (1, 21)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Pag#e</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 41 (2, 19)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Pag#e</title>
+  3| </head>
+  4| <body>
+
+Original: 37 (1, 22)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page#</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 42 (2, 20)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page#</title>
+  3| </head>
+  4| <body>
+
+Original: 38 (1, 23)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page<#/title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 43 (2, 21)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page<#/title>
+  3| </head>
+  4| <body>
+
+Original: 39 (1, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</#title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 44 (2, 22)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</#title>
+  3| </head>
+  4| <body>
+
+Original: 40 (1, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</t#itle></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 45 (2, 23)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</t#itle>
+  3| </head>
+  4| <body>
+
+Original: 41 (1, 26)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</ti#tle></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 46 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</ti#tle>
+  3| </head>
+  4| <body>
+
+Original: 42 (1, 27)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</tit#le></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 47 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</tit#le>
+  3| </head>
+  4| <body>
+
+Original: 43 (1, 28)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</titl#e></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 48 (2, 26)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</titl#e>
+  3| </head>
+  4| <body>
+
+Original: 44 (1, 29)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title#></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 49 (2, 27)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title#>
+  3| </head>
+  4| <body>
+
+Original: 45 (1, 30)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title>#</head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 50 (3, 0)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| #</head>
+  4| <body>
+  5|     <style>
+
+Original: 46 (1, 31)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title><#/head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 52 (3, 1)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| <#/head>
+  4| <body>
+  5|     <style>
+
+Original: 47 (1, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></#head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 53 (3, 2)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </#head>
+  4| <body>
+  5|     <style>
+
+Original: 48 (1, 33)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></h#ead>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 54 (3, 3)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </h#ead>
+  4| <body>
+  5|     <style>
+
+Original: 49 (1, 34)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></he#ad>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 55 (3, 4)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </he#ad>
+  4| <body>
+  5|     <style>
+
+Original: 50 (1, 35)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></hea#d>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 56 (3, 5)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </hea#d>
+  4| <body>
+  5|     <style>
+
+Original: 51 (1, 36)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head#>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 57 (3, 6)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </head#>
+  4| <body>
+  5|     <style>
+
+Original: 52 (1, 37)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>#
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+Formatted: 58 (3, 7)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </head>#
+  4| <body>
+  5|     <style>
+
+Original: 53 (2, 0)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| #<body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 59 (4, 0)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| #<body>
+  5|     <style>
+  6|     a {
+
+Original: 54 (2, 1)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <#body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 60 (4, 1)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <#body>
+  5|     <style>
+  6|     a {
+
+Original: 55 (2, 2)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <b#ody><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 61 (4, 2)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <b#ody>
+  5|     <style>
+  6|     a {
+
+Original: 56 (2, 3)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <bo#dy><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 62 (4, 3)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <bo#dy>
+  5|     <style>
+  6|     a {
+
+Original: 57 (2, 4)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <bod#y><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 63 (4, 4)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <bod#y>
+  5|     <style>
+  6|     a {
+
+Original: 58 (2, 5)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body#><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 64 (4, 5)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <body#>
+  5|     <style>
+  6|     a {
+
+Original: 59 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body>#<style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 65 (5, 4)
+  3| </head>
+  4| <body>
+  5|     #<style>
+  6|     a {
+  7|         color:red
+
+Original: 60 (2, 7)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><#style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 71 (5, 5)
+  3| </head>
+  4| <body>
+  5|     <#style>
+  6|     a {
+  7|         color:red
+
+Original: 61 (2, 8)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><s#tyle>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 72 (5, 6)
+  3| </head>
+  4| <body>
+  5|     <s#tyle>
+  6|     a {
+  7|         color:red
+
+Original: 62 (2, 9)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><st#yle>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 73 (5, 7)
+  3| </head>
+  4| <body>
+  5|     <st#yle>
+  6|     a {
+  7|         color:red
+
+Original: 63 (2, 10)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><sty#le>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 74 (5, 8)
+  3| </head>
+  4| <body>
+  5|     <sty#le>
+  6|     a {
+  7|         color:red
+
+Original: 64 (2, 11)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><styl#e>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 75 (5, 9)
+  3| </head>
+  4| <body>
+  5|     <styl#e>
+  6|     a {
+  7|         color:red
+
+Original: 65 (2, 12)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style#>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 76 (5, 10)
+  3| </head>
+  4| <body>
+  5|     <style#>
+  6|     a {
+  7|         color:red
+
+Original: 66 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>#a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 77 (6, 4)
+  4| <body>
+  5|     <style>
+  6|     #a {
+  7|         color:red
+  8|     }
+
+Original: 67 (2, 14)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a#{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 83 (6, 6)
+  4| <body>
+  5|     <style>
+  6|     a #{
+  7|         color:red
+  8|     }
+
+Original: 68 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 85 (7, 8)
+  5|     <style>
+  6|     a {
+  7|         #color:red
+  8|     }
+  9| 
+
+Original: 69 (2, 16)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{c#olor:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 95 (7, 9)
+  5|     <style>
+  6|     a {
+  7|         c#olor:red
+  8|     }
+  9| 
+
+Original: 70 (2, 17)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{co#lor:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 96 (7, 10)
+  5|     <style>
+  6|     a {
+  7|         co#lor:red
+  8|     }
+  9| 
+
+Original: 71 (2, 18)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{col#or:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 97 (7, 11)
+  5|     <style>
+  6|     a {
+  7|         col#or:red
+  8|     }
+  9| 
+
+Original: 72 (2, 19)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{colo#r:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 98 (7, 12)
+  5|     <style>
+  6|     a {
+  7|         colo#r:red
+  8|     }
+  9| 
+
+Original: 73 (2, 20)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color#:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 99 (7, 13)
+  5|     <style>
+  6|     a {
+  7|         color#:red
+  8|     }
+  9| 
+
+Original: 74 (2, 21)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:#red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 100 (7, 14)
+  5|     <style>
+  6|     a {
+  7|         color:#red
+  8|     }
+  9| 
+
+Original: 75 (2, 22)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:r#ed}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 101 (7, 15)
+  5|     <style>
+  6|     a {
+  7|         color:r#ed
+  8|     }
+  9| 
+
+Original: 76 (2, 23)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:re#d}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 102 (7, 16)
+  5|     <style>
+  6|     a {
+  7|         color:re#d
+  8|     }
+  9| 
+
+Original: 77 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red#}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 103 (8, 4)
+  6|     a {
+  7|         color:red
+  8|     #}
+  9| 
+ 10|     body, * {
+
+Original: 78 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 109 (10, 4)
+  8|     }
+  9| 
+ 10|     #body, * {
+ 11|         color: blue
+ 12|     }
+
+Original: 79 (2, 26)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}b#ody,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 116 (10, 5)
+  8|     }
+  9| 
+ 10|     b#ody, * {
+ 11|         color: blue
+ 12|     }
+
+Original: 80 (2, 27)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}bo#dy,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 117 (10, 6)
+  8|     }
+  9| 
+ 10|     bo#dy, * {
+ 11|         color: blue
+ 12|     }
+
+Original: 81 (2, 28)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}bod#y,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 118 (10, 7)
+  8|     }
+  9| 
+ 10|     bod#y, * {
+ 11|         color: blue
+ 12|     }
+
+Original: 82 (2, 29)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body#,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 119 (10, 8)
+  8|     }
+  9| 
+ 10|     body#, * {
+ 11|         color: blue
+ 12|     }
+
+Original: 83 (2, 30)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,#*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 120 (10, 10)
+  8|     }
+  9| 
+ 10|     body, #* {
+ 11|         color: blue
+ 12|     }
+
+Original: 84 (2, 31)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*#{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 122 (10, 12)
+  8|     }
+  9| 
+ 10|     body, * #{
+ 11|         color: blue
+ 12|     }
+
+Original: 85 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 124 (11, 8)
+  9| 
+ 10|     body, * {
+ 11|         #color: blue
+ 12|     }
+ 13|     </style>
+
+Original: 86 (2, 33)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{c#olor:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 134 (11, 9)
+  9| 
+ 10|     body, * {
+ 11|         c#olor: blue
+ 12|     }
+ 13|     </style>
+
+Original: 87 (2, 34)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{co#lor:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 135 (11, 10)
+  9| 
+ 10|     body, * {
+ 11|         co#lor: blue
+ 12|     }
+ 13|     </style>
+
+Original: 88 (2, 35)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{col#or:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 136 (11, 11)
+  9| 
+ 10|     body, * {
+ 11|         col#or: blue
+ 12|     }
+ 13|     </style>
+
+Original: 89 (2, 36)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{colo#r:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 137 (11, 12)
+  9| 
+ 10|     body, * {
+ 11|         colo#r: blue
+ 12|     }
+ 13|     </style>
+
+Original: 90 (2, 37)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color#:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 138 (11, 13)
+  9| 
+ 10|     body, * {
+ 11|         color#: blue
+ 12|     }
+ 13|     </style>
+
+Original: 91 (2, 38)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:#blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 139 (11, 15)
+  9| 
+ 10|     body, * {
+ 11|         color: #blue
+ 12|     }
+ 13|     </style>
+
+Original: 92 (2, 39)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:b#lue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 141 (11, 16)
+  9| 
+ 10|     body, * {
+ 11|         color: b#lue
+ 12|     }
+ 13|     </style>
+
+Original: 93 (2, 40)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:bl#ue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 142 (11, 17)
+  9| 
+ 10|     body, * {
+ 11|         color: bl#ue
+ 12|     }
+ 13|     </style>
+
+Original: 94 (2, 41)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blu#e}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 143 (11, 18)
+  9| 
+ 10|     body, * {
+ 11|         color: blu#e
+ 12|     }
+ 13|     </style>
+
+Original: 95 (2, 42)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue#}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 144 (12, 4)
+ 10|     body, * {
+ 11|         color: blue
+ 12|     #}
+ 13|     </style>
+ 14|     <div>
+
+Original: 96 (2, 43)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}#</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 150 (13, 4)
+ 11|         color: blue
+ 12|     }
+ 13|     #</style>
+ 14|     <div>
+ 15|         <script>
+
+Original: 97 (2, 44)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}<#/style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 156 (13, 5)
+ 11|         color: blue
+ 12|     }
+ 13|     <#/style>
+ 14|     <div>
+ 15|         <script>
+
+Original: 98 (2, 45)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</#style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 157 (13, 6)
+ 11|         color: blue
+ 12|     }
+ 13|     </#style>
+ 14|     <div>
+ 15|         <script>
+
+Original: 99 (2, 46)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</s#tyle>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 158 (13, 7)
+ 11|         color: blue
+ 12|     }
+ 13|     </s#tyle>
+ 14|     <div>
+ 15|         <script>
+
+Original: 100 (2, 47)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</st#yle>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 159 (13, 8)
+ 11|         color: blue
+ 12|     }
+ 13|     </st#yle>
+ 14|     <div>
+ 15|         <script>
+
+Original: 101 (2, 48)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</sty#le>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 160 (13, 9)
+ 11|         color: blue
+ 12|     }
+ 13|     </sty#le>
+ 14|     <div>
+ 15|         <script>
+
+Original: 102 (2, 49)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</styl#e>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 161 (13, 10)
+ 11|         color: blue
+ 12|     }
+ 13|     </styl#e>
+ 14|     <div>
+ 15|         <script>
+
+Original: 103 (2, 50)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style#>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 162 (13, 11)
+ 11|         color: blue
+ 12|     }
+ 13|     </style#>
+ 14|     <div>
+ 15|         <script>
+
+Original: 104 (2, 51)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>#
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+Formatted: 163 (13, 12)
+ 11|         color: blue
+ 12|     }
+ 13|     </style>#
+ 14|     <div>
+ 15|         <script>
+
+Original: 105 (3, 0)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| #<div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 164 (14, 4)
+ 12|     }
+ 13|     </style>
+ 14|     #<div>
+ 15|         <script>
+ 16|         (() => {
+
+Original: 106 (3, 1)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <#div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 169 (14, 5)
+ 12|     }
+ 13|     </style>
+ 14|     <#div>
+ 15|         <script>
+ 16|         (() => {
+
+Original: 107 (3, 2)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <d#iv><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 170 (14, 6)
+ 12|     }
+ 13|     </style>
+ 14|     <d#iv>
+ 15|         <script>
+ 16|         (() => {
+
+Original: 108 (3, 3)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <di#v><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 171 (14, 7)
+ 12|     }
+ 13|     </style>
+ 14|     <di#v>
+ 15|         <script>
+ 16|         (() => {
+
+Original: 109 (3, 4)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div#><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 172 (14, 8)
+ 12|     }
+ 13|     </style>
+ 14|     <div#>
+ 15|         <script>
+ 16|         (() => {
+
+Original: 110 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 173 (15, 8)
+ 13|     </style>
+ 14|     <div>
+ 15|         #<script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 111 (3, 6)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><#script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 183 (15, 9)
+ 13|     </style>
+ 14|     <div>
+ 15|         <#script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 112 (3, 7)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><s#cript>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 184 (15, 10)
+ 13|     </style>
+ 14|     <div>
+ 15|         <s#cript>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 113 (3, 8)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><sc#ript>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 185 (15, 11)
+ 13|     </style>
+ 14|     <div>
+ 15|         <sc#ript>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 114 (3, 9)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><scr#ipt>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 186 (15, 12)
+ 13|     </style>
+ 14|     <div>
+ 15|         <scr#ipt>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 115 (3, 10)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><scri#pt>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 187 (15, 13)
+ 13|     </style>
+ 14|     <div>
+ 15|         <scri#pt>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 116 (3, 11)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><scrip#t>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 188 (15, 14)
+ 13|     </style>
+ 14|     <div>
+ 15|         <scrip#t>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 117 (3, 12)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script#>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 189 (15, 15)
+ 13|     </style>
+ 14|     <div>
+ 15|         <script#>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+
+Original: 118 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 190 (16, 8)
+ 14|     <div>
+ 15|         <script>
+ 16|         #(() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+
+Original: 119 (3, 14)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(#()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 200 (16, 9)
+ 14|     <div>
+ 15|         <script>
+ 16|         (#() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+
+Original: 120 (3, 15)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>((#)=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 201 (16, 10)
+ 14|     <div>
+ 15|         <script>
+ 16|         ((#) => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+
+Original: 121 (3, 16)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()#=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 202 (16, 12)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() #=> {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+
+Original: 122 (3, 17)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=#>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 204 (16, 13)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() =#> {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+
+Original: 123 (3, 18)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>#{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 205 (16, 15)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() => #{
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+
+Original: 124 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 207 (17, 12)
+ 15|         <script>
+ 16|         (() => {
+ 17|             #for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 125 (3, 20)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{f#or(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 221 (17, 13)
+ 15|         <script>
+ 16|         (() => {
+ 17|             f#or (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 126 (3, 21)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{fo#r(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 222 (17, 14)
+ 15|         <script>
+ 16|         (() => {
+ 17|             fo#r (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 127 (3, 22)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for#(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 223 (17, 16)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for #(let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 128 (3, 23)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(#let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 225 (17, 17)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (#let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 129 (3, 24)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(l#et x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 226 (17, 18)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (l#et x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 130 (3, 25)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(le#t x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 227 (17, 19)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (le#t x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 131 (3, 26)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let# x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 228 (17, 20)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let# x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 132 (3, 27)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let #x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 229 (17, 21)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let #x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 133 (3, 28)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x# of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 230 (17, 22)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x# of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 134 (3, 29)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x #of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 231 (17, 23)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x #of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 135 (3, 30)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x o#f[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 232 (17, 24)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x o#f [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 136 (3, 31)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of#[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 233 (17, 26)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of #[1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 137 (3, 32)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[#1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 235 (17, 27)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [#1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 138 (3, 33)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1#,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 236 (17, 28)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1#, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 139 (3, 34)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,#2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 237 (17, 30)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, #2, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 140 (3, 35)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2#,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 239 (17, 31)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2#, 3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 141 (3, 36)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,#3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 240 (17, 33)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, #3])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 142 (3, 37)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3#])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 242 (17, 34)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3#])
+ 18|                 log(x)
+ 19|         })()
+
+Original: 143 (3, 38)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3]#)log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 243 (17, 35)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3]#)
+ 18|                 log(x)
+ 19|         })()
+
+Original: 144 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 244 (18, 16)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 #log(x)
+ 19|         })()
+ 20|         </script>
+
+Original: 145 (3, 40)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])l#og(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 262 (18, 17)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 l#og(x)
+ 19|         })()
+ 20|         </script>
+
+Original: 146 (3, 41)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])lo#g(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 263 (18, 18)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 lo#g(x)
+ 19|         })()
+ 20|         </script>
+
+Original: 147 (3, 42)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log#(x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 264 (18, 19)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log#(x)
+ 19|         })()
+ 20|         </script>
+
+Original: 148 (3, 43)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(#x)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 265 (18, 20)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(#x)
+ 19|         })()
+ 20|         </script>
+
+Original: 149 (3, 44)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x#)})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 266 (18, 21)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x#)
+ 19|         })()
+ 20|         </script>
+
+Original: 150 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 267 (19, 8)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         #})()
+ 20|         </script>
+ 21|     </div>
+
+Original: 151 (3, 46)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)}#)()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 277 (19, 9)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         }#)()
+ 20|         </script>
+ 21|     </div>
+
+Original: 152 (3, 47)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})#()</script></div>
+  4| </body></html>
+  5| 
+Formatted: 278 (19, 10)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })#()
+ 20|         </script>
+ 21|     </div>
+
+Original: 153 (3, 48)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})(#)</script></div>
+  4| </body></html>
+  5| 
+Formatted: 279 (19, 11)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })(#)
+ 20|         </script>
+ 21|     </div>
+
+Original: 154 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+Formatted: 280 (20, 8)
+ 18|                 log(x)
+ 19|         })()
+ 20|         #</script>
+ 21|     </div>
+ 22| </body>
+
+Original: 155 (3, 50)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()<#/script></div>
+  4| </body></html>
+  5| 
+Formatted: 290 (20, 9)
+ 18|                 log(x)
+ 19|         })()
+ 20|         <#/script>
+ 21|     </div>
+ 22| </body>
+
+Original: 156 (3, 51)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</#script></div>
+  4| </body></html>
+  5| 
+Formatted: 291 (20, 10)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </#script>
+ 21|     </div>
+ 22| </body>
+
+Original: 157 (3, 52)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</s#cript></div>
+  4| </body></html>
+  5| 
+Formatted: 292 (20, 11)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </s#cript>
+ 21|     </div>
+ 22| </body>
+
+Original: 158 (3, 53)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</sc#ript></div>
+  4| </body></html>
+  5| 
+Formatted: 293 (20, 12)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </sc#ript>
+ 21|     </div>
+ 22| </body>
+
+Original: 159 (3, 54)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</scr#ipt></div>
+  4| </body></html>
+  5| 
+Formatted: 294 (20, 13)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </scr#ipt>
+ 21|     </div>
+ 22| </body>
+
+Original: 160 (3, 55)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</scri#pt></div>
+  4| </body></html>
+  5| 
+Formatted: 295 (20, 14)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </scri#pt>
+ 21|     </div>
+ 22| </body>
+
+Original: 161 (3, 56)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</scrip#t></div>
+  4| </body></html>
+  5| 
+Formatted: 296 (20, 15)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </scrip#t>
+ 21|     </div>
+ 22| </body>
+
+Original: 162 (3, 57)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script#></div>
+  4| </body></html>
+  5| 
+Formatted: 297 (20, 16)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </script#>
+ 21|     </div>
+ 22| </body>
+
+Original: 163 (3, 58)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script>#</div>
+  4| </body></html>
+  5| 
+Formatted: 298 (21, 4)
+ 19|         })()
+ 20|         </script>
+ 21|     #</div>
+ 22| </body>
+ 23| </html>
+
+Original: 164 (3, 59)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script><#/div>
+  4| </body></html>
+  5| 
+Formatted: 304 (21, 5)
+ 19|         })()
+ 20|         </script>
+ 21|     <#/div>
+ 22| </body>
+ 23| </html>
+
+Original: 165 (3, 60)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></#div>
+  4| </body></html>
+  5| 
+Formatted: 305 (21, 6)
+ 19|         })()
+ 20|         </script>
+ 21|     </#div>
+ 22| </body>
+ 23| </html>
+
+Original: 166 (3, 61)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></d#iv>
+  4| </body></html>
+  5| 
+Formatted: 306 (21, 7)
+ 19|         })()
+ 20|         </script>
+ 21|     </d#iv>
+ 22| </body>
+ 23| </html>
+
+Original: 167 (3, 62)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></di#v>
+  4| </body></html>
+  5| 
+Formatted: 307 (21, 8)
+ 19|         })()
+ 20|         </script>
+ 21|     </di#v>
+ 22| </body>
+ 23| </html>
+
+Original: 168 (3, 63)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div#>
+  4| </body></html>
+  5| 
+Formatted: 308 (21, 9)
+ 19|         })()
+ 20|         </script>
+ 21|     </div#>
+ 22| </body>
+ 23| </html>
+
+Original: 169 (3, 64)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>#
+  4| </body></html>
+  5| 
+Formatted: 309 (21, 10)
+ 19|         })()
+ 20|         </script>
+ 21|     </div>#
+ 22| </body>
+ 23| </html>
+
+Original: 170 (4, 0)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| #</body></html>
+  5| 
+Formatted: 310 (22, 0)
+ 20|         </script>
+ 21|     </div>
+ 22| #</body>
+ 23| </html>
+ 24| 
+
+Original: 171 (4, 1)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| <#/body></html>
+  5| 
+Formatted: 311 (22, 1)
+ 20|         </script>
+ 21|     </div>
+ 22| <#/body>
+ 23| </html>
+ 24| 
+
+Original: 172 (4, 2)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </#body></html>
+  5| 
+Formatted: 312 (22, 2)
+ 20|         </script>
+ 21|     </div>
+ 22| </#body>
+ 23| </html>
+ 24| 
+
+Original: 173 (4, 3)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </b#ody></html>
+  5| 
+Formatted: 313 (22, 3)
+ 20|         </script>
+ 21|     </div>
+ 22| </b#ody>
+ 23| </html>
+ 24| 
+
+Original: 174 (4, 4)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </bo#dy></html>
+  5| 
+Formatted: 314 (22, 4)
+ 20|         </script>
+ 21|     </div>
+ 22| </bo#dy>
+ 23| </html>
+ 24| 
+
+Original: 175 (4, 5)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </bod#y></html>
+  5| 
+Formatted: 315 (22, 5)
+ 20|         </script>
+ 21|     </div>
+ 22| </bod#y>
+ 23| </html>
+ 24| 
+
+Original: 176 (4, 6)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body#></html>
+  5| 
+Formatted: 316 (22, 6)
+ 20|         </script>
+ 21|     </div>
+ 22| </body#>
+ 23| </html>
+ 24| 
+
+Original: 177 (4, 7)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body>#</html>
+  5| 
+Formatted: 317 (23, 0)
+ 21|     </div>
+ 22| </body>
+ 23| #</html>
+ 24| 
+
+Original: 178 (4, 8)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body><#/html>
+  5| 
+Formatted: 319 (23, 1)
+ 21|     </div>
+ 22| </body>
+ 23| <#/html>
+ 24| 
+
+Original: 179 (4, 9)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></#html>
+  5| 
+Formatted: 320 (23, 2)
+ 21|     </div>
+ 22| </body>
+ 23| </#html>
+ 24| 
+
+Original: 180 (4, 10)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></h#tml>
+  5| 
+Formatted: 321 (23, 3)
+ 21|     </div>
+ 22| </body>
+ 23| </h#tml>
+ 24| 
+
+Original: 181 (4, 11)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></ht#ml>
+  5| 
+Formatted: 322 (23, 4)
+ 21|     </div>
+ 22| </body>
+ 23| </ht#ml>
+ 24| 
+
+Original: 182 (4, 12)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></htm#l>
+  5| 
+Formatted: 323 (23, 5)
+ 21|     </div>
+ 22| </body>
+ 23| </htm#l>
+ 24| 
+
+Original: 183 (4, 13)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html#>
+  5| 
+Formatted: 324 (23, 6)
+ 21|     </div>
+ 22| </body>
+ 23| </html#>
+ 24| 
+
+Original: 184 (4, 14)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>#
+  5| 
+Formatted: 325 (23, 7)
+ 21|     </div>
+ 22| </body>
+ 23| </html>#
+ 24| 
+
+Original: 185 (5, 0)
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| #
+Formatted: 326 (24, 0)
+ 22| </body>
+ 23| </html>
+ 24| #
+
+
+---- Formatted to Original ----
+Formatted: 0 (0, 1)
+  0| <#!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 0 (0, 1)
+  0| <#!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 1 (0, 2)
+  0| <!#DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 1 (0, 2)
+  0| <!#DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 2 (0, 3)
+  0| <!D#OCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 2 (0, 3)
+  0| <!D#OCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 3 (0, 4)
+  0| <!DO#CTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 3 (0, 4)
+  0| <!DO#CTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 4 (0, 5)
+  0| <!DOC#TYPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 4 (0, 5)
+  0| <!DOC#TYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 5 (0, 6)
+  0| <!DOCT#YPE html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 5 (0, 6)
+  0| <!DOCT#YPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 6 (0, 7)
+  0| <!DOCTY#PE html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 6 (0, 7)
+  0| <!DOCTY#PE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 7 (0, 8)
+  0| <!DOCTYP#E html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 7 (0, 8)
+  0| <!DOCTYP#E html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 8 (0, 9)
+  0| <!DOCTYPE# html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 8 (0, 9)
+  0| <!DOCTYPE# html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 9 (0, 10)
+  0| <!DOCTYPE #html>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 9 (0, 10)
+  0| <!DOCTYPE #html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 10 (0, 11)
+  0| <!DOCTYPE h#tml>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 10 (0, 11)
+  0| <!DOCTYPE h#tml>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 11 (0, 12)
+  0| <!DOCTYPE ht#ml>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 11 (0, 12)
+  0| <!DOCTYPE ht#ml>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 12 (0, 13)
+  0| <!DOCTYPE htm#l>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 12 (0, 13)
+  0| <!DOCTYPE htm#l>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 13 (0, 14)
+  0| <!DOCTYPE html#>
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 13 (0, 14)
+  0| <!DOCTYPE html#>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 14 (0, 15)
+  0| <!DOCTYPE html>#
+  1| <head>
+  2|     <title>Test Page</title>
+Original: 14 (0, 15)
+  0| <!DOCTYPE html>#
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+
+Formatted: 15 (1, 0)
+  0| <!DOCTYPE html>
+  1| #<head>
+  2|     <title>Test Page</title>
+  3| </head>
+Original: 15 (1, 0)
+  0| <!DOCTYPE html>
+  1| #<head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 16 (1, 1)
+  0| <!DOCTYPE html>
+  1| <#head>
+  2|     <title>Test Page</title>
+  3| </head>
+Original: 16 (1, 1)
+  0| <!DOCTYPE html>
+  1| <#head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 17 (1, 2)
+  0| <!DOCTYPE html>
+  1| <h#ead>
+  2|     <title>Test Page</title>
+  3| </head>
+Original: 17 (1, 2)
+  0| <!DOCTYPE html>
+  1| <h#ead><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 18 (1, 3)
+  0| <!DOCTYPE html>
+  1| <he#ad>
+  2|     <title>Test Page</title>
+  3| </head>
+Original: 18 (1, 3)
+  0| <!DOCTYPE html>
+  1| <he#ad><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 19 (1, 4)
+  0| <!DOCTYPE html>
+  1| <hea#d>
+  2|     <title>Test Page</title>
+  3| </head>
+Original: 19 (1, 4)
+  0| <!DOCTYPE html>
+  1| <hea#d><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 20 (1, 5)
+  0| <!DOCTYPE html>
+  1| <head#>
+  2|     <title>Test Page</title>
+  3| </head>
+Original: 20 (1, 5)
+  0| <!DOCTYPE html>
+  1| <head#><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 21 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#
+  2|     <title>Test Page</title>
+  3| </head>
+Original: 21 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#<title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 22 (2, 0)
+  0| <!DOCTYPE html>
+  1| <head>
+  2| #    <title>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 22 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#<title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 23 (2, 1)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|  #   <title>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 22 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#<title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 24 (2, 2)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|   #  <title>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 22 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#<title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 25 (2, 3)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|    # <title>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 22 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#<title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 26 (2, 4)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     #<title>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 22 (1, 6)
+  0| <!DOCTYPE html>
+  1| <head>#<title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 27 (2, 5)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <#title>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 22 (1, 7)
+  0| <!DOCTYPE html>
+  1| <head><#title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 28 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <t#itle>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 23 (1, 8)
+  0| <!DOCTYPE html>
+  1| <head><t#itle>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 29 (2, 7)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <ti#tle>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 24 (1, 9)
+  0| <!DOCTYPE html>
+  1| <head><ti#tle>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 30 (2, 8)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <tit#le>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 25 (1, 10)
+  0| <!DOCTYPE html>
+  1| <head><tit#le>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 31 (2, 9)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <titl#e>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 26 (1, 11)
+  0| <!DOCTYPE html>
+  1| <head><titl#e>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 32 (2, 10)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title#>Test Page</title>
+  3| </head>
+  4| <body>
+Original: 27 (1, 12)
+  0| <!DOCTYPE html>
+  1| <head><title#>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 33 (2, 11)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>#Test Page</title>
+  3| </head>
+  4| <body>
+Original: 28 (1, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>#Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 34 (2, 12)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>T#est Page</title>
+  3| </head>
+  4| <body>
+Original: 29 (1, 14)
+  0| <!DOCTYPE html>
+  1| <head><title>T#est Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 35 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Te#st Page</title>
+  3| </head>
+  4| <body>
+Original: 30 (1, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Te#st Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 36 (2, 14)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Tes#t Page</title>
+  3| </head>
+  4| <body>
+Original: 31 (1, 16)
+  0| <!DOCTYPE html>
+  1| <head><title>Tes#t Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 37 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test# Page</title>
+  3| </head>
+  4| <body>
+Original: 32 (1, 17)
+  0| <!DOCTYPE html>
+  1| <head><title>Test# Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 38 (2, 16)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test #Page</title>
+  3| </head>
+  4| <body>
+Original: 33 (1, 18)
+  0| <!DOCTYPE html>
+  1| <head><title>Test #Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 39 (2, 17)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test P#age</title>
+  3| </head>
+  4| <body>
+Original: 34 (1, 19)
+  0| <!DOCTYPE html>
+  1| <head><title>Test P#age</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 40 (2, 18)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Pa#ge</title>
+  3| </head>
+  4| <body>
+Original: 35 (1, 20)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Pa#ge</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 41 (2, 19)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Pag#e</title>
+  3| </head>
+  4| <body>
+Original: 36 (1, 21)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Pag#e</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 42 (2, 20)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page#</title>
+  3| </head>
+  4| <body>
+Original: 37 (1, 22)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page#</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 43 (2, 21)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page<#/title>
+  3| </head>
+  4| <body>
+Original: 38 (1, 23)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page<#/title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 44 (2, 22)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</#title>
+  3| </head>
+  4| <body>
+Original: 39 (1, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</#title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 45 (2, 23)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</t#itle>
+  3| </head>
+  4| <body>
+Original: 40 (1, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</t#itle></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 46 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</ti#tle>
+  3| </head>
+  4| <body>
+Original: 41 (1, 26)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</ti#tle></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 47 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</tit#le>
+  3| </head>
+  4| <body>
+Original: 42 (1, 27)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</tit#le></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 48 (2, 26)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</titl#e>
+  3| </head>
+  4| <body>
+Original: 43 (1, 28)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</titl#e></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 49 (2, 27)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title#>
+  3| </head>
+  4| <body>
+Original: 44 (1, 29)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title#></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 50 (2, 28)
+  0| <!DOCTYPE html>
+  1| <head>
+  2|     <title>Test Page</title>#
+  3| </head>
+  4| <body>
+Original: 45 (1, 30)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title>#</head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 51 (3, 0)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| #</head>
+  4| <body>
+  5|     <style>
+Original: 46 (1, 30)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title>#</head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 52 (3, 1)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| <#/head>
+  4| <body>
+  5|     <style>
+Original: 46 (1, 31)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title><#/head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 53 (3, 2)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </#head>
+  4| <body>
+  5|     <style>
+Original: 47 (1, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></#head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 54 (3, 3)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </h#ead>
+  4| <body>
+  5|     <style>
+Original: 48 (1, 33)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></h#ead>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 55 (3, 4)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </he#ad>
+  4| <body>
+  5|     <style>
+Original: 49 (1, 34)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></he#ad>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 56 (3, 5)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </hea#d>
+  4| <body>
+  5|     <style>
+Original: 50 (1, 35)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></hea#d>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 57 (3, 6)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </head#>
+  4| <body>
+  5|     <style>
+Original: 51 (1, 36)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head#>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 58 (3, 7)
+  1| <head>
+  2|     <title>Test Page</title>
+  3| </head>#
+  4| <body>
+  5|     <style>
+Original: 52 (1, 37)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>#
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+
+Formatted: 59 (4, 0)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| #<body>
+  5|     <style>
+  6|     a {
+Original: 53 (2, 0)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| #<body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 60 (4, 1)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <#body>
+  5|     <style>
+  6|     a {
+Original: 54 (2, 1)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <#body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 61 (4, 2)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <b#ody>
+  5|     <style>
+  6|     a {
+Original: 55 (2, 2)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <b#ody><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 62 (4, 3)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <bo#dy>
+  5|     <style>
+  6|     a {
+Original: 56 (2, 3)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <bo#dy><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 63 (4, 4)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <bod#y>
+  5|     <style>
+  6|     a {
+Original: 57 (2, 4)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <bod#y><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 64 (4, 5)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <body#>
+  5|     <style>
+  6|     a {
+Original: 58 (2, 5)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body#><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 65 (4, 6)
+  2|     <title>Test Page</title>
+  3| </head>
+  4| <body>#
+  5|     <style>
+  6|     a {
+Original: 59 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body>#<style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 66 (5, 0)
+  3| </head>
+  4| <body>
+  5| #    <style>
+  6|     a {
+  7|         color:red
+Original: 60 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body>#<style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 67 (5, 1)
+  3| </head>
+  4| <body>
+  5|  #   <style>
+  6|     a {
+  7|         color:red
+Original: 60 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body>#<style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 68 (5, 2)
+  3| </head>
+  4| <body>
+  5|   #  <style>
+  6|     a {
+  7|         color:red
+Original: 60 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body>#<style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 69 (5, 3)
+  3| </head>
+  4| <body>
+  5|    # <style>
+  6|     a {
+  7|         color:red
+Original: 60 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body>#<style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 70 (5, 4)
+  3| </head>
+  4| <body>
+  5|     #<style>
+  6|     a {
+  7|         color:red
+Original: 60 (2, 6)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body>#<style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 71 (5, 5)
+  3| </head>
+  4| <body>
+  5|     <#style>
+  6|     a {
+  7|         color:red
+Original: 60 (2, 7)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><#style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 72 (5, 6)
+  3| </head>
+  4| <body>
+  5|     <s#tyle>
+  6|     a {
+  7|         color:red
+Original: 61 (2, 8)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><s#tyle>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 73 (5, 7)
+  3| </head>
+  4| <body>
+  5|     <st#yle>
+  6|     a {
+  7|         color:red
+Original: 62 (2, 9)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><st#yle>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 74 (5, 8)
+  3| </head>
+  4| <body>
+  5|     <sty#le>
+  6|     a {
+  7|         color:red
+Original: 63 (2, 10)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><sty#le>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 75 (5, 9)
+  3| </head>
+  4| <body>
+  5|     <styl#e>
+  6|     a {
+  7|         color:red
+Original: 64 (2, 11)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><styl#e>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 76 (5, 10)
+  3| </head>
+  4| <body>
+  5|     <style#>
+  6|     a {
+  7|         color:red
+Original: 65 (2, 12)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style#>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 77 (5, 11)
+  3| </head>
+  4| <body>
+  5|     <style>#
+  6|     a {
+  7|         color:red
+Original: 66 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>#a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 78 (6, 0)
+  4| <body>
+  5|     <style>
+  6| #    a {
+  7|         color:red
+  8|     }
+Original: 67 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>#a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 79 (6, 1)
+  4| <body>
+  5|     <style>
+  6|  #   a {
+  7|         color:red
+  8|     }
+Original: 67 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>#a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 80 (6, 2)
+  4| <body>
+  5|     <style>
+  6|   #  a {
+  7|         color:red
+  8|     }
+Original: 67 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>#a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 81 (6, 3)
+  4| <body>
+  5|     <style>
+  6|    # a {
+  7|         color:red
+  8|     }
+Original: 67 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>#a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 82 (6, 4)
+  4| <body>
+  5|     <style>
+  6|     #a {
+  7|         color:red
+  8|     }
+Original: 67 (2, 13)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>#a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 83 (6, 5)
+  4| <body>
+  5|     <style>
+  6|     a# {
+  7|         color:red
+  8|     }
+Original: 67 (2, 14)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a#{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 84 (6, 6)
+  4| <body>
+  5|     <style>
+  6|     a #{
+  7|         color:red
+  8|     }
+Original: 68 (2, 14)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a#{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 85 (6, 7)
+  4| <body>
+  5|     <style>
+  6|     a {#
+  7|         color:red
+  8|     }
+Original: 68 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 86 (7, 0)
+  5|     <style>
+  6|     a {
+  7| #        color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 87 (7, 1)
+  5|     <style>
+  6|     a {
+  7|  #       color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 88 (7, 2)
+  5|     <style>
+  6|     a {
+  7|   #      color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 89 (7, 3)
+  5|     <style>
+  6|     a {
+  7|    #     color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 90 (7, 4)
+  5|     <style>
+  6|     a {
+  7|     #    color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 91 (7, 5)
+  5|     <style>
+  6|     a {
+  7|      #   color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 92 (7, 6)
+  5|     <style>
+  6|     a {
+  7|       #  color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 93 (7, 7)
+  5|     <style>
+  6|     a {
+  7|        # color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 94 (7, 8)
+  5|     <style>
+  6|     a {
+  7|         #color:red
+  8|     }
+  9| 
+Original: 69 (2, 15)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{#color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 95 (7, 9)
+  5|     <style>
+  6|     a {
+  7|         c#olor:red
+  8|     }
+  9| 
+Original: 69 (2, 16)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{c#olor:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 96 (7, 10)
+  5|     <style>
+  6|     a {
+  7|         co#lor:red
+  8|     }
+  9| 
+Original: 70 (2, 17)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{co#lor:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 97 (7, 11)
+  5|     <style>
+  6|     a {
+  7|         col#or:red
+  8|     }
+  9| 
+Original: 71 (2, 18)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{col#or:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 98 (7, 12)
+  5|     <style>
+  6|     a {
+  7|         colo#r:red
+  8|     }
+  9| 
+Original: 72 (2, 19)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{colo#r:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 99 (7, 13)
+  5|     <style>
+  6|     a {
+  7|         color#:red
+  8|     }
+  9| 
+Original: 73 (2, 20)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color#:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 100 (7, 14)
+  5|     <style>
+  6|     a {
+  7|         color:#red
+  8|     }
+  9| 
+Original: 74 (2, 21)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:#red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 101 (7, 15)
+  5|     <style>
+  6|     a {
+  7|         color:r#ed
+  8|     }
+  9| 
+Original: 75 (2, 22)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:r#ed}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 102 (7, 16)
+  5|     <style>
+  6|     a {
+  7|         color:re#d
+  8|     }
+  9| 
+Original: 76 (2, 23)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:re#d}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 103 (7, 17)
+  5|     <style>
+  6|     a {
+  7|         color:red#
+  8|     }
+  9| 
+Original: 77 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red#}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 104 (8, 0)
+  6|     a {
+  7|         color:red
+  8| #    }
+  9| 
+ 10|     body, * {
+Original: 78 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red#}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 105 (8, 1)
+  6|     a {
+  7|         color:red
+  8|  #   }
+  9| 
+ 10|     body, * {
+Original: 78 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red#}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 106 (8, 2)
+  6|     a {
+  7|         color:red
+  8|   #  }
+  9| 
+ 10|     body, * {
+Original: 78 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red#}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 107 (8, 3)
+  6|     a {
+  7|         color:red
+  8|    # }
+  9| 
+ 10|     body, * {
+Original: 78 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red#}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 108 (8, 4)
+  6|     a {
+  7|         color:red
+  8|     #}
+  9| 
+ 10|     body, * {
+Original: 78 (2, 24)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red#}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 109 (8, 5)
+  6|     a {
+  7|         color:red
+  8|     }#
+  9| 
+ 10|     body, * {
+Original: 78 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 110 (9, 0)
+  7|         color:red
+  8|     }
+  9| #
+ 10|     body, * {
+ 11|         color: blue
+Original: 79 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 111 (10, 0)
+  8|     }
+  9| 
+ 10| #    body, * {
+ 11|         color: blue
+ 12|     }
+Original: 79 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 112 (10, 1)
+  8|     }
+  9| 
+ 10|  #   body, * {
+ 11|         color: blue
+ 12|     }
+Original: 79 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 113 (10, 2)
+  8|     }
+  9| 
+ 10|   #  body, * {
+ 11|         color: blue
+ 12|     }
+Original: 79 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 114 (10, 3)
+  8|     }
+  9| 
+ 10|    # body, * {
+ 11|         color: blue
+ 12|     }
+Original: 79 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 115 (10, 4)
+  8|     }
+  9| 
+ 10|     #body, * {
+ 11|         color: blue
+ 12|     }
+Original: 79 (2, 25)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}#body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 116 (10, 5)
+  8|     }
+  9| 
+ 10|     b#ody, * {
+ 11|         color: blue
+ 12|     }
+Original: 79 (2, 26)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}b#ody,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 117 (10, 6)
+  8|     }
+  9| 
+ 10|     bo#dy, * {
+ 11|         color: blue
+ 12|     }
+Original: 80 (2, 27)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}bo#dy,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 118 (10, 7)
+  8|     }
+  9| 
+ 10|     bod#y, * {
+ 11|         color: blue
+ 12|     }
+Original: 81 (2, 28)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}bod#y,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 119 (10, 8)
+  8|     }
+  9| 
+ 10|     body#, * {
+ 11|         color: blue
+ 12|     }
+Original: 82 (2, 29)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body#,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 120 (10, 9)
+  8|     }
+  9| 
+ 10|     body,# * {
+ 11|         color: blue
+ 12|     }
+Original: 83 (2, 30)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,#*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 121 (10, 10)
+  8|     }
+  9| 
+ 10|     body, #* {
+ 11|         color: blue
+ 12|     }
+Original: 84 (2, 30)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,#*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 122 (10, 11)
+  8|     }
+  9| 
+ 10|     body, *# {
+ 11|         color: blue
+ 12|     }
+Original: 84 (2, 31)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*#{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 123 (10, 12)
+  8|     }
+  9| 
+ 10|     body, * #{
+ 11|         color: blue
+ 12|     }
+Original: 85 (2, 31)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*#{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 124 (10, 13)
+  8|     }
+  9| 
+ 10|     body, * {#
+ 11|         color: blue
+ 12|     }
+Original: 85 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 125 (11, 0)
+  9| 
+ 10|     body, * {
+ 11| #        color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 126 (11, 1)
+  9| 
+ 10|     body, * {
+ 11|  #       color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 127 (11, 2)
+  9| 
+ 10|     body, * {
+ 11|   #      color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 128 (11, 3)
+  9| 
+ 10|     body, * {
+ 11|    #     color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 129 (11, 4)
+  9| 
+ 10|     body, * {
+ 11|     #    color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 130 (11, 5)
+  9| 
+ 10|     body, * {
+ 11|      #   color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 131 (11, 6)
+  9| 
+ 10|     body, * {
+ 11|       #  color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 132 (11, 7)
+  9| 
+ 10|     body, * {
+ 11|        # color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 133 (11, 8)
+  9| 
+ 10|     body, * {
+ 11|         #color: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 32)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{#color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 134 (11, 9)
+  9| 
+ 10|     body, * {
+ 11|         c#olor: blue
+ 12|     }
+ 13|     </style>
+Original: 86 (2, 33)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{c#olor:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 135 (11, 10)
+  9| 
+ 10|     body, * {
+ 11|         co#lor: blue
+ 12|     }
+ 13|     </style>
+Original: 87 (2, 34)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{co#lor:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 136 (11, 11)
+  9| 
+ 10|     body, * {
+ 11|         col#or: blue
+ 12|     }
+ 13|     </style>
+Original: 88 (2, 35)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{col#or:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 137 (11, 12)
+  9| 
+ 10|     body, * {
+ 11|         colo#r: blue
+ 12|     }
+ 13|     </style>
+Original: 89 (2, 36)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{colo#r:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 138 (11, 13)
+  9| 
+ 10|     body, * {
+ 11|         color#: blue
+ 12|     }
+ 13|     </style>
+Original: 90 (2, 37)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color#:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 139 (11, 14)
+  9| 
+ 10|     body, * {
+ 11|         color:# blue
+ 12|     }
+ 13|     </style>
+Original: 91 (2, 38)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:#blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 140 (11, 15)
+  9| 
+ 10|     body, * {
+ 11|         color: #blue
+ 12|     }
+ 13|     </style>
+Original: 92 (2, 38)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:#blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 141 (11, 16)
+  9| 
+ 10|     body, * {
+ 11|         color: b#lue
+ 12|     }
+ 13|     </style>
+Original: 92 (2, 39)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:b#lue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 142 (11, 17)
+  9| 
+ 10|     body, * {
+ 11|         color: bl#ue
+ 12|     }
+ 13|     </style>
+Original: 93 (2, 40)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:bl#ue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 143 (11, 18)
+  9| 
+ 10|     body, * {
+ 11|         color: blu#e
+ 12|     }
+ 13|     </style>
+Original: 94 (2, 41)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blu#e}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 144 (11, 19)
+  9| 
+ 10|     body, * {
+ 11|         color: blue#
+ 12|     }
+ 13|     </style>
+Original: 95 (2, 42)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue#}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 145 (12, 0)
+ 10|     body, * {
+ 11|         color: blue
+ 12| #    }
+ 13|     </style>
+ 14|     <div>
+Original: 96 (2, 42)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue#}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 146 (12, 1)
+ 10|     body, * {
+ 11|         color: blue
+ 12|  #   }
+ 13|     </style>
+ 14|     <div>
+Original: 96 (2, 42)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue#}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 147 (12, 2)
+ 10|     body, * {
+ 11|         color: blue
+ 12|   #  }
+ 13|     </style>
+ 14|     <div>
+Original: 96 (2, 42)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue#}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 148 (12, 3)
+ 10|     body, * {
+ 11|         color: blue
+ 12|    # }
+ 13|     </style>
+ 14|     <div>
+Original: 96 (2, 42)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue#}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 149 (12, 4)
+ 10|     body, * {
+ 11|         color: blue
+ 12|     #}
+ 13|     </style>
+ 14|     <div>
+Original: 96 (2, 42)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue#}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 150 (12, 5)
+ 10|     body, * {
+ 11|         color: blue
+ 12|     }#
+ 13|     </style>
+ 14|     <div>
+Original: 96 (2, 43)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}#</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 151 (13, 0)
+ 11|         color: blue
+ 12|     }
+ 13| #    </style>
+ 14|     <div>
+ 15|         <script>
+Original: 97 (2, 43)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}#</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 152 (13, 1)
+ 11|         color: blue
+ 12|     }
+ 13|  #   </style>
+ 14|     <div>
+ 15|         <script>
+Original: 97 (2, 43)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}#</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 153 (13, 2)
+ 11|         color: blue
+ 12|     }
+ 13|   #  </style>
+ 14|     <div>
+ 15|         <script>
+Original: 97 (2, 43)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}#</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 154 (13, 3)
+ 11|         color: blue
+ 12|     }
+ 13|    # </style>
+ 14|     <div>
+ 15|         <script>
+Original: 97 (2, 43)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}#</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 155 (13, 4)
+ 11|         color: blue
+ 12|     }
+ 13|     #</style>
+ 14|     <div>
+ 15|         <script>
+Original: 97 (2, 43)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}#</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 156 (13, 5)
+ 11|         color: blue
+ 12|     }
+ 13|     <#/style>
+ 14|     <div>
+ 15|         <script>
+Original: 97 (2, 44)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}<#/style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 157 (13, 6)
+ 11|         color: blue
+ 12|     }
+ 13|     </#style>
+ 14|     <div>
+ 15|         <script>
+Original: 98 (2, 45)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</#style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 158 (13, 7)
+ 11|         color: blue
+ 12|     }
+ 13|     </s#tyle>
+ 14|     <div>
+ 15|         <script>
+Original: 99 (2, 46)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</s#tyle>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 159 (13, 8)
+ 11|         color: blue
+ 12|     }
+ 13|     </st#yle>
+ 14|     <div>
+ 15|         <script>
+Original: 100 (2, 47)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</st#yle>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 160 (13, 9)
+ 11|         color: blue
+ 12|     }
+ 13|     </sty#le>
+ 14|     <div>
+ 15|         <script>
+Original: 101 (2, 48)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</sty#le>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 161 (13, 10)
+ 11|         color: blue
+ 12|     }
+ 13|     </styl#e>
+ 14|     <div>
+ 15|         <script>
+Original: 102 (2, 49)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</styl#e>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 162 (13, 11)
+ 11|         color: blue
+ 12|     }
+ 13|     </style#>
+ 14|     <div>
+ 15|         <script>
+Original: 103 (2, 50)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style#>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 163 (13, 12)
+ 11|         color: blue
+ 12|     }
+ 13|     </style>#
+ 14|     <div>
+ 15|         <script>
+Original: 104 (2, 51)
+  0| <!DOCTYPE html>
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>#
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+
+Formatted: 164 (14, 0)
+ 12|     }
+ 13|     </style>
+ 14| #    <div>
+ 15|         <script>
+ 16|         (() => {
+Original: 105 (3, 0)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| #<div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 165 (14, 1)
+ 12|     }
+ 13|     </style>
+ 14|  #   <div>
+ 15|         <script>
+ 16|         (() => {
+Original: 106 (3, 0)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| #<div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 166 (14, 2)
+ 12|     }
+ 13|     </style>
+ 14|   #  <div>
+ 15|         <script>
+ 16|         (() => {
+Original: 106 (3, 0)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| #<div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 167 (14, 3)
+ 12|     }
+ 13|     </style>
+ 14|    # <div>
+ 15|         <script>
+ 16|         (() => {
+Original: 106 (3, 0)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| #<div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 168 (14, 4)
+ 12|     }
+ 13|     </style>
+ 14|     #<div>
+ 15|         <script>
+ 16|         (() => {
+Original: 106 (3, 0)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| #<div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 169 (14, 5)
+ 12|     }
+ 13|     </style>
+ 14|     <#div>
+ 15|         <script>
+ 16|         (() => {
+Original: 106 (3, 1)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <#div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 170 (14, 6)
+ 12|     }
+ 13|     </style>
+ 14|     <d#iv>
+ 15|         <script>
+ 16|         (() => {
+Original: 107 (3, 2)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <d#iv><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 171 (14, 7)
+ 12|     }
+ 13|     </style>
+ 14|     <di#v>
+ 15|         <script>
+ 16|         (() => {
+Original: 108 (3, 3)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <di#v><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 172 (14, 8)
+ 12|     }
+ 13|     </style>
+ 14|     <div#>
+ 15|         <script>
+ 16|         (() => {
+Original: 109 (3, 4)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div#><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 173 (14, 9)
+ 12|     }
+ 13|     </style>
+ 14|     <div>#
+ 15|         <script>
+ 16|         (() => {
+Original: 110 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 174 (15, 0)
+ 13|     </style>
+ 14|     <div>
+ 15| #        <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 175 (15, 1)
+ 13|     </style>
+ 14|     <div>
+ 15|  #       <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 176 (15, 2)
+ 13|     </style>
+ 14|     <div>
+ 15|   #      <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 177 (15, 3)
+ 13|     </style>
+ 14|     <div>
+ 15|    #     <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 178 (15, 4)
+ 13|     </style>
+ 14|     <div>
+ 15|     #    <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 179 (15, 5)
+ 13|     </style>
+ 14|     <div>
+ 15|      #   <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 180 (15, 6)
+ 13|     </style>
+ 14|     <div>
+ 15|       #  <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 181 (15, 7)
+ 13|     </style>
+ 14|     <div>
+ 15|        # <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 182 (15, 8)
+ 13|     </style>
+ 14|     <div>
+ 15|         #<script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 5)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div>#<script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 183 (15, 9)
+ 13|     </style>
+ 14|     <div>
+ 15|         <#script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 111 (3, 6)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><#script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 184 (15, 10)
+ 13|     </style>
+ 14|     <div>
+ 15|         <s#cript>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 112 (3, 7)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><s#cript>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 185 (15, 11)
+ 13|     </style>
+ 14|     <div>
+ 15|         <sc#ript>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 113 (3, 8)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><sc#ript>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 186 (15, 12)
+ 13|     </style>
+ 14|     <div>
+ 15|         <scr#ipt>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 114 (3, 9)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><scr#ipt>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 187 (15, 13)
+ 13|     </style>
+ 14|     <div>
+ 15|         <scri#pt>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 115 (3, 10)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><scri#pt>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 188 (15, 14)
+ 13|     </style>
+ 14|     <div>
+ 15|         <scrip#t>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 116 (3, 11)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><scrip#t>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 189 (15, 15)
+ 13|     </style>
+ 14|     <div>
+ 15|         <script#>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 117 (3, 12)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script#>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 190 (15, 16)
+ 13|     </style>
+ 14|     <div>
+ 15|         <script>#
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+Original: 118 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 191 (16, 0)
+ 14|     <div>
+ 15|         <script>
+ 16| #        (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 192 (16, 1)
+ 14|     <div>
+ 15|         <script>
+ 16|  #       (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 193 (16, 2)
+ 14|     <div>
+ 15|         <script>
+ 16|   #      (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 194 (16, 3)
+ 14|     <div>
+ 15|         <script>
+ 16|    #     (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 195 (16, 4)
+ 14|     <div>
+ 15|         <script>
+ 16|     #    (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 196 (16, 5)
+ 14|     <div>
+ 15|         <script>
+ 16|      #   (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 197 (16, 6)
+ 14|     <div>
+ 15|         <script>
+ 16|       #  (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 198 (16, 7)
+ 14|     <div>
+ 15|         <script>
+ 16|        # (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 199 (16, 8)
+ 14|     <div>
+ 15|         <script>
+ 16|         #(() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 13)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>#(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 200 (16, 9)
+ 14|     <div>
+ 15|         <script>
+ 16|         (#() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 119 (3, 14)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(#()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 201 (16, 10)
+ 14|     <div>
+ 15|         <script>
+ 16|         ((#) => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 120 (3, 15)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>((#)=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 202 (16, 11)
+ 14|     <div>
+ 15|         <script>
+ 16|         (()# => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 121 (3, 16)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()#=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 203 (16, 12)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() #=> {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 122 (3, 16)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()#=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 204 (16, 13)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() =#> {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 122 (3, 17)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=#>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 205 (16, 14)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() =># {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 123 (3, 18)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>#{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 206 (16, 15)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() => #{
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 124 (3, 18)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>#{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 207 (16, 16)
+ 14|     <div>
+ 15|         <script>
+ 16|         (() => {#
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+Original: 124 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 208 (17, 0)
+ 15|         <script>
+ 16|         (() => {
+ 17| #            for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 209 (17, 1)
+ 15|         <script>
+ 16|         (() => {
+ 17|  #           for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 210 (17, 2)
+ 15|         <script>
+ 16|         (() => {
+ 17|   #          for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 211 (17, 3)
+ 15|         <script>
+ 16|         (() => {
+ 17|    #         for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 212 (17, 4)
+ 15|         <script>
+ 16|         (() => {
+ 17|     #        for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 213 (17, 5)
+ 15|         <script>
+ 16|         (() => {
+ 17|      #       for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 214 (17, 6)
+ 15|         <script>
+ 16|         (() => {
+ 17|       #      for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 215 (17, 7)
+ 15|         <script>
+ 16|         (() => {
+ 17|        #     for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 216 (17, 8)
+ 15|         <script>
+ 16|         (() => {
+ 17|         #    for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 217 (17, 9)
+ 15|         <script>
+ 16|         (() => {
+ 17|          #   for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 218 (17, 10)
+ 15|         <script>
+ 16|         (() => {
+ 17|           #  for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 219 (17, 11)
+ 15|         <script>
+ 16|         (() => {
+ 17|            # for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 220 (17, 12)
+ 15|         <script>
+ 16|         (() => {
+ 17|             #for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 19)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{#for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 221 (17, 13)
+ 15|         <script>
+ 16|         (() => {
+ 17|             f#or (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 125 (3, 20)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{f#or(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 222 (17, 14)
+ 15|         <script>
+ 16|         (() => {
+ 17|             fo#r (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 126 (3, 21)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{fo#r(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 223 (17, 15)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for# (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 127 (3, 22)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for#(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 224 (17, 16)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for #(let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 128 (3, 22)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for#(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 225 (17, 17)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (#let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 128 (3, 23)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(#let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 226 (17, 18)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (l#et x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 129 (3, 24)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(l#et x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 227 (17, 19)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (le#t x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 130 (3, 25)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(le#t x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 228 (17, 20)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let# x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 131 (3, 26)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let# x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 229 (17, 21)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let #x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 132 (3, 27)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let #x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 230 (17, 22)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x# of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 133 (3, 28)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x# of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 231 (17, 23)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x #of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 134 (3, 29)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x #of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 232 (17, 24)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x o#f [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 135 (3, 30)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x o#f[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 233 (17, 25)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of# [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 136 (3, 31)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of#[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 234 (17, 26)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of #[1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 137 (3, 31)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of#[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 235 (17, 27)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [#1, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 137 (3, 32)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[#1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 236 (17, 28)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1#, 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 138 (3, 33)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1#,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 237 (17, 29)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1,# 2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 139 (3, 34)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,#2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 238 (17, 30)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, #2, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 140 (3, 34)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,#2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 239 (17, 31)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2#, 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 140 (3, 35)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2#,3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 240 (17, 32)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2,# 3])
+ 18|                 log(x)
+ 19|         })()
+Original: 141 (3, 36)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,#3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 241 (17, 33)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, #3])
+ 18|                 log(x)
+ 19|         })()
+Original: 142 (3, 36)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,#3])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 242 (17, 34)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3#])
+ 18|                 log(x)
+ 19|         })()
+Original: 142 (3, 37)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3#])log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 243 (17, 35)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3]#)
+ 18|                 log(x)
+ 19|         })()
+Original: 143 (3, 38)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3]#)log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 244 (17, 36)
+ 15|         <script>
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])#
+ 18|                 log(x)
+ 19|         })()
+Original: 144 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 245 (18, 0)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18| #                log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 246 (18, 1)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|  #               log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 247 (18, 2)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|   #              log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 248 (18, 3)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|    #             log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 249 (18, 4)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|     #            log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 250 (18, 5)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|      #           log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 251 (18, 6)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|       #          log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 252 (18, 7)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|        #         log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 253 (18, 8)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|         #        log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 254 (18, 9)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|          #       log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 255 (18, 10)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|           #      log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 256 (18, 11)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|            #     log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 257 (18, 12)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|             #    log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 258 (18, 13)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|              #   log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 259 (18, 14)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|               #  log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 260 (18, 15)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                # log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 261 (18, 16)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 #log(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 39)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])#log(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 262 (18, 17)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 l#og(x)
+ 19|         })()
+ 20|         </script>
+Original: 145 (3, 40)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])l#og(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 263 (18, 18)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 lo#g(x)
+ 19|         })()
+ 20|         </script>
+Original: 146 (3, 41)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])lo#g(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 264 (18, 19)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log#(x)
+ 19|         })()
+ 20|         </script>
+Original: 147 (3, 42)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log#(x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 265 (18, 20)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(#x)
+ 19|         })()
+ 20|         </script>
+Original: 148 (3, 43)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(#x)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 266 (18, 21)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x#)
+ 19|         })()
+ 20|         </script>
+Original: 149 (3, 44)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x#)})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 267 (18, 22)
+ 16|         (() => {
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)#
+ 19|         })()
+ 20|         </script>
+Original: 150 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 268 (19, 0)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19| #        })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 269 (19, 1)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|  #       })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 270 (19, 2)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|   #      })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 271 (19, 3)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|    #     })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 272 (19, 4)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|     #    })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 273 (19, 5)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|      #   })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 274 (19, 6)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|       #  })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 275 (19, 7)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|        # })()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 276 (19, 8)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         #})()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 45)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)#})()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 277 (19, 9)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         }#)()
+ 20|         </script>
+ 21|     </div>
+Original: 151 (3, 46)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)}#)()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 278 (19, 10)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })#()
+ 20|         </script>
+ 21|     </div>
+Original: 152 (3, 47)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})#()</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 279 (19, 11)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })(#)
+ 20|         </script>
+ 21|     </div>
+Original: 153 (3, 48)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})(#)</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 280 (19, 12)
+ 17|             for (let x of [1, 2, 3])
+ 18|                 log(x)
+ 19|         })()#
+ 20|         </script>
+ 21|     </div>
+Original: 154 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 281 (20, 0)
+ 18|                 log(x)
+ 19|         })()
+ 20| #        </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 282 (20, 1)
+ 18|                 log(x)
+ 19|         })()
+ 20|  #       </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 283 (20, 2)
+ 18|                 log(x)
+ 19|         })()
+ 20|   #      </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 284 (20, 3)
+ 18|                 log(x)
+ 19|         })()
+ 20|    #     </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 285 (20, 4)
+ 18|                 log(x)
+ 19|         })()
+ 20|     #    </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 286 (20, 5)
+ 18|                 log(x)
+ 19|         })()
+ 20|      #   </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 287 (20, 6)
+ 18|                 log(x)
+ 19|         })()
+ 20|       #  </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 288 (20, 7)
+ 18|                 log(x)
+ 19|         })()
+ 20|        # </script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 289 (20, 8)
+ 18|                 log(x)
+ 19|         })()
+ 20|         #</script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 49)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()#</script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 290 (20, 9)
+ 18|                 log(x)
+ 19|         })()
+ 20|         <#/script>
+ 21|     </div>
+ 22| </body>
+Original: 155 (3, 50)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()<#/script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 291 (20, 10)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </#script>
+ 21|     </div>
+ 22| </body>
+Original: 156 (3, 51)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</#script></div>
+  4| </body></html>
+  5| 
+
+Formatted: 292 (20, 11)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </s#cript>
+ 21|     </div>
+ 22| </body>
+Original: 157 (3, 52)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</s#cript></div>
+  4| </body></html>
+  5| 
+
+Formatted: 293 (20, 12)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </sc#ript>
+ 21|     </div>
+ 22| </body>
+Original: 158 (3, 53)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</sc#ript></div>
+  4| </body></html>
+  5| 
+
+Formatted: 294 (20, 13)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </scr#ipt>
+ 21|     </div>
+ 22| </body>
+Original: 159 (3, 54)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</scr#ipt></div>
+  4| </body></html>
+  5| 
+
+Formatted: 295 (20, 14)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </scri#pt>
+ 21|     </div>
+ 22| </body>
+Original: 160 (3, 55)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</scri#pt></div>
+  4| </body></html>
+  5| 
+
+Formatted: 296 (20, 15)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </scrip#t>
+ 21|     </div>
+ 22| </body>
+Original: 161 (3, 56)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</scrip#t></div>
+  4| </body></html>
+  5| 
+
+Formatted: 297 (20, 16)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </script#>
+ 21|     </div>
+ 22| </body>
+Original: 162 (3, 57)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script#></div>
+  4| </body></html>
+  5| 
+
+Formatted: 298 (20, 17)
+ 18|                 log(x)
+ 19|         })()
+ 20|         </script>#
+ 21|     </div>
+ 22| </body>
+Original: 163 (3, 58)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script>#</div>
+  4| </body></html>
+  5| 
+
+Formatted: 299 (21, 0)
+ 19|         })()
+ 20|         </script>
+ 21| #    </div>
+ 22| </body>
+ 23| </html>
+Original: 164 (3, 58)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script>#</div>
+  4| </body></html>
+  5| 
+
+Formatted: 300 (21, 1)
+ 19|         })()
+ 20|         </script>
+ 21|  #   </div>
+ 22| </body>
+ 23| </html>
+Original: 164 (3, 58)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script>#</div>
+  4| </body></html>
+  5| 
+
+Formatted: 301 (21, 2)
+ 19|         })()
+ 20|         </script>
+ 21|   #  </div>
+ 22| </body>
+ 23| </html>
+Original: 164 (3, 58)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script>#</div>
+  4| </body></html>
+  5| 
+
+Formatted: 302 (21, 3)
+ 19|         })()
+ 20|         </script>
+ 21|    # </div>
+ 22| </body>
+ 23| </html>
+Original: 164 (3, 58)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script>#</div>
+  4| </body></html>
+  5| 
+
+Formatted: 303 (21, 4)
+ 19|         })()
+ 20|         </script>
+ 21|     #</div>
+ 22| </body>
+ 23| </html>
+Original: 164 (3, 58)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script>#</div>
+  4| </body></html>
+  5| 
+
+Formatted: 304 (21, 5)
+ 19|         })()
+ 20|         </script>
+ 21|     <#/div>
+ 22| </body>
+ 23| </html>
+Original: 164 (3, 59)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script><#/div>
+  4| </body></html>
+  5| 
+
+Formatted: 305 (21, 6)
+ 19|         })()
+ 20|         </script>
+ 21|     </#div>
+ 22| </body>
+ 23| </html>
+Original: 165 (3, 60)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></#div>
+  4| </body></html>
+  5| 
+
+Formatted: 306 (21, 7)
+ 19|         })()
+ 20|         </script>
+ 21|     </d#iv>
+ 22| </body>
+ 23| </html>
+Original: 166 (3, 61)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></d#iv>
+  4| </body></html>
+  5| 
+
+Formatted: 307 (21, 8)
+ 19|         })()
+ 20|         </script>
+ 21|     </di#v>
+ 22| </body>
+ 23| </html>
+Original: 167 (3, 62)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></di#v>
+  4| </body></html>
+  5| 
+
+Formatted: 308 (21, 9)
+ 19|         })()
+ 20|         </script>
+ 21|     </div#>
+ 22| </body>
+ 23| </html>
+Original: 168 (3, 63)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div#>
+  4| </body></html>
+  5| 
+
+Formatted: 309 (21, 10)
+ 19|         })()
+ 20|         </script>
+ 21|     </div>#
+ 22| </body>
+ 23| </html>
+Original: 169 (3, 64)
+  1| <head><title>Test Page</title></head>
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>#
+  4| </body></html>
+  5| 
+
+Formatted: 310 (22, 0)
+ 20|         </script>
+ 21|     </div>
+ 22| #</body>
+ 23| </html>
+ 24| 
+Original: 170 (4, 0)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| #</body></html>
+  5| 
+
+Formatted: 311 (22, 1)
+ 20|         </script>
+ 21|     </div>
+ 22| <#/body>
+ 23| </html>
+ 24| 
+Original: 171 (4, 1)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| <#/body></html>
+  5| 
+
+Formatted: 312 (22, 2)
+ 20|         </script>
+ 21|     </div>
+ 22| </#body>
+ 23| </html>
+ 24| 
+Original: 172 (4, 2)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </#body></html>
+  5| 
+
+Formatted: 313 (22, 3)
+ 20|         </script>
+ 21|     </div>
+ 22| </b#ody>
+ 23| </html>
+ 24| 
+Original: 173 (4, 3)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </b#ody></html>
+  5| 
+
+Formatted: 314 (22, 4)
+ 20|         </script>
+ 21|     </div>
+ 22| </bo#dy>
+ 23| </html>
+ 24| 
+Original: 174 (4, 4)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </bo#dy></html>
+  5| 
+
+Formatted: 315 (22, 5)
+ 20|         </script>
+ 21|     </div>
+ 22| </bod#y>
+ 23| </html>
+ 24| 
+Original: 175 (4, 5)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </bod#y></html>
+  5| 
+
+Formatted: 316 (22, 6)
+ 20|         </script>
+ 21|     </div>
+ 22| </body#>
+ 23| </html>
+ 24| 
+Original: 176 (4, 6)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body#></html>
+  5| 
+
+Formatted: 317 (22, 7)
+ 20|         </script>
+ 21|     </div>
+ 22| </body>#
+ 23| </html>
+ 24| 
+Original: 177 (4, 7)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body>#</html>
+  5| 
+
+Formatted: 318 (23, 0)
+ 21|     </div>
+ 22| </body>
+ 23| #</html>
+ 24| 
+Original: 178 (4, 7)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body>#</html>
+  5| 
+
+Formatted: 319 (23, 1)
+ 21|     </div>
+ 22| </body>
+ 23| <#/html>
+ 24| 
+Original: 178 (4, 8)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body><#/html>
+  5| 
+
+Formatted: 320 (23, 2)
+ 21|     </div>
+ 22| </body>
+ 23| </#html>
+ 24| 
+Original: 179 (4, 9)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></#html>
+  5| 
+
+Formatted: 321 (23, 3)
+ 21|     </div>
+ 22| </body>
+ 23| </h#tml>
+ 24| 
+Original: 180 (4, 10)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></h#tml>
+  5| 
+
+Formatted: 322 (23, 4)
+ 21|     </div>
+ 22| </body>
+ 23| </ht#ml>
+ 24| 
+Original: 181 (4, 11)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></ht#ml>
+  5| 
+
+Formatted: 323 (23, 5)
+ 21|     </div>
+ 22| </body>
+ 23| </htm#l>
+ 24| 
+Original: 182 (4, 12)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></htm#l>
+  5| 
+
+Formatted: 324 (23, 6)
+ 21|     </div>
+ 22| </body>
+ 23| </html#>
+ 24| 
+Original: 183 (4, 13)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html#>
+  5| 
+
+Formatted: 325 (23, 7)
+ 21|     </div>
+ 22| </body>
+ 23| </html>#
+ 24| 
+Original: 184 (4, 14)
+  2| <body><style>a{color:red}body,*{color:blue}</style>
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>#
+  5| 
+
+Formatted: 326 (24, 0)
+ 22| </body>
+ 23| </html>
+ 24| #
+Original: 185 (5, 0)
+  3| <div><script>(()=>{for(let x of[1,2,3])log(x)})()</script></div>
+  4| </body></html>
+  5| #
+
+
diff --git a/LayoutTests/inspector/formatting/source-map-html-1.html b/LayoutTests/inspector/formatting/source-map-html-1.html
new file mode 100644 (file)
index 0000000..25e4dcc
--- /dev/null
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
+<script src="resources/source-map-utilities.js"></script>
+<script>
+function test()
+{
+    let suite = InspectorTest.createAsyncSuite("SourceMaps.HTML");
+    addSourceMapTest(suite, "text/html", "1", "resources/html-source-map-tests/1.html");
+    suite.runTestCasesAndFinish();
+}
+</script>
+</head>
+<body onload="runTest()">
+<p>Test HTML SourceMap.</p>
+</body>
+</html>
diff --git a/LayoutTests/inspector/formatting/source-map-html-2-expected.txt b/LayoutTests/inspector/formatting/source-map-html-2-expected.txt
new file mode 100644 (file)
index 0000000..dc6e3b1
--- /dev/null
@@ -0,0 +1,1993 @@
+Test HTML SourceMap.
+
+
+== Running test suite: SourceMaps.HTML
+-- Running test case: SourceMaps.HTML.2
+Original Content Length
+Formatted Content Length
+---- Original to Formatted ----
+Original: 0 (0, 1)
+  0| <#body>
+  1| <!--
+  2| Test
+Formatted: 0 (0, 1)
+  0| <#body>
+  1|     <!--
+  2|     Test
+
+Original: 1 (0, 2)
+  0| <b#ody>
+  1| <!--
+  2| Test
+Formatted: 1 (0, 2)
+  0| <b#ody>
+  1|     <!--
+  2|     Test
+
+Original: 2 (0, 3)
+  0| <bo#dy>
+  1| <!--
+  2| Test
+Formatted: 2 (0, 3)
+  0| <bo#dy>
+  1|     <!--
+  2|     Test
+
+Original: 3 (0, 4)
+  0| <bod#y>
+  1| <!--
+  2| Test
+Formatted: 3 (0, 4)
+  0| <bod#y>
+  1|     <!--
+  2|     Test
+
+Original: 4 (0, 5)
+  0| <body#>
+  1| <!--
+  2| Test
+Formatted: 4 (0, 5)
+  0| <body#>
+  1|     <!--
+  2|     Test
+
+Original: 5 (0, 6)
+  0| <body>#
+  1| <!--
+  2| Test
+Formatted: 5 (0, 6)
+  0| <body>#
+  1|     <!--
+  2|     Test
+
+Original: 6 (1, 0)
+  0| <body>
+  1| #<!--
+  2| Test
+  3| -->
+Formatted: 6 (1, 4)
+  0| <body>
+  1|     #<!--
+  2|     Test
+  3|     -->
+
+Original: 7 (1, 1)
+  0| <body>
+  1| <#!--
+  2| Test
+  3| -->
+Formatted: 11 (1, 5)
+  0| <body>
+  1|     <#!--
+  2|     Test
+  3|     -->
+
+Original: 8 (1, 2)
+  0| <body>
+  1| <!#--
+  2| Test
+  3| -->
+Formatted: 12 (1, 6)
+  0| <body>
+  1|     <!#--
+  2|     Test
+  3|     -->
+
+Original: 9 (1, 3)
+  0| <body>
+  1| <!-#-
+  2| Test
+  3| -->
+Formatted: 13 (1, 7)
+  0| <body>
+  1|     <!-#-
+  2|     Test
+  3|     -->
+
+Original: 10 (1, 4)
+  0| <body>
+  1| <!--#
+  2| Test
+  3| -->
+Formatted: 14 (1, 8)
+  0| <body>
+  1|     <!--#
+  2|     Test
+  3|     -->
+
+Original: 11 (2, 0)
+  0| <body>
+  1| <!--
+  2| #Test
+  3| -->
+  4| <p
+Formatted: 15 (2, 4)
+  0| <body>
+  1|     <!--
+  2|     #Test
+  3|     -->
+  4|     <p attr attr=value attr="
+
+Original: 12 (2, 1)
+  0| <body>
+  1| <!--
+  2| T#est
+  3| -->
+  4| <p
+Formatted: 20 (2, 5)
+  0| <body>
+  1|     <!--
+  2|     T#est
+  3|     -->
+  4|     <p attr attr=value attr="
+
+Original: 13 (2, 2)
+  0| <body>
+  1| <!--
+  2| Te#st
+  3| -->
+  4| <p
+Formatted: 21 (2, 6)
+  0| <body>
+  1|     <!--
+  2|     Te#st
+  3|     -->
+  4|     <p attr attr=value attr="
+
+Original: 14 (2, 3)
+  0| <body>
+  1| <!--
+  2| Tes#t
+  3| -->
+  4| <p
+Formatted: 22 (2, 7)
+  0| <body>
+  1|     <!--
+  2|     Tes#t
+  3|     -->
+  4|     <p attr attr=value attr="
+
+Original: 15 (2, 4)
+  0| <body>
+  1| <!--
+  2| Test#
+  3| -->
+  4| <p
+Formatted: 23 (2, 8)
+  0| <body>
+  1|     <!--
+  2|     Test#
+  3|     -->
+  4|     <p attr attr=value attr="
+
+Original: 16 (3, 0)
+  1| <!--
+  2| Test
+  3| #-->
+  4| <p
+  5| attr
+Formatted: 24 (3, 4)
+  1|     <!--
+  2|     Test
+  3|     #-->
+  4|     <p attr attr=value attr="
+  5|     value" attr='
+
+Original: 17 (3, 1)
+  1| <!--
+  2| Test
+  3| -#->
+  4| <p
+  5| attr
+Formatted: 29 (3, 5)
+  1|     <!--
+  2|     Test
+  3|     -#->
+  4|     <p attr attr=value attr="
+  5|     value" attr='
+
+Original: 18 (3, 2)
+  1| <!--
+  2| Test
+  3| --#>
+  4| <p
+  5| attr
+Formatted: 30 (3, 6)
+  1|     <!--
+  2|     Test
+  3|     --#>
+  4|     <p attr attr=value attr="
+  5|     value" attr='
+
+Original: 19 (3, 3)
+  1| <!--
+  2| Test
+  3| -->#
+  4| <p
+  5| attr
+Formatted: 31 (3, 7)
+  1|     <!--
+  2|     Test
+  3|     -->#
+  4|     <p attr attr=value attr="
+  5|     value" attr='
+
+Original: 20 (4, 0)
+  2| Test
+  3| -->
+  4| #<p
+  5| attr
+  6| attr=value
+Formatted: 32 (4, 4)
+  2|     Test
+  3|     -->
+  4|     #<p attr attr=value attr="
+  5|     value" attr='
+  6|     value'>
+
+Original: 21 (4, 1)
+  2| Test
+  3| -->
+  4| <#p
+  5| attr
+  6| attr=value
+Formatted: 37 (4, 5)
+  2|     Test
+  3|     -->
+  4|     <#p attr attr=value attr="
+  5|     value" attr='
+  6|     value'>
+
+Original: 22 (4, 2)
+  2| Test
+  3| -->
+  4| <p#
+  5| attr
+  6| attr=value
+Formatted: 38 (4, 6)
+  2|     Test
+  3|     -->
+  4|     <p# attr attr=value attr="
+  5|     value" attr='
+  6|     value'>
+
+Original: 23 (5, 0)
+  3| -->
+  4| <p
+  5| #attr
+  6| attr=value
+  7| attr="
+Formatted: 39 (4, 7)
+  2|     Test
+  3|     -->
+  4|     <p #attr attr=value attr="
+  5|     value" attr='
+  6|     value'>
+
+Original: 24 (5, 1)
+  3| -->
+  4| <p
+  5| a#ttr
+  6| attr=value
+  7| attr="
+Formatted: 40 (4, 8)
+  2|     Test
+  3|     -->
+  4|     <p a#ttr attr=value attr="
+  5|     value" attr='
+  6|     value'>
+
+Original: 25 (5, 2)
+  3| -->
+  4| <p
+  5| at#tr
+  6| attr=value
+  7| attr="
+Formatted: 41 (4, 9)
+  2|     Test
+  3|     -->
+  4|     <p at#tr attr=value attr="
+  5|     value" attr='
+  6|     value'>
+
+Original: 26 (5, 3)
+  3| -->
+  4| <p
+  5| att#r
+  6| attr=value
+  7| attr="
+Formatted: 42 (4, 10)
+  2|     Test
+  3|     -->
+  4|     <p att#r attr=value attr="
+  5|     value" attr='
+  6|     value'>
+
+Original: 27 (5, 4)
+  3| -->
+  4| <p
+  5| attr#
+  6| attr=value
+  7| attr="