This is a Chrome Extension that helps with the task of website bug reporting via Trello. It gives you the option to take either a screenshot of the visible portion of the website or a custom selection and allows you to annotate the screenshot (add arrows and boxes). After adding a card title and description, the screenshot can be uploaded to Trello to a board of your choosing, under a specific list, with optional labels. You will also be able to submit your browser information to help with further debugging.
This extension uses Ruby and Node build tools. The following instructions assume that you have both Ruby 2.0+ and Node (with NPM) installed.
- Clone
- Run
gem install bundler - Run
npm install -g coffee-script - Run
npm install -g [email protected] - Run
bundle - Run
foreman start - Add the
ext/folder to chrome as an "Unpacked Extension" - Tweak code within the
srcfolders
-
Refactor edit.coffee
-
Refactor edit.sass
-
Allow screenshots to be attached to existing cardsNow available in version 0.2.0!
Version 0.2.0 published on the Chrome Web Store.
Changes include:
• a ton of bug fixes
• update to browser action to include changelog link, a few other useful links :)
• more bug fixes
• feature: allow screenshots to be attached to existing cards !!!
Bugfixes
Version 0.1.0 published on the Chrome Web Store.
Made the Edit screen responsive. Cleaning up.
Hooked up the final event listeners. Implemented localStorage for previously used boards and lists. Added a login button. Added icons. Getting ready for verion 1 release.
Styled the 'Add New Card' form.
Finished the Trello API integrations. Got uploading working. Added basic forms to do test submits to Trello.
Added annotations functionality. No text for now (since word wrapping is difficult with <canvas>) - only boxes and arrows. Started work on the Trello integration.
Added functionality to the edit view. It now gets populated with the captured image. Started work on adding the annotations functionality.
Finished the partial screenshot selection tool.
Currently working on the partial page screenshot selection. There are no lightweight libraries out there that will do that; therefore, writing a custom solution.
Hooked up event to capture visible page and send the image to an 'edit' screen. Styled the Browser Action:
Set up project. File organization. Started throwing together needed files etc.
Credit where it's due:
-
Loosely based on the extension of louischatriot. Github, Chrome Store
-
Uses the lightweight, enhanced/modified annotation library of DjaoDjin. Github, Website
Legal:
We are not affiliated, associated, authorized, endorsed by or in any way officially connected to Trello, Inc. (www.trello.com).
Tags:
screenshot to trello, trello screenshots, upload screenshot to trello, trello bug reporting, trello qa, website qa trello