How to stop chrome tab focus? - google-chrome

I am writing a chrome extension which refreshes pages after a certain time interval. I got it working fine, but a new problem occurred..
Whenever the page refreshes the tab gets highlighted (starts blinking) or else comes in focus. Ie it is getting focused on.
Now this works differently depending on the chrome browser state, but the core issue is the same:
1. If user switches tab to another one (suppose writing an email in gmail.com) while waiting for page to refresh itself, on refresh the current mail tab will get outfocused (so he wont be able to continue writing his email without clicking on the window first)
If the user swithces to any other application on his workspace (like my computer, outlook etc), on refresh the chrome icon will start blinking on the taskbar (highly annoying)
If the user has multiple chrome windows open with a tab each running the refresh code, then on refresh that window will get focus (come at top). This will repeat for all chrome windows whenever there specific refreshes occur.
Steps to reproduce the problem:
Write a simple extension
In the background page, create a new tab with:
chrome.tabs.create({ url: "https://drive.google.com/", active: false})
Now in a loop, after every minute, refresh this tab with:
chrome.tabs.update(tab_id, {url: "https://drive.google.com/",
active: false,
highlighted: false});
Once you start this code, either minimize the chrome window or shift your workspace and focus on something else.
Every time tabs.update() gets called, the Chrome window either unminimizes from task bar, or gets the focus on it.
What i want is to remove this focus whenever the page refreshes.
If anyone can please help me with this i would be very greatful.
Thanks,
Umair
EDIT:
code for my background.js file
chrome.webNavigation.onErrorOccurred.addListener(function (_errorDetails) {
var myUrl = 'myPage.htm';
chrome.tabs.update(_errorDetails.tabId, { url: myUrl, active: false,
highlighted: false, selected: false },
function (_tabDetails) {
chrome.windows.update(_tabDetails.windowId, { drawAttention: false });
});
});
Iv tried to make all related parameters false to stop focus.
Also on myPage.htm the function reload() is called on pageload.
function reloadPage() {
//code for 10 second delay
location.reload();
}
myPage.htm is itself a simple page showing few lines of text like 'Unable to load page' etc.

I changed the code and got it working for me as per my requirements.
What i did was instead of using the reload function to refresh page, i used the message passing technique of the chrome extension to send a message (containing url and tabID) from my js to background.js and update the relevant tab there with the url.
I know this is not a perfect solution, but it worked for me, therefore im sharing it.

Related

How to detect if a tab is unloaded after you restart the Chrome browser?

Let's say I have a bunch of tabs opened in Chrome, I close the browser and then reopen it. Those tabs will remain unloaded, until I click on them, then they will load automatically. This is a native feature of the browser to save memory.
I am looking for a way to check when tabs are in this specific state, before I click on them. I have tried the two properties .status and .discarded mentioned in the chrome.tabs api, which provide information if the tabs are unloaded or discarded:
https://developer.chrome.com/docs/extensions/reference/tabs/
but the values they give those properties are always the same, regardless if those tabs are completely unloaded after a restart or fully loaded after I click on them:
.status = "complete"
.discarded = "false"
And now I am stuck. I dont know how to solve this.
Any help will be appreciated. Thank you.
ps. I am not using any tab suspension addons.
You can check the discarded or status property of a tab, a discarded tab will have its status as “unloaded”:
chrome.runtime.onStartup.addListener(()=>{
chrome.tabs.query({currentWindow: true}, (tabs)=>{
tabs.forEach(tab =>{
if(tab.discarded === true || tab.status === “unloaded” ){
//Do something
}
})
})
});

Google Chrome - add to homescreen - force refresh

I have a website with "add to homescreen" enabled - i.e. I have got a manifest.json file with "display": "standalone".
The problem I'm having is when I open the website via the homescreen shortcut, it will resume from when I last accessed it. I have to pull to refresh to make it fetch the latest content.
My question is, is it possible to make it do a refresh every time it is accessed?
If you'd like to take specific action inside of your web app whenever it moves from the "background" to the "foreground" again, you could listen for the appropriate events using the Page Lifecycle API.
The most straightforward way of doing this would probably be to listen for visibilitychange events, and programmatically refresh your data source when you detect that the current visibilityState has transitioned to 'visible'.
This could look like:
document.addEventListener('visibilitychange', () => {
if (document.visibilityState === 'visible') {
// Your refresh logic goes here.
}
});

