In order to connect, first make sure you are running the latest version of Adafruit CircuitPython for your board. You will need to be running CircuitPython 7.1.0-beta.0 or later.
Once you have that installed, head on over to https://code.circuitpython.org.
Before connecting, you will need to place the device in Bluetooth Advertising Mode. This allows devices to see the Bluetooth device. When you power up the device, pay attention to the lights. It should show a solid red light, followed by a blinking yellow light, and then a blinking blue light. When the blinking blue light appears, press the reset button.
You should see the lights go through the same sequence except this time the blue light should be solid. Be sure to place the device in fairly close proximity to the computer or mobile device or it may not show up.
The first time you connect, it you will need to create a bond with the device. This allows it to access the files and stores the device information in Chrome.
At this time, only Android devices with BLE hardware running a more recent version of the operating system such as 6.0 or later will work. If your device meets those requirements and once you have enabled the options in Chrome, the connection steps are the same as Chrome on Linux and macOS.
Chrome on macOS and Linux
With macOS or Linux, the Code Editor should work without additional modification. Just click the Request Bluetooth Device button, select the device from the list, and click Pair. The Bond Bluetooth Device button should turn purple after a moment and you can click that.
Chrome on Windows
Chrome for windows has a known bug where if you attempt to connect the bluetooth device directly through the browser, it will have errors connecting.
To work around this, first go to the Bluetooth Devices settings. You can get there by going to Settings, Devices, and make sure you are on the Bluetooth & other devices tab.
Click Add Bluetooth or other device.
When the dialog comes up, choose Bluetooth.
Your device may appear as CIRC or CIRPY or something similar. Click the device to connect. If you don't see it, make sure it has the required version of CircuitPython, is in Bluetooth Advertising mode, and is close enough to the computer.
Once you do that, you should be able to connect using the Connect Button in the upper righthand corner in chrome.
Once you have connected a device, Chrome saves the Bluetooth connection information for that device. To reconnect, make sure your device is in Bluetooth Advertising mode and just click the Connect Button in the upper righthand corner.
Unfortunately connecting with Bluetooth the first time doesn't always go so smoothly and can involve several attempts before it successfully pairs and shows you the document. Also, Web Bluetooth in general can be a little finicky at times.
Here are a few things to try if you are having trouble connecting:
- Try reloading the web page.
- Restart the device and put into advertising mode again.
- Try removing any existing pairings from the device.
- Try connecting through your Operating System Bluetooth Devices first.
- Try restarting your Browser.
- Try going to chrome://bluetooth-internals, choose the devices tab, and removing any existing devices in there.
- Open up the Console through the toolbar with 3 Dots Menu → More Tools → Developer Tools and see if there are any messages that might provide more clues.
The code editor is relatively new and there may be some bugs, so if you find a reproducible bug, you can always open a new issue at https://github.com/circuitpython/web-editor.