fix: onCloseTagStart event for text mode tags (#117)

DylanPiercey · web-flow · commit 8bd3c4057d48 · 2022-06-27T15:11:49.000-07:00
diff --git a/.changeset/late-cougars-attend.md b/.changeset/late-cougars-attend.md
@@ -0,0 +1,5 @@
+---
+"htmljs-parser": patch
+---
+
+Fix issue with onCloseTagStart not called for text mode tags (eg style, script, textarea & html-comment).
diff --git a/src/__tests__/fixtures/cdata/__snapshots__/cdata.expected.txt b/src/__tests__/fixtures/cdata/__snapshots__/cdata.expected.txt
@@ -1,6 +1,7 @@
 1╭─ <html-comment><![CDATA[[if lt IE 9]><div><![endif]]]></html-comment>
- │  ││           ││        │                               │           ╰─ closeTagEnd(html-comment)
- │  ││           ││        │                               ╰─ closeTagName "html-comment"
+ │  ││           ││        │                             │ │           ╰─ closeTagEnd(html-comment)
+ │  ││           ││        │                             │ ╰─ closeTagName "html-comment"
+ │  ││           ││        │                             ╰─ closeTagStart "</"
  │  ││           ││        ╰─ cdata.value "[if lt IE 9]><div><![endif]"
  │  ││           │╰─ cdata "<![CDATA[[if lt IE 9]><div><![endif]]]>"
  │  ││           ╰─ openTagEnd
diff --git a/src/__tests__/fixtures/html-comment-tag/__snapshots__/html-comment-tag.expected.txt b/src/__tests__/fixtures/html-comment-tag/__snapshots__/html-comment-tag.expected.txt
@@ -7,8 +7,9 @@
  │  │ ╰─ comment "<!--123-->"
  ╰─ ╰─ text "\n  "
 3╭─   <html-comment>abc</html-comment>
- │  │ ││           ││    │           ╰─ closeTagEnd(html-comment)
- │  │ ││           ││    ╰─ closeTagName "html-comment"
+ │  │ ││           ││  │ │           ╰─ closeTagEnd(html-comment)
+ │  │ ││           ││  │ ╰─ closeTagName "html-comment"
+ │  │ ││           ││  ╰─ closeTagStart "</"
  │  │ ││           │╰─ text "abc"
  │  │ ││           ╰─ openTagEnd
  │  │ │╰─ tagName "html-comment"
@@ -19,8 +20,9 @@
  │  │ ╰─ comment "<!--[if lt IE 9]><script src=\"...\"></script><![endif]-->"
  ╰─ ╰─ text "\n  "
 5╭─   <html-comment>[if lt IE 9]><script src="..."></script><![endif]</html-comment>
- │  │ ││           ││                                                  │           ╰─ closeTagEnd(html-comment)
- │  │ ││           ││                                                  ╰─ closeTagName "html-comment"
+ │  │ ││           ││                                                │ │           ╰─ closeTagEnd(html-comment)
+ │  │ ││           ││                                                │ ╰─ closeTagName "html-comment"
+ │  │ ││           ││                                                ╰─ closeTagStart "</"
  │  │ ││           │╰─ text "[if lt IE 9]><script src=\"...\"></script><![endif]"
  │  │ ││           ╰─ openTagEnd
  │  │ │╰─ tagName "html-comment"
diff --git a/src/__tests__/fixtures/parsed-text-placeholder-in-template-literal-string/__snapshots__/parsed-text-placeholder-in-template-literal-string.expected.txt b/src/__tests__/fixtures/parsed-text-placeholder-in-template-literal-string/__snapshots__/parsed-text-placeholder-in-template-literal-string.expected.txt
@@ -9,6 +9,7 @@
 5├─         ${bar}
 6├─     */
 7╭─ </script>
- │    │     ╰─ closeTagEnd(script)
- ╰─   ╰─ closeTagName "script"
+ │  │ │     ╰─ closeTagEnd(script)
+ │  │ ╰─ closeTagName "script"
+ ╰─ ╰─ closeTagStart "</"
 8╰─ 
diff --git a/src/__tests__/fixtures/parsed-text-style-tag/__snapshots__/parsed-text-style-tag.expected.txt b/src/__tests__/fixtures/parsed-text-style-tag/__snapshots__/parsed-text-style-tag.expected.txt
@@ -1,6 +1,7 @@
 1╭─ <style>/* block comment within <style> */"string within \"<style>\""'string within \'<style>\''</style>
- │  ││    ││                                                                                         │    ╰─ closeTagEnd(style)
- │  ││    ││                                                                                         ╰─ closeTagName "style"
+ │  ││    ││                                                                                       │ │    ╰─ closeTagEnd(style)
+ │  ││    ││                                                                                       │ ╰─ closeTagName "style"
+ │  ││    ││                                                                                       ╰─ closeTagStart "</"
  │  ││    │╰─ text "/* block comment within <style> */\"string within \\\"<style>\\\"\"'string within \\'<style>\\''"
  │  ││    ╰─ openTagEnd
  │  │╰─ tagName "style"
diff --git a/src/__tests__/fixtures/placeholder-body-multi-line-js-comment/__snapshots__/placeholder-body-multi-line-js-comment.expected.txt b/src/__tests__/fixtures/placeholder-body-multi-line-js-comment/__snapshots__/placeholder-body-multi-line-js-comment.expected.txt
@@ -1,6 +1,7 @@
 1╭─ <script>/* Copyright $!{date} */</script>
- │  ││     ││                         │     ╰─ closeTagEnd(script)
- │  ││     ││                         ╰─ closeTagName "script"
+ │  ││     ││                       │ │     ╰─ closeTagEnd(script)
+ │  ││     ││                       │ ╰─ closeTagName "script"
+ │  ││     ││                       ╰─ closeTagStart "</"
  │  ││     │╰─ text "/* Copyright $!{date} */"
  │  ││     ╰─ openTagEnd
  │  │╰─ tagName "script"
diff --git a/src/__tests__/fixtures/placeholder-body-single-line-js-comment/__snapshots__/placeholder-body-single-line-js-comment.expected.txt b/src/__tests__/fixtures/placeholder-body-single-line-js-comment/__snapshots__/placeholder-body-single-line-js-comment.expected.txt
@@ -4,5 +4,6 @@
  │  │╰─ tagName "script"
  ╰─ ╰─ openTagStart
 2╭─ </script>
- │    │     ╰─ closeTagEnd(script)
- ╰─   ╰─ closeTagName "script"
+ │  │ │     ╰─ closeTagEnd(script)
+ │  │ ╰─ closeTagName "script"
+ ╰─ ╰─ closeTagStart "</"
diff --git a/src/__tests__/fixtures/placeholder-within-script-tag/__snapshots__/placeholder-within-script-tag.expected.txt b/src/__tests__/fixtures/placeholder-within-script-tag/__snapshots__/placeholder-within-script-tag.expected.txt
@@ -1,6 +1,7 @@
 1╭─ <script>Hello ${xyz}!</script>
- │  ││     ││     │ │   │  │     ╰─ closeTagEnd(script)
- │  ││     ││     │ │   │  ╰─ closeTagName "script"
+ │  ││     ││     │ │   ││ │     ╰─ closeTagEnd(script)
+ │  ││     ││     │ │   ││ ╰─ closeTagName "script"
+ │  ││     ││     │ │   │╰─ closeTagStart "</"
  │  ││     ││     │ │   ╰─ text
  │  ││     ││     │ ╰─ placeholder:escape.value "xyz"
  │  ││     ││     ╰─ placeholder:escape "${xyz}"
diff --git a/src/__tests__/fixtures/placeholder-within-script-within-string/__snapshots__/placeholder-within-script-within-string.expected.txt b/src/__tests__/fixtures/placeholder-within-script-within-string/__snapshots__/placeholder-within-script-within-string.expected.txt
@@ -1,6 +1,7 @@
 1╭─ <script>alert("Hello ${xyz}!")</script>
- │  ││     ││            │ │   │    │     ╰─ closeTagEnd(script)
- │  ││     ││            │ │   │    ╰─ closeTagName "script"
+ │  ││     ││            │ │   │  │ │     ╰─ closeTagEnd(script)
+ │  ││     ││            │ │   │  │ ╰─ closeTagName "script"
+ │  ││     ││            │ │   │  ╰─ closeTagStart "</"
  │  ││     ││            │ │   ╰─ text "!\")"
  │  ││     ││            │ ╰─ placeholder:escape.value "xyz"
  │  ││     ││            ╰─ placeholder:escape "${xyz}"
diff --git a/src/__tests__/fixtures/script-escaped-placeholder/__snapshots__/script-escaped-placeholder.expected.txt b/src/__tests__/fixtures/script-escaped-placeholder/__snapshots__/script-escaped-placeholder.expected.txt
@@ -11,4 +11,5 @@
 4╭─ </script>
  │  │ │     ╰─ closeTagEnd(script)
  │  │ ╰─ closeTagName "script"
- ╰─ ╰─ text "\n"
+ │  ├─ text "\n"
+ ╰─ ╰─ closeTagStart "</"
diff --git a/src/__tests__/fixtures/script-single-line-comment/__snapshots__/script-single-line-comment.expected.txt b/src/__tests__/fixtures/script-single-line-comment/__snapshots__/script-single-line-comment.expected.txt
@@ -1,6 +1,7 @@
 1╭─ <script>// this is a comment</script>
- │  ││     ││                     │     ╰─ closeTagEnd(script)
- │  ││     ││                     ╰─ closeTagName "script"
+ │  ││     ││                   │ │     ╰─ closeTagEnd(script)
+ │  ││     ││                   │ ╰─ closeTagName "script"
+ │  ││     ││                   ╰─ closeTagStart "</"
  │  ││     │╰─ text "// this is a comment"
  │  ││     ╰─ openTagEnd
  │  │╰─ tagName "script"
diff --git a/src/__tests__/fixtures/script-tag-entities/__snapshots__/script-tag-entities.expected.txt b/src/__tests__/fixtures/script-tag-entities/__snapshots__/script-tag-entities.expected.txt
@@ -1,6 +1,7 @@
 1╭─ <script>console.log('<div>Hello ${input.name}</div>');</script>
- │  ││     ││                       │ │          │          │     ╰─ closeTagEnd(script)
- │  ││     ││                       │ │          │          ╰─ closeTagName "script"
+ │  ││     ││                       │ │          │        │ │     ╰─ closeTagEnd(script)
+ │  ││     ││                       │ │          │        │ ╰─ closeTagName "script"
+ │  ││     ││                       │ │          │        ╰─ closeTagStart "</"
  │  ││     ││                       │ │          ╰─ text "</div>');"
  │  ││     ││                       │ ╰─ placeholder:escape.value "input.name"
  │  ││     ││                       ╰─ placeholder:escape "${input.name}"
diff --git a/src/__tests__/fixtures/script/__snapshots__/script.expected.txt b/src/__tests__/fixtures/script/__snapshots__/script.expected.txt
@@ -4,5 +4,6 @@
  │  │╰─ tagName "script"
  ╰─ ╰─ openTagStart
 2╭─ /* block comment within <script> */"string within \"<script>\""'string within \'<script>\''</script>
- │                                                                                               │     ╰─ closeTagEnd(script)
- ╰─                                                                                              ╰─ closeTagName "script"
+ │                                                                                             │ │     ╰─ closeTagEnd(script)
+ │                                                                                             │ ╰─ closeTagName "script"
+ ╰─                                                                                            ╰─ closeTagStart "</"
diff --git a/src/states/CLOSE_TAG.ts b/src/states/CLOSE_TAG.ts
@@ -63,6 +63,10 @@ export function checkForClosingTag(parser: Parser) {
 
   if (match) {
     parser.endText();
+    parser.options.onCloseTagStart?.({
+      start: curPos - 1,
+      end: curPos + 1,
+    });
 
     if (
       ensureExpectedCloseTag(parser, {

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"htmljs-parser": patch
 +---
++
 +Fix issue with onCloseTagStart not called for text mode tags (eg style, script, textarea & html-comment).