Hacking Crome extensions - How I added keyboard shortcuts to 1Password in Chrome
I love 1Password. It looks good, it’s safe, it has a web-accessible UI, it has an iPhone/iPad application…
What I didn’t like about it was it’s Chrome extension, which required me to use the mouse to click the 1Password icon in the toolbar each time I wanted to auto-fill a form with login details!! That was so annoying.
So annoying in fact that I took upon myself to implement keyboard shortcuts in the 1Password extensions.
I knew it wouldn’t be that hard, since Chrome extensions are basically JavaScript & HTML files.
And it turned out to be pretty easy indeed:
I added an event listener for keyUp in the content script (that’s executed each time a page is loaded):
window.addEventListener("keyup", keyListener, false);
Then in the keyListener function, I simply check for the keyboard shortcuts I want:
if (e.ctrlKey && e.keyCode) { if (e.keyCode == 220 || e.keyCode == 191 || (e.altKey && e.keyCode == 80)) { chrome.extension.sendRequest({name: "openPopUp"}); } }
That sendRequest line simply calls another JavaScript function, but a function that is defined and executed in the ‘background’ context (the equivalent of a singleton pattern for Chrome extensions). In the background HTML file, I simply added some code in that function that would popup a small window that would show the same popup.html file as when I clicked the 1Password button in the toolbar.
var url = chrome.extension.getURL('popup.html'); [...] window.popUpWindow = window.open(url, "1Password for Chrome", options);
The only thing left was to change the existing functions from popup.html that fetched the available login informations, and auto-filled the forms, to use the parent tab, instead of the current tab, when invoked from the popup. And how lucky I was; there was already a null parameter used for the target window in both those functions! I simply changed that parameter to the parent window id, if the popup was invoked from the keyboard, and that’s it! :)
I now have a working 1Password extension that I can use without my hands leaving the keyboard.
I created a patch of my changes, and posted it in the 1Password forums, so that them developers could take it and base the official implementation from there.
If you really must try it yourself, you can try to patch your extension (version 0.6.2; might not work on future versions; but you can try). Download 1password_chrome_extension_keyboard_shorcut.patch.txt first on your desktop.
In Terminal.app:
cd Library/Application\ Support/Google/Chrome/Default/Extensions/gkndfifopckmhdkohjeoljlbfnjhekfg/0.6.2/ patch < ~/Desktop/1password_chrome_extension_keyboard_shorcut.patch.txt
Result should look like:
patching file onepassword_background.html patching file onepassword_loader.js patching file popup.html patch unexpectedly ends in middle of line
Restart Chrome. Then try the shortcuts: Ctrl-/ or Ctrl-\