JavaScript handling and event listeners

Question

This is within the context of an edge extension but it will work with Standard JavaScript.

The extension must;

1 Be able to recognise when a new tab is opened.

2 Replace the new tab with a designated URL rather than about:blank etc.

3 Have links that appear in popups open within the active tab, not a new one.

I have this JavaScript;

 function handleCreated(tab) { var newTabURL = {url: ''}; browser.tabs.update(newTabURL); } browser.tabs.onCreated.addListener(handleCreated); 

as an example. It does replace the current tab with google but only when a link in the popup is clicked. The link from the popup should be what replaces the active tab OR if the user creates a new tab it should be replaced with mycompany.com/newtab.html , for example.

I've got an unpackaged example with everything so you can see all of the code. To use this you must first enable developer options in MS Edge ( Here's how ), then you can load the extension.

The extension in its current state has code notes and explains within the UI. You can grab the extension in its current form from this link . You'll just need to download and unzip then load folder within edge. I figured this is easier than me posting all of the code as you can better see how elements interact with each other.

So in summary;

1 The New Tab should open with the custom URL https://mycompany.com/newtab.html .

2 Typing Google should redirect to https://gooogle.co.uk . (Adding word shortcuts with JS in the address bar)

3 Links opened from the popup should replace the active tab that the popup is available over and not open in new tabs.

It works a little bit, I'm just struggling to get the new tab function to work. This isn't intended for the MS store so the policies aren't relevant.

Download the zipped extension folder here.

Answer 1

MS Edge opens links from a popup in a new tab by default, and this tab isn't active.

If for example you had;

 <a href="https://google.co.uk"><p>Visit Google</p></a> 

the URL would open in a new tab. To open the URL in the tab that is active within the Edge browser you can instead do the following, so it is actually possible.

1 Place the element in a DIV, for example linked content and use <div id="linkedcontent> within your HTML.

2 Place the content that should trigger the new tab within the DIV.

3 Use the following JavaScript to getElementByID and then use .onclick to replace the current browser window.

 document.getElementById("linkedcontent").onclick = function() { var LinkedContent = {url: 'https://google.com'}; browser.tabs.update(LinkedContent); }; 

This will then result in the browser window being replaced by the URL specified. In my example it's https://google.com . If you need to do this multiple times just duplicate the code and change the DIV id to something unique for each and reflect this in the JavaScript too.