Use safeStringify() on monitor values like TW/scratch-gui

closes #1021
closes #1022

Author: GarboMuffin

src/scaffolding/monitor.js

@@ -3,6 +3,7 @@ import DropArea from './drop-area';
 import styles from './style.css';
 import {readAsText} from '../common/readers';
 import downloadBlob from './download';
+import {safeStringify} from './safe-stringify';
 
 class Monitor {
   constructor (parent, monitor) {
@@ -195,9 +196,11 @@ class VariableMonitor extends Monitor {
     }
 
     let value = monitor.get('value');
-    if (typeof value === 'number') {
+    if (typeof value === 'number' && !Object.is(value, -0)) {
       value = Number(value.toFixed(6));
     }
+    value = safeStringify(value);
+
     if (this._value !== value) {
       this._value = value;
       this.valueElement.textContent = value;
@@ -217,6 +220,7 @@ class Row {
     this.monitor = monitor;
 
     this.index = -1;
+    /** @type {string} Stringified value. */
     this.value = '';
     this.isFocused = false;
 
@@ -368,6 +372,8 @@ class Row {
   }
 
   setValue (value) {
+    value = safeStringify(value);
+
     if (this.value !== value && !this.isFocused) {
       this.value = value;
       if (this.editable) {

src/scaffolding/safe-stringify.js

@@ -0,0 +1,29 @@
+const circularReplacer = () => {
+  const seen = new WeakSet();
+  return (_, value) => {
+    if (typeof value === 'object' && value !== null) {
+      if (seen.has(value)) {
+        return Array.isArray(value) ? '[...]' : '{...}';
+      }
+      seen.add(value);
+    }
+    return value;
+  };
+};
+
+/**
+ * Safely stringify, properly handling circular relations and -0.
+ * @param {unknown} input Any value
+ * @returns {string} A stringified version of the input.
+ */
+export const safeStringify = input => {
+  if (typeof input === 'object' && input !== null) {
+    // TODO: this will not handle -0 inside the input properly, though that is very low priority.
+    return JSON.stringify(input, circularReplacer());
+  }
+  // -0 stringifies as "0" by default.
+  if (Object.is(input, -0)) {
+    return '-0';
+  }
+  return `${input}`;
+};