Skip to main content

Developing Userscripts for Chrome (caveats)

To develop Chrome extensions, crx is the best way. But the user scripts that are developed in general for Greasemonkey can also be delivered for Chrome, if a few easy rules are followed.

1. @required and @resource don't work.

By default, atleast for now, These two Userscript metatags donot work on Chrome. If you need to load a js file, instead of using @required - try to use document.createElement. Similarly with @resource.

2. Some GreaseMonkey helper methods don't work or are restricted.

Methods with GM_ prefix from userscript api may not work. Particularly, unsafeWindow, GM_registerMenuCommand, GM_setValue, or GM_getValue are not supported. GM_xmlhttpRequest will work but not only on the same domain.

3. @includes are not shown while installing.
This may not be a deal breaker for developers, but sure is for users. The patterns used in @include is not shown while installing. Instead a generic message is shown as below. This message may scare the users away.

image

To over come this, add @match and show the @include pattern there. The message window pics up the domain portion of the pattern.

image

This actually can be used maliciously. A developer may install a script with a different include pattern and show a different match pattern, there by luring the users to install a malicious script. Although Chrome follows the @include pattern to add script to the page. Just the installation window pops open with @match pattern. Please use this for responsibly.

Here is comments from The Chromium source that explains the reasoning, valid/invalid patterns @match can take:
// Examples of valid patterns:
// - http://*/*
// - http://*/foo*
// - https://*.google.com/foo*bar
// - file://monkey*
// - http://127.0.0.1/*
//
// Examples of invalid patterns:
// - http://* -- path not specified
// - http://*foo/bar -- * not allowed as substring of host component
// - http://foo.*.bar/baz -- * must be first component
// - http:/bar -- scheme separator not found
// - foo://* -- invalid scheme
// - chrome:// -- we don't support chrome internal URLs
//
// Design rationale:
// * We need to be able to tell users what 'sites' a given URLPattern will
//   affect. For example "This extension will interact with the site
//   'www.google.com'.
// * We'd like to be able to convert as many existing Greasemonkey @include
//   patterns to URLPatterns as possible. Greasemonkey @include patterns are
//   simple globs, so this won't be perfect.
// * Although we would like to support any scheme, it isn't clear what to tell
//   users about URLPatterns that affect data or javascript URLs, so those are
//   left out for now.

Popular posts from this blog

Powered By

As it goes, We ought to give thanks to people who power us. This page will be updated, like the version page , to show all the tools, and people this site is Powered By! Ubuntu GIMP Firebug Blogger Google [AppEngine, Ajax and other Apis] AddtoAny Project Fondue jQuery

Decorator for Memcache Get/Set in python

I have suggested some time back that you could modularize and stitch together fragments of js and css to spit out in one HTTP connection. That makes the page load faster. I also indicated that there ways to tune them by adding cache-control headers. On the server-side however, you could have a memcache layer on the stitching operation. This saves a lot of Resources (CPU) on your server. I will demonstrate this using a python script I use currently on my site to generate the combined js and css fragments. So My stitching method is like this @memize(region="jscss") def joinAndPut(files, ext): res = files.split("/") o = StringIO.StringIO() for f in res: writeFileTo(o, ext + "/" + f + "." + ext) #writes file out ret = o.getvalue() o.close() return ret; The method joinAndPut is * decorated * by memize. What this means is, all calls to joinAndPut are now wrapped (at runtime) with the logic in memize. All you wa...

Faster webpages with fewer CSS and JS

Its easy, have lesser images, css and js files. I will cover reducing number of images in another post. But If you are like me, You always write js and css in a modular fashion. Grouping functions and classes into smaller files (and Following the DRY rule, Strictly!). But what happens is, when you start writing a page to have these css and js files, you are putting them in muliple link rel=style-sheet or script tags. Your server is being hit by (same) number of HTTP Requests for each page call. At this point, its not the size of files but the number server roundtrips on a page that slows your page down. Yslow shows how many server roundtrips happen for css and js. If you have more than one css call and one js call, You are not using your server well. How do you achieve this? By concatinating them and spitting out the content as one stream. So Lets say I have util.js, blog.js and so.js. If I have a blog template that depends on these three, I would call them in three script tags. Wh...