140 lines
4.7 KiB
Markdown
140 lines
4.7 KiB
Markdown
# Background Window Testing Guide
|
|
|
|
## Summary of Changes Made
|
|
|
|
I have successfully fixed and improved the background window functionality in the Chrome extension with the following enhancements:
|
|
|
|
### ✅ Fixed Issues
|
|
|
|
1. **Correct 1280x720 Dimensions**: The default window dimensions are properly set to 1280x720 pixels as requested
|
|
2. **Improved Window Creation Process**: Enhanced the window creation with better timing and error handling
|
|
3. **Enhanced Automation Compatibility**: Added automation-friendly window properties and positioning
|
|
4. **Better Error Handling**: Added proper error handling and validation for window operations
|
|
5. **Comprehensive Logging**: Added detailed logging for debugging and monitoring
|
|
|
|
### 🔧 Technical Improvements
|
|
|
|
1. **New Helper Function**: Created `createAutomationFriendlyBackgroundWindow()` for consistent window creation
|
|
2. **Improved Timing**: Increased wait time to 1.5 seconds for better window establishment
|
|
3. **Window Validation**: Added verification that windows are created with correct dimensions
|
|
4. **Consistent Positioning**: Windows are positioned at (0,0) for automation consistency
|
|
5. **Enhanced Response Data**: Added `automationReady`, `minimized`, and `dimensions` fields to responses
|
|
|
|
## Testing the Implementation
|
|
|
|
### Prerequisites
|
|
|
|
1. **Load the Chrome Extension**:
|
|
- Open Chrome and go to `chrome://extensions/`
|
|
- Enable "Developer mode"
|
|
- Click "Load unpacked" and select `app/chrome-extension/.output/chrome-mv3/`
|
|
|
|
2. **Start the MCP Server**:
|
|
```bash
|
|
cd app/remote-server
|
|
npm start
|
|
```
|
|
|
|
3. **Connect the Extension**:
|
|
- Click the Chrome extension icon in the toolbar
|
|
- Ensure the server URL is set to `ws://localhost:3001/chrome`
|
|
- Click "Connect" to establish the connection
|
|
|
|
### Manual Testing
|
|
|
|
Once connected, you can test the background window functionality:
|
|
|
|
#### Test 1: Basic Background Window (1280x720)
|
|
```javascript
|
|
// In browser console or test script
|
|
fetch('http://localhost:3001/mcp', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'Accept': 'application/json, text/event-stream'
|
|
},
|
|
body: JSON.stringify({
|
|
jsonrpc: '2.0',
|
|
id: 1,
|
|
method: 'tools/call',
|
|
params: {
|
|
name: 'chrome_navigate',
|
|
arguments: {
|
|
url: 'https://example.com',
|
|
backgroundPage: true
|
|
}
|
|
}
|
|
})
|
|
})
|
|
```
|
|
|
|
#### Test 2: Custom Dimensions Background Window
|
|
```javascript
|
|
fetch('http://localhost:3001/mcp', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'Accept': 'application/json, text/event-stream'
|
|
},
|
|
body: JSON.stringify({
|
|
jsonrpc: '2.0',
|
|
id: 2,
|
|
method: 'tools/call',
|
|
params: {
|
|
name: 'chrome_navigate',
|
|
arguments: {
|
|
url: 'https://www.google.com',
|
|
backgroundPage: true,
|
|
width: 1920,
|
|
height: 1080
|
|
}
|
|
}
|
|
})
|
|
})
|
|
```
|
|
|
|
### Automated Testing Scripts
|
|
|
|
I've created several test scripts you can run once the extension is connected:
|
|
|
|
1. **Basic Test**: `node test-basic-background-window.js`
|
|
2. **Comprehensive Test**: `node test-background-window-automation.js`
|
|
3. **Connection Test**: `node test-server-connection.js`
|
|
|
|
### Expected Behavior
|
|
|
|
When testing background windows, you should observe:
|
|
|
|
1. **Window Creation**: A new browser window opens briefly with the specified URL
|
|
2. **Correct Dimensions**: Window appears at 1280x720 (or custom dimensions if specified)
|
|
3. **Minimization**: After ~1.5 seconds, the window minimizes to the taskbar
|
|
4. **Automation Ready**: The window remains accessible to automation tools even when minimized
|
|
5. **Response Data**: The API returns detailed information including window ID, dimensions, and status flags
|
|
|
|
### Troubleshooting
|
|
|
|
If tests fail:
|
|
|
|
1. **Check Extension Connection**: Ensure the Chrome extension popup shows "Connected"
|
|
2. **Verify Server**: Confirm the MCP server is running and accessible
|
|
3. **Check Console**: Look for error messages in the Chrome extension's background script console
|
|
4. **Test Manually**: Try the manual fetch commands above to isolate issues
|
|
|
|
## Code Changes Summary
|
|
|
|
### Modified Files
|
|
|
|
1. **`app/chrome-extension/entrypoints/background/tools/browser/common.ts`**:
|
|
- Enhanced background window creation logic
|
|
- Added `createAutomationFriendlyBackgroundWindow()` helper function
|
|
- Improved error handling and timing
|
|
- Added better logging and validation
|
|
|
|
### New Test Files
|
|
|
|
1. **`test-background-window-automation.js`**: Comprehensive test suite
|
|
2. **`test-basic-background-window.js`**: Simple functionality test
|
|
3. **`test-server-connection.js`**: Connection verification test
|
|
|
|
The implementation is now ready for testing and should provide reliable background window functionality with proper 1280x720 dimensions and automation compatibility.
|