From 9d9bfbcad54368f3b2d2dfec2c01fb65d7f4b201 Mon Sep 17 00:00:00 2001 From: Joseph Medley Date: Fri, 19 Feb 2021 14:44:25 -0800 Subject: [PATCH 01/15] Add Serial interface and its members. --- .../en-us/web/api/serial/getports/index.html | 85 +++++++++++++ files/en-us/web/api/serial/index.html | 112 ++++++++++++++++++ .../en-us/web/api/serial/onconnect/index.html | 71 +++++++++++ .../web/api/serial/ondisconnect/index.html | 71 +++++++++++ .../web/api/serial/requestport/index.html | 99 ++++++++++++++++ 5 files changed, 438 insertions(+) create mode 100644 files/en-us/web/api/serial/getports/index.html create mode 100644 files/en-us/web/api/serial/index.html create mode 100644 files/en-us/web/api/serial/onconnect/index.html create mode 100644 files/en-us/web/api/serial/ondisconnect/index.html create mode 100644 files/en-us/web/api/serial/requestport/index.html diff --git a/files/en-us/web/api/serial/getports/index.html b/files/en-us/web/api/serial/getports/index.html new file mode 100644 index 000000000000000..ba254b0012e5c06 --- /dev/null +++ b/files/en-us/web/api/serial/getports/index.html @@ -0,0 +1,85 @@ +--- +title: Serial.getPorts() +slug: Web/API/Serial/Serial.getPorts() +tags: + - API + - Method + - Reference + - Serial.getPorts() + - Serial +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The getPorts() method of the {{domxref("Serial")}} interface returns a {{jsxref("Promise")}} that resolves with an array of {{{domxref("SerialPort")}}} objects representing serial ports connected to the host which the origin has permission to access.

+ +

Syntax

+ +
var promise = Serial.getPorts();
+ +

Parameters

+ +

None./

+ +

Return value

+ +

A {{jsxref("Promise")}} that resolves with an array of {{domxref("SerialPort")}} objects.

+ +

Exceptions

+ +
+
{{domxref("DOMException")}} "SecurityError"
+
The returned Promise rejects with this error if a Feature Policy restricts use of this API or a permission to use it has not granted via a user gesture.
+
+ +

Examples

+ +

The following example shows how a site can check for available ports and allow + the user to grant it permission to access more.

+ +

On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

+ +

If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+ +
navigator.serial.addEventListener('connect', (e) => {
+  // Connect to `e.target` or add it to a list of available ports.
+});
+
+navigator.serial.addEventListener('disconnect', (e) => {
+  // Remove `e.target` from the list of available ports.
+});
+
+navigator.serial.getPorts().then((ports) => {
+  // Initialize the list of available ports with `ports` on page load.
+});
+
+button.addEventListener('click', () => {
+  const usbVendorId = ...;
+  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
+    // Connect to `port` or add it to the list of available ports.
+  }).catch((e) => {
+    // The user didn't select a port.
+  });
+});
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serial-getports','Serial.getPorts()')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.Serial.getPorts")}}

diff --git a/files/en-us/web/api/serial/index.html b/files/en-us/web/api/serial/index.html new file mode 100644 index 000000000000000..c6a208df32e320f --- /dev/null +++ b/files/en-us/web/api/serial/index.html @@ -0,0 +1,112 @@ +--- +title: Serial +slug: Web/API/Serial +tags: + - API + - Interface + - Reference + - Serial +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

Description

+ +

The Serial interface of the {{domxref("Web_Serial_API", "Web Serial API")}} provides attributes and methods for finding and connecting to serial ports from a web page.

+ +

Events

+ +
+
{{domxref("Serial.onconnect")}}
+
+ Called when a port has been connected to the device. This method receives + an {{domxref("Event")}} object. This event is only fired for ports + associated with removable devices such as those connected via USB. The + target of this event is the {{domxref("SerialPort")}} interface that has + been connected. The user must grant the origin permission to access this + device during a call to {{domxref("requestPort()")}} before this event + will be fired. +
+
{{domxref("Serial.ondisconnect")}}
+
+ Called when a port has been disconnected from the device. This method + receives an {{domxref("Event")}} object. This event is only fired for ports + associated with removable devices such as those connected via USB. The + target of this event is the {{domxref("SerialPort")}} interface that has + been disconnected. The user must grant the origin permission to access this + device during a call to {{domxref("requestPort()")}} before this event + will be fired. +
+
+ +

Methods

+ +
+
{{domxref("Serial.requestPort()")
+
+

+ Returns a {{jsxref("Promise")}} that resolves with an instance of + {{{domxref("SerialPort")}}} representing the device chosen by the user or + rejects if no device was selected. +

+

This method must be called with user activation.

+
+
{{domxref("Serial.getPorts()")}}
+
+ Returns a {{jsxref("Promise")}} that resolves with an array of + {{{domxref("SerialPort")}}} objects representing serial ports connected to + the host which the origin has permission to access. +
+
+ +

Examples

+ +

The following example shows how a site can check for available ports and allow +the user to grant it permission to access more.

+ +

On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

+ +

If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+ +
navigator.serial.addEventListener('connect', (e) => {
+  // Connect to `e.target` or add it to a list of available ports.
+});
+
+navigator.serial.addEventListener('disconnect', (e) => {
+  // Remove `e.target` from the list of available ports.
+});
+
+navigator.serial.getPorts().then((ports) => {
+  // Initialize the list of available ports with `ports` on page load.
+});
+
+button.addEventListener('click', () => {
+  const usbVendorId = ...;
+  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
+    // Connect to `port` or add it to the list of available ports.
+  }).catch((e) => {
+    // The user didn't select a port.
+  });
+});
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#serial-interface','Serial')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.Serial")}}

diff --git a/files/en-us/web/api/serial/onconnect/index.html b/files/en-us/web/api/serial/onconnect/index.html new file mode 100644 index 000000000000000..331cac67400f72d --- /dev/null +++ b/files/en-us/web/api/serial/onconnect/index.html @@ -0,0 +1,71 @@ +--- +title: Serial.onconnect +slug: Web/API/Serial/Serial.onconnect +tags: + - API + - Property + - Reference + - Serial.onconnect + - Serial +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The onconnect {{domxref("EventHandler")}} of the {{domxref("Serial")}} interface is called when a port has been disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. Thetarget of this event is the {{domxref("SerialPort")}} interface that has been disconnected. The user must grant the origin permission to access this device during a call to {{domxref("requestPort()")}} before this event will be fired.

+ +

Syntax

+ +
Serial.onconnect = function(event);
+Serial.addEventListener('connect', function(event));
+ +

Example

+ +

The following example shows how a site can check for available ports and allow + the user to grant it permission to access more.

+ +

On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

+ +

If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+ +
navigator.serial.addEventListener('connect', (e) => {
+  // Connect to `e.target` or add it to a list of available ports.
+});
+
+navigator.serial.addEventListener('disconnect', (e) => {
+  // Remove `e.target` from the list of available ports.
+});
+
+navigator.serial.getPorts().then((ports) => {
+  // Initialize the list of available ports with `ports` on page load.
+});
+
+button.addEventListener('click', () => {
+  const usbVendorId = ...;
+  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
+    // Connect to `port` or add it to the list of available ports.
+  }).catch((e) => {
+    // The user didn't select a port.
+  });
+});
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-onconnect','Serial.onconnect')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.Serial.onconnect")}}

diff --git a/files/en-us/web/api/serial/ondisconnect/index.html b/files/en-us/web/api/serial/ondisconnect/index.html new file mode 100644 index 000000000000000..df11e0863a3f101 --- /dev/null +++ b/files/en-us/web/api/serial/ondisconnect/index.html @@ -0,0 +1,71 @@ +--- +title: Serial.ondisconnect +slug: Web/API/Serial/Serial.ondisconnect +tags: + - API + - Property + - Reference + - Serial.ondisconnect + - Serial +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The ondisconnect EventHandler of the {{domxref("Serial")}} interface is called when the port has been disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. The target of this event is the {{domxref("SerialPort")}} interface that has been disconnected. The user must grant the origin permission to access this device during a call to {{domxref("requestPort()")}} before this event will be fired.

+ +

Syntax

+ +
Serial.ondisconnect = function(event);
+Serial.addEventListener('disconnect', function(event));
+ +

Example

+ +

The following example shows how a site can check for available ports and allow + the user to grant it permission to access more.

+ +

On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

+ +

If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+ +
navigator.serial.addEventListener('connect', (e) => {
+  // Connect to `e.target` or add it to a list of available ports.
+});
+
+navigator.serial.addEventListener('disconnect', (e) => {
+  // Remove `e.target` from the list of available ports.
+});
+
+navigator.serial.getPorts().then((ports) => {
+  // Initialize the list of available ports with `ports` on page load.
+});
+
+button.addEventListener('click', () => {
+  const usbVendorId = ...;
+  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
+    // Connect to `port` or add it to the list of available ports.
+  }).catch((e) => {
+    // The user didn't select a port.
+  });
+});
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serial-ondisconnect','Serial.ondisconnect')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.Serial.ondisconnect")}}

