Upgrade CodeMirror and Lezer dependencies (#30615)

* Upgrade CodeMirror and Lezer dependencies
* Ensure that BraceWidget and IconBraceWidget always have string content
* Add updateDOM to BraceWidget
* Use pinned versions
* Fix description list decoration

GitOrigin-RevId: 5306f7f09290eb9a2c375e97d33509537f3c5e5f

package-lock.json

@@ -10026,9 +10026,9 @@
       }
     },
     "node_modules/@codemirror/commands": {
-      "version": "6.9.0",
-      "resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-6.9.0.tgz",
-      "integrity": "sha512-454TVgjhO6cMufsyyGN70rGIfJxJEjcqjBG2x2Y03Y/+Fm99d3O/Kv1QDYWuG6hvxsgmjXmBuATikIIYvERX+w==",
+      "version": "6.10.1",
+      "resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-6.10.1.tgz",
+      "integrity": "sha512-uWDWFypNdQmz2y1LaNJzK7fL7TYKLeUAU0npEC685OKTF3KcQ2Vu3klIM78D7I6wGhktme0lh3CuQLv0ZCrD9Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10087,9 +10087,9 @@
       }
     },
     "node_modules/@codemirror/lang-markdown": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/@codemirror/lang-markdown/-/lang-markdown-6.4.0.tgz",
-      "integrity": "sha512-ZeArR54seh4laFbUTVy0ZmQgO+C/cxxlW4jEoQMhL3HALScBpZBeZcLzrQmJsTEx4is9GzOe0bFAke2B1KZqeA==",
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/@codemirror/lang-markdown/-/lang-markdown-6.5.0.tgz",
+      "integrity": "sha512-0K40bZ35jpHya6FriukbgaleaqzBLZfOh7HuzqbMxBXkbYMJDxfF39c23xOgxFezR+3G+tR2/Mup+Xk865OMvw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10103,24 +10103,24 @@
       }
     },
     "node_modules/@codemirror/language": {
-      "version": "6.11.3",
-      "resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.11.3.tgz",
-      "integrity": "sha512-9HBM2XnwDj7fnu0551HkGdrUrrqmYq/WC5iv6nbY2WdicXdGbhR/gfbZOH73Aqj4351alY1+aoG9rCNfiwS1RA==",
+      "version": "6.12.1",
+      "resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.12.1.tgz",
+      "integrity": "sha512-Fa6xkSiuGKc8XC8Cn96T+TQHYj4ZZ7RdFmXA3i9xe/3hLHfwPZdM+dqfX0Cp0zQklBKhVD8Yzc8LS45rkqcwpQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@codemirror/state": "^6.0.0",
         "@codemirror/view": "^6.23.0",
-        "@lezer/common": "^1.1.0",
+        "@lezer/common": "^1.5.0",
         "@lezer/highlight": "^1.0.0",
         "@lezer/lr": "^1.0.0",
         "style-mod": "^4.0.0"
       }
     },
     "node_modules/@codemirror/lint": {
-      "version": "6.9.0",
-      "resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.9.0.tgz",
-      "integrity": "sha512-wZxW+9XDytH3SKvS8cQzMyQCaaazH8XL1EMHleHe00wVzsv7NBQKVW2yzEHrRhmM7ZOhVdItPbvlRBvMp9ej7A==",
+      "version": "6.9.2",
+      "resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.9.2.tgz",
+      "integrity": "sha512-sv3DylBiIyi+xKwRCJAAsBZZZWo82shJ/RTMymLabAdtbkV5cSKwWDeCgtUq3v8flTaXS2y1kKkICuRYtUswyQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10142,9 +10142,9 @@
       }
     },
     "node_modules/@codemirror/state": {
-      "version": "6.5.2",
-      "resolved": "https://registry.npmjs.org/@codemirror/state/-/state-6.5.2.tgz",
-      "integrity": "sha512-FVqsPqtPWKVVL3dPSxy8wEF/ymIEuVzF1PK3VbUgrxXpJUSHQWWZz4JMToquRxnkw+36LTamCZG2iua2Ptq0fA==",
+      "version": "6.5.4",
+      "resolved": "https://registry.npmjs.org/@codemirror/state/-/state-6.5.4.tgz",
+      "integrity": "sha512-8y7xqG/hpB53l25CIoit9/ngxdfoG+fx+V3SHBrinnhOtLvKHRyAJJuHzkWrR4YXXLX8eXBsejgAAxHUOdW1yw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10152,9 +10152,9 @@
       }
     },
     "node_modules/@codemirror/view": {
-      "version": "6.38.6",
-      "resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.38.6.tgz",
-      "integrity": "sha512-qiS0z1bKs5WOvHIAC0Cybmv4AJSkAXgX5aD6Mqd2epSLlVJsQl8NG23jCVouIgkh4All/mrbdsf2UOLFnJw0tw==",
+      "version": "6.39.11",
+      "resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.39.11.tgz",
+      "integrity": "sha512-bWdeR8gWM87l4DB/kYSF9A+dVackzDb/V56Tq7QVrQ7rn86W0rgZFtlL3g3pem6AeGcb9NQNoy3ao4WpW4h5tQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13713,9 +13713,9 @@
       "license": "MIT"
     },
     "node_modules/@lezer/common": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/@lezer/common/-/common-1.2.3.tgz",
