@alexgyver/serial 1.0.0 → 1.0.1

package/package.json

@@ -1,20 +1,26 @@
 {
   "name": "@alexgyver/serial",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Web Serial API wrapper",
   "main": "./serial.js",
   "module": "./serial.js",
   "types": "./serial.js",
   "scripts": {
-    "build": "webpack --config ./webpack.config.js"
+    "build": "webpack --config ./webpack.config.js",
+    "dev": "webpack serve --config ./webpack.dev.config.js & webpack --config ./webpack.dev.config.js"
   },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/GyverLibs/Serial.js.git"
   },
   "devDependencies": {
-    "webpack": "^5.98.0",
-    "webpack-cli": "^6.0.1"
+    "webpack": "^5.103.0",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^5.2.2",
+    "html-webpack-plugin": "^5.6.5"
+  },
+  "dependencies": {
+    "@alexgyver/utils": "^1.2.2"
   },
   "author": "AlexGyver <alex@alexgyver.ru>",
   "license": "MIT"

package/serial.js

@@ -1,7 +1,11 @@
+import { StreamSplitter } from "@alexgyver/utils";
+
 export default class SerialJS {
     //#region handlers
     onbin = null;
     ontext = null;
+    online = null;
+
     async onopen() { }
     async onclose() { }
     async onerror(e) { }
@@ -9,6 +13,9 @@ export default class SerialJS {
 
     //#region constructor
     constructor() {
+        this.splitter = new StreamSplitter();
+        this.splitter.ontext = (t) => this.online(t);
+
         this._ok = 'serial' in navigator;
         if (this._ok) this._update().then(() => this.onportchange(this.selected()));
         else this._error('Browser is not supported');
@@ -18,9 +25,11 @@ export default class SerialJS {
     opened() {
         return this._open;
     }
+
     selected() {
         return !!this._port;
     }
+
     getName() {
         if (!this._port) return 'None';
 
@@ -42,6 +51,7 @@ export default class SerialJS {
             await this.close();
             let ports = await navigator.serial.getPorts();
             for (let p of ports) await p.forget();
+            await new Promise(r => setTimeout(r, 50));
             await navigator.serial.requestPort();
             await this._update();
         } catch (e) {
@@ -50,6 +60,7 @@ export default class SerialJS {
         }
         this.onportchange(this.selected());
     }
+
     async open(baud = 115200) {
         if (!this._ok) return;
 
@@ -61,7 +72,7 @@ export default class SerialJS {
                 await this._port.open({ baudRate: baud });
                 this._open = true;
                 this.onopen();
-                this.reader.reset();
+                // this.reader.reset();
                 await this._readLoop();
             } finally {
                 await this._port.close();
@@ -72,6 +83,7 @@ export default class SerialJS {
             this._error(e);
         }
     }
+
     async close() {
         if (!this._ok) return;
         if (!this._open) return;
@@ -79,7 +91,11 @@ export default class SerialJS {
         this._close = true;
         if (this._reader) await this._reader.cancel();
 
-        while (this._open) await new Promise(r => setTimeout(r, 10));
+        const t0 = performance.now();
+        while (this._open) {
+            if (performance.now() - t0 > 2000) this._error("Close timeout");
+            await new Promise(r => setTimeout(r, 10));
+        }
     }
 
     async sendBin(data) {
@@ -94,12 +110,11 @@ export default class SerialJS {
             this._error(e);
         }
     }
+
     async sendText(text) {
         await this.sendBin((new TextEncoder()).encode(text));
     }
 
-    reader = new SplitReader();
-
     //#region private
     _port = null;
     _open = false;
@@ -115,15 +130,21 @@ export default class SerialJS {
     }
     async _readLoop() {
         this._close = false;
-        if (this._port.readable) this._reader = this._port.readable.getReader();
+        const decoder = new TextDecoder();
+
         while (this._port.readable && !this._close) {
+            this._reader = this._port.readable.getReader();
             try {
                 while (true) {
-                    let read = await this._reader.read();
-                    if (read.done) break;
-                    if (this.onbin) this.onbin(read.value);
-                    if (this.ontext) this.ontext(new TextDecoder().decode(read.value));
-                    if (this.reader.ontext) this.reader._write(new TextDecoder().decode(read.value));
+                    const { done, value } = await this._reader.read();
+                    if (done) return;
+
+                    if (this.onbin) this.onbin(value);
+                    if (this.ontext || this.online) {
+                        const text = decoder.decode(value);
+                        if (this.ontext) this.ontext(text);
+                        if (this.online) this.splitter.write(text);
+                    }
                 }
             } finally {
                 this._reader.releaseLock();
@@ -131,34 +152,4 @@ export default class SerialJS {
             }
         }
     }
-}
-
-class SplitReader {
-    ontext = null;
-
-    setEOL(eol) {
-        this._eol = eol;
-        this.reset();
-    }
-
-    reset() {
-        this._buf = "";
-        this._skip = true;
-    }
-
-    _write(str) {
-        this._buf += str;
-        let t = this._buf.split(this._eol);
-        if (t.length == 1) return;
-
-        if (t[t.length - 1].length) this._buf = t.pop();
-        else this._buf = "", t.pop();
-
-        if (this._skip) t.shift(), this._skip = false;
-        t.map(this.ontext);
-    }
-
-    _buf = "";
-    _skip = true;
-    _eol = /\r?\n/;
 }

package/serial.min.js

@@ -1 +1 @@
-var e={d:(t,s)=>{for(var r in s)e.o(s,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:s[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t)},t={};e.d(t,{A:()=>s});class s{onbin=null;ontext=null;async onopen(){}async onclose(){}async onerror(e){}async onportchange(e){}constructor(){this._ok="serial"in navigator,this._ok?this._update().then((()=>this.onportchange(this.selected()))):this._error("Browser is not supported")}opened(){return this._open}selected(){return!!this._port}getName(){if(!this._port)return"None";switch(this._port.getInfo().usbProductId){case 21971:return"CH343";case 30084:return"CH340S";case 29986:case 29987:return"CH340";case 21778:case 21795:case 21892:return"CH341";case 1026:case 1027:case 1028:case 1029:case 24577:case 1538:case 24592:return"FT232";case 38144:case 258:case 1281:case 32937:case 6e4:case 60001:case 60003:return"CP210x"}return"Unknown"}async select(){if(this._ok){try{await this.close();let e=await navigator.serial.getPorts();for(let t of e)await t.forget();await navigator.serial.requestPort(),await this._update()}catch(e){this._port=null,this._error(e)}this.onportchange(this.selected())}}async open(e=115200){if(this._ok)try{if(await this.close(),await this._update(),!this.selected())throw"No port";try{await this._port.open({baudRate:e}),this._open=!0,this.onopen(),this.reader.reset(),await this._readLoop()}finally{await this._port.close(),this._open=!1,this.onclose()}}catch(e){this._error(e)}}async close(){if(this._ok&&this._open)for(this._close=!0,this._reader&&await this._reader.cancel();this._open;)await new Promise((e=>setTimeout(e,10)))}async sendBin(e){if(this._ok&&this.opened())try{let t=this._port.writable.getWriter();await t.write(e),t.releaseLock()}catch(e){this._error(e)}}async sendText(e){await this.sendBin((new TextEncoder).encode(e))}reader=new r;_port=null;_open=!1;_close=!1;_reader=null;_error(e){this.onerror("[SerialJS] "+e)}async _update(){let e=await navigator.serial.getPorts();this._port=e.length?e[0]:null}async _readLoop(){for(this._close=!1,this._port.readable&&(this._reader=this._port.readable.getReader());this._port.readable&&!this._close;)try{for(;;){let e=await this._reader.read();if(e.done)break;this.onbin&&this.onbin(e.value),this.ontext&&this.ontext((new TextDecoder).decode(e.value)),this.reader.ontext&&this.reader._write((new TextDecoder).decode(e.value))}}finally{this._reader.releaseLock(),this._reader=null}}}class r{ontext=null;setEOL(e){this._eol=e,this.reset()}reset(){this._buf="",this._skip=!0}_write(e){this._buf+=e;let t=this._buf.split(this._eol);1!=t.length&&(t[t.length-1].length?this._buf=t.pop():(this._buf="",t.pop()),this._skip&&(t.shift(),this._skip=!1),t.map(this.ontext))}_buf="";_skip=!0;_eol=/\r?\n/}var a=t.A;export{a as default};
+class t{ontext=null;constructor(t=/\r?\n/,e=!1){this._eol=t,this._skip=e}reset(){this._buf=""}write(t){if(!this.ontext)return;this._buf+=t;let e=this._buf.split(this._eol);1!=e.length&&(e[e.length-1].length?this._buf=e.pop():(this._buf="",e.pop()),this._skip&&(e.shift(),this._skip=!1),e.forEach(t=>this.ontext(t)))}_buf=""}class e{onbin=null;ontext=null;online=null;async onopen(){}async onclose(){}async onerror(t){}async onportchange(t){}constructor(){this.splitter=new t,this.splitter.ontext=t=>this.online(t),this._ok="serial"in navigator,this._ok?this._update().then(()=>this.onportchange(this.selected())):this._error("Browser is not supported")}opened(){return this._open}selected(){return!!this._port}getName(){if(!this._port)return"None";switch(this._port.getInfo().usbProductId){case 21971:return"CH343";case 30084:return"CH340S";case 29986:case 29987:return"CH340";case 21778:case 21795:case 21892:return"CH341";case 1026:case 1027:case 1028:case 1029:case 24577:case 1538:case 24592:return"FT232";case 38144:case 258:case 1281:case 32937:case 6e4:case 60001:case 60003:return"CP210x"}return"Unknown"}async select(){if(this._ok){try{await this.close();let t=await navigator.serial.getPorts();for(let e of t)await e.forget();await new Promise(t=>setTimeout(t,50)),await navigator.serial.requestPort(),await this._update()}catch(t){this._port=null,this._error(t)}this.onportchange(this.selected())}}async open(t=115200){if(this._ok)try{if(await this.close(),await this._update(),!this.selected())throw"No port";try{await this._port.open({baudRate:t}),this._open=!0,this.onopen(),await this._readLoop()}finally{await this._port.close(),this._open=!1,this.onclose()}}catch(t){this._error(t)}}async close(){if(!this._ok)return;if(!this._open)return;this._close=!0,this._reader&&await this._reader.cancel();const t=performance.now();for(;this._open;)performance.now()-t>2e3&&this._error("Close timeout"),await new Promise(t=>setTimeout(t,10))}async sendBin(t){if(this._ok&&this.opened())try{let e=this._port.writable.getWriter();await e.write(t),e.releaseLock()}catch(t){this._error(t)}}async sendText(t){await this.sendBin((new TextEncoder).encode(t))}_port=null;_open=!1;_close=!1;_reader=null;_error(t){this.onerror("[SerialJS] "+t)}async _update(){let t=await navigator.serial.getPorts();this._port=t.length?t[0]:null}async _readLoop(){this._close=!1;const t=new TextDecoder;for(;this._port.readable&&!this._close;){this._reader=this._port.readable.getReader();try{for(;;){const{done:e,value:s}=await this._reader.read();if(e)return;if(this.onbin&&this.onbin(s),this.ontext||this.online){const e=t.decode(s);this.ontext&&this.ontext(e),this.online&&this.splitter.write(e)}}}finally{this._reader.releaseLock(),this._reader=null}}}}export{e as default};

package/test_dev/index.html

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+  <script src="script.js" type="module" defer="defer"></script>
+</head>
+
+<body>
+  <button id="select_b">select</button>
+  <button id="open_b">open</button>
+  <button id="close_b">close</button>
+  <button id="send_b">send</button>
+</body>
+
+</html>

package/test_dev/script.js

@@ -0,0 +1,32 @@
+import SerialJS from "../serial";
+
+let i = 0;
+let ser = new SerialJS();
+
+select_b.onclick = () => ser.select();
+open_b.onclick = () => ser.open();
+close_b.onclick = () => ser.close();
+send_b.onclick = () => ser.sendText('Hello ' + i++);
+
+// split reader
+// ser.reader.setEOL(/\r?\n/);  // default
+// ser.reader.ontext = t => console.log(t);
+
+// read raw
+// ser.onbin = b => console.log(b);
+// ser.ontext = t => console.log(t);
+ser.online = t => console.log(t);
+
+// state
+ser.onopen = () => {
+    console.log('Opened', ser.getName());
+}
+ser.onclose = () => {
+    console.log('Closed');
+}
+ser.onerror = e => {
+    console.log(e);
+}
+ser.onportchange = () => {
+    console.log('port change', ser.selected(), ser.getName());
+}

package/webpack.dev.config.js

@@ -0,0 +1,39 @@
+const path = require('path');
+const PACKAGE = require('./package.json');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+module.exports = {
+    entry: {
+        index: './test_dev/script.js',
+    },
+
+    output: {
+        filename: 'script.js',
+        path: path.resolve(__dirname, 'dev'),
+        clean: true,
+    },
+
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: `./test_dev/index.html`,
+            filename: `index.html`,
+            inject: true,
+            minify: false,
+            version: PACKAGE.version,
+            title: PACKAGE.title,
+        }),
+    ],
+
+    devServer: {
+        watchFiles: ['test_dev/*.html'],
+        static: path.resolve(__dirname, './dev'),
+        hot: true,
+        open: true,
+    },
+
+    watchOptions: {
+        poll: 1000,
+    },
+
+    mode: 'development',
+};