I am trying to get the url of the window that is opened by clicking the element with id 'wrpr_1431108056877h'. The new window opens but getTitle() still returns the title of the original tab. On the video provided by Browserstack I am able to verify that the current tab is indeed the one that I am trying to access.
browser
.click('#wrpr_1431108056877h')
.pause(5000)
.getTitle()
.then((url: any) => {
console.log(url);
})
.end()
.catch((err: any) => {
console.log(err.message);
done(Error('Could not move'));
});
browser.getTabIds();
should give you a list of all the window handles that webdriver knows about.
then you can use
browser.getCurrentTabId();
to figure out which window is currently in focus (Maybe this is what you said you are doing from the BrowserStack video?)
My guess is that the newly opened window isn't the currently focused window. Hence any commands executed (like getTitle()) will happen on the previous window.
You can switch the focused window to the newly opened window by calling
browser.switchTab(windowHandle)
Then you can call getTitle() and it should return the correct title.
See the web driver docs on Window here: http://webdriver.io/api/window/getTabIds.html
(scroll all the down on the left hand side to see the complete Window section)
for more info.
Please call
browser.navigate().refresh()
Before calling
browser.gettitle().
Related
I'm new to chrome extension development but I'm running into issues debugging and with the extension itself. I currently have a form with a submit button and after the user hits submit I change the html to show the data that was just submitted.
document.addEventListener('DOMContentLoaded', function() {
console.log("1");
document.getElementById("submitButton").addEventListener('click', myFunction);
console.log("2");
//getCurrentTabUrl(function(url) {
// renderStatus(url);
//});
});
function myFunction() {
document.getElementById("formOutput").innerHTML = document.getElementById("formInput").value;
alert("hi");
console.log("test");
);
}
In this, 1 and 2 are displayed to the extension debugging console and the alert runs as well when the button is clicked. The test shows up very briefly and then it disappears.The formoutput value changes very briefly as well and then changes back to the default value I have. Does anyone know why my code/the chrome extension would be doing this?
Thanks!
When button with type submit (This is the default if the attribute is not specified) is clicked, the form data will be sent to server and page will be redirected to new page. Then your content script will be injected again, that's why the it changes back to default value.
To avoid this, you could change button with other types, or calling e.preventDefault to prevent default behavior. Then you would want to use Ajax to send data to server, which ensure the whole page won't be redirected and only parts of UI can be updated.
When I click the extension icon, a popup is shown.
After that, when I try to click "URL restrictions", it will open a window, after that when I click the popup again, the popup is overlapping that url restriction window.
The above issue happens on Windows only, not on Linux.
So I have added window.open('','_self').close(); which apparently fixed the issue. But not exactly. Is it correct? I have referred this Link and Link2 but can not understand the meaning.
What is the purpose of window.open('','_self').close();?
EDIT: this is my popup.js
function click(e) {
var windowObj = window.open(site_exception_url, 'url_window', params);
windowObj.focus();
window.close();
window.open('','_self').close();
return false;
}
On Windows the popup isn't closed automatically after a new window is opened from a link within the popup.
Close it in the click handler manually, this won't hurt Linux but will help on Windows:
document.addEventListener("click", function(event) {
if (event.target.localName == "a") {
close();
}
});
The related questions linked in your question don't apply here as the first is for userscripts, not extensions, and the second isn't for popups shown by the browser when you click the toolbar button.
I'm trying to work on a chrome extension and am trying to clean up some of my code by relying on the sendMessage. However the callback function activates before the page has finished loading so in the case of a new tab, nobody receives and in the case of an existing tab the page that is being moved from is getting the message (but that isn't what I want). I've looked for other people asking about that problem with new tabs and there wasn't a clear answer, the best suggestion I've seen is to create a global variable and create a listener for tab loads and compare it against this global variable.
So the question is, is there a way to wait in the callback function until the page has loaded, or do I create an array of JS objects that contain the tab I'm waiting on and the information I want to send to that tab.
For reference here is the relevant code in the background javascript file.
chrome.tabs.sendMessage(tab.id, {info: "info"}, function(response)
{
//This line isn't used when I am navigating without changing tabs
chrome.tabs.create({url: response.info.linkUrl}, function(tab1)
{
chrome.tabs.update(tab1.id, {url: response.info.linkUrl}, function(tab2)
{
chrome.tabs.sendMessage(tab2.id, {info: "More Info"});
});
});
});
Otherwise I am able to confirm that all of my tab side code works, once my sendMessage was delayed enough for me to see that with my own eyes. My code is able to consistently make it past validation on the page being navigated away from, confirmed by checking document.url.
You can try injecting a second content script instead of a message.
It will execute in the same context as your other script.
Something along the lines of
chrome.tabs.executeScript(tab2.id,
{code: 'showInfo("More Info);', runAt: 'document_idle'}
);
where showInfo does the same as your message handler.
It's a bit of a hack and I'm not 100% sure the load order will be correct.
Other possible solutions are more complex.
For example, you can make the content script report back that it is ready and have a handler for that, for instance you can register a listener for onMessage in the background that waits for a message from that specific tab.id, sends "More Info" and then deregisters or disables itself.
Or, you could potentially switch to programmatic injection of your content script, which would let you control load order.
in the documentation, it says, getBackgroundPage()
Returns the JavaScript 'window' object for the background page running
inside the current extension.
which window is it? is it the same window that we get with: "chrome.windows.getCurrent()".
If you specify a background page in your manifest.json, the page is actually 'open' when your extension is running (go to chrome://extensions and look for extensions with a property Inspect views: some_background_page.html). Although you can't actually see the page, it does exist, and as the documentation states, running getBackgroundPage() will return that page's 'window' object, allowing you to perform all of the actions you could on a normal window (see here for a list of some of those properties/actions).
To answer your second question, you can read here that the value of current window falls back to the last active window when being called from a background page. Here is a sample background.js that may help explain - it will show identical IDs for getCurrent and getAllinWindow, both of which will refer to the page from the active/visible page from which you called the extension - not the background page itself:
// This gets all current window tabs
chrome.tabs.getAllInWindow(null, function(tabs){
// This alerts the window ID when getCurrent is called from background.js
chrome.windows.getCurrent(function(window){
alert("Background ID: " + window.id);
});
// Now we loop through the tabs returned by getAllInWindow,
// showing the window ID. The ID is identical to the one above,
// meaning that getCurrent (when called from a background page)
// returns the current active window - NOT the background page
chrome.windows.get(tabs[0].windowId, function(window) {
alert("Active Window: " + window.id);
});
});
Hope that helps!
I find myself more and more using the touchpad gesture of 3 fingers to the left or right in order to perform a "back" or "forward" in Google Chrome (on my Asus Zenbook, but I believe there's a similar gesture on Macs)
I found that when browsing, I open a tab to read something (Like a like from Twitter or Facebook) and when I'm done my instinct is to go "back" to get back to the previous tab I was browsing on. (I think I got that instinct from using Android a lot).
I figured that I need a Chrome extension that would close my current tab if I'm attempting to go "back" in a tab that doesn't have a previous page in its history.
I went over the Chrome events and various methods I can invoke and while there's a "forward_back" transition qualifier in the WebNavigation api, the onCommitted event doesn't fire when attempting to go "back" using the touchpad gesture or Alt+left keyboard shortcut.
Also, I couldn't find how I can access a current tab's history to see if the page I'm at doesn't have a previous one in the stack.
Ideas anyone?
function noHistory(tabId) {
// TODO
}
function getCurrentTabId() {
// TODO
}
function userHitBack() {
tabId = getCurrentTabId();
if (noHistory(tabId)) {
chrome.tabs.remove(tabId)
}
}
function attachEvent() {
// TODO attach userHitBack
}
attachEvent();
To catch the "back" event, you need to handle specific key pressed to call your "userHitBack" function. Something like this:
document.onkeydown = function() {
if (keyId == ...)
userHitBack()
}
You can use this to your advantage as you can bind any key to trigger the close of the tab.
To check the tab history length use this:
window.history.length
It is html5 historyAPI