Web Serial

<!doctype html>
<meta charset="utf-8">
<title>Web Serial · ejemplo mínimo</title>
<!-- Terminal serie: abre un puerto (Arduino, micro:bit, ESP32…), muestra lo que llega y envía líneas.
     Chrome y Edge 89+; Firefox 151+ (pide instalar un complemento de permiso); Chrome Android 148+. HTTPS o localhost. -->
<button id="connect">Abrir puerto</button>
<input id="line" placeholder="Texto a enviar" disabled> <button id="send" disabled>Enviar</button>
<pre id="out"></pre>
<script>
  const $ = (s) => document.querySelector(s);
  let writer;

  $('#connect').onclick = async () => {
    if (!('serial' in navigator)) return ($('#out').textContent = 'Web Serial no está disponible en este navegador.');
    const port = await navigator.serial.requestPort();
    await port.open({ baudRate: 115200 });

    // Escribir: texto → bytes
    const encoder = new TextEncoderStream();
    encoder.readable.pipeTo(port.writable);
    writer = encoder.writable.getWriter();
    $('#line').disabled = $('#send').disabled = false;

    // Leer: bytes → texto, hasta que se cierre el puerto
    const reader = port.readable.pipeThrough(new TextDecoderStream()).getReader();
    while (true) {
      const { value, done } = await reader.read();
      if (done) break;
      $('#out').textContent += value;
    }
  };

  $('#send').onclick = async () => {
    await writer.write($('#line').value + '\n');
    $('#line').value = '';
  };
</script>