♻️ Refactor Large index.ts File (639 lines) #8

New issue

Closed

opened 2025-10-10 09:10:36 +02:00 by jack · 0 comments

jack commented

2025-10-10 09:10:36 +02:00

Owner

🎯 Code Quality Issue

Problem

The index.ts file is 639 lines long, making it:

😓 Hard to navigate
🐛 Difficult to test
🔄 Challenging to maintain
📚 Poor separation of concerns

Proposed Structure

src/
├── index.ts (main entry, ~100 lines)
├── tools/
│   ├── navigation.ts (open_page, navigate_tab, etc.)
│   ├── interaction.ts (click, fill_form, etc.)
│   ├── extraction.ts (get_content, extract_tables, etc.)
│   ├── screenshots.ts (screenshot tool)
│   └── tabs.ts (tab management)
├── services/
│   └── browser-service.ts (existing)
└── types/
    └── tools.ts (tool definitions)

Example Refactor

// src/tools/navigation.ts
export const navigationTools: Tool[] = [
  {
    name: "open_page",
    description: "...",
    inputSchema: { ... }
  },
  // ...
];

export async function handleNavigationTool(
  name: string,
  args: any,
  browserService: BrowserService
) {
  switch (name) {
    case "open_page":
      return await browserService.openPage(...);
    // ...
  }
}

// src/index.ts (simplified)
import { navigationTools, handleNavigationTool } from './tools/navigation.js';
import { interactionTools, handleInteractionTool } from './tools/interaction.js';

const allTools = [
  ...navigationTools,
  ...interactionTools,
  ...extractionTools,
  // ...
];

server.setRequestHandler(CallToolRequestSchema, async (request) => {
  // Route to appropriate handler
  if (isNavigationTool(request.params.name)) {
    return handleNavigationTool(...);
  }
  // ...
});

Benefits

📁 Better organization
🧪 Easier to test
🔍 Improved readability
♻️ Code reuse

🤖 Generated with Claude Code

## 🎯 Code Quality Issue ### Problem The `index.ts` file is 639 lines long, making it: - 😓 Hard to navigate - 🐛 Difficult to test - 🔄 Challenging to maintain - 📚 Poor separation of concerns ### Proposed Structure ``` src/ ├── index.ts (main entry, ~100 lines) ├── tools/ │ ├── navigation.ts (open_page, navigate_tab, etc.) │ ├── interaction.ts (click, fill_form, etc.) │ ├── extraction.ts (get_content, extract_tables, etc.) │ ├── screenshots.ts (screenshot tool) │ └── tabs.ts (tab management) ├── services/ │ └── browser-service.ts (existing) └── types/ └── tools.ts (tool definitions) ``` #### Example Refactor ```typescript // src/tools/navigation.ts export const navigationTools: Tool[] = [ { name: "open_page", description: "...", inputSchema: { ... } }, // ... ]; export async function handleNavigationTool( name: string, args: any, browserService: BrowserService ) { switch (name) { case "open_page": return await browserService.openPage(...); // ... } } ``` ```typescript // src/index.ts (simplified) import { navigationTools, handleNavigationTool } from './tools/navigation.js'; import { interactionTools, handleInteractionTool } from './tools/interaction.js'; const allTools = [ ...navigationTools, ...interactionTools, ...extractionTools, // ... ]; server.setRequestHandler(CallToolRequestSchema, async (request) => { // Route to appropriate handler if (isNavigationTool(request.params.name)) { return handleNavigationTool(...); } // ... }); ``` ### Benefits - 📁 Better organization - 🧪 Easier to test - 🔍 Improved readability - ♻️ Code reuse 🤖 Generated with [Claude Code](https://claude.com/claude-code)

jack referenced this issue from a commit

2025-10-10 09:40:28 +02:00

♻️ Refactor: Split large index.ts into modular architecture

jack closed this issue

2025-10-10 09:48:20 +02:00

No labels

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

customable-mcp/browser-mcp#8

No description provided.

Rows
Columns