handle generated assistive mml (#88)

* handle generated assistive mml

* version bump

Author: jivey

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstax/highlighter",
-  "version": "1.16.2",
+  "version": "1.16.3",
   "main": "dist/index.js",
   "license": "MIT",
   "files": [

src/injectHighlightWrappers.ts

@@ -277,11 +277,21 @@ function refineRangeBoundaries(range: Range) {
       return mathjax;
     }
 
+    // MathJax 4: <mjx-assistive-mml> is inside <mjx-container>
+    const assistiveMml = dom(node).farthest('mjx-assistive-mml');
+    if (assistiveMml) {
+      const container = dom(assistiveMml).farthest('mjx-container');
+      if (container) {
+        return container;
+      }
+    }
+
+    // Legacy: <script type="math/mml"> after the MathJax container
     const mml = dom(node).farthest('script[type="math/mml"]');
-    if (mml && mml.previousSibling.matches('.MathJax,mjx-container')) {
+    if (mml && mml.previousSibling && mml.previousSibling.matches('.MathJax')) {
       return mml.previousSibling;
     }
-    if (mml && mml.previousSibling.matches('.MathJax_Display')) {
+    if (mml && mml.previousSibling && mml.previousSibling.matches('.MathJax_Display')) {
       return mml.previousSibling.querySelector('.MathJax');
     }
 

src/rangeContents.ts

@@ -7,18 +7,17 @@ export const rangeContentsString = (range: Range): string => {
   const removeAll = (nodes: NodeListOf<Element>) => nodes.forEach((element: Element) => element.remove());
 
   container.appendChild(fragment);
-  // REX creates math/mml script tags inside mjx-container elements for MathJax 4.
-  // Timing issues prevent placing them outside like MathJax 2 used to do,
-  // so we need to move them to match the MathJax 2 location.
+
+  // handle mml math nodes from mathjax 4
   const mjxContainers = container.querySelectorAll('mjx-container');
   mjxContainers.forEach((mjxContainer: Element) => {
-    const scriptTag = mjxContainer.querySelector('script[type="math/mml"]');
-    if (scriptTag && mjxContainer.parentElement) {
-      mjxContainer.parentElement.insertBefore(scriptTag, mjxContainer);
+    const mathTag = mjxContainer.querySelector('mjx-assistive-mml math');
+    if (mathTag && mjxContainer.parentElement) {
+      mjxContainer.parentElement.insertBefore(mathTag, mjxContainer);
     }
   });
 
-  removeAll(container.querySelectorAll('.MathJax'));
+  removeAll(container.querySelectorAll('.MathJax,mjx-container'));
   removeAll(container.querySelectorAll('.MathJax_Display'));
   removeAll(container.querySelectorAll('.MathJax_Preview'));
   removeAll(container.querySelectorAll('.MJX_Assistive_MathML'));