Skip to content
Branch: master
Find file History
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
.scripts
src
.gitignore
CHANGELOG.md
README.md
example.png
package.json
tsconfig.json
yarn.lock

README.md

Cycle.js DevTool for Chrome

A DevTool panel that renders a visualization of the dataflow graph between source streams and sink streams of your Cycle.js app in the inspected page.

Demonstration

For a thorough introduction to "Why" and "How" of this tool, watch this talk: See the data flowing through your app.

Usage

This DevTool requires that your app is built using the following packages:

  • xstream v6.1.x or higher
  • @cycle/run v3.1.x or higher
  • @cycle/dom v12.2.x or higher, if you are using it
  • @cycle/http v10.2.x or higher, if you are using it

Install the plugin from the Chrome Web Store or run npm run dist in this repository to compile the DevTool in the dist directory, then open chrome://extensions/ in Chrome and Load unpacked extension... and point to the dist directory.

If the page is blank and your page is open under the file:// protocol, you need to open Chrome Extensions settings chrome://extensions/ and enable "Allow access to file URLs".

You can’t perform that action at this time.