21

I'm trying to test which keyboard type comes up by default for certain inputs on iOS and Android. Is there a way to bring up the on screen keyboard in Chrome devtools phone simulator?

So far I have tested the iOS version of my website by running the xcode simulator and pointing to my website but it would be really convenient to use devtools.

Art
  • 2,836
  • 4
  • 17
  • 34
Javed Ahamed
  • 2,804
  • 6
  • 32
  • 41
  • 1
    Possible duplicate of [Google Chrome Mobile Emulator: How to show on screen keyboard](https://stackoverflow.com/questions/29637425/google-chrome-mobile-emulator-how-to-show-on-screen-keyboard) – alain.janinm Jan 24 '19 at 10:05

1 Answers1

41

Update: Virtual keyboard support is deprecated in Chrome 68+; this answer no longer works.

Original answer

You can view the standard keyboard for the Nexus 5X device for the portrait or landscape view:

DevTools Nexus 5X Keyboard

However, you can't interact with it, nor does it change based on the context it is called from. I found by inspecting DevTools that it is simply an image file overlayed onto an SVG. There's nothing smart going on with these profiles. It's just useful to look at how the app responds to the reduced space.

DevTools Keyboard Inspect

To test the proper behaviour of keyboards with context, I would just recommend using XCode and Android emulators, or better still use real devices.

See: Test Responsive and Device-specific Viewports

kjhughes
  • 106,133
  • 27
  • 181
  • 240
Gideon Pyzer
  • 22,610
  • 7
  • 62
  • 68
  • 2
    Do not use the Android Emulator for debugging. It is missing some key GL stuff used for rendering which makes it off-by-default and you can't really get Chrome in them easily. The stock browser that is also in them, are from the shipping time of that version of Android. So it could easily be very out-of-date and therefor your application may not work properly inside of that as it would an actual device with an updated system stack. – Garbee Jul 15 '16 at 12:52
  • @Garbee Yeah, that makes sense. Debugging on a real device would be the best option in this case. – Gideon Pyzer Jul 15 '16 at 12:55
  • 5
    This doesn't seem to be an option anymore? Clicking the rotate icon doesn't bring up a menu, it simply rotates. Or did I miss something? – Steve Bennett Mar 13 '19 at 21:59
  • 3
    I can only see the keyboard option when selecting the Nexus 5 as my device. All other devices simply rotate upon clicking the button. – Darian Brown May 20 '19 at 02:33
  • 2
    Using Chrome 75 in 2019 and the keyboard (through the Screen options icon) seems to be only available when choosing the Nexus 5 indeed. This virtual keyboard is not active though. Can't click the letters to input something. – Jérôme Oudoul Jul 30 '19 at 08:14
  • getting the same issue . keyboard does not react to typing. more over to not reacting to type="number" input types (i would expect to see the numpad ) – aristotaly May 03 '21 at 10:09
  • Useless! this feature needs an immediate improvement – Hasan Tezcan Jun 17 '21 at 08:23
  • We can see keyboard for Nexus 5 as well – Pulkit Aggarwal Jul 06 '21 at 12:16