117

I used to be able to uncheck a checkbox that said Emulate touch screen in the Emulation/Sensors-panel so that I could see a mouse pointer when using responsive mode. This panel is now gone, and the new sensors-panel doesn't have this setting.

This makes it impossible to use the responsive mode, as I have no pointer and no control where I touch/click (who designed this feature?!). How can I see a pointer/mouse when I use responsive mode in newer Chrome?

10 Answers 10

228

Apparently, you're supposed to see a circle as your mouse when using responsive mode. I have never seen that, even using several different machines, so the feature seems broken.

Updated for v72: guide v72


Older

However, right after posting this question, I finally stumbled upon a solution. In version 50, the solution is now to press the three dots to the right in responsive mode, and select Show device type. This gives you a new dropdown next to the sizes etc., in which Desktop or Mobile (no touch) can be selected to use a normal mouse pointer (disable touch emulation) while using responsive mode.

Guide

12
  • 9
    Thanks, still relevant in 2017, this bug was driving me nuts!
    – Steve
    Mar 2, 2017 at 12:54
  • 16
    In my version of Chrome on macOS Sierra, it's labelled "add device type" Jul 15, 2017 at 2:45
  • @TimothyZorn Thank you!
    – jwanglof
    Aug 22, 2017 at 17:29
  • watch out - there are two 'three dots' icons, one in the elements panel and the other (the one you want) in the main browser window. Especially if you have a really wide screen and you have devtools docked to the left it's easy to miss the second one! Jul 15, 2018 at 10:36
  • In my version of Chrome on Win 10 it is also called "Add device type" but when I click it I see a dropdown menu added with the word "mobile" - but the menu is greyed out and disabled. Turns out, I had first selected "iPhone 6/7/8". If I change that to "Responsive", then the menu becomes active. I do not understand why Google would make it so there is no way you can use your mouse pointer while emulating an iPhone. Aug 8, 2018 at 2:37
55

Go to: Control Panel > Intel Graphics Settings > Display > General Settings. Then change Quantization Range to Full Range. Solution from here.

Image

Thank @Funktr0n.

8
  • 12
    This fixed my problem, but why?
    – Warren
    Aug 2, 2017 at 2:54
  • The screenshot was really helpful. Appreciate it. Jan 3, 2018 at 19:58
  • Worked! Thank you so much! Feb 22, 2018 at 8:59
  • 1
    I use my laptop at home and the cursor appears just fine, but when I plug it into a different monitor at work the cursor disappears. This answer fixed the problem! I assume this is a strange monitor issue.
    – Reactgular
    Mar 15, 2018 at 17:22
  • 2
    keeps getting this every time i replug in the monitor :/ after applying settings again it works again (althoug it still seems to be onfull range before) Apr 5, 2018 at 11:28
31

In Chrome Version 73.0.3683.103 and macOS Mojave you have to toggle add device type button in the menu of browser window in dev mode to see the device type dropdown: enter image description here

And the select typo of device you need: enter image description here

2
  • 2
    This works for me on Mac with latest Chrome (v99 as of March 2022)
    – Drenai
    Mar 25, 2022 at 14:48
  • 2
    Thank-you, still relevant in v109.x (Feb 2023) Feb 4 at 15:02
10

The answer is pretty straightforward. Chrome gives you an option to create a custom device. Follow these steps: 1. Open dev tools 2. Press F1 to get into settings 3. go to devices 4. Add a custom device there.

The IMPORTANT THING: When you create a custom device, choose the option "Mobile (No Touch)". That's it, cursor would be visible when you select this device for emulation.

1
8

This should also help.

  1. Open the mouse control panel.
  2. Select the Pointer Options tab in the Mouse Properties window.
  3. Then enable Display pointer trails option.
  4. In case you don't like or are getting annoyed, like me, due to the trailer. Move the slider to the Short position and the trailer becomes very short.
0
7

Press Ctrl + Shift + C while the mouse is over the page in order to turn "Select an element in the page to inspect it" mode on then turn it back off using the icon and not the shortcut. Your cursor is now visible :)

enter image description here

Another way is to disable touch simulation by selecting no touch in "Emulated Devices" (in devtools settings):

enter image description here

Note that you may have to close and reopen the tab.

1
  • 1
    The second part of this answer seems to be ok, but I want to retain the width-sliders and not have a fixed size device. Thanks anyways. :)
    – codepleb
    Oct 27, 2021 at 13:14
4

Warning: this is only a quick hack, not a fix

If you right click over the emulated device picture you'll be able to keep the pointer visible so you'll at least see where you're clicking.

enter image description here

Hopefully this will get resolved soon.

1
  • 1
    I love the "hackiness" of this solution!
    – Gásten
    Jul 11, 2018 at 12:22
3

It appears the non-existent touch cursor in Device Mode is an actual issue, and it's being tracked here

1
2

What solved my issue was setting the refresh rate of my monitor to 60Hz progressive! I don't know how it got set on 59Hz interlaced.

enter image description here

Added: What ACTUALLY solved my problem was swaping the connection from HDMI to DisplayPort! I dont know weather it was the cable problem or the port. Finally the cursor is there and working!

0

This is a Display Drive Issue, For a simple solution press and hold SHIFT key and a cursor will be visible on device.

BUT do click on link only WITHOUT holding SHIFT [else it will open that link in new window]

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.