2

trying to make an extension that creating new tab and navigating it to some site and giving some <input> to focus.

I check this question but cant solve my problem: How to steal focus from the omnibox in a Chrome extension on the new tab page?

here is a sample code that I am trying to open a new tab navigating to google and trying to focus on the google search bar.

this is my content_script.js try to catch a click on specified web page and specified <div> and send a message to my background.js

manifest.json

{
    "manifest_version": 2,
    "name": "E-Yaygın Kursiyer Aktarımı",  
    "description": "E-Yaygın Kursiyer Aktarımını Kolaylaştıran Yazılım",  
    "version": "1.0",    
    "permissions": ["tabs", "<all_urls>"],  
    "background": {
    "scripts": ["background.js"]
  },
    "content_scripts": [{
        "matches": [
            "http://*/*",
            "https://*/*"
        ],
        "js": ["jquery.js","content_script.js"]
    }],

    "icons": {
        "16": "images/icons/16.png",
        "19": "images/icons/19.png",
        "38": "images/icons/38.png",
        "64": "images/icons/64.png",
        "128": "images/icons/128.png"
    }
}

content_script.js

$("#kybs_eklenti_edin_btn").hide();
$(document).ready(function (e) {
var host = $(location).attr('hostname');
var url = $(location).attr('pathname');
var search = $(location).attr('search');
console.log(url,"|",host,"|",search);
if (host.indexOf("kybs.com.tr")!=-1){
    if (url == "/yoneticiv2/kursiyerlistesi"){
        $("#tn_logo_holder").click(function(){
            chrome.runtime.sendMessage({mesaj: "init_program"}, function(response) {
            console.log(response);
            });             
        }); 
    }
}
});

background.js

var openedTab = 0;
var isTabOpen = false;
chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    console.log(sender.tab ?
                "from a content script:" + sender.tab.url :
                "from the extension");
    if (request.mesaj == "init_program"){
        if (!isTabOpen){
            chrome.tabs.create({selected: true},function(tab){
            isTabOpen= true;
            openedTab = tab.id;
            tabCreated();
            });         
        }else {
            chrome.tabs.get(openedTab, function(tab) { 
                if (chrome.runtime.lastError) {
                    chrome.tabs.create({selected: true},function(tab){
                        isTabOpen= true;
                        openedTab = tab.id;
                        tabCreated();
                    });         
                }else {
                    tabCreated();
                }
            });

        }       
        sendResponse("check");
    }

});
function tabCreated(){
    chrome.tabs.update(openedTab,{url:"https://google.com.tr"});

    chrome.tabs.executeScript(openedTab, {file: "jquery.js"},function(tab){
            if (chrome.runtime.lastError) {
                console.log(chrome.runtime.lastError.message);
                chrome.tabs.executeScript(openedTab, {file: "jquery.js"},function(tab){
                chrome.tabs.executeScript(openedTab, {file: "inject.js"});
                });
            }else {
                chrome.tabs.executeScript(openedTab, {file: "inject.js"});
            }
        });

}

inject.js

$(document).ready(function(){
    console.log("buradayız");
    var kursNoInput = document.getElementById("lst-ib");
    kursNoInput.value="840337";
    kursNoInput.focus();        
});

and also include a JQuery library.

I am trying to inject javascript with JQuery but it dosent metter. everything works fine but cant take focus from the adress bar to the web page.

second thing if I click on the page that newly created while page trying to load focus() works really fine.

I try to search on google resources but cant find any solution and dont know is there a way to taking the focus to the page.

Community
  • 1
  • 1
Ahmet
  • 74
  • 1
  • 8
  • Please [edit] the question to be on-topic: include a **complete** [mcve] that *duplicates the problem*. Including a **manifest.json**, some of the background/content/popup scripts/HTML. Questions seeking debugging help ("**why isn't this code working?**") must include: ►the desired behavior, ►a specific problem or error *and* ►the shortest code necessary to reproduce it **in the question itself**. Questions without a clear problem statement are not useful to other readers. See: "**How to create a [mcve]**", [What topics can I ask about here?](http://stackoverflow.com/help/on-topic), and [ask]. – Makyen Feb 11 '17 at 19:09
  • What *exactly* is shown in the [various appropriate consoles for your extension](http://stackoverflow.com/a/38920982/3773011) when you load and execute your extension? – Makyen Feb 11 '17 at 19:10
  • @wOxxOm so what we can do about it. Any suggestion? – Ahmet Feb 11 '17 at 19:15
  • 1
    The answers you've linked show some workarounds, try using them. My point is that you can't directly steal the focus from the address bar. – wOxxOm Feb 11 '17 at 19:18
  • @wOxxOm I got solution for this issue may I answer my question ? – Ahmet Feb 13 '17 at 15:50
  • Yes, this is actually welcome here. – wOxxOm Feb 13 '17 at 17:47

1 Answers1

0

I came up with my solution. idea is simple, when you try to create a new tab, by default selected attribute is true. and when yout create new tab it came up to display and its address bar automaticly focused. then you cant steal the focus from bar to page.

To preventing to focusing address bar you creating new tab with attribute selected:false like this.

chrome.tabs.create({selected: false},function(tab){
                        isTabOpen= true;
                        openedTab = tab.id;
                        tabCreated();
                    });

after creating tab than you can update its link and selected attribute and then you can take focus from address bar with injected javascript.

function tabCreated(){
    chrome.tabs.update(openedTab,{url:"https://google.com.tr"});
    chrome.tabs.executeScript(openedTab, {file: "jquery.js"},function(tab){
            if (chrome.runtime.lastError) {
                console.log(chrome.runtime.lastError.message);
                chrome.tabs.executeScript(openedTab, {file: "jquery.js"},function(tab){
                chrome.tabs.executeScript(openedTab, {file: "inject.js"});
                });
            }else {
                chrome.tabs.executeScript(openedTab, {file: "inject.js"});
            }
        });
chrome.tabs.update(openedTab,{selected:true});

}

than your focus() functions work with no problem.

Ahmet
  • 74
  • 1
  • 8