fix: monaco-editor cannot focus with last line

Postcatlab · Sep 5, 2022 · c716521 · c716521
1 parent 1e5b8f0
commit c716521
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 42 deletions.
diff --git a/src/workbench/browser/src/app/shared/components/monaco-editor/monaco-editor.component.ts b/src/workbench/browser/src/app/shared/components/monaco-editor/monaco-editor.component.ts
@@ -191,33 +191,33 @@ export class EoMonacoEditorComponent implements AfterViewInit, OnInit, OnChanges
   }
 
   private initMonacoEditorEvent() {
-    this.completionItemProvider = window.monaco.languages.registerCompletionItemProvider('javascript', {
-      provideCompletionItems: (model, position) => {
-        // find out if we are completing a property in the 'dependencies' object.
-        const textUntilPosition = model.getValueInRange({
-          startLineNumber: 1,
-          startColumn: 1,
-          endLineNumber: position.lineNumber,
-          endColumn: position.column,
-        });
+    // this.completionItemProvider = window.monaco.languages.registerCompletionItemProvider('javascript', {
+    //   provideCompletionItems: (model, position) => {
+    //     // find out if we are completing a property in the 'dependencies' object.
+    //     const textUntilPosition = model.getValueInRange({
+    //       startLineNumber: 1,
+    //       startColumn: 1,
+    //       endLineNumber: position.lineNumber,
+    //       endColumn: position.column,
+    //     });
 
-        const word = model.getWordUntilPosition(position);
-        const range = {
-          startLineNumber: position.lineNumber,
-          endLineNumber: position.lineNumber,
-          startColumn: word.startColumn,
-          endColumn: word.endColumn,
-        };
-        return {
-          suggestions: this.completions.map((n) => ({ ...n, range })),
-        } as any;
-      },
-    });
+    //     const word = model.getWordUntilPosition(position);
+    //     const range = {
+    //       startLineNumber: position.lineNumber,
+    //       endLineNumber: position.lineNumber,
+    //       startColumn: word.startColumn,
+    //       endColumn: word.endColumn,
+    //     };
+    //     return {
+    //       suggestions: this.completions.map((n) => ({ ...n, range })),
+    //     } as any;
+    //   },
+    // });
 
-    this.codeEdtor.onDidChangeModelDecorations(() => {
-      updateEditorHeight(); // typing
-      requestAnimationFrame(updateEditorHeight); // folding
-    });
+    // this.codeEdtor.onDidChangeModelDecorations(() => {
+    //   updateEditorHeight(); // typing
+    //   requestAnimationFrame(updateEditorHeight); // folding
+    // });
 
     this.codeEdtor.onDidChangeModelContent((e) => {
       this.handleChange();
@@ -227,25 +227,25 @@ export class EoMonacoEditorComponent implements AfterViewInit, OnInit, OnChanges
       this.handleBlur();
     });
 
-    let prevHeight = 0;
+    // let prevHeight = 0;
 
-    const updateEditorHeight = () => {
-      const editorElement = this.codeEdtor.getDomNode();
+    // const updateEditorHeight = () => {
+    //   const editorElement = this.codeEdtor.getDomNode();
 
-      if (!editorElement) {
-        return;
-      }
+    //   if (!editorElement) {
+    //     return;
+    //   }
 
-      const lineHeight = this.codeEdtor.getOption(editor.EditorOption.lineHeight);
-      const lineCount = this.codeEdtor.getModel()?.getLineCount() || 1;
-      const height = this.codeEdtor.getTopForLineNumber(Math.min(lineCount, this.maxLine)) + lineHeight;
+    //   const lineHeight = this.codeEdtor.getOption(editor.EditorOption.lineHeight);
+    //   const lineCount = this.codeEdtor.getModel()?.getLineCount() || 1;
+    //   const height = this.codeEdtor.getTopForLineNumber(Math.min(lineCount, this.maxLine)) + lineHeight;
 
-      if (prevHeight !== height) {
-        prevHeight = height;
-        editorElement.style.height = `${height}px`;
-        this.codeEdtor.layout();
-      }
-    };
+    //   if (prevHeight !== height) {
+    //     prevHeight = height;
+    //     editorElement.style.height = `${height}px`;
+    //     this.codeEdtor.layout();
+    //   }
+    // };
   }
   log(event, txt) {
     console.log('ace event', event, txt);

diff --git a/src/workbench/browser/src/app/shared/components/shadow/shadow-dom-encapsulation.component.ts b/src/workbench/browser/src/app/shared/components/shadow/shadow-dom-encapsulation.component.ts
@@ -4,12 +4,18 @@ import MarkdownIt from 'markdown-it/dist/markdown-it';
 @Component({
   selector: 'eo-shadow-dom',
   template: `
+    <link
+      rel="stylesheet"
+      href="https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/github-markdown-css/5.1.0/github-markdown.min.css"
+    />
     <style>
-      img {
+      article.markdown-body img {
         max-width: 600px;
       }
     </style>
-    <div part="eo-shadow-dom" [innerHTML]="content"></div>
+    <article class="markdown-body">
+      <div part="eo-shadow-dom" [innerHTML]="content"></div>
+    </article>
   `,
   encapsulation: ViewEncapsulation.ShadowDom,
 })