rxjs-debug

Automated RxJS Visualizer

npm i rxjs-debug --save-dev

Introduction

RxJS-Debug provides a single utility function to debug complicated RxJS streams. It visualizes the piped-operators, subscriptions and completion.

🤾 Playground

⚡ Example

The utility function $D is the only API that RxJS-Debug has. You can wrap an Observable with it and enable automated logging without any extra effort.

// a simple observable const source = of(1); // wrap it with rxjs-debug // you can also provide an optional id to identify the Observable $D(source, {id: 'Special'}) // returns a copy of the original Observable with logging enabled // apply operators on it (optional) .pipe( map(x => x + 5), switchMap(x => of(x * 2)), delay(200) ) .subscribe(); // activate the stream

This is what you'd get in the console

You can try it out here.

✍ Notes

Please don't leave the $D in your production code/build, rxjs-debug is only meant to be used during development. You should keep the rxjs-debug in your devDependencies and just use $D whenever you need it (for debugging).

🤝 Contributing

We appreciate your help with reporting issues and fixing bugs. We also welcome your suggestions and feedback.

⚖ Licence

MIT

💻 Author

Ankit Singh