-      "integrity": "sha512-w7ojc8ejBqr2REPsWxJjrMFsA/ysDCFICn8zEOR9mrqzOu2amhITYuLD8ag6XZf0CFXDrhKqw7+tW8cX66NaDA==",
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@lezer/common/-/common-1.5.0.tgz",
+      "integrity": "sha512-PNGcolp9hr4PJdXR4ix7XtixDrClScvtSCYW3rQG106oVMOOI+jFb+0+J3mbeL/53g1Zd6s0kJzaw6Ri68GmAA==",
       "dev": true,
       "license": "MIT"
     },
@@ -13732,9 +13732,9 @@
       }
     },
     "node_modules/@lezer/generator": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/@lezer/generator/-/generator-1.7.3.tgz",
-      "integrity": "sha512-vAI2O1tPF8QMMgp+bdUeeJCneJNkOZvqsrtyb4ohnFVFdboSqPwBEacnt0HH4E+5h+qsIwTHUSAhffU4hzKl1A==",
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/@lezer/generator/-/generator-1.8.0.tgz",
+      "integrity": "sha512-/SF4EDWowPqV1jOgoGSGTIFsE7Ezdr7ZYxyihl5eMKVO5tlnpIhFcDavgm1hHY5GEonoOAEnJ0CU0x+tvuAuUg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13746,12 +13746,13 @@
       }
     },
     "node_modules/@lezer/highlight": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@lezer/highlight/-/highlight-1.2.1.tgz",
-      "integrity": "sha512-Z5duk4RN/3zuVO7Jq0pGLJ3qynpxUVsh7IbUbGj88+uV2ApSAn6kWg2au3iJb+0Zi7kKtqffIESgNcRXWZWmSA==",
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/@lezer/highlight/-/highlight-1.2.3.tgz",
+      "integrity": "sha512-qXdH7UqTvGfdVBINrgKhDsVTJTxactNNxLk7+UMwZhU13lMHaOBlJe9Vqp907ya56Y3+ed2tlqzys7jDkTmW0g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@lezer/common": "^1.0.0"
+        "@lezer/common": "^1.3.0"
       }
     },
     "node_modules/@lezer/html": {
@@ -13779,22 +13780,23 @@
       }
     },
     "node_modules/@lezer/lr": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/@lezer/lr/-/lr-1.4.2.tgz",
-      "integrity": "sha512-pu0K1jCIdnQ12aWNaAVU5bzi7Bd1w54J3ECgANPmYLtQKP0HBj2cE/5coBD66MT10xbtIuUr7tg0Shbsvk0mDA==",
+      "version": "1.4.7",
+      "resolved": "https://registry.npmjs.org/@lezer/lr/-/lr-1.4.7.tgz",
+      "integrity": "sha512-wNIFWdSUfX9Jc6ePMzxSPVgTVB4EOfDIwLQLWASyiUdHKaMsiilj9bYiGkGQCKVodd0x6bgQCV207PILGFCF9Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@lezer/common": "^1.0.0"
       }
     },
     "node_modules/@lezer/markdown": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/@lezer/markdown/-/markdown-1.4.3.tgz",
