WebHID API
==========

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

A Human Interface Device (HID) is a type of device that takes input from or provides output to humans. It also refers to the HID protocol, a standard for bi-directional communication between a host and a device that is designed to simplify the installation procedure. The HID protocol was originally developed for USB devices but has since been implemented over many other protocols, including Bluetooth.

Interfaces
----------

`HID`

Provides methods for connecting to HID devices, listing attached HID devices and event handlers for connected HID devices.

`HIDDevice`

Represents an HID device. It's possible for a single physical device to be represented by multiple `HIDDevice` objects.

`HIDInputReportEvent`

Passed to `HIDDevice.inputreport_event` when an input report is received from any associated HID device.

`HIDConnectionEvent`

Passed to `HID` `connect` and `disconnect` events when a device is connected or disconnected.

Examples
--------

You can connect to a device with the `requestDevice()` method. In this case, we select from all the available devices.


```js
const device = await navigator.hid.requestDevice({ filters: [] });
// A popup titled `... wants to connect to a HID Device` with `Cancel` and `Connect` buttons will show up with a device list to select from.
// Select one and click on `Connect` button. Then the device will be an array with the selected device in it.
```


We can retrieve all the devices the website has been granted access to previously and log the device names to the console.


```js
let devices = await navigator.hid.getDevices();
devices.forEach((device) => {
  console.log(`HID: ${device.productName}`);
});
```


We can register event listeners for disconnection of any HID devices.


```js
navigator.hid.addEventListener("disconnect", (event) => {
  console.log(`HID disconnected: ${event.device.productName}`);
  console.dir(event);
});
// For example, when my connected keyboard gets disconnected, the log in the console will show:
// HID disconnected: USB Keyboard
// {
// bubbles: false
// cancelBubble: false
// cancelable: false
// composed: false
// currentTarget: HID {onconnect: null, ondisconnect: null}
// defaultPrevented: false
// device: HIDDevice {oninputreport: null, opened: false, vendorId: 6700, productId: 11555, productName: "USB Keyboard", …}
// eventPhase: 0
// isTrusted: true
// path: []
// returnValue: true
// srcElement: HID {onconnect: null, ondisconnect: null}
// target: HID {onconnect: null, ondisconnect: null}
// timeStamp: 18176.600000023842
// type: "disconnect"
// }

// The event above is an instance of the HIDConnectionEvent interface.
```

Specifications
--------------

| Specification |
| --- |
| WebHID API # dom-hid |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.