Connect button doesn't work after canceling the serial port popup

[duianto]

Canceling the serial port popup prevents the connect button (bottom middle) from working, until one of the top left buttons (Device, Library, or Layout) have been pressed, or the page is reloaded.

Expected

The serial popup closes when it's canceled, without showing any error messages.

https://webserial.io/ doesn't show an error message, when the serial popup is canceled:

https://www.serialterminal.com/ shows almost the same error as charachorder.io:

Serial Connection FailedNotFoundError: Failed to execute 'requestPort" on 'Serial': No port selected by the user.

If an error can't be avoided, would it be possible to combine the two charachorder.io errors or ignore the second one?

Previous behavior

Canceling the serial port popup used to show two error messages:

NotFoundError: Failed to execute 'requestPort' on 'Serial': No port selected by the user.

Closing that message, showed a second error message:

TypeError: Cannot read properties of undefined (reading 'toString')

And the connect button worked after closing the second message.

Current behavior, device manager v2.5.0

After closing, the first error message. Nothing happens visually, but the connect button doesn't work.

The second error message appears when one of the top left buttons is pressed: Device, Library, or Layout

The connect button works after closing the second message

DevTools console

It might be caused by or related to the devtools console, error message that appears after closing the first error message:

error-handling.js:64
Uncaught TypeError: Cannot read properties of undefined (reading 'toLowerCase')
at Footer.svelte:27:24
at Footer.svelte:79:67

Trying to click on the Connect (bottom middle) button in this state shows another devtools console error:

device.ts:241
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'forget')
at Te.forget (device.ts:241:21)
at HTMLButtonElement.Wt (Footer.svelte:64:20)

DevTools elements

The devtools elements tab shows that a dialog element is created when the first error message appears, it has an 'open' attribute.
<dialog class="svelte-1g0ixqw" open="">

After closing the first error message, the dialog element remains, but the 'open' attribute is removed.
<dialog class="svelte-1g0ixqw">

The 'open' attribute returns after clicking on one of the top left buttons: Device, Library, or Layout
<dialog class="svelte-1g0ixqw" open="">

Closing the second error message removes the dialog element.

Steps:

Go to https://charachorder.io/
Click connect (bottom middle of page)
On the serial port popup, click: Cancel
An error message appears:

Connection Failed
NotFoundError: Failed to execute 'requestPort' on 'Serial': No port selected by the user.
Troubleshooting Steps
You device may be pre-CCOS. refer to Upgrade to CCOS on how to upgrade your device.
Some USB cables or hubs can cause issues, try directly connecting to a port on your computer with the included cable.

Click: Close

Try to click connect (bottom middle button) to open the serial popup again.
Nothing happens.

Click on one of the top left buttons.
Now the second error message appears:

Connection Failed
TypeError: Cannot read properties of undefined (reading 'toString')
Troubleshooting Steps
You device may be pre-CCOS. refer to Upgrade to CCOS on how to upgrade your device.
Some USB cables or hubs can cause issues, try directly connecting to a port on your computer with the included cable.

Now the connect button works.