-      "integrity": "sha512-kfw+2uMrQ/wy/+ONfrH83OkdFNM0ye5Xq96cLlaCy7h5UT9FO54DU4oRoIc0CSBh5NWmWuiIJA7NGLMJbQ+Oxg==",
+      "version": "1.6.3",
+      "resolved": "https://registry.npmjs.org/@lezer/markdown/-/markdown-1.6.3.tgz",
+      "integrity": "sha512-jpGm5Ps+XErS+xA4urw7ogEGkeZOahVQF21Z6oECF0sj+2liwZopd2+I8uH5I/vZsRuuze3OxBREIANLf6KKUw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@lezer/common": "^1.0.0",
+        "@lezer/common": "^1.5.0",
         "@lezer/highlight": "^1.0.0"
       }
     },
@@ -59152,20 +59154,20 @@
         "@babel/preset-typescript": "^7.28.5",
         "@babel/register": "^7.28.3",
         "@codemirror/autocomplete": "github:overleaf/codemirror-autocomplete#6445cd056671c98d12d1c597ba705e11327ec4c5",
-        "@codemirror/commands": "^6.9.0",
-        "@codemirror/lang-markdown": "^6.4.0",
-        "@codemirror/language": "^6.11.3",
-        "@codemirror/lint": "^6.9.0",
+        "@codemirror/commands": "6.10.1",
+        "@codemirror/lang-markdown": "6.5.0",
+        "@codemirror/language": "6.12.1",
+        "@codemirror/lint": "6.9.2",
         "@codemirror/search": "github:overleaf/codemirror-search#04380a528c339cd4b78fb10b3ef017f657ec17bd",
-        "@codemirror/state": "^6.5.2",
-        "@codemirror/view": "^6.38.6",
+        "@codemirror/state": "6.5.4",
+        "@codemirror/view": "6.39.11",
         "@floating-ui/react": "^0.27.5",
         "@juggle/resize-observer": "^3.3.1",
-        "@lezer/common": "^1.2.3",
-        "@lezer/generator": "^1.7.3",
-        "@lezer/highlight": "^1.2.1",
-        "@lezer/lr": "^1.4.2",
-        "@lezer/markdown": "^1.4.3",
+        "@lezer/common": "1.5.0",
+        "@lezer/generator": "1.8.0",
+        "@lezer/highlight": "1.2.3",
+        "@lezer/lr": "1.4.7",
+        "@lezer/markdown": "1.6.3",
         "@overleaf/codemirror-tree-view": "^0.1.3",
         "@overleaf/dictionaries": "https://github.com/overleaf/dictionaries/archive/refs/tags/v0.0.3.tar.gz",
         "@overleaf/eslint-plugin": "*",

services/web/frontend/js/features/source-editor/extensions/visual/atomic-decorations.ts

