Improve highlight tool and add relative time to tabs and history data (#7)

* Improve highlight tool and add relative time to tabs and history data

* Update README.md

Co-authored-by: Copilot <[email protected]>

---------

Co-authored-by: Copilot <[email protected]>

Author: eyalzh

README.md

@@ -1,6 +1,6 @@
 # Browser Control MCP
 
-An MCP server paired with a browser extension that enables LLM clients, such as Claude Desktop, to control the user's local browser (e.g. Firefox).
+An MCP server paired with a browser extension that enables LLM clients, such as Claude Desktop, to control the user's local browser (Firefox).
 
 ## Features
 
@@ -17,11 +17,20 @@ to select browser tabs in the MCP client itself (e.g. Claude) and load their con
 
 ## Example use-cases:
 
+
+### Tab management
 - *"Close all non-work related tabs in my browser."*
 - *"Rearrange tabs in my browser in an order that makes sense."*
+- *"Close all tabs in my browser that haven't been accessed within the past 24 hours"*
+
+### Browser history search
 - *"Help me find an article in my browser history about the Milford track in NZ."*
+- *"Open all the articles about AI that I visited during the last week, up to 10 articles, avoid duplications."*
+
+### Browsing and research 
 - *"Open hackernews in my browser, then open the top story, read it, also read the comments. Do the comments agree with the story?"*
-- *"In my browser, use Google Scholar to search for papers about L-theanine in the last 3 years. Open the 3 most cited works."*
+- *"In my browser, use Google Scholar to search for papers about L-theanine in the last 3 years. Open the 3 most cited papers. Read them and summarize them for me."*
+- *"Use google search in my browser to look for flower shops. Open the 10 most relevant results. Show me a table of each flower shop with location and opening hours."*
 
 ## Installation
 

common/extension-messages.ts

@@ -14,6 +14,7 @@ export interface BrowserTab {
   id?: number;
   url?: string;
   title?: string;
+  lastAccessed?: number;
 }
 
 export interface TabsExtensionMessage extends ExtensionMessageBase {

firefox-extension/background.ts

@@ -230,6 +230,9 @@ function initWsClient(port: number, secret: string) {
 
     // If there are results, highlight them
     if (findResults.count > 0) {
+      // But first, activate the tab. In firefox, this would also enable
+      // auto-scrolling to the highlighted result.
+      await browser.tabs.update(tabId, { active: true });
       browser.find.highlightResults({
         tabId,
       });

mcp-server/package-lock.json

@@ -12,13 +12,14 @@
   "license": "MIT",
   "description": "Browser Control MCP Server",
   "dependencies": {
+    "@browser-control-mcp/common": "../common",
     "@modelcontextprotocol/sdk": "^1.7.0",
+    "dayjs": "^1.11.13",
     "readline": "^1.3.0",
-    "ws": "^8.18.1",
-    "@browser-control-mcp/common": "../common"
+    "ws": "^8.18.1"
   },
   "devDependencies": {
     "@types/ws": "^8.18.0",
     "typescript": "^5.8.2"
   }
-}
+}

mcp-server/package.json

@@ -5,6 +5,10 @@ import {
 import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
 import { z } from "zod";
 import { BrowserAPI } from "./browser-api";
+import dayjs from "dayjs";
+import relativeTime from "dayjs/plugin/relativeTime";
+
+dayjs.extend(relativeTime);
 
 const mcpServer = new McpServer({
   name: "BrowserControl",
@@ -52,10 +56,16 @@ mcpServer.tool(
     const openTabs = await browserApi.getTabList();
     if (openTabs) {
       return {
-        content: openTabs.map((tab) => ({
-          type: "text",
-          text: `tab id=${tab.id}, tab url=${tab.url}, tab title=${tab.title}`,
-        })),
+        content: openTabs.map((tab) => {
+          let lastAccessed = "unknown";
+          if (tab.lastAccessed) {
+            lastAccessed = dayjs(tab.lastAccessed).fromNow(); // LLM-friendly time ago
+          }
+          return {
+            type: "text",
+            text: `tab id=${tab.id}, tab url=${tab.url}, tab title=${tab.title}, last accessed=${lastAccessed}`,
+          };
+        }),
       };
     } else {
       return {
@@ -76,9 +86,13 @@ mcpServer.tool(
     if (browserHistory) {
       return {
         content: browserHistory.map((item) => {
+          let lastVisited = "unknown";
+          if (item.lastVisitTime) {
+            lastVisited = dayjs(item.lastVisitTime).fromNow(); // LLM-friendly time ago
+          }
           return {
             type: "text",
-            text: `url=${item.url}, title="${item.title}", lastVisitTime=${item.lastVisitTime}`,
+            text: `url=${item.url}, title="${item.title}", lastVisitTime=${lastVisited}`,
           };
         }),
       };
@@ -160,7 +174,6 @@ mcpServer.tool(
   }
 );
 
-
 mcpServer.resource(
   "open-tab-contents",
   new ResourceTemplate("browser://tab/{tabId}/content", {
@@ -178,8 +191,11 @@ mcpServer.resource(
   async (uri, { tabId }) => {
     const content = await browserApi.getTabContent(Number(tabId));
     const listOfLinks =
-      content?.links.map((link: { text: string; url: string }) => `${link.text}: ${link.url}`).join("\n") ??
-      "";
+      content?.links
+        .map(
+          (link: { text: string; url: string }) => `${link.text}: ${link.url}`
+        )
+        .join("\n") ?? "";
     const fullText = content?.fullText ?? "";
     return {
       contents: [