PoC: Compass shell worker runtime (COMPASS-4517)

packages/browser-repl/src/components/types/cursor-iteration-result-output.tsx

@@ -1,14 +1,15 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { ObjectOutput } from './object-output';
+import { SyntaxHighlight } from '../utils/syntax-highlight';
 import i18n from '@mongosh/i18n';
 
 export interface Document {
   [property: string]: number | string | null | undefined | Document | Document[];
 }
 
 interface CursorIterationResultOutputProps {
-  value: Document[];
+  value: (Document | string)[];
 }
 
 export class CursorIterationResultOutput extends Component<CursorIterationResultOutputProps> {
@@ -24,7 +25,11 @@ export class CursorIterationResultOutput extends Component<CursorIterationResult
     return <div>{i18n.__('shell-api.classes.Cursor.iteration.no-cursor')}</div>;
   }
 
-  renderDocument = (document: Document, i: number): JSX.Element => {
+  renderDocument = (document: Document | string, i: number): JSX.Element => {
+    if (typeof document === 'string') {
+      return <SyntaxHighlight key={`document-${i}`} code={document} />;
+    }
+
     return <ObjectOutput key={`document-${i}`} value={document} />;
   };
 }

packages/browser-runtime-electron/src/electron-interpreter-environment.ts

@@ -14,7 +14,7 @@ export class ElectronInterpreterEnvironment implements InterpreterEnvironment {
   }
 
   sloppyEval(code: string): ContextValue {
-    return vm.runInContext(code, this.context);
+    return vm.runInContext(code, this.context, { breakOnSigint: true });
   }
 
   getContextObject(): ContextValue {

packages/compass-shell/config/loaders/inline-entry-loader.js

@@ -0,0 +1,62 @@
+const loaderUtils = require('loader-utils');
+
+const NodeTargetPlugin = require('webpack/lib/node/NodeTargetPlugin');
+const SingleEntryPlugin = require('webpack/lib/SingleEntryPlugin');
+
+function loader() {}
+
+loader.pitch = function pitch(request) {
+  this.cacheable(false);
+
+  const options = loaderUtils.getOptions(this) || {};
+
+  const cb = this.async();
+
+  const filename = loaderUtils.interpolateName(
+    this,
+    `${options.name || '[hash]'}.inline.js`,
+    {
+      context: options.context || this.rootContext || this.options.context,
+      regExp: options.regExp,
+    }
+  );
+
+  const inlineEntry = {};
+
+  inlineEntry.options = {
+    filename,
+    chunkFilename: `[id].${filename}`,
+    namedChunkFilename: null,
+  };
+
+  inlineEntry.compiler = this._compilation.createChildCompiler(
+    'inline',
+    inlineEntry.options
+  );
+
+  if (this.target !== 'webworker' && this.target !== 'web') {
+    new NodeTargetPlugin().apply(inlineEntry.compiler);
+  }
+
+  new SingleEntryPlugin(this.context, request, 'main').apply(
+    inlineEntry.compiler
+  );
+
+  inlineEntry.compiler.runAsChild((err, entries, compilation) => {
+    if (err) return cb(err);
+
+    if (entries[0]) {
+      inlineEntry.file = entries[0].files[0];
+
+      const contents = compilation.assets[inlineEntry.file].source();
+
+      inlineEntry.url = JSON.stringify(contents);
+
+      return cb(null, `module.exports = ${inlineEntry.url};`);
+    }
+
+    return cb(null, null);
+  });
+};
+
+module.exports = loader;

packages/compass-shell/config/webpack.base.config.js

@@ -128,5 +128,11 @@ module.exports = {
         exclude: /(node_modules)/
       }
     ]
+  },
+  resolveLoader: {
+    modules: [
+      'node_modules',
+      path.resolve(__dirname, 'loaders')
+    ]
   }
 };

packages/compass-shell/config/webpack.dev.config.js

@@ -10,7 +10,9 @@ const project = require('./project');
 const config = {
   mode: 'development',
   target: 'electron-renderer',
-  devtool: 'eval-source-map',
+  // Due to inlined source this makes the bundle extremely big and slow,
+  // disabled for testing purposes
+  // devtool: 'eval-source-map',
   entry: {
     index: [
       // Activate HMR for React

packages/compass-shell/electron/index.js

@@ -16,7 +16,13 @@ if ( process.defaultApp || /[\\/]electron-prebuilt[\\/]/.test(process.execPath)
 function createWindow() {
   // Create the browser window.
   mainWindow = new BrowserWindow({
-    width: 1024, height: 768, show: false
+    width: 1024,
+    height: 768,
+    show: false,
+    webPreferences: {
+      nodeIntegration: true,
+      nodeIntegrationInWorker: true,
+    },
   });
 
   // and load the index.html of the app.

packages/compass-shell/electron/renderer/index.js

@@ -27,14 +27,13 @@ appRegistry.onActivated();
 
 const root = document.createElement('div');
 
-
 root.id = 'root';
 root.style.height = '100%';
 root.style.width = '100%';
 document.body.appendChild(root);
 
 // Create a HMR enabled render function
-const render = Component => {
+const render = (Component) => {
   ReactDOM.render(
     <AppContainer>
       <Component />
@@ -58,22 +57,41 @@ render(CompassShellPlugin);
 // mongoclient is. For that reason we can use a mocked one, this avoid
 // the dependency to keytar:
 //
-const localUri = 'mongodb://localhost:27017/test';
-MongoClient.connect(localUri, { useNewUrlParser: true, useUnifiedTopology: true }, (error, client) => {
-  const dataService = { client: { client } };
-  appRegistry.emit('data-service-initialized', dataService);
-  appRegistry.emit('data-service-connected', error, dataService);
-
-  if (error) {
-    console.error('Unable to connect to', localUri, error);
-    return;
-  }
-
-  console.info('Connected to', localUri);
+const connectionParams = {
+  url: 'mongodb://localhost:27020/test?readPreference=primary&ssl=false',
+  options: {
+    useNewUrlParser: true,
+    useUnifiedTopology: true,
+    connectWithNoPrimary: true,
+    sslValidate: false,
+  },
+};
 
-  appRegistry.emit('data-service-initialized', dataService);
-  appRegistry.emit('data-service-connected', error, dataService);
-});
+MongoClient.connect(
+  connectionParams.url,
+  connectionParams.options,
+  (error, client) => {
+    const dataService = {
+      client: { client },
+      getConnectionParams() {
+        return connectionParams;
+      },
+    };
+
+    appRegistry.emit('data-service-initialized', dataService);
+    appRegistry.emit('data-service-connected', error, dataService);
+
+    if (error) {
+      console.error('Unable to connect to', connectionParams.url, error);
+      return;
+    }
+
+    console.info('Connected to', connectionParams.url);
+
+    appRegistry.emit('data-service-initialized', dataService);
+    appRegistry.emit('data-service-connected', error, dataService);
+  }
+);
 
 if (module.hot) {
   module.hot.accept('plugin', () => render(CompassShellPlugin));