fix(web-multi-logger): xterm 4 compatibility (#1387)

Missed fixing breaking changes when doing the initial upgrade
electron · Jan 9, 2020 · 9f66342 · 9f66342
1 parent 9b8a2a6
commit 9f66342
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 12 deletions.
diff --git a/package.json b/package.json
@@ -91,6 +91,8 @@
  "webpack-merge": "^4.2.2",
  "which": "^2.0.2",
  "xterm": "^4.2.0",
+ "xterm-addon-fit": "^0.3.0",
+ "xterm-addon-search": "^0.4.0",
  "yarn-or-npm": "^3.0.1"
  },
  "devDependencies": {

diff --git a/packages/utils/web-multi-logger/package.json b/packages/utils/web-multi-logger/package.json
@@ -11,7 +11,9 @@
  "dependencies": {
  "express": "^4.17.1",
  "express-ws": "^4.0.0",
- "xterm": "^4.2.0"
+ "xterm": "^4.2.0",
+ "xterm-addon-fit": "^0.3.0",
+ "xterm-addon-search": "^0.4.0"
  },
  "engines": {
  "node": ">= 8.0"

diff --git a/packages/utils/web-multi-logger/src/Logger.ts b/packages/utils/web-multi-logger/src/Logger.ts
@@ -24,7 +24,9 @@ export default class Logger {
  this.ws = ews(this.app);
  this.app.get('/rest/tabs', (req, res) => res.json(this.tabs));
 
- this.app.use('/xterm', express.static(path.resolve(require.resolve('xterm'), '../../../dist')));
+ this.app.use('/xterm/addons/fit', express.static(path.dirname(require.resolve('xterm-addon-fit'))));
+ this.app.use('/xterm/addons/search', express.static(path.dirname(require.resolve('xterm-addon-search'))));
+ this.app.use('/xterm', express.static(path.resolve(require.resolve('xterm'), '../..')));
  this.app.use(express.static(path.resolve(__dirname, '..', 'static')));
  (this.app as any).ws('/sub', () => {});
  }

diff --git a/packages/utils/web-multi-logger/static/index.html b/packages/utils/web-multi-logger/static/index.html
@@ -5,7 +5,7 @@
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Electron Forge Logger</title>
- <link rel="stylesheet" href="/xterm/xterm.css" />
+ <link rel="stylesheet" href="/xterm/css/xterm.css" />
  <style>
  body {
  padding: 0;
@@ -53,9 +53,9 @@
 
  <div id="terminal"></div>
 
- <script src="/xterm/xterm.js"></script> 
- <script src="/xterm/addons/fit/fit.js"></script>
- <script src="/xterm/addons/search/search.js"></script>
+ <script src="/xterm/lib/xterm.js"></script>
+ <script src="/xterm/addons/fit/xterm-addon-fit.js"></script>
+ <script src="/xterm/addons/search/xterm-addon-search.js"></script>
  <script src="/main.js"></script>
 </body>
-</html>
+</html>
diff --git a/packages/utils/web-multi-logger/static/main.js b/packages/utils/web-multi-logger/static/main.js
@@ -1,6 +1,3 @@
-Terminal.applyAddon(fit);
-Terminal.applyAddon(search);
-
 const split = (text) => {
  return text.split(/\n/g);
 }
@@ -33,13 +30,16 @@ class Renderer {
  brightWhite: '#fdf6e3'
  }
  });
+ const fitAddon = new FitAddon.FitAddon();
+ this.term.loadAddon(fitAddon);
+ this.term.loadAddon(new SearchAddon.SearchAddon());
  this.container = document.querySelector('#terminal');
 
  this.term.open(this.container);
- this.term.fit();
+ fitAddon.fit();
 
  window.addEventListener('resize', () => {
- this.term.fit();
+ fitAddon.fit();
  });
 
  this.fetch = this.fetch.bind(this);

diff --git a/yarn.lock b/yarn.lock
@@ -9421,6 +9421,16 @@ xtend@~2.1.1:
  dependencies:
  object-keys "~0.4.0"
 
+xterm-addon-fit@^0.3.0:
+ version "0.3.0"
+ resolved "https://registry.yarnpkg.com/xterm-addon-fit/-/xterm-addon-fit-0.3.0.tgz#341710741027de9d648a9f84415a01ddfdbbe715"
+ integrity sha512-kvkiqHVrnMXgyCH9Xn0BOBJ7XaWC/4BgpSWQy3SueqximgW630t/QOankgqkvk11iTOCwWdAY9DTyQBXUMN3lw==
+
+xterm-addon-search@^0.4.0:
+ version "0.4.0"
+ resolved "https://registry.yarnpkg.com/xterm-addon-search/-/xterm-addon-search-0.4.0.tgz#a7beadb3caa7330eb31fb1f17d92de25537684a1"
+ integrity sha512-g07qb/Z4aSfrQ25e6Z6rz6KiExm2DvesQXkx+eA715VABBr5VM/9Jf0INoCiDSYy/nn7rpna+kXiGVJejIffKg==
+
 xterm@^4.2.0:
  version "4.3.0"
  resolved "https://registry.yarnpkg.com/xterm/-/xterm-4.3.0.tgz#9a302efefe75172d4f7ea3afc20f9bd983f05027"