diff --git a/services/web/frontend/js/features/source-editor/languages/index.ts b/services/web/frontend/js/features/source-editor/languages/index.ts
index 99dfe80d98..9f03fa2aa6 100644
--- a/services/web/frontend/js/features/source-editor/languages/index.ts
+++ b/services/web/frontend/js/features/source-editor/languages/index.ts
@@ -53,7 +53,6 @@ export const languages = [
   LanguageDescription.of({
     name: 'markdown',
     extensions: ['md', 'markdown'],
-    // @ts-ignore TODO: find out how to add support extensions
     load: () => {
       return import('./markdown').then(m => m.markdown())
     },
diff --git a/services/web/frontend/js/features/source-editor/languages/markdown/index.ts b/services/web/frontend/js/features/source-editor/languages/markdown/index.ts
index 4234ac8bc0..23d3597967 100644
--- a/services/web/frontend/js/features/source-editor/languages/markdown/index.ts
+++ b/services/web/frontend/js/features/source-editor/languages/markdown/index.ts
@@ -1,20 +1,25 @@
 import { markdown as markdownLanguage } from '@codemirror/lang-markdown'
 import { shortcuts } from './shortcuts'
 import { languages } from '../index'
-import { Extension } from '@codemirror/state'
 import { Strikethrough } from '@lezer/markdown'
-import { HighlightStyle, syntaxHighlighting } from '@codemirror/language'
+import {
+  HighlightStyle,
+  LanguageSupport,
+  syntaxHighlighting,
+} from '@codemirror/language'
 import { tags } from '@lezer/highlight'
 
-export const markdown = (): Extension => {
-  return [
-    markdownLanguage({
-      codeLanguages: languages,
-      extensions: [Strikethrough],
-    }),
+export const markdown = () => {
+  const { language, support } = markdownLanguage({
+    codeLanguages: languages,
+    extensions: [Strikethrough],
+  })
+
+  return new LanguageSupport(language, [
+    support,
     shortcuts(),
     syntaxHighlighting(markdownHighlightStyle),
-  ]
+  ])
 }
 
 const markdownHighlightStyle = HighlightStyle.define([