Commander 
¶
Welcome to the documentation for Commander!
Note
Commander is still work in progress and anything can change at any time. Most of the documentation pages are stubs. You can commit to the documentation over at the GitHub repository.
What is Commander?¶
Commander is a small Chrome extension that attempts to help improve your development workflow by providing easy to use commands from the omnibox.
How does it work?¶
Commander takes advantage of an API that Chrome provides which allows you to use the omnibox in order to pass input to the extension. So, by taking advantage of that, we can make a command system purely using Chrome’s omnibox and vanilla APIs.
Can I have some screenshots?¶
Yes! And better yet, some GIF images have been thrown in there too!
Prompt:
Command names and descriptions:
Search function:
Notification:
Arguments example:
Installing Commander¶
To install the development version of Commander, enable the Developer Mode over at chrome://extensions (should be in the top right), clone the GitHub repository, click “Load Unpacked” and select where you cloned Commander. This should load it into Chrome.
Using Commander¶
To use Commander, go to the address bar (known as the omnibox), type # and press space. This will bring you into the Commander prompt. As you type, Commander will look through its commands to see if your query matches any of them.
Element¶
Note
This command uses jQuery to provide functionality.
Warning
This command is currently buggy. Functionality described may not be how it actually works.
Element manipulation tools.
| Parameter | Description |
|---|---|
| action | The action to perform when manipulating elements. Either create, delete or text. |
| query string | The query string to perform the action on. |
| type (create) | The type of element to create, such as div, p, etc. |
| text (text) | The text to put in to the element. |
| id (create) | The ID of the newly created element. |
| classes (create) | The classes to add to the newly created element. |
Usage¶
# element [action] [query string] [type (create) or text (text)] [id (create)] [classes (create)]
Help¶
Brings you to the ReadTheDocs page, or the page for the command specified.
| Parameter | Description |
|---|---|
| command | The command to automatically go to on the documentation. |
Usage¶
# help [command (optional)]
Highlight-Updates¶
Note
This command uses jQuery to provide functionality.
Highlights whenever an element updates with a red outline that disappears after a second, à la React’s “Highlight Updates”.
| Parameter | Description |
|---|---|
| toggled | Toggles whether Commander should highlight updates or not. |
Usage¶
# highlight-updates [toggled]