Menu
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.
243
Open Chrome, navigate to the debug host page for your keyboard, and press F12. Back in the debug host page, select the appropriate device from the mobile emulation toolbar, then press F5 to reload and enable the touch mode.
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. Simply pick your preferred deviceāor switch devicesāand debug instantly.
Update: š Virtual keyboard support is deprecated in Chrome 68+; this answer no longer works.
You can view the standard keyboard for the Nexus 5X device for the portrait or landscape view:
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.
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
72
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
