From 414fbbd6413c915a10701fb82cd882547ee55f76 Mon Sep 17 00:00:00 2001
From: Saya <chu121su12@gmail.com>
Date: Sat, 8 Oct 2022 06:41:13 +0800
Subject: [PATCH] feat(runtime): allow to configure `un-cloak`

---
 packages/runtime/src/index.ts | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/packages/runtime/src/index.ts b/packages/runtime/src/index.ts
index eda8122e6a..86803f5745 100644
--- a/packages/runtime/src/index.ts
+++ b/packages/runtime/src/index.ts
@@ -12,6 +12,11 @@ export interface RuntimeOptions {
    * @default false
    */
   autoPrefix?: boolean
+  /**
+   * Attribute to use as cloaking
+   * @default 'un-cloak'
+   */
+  cloakAttribute?: string
   /**
    * Callback to modify config
    */
@@ -88,6 +93,7 @@ export default function init(inlineConfig: RuntimeOptions = {}) {
   const config = window.__unocss || {}
   const runtime = config?.runtime
   const defaultConfig = Object.assign(inlineConfig.defaults || {}, runtime)
+  const cloakAttribute = defaultConfig.cloakAttribute ?? 'un-cloak'
   if (runtime?.autoPrefix) {
     let postprocess = defaultConfig.postprocess
     if (!postprocess)
@@ -124,10 +130,10 @@ export default function init(inlineConfig: RuntimeOptions = {}) {
     if (node.nodeType !== 1)
       return
     const el = node as Element
-    if (el.hasAttribute('un-cloak'))
-      el.removeAttribute('un-cloak')
-    el.querySelectorAll('[un-cloak]').forEach((n) => {
-      n.removeAttribute('un-cloak')
+    if (el.hasAttribute(cloakAttribute))
+      el.removeAttribute(cloakAttribute)
+    el.querySelectorAll(`[${cloakAttribute}]`).forEach((n) => {
+      n.removeAttribute(cloakAttribute)
     })
   }
 
@@ -179,15 +185,15 @@ export default function init(inlineConfig: RuntimeOptions = {}) {
       else {
         if (inspector && !inspector(target))
           return
-        if (mutation.attributeName !== 'un-cloak') {
+        if (mutation.attributeName !== cloakAttribute) {
           const attrs = Array.from(target.attributes)
             .map(i => i.value ? `${i.name}="${i.value}"` : i.name)
             .join(' ')
           const tag = `<${target.tagName.toLowerCase()} ${attrs}>`
           await extract(tag)
         }
-        if (target.hasAttribute('un-cloak'))
-          target.removeAttribute('un-cloak')
+        if (target.hasAttribute(cloakAttribute))
+          target.removeAttribute(cloakAttribute)
       }
     })
   })