@vapi-ai/web 2.3.6 → 2.3.8

package/dist/vapi.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="node" />
 import type { ChatCompletionMessageParam } from 'openai/resources';
 import { DailyCall, DailyAdvancedConfig, DailyFactoryOptions, DailyParticipant, DailyVideoSendSettings } from '@daily-co/daily-js';
 import EventEmitter from 'events';
@@ -20,7 +19,27 @@ export interface SayMessage {
     interruptAssistantEnabled?: boolean;
 }
 type VapiClientToServerMessage = AddMessageMessage | ControlMessages | SayMessage;
-type VapiEventNames = 'call-end' | 'call-start' | 'volume-level' | 'speech-start' | 'speech-end' | 'message' | 'video' | 'error' | 'daily-participant-updated';
+type VapiEventNames = 'call-end' | 'call-start' | 'volume-level' | 'speech-start' | 'speech-end' | 'message' | 'video' | 'error' | 'camera-error' | 'network-quality-change' | 'network-connection' | 'daily-participant-updated' | 'call-start-progress' | 'call-start-success' | 'call-start-failed';
+interface CallStartProgressEvent {
+    stage: string;
+    status: 'started' | 'completed' | 'failed';
+    duration?: number;
+    timestamp: string;
+    metadata?: Record<string, any>;
+}
+interface CallStartSuccessEvent {
+    totalDuration: number;
+    callId?: string;
+    timestamp: string;
+}
+interface CallStartFailedEvent {
+    stage: string;
+    totalDuration: number;
+    error: string;
+    errorStack?: string;
+    timestamp: string;
+    context: Record<string, any>;
+}
 type VapiEventListeners = {
     'call-end': () => void;
     'call-start': () => void;
@@ -30,7 +49,13 @@ type VapiEventListeners = {
     video: (track: MediaStreamTrack) => void;
     message: (message: any) => void;
     error: (error: any) => void;
+    'camera-error': (error: any) => void;
+    'network-quality-change': (event: any) => void;
+    'network-connection': (event: any) => void;
     'daily-participant-updated': (participant: DailyParticipant) => void;
+    'call-start-progress': (event: CallStartProgressEvent) => void;
+    'call-start-success': (event: CallStartSuccessEvent) => void;
+    'call-start-failed': (event: CallStartFailedEvent) => void;
 };
 declare class VapiEventEmitter extends EventEmitter {
     on<E extends VapiEventNames>(event: E, listener: VapiEventListeners[E]): this;

package/dist/vapi.js

@@ -88,14 +88,46 @@ class Vapi extends VapiEventEmitter {
         return new Promise((resolve) => setTimeout(resolve, ms));
     }
     async start(assistant, assistantOverrides, squad, workflow, workflowOverrides) {
+        const startTime = Date.now();
+        // Input validation with detailed error messages
         if (!assistant && !squad && !workflow) {
-            throw new Error('Assistant or Squad or Workflow must be provided.');
+            const error = new Error('Assistant or Squad or Workflow must be provided.');
+            this.emit('error', {
+                type: 'validation-error',
+                stage: 'input-validation',
+                message: error.message,
+                timestamp: new Date().toISOString()
+            });
+            throw error;
         }
         if (this.started) {
+            this.emit('call-start-progress', {
+                stage: 'validation',
+                status: 'failed',
+                timestamp: new Date().toISOString(),
+                metadata: { reason: 'already-started' }
+            });
             return null;
         }
+        this.emit('call-start-progress', {
+            stage: 'initialization',
+            status: 'started',
+            timestamp: new Date().toISOString(),
+            metadata: {
+                hasAssistant: !!assistant,
+                hasSquad: !!squad,
+                hasWorkflow: !!workflow
+            }
+        });
         this.started = true;
         try {
+            // Stage 1: Create web call
+            this.emit('call-start-progress', {
+                stage: 'web-call-creation',
+                status: 'started',
+                timestamp: new Date().toISOString()
+            });
+            const webCallStartTime = Date.now();
             const webCall = (await client_1.client.call.callControllerCreateWebCall({
                 assistant: typeof assistant === 'string' ? undefined : assistant,
                 assistantId: typeof assistant === 'string' ? assistant : undefined,
@@ -106,16 +138,73 @@ class Vapi extends VapiEventEmitter {
                 workflowId: typeof workflow === 'string' ? workflow : undefined,
                 workflowOverrides,
             })).data;
+            const webCallDuration = Date.now() - webCallStartTime;
+            this.emit('call-start-progress', {
+                stage: 'web-call-creation',
+                status: 'completed',
+                duration: webCallDuration,
+                timestamp: new Date().toISOString(),
+                metadata: {
+                    callId: webCall?.id || 'unknown',
+                    videoRecordingEnabled: webCall?.artifactPlan?.videoRecordingEnabled ?? false,
+                    voiceProvider: webCall?.assistant?.voice?.provider || 'unknown'
+                }
+            });
             if (this.call) {
+                this.emit('call-start-progress', {
+                    stage: 'daily-call-object-creation',
+                    status: 'started',
+                    timestamp: new Date().toISOString(),
+                    metadata: { action: 'cleanup-existing' }
+                });
                 this.cleanup();
             }
             const isVideoRecordingEnabled = webCall?.artifactPlan?.videoRecordingEnabled ?? false;
             const isVideoEnabled = webCall?.assistant?.voice?.provider === 'tavus';
-            this.call = daily_js_1.default.createCallObject({
-                audioSource: this.dailyCallObject.audioSource ?? true,
-                videoSource: this.dailyCallObject.videoSource ?? isVideoRecordingEnabled,
-                dailyConfig: this.dailyCallConfig,
+            // Stage 2: Create Daily call object
+            this.emit('call-start-progress', {
+                stage: 'daily-call-object-creation',
+                status: 'started',
+                timestamp: new Date().toISOString(),
+                metadata: {
+                    audioSource: this.dailyCallObject.audioSource ?? true,
+                    videoSource: this.dailyCallObject.videoSource ?? isVideoRecordingEnabled,
+                    isVideoRecordingEnabled,
+                    isVideoEnabled
+                }
             });
+            const dailyCallStartTime = Date.now();
+            try {
+                this.call = daily_js_1.default.createCallObject({
+                    audioSource: this.dailyCallObject.audioSource ?? true,
+                    videoSource: this.dailyCallObject.videoSource ?? isVideoRecordingEnabled,
+                    dailyConfig: this.dailyCallConfig,
+                });
+                const dailyCallDuration = Date.now() - dailyCallStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'daily-call-object-creation',
+                    status: 'completed',
+                    duration: dailyCallDuration,
+                    timestamp: new Date().toISOString()
+                });
+            }
+            catch (error) {
+                const dailyCallDuration = Date.now() - dailyCallStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'daily-call-object-creation',
+                    status: 'failed',
+                    duration: dailyCallDuration,
+                    timestamp: new Date().toISOString(),
+                    metadata: { error: error?.toString() }
+                });
+                this.emit('error', {
+                    type: 'daily-call-object-creation-error',
+                    stage: 'daily-call-object-creation',
+                    error,
+                    timestamp: new Date().toISOString()
+                });
+                throw error;
+            }
             this.call.iframe()?.style.setProperty('display', 'none');
             this.call.on('left-meeting', () => {
                 this.emit('call-end');
@@ -139,7 +228,13 @@ class Vapi extends VapiEventEmitter {
                 }
             });
             this.call.on('camera-error', (error) => {
-                this.emit('error', error);
+                this.emit('camera-error', error);
+            });
+            this.call.on('network-quality-change', (event) => {
+                this.emit('network-quality-change', event);
+            });
+            this.call.on('network-connection', (event) => {
+                this.emit('network-connection', event);
             });
             this.call.on('track-started', async (e) => {
                 if (!e || !e.participant) {
@@ -176,35 +271,173 @@ class Vapi extends VapiEventEmitter {
                 }
                 destroyAudioPlayer(e.participant.session_id);
             });
-            // Allow mobile devices to finish processing the microphone permissions
-            // request before joining the call and playing the assistant's audio
-            if (this.isMobileDevice()) {
+            // Stage 3: Mobile device handling and permissions
+            const isMobile = this.isMobileDevice();
+            this.emit('call-start-progress', {
+                stage: 'mobile-permissions',
+                status: 'started',
+                timestamp: new Date().toISOString(),
+                metadata: { isMobile }
+            });
+            if (isMobile) {
+                const mobileWaitStartTime = Date.now();
                 await this.sleep(1000);
+                const mobileWaitDuration = Date.now() - mobileWaitStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'mobile-permissions',
+                    status: 'completed',
+                    duration: mobileWaitDuration,
+                    timestamp: new Date().toISOString(),
+                    metadata: { action: 'permissions-wait' }
+                });
             }
-            await this.call.join({
-                // @ts-expect-error This exists
-                url: webCall.webCallUrl,
-                subscribeToTracksAutomatically: false,
+            else {
+                this.emit('call-start-progress', {
+                    stage: 'mobile-permissions',
+                    status: 'completed',
+                    timestamp: new Date().toISOString(),
+                    metadata: { action: 'skipped-not-mobile' }
+                });
+            }
+            // Stage 4: Join the call
+            this.emit('call-start-progress', {
+                stage: 'daily-call-join',
+                status: 'started',
+                timestamp: new Date().toISOString()
             });
+            const joinStartTime = Date.now();
+            try {
+                await this.call.join({
+                    // @ts-expect-error This exists
+                    url: webCall.webCallUrl,
+                    subscribeToTracksAutomatically: false,
+                });
+                const joinDuration = Date.now() - joinStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'daily-call-join',
+                    status: 'completed',
+                    duration: joinDuration,
+                    timestamp: new Date().toISOString()
+                });
+            }
+            catch (error) {
+                const joinDuration = Date.now() - joinStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'daily-call-join',
+                    status: 'failed',
+                    duration: joinDuration,
+                    timestamp: new Date().toISOString(),
+                    metadata: { error: error?.toString() }
+                });
+                this.emit('error', {
+                    type: 'daily-call-join-error',
+                    stage: 'daily-call-join',
+                    error,
+                    duration: joinDuration,
+                    timestamp: new Date().toISOString()
+                });
+                throw error;
+            }
+            // Stage 5: Video recording setup (if enabled)
             if (isVideoRecordingEnabled) {
-                const recordingRequestedTime = new Date().getTime();
-                this.call.startRecording({
-                    width: 1280,
-                    height: 720,
-                    backgroundColor: '#FF1F2D3D',
-                    layout: {
-                        preset: 'default',
-                    },
+                this.emit('call-start-progress', {
+                    stage: 'video-recording-setup',
+                    status: 'started',
+                    timestamp: new Date().toISOString()
                 });
-                this.call.on('recording-started', () => {
-                    this.send({
-                        type: 'control',
-                        control: 'say-first-message',
-                        videoRecordingStartDelaySeconds: (new Date().getTime() - recordingRequestedTime) / 1000,
+                const recordingRequestedTime = new Date().getTime();
+                const recordingStartTime = Date.now();
+                try {
+                    this.call.startRecording({
+                        width: 1280,
+                        height: 720,
+                        backgroundColor: '#FF1F2D3D',
+                        layout: {
+                            preset: 'default',
+                        },
+                    });
+                    const recordingSetupDuration = Date.now() - recordingStartTime;
+                    this.emit('call-start-progress', {
+                        stage: 'video-recording-setup',
+                        status: 'completed',
+                        duration: recordingSetupDuration,
+                        timestamp: new Date().toISOString()
+                    });
+                    this.call.on('recording-started', () => {
+                        const totalRecordingDelay = (new Date().getTime() - recordingRequestedTime) / 1000;
+                        this.emit('call-start-progress', {
+                            stage: 'video-recording-started',
+                            status: 'completed',
+                            timestamp: new Date().toISOString(),
+                            metadata: { delaySeconds: totalRecordingDelay }
+                        });
+                        this.send({
+                            type: 'control',
+                            control: 'say-first-message',
+                            videoRecordingStartDelaySeconds: totalRecordingDelay,
+                        });
+                    });
+                }
+                catch (error) {
+                    const recordingSetupDuration = Date.now() - recordingStartTime;
+                    this.emit('call-start-progress', {
+                        stage: 'video-recording-setup',
+                        status: 'failed',
+                        duration: recordingSetupDuration,
+                        timestamp: new Date().toISOString(),
+                        metadata: { error: error?.toString() }
+                    });
+                    this.emit('error', {
+                        type: 'video-recording-setup-error',
+                        stage: 'video-recording-setup',
+                        error,
+                        timestamp: new Date().toISOString()
                     });
+                    // Don't throw here, video recording is optional
+                }
+            }
+            else {
+                this.emit('call-start-progress', {
+                    stage: 'video-recording-setup',
+                    status: 'completed',
+                    timestamp: new Date().toISOString(),
+                    metadata: { action: 'skipped-not-enabled' }
+                });
+            }
+            // Stage 6: Audio level observer setup
+            this.emit('call-start-progress', {
+                stage: 'audio-observer-setup',
+                status: 'started',
+                timestamp: new Date().toISOString()
+            });
+            const audioObserverStartTime = Date.now();
+            try {
+                this.call.startRemoteParticipantsAudioLevelObserver(100);
+                const audioObserverDuration = Date.now() - audioObserverStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'audio-observer-setup',
+                    status: 'completed',
+                    duration: audioObserverDuration,
+                    timestamp: new Date().toISOString()
+                });
+            }
+            catch (error) {
+                const audioObserverDuration = Date.now() - audioObserverStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'audio-observer-setup',
+                    status: 'failed',
+                    duration: audioObserverDuration,
+                    timestamp: new Date().toISOString(),
+                    metadata: { error: error?.toString() }
+                });
+                this.emit('error', {
+                    type: 'audio-observer-setup-error',
+                    stage: 'audio-observer-setup',
+                    error,
+                    timestamp: new Date().toISOString()
                 });
+                // Don't throw here, this is non-critical
             }
-            this.call.startRemoteParticipantsAudioLevelObserver(100);
             this.call.on('remote-participants-audio-level', (e) => {
                 if (e)
                     this.handleRemoteParticipantsAudioLevel(e);
@@ -226,18 +459,83 @@ class Vapi extends VapiEventEmitter {
                     });
                 }
             });
-            this.call.updateInputSettings({
-                audio: {
-                    processor: {
-                        type: 'noise-cancellation',
+            // Stage 7: Audio processing setup
+            this.emit('call-start-progress', {
+                stage: 'audio-processing-setup',
+                status: 'started',
+                timestamp: new Date().toISOString()
+            });
+            const audioProcessingStartTime = Date.now();
+            try {
+                this.call.updateInputSettings({
+                    audio: {
+                        processor: {
+                            type: 'noise-cancellation',
+                        },
                     },
-                },
+                });
+                const audioProcessingDuration = Date.now() - audioProcessingStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'audio-processing-setup',
+                    status: 'completed',
+                    duration: audioProcessingDuration,
+                    timestamp: new Date().toISOString()
+                });
+            }
+            catch (error) {
+                const audioProcessingDuration = Date.now() - audioProcessingStartTime;
+                this.emit('call-start-progress', {
+                    stage: 'audio-processing-setup',
+                    status: 'failed',
+                    duration: audioProcessingDuration,
+                    timestamp: new Date().toISOString(),
+                    metadata: { error: error?.toString() }
+                });
+                this.emit('error', {
+                    type: 'audio-processing-setup-error',
+                    stage: 'audio-processing-setup',
+                    error,
+                    timestamp: new Date().toISOString()
+                });
+                // Don't throw here, this is non-critical
+            }
+            const totalDuration = Date.now() - startTime;
+            this.emit('call-start-success', {
+                totalDuration,
+                callId: webCall?.id || 'unknown',
+                timestamp: new Date().toISOString()
             });
             return webCall;
         }
         catch (e) {
-            console.error(e);
-            this.emit('error', e);
+            const totalDuration = Date.now() - startTime;
+            this.emit('call-start-failed', {
+                stage: 'unknown',
+                totalDuration,
+                error: e?.toString() || 'Unknown error occurred',
+                errorStack: e instanceof Error ? e.stack : 'No stack trace available',
+                timestamp: new Date().toISOString(),
+                context: {
+                    hasAssistant: !!assistant,
+                    hasSquad: !!squad,
+                    hasWorkflow: !!workflow,
+                    isMobile: this.isMobileDevice()
+                }
+            });
+            // Also emit the generic error event for backward compatibility
+            this.emit('error', {
+                type: 'start-method-error',
+                stage: 'unknown',
+                error: e,
+                totalDuration,
+                timestamp: new Date().toISOString(),
+                context: {
+                    hasAssistant: !!assistant,
+                    hasSquad: !!squad,
+                    hasWorkflow: !!workflow,
+                    isMobile: this.isMobileDevice()
+                }
+            });
             this.cleanup();
             return null;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vapi-ai/web",
-  "version": "2.3.6",
+  "version": "2.3.8",
   "description": "",
   "main": "dist/vapi.js",
   "types": "dist/vapi.d.ts",
@@ -10,7 +10,11 @@
     "start": "npm run generate-api && npm run build && node dist/vapi.js",
     "generate-api": "./generate-api.sh",
     "update": "./update.sh",
-    "generate-local-build": "npm install && npm run build && npm pack"
+    "generate-local-build": "npm install && npm run build && npm pack",
+    "test:example": "npm run pack:local && cd example && npm install && npm run build",
+    "pack:local": "./scripts/build-latest.sh",
+    "clean-builds": "rm -f vapi-ai-web-*.tgz && echo '🧹 Cleaned up all build tarballs'",
+    "dev:example": "npm run pack:local && cd example && npm install && npm run dev"
   },
   "repository": {
     "type": "git",
@@ -22,17 +26,20 @@
     "url": "https://github.com/VapiAI/web/issues"
   },
   "homepage": "https://github.com/VapiAI/web#readme",
+  "engines": {
+    "node": ">=18.0.0"
+  },
   "dependencies": {
-    "@daily-co/daily-js": "^0.79.0",
+    "@daily-co/daily-js": "^0.80.0",
     "events": "^3.3.0"
   },
   "devDependencies": {
-    "@types/jest": "^29.5.12",
-    "@types/node": "^20.6.0",
-    "jest": "^29.7.0",
-    "openai": "^4.24.1",
-    "swagger-typescript-api": "^13.0.3",
-    "ts-jest": "^29.1.2",
+    "@types/jest": "^30.0.0",
+    "@types/node": "^24.0.4",
+    "jest": "^30.0.3",
+    "openai": "^5.7.0",
+    "swagger-typescript-api": "^13.2.7",
+    "ts-jest": "^29.4.0",
     "ts-node": "^10.9.2"
   }
 }