Debug Lightning Web Components

• For debugging on Android, use Chrome DevTools (Google)
• For debugging on iOS, use Safari Web Inspector (Apple)

Desktop users use Salesforce in a standard web browser. For developers, this makes using the development tools built into those browsers the best way to experience the component code the same way their users do. It also makes it straightforward to use, examine, and debug code while it’s under development. It all happens in the same tool, a standard web browser.

In contrast, mobile users don’t use Salesforce in a browser, desktop or mobile. Instead, they use Salesforce, including the custom components you build, from within a Salesforce mobile app. Your LWCs run inside a web view, which is embedded in the mobile app. Web views don’t have debugging tools built into them, so the process of debugging them is different.

The solution to this challenge is remote debugging. Remote debugging lets you use the exact same development and debugging tools you’re used to—Chrome DevTools or Safari Web Inspector running on your development system—and connect them to the web view running inside a separate mobile app. Remote debugging works whether you’re running your code in the app on a virtual device, or a physical device. While that all might sound complicated, it’s actually simple once you understand the procedure.