Merge pull request #5705 from dileepyavan/main

BREAKING CHANGE: Monaco version upgrade to 0.33.0

Author: vivek1729

applications/desktop/package.json

@@ -158,16 +158,19 @@
     "yargs": "17.1.1"
   },
   "devDependencies": {
+    "@babel/preset-env": "^7.18.10",
+    "@babel/plugin-transform-runtime": "^7.18.10",
     "@types/fs-extra": "^9.0.0",
     "@types/lodash.sample": "^4.2.6",
     "@types/lodash.sortby": "^4.7.6",
     "@types/lodash.throttle": "^4.1.6",
     "@types/plist": "^3.0.2",
+    "babel-loader": "^8.2.5",
     "electron": "11.5.0",
     "electron-devtools-installer": "^3.2.0",
     "electron-notarize": "^1.0.0",
     "file-loader": "^6.0.0",
-    "monaco-editor-webpack-plugin": "3.0.1",
+    "monaco-editor-webpack-plugin": "7.0.1",
     "utility-types": "^3.10.0"
   },
   "resolutions": {

applications/desktop/webpack.common.js

@@ -85,6 +85,23 @@ const rendererConfig = {
           publicPath: '../lib',
           outputPath: '../lib'
         },
+      },
+      {
+        test: /\.js$/,
+        include: [
+          path.resolve(__dirname, '../../node_modules/monaco-editor')
+        ],
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: ['@babel/preset-env'],
+            plugins: [
+              ["@babel/transform-runtime", {
+                "regenerator": true
+              }]
+            ]
+          }
+        }
       }
     ],
   },

applications/jupyter-extension/nteract_on_jupyter/package.json

@@ -32,7 +32,7 @@
     "@nteract/transform-vega": "^7.0.10",
     "@nteract/webpack-configurator": "^3.1.26",
     "jquery": "^3.2.1",
-    "monaco-editor-webpack-plugin": "3.0.1",
+    "monaco-editor-webpack-plugin": "7.0.1",
     "react": "^16.3.2",
     "react-dom": "^16.3.2",
     "react-hot-loader": "^4.1.2",
@@ -47,6 +47,9 @@
     "webpack": "^4.17.2"
   },
   "devDependencies": {
-    "file-loader": "^6.0.0"
+    "file-loader": "^6.0.0",
+    "@babel/preset-env": "^7.18.10",
+    "@babel/plugin-transform-runtime": "^7.18.10",
+    "babel-loader": "^8.2.5"
   }
 }

applications/jupyter-extension/nteract_on_jupyter/webpack.config.js

@@ -77,6 +77,23 @@ module.exports = {
             }
           }
         ]
+      },
+      {
+        test: /\.js$/,
+        include: [
+          path.resolve(__dirname, '../../../node_modules/monaco-editor')
+        ],
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: ['@babel/preset-env'],
+            plugins: [
+              ["@babel/transform-runtime", {
+                "regenerator": true
+              }]
+            ]
+          }
+        }
       }
     ]
   },

packages/monaco-editor/package.json

@@ -27,7 +27,7 @@
     "@nteract/core": "^15.0.0",
     "@nteract/messaging": "^7.0.19",
     "lodash.debounce": "^4.0.6",
-    "monaco-editor": "0.22.3",
+    "monaco-editor": "0.33.0",
     "rxjs": "^6.3.3"
   },
   "peerDependencies": {

packages/monaco-editor/src/MonacoEditor.tsx

@@ -215,7 +215,7 @@ export default class MonacoEditor extends React.Component<IMonacoProps> {
         fixedOverflowWidgets: true,
         find: {
           addExtraSpaceOnTop: false, // pops the editor out of alignment if turned on
-          seedSearchStringFromSelection: true, // default is true
+          seedSearchStringFromSelection: "always", // default is "always"
           autoFindInSelection: "never" // default is "never"
         },
         language: this.props.language,
@@ -356,7 +356,7 @@ export default class MonacoEditor extends React.Component<IMonacoProps> {
 
     // Apply new model to the editor when the language is changed.
     const model = this.editor.getModel();
-    if (model && language && model.getModeId() !== language) {
+    if (model && language && model.getLanguageId() !== language) {
       // Get a reference to the current editor
       const editor = this.editor;
 
@@ -511,7 +511,9 @@ export default class MonacoEditor extends React.Component<IMonacoProps> {
       this.editor.updateOptions({
         matchBrackets: isActive ? "always" : "never",
         occurrencesHighlight: isActive,
-        renderIndentGuides: isActive
+        guides:{
+          indentation: isActive
+        }
       });
     }
   }

packages/monaco-editor/src/theme.ts

@@ -34,7 +34,7 @@ export const customMonacoDarkTheme: monaco.editor.IStandaloneThemeData = {
   inherit: true,
   rules: [],
   colors: {
-    "editor.background": "#111"
+    "editor.background": "#111111"
   }
 };
 

scripts/test-shim.ts

@@ -65,3 +65,17 @@ process.on("unhandledRejection", (error: any, promise) => {
 HTMLCanvasElement.prototype.getContext = jest.fn();
 
 window.close = jest.fn();
+window.queueMicrotask = jest.fn();
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: jest.fn().mockImplementation(query => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: jest.fn(),
+    removeListener: jest.fn(), 
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+    dispatchEvent: jest.fn(),
+  })),
+});