From: Herrington Darkholme <2883231+HerringtonDarkholme@users.noreply.github.com>
Date: Tue, 8 Jun 2021 14:12:15 +0000 (+0800)
Subject: chore(playground): support unicode in sfc playground (#3662)
X-Git-Tag: v3.1.2~13
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=9a5bdb15df454fe99b4f695c85a2890d3e059b68;p=thirdparty%2Fvuejs%2Fcore.git

chore(playground): support unicode in sfc playground (#3662)

atob/btoa only supports ASCII string which makes playground fails
to save unicode source. This patch add unicode support by combining
escape/encodeURIComponent. `escape` is chosen for backward
compatibility.
---

diff --git a/packages/sfc-playground/src/store.ts b/packages/sfc-playground/src/store.ts
index 22080ea107..b68a7042f4 100644
--- a/packages/sfc-playground/src/store.ts
+++ b/packages/sfc-playground/src/store.ts
@@ -1,5 +1,6 @@
 import { reactive, watchEffect } from 'vue'
 import { compileFile, MAIN_FILE } from './sfcCompiler'
+import { utoa, atou } from './utils'
 
 const welcomeCode = `
 <template>
@@ -38,7 +39,7 @@ let files: Store['files'] = {}
 
 const savedFiles = location.hash.slice(1)
 if (savedFiles) {
-  const saved = JSON.parse(atob(savedFiles))
+  const saved = JSON.parse(atou(savedFiles))
   for (const filename in saved) {
     files[filename] = new File(filename, saved[filename])
   }
@@ -70,7 +71,7 @@ for (const file in store.files) {
 }
 
 watchEffect(() => {
-  history.replaceState({}, '', '#' + btoa(JSON.stringify(exportFiles())))
+  history.replaceState({}, '', '#' + utoa(JSON.stringify(exportFiles())))
 })
 
 export function exportFiles() {
diff --git a/packages/sfc-playground/src/utils.ts b/packages/sfc-playground/src/utils.ts
index c5f1de1004..bfc6d708f9 100644
--- a/packages/sfc-playground/src/utils.ts
+++ b/packages/sfc-playground/src/utils.ts
@@ -7,3 +7,13 @@ export function debounce(fn: Function, n = 100) {
     }, n)
   }
 }
+
+// prefer old unicode hacks for backward compatibility
+// https://base64.guru/developers/javascript/examples/unicode-strings
+export function utoa(data: string): string {
+  return btoa(unescape(encodeURIComponent(data)))
+}
+
+export function atou(base64: string): string {
+  return decodeURIComponent(escape(atob(base64)))
+}