diff --git a/files/en-us/web/api/serial/requestport/index.html b/files/en-us/web/api/serial/requestport/index.html new file mode 100644 index 000000000000000..ac335f2b6575f1a --- /dev/null +++ b/files/en-us/web/api/serial/requestport/index.html @@ -0,0 +1,99 @@ +--- +title: Serial.requestPort() +slug: Web/API/Serial/Serial.requestPort() +tags: + - API + - Method + - Reference + - requestPort() + - Serial +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The Serial.requestPort() method of the {{domxref("Serial")}} interface returns a {{jsxref("Promise")}} that resolves with an instance of {{{domxref("SerialPort")}}} representing the device chosen by the user or rejects if no device was selected.

+ +

Syntax

+ +
var promise = Serial.requestPort([options]);
+ +

Parameters

+ +
+
options
+
+
    +
  • filters: A {{jsxref("Sequence")}} of objects containing vendor and product IDs used to search for attached devices. The USB Implementors Forum assigns IDs to specific companies. Each company assigns IDS to it's products. Filters contain the following values: +
      +
    • usbVendorId: An unsigned short integer that identifies a USB device vendor.
      • +
    • usbProductId: An unsigned short integer that identiffies a USB device.
      • +
    +
    • +
+
+
+ +

Return value

+ +

A {{jsxref("Promise")}} that resolves with an instance of {{{domxref("SerialPort")}}}.

+ +

Exceptions

+ +
+
{{domxref("DOMException")}} "SecurityError"
+
The returned Promise rejects with this error if a Feature Policy restricts use of this API or a permission to use it has not granted via a user gesture.
+
{{domxref("DOMException")}} "AbortError"
+
The returned Promise rejects with this if the user does not select a port when prompted.
+
+ +

Examples

+ +

The following example shows how a site can check for available ports and allow +the user to grant it permission to access more.

+ +

On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

+ +

If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+ +
navigator.serial.addEventListener('connect', (e) => {
+  // Connect to `e.target` or add it to a list of available ports.
+});
+
+navigator.serial.addEventListener('disconnect', (e) => {
+  // Remove `e.target` from the list of available ports.
+});
+
+navigator.serial.getPorts().then((ports) => {
+  // Initialize the list of available ports with `ports` on page load.
+});
+
+button.addEventListener('click', () => {
+  const usbVendorId = ...;
+  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
+    // Connect to `port` or add it to the list of available ports.
+  }).catch((e) => {
+    // The user didn't select a port.
+  });
+});
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serial-requestport','Serial.requestPort()')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.Serial.requestPort")}}

From c521985607c4c05c7f8eb0d1fe220ca42ec55378 Mon Sep 17 00:00:00 2001 From: Joseph Medley Date: Mon, 22 Feb 2021 19:36:32 -0800 Subject: [PATCH 02/15] Add SerialPort interface and its members. --- .../en-us/web/api/serialport/close/index.html | 48 +++++++ .../web/api/serialport/getinfo/index.html | 53 ++++++++ .../web/api/serialport/getsignals/index.html | 64 +++++++++ files/en-us/web/api/serialport/index.html | 124 ++++++++++++++++++ .../web/api/serialport/onconnect/index.html | 43 ++++++ .../api/serialport/ondisconnect/index.html | 41 ++++++ .../en-us/web/api/serialport/open/index.html | 75 +++++++++++ .../web/api/serialport/readable/index.html | 65 +++++++++ .../web/api/serialport/setsignals/index.html | 67 ++++++++++ .../web/api/serialport/writable/index.html | 52 ++++++++ 10 files changed, 632 insertions(+) create mode 100644 files/en-us/web/api/serialport/close/index.html create mode 100644 files/en-us/web/api/serialport/getinfo/index.html create mode 100644 files/en-us/web/api/serialport/getsignals/index.html create mode 100644 files/en-us/web/api/serialport/index.html create mode 100644 files/en-us/web/api/serialport/onconnect/index.html create mode 100644 files/en-us/web/api/serialport/ondisconnect/index.html create mode 100644 files/en-us/web/api/serialport/open/index.html create mode 100644 files/en-us/web/api/serialport/readable/index.html create mode 100644 files/en-us/web/api/serialport/setsignals/index.html create mode 100644 files/en-us/web/api/serialport/writable/index.html diff --git a/files/en-us/web/api/serialport/close/index.html b/files/en-us/web/api/serialport/close/index.html new file mode 100644 index 000000000000000..212f8800751194b --- /dev/null +++ b/files/en-us/web/api/serialport/close/index.html @@ -0,0 +1,48 @@ +--- +title: SerialPort.close() +slug: Web/API/SerialPort/SerialPort/close() +tags: + - API + - Method + - Reference + - close() + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The SerialPort.close() method of the {{domxref("SerialPort")}} interface returns a {{jsxref("Promise")}} that resolves when the port closes.

+ +

Syntax

+ +
var promise = SerialPort.close();
+ +

Parameters

+ +

None.

+ +

Return value

+ +

A {{jsxref("Promise")}}.

+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-close','SerialPort.close()')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.close()")}}

diff --git a/files/en-us/web/api/serialport/getinfo/index.html b/files/en-us/web/api/serialport/getinfo/index.html new file mode 100644 index 000000000000000..4adc52e677f759e --- /dev/null +++ b/files/en-us/web/api/serialport/getinfo/index.html @@ -0,0 +1,53 @@ +--- +title: SerialPort.getInfo() +slug: Web/API/SerialPort/SerialPort/getInfo() +tags: + - API + - Method + - Reference + - getInfo() + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The SerialPort.getInfo() method of the {{domxref("SerialPort")}} interface returns a {{jsxref("Promise")}} that resolves with an object containing properties of the port.

+ +

Syntax

+ +
var promise = SerialPort.getInfo();
+ +

Parameters

+ +

None.

+ +

Return value

+ +

An obect containing the following values.

+ + + +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-getinfo','SerialPort.getInfo()')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.getInfo")}}

diff --git a/files/en-us/web/api/serialport/getsignals/index.html b/files/en-us/web/api/serialport/getsignals/index.html new file mode 100644 index 000000000000000..a4a54100515a73a --- /dev/null +++ b/files/en-us/web/api/serialport/getsignals/index.html @@ -0,0 +1,64 @@ +--- +title: SerialPort.getSignals() +slug: Web/API/SerialPort/SerialPort/getSignals() +tags: + - API + - Method + - Reference + - getSignals() + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The SerialPort.getSignals() method of the {{domxref("SerialPort")}} interface returns a {{jsxref("Promise")}} that resolves with an object containing the current state of the port's control signals.

+ +

Syntax

+ +
var promise = SerialPort.getSignals();
+ +

Parameters

+ +

None.

+ +

Return value

+ +

Returns a {{jsxref("Promise")}} the resolves with an object containing the following members:

+ + + +

Exceptions

+ +
+
{{domxref("DOMException")}} "InvalidStateError"
+
Indicates that the port is not open. Call {{domxref("SerialPort.open()")}} to avoid this error.
+
{{domxref("DOMException")}} NetworkError
+
Indicates that one of the signals on the device could not be set.
+
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-getsignals','SerialPort.getSignals()')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.getSignals")}}

diff --git a/files/en-us/web/api/serialport/index.html b/files/en-us/web/api/serialport/index.html new file mode 100644 index 000000000000000..7f7946cb185b1f1 --- /dev/null +++ b/files/en-us/web/api/serialport/index.html @@ -0,0 +1,124 @@ +--- +title: SerialPort +slug: Web/API/SerialPort +tags: + - API + - Interface + - Reference + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

Description

+ +

The SerialPort interface of the {{domxref("Web_Serial_API", "Web +Serial API")}} provides access to a serial port on the host device. Instances of +this interface may be obtained by calling {{domxref("Serial.requestPort()")}} to +request permission to access a port from the user. Ports that an origin has +already been granted permission to access are available from +{{domxref("Serial.getPorts()")}} or by listening for {{domxref("Event")}} +objects using {{domref("Serial.onconnect")}}.

+ +

Constructor

+ +

None.

+ +

Properties

+ +

SerialPort.readable

+ +
+
{{domxref("SerialPort.readable")}}{{readonlyInline}}
+
Returns a {{domxref("ReadableStream")}} for receiving data from the device connected to the port. Chunks read from this stream are instances of {{jsxref("Uint8Array")}}. This property is non-null as long as the port is open and has not encountered a fatal error.
+
{{domxref("SerialPort.writable")}}{{readonlyInline}}
+
Returns a {{domxref("WritableStream")}} for sending data to the device connected to the port. Chunks written to this stream must be instances of {{domxref("BufferSource")}} (for example, an {{jsxref("ArrayBuffer")}} or {{jsxref("ArrayBufferView")}} such as {{jsxref("Uint8Array")}}). This property is non-null as long as the port is open and has not encountered a fatal error.
+
+ +

