fix: actually include the fix

Author: tefkah

navigator-html-injectables/src/modules/Decorator.ts

@@ -1,12 +1,12 @@
 import { Locator } from "@readium/shared";
 import { Comms } from "../comms/comms";
-import { Module } from "./Module";
-import { rangeFromLocator } from "../helpers/locator";
-import { ModuleName } from "./ModuleLibrary";
-import { Rect, getClientRectsNoOverlap } from "../helpers/rect";
+import { isDarkColor } from "../helpers/color";
 import { getProperty } from "../helpers/css";
 import { ReadiumWindow } from "../helpers/dom";
-import { isDarkColor } from "../helpers/color";
+import { rangeFromLocator } from "../helpers/locator";
+import { Rect, getClientRectsNoOverlap } from "../helpers/rect";
+import { Module } from "./Module";
+import { ModuleName } from "./ModuleLibrary";
 
 export enum Width {
     Wrap = "wrap", // Smallest width fitting the CSS border box.
@@ -103,8 +103,12 @@ class DecorationGroup {
                 // The common ancestor is an element that definitely cannot be highlighted
                 this.notTextFlag?.set(id, true);
             }
-            if(ancestor.querySelector(cannotNativeHighlight.join(", ").toLowerCase())) {
-                // Contains elements that definitely cannot be highlighted as children
+            // Check if the range itself contains elements that cannot be highlighted
+            const rangeFragment = range.cloneContents();
+            const tempDiv = this.wnd.document.createElement('div');
+            tempDiv.appendChild(rangeFragment);
+            if(tempDiv.querySelector(cannotNativeHighlight.join(", ").toLowerCase())) {
+                // Range contains elements that definitely cannot be highlighted
                 this.notTextFlag?.set(id, true);
             }
             if((ancestor.textContent?.trim() || "").length === 0) {