@runtime-type-inspector/repl 3.3.7 → 4.0.0

package/importmap.js

@@ -5,16 +5,37 @@
 function importFile(content) {
   return "data:text/javascript;base64," + btoa(content);
 }
+const nodeModules = './node_modules/';
+// For React ESM importmap to work you need React ESM: npm i react-es6
+const react = {
+  'prop-types'               : nodeModules + 'react-es6/prop-types/index.js',
+  'tiny-warning'             : nodeModules + 'react-es6/tiny-warning.mjs',
+  'tiny-invariant'           : nodeModules + 'react-es6/tiny-invariant.mjs',
+  'mini-create-react-context': nodeModules + 'react-router/node_modules/mini-create-react-context/dist/esm/index.js',
+  'path-to-regexp'           : nodeModules + 'react-es6/path-to-regexp.mjs',
+  'react-is'                 : nodeModules + 'react-es6/react-is.mjs',
+  'hoist-non-react-statics'  : nodeModules + 'react-es6/hoist-non-react-statics.mjs',
+  'resolve-pathname'         : nodeModules + 'react-es6/resolve-pathname.mjs',
+  'isarray'                  : nodeModules + 'react-es6/isarray.mjs',
+};
+const reactMin = {
+  ...react,
+  'react'           : nodeModules + 'react-es6/build/react.min.mjs',
+  'react-dom'       : nodeModules + 'react-es6/build/react-dom.min.mjs',
+  'react-dom/client': nodeModules + 'react-es6/build/react-dom-client.min.mjs',
+};
 const imports = {
   "@runtime-type-inspector/runtime"   : '../src-runtime/index.js',
   "@runtime-type-inspector/transpiler": '../src-transpiler/index.js',
   "@babel/parser"                     : "./babel-parser.js",
   "display-anything"                  : "./node_modules/display-anything/src/index.js",
+  "worker-with-import-map"            : "./node_modules/worker-with-import-map/src/index.js",
   "test-import-validation-b"          : "../test/typechecking/import-validation/b.js",
   //"@babel/helper-plugin-utils"      : "./babel-helper-plugin-utils.js",
   //"@babel/plugin-syntax-typescript" : "./babel-plugin-syntax-typescript.js",
   "fs"                                : importFile("export default {};"),
   "typescript"                        : importFile("export default ts;"), // UMD import
+  ...reactMin,
 };
 if (location.host.includes('runtimetypeinspector.org') || location.port === '7000') {
   imports['@runtime-type-inspector/runtime'   ] = './node_modules/@runtime-type-inspector/runtime/index.mjs';

package/index.js

@@ -6,7 +6,8 @@ import {
   expandTypeBabelTS,
   expandTypeDepFree,
   code2ast2code,
-  ast2jsonForComparison
+  ast2jsonForComparison,
+  parserOptions,
 } from '@runtime-type-inspector/transpiler';
 import * as ti  from '@runtime-type-inspector/transpiler';
 import * as rti from '@runtime-type-inspector/runtime';
@@ -205,7 +206,7 @@ function getRight() {
   return aceEditorRight.getValue();
 }
 function actionAST() {
-  const ast = parse(getLeft(), {sourceType: 'module'});
+  const ast = parse(getLeft(), parserOptions);
   const out = JSON.stringify(ast, function (name, val) {
     if (name === "loc" || name === "start" || name === "end") {
       return undefined; // remove
@@ -438,6 +439,7 @@ const aceEditorLeft = setupAce(
 //              write result to right editor
 // Tip: open F12/DevTools to see errors and warnings
 // Press Shift-Enter in right editor to eval result.
+import {TypePanel} from '@runtime-type-inspector/runtime';
 /**
  * @param {number} a
  * @param {number} b
@@ -450,6 +452,8 @@ const arr = [10_20];
 const [a, b] = arr;
 const ret = add(a, b);
 console.log("ret", ret);
+const typePanel = new TypePanel();
+Object.assign(window, {add, typePanel});
 `,
   //editor => insertTypes(),
   editor => runAction(),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@runtime-type-inspector/repl",
-  "version": "3.3.7",
+  "version": "4.0.0",
   "description": "REPL of RuntimeTypeInspector.js",
   "main": "index.html",
   "author": "Hermann Rolfes (kungfooman)",
@@ -9,9 +9,11 @@
     "access": "public"
   },
   "dependencies": {
-    "@runtime-type-inspector/transpiler": "^3.3.7",
-    "ace-builds": "^1.28.0",
+    "@runtime-type-inspector/transpiler": "^4.0.0",
+    "ace-builds": "^1.35.2",
     "display-anything": "^1.1.0",
-    "express": "^4.18.2"
+    "express": "^4.18.2",
+    "react-es6": "^1.0.0",
+    "worker-with-import-map": "^1.0.4"
   }
 }

package/test-add.worker.js

@@ -0,0 +1,23 @@
+import {inspectType, youCanAddABreakpointHere} from '@runtime-type-inspector/runtime';
+/**
+ * @param {number} a
+ * @param {number} b
+ */
+function add(a, b) {
+  if (!inspectType(a, "number", 'add', 'a')) {
+    youCanAddABreakpointHere();
+  }
+  if (!inspectType(b, "number", 'add', 'b')) {
+    youCanAddABreakpointHere();
+  }
+  return a + b;
+}
+function f() {
+  /** @type {number[]} */
+  const arr = [10_20];
+  const [a, b] = arr;
+  const ret = add(a, b);
+  self.postMessage(`ret ${ret}`);
+}
+f();
+setInterval(f, 2000); // Test spam mode

package/test-divide.worker.js

@@ -0,0 +1,48 @@
+import {inspectType, youCanAddABreakpointHere, validateDivision} from '@runtime-type-inspector/runtime';
+/**
+ * @param {number} a
+ * @param {number} b
+ */
+function testDivide(a, b) {
+  if (!inspectType(a, "number", 'testDivide', 'a')) {
+    youCanAddABreakpointHere();
+  }
+  if (!inspectType(b, "number", 'testDivide', 'b')) {
+    youCanAddABreakpointHere();
+  }
+  return validateDivision(a, b, "testDivide");
+}
+function f() {
+  /** @type {number[]} */
+  const arr = [10_20];
+  const [a, b] = arr;
+  const ret = testDivide(a, b);
+  self.postMessage(`ret ${ret}`);
+}
+f();
+setInterval(f, 2000); // Test spam mode
+
+/*
+import {TypePanel} from '@runtime-type-inspector/runtime';
+import {WorkerWithImportMapViaBedfordsShim} from 'worker-with-import-map';
+// console.log("WorkerWithImportMapViaBedfordsShim", WorkerWithImportMapViaBedfordsShim);
+// const url = './test-add.worker.js';
+const url = './test-divide.worker.js';
+const worker = new WorkerWithImportMapViaBedfordsShim(url, {
+  importMap: 'inherit'
+});
+console.log("worker", worker);
+const typePanel = new TypePanel();
+worker.addEventListener('message', (e) => {
+  // console.log('addEventListener message', e.data);
+  if (e.data.type !== 'rti') {
+    return;
+  }
+  e.preventDefault();
+  e.stopPropagation();
+  // Forward message to window listener:
+  // window.postMessage(e.data);
+  // Forward event directly to typePanel:
+  typePanel.handleEvent(e);
+});
+*/