HIDDevice

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The HIDDevice interface of the WebHID API represents a HID Device. It provides properties for accessing information about the device, methods for opening and closing the connection, and the sending and receiving of reports.

Properties

This interface also inherits properties from EventTarget.

HIDDevice.openedRead only

Returns a boolean, true if the device has an open connection.

HIDDevice.vendorIdRead only

Returns the vendorId of the HID device.

HIDDevice.productIdRead only

Returns the productID of the HID device.

HIDDevice.productNameRead only

Returns a string containing the product name of the HID device.

HIDDevice.collectionsRead only

Returns an array of report formats for the HID device.

Event handlers

HIDDevice.oninputreport

An event handler that fires when a report is sent from the device.

Methods

This interface also inherits methods from EventTarget.

HIDDevice.open()

Opens a connection to this HID device, and returns a Promise which resolves once the connection has been successful.

HIDDevice.close()

Closes the connection to this HID device, and returns a Promise which resolves once the connection has been closed.

HIDDevice.sendReport()

Sends an output report to this HID Device, and returns a Promise which resolves once the report has been sent.

HIDDevice.sendFeatureReport()

Sends a feature report to this HID device, and returns a Promise which resolves once the report has been sent.

HIDDevice.receiveFeatureReport()

Receives a feature report from this HID device in the form of a Promise which resolves with a DataView. This allows typed access to the contents of this message.

Examples

The following example demonstrates listening for an inputreport event that will allow the application to detect which button is pressed on a Joy-Con Right device.

device.addEventListener("inputreport", event => {
  const { data, device, reportId } = event;

  // Handle only the Joy-Con Right device and a specific report ID.
  if (device.productId !== 0x2007 && reportId !== 0x3f) return;

  const value = data.getUint8(0);
  if (value === 0) return;

  const someButtons = { 1: "A", 2: "X", 4: "B", 8: "Y" };
  console.log(`User pressed button ${someButtons[value]}.`);
});

In the following example sendFeatureReport is used to make a device blink.

const reportId = 1;
for (let i = 0; i < 10; i++) {
  // Turn off
  await device.sendFeatureReport(reportId, Uint32Array.from([0, 0]));
  await waitFor(100);
  // Turn on
  await device.sendFeatureReport(reportId, Uint32Array.from([512, 0]));
  await waitFor(100);
}

You can see more examples, and live demos in the article Connecting to uncommon HID devices.

Specifications

Specification
WebHID API
# dom-hiddevice

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
HIDDevice
89
89
No
No
75
No
No
No
No
No
No
No
close
89
89
No
No
75
No
No
No
No
No
No
No
collections
89
89
No
No
75
No
No
No
No
No
No
No
oninputreport
89
89
No
No
75
No
No
No
No
No
No
No
open
89
89
No
No
75
No
No
No
No
No
No
No
opened
89
89
No
No
75
No
No
No
No
No
No
No
productId
89
89
No
No
75
No
No
No
No
No
No
No
productName
89
89
No
No
75
No
No
No
No
No
No
No
receiveFeatureReport
89
89
No
No
75
No
No
No
No
No
No
No
sendFeatureReport
89
89
No
No
75
No
No
No
No
No
No
No
sendReport
89
89
No
No
75
No
No
No
No
No
No
No
vendorId
89
89
No
No
75
No
No
No
No
No
No
No

© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HIDDevice