@quanta-intellect/vessel-browser 0.1.84 → 0.1.88

package/README.md

@@ -182,6 +182,14 @@ The packaged AppImage path:
 - uses the packaged Vessel app icon and metadata
 - is the recommended path for early adopters who just want to run Vessel
 
+Windows packaged releases:
+
+- use the `Vessel-<version>-x64-setup.exe` NSIS installer
+- can be installed over an existing Vessel install when upgrading
+- preserve Vessel app data during the normal upgrade path
+
+You do not need to uninstall Vessel before installing a newer Windows release. Uninstall first only if you are recovering from a broken install or intentionally removing local Vessel data.
+
 After install:
 
 ```bash

package/out/main/index.js

@@ -616,7 +616,7 @@ class Tab {
           var el = document.elementFromPoint(${x}, ${y});
           while (el) {
             if (el.hasAttribute && el.hasAttribute('data-vessel-highlight')) {
-              return el.textContent || '';
+              return el.getAttribute('data-vessel-highlight-text') || el.textContent || '';
             }
             el = el.parentElement;
           }
@@ -931,6 +931,7 @@ class Tab {
                     mark.style.setProperty('background', 'rgba(240, 198, 54, 0.3)', 'important');
                     mark.style.setProperty('border-bottom-color', '#f0c636', 'important');
                     mark.setAttribute('data-vessel-highlight', 'true');
+                    mark.setAttribute('data-vessel-highlight-text', text);
                     range.surroundContents(mark);
                   } else {
                     // For cross-node selections, extract and wrap in a mark
@@ -939,6 +940,7 @@ class Tab {
                     mark.style.setProperty('background', 'rgba(240, 198, 54, 0.3)', 'important');
                     mark.style.setProperty('border-bottom-color', '#f0c636', 'important');
                     mark.setAttribute('data-vessel-highlight', 'true');
+                    mark.setAttribute('data-vessel-highlight-text', text);
                     var contents = range.extractContents();
                     mark.appendChild(contents);
                     range.insertNode(mark);
@@ -1215,6 +1217,134 @@ for (var cr = 0; cr < contentRoots.length; cr++) {
   if (contentRoot) break;
 }`;
 const NAV_ANCESTORS_JS = `var NAV_ANCESTORS = 'nav, aside, footer, header, [role="navigation"], [role="complementary"], .sidebar, .navbox, .infobox, figcaption, .thumbcaption, .mw-jump-link';`;