+

Events

+ +
+
{{domxref("SerialPoert.onconnect")}}
+
Called when the port has connected to the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface.
+
{{domxref("SerialPort.ondisconnect")}}
+
Called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface.
+
+ +

Methods

+ +
+
{{domxref("SerialPort.getInfo()")}}
+
Returns a {{jsxref("Promise")}} that resolves with an object containing properties of the port.
+
{{domxref("SerialPort.open()")}}
+
Returns a {{jsxref("Promise")}} that resolves when the port is opened. By default the port is opened with 8 data bits, 1 stop bit and no parity checking.
+
{{domxref("SerialPort.setSignals()")}}
+
Sets control signals on the port and returns a {{jsxref("Promise")}} that resolves when they are set.
+
{{domxref("SerialPort.getSignals()")}}
+
Returns a {{jsxref("Promise")}} that resolves with an object containing the current state of the port's control signals.
+
{{domxref("SerialPort.close()")}}
+
Returns a {{jsxref("Promise")}} that resolves when the port closes.
+
+ +

Examples

+ +

Opening a port

+ +

Before communicating on a serial port it must be opened. Opening the port allows the site to specify the necessary parameters that control how data is transmitted and received. Developers should check the documentation for the device they are connecting to for the appropriate parameters.

+ +
await port.open({ baudRate: /* pick your baud rate */ });
+ +

Once the Promise returned by open() resolves the readable and writable attributes can be accessed to get the ReadableStream and WritableStream instances for receiving data from and sending data to the connected device.

+ +

Reading data from a port

+ +

The following example shows how to read data from a port. The outer loop handles non-fatal errors, creating a new reader until a fatal error is encountered and readable becomes null.

+ +
while (port.readable) {
+  const reader = port.readable.getReader();
+  try {
+    while (true) {
+      const { value, done } = await reader.read();
+      if (done) {
+        // |reader| has been canceled.
+        break;
+      }
+      // Do something with |value|...
+    }
+  } catch (error) {
+    // Handle |error|...
+  } finally {
+    reader.releaseLock();
+  }
+}
+ +

Writing data to a port

+ +

The following example shows how to write a string to a port. A {{domxref("TextEncoder")}} is converts the string to a Uint8Array before transmission.

+ +
const encoder = new TextEncoder();
+const writer = port.writable.getWriter();
+await writer.write(encoder.encode("PING"));
+writer.releaseLock();
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport','SerialPort.writable')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.writable")}}

diff --git a/files/en-us/web/api/serialport/onconnect/index.html b/files/en-us/web/api/serialport/onconnect/index.html new file mode 100644 index 000000000000000..8215bf27c8e131f --- /dev/null +++ b/files/en-us/web/api/serialport/onconnect/index.html @@ -0,0 +1,43 @@ +--- +title: SerialPort.onconnect +slug: Web/API/SerialPort/SerialPort/onconnect +tags: + - API + - Property + - Reference + - onconnect + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The onconnect EventHandler of the {{domxref("SerialPort")}} interface is called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface..

+ +

The [[eventName]] event fires when [[eventOccurs]].

+ +

Syntax

+ +
SerialPort.onconnect = function(event);
+  SerialPort.addEventListener('connect', function(event));
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-onconnect','SerialPort.onconnect')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.onconnect")}}

diff --git a/files/en-us/web/api/serialport/ondisconnect/index.html b/files/en-us/web/api/serialport/ondisconnect/index.html new file mode 100644 index 000000000000000..5db0a988f9f0e84 --- /dev/null +++ b/files/en-us/web/api/serialport/ondisconnect/index.html @@ -0,0 +1,41 @@ +--- +title: SerialPort.ondisconnect +slug: Web/API/SerialPort/SerialPort/ondisconnect +tags: + - API + - Property + - Reference + - ondisconnect + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The ondisconnect EventHandler of the {{domxref("SerialPort")}} interface is called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface. + +

Syntax

+ +
SerialPort.ondisconnect = function(event);
+SerialPort.addEventListener('disconnect', function(event));
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-ondisconnect','SerialPort.ondisconnect')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.ondisconnect")}}

diff --git a/files/en-us/web/api/serialport/open/index.html b/files/en-us/web/api/serialport/open/index.html new file mode 100644 index 000000000000000..b312e2d29be1b2e --- /dev/null +++ b/files/en-us/web/api/serialport/open/index.html @@ -0,0 +1,75 @@ +--- +title: SerialPort.open() +slug: Web/API/SerialPort/SerialPort/open() +tags: + - API + - Method + - Reference + - open() + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The open() method of the {{domxref("SerialPort")}} interface returns a {{jsxref("Promise")}} that resolves when the port is opened. By default the port is opened with 8 data bits, 1 stop bit and no parity checking. The baudRate parameter is required.

+ +

Syntax

+ +
var promise = SerialPort.open(options);
+ +

Parameters

+ +
+
options
+
An object with any of the following values: +
    +
  • baudRate: (required)
    • +
  • bufferSize: The default value is 255.
    • +
  • dataBits: The default value is 8.
    • +
  • flowControl: The default value is "none.
    • +
  • parity: The default value is "none".
    • +
  • stopBits: The default value is 1.
    • +
+
+
+ +

Return value

+ +

A {{jsxref("Promise")}}.

+ +

Exceptions

+ +
+
{{domxref("DOMException")}} "InvalidStateError"
+
Indicates that the port is already open.
+
{{domxref("DOMException")}} NetworkError
+
Indicates that the attempt to open the port failed.
+
+ +

Examples

+ +

Before communicating on a serial port it must be opened. Opening the port allows the site to specify the necessary parameters that control how data is transmitted and received. Developers should check the documentation for the device they are connecting to for the appropriate parameters.

+ +
await port.open({ baudRate: /* pick your baud rate */ });
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-open','SerialPort.open()')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.open")}}

diff --git a/files/en-us/web/api/serialport/readable/index.html b/files/en-us/web/api/serialport/readable/index.html new file mode 100644 index 000000000000000..df0d537dad66607 --- /dev/null +++ b/files/en-us/web/api/serialport/readable/index.html @@ -0,0 +1,65 @@ +--- +title: SerialPort.readable +slug: Web/API/SerialPort/SerialPort/readable +tags: + - API + - Property + - Reference + - readable + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The readable read-only property of the {{domxref("SerialPort")}} interface returns a {{domxref("ReadableStream")}} for receiving data from the device connected to the port. Chunks read from this stream are instances of {{jsxref("Uint8Array")}}. This property is non-null as long as the port is open and has not encountered a fatal error.

+ +

Syntax

+ +
var readableStream = SerialPort.readable;
+ +

Value

+

A {{domxref("ReadableStream")}}.

+ +

Examples

+ +

The following example shows how to read data from a port. The outer loop handles non-fatal errors, creating a new reader until a fatal error is encountered and readable becomes null.

+ +
while (port.readable) {
+  const reader = port.readable.getReader();
+  try {
+    while (true) {
+      const { value, done } = await reader.read();
+      if (done) {
+        // |reader| has been canceled.
+        break;
+      }
+      // Do something with |value|...
+    }
+  } catch (error) {
+    // Handle |error|...
+  } finally {
+    reader.releaseLock();
+  }
+}
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-readable','SerialPort.readable')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.readable")}}

diff --git a/files/en-us/web/api/serialport/setsignals/index.html b/files/en-us/web/api/serialport/setsignals/index.html new file mode 100644 index 000000000000000..b17abb62a758308 --- /dev/null +++ b/files/en-us/web/api/serialport/setsignals/index.html @@ -0,0 +1,67 @@ +--- +title: SerialPort.setSignals() +slug: Web/API/SerialPort/SerialPort/setSignals() +tags: + - API + - Method + - Reference + - setSignals() + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The setSignals() method of the {{domxref("SerialPort")}} interface sets control signals on the port and returns a {{jsxref("Promise")}} that resolves when they are set.

+ +

Syntax

+ +
var promise = SerialPort.setSignals(options);
+ +

Parameters

+ +
+
options
+
An object with any of the following values: +
    +
  • clearToSend: (Boolean) Indicates to the other end of a serial connection that is is clear to send data.
    • +
  • dataCarrierDetect: (Boolean) Toggles the control signal needed to communicate over a serial connection.
    • +
  • dataSetReady: (Boolean) Indicates that the device is ready to send and receive data.
    • +
  • ringIndicator: (Boolean) Indicates that a ring signal should be sent down the serial connection.
    • +
+
+
+ +

Return value

+ +

A {{jsxref("Promise")}}.

+ +

Exceptions

