CLAUDE.mdjavascript

shared-browsing-claude CLAUDE.md

This system enables interactive browsing with Claude Code. Users can share webpage content and ask questions directly in their browser with automatic Claude Code integration.

View Source

Shared Browsing Context for Claude Code

What is this?

This system enables interactive browsing with Claude Code. Users can share webpage content and ask questions directly in their browser with automatic Claude Code integration.

Two Modes Available

🚀 DEVELOP Branch - Interactive Mode (Recommended)

  1. User visits a webpage and presses Ctrl+Shift+C
  2. Beautiful popup appears with page title and URL
  3. User types a question about the page content
  4. Firefox extension sends content + question to Python API server
  5. API server creates session-specific context file: api/session_context_[timestamp].json
  6. Server automatically calls Claude Code with enhanced prompt
  7. You receive instruction to read the specific session context file
  8. You analyze the full page content and respond
  9. Response appears in browser popup - no window switching!

📝 MAIN Branch - Context Sharing Mode

  1. User presses Ctrl+Shift+C on webpage
  2. Content shared to api/context_history.json
  3. User manually asks questions in Claude Code terminal

Your task (Develop Branch)

When called by the API server, you will receive a prompt like:

Please read the context file at /path/to/session_context_[timestamp].json to understand the current webpage content and context.

The file contains webpage content and conversation history. Look for entries with "page_content" field that contains the actual webpage text.

User Question: [user's specific question]

Please analyze the webpage content from the context file and answer based on that information.

Always:

  • Read the specified session context file first
  • Analyze the full page_content field(s)
  • Answer based on actual webpage content, not assumptions
  • Be specific and reference actual content from the page
  • Provide helpful, detailed responses

Context file format

The JSON file contains entries with:

  • timestamp: When content was shared
  • type: "user_message" or "user_question" or "claude_response"
  • content: User's message/question
  • url: Page URL
  • page_content: Full extracted webpage text
  • domain: Website domain

Example workflow

  1. User shares page content → gets saved to context file
  2. User asks "What is this page about?" → you read context file and analyze the page_content
  3. You provide detailed answer based on actual page content

Always read the context file first before answering questions!