From cfcc295261f463c74d80fcb9863cb4bdd7e673b9 Mon Sep 17 00:00:00 2001
From: James Wragg <me@jameswragg.com>
Date: Fri, 25 Nov 2022 22:52:06 +0000
Subject: [PATCH] fix(useStyleTag): allow multiline CSS (#2476)

---
 packages/core/useStyleTag/demo.vue | 7 ++++++-
 packages/core/useStyleTag/index.ts | 2 +-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/core/useStyleTag/demo.vue b/packages/core/useStyleTag/demo.vue
index a7ef99d159f..6727ec9a2f7 100644
--- a/packages/core/useStyleTag/demo.vue
+++ b/packages/core/useStyleTag/demo.vue
@@ -1,7 +1,12 @@
 <script setup lang="ts">
 import { useStyleTag } from '@vueuse/core'
 
-const { id, css, load, unload, isLoaded } = useStyleTag('.demo { background: #ad4c2e50 }')
+const customCSS = `
+.demo { background: #ad4c2e50; }
+.demo textarea { background: lightyellow; }
+`.trim()
+
+const { id, css, load, unload, isLoaded } = useStyleTag(customCSS)
 </script>
 
 <template>
diff --git a/packages/core/useStyleTag/index.ts b/packages/core/useStyleTag/index.ts
index 5bf04d330fa..d4887c82828 100644
--- a/packages/core/useStyleTag/index.ts
+++ b/packages/core/useStyleTag/index.ts
@@ -87,7 +87,7 @@ export function useStyleTag(
     stop = watch(
       cssRef,
       (value) => {
-        el.innerText = value
+        el.textContent = value
       },
       { immediate: true },
     )