open the "closed" shadowRoot of element inserted by other extension in chrome

Viewed 407

well google translate extension in chrome, has popup feature, it displays translation of selected word instantly, I wanted to access those translations displayed by popup, but this popup element is shadowRoot("closed"), so javascript cant access its content, I red an article about that subject and author says:

But really there is nothing stopping someone executing the following JavaScript before your component definition. Element.prototype._attachShadow = Element.prototype.attachShadow; Element.prototype.attachShadow = function () { return this._attachShadow( { mode: "open" } ); };

Is it possible to change attachShadow method of other extension? if so where should it be executed by my extension? background_script or maybe somewhere. I think each extension has its own enviroment and I have no chane to edit their methods. I wish I'm wrong :)

1 Answers

No need to override it.
There's a special method in the content script.

  • Chrome 88+:

    let shadowRoot = chrome.dom.openOrClosedShadowRoot(element);
    
  • Firefox 63:

    let shadowRoot = element.openOrClosedShadowRoot();
    
  • Combined:

    let shadowRoot = chrome.dom?.openOrClosedShadowRoot(element)
      || element.openOrClosedShadowRoot();
    
Related