Developing Chrome Extensions for Salesforce
Developing Chrome Extensions for Salesforce
Chrome extensions are awesome, they provide amazing convenience that is limited only by your imagination.
some of created by me:
- 4. Quick Debug
you can download from Chrome Web Store
What are extensions?
Extensions are small software programs that customize the browsing experience. They enable users to tailor Chrome functionality and behavior to individual needs or preferences. They are built on web technologies such as HTML, JavaScript, and CSS.
An extension must fulfill a single purpose that is narrowly defined and easy to understand. A single extension can include multiple components and a range of functionality, as long as everything contributes towards a common purpose.
Chrome Extension Structure
A Chrome Extension is made up of a JavaScript, HTML, images and JSON. At its core is a manifest file which contains the metadata describing your application in JSON. There is a lot of documentation about the structure of this file but some of the key elements are shown below.
Create a manifest.json file and fill in the following information.
{
"name": "Quick Test Run",
"version": "0.1",
"description": "This extension allows you to Run Test Class in Force.com organization.",
"manifest_version": 2,
"icons" : {
"16": "img/icons/16.png",
"48": "img/icons/48.png",
"128": "img/icons/128.png"
},
"permissions": [ "tabs", "https://*.force.com/*", "https://*.salesforce.com/*"],
"author": "Sanjay Rathore",
"content_scripts": [ {
"js": [ "js/jquery.js",
"js/forcetk.js",
"js/contentscript.js" ],
"matches": [ "https://*.salesforce.com/*", "https://*.force.com/*" ]
}]
}
This file references all external resources (JavaScript, images etc.), the important parts here being the JavaScript i.e. jquery.js, forcetk.js and contentscript.js. In short these files represent:
jquery.js – the jQuery library
forcetk.js – the JavaScript wrapper for the Salesforce.com REST API, but with one modification i.e. the ability to fetch info about the current user
contentscript.js – Content scripts are JavaScript files that run in the context of web pages. By using the standard Document Object Model (DOM), they can read details of the web pages the browser visits, or make changes to them.
Custom JavaScript File : Below Example to gets the session ID from the user’s cookie (the extension works in the context of the current user session for that tab) and uses REST API forcetk JS library to Query Salesforce Data.
/* Get the cookie values om nom nom */
function getValueFromCookie(b) {
var a, c, d, e = document.cookie.split(";");
for (a = 0; a < e.length; a++)
if (c = e[a].substr(0, e[a].indexOf("=")), d = e[a].substr(e[a].indexOf("=") + 1), c = c.replace(/^\s+|\s+$/g, ""), c == b) return unescape(d)
}
/* Encapsulating code instead of just letting it lay about */
function init() {
// Get an instance of the REST API client and set the session ID
var client = new forcetk.Client();
client.setSessionToken(getValueFromCookie("sid"));
// Retrieve the data representing the current user
client.currentUser(function(response){
var user = response;
// Find cases that belong to the current user
client.query("SELECT Id,Name from Account where name like 'Sanjay%'"), function(response){
console.log(response.totalSize);
});
});
}
init();
Running the Extension
extension-loaded Finally we are ready to load the extension into Google Chrome to see if it works. You do this by navigating to chrome://extensions/. Turn developer mode on if it is off. Next click the Load unpacked extension… button. You will be presented with a folder browser. Find the folder you created for the extension, and press OK. The extension should now load and display in the list. A browser action icon should also be visible in the toolbar.
Click For More detail and help...
Happy Sharing...
Everyone has their own favourites, so please feel free to share yours in the comments below!
/* Get the cookie values om nom nom */
function getValueFromCookie(b) {
var a, c, d, e = document.cookie.split(";");
for (a = 0; a < e.length; a++)
if (c = e[a].substr(0, e[a].indexOf("=")), d = e[a].substr(e[a].indexOf("=") + 1), c = c.replace(/^\s+|\s+$/g, ""), c == b) return unescape(d)
}
/* Encapsulating code instead of just letting it lay about */
function init() {
// Get an instance of the REST API client and set the session ID
var client = new forcetk.Client();
client.setSessionToken(getValueFromCookie("sid"));
// Retrieve the data representing the current user
client.currentUser(function(response){
var user = response;
// Find cases that belong to the current user
client.query("SELECT Id,Name from Account where name like 'Sanjay%'"), function(response){
console.log(response.totalSize);
});
});
}
init();
Comments
Post a Comment