title: How to overwrite the console.log function in Chrome?
body: <p>I'm working on a web application that uses many different frameworks and custom scripts (jQuery, Backbone, Bootstrap, Less just to name a few) and any of them might print console output at any time. Some output is from the frameworks I just mentioned, other output is from left over <code>console.log</code> calls left in the code from previous engineers working on the product.</p>
  
  <p>It's a problem because all the dozens of lines of extra output mixes with valid output and it's hard to parse all those lines to check that my valid output is working correctly. I want a temporary solution to overwrite the <code>console.log</code> function in Chrome so that I can filter out certain messages and focus on the output I care about.</p>
  
  <p>How do I overwrite the <code>console.log</code> function in Chrome with my own function?</p>
  
  <p>I tried creating a Chrome extension already and it kind of worked - I was able to overwrite <code>console.log</code> as far as the extension was concerned, but all references to <code>console.log</code> in the original source were unchanged.</p>
  
  <p><strong>EDIT:</strong> For clarity, I'm <em>not</em> looking for yet another script to add to the site. I'm looking for a solution that is entirely implemented either in the web browser, or some other technique that does not involve changing the source code being downloaded in the web app.</p>