Google Chrome shows gray circle cursor

google-chrome, google-chrome-devtools

Solution

Nov 29th, 2017 Update:

Quick Update brought to you by @Howdy_McGee.

Chrome 62 you have to Add Device Type, there's no longer an option for Show Device Type.

Why is this happening?

As Randy Hall points out below "This cursor indicates a "touch", such as your finger, for emulating touch events in (the) Chrome browser."

July 20th, 2017 Update: (version 59.0.3071.115) Just checking in again, looks like the below is still valid even through a bunch of Chrome updates. They have changed the wording of `Show device type` to `Add device type`. I've changed the wording below, but the image does not reflect the change.

They have also changed the way the `device type` settings work, explained below.

Once in responsive mode (via `F12`, then `ctrl + shift + m`) you will need to select the settings section indicated by the 3 grey circles, then select `Add device type`. Once you do this, a new drop down will appear next to the dimensions area, select `Mobile (no touch)`. I imagine they did this so that you don't have to keep it on desktop and adjust the `user agent type` to a mobile device as I've described below.

What do the Device Types mean?

As of today (July 20th, 2017), the same settings for `device type` exist (as shown in the image above), but they work a bit differently than previously before:

Mobile: Now scales the content on the page when resizing the window (to accurately simulate pixel density on a mobile device). The circle that replaces your mouse, simulates a screen touch action when clicking (full fledged mobile development / testing).

Mobile (no touch): Also scales the content on the page when resizing the window, but continues to use your regular mouse cursor for your click actions.

Desktop: Does not scale content, uses regular mouse cursor (full fledged desktop development / testing).

Desktop (touch): Also does not scale content, but replaces your regular mouse cursor with a circle that will simulate screen touches on click.

But I still want to emulate a specific mobile device...

There is still a way to override the user-agent with this `Mobile (no touch)` setting set. When you're looking at your console (brought up via `F12`), you'll see the 3 vertical circles there next to the `console` tab, click them and bring up Network Conditions. Within this section you'll see that `User agent` is set to `Select Automatically`, just turn this off and use the drop-down to change to the user-agent you want to emulate as. This will allow you to emulate as a specific mobile device.

Problem

Original source