Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

inspecting mobile web page with chrome devtools results in blank screen

Debugging a web page running in Chrome on Android (Galaxy S8) via the USB connection in the latest version of the Chrome desktop browser is not working. Attempting to inspect web pages running on the mobile device results in a blank page.

When I inspect the blank page that appears in the desktop Chrome browser, I get the following error:

Uncaught TypeError: InspectorFrontendHost.isUnderTest is not a function
    at Object.Host.isUnderTest (inspector.js:930)
    at Main.Main._gotPreferences (inspector.js:8301)
    at DevToolsAPIImpl.embedderMessageAck (devtools_compatibility.js:33)
    at <anonymous>:1:13
like image 683
Cavan Wagg Avatar asked Jan 09 '18 02:01

Cavan Wagg


People also ask

Why Chrome DevTools is inaccurate for mobile testing?

Chrome's developer tools offer an emulator, not an actual phone or tablet, to simulate your website on any given mobile device. This emulation is based solely on changing the screen resolution to match the dimensions of the device. Consequently, Chrome's display of your website on mobile may be completely inaccurate.

Can you use Chrome inspect on mobile?

You can use Google Chrome on your Android device to quickly inspect the elements. It allows you to remotely debug any element on your Android device from your desktop and laptop.

Why inspect is not working in Chrome?

Try updating. Barring that try removing it entirely and reinstalling. If those don't work, try chrome canary until the problem is resolved.

Can you use DevTools on mobile?

Developer Tools are pre-installed in every Safari (on iOS) and Chrome (on Android) browser. There's no need to acquire the right devices, plug in the USB, or modify any settings.


1 Answers

Same problem here. But I found a solution to my case. Before trying the solution I'm gonna present here, tried restarting chrome both desktop and android, restarting phone. Disabling some experimental flags on about://flags cause I was suspecting on some of those. But none of these steps solved.

Then I see the Chrome on Android was v65 and my Desktop was v64.

So:

  1. Removed Chrome version 64.0.3282.186-1 with dpkg -r google-chrome-stable
  2. Downloaded latest version from https://www.google.com/chrome/
  3. ..and installed Chrome version 65.0.3325.181-1 with dpkg -i google-chrome-stable_current_amd64.deb

Before:

# dpkg -l | grep chrome
ii  google-chrome-stable                        64.0.3282.186-1                                     amd64        The web browser from Google

After:

# dpkg -l | grep chrome
ii  google-chrome-stable                        65.0.3325.181-1                                     amd64        The web browser from Google

Problem solved! Now it is inspecting android tabs nicely!

like image 135
Hudson Santos Avatar answered Nov 15 '22 00:11

Hudson Santos