Quick Chrome Extension Installation Guide

Step-by-Step Installation

1. Open Chrome Extensions Page

• Open Google Chrome
• Go to chrome://extensions/ in the address bar
• Or click Chrome menu → More Tools → Extensions

2. Enable Developer Mode

• Toggle the "Developer mode" switch in the top-right corner

3. Load the Extension (IMPORTANT PATH INFO)

The chrome-extension folder is inside your ForeclosureAI project directory, NOT in Downloads.

Option A: If you're running this on Replit:

1. First, download the extension files:
   • Look for the file foreclosure-ai-chrome-extension-fixed.tar.gz in your project root
   • Download this file to your computer
   • Extract it (double-click on Mac/Windows or use tar -xzf filename.tar.gz on Linux)
   • This creates a chrome-extension folder on your local machine
2. In Chrome:
   • Click "Load unpacked"
   • Navigate to the extracted folder containing manifest.json
   • Select the folder and click "Select Folder"

Alternative - Manual Download:

1. In Replit, right-click on the chrome-extension folder → Download as ZIP
2. Extract the downloaded ZIP file on your computer
3. Use the extracted folder in Chrome's "Load unpacked" option

Option B: If you have the project locally on your computer:

1. Click "Load unpacked"
2. Navigate to your ForeclosureAI project directory (where you have the code)
3. Look for the chrome-extension/ folder (it should be at the same level as client/, server/, etc.)
4. Select the chrome-extension folder and click "Select Folder"

The correct folder structure should look like:

YourProject/
├── chrome-extension/     ← This is what you need to select
│   ├── manifest.json
│   ├── popup.html
│   ├── popup.js
│   ├── content.js
│   └── background.js
├── client/
├── server/
└── other files...

4. Verify Installation

• The "ForeclosureAI Property Analyzer" should appear in your extensions list
• Toggle it ON if it's not already enabled
• Click the puzzle piece icon in Chrome toolbar
• Pin the ForeclosureAI extension so it's always visible

5. Configure Connection

• Click the ForeclosureAI extension icon
• If you see "Disconnected", click the settings gear (⚙️)
• Enter your ForeclosureAI server URL:
  • For Replit: https://your-replit-app-name.replit.app
  • For local: http://localhost:5000
• The status should change to "Connected"

Downloading Extension from Replit

If you're using Replit and need to get the extension files to your local computer:

1. In Replit:

   • Open your ForeclosureAI project
   • In the file explorer, find the chrome-extension folder
   • Right-click on the chrome-extension folder
   • Select "Download as ZIP"

2. On Your Computer:

   • Extract the downloaded ZIP file
   • Remember where you extracted it
   • Use this location when loading the extension in Chrome

3. Alternative - Individual Files:

   • You can also copy each file individually from Replit
   • Create a local chrome-extension folder
   • Copy the contents of each file (manifest.json, popup.html, etc.)
   • Save them in your local chrome-extension folder

Troubleshooting

"This extension is not from Chrome Web Store" warning:

• This is normal for development extensions
• Click "Keep" or "Load anyway"

Extension not loading:

• Make sure you selected the correct folder containing manifest.json
• Check that all required files are present
• Verify no syntax errors in manifest.json

Can't find the chrome-extension folder:

• The folder is in your ForeclosureAI project root directory
• It's NOT in your browser downloads
• It's at the same level as your client/, server/, and other project folders

Connection issues:

• Make sure your ForeclosureAI server is running
• Check the server URL in extension settings
• For Replit, use the full replit.app URL, not localhost

Quick Test

Once installed:

1. Go to zillow.com or redfin.com
2. Navigate to any property listing
3. Click the ForeclosureAI extension icon
4. Click "Analyze Current Property"
5. You should see analysis results

The extension is now ready to use with your ForeclosureAI platform!