ESP Web Tools

ESP Web Tools is a set of tools to allow working with ESP devices in the browser.

To install the ESPHome firmware, connect an ESP to your computer and hit the button:

Note, this only works in desktop Chrome and Edge. Android support has not been implemented yet.

This works by combining Web Serial with a manifest which describes the firmware. It will automatically detect the type of the connected ESP device and find the right firmware files in the manifest.

To add this to your own website, create a manifest and add the button pointing at it to your website:

<script
  type="module"
  src="https://unpkg.com/esp-web-tools@1.0.3/dist/web/install-button.js?module"
></script>

<esp-web-install-button
  manifest="firmware_build/manifest.json"
></esp-web-install-button>

Add the attribute erase-first if you want to first fully erase the ESP prior to installation.

Customize the button or unsupported message by using the activate and unsupported slots:

<esp-web-install-button
  manifest="firmware_build/manifest.json"
  erase-first
>
  <button slot="activate">Custom install button</button>
  <span slot="unsupported">Ah snap, your browser doesn't work!</span>
</esp-web-install-button>