Search code examples
amp-html

uBlock blocking amp-experiment

I am trying to implement an a/b test using amp-experiment.

.html file:

<amp-experiment>
  <script type="application/json">
      {
        "a-experiment": {
          "variants": {
            "control": 50,
            "1": 50
          }
        }
      }
    </script>
</amp-experiment>

<h3 class="a-experiment control">Sample control offer</h3>
<h3 class="a-experiment variant">Sample variant offer</h3>

.scss file:

body .control {
   display: block;
}

body {
   &[amp-x-a-experiment="control"] .variant {
      display: none;
   }
   &[amp-x-a-experiment="1"] .control {
     display: none;
   }
}

It works fine unless the user has uBlock Origin enabled. There are 2 problems here:

  • Both variants are offered,
  • Page takes between 4-5 sec to load.

There are 2 error msgs:

  • Immediate error msg: GET https://cdn.ampproject.org/v0/amp-analytics-0.1.js net::ERR_BLOCKED_BY_CLIENT

  • Error msg after page load: Render timeout waiting for service variant to be ready.​​​

If I remove the amp-experiment, there are no issues with uBlock.

Has anyone else encountered this issue? Is there a work around?

Solution

  • uBlock (and potentially others) block requests to https://cdn.ampproject.org/v0/amp-analytics-0.1.js. This is most likely the result of the amp-analytics requests being part of the EasyList filters.

    Blocking amp-analytics is the wrong choice as this request only downloads a webcomponent script which is required for AMP pages to work correctly. The request does not perform any actual tracking. Trackers make separate requests which should be covered by the existing filters.

    I've asked the EasyList maintainers to remove amp-analytics from their list.

    Update: they removed amp-analytics from EasyList.