+ +
+
{{domxref("DOMException")}} "InvalidStateError"
+
Indicates that the port is not open. Call {{domxref("SerialPort.open()")}} to avoid this error.
+
{{domxref("DOMException")}} NetworkError
+
Indicates that one of the signals on the device could not be set.
+
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-setsignals','SerialPort.setSignals()')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.setSignals")}}

diff --git a/files/en-us/web/api/serialport/writable/index.html b/files/en-us/web/api/serialport/writable/index.html new file mode 100644 index 000000000000000..33f6ad4a3f1009c --- /dev/null +++ b/files/en-us/web/api/serialport/writable/index.html @@ -0,0 +1,52 @@ +--- +title: SerialPort.writable +slug: Web/API/SerialPort/SerialPort/writable +tags: + - API + - Property + - Reference + - writable + - SerialPort +--- +
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
+ +

The writable read-only property of the {{domxref("SerialPort")}} interface returns a {{domxref("WritableStream")}} for sending data to the device connected to the port. Chunks written to this stream must be instances of {{domxref("BufferSource")}} (for example, an {{jsxref("ArrayBuffer")}} or {{jsxref("ArrayBufferView")}} such as {{jsxref("Uint8Array")}}). This property is non-null as long as the port is open and has not encountered a fatal error.

+ +

Syntax

+ +
var writableStream = SerialPort.writable;
+ +

Value

+

A {{domxref("WritableStream")}}

+ +

Examples

+ +

The following example shows how to write a string to a port. A {{domxref("TextEncoder")}} is converts the string to a Uint8Array before transmission.

+ +
const encoder = new TextEncoder();
+const writer = port.writable.getWriter();
+await writer.write(encoder.encode("PING"));
+writer.releaseLock();
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Web Serial API','#dom-serialport-writable','SerialPort.writable')}}{{Spec2('Web Serial API')}}Initial definition.
+ +

Browser compatibility

+ + + +

{{Compat("api.SerialPort.writable")}}

From 37417091c018bcf2e7c1108cc494011c84e40afa Mon Sep 17 00:00:00 2001 From: Rachel Andrew Date: Thu, 25 Feb 2021 15:33:54 +0000 Subject: [PATCH 03/15] Tidy up of existing pages --- .../en-us/web/api/serial/getports/index.html | 40 +++-------------- files/en-us/web/api/serial/index.html | 44 +++++-------------- .../en-us/web/api/serial/onconnect/index.html | 34 +++----------- .../web/api/serial/ondisconnect/index.html | 32 +++----------- .../web/api/serial/requestport/index.html | 38 +++++----------- .../en-us/web/api/serialport/close/index.html | 6 +-- .../web/api/serialport/getinfo/index.html | 16 ++++--- .../web/api/serialport/getsignals/index.html | 20 +++++---- files/en-us/web/api/serialport/index.html | 35 ++++++--------- .../web/api/serialport/onconnect/index.html | 2 +- .../api/serialport/ondisconnect/index.html | 2 +- .../en-us/web/api/serialport/open/index.html | 32 ++++++++------ .../web/api/serialport/readable/index.html | 6 +-- .../web/api/serialport/setsignals/index.html | 24 +++++----- .../web/api/serialport/writable/index.html | 6 +-- 15 files changed, 121 insertions(+), 216 deletions(-) diff --git a/files/en-us/web/api/serial/getports/index.html b/files/en-us/web/api/serial/getports/index.html index ba254b0012e5c06..b1b331123b9ae00 100644 --- a/files/en-us/web/api/serial/getports/index.html +++ b/files/en-us/web/api/serial/getports/index.html @@ -1,24 +1,20 @@ --- title: Serial.getPorts() -slug: Web/API/Serial/Serial.getPorts() +slug: Web/API/Serial/getPorts tags: - API - Method - Reference - - Serial.getPorts() + - Serial.getPorts - Serial ---
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}
-

The getPorts() method of the {{domxref("Serial")}} interface returns a {{jsxref("Promise")}} that resolves with an array of {{{domxref("SerialPort")}}} objects representing serial ports connected to the host which the origin has permission to access.

+

The getPorts() method of the {{domxref("Serial")}} interface returns a {{jsxref("Promise")}} that resolves with an array of {{domxref("SerialPort")}} objects representing serial ports connected to the host which the origin has permission to access.

Syntax

-
var promise = Serial.getPorts();
- -

Parameters

- -

None./

+
var promise = Serial.getPorts();

Return value

@@ -28,37 +24,15 @@

Exceptions

{{domxref("DOMException")}} "SecurityError"
-
The returned Promise rejects with this error if a Feature Policy restricts use of this API or a permission to use it has not granted via a user gesture.
+
The returned Promise rejects with this error if a Feature Policy restricts use of this API or a permission to use it has not granted via a user gesture.

Examples

-

The following example shows how a site can check for available ports and allow - the user to grant it permission to access more.

- -

On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

- -

If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+

The following example uses getPorts() to initialize a list of available ports.

-
navigator.serial.addEventListener('connect', (e) => {
-  // Connect to `e.target` or add it to a list of available ports.
-});
-
-navigator.serial.addEventListener('disconnect', (e) => {
-  // Remove `e.target` from the list of available ports.
-});
-
-navigator.serial.getPorts().then((ports) => {
+
navigator.serial.getPorts().then((ports) => {
   // Initialize the list of available ports with `ports` on page load.
-});
-
-button.addEventListener('click', () => {
-  const usbVendorId = ...;
-  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
-    // Connect to `port` or add it to the list of available ports.
-  }).catch((e) => {
-    // The user didn't select a port.
-  });
 });

 
 
Specifications

diff --git a/files/en-us/web/api/serial/index.html b/files/en-us/web/api/serial/index.html
index c6a208df32e320f..b644992be42bfd4 100644
--- a/files/en-us/web/api/serial/index.html
+++ b/files/en-us/web/api/serial/index.html
@@ -13,61 +13,41 @@ 
Description

 
 
The Serial interface of the {{domxref("Web_Serial_API", "Web Serial API")}} provides attributes and methods for finding and connecting to serial ports from a web page.

 
-
Events

+
Properties

+
+
Event Handlers

 
 

   
{{domxref("Serial.onconnect")}}

-  

-    Called when a port has been connected to the device. This method receives
-    an {{domxref("Event")}} object. This event is only fired for ports
-    associated with removable devices such as those connected via USB. The
-    target of this event is the {{domxref("SerialPort")}} interface that has
-    been connected. The user must grant the origin permission to access this
-    device during a call to {{domxref("requestPort()")}} before this event
-    will be fired.
-  

+  
An event handler called when a port has been connected to the device.

   
{{domxref("Serial.ondisconnect")}}

-  

-    Called when a port has been disconnected from the device. This method
-    receives an {{domxref("Event")}} object. This event is only fired for ports
-    associated with removable devices such as those connected via USB. The
-    target of this event is the {{domxref("SerialPort")}} interface that has
-    been disconnected. The user must grant the origin permission to access this
-    device during a call to {{domxref("requestPort()")}} before this event
-    will be fired.
-  

+  
An event handler called when a port has been disconnected from the device.

 

 
 
Methods

 
 

