title: Changing navigator.userAgent using Chrome Extension
body: <p>I am trying to overload the navigator.userAgent using a simple chrome extension. As the content scripts operate in isolated env, I tried to create a script element and write the logic into this one. This happens from background page of the extension</p>
  
  <pre><code>chrome.tabs.query({
    active:!0
  }, function(tabs) {
      var x = "window.navigator.__defineGetter__('userAgent', function() {" +
              "return 'Mozilla/5.0 (Linux; Android 4.2.1; en-us; Nexus 5 Build/JOP40D)" +
              " AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile " + 
              "Safari/535.19'; });console.log(navigator.userAgent);";
  
      for (var i = 0;i &lt; tabs.length;i++) {
        var code = 'var s = document.createElement("script"); s.text = "' + x +
                   '"; document.head.insertBefore(s, document.head.firstChild);' + 
                   'navigator.userAgent ="s"; console.log(navigator.userAgent);';
  
        // Inject into the tabs of choice - currently everything.
        chrome.tabs.executeScript(tabs[i].id, {
          code: code
        });
      }
    });
  </code></pre>
  
  <p>The script gets appended for the head element and I can see that the UA string as the one that is spoofed by trying navigator.userAgent in the console of the chrome and so I believe that the navigator object was overloaded.</p>
  
  <p>But this seems to be not the effective way or not happening at all as the navigator object was not updated which I found out via - <a href="http://www.quirksmode.org/js/detect.html" rel="noreferrer">http://www.quirksmode.org/js/detect.html</a> which still shows the UA for Mac.</p>
  
  <p>So, what exactly am I missing here? </p>