How to open a new tab in separate thread with JavaScript? (chrome) - javascript

Is it possible to open a new popup tab that would run in a separate thread? To be more specific, if I create a new popup tab and start debugging in that new tab, tab which contains link will also pause javascript until I click resume in a new tab. What I want to achieve is to create a new tab that is separated so I can debug it while parent tab continues running.
I have this problem using Chrome browser. Note that this works fine in Firefox (haven't tested in other browsers).

Usually chrome forces new window to run on the same Process ID.
But, there are techniques which allows sites to open a new window without forcing it into the same process:
Use a link to a different web site that targets a new window without passing on referrer information.
Open in new tab and new process
If you want the new tab to open in a new process while still passing on referrer information, you can use the following steps in JavaScript:
Open the new tab with about:blank as its target.
Set the newly opened tab's opener variable to null, so that it can't access the original page.
Redirect from about:blank to a different web site than the original page.
For example:
var w = window.open();
w.opener = null;
w.document.location = "http://differentsite.com/index.html";
Technically the original website still has access to the new one through w, but they treat .opener=null as a clue to neuter the window.
Source: https://bugzilla.mozilla.org/show_bug.cgi?id=666746

The current version of Chrome does not appear to use a separate thread when using the null opener trick that domagojk referenced. However, if you're in a javascript handler you can still take advantage of the noreferrer link trick he mentions:
var e = document.createElement("a");
e.href="/index.html";
e.target="_blank";
e.rel = "noreferrer";
e.click();

Have you tried using Web Workers? Not sure about support, but they're supposed to offer parallel JS execution functionality. See here and here.

While not exactly an answer, to me it is the best answer. The print dialog should not be blocking.
I have reported this as a bug and given a test case. Show your support at here - https://bugs.chromium.org/p/chromium/issues/detail?id=1023161&q=ryein%20goddard&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified
I think once Chromium fixes this bug we won't have to worry about it any more. It is really the only choice at this point.
So to me the answer is we need Google/Chromium to fix this issue.

Related

how return focus on parent window using javascript?

is it possible return focus on tab parent using javascript?
I read some threads about this problem, but i didn't find solutions.
I tried
window.opener.parent.focus()
and
window.opener.focus();
but it doesn't work.
Can someone help me?
Thanks
Generally, you cannot do this inside a web page. Because it's the user's choice which tab/window she wants to focus on and browsers such as firefox and chrome respect such choices by providing configs to open new tabs in the background or not. But under several very special cases, you may still achieve this.
If you want to open a new tab and return focus immediately, you can try to simulate a 'ctrl+click' event on a link to open the tab on the background. Refer to this thread Open a new tab in the background?(Only for chrome, API may already changed. So it may only works on an obsoleted version)
If you are shipping with an extension, do it in the extension code. For example: in chrome extension.
If your script is for a customized browsers which you have control on / you can affect the design, you can implement the function in the browser side and expose an API for your script.

AngularJS: How to open a file in a new tab?

LIVE DEMO
Given a URI of a file, I'd like to open it in a new tab (not a new window).
It looks like it is not possible to use $window.open(uri, '_blank').
So, I tried the following trick:
var link = angular.element('');
angular.element(document.body).append(link);
link[0].click();
link.remove();
and it works.
But, if I put exactly the same code in a promise callback, it doesn't work anymore (it opens the file in a new window instead).
Any idea what's going on here?
PLAYGROUND HERE
From your code/content, you can't force the browser to open a new tab (rather than a new window, or vice-versa). It's up to the browser settings to force it one way or another.
Anything else would be a security risk.
Let us understand fundamental how pop up blocker work.
If user trigger the function to open a new url, then pop up blocker will allow it(it should applied to any modern browser - at least firefox, chrome)
If not from user (like javascript function in background, promise or any other function trigger not from user), browser will block unless user whitelist the site manually.
This is not working.
function openInNewTab() {
window.open('http://stackoverflow.com','_blank');
}
openInNewTab();//fail
This is working
<h1><button onclick="openInNewTab()">Open In New Tab - working</button></h1>
I created simple plunkr version - http://plnkr.co/edit/QqsEzMtG5oawZsQq0XBV?p=preview
So, to answer your question. It is impossible unless user authorize it (user trigger it or white listed the site).
Quote from firefox -
Pop-up windows, or pop-ups, are windows that appear automatically
without your permission.
https://support.mozilla.org/en-US/kb/pop-blocker-settings-exceptions-troubleshooting
*Open in new tab / new windows not make any difference. Pop up blocker will still always block. It doesn't means that browser will allow if open in new tab. It is just coincidentally for certain browser default the settings in that manner.
Workaround
You can ask user explicitly to trigger the function to open in new tab after the background execution.
You can display message in UI to ask user to open the url.
Example - http://plnkr.co/edit/iyNzpg64DtsrijAGbHlT?p=preview
You can only open new windows inside click event handlers fired by the user.
The reason for this is usability.
I'm not sure if all browsers have this behavior but some browsers do not allow scripts to open windows without the user being noticed. Imagine when you visit a web page and suddenly, the web page opens several windows => it's annoying.
See this DEMO (tested with my Chrome and Firefox), even we trigger click event by script, the browser still blocks the popup.
$("#test").click(function(){
openInNewTab();
});
$("#test").click();
You cannot open a new window inside your ajax success callback because your ajax success is run in another cycle after the click event handler has finished its execution.
See this link for a workaround
if I put exactly the same code in a promise callback, it doesn't work
anymore (it opens the file in a new window instead).
I'm surprised that you're still able to open a new window. But this problem really has a lot of things to do with click events fired by the user.
Your problem is two-fold, and both folds tread on uncertain territory.
In the old days of browsers, window.open did exactly that – open a new window. That's because the concept of tabs hadn't been invented yet. When tabs were introduced, they were treated exactly like windows to improve compatibility, and that tradition continues to this day. That, and the fact that window.open was only standardized very recently, means that JavaScript cannot distinguish between windows and tabs.
There is no "normal" way to specify whether a link should open in a new tab or not. You can use the following hack, though: specify a custom window size to the open call (via the third argument), like so:
window.open('http://example.com', '', 'width=' + screen.width);
This will cause almost all browsers to open a separate window because tabs cannot have custom sizes.
In JavaScript, there are trusted events and untrusted events. Trusted events are, for example, legitimate clicks on a link by the user, whereas an untrusted event would be a manual click() call on a link.
Only trusted event handlers may open new windows/tabs. This is to prevent client-side attacks that crash the browser or confuse a user by rapidly opening a hundred tabs on mouseover or something similar.
Your second example doesn't work because the popup blocker blocks the untrusted event that you triggered via the click(). Although it was caused by a real click, the asynchronous call in-between severs the link to trustedness.
working version
$http.get('https://api.github.com/users/angular').then(openInNewTab());
EDIT----------------
Do not know why but a click() method called from a callback function acts differently than calling it straight.
You can see it here with a set interval example.
That is why I had call the function directly rather than going through a callback.
see it with timer callback
or you can use $window service please see here : http://plnkr.co/edit/8egebfFj4T3LwM0Kd64s?p=preview
angular.module("Demo", []).controller("DemoCtrl", function($scope, $http, $window) {
$scope.uri = 'http://martinfowler.com/ieeeSoftware/whenType.pdf';
function openInNewTab() {
var link = angular.element('');
angular.element(document.body).append(link);
link[0].click();
link.remove();
}
$scope.works = openInNewTab;
$scope.doesntWork = function() {
$http.get('https://api.github.com/users/angular').then($window.open($scope.uri));
};
});
For us the following worked well: http://blog-it.hypoport.de/2014/08/19/how-to-open-async-calls-in-a-new-tab-instead-of-new-window-within-an-angularjs-app/
In short: We remember the reference to the new window and changing the location afterwards.

Close multiple firefox windows from javascript

I have a GWT application which has many firefox windows. I need functionality to close all these windows with a single click on a button. I know the window.close() function, but it only closes the current window.
I wonder if there is a firefox plugin or anything what can help me achieve this functionality.
In Firefox the File menu contains an Exit button what terminates the program, but i can't find a way to call this from javascript.
You cannot close other windows with script that didn't open them. But
var newWindow = window.open( url );
newWindow.close();
will open new tab with url and then you will be able to close it with newWindow.close();
When a new window is opened with window.open(), a reference to the new window is returned.
This means var window1 = window.open("example.com", "windowName"); will allow you to close the this new window later with window1.close();
Windows are often opened this way to address your problem, though if the windowName specified existed already, the existing window would be used to load the page instead, and the variable would refer to the existing window.
EDIT: This explains browser windows and associated window control JavaScript here

How to control one window from another in HTML5?

I'm trying to control one window from another in HTML5. I'd like it so when I open one window that I log into, and another window that I login to, then from one window I can click a button and something happens in the other window. I'm not sure where to start; can somebody point me in the right direction?
You don't need any HTML5-Features for that but you can easily do it with javascript:
myNewWindow = window.open() opens a new window and assigns a window-object of that new window to myNewWindow, so you can easily access the new window's DOM from the opening script, using the myNewWindow-variable.
It also works the other way: In a script in the new window, you can user window.opener to access the window-object and DOM of the opening window.
Just make sure, that the content of all your windows is loaded from same domain, as javascript does not allow you to control content loaded from another source (refer to "same origin policy" for more information on this topic).
This answer is 6 months late, but for the Googlers (like me):
I would recommend WebSockets for what you're trying to do Jonathan. WebSockets allow the server to broadcast data to any/all browser windows that are open for your page/site in realtime.
Browser support is currently quite poor but there are good shims to get it working across all browsers very efficiently. Socket.io is one such solution which I've used to great success.

Firefox javascript bookmarklet open tab in background

I've written a bookmarklet to look a word up in a Chinese dictionary:
javascript:Qr=document.getSelection();if(!Qr){void(Qr=prompt('%E8%AF%8D%E8%AF%AD',''))};if(Qr)(function(){window.open('http://nciku.com/search/all/'+Qr);})();
This opens a new tab with search results for your selected word or a word you type in at the prompt. Is there a way to load the new tab in the background? I'd like to keep the focus on the page I'm looking at, and look at the search results later.
There is an option "When I open a link in a new tab, switch to it immediately" in Firefox, this doesn't help.
Edit: Note that this is for my use, so an answer that tells me how to change Firefox (3.0.11) settings to do this would work as well. Also I've tried the following modification, but it's still focusing the new tab.
javascript:Qr=document.getSelection();if(!Qr){void(Qr=prompt('%E8%AF%8D%E8%AF%AD',''))};if(Qr)(function(){var%20oldWin=this;window.open('http://nciku.com/search/all/'+Qr);oldWin.focus()})();
Edit 2:
Looking around to see if I can find an answer I see this guy who's got the opposite problem (new tabs don't get focus, but he wants them to have it), but with no resolution:
Possible to set tab focus in IE7 from JavaScript
There's apparently talk about a _tab target in HTML 5, but that doesn't help me much.
http:/ /forums.whatwg.org/viewtopic.php?t=185&highlight=tab+focus
(apparently as a new user I can only post one link, so I've mauled it)
This seems pretty broken browser behaviour if this is impossible.
In FireFox type about:config and change browser.tabs.loadDivertedInBackground to true.
This has worked for me with browser bookmarklets.
source: http://lifehacker.com/263940/force-links-to-open-in-the-background
No, not programmatically through JavaScript. You don't have control over the user's browser preferences, only they have control over that.
Moreover, even if you did have control over that, you shouldn't do it, because it undermines the control that your script is given to you by the browser. If the user wants a page to open in the background, they should be able to control it, not you, as the developer.
Apparently this is only possible with previously opened windows, not the root window.
Calls to window.open with the same
window name as an already existing
window, loads the URL into that window
and gives a reference to the window
back. The window isn't given focus,
its opener property isn't changed, and
a third argument to window.open is
ignored. You can use the focus method
to give the window focus manually.
var oldWin = window.open("url.html","oldName");
oldWin.focus(); // give focus
Facing the same issue, I only noticed that if you alert() something just after opening the window, Firefox would not switch to the newly opening tab.

Categories

Resources