Trying to Use JavaScript in Chrome to Create New Website Tabs and Enter/Use Search Terms (Is it Possible?)

Hello, I’m fairly new to this so I apologize in advance if this is a dumb question…

I’m trying to make a JS based script in Chrome (using a code injector addon) that in essence replaces having to make pre-made and ordered folders of bookmarks and ‘launching them all’ at the same time. The idea being that I can already have a website with a search term pre-loaded (think like an Ebay page with ‘blue car’ as a search term).

However I’ve had nothing but issues trying to make such a thing work, and I’m possibly violating some ‘origin security conventions’ which may be most of the problem…

In my head, the process is something like this: (which sort of works in Google.com)

window.open("https://www.google.com","_blank"); //load the next arbitrary site
document.getElementsByName('q')[0].value = 'abcd'; //fill out the search terms
document.getElementsByName('btnK')[0].click(); //submit the form

While something like this always opens a new tab, the search section never works. If I have Tab A google.com and run this, Tab B opens, but Tab A does the search. I’ve tried various ‘delay’ methods, same problem.

Of course if I try to load, say, 2 sites (google/youtube), I think that is where the ‘security issues’ come in…

So I’m lost, any general guidance is appreciated.

Yeah from what I understand of your problem, you are looking to communicate across tabs. In other words, a script on one tab opens a second tab and then tells that second tab to access its elements and such. Normally each tab is its own little world that really doesn’t communicate with others unless through something like the Broadcasts Channel API

What you could possibly do is setup a channel on the original tab. Then fire up the new tab and attach a listener to it so that it listens to the same channel. Then your original tab could send the new tab data which the other tab would then use to access the box and do the searches.

It is an interesting concept that I haven’t tried myself but in theory, if the events are actually tied to the instance of the new tab, should be able to open up the channel when launched and listen for the messages from the first tab.

But as far as you are doing it, document.getElementsByName etc would be executing on the current tab, not the one you opened up.

Maybe take a look at the API and see if that might be a good first step. It has me intrigued enough to run my own tests in the future. :slight_smile:

1 Like

Or just… make your link actually representative of what you’re trying to do.

window.open("https://www.google.com","_blank"); //load the next arbitrary site
document.getElementsByName('q')[0].value = 'abcd'; //fill out the search terms
document.getElementsByName('btnK')[0].click(); //submit the form

=>

window.open("https://www.google.com/search?q=abcd","_blank");

Playing around with this some more, I realized that perhaps we don’t need to get that complicated. If both windows are in the same domain (and the browser is not blocking popups) then you can do something like this…

function openWin() {
        // Launch second tab to our page
	var secondTab = window.open('other-page.html');

        // When loaded, use it to get a reference to the search box to fill in
        // If found, set its value. You can also do the click of the button etc.
	secondTab.onload = function() {
		var searchElement = this.document.getElementById('id-of-search-box');
		if (searchElement) {
			searchElement.value = "My search terms";
		}

	};			
}

openWin();

The solutions you think of in your spare time. I think this might help you. I have tested this solution for me and it does what I think you want it to do. :slight_smile: