fix: btoa utf8 encoding/decoding error (#114)

add implementation of Base64 utility

Author: iamyoki

src/Base64.ts

@@ -0,0 +1,133 @@
+/**
+ *
+ *  Base64 encode / decode
+ *  http://www.webtoolkit.info/javascript_base64.html
+ *
+ **/
+export const Base64 = {
+  // private property
+  _keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
+
+  // public method for encoding
+  encode: function (input: string) {
+    let output = "";
+    let chr1, chr2, chr3, enc1, enc2, enc3, enc4;
+    let i = 0;
+
+    input = Base64._utf8_encode(input);
+
+    while (i < input.length) {
+      chr1 = input.charCodeAt(i++);
+      chr2 = input.charCodeAt(i++);
+      chr3 = input.charCodeAt(i++);
+
+      enc1 = chr1 >> 2;
+      enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
+      enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
+      enc4 = chr3 & 63;
+
+      if (isNaN(chr2)) {
+        enc3 = enc4 = 64;
+      } else if (isNaN(chr3)) {
+        enc4 = 64;
+      }
+
+      output =
+        output +
+        this._keyStr.charAt(enc1) +
+        this._keyStr.charAt(enc2) +
+        this._keyStr.charAt(enc3) +
+        this._keyStr.charAt(enc4);
+    } // Whend
+
+    return output;
+  }, // End Function encode
+
+  // public method for decoding
+  decode: function (input: string) {
+    let output = "";
+    let chr1, chr2, chr3;
+    let enc1, enc2, enc3, enc4;
+    let i = 0;
+
+    input = input.replace(/[^A-Za-z0-9+/=]/g, "");
+    while (i < input.length) {
+      enc1 = this._keyStr.indexOf(input.charAt(i++));
+      enc2 = this._keyStr.indexOf(input.charAt(i++));
+      enc3 = this._keyStr.indexOf(input.charAt(i++));
+      enc4 = this._keyStr.indexOf(input.charAt(i++));
+
+      chr1 = (enc1 << 2) | (enc2 >> 4);
+      chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+      chr3 = ((enc3 & 3) << 6) | enc4;
+
+      output = output + String.fromCharCode(chr1);
+
+      if (enc3 != 64) {
+        output = output + String.fromCharCode(chr2);
+      }
+
+      if (enc4 != 64) {
+        output = output + String.fromCharCode(chr3);
+      }
+    } // Whend
+
+    output = Base64._utf8_decode(output);
+
+    return output;
+  }, // End Function decode
+
+  // private method for UTF-8 encoding
+  _utf8_encode: function (string: string) {
+    let utftext = "";
+    string = string.replace(/\r\n/g, "\n");
+
+    for (let n = 0; n < string.length; n++) {
+      const c = string.charCodeAt(n);
+
+      if (c < 128) {
+        utftext += String.fromCharCode(c);
+      } else if (c > 127 && c < 2048) {
+        utftext += String.fromCharCode((c >> 6) | 192);
+        utftext += String.fromCharCode((c & 63) | 128);
+      } else {
+        utftext += String.fromCharCode((c >> 12) | 224);
+        utftext += String.fromCharCode(((c >> 6) & 63) | 128);
+        utftext += String.fromCharCode((c & 63) | 128);
+      }
+    } // Next n
+
+    return utftext;
+  }, // End Function _utf8_encode
+
+  // private method for UTF-8 decoding
+  _utf8_decode: function (utftext: string) {
+    let string = "";
+    let i = 0;
+    let c, c1, c2, c3;
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    c = c1 = c2 = 0;
+
+    while (i < utftext.length) {
+      c = utftext.charCodeAt(i);
+
+      if (c < 128) {
+        string += String.fromCharCode(c);
+        i++;
+      } else if (c > 191 && c < 224) {
+        c2 = utftext.charCodeAt(i + 1);
+        string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
+        i += 2;
+      } else {
+        c2 = utftext.charCodeAt(i + 1);
+        c3 = utftext.charCodeAt(i + 2);
+        string += String.fromCharCode(
+          ((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)
+        );
+        i += 3;
+      }
+    } // Whend
+
+    return string;
+  }, // End Function _utf8_decode
+};

src/commands.ts

@@ -1,5 +1,6 @@
 import { FILE_SUFFIX, LINK_PREFIX, TASK } from "./constants";
 import type pixelmatch from "pixelmatch";
+import { Base64 } from "./Base64";
 
 declare global {
   // eslint-disable-next-line @typescript-eslint/no-namespace
@@ -139,8 +140,13 @@ Cypress.Commands.add(
         if (res.error) {
           log.set(
             "message",
-            `${res.message}\n[See comparison](${LINK_PREFIX}${btoa(
-              JSON.stringify({ title, imgPath })
+            `${res.message}\n[See comparison](${LINK_PREFIX}${Base64.encode(
+              encodeURIComponent(
+                JSON.stringify({
+                  title,
+                  imgPath,
+                })
+              )
             )})`
           );
           log.set("consoleProps", () => res);

src/support.ts

@@ -1,3 +1,4 @@
+import { Base64 } from "./Base64";
 import "./commands";
 import { FILE_SUFFIX, LINK_PREFIX, OVERLAY_CLASS, TASK } from "./constants";
 
@@ -91,7 +92,11 @@ after(() => {
       if (!top) return false;
 
       const { title, imgPath } = JSON.parse(
-        atob(e.currentTarget.getAttribute("href").substring(LINK_PREFIX.length))
+        decodeURIComponent(
+          Base64.decode(
+            e.currentTarget.getAttribute("href").substring(LINK_PREFIX.length)
+          )
+        )
       );
       queueClear();