# Testing the TargetAI JavaScript SDK
## Prerequisites
1. **Built SDK**: Make sure you've built the SDK first:
```bash
npm run build
```
2. **Server Running**: Your TargetAI server should be running and accessible
3. **HTTPS or localhost**: Modern browsers require HTTPS for microphone access (or localhost for development)
## Testing Methods
### Method 1: Using the Included Test Page (Recommended)
The easiest way to test the SDK is using the included test page:
1. **Open the test page**:
```bash
# Open in your browser
open test/test.html
# Or on Windows:
start test/test.html
```
2. **Configure the test**:
- Enter your server URL (e.g., `http://localhost:8000`)
- Enter your agent UUID
- Select response types (text/voice)
- Optionally enable raw audio samples
3. **Test the connection**:
- Click "Start Call"
- Grant microphone permissions when prompted
- Watch the log for connection events
- Try sending text messages
- Speak to test voice input
### Method 2: Simple HTTP Server
If opening the HTML file directly doesn't work (due to CORS issues), serve it with a simple HTTP server:
```bash
# Using Python 3
python -m http.server 8080
# Using Node.js (install http-server first: npm install -g http-server)
http-server -p 8080
# Using PHP
php -S localhost:8080
```
Then open `http://localhost:8080/test/test.html` in your browser.
### Method 3: Custom HTML Page
Create your own test page:
```html
My TargetAI Test
```
## Common Issues and Solutions
### 1. Microphone Permission Denied
- **Problem**: Browser blocks microphone access
- **Solution**:
- Use HTTPS or localhost
- Click the microphone icon in browser address bar
- Check browser settings for microphone permissions
### 2. CORS Errors
- **Problem**: Browser blocks requests due to CORS policy
- **Solution**:
- Serve files through HTTP server (not file://)
- Configure your TargetAI server to allow CORS
- Use proper domain/localhost
### 3. WebRTC Connection Failed
- **Problem**: Cannot establish WebRTC connection
- **Solution**:
- Check if your server is running
- Verify server URL is correct
- Check firewall settings
- Ensure TURN server is accessible
### 4. Module Import Errors
- **Problem**: Cannot import ES modules
- **Solution**:
- Use `type="module"` in script tag
- Serve via HTTP server (not file://)
- Use correct relative path to dist/index.esm.js
## Testing Checklist
- [ ] Build completes without errors
- [ ] Test page loads without console errors
- [ ] Can grant microphone permissions
- [ ] "Start Call" connects successfully
- [ ] Can send text messages
- [ ] Can receive agent responses
- [ ] Voice input is recognized
- [ ] Agent voice output plays
- [ ] "Stop Call" disconnects cleanly
- [ ] No memory leaks after multiple calls
## Debug Mode
Enable additional logging by opening browser console (F12) and setting:
```javascript
// Enable debug mode
localStorage.setItem('DEBUG', 'targetai:*');
```
## Network Tab Debugging
1. Open DevTools (F12)
2. Go to Network tab
3. Start a call
4. Look for:
- `/run/voice/offer` POST request
- WebRTC STUN/TURN traffic
- WebSocket connections (if any)
## Console Debugging
Watch the browser console for:
- `[TargetAI]` log messages
- `[WebRTCManager]` connection events
- `[AudioManager]` audio setup logs
- `[MessageProcessor]` message processing
## Performance Testing
Monitor in DevTools:
- Memory usage (shouldn't grow after stopping calls)
- CPU usage during calls
- Network bandwidth for audio streams
- Audio latency and quality