-  
{{domxref("Serial.requestPort()")

+  
{{domxref("Serial.requestPort()")}}

   

-    

-      Returns a {{jsxref("Promise")}} that resolves with an instance of
-      {{{domxref("SerialPort")}}} representing the device chosen by the user or
-      rejects if no device was selected.
-    

+    
Returns a {{jsxref("Promise")}} that resolves with an instance of {{domxref("SerialPort")}} representing the device chosen by the user or rejects if no device was selected.

     
This method must be called with user activation.

   

   
{{domxref("Serial.getPorts()")}}

   

-    Returns a {{jsxref("Promise")}} that resolves with an array of
-    {{{domxref("SerialPort")}}} objects representing serial ports connected to
+    Returns a {{jsxref("Promise")}} that resolves with an array of  {{domxref("SerialPort")}} objects representing serial ports connected to
     the host which the origin has permission to access.
   

 

 
 
Examples

 
-
The following example shows how a site can check for available ports and allow
-the user to grant it permission to access more.

+
The following example shows how a site can check for available ports and allow the user to grant it permission to access additional ports.

 
-
On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

+
On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The {{domxref("Serial.getPorts()","getPorts()")}} method is then called to see which ports are connected that the site already has access to.

 
-
If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+
If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example we use a {{domxref("Element.click_event")}} event handler on a button for this task. A filter is passed to {{domxref("Serial.requestPort()","requestPort()")}} with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer.

 
-
navigator.serial.addEventListener('connect', (e) => {
+
navigator.serial.addEventListener('connect', (e) => {
   // Connect to `e.target` or add it to a list of available ports.
 });
 
diff --git a/files/en-us/web/api/serial/onconnect/index.html b/files/en-us/web/api/serial/onconnect/index.html
index 331cac67400f72d..6232572a40d1f02 100644
--- a/files/en-us/web/api/serial/onconnect/index.html
+++ b/files/en-us/web/api/serial/onconnect/index.html
@@ -1,6 +1,6 @@
 ---
 title: Serial.onconnect
-slug: Web/API/Serial/Serial.onconnect
+slug: Web/API/Serial/onconnect
 tags:
   - API
   - Property
@@ -10,7 +10,9 @@
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The onconnect {{domxref("EventHandler")}} of the {{domxref("Serial")}} interface is called when a port has been disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. Thetarget of this event is the {{domxref("SerialPort")}} interface that has been disconnected. The user must grant the origin permission to access this device during a call to {{domxref("requestPort()")}} before this event will be fired.

+
The onconnect {{domxref("EventHandler")}} of the {{domxref("Serial")}} interface is called when a port has been disconnected from the device. This method receives an {{domxref("Event")}} object. The target of this event is the {{domxref("SerialPort")}} interface that has been disconnected.
+
+
This event is only fired for ports associated with removable devices such as those connected via USB. The user must grant the origin permission to access this device during a call to {{domxref("Serial.requestPort()","requestPort()")}} before this event will be fired.

 
 
Syntax

 
@@ -19,32 +21,10 @@ 
Syntax

 
 
Example

 
-
The following example shows how a site can check for available ports and allow
-  the user to grant it permission to access more.

-  
-
On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

-
-
If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

+
The following example shows an event listener for the connect event,. This allows the site to react when a port is connected.

 
-
navigator.serial.addEventListener('connect', (e) => {
+
navigator.serial.addEventListener('connect', (e) => {
   // Connect to `e.target` or add it to a list of available ports.
-});
-
-navigator.serial.addEventListener('disconnect', (e) => {
-  // Remove `e.target` from the list of available ports.
-});
-
-navigator.serial.getPorts().then((ports) => {
-  // Initialize the list of available ports with `ports` on page load.
-});
-
-button.addEventListener('click', () => {
-  const usbVendorId = ...;
-  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
-    // Connect to `port` or add it to the list of available ports.
-  }).catch((e) => {
-    // The user didn't select a port.
-  });
 });

 
 
Specifications

@@ -57,7 +37,7 @@ 
Specifications

    Comment
   
   
-   {{SpecName('Web Serial API','#dom-serialport-onconnect','Serial.onconnect')}}
+   {{SpecName('Web Serial API','#dom-serial-onconnect','Serial.onconnect')}}
    {{Spec2('Web Serial API')}}
    Initial definition.
   
diff --git a/files/en-us/web/api/serial/ondisconnect/index.html b/files/en-us/web/api/serial/ondisconnect/index.html
index df11e0863a3f101..aa1b6eb449485c8 100644
--- a/files/en-us/web/api/serial/ondisconnect/index.html
+++ b/files/en-us/web/api/serial/ondisconnect/index.html
@@ -1,6 +1,6 @@
 ---
 title: Serial.ondisconnect
-slug: Web/API/Serial/Serial.ondisconnect
+slug: Web/API/Serial/ondisconnect
 tags:
   - API
   - Property
@@ -10,7 +10,9 @@
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The ondisconnect EventHandler of the {{domxref("Serial")}} interface is called when the port has been disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. The target of this event is the {{domxref("SerialPort")}} interface that has been disconnected. The user must grant the origin permission to access this device during a call to {{domxref("requestPort()")}} before this event will be fired.

+
The ondisconnect EventHandler of the {{domxref("Serial")}} interface is called when the port has been disconnected from the device. This method receives an {{domxref("Event")}} object. The target of this event is the {{domxref("SerialPort")}} interface that has been disconnected.

+
+
This event is only fired for ports associated with removable devices such as those connected via USB. The user must grant the origin permission to access this device during a call to {{domxref("Serial.requestPort()", "requestPort()")}} before this event will be fired.

 
 
Syntax

 
@@ -19,32 +21,10 @@ 
Syntax

 
 
Example

 
-
The following example shows how a site can check for available ports and allow
-  the user to grant it permission to access more.

-  
-
On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

-
-
If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

-
-
navigator.serial.addEventListener('connect', (e) => {
-  // Connect to `e.target` or add it to a list of available ports.
-});
+
The following example shows an event listener for the disconnect event,. This allows the site to react when a port is disconnected.

 
-navigator.serial.addEventListener('disconnect', (e) => {
+
navigator.serial.addEventListener('disconnect', (e) => {
   // Remove `e.target` from the list of available ports.
-});
-
-navigator.serial.getPorts().then((ports) => {
-  // Initialize the list of available ports with `ports` on page load.
-});
-
-button.addEventListener('click', () => {
-  const usbVendorId = ...;
-  navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
-    // Connect to `port` or add it to the list of available ports.
-  }).catch((e) => {
-    // The user didn't select a port.
-  });
 });

 
 
Specifications

diff --git a/files/en-us/web/api/serial/requestport/index.html b/files/en-us/web/api/serial/requestport/index.html
index ac335f2b6575f1a..9fba5913155541d 100644
--- a/files/en-us/web/api/serial/requestport/index.html
+++ b/files/en-us/web/api/serial/requestport/index.html
@@ -1,16 +1,16 @@
 ---
 title: Serial.requestPort()
-slug: Web/API/Serial/Serial.requestPort()
+slug: Web/API/Serial/requestPort
 tags:
   - API
   - Method
   - Reference
-  - requestPort()
+  - requestPort
   - Serial
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The Serial.requestPort() method of the {{domxref("Serial")}} interface returns a {{jsxref("Promise")}} that resolves with an instance of {{{domxref("SerialPort")}}} representing the device chosen by the user or rejects if no device was selected.

+
The Serial.requestPort() method of the {{domxref("Serial")}} interface returns a {{jsxref("Promise")}} that resolves with an instance of {{domxref("SerialPort")}} representing the device chosen by the user or rejects if no device was selected.

 
 
Syntax

 
@@ -21,20 +21,21 @@ 
Parameters

 

   
options

   

-    
    
-      
  • filters: A {{jsxref("Sequence")}} of objects containing vendor and product IDs used to search for attached devices. The USB Implementors Forum assigns IDs to specific companies. Each company assigns IDS to it's products. Filters contain the following values:
+    
    
+      
    filters
    
+      
    A list of objects containing vendor and product IDs used to search for attached devices. The USB Implementors Forum assigns IDs to specific companies. Each company assigns IDS to it's products. Filters contain the following values:
         
      
           
    • usbVendorId: An unsigned short integer that identifies a USB device vendor. 
      • 
           
    • usbProductId: An unsigned short integer that identiffies a USB device.
      • 
         
    
-      
    • 
-    

+      

+    

   
 
 
 
Return value

 
-
A {{jsxref("Promise")}} that resolves with an instance of {{{domxref("SerialPort")}}}.

+
A {{jsxref("Promise")}} that resolves with an instance of {{domxref("SerialPort")}}.

 
 
Exceptions

 
@@ -47,26 +48,9 @@ 
Exceptions

 
 
Examples

 
-
The following example shows how a site can check for available ports and allow
-the user to grant it permission to access more.

+
The following example shows a filter being passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. If this filter was omitted the user would be able to select any available port.

 
-
On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The getPorts() method is then called to see which ports are connected that the site already has access to.

-
-
If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example that is done using a {{domxref("Element.click_event")}} event handler on a button. A filter is passed to requestPort() with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer. The filter can be omitted to allow the user to select any available port.

-
-
navigator.serial.addEventListener('connect', (e) => {
-  // Connect to `e.target` or add it to a list of available ports.
-});
-
-navigator.serial.addEventListener('disconnect', (e) => {
-  // Remove `e.target` from the list of available ports.
-});
-
-navigator.serial.getPorts().then((ports) => {
-  // Initialize the list of available ports with `ports` on page load.
-});
-
-button.addEventListener('click', () => {
+
button.addEventListener('click', () => {
   const usbVendorId = ...;
   navigator.serial.requestPort({ filters: [{ usbVendorId }]}).then((port) => {
     // Connect to `port` or add it to the list of available ports.
diff --git a/files/en-us/web/api/serialport/close/index.html b/files/en-us/web/api/serialport/close/index.html
index 212f8800751194b..06e0fab1787d3ef 100644
--- a/files/en-us/web/api/serialport/close/index.html
+++ b/files/en-us/web/api/serialport/close/index.html
@@ -1,11 +1,11 @@
 ---
 title: SerialPort.close()
-slug: Web/API/SerialPort/SerialPort/close()
+slug: Web/API/SerialPort/close
 tags:
   - API
   - Method
   - Reference
-  - close()
+  - close
   - SerialPort
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

@@ -14,7 +14,7 @@
 
 
Syntax

 
-
var promise = SerialPort.close();

+
var promise = SerialPort.close();

 
 
Parameters

 
diff --git a/files/en-us/web/api/serialport/getinfo/index.html b/files/en-us/web/api/serialport/getinfo/index.html
index 4adc52e677f759e..d3a5244a2f48143 100644
--- a/files/en-us/web/api/serialport/getinfo/index.html
+++ b/files/en-us/web/api/serialport/getinfo/index.html
@@ -1,6 +1,6 @@
 ---
 title: SerialPort.getInfo()
-slug: Web/API/SerialPort/SerialPort/getInfo()
+slug: Web/API/SerialPort/getInfo
 tags:
   - API
   - Method
@@ -14,7 +14,7 @@
 
 
Syntax

 
-
var promise = SerialPort.getInfo();

+
var promise = SerialPort.getInfo();

 
 
Parameters

 
@@ -22,12 +22,14 @@ 
Parameters

 
 
Return value

 
-
An obect containing the following values.

+
An object containing the following values.

 
-
    
-  
  • usbVendorId: An unsigned short integer that identifies a USB device vendor. 
    • 
-  
  • usbProductId: An unsigned short integer that identiffies a USB device.
    • 
-

+

+  
usbVendorId

+  
If the port is part of a USB device, an unsigned short integer that identifies a USB device vendor, otherwise undefined.

+  
usbProductId

+  
If the port is part of a USB device, an unsigned short integer that identiffies a USB device, otherwise undefined.

+

 
 
Specifications

 
diff --git a/files/en-us/web/api/serialport/getsignals/index.html b/files/en-us/web/api/serialport/getsignals/index.html
index a4a54100515a73a..802b0759ead6323 100644
--- a/files/en-us/web/api/serialport/getsignals/index.html
+++ b/files/en-us/web/api/serialport/getsignals/index.html
@@ -1,6 +1,6 @@
 ---
 title: SerialPort.getSignals()
-slug: Web/API/SerialPort/SerialPort/getSignals()
+slug: Web/API/SerialPort/getSignals
 tags:
   - API
   - Method
@@ -22,14 +22,18 @@ 
Parameters

 
 
Return value

 
-
Returns a {{jsxref("Promise")}} the resolves with an object containing the following members:

+
Returns a {{jsxref("Promise")}} that resolves with an object containing the following members:

 
-
    
-  
  • clearToSend: (Boolean) Indicates to the other end of a serial connection that is is clear to send data.
    • 
-  
  • dataCarrierDetect: (Boolean) Toggles the control signal needed to communicate over a serial connection.
    • 
-  
  • dataSetReady: (Boolean) Indicates that the device is ready to send and receive data.
    • 
-  
  • ringIndicator: (Boolean) Indicates that a ring signal should be sent down the serial connection.
    • 
-

+

+  
clearToSend

+  
A boolean indicating to the other end of a serial connection that is is clear to send data.

+  
dataCarrierDetect

+  
A boolean that toggles the control signal needed to communicate over a serial connection.

+  
dataSetReady

+  
A boolean indicating whether the device is ready to send and receive data.

+  
ringIndicator

+  
A boolean indicating whether a ring signal should be sent down the serial connection.

+

 
 
Exceptions

 
diff --git a/files/en-us/web/api/serialport/index.html b/files/en-us/web/api/serialport/index.html
index 7f7946cb185b1f1..bf597f72c766ea0 100644
--- a/files/en-us/web/api/serialport/index.html
+++ b/files/en-us/web/api/serialport/index.html
@@ -11,40 +11,31 @@
 
 
Description

 
-
The SerialPort interface of the {{domxref("Web_Serial_API", "Web
-Serial API")}} provides access to a serial port on the host device. Instances of
-this interface may be obtained by calling {{domxref("Serial.requestPort()")}} to
-request permission to access a port from the user. Ports that an origin has
-already been granted permission to access are available from
-{{domxref("Serial.getPorts()")}} or by listening for {{domxref("Event")}}
-objects using {{domref("Serial.onconnect")}}.

+
The SerialPort interface of the {{domxref("Web_Serial_API", "Web Serial API")}} provides access to a serial port on the host device.

 
 
Constructor

 
-
None.

+
Instances of this interface may be obtained by calling methods of the {{domxref("Serial")}} interface, therefore it has no constructor of its own.
 
-
Properties

-
-
SerialPort.readable

+
Properties

 
 

   
{{domxref("SerialPort.readable")}}{{readonlyInline}}

-  
Returns a {{domxref("ReadableStream")}} for receiving data from the device connected to the port. Chunks read from this stream are instances of {{jsxref("Uint8Array")}}. This property is non-null as long as the port is open and has not encountered a fatal error.

+  
Returns a {{domxref("ReadableStream")}} for receiving data from the device connected to the port.

   
{{domxref("SerialPort.writable")}}{{readonlyInline}}

-  
Returns a {{domxref("WritableStream")}} for sending data to the device connected to the port. Chunks written to this stream must be instances of {{domxref("BufferSource")}} (for example, an {{jsxref("ArrayBuffer")}} or {{jsxref("ArrayBufferView")}} such as {{jsxref("Uint8Array")}}). This property is non-null as long as the port is open and has not encountered a fatal error.

+  
Returns a {{domxref("WritableStream")}} for sending data to the device connected to the port.

 

 
-

-
Events

+
Event handlers

 
 

-  
{{domxref("SerialPoert.onconnect")}}

-  
Called when the port has connected to the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface.

+  
{{domxref("SerialPort.onconnect")}}

+  
An event handler called when the port has connected to the device.

   
{{domxref("SerialPort.ondisconnect")}}

-  
Called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface.

+  
An event handler called when the port has disconnected from the device.

 

 
-
Methods

+
Methods

 
 

   
{{domxref("SerialPort.getInfo()")}}

@@ -67,7 +58,7 @@ 
Opening a port

 
 
await port.open({ baudRate: /* pick your baud rate */ });

 
-
Once the Promise returned by open() resolves the readable and writable attributes can be accessed to get the ReadableStream and WritableStream instances for receiving data from and sending data to the connected device.

+
Once the Promise returned by open() resolves the readable and writable attributes can be accessed to get the {{domxref("ReadableStream")}} and {{domxref("WritableStream")}} instances for receiving data from and sending data to the connected device.

 
 
Reading data from a port

 
@@ -110,7 +101,7 @@ 
Specifications

    Comment
   
   
-   {{SpecName('Web Serial API','#dom-serialport','SerialPort.writable')}}
+   {{SpecName('Web Serial API','#dom-serialport','SerialPort')}}
    {{Spec2('Web Serial API')}}
    Initial definition.
   
@@ -121,4 +112,4 @@ 
Browser compatibility

 
 
 
-
{{Compat("api.SerialPort.writable")}}

+
{{Compat("api.SerialPort")}}

diff --git a/files/en-us/web/api/serialport/onconnect/index.html b/files/en-us/web/api/serialport/onconnect/index.html
index 8215bf27c8e131f..46500261e906506 100644
--- a/files/en-us/web/api/serialport/onconnect/index.html
+++ b/files/en-us/web/api/serialport/onconnect/index.html
@@ -1,6 +1,6 @@
 ---
 title: SerialPort.onconnect
-slug: Web/API/SerialPort/SerialPort/onconnect
+slug: Web/API/SerialPort/onconnect
 tags:
   - API
   - Property
diff --git a/files/en-us/web/api/serialport/ondisconnect/index.html b/files/en-us/web/api/serialport/ondisconnect/index.html
index 5db0a988f9f0e84..b0d31ebd175c119 100644
--- a/files/en-us/web/api/serialport/ondisconnect/index.html
+++ b/files/en-us/web/api/serialport/ondisconnect/index.html
@@ -1,6 +1,6 @@
 ---
 title: SerialPort.ondisconnect
-slug: Web/API/SerialPort/SerialPort/ondisconnect
+slug: Web/API/SerialPort/ondisconnect
 tags:
   - API
   - Property
diff --git a/files/en-us/web/api/serialport/open/index.html b/files/en-us/web/api/serialport/open/index.html
index b312e2d29be1b2e..7c0b8dc2e118366 100644
--- a/files/en-us/web/api/serialport/open/index.html
+++ b/files/en-us/web/api/serialport/open/index.html
@@ -1,34 +1,40 @@
 ---
 title: SerialPort.open()
-slug: Web/API/SerialPort/SerialPort/open()
+slug: Web/API/SerialPort/open
 tags:
   - API
   - Method
   - Reference
-  - open()
+  - open
   - SerialPort
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The open() method of the {{domxref("SerialPort")}} interface returns a {{jsxref("Promise")}} that resolves when the port is opened. By default the port is opened with 8 data bits, 1 stop bit and no parity checking. The baudRate parameter is required. 

+
The open() method of the {{domxref("SerialPort")}} interface returns a {{jsxref("Promise")}} that resolves when the port is opened. By default the port is opened with 8 data bits, 1 stop bit and no parity checking. The baudRate parameter is required.

 
 
Syntax

 
-
var promise = SerialPort.open(options);

+
var promise = SerialPort.open(options);

 
 
Parameters

 
 

   
options

   
An object with any of the following values:
-    
    
-      
  • baudRate: (required)
    • 
-      
  • bufferSize: The default value is 255.
    • 
-      
  • dataBits: The default value is 8.
    • 
-      
  • flowControl: The default value is "none.
    • 
-      
  • parity: The default value is "none".
    • 
-      
  • stopBits: The default value is 1.
    • 
-    

+    

+      
baudRate

+      
A positive, non-zero value indicating the baud rate at which serial communication should be established.

+      
bufferSize{{optional_inline}}

+      
An unsigned long integer indicating the size of the read and write buffers that are to be established. If not passed, defaults to 255.

+      
dataBits{{optional_inline}}

+      
An integer value of 7 or 8 indicating the number of data bits per frame. If not passed, defaults to 8.

+      
flowControl{{optional_inline}}

+      
THe flow control type, either "none" or "hardware". The default value is "none:.

+      
parity{{optional_inline}}

+      
The parity mode, either "none", "even", or "odd". The default value is "none".

+      
stopBits{{optional_inline}}

+      
An integer value of 1 or 2 indicating the number of stop bits at the end of the frame. If not passed, defaults to 1.

+    

   

 

 
@@ -48,7 +54,7 @@ 
Exceptions

 
Examples

 
 
Before communicating on a serial port it must be opened. Opening the port allows the site to specify the necessary parameters that control how data is transmitted and received. Developers should check the documentation for the device they are connecting to for the appropriate parameters.

-  
+
 
await port.open({ baudRate: /* pick your baud rate */ });

 
 
Specifications

diff --git a/files/en-us/web/api/serialport/readable/index.html b/files/en-us/web/api/serialport/readable/index.html
index df0d537dad66607..5d107d928196aaf 100644
--- a/files/en-us/web/api/serialport/readable/index.html
+++ b/files/en-us/web/api/serialport/readable/index.html
@@ -1,6 +1,6 @@
 ---
 title: SerialPort.readable
-slug: Web/API/SerialPort/SerialPort/readable
+slug: Web/API/SerialPort/readable
 tags:
   - API
   - Property
@@ -14,7 +14,7 @@
 
 
Syntax

 
-
var readableStream = SerialPort.readable;

+
var readableStream = SerialPort.readable;

 
 
Value

 
A {{domxref("ReadableStream")}}.

@@ -22,7 +22,7 @@ 
Value

 
Examples

 
 
The following example shows how to read data from a port. The outer loop handles non-fatal errors, creating a new reader until a fatal error is encountered and readable becomes null.

-  
+
 
while (port.readable) {
   const reader = port.readable.getReader();
   try {
diff --git a/files/en-us/web/api/serialport/setsignals/index.html b/files/en-us/web/api/serialport/setsignals/index.html
index b17abb62a758308..5816eead7615238 100644
--- a/files/en-us/web/api/serialport/setsignals/index.html
+++ b/files/en-us/web/api/serialport/setsignals/index.html
@@ -1,11 +1,11 @@
 ---
 title: SerialPort.setSignals()
-slug: Web/API/SerialPort/SerialPort/setSignals()
+slug: Web/API/SerialPort/setSignals
 tags:
   - API
   - Method
   - Reference
-  - setSignals()
+  - setSignals
   - SerialPort
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

@@ -14,19 +14,23 @@
 
 
Syntax

 
-
var promise = SerialPort.setSignals(options);

+
var promise = SerialPort.setSignals(options);

 
 
Parameters

 
 

-  
options

+  
options{{optional_inline}}

   
An object with any of the following values:
-    
    
-      
  • clearToSend: (Boolean) Indicates to the other end of a serial connection that is is clear to send data.
    • 
-      
  • dataCarrierDetect: (Boolean) Toggles the control signal needed to communicate over a serial connection.
    • 
-      
  • dataSetReady: (Boolean) Indicates that the device is ready to send and receive data.
    • 
-      
  • ringIndicator: (Boolean) Indicates that a ring signal should be sent down the serial connection.
    • 
-    

+    

+      
clearToSend

+      
A boolean indicating to the other end of a serial connection that is is clear to send data.

+      
dataCarrierDetect

+      
A boolean that toggles the control signal needed to communicate over a serial connection.

+      
dataSetReady

+      
A boolean indicating whether the device is ready to send and receive data.

+      
ringIndicator

+      
A boolean indicating whether a ring signal should be sent down the serial connection.

+    

   

 

 
diff --git a/files/en-us/web/api/serialport/writable/index.html b/files/en-us/web/api/serialport/writable/index.html
index 33f6ad4a3f1009c..bcf0011a6ee2887 100644
--- a/files/en-us/web/api/serialport/writable/index.html
+++ b/files/en-us/web/api/serialport/writable/index.html
@@ -1,6 +1,6 @@
 ---
 title: SerialPort.writable
-slug: Web/API/SerialPort/SerialPort/writable
+slug: Web/API/SerialPort/writable
 tags:
   - API
   - Property
@@ -10,11 +10,11 @@
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The writable read-only property of the {{domxref("SerialPort")}} interface returns a {{domxref("WritableStream")}} for sending data to the device connected to the port. Chunks written to this stream must be instances of {{domxref("BufferSource")}} (for example, an {{jsxref("ArrayBuffer")}} or {{jsxref("ArrayBufferView")}} such as {{jsxref("Uint8Array")}}). This property is non-null as long as the port is open and has not encountered a fatal error.

+
The writable read-only property of the {{domxref("SerialPort")}} interface returns a {{domxref("WritableStream")}} for sending data to the device connected to the port. Chunks written to this stream must be instances of {{domxref("BufferSource")}} (for example, an {{jsxref("ArrayBuffer")}} or {{domxref("ArrayBufferView")}} such as {{jsxref("Uint8Array")}}). This property is non-null as long as the port is open and has not encountered a fatal error.

 
 
Syntax

 
-
var writableStream = SerialPort.writable;

+
var writableStream = SerialPort.writable;

 
 
Value

 
A {{domxref("WritableStream")}}


From be69f6290ee940068ac5bb0fa70cf42d9e51f806 Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:26:38 +0000
Subject: [PATCH 04/15] Update files/en-us/web/api/serial/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serial/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serial/index.html b/files/en-us/web/api/serial/index.html
index b644992be42bfd4..5ec2cedac7dbe70 100644
--- a/files/en-us/web/api/serial/index.html
+++ b/files/en-us/web/api/serial/index.html
@@ -45,7 +45,7 @@ 
Examples

 
 
On load event listeners are added for the connect and disconnect events so that the site can react when a device is connected or disconnected from the system. The {{domxref("Serial.getPorts()","getPorts()")}} method is then called to see which ports are connected that the site already has access to.

 
-
If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example we use a {{domxref("Element.click_event")}} event handler on a button for this task. A filter is passed to {{domxref("Serial.requestPort()","requestPort()")}} with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer.

+
If the site doesn't have access to any connected ports it has to wait until it has user activation to proceed. In this example we use a {{domxref("Element.click_event", "click")}} event handler on a button for this task. A filter is passed to {{domxref("Serial.requestPort()","requestPort()")}} with a USB vendor ID in order to limit the set of devices shown to the user to only USB devices built by a particular manufacturer.

 
 
navigator.serial.addEventListener('connect', (e) => {
   // Connect to `e.target` or add it to a list of available ports.

From fb393640ae7328e78e336ed57fc963ef70781ddb Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:27:50 +0000
Subject: [PATCH 05/15] Update files/en-us/web/api/serialport/open/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serialport/open/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serialport/open/index.html b/files/en-us/web/api/serialport/open/index.html
index 7c0b8dc2e118366..b4f05ea1502bb82 100644
--- a/files/en-us/web/api/serialport/open/index.html
+++ b/files/en-us/web/api/serialport/open/index.html
@@ -29,7 +29,7 @@ 
Parameters

       
dataBits{{optional_inline}}

       
An integer value of 7 or 8 indicating the number of data bits per frame. If not passed, defaults to 8.

       
flowControl{{optional_inline}}

-      
THe flow control type, either "none" or "hardware". The default value is "none:.

+      
The flow control type, either "none" or "hardware". The default value is "none:.

       
parity{{optional_inline}}

       
The parity mode, either "none", "even", or "odd". The default value is "none".

       
stopBits{{optional_inline}}


From 231cb9fb48cae961022546b9ebc4335f141ac73f Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:27:59 +0000
Subject: [PATCH 06/15] Update
 files/en-us/web/api/serialport/writable/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serialport/writable/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serialport/writable/index.html b/files/en-us/web/api/serialport/writable/index.html
index bcf0011a6ee2887..78ce5ba466e0301 100644
--- a/files/en-us/web/api/serialport/writable/index.html
+++ b/files/en-us/web/api/serialport/writable/index.html
@@ -21,7 +21,7 @@ 
Value

 
 
Examples

 
-
The following example shows how to write a string to a port. A {{domxref("TextEncoder")}} is converts the string to a Uint8Array before transmission.

+
The following example shows how to write a string to a port. A {{domxref("TextEncoder")}} converts the string to a Uint8Array before transmission.

 
 
const encoder = new TextEncoder();
 const writer = port.writable.getWriter();

From aefa9cd1efef71619bc42497a51a3d47fd9d6710 Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:28:10 +0000
Subject: [PATCH 07/15] Update
 files/en-us/web/api/serialport/ondisconnect/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serialport/ondisconnect/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serialport/ondisconnect/index.html b/files/en-us/web/api/serialport/ondisconnect/index.html
index b0d31ebd175c119..c9f9bc0cac080e5 100644
--- a/files/en-us/web/api/serialport/ondisconnect/index.html
+++ b/files/en-us/web/api/serialport/ondisconnect/index.html
@@ -10,7 +10,7 @@
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The ondisconnect EventHandler of the {{domxref("SerialPort")}} interface is called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface.
+
The ondisconnect event handler of the {{domxref("SerialPort")}} interface is called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface.
 
 
Syntax

 

From 3a46d7ddd99eeb4ad1c01891f8c8067ce313bc74 Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:28:33 +0000
Subject: [PATCH 08/15] Update
 files/en-us/web/api/serialport/onconnect/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serialport/onconnect/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serialport/onconnect/index.html b/files/en-us/web/api/serialport/onconnect/index.html
index 46500261e906506..a9a792f895b0266 100644
--- a/files/en-us/web/api/serialport/onconnect/index.html
+++ b/files/en-us/web/api/serialport/onconnect/index.html
@@ -17,7 +17,7 @@
 
Syntax

 
 
SerialPort.onconnect = function(event);
-  SerialPort.addEventListener('connect', function(event));

+SerialPort.addEventListener('connect', function(event));

 
 
Specifications

 

From 61240df300e8ad755cc2f1326a4f69c9783ac3f5 Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:28:40 +0000
Subject: [PATCH 09/15] Update
 files/en-us/web/api/serialport/onconnect/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serialport/onconnect/index.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/files/en-us/web/api/serialport/onconnect/index.html b/files/en-us/web/api/serialport/onconnect/index.html
index a9a792f895b0266..2ecdf37c7577c6f 100644
--- a/files/en-us/web/api/serialport/onconnect/index.html
+++ b/files/en-us/web/api/serialport/onconnect/index.html
@@ -12,7 +12,6 @@
 
 
The onconnect EventHandler of the {{domxref("SerialPort")}} interface is called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface..

 
-
 The [[eventName]] event fires when [[eventOccurs]].

 
 
Syntax

 

From 8d02072eb09ad317eb41826ee2790b5c8bd8b105 Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:28:46 +0000
Subject: [PATCH 10/15] Update
 files/en-us/web/api/serial/requestport/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serial/requestport/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serial/requestport/index.html b/files/en-us/web/api/serial/requestport/index.html
index 9fba5913155541d..50e2a48068ee6b6 100644
--- a/files/en-us/web/api/serial/requestport/index.html
+++ b/files/en-us/web/api/serial/requestport/index.html
@@ -41,7 +41,7 @@ 
Exceptions

 
 

   
{{domxref("DOMException")}} "SecurityError"

-  
The returned Promise rejects with this error if a Feature Policy restricts use of this API or a permission to use it has not granted via a user gesture.

+  
The returned Promise rejects with this error if a Feature Policy restricts use of this API or a permission to use it has not granted via a user gesture.

   
{{domxref("DOMException")}} "AbortError"

   
The returned Promise rejects with this if the user does not select a port when prompted.

 


From 965cfcf4650ed220dd705c8cd3dee037e4da233f Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:28:55 +0000
Subject: [PATCH 11/15] Update files/en-us/web/api/serial/onconnect/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serial/onconnect/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serial/onconnect/index.html b/files/en-us/web/api/serial/onconnect/index.html
index 6232572a40d1f02..819c833a0471218 100644
--- a/files/en-us/web/api/serial/onconnect/index.html
+++ b/files/en-us/web/api/serial/onconnect/index.html
@@ -10,7 +10,7 @@
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The onconnect {{domxref("EventHandler")}} of the {{domxref("Serial")}} interface is called when a port has been disconnected from the device. This method receives an {{domxref("Event")}} object. The target of this event is the {{domxref("SerialPort")}} interface that has been disconnected.
+
The onconnect {{domxref("EventHandler")}} of the {{domxref("Serial")}} interface is called when a port has been connected from a device. This method receives an {{domxref("Event")}} object. The target of this event is the {{domxref("SerialPort")}} interface that has been disconnected.
 
 
This event is only fired for ports associated with removable devices such as those connected via USB. The user must grant the origin permission to access this device during a call to {{domxref("Serial.requestPort()","requestPort()")}} before this event will be fired.

 

From f7d7d03f96a8b71c93a5291223339f5f3cf38e5b Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:29:55 +0000
Subject: [PATCH 12/15] Update
 files/en-us/web/api/serial/requestport/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serial/requestport/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serial/requestport/index.html b/files/en-us/web/api/serial/requestport/index.html
index 50e2a48068ee6b6..a59d82257db1148 100644
--- a/files/en-us/web/api/serial/requestport/index.html
+++ b/files/en-us/web/api/serial/requestport/index.html
@@ -43,7 +43,7 @@ 
Exceptions

   
{{domxref("DOMException")}} "SecurityError"

   
The returned Promise rejects with this error if a Feature Policy restricts use of this API or a permission to use it has not granted via a user gesture.

   
{{domxref("DOMException")}} "AbortError"

-  
The returned Promise rejects with this if the user does not select a port when prompted.

+  
The returned Promise rejects with this if the user does not select a port when prompted.

 

 
 
Examples


From 3f97a4f3c388cb51fa21218b4fe09e29d49274ce Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:30:08 +0000
Subject: [PATCH 13/15] Update files/en-us/web/api/serialport/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serialport/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serialport/index.html b/files/en-us/web/api/serialport/index.html
index bf597f72c766ea0..4d4e2353bd72e2d 100644
--- a/files/en-us/web/api/serialport/index.html
+++ b/files/en-us/web/api/serialport/index.html
@@ -84,7 +84,7 @@ 
Reading data from a port

 
 
Writing data to a port

 
-
The following example shows how to write a string to a port. A {{domxref("TextEncoder")}} is converts the string to a Uint8Array before transmission.

+
The following example shows how to write a string to a port. A {{domxref("TextEncoder")}} converts the string to a Uint8Array before transmission.

 
 
const encoder = new TextEncoder();
 const writer = port.writable.getWriter();

From 16e40962d14700b4a08245565214c65a0262c033 Mon Sep 17 00:00:00 2001
From: Rachel Andrew 
Date: Tue, 2 Mar 2021 13:32:19 +0000
Subject: [PATCH 14/15] Update
 files/en-us/web/api/serialport/onconnect/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serialport/onconnect/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/files/en-us/web/api/serialport/onconnect/index.html b/files/en-us/web/api/serialport/onconnect/index.html
index 2ecdf37c7577c6f..fe45a4b3d5676f1 100644
--- a/files/en-us/web/api/serialport/onconnect/index.html
+++ b/files/en-us/web/api/serialport/onconnect/index.html
@@ -10,7 +10,7 @@
 ---
 
{{securecontext_header}}{{DefaultAPISidebar("Serial API")}}

 
-
The onconnect EventHandler of the {{domxref("SerialPort")}} interface is called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface..

+
The onconnect event handler of the {{domxref("SerialPort")}} interface is called when the port has disconnected from the device. This method receives an {{domxref("Event")}} object. This event is only fired for ports associated with removable devices such as those connected via USB. This event bubbles to the instance of {{domxref("Serial")}} that returned this interface..

 
 
 
Syntax


From b2abf83d5bb907dd86bf53dc5ca02f8628bdb319 Mon Sep 17 00:00:00 2001
From: Joe Medley 
Date: Tue, 2 Mar 2021 07:46:31 -0800
Subject: [PATCH 15/15] Update files/en-us/web/api/serial/index.html

Co-authored-by: Ruth John 
---
 files/en-us/web/api/serial/index.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/files/en-us/web/api/serial/index.html b/files/en-us/web/api/serial/index.html
index 5ec2cedac7dbe70..90ed5af9a5b6ff8 100644
--- a/files/en-us/web/api/serial/index.html
+++ b/files/en-us/web/api/serial/index.html
@@ -13,7 +13,6 @@ 
Description

 
 
The Serial interface of the {{domxref("Web_Serial_API", "Web Serial API")}} provides attributes and methods for finding and connecting to serial ports from a web page.

 
-
Properties

 
 
Event Handlers