title: Catching net::ERR_NAME_NOT_RESOLVED for fixing bad img links
body: <p>I have a blog going for over 10 years &amp; I would like to run a piece of Javascript on it that catches broken links. I was using:</p>
  
  <pre><code>function trackError(e) {
      var ie = window.event || {};
      var errMsg = e.message || ie.errorMessage || "404 error on " + window.location;
      var errSrc = (e.filename || ie.errorUrl) + ': ' + (e.lineno || ie.errorLine);
      mailme([errMsg, errSrc]);
  }
  
  // Triggering an error in the console:
  // You have to use something like setTimeout(function() { notThere(); }, 0);
  window.addEventListener('error', trackError, true);
  </code></pre>
  
  <p>But that's not catching the error in a useful way. What was broken, on which line etc.</p>
  
  <p><a href="https://i.stack.imgur.com/6llje.png" rel="noreferrer"><img src="https://i.stack.imgur.com/6llje.png" alt="Error loading an image"></a></p>
  
  <p><code>JSON.stringify</code> of the error object results just in <code>"{"isTrusted":true}"</code> which is useless. I noticed in Chrome there is <code>e.path</code>, but not in Firefox. Is there a way in Javascript to log useful information about broken image links or I need to file bugs on browser engines?</p>