Web USB: An operation that changes interface state is in progress error

Question

Suddenly I get an error on a web usb device that connects with my Angular app. The error reads: An operation that changes interface state is in progress.

Edit: more code:

Selecting device & opening connection:

getDeviceSelector() {
  return navigator.usb
    .requestDevice(this.options)
    .then((selectedDevice) => {
        this.device = selectedDevice;
        return this.device.open(); // Begin a session.
    });
}

Communicating with the device (Raspberry Pi)

Start communication with the web-usb on the Pi:

connectedDevice
.then(() => this.device.selectConfiguration(1)) // Select configuration #1 for the device.
.then(() => this.device.claimInterface(0)) // Request exclusive control over interface #0.
.then(() => {
    // Read data every 40 ms
    this.interval = interval(40).subscribe(async () => {
        await this.read();
    });
})

Handle the reading of all the data that is being send:

async read() {
  const result = await this.readOneLine();
  this.readCallbacks.forEach((callback) => {
    callback(result);
  });
}

readOneLine() {
  return this.device.transferIn(1, 8 * 1024).then(
    (result) => {
      return new Uint8Array(result.data.buffer);
    },
    (error) => {
        console.error(error);
    }
  );
}

From there on, we use the readCallbacks function to pass the data we got from to device to a custom event that is been fired.

The error might be related to the new Chrome update, but I can not find changes to the navigator.usb or any other USB related mechanics.

New info will be added as soon as I have it!

Answer 1

In my case, the problem only occurred on some Windows laptops. I had to #1 safely remove the USB-device and #2 plug it in another port. After that, the connection was normal just like before (also on the original USB-port).

It suddenly happened on different computers and at the same time, but we were unable to see the exact environment that caused this issue.