Merge pull request #4675 from coralproject/fix/CORL-3189-language-urls

[CORL-3189]: Add support for non-latin character range for urls for comment counts

client/src/core/client/count/index.ts

@@ -1,6 +1,9 @@
 import { COUNT_SELECTOR } from "coral-framework/constants";
-import detectCountScript from "coral-framework/helpers/detectCountScript";
-import resolveStoryURL from "coral-framework/helpers/resolveStoryURL";
+import {
+  bytesToBase64,
+  detectCountScript,
+  resolveStoryURL,
+} from "coral-framework/helpers";
 import jsonp from "coral-framework/utils/jsonp";
 
 import injectJSONPCallback from "./injectJSONPCallback";
@@ -13,7 +16,7 @@ interface CountQueryArgs {
 
 /** createCountQueryRef creates a unique reference from the query args */
 function createCountQueryRef(args: CountQueryArgs) {
-  return btoa(`${args.url}`);
+  return bytesToBase64(new TextEncoder().encode(`${args.url}`));
 }
 
 interface DetectAndInjectArgs {

client/src/core/client/framework/helpers/bytesToBase64.ts

@@ -0,0 +1,6 @@
+export default function bytesToBase64(bytes: Uint8Array) {
+  const binString = Array.from(bytes, (byte) =>
+    String.fromCodePoint(byte)
+  ).join("");
+  return btoa(binString);
+}

client/src/core/client/framework/helpers/index.ts

@@ -1,3 +1,4 @@
+export { default as bytesToBase64 } from "./bytesToBase64";
 export { default as clearHash } from "./clearHash";
 export { default as createContextHOC } from "./createContextHOC";
 export { default as detectCommentEmbedScript } from "./detectCommentEmbedScript";

client/src/core/client/test/setupTestFramework.ts

@@ -1,5 +1,6 @@
 import "@testing-library/jest-dom";
 import { toHaveNoViolations } from "jest-axe";
+import { TextEncoder } from "util";
 
 import expectAndFail from "./expectAndFail";
 
@@ -14,6 +15,9 @@ import "./setupConsole";
 // to get around: https://github.com/facebook/jest/issues/3917
 (global as any).expectAndFail = expectAndFail;
 
+// we need to have this for count script
+(global as any).TextEncoder = TextEncoder;
+
 // Log unhandled rejections.
 // eslint-disable-next-line no-console
 process.on("unhandledRejection", (err) => {