What are some advanced troubleshooting approaches for message passing in Chrome Extensions?

I've got a Chrome Extension where the popup messages the content script - pretty straightforward. The following works consistently on macOS (Chrome 61.0.3164.100) but not on Windows 10 (Chrome 61.0.3163.100):
aSearch.js (popup)
function sendMessage(comment){
window.close(); //Close popup.
console.log("In send message: " + comment);
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.sendMessage(tabs[0].id, {method: "insertComment", comment: comment}, function(response) {
// console.log(response.farewell);
});
});
}
Then content.js:
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
console.log('In content script after receiving request to insertcomment...');
if (request.method == 'insertComment'){
etc...
I can provide a lot more code...but the "console.log" does not fire even though background.js shows the related activity.
The aSearch.js is for an html popup that replaces the initial one...after you log in (not sure if this is important). This is accomplished in background.js:
chrome.browserAction.setPopup({ //Sets popup to last visited
popup: 'aSearch.html' // Open this html file within the popup.
});
Any guidance on what can make messaging break? Should I be taking a different approach for a constant (frequent) messaging that is used across many tabs, potentially?
Why would Chrome for Windows act differently?
Side note: I actually updated Chrome for Windows as I wrote this question...after the update suddenly messaging worked, for a little bit, then went back to dormant.
UPDATING QUESTION:
I added more code to the aSearch.js popup at the top...
I think I'm closing the popup before the message can be sent...and it's working sometimes (and on my macOS dev machine) because the computer is fast. On Windows, which is VM on my mac, not so fast...
Tomorrow I'll move the close inside the response from messaging...waiting for message to reply.
Is this plausible?
The issue here was, indeed, that you can't close a popup window before the message is successfully sent.
Duh.
The challenge, though, is that on my machines the message is sent successfully before the window closes. So I didn't discover the bug.
I have the message receiver acknowledging success and then closing the popup. Works like a charm.

Chrome Extension: What is the active tab in 2 opened windows?

I have an extension that needs to know what URL is on the active tab, but the problem is that when I open a second chrome window there are 2 active tabs, in the webmaster tools it doesn't give me any indication of what window I'm actually on.
I was actually on the 2nd window when I took this screenshot.
The code that I am using is:
chrome.tabs.query({'active': true}, function (tabs) {
app.tabInfo = tabs[0];
});
But the good code would have been app.tabInfo = tabs[1]; but I need to know that I need to pick that one. So how can I know?
Thank you.
Make your query to select the last focused Window:
chrome.tabs.query({ active: true, lastFocusedWindow: true }, function (tabs) {
//...
});
Note: Better don't take currentWindow: true because:
The current window is the window that contains the code that is currently executing. It's important to realize that this can be different from the topmost or focused window.
Source: http://developer.chrome.com/extensions/windows.html#current-window
Use chrome.windows.getCurrent() (or .getLastFocused(), right below it) to get the current window, then look for the active tab in the tabs property of the returned window.

How do I open a browser window from a desktop notification that's generated from a background page?

I have built a simple chrome application which has a background page that shows desktop notifications when a new article is available.
If a user clicks on the notifications when a browser window is open, then they are taken to the new article page and everything is right with the world.
If however the browser is closed when the notification is shown, then the href does not open the browser. I have also tried to capture the click and set a window.open, but that isn't working either.
As an aside, it would also be good if I could check to see if an instance of my app is already open and use that window/tab when the notification is clicked, but that's secondary to the first problem.
Any help would be great!
Thanks
Check if chrome window is open. if open the create in new tab else oepn new window.
chrome.windows.getCurrent(function(currentWindow) {
if (currentWindow != null) {
return chrome.tabs.create({
'url': url
});
} else {
return chrome.windows.create({
'url': url,
'focused': true
});
}
});
Have you tried, creating a window then tab using the Chrome API? For example:
linkDOM.addEventListener('click', function() {
chrome.windows.create({url: 'http://someurl.com'});
}, false);
I usually do the above when programmatically opening a link from extension pages.