A TypeScript library that wraps the Web Serial API with a minimal, session-oriented RxJS surface. The v2 API exposes a single SerialSession so applications can drive their UI entirely from state$ + isConnected$ + receive$ + lines$ + errors$, without rebuilding state, read loops, or send queues themselves.
- SerialSession (v2) at a glance
- Features
- Framework Support
- Browser Support
- Installation
- Documentation
- Examples
- Project Icon
- AI Assistant (MCP)
- Contributing
- License
- Links
- Session-oriented reactive API: a single
SerialSessionexposesstate$,isConnected$,receive$,lines$,errors$, plusconnect$,disconnect$, andsend$ - UTF-8 text stream:
receive$is already decoded with a streamingTextDecoder, so multi-byte characters split across chunks are joined correctly - Ordered send queue: concurrent
send$calls are serialised internally in call order, without the caller having to manage a writer - Unified error channel: every I/O error is normalised into
SerialErrorand multiplexed onerrors$ - Explicit lifecycle:
state$emitsidle/connecting/connected/disconnecting/unsupported/errorso UIs can drive directly from it - TypeScript support: full TypeScript type definitions included
- Framework agnostic: works with any JavaScript/TypeScript framework or vanilla JavaScript
This library is framework-agnostic and can be used with:
- Angular
- React
- Svelte
- Vanilla JavaScript / TypeScript
The Web Serial API is supported on desktop browsers only. Smartphones and other mobile browsers are not supported.
Supported desktop browsers:
- Chrome 89+
- Edge 89+
- Opera 75+
- Firefox 151+
Safari does not currently support the Web Serial API.
SerialSession.isBrowserSupported() returns a synchronous boolean for feature detection before calling connect$.
Install the package using npm or pnpm:
npm install @gurezo/web-serial-rxjs
# or
pnpm add @gurezo/web-serial-rxjsThis library requires RxJS as a peer dependency:
npm install rxjs
# or
pnpm add rxjsMinimum required version: RxJS ^7.8.0
The canonical v2 map (feature list, the SerialSession / SerialSessionState tables, and a minimal example) is in the package documentation:
The npm README for @gurezo/web-serial-rxjs is a short index; for a first connection, follow Quick Start.
Choosing receive$ versus lines$—terminal-style mirrors and buffering versus newline-delimited logs and parsing—is spelled out in that package README (receive$ vs lines$).
| Doc | Use it for |
|---|---|
| This README | Monorepo hub: feature summary, examples, and contribution links. |
| SerialSession (v2) overview | Full v2 SerialSession / SerialSessionState map and minimal example. |
| Quick Start | Shortest path to a working open port and subscriptions. |
| Advanced Usage | Line framing, request/response-style flows, and recovery. |
| API Reference | Options, SerialSessionState, and SerialError details. |
| v1 → v2 Migration Guide | Replacing the removed v1 SerialClient / ShellClient API. |
Examples are available for the following environments:
- Angular - Angular example using a Service
- React - React example with custom hook (
useSerialSession) - Svelte - Svelte example using Svelte Store
- Vanilla JavaScript - Basic usage with vanilla JavaScript
- Vanilla TypeScript - TypeScript example with RxJS
- Vue - Vue 3 example using Composition API
Each sample is a minimal smoke test for connect, receive (terminal-style append via receive$ so \r redraws stay intact), send, and disconnect. Use lines$ only when you want newline-delimited logging or parsing—not for mirroring interactive terminal output; deeper patterns live in Advanced Usage.
Each example includes a README with setup and usage instructions.
The project icon includes a modified design inspired by the RxJS logo, combined with a serial connector motif to represent Web Serial communication.
The icon is used only to indicate that this library provides RxJS-based abstractions for the Web Serial API.
This project is an independent open source project and is not affiliated with, endorsed by, or sponsored by the ReactiveX or RxJS project.
This project includes Model Context Protocol (MCP) server configuration for AI-assisted development. The following MCP servers are available:
| Server | Purpose |
|---|---|
| nx-mcp | Nx workspace analysis, project graph, CI monitoring, and documentation |
| angular-cli | Angular CLI tools for example-angular (code generation, documentation, best practices) |
| svelte | Svelte/SvelteKit documentation and code analysis for example-svelte |
Configuration files:
.mcp.json- Standard MCP configuration (Cursor, VS Code, Claude, etc.).cursor/mcp.json- Cursor-specific configuration
To use MCP servers in Cursor, the configuration is automatically loaded from .cursor/mcp.json. For VS Code, add the MCP extension and configure it to use .mcp.json, or add the server definitions to your MCP settings.
This repository also ships Cursor rules under .cursor/rules/ (grouped by topic: commits/ for Conventional Commits and PR titles, typescript/, rxjs/, angular/, nx/ including Nx workspace tasks and commit scope guidance, examples/, and workflow/). Rules are split into small .mdc files by responsibility to reduce overlap and keep prompts focused.
.cursor/agents/ci-monitor-subagent.md— optional CI helper used with/monitor-ciand the Nx MCPci_information/update_self_healing_fixtools when Nx Cloud CI monitoring is enabled.
Commit scope tables stay aligned with commitlint.config.js; see .cursor/skills/conventional-commits/ for examples and the scope list.
This project follows a trunk-based development approach:
mainbranch: Always in a release-ready state- Short-lived branches:
feature/*,fix/*,docs/*for pull requests - Releases: Managed via Git tags (e.g.,
v1.0.0), not branches - Version maintenance:
release/v*branches are added only when needed for maintaining multiple major versions
For detailed contribution guidelines, see CONTRIBUTING.md.
For detailed release instructions, see RELEASING.md.
We welcome contributions! Please see our Contributing Guide for details on:
- Development setup
- Code style guidelines
- Commit message conventions
- Pull request process
- Release process
For Japanese contributors, please see CONTRIBUTING.ja.md.
For release instructions, see RELEASING.md (or RELEASING.ja.md for Japanese).
This project is licensed under the MIT License - see the LICENSE file for details.
- GitHub Repository: https://github.com/gurezo/web-serial-rxjs
- Issues: https://github.com/gurezo/web-serial-rxjs/issues
- Web Serial API Specification: https://wicg.github.io/serial/