How to disable chrome from opening up "new window" and "tabs"?

Question

Is their a way to keep all pages on the internet in a single window through Chromes browser settings? or a addon/plugin that I can do this with?

I don't want web pages to open up in new tabs and/or new windows when I click on some links.

Let me know if anyone has any suggestions!, Thanks!!

        <a href="http://www.bing.com" target="_blank">Opens a New Tab!</a>

        <i>Thtats not what i want..., I want this link to stay in same url bar.</i>

        <p>Like this!</p>
        <a class="click" href="http://www.bing.com">Click Here</a>

Answer 1

Possible approach:

One approach could be building an extension that injects a content script in every page. This content script would parse the DOM and remove all target attributes off the anchor elementsand set all target attributes of anchor elements to _self.

Caveats:

1. There are dynamically inserted elements (including anchor elements) on many pages.
2. There are dynamically changing elements (including anchor elements) on some pages.
3. Not all pages/tabs are opened through links (e.g. some page could use window.open()).

Solution:

You could use a MutationObserver that watches for anchor elements being inserted or having their target attribute modified and make the appropriate adjustments.

You still need to take care of tabs opened by other means (e.g. window.open()) if it is extremely important to you (but those cases should be very very few, so it might not be worth the trouble).

Sample code:

manifest.json:

{
    "manifest_version": 2,

    "name":    "Test Extension",
    "version": "0.0",

    "content_scripts": [{
        "matches":    ["*://*/*"],
        "js":         ["content.js"],
        "run_at":     "document_start",
        "all_frames": true
    }]
}

content.js:

/* Define helper functions */
var processAnchor = function(a) {
    //if (a.hasAttribute('target')) {
    //    a.removeAttribute('target');
    //}
    a.setAttribute('target', '_self');
};

/* Define the observer for watching over inserted elements */
var insertedObserver = new MutationObserver(function(mutations) {
    mutations.forEach(function(m) {
        var inserted = [].slice.call(m.addedNodes);
        while (inserted.length > 0) {
            var elem = inserted.shift();
            [].slice.call(elem.children || []).forEach(function(el) {
                inserted.push(el);
            });
            if (elem.nodeName === 'A') {
                processAnchor(elem);
            }
        }
    });
});

/* Define the observer for watching over
 * modified attributes of anchor elements */
var modifiedObserver = new MutationObserver(function(mutations) {
    mutations.forEach(function(m) {
        if ((m.type === 'attributes') && (m.target.nodeName === 'A')) {
            processAnchor(m.target);
        }
    });
});

/* Start observing */
insertedObserver.observe(document.documentElement, {
    childList: true,
    subtree: true
});
modifiedObserver.observe(document.documentElement, {
    attributes: true,
    substree: true
});

Answer 2

The question is almost 10 years old, but here is slightly different approach utilizing event delegation:

content.ts:

const isAnchor = (target: EventTarget): target is HTMLAnchorElement =>
  !!target && target instanceof HTMLAnchorElement && target?.tagName?.toLowerCase() === 'a';

const findAnchor = (element: Node): HTMLAnchorElement | null => {
  let parent = element;

  while (parent !== null) {
    if (isAnchor(parent)) return parent;
    parent = parent.parentNode;
  }

  return null;
};

const callback = (e: MouseEvent): void => {
  if (!(e.target instanceof Node)) return;
  // traverse DOM tree until you find a parent anchor element
  const anchor = findAnchor(e.target);
  if (!anchor) return;
  // skip ones who already have _self
  if (!anchor.target || anchor.target === '_self') return;
  // cancel the original event
  e.preventDefault();
  // set target _self on the anchor which triggered navigation
  anchor.target = '_self';
  console.debug('target _self is set on anchor tag');
  // trigger the click again on the element which triggered it in the first place
  e.target.click();
};

window.addEventListener('click', callback);