This is a web page for testing content scripts

This is a web page for testing the kind of access content scripts get to the web pages they run inside. The page includes a page script, which does three things:

• Adds a new paragraph, with code like this:

  var p = document.createElement("p");
  p.textContent = "This paragraph was added by a page script.";
  p.setAttribute("id", "page-script-para");
  document.body.appendChild(p);
    

• Adds a new variable "foo" to the global window object, with code like this:

  window.foo = "This global variable was added by a page script";
  

• redefines the build-in window.confirm() function, with code like this:

  window.confirm = function() {
    alert("The page script has also redefined 'confirm'");
  }
  

If you now install the content-scripts extension, and reload the page, you'll now see two columns of buttons underneath this text.

Each column contains three buttons:

• Button 1 toggles a blue background for the paragraph the page script added.
• Button 2 prints the value of "window.foo" in the text box below.
• Button 3 calls window.confirm()

The exact same code is running in each column. But the left-hand column is running in the page script, while the right-hand button is running in the content script. So you'll see the following:

• Button 1 gives the same result in both columns: content scripts can see and modify the DOM, even for elements added by page scripts.
• Button 2 gives "undefined" for the content script column: content scripts can't see variables added by page scripts.
• Button 3 calls the original, unmodified version of window.confirm(): content scripts are unaffected by redefinitions of built-in DOM functions that are made by page scripts.