From 0e677bdee72fc5cc78ef7c7ffa3bd4468be7f94a Mon Sep 17 00:00:00 2001
From: Amir Raminfar <findamir@gmail.com>
Date: Wed, 12 Apr 2023 09:47:27 -0700
Subject: [PATCH] fix: correctly escape XML entities on client side

---
 assets/components/LogViewer/FieldList.vue     | 2 +-
 assets/components/LogViewer/SimpleLogItem.vue | 2 +-
 assets/composables/eventsource.ts             | 8 +++++++-
 package.json                                  | 1 +
 pnpm-lock.yaml                                | 4 +++-
 5 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/assets/components/LogViewer/FieldList.vue b/assets/components/LogViewer/FieldList.vue
index 93392781..02b838a1 100644
--- a/assets/components/LogViewer/FieldList.vue
+++ b/assets/components/LogViewer/FieldList.vue
@@ -21,7 +21,7 @@
       </template>
       <template v-else>
         <a @click="toggleField(name)"> {{ hasField(name) ? "remove" : "add" }}&nbsp;</a>
-        <span class="has-text-grey">{{ name }}=</span><span class="has-text-weight-bold">{{ value }}</span>
+        <span class="has-text-grey">{{ name }}=</span><span class="has-text-weight-bold" v-html="value"></span>
       </template>
     </li>
   </ul>
diff --git a/assets/components/LogViewer/SimpleLogItem.vue b/assets/components/LogViewer/SimpleLogItem.vue
index 9ca458d5..4959e912 100644
--- a/assets/components/LogViewer/SimpleLogItem.vue
+++ b/assets/components/LogViewer/SimpleLogItem.vue
@@ -13,7 +13,7 @@
 import { SimpleLogEntry } from "@/models/LogEntry";
 import AnsiConvertor from "ansi-to-html";
 
-const ansiConvertor = new AnsiConvertor({ escapeXML: true });
+const ansiConvertor = new AnsiConvertor({ escapeXML: false });
 defineProps<{
   logEntry: SimpleLogEntry;
 }>();
diff --git a/assets/composables/eventsource.ts b/assets/composables/eventsource.ts
index 1bb96b23..e713f3cc 100644
--- a/assets/composables/eventsource.ts
+++ b/assets/composables/eventsource.ts
@@ -1,4 +1,5 @@
 import { type ComputedRef, type Ref } from "vue";
+import { encodeXML } from "entities";
 import debounce from "lodash.debounce";
 import {
   type LogEvent,
@@ -11,7 +12,12 @@ import {
 import { Container } from "@/models/Container";
 
 function parseMessage(data: string): LogEntry<string | JSONObject> {
-  const e = JSON.parse(data) as LogEvent;
+  const e = JSON.parse(data, (key, value) => {
+    if (typeof value === "string") {
+      return encodeXML(value);
+    }
+    return value;
+  }) as LogEvent;
   return asLogEntry(e);
 }
 
diff --git a/package.json b/package.json
index 96ebfb21..66ce5648 100644
--- a/package.json
+++ b/package.json
@@ -46,6 +46,7 @@
   "d3-shape": "^3.2.0",
   "d3-transition": "^3.0.1",
   "date-fns": "^2.29.3",
+  "entities": "^4.4.0",
   "fuse.js": "^6.6.2",
   "lodash.debounce": "^4.0.8",
   "pinia": "^2.0.34",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 8c4ab9dd..f698f7b0 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -61,6 +61,9 @@ dependencies:
   date-fns:
     specifier: ^2.29.3
     version: 2.29.3
+  entities:
+    specifier: ^4.4.0
+    version: 4.4.0
   fuse.js:
     specifier: ^6.6.2
     version: 6.6.2
@@ -1935,7 +1938,6 @@ packages:
   /entities@4.4.0:
     resolution: {integrity: sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==}
     engines: {node: '>=0.12'}
-    dev: true
 
   /error-ex@1.3.2:
     resolution: {integrity: sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==}