Open chrome extension in a new tab - google-chrome

I have implemented a chrome extension. Was wondering if the popup.html can be opened in a new tab? Every single click on the page, and the popup disappears :( .. Was wondering if I can stick it to the page or is there a way to open the extension in a new page?

Yes, a popup page is just a normal extension page, you can do the following to open a new popup tab from the background page. I use that every time when the user first installs the extension, I open the about page, you can do the same for the popup page.
chrome.tabs.create({url: 'popup.html'})
For one of my extensions, My Hangouts, I have a small "open as tab" button within the popup, I bind the click event for that link to execute this:
chrome.tabs.create({url: chrome.extension.getURL('popup.html#window')});
The reason why I passed the hash is because I wanted to add more content when the user opens it in a popup because there is more real estate to play with.
Within the popup, I use normal JavaScript to differentiate whether I opened the tab in the new tab page or in a normal page like the following:
if (window.location.hash == '#window') {
this.displayAsTab = true;
}
You can do tricks like this to make your extensions user experience better.

here is the same issue: Chrome Extension: onclick extension icon, open popup.html in new tab
use:
chrome.tabs.create({'url': chrome.extension.getURL('popup.html')}, function(tab) {
// Tab opened.
});
property "pinned" to stick the tab.

Related

How to keep the Chrome extension window open after I click a link?

I'm having this issue with a simple extension I'm working on.
The extension consists of a bunch of links. When I click a single link, the extension closes.
I would like to keep the extension window open so I can open more links before closing the extension/clicking on the page to continue working.
Is there a way I can keep the extension open once a single link is clicked and only close it when I click on the page/lose focus?
Thanks.
Switching to another tab in the same window closes the popup because the popup is conceptually bound to the tab where it was invoked. When you open a URL it opens in a new active tab by default ("active" means it's currently in foreground), the old tab loses its active status, its popup closes.
The solution is to open the links in an inactive tab i.e. in background.
document.addEventListener('click', evt => {
const a = evt.target.closest('a[href]');
if (a) {
evt.preventDefault();
chrome.tabs.create({url: a.href, active: false});
}
});
Alternatively, open the links in a new window using chrome.windows.create.

How can I know if my Chrome Extension is called from a New Tab page?

My Chrome Extension has a popup with a few links, which I would like to be opened in the current tab if it's a New Tab page, or open in a new tab otherwise. So I believe I need to know the active tab's URL. Or is there another way to identify a New Tab?
I'd like to use the "activeTab" permission rather than "tabs" - I want the user to see as few permissions listed as possible.
The only way I've found to identify the tab's URL is by using a background page and
chrome.browserAction.onClicked.addListener(function(tab))
But this is not compatible with having a popup defined in the manifest. I can set the popup page programatically, but I can't see a way to make the popup appear. Is there a way to do that?
When I have default_popup defined in the manifest I use
document.addEventListener('DOMContentLoaded', function ())
to launch the related code, so no reference to the active tab is available. Is there another way to run the code, or to get the active tab?
Thanks.
The activeTab permission allows you to "Get the URL, title, and favicon for that tab via an API that returns a tabs.Tab object". So, to get the current tab URL from the popup you can do:
chrome.tabs.query( {active:true, currentWindow: true}, function(tabs) {
currentUrl = tabs[0].url;
});

Keep Text in TextArea in Chrome Extension Popup

Chrome extension popups are designed per the FAQ to close when clicked away from.
I have a firefox add-on that will remember the text typed into the text area when the popup is clicked open or closed.
I assume this is the case because the popup merely opens and closes the html, as opposed to the chrome version which calls window.onload each time.
The chrome extension popup however seems to call popup.js each time you click the icon, which I assume is because popup.js is linked from popup.html because page scripts have to be "moved out" in chrome for security.
Is there a way to keep data typed into a textbox, when the extension reloads and "erases" the text?
Anytime the content of the textarea changes, store the new value in localStorage. When the popup loads again, check local storage for a value and populate the textarea.

Open a link to new tab inside a ifame of iframe

I have a iframe-1 and it contains another iframe-1-1.[1]
Inside iframe-1-1 which contains a link.
When a user click the link:
It should open a new tab (For instance, Firebug/or Chrome).[2]
But it does not work. How can I do that?
[1] Why I have this question: because I code a webpage, it is embedded in Facebook, and I call FB.dialog it will show me a dialog is a iframe too.
[2] It works properly if I use wheel button to click.
You can't instruct a browser to open a new tab. The best you can do is to use target="_blank" and hope that the user is using a browser that will open a tab and not a new window.

How do I focus an existing tab in a window? (web page, not extension)

I'm trying to focus an existing tab when the content reloads. The usual window methods don't seem to work.
Here's whats happening: On page_1 I have a link like...
Go to my other page
If the tab doesn't exist, when the link is clicked it opens a new tab and takes focus. (Perfect)
If you then go back to page_1 and click the link again, it reloads the content in the existing tab (perfect) but doesn't focus (crap). I've tried the usual window.focus, $(window).focus methods on load with page_2 without luck.
Any recommendations?
It is impossible.
The following appears to work in IE8 and FF13:
<script type="text/javascript">
// Stupid script to force focus to an existing tab when the link is clicked.
// And yes, we do need to open it twice.
function openHelp(a) {
var tab = window.open(a.href, a.target);
tab.close();
tab = window.open(a.href, a.target);
return false;
}
</script>
Help
There is a workaround to this. Use javascript to open a window in a new tab, store a reference to that tab, and when you want to focus it; close it first and then re-open it.
if (window.existingWindow != null)
try { window.existingWindow.close(); } catch (e) { };
window.existingWindow = window.open("/your/url", "yourTabName");
We use a similar approach to opening the preview pane of the current page you're working on in our service called Handcraft where the above works as expected (we wanted the new window to always focus).
Without using a framework you can put a script block at the bottom of your page that will run once the page loads. Because it is after your HTML you can be assured that the HTML is refers to is actually available.
The script can set the focus to the element you want.