Fix bug with bindings inside of <title> elements (#2459)

lit · Jan 27, 2022 · 23df9d4 · 23df9d4
1 parent d26f109
commit 23df9d4
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 1 deletion.
diff --git a/.changeset/eight-falcons-rhyme.md b/.changeset/eight-falcons-rhyme.md
@@ -0,0 +1,6 @@
+---
+'lit-html': patch
+'lit': patch
+---
+
+Fix bindings inside of <title> elements
diff --git a/packages/lit-html/src/lit-html.ts b/packages/lit-html/src/lit-html.ts
@@ -235,7 +235,7 @@ const doubleQuoteAttrEndRegex = /"/g;
  * Comments are not parsed within raw text elements, so we need to search their
  * text content for marker strings.
  */
-const rawTextElement = /^(?:script|style|textarea)$/i;
+const rawTextElement = /^(?:script|style|textarea|title)$/i;
 
 /** TemplateResult types */
 const HTML_RESULT = 1;

diff --git a/packages/lit-html/src/test/lit-html_test.ts b/packages/lit-html/src/test/lit-html_test.ts
@@ -207,6 +207,16 @@ suite('lit-html', () => {
       assertRender(html`<a>${'foo'}</a>${'bar'}`, '<a>foo</a>bar');
     });
 
+    test('text in raw text elements', () => {
+      assertRender(
+        html`<script type="foo">${'A'}</script>`,
+        '<script type="foo">A</script>'
+      );
+      assertRender(html`<style>${'A'}</style>`, '<style>A</style>');
+      assertRender(html`<title>${'A'}</title>`, '<title>A</title>');
+      assertRender(html`<textarea>${'A'}</textarea>`, '<textarea>A</textarea>');
+    });
+
     test('text in raw text element after <', () => {
       // It doesn't matter much what marker we use in <script>, <style> and
       // <textarea> since comments aren't parsed and we have to search the text