fix: correctly escape XML entities on client side

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>

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;
 }>();

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);
 }
 

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",

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==}