I'm trying to make my own version of this open source chrome extension. It's called The Great Suspender. Following is the GitHub link.
https://github.com/deanoemcke/thegreatsuspender/tree/master/src
The context menu has options like "Never suspend this URL." I scanned through all the source but couldn't find that written anywhere. So, where on Earth are the labels for these context menus coming from?
Context menu items are created by some Chrome API. Let's look at the API index: https://developer.chrome.com/extensions/api_index
Aha, looks like chrome.contextMenus API. So let's scan the repository for that.
We see code in the form of
title: chrome.i18n.getMessage('js_context_open_link_in_suspended_tab')
So, that's another API to look up, chrome.i18n. If you've never encountered that abbreviation before, it's short for "internationalization", or enabling your program to be translated.
So, actual strings you're looking for are in the locale files as described by API docs, in _locales subfolder:
https://github.com/deanoemcke/thegreatsuspender/blob/master/src/_locales/en/messages.json
"js_context_never_suspend_page": { "message": "Never suspend this URL" },
That's what you are looking for. Those messages are pulled (in appropriate language, if supported, an in English as default) from messages.json in the locale folders.
Related
I'm looking for a way to automatically extract information from a web page, more specifically an online game (https://www.virtualregatta.com/fr/offshore-jeu/).
In the game, I want to extract/copy the position of the boat. With Mozilla and its debug tools, I used the network debugger and I saw an HTML POST request containing what I want.
It seems that we receive as a response a json containing a structure with latitude/longitude.
This is perfect to me, but I want a more user friendly way to get it and I would need advices. Problem is that I'm really a beginner in web development haha.
Is it possible to do this using a script ? (But I suppose it will be complicated to first log into the game)
Is it possible to create a basic Mozilla plugin which would be able to catch the request/response and copy the position to clipboard for me ?
anything else ?
EDIT:
I've tried using a Mozilla plugin, and I achieved to add a listener on POST request. I see the request to get the boat information but I can't find a way to get the json response in JS.
function logURL(responseDetails) {
console.log(responseDetails);
}
browser.webRequest.onResponseStarted.addListener(
logURL,
{urls: ["*://*.virtualregatta.com/getboatinfos"]}
);
In Chrome I use Broomo for this purposes. It helps you to add scripts in web pages, you can console.log the POST you found, and of course you can create functions and Use the webpage Backend.
In firefox I found this one js-injector. But I didn't use it before.
Update:
Now there are a new extension for both browsers:
Chrome: ABC JS-CSS Injector
Firefox: ABC JS-CSS Injector
Suppose my extension has obtained the URL for the current active tab using the method suggested in How can I get the current tab URL for chrome extension?, e.g.
chrome.tabs.query({
active: true,
lastFocusedWindow: true
}, function (tabs) {
// use first tab to obtain url
var tab = tabs[0];
var url = tab.url
});
How can I determine if the URL refers to a Google Doc to which I have editing rights? The distinction between ownership and being an invited collaborator is not important for this application. I'm interested only in Docs as opposed to Spreadsheets or Forms.
For context on what I'm trying to develop, see: How to manually generate notifications to a Google Doc collaborator?
Alternate answer, based on the Google Drive API rather than the Google Docs UI.
Before doing any of this, make sure to declare permissions in the manifest (to only match URLs that look like docs.google.com/document/*).
Here is a broad overview of the steps you could follow:
GET a
file,
which will return some metadata. You can use the URL you have to extract the relevant ID which is used in the GET request.
Use this metadata file resource to retrieve a permissions resource
In the permissions resource, look at the role attribute: it will be either owner, reader, or writer. You will not have editing rights if you are a reader, but should have editing rights otherwise.
Here is a side by side view of a google doc, where I created a doc, generated a sharing link, and opened it in a browser where I was not signed in to google. I would suggest using a content script to insert a "find" function which would return either true or false if it can locate the "view only" button in the DOM ("view only" meaning you do not have edit permissions). You could make the content script match URLs that look like docs.google.com/document/* only.
Caution: google changes UI pretty frequently so this may not be future-proof. Try inspecting the source of google docs in both situations to look for more clues.
Side by side view:
Source code in the chrome devtools:
I often use Chrome's debugger console for experimenting with javascript code fragments. When I got it right I usually want to copy the needed commands into my script, but here is where it gets messy. The is no filter options for commands and no way to call certain commands back (like with Ctrl-R in Bash) so you need to step through all the commands in the history and copy the commands you want one by one.
Instead, I think it should be possible to retrieve the command history from some file or Sqlite database. But I can't find it.
So my question is: Where is Chrome's debugger console command history stored?
I found an answer here: How to access firefox web console command history?
I had some trouble getting it working, but here is how I did.
Open the developer console (shift-ctrl-I). Then open that console in a new window if it isn't that already by using the menu in the upper right (the three dots).
When it is a separate window, press shift-ctrl-I again. Then paste something like this:
var hist = JSON.parse(localStorage.consoleHistory);
hist.forEach(function(command){
console.log(command);
})
Now, with all the commands in the console you can either copy them all to the clipboard or use the filter field above the console to do some filtering on them (you can use regex).
https://code.google.com/p/chromium/issues/detail?id=171386
Seems there was talk of such a feature which never came to fruition
You can collect some people and pressure the devs to put it in, or get it done.
Sounds really useful to me (:
For retrieving history :
https://developer.chrome.com/extensions/experimental_devtools_console#method-getMessages
How about developing an extension around that ?
Adding To marlars answer :
Actually i think its a little useful to not convert it into json. you can just keep it as a string so that you can use .indexof('yoursearchvalue')
And you don't have to always type that piece of code. you can just go to the Application tab -> Local Storage -> Devtools Entry and click on the consoleHistory
I'm thinking about developing Chrome extension for Gmail and I want to know what are the current best practices.
For instance:
attaching a GPG signature by default to every email
adding an extra button that does something (I have it already)
hijacking action of sending email and prompting me to do complete something
...
(just them examples helping me to discover what is possible)
There are quite a few notable extensions that significantly augment gmail functionality:
http://www.boomeranggmail.com/
http://toolbox.mxhero.com/
http://www.wisestamp.com/
...
(I'm not affiliated with any of them, I just named a few)
One option would be to peek into their source which is located here
~/Library/Application Support/Google/Chrome/Default
But maybe there is (wishful thinking) a good tutorial / set of practises on how to fiddle with gmail UI and functionality?
Gmail extension/gadget API - how to add a button to the compose toolbar?
You will have to create and inject the button programmatically. This will involve quite a bit of scouring the Gmail source code (spoiler: it's ugly).
How to build a chrome extension to add panel to gmail windows?
The greatest long-term challenge you will face is that gmail's layout will change unexpectedly and break email discovery or the modified UI. Both issues either require some cleverness to solve, or will require you to stay up at night wondering whether Google will suddenly break your extension.
http://www.jamesyu.org/2011/02/05/introducing-gmailr-an-unofficial-javscript-api-for-gmail/
They're all building out complex APIs with similar functionality, that can all break independently if Gmail decides to significantly change their app structure (which they inevitably will).
Gmail runs its code through the closure compiler, thereby obfuscating everything. On top of that, Gmail is probably one of the most sophisticated javascript apps out there.
Library by the founder of Parse - https://github.com/jamesyu/gmailr - but haven't updated in 1.5 years.
I can show you what I got so far, and just so know I don't particularly like selectors like .oh.J-Z-I.J-J5-Ji.T-I-ax7
Note: http://anurag-maher.blogspot.co.uk/2012/12/developing-google-chrome-extension-for.html (he also does it, he also uses such an obfuscated selectors)
manifest.json
"content_scripts": [
{
"matches": ["https://mail.google.com/*"],
"css": ["mystyles.css"],
"js": ["jquery-2.1.0.js", "myscript.js"]
}
]
myscript.js
var icon = jQuery(".oh.J-Z-I.J-J5-Ji.T-I-ax7")
var clone = icon.clone();
clone.attr("data-tooltip", "my tooltip");
clone.on("click", function() {
jQuery(".aDg").append("<p class='popup'>... sample content ...</p>");
});
icon.before(clone);
(reusing existing UI elements so my functionality looks natively)
https://developers.google.com/gmail/gadgets_overview
There are Sidebar Gadgets and Contextual Gadgets but they don not offer what I want to achieve.
Gmail Labs is a testing ground for experimental features that aren't quite ready for primetime. They may change, break or disappear at any time.
https://groups.google.com/forum/#!forum/gmail-labs-suggest-a-labs-feature
It seems like the ability to develop Gmail Labs is locked to Google employees.
https://developers.google.com/gmail/
Need help? Find us on Stack Overflow under the gmail tag.
So yes, I would really like to know if there are any tutorials / reference materials out there?
(I reviewed many of the 'Similar Questions' and I'm afraid that my options here are limited, but I would be extremely happy if I shrine your enlightenment upon me)
It looks like you haven't stumbled upon the gmail.js project. It provides a rich API allowing to work with Gmail. However, please note that this project isn't maintained by Google. This means that any changes in the Gmail may break your extension and there is no guarantee that anyone will care to update gmail.js to address these changes.
There is a nice API for interacting with the Gmail DOM here:
https://www.inboxsdk.com/docs/
The getting started example helps you add a button to the compose toolbar.
// Compose Button
InboxSDK.load('1.0', 'Your App Id Here').then((sdk) => {
sdk.Compose.registerComposeViewHandler((composeView) => {
composeView.addButton({
title: 'Your Title Here',
iconUrl: 'Your Icon URL Here',
onClick: (event) => {
event.composeView.insertTextIntoBodyAtCursor('This was added to the message body!')
}
})
})
})
Just ran into this blogpost from Square Engineering Team http://corner.squareup.com/2014/09/a-different-kind-of-scaling-problem.html
It is a chrome extension that displays contact information in the sidebar of Gmail when the user mouseover an email contact. (Just like Rapportive does)
The content script of the app is briefly described. It works as follow :
Check if the current page is an open email using document.location.href != currentUrl (you can also use gmail.js gmail.observe.on("open_email",function()) to achieve this).
Get the DOM element containing the email adress. I found out that this selector works for the sender : $(".acZ").find(".gD")
Insert the element in the sidebar with injectProfileWidget()
I am working on a similar extension that displays contact information pulled from Mixpanel here if you are interested.
I've spent a good few hours trying to crack this myself, having analysed a bunch of other people's work (this is the latest one I've tried to hack Block URL with a specific word somewhere in the subdomain ), and have come up none the wiser.
I feel like the js shouldn't really be that complex, I'm just trying to block a webpage and surface an error message in its place.
This is where I've netted out atm:
chrome.declarativeWebRequest.onRequest.addRules({
id: 'some rule id',
conditions: [
new chrome.declarativeWebRequest.RequestMatcher({
url: {
host: 'www.dailymail.com'
}
})
],
actions: [
new chrome.declarativeWebRequest.CancelRequest()
]
});
The answer at Block URL with a specific word somewhere in the subdomain works as expected. When it does not work, follow the following steps to troubleshoot the problem:
Open the background page's console and look for error messages.
Search for the error message on Google, and try to understand the recommended results. Trustworthy sources include Stack Overflow, the extension documentation, Chromium's bug tracker, the chromium-extensions and chromium-apps mailing lists.
Check whether you have added the correct permissions to your manifest file.
If you have just added the new permissions, make sure that you have reloaded the extension (e.g. by clicking on Reload at chrome://extensions/).
With the information you've provided, I can think of three reasons for failure:
Are you using Chromium beta, Chromium dev (or even Canary)? If not, then either install Chrome from one of these channels, or use the webRequest API instead. The declarativeWebRequest API is currently not available on the stable channel, only on the beta and developer channels.
url is an object of the type UrlFilter. There is no property called "host", if you want to match an exact host, use hostEquals, like this:
url: {
hostEquals: 'www.dailymail.com'
}
You have not added the correct permissions. To get your demo to work, you need to declare the declarativeWebRequest and *://www.dailymail.com/* permissions in the manifest file.