Introduce AMP Live List Cache Busting

extensions/amp-live-list/0.1/amp-live-list.js

@@ -23,6 +23,10 @@ import {AmpEvents} from '../../../src/amp-events';
 import {CSS} from '../../../build/amp-live-list-0.1.css';
 import {Layout} from '../../../src/layout';
 import {childElementByAttr} from '../../../src/dom';
+import {
+  installOriginExperimentsForDoc,
+  originExperimentsForDoc,
+} from '../../../src/service/origin-experiments-impl';
 import {user, userAssert} from '../../../src/log';
 
 /**
@@ -192,70 +196,72 @@ export class AmpLiveList extends AMP.BaseElement {
   buildCallback() {
     this.viewport_ = this.getViewport();
 
-    LiveListManager.forDoc(this.element).then(manager => {
-      this.manager_ = manager;
-      this.manager_.register(this.liveListId_, this);
-    });
+    return this.isExperimentEnabled_().then(enrolled => {
+      LiveListManager.forDoc(this.element, enrolled).then(manager => {
+        this.manager_ = manager;
+        this.manager_.register(this.liveListId_, this);
+      });
 
-    this.customSlotId_ = this.element[AMP_LIVE_LIST_CUSTOM_SLOT_ID];
+      this.customSlotId_ = this.element[AMP_LIVE_LIST_CUSTOM_SLOT_ID];
 
-    this.updateSlot_ = userAssert(
-      this.getUpdateSlot_(this.element),
-      'amp-live-list must have an "update" slot.'
-    );
+      this.updateSlot_ = userAssert(
+        this.getUpdateSlot_(this.element),
+        'amp-live-list must have an "update" slot.'
+      );
 
-    this.itemsSlot_ = userAssert(
-      this.getItemsSlot_(this.element),
-      'amp-live-list must have an "items" slot.'
-    );
+      this.itemsSlot_ = userAssert(
+        this.getItemsSlot_(this.element),
+        'amp-live-list must have an "items" slot.'
+      );
 
-    this.paginationSlot_ = this.getPaginationSlot_(this.element);
+      this.paginationSlot_ = this.getPaginationSlot_(this.element);
 
-    this.liveListId_ = userAssert(
-      this.element.getAttribute('id'),
-      'amp-live-list must have an id.'
-    );
+      this.liveListId_ = userAssert(
+        this.element.getAttribute('id'),
+        'amp-live-list must have an id.'
+      );
 
-    this.pollInterval_ = getNumberMaxOrDefault(
-      this.element.getAttribute('data-poll-interval'),
-      LiveListManager.getMinDataPollInterval()
-    );
+      this.pollInterval_ = getNumberMaxOrDefault(
+        this.element.getAttribute('data-poll-interval'),
+        LiveListManager.getMinDataPollInterval()
+      );
 
-    const maxItems = this.element.getAttribute('data-max-items-per-page');
-    userAssert(
-      Number(maxItems) > 0 || this.element.hasAttribute('disable-pagination'),
-      'amp-live-list # %s must have data-max-items-per-page attribute with' +
-        ' numeric value. Found %s.',
-      this.liveListId_,
-      maxItems
-    );
+      const maxItems = this.element.getAttribute('data-max-items-per-page');
+      userAssert(
+        Number(maxItems) > 0 || this.element.hasAttribute('disable-pagination'),
+        'amp-live-list # %s must have data-max-items-per-page attribute with' +
+          ' numeric value. Found %s.',
+        this.liveListId_,
+        maxItems
+      );
 
-    const actualCount = [].slice
-      .call(this.itemsSlot_.children)
-      .filter(child => !child.hasAttribute('data-tombstone')).length;
+      const actualCount = [].slice
+        .call(this.itemsSlot_.children)
+        .filter(child => !child.hasAttribute('data-tombstone')).length;
 
-    this.maxItemsPerPage_ = Math.max(
-      getNumberMaxOrDefault(maxItems, 1),
-      actualCount
-    );
+      this.maxItemsPerPage_ = Math.max(
+        getNumberMaxOrDefault(maxItems, 1),
+        actualCount
+      );
 
-    this.isReverseOrder_ = this.element.getAttribute('sort') === 'ascending';
+      this.isReverseOrder_ = this.element.getAttribute('sort') === 'ascending';
 
-    // Make sure we hide the button
-    this.toggleUpdateButton_(false);
-    this.eachChildElement_(this.itemsSlot_, item => {
-      item.classList.add(classes.ITEM);
-    });
+      // Make sure we hide the button
+      this.toggleUpdateButton_(false);
+      this.eachChildElement_(this.itemsSlot_, item => {
+        item.classList.add(classes.ITEM);
+      });
 
-    this.curNumOfLiveItems_ = this.countAndCacheValidItems_(
-      this.itemsSlot_,
-      true /** opt_cacheIds */
-    );
+      this.curNumOfLiveItems_ = this.countAndCacheValidItems_(
+        this.itemsSlot_,
+        true /** opt_cacheIds */
+      );
 