+const TEXT_MATCH_HELPERS_JS = `
+function normalizeHighlightSearchText(value) {
+  return String(value || '').replace(/\\s+/g, ' ').trim().toLowerCase();
+}
+
+function isHighlightableTextNode(n) {
+  var p = n.parentElement;
+  if (!p) return false;
+  if (SKIP_TAGS[p.tagName]) return false;
+  if (p.closest('[data-vessel-highlight]')) return false;
+  if (p.closest(NAV_ANCESTORS)) return false;
+  var style = window.getComputedStyle(p);
+  if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') return false;
+  if (p.offsetWidth === 0 && p.offsetHeight === 0) return false;
+  return true;
+}
+
+function collectTextRangeMatches(root, searchText, limit) {
+  var normalizedSearch = normalizeHighlightSearchText(searchText);
+  if (!root || !normalizedSearch) return [];
+  var normalized = '';
+  var map = [];
+  var w = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, {
+    acceptNode: function(n) {
+      return isHighlightableTextNode(n)
+        ? NodeFilter.FILTER_ACCEPT
+        : NodeFilter.FILTER_REJECT;
+    }
+  });
+  var n;
+  while ((n = w.nextNode())) {
+    var text = n.textContent || '';
+    for (var i = 0; i < text.length; i++) {
+      var ch = text.charAt(i);
+      if (/\\s/.test(ch)) {
+        if (normalized.length === 0 || normalized.charAt(normalized.length - 1) === ' ') {
+          continue;
+        }
+        normalized += ' ';
+      } else {
+        normalized += ch.toLowerCase();
+      }
+      map.push({ node: n, offset: i });
+    }
+  }
+  var matches = [];
+  var from = 0;
+  while (matches.length < limit) {
+    var idx = normalized.indexOf(normalizedSearch, from);
+    if (idx === -1) break;
+    var start = map[idx];
+    var end = map[idx + normalizedSearch.length - 1];
+    if (start && end) {
+      matches.push({
+        startNode: start.node,
+        startOffset: start.offset,
+        endNode: end.node,
+        endOffset: end.offset + 1,
+      });
+    }
+    from = idx + Math.max(1, normalizedSearch.length);
+  }
+  return matches;
+}
+
+function collectTextSegmentsForMatch(match) {
+  var segments = [];
+  var inRange = false;
+  var w = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT, {
+    acceptNode: function(n) {
+      return isHighlightableTextNode(n) || n === match.startNode || n === match.endNode
+        ? NodeFilter.FILTER_ACCEPT
+        : NodeFilter.FILTER_REJECT;
+    }
+  });
+  var n;
+  while ((n = w.nextNode())) {
+    if (n === match.startNode) inRange = true;
+    if (!inRange) continue;
+    segments.push({
+      node: n,
+      start: n === match.startNode ? match.startOffset : 0,
+      end: n === match.endNode ? match.endOffset : (n.textContent || '').length,
+    });
+    if (n === match.endNode) break;
+  }
+  return segments;
+}
+
+function markTextSegment(segment, solidColor, bgColor, fullText) {
+  if (!segment.node || segment.end <= segment.start) return null;
+  var parent = segment.node.parentNode;
+  if (!parent) return null;
+  var text = segment.node.textContent || '';
+  var selected = text.slice(segment.start, segment.end);
+  if (!selected) return null;
+  var mark = document.createElement('mark');
+  mark.className = '__vessel-highlight-text';
+  mark.style.setProperty('background', bgColor, 'important');
+  mark.style.setProperty('border-bottom-color', solidColor, 'important');
+  mark.setAttribute('data-vessel-highlight', 'true');
+  if (fullText) {
+    mark.setAttribute('data-vessel-highlight-text', fullText);
+  }
+  mark.textContent = selected;
+  if (segment.start > 0) {
+    parent.insertBefore(document.createTextNode(text.slice(0, segment.start)), segment.node);
+  }
+  parent.insertBefore(mark, segment.node);
+  if (segment.end < text.length) {
+    parent.insertBefore(document.createTextNode(text.slice(segment.end)), segment.node);
+  }
+  parent.removeChild(segment.node);
+  return mark;
+}
+
+function applyTextRangeMatch(match, solidColor, bgColor, fullText) {
+  var segments = collectTextSegmentsForMatch(match);
+  var marks = [];
+  for (var i = segments.length - 1; i >= 0; i--) {
+    try {
+      var mark = markTextSegment(segments[i], solidColor, bgColor, fullText);
+      if (mark) marks.unshift(mark);
+    } catch (_e) {}
+  }
+  return marks;
+}
+`;
 const HIGHLIGHT_COLORS = {
   yellow: {
     solid: "#f0c636",
@@ -1299,8 +1429,7 @@ const VESSEL_HIGHLIGHT_CSS = `
   opacity: 1;
 }
 `;
-async function highlightOnPage(wc, resolvedSelector, text, label, durationMs, color) {
-  const c = resolveColor(color);
+async function ensureHighlightStyles(wc) {
   await wc.executeJavaScript(`
     (function() {
       if (!document.getElementById('__vessel-highlight-styles')) {
@@ -1309,6 +1438,14 @@ async function highlightOnPage(wc, resolvedSelector, text, label, durationMs, co
         s.textContent = ${JSON.stringify(VESSEL_HIGHLIGHT_CSS)};
         document.head.appendChild(s);
       }
+    })()
+  `);
+}
+async function highlightOnPage(wc, resolvedSelector, text, label, durationMs, color) {
+  const c = resolveColor(color);
+  await ensureHighlightStyles(wc);
+  await wc.executeJavaScript(`
+    (function() {
       if (!window.__vesselHighlightLabelManager) {
         var overlap = function(a, b) {
           return a.left < b.right && a.right > b.left && a.top < b.bottom && a.bottom > b.top;
@@ -1438,7 +1575,6 @@ async function highlightOnPage(wc, resolvedSelector, text, label, durationMs, co
     return wc.executeJavaScript(`
       (function() {
         var searchText = (${JSON.stringify(text)} || '').trim();
-        var foldedSearchText = searchText.toLowerCase();
         var solidColor = ${JSON.stringify(c.solid)};
         var bgColor = ${JSON.stringify(c.bg)};
         var labelBg = ${JSON.stringify(c.label)};
@@ -1450,60 +1586,22 @@ async function highlightOnPage(wc, resolvedSelector, text, label, durationMs, co
         ${SKIP_TAGS_JS}
         ${CONTENT_ROOTS_JS}
         ${NAV_ANCESTORS_JS}
-
-        function collectMatches(root, limit) {
-          var matches = [];
-          var w = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, {
-            acceptNode: function(n) {
-              var p = n.parentElement;
-              if (!p) return NodeFilter.FILTER_REJECT;
-              if (SKIP_TAGS[p.tagName]) return NodeFilter.FILTER_REJECT;
-              if (p.closest('[data-vessel-highlight]')) return NodeFilter.FILTER_REJECT;
-              if (p.closest(NAV_ANCESTORS)) return NodeFilter.FILTER_REJECT;
-              var style = window.getComputedStyle(p);
-              if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') return NodeFilter.FILTER_REJECT;
-              if (p.offsetWidth === 0 && p.offsetHeight === 0) return NodeFilter.FILTER_REJECT;
-              return NodeFilter.FILTER_ACCEPT;
-            }
-          });
-          var n;
-          while ((n = w.nextNode())) {
-            var haystack = n.textContent || '';
-            var idx = haystack.indexOf(searchText);
-            if (idx === -1 && foldedSearchText) {
-              idx = haystack.toLowerCase().indexOf(foldedSearchText);
-            }
-            if (idx !== -1) {
-              matches.push({ node: n, idx: idx });
-              if (matches.length >= limit) break;
-            }
-          }
-          return matches;
-        }
+        ${TEXT_MATCH_HELPERS_JS}
 
         // First try: match inside main content area (skip nav/sidebar/captions)
-        var textNodes = contentRoot ? collectMatches(contentRoot, 20) : [];
+        var textMatches = contentRoot ? collectTextRangeMatches(contentRoot, searchText, 20) : [];
         // Fallback: if no matches in content area, search the whole body
-        if (textNodes.length === 0) {
-          textNodes = collectMatches(document.body, 20);
+        if (textMatches.length === 0) {
+          textMatches = collectTextRangeMatches(document.body, searchText, 20);
         }
         var count = 0;
         var firstMark = null;
-        for (var i = 0; i < textNodes.length; i++) {
-          var match = textNodes[i];
-          try {
-            var range = document.createRange();
-            range.setStart(match.node, match.idx);
-            range.setEnd(match.node, match.idx + searchText.length);
-            var mark = document.createElement('mark');
-            mark.className = '__vessel-highlight-text';
-            mark.style.setProperty('background', bgColor, 'important');
-            mark.style.setProperty('border-bottom-color', solidColor, 'important');
-            mark.setAttribute('data-vessel-highlight', 'true');
-            range.surroundContents(mark);
-            if (!firstMark) firstMark = mark;
+        for (var i = textMatches.length - 1; i >= 0; i--) {
+          var marks = applyTextRangeMatch(textMatches[i], solidColor, bgColor, searchText);
+          if (marks.length > 0) {
+            firstMark = marks[0];
             count++;
-          } catch (_e) {}
+          }
         }
         if (count === 0) return 'Text not found: ' + searchText.slice(0, 80);
         if (firstMark) firstMark.scrollIntoView({ behavior: 'smooth', block: 'center' });
@@ -1552,72 +1650,26 @@ async function highlightBatchOnPage(wc, entries) {
     color: resolveColor(e.color)
   }));
   if (serialized.length === 0) return;
+  await ensureHighlightStyles(wc);
   await wc.executeJavaScript(`
     (function() {
-      if (!document.getElementById('__vessel-highlight-styles')) {
-        var s = document.createElement('style');
-        s.id = '__vessel-highlight-styles';
-        s.textContent = ${JSON.stringify(VESSEL_HIGHLIGHT_CSS)};
-        document.head.appendChild(s);
-      }
       var entries = ${JSON.stringify(serialized)};
       ${SKIP_TAGS_JS}
       ${CONTENT_ROOTS_JS}
       ${NAV_ANCESTORS_JS}
-
-      function collectMatches(root, searchText, foldedSearchText, limit) {
-        var matches = [];
-        var w = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, {
-          acceptNode: function(n) {
-            var p = n.parentElement;
-            if (!p) return NodeFilter.FILTER_REJECT;
-            if (SKIP_TAGS[p.tagName]) return NodeFilter.FILTER_REJECT;
-            if (p.closest('[data-vessel-highlight]')) return NodeFilter.FILTER_REJECT;
-            if (p.closest(NAV_ANCESTORS)) return NodeFilter.FILTER_REJECT;
-            var style = window.getComputedStyle(p);
-            if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') return NodeFilter.FILTER_REJECT;
-            if (p.offsetWidth === 0 && p.offsetHeight === 0) return NodeFilter.FILTER_REJECT;
-            return NodeFilter.FILTER_ACCEPT;
-          }
-        });
-        var n;
-        while ((n = w.nextNode())) {
-          var haystack = n.textContent || '';
-          var idx = haystack.indexOf(searchText);
-          if (idx === -1 && foldedSearchText) {
-            idx = haystack.toLowerCase().indexOf(foldedSearchText);
-          }
-          if (idx !== -1) {
-            matches.push({ node: n, idx: idx });
-            if (matches.length >= limit) break;
-          }
-        }
-        return matches;
-      }
+      ${TEXT_MATCH_HELPERS_JS}
 
       for (var e = 0; e < entries.length; e++) {
         var entry = entries[e];
         var c = entry.color;
         if (entry.text) {
           var searchText = (entry.text || '').trim();
-          var foldedSearchText = searchText.toLowerCase();
-          var textNodes = contentRoot ? collectMatches(contentRoot, searchText, foldedSearchText, 20) : [];
-          if (textNodes.length === 0) {
-            textNodes = collectMatches(document.body, searchText, foldedSearchText, 20);
+          var textMatches = contentRoot ? collectTextRangeMatches(contentRoot, searchText, 20) : [];
+          if (textMatches.length === 0) {
+            textMatches = collectTextRangeMatches(document.body, searchText, 20);
           }
-          for (var i = 0; i < textNodes.length; i++) {
-            try {
-              var match = textNodes[i];
-              var range = document.createRange();
-              range.setStart(match.node, match.idx);
-              range.setEnd(match.node, match.idx + searchText.length);
-              var mark = document.createElement('mark');
-              mark.className = '__vessel-highlight-text';
-              mark.style.setProperty('background', c.bg, 'important');
-              mark.style.setProperty('border-bottom-color', c.solid, 'important');
-              mark.setAttribute('data-vessel-highlight', 'true');
-              range.surroundContents(mark);
-            } catch (_e) {}
+          for (var i = textMatches.length - 1; i >= 0; i--) {
+            applyTextRangeMatch(textMatches[i], c.solid, c.bg, searchText);
           }
         } else if (entry.selector) {
           try {
@@ -1704,6 +1756,8 @@ async function clearAllHighlightElements(wc) {
         el.style.removeProperty('outline');
         el.style.removeProperty('outline-offset');
       });
+      var style = document.getElementById('__vessel-highlight-styles');
+      if (style) style.remove();
       return true;
     })()
   `);
@@ -3210,7 +3264,8 @@ class TabManager {
       `(function() {
         var marks = document.querySelectorAll('mark.__vessel-highlight-text[data-vessel-highlight]');
         marks.forEach(function(m) {
-          if (m.textContent === ${JSON.stringify(text)}) {
+          var highlightText = m.getAttribute('data-vessel-highlight-text') || m.textContent;
+          if (highlightText === ${JSON.stringify(text)}) {
             var parent = m.parentNode;
             while (m.firstChild) parent.insertBefore(m.firstChild, m);
             m.remove();
@@ -12311,7 +12366,10 @@ async function captureLiveHighlightSnapshot(wc, savedHighlights = []) {
       const pageHighlights = Array.from(
         document.querySelectorAll("mark.__vessel-highlight-text[data-vessel-highlight]")
       ).map((mark) => {
-        const text = mark.textContent?.trim() || "";
+        const text =
+          mark.getAttribute("data-vessel-highlight-text")?.trim() ||
+          mark.textContent?.trim() ||
+          "";
         const style = window.getComputedStyle(mark);
         return {
           text,
@@ -12347,20 +12405,28 @@ function formatLiveSelectionSection(snapshot) {
   const sections = [];
   if (snapshot.activeSelection) {
     const preview = snapshot.activeSelection.length > 400 ? `${snapshot.activeSelection.slice(0, 397)}...` : snapshot.activeSelection;
-    sections.push(`## Active User Selection
-"${preview}"`);
+    sections.push(
+      `## Active User Selection
+The user currently has this text selected on screen:
+- "${preview}"`
+    );
   }
-  const unsavedHighlights = snapshot.pageHighlights.filter(
-    (highlight) => !highlight.persisted
-  );
-  if (unsavedHighlights.length > 0) {
-    const lines = unsavedHighlights.map((highlight) => {
+  if (snapshot.pageHighlights.length > 0) {
+    const lines = snapshot.pageHighlights.map((highlight) => {
       const preview = highlight.text.length > 180 ? `${highlight.text.slice(0, 177)}...` : highlight.text;
-      const color = highlight.color ? ` (${highlight.color})` : "";
-      return `- "${preview}"${color}`;
+      const details = [
+        highlight.persisted ? "saved" : "visible only",
+        highlight.color ? `color: ${highlight.color}` : ""
+      ].filter(Boolean);
+      return `- "${preview}"${details.length ? ` (${details.join(", ")})` : ""}`;
     });
-    sections.push(`## Unsaved Visible Highlights
-${lines.join("\n")}`);
+    sections.push(
+      [
+        "## Visible Highlights On Screen",
+        "These are the highlighted passages currently visible in the page. Treat this as authoritative before searching or inspecting:",
+        lines.join("\n")
+      ].join("\n")
+    );
   }
   return sections.length > 0 ? sections.join("\n\n") : null;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@quanta-intellect/vessel-browser",
   "mcpName": "io.github.unmodeled-tyler/vessel-browser",
-  "version": "0.1.84",
+  "version": "0.1.88",
   "description": "AI-native web browser runtime for autonomous agents with human supervision",
   "main": "./out/main/index.js",
   "bin": {