Address getSelectionRange document TODO

Clean up use of jquery Remove use of `done` inside async tests (input_tokenization.test.js) Capitalize elasticsearch Introduce helper for converting to AceRange inside legacy core editor Update typings Clean up imports Cleaner variable assignment
elastic · Dec 6, 2019 · c7157e7 · c7157e7
1 parent dd2f3e1
commit c7157e7
Show file tree

Hide file tree

Showing 11 changed files with 40 additions and 69 deletions.
diff --git a/src/legacy/core_plugins/console/public/np_ready/application/components/editor_example.tsx b/src/legacy/core_plugins/console/public/np_ready/application/components/editor_example.tsx
@@ -20,9 +20,7 @@
 import React, { useEffect } from 'react';
 // @ts-ignore
 import exampleText from 'raw-loader!../constants/help_example.txt';
-import $ from 'jquery';
-
-import { createReadOnlyAceEditor } from '../models/legacy_core_editor/create_readonly';
+import { createReadOnlyAceEditor } from '../models/legacy_core_editor';
 
 interface EditorExampleProps {
   panel: string;
@@ -33,7 +31,7 @@ export function EditorExample(props: EditorExampleProps) {
 
   useEffect(() => {
     const el = document.querySelector<HTMLElement>(`#${elemId}`)!;
-    $(el).text(exampleText.trim());
+    el.textContent = exampleText.trim();
     const editor = createReadOnlyAceEditor(el);
 
     return () => {

diff --git a/...lic/np_ready/application/containers/editor/legacy/console_editor/apply_editor_settings.ts b/...lic/np_ready/application/containers/editor/legacy/console_editor/apply_editor_settings.ts
@@ -19,15 +19,19 @@
 
 import { DevToolsSettings } from '../../../../../services';
 import { CoreEditor } from '../../../../../types';
+import { CustomAceEditor } from '../../../../models/legacy_core_editor';
 
-export function applyCurrentSettings(editor: CoreEditor | any, settings: DevToolsSettings) {
-  if (editor.setStyles) {
-    editor.setStyles({
+export function applyCurrentSettings(
+  editor: CoreEditor | CustomAceEditor,
+  settings: DevToolsSettings
+) {
+  if ((editor as any).setStyles) {
+    (editor as CoreEditor).setStyles({
       wrapLines: settings.wrapMode,
       fontSize: settings.fontSize + 'px',
     });
   } else {
-    editor.getSession().setUseWrapMode(settings.wrapMode);
-    editor.container.style.fontSize = settings.fontSize + 'px';
+    (editor as CustomAceEditor).getSession().setUseWrapMode(settings.wrapMode);
+    (editor as CustomAceEditor).container.style.fontSize = settings.fontSize + 'px';
   }
 }
diff --git a/...ns/console/public/np_ready/application/containers/editor/legacy/console_editor/editor.tsx b/...ns/console/public/np_ready/application/containers/editor/legacy/console_editor/editor.tsx
@@ -37,7 +37,6 @@ import * as senseEditor from '../../../../models/sense_editor';
 import mappings from '../../../../../lib/mappings/mappings';
 
 import { subscribeResizeChecker } from '../subscribe_console_resize_checker';
-import { SenseEditor } from '../../../../models/sense_editor';
 
 const abs: CSSProperties = {
   position: 'absolute',
@@ -66,7 +65,7 @@ function EditorUI() {
   const sendCurrentRequestToES = useSendCurrentRequestToES();
 
   const editorRef = useRef<HTMLDivElement | null>(null);
-  const editorInstanceRef = useRef<SenseEditor | null>(null);
+  const editorInstanceRef = useRef<senseEditor.SenseEditor | null>(null);
 
   const [textArea, setTextArea] = useState<HTMLTextAreaElement | null>(null);
   useUIAceKeyboardMode(textArea);

diff --git a/...ole/public/np_ready/application/containers/editor/legacy/console_editor/editor_output.tsx b/...ole/public/np_ready/application/containers/editor/legacy/console_editor/editor_output.tsx
@@ -18,8 +18,7 @@
  */
 
 import React, { useEffect, useRef } from 'react';
-import ace from 'brace';
-import { createReadOnlyAceEditor } from '../../../../models/legacy_core_editor';
+import { createReadOnlyAceEditor, CustomAceEditor } from '../../../../models/legacy_core_editor';
 import {
   useServicesContext,
   useEditorReadContext,
@@ -43,7 +42,7 @@ function modeForContentType(contentType: string) {
 
 function EditorOutputUI() {
   const editorRef = useRef<null | HTMLDivElement>(null);
-  const editorInstanceRef = useRef<null | ace.Editor>(null);
+  const editorInstanceRef = useRef<null | CustomAceEditor>(null);
   const { services } = useServicesContext();
 
   const { settings: readOnlySettings } = useEditorReadContext();
@@ -61,25 +60,26 @@ function EditorOutputUI() {
   }, [services.settings]);
 
   useEffect(() => {
+    const editor = editorInstanceRef.current!;
     if (data) {
       const mode = modeForContentType(data[0].response.contentType);
-      editorInstanceRef.current!.session.setMode(mode);
-      (editorInstanceRef.current! as any).update(
+      editor.session.setMode(mode);
+      editor.update(
         data
           .map(d => d.response.value)
           .map(readOnlySettings.tripleQuotes ? utils.expandLiteralStrings : a => a)
           .join('\n')
       );
     } else if (error) {
-      editorInstanceRef.current!.session.setMode(modeForContentType(error.contentType));
-      (editorInstanceRef.current! as any).update(error.value);
+      editor.session.setMode(modeForContentType(error.contentType));
+      editor.update(error.value);
     } else {
-      (editorInstanceRef.current! as any).update('');
+      editor.update('');
     }
   }, [readOnlySettings, data, error]);
 
   useEffect(() => {
-    applyCurrentSettings(editorInstanceRef.current, readOnlySettings);
+    applyCurrentSettings(editorInstanceRef.current!, readOnlySettings);
   }, [readOnlySettings]);
 
   return (

diff --git a/...public/np_ready/application/containers/editor/legacy/console_editor/keyboard_shortcuts.ts b/...public/np_ready/application/containers/editor/legacy/console_editor/keyboard_shortcuts.ts
@@ -38,7 +38,7 @@ export function registerCommands({
 
   coreEditor.registerKeyboardShortcut({
     keys: { win: 'Ctrl-Enter', mac: 'Command-Enter' },
-    name: 'send to elasticsearch',
+    name: 'send to Elasticsearch',
     fn: () => sendCurrentRequestToES(),
   });
 

diff --git a/...gins/console/public/np_ready/application/containers/editor/legacy/console_menu_actions.ts b/...gins/console/public/np_ready/application/containers/editor/legacy/console_menu_actions.ts
@@ -21,7 +21,7 @@
 import { getEndpointFromPosition } from '../../../../lib/autocomplete/autocomplete';
 import { SenseEditor } from '../../../models/sense_editor';
 
-export async function autoIndent(editor: SenseEditor, event: any) {
+export async function autoIndent(editor: SenseEditor, event: Event) {
   event.preventDefault();
   await editor.autoIndent();
   editor

diff --git a/..._ready/application/hooks/use_restore_request_from_history/restore_request_from_history.ts b/..._ready/application/hooks/use_restore_request_from_history/restore_request_from_history.ts
@@ -52,5 +52,6 @@ export function restoreRequestFromHistory(editor: SenseEditor, req: any) {
 
   coreEditor.insert(pos, s);
   coreEditor.moveCursorToPosition({ lineNumber: pos.lineNumber + prefix.length, column: 1 });
+  coreEditor.clearSelection();
   coreEditor.getContainer().focus();
 }
diff --git a/...ublic/np_ready/application/models/legacy_core_editor/__tests__/input_tokenization.test.js b/...ublic/np_ready/application/models/legacy_core_editor/__tests__/input_tokenization.test.js
@@ -72,7 +72,7 @@ describe('Input Tokenization', () => {
       data = prefix;
     }
 
-    test('Token test ' + testCount++ + ' prefix: ' + prefix, async function (done) {
+    test('Token test ' + testCount++ + ' prefix: ' + prefix, async function () {
       await coreEditor.setValue(data, true);
       const tokens = tokensAsList();
       const normTokenList = [];
@@ -81,7 +81,6 @@ describe('Input Tokenization', () => {
       }
 
       expect(tokens).toEqual(normTokenList);
-      done();
     });
   }
 
@@ -277,11 +276,10 @@ describe('Input Tokenization', () => {
       data = prefix;
     }
 
-    test('States test ' + testCount++ + ' prefix: ' + prefix, async function (done) {
+    test('States test ' + testCount++ + ' prefix: ' + prefix, async function () {
       await coreEditor.setValue(data, true);
       const modes = statesAsList();
       expect(modes).toEqual(statesList);
-      done();
     });
   }
 

diff --git a/..._plugins/console/public/np_ready/application/models/legacy_core_editor/create_readonly.ts b/..._plugins/console/public/np_ready/application/models/legacy_core_editor/create_readonly.ts
@@ -33,13 +33,13 @@ export interface CustomAceEditor extends ace.Editor {
  * create an interface for it so that we don't rely directly on vendor APIs.
  */
 export function createReadOnlyAceEditor(element: HTMLElement): CustomAceEditor {
-  const output = ace.acequire('ace/ace').edit(element);
+  const output: CustomAceEditor = ace.acequire('ace/ace').edit(element);
 
   const outputMode = new OutputMode.Mode();
 
   output.$blockScrolling = Infinity;
   output.resize = smartResize(output);
-  output.update = (val: string, mode?: any, cb?: any) => {
+  output.update = (val: string, mode?: any, cb?: () => void) => {
     if (typeof mode === 'function') {
       cb = mode;
       mode = void 0;
@@ -54,7 +54,7 @@ export function createReadOnlyAceEditor(element: HTMLElement): CustomAceEditor {
     }
   };
 
-  output.append = (val: any, foldPrevious?: any, cb?: any) => {
+  output.append = (val: string, foldPrevious?: boolean, cb?: () => void) => {
     if (typeof foldPrevious === 'function') {
       cb = foldPrevious;
       foldPrevious = true;
@@ -77,7 +77,7 @@ export function createReadOnlyAceEditor(element: HTMLElement): CustomAceEditor {
   // eslint-disable-next-line
   (function setupSession(session) {
     session.setMode('ace/mode/text');
-    session.setFoldStyle('markbeginend');
+    (session as any).setFoldStyle('markbeginend');
     session.setTabSize(2);
     session.setUseWrapMode(true);
   })(output.getSession());

diff --git a/...ugins/console/public/np_ready/application/models/legacy_core_editor/legacy_core_editor.ts b/...ugins/console/public/np_ready/application/models/legacy_core_editor/legacy_core_editor.ts
@@ -30,6 +30,9 @@ import * as InputMode from './mode/input';
 
 const _AceRange = ace.acequire('ace/range').Range;
 
+const rangeToAceRange = ({ start, end }: Range) =>
+  new _AceRange(start.lineNumber - 1, start.column - 1, end.lineNumber - 1, end.column - 1);
+
 export class LegacyCoreEditor implements CoreEditor {
   private _aceOnPaste: any;
   $actions: any;
@@ -89,14 +92,8 @@ export class LegacyCoreEditor implements CoreEditor {
     return session.getState(lineNumber - 1);
   }
 
-  getValueInRange({ start, end }: Range): string {
-    const aceRange = new _AceRange(
-      start.lineNumber - 1,
-      start.column - 1,
-      end.lineNumber - 1,
-      end.column - 1
-    );
-    return this.editor.getSession().getTextRange(aceRange);
+  getValueInRange(range: Range): string {
+    return this.editor.getSession().getTextRange(rangeToAceRange(range));
   }
 
   getTokenProvider(): TokensProvider {
@@ -169,15 +166,9 @@ export class LegacyCoreEditor implements CoreEditor {
     this.editor.moveCursorToPosition({ row: pos.lineNumber - 1, column: pos.column - 1 });
   }
 
-  replace({ start, end }: Range, value: string): void {
-    const aceRange = new _AceRange(
-      start.lineNumber - 1,
-      start.column - 1,
-      end.lineNumber - 1,
-      end.column - 1
-    );
+  replace(range: Range, value: string): void {
     const session = this.editor.getSession();
-    session.replace(aceRange, value);
+    session.replace(rangeToAceRange(range), value);
   }
 
   getLines(startLine: number, endLine: number): string[] {
@@ -187,17 +178,7 @@ export class LegacyCoreEditor implements CoreEditor {
 
   replaceRange(range: Range, value: string) {
     const pos = this.editor.getCursorPosition();
-    this.editor
-      .getSession()
-      .replace(
-        new _AceRange(
-          range.start.lineNumber - 1,
-          range.start.column - 1,
-          range.end.lineNumber - 1,
-          range.end.column - 1
-        ),
-        value
-      );
+    this.editor.getSession().replace(rangeToAceRange(range), value);
 
     const maxRow = Math.max(range.start.lineNumber - 1 + value.split('\n').length - 1, 1);
     pos.row = Math.min(pos.row, maxRow);
@@ -228,17 +209,7 @@ export class LegacyCoreEditor implements CoreEditor {
   addMarker(range: Range) {
     return this.editor
       .getSession()
-      .addMarker(
-        new _AceRange(
-          range.start.lineNumber - 1,
-          range.start.column - 1,
-          range.end.lineNumber - 1,
-          range.end.column - 1
-        ),
-        'ace_snippet-marker',
-        'fullLine',
-        false
-      );
+      .addMarker(rangeToAceRange(range), 'ace_snippet-marker', 'fullLine', false);
   }
 
   removeMarker(ref: any) {

diff --git a/src/legacy/core_plugins/console/public/np_ready/types/core_editor.ts b/src/legacy/core_plugins/console/public/np_ready/types/core_editor.ts
@@ -137,7 +137,7 @@ export interface CoreEditor {
   clearSelection(): void;
 
   /**
-   * TODO: Document
+   * Returns the {@link Range} for currently selected text
    */
   getSelectionRange(): Range;