-    this.registerDefaultAction(this.updateAction_.bind(this), 'update');
-    if (!this.element.hasAttribute('aria-live')) {
-      this.element.setAttribute('aria-live', 'polite');
-    }
+      this.registerDefaultAction(this.updateAction_.bind(this), 'update');
+      if (!this.element.hasAttribute('aria-live')) {
+        this.element.setAttribute('aria-live', 'polite');
+      }
+    });
   }
 
   /** @override */
@@ -494,6 +500,19 @@ export class AmpLiveList extends AMP.BaseElement {
     return count;
   }
 
+  /**
+   * Check if amp-live-list-random identifier experiment is enabled
+   * through origin trial.
+   * @return {!Promise<boolean>}
+   */
+  isExperimentEnabled_() {
+    // Check if we are enabled by an origin trial
+    installOriginExperimentsForDoc(this.getAmpDoc());
+    return originExperimentsForDoc(this.element)
+      .getExperiments()
+      .then(trials => trials && trials.includes('amp-live-list-random'));
+  }
+
   /**
    * Does an inline replace of a list item using the element ID.
    * Does nothing if item has already been tombstoned or removed from the

extensions/amp-live-list/0.1/live-list-manager.js

@@ -16,7 +16,8 @@
 
 import {Poller} from './poller';
 import {Services} from '../../../src/services';
-import {addParamToUrl} from '../../../src/url';
+import {addParamsToUrl} from '../../../src/url';
+import {dict} from '../../../src/utils/object';
 import {fetchDocument} from '../../../src/document-fetcher';
 import {getMode} from '../../../src/mode';
 import {getServicePromiseForDoc} from '../../../src/service';
@@ -29,6 +30,10 @@ export const SERVICE_ID = 'liveListManager';
 
 const TRANSFORMED_PREFIX = 'google;v=';
 
+// Maxiumum random number used as a query parameter.
+// Cannot use Number.MAX_SAFE_INTEGER due to IE Compatibility.
+const AMP_LIVE_LIST_MAX_RANDOM_NUMBER = 9007199254740991;
+
 /**
  * Property used for storing id of custom slot. This custom slot can be used to
  * replace the default "items" and "update" slot.
@@ -45,8 +50,9 @@ export const AMP_LIVE_LIST_CUSTOM_SLOT_ID = 'AMP_LIVE_LIST_CUSTOM_SLOT_ID';
 export class LiveListManager {
   /**
    * @param {!../../../src/service/ampdoc-impl.AmpDoc} ampdoc
+   * @param {boolean} enrolledInAppendRandomExperiment
    */
-  constructor(ampdoc) {
+  constructor(ampdoc, enrolledInAppendRandomExperiment) {
     /** @const */
     this.ampdoc = ampdoc;
 
@@ -77,6 +83,9 @@ export class LiveListManager {
     /** @private @const {boolean} */
     this.isTransformed_ = isDocTransformed(ampdoc.getRootNode());
 
+    /** @private {boolean} */
+    this.enrolledInAppendRandomExperiment_ = enrolledInAppendRandomExperiment;
+
     // Only start polling when doc is ready and when the doc is visible.
     this.whenDocReady_().then(() => {
       // Switch out the poller interval if we can find a lower one and
@@ -147,11 +156,19 @@ export class LiveListManager {
   fetchDocument_() {
     let url = this.url_;
     if (this.latestUpdateTime_ > 0) {
-      url = addParamToUrl(
-        url,
-        'amp_latest_update_time',
-        String(this.latestUpdateTime_)
-      );
+      const parameters = this.enrolledInAppendRandomExperiment_
+        ? dict({
+            'amp_latest_update_time': String(this.latestUpdateTime_),
+            // AMP Caches do not always evict entries from their caches.
+            // This experiment adds a random identifier to reduce cache hits for enrolled documents.
+            'amp_random': String(
+              Math.floor(Math.random() * AMP_LIVE_LIST_MAX_RANDOM_NUMBER)
+            ),
+          })
+        : dict({
+            'amp_latest_update_time': String(this.latestUpdateTime_),
+          });
+      url = addParamsToUrl(url, parameters);
     }
 
     if (this.isTransformed_) {