@@ -1017,7 +1017,7 @@ export const atomicDecorations = (options: Options) => {
                   ...decorateArgumentBraces(
                     new BraceWidget(decorateBrackets ? '' : '['),
                     argumentNode,
-                    from,
+                    argumentNode.from,
                     false,
                     new BraceWidget(decorateBrackets ? '' : ']'),
                     { open: OpenBracket, close: CloseBracket }

services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/brace.ts

@@ -1,16 +1,14 @@
 import { WidgetType } from '@codemirror/view'
 
 export class BraceWidget extends WidgetType {
-  constructor(private content?: string) {
+  constructor(private content = '') {
     super()
   }
 
   toDOM() {
     const element = document.createElement('span')
     element.classList.add('ol-cm-brace')
-    if (this.content !== undefined) {
-      element.textContent = this.content
-    }
+    element.textContent = this.content
     return element
   }
 
@@ -22,6 +20,11 @@ export class BraceWidget extends WidgetType {
     return widget.content === this.content
   }
 
+  updateDOM(element: HTMLSpanElement): boolean {
+    element.textContent = this.content
+    return true
+  }
+
   coordsAt(element: HTMLElement) {
     return element.getBoundingClientRect()
   }

services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/icon-brace.ts

@@ -1,7 +1,7 @@
 import { WidgetType } from '@codemirror/view'
 
 export class IconBraceWidget extends WidgetType {
-  constructor(private content?: string) {
+  constructor(private content = '') {
     super()
   }
 
@@ -9,9 +9,7 @@ export class IconBraceWidget extends WidgetType {
     const element = document.createElement('span')
     element.classList.add('ol-cm-brace')
     element.classList.add('ol-cm-icon-brace')
-    if (this.content !== undefined) {
-      element.textContent = this.content
-    }
+    element.textContent = this.content
     return element
   }
 
@@ -24,7 +22,7 @@ export class IconBraceWidget extends WidgetType {
   }
 
   updateDOM(element: HTMLElement): boolean {
-    element.textContent = this.content ?? ''
+    element.textContent = this.content
     return true
   }
 

services/web/package.json

@@ -207,20 +207,20 @@
     "@babel/preset-typescript": "^7.28.5",
     "@babel/register": "^7.28.3",
     "@codemirror/autocomplete": "github:overleaf/codemirror-autocomplete#6445cd056671c98d12d1c597ba705e11327ec4c5",
-    "@codemirror/commands": "^6.9.0",
-    "@codemirror/lang-markdown": "^6.4.0",
-    "@codemirror/language": "^6.11.3",
-    "@codemirror/lint": "^6.9.0",
+    "@codemirror/commands": "6.10.1",
+    "@codemirror/lang-markdown": "6.5.0",
+    "@codemirror/language": "6.12.1",
+    "@codemirror/lint": "6.9.2",
     "@codemirror/search": "github:overleaf/codemirror-search#04380a528c339cd4b78fb10b3ef017f657ec17bd",
-    "@codemirror/state": "^6.5.2",
-    "@codemirror/view": "^6.38.6",
+    "@codemirror/state": "6.5.4",
+    "@codemirror/view": "6.39.11",
     "@floating-ui/react": "^0.27.5",
     "@juggle/resize-observer": "^3.3.1",
-    "@lezer/common": "^1.2.3",
-    "@lezer/generator": "^1.7.3",
-    "@lezer/highlight": "^1.2.1",
-    "@lezer/lr": "^1.4.2",
-    "@lezer/markdown": "^1.4.3",
+    "@lezer/common": "1.5.0",
+    "@lezer/generator": "1.8.0",
+    "@lezer/highlight": "1.2.3",
+    "@lezer/lr": "1.4.7",
+    "@lezer/markdown": "1.6.3",
     "@overleaf/codemirror-tree-view": "^0.1.3",
     "@overleaf/dictionaries": "https://github.com/overleaf/dictionaries/archive/refs/tags/v0.0.3.tar.gz",
     "@overleaf/eslint-plugin": "*",

services/web/test/frontend/features/source-editor/components/codemirror-editor-visual.spec.tsx

@@ -730,7 +730,7 @@ describe('<CodeMirrorEditor/> in Visual mode', function () {
       cy.get('.ol-cm-textcolor')
         .should('have.length', 1)
         .should('have.text', 'foo')
-        .should('have.attr', 'style', 'color: rgb(255,0,0)')
+        .should('have.attr', 'style', 'color: rgb(255, 0, 0);')
     })
 
     it('decorates colorbox', function () {
@@ -738,7 +738,7 @@ describe('<CodeMirrorEditor/> in Visual mode', function () {
       cy.get('.ol-cm-colorbox')
         .should('have.length', 1)
         .should('have.text', 'foo')
-        .should('have.attr', 'style', 'background-color: rgb(255,255,0)')
+        .should('have.attr', 'style', 'background-color: rgb(255, 255, 0);')
     })
   })