Improve setting height of editor
Side affect is if you have the developer console open
the editor will be much smaller.
But this is worth the trade off.
Screenshot: https://imgur.com/a/OIwISAp
Change-Id: I07d923ee5038db7e0b03dddb7ccd74b019c3bf64
diff --git a/gr-editor/codemirror-element.js b/gr-editor/codemirror-element.js
index 94ee213..d75db0f 100644
--- a/gr-editor/codemirror-element.js
+++ b/gr-editor/codemirror-element.js
@@ -63,9 +63,18 @@
// eslint-disable-next-line new-cap
this._nativeMirror = window.CodeMirror(this.$.wrapper, this._params);
setTimeout(() => {
+ const offsetTop =
+ this._nativeMirror.display.wrapper.getBoundingClientRect().top;
+ const clientHeight =
+ window.innerHeight || document.clientHeight || document.getElementByTagName('body').clientHeight;
+ // We are setting a fixed height, because for large files we want to
+ // benefit from CodeMirror's virtual scrolling.
+ // 80px is roughly the size of the bottom margins plus the footer height.
+ // This ensures the height of the textarea doesn't push out of screen.
+ const height = clientHeight - offsetTop - 80;
this._nativeMirror.refresh();
this._nativeMirror.focus();
- this._nativeMirror.setSize(null, window.screen.height);
+ this._nativeMirror.setSize(null, height < 600 ? 600 : height);
if (this.lineNum) {
// We have to take away one from the line number,
// ... because CodeMirror's line count is zero-based.
