[EuiCodeEditor] Console error when using the editor without importing…

… the default theme
elastic · May 11, 2020 · 7384a1f · 7384a1f
1 parent 826bdb5
commit 7384a1f
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/src/components/code_editor/__snapshots__/code_editor.test.tsx.snap b/src/components/code_editor/__snapshots__/code_editor.test.tsx.snap
@@ -87,7 +87,7 @@ exports[`EuiCodeEditor is rendered 1`] = `
     </p>
   </div>
   <div
-    class=" ace_editor ace-tm testClass1 testClass2"
+    class=" ace_editor ace-github testClass1 testClass2"
     id="htmlId"
     style="width: 500px; height: 500px;"
   >
@@ -203,7 +203,7 @@ exports[`EuiCodeEditor props aria attributes allows setting aria-describedby on
     </p>
   </div>
   <div
-    class=" ace_editor ace-tm"
+    class=" ace_editor ace-github"
     id="htmlId"
     style="width: 500px; height: 500px;"
   >
@@ -319,7 +319,7 @@ exports[`EuiCodeEditor props aria attributes allows setting aria-labelledby on t
     </p>
   </div>
   <div
-    class=" ace_editor ace-tm"
+    class=" ace_editor ace-github"
     id="htmlId"
     style="width: 500px; height: 500px;"
   >
@@ -435,7 +435,7 @@ exports[`EuiCodeEditor props isReadOnly renders alternate hint text 1`] = `
     </p>
   </div>
   <div
-    class=" ace_editor ace-tm"
+    class=" ace_editor ace-github"
     id="htmlId"
     style="width: 500px; height: 500px;"
   >

diff --git a/src/components/code_editor/code_editor.tsx b/src/components/code_editor/code_editor.tsx
@@ -25,7 +25,10 @@ import { keysOf } from '../common';
 import { htmlIdGenerator, keyCodes } from '../../services';
 import { EuiI18n } from '../i18n';
 
+import 'brace/theme/github';
+
 const DEFAULT_MODE = 'text';
+const DEFAULT_THEME = 'github';
 
 function setOrRemoveAttribute(
   element: HTMLTextAreaElement,
@@ -215,7 +218,7 @@ export class EuiCodeEditor extends Component<
       cursorStart,
       mode = DEFAULT_MODE,
       'data-test-subj': dataTestSubj = 'codeEditorContainer',
-      theme = 'github',
+      theme = DEFAULT_THEME,
       ...rest
     } = this.props;