Google Chrome // extension

[afuna]

Have finally redownloaded Google Chrome because I need it for some troubleshooting. Before doing so, I looked up how to disable auto-update, and discovered that it's now a matter of changing a setting via the Terminal, rather than deleting the auto-update program. This seemed a lot less virus-like creepy, so I have Google Chrome on my system right now, and feel okay about it.

While moving over settings, I discovered I'd have to restart Firefox -- shutting down Firefox took over an hour! And ate up all my CPU! I had to force-quit it after all; luckily didn't lose any data.

As a bit of amusement, I decided to see what it would take to get me to switch over to use Google Chrome regularly. At a minimum, I'd need:

• Adblock and/or JS blocker (I went with Adblock, but I'll try to retain all my casual browsing on Firefox with NoScript on)
  
• Something to keep count of open tabs (settled on TabGlutton)
  
• Ability to quickly edit and preview CSS (probably somewhere, but I haven't looked for it; just the current hacky ways are enough for now)
  
• Firebug or equivalent (built-in)
  
• Greasemonkey script support (built-in)
  
• ReadItLater (Found ChromeItLater; slightly clumsier than the official extension Firefox, but workable)
  
• A JS shell (I have a bookmarklet, but I eventually decided to go with the jsshell extension)
  
• a JSON prettifier (JSONView for chrome)
  
• The ability to copy just the link text instead of the link address

I found what I needed, or a good-enough equivalent, for everything but the last one. Searching through the extensions site and through the greater web turned up nothing. So.... I ended up writing my own.



It didn't take long; however, figuring out the difference between the content_scripts side (which lets you manipulate the webpage) and the main extension body in background_html (which lets you manipulate the browser behavior) took some doing.

The basic "hello world" example shows you how to create a regular extension, one which interacts with the browser. It took me an embarrassingly long time to figure out there was something beyond that.

After I figured out that the reason my extension wasn't doing anything was because it was running once when the extension loaded, when it needed to be running once per page, I slowly came to the realization that I'd need something like body.onload. Unfortunately, even after going through all the links from the getting started portion of the tutorial, I had still overlooked the other part of the API which would enable me to interact on a per-page basis (hello content_scripts!). I tried to force it by using chrome.tabs.onUpdated.AddListener... if ( changeInfo.status == "complete" ) as a poor extension writer's body.onload and that worked, but wow was it ugly :D

I can't remember how I found the link, but after finding that section in the documentation, I was more than halfway there.

In my initial version, I tried to programmatically create a range (document.createRange()) to select the text in the content scripts portion of the page. Right after that, I'd rely on some timing hackery to run document.execCommand("copy") (yeah I didn't know this function existed until now either) in the extension trusted area. It worked, ish, but was ugly and hacky and brittle.

Reason I had to put document.execCommand in the extensions area: it seems to need to be run with higher privileges. If it were available to the website, any website could see your clipboard, and that could potentially leak information. Since extensions are more trustworthy -- you choose whether to install them, and I believe they're vetted to some extent by reviewers before they are distributed in the gallery, they are allowed to execute with higher privileges than Joe Random Website.


On the second version, I figured out I could send just the relevant information (the link text) to the main extension body via a communication pipe, and have the copying take place there. That took away all the worst of the brittleness and most of the hackishness (there still is some ;-)), as well as gave me some flexibility for being able to output in multiple formats should I choose to code that in in the future, and I am quite happy with the results.

I can't take credit for it though: I had the glimmerings of the idea on my own, but I didn't actually get it to work until I peeked into the source code of Auto Copy.

So anyway, there it goes. Have made a Google Chrome extension, it wasn't very painful once I managed to wrap my mind around how everything fit together, and I'm happy with the results.


Ohh one final thing: for a long time, I thought that console.log() didn't work in extensions, and struggled with that. It turns out:

a.) console.dir in Google Chrome is the equivalent of console.log in Firebug; and
b.) If your console.log calls are in your main extension body, you need to open the background.html view from the extensions tab, as the console log output is put there. If your console.log calls are in a content_scripts js file, then they'll show up in the webpage

And there! :D

Comments

[pinesandmaples]

I didn't understand anything past the cut, but that's okay. I'll be over there, fawning over your geek self.

[afuna]

Heee, thank you for reading ♥

[branchandroot]

This sounds very similar to dealing with Wordpress. *amused* It doesn't do a lot of what you need it to, but it's sufficiently amenable to being plugged that you wind up just writing those parts yourself.

[afuna]

*grin* And in the process provides you just enough leeway to shoot yourself in the foot? ;-)

(IT FEELS LIKE THAT IS WHAT CHROME IS DOING TO ME)

[jeshyr]

totally!

Anything that doesnt allow foot shooting is probably too limited to be useful :)

[dreamatdrew]

re: chromeitlater
OH GODS IT HURTS

[afuna]

Hhaha. Hooow?