<!--
  Text ads reuse the data-ad element in multiple components to make it
  difficult to determine which component it belongs to, similar to Bing.
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" type="text/css" href="./serp.css" />
</head>
<body>
  <section id="searchresults">
    <div class="lhs">
      <div class="moz_ad">
        <h5 test-label>ad_sitelink</h5>
        <a href="https://example.com/ad/1">
          <h2>Example Result</h2>
        </a>
        <span><a href="https://example.com/ad/2">Ad link that says there are 10 Locations nearby</a></span>
        <div class="multi-col">
          <div>
            <a href="https://example.com/ad/3">
              <h2>New Releases</h2>
            </a>
            <span>Cras ac velit sed tellus</span>
          </div>
          <div>
            <a id="deep_ad_sitelink" href="https://example.com/ad/4">
              <h2>Men's</h2>
            </a>
            <span>Cras ac velit sed tellus</span>
          </div>
          <div>
            <a href="https://example.com/ad/5">
              <h2>Women's</h2>
            </a>
            <span>Cras ac velit sed tellus</span>
          </div>
          <div>
            <!-- Ensure ads encoded in data-attributes are also recorded properly -->
            <a data-moz-attr="https://example.com/ad/6" href="https://example.com/normal-link">
              <h2>Sale</h2>
            </a>
            <span>Cras ac velit sed tellus</span>
          </div>
        </div>
      </div>
      <div class="moz_ad">
        <h5 test-label>ad_link</h5>
        <a id="ad_link_redirect" href="https://example.org/browser/browser/components/search/test/browser/redirect_ad.sjs">
          <h2>Example Shop</h2>
        </a>
        <div class="factrow">
          <a href="https://example.com/ad/8">Home Page</a>
          <a href="https://example.com/ad/9">Products</a>
          <a href="https://example.com/ad/10">Sales</a>
        </div>
      </div>
      <div class="moz_ad">
        <h5 test-label>ad_link</h5>
        <a href="https://example.com/ad/11">
          <h2>Example Shop</h2>
        </a>
      </div>
      <div>
        <h5 test-label>non_ads_link</h5>
        <a id="non_ads_link" href="https://example.com/browser/browser/components/search/test/browser/cacheable.html">
          Example of a cached non ad
        </a><br />
        <a id="non_ads_link_redirected" href="https://example.org/browser/browser/components/search/test/browser/searchTelemetryAd_nonAdsLink_redirect.html">
          Example of a redirected non ad link
        </a><br />
        <a id="non_ads_link_redirected_no_top_level" href="#">
          Example of a redirected non ad link that isn't initially top level loaded
        </a><br />
        <a id="non_ads_link_multiple_redirects" href="https://example.com/browser/browser/components/search/test/browser/redirect_thrice.sjs">
          Example of a redirected non ad link that's redirected multiple times
        </a><br />
        <a id="non_ads_link_with_special_characters_in_path" href="https://example.com/path'?hello_world&foo=bar's">
          Example of a non ad with special characters in path
        </a>
      </div>
    </div>
    <div class="rhs">
      <h5 test-label>ad_sidebar</h5>
      <div class="moz_ad">
        <a href="https://example.com/ad/15">
          <div class="mock-image">Mock ad image</div>
        </a>
        <a href="https://example.com/ad/16">
          <h3>Buy Example Now</h3>
        </a>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
        <a href="https://example.com/ad/17">Buy Now</a>
      </div>
    </div>
  </section>
  <iframe style="display: none;"></iframe>
  <script>
    window.addEventListener("message", (event) => {
      if (event.origin == "https://example.org") {
        window.location.href = event.data;
      }
    });
    document.getElementById("non_ads_link_redirected_no_top_level")
      .addEventListener("click", (event) => {
        event.preventDefault();
        let iframe = document.querySelector("iframe");
        iframe.src = "https://example.org/browser/browser/components/search/test/browser/searchTelemetryAd_nonAdsLink_redirect_nonTopLoaded.html";
    });
  </script>
</body>
</html>
