I'm trying to load a file in the browser and then refresh it when an event is fired. I'm using the node-open module:
var open = require('open');
var url = 'http://www.stackoverflow.com';
var myWindow = open(url); //returns a child process
myWindow.on('refresh', function() {
open(url);
});
// stuff...
myWindow.emit('refresh');
The open() method returns a child process, so I'm attaching an event listener to it that is triggered when the refresh event is fired. However (as you can see) a new window is opened when refresh is fired. How can I keep track of the original window and refresh it?
If you really mean an external browser, then I'm not sure, but if you're using the window.open in node-wekbit, you could do this:
var url = 'http://www.stackoverflow.com';
var myWindow = open(url); // returns a Window object
. . .
myWindow.window.location.reload();
This will open another node-webkit window with the given url, but beware that it's not as safe to browse with node-webkit as with a standard browser as not all of the security protections are in place.
If you're talking about an external browser, then I'm not sure there is an easy solution. I don't think there's a signal you can send a child process to cause a browser reload.
Related
I am trying to open a new window with a URL for oAuth, however I cannot add any event listener.
const wind = window.open(msg.data.url);
console.log(wind);
wind.onload = function () {
wind.onpopstate = function (e) {
console.log('pop', e);
};
};
It just does nothing. However it turned out that window.open() has given me a not full window object. And that is all what I have got. How do I add event listener for that?
According to the MDN web docs regarding the window.open() function:
The returned Window reference can be used to access properties and
methods of the new window as long as it complies with Same-origin
policy security requirements.
That means if you call window.open("/questions") in a terminal on this webpage, you get a full window object, but if you call window.open("https://google.com"), it returns only a simplified object on which you will not be able to add event listeners. This is to prevent cross-origin attacks. You may, however, transfer data to the new window object via Window.postMessage(), if the new window is listening for that type of event. See here for more information on that.
While building my Chrome extension, it's often very useful to open a new browser tab and paste this into it:
chrome-extension://xyzfegpcoexyzlibqrpmoeoodfiocgcn/popup.html
When I do that I'm able to work on my popup UI without it ever closing, and without having to click the extension icon at the top right and have the popup sometimes close on me.
Here's the problem: I need my js (referenced by popup.html) to know whether i'm in this debug tab, or whether it's running in "regular mode" (clicking the extension icon and running it normally). I first tried this:
var isDebugExtensionTab = (location.href.indexOf("chrome-extension:") == 0);
That doesn't work because it always evaluates to true -- that is the location.href in all cases, debug tab or regular mode.
How can I detect the difference?
Use chrome.tabs.getCurrent:
Gets the tab that this script call is being made from. May be undefined if called from a non-tab context (for example: a background page or popup view).
var isDebugExtensionTab = false;
chrome.tabs.getCurrent(function(tab) { isDebugExtensionTab = !!tab; });
It's asynchronous as all chrome.* API methods that may accept a callback so the result won't be available until the current context exits. If you need to use the value immediately, do it in the callback:
var isDebugExtensionTab = false;
chrome.tabs.getCurrent(function(tab) {
isDebugExtensionTab = !!tab;
runSomeDebugFunction();
});
Below is my code.
It is resulting in unexpected behaviour.
It navigates to bing.com but it does not fill in the text field. Also, I have noticed that the console get cleared after navigating to a new webpage.
window.location = "https://www.bing.com";
window.onload = function(){
var editSearch = document.getElementById("sb_form_q");
editSearch.value = "Quux";
}
You are binding the onload function to the existing window object.
When the browser loads the new page, it will make a new window object which won't have your property set on it.
JavaScript run in one page (even when you are running it through developer tools) can't persist variables onto a different page.
(Storage mechanisms like localStorage and cookies are available, but you would need code in the subsequent page to look for them).
JavaScript is only valid for the current page you are on. When you are executing code from DevTools console, you are executing code on that page itself. So, when you navigate to another page using window.location you loose the onload handler you have defined.
To add handlers to a different page, it must be connected to your page (the parent) in some way, like an iframe or a popup.
ifrm = document.getElementById('frame');
ifrm.src = 'http://example.com';
ifrm.contentWindow.onload = function () {
// do something here with
// ifrm.contentWindow.document.getElementById('form')
}
As #Quentin said.
But you can do another way like ..
var keyword = "Quux";
window.location = "https://www.bing.com/search?q="+keyword;
I am developing an HTML5 app specifically for Android and Chrome. The problem I have stems from the requirement to track open browser tabs. I do this by creating a unique ID stored in each tab's sessionStorage. I then track the open tabs by registering each ID in a localStorage array that each tab has access to.
The problem is that I cannot remove the ID from localStorage when closing a tab by using the window.onunload event. The code works fine in desktop Chrome but I cannot get it working in Android.
$(window).on('beforeunload', function () {
removeWindowGUID();
});
function removeWindowGUID() {
var guid = sessionStorage.getItem("WindowGUID");
var tmp = JSON.parse(localStorage.getItem("WindowGUIDs"));
tmp = tmp.remove(guid); // remove is a custom prototype fn
localStorage.setItem("WindowGUIDs", JSON.stringify(tmp));
}
This event will fire when reloading a page, which is fine, just not on closing.
I have also tried using the pagehide event.
Depends on the browser. Some use .onunload, some use onbeforeunload.
Quickest solution is
window.onunload = window.onbeforeunload = function() {
var guid = sessionStorage.getItem("WindowGUID");
var tmp = JSON.parse(localStorage.getItem("WindowGUIDs"));
tmp = tmp.remove(guid); // remove is a custom prototype fn
localStorage.setItem("WindowGUIDs", JSON.stringify(tmp));
});
Tested on gingerbread, ICS & jelly bean using native android browser.
I did something similar, the errors were exactly the same. I noticed if call window.close() programmatically, the event is called. I just added my own 'close' button on the page.
I am new to javascript. I would like to know how a new window can be opened from a javascript method, and then call it's javascript methods.
The url of the window, is in another domain (can cause a security problem !?), and I don't have control over it.
For example, a code that should behave as the followings:
handler<-openAWindow("www.someurl.com");//open a window and get a handler for it
handler->someMethod1(param1, param2);//call some javascript method
handler->someMethod2(param3, param4);//call some other javascript method<br>
Thanks,
Eran.
You cannot control or access a cross domain window unfortunately. This is done for security precautions. Do you have control over the other URL?
However, if the window is on the same domain you do have access to the window and its DOM.
var win = window.open("/page", "title");
win.someFunction();
var el = win.document.getElementById("id123");
//etc.