Troubleshooting Twilio's Javascript Video SDK can vary based on a number of factors including the SDK version used, client browser and audio hardware, and more. This guide includes a checklist to help you begin troubleshooting Javascript Video SDK issues, as well as a list of recent media improvement features.
Notice: Twilio Support highly recommends reading through our Getting Started on Javascript SDK and Javascript Best Practices guides before reading the rest of this document, as these typically help solve the majority of the issues developers will encounter.
Troubleshooting Checklist
- Build Prerequisites: Ensure your build system is inline with our Javascript Prerequisites.
- Recent SDK Version: Keep your application current by using the latest version. As mentioned in the Platform SDK Support Policy, we recommend updating the SDK at a bare minimum once a quarter.
- Changelog: Read through the Known Issues, New Features, and Bug Fixes in the most recent Javascript SDK Changelog as we often will add new functionalities to the SDK, which may solve an issue a developer and/or end-user may encounter.
- API Documentation: Please ensure that you are reading the correct API documentation for the same version as the SDK version being deployed. Once the Latest Javascript API Documentation link is expanded, the version number can be changed in the URL to match.
- Supported Browsers: Often end-users will be using unsupported browsers, therefore it is important for developers to inform their end-users of our Supported Browsers requirements.
- Browser Common Issues: Our Common Issues guide covers the various behaviors the browsers exhibit.
- Audio: As apps built with our Javascript SDK can be utilized by Desktop and Mobile Browsers, deployed on a wide variety of devices, by a plethora of manufacturers, Javascript apps may encounter audio issues. Please review the “Recent Javascript Media Improvement Features” below.
- WebView: Please see WebView on iOS version requirements, and be aware that WebView on Android is unsupported, and the flag isSupported will return false if you use the JS SDK on Android WebView.
- Physical Devices: Don’t trust simulators! As the Javascript SDK is using WebRTC technology and depends heavily on the capabilities of the device, often simulators and actual devices have inconsistent behavior, therefore if possible, test on physical devices.
- Reproduce with the Quickstart: Twilio offers a Javascript Video Quickstart which allows developers to clone the repository to reproduce the error to share with Twilio engineers via twilio-video.js GitHub Issues.
- Reproduce with the Ahoy! Demo App: Twilio offers an Ahoy! Video React Demo App which is a great way to check if an issue can be replicated with our out of the box Twilio React App. If the issue cannot be reproduced, that indicates that the issue lies within the app in development, or it’s a unique device, or environment issue.
- Diagnostics: Video Insights in the console can provide information about a Javascript participant, as long as it hasn’t been disabled in the Javascript SDK’s connect options (insights is enabled by default). Twilio’s Hosted Video Diagnostic App or a developer's white labeled Diagnostic App can be used for testing via Desktop or Mobile Browsers.
- Preflight API: The Preflight API can be used directly in Twilio Video applications to detect issues before a Participant joins a Video Room.
- Room Monitor: Room Monitor is a Javascript SDK that can be used in the same app as your Javascript Video SDK. This is an excellent tool to monitor real time issues with any participant who is in the same group room as a Javascript participant.
- Debug Log: The JavaScript Logger with LogLevel set to debug allows you to capture debug logs generated by the Twilio Video JS SDK in real-time so that you can monitor your frontend applications and see how they behave in production.
- Support submission: Before submitting a support request, please first look at the “Issues” section on our twilio-video.js GitHub Issues GitHub repository to find the potentially same issue and potential resolution.
Recent Javascript Media Improvement Features
- isMuted and refreshInactiveMedia: In the 2.26.0 changelog, we released new features isMuted and refreshInactiveMedia in an effort to provide better control and events of the local media tracks.
- Auto-switch default audio input devices: In the 2.25.0 changelog, a new feature was added that preserves audio continuity in situations where end-users change the default audio input device.
- Krisp: In the 2.23.0 changelog, we released Krisp Noise Cancellation, a custom audio plugin utilizing Krisp's audio processing solution called NoiseCancellationAudioDevice.
- Adaptive Simulcast: In the 2.19.0 changelog, we released Adaptive Simulcast for Javascript which, when enabled in group rooms of 3 or more participants, may significantly reduce bandwidth consumption, thereby improving overall media quality.