Open new tab in background leaving focus on current tab - Chrome

Question

How to execute in JavaScript a CTRL + click on a link that works in the latest version of Chrome (v68)?

Context - I'm running a JavaScript script that opens a certain tab at certain hours of the day (and closes it after a few minutes). I'm trying to get it to open the tab in background leaving the focus on the current tab that I'm using.

The tab opened programmatically leads Chrome to pop up even when minimized, quite disrupting.

These old solutions that I found here on Stack Overflow don't work with the latest version of Chrome.

Manually CTRL + clicking a link achieves the effect that I want (tab is opened in background). Can this be achieved programmatically on the latest version of Chrome?

---

The following code does not work anymore with the latest version of Chrome..

const openNewBackgroundTab = (url) => {
  const anchor = document.createElement("a");
  anchor.href = url;
  document.body.appendChild(anchor);
  const evt = document.createEvent("MouseEvents");    
  // the tenth parameter of initMouseEvent sets ctrl key
  evt.initMouseEvent(
    "click", true, true, window, 0, 0, 0, 0, 0,
    true, false, false, false, 0, null
  );
  anchor.dispatchEvent(evt);
}
openNewBackgroundTab('https://stackoverflow.com');

.. the new tab still gets the focus.

---

STEPS to reproduce:

• Open window 1 and in console execute:

let winStacko; setTimeout(() => { winStacko = open('https://www.stackoverflow.com'); }, 30 * 1000); setTimeout(() => winStacko.close(), 2 * 60 * 1000);

• Open window 2 within 30 seconds after executing the script

DESIRED behavior:

• Window 2 has the focus for the whole time while the background tab is opened and then closed.

Answer 1

As you want this for personal usage, and you do not mind using an extension, then you can write your own one.

Writing a chrome extension to achieve your required behavior is actually super easy, All you need to know is how to open/close tabs from the extension. The following page describes the whole API

Here is an example :

1 - Create a manifest.json file, and ask for the tabs permission

{
  "name": "blabla",
  "version": "0.1",
  "permissions": ["tabs"],
  "background": {
    "persistent": false,
    "scripts": ["background.js"]
  },
  "browser_action": {
    "default_title": "Open a background tab every x time"
  },
  "manifest_version": 2
}

2 - Create background.js script in the same folder

const INTERVAL = 5000;
setTimeout(function(){
    chrome.tabs.create({url: "https://www.stackoverflow.com", active: false }, tab =>{
        setTimeout(function(){
            chrome.tabs.remove(tab.id);
        },INTERVAL);
    }); 
},INTERVAL);

You can download it from here too

Note: Please note the active parameter here , it defines whether the tab should become the active tab in the window. Does not affect whether the window is focused

3 - Use the extension in chrome

1. If you are using the download link, then unpack the archive
2. Navigate from chrome menu to extensions
3. Enable the developer mode in the top right corner
4. Click on Load Unpacked button to select the extension folder
5. The extension will run automatically

Answer 2

In the old days, you could do this using stuff like :

if(window.focus == false)
{
    this.focus();
}

Now you have to use extra plugins, due to abusers.
The Solution: Window Rollover:
The solution is to create another page. When you click the link, the window closes, it switches to a page that opens the window that just closed, and changes it's location to the new page.
Page 1 code:

document.getElementById("myId").onclick = function(){window.open("page2.html");window.close()}

Page 2 code:

window.open("previouspage.html");
window.location = "newpage.html";
//close the page
window.close();

I call this strategy "Window Rollover."

Answer 3

I PARTIALLY resolved using a Chrome plugin: Force Background Tab

https://chrome.google.com/webstore/detail/force-background-tab/gidlfommnbibbmegmgajdbikelkdcmcl/related?hl=en

Using that add-on the tab is opened in background without focus. The only issue is that the last used tab of the window (can be different from the tab that launches the new tab) still pops up in front of any other application in use.

Answer 4

You can try a kind of pop under, where you open the same url in a new tab, then change the location.href of current tab to the desired new url.

window.open(window.location.href);
window.location.href = 'http://www.google.com';