Basic support for user input using readline

Author: DonJayamanne

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## 2.0.3 (10 Sept 2021)
 * Update samples to use `isomorphic-fetch` instead of `node-fetch` (and pre-requisite `npm` packages).
+* Basic support for user input in notebooks using [readline](https://nodejs.org/api/readline.html#readline_readline_createinterface_options)
 
 ## 2.0.2 (6 Sept 2021)
 * Excellent support for [arquero](https://uwdata.github.io/arquero/) (rich HTML output)

README.md

@@ -9,6 +9,8 @@
 * Excellent support for [arquero](https://uwdata.github.io/arquero/) (rich HTML output)
 * Run shell scripts within the notebook cell.
 * Quickly prototype and view HTML/JavaScript/CSS output
+* Basic support for user input using [readline](https://nodejs.org/api/readline.html#readline_readline_createinterface_options)
+
 
 Packages such [plotly](https://plotly.com/javascript/), [tfjs-vis](https://www.npmjs.com/package/@tensorflow/tfjs-vis) & [danfo.js](https://danfo.jsdata.org/) support rich visualzation only in the browser,
 wowever, this extension leverages the power of Notebooks to provide the same rich visualzations when targetting node.js.

package-lock.json

@@ -370,7 +370,7 @@
         "shell-quote": "^1.7.2",
         "source-map": "^0.6.1",
         "tmp": "^0.2.1",
-        "typescript": "^4.4.2",
+        "typescript": "^4.4.3",
         "uuid": "^8.3.2",
         "ws": "^7.5.3",
         "xterm": "^4.13.0",

package.json

@@ -15,7 +15,7 @@ import * as WebSocket from 'ws';
 import { CellExecutionState } from './types';
 import * as path from 'path';
 import { ChildProcess, spawn } from 'child_process';
-import { createDeferred, Deferred, generateId } from '../coreUtils';
+import { createDeferred, Deferred, generateId, noop } from '../coreUtils';
 import { ServerLogger } from '../serverLogger';
 import { CellOutput as CellOutput } from './cellOutput';
 import { getNotebookCwd } from '../utils';
@@ -280,6 +280,12 @@ export class JavaScriptKernel implements IDisposable {
                 void window.showErrorMessage('JavaScript/TypeScript Notebook Kernel was restarted');
                 break;
             }
+            case 'readlineRequest': {
+                window.showInputBox({ ignoreFocusOut: true, prompt: message.question }).then((result) => {
+                    void this.sendMessage({ type: 'readlineResponse', answer: result, requestId: message.requestId });
+                }, noop);
+                break;
+            }
             case 'tensorFlowVis': {
                 if (
                     getConfiguration().inlineTensorflowVisualizations &&

src/extension/kernel/jsKernel.ts

@@ -15,6 +15,7 @@ import { noop } from '../coreUtils';
 import { createConsoleOutputCompletedMarker } from '../const';
 import { DanfoNodePlotter } from './extensions/danforPlotter';
 import { ArqueroFormatter } from './extensions/arqueroFormatter';
+import { ReadLineProxy } from './extensions/readLineProxy';
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const Module = require('module');
 
@@ -304,6 +305,9 @@ Module._load = function (request: any, parent: any) {
 
     // eslint-disable-next-line prefer-rest-params
     const result = originalLoad.apply(this, arguments);
+    if (request === 'readline') {
+        ReadLineProxy.initialize(result);
+    }
     if (request === 'danfojs-node') {
         DanfoJsFormatter.initialize(result);
     }

src/extension/server/codeExecution.ts

@@ -0,0 +1,35 @@
+import { addMessageHandler, removeMessageHandler, sendMessage } from '../comms';
+import { v4 as uuid } from 'uuid';
+import { ReadLineQuestionResponse } from '../types';
+
+export class ReadLineProxy {
+    static initialize(readLine: typeof import('readline')) {
+        const originalCreateInterface = readLine.createInterface;
+        readLine.createInterface = function () {
+            const rlInterface = originalCreateInterface.apply(readLine, arguments as any);
+            const originalQuesttion = rlInterface.question;
+            rlInterface.question = function (query: string) {
+                const questionArgs = Array.prototype.slice.call(arguments);
+                const callback = questionArgs.find((item) => typeof item === 'function');
+                if (callback) {
+                    const requestId = uuid();
+                    sendMessage({
+                        type: 'readlineRequest',
+                        question: query,
+                        requestId
+                    });
+                    function callbackHandler(message: ReadLineQuestionResponse) {
+                        if (message.requestId === requestId) {
+                            removeMessageHandler('readlineResponse', callbackHandler);
+                            callback(message.answer);
+                        }
+                    }
+                    addMessageHandler('readlineResponse', callbackHandler);
+                }
+                return originalQuesttion.apply(rlInterface, arguments as any);
+            };
+
+            return rlInterface;
+        };
+    }
+}

src/extension/server/extensions/readLineProxy.ts

@@ -4,6 +4,6 @@ import * as path from 'path';
 const tsNodePath = path.join(__dirname, '..', '..', '..', 'resources', 'scripts', 'node_modules', 'ts-node');
 export function register(context: vm.Context) {
     vm.runInNewContext(`require('${tsNodePath.replace(/\\/g, '/')}').register()`, context, {
-        displayErrors: true
+        displayErrors: false
     });
 }

src/extension/server/tsnode.ts

@@ -38,7 +38,13 @@ export type CodeObject = {
     friendlyName: string;
     sourceMapFilename: string;
 };
-export type RequestType = RunCellRequest | PingRequest | InitializeRequest | TensorFlowVisRequest | PlotGenerated;
+export type RequestType =
+    | RunCellRequest
+    | PingRequest
+    | InitializeRequest
+    | TensorFlowVisRequest
+    | PlotGenerated
+    | ReadLineQuestionResponse;
 export type RunCellRequest = BaseMessage<
     'cellExec',
     {
@@ -63,6 +69,22 @@ export type TensorFlowVisRequest = BaseMessage<
     | { request: 'heatmap'; requestId: string; success: boolean; error?: Error }
 >;
 
+export type ReadLineQuestionRequest = BaseMessage<
+    'readlineRequest',
+    {
+        question: string;
+        requestId: string;
+    }
+>;
+
+export type ReadLineQuestionResponse = BaseMessage<
+    'readlineResponse',
+    {
+        answer?: string;
+        requestId: string;
+    }
+>;
+
 // Responses
 export type ResponseType =
     | RunCellResponse
@@ -72,6 +94,7 @@ export type ResponseType =
     | Initialized
     | OutputResponse
     | PlotGenerated
+    | ReadLineQuestionRequest
     | TensorFlowVis;
 export type LogMessage = BaseMessage<
     'logMessage',