https://github.com/hendriku/iOSKeyboardSupport.js

Vanilla workaround for the problem that arrow keys from the iPad keyboard aren't recognized in web events.
https://github.com/hendriku/iOSKeyboardSupport.js

ios ipad iphone javascript keyboard-events safari

Last synced: 8 days ago
JSON representation

Vanilla workaround for the problem that arrow keys from the iPad keyboard aren't recognized in web events.

• Host: GitHub
• URL: https://github.com/hendriku/iOSKeyboardSupport.js
• Owner: hendriku
• Archived: true
• Created: 2019-03-21T08:37:33.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2019-08-30T08:40:40.000Z (about 5 years ago)
• Last Synced: 2024-08-01T13:34:11.512Z (3 months ago)
• Topics: ios, ipad, iphone, javascript, keyboard-events, safari
• Language: JavaScript
• Homepage: https://hendriku.github.io/iOSKeyboardSupport.js/
• Size: 4.88 KB
• Stars: 1
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 🍨 iOSKeyboardSupport.js

## NOTE: APPLE FIXED THIS ISSUE WITH iOS 13.1

Vanilla workaround for the problem that arrow keys from the iPad keyboard aren't recognized in web events.

## Problem Domain

Somehow Safari Mobile for iOS seems to have big problems to translate some keyboard keys like e.g. arrow keys to a javascript `KeyboardEvent`.

Some keys are mentioned as `Unidentified` others as `Dead`. The problem reproduces on bluetooth keyboards as also on the newest _SmartKeyboard_ from Apple.

As it is really sad to have such an expensive device without the ability to work professionally in modern web apps, I created a mapping for some keys.

Everytime an iOS keyboard event is being fired the propagation of this event is immediately stopped and an artificial event (being the one you actually want) is getting fired.

**However, this is just a workaround. A clean and sustainable solution has to come from Apple.**

## Usage

Simply add the script to your head import. Done.

```

    

            

            ...

    

    ...

```

## Key Support

This script currently maps the arrow keys. Feel free to reach in a pull request if you'd add more mappings to the script.

| iOS Keyboard event.key | Real event.key | Real event.keyCode  |

| ---------------------- | -------------- | ------------------- |

| UIKeyInputLeftArrow    | ArrowLeft      | 37                  |

| UIKeyInputUpArrow      | ArrowUp        | 38                  |

| UIKeyInputRightArrow   | ArrowRight     | 39                  |

| UIKeyInputDownArrow    | ArrowDown      | 40                  |

## Test it

Visit the demo site at [https://hendriku.github.io/iOSKeyboardSupport.js/](https://hendriku.github.io/iOSKeyboardSupport.js/).

## Notice

I don't want to put any license here because I want the barrier to use this in every domain to be as tiny as possible.

Nevertheless don't hold me liable for anything but I'd be feeling honored if you mention my name when you use the script.