Skip to content

DEBUG_GUIDE.md

Latest commit

 

History

History
139 lines (108 loc) · 5.05 KB

DEBUG_GUIDE.md

File metadata and controls

139 lines (108 loc) · 5.05 KB

DearLLM Extension Debug Guide

This guide will help you debug your Chrome extension to see if it's working properly.

How to Debug the Extension

1. Load the Extension in Chrome

  1. Open Chrome and go to chrome://extensions/
  2. Enable "Developer mode" (toggle in top right)
  3. Click "Load unpacked" and select your extension folder
  4. The extension should appear in your extensions list

2. Set Up Your API Key

  1. Click on the extension icon in your toolbar
  2. Click "Options" or go to the extension's options page
  3. Enter your OpenAI API key (starts with sk-)
  4. Click "Save"
  5. Check the browser console for debug logs showing the key was saved

3. View Debug Logs

Background Script Logs

  • Go to chrome://extensions/
  • Find your extension and click "Details"
  • Click "Service Worker" under "Inspect views"
  • This opens DevTools for the background script
  • Look for logs starting with [DearLLM Background]

Content Script Logs

  • Go to LinkedIn (linkedin.com)
  • Open DevTools (F12 or right-click → Inspect)
  • Go to the Console tab
  • Look for logs starting with [DearLLM Content]

Options Page Logs

  • Open the extension options page
  • Open DevTools (F12)
  • Look for logs starting with [DearLLM Options]

4. What to Look For

Normal Operation Logs:

[DearLLM Background] 2024-01-15T10:30:00.000Z: Background service worker started
[DearLLM Content] 2024-01-15T10:30:01.000Z: Starting content script
[DearLLM Content] 2024-01-15T10:30:01.000Z: Feed element found, setting up observer
[DearLLM Content] 2024-01-15T10:30:02.000Z: Scanning for posts
[DearLLM Content] 2024-01-15T10:30:02.000Z: Processing new post 1/5
[DearLLM Content] 2024-01-15T10:30:02.000Z: Extracting text from post element
[DearLLM Content] 2024-01-15T10:30:02.000Z: Text extracted from post
[DearLLM Content] 2024-01-15T10:30:02.000Z: Analyzing text for AI patterns
[DearLLM Content] 2024-01-15T10:30:02.000Z: Text flagged as AI due to word count
[DearLLM Content] 2024-01-15T10:30:02.000Z: Post looks like AI, sending to background script
[DearLLM Background] 2024-01-15T10:30:02.000Z: Message received from content script
[DearLLM Background] 2024-01-15T10:30:02.000Z: API key found, generating prompt
[DearLLM Background] 2024-01-15T10:30:02.000Z: Starting prompt generation
[DearLLM Background] 2024-01-15T10:30:02.000Z: Cache miss, calling OpenAI API
[DearLLM Background] 2024-01-15T10:30:03.000Z: OpenAI API response received
[DearLLM Background] 2024-01-15T10:30:03.000Z: Prompt generated successfully
[DearLLM Background] 2024-01-15T10:30:03.000Z: Sending prompt response to content script
[DearLLM Content] 2024-01-15T10:30:03.000Z: Received response from background script
[DearLLM Content] 2024-01-15T10:30:03.000Z: Building banner with prompt
[DearLLM Content] 2024-01-15T10:30:03.000Z: Injecting banner into post
[DearLLM Content] 2024-01-15T10:30:03.000Z: Banner injected successfully

Common Issues and Solutions:

1. "Missing API key" error:

  • Check options page logs to see if key was saved
  • Verify the key starts with sk-
  • Try saving the key again

2. "Feed element not found":

  • This is normal on some LinkedIn pages
  • The script will retry automatically
  • Check if you're on the main LinkedIn feed page

3. "OpenAI API error":

  • Check your API key is valid
  • Verify you have credits in your OpenAI account
  • Check the specific error message in the logs

4. No logs appearing:

  • Make sure the extension is enabled
  • Try refreshing the page
  • Check if the content script is running by looking for the [DearLLM Content] logs

5. Testing the Extension

  1. Test API Key Setup:

    • Go to extension options
    • Enter a valid OpenAI API key
    • Check console for "API key saved successfully" message

  2. Test Content Detection:

    • Go to LinkedIn feed
    • Look for posts with >120 words or containing words like "leverage", "synergy"
    • Check console for "Text flagged as AI" messages

  3. Test Banner Injection:

    • Find a post that triggers AI detection
    • Look for a banner appearing above the post
    • Check console for "Banner injected successfully" message

6. Troubleshooting

Extension not loading:

  • Check chrome://extensions/ for errors
  • Verify all files are present in the extension folder
  • Check manifest.json syntax

No banners appearing:

  • Check if posts are being detected as AI (look for "Text flagged as AI" logs)
  • Verify API key is set and working
  • Check for OpenAI API errors in background script logs

Banners appearing on wrong posts:

  • The AI detection is based on word count and common phrases
  • You can adjust the detection logic in contentScript.js

7. Debug Commands

You can also add temporary debug commands to the browser console:

// Check if extension is loaded
chrome.runtime.getManifest()

// Check storage for API key
chrome.storage.local.get("openai_api_key", console.log)

// Test message passing
chrome.runtime.sendMessage({action: "reversePrompt", text: "test"}, console.log)

This debug logging will help you track exactly what's happening at each step of the extension's operation!