I'm trying to add a sidebar (experimental) to my extension.
I've enabled the "Experimental Extension APIs" in Chrome.
When I invoke:
chrome.experimental.sidebar.show(cTab);
method, (where cTab is current tab) I get an error:
Error during experimental.sidebar.show: This extension has no sidebar
specified.
When I invoke:
chrome.experimental.sidebar.getState(cTab, function (state) { alert(state); });
I get "undefined" in the alert box.
I read the specs of chrome.experimental.sidebar and I have no clue how to add a sidebar to Chrome.
How can I specify a sidebar for my extension? Please help.
First declare sidebar in your manifest:
{
...
"sidebar": {},
...
}
Then to display sidebar.html in a current tab:
chrome.experimental.sidebar.show();
chrome.experimental.sidebar.expand();
chrome.experimental.sidebar.navigate({path: "sidebar.html"});
Here is example extension.
This is no longer supported unfortunately. See:
How to create a sidebar(right-side) in google chrome?
Chrome.experimental.sidebar gone?
http://code.google.com/p/chromium/issues/detail?id=51084
Hopefully they'll add it back new and improved in a future release.
You'll need to use the DOM injection approach.
Related
I just upgrade to chrome 54 and iu'm getting this anoy pop up every time i launch chrome
I tried to use this solution:
run hiew32 demo (in admin mode) and open Chrome.dll
switch to hex view (Enter key)
search for ExtensionDeveloperModeWarning (F7)
press F3 to edit and replace the first letter "E" with any other character
save (F9).
BUT
the string ExtensionDeveloperModeWarning is not present anymore in chrome.dll
So I search and replace any string with the word Warning for larning, and still is not working.
So the problem still exist
Solution: Write a Script to open a new window as soon as chrome is opened and then close the old window.
Add the following code to your background java script file.
chrome.windows.create({type: 'normal',focused: true, state: 'maximized'}, function(window) {
chrome.windows.getAll( function(windows)
{
for(var i=0;i<windows.length;i++)
{
if(windows[i].id!=window.id)
{
chrome.windows.remove(windows[i].id);
}
}
});
} );
Note: To work as expected, after adding/installing the extension to chrome, restart chrome manually
it is not a universal solution, but there is a way for specific extensions by using the whitelist. Add the chromium adm template into the gpedit.msc, and add the ID of the develop mode extensions. Apply and restart chrome. It should be OK.
The solution can both prevent the pop-up warning and give you the permission to use some extensions not in the webstore. If you can use the develop mode extensions but suffer from the pop-up warning, it also can help you.
Sadly Stackoverflow doesn't permit me to post images and too many links, so I have to put relavant things in my blog.
http://yutouyes.blogspot.com/2016/12/using-crx-extensions-added-offline-in.html
Wish it can help.
I've tried several methods but only the one above worked.
I am learning to create a chrome extension. To start, I am trying to just gather all links on the page and display them in the popup window of the extension when the button is clicked. I can't seem to get it right. I am able to use messages and send a message from my chrome tab to the extension. But when I try to pass the array of a tags, then it breaks.
My content script:
window.addEventListener('DOMContentLoaded', function () {
chrome.tabs.executeScript(null, {file: "content.js"});
});
My extension script:
window.addEventListener('message', function(e) {
if (event.source != window)
return;
if (event.data.type && (event.data.type == "FROM_PAGE")) {
console.log("Content script received: " + event.data.text);
console.log(event.data.links);
}
}, false);
if I dont do the links, it works fine and sends the messages. So I can't find another way to send all the links to the extension so I can process them. I have this in a github repo here https://github.com/skiftio/chrome-linkman
Your understanding of the architecture is a bit off. Please read through the Overview page, especially the Architecture part.
I'll even include a helpful picture here:
The popup is counted as "other pages" on this picture. It's an HTML page on its own domain (chrome-extension://yourextensionidhere), which is created when you open the popup and destroyed when you close it.
A content script is a script attached to a real Chrome tab; it gets access to its DOM, but is isolated from the page's own scripts. It also has very limited access to Chrome APIs.
More importantly, there are 2 ways of telling Chrome to add a content script to the page: you can declare it in the manifest so that Chrome automatically injects it upon navigation, or you can programmatically inject it from somewhere in your extension pages. You are mixing up those two.
Your manifest entry refers to scripts.js which is NOT a content script and you should not call it such. For instance, chrome.tabs.executeScript is not allowed to be called from a content script, and it will just throw an error. Since you're also injecting the script from the popup, you should just remove the section from the manifest, you don't need it.
As for messaging, you're trying to use window.postMessage, but this is not standard in Chrome extensions.
Take a look at the full Messaging docs, and I recently gave a short overview here.
In your situation, you could add a listener to chrome.runtime.onMessage to the popup and send a message with chrome.runtime.sendMessage from the content script:
/* --- Popup code (scripts.js) --- */
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse){
if(message.links) {
/* do work */
}
});
chrome.tabs.executeScript({file: "content.js"});
/* --- Content script code (content.js) --- */
var links = document.getElementsByTagName("a");
chrome.runtime.sendMessage({links: links});
I came to know that crossrider.com is helping us to develop extension for different browsers, while keeping the same code.
I have two questions
Question 1:
After going through docs and libraries in crossrider, I still wonder how to get the active tab url.
Question 2:
I also need to open a popup after clicking toolbar icon, similar to google chrome extension.
I came across crossrider siderbar plugin. But, I am unable to change the url for sidebar dynamically.
Do we have any other crossrider plugins which opens like an popup ?
Answer Q1: You can use our appAPI.tabs.onTabSelectionChanged(function callback([{tabId, tabUrl}])) method (soon to be documented). To keep track of the ActiveTab URL, in the callback, simply set a global variable to the callback's optional tabUrl parameter. This is currently supported in Chrome and Firefox.
Answer Q2: I'm afraid that currently there isn't a native popup plugin (your welcome to write one and submit it for consideration ;-)). However, you can configure and use jQueryUI popups from within the extension.
I need to get active tab url in IE.
If it is not possible using jquery in IE, can we use messaging api to send messages from pages to background scope, and store the active tab url in background's global variable?
When I add mouse event breakpoint, devtools always jump into extension's JS.
Is there any way to point to my mouse event code directly?
The only way to disable the script (e.g. to avoid side-effects) is by disabling the extension (for instance, by using incognito mode if the extension is not enabled in incognito mode).
If you don't mind the scripts to run, but want to ignore extension code, then you can use the script blackboxing feature of Chrome's devtools.
If you never develop extensions and aren't interested in stepping through it, then open the settings menu of the devtools, click on Blackboxing and then the "Blackbox content scripts" checkbox:
If you only want to selectively ignore files, then you can also right-click on the source of the file that you want to ignore, and click on the "Blackbox Script" contextmenu option. To remove the pattern, go to the "Blackboxing" settings panel as shown before.
I think the simplest way is to open an incognito window (Ctrl-Shift-N) (or Cmd-Shift-N for mac) and debug in there, because then there will be no extensions loaded (by default).
I know what you mean by this question: when debugging, and doing something simple like pausing execution, you always find it breaks into one of the extension's codes instead of the current webpage's code.
open developer tools, then go to settings and then click on ignore list, and check the checkbox for add content script to ignore list, then add this to the ignore list: ^chrome-extension://
If you're using Google Chrome (or any Chromium-based browsers), simply run a new browser instance with a fresh user's data directory.
On Linux:
google-chrome --user-data-dir=$(mktemp -d)
This way, all extensions will be disabled without having to manually switch off/on them.
I like to use Profiles for that.
While changing into incognito mode might help you to disable most of the extensions, some of them might be allowed and still run. For example I have DarkReader and Ublock enabled in incognito mode.
My favorite workaround is to use a "Guest" profile or to create a profile that you can use for debugging. I think it is easier than creating a Framework Ignore List inside of devtools.
How to create a profile: https://support.google.com/chrome/answer/2364824
Example: My debugging profile
First off you should probably review the tutorial on how to debug chrome extensions here:
http://code.google.com/chrome/extensions/tut_debugging.html
When in doubt, you can always use the debugger keyword directly in the JavaScript code where you want to launch the debugger from, like so:
element.addEventListener("mouseover", function() {
debugger;
// some JS handler code...
});
Depending on if your JS is in a popup, background page, or in a content script, you will need make sure you launch the dev tools from the right place.
For a popup, you need to right click on the extension icon and "Inspect Popup" and then from the JavaScript console you would need to run location.reload(true)
For a background page, you need to go to the extensions settings page, chrome://settings/extensions, turn on developer mode, expand the extension in question and click the background page link.
The content script should be visible directly from the page it is loaded onto.
Is there any API to be used to add a custom item into the chrome context menu?
For example:
Now, I wanna add a "send to ..." item to context menu(right click), when it is clicked the contents selected in the webpage will be sent to someone.
I searched the chrome APIS and found that chrome.experimental.contextMenu is competent for my requirement, however it is experimental API so something like "path_to_chrome.exe --enable-experimental-extension-apis" will be added.
Any other solutions?
Now (for long time) you have an option.
Add this permission to your manifest.json file
"permissions": ["contextMenus"]
Then, something like that will do the trick:
chrome.contextMenus.create({
'title' : 'Open this select text %s',
'contexts' : ['selection'],
'onclick' : function(info, tab) {
console.log('Selected link: ' + info.selectionText);
}
});
Good luck.
Using contextMenu is the one and only way (outside of hacking on the Chromium source), but the API should be graduating from experimental when Google Chrome 6 gets released to the stable channel.