diff --git a/.changeset/empty-trains-grin.md b/.changeset/empty-trains-grin.md new file mode 100644 index 00000000..c2f7a611 --- /dev/null +++ b/.changeset/empty-trains-grin.md @@ -0,0 +1,5 @@ +--- +"htmljs-parser": patch +--- + +Support JS line comments inside the open tag (previously just block comments could be used). diff --git a/.changeset/gold-radios-eat.md b/.changeset/gold-radios-eat.md new file mode 100644 index 00000000..0724989a --- /dev/null +++ b/.changeset/gold-radios-eat.md @@ -0,0 +1,5 @@ +--- +"htmljs-parser": patch +--- + +Support JS style comments in HTML bodies (previously allowed in parsed text and concise mode). diff --git a/src/__tests__/fixtures/comments-within-open-tag/__snapshots__/comments-within-open-tag.expected.txt b/src/__tests__/fixtures/comments-within-open-tag/__snapshots__/comments-within-open-tag.expected.txt index 0287fa5d..0c89d8d0 100644 --- a/src/__tests__/fixtures/comments-within-open-tag/__snapshots__/comments-within-open-tag.expected.txt +++ b/src/__tests__/fixtures/comments-within-open-tag/__snapshots__/comments-within-open-tag.expected.txt @@ -10,4 +10,19 @@ │ ││ │ ╰─ attrValue "=\"bar\"" │ ││ ╰─ attrName "foo" │ │╰─ tagName "div" - ╰─ ╰─ openTagStart \ No newline at end of file + ╰─ ╰─ openTagStart +2╭─
+ │ ││ │ ╰─ closeTagEnd(div) + │ ││ ╰─ closeTagName "div" + │ │╰─ closeTagStart " \ No newline at end of file +
+
\ No newline at end of file diff --git a/src/__tests__/fixtures/comments-within-tag-body/__snapshots__/comments-within-tag-body.expected.txt b/src/__tests__/fixtures/comments-within-tag-body/__snapshots__/comments-within-tag-body.expected.txt new file mode 100644 index 00000000..6e509e61 --- /dev/null +++ b/src/__tests__/fixtures/comments-within-tag-body/__snapshots__/comments-within-tag-body.expected.txt @@ -0,0 +1,24 @@ +1╭─
+ │ ││ ╰─ openTagEnd + │ │╰─ tagName "div" + ╰─ ╰─ openTagStart +2╭─ // This is a comment + │ │ │ ╰─ comment.value " This is a comment" + │ │ ╰─ comment "// This is a comment" + ╰─ ╰─ text "\n " +3╭─ This is some real text + ╰─ ╰─ text "\n This is some real text\n " +4╭─ /* But this is a comment */ + │ │ ╰─ comment.value " But this is a comment " + ╰─ ╰─ comment "/* But this is a comment */" +5╭─ And this is more text + ╰─ ╰─ text "\n And this is more text\n " +6╭─ + │ │ ╰─ comment.value " and this is a comment " + ╰─ ╰─ comment "" +7╭─
+ │ │ │ ╰─ closeTagEnd(div) + │ │ ╰─ closeTagName "div" + │ ├─ text "\n" + ╰─ ╰─ closeTagStart " + // This is a comment + This is some real text + /* But this is a comment */ + And this is more text + + diff --git a/src/states/HTML_CONTENT.ts b/src/states/HTML_CONTENT.ts index c5f9cc58..a982d41e 100644 --- a/src/states/HTML_CONTENT.ts +++ b/src/states/HTML_CONTENT.ts @@ -94,6 +94,23 @@ export const HTML_CONTENT: StateDefinition = { this.endText(); this.enterState(STATE.INLINE_SCRIPT); this.pos++; // skip space + } else if (code === CODE.FORWARD_SLASH) { + // Check next character to see if we are in a comment + switch (this.lookAtCharCodeAhead(1)) { + case CODE.FORWARD_SLASH: + this.endText(); + this.enterState(STATE.JS_COMMENT_LINE); + this.pos++; // skip / + break; + case CODE.ASTERISK: + this.endText(); + this.enterState(STATE.JS_COMMENT_BLOCK); + this.pos++; // skip * + break; + default: + this.startText(); + break; + } } else if (!STATE.checkForPlaceholder(this, code)) { this.startText(); } @@ -115,7 +132,31 @@ export const HTML_CONTENT: StateDefinition = { eof: htmlEOF, - return() {}, + return(child) { + switch (child.state) { + case STATE.JS_COMMENT_LINE: + this.options.onComment?.({ + start: child.start, + end: child.end, + value: { + start: child.start + 2, // strip // + end: child.end, + }, + }); + break; + case STATE.JS_COMMENT_BLOCK: { + this.options.onComment?.({ + start: child.start, + end: child.end, + value: { + start: child.start + 2, // strip /* + end: child.end - 2, // strip */, + }, + }); + break; + } + } + }, }; function isBeginningOfLine(parser: Parser) { diff --git a/src/states/OPEN_TAG.ts b/src/states/OPEN_TAG.ts index 35bc5cc3..34048783 100644 --- a/src/states/OPEN_TAG.ts +++ b/src/states/OPEN_TAG.ts @@ -273,14 +273,18 @@ export const OPEN_TAG: StateDefinition = { ); } - if ( - code === CODE.FORWARD_SLASH && - this.lookAtCharCodeAhead(1) === CODE.ASTERISK - ) { - // Skip over code inside a JavaScript block comment - this.enterState(STATE.JS_COMMENT_BLOCK); - this.pos++; // skip * - return; + if (code === CODE.FORWARD_SLASH) { + // Check next character to see if we are in a comment + switch (this.lookAtCharCodeAhead(1)) { + case CODE.FORWARD_SLASH: + this.enterState(STATE.JS_COMMENT_LINE); + this.pos++; // skip / + return; + case CODE.ASTERISK: + this.enterState(STATE.JS_COMMENT_BLOCK); + this.pos++; // skip * + return; + } } if (isWhitespaceCode(code)) {