# How does Discourse detect/infer virtual keyboards?

**URL:** https://meta.discourse.org/t/how-does-discourse-detect-infer-virtual-keyboards/214950
**Category:** Development
**Created:** [January 15, 2022, 2:32pm UTC](https://meta.discourse.org/t/how-does-discourse-detect-infer-virtual-keyboards/214950 "2022-01-15T14:32:25Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![Dannii](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dannii/32/129087_2.png) [@Dannii](https://meta.discourse.org/u/Dannii)
#### Post date: [January 15, 2022, 2:32pm UTC](https://meta.discourse.org/t/how-does-discourse-detect-infer-virtual-keyboards/214950/1 "2022-01-15T14:32:26Z")

</div>

I have a non-Discourse related project in which I’d really like to be able to detect whether a mobile browser’s virtual keyboard is active or not. I just realised, after days of thinking and looking for solutions, that the Discourse forum I visit every day has a really smooth interface for mobile virtual keyboards. It’s great how reliably it detects the keyboard and changes the reply box to fill the remaining space, only to switch back to normal mode if you close the keyboard.

I haven’t found any other easy solutions for detecting the virtual keyboard (most of Stack Overflow just says not to try), but whatever Discourse does seems to work well. The codebase is large and complex though, and I don’t know where to look in it for the relevant code. So I was hoping someone who’s familiar with Discourse’s mobile interface would be able to either point me to the code, or could give an explanation of what heuristics Discourse uses?

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [January 15, 2022, 3:30pm UTC](https://meta.discourse.org/t/how-does-discourse-detect-infer-virtual-keyboards/214950/2 "2022-01-15T15:30:39Z")

</div>

We use the visual viewport API: [VisualViewport - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/Visual_Viewport_API).

You can search the JS files in our repo code for visualViewport. There are some quirks in iOS due to the placement of the composer, so we use some more complex overrides there, the relevant file is `app/assets/javascripts/discourse/app/lib/safari-hacks.js`.

---

<div class="post-metadata">

### Author: ![Dannii](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dannii/32/129087_2.png) [@Dannii](https://meta.discourse.org/u/Dannii)
#### Post date: [January 15, 2022, 10:50pm UTC](https://meta.discourse.org/t/how-does-discourse-detect-infer-virtual-keyboards/214950/3 "2022-01-15T22:50:08Z")

</div>

Thank you for those pointers!
