Skip to content
Dynamically create an animated GIF of a page running in Chrome
JavaScript
Branch: master
Clone or download
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.
.gitignore
README.md
index.js
package.json

README.md

chrome2gif

Create an animated GIF from a page or animation rendered in Chrome via the debugging protocol's screencasting feature

TOTALLY WORK IN PROGRESS/ALPHA/EXPERIMENT

Getting it working

You want to be running an instance of Chrome with the debugging protocol working on port 9222.

I do this, for example:

/Applications/Google\ Chrome\ Canary.app/Contents/MacOS/Google\ Chrome\ Canary --remote-debugging-port=9222

For now it's not quite ready to use as a proper module as the structuring is terrible and it's not on npm.. but the code is all in and working, so you can test it like so:

npm run example
open /tmp/output.gif

This will navigate to a lovely GIF of Homer Simpson, capture frames for a second, then write them out to /tmp/output.gif. Want to go somewhere else?

npm run example https://slashdot.org/

.. and so on. Currently it starts recording while the page is still rendering - this may or may not be desirable!

You can’t perform that action at this time.