diff --git a/.eslintignore b/.eslintignore
index 6d17eddbac7e7..f48cd9110889b 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -9,12 +9,12 @@ out/**
 test/coverage/**
 
 # Code directories
-**/*.extern.js
 build-system/tasks/visual-diff/snippets/*.js
 build-system/babel-plugins/**/fixtures/**/*.js
 build-system/server/app-index/test/*.js
 examples/**
 extensions/amp-a4a/0.1/test/testdata/**
+src/purifier/noop.js
 testing/local-amp-chrome-extension/**
 third_party/**
 validator/**
diff --git a/.eslintrc b/.eslintrc
index d9491cccbe75f..25b51cccc6a1e 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -81,6 +81,7 @@
     "local/json-configuration": 2,
     "local/no-array-destructuring": 2,
     "local/no-deep-destructuring": 2,
+    "local/no-destructure-assignment-params": 2,
     "local/no-duplicate-import": 2,
     "local/no-duplicate-name-typedef": 2,
     "local/no-es2015-number-props": 2,
@@ -92,9 +93,10 @@
     "local/no-import-rename": 2,
     "local/no-is-amp-alt": 2,
     "local/no-log-array": 2,
+    "local/no-mixed-interpolation": 2,
     "local/no-mixed-operators": 2,
     "local/no-module-exports": 2,
-    "local/no-mixed-interpolation": 2,
+    "local/no-rest": 2,
     "local/no-spread": 2,
     "local/no-style-display": 2,
     "local/no-style-property-setting": 2,
@@ -102,6 +104,8 @@
     "local/no-unload-listener": 2,
     "local/prefer-deferred-promise": 0,
     "local/prefer-destructuring": 2,
+    "local/prefer-spread-props": 2,
+    "local/prefer-unnested-spread-objects": 2,
     "local/private-prop-names": 2,
     "local/query-selector": 2,
     "local/split-single-pass-comment": 2,
@@ -191,6 +195,7 @@
       ],
       "rules": {
         "require-jsdoc": 0,
+        "local/no-destructure-assignment-params": 0,
         "jsdoc/check-param-names": 0,
         "jsdoc/check-tag-names": 0,
         "jsdoc/check-types": 0,
@@ -225,6 +230,20 @@
         "process": false,
         "require": false
       }
+    },
+    {
+      "files": ["**/*.extern.js"],
+      "rules": {
+        "no-var": 0,
+        "no-undef": 0,
+        "no-unused-vars": 0,
+        "prefer-const": 0,
+        "require-jsdoc": 0,
+        "jsdoc/check-tag-names": 0,
+        "local/closure-type-primitives": 0,
+        "local/no-duplicate-name-typedef": 0,
+        "google-camelcase/google-camelcase": 0
+      }
     }
   ]
 }
diff --git a/.github/ISSUE_TEMPLATE/cherry_pick_template.md b/.github/ISSUE_TEMPLATE/cherry_pick_template.md
index d29afe0edaf85..b37c6689f6bbf 100644
--- a/.github/ISSUE_TEMPLATE/cherry_pick_template.md
+++ b/.github/ISSUE_TEMPLATE/cherry_pick_template.md
@@ -1,6 +1,6 @@
 ---
 name: Cherry-pick template
-about: Used to request a cherry-pick. See bit.ly/amp-cherry-pick
+about: Used to request a cherry-pick. See go.amp.dev/cherry-picks
 title: "\U0001F338 Cherry-pick request for #<ISSUE_NUMBER> into #<RELEASE_ISSUE> (Pending)"
 labels: 'Type: Release'
 ---
diff --git a/.github/ISSUE_TEMPLATE/release-tracking-issue.md b/.github/ISSUE_TEMPLATE/release-tracking-issue.md
index 57a27912e8321..aab2d63487596 100644
--- a/.github/ISSUE_TEMPLATE/release-tracking-issue.md
+++ b/.github/ISSUE_TEMPLATE/release-tracking-issue.md
@@ -13,8 +13,8 @@ assignees: ''
 <!--
 Note to onduty:
 
-Use this issue to track a release from the initial canary release build through
-production. The community uses this issue to keep track of what is going on
+Use this issue to track a release from the initial experimental/beta release build through
+promotion to stable and LTS. The community uses this issue to keep track of what is going on
 with the release so please keep this issue up to date:
 
 - As you reach each stage of the release, check the appropriate checkbox and replace <CL submit time> with the "Submitted" text from the corresponding CL, e.g. "2:49 PM, Jul 25, 2018 UTC-4".
@@ -23,25 +23,34 @@ with the release so please keep this issue up to date:
   release number to the GitHub tag page the first time a given release number
   appears in the checkboxes.
 - Add any updates that may be of interest to the community (such as delays) as
-  comments on this issue, including after the release is pushed to production.
+  comments on this issue, including after the release is promoted to Stable (and, in some cases, LTS).
 - Keep the title of the issue updated to reflect whether this issue is tracking
-  the Canary or the build in Production.
+  the Experimental/Beta builds or the build in Stable.
 
 Note: remove the backticks (``) from the link.
 -->
 
 - [x] Release `[<RELEASE_NUMBER>](https://github.com/ampproject/amphtml/releases/tag/<RELEASE_NUMBER>)` is cut as a new canary release
-- [ ] Release <RELEASE_NUMBER> pushed to dev channel (<CL submit time>)
-- [ ] Release <RELEASE_NUMBER> pushed to 1% (<CL submit time>)
-- [ ] Release <RELEASE_NUMBER> pushed to production (<CL submit time>)
+- [ ] Release <RELEASE_NUMBER> promoted to Experimental and Beta (opt-in) channels (<CL submit time>)
+- [ ] Release <RELEASE_NUMBER> promoted to Experimental and Beta (1% traffic) channels (<CL submit time>)
+- [ ] Release <RELEASE_NUMBER> promoted to Stable channel (<CL submit time>)
 
 <!--
+On the second Monday of each month, the current stable version will be promoted to the LTS release channel. In other words: 
+
+- If this release is promoted to stable on the first Tuesday of a given month, it needs to be promoted to LTS on the second Monday of the same month.
+- If this release is promoted to stable on the second, third, fourth, or fifth Monday of a given month, it is not an LTS release candidate (but will be included in a later LTS release).
+
+Based on the above, if this release must be promoted to LTS, copy-paste the following checkbox into the list above.
+
+- [ ] Release <RELEASE_NUMBER> promoted to LTS (<CL submit time>)
+
 If you perform cherry picks, add/update the checkboxes above as needed e.g.
 
-- [ ] Release `[<CHERRY_PICK_RELEASE_NUMBER>](...)` created with cherry picks.
-- [ ] Release <CHERRY_PICK_RELEASE_NUMBER> pushed to Dev Channel
+- [ ] Release `[<CHERRY_PICK_RELEASE_NUMBER>](...)` created with cherry picks
+- [ ] Release <CHERRY_PICK_RELEASE_NUMBER> promoted to Experimental and Beta channels
 -->
 
-See the [release documentation](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md) for more information on the release process, including how to test changes in the Dev Channel.
+See the [release documentation](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md) for more information on the release process, including how to test changes in the Experimental channel.
 
-If you find a bug in this build, please file an [issue](https://github.com/ampproject/amphtml/issues/new). If you believe the bug should be fixed in this build, follow the instructions in the [cherry picks documentation](https://bit.ly/amp-cherry-pick).
+If you find a bug in this build, please file an [issue](https://github.com/ampproject/amphtml/issues/new). If you believe the bug should be fixed in this build, follow the instructions in the [cherry picks documentation](https://go.amp.dev/cherry-picks).
diff --git a/.github/ISSUE_TEMPLATE/release_issue_template.md b/.github/ISSUE_TEMPLATE/release_issue_template.md
deleted file mode 100644
index 5834b8c12f754..0000000000000
--- a/.github/ISSUE_TEMPLATE/release_issue_template.md
+++ /dev/null
@@ -1,37 +0,0 @@
-# Release tracking issue
-
-<!--
-Note to onduty:
-
-Use this issue to track a release from the initial canary release build through
-production. The community uses this issue to keep track of what is going on
-with the release so please keep this issue up to date:
-
-- As you reach each stage of the release, check the appropriate checkbox and replace <CL submit time> with the "Submitted" text from the corresponding CL, e.g. "2:49 PM, Jul 25, 2018 UTC-4".
-- If you need to perform cherry picks, add new checkboxes here (by editing this
-  issue), making sure to use the release number for the new build. Link the
-  release number to the GitHub tag page the first time a given release number
-  appears in the checkboxes.
-- Add any updates that may be of interest to the community (such as delays) as
-  comments on this issue, including after the release is pushed to production.
-- Keep the title of the issue updated to reflect whether this issue is tracking
-  the Canary or the build in Production.
-
-Note: remove the backticks (``) from the link.
--->
-
-- [x] Release `[<RELEASE_NUMBER>](https://github.com/ampproject/amphtml/releases/tag/<RELEASE_NUMBER>)` is cut as a new canary release
-- [ ] Release <RELEASE_NUMBER> pushed to dev channel (<CL submit time>)
-- [ ] Release <RELEASE_NUMBER> pushed to 1% (<CL submit time>)
-- [ ] Release <RELEASE_NUMBER> pushed to production (<CL submit time>)
-
-<!--
-If you perform cherry picks, add/update the checkboxes above as needed e.g.
-
-- [ ] Release `[<CHERRY_PICK_RELEASE_NUMBER>](...)` created with cherry picks.
-- [ ] Release <CHERRY_PICK_RELEASE_NUMBER> pushed to Dev Channel
--->
-
-See the [release documentation](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md) for more information on the release process, including how to test changes in the Dev Channel.
-
-If you find a bug in this build, please file an [issue](https://github.com/ampproject/amphtml/issues/new). If you believe the bug should be fixed in this build, follow the instructions in the [cherry picks documentation](https://bit.ly/amp-cherry-pick).
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index 041b7943a35b9..047bd6f66d4ed 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -9,6 +9,8 @@
   - Mention the GitHub issue that is being addressed by the pull request.
   - The keywords `Fixes`, `Closes`, or `Resolves` followed the issue number will automatically close the issue.
 
+> NOTE: All non-trivial changes (like introducing new features or components) should have an associated issue or reference an I2I (intent-to-implement: go.amp.dev/i2i). Please read through the contribution process (go.amp.dev/contributing/code) for more information.
+
 # Example of a good description:
 
 - Implement aspect X
diff --git a/.gitignore b/.gitignore
index 91c1236ac33e8..9f20a5831497d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,6 @@
 .DS_Store
 .g4ignore
-build
+build/
 .amp-build
 c
 /dist
@@ -30,4 +30,6 @@ firebase
 .firebaserc
 firebase.json
 .firebase/
-extensions/amp-analytics/0.1/vendors/*.json
+src/purifier/dist
+build-system/tasks/performance/cache
+build-system/tasks/performance/results.json
diff --git a/.renovaterc.json b/.renovaterc.json
index 2e487ecad398f..a2a3e8157792e 100644
--- a/.renovaterc.json
+++ b/.renovaterc.json
@@ -12,6 +12,7 @@
     "package.json",
     "build-system/tasks/e2e/package.json",
     "build-system/tasks/visual-diff/package.json",
+    "src/purifier/package.json",
     "validator/package.json"
   ]
 }
diff --git a/.travis.yml b/.travis.yml
index 3b4cc1058b824..73771831c8a13 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -93,17 +93,20 @@ jobs:
       name: 'Experiment A Tests'
       script:
         - unbuffer node build-system/pr-check/experiment-tests.js --experiment=experimentA
+      cache: false
     - stage: experiment
       name: 'Experiment B Tests'
       script:
         - unbuffer node build-system/pr-check/experiment-tests.js --experiment=experimentB
+      cache: false
     - stage: experiment
       name: 'Experiment C Tests'
       script:
         - unbuffer node build-system/pr-check/experiment-tests.js --experiment=experimentC
+      cache: false
 before_cache:
-  # do not store cache for pr builds
-  - if [[ $TRAVIS_EVENT_TYPE == pull_request ]]; then exit $TRAVIS_TEST_RESULT ; fi
+  # do not store cache for pr builds or experiment stage builds
+  - if [[ $TRAVIS_EVENT_TYPE == pull_request ]] || [[ $TRAVIS_BUILD_STAGE_NAME == experiment ]]; then exit $TRAVIS_TEST_RESULT ; fi
 cache:
   directories:
     - node_modules
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 338b89a1c4e39..bd3f8ab9b4192 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -9,6 +9,8 @@
     ".eslintrc": "json",
     ".prettierrc": "json",
     ".renovaterc.json": "json",
+
+    // Enable YAML auto-formatting for these files.
     ".codecov.yml": "yaml",
     ".lando.yml": "yaml",
     ".lgtm.yml": "yaml",
@@ -17,7 +19,7 @@
 
   // Auto-fix JS files with ESLint using amphtml's custom settings. Needs
   // https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
-  "eslint.autoFixOnSave": true,
+  "editor.codeActionsOnSave": {"source.fixAll.eslint": true},
   "[js]": {"editor.formatOnSave": false},
 
   // Auto-fix non-JS files with Prettier using amphtml's custom settings. Needs
diff --git a/3p/3p.js b/3p/3p.js
index a5b3eb0ae8cfa..7385178b7fea5 100644
--- a/3p/3p.js
+++ b/3p/3p.js
@@ -232,7 +232,8 @@ export function validateData(data, mandatoryFields, opt_optionalFields) {
       allowedFields = allowedFields.concat(field);
     } else {
       userAssert(
-        data[field],
+        // Allow zero values for height, width etc.
+        data[field] != null,
         'Missing attribute for %s: %s.',
         data.type,
         field
diff --git a/3p/OWNERS b/3p/OWNERS
index 9cc48924e3979..e681110b1334b 100644
--- a/3p/OWNERS
+++ b/3p/OWNERS
@@ -4,7 +4,10 @@
 {
   rules: [
     {
-      owners: [{name: 'ampproject/wg-ads'}],
+      owners: [
+        {name: 'ampproject/wg-ads'},
+        {name: 'ampproject/wg-ui-and-a11y'},
+      ],
     },
   ],
 }
diff --git a/3p/README.md b/3p/README.md
index 145340275765f..49b5af83fbe96 100644
--- a/3p/README.md
+++ b/3p/README.md
@@ -66,5 +66,5 @@ Review the [ads/README](../ads/README.md) for further details on ad integration.
 You should ensure there are integration tests for your extension. These should be added to the AMP
 repo where it makes sense. In some cases this won't be possible because it relies on bringing up
 third-party infrastructure. In these cases you should maintain testing for the extension on your
-infrastructure against both production AMP and [canary](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md#amp-dev-channel).
+infrastructure against both production AMP and [canary](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md#amp-experimental-and-beta-channels).
 Upon any monitored failures, an escalation can be raised in [regular AMP communication channel](https://github.com/ampproject/amphtml/blob/master/CONTRIBUTING.md#discussion-channels).
diff --git a/3p/beopinion.js b/3p/beopinion.js
index f381880166ca0..d0e4a9a8e3ccd 100644
--- a/3p/beopinion.js
+++ b/3p/beopinion.js
@@ -88,6 +88,9 @@ function createContainer(global, data) {
 function getBeOpinionAsyncInit(global, accountId) {
   const {context} = global;
   return function() {
+    context.onResizeDenied(function(requestedHeight, requestedWidth) {
+      context.requestResize(requestedWidth, requestedHeight);
+    });
     global.BeOpinionSDK.init({
       account: accountId,
       onContentReceive: function(hasContent) {
@@ -100,7 +103,6 @@ function getBeOpinionAsyncInit(global, accountId) {
       onHeightChange: function(newHeight) {
         const c = global.document.getElementById('c');
         const boundingClientRect = c./*REVIEW*/ getBoundingClientRect();
-        context.onResizeDenied(context.requestResize.bind(context));
         context.requestResize(boundingClientRect.width, newHeight);
       },
     });
diff --git a/3p/iframe-transport-client.js b/3p/iframe-transport-client.js
index fadfa8b76ff17..3fca0d886f448 100644
--- a/3p/iframe-transport-client.js
+++ b/3p/iframe-transport-client.js
@@ -182,7 +182,7 @@ export class IframeTransportContext {
     this.iframeMessagingClient_./*OK*/ sendMessage(
       MessageType.IFRAME_TRANSPORT_RESPONSE,
       /** @type {!JsonObject} */
-      (Object.assign({message: data}, this.baseMessage_))
+      ({message: data, ...this.baseMessage_})
     );
   }
 }
diff --git a/3p/integration.js b/3p/integration.js
index 231e6df993289..2a3d4cb1e72f2 100644
--- a/3p/integration.js
+++ b/3p/integration.js
@@ -85,6 +85,7 @@ import {adplugg} from '../ads/adplugg';
 import {adpon} from '../ads/adpon';
 import {adreactor} from '../ads/adreactor';
 import {adsensor} from '../ads/adsensor';
+import {adservsolutions} from '../ads/adservsolutions';
 import {adsloom} from '../ads/adsloom';
 import {adsnative} from '../ads/adsnative';
 import {adspeed} from '../ads/adspeed';
@@ -114,6 +115,7 @@ import {blade} from '../ads/blade';
 import {brainy} from '../ads/brainy';
 import {bringhub} from '../ads/bringhub';
 import {broadstreetads} from '../ads/broadstreetads';
+import {byplay} from '../ads/byplay';
 import {caajainfeed} from '../ads/caajainfeed';
 import {capirs} from '../ads/capirs';
 import {caprofitx} from '../ads/caprofitx';
@@ -187,6 +189,7 @@ import {mox} from '../ads/mox';
 import {mytarget} from '../ads/mytarget';
 import {mywidget} from '../ads/mywidget';
 import {nativeroll} from '../ads/nativeroll';
+import {nativery} from '../ads/nativery';
 import {nativo} from '../ads/nativo';
 import {navegg} from '../ads/navegg';
 import {nend} from '../ads/nend';
@@ -242,7 +245,9 @@ import {sovrn} from '../ads/sovrn';
 import {speakol} from '../ads/speakol';
 import {spotx} from '../ads/spotx';
 import {springAds} from '../ads/springAds';
+import {ssp} from '../ads/ssp';
 import {strossle} from '../ads/strossle';
+import {sulvo} from '../ads/sulvo';
 import {sunmedia} from '../ads/sunmedia';
 import {svknative} from '../ads/svknative';
 import {swoop} from '../ads/swoop';
@@ -258,6 +263,7 @@ import {ucfunnel} from '../ads/ucfunnel';
 import {unruly} from '../ads/unruly';
 import {uzou} from '../ads/uzou';
 import {valuecommerce} from '../ads/valuecommerce';
+import {vdoai} from '../ads/vdoai';
 import {videointelligence} from '../ads/videointelligence';
 import {videonow} from '../ads/videonow';
 import {viralize} from '../ads/viralize';
@@ -305,6 +311,7 @@ const AMP_EMBED_ALLOWED = {
   mgid: true,
   miximedia: true,
   mywidget: true,
+  nativery: true,
   lentainform: true,
   opinary: true,
   outbrain: true,
@@ -358,6 +365,7 @@ register('adplugg', adplugg);
 register('adpon', adpon);
 register('adreactor', adreactor);
 register('adsensor', adsensor);
+register('adservsolutions', adservsolutions);
 register('adsloom', adsloom);
 register('adsnative', adsnative);
 register('adspeed', adspeed);
@@ -389,6 +397,7 @@ register('bodymovinanimation', bodymovinanimation);
 register('brainy', brainy);
 register('bringhub', bringhub);
 register('broadstreetads', broadstreetads);
+register('byplay', byplay);
 register('caajainfeed', caajainfeed);
 register('capirs', capirs);
 register('caprofitx', caprofitx);
@@ -468,6 +477,7 @@ register('mox', mox);
 register('mytarget', mytarget);
 register('mywidget', mywidget);
 register('nativeroll', nativeroll);
+register('nativery', nativery);
 register('nativo', nativo);
 register('navegg', navegg);
 register('nend', nend);
@@ -514,6 +524,7 @@ register('sekindo', sekindo);
 register('sharethrough', sharethrough);
 register('shemedia', shemedia);
 register('sklik', sklik);
+register('ssp', ssp);
 register('slimcutmedia', slimcutmedia);
 register('smartadserver', smartadserver);
 register('smartclip', smartclip);
@@ -525,6 +536,7 @@ register('sovrn', sovrn);
 register('spotx', spotx);
 register('springAds', springAds);
 register('strossle', strossle);
+register('sulvo', sulvo);
 register('sunmedia', sunmedia);
 register('svknative', svknative);
 register('swoop', swoop);
@@ -541,6 +553,7 @@ register('ucfunnel', ucfunnel);
 register('unruly', unruly);
 register('uzou', uzou);
 register('valuecommerce', valuecommerce);
+register('vdoai', vdoai);
 register('videointelligence', videointelligence);
 register('videonow', videonow);
 register('viqeoplayer', viqeoplayer);
diff --git a/3p/viqeoplayer.js b/3p/viqeoplayer.js
index 787b930f3e17a..28211c0501922 100644
--- a/3p/viqeoplayer.js
+++ b/3p/viqeoplayer.js
@@ -30,6 +30,13 @@ function viqeoPlayerInitLoaded(global, VIQEO) {
   VIQEO['subscribeTracking'](params => {
     viqeoPlayerInstance = params['player'];
   }, 'Player:added');
+  VIQEO['subscribeTracking'](() => {
+    sendMessage('updatePlayedRanges', viqeoPlayerInstance['getPlayedRanges']());
+    sendMessage('updateCurrentTime', viqeoPlayerInstance['getCurrentTime']());
+  }, 'Player:currentTimeUpdated');
+  VIQEO['subscribeTracking'](() => {
+    sendMessage('updateDuration', viqeoPlayerInstance['getDuration']());
+  }, 'Player:durationUpdated');
   VIQEO['createPlayer']({
     videoId: data['videoid'],
     profileId: data['profileid'],
@@ -38,16 +45,16 @@ function viqeoPlayerInitLoaded(global, VIQEO) {
 
   global.addEventListener('message', parseMessage, false);
 
-  subscribe('videoLoaded', 'ready');
-  subscribe('previewLoaded', 'ready');
-  subscribe('started', 'started');
+  subscribe('ready', 'ready');
   subscribe('paused', 'pause');
+  subscribe('started', 'play');
   subscribe('played', 'play');
   subscribe('replayed', 'play');
-  subscribeTracking({
-    Mute: 'mute',
-    Unmute: 'unmute',
-  });
+  subscribe('ended', 'end');
+  subscribe('advStarted', 'startAdvert');
+  subscribe('advEnded', 'endAdvert');
+  subscribe('muted', 'mute');
+  subscribe('unmuted', 'unmute');
 
   /**
    * Subscribe on viqeo's events
@@ -61,22 +68,6 @@ function viqeoPlayerInitLoaded(global, VIQEO) {
     }, `Player:${playerEventName}`);
   }
 
-  /**
-   * Subscribe viqeo's tracking
-   * @param {Object.<string, string>} eventsDescription
-   * @private
-   */
-  function subscribeTracking(eventsDescription) {
-    VIQEO['subscribeTracking'](params => {
-      const name =
-        params && params['trackingParams'] && params['trackingParams'].name;
-      const targetEventName = eventsDescription[name];
-      if (targetEventName) {
-        sendMessage(targetEventName);
-      }
-    }, 'Player:userAction');
-  }
-
   const sendMessage = (eventName, value = null) => {
     const {parent} = global;
     const message = /** @type {JsonObject} */ ({
diff --git a/METRICS.md b/METRICS.md
index 9362a86583331..198a9296cc651 100644
--- a/METRICS.md
+++ b/METRICS.md
@@ -12,11 +12,11 @@ Average Travis build time over the last 90 days
 
 ![Presubmit Latency](https://amp-project-metrics.appspot.com/api/plot/PresubmitLatencyMetric.png)
 
-## Release Cherrypick Count
+## Cherrypick Issue Count
 
-Number of cherry-picks in releases over the last 90 days
+Number of cherry-pick issues in the last 90 days
 
-![Release Cherrypick Count](https://amp-project-metrics.appspot.com/api/plot/ReleaseCherrypickCountMetric.png)
+![Cherrypick Issue Count](https://amp-project-metrics.appspot.com/api/plot/CherrypickIssueCountMetric.png)
 
 ## Release Granularity
 
diff --git a/README.md b/README.md
index 247bd809de08f..3bf2174029e40 100644
--- a/README.md
+++ b/README.md
@@ -2,7 +2,6 @@
 
 [![Build Status](https://img.shields.io/travis/ampproject/amphtml/master.svg?logo=Travis%20CI&logoColor=white&style=flat-square 'Build Status')](https://travis-ci.org/ampproject/amphtml/builds)
 [![GitHub Release](https://img.shields.io/github/release/ampproject/amphtml.svg?logo=GitHub&style=flat-square 'GitHub Release')](https://github.com/ampproject/amphtml/releases/latest)
-[![Contributors](https://img.shields.io/github/contributors-anon/ampproject/amphtml.svg?logo=GitHub&style=flat-square 'Contributors')](https://github.com/ampproject/amphtml/graphs/contributors)
 [![Commits](https://img.shields.io/github/commit-activity/m/ampproject/amphtml.svg?logo=GitHub&style=flat-square 'Commits')](https://github.com/ampproject/amphtml/pulse/monthly)
 [![Badges](https://img.shields.io/badge/badges-16-brightgreen?logo=GitHub&style=flat-square)](#)
 
@@ -14,7 +13,7 @@ Metrics
 
 [![Absolute Code Coverage](https://img.shields.io/endpoint.svg?logo=Codecov&logoColor=white&style=flat-square&url=https%3A%2F%2Famp-project-metrics.appspot.com%2Fapi%2Fbadge%2FAbsoluteCoverageMetric 'Test coverage for the repository as computed by CodeCov')](https://codecov.io/gh/ampproject/amphtml/)
 [![Presubmit Latency](https://img.shields.io/endpoint.svg?logo=Travis%20CI&logoColor=white&style=flat-square&url=https%3A%2F%2Famp-project-metrics.appspot.com%2Fapi%2Fbadge%2FPresubmitLatencyMetric 'Average Travis build time over the last 90 days')](https://travis-ci.org/ampproject/amphtml/builds)
-[![Release Cherrypick Count](https://img.shields.io/endpoint.svg?logo=GitHub&logoColor=white&style=flat-square&url=https%3A%2F%2Famp-project-metrics.appspot.com%2Fapi%2Fbadge%2FReleaseCherrypickCountMetric 'Number of cherry-picks in releases over the last 90 days')](https://github.com/ampproject/amphtml/issues?utf8=%E2%9C%93&q=is%3Aissue+title%3A+%22Cherry-pick%22)
+[![Cherrypick Issue Count](https://img.shields.io/endpoint.svg?logo=GitHub&logoColor=white&style=flat-square&url=https%3A%2F%2Famp-project-metrics.appspot.com%2Fapi%2Fbadge%2FCherrypickIssueCountMetric 'Number of cherry-pick issues in the last 90 days')](https://github.com/ampproject/amphtml/issues?utf8=%E2%9C%93&q=is%3Aissue+title%3A+%22Cherry-pick%22)
 [![Release Granularity](https://img.shields.io/endpoint.svg?logo=GitHub&logoColor=white&style=flat-square&url=https%3A%2F%2Famp-project-metrics.appspot.com%2Fapi%2Fbadge%2FReleaseGranularityMetric 'Average commits per release over the last 90 days')](https://github.com/ampproject/amphtml/releases)
 [![Travis Greenness](https://img.shields.io/endpoint.svg?logo=Travis%20CI&logoColor=white&style=flat-square&url=https%3A%2F%2Famp-project-metrics.appspot.com%2Fapi%2Fbadge%2FTravisGreennessMetric 'Percentage of green Travis builds over the last 90 days')](https://travis-ci.org/ampproject/amphtml/builds)
 [![Travis Flakiness](https://img.shields.io/endpoint.svg?logo=Travis%20CI&logoColor=white&style=flat-square&url=https%3A%2F%2Famp-project-metrics.appspot.com%2Fapi%2Fbadge%2FTravisFlakinessMetric 'Percentage of flaky Travis builds over the last 90 days')](https://travis-ci.org/ampproject/amphtml/builds)
@@ -65,7 +64,7 @@ AMP is an open source project, and we'd love your help making it better!
 
 ## Other useful information
 
-- [AMP's release documentation](contributing/release-schedule.md) provides details on how and when AMP releases new versions, including [how to know when a change is live in production](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md#determining-if-your-change-is-in-production).
+- [AMP's release documentation](contributing/release-schedule.md) provides details on how and when AMP releases new versions, including [how to know when a change is live in a release](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md#determining-if-your-change-is-in-a-release).
 - [AMP's roadmap](https://amp.dev/community/roadmap) provides details on some of the significant projects we are working on.
 - The [AMP meta repository](https://github.com/ampproject/meta) has information _about_ the AMP open source project, including AMP's [governance](https://github.com/ampproject/meta/blob/master/GOVERNANCE.md).
 - [AMP's code of conduct](https://github.com/ampproject/meta/blob/master/CODE_OF_CONDUCT.md) documents how all members, committers and volunteers in the community are required to act. AMP strives for a positive and growing project community that provides a safe environment for everyone.
diff --git a/ads/README.md b/ads/README.md
index 8453170cbd3d8..2d5fa355b9441 100644
--- a/ads/README.md
+++ b/ads/README.md
@@ -361,6 +361,7 @@ To speed up the review process, please run `gulp lint` and `gulp check-types`, t
 
 ### Other tips
 
+- Add **cc ampproject/wg-ads** in all pull request's descriptions.
 - It's highly recommended to maintain [an integration test outside AMP repo](../3p/README.md#adding-proper-integration-tests).
 - Please consider implementing the `render-start` and `no-content-available` APIs (see [Available APIs](#available-apis)), which helps AMP to provide user a much better ad loading experience.
 - [CLA](../CONTRIBUTING.md#contributing-code): for anyone who has trouble to pass the automatic CLA check in a pull request, try to follow the guidelines provided by the CLA Bot. Common mistakes are:
diff --git a/ads/_config.js b/ads/_config.js
index 2668274fafa4a..d8714b864aeef 100755
--- a/ads/_config.js
+++ b/ads/_config.js
@@ -177,6 +177,9 @@ const adConfig = jsonConfiguration({
     clientIdScope: 'amp_ecid_adensor',
     renderStartImplemented: true,
   },
+
+  'adservsolutions': {},
+
   'adsloom': {
     clientIdScope: 'AMP_ECID_ADSLOOM',
   },
@@ -333,6 +336,8 @@ const adConfig = jsonConfiguration({
     prefetch: 'https://cdn.broadstreetads.com/init-2.min.js',
   },
 
+  'byplay': {},
+
   'caajainfeed': {
     prefetch: ['https://cdn.amanad.adtdp.com/sdk/ajaamp.js'],
     preconnect: ['https://ad.amanad.adtdp.com'],
@@ -718,6 +723,10 @@ const adConfig = jsonConfiguration({
     prefetch: 'https://cdn01.nativeroll.tv/js/seedr-player.min.js',
   },
 
+  'nativery': {
+    preconnect: 'https://cdn.nativery.com',
+  },
+
   'nativo': {
     prefetch: 'https://s.ntv.io/serve/load.js',
   },
@@ -992,6 +1001,12 @@ const adConfig = jsonConfiguration({
     renderStartImplemented: true,
   },
 
+  'ssp': {
+    prefetch: 'https://ssp.imedia.cz/static/js/ssp.js',
+    renderStartImplemented: true,
+    consentHandlingOverride: true,
+  },
+
   'strossle': {
     preconnect: [
       'https://amp.spklw.com',
@@ -1074,6 +1089,11 @@ const adConfig = jsonConfiguration({
     renderStartImplemented: true,
   },
 
+  'vdoai': {
+    prefetch: 'https://a.vdo.ai/core/dependencies_amp/vdo.min.js',
+    renderStartImplemented: true,
+  },
+
   'videointelligence': {
     preconnect: 'https://s.vi-serve.com',
     renderStartImplemented: true,
@@ -1198,6 +1218,8 @@ const adConfig = jsonConfiguration({
     prefetch: 'https://dup.baidustatic.com/js/dm.js',
     renderStartImplemented: true,
   },
+
+  'sulvo': {},
 });
 
 export {adConfig};
diff --git a/ads/ads.extern.js b/ads/ads.extern.js
index 7eb17326350d6..91d270ded2e39 100644
--- a/ads/ads.extern.js
+++ b/ads/ads.extern.js
@@ -19,15 +19,15 @@
 // HACK. Define application types used in default AMP externs
 // that are not in the 3p code.
 /** @constructor */
-function BaseElement$$module$src$base_element() {};
+function BaseElement$$module$src$base_element() {}
 /** @constructor */
-function AmpAdXOriginIframeHandler$$module$extensions$amp_ad$0_1$amp_ad_xorigin_iframe_handler() {};
+function AmpAdXOriginIframeHandler$$module$extensions$amp_ad$0_1$amp_ad_xorigin_iframe_handler() {}
 /** @constructor */
-function AmpAd3PImpl$$module$extensions$amp_ad$0_1$amp_ad_3p_impl() {};
+function AmpAd3PImpl$$module$extensions$amp_ad$0_1$amp_ad_3p_impl() {}
 /** @constructor */
-function AmpA4A$$module$extensions$amp_a4a$0_1$amp_a4a() {};
+function AmpA4A$$module$extensions$amp_a4a$0_1$amp_a4a() {}
 /** @constructor */
-function AmpAdUIHandler$$module$extensions$amp_ad$0_1$amp_ad_ui() {};
+function AmpAdUIHandler$$module$extensions$amp_ad$0_1$amp_ad_ui() {}
 
 // Long list of, uhm, stuff the ads code needs to compile.
 // All unquoted external properties need to be added here.
@@ -54,45 +54,47 @@ data.embedtype;
 data.src;
 
 //twitter.js
-data.tweetid
+data.tweetid;
 
 //mathml.js
-data.formula
-var mathjax
-mathjax.Hub
-mathjax.Hub.Config
-mathjax.Hub.Queue
-window.MathJax
+data.formula;
+var mathjax;
+mathjax.Hub;
+mathjax.Hub.Config;
+mathjax.Hub.Queue;
+window.MathJax;
 
 //3d-gltf/index.js
 var THREE;
 
-THREE.LoaderUtils
-THREE.LoaderUtils.extractUrlBase
+THREE.LoaderUtils;
+THREE.LoaderUtils.extractUrlBase;
 
 THREE.WebGLRenderer = class {
   /** @param {!JsonObject} opts */
   constructor(opts) {
-    /** @type {?Element} */ this.domElement = null;}};
-THREE.WebGLRenderer.prototype.setSize
-THREE.WebGLRenderer.prototype.setPixelRatio
-THREE.WebGLRenderer.prototype.setClearColor
-THREE.WebGLRenderer.prototype.render
+    /** @type {?Element} */ this.domElement = null;
+  }
+};
+THREE.WebGLRenderer.prototype.setSize;
+THREE.WebGLRenderer.prototype.setPixelRatio;
+THREE.WebGLRenderer.prototype.setClearColor;
+THREE.WebGLRenderer.prototype.render;
 /** @type {boolean} */
-THREE.WebGLRenderer.prototype.gammaOutput
+THREE.WebGLRenderer.prototype.gammaOutput;
 /** @type {number} */
-THREE.WebGLRenderer.prototype.gammaFactor
+THREE.WebGLRenderer.prototype.gammaFactor;
 
 THREE.Light = class extends THREE.Object3D {};
 THREE.DirectionalLight = class extends THREE.Light {};
 THREE.AmbientLight = class extends THREE.Light {};
 
 THREE.Box3 = class {};
-THREE.Box3.prototype.getSize
-THREE.Box3.prototype.getCenter
-THREE.Box3.prototype.setFromObject
-THREE.Box3.prototype.min
-THREE.Box3.prototype.max
+THREE.Box3.prototype.getSize;
+THREE.Box3.prototype.getCenter;
+THREE.Box3.prototype.setFromObject;
+THREE.Box3.prototype.min;
+THREE.Box3.prototype.max;
 
 THREE.Vector3 = class {
   /** @param {number=} opt_x
@@ -100,25 +102,27 @@ THREE.Vector3 = class {
    * @param {number=} opt_z */
   constructor(opt_x, opt_y, opt_z) {}
 };
-THREE.Vector3.prototype.lerpVectors
-THREE.Vector3.prototype.copy
-THREE.Vector3.prototype.clone
-THREE.Vector3.prototype.subVectors
-THREE.Vector3.prototype.multiplyScalar
-THREE.Vector3.prototype.setFromMatrixColumn
-THREE.Vector3.prototype.add
-THREE.Vector3.prototype.set
-THREE.Vector3.prototype.applyQuaternion
-THREE.Vector3.prototype.setFromSpherical
-THREE.Vector3.prototype.distanceToSquared
-THREE.Vector3.prototype.length
-THREE.Vector3.prototype.fromArray
+THREE.Vector3.prototype.lerpVectors;
+THREE.Vector3.prototype.copy;
+THREE.Vector3.prototype.clone;
+THREE.Vector3.prototype.subVectors;
+THREE.Vector3.prototype.multiplyScalar;
+THREE.Vector3.prototype.setFromMatrixColumn;
+THREE.Vector3.prototype.add;
+THREE.Vector3.prototype.set;
+THREE.Vector3.prototype.applyQuaternion;
+THREE.Vector3.prototype.setFromSpherical;
+THREE.Vector3.prototype.distanceToSquared;
+THREE.Vector3.prototype.length;
+THREE.Vector3.prototype.fromArray;
 
 THREE.Euler = class {
   constructor() {
     this.x = 0;
     this.y = 0;
-    this.z = 0;}};
+    this.z = 0;
+  }
+};
 
 THREE.Euler.prototype.set;
 
@@ -126,21 +130,25 @@ THREE.Object3D = class {
   constructor() {
     this.position = new THREE.Vector3();
     this.rotation = new THREE.Euler();
-    this.children = [];}};
+    this.children = [];
+  }
+};
 
-THREE.Object3D.prototype.applyMatrix
-THREE.Object3D.prototype.add
-THREE.Object3D.prototype.updateMatrixWorld
-THREE.Object3D.prototype.lookAt
-THREE.Object3D.prototype.clone
+THREE.Object3D.prototype.applyMatrix;
+THREE.Object3D.prototype.add;
+THREE.Object3D.prototype.updateMatrixWorld;
+THREE.Object3D.prototype.lookAt;
+THREE.Object3D.prototype.clone;
 
 THREE.OrbitControls = class {
   /** @param {THREE.Camera} camera
    * @param {Element} domElement */
   constructor(camera, domElement) {
-    this.target = new THREE.Vector3(); }};
-THREE.OrbitControls.prototype.update
-THREE.OrbitControls.prototype.addEventListener
+    this.target = new THREE.Vector3();
+  }
+};
+THREE.OrbitControls.prototype.update;
+THREE.OrbitControls.prototype.addEventListener;
 
 THREE.Scene = class extends THREE.Object3D {};
 THREE.Group = class extends THREE.Object3D {};
@@ -152,16 +160,20 @@ THREE.Camera = class extends THREE.Object3D {
     this.far = 0;
     this.near = 0;
     this.aspect = 0;
-    this.zoom = 0;}};
-THREE.Camera.prototype.updateProjectionMatrix
-THREE.Camera.prototype.setFromUnitVectors
+    this.zoom = 0;
+  }
+};
+THREE.Camera.prototype.updateProjectionMatrix;
+THREE.Camera.prototype.setFromUnitVectors;
 
 THREE.PerspectiveCamera = class extends THREE.Camera {};
 
 THREE.GLTFLoader = class {
   constructor() {
-    this.crossOrigin = false;}};
-THREE.GLTFLoader.prototype.load
+    this.crossOrigin = false;
+  }
+};
+THREE.GLTFLoader.prototype.load;
 
 // Under ads/google folder
 
@@ -198,7 +210,7 @@ data.overrideHeight;
 data.height;
 data.multiSizeValidation;
 data.categoryExclusions;
-data.categoryExclusions.length;;
+data.categoryExclusions.length;
 data.cookieOptions;
 data.tagForChildDirectedTreatment;
 data.targeting;
@@ -218,7 +230,7 @@ google.ima.AdsLoader;
 google.ima.AdsLoader.getSettings;
 google.ima.AdsLoader.requestAds;
 google.ima.AdsManagerLoadedEvent;
-google.ima.AdsManagerLoadedEvent.Type
+google.ima.AdsManagerLoadedEvent.Type;
 google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED;
 google.ima.AdsManagerLoadedEvent.getAdsManager;
 google.ima.AdErrorEvent;
@@ -419,7 +431,7 @@ data.parameters;
 data.queue;
 
 // imedia.js
-data.positions
+data.positions;
 
 // imonomy.js
 data.pid;
@@ -508,7 +520,7 @@ Guoshi.queryAd.amp;
 Guoshi.queryAd.amp.setup;
 
 // openadstream.js
-data.adhost
+data.adhost;
 data.sitepage;
 data.pos;
 data.query;
@@ -612,8 +624,8 @@ data.z;
 data.tf;
 
 // swoop.js
-var Swoop
-Swoop.announcePlace
+var Swoop;
+Swoop.announcePlace;
 
 // taboola.js
 data.referrer;
diff --git a/ads/adservsolutions.js b/ads/adservsolutions.js
new file mode 100644
index 0000000000000..5a5a1e1c9c644
--- /dev/null
+++ b/ads/adservsolutions.js
@@ -0,0 +1,33 @@
+/**
+ * Copyright 2015 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {validateData, writeScript} from '../3p/3p';
+
+/**
+ * @param {!Window} global
+ * @param {!Object} data
+ */
+export function adservsolutions(global, data) {
+  validateData(data, [], ['client', 'zid']);
+  global['ABNS'] =
+    global['ABNS'] ||
+    function() {
+      (global['ABNSl'] = global['ABNSl'] || []).push(arguments);
+    };
+  global['ABNSh'] = data.client;
+  writeScript(global, 'https://cdn.' + global['ABNSh'] + '/libs/b.js');
+  global['ABNS']('c', {id: data.zid + '&o=a'});
+}
diff --git a/ads/adservsolutions.md b/ads/adservsolutions.md
new file mode 100644
index 0000000000000..44ca351e89fd8
--- /dev/null
+++ b/ads/adservsolutions.md
@@ -0,0 +1,39 @@
+<!---
+Copyright 2015 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# AdServSolution
+
+## Example
+
+```html
+<amp-ad
+  width="300"
+  height="250"
+  type="adservsolutions"
+  data-client="adservsolutions.com"
+  data-zid="1"
+>
+</amp-ad>
+```
+
+## Configuration
+
+For details on the configuration semantics, please contact the ad network.
+
+Supported parameters:
+
+- `data-client`: ad server client
+- `data-zid`: ad zone id
diff --git a/ads/blade.js b/ads/blade.js
index 16966a8be7022..dba58e037bb24 100644
--- a/ads/blade.js
+++ b/ads/blade.js
@@ -34,7 +34,7 @@ export function blade(global, data) {
   const marcosObj = tryParseJson(data['blade_macros']) || {};
   marcosObj['rand'] = Math.random().toString();
   marcosObj['page_url'] = marcosObj['page_url'] || global.context.canonicalUrl;
-  const macros = Object.assign({}, marcosObj);
+  const macros = {...marcosObj};
   macros.width = data.width;
   macros.height = data.height;
 
diff --git a/ads/byplay.js b/ads/byplay.js
new file mode 100644
index 0000000000000..a70bde7501a4d
--- /dev/null
+++ b/ads/byplay.js
@@ -0,0 +1,28 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {loadScript, validateData} from '../3p/3p';
+
+/**
+ * @param {!Window} global
+ * @param {!Object} data
+ */
+export function byplay(global, data) {
+  validateData(data, ['vastUrl']);
+
+  global.BYPLAY_VAST_URL = data['vastUrl'];
+
+  loadScript(global, 'https://cdn.byplay.net/amp-byplay-v2.js');
+}
diff --git a/ads/byplay.md b/ads/byplay.md
new file mode 100644
index 0000000000000..bd3f130382779
--- /dev/null
+++ b/ads/byplay.md
@@ -0,0 +1,37 @@
+<!---
+Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# ByPlay
+
+## Example
+
+```html
+<amp-ad
+  width="320"
+  height="180"
+  type="byplay"
+  data-vast-url="https://h.f1.impact-ad.jp/adv?section_id=1234"
+>
+</amp-ad>
+```
+
+## Configuration
+
+For configuration details and to generate your tags, please contact email: [byplayers@tsumikiinc.com](mailto:byplayers@tsumikiinc.com).
+
+Required parameters:
+
+- `data-vast-url`
diff --git a/ads/capirs.js b/ads/capirs.js
index 0b7e4a8573607..4987dc63e883d 100644
--- a/ads/capirs.js
+++ b/ads/capirs.js
@@ -67,7 +67,6 @@ export function capirs(global, data) {
     },
   };
 
-  loadScript(global, '//ssp.rambler.ru/lpdid.js');
   loadScript(global, '//ssp.rambler.ru/capirs_async.js');
 }
 
diff --git a/ads/google/a4a/line-delimited-response-handler.js b/ads/google/a4a/line-delimited-response-handler.js
index 16292d4f0d6c4..4d83a4975cf57 100644
--- a/ads/google/a4a/line-delimited-response-handler.js
+++ b/ads/google/a4a/line-delimited-response-handler.js
@@ -22,7 +22,6 @@ import {tryParseJson} from '../../../src/json';
  * @param {!Window} win
  * @param {!Response} response
  * @param {function(string, boolean)} lineCallback
- * @private
  */
 export function lineDelimitedStreamer(win, response, lineCallback) {
   let line = '';
@@ -71,7 +70,6 @@ export function lineDelimitedStreamer(win, response, lineCallback) {
  * Given each line, groups such that the first is JSON parsed and second
  * html unescaped.
  * @param {function(string, !Object<string, *>, boolean)} callback
- * @private
  * @return {function(string, boolean)}
  */
 export function metaJsonCreativeGrouper(callback) {
diff --git a/ads/google/a4a/test/test-utils.js b/ads/google/a4a/test/test-utils.js
index 18a777c72bcf9..091d4c5ea00e6 100644
--- a/ads/google/a4a/test/test-utils.js
+++ b/ads/google/a4a/test/test-utils.js
@@ -257,10 +257,10 @@ describe('Google A4A utils', () => {
   });
 
   describe('#getAmpRuntimeTypeParameter', () => {
-    it('should specify that this is canary', () => {
+    it('should specify that this is experimental', () => {
       expect(
         getAmpRuntimeTypeParameter({
-          AMP_CONFIG: {type: 'canary'},
+          AMP_CONFIG: {type: 'experimental'},
           location: {origin: 'https://www-example-com.cdn.ampproject.org'},
         })
       ).to.equal('2');
@@ -299,7 +299,7 @@ describe('Google A4A utils', () => {
     it('should not have `art` parameter when canonical', () => {
       expect(
         getAmpRuntimeTypeParameter({
-          AMP_CONFIG: {type: 'canary'},
+          AMP_CONFIG: {type: 'experimental'},
           location: {origin: 'https://www.example.com'},
         })
       ).to.be.null;
diff --git a/ads/google/a4a/utils.js b/ads/google/a4a/utils.js
index df24ffb2f54e3..f0936823a7799 100644
--- a/ads/google/a4a/utils.js
+++ b/ads/google/a4a/utils.js
@@ -830,7 +830,7 @@ export function getBinaryTypeNumericalCode(type) {
     {
       'production': '0',
       'control': '1',
-      'canary': '2',
+      'experimental': '2',
       'rc': '3',
       'experimentA': '10',
       'experimentB': '11',
diff --git a/ads/gumgum.js b/ads/gumgum.js
index 615ac9a2f87dc..bf106176e6504 100644
--- a/ads/gumgum.js
+++ b/ads/gumgum.js
@@ -35,7 +35,7 @@ export function gumgum(global, data) {
     slotId = parseInt(data.slot, 10),
     onLoad = function(type) {
       return function(evt) {
-        const ad = Object.assign({width: 0, height: 0}, evt.ad || {}),
+        const ad = {width: 0, height: 0, ...(evt.ad || {})},
           identifier = ['GUMGUM', type, evt.id].join('_');
         ctx.reportRenderedEntityIdentifier(identifier);
         ctx.renderStart({
diff --git a/ads/inabox/inabox-host.md b/ads/inabox/inabox-host.md
index 24f950c3e6337..0adfe8bdffe99 100644
--- a/ads/inabox/inabox-host.md
+++ b/ads/inabox/inabox-host.md
@@ -78,6 +78,11 @@ Main workflow:
 1. The ads tag creates an iframe, and set the response content
    to the iframe using `srcdoc`.
 
+Note that this friendly iframe approach right now is in an experimental
+stage. Put the following meta tag in the head of the ad HTML to opt-in
+the experiment:
+`<meta name="amp-experiments-opt-in" content="inabox-viewport-friendly">`.
+
 ###### Security assurance
 
 In case that the AMPHTML ad is generated by a 3rd party, to ensure it's
diff --git a/ads/inabox/position-observer.js b/ads/inabox/position-observer.js
index 8f1a2334f5683..dcb6aff372d6c 100644
--- a/ads/inabox/position-observer.js
+++ b/ads/inabox/position-observer.js
@@ -136,7 +136,11 @@ export class PositionObserver {
     const parentWin = element.ownerDocument.defaultView;
     for (
       let j = 0, tempWin = parentWin;
-      j < 10 && tempWin != this.win_ && tempWin != this.win_.top;
+      j < 10 &&
+      // win can be null if the ad iframe is already destroyed
+      tempWin &&
+      tempWin != this.win_ &&
+      tempWin != this.win_.top;
       j++, tempWin = tempWin.parent
     ) {
       const parentFrameRect = layoutRectFromDomRect(
diff --git a/ads/nativery.js b/ads/nativery.js
new file mode 100644
index 0000000000000..1b40a80c2746d
--- /dev/null
+++ b/ads/nativery.js
@@ -0,0 +1,45 @@
+/**
+ * Copyright 2018 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {validateData, writeScript} from '../3p/3p';
+
+/**
+ * @param {!Window} global
+ * @param {!Object} data
+ */
+export function nativery(global, data) {
+  validateData(data, ['wid']);
+  const params = {...data};
+
+  // push the two object into the '_nativery' global
+  global._nativery = global._nativery || {
+    wid: data.wid,
+    referrer: data.referrer || global.context.referrer,
+    url: data.url || global.context.canonicalUrl,
+    viewId: global.context.pageViewId,
+    params,
+  };
+
+  // must add listener for resize
+  global.addEventListener('amp-widgetCreated', function(e) {
+    if (e && e.detail) {
+      global.context.requestResize(undefined, e.detail.height);
+    }
+  });
+
+  // load the nativery loader asynchronously
+  writeScript(global, `https://cdn.nativery.com/widget/js/natamp.js`);
+}
diff --git a/ads/nativery.md b/ads/nativery.md
new file mode 100644
index 0000000000000..de69333e6a101
--- /dev/null
+++ b/ads/nativery.md
@@ -0,0 +1,36 @@
+<!---
+Copyright 2015 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# Nativery
+
+## Example
+
+### Basic
+
+```html
+<amp-embed
+  width="100"
+  height="283"
+  type="nativery"
+  layout="responsive"
+  data-wid="[YOUR_WIDGET_ID]"
+>
+</amp-embed>
+```
+
+## Configuration
+
+For details on the configuration semantics, please contact the ad network or refer to their documentation.
diff --git a/ads/readmo.js b/ads/readmo.js
index 9e8b0cfde907e..12685b07313c2 100644
--- a/ads/readmo.js
+++ b/ads/readmo.js
@@ -29,7 +29,7 @@ export function readmo(global, data) {
 
   const {section, module, sponsoredByLabel, infinite, title, url} = data;
 
-  window.publisherUrl = url;
+  global.publisherUrl = url;
 
   (global.readmo = global.readmo || []).push({
     section,
@@ -41,21 +41,6 @@ export function readmo(global, data) {
     amp: true,
   });
 
-  global.context.observeIntersection(
-    entries => {
-      entries.forEach(entry => {
-        if (global.Readmo) {
-          global.Readmo.onViewChange({
-            intersectionRatio: entry.intersectionRatio,
-          });
-        }
-      });
-    },
-    {
-      threshold: [0, 0.5, 1],
-    }
-  );
-
   loadScript(global, 'https://s.yimg.com/dy/ads/readmo.js', () =>
     global.context.renderStart()
   );
diff --git a/ads/readmo.md b/ads/readmo.md
index 1aee88f7c56fb..b8af4ee4c9513 100644
--- a/ads/readmo.md
+++ b/ads/readmo.md
@@ -28,7 +28,7 @@ ReadMo only requires a section code to run. Please work your account manager to
   height="400"
   type="readmo"
   layout="responsive"
-  data-url="https://yoursite.com"
+  data-url="https://yourdomain.com"
   data-infinite="true"
   data-section="1234567"
 >
diff --git a/ads/revjet.js b/ads/revjet.js
index 417a8e8c19c5a..50af0213fc017 100644
--- a/ads/revjet.js
+++ b/ads/revjet.js
@@ -23,7 +23,7 @@ import {loadScript, validateData} from '../3p/3p';
 export function revjet(global, data) {
   validateData(data, ['tag', 'key'], ['plc', 'opts', 'params']);
 
-  global._revjetData = Object.assign({}, data);
+  global._revjetData = {...data};
 
   loadScript(
     global,
diff --git a/ads/ssp.js b/ads/ssp.js
new file mode 100644
index 0000000000000..3290f0698be43
--- /dev/null
+++ b/ads/ssp.js
@@ -0,0 +1,77 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {computeInMasterFrame, loadScript, validateData} from '../3p/3p';
+
+/**
+ * @param {!Window} global
+ * @param {!Object} data
+ */
+export function ssp(global, data) {
+  // validate AMP input data- attributes
+  validateData(data, ['id', 'width', 'height', 'zoneid'], ['site']);
+
+  // create parent element
+  const adWrapper = document.createElement('div');
+
+  adWrapper.id = data.id;
+
+  // https://github.com/ampproject/amphtml/tree/master/ads#the-iframe-sandbox
+  global.document.getElementById('c').appendChild(adWrapper);
+
+  // https://github.com/ampproject/amphtml/blob/master/3p/3p.js#L186
+  computeInMasterFrame(
+    global,
+    'ssp-load',
+    done => {
+      loadScript(global, 'https://ssp.imedia.cz/static/js/ssp.js', () => {
+        // Script will inject "sssp" object on Window
+        if (!global['sssp']) {
+          done(null);
+
+          return;
+        }
+
+        /** @type {{config: Function, getAds: Function}} */
+        const ssp = global['sssp'];
+
+        ssp.config({
+          site: data.site || global.context.canonicalUrl,
+        });
+
+        ssp.getAds(
+          {
+            zoneId: data.zoneid,
+            id: data.id,
+            width: data.width,
+            height: data.height,
+          },
+          {
+            requestErrorCallback: () => done(null),
+            AMPcallback: ads => done(ads),
+          }
+        );
+      });
+    },
+    ads => {
+      if (ads && ads[0] && ads[0].type !== 'error') {
+        global.context.renderStart();
+      } else {
+        global.context.noContentAvailable();
+      }
+    }
+  );
+}
diff --git a/ads/ssp.md b/ads/ssp.md
new file mode 100644
index 0000000000000..84a17b13118df
--- /dev/null
+++ b/ads/ssp.md
@@ -0,0 +1,44 @@
+<!---
+ Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+  http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS-IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+-->
+
+# SSP
+
+## Example
+
+```html
+<amp-ad
+  width="300"
+  height="250"
+  data-id="cnt-1234"
+  data-width="300"
+  data-height="250"
+  data-zoneid="1234"
+>
+</amp-ad>
+```
+
+## Configuration
+
+Required parameters:
+
+- `data-id`
+- `data-width`: Width of position (must be same as width attribute)
+- `data-width`: Height of position (must be same as height attribute)
+- `data-zoneid`: Id of zone
+
+## Contact
+
+reklama-pozadavky@firma.seznam.cz
diff --git a/ads/sulvo.js b/ads/sulvo.js
new file mode 100644
index 0000000000000..7827f47ed7a61
--- /dev/null
+++ b/ads/sulvo.js
@@ -0,0 +1,25 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {loadScript} from '../3p/3p';
+
+/**
+ * @param {!Window} global
+ * @param {!Object} data
+ */
+export function sulvo(global, data) {
+  global.sulvoAmpAdData = data;
+  loadScript(global, 'https://live.demand.supply/up.amp.js');
+}
diff --git a/ads/sulvo.md b/ads/sulvo.md
new file mode 100644
index 0000000000000..adbc048e94714
--- /dev/null
+++ b/ads/sulvo.md
@@ -0,0 +1,52 @@
+<!---
+Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+      http://www.apache.org/licenses/LICENSE-2.0
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# Sulvo
+
+## Example
+
+### Regular ad
+
+```html
+<amp-ad
+  width="300"
+  height="250"
+  type="sulvo"
+  data-ad="example.com_display"
+  class="demand-supply"
+>
+</amp-ad>
+```
+
+### Sticky ad
+
+```html
+<amp-sticky-ad>
+  <amp-ad
+    width="300"
+    height="250"
+    type="sulvo"
+    data-ad="example.com_sticky_mobile"
+    class="demand-supply"
+  >
+  </amp-ad>
+</amp-sticky-ad>
+```
+
+## Configuration
+
+For further information, please contact [Sulvo](https://sulvo.com/).
+
+### Required parameters
+
+- `data-ad`: Ad ID provided by Sulvo.
diff --git a/ads/vdoai.js b/ads/vdoai.js
new file mode 100644
index 0000000000000..3535b62e879f2
--- /dev/null
+++ b/ads/vdoai.js
@@ -0,0 +1,29 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {loadScript} from '../3p/3p';
+/**
+ * @param {!Window} global
+ * @param {!Object} data
+ */
+export function vdoai(global, data) {
+  /*eslint "google-camelcase/google-camelcase": 0*/
+  global.vdo_ai_ = {
+    unitData: data['unitid'],
+    unitTagname: data['tagname'],
+  };
+  loadScript(global, 'https://a.vdo.ai/core/dependencies_amp/remote.js');
+}
diff --git a/ads/vdoai.md b/ads/vdoai.md
new file mode 100644
index 0000000000000..5c86b26792e75
--- /dev/null
+++ b/ads/vdoai.md
@@ -0,0 +1,38 @@
+<!---
+Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# VDO.AI
+
+## Example
+
+```html
+<amp-ad
+  width="300"
+  height="1"
+  type="vdo"
+  data-unitid="_vdo_ads_player_ai_"
+  data-tagname="publisher"
+  layout="responsive"
+>
+</amp-ad>
+```
+
+## Configuration
+
+Supported parameters:
+
+- `data-unitid`
+- `data-tagname`
diff --git a/ads/yahoonativeads.js b/ads/yahoonativeads.js
index 0ea90a7f0e7df..4d2c284d9ec07 100644
--- a/ads/yahoonativeads.js
+++ b/ads/yahoonativeads.js
@@ -29,21 +29,6 @@ export function yahoonativeads(global, data) {
   global.publisherUrl = data.url;
   global.amp = true;
 
-  global.context.observeIntersection(
-    entries => {
-      entries.forEach(entry => {
-        if (global.Native) {
-          global.Native.onViewChange({
-            intersectionRatio: entry.intersectionRatio,
-          });
-        }
-      });
-    },
-    {
-      threshold: [0, 0.5, 1],
-    }
-  );
-
   loadScript(global, 'https://s.yimg.com/dy/ads/native.js', () =>
     global.context.renderStart()
   );
diff --git a/ads/zucks.js b/ads/zucks.js
index 0f1f3c154b4da..c5d558461942e 100644
--- a/ads/zucks.js
+++ b/ads/zucks.js
@@ -29,8 +29,7 @@ export function zucks(global, data) {
 
       const d = global.document.createElement('ins');
       d.id = elementId;
-      const container = document.getElementById('c');
-      container.appendChild(d);
+      global.document.getElementById('c').appendChild(d);
 
       if (data['zoeMultiAd'] !== 'true') {
         (global.gZgokZoeQueue = global.gZgokZoeQueue || []).push({frameId});
@@ -42,7 +41,9 @@ export function zucks(global, data) {
       });
     });
   } else if (data['adtype'] === 'native') {
-    loadScript(global, `https://j.zucks.net.zimg.jp/n?f=${data['frameId']}`);
+    const s = global.document.createElement('script');
+    s.src = `https://j.zucks.net.zimg.jp/n?f=${data['frameId']}`;
+    global.document.getElementById('c').appendChild(s);
   } else {
     writeScript(global, `https://j.zucks.net.zimg.jp/j?f=${data['frameId']}`);
   }
diff --git a/babel.config.js b/babel.config.js
index e49b55c83ec00..279389c5e583f 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -29,7 +29,8 @@ const minimist = require('minimist');
 const {isTravisBuild} = require('./build-system/common/travis');
 const argv = minimist(process.argv.slice(2));
 
-const isDist = argv._.includes('dist');
+const isClosureCompiler =
+  argv._.includes('dist') || argv._.includes('check-types');
 const {esm} = argv;
 const noModuleTarget = {
   'browsers': isTravisBuild()
@@ -40,9 +41,9 @@ const noModuleTarget = {
 // eslint-disable-next-line local/no-module-exports
 module.exports = function(api) {
   api.cache(true);
-  // `dist` builds do not use any of the default settings below until its
+  // Closure Compiler builds do not use any of the default settings below until its
   // an esm build. (Both Multipass and Singlepass)
-  if (isDist && !esm) {
+  if (isClosureCompiler && !esm) {
     return {};
   }
   return {
@@ -57,7 +58,7 @@ module.exports = function(api) {
         : [
             '@babel/preset-env',
             {
-              'modules': isDist ? false : 'commonjs',
+              'modules': isClosureCompiler ? false : 'commonjs',
               'loose': true,
               'targets': noModuleTarget,
             },
diff --git a/build-system/.eslintrc b/build-system/.eslintrc
index 02be31348f713..29a41b9f6ec54 100644
--- a/build-system/.eslintrc
+++ b/build-system/.eslintrc
@@ -20,10 +20,12 @@
   },
   "rules": {
     "local/no-array-destructuring": 0,
+    "local/no-destructure-assignment-params": 0,
     "local/no-export-side-effect": 0,
     "local/no-for-of-statement": 0,
     "local/no-has-own-property-method": 0,
     "local/no-module-exports": 0,
+    "local/no-rest": 0,
     "local/no-spread": 0,
     "require-jsdoc": 0
   }
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/index.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/index.js
index c7b88407d5907..c36d286d39397 100644
--- a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/index.js
+++ b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/index.js
@@ -51,10 +51,10 @@ module.exports = function(babel) {
 
   /**
    * @param {!NodePath} path
-   * @param {boolean} assertion
    * @param {string|undefined} type
+   * @param {boolean} assertion
    */
-  function eliminate(path, assertion, type) {
+  function eliminate(path, type, assertion) {
     const argument = path.get('arguments.0');
     if (!argument) {
       if (assertion) {
@@ -94,20 +94,16 @@ module.exports = function(babel) {
       }
     }
 
-    path.replaceWith(t.parenthesizedExpression(arg));
-
     if (type) {
+      path.replaceWith(t.parenthesizedExpression(arg));
       // If it starts with a capital, make the type non-nullable.
       if (/^[A-Z]/.test(type)) {
         type = '!' + type;
       }
       // Add a cast annotation to fix type.
       path.addComment('leading', `* @type {${type}} `);
-    }
-
-    const {parenthesized} = path.node.extra || {};
-    if (parenthesized) {
-      path.replaceWith(t.parenthesizedExpression(path.node));
+    } else if (!assertion) {
+      path.replaceWith(t.parenthesizedExpression(arg));
     }
   }
 
@@ -117,7 +113,7 @@ module.exports = function(babel) {
         const callee = path.get('callee');
 
         if (callee.isIdentifier({name: 'devAssert'})) {
-          return eliminate(path, true, '');
+          return eliminate(path, '', /* assertion */ true);
         }
 
         const isMemberAndCallExpression =
@@ -144,7 +140,11 @@ module.exports = function(babel) {
         }
 
         const method = prop.node.name;
-        eliminate(path, method.startsWith('assert'), typeMap[method]);
+        eliminate(
+          path,
+          typeMap[method],
+          /* assertion */ method.startsWith('assert')
+        );
       },
     },
   };
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-dev-assert/input.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-user-assert/input.js
similarity index 100%
rename from build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-dev-assert/input.js
rename to build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-user-assert/input.js
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-dev-assert/options.json b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-user-assert/options.json
similarity index 100%
rename from build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-dev-assert/options.json
rename to build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-user-assert/options.json
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-dev-assert/output.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-user-assert/output.js
similarity index 100%
rename from build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-dev-assert/output.js
rename to build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-user-assert/output.js
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-userAssert/output.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-userAssert/output.js
index 154ca3b5450b9..683a7e7ebca20 100644
--- a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-userAssert/output.js
+++ b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/no-transform-userAssert/output.js
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 userAssert(1 + 1);
-userAssert((2 + 2));
+userAssert(dev().assert(2 + 2));
 userAssert();
 let result = userAssert(dev(), 'hello', 'world');
 let result2 = userAssert();
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/input.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/input.js
index bb509c0eab99d..a51e7d50922f9 100644
--- a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/input.js
+++ b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/input.js
@@ -15,4 +15,4 @@
  */
 dev().assert(1 + 1);
 dev().assert(dev().assert(2 + 2));
-let result = dev().assert(dev(), 'hello', 'world');
+let result = dev().assert(foo, 'hello', 'world');
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/output.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/output.js
index 6169818473b88..a51e7d50922f9 100644
--- a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/output.js
+++ b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-dev-assert/output.js
@@ -13,6 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(1 + 1);
-((2 + 2));
-let result = (dev());
+dev().assert(1 + 1);
+dev().assert(dev().assert(2 + 2));
+let result = dev().assert(foo, 'hello', 'world');
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/input.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/input.js
index 2a55df63d3370..5b9db4a5faad9 100644
--- a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/input.js
+++ b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/input.js
@@ -15,4 +15,4 @@
  */
 devAssert(1 + 1);
 devAssert(dev().assert(2 + 2));
-let result = devAssert(dev(), 'hello', 'world');
+let result = devAssert(foo, 'hello', 'world');
diff --git a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/output.js b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/output.js
index 83995bbdc16f4..5b9db4a5faad9 100644
--- a/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/output.js
+++ b/build-system/babel-plugins/babel-plugin-transform-amp-asserts/test/fixtures/transform-assertions/transform-devAssert/output.js
@@ -13,6 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(1 + 1);
-((2 + 2));
-let result = (dev());
+devAssert(1 + 1);
+devAssert(dev().assert(2 + 2));
+let result = devAssert(foo, 'hello', 'world');
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/index.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/index.js
new file mode 100644
index 0000000000000..1eed40daea5e5
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/index.js
@@ -0,0 +1,89 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+module.exports = function(babel) {
+  const {types: t} = babel;
+
+  function cloneDeepWithoutLoc(node) {
+    const str = JSON.stringify(node);
+    return JSON.parse(str, (key, value) => {
+      return key === 'loc' ? undefined : value;
+    });
+  }
+
+  function declarator(path, parentPath) {
+    const init = parentPath.get('init');
+    let from = init.node;
+    if (!init.isPure()) {
+      from = path.scope.generateUidIdentifierBasedOnNode(init.node);
+      parentPath.insertBefore(
+        t.variableDeclarator(from, cloneDeepWithoutLoc(init.node))
+      );
+    }
+
+    const properties = path.get('properties');
+    for (const prop of properties) {
+      const {key, value, computed} = prop.node;
+      const member = t.memberExpression(
+        t.cloneWithoutLoc(from),
+        key,
+        computed || !t.isIdentifier(key)
+      );
+      let expression = member;
+      let newValue = value;
+      if (t.isAssignmentPattern(value)) {
+        newValue = t.identifier(value.left.name);
+        expression = t.conditionalExpression(
+          t.binaryExpression('===', member, path.scope.buildUndefinedNode()),
+          value.right,
+          member
+        );
+      }
+      const declarator = t.variableDeclarator(newValue, expression);
+      parentPath.insertBefore(declarator);
+    }
+    // NOTE: this is a hack to remove the original path as `parentPath.remove()` causes
+    // an unexplained error.
+    path.replaceWith(path.scope.generateUidIdentifier('foo'));
+    // We try to eliminate any side effects since the original
+    // initializer might have had some (method call, etc.);
+    parentPath.get('init').replaceWith(path.scope.buildUndefinedNode());
+  }
+
+  return {
+    name: 'simple-object-destructure',
+
+    pre() {
+      this.file.opts.generatorOpts.retainLines = true;
+    },
+
+    visitor: {
+      ObjectPattern(path) {
+        // NOTE: We don't transform destructure operation in params as this causes
+        // type parameter mismatch errors.
+
+        const {parentPath} = path;
+        if (parentPath.isObjectProperty()) {
+          throw path.buildCodeFrameError('encountered deep object destructure');
+        }
+
+        if (parentPath.isVariableDeclarator()) {
+          return declarator(path, parentPath);
+        }
+      },
+    },
+  };
+};
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/input.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/input.js
new file mode 100644
index 0000000000000..113c5892f9e5a
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/input.js
@@ -0,0 +1,17 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const [a, ...b] = [1, 2, 3, 4, 5];
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/options.json b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/options.json
new file mode 100644
index 0000000000000..800c09891c3d8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/options.json
@@ -0,0 +1,3 @@
+{
+  "plugins": ["../../../../../babel-plugin-transform-simple-object-destructure"]
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/output.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/output.js
new file mode 100644
index 0000000000000..113c5892f9e5a
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/array-destructure/output.js
@@ -0,0 +1,17 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const [a, ...b] = [1, 2, 3, 4, 5];
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/input.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/input.js
new file mode 100644
index 0000000000000..213f1662ecda4
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/input.js
@@ -0,0 +1,22 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function func({head}) {
+  console.log(head);
+}
+
+func(document);
+func({head: document.head});
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/options.json b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/options.json
new file mode 100644
index 0000000000000..800c09891c3d8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/options.json
@@ -0,0 +1,3 @@
+{
+  "plugins": ["../../../../../babel-plugin-transform-simple-object-destructure"]
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/output.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/output.js
new file mode 100644
index 0000000000000..3f469ece3bb61
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/no-transform/param-destructure/output.js
@@ -0,0 +1,22 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function func({ head }) {
+  console.log(head);
+}
+
+func(document);
+func({ head: document.head });
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/input.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/input.js
new file mode 100644
index 0000000000000..a607dd25a570c
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/input.js
@@ -0,0 +1,23 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function func() {
+  const {
+    [axisName]: value,
+    [axisName + 'Min']: min = 0,
+    [axisName + 'Max']: max = Math.PI * 2,
+  } = args;
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/options.json b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/options.json
new file mode 100644
index 0000000000000..800c09891c3d8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/options.json
@@ -0,0 +1,3 @@
+{
+  "plugins": ["../../../../../babel-plugin-transform-simple-object-destructure"]
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/output.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/output.js
new file mode 100644
index 0000000000000..b09cc03f58350
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/computed-keys/output.js
@@ -0,0 +1,23 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function func() {
+  const _args = args,
+  value = _args[axisName],min = _args[
+  axisName + 'Min'] === void 0 ? 0 : _args[axisName + 'Min'],max = _args[
+  axisName + 'Max'] === void 0 ? Math.PI * 2 : _args[axisName + 'Max'],_foo = void 0;
+
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/input.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/input.js
new file mode 100644
index 0000000000000..c2e3cd310f28a
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/input.js
@@ -0,0 +1,19 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function func() {
+  let {x = 5, y, z = document.head} = get();
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/options.json b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/options.json
new file mode 100644
index 0000000000000..800c09891c3d8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/options.json
@@ -0,0 +1,3 @@
+{
+  "plugins": ["../../../../../babel-plugin-transform-simple-object-destructure"]
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/output.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/output.js
new file mode 100644
index 0000000000000..648f97e9d8eb8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/default-values/output.js
@@ -0,0 +1,19 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function func() {
+  let _get = get(),x = _get.x === void 0 ? 5 : _get.x,y = _get.y,z = _get.z === void 0 ? document.head : _get.z,_foo = void 0;
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/input.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/input.js
new file mode 100644
index 0000000000000..a7ba33f2ea206
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/input.js
@@ -0,0 +1,27 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function string() {
+  const obj = {};
+  let {'foo': bar} = obj;
+  let {'foo': baz} = get();
+}
+
+function number() {
+  const obj = {};
+  let {0: bar} = obj;
+  let {0: baz} = get();
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/options.json b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/options.json
new file mode 100644
index 0000000000000..800c09891c3d8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/options.json
@@ -0,0 +1,3 @@
+{
+  "plugins": ["../../../../../babel-plugin-transform-simple-object-destructure"]
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/output.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/output.js
new file mode 100644
index 0000000000000..92c8bf5835a29
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/non-identifier-keys/output.js
@@ -0,0 +1,27 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+function string() {
+  const obj = {};
+  let bar = obj['foo'],_foo = void 0;
+  let _get = get(),baz = _get['foo'],_foo2 = void 0;
+}
+
+function number() {
+  const obj = {};
+  let bar = obj[0],_foo3 = void 0;
+  let _get2 = get(),baz = _get2[0],_foo4 = void 0;
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/input.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/input.js
new file mode 100644
index 0000000000000..86f794d5f0274
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/input.js
@@ -0,0 +1,36 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const {head: h, body: b} = document;
+
+const {x: myX} = get();
+
+function func() {
+  const {head: h, body: b} = document;
+  let {x: myX, y: myY, z: myZ} = get();
+  myX = 3;
+  myY = 4;
+  myZ = 5;
+  console.log(document);
+  console.log(h);
+  console.log(b);
+  console.log(myX + myY + myZ);
+}
+
+console.log(document);
+console.log(h);
+console.log(b);
+console.log(myX);
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/options.json b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/options.json
new file mode 100644
index 0000000000000..800c09891c3d8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/options.json
@@ -0,0 +1,3 @@
+{
+  "plugins": ["../../../../../babel-plugin-transform-simple-object-destructure"]
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/output.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/output.js
new file mode 100644
index 0000000000000..2ec1244fde4e8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations-rename/output.js
@@ -0,0 +1,36 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const _document = document,h = _document.head,b = _document.body,_foo = void 0;
+
+const _get = get(),myX = _get.x,_foo2 = void 0;
+
+function func() {
+  const _document2 = document,h = _document2.head,b = _document2.body,_foo3 = void 0;
+  let _get2 = get(),myX = _get2.x,myY = _get2.y,myZ = _get2.z,_foo4 = void 0;
+  myX = 3;
+  myY = 4;
+  myZ = 5;
+  console.log(document);
+  console.log(h);
+  console.log(b);
+  console.log(myX + myY + myZ);
+}
+
+console.log(document);
+console.log(h);
+console.log(b);
+console.log(myX);
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/input.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/input.js
new file mode 100644
index 0000000000000..2b31839ad13a4
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/input.js
@@ -0,0 +1,36 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const {head, body} = document;
+
+const {x} = get();
+
+function func() {
+  const {head, body} = document;
+  let {x, y, z} = get();
+  x = 3;
+  y = 4;
+  z = 5;
+  console.log(document);
+  console.log(head);
+  console.log(body);
+  console.log(x + y + z);
+}
+
+console.log(document);
+console.log(head);
+console.log(body);
+console.log(x);
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/options.json b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/options.json
new file mode 100644
index 0000000000000..800c09891c3d8
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/options.json
@@ -0,0 +1,3 @@
+{
+  "plugins": ["../../../../../babel-plugin-transform-simple-object-destructure"]
+}
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/output.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/output.js
new file mode 100644
index 0000000000000..49d5d568bf8d9
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/fixtures/transform/variable-declarations/output.js
@@ -0,0 +1,36 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const _document = document,head = _document.head,body = _document.body,_foo = void 0;
+
+const _get = get(),x = _get.x,_foo2 = void 0;
+
+function func() {
+  const _document2 = document,head = _document2.head,body = _document2.body,_foo3 = void 0;
+  let _get2 = get(),x = _get2.x,y = _get2.y,z = _get2.z,_foo4 = void 0;
+  x = 3;
+  y = 4;
+  z = 5;
+  console.log(document);
+  console.log(head);
+  console.log(body);
+  console.log(x + y + z);
+}
+
+console.log(document);
+console.log(head);
+console.log(body);
+console.log(x);
diff --git a/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/index.js b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/index.js
new file mode 100644
index 0000000000000..44564fa07fec0
--- /dev/null
+++ b/build-system/babel-plugins/babel-plugin-transform-simple-object-destructure/test/index.js
@@ -0,0 +1,19 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const runner = require('@babel/helper-plugin-test-runner').default;
+
+runner(__dirname);
diff --git a/build-system/common/exec.js b/build-system/common/exec.js
index 025fbd5d5a615..94c3b43e6cb9f 100644
--- a/build-system/common/exec.js
+++ b/build-system/common/exec.js
@@ -31,7 +31,7 @@ const shellCmd = process.platform == 'win32' ? 'cmd' : '/bin/bash';
  * @return {!Object}
  */
 function spawnProcess(cmd, options) {
-  return childProcess.spawnSync(cmd, Object.assign({shell: shellCmd}, options));
+  return childProcess.spawnSync(cmd, {shell: shellCmd, ...options});
 }
 
 /**
@@ -55,7 +55,7 @@ function exec(cmd, options) {
  * @return {!Object}
  */
 function execScriptAsync(script, options) {
-  return childProcess.spawn(script, Object.assign({shell: shellCmd}, options));
+  return childProcess.spawn(script, {shell: shellCmd, ...options});
 }
 
 /**
diff --git a/build-system/compile/build.conf.js b/build-system/compile/build.conf.js
index 3dbc157c30135..a260f4db65ba2 100644
--- a/build-system/compile/build.conf.js
+++ b/build-system/compile/build.conf.js
@@ -27,7 +27,6 @@ const defaultPlugins = [
   localPlugin('transform-amp-extension-call'),
   localPlugin('transform-html-template'),
   localPlugin('transform-version-call'),
-  getJsonConfigurationPlugin(),
   getReplacePlugin(),
 ];
 
@@ -91,17 +90,19 @@ function getReplacePlugin() {
     }
   });
 
-  // default each backup experiment constant to false as well
-  Object.keys(experimentsConstantBackup).forEach(experimentDefine => {
+  // default each backup experiment constant to the customized value
+  for (const [experimentDefine, value] of Object.entries(
+    experimentsConstantBackup
+  )) {
     function flagExists(element) {
       return element['identifierName'] === experimentDefine;
     }
 
     // only add default replacement if it already doesn't exist in array
     if (experimentDefine && !replacements.some(flagExists)) {
-      replacements.push(createReplacement(experimentDefine, false));
+      replacements.push(createReplacement(experimentDefine, !!value));
     }
-  });
+  }
 
   return ['minify-replace', {replacements}];
 }
@@ -119,7 +120,7 @@ function getJsonConfigurationPlugin() {
  * @param {!Object<string, boolean>} buildFlags
  * @return {!Array<string|!Array<string|!Object>>}
  */
-function plugins({isEsmBuild, isForTesting, isSinglePass}) {
+function plugins({isEsmBuild, isForTesting, isSinglePass, isChecktypes}) {
   const applied = [...defaultPlugins];
   // TODO(erwinm): This is temporary until we remove the assert/log removals
   // from the java transformation to the babel transformation.
@@ -134,7 +135,14 @@ function plugins({isEsmBuild, isForTesting, isSinglePass}) {
   if (isEsmBuild) {
     applied.push(['filter-imports', {imports: esmRemovedImports}]);
   }
-  if (!isForTesting) {
+  if (isChecktypes) {
+    applied.push(localPlugin('transform-simple-object-destructure'));
+  } else {
+    // This triggers some conformance errors such as `use tryParseJson` during
+    // type check phase so we omit it from the default plugins.
+    applied.push(getJsonConfigurationPlugin());
+  }
+  if (!(isForTesting || isChecktypes)) {
     applied.push(
       localPlugin('amp-mode-transformer'),
       localPlugin('is_dev-constant-transformer')
diff --git a/build-system/compile/bundles.config.js b/build-system/compile/bundles.config.js
index 5bf6105787067..1eb94f4275906 100644
--- a/build-system/compile/bundles.config.js
+++ b/build-system/compile/bundles.config.js
@@ -489,7 +489,7 @@ exports.extensionBundles = [
   },
   {
     name: 'amp-date-display',
-    version: '0.1',
+    version: ['0.1', '0.2'],
     latestVersion: '0.1',
     type: TYPES.MISC,
   },
@@ -637,6 +637,20 @@ exports.extensionBundles = [
     latestVersion: '0.1',
     type: TYPES.MEDIA,
   },
+  {
+    name: 'amp-inline-gallery',
+    version: '0.1',
+    latestVersion: '0.1',
+    options: {
+      hasCss: true,
+      cssBinaries: [
+        'amp-inline-gallery',
+        'amp-inline-gallery-pagination',
+        'amp-inline-gallery-thumbnails',
+      ],
+    },
+    type: TYPES.MISC,
+  },
   {
     name: 'amp-inputmask',
     version: '0.1',
@@ -739,7 +753,7 @@ exports.extensionBundles = [
   },
   {
     name: 'amp-next-page',
-    version: '0.1',
+    version: ['0.1', '1.0'],
     latestVersion: '0.1',
     options: {hasCss: true},
     type: TYPES.MISC,
@@ -782,6 +796,12 @@ exports.extensionBundles = [
     latestVersion: '0.1',
     type: TYPES.MEDIA,
   },
+  {
+    name: 'amp-redbull-player',
+    version: '0.1',
+    latestVersion: '0.1',
+    type: TYPES.MEDIA,
+  },
   {
     name: 'amp-reddit',
     version: '0.1',
@@ -879,16 +899,17 @@ exports.extensionBundles = [
       hasCss: true,
       cssBinaries: [
         'amp-story-bookend',
-        'amp-story-tooltip',
         'amp-story-consent',
         'amp-story-draggable-drawer-header',
         'amp-story-hint',
-        'amp-story-unsupported-browser-layer',
-        'amp-story-viewport-warning-layer',
         'amp-story-info-dialog',
+        'amp-story-quiz',
         'amp-story-share',
         'amp-story-share-menu',
         'amp-story-system-layer',
+        'amp-story-tooltip',
+        'amp-story-unsupported-browser-layer',
+        'amp-story-viewport-warning-layer',
       ],
     },
     type: TYPES.MISC,
diff --git a/build-system/compile/check-for-unknown-deps.js b/build-system/compile/check-for-unknown-deps.js
index b46b5422b7aa7..3f2e743d1a574 100644
--- a/build-system/compile/check-for-unknown-deps.js
+++ b/build-system/compile/check-for-unknown-deps.js
@@ -17,7 +17,7 @@
 
 const log = require('fancy-log');
 const through = require('through2');
-const {red, cyan} = require('ansi-colors');
+const {red, cyan, yellow} = require('ansi-colors');
 
 /**
  * Searches for the identifier "$$module$", which Closure uses to uniquely
@@ -44,6 +44,7 @@ exports.checkForUnknownDeps = function() {
       red('Error:'),
       `Unknown dependency ${cyan(match[0])} found in ${cyan(file.relative)}`
     );
+    log(yellow(contents));
     const err = new Error('Compilation failed due to unknown dependency');
     err.showStack = false;
     cb(err, file);
diff --git a/build-system/compile/compile.js b/build-system/compile/compile.js
index 146273bec8542..8beafb5cb516b 100644
--- a/build-system/compile/compile.js
+++ b/build-system/compile/compile.js
@@ -139,6 +139,7 @@ function compile(
     'third_party/web-animations-externs/web_animations.js',
     'third_party/moment/moment.extern.js',
     'third_party/react-externs/externs.js',
+    'build-system/externs/preact.extern.js',
   ];
   const define = [`VERSION=${internalRuntimeVersion}`];
   if (argv.pseudo_names) {
@@ -270,9 +271,9 @@ function compile(
       compilation_level: options.compilationLevel || 'SIMPLE_OPTIMIZATIONS',
       // Turns on more optimizations.
       assume_function_wrapper: true,
-      // Transpile from ES6 to ES5 if not running with `--esm`
-      // otherwise transpilation is done by Babel
-      language_in: argv.esm ? 'ECMASCRIPT_2017' : 'ECMASCRIPT6',
+      language_in: 'ECMASCRIPT_2018',
+      // Do not transpile down to ES5 if running with `--esm`, since we do
+      // limited transpilation in Babel.
       language_out: argv.esm ? 'NO_TRANSPILE' : 'ECMASCRIPT5',
       // We do not use the polyfills provided by closure compiler.
       // If you need a polyfill. Manually include them in the
@@ -288,6 +289,7 @@ function compile(
       ],
       entry_point: entryModuleFilenames,
       module_resolution: 'NODE',
+      package_json_entry_names: 'module,main',
       process_common_js_modules: true,
       // This strips all files from the input set that aren't explicitly
       // required.
@@ -323,17 +325,14 @@ function compile(
       // it won't do strict type checking if its whitespace only.
       compilerOptions.define.push('TYPECHECK_ONLY=true');
       compilerOptions.jscomp_error.push(
+        'accessControls',
         'conformanceViolations',
         'checkTypes',
         'const',
         'constantProperty',
         'globalThis'
       );
-      compilerOptions.jscomp_off.push(
-        'accessControls',
-        'moduleLoad',
-        'unknownDefines'
-      );
+      compilerOptions.jscomp_off.push('moduleLoad', 'unknownDefines');
       compilerOptions.conformance_configs =
         'build-system/test-configs/conformance-config.textproto';
     } else {
@@ -345,7 +344,7 @@ function compile(
       delete compilerOptions.define;
     }
 
-    if (!argv.single_pass && !options.typeCheckOnly) {
+    if (!argv.single_pass) {
       compilerOptions.js_module_root.push(SRC_TEMP_DIR);
     }
 
@@ -365,9 +364,13 @@ function compile(
       }
     });
 
+    const gulpSrcs = !argv.single_pass ? convertPathsToTmpRoot(srcs) : srcs;
+    const gulpBase = !argv.single_pass ? SRC_TEMP_DIR : '.';
+
     if (options.typeCheckOnly) {
       return gulp
-        .src(srcs, {base: '.'})
+        .src(gulpSrcs, {base: gulpBase})
+        .pipe(sourcemaps.init({loadMaps: true}))
         .pipe(gulpClosureCompile(compilerOptionsArray, checkTypesNailgunPort))
         .on('error', err => {
           handleTypeCheckError();
@@ -376,8 +379,6 @@ function compile(
         .pipe(nop())
         .on('end', resolve);
     } else {
-      const gulpSrcs = argv.single_pass ? srcs : convertPathsToTmpRoot(srcs);
-      const gulpBase = argv.single_pass ? '.' : SRC_TEMP_DIR;
       timeInfo.startTime = Date.now();
       return gulp
         .src(gulpSrcs, {base: gulpBase})
diff --git a/build-system/compile/single-pass.js b/build-system/compile/single-pass.js
index d08b830d2ddca..72f942d4f727b 100644
--- a/build-system/compile/single-pass.js
+++ b/build-system/compile/single-pass.js
@@ -28,8 +28,7 @@ const log = require('fancy-log');
 const MagicString = require('magic-string');
 const minimist = require('minimist');
 const path = require('path');
-const Promise = require('bluebird');
-const relativePath = require('path').relative;
+const pkgUp = require('pkg-up');
 const rename = require('gulp-rename');
 const resorcery = require('@jridgewell/resorcery');
 const sourcemaps = require('gulp-sourcemaps');
@@ -112,12 +111,13 @@ exports.getFlags = function(config) {
     // accessing the symbol, we remedy this by attaching all public exports
     // to `_` and everything imported across modules is is accessed through `_`.
     rename_prefix_namespace: '_',
-    language_in: config.esm ? 'ECMASCRIPT_2017' : 'ECMASCRIPT6',
+    language_in: 'ECMASCRIPT_2018',
     language_out: config.esm
       ? 'NO_TRANSPILE'
       : config.language_out || 'ECMASCRIPT5',
     chunk_output_path_prefix: config.writeTo || 'out/',
     module_resolution: 'NODE',
+    package_json_entry_names: 'module,main',
     process_common_js_modules: true,
     externs: config.externs,
     define: config.define,
@@ -165,7 +165,11 @@ exports.getBundleFlags = function(g) {
   Object.keys(g.packages)
     .sort()
     .forEach(function(pkg) {
-      srcs.push(pkg);
+      g.bundles[mainBundle].modules.push(pkg);
+      fs.outputFileSync(
+        `${g.tmp}/${pkg}`,
+        JSON.stringify(JSON.parse(readFile(pkg)), null, 4)
+      );
     });
 
   // Build up the weird flag structure that closure compiler calls
@@ -264,7 +268,6 @@ exports.getBundleFlags = function(g) {
       throw new Error('Expect to build more than one bundle.');
     }
   });
-  flagsArray.push('--js_module_root', `${g.tmp}/node_modules/`);
   flagsArray.push('--js_module_root', `${g.tmp}/`);
   return flagsArray;
 };
@@ -315,6 +318,7 @@ exports.getGraph = function(entryModules, config) {
     deps: true,
     detectGlobals: false,
     fast: true,
+    browserField: 'module',
   })
     // The second stage are transforms that closure compiler supports
     // directly and which we don't want to apply during deps finding.
@@ -343,14 +347,21 @@ exports.getGraph = function(entryModules, config) {
         })
         .forEach(function(row) {
           const id = unifyPath(
-            exports.maybeAddDotJs(relativePath(process.cwd(), row.id))
+            exports.maybeAddDotJs(path.relative(process.cwd(), row.id))
           );
           topo.addNode(id, id);
-          const deps = (edges[id] = Object.keys(row.deps)
+          const deps = Object.keys(row.deps)
             .sort()
-            .map(function(dep) {
-              return unifyPath(relativePath(process.cwd(), row.deps[dep]));
-            }));
+            .map(dep => {
+              dep = unifyPath(path.relative(process.cwd(), row.deps[dep]));
+              if (dep.startsWith('node_modules/')) {
+                const pkgJson = pkgUp.sync({cwd: path.dirname(dep)});
+                const jsonId = unifyPath(path.relative(process.cwd(), pkgJson));
+                graph.packages[jsonId] = true;
+              }
+              return dep;
+            });
+          edges[id] = deps;
           graph.deps[id] = deps;
           if (row.entry) {
             graph.depOf[id] = {};
diff --git a/build-system/compile/sources.js b/build-system/compile/sources.js
index d9ebaf3559051..cc9f758f18910 100644
--- a/build-system/compile/sources.js
+++ b/build-system/compile/sources.js
@@ -39,12 +39,22 @@ const COMMON_GLOBS = [
   'third_party/timeagojs/**/*.js',
   'third_party/vega/**/*.js',
   'third_party/webcomponentsjs/ShadowCSS.js',
+  'node_modules/dompurify/package.json',
   'node_modules/dompurify/dist/purify.es.js',
+  'node_modules/promise-pjs/package.json',
   'node_modules/promise-pjs/promise.mjs',
+  'node_modules/web-animations-js/package.json',
   'node_modules/web-animations-js/web-animations.install.js',
+  'node_modules/web-activities/package.json',
   'node_modules/web-activities/activity-ports.js',
+  'node_modules/@ampproject/animations/package.json',
   'node_modules/@ampproject/animations/dist/animations.mjs',
+  'node_modules/@ampproject/worker-dom/package.json',
   'node_modules/@ampproject/worker-dom/dist/amp/main.mjs',
+  'node_modules/preact/package.json',
+  'node_modules/preact/dist/*.js',
+  'node_modules/preact/hooks/package.json',
+  'node_modules/preact/hooks/dist/*.js',
 ];
 
 /**
@@ -115,8 +125,6 @@ const CLOSURE_SRC_GLOBS = [
   'extensions/amp-geo/**/*.js',
   // Needed for AmpViewerAssistanceService
   'extensions/amp-viewer-assistance/**/*.js',
-  // Needed for AmpViewerIntegrationVariableService
-  'extensions/amp-viewer-integration/**/*.js',
   // Needed for amp-smartlinks dep on amp-skimlinks
   'extensions/amp-skimlinks/0.1/**/*.js',
   'src/*.js',
diff --git a/build-system/eslint-rules/no-destructure-assignment-params.js b/build-system/eslint-rules/no-destructure-assignment-params.js
new file mode 100644
index 0000000000000..4b2101faadc73
--- /dev/null
+++ b/build-system/eslint-rules/no-destructure-assignment-params.js
@@ -0,0 +1,29 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+module.exports = function(context) {
+  return {
+    [':function > ObjectPattern']: function(node) {
+      context.report({
+        node,
+        message:
+          'Do not use Object Destructuring Assignment in parameters. ' +
+          'We will allow it once https://github.com/google/' +
+          'closure-compiler/issues/3500 is resolved.',
+      });
+    },
+  };
+};
diff --git a/build-system/eslint-rules/no-import.js b/build-system/eslint-rules/no-import.js
index e694330aaa8df..daf26d4640bd9 100644
--- a/build-system/eslint-rules/no-import.js
+++ b/build-system/eslint-rules/no-import.js
@@ -14,19 +14,41 @@
  * limitations under the License.
  */
 'use strict';
-const imports = ['sinon'];
+
+const imports = [
+  {import: 'sinon', message: 'Importing sinon is forbidden'},
+  {
+    import: 'preact',
+    message:
+      "Please import preact from 'src/preact'. This gives us type safety.",
+  },
+  {
+    import: 'preact/hooks',
+    message:
+      "Please import preact/hooks from 'src/preact'. This gives us type safety.",
+  },
+];
+
 module.exports = function(context) {
   return {
     ImportDeclaration(node) {
-      const comments = context.getCommentsBefore(node);
+      const comments = context.getCommentsBefore(node.source);
       const ok = comments.some(comment => comment.value === 'OK');
       if (ok) {
         return;
       }
 
       const name = node.source.value;
-      if (imports.includes(name)) {
-        context.report({node, message: `Importing ${name} is forbidden.`});
+
+      for (const forbidden of imports) {
+        if (name !== forbidden.import) {
+          continue;
+        }
+
+        context.report({
+          node,
+          message: forbidden.message,
+        });
       }
     },
   };
diff --git a/build-system/eslint-rules/no-rest.js b/build-system/eslint-rules/no-rest.js
new file mode 100644
index 0000000000000..5da171b23043c
--- /dev/null
+++ b/build-system/eslint-rules/no-rest.js
@@ -0,0 +1,47 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+'use strict';
+
+// Forbids use of Rest elements when they require an iterator polyfill, or
+// there's no clear benefit.
+//
+// Good:
+// ```
+// function foo(...args) {}
+// ```
+//
+// Bad:
+// ```
+// const [...rest] = [1, 2, 3];
+// const {...rest} = {foo: 1};
+// ```
+module.exports = function(context) {
+  return {
+    'ArrayPattern > RestElement': function(node) {
+      context.report({
+        node,
+        message: 'Collecting elements using a rest element is not allowed.',
+      });
+    },
+
+    'ObjectPattern > RestElement, ExperimentalRestProperty': function(node) {
+      context.report({
+        node,
+        message: 'Collecting props using a rest property is not allowed.',
+      });
+    },
+  };
+};
diff --git a/build-system/eslint-rules/no-spread.js b/build-system/eslint-rules/no-spread.js
index d0e672d722652..f67f36f600d18 100644
--- a/build-system/eslint-rules/no-spread.js
+++ b/build-system/eslint-rules/no-spread.js
@@ -15,10 +15,26 @@
  */
 'use strict';
 
+// Forbids use of Spread elements when they require an iterator polyfill
+//
+// Good:
+// ```
+// const obj = {foo: 1, ...obj};
+// ```
+//
+// Bad:
+// ```
+// const args = [1, 2, 3, ...array];
+// bar(...args);
+// ```
 module.exports = function(context) {
   return {
-    SpreadElement: function(node) {
-      context.report({node, message: 'No spread element allowed.'});
+    'ArrayExpression > SpreadElement': function(node) {
+      context.report({node, message: 'Iterator spreading is not allowed.'});
+    },
+
+    'CallExpression > SpreadElement': function(node) {
+      context.report({node, message: 'Iterator spreading is not allowed.'});
     },
   };
 };
diff --git a/build-system/eslint-rules/prefer-spread-props.js b/build-system/eslint-rules/prefer-spread-props.js
new file mode 100644
index 0000000000000..d83753179eec6
--- /dev/null
+++ b/build-system/eslint-rules/prefer-spread-props.js
@@ -0,0 +1,72 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+'use strict';
+
+// This warns when using Object.assign where an object spread is better. Note
+// that using Object.assign to mutate an already existing object is still
+// allowed.
+//
+// Good:
+// ```
+// const foo = {...obj};
+// const bar = {foo: 1, ...obj};
+// const baz = Object.assign(someObject, obj);
+// ```
+//
+// Bad:
+// ```
+// const foo = Object.assign({}, obj);
+// const bar = Object.assign({foo: 1}, obj);
+// ```
+module.exports = {
+  meta: {
+    fixable: 'code',
+  },
+
+  create(context) {
+    const sourceCode = context.getSourceCode();
+
+    return {
+      'CallExpression[callee.object.name="Object"][callee.property.name="assign"]': function(
+        node
+      ) {
+        const args = node.arguments;
+        if (args.length <= 1) {
+          return;
+        }
+
+        const first = args[0];
+        if (first.type !== 'ObjectExpression') {
+          return;
+        }
+
+        context.report({
+          node,
+          message: 'Prefer using object literals with spread property syntax',
+
+          fix(fixer) {
+            const texts = args.map(arg => `...${sourceCode.getText(arg)}`);
+            if (first.properties.length === 0) {
+              texts.shift();
+            }
+
+            return fixer.replaceText(node, `({${texts.join(',')}})`);
+          },
+        });
+      },
+    };
+  },
+};
diff --git a/build-system/eslint-rules/prefer-unnested-spread-objects.js b/build-system/eslint-rules/prefer-unnested-spread-objects.js
new file mode 100644
index 0000000000000..b073a6511ffd1
--- /dev/null
+++ b/build-system/eslint-rules/prefer-unnested-spread-objects.js
@@ -0,0 +1,88 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+'use strict';
+
+// Disallows using an object spread on an inline object expression. Instead,
+// the object expression's properties should be hoisted out inline with the
+// rest of the outer object.
+//
+// Good:
+// ```
+// const foo = {
+//   foo: 1,
+//   ...bar,
+//   baz: 2
+// };
+// ```
+//
+// Bad:
+// ```
+// const foo = {
+//   ...{
+//     foo: 1,
+//   },
+//   ...bar,
+//   ...{
+//     baz: 2
+//   },
+// };
+// ```
+module.exports = {
+  meta: {
+    fixable: 'code',
+  },
+
+  create(context) {
+    const sourceCode = context.getSourceCode();
+    const spreadElement =
+      ':matches(ObjectExpression > ExperimentalSpreadProperty, ObjectExpression > SpreadElement)';
+
+    function findAfter(array, item) {
+      const index = array.indexOf(item);
+      return index < array.length - 1 ? array[index + 1] : null;
+    }
+
+    return {
+      [`${spreadElement} > ObjectExpression`](node) {
+        context.report({
+          node,
+          message: 'Nesting an object under an object spread is not useful',
+
+          fix(fixer) {
+            const {properties, parent} = node;
+            const texts = properties.map(prop => sourceCode.getText(prop));
+
+            if (texts.length > 0) {
+              return fixer.replaceText(node.parent, texts.join(','));
+            }
+
+            const grandParent = parent.parent;
+            const next = findAfter(grandParent.properties, parent);
+
+            if (next) {
+              return fixer.removeRange([parent.range[0], next.range[0] - 1]);
+            }
+
+            return fixer.removeRange([
+              parent.range[0],
+              grandParent.range[1] - 1,
+            ]);
+          },
+        });
+      },
+    };
+  },
+};
diff --git a/build-system/externs/amp.extern.js b/build-system/externs/amp.extern.js
index d15f251fa9b10..7bb93d80c53d0 100644
--- a/build-system/externs/amp.extern.js
+++ b/build-system/externs/amp.extern.js
@@ -56,7 +56,7 @@ var FormDataWrapperInterface = function() {};
 FormDataWrapperInterface.prototype.entries = function() {};
 FormDataWrapperInterface.prototype.getFormData = function() {};
 
-FormData.prototype.entries = function () {};
+FormData.prototype.entries = function() {};
 
 /**
  * A type for Objects that can be JSON serialized or that come from
@@ -111,7 +111,6 @@ ExtensionPayload.prototype.v;
 /** @type {!Array<string>|string|undefined} */
 ExtensionPayload.prototype.i;
 
-
 /**
  * @typedef {?JsonObject|undefined|string|number|!Array<JsonValue>}
  */
@@ -121,7 +120,7 @@ var JsonValue;
  * @constructor
  * @dict
  */
-function VideoAnalyticsDetailsDef() {};
+function VideoAnalyticsDetailsDef() {}
 /** @type {boolean} */
 VideoAnalyticsDetailsDef.prototype.autoplay;
 /** @type {number} */
@@ -143,7 +142,6 @@ VideoAnalyticsDetailsDef.prototype.state;
 /** @type {number} */
 VideoAnalyticsDetailsDef.prototype.width;
 
-
 // Node.js global
 var process = {};
 process.env;
@@ -164,7 +162,7 @@ window.context.experimentToggles;
 window.context.master;
 window.context.isMaster;
 window.context.ampcontextVersion;
-window.context.ampcontextFilepath
+window.context.ampcontextFilepath;
 window.context.canary;
 window.context.canonicalUrl;
 window.context.consentSharedData;
@@ -256,6 +254,8 @@ AmpConfigType.prototype.runtime;
 AmpConfigType.prototype.test;
 /* @public {string|undefined} */
 AmpConfigType.prototype.spt;
+/* @public {boolean|undefined} */
+AmpConfigType.prototype.esm;
 
 /** @type {!AmpConfigType}  */
 window.AMP_CONFIG;
@@ -354,15 +354,15 @@ ReactDatesConstants.HORIZONTAL_ORIENTATION;
 var Inputmask = class {};
 
 /** @param {!Object} unusedOpts */
-Inputmask.extendAliases = function (unusedOpts) {};
+Inputmask.extendAliases = function(unusedOpts) {};
 
 /** @param {!Object} unusedOpts */
-Inputmask.extendDefaults = function (unusedOpts) {};
+Inputmask.extendDefaults = function(unusedOpts) {};
 
 /** @param {!Element} unusedElement */
-Inputmask.prototype.mask = function (unusedElement) {};
+Inputmask.prototype.mask = function(unusedElement) {};
 
-Inputmask.prototype.remove = function () {};
+Inputmask.prototype.remove = function() {};
 
 /** @dict */
 window.AMP.dependencies = {};
@@ -380,7 +380,7 @@ IntersectionObserverEntry.prototype.rootBounds;
 // TODO (remove after we update closure compiler externs)
 window.PerformancePaintTiming;
 window.PerformanceObserver;
-Object.prototype.entryTypes
+Object.prototype.entryTypes;
 
 /** @typedef {number}  */
 var time;
@@ -391,7 +391,6 @@ var time;
  */
 var UnlistenDef;
 
-
 /**
  * Just an element, but used with AMP custom elements..
  * @typedef {!Element}
@@ -410,27 +409,27 @@ AmpElement.prototype.elementName = function() {};
 
 var Signals = class {};
 /**
-  * @param {string} unusedName
-  * @return {number|!Error|null}
-  */
+ * @param {string} unusedName
+ * @return {number|!Error|null}
+ */
 Signals.prototype.get = function(unusedName) {};
 
 /**
-  * @param {string} unusedName
-  * @return {!Promise<time>}
-  */
+ * @param {string} unusedName
+ * @return {!Promise<time>}
+ */
 Signals.prototype.whenSignal = function(unusedName) {};
 
 /**
-  * @param {string} unusedName
-  * @param {time=} unusedOpt_time
-  */
+ * @param {string} unusedName
+ * @param {time=} unusedOpt_time
+ */
 Signals.prototype.signal = function(unusedName, unusedOpt_time) {};
 
 /**
-  * @param {string} unusedName
-  * @param {!Error} unusedError
-  */
+ * @param {string} unusedName
+ * @param {!Error} unusedError
+ */
 Signals.prototype.rejectSignal = function(unusedName, unusedError) {};
 
 /** @param {string} unusedName */
@@ -527,7 +526,7 @@ grecaptcha.execute;
 // Validator
 var amp;
 amp.validator;
-amp.validator.validateUrlAndLog = function(string, doc) {}
+amp.validator.validateUrlAndLog = function(string, doc) {};
 
 // Temporary Access types (delete when amp-access is compiled
 // for type checking).
@@ -536,6 +535,7 @@ Activity.prototype.getIncrementalEngagedTime = function(name, reset) {};
 AccessService.prototype.getAccessReaderId = function() {};
 AccessService.prototype.getAuthdataField = function(field) {};
 // Same for amp-analytics
+
 /**
  * The "get CID" parameters.
  * - createCookieIfNotPresent: Whether CID is allowed to create a cookie when.
@@ -543,6 +543,7 @@ AccessService.prototype.getAuthdataField = function(field) {};
  * @typedef {{
  *   scope: string,
  *   createCookieIfNotPresent: (boolean|undefined),
+ *   cookieName: (string|undefined),
  * }}
  */
 var GetCidDef;
@@ -570,7 +571,10 @@ var GetCidDef;
  *      given.
  */
 Cid.prototype.get = function(
-    externalCidScope, consent, opt_persistenceConsent) {}
+  externalCidScope,
+  consent,
+  opt_persistenceConsent
+) {};
 
 AmpStoryVariableService.prototype.onStateChange = function(event) {};
 AmpStoryVariableService.pageIndex;
@@ -713,6 +717,16 @@ let BindEvaluateExpressionResultDef;
  */
 let BindRescanOptionsDef;
 
+/**
+ * Options bag used in Bind.setState().
+ * @typedef {{
+ *    skipEval: (boolean|undefined),
+ *    skipAmpState: (boolean|undefined),
+ *    constrain: (Array<!Element>|undefined),
+ * }}
+ */
+let BindSetStateOptionsDef;
+
 /////////////////////////////
 ////// Web Anmomation externs
 /////////////////////////////
@@ -726,7 +740,6 @@ let BindRescanOptionsDef;
  */
 var WebAnimationDef;
 
-
 /**
  * @mixes WebAnimationSelectorDef
  * @mixes WebAnimationTimingDef
@@ -738,7 +751,6 @@ var WebAnimationDef;
  */
 var WebMultiAnimationDef;
 
-
 /**
  * @mixes WebAnimationSelectorDef
  * @mixes WebAnimationTimingDef
@@ -750,7 +762,6 @@ var WebMultiAnimationDef;
  */
 var WebSwitchAnimationDef;
 
-
 /**
  * @mixes WebAnimationSelectorDef
  * @mixes WebAnimationTimingDef
@@ -762,7 +773,6 @@ var WebSwitchAnimationDef;
  */
 var WebCompAnimationDef;
 
-
 /**
  * @mixes WebAnimationSelectorDef
  * @mixes WebAnimationTimingDef
@@ -774,13 +784,11 @@ var WebCompAnimationDef;
  */
 var WebKeyframeAnimationDef;
 
-
 /**
  * @typedef {!Object<string, *>|!Array<!Object<string, *>>}
  */
 var WebKeyframesDef;
 
-
 /**
  * See https://developer.mozilla.org/en-US/docs/Web/API/AnimationEffectTimingProperties
  *
@@ -798,7 +806,6 @@ var WebKeyframesDef;
  */
 var WebAnimationTimingDef;
 
-
 /**
  * Indicates an extension to a type that allows specifying vars. Vars are
  * specified as properties with the name in the format of `--varName`.
@@ -808,7 +815,6 @@ var WebAnimationTimingDef;
  */
 var WebAnimationVarsDef;
 
-
 /**
  * Defines media parameters for an animation.
  *
@@ -820,7 +826,6 @@ var WebAnimationVarsDef;
  */
 var WebAnimationConditionalDef;
 
-
 /**
  * @typedef {{
  *   target: (!Element|undefined),
@@ -830,7 +835,6 @@ var WebAnimationConditionalDef;
  */
 var WebAnimationSelectorDef;
 
-
 /**
  * @mixes WebAnimationTimingDef
  * @mixes WebAnimationVarsDef
@@ -847,7 +851,6 @@ ampInaboxPositionObserver.observe;
 ampInaboxPositionObserver.getTargetRect;
 ampInaboxPositionObserver.getViewportRect;
 
-
 /**
  * TODO(dvoytenko): remove FeaturePolicy once it's added in Closure externs.
  * See https://developer.mozilla.org/en-US/docs/Web/API/FeaturePolicy.
diff --git a/build-system/externs/amp.multipass.extern.js b/build-system/externs/amp.multipass.extern.js
index b44f74b4ed532..7c2a3259fdf8c 100644
--- a/build-system/externs/amp.multipass.extern.js
+++ b/build-system/externs/amp.multipass.extern.js
@@ -21,9 +21,6 @@
 var SomeBaseElementLikeClass;
 SomeBaseElementLikeClass.prototype.layout_;
 
-/** @type {number} */
-SomeBaseElementLikeClass.prototype.layoutWidth_;
-
 /** @type {boolean} */
 SomeBaseElementLikeClass.prototype.inViewport_;
 
diff --git a/build-system/externs/dompurify.extern.js b/build-system/externs/dompurify.extern.js
index 04838a0dedc38..0832e87ebd4e8 100644
--- a/build-system/externs/dompurify.extern.js
+++ b/build-system/externs/dompurify.extern.js
@@ -16,7 +16,6 @@
 
 /** @externs */
 
-
 /** @constructor */
 var DomPurifyConfig = function() {};
 
diff --git a/build-system/externs/preact.extern.js b/build-system/externs/preact.extern.js
new file mode 100644
index 0000000000000..f58c6fb41e79d
--- /dev/null
+++ b/build-system/externs/preact.extern.js
@@ -0,0 +1,56 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @externs */
+
+/** @const */
+var Preact = {};
+
+/**
+ * @typedef {function(!JsonObject):Preact.Renderable}
+ */
+Preact.FunctionalComponent;
+
+/**
+ * @interface
+ */
+Preact.VNode = function() {};
+
+/**
+ * @interface
+ */
+Preact.Context = function() {};
+
+/**
+ * @param {!JsonObject} props
+ * @return {Preact.Renderable}
+ */
+Preact.Context.prototype.Provider = function(props) {};
+
+/**
+ * @interface
+ */
+Preact.Context.prototype.Consumer = function() {};
+
+/**
+ * @typedef {string|number|boolean|null|undefined}
+ */
+Preact.SimpleRenderable;
+
+/**
+ * @typedef {Preact.SimpleRenderable|!Preact.VNode|!Array<Preact.SimpleRenderable|!Preact.VNode|!Array<Preact.SimpleRenderable|!Preact.VNode>>}
+ */
+Preact.Renderable;
diff --git a/build-system/global-configs/canary-config.json b/build-system/global-configs/canary-config.json
index 84d6573feb3eb..eb745ad345e53 100644
--- a/build-system/global-configs/canary-config.json
+++ b/build-system/global-configs/canary-config.json
@@ -1,8 +1,7 @@
 {
-  "allow-doc-opt-in": ["amp-next-page"],
+  "allow-doc-opt-in": ["amp-next-page", "inabox-viewport-friendly"],
   "allow-url-opt-in": [
     "pump-early-frame",
-    "macro-after-long-task",
     "twitter-default-placeholder",
     "twitter-default-placeholder-fade",
     "twitter-default-placeholder-pulse"
@@ -15,6 +14,7 @@
   "amp-ad-ff-adx-ady": 0.01,
   "amp-auto-ads-adsense-holdout": 0.1,
   "amp-auto-ads-no-op-experiment": 0.05,
+  "amp-consent-geo-override": 1,
   "amp-consent-v2": 1,
   "amp-mega-menu": 1,
   "amp-nested-menu": 1,
@@ -32,13 +32,12 @@
   "fix-inconsistent-responsive-height-selection": 0,
   "fixed-elements-in-lightbox": 1,
   "flexAdSlots": 0.05,
-  "swg-gpay-api": 1,
   "hidden-mutation-observer": 1,
   "ios-fixed-no-transfer": 1,
   "layoutbox-invalidate-on-scroll": 1,
-  "macro-after-long-task": 1,
   "pump-early-frame": 1,
-  "remove-viewer-query-params-on-navigate": 1,
+  "swg-gpay-api": 1,
+  "swg-gpay-native": 1,
   "use-responsive-ads-for-responsive-sizing-in-auto-ads": 0.05,
   "version-locking": 1
 }
diff --git a/build-system/global-configs/experiments-config.json b/build-system/global-configs/experiments-config.json
index f94ca0b5e5c5f..f061431de0291 100644
--- a/build-system/global-configs/experiments-config.json
+++ b/build-system/global-configs/experiments-config.json
@@ -1,19 +1,5 @@
 {
-  "experimentA": {
-    "name": "ANALYTICS_VENDOR_SPLIT",
-    "environment": "INABOX",
-    "command": "gulp generate-vendor-jsons && gulp dist --defineExperimentConstant=ANALYTICS_VENDOR_SPLIT",
-    "issue": "",
-    "expirationDateUTC": "2019-11-08",
-    "defineExperimentConstant": "ANALYTICS_VENDOR_SPLIT"
-  },
+  "experimentA": {},
   "experimentB": {},
-  "experimentC": {
-    "name": "Native Custom Elements V1",
-    "environment": "AMP",
-    "command": "gulp dist --defineExperimentConstant=NATIVE_CUSTOM_ELEMENTS_V1",
-    "issue": "https://github.com/ampproject/amphtml/issues/17243",
-    "expirationDateUTC": "2020-01-01",
-    "defineExperimentConstant": "NATIVE_CUSTOM_ELEMENTS_V1"
-  }
+  "experimentC": {}
 }
diff --git a/build-system/global-configs/experiments-const.json b/build-system/global-configs/experiments-const.json
index 0967ef424bce6..14d28d1cc4b5e 100644
--- a/build-system/global-configs/experiments-const.json
+++ b/build-system/global-configs/experiments-const.json
@@ -1 +1,3 @@
-{}
+{
+  "ANALYTICS_VENDOR_SPLIT": true
+}
diff --git a/build-system/global-configs/prod-config.json b/build-system/global-configs/prod-config.json
index 7ba7c68354f39..0ad5912a687d9 100644
--- a/build-system/global-configs/prod-config.json
+++ b/build-system/global-configs/prod-config.json
@@ -1,8 +1,7 @@
 {
-  "allow-doc-opt-in": ["amp-next-page"],
+  "allow-doc-opt-in": ["amp-next-page", "inabox-viewport-friendly"],
   "allow-url-opt-in": [
     "pump-early-frame",
-    "macro-after-long-task",
     "twitter-default-placeholder",
     "twitter-default-placeholder-fade",
     "twitter-default-placeholder-pulse"
@@ -15,6 +14,7 @@
   "amp-ad-ff-adx-ady": 0.01,
   "amp-auto-ads-adsense-holdout": 0.1,
   "amp-auto-ads-no-op-experiment": 0.05,
+  "amp-consent-geo-override": 1,
   "amp-consent-v2": 1,
   "amp-mega-menu": 1,
   "amp-nested-menu": 1,
@@ -28,15 +28,16 @@
   "chunked-amp": 1,
   "doubleclickSraExp": 0.01,
   "doubleclickSraReportExcludedBlock": 0.1,
+  "fie-css-cleanup": 1,
   "fix-inconsistent-responsive-height-selection": 0,
   "fixed-elements-in-lightbox": 1,
   "flexAdSlots": 0.05,
-  "swg-gpay-native": 1,
   "hidden-mutation-observer": 1,
   "ios-fixed-no-transfer": 0,
-  "macro-after-long-task": 0,
+  "layoutbox-invalidate-on-scroll": 1,
   "pump-early-frame": 1,
-  "remove-viewer-query-params-on-navigate": 1,
+  "swg-gpay-api": 1,
+  "swg-gpay-native": 1,
   "use-responsive-ads-for-responsive-sizing-in-auto-ads": 0.05,
   "version-locking": 1
 }
diff --git a/build-system/server/app-index/document-modes.js b/build-system/server/app-index/document-modes.js
index d2252921c5a62..529f82a05002f 100644
--- a/build-system/server/app-index/document-modes.js
+++ b/build-system/server/app-index/document-modes.js
@@ -19,7 +19,9 @@ module.exports = {
   'shadow': '/shadow/',
   'a4a': '/a4a/',
   'a4a-3p': '/a4a-3p/',
+  'mraid': '/mraid/',
   'inabox': '/inabox/',
   'inabox-friendly': '/inabox-friendly/',
   'inabox-safeframe': '/inabox-safeframe/',
+  'inabox-mraid': '/inabox-mraid/',
 };
diff --git a/build-system/server/app-index/index.js b/build-system/server/app-index/index.js
index 6b0d2a70ae790..3a72101c05aa5 100644
--- a/build-system/server/app-index/index.js
+++ b/build-system/server/app-index/index.js
@@ -17,8 +17,7 @@
 
 const api = require('./api/api');
 const basepathMappings = require('./basepath-mappings');
-const BBPromise = require('bluebird');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const path = require('path');
 const {
   getListing,
@@ -43,7 +42,7 @@ async function serveIndex({url}, res, next) {
     return next();
   }
 
-  const css = (await fs.readFileAsync(mainCssFile)).toString();
+  const css = fs.readFileSync(mainCssFile).toString();
 
   const renderedHtml = renderTemplate({
     fileSet,
diff --git a/build-system/server/app-index/test/test-self.js b/build-system/server/app-index/test/test-self.js
index 9539e5ae43e22..47c4241fe4cb8 100644
--- a/build-system/server/app-index/test/test-self.js
+++ b/build-system/server/app-index/test/test-self.js
@@ -15,17 +15,16 @@
  */
 
 const amphtmlValidator = require('amphtml-validator');
-const BBPromise = require('bluebird');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const path = require('path');
 const {expect} = require('chai');
-
 const {
   expectValidAmphtml,
   getBoundAttr,
   parseHtmlChunk,
 } = require('./helpers');
 
+
 describe('devdash', () => {
 
   describe('Test helpers', () => {
@@ -112,7 +111,7 @@ describe('devdash', () => {
         const validDocPath = path.join(__dirname,
             '../../../../validator/testdata/feature_tests/minimum_valid_amp.html');
 
-        const validDoc = (await fs.readFileAsync(validDocPath)).toString();
+        const validDoc = fs.readFileSync(validDocPath).toString();
 
         expectValidAmphtml(await amphtmlValidator.getInstance(), validDoc);
       });
diff --git a/build-system/server/app-index/util/listing.js b/build-system/server/app-index/util/listing.js
index c52c781c20a8b..57bb873a718fd 100644
--- a/build-system/server/app-index/util/listing.js
+++ b/build-system/server/app-index/util/listing.js
@@ -15,8 +15,7 @@
  */
 'use strict';
 
-const BBPromise = require('bluebird');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const {join, normalize, sep} = require('path');
 
 function isMaliciousPath(path, rootPath) {
@@ -35,8 +34,8 @@ async function getListing(rootPath, basepath) {
   }
 
   try {
-    if ((await fs.statAsync(path)).isDirectory()) {
-      return fs.readdirAsync(path);
+    if (fs.statSync(path).isDirectory()) {
+      return fs.promises.readdir(path);
     }
   } catch (unusedE) {
     /* empty catch for fallbacks */
diff --git a/build-system/server/app-video-testbench.js b/build-system/server/app-video-testbench.js
index eb621ba6a1c55..10f67ba60d2af 100644
--- a/build-system/server/app-video-testbench.js
+++ b/build-system/server/app-video-testbench.js
@@ -16,12 +16,12 @@
 /* eslint-disable */
 'use strict';
 
-const BBPromise = require('bluebird');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const {JSDOM} = require('jsdom');
 const {replaceUrls} = require('./app-utils');
 const {getServeMode} = require('./app-utils');
 
+
 const sourceFile = 'test/manual/amp-video.amp.html';
 
 // These are taken from the respective example or validation files.
@@ -367,7 +367,7 @@ function isValidExtension(extension) {
 
 
 function runVideoTestBench(req, res, next) {
-  fs.readFileAsync(sourceFile).then(contents => {
+  fs.promises.readFile(sourceFile).then(contents => {
     const dom = new JSDOM(contents);
     const {window} = dom;
     const doc = window.document;
@@ -395,7 +395,7 @@ function runVideoTestBench(req, res, next) {
     appendClientScript(doc);
 
     return res.end(replaceUrls(getServeMode(), dom.serialize()));
-  }).error(() => {
+  }).catch(() => {
     next();
   });
 }
diff --git a/build-system/server/app.js b/build-system/server/app.js
index b14337c362fa3..99f228f0cc5f8 100644
--- a/build-system/server/app.js
+++ b/build-system/server/app.js
@@ -22,17 +22,17 @@
 const app = require('express')();
 const argv = require('minimist')(process.argv.slice(2));
 const bacon = require('baconipsum');
-const BBPromise = require('bluebird');
 const bodyParser = require('body-parser');
 const cors = require('./amp-cors');
 const devDashboard = require('./app-index/index');
 const formidable = require('formidable');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const jsdom = require('jsdom');
 const path = require('path');
 const request = require('request');
 const upload = require('multer')();
 const pc = process;
+const autocompleteEmailData = require('./autocomplete-test-data');
 const runVideoTestBench = require('./app-video-testbench');
 const {
   recaptchaFrameRequestHandler,
@@ -228,7 +228,7 @@ app.use('/pwa', (req, res) => {
   }
   res.statusCode = 200;
   res.setHeader('Content-Type', contentType);
-  fs.readFileAsync(pc.cwd() + file).then(file => {
+  fs.promises.readFile(pc.cwd() + file).then(file => {
     res.end(file);
   });
 });
@@ -410,6 +410,19 @@ app.use('/form/autocomplete/error', (req, res) => {
   res(500);
 });
 
+app.use('/form/mention/query', (req, res) => {
+  const query = req.query.q;
+  if (!query) {
+    res.json({items: autocompleteEmailData});
+    return;
+  }
+  const lowerCaseQuery = query.toLowerCase().trim();
+  const filtered = autocompleteEmailData.filter(l =>
+    l.toLowerCase().startsWith(lowerCaseQuery)
+  );
+  res.json({items: filtered});
+});
+
 app.use('/form/verify-search-json/post', (req, res) => {
   cors.assertCors(req, res, ['POST']);
   const form = new formidable.IncomingForm();
@@ -478,6 +491,27 @@ function proxyToAmpProxy(req, res, mode) {
     // TODO(ccordry): Remove this when story v01 is depricated.
     const storyV1 = req.query['story_v'] === '1';
     const urlPrefix = getUrlPrefix(req);
+    if (req.query['mraid']) {
+      body = body
+        .replace(
+          '</head>',
+          '<script async host-service="amp-mraid" src="https://cdn.ampproject.org/v0/amp-mraid-0.1.js">' +
+            '</script>' +
+            '</head>'
+        )
+        // Change cdnUrl from the default so amp-mraid requests the (mock)
+        // mraid.js from the local server. In a real environment this doesn't
+        // matter as the local environment would intercept this request.
+        .replace(
+          '<head>',
+          ' <head>' +
+            ' <script>' +
+            ' window.AMP_CONFIG = {' +
+            `   cdnUrl: "${urlPrefix}",` +
+            ' };' +
+            ' </script>'
+        );
+    }
     body = replaceUrls(mode, body, urlPrefix, inabox, storyV1);
     if (inabox) {
       // Allow CORS requests for A4A.
@@ -753,6 +787,15 @@ app.post('/get-consent-no-prompt/', (req, res) => {
   res.json(body);
 });
 
+app.post('/check-consent', (req, res) => {
+  cors.assertCors(req, res, ['POST']);
+  res.json({
+    'consentRequired': req.query.consentRequired === 'true',
+    'consentStateValue': req.query.consentStateValue,
+    'expireCache': req.query.expireCache === 'true',
+  });
+});
+
 // Proxy with local JS.
 // Example:
 // http://localhost:8000/proxy/s/www.washingtonpost.com/amphtml/news/post-politics/wp/2016/02/21/bernie-sanders-says-lower-turnout-contributed-to-his-nevada-loss-to-hillary-clinton/
@@ -787,13 +830,14 @@ app.get('/a4a_template/*', (req, res) => {
   const filePath =
     `${pc.cwd()}/extensions/amp-ad-network-${match[1]}-impl/` +
     `0.1/data/${match[2]}.template`;
-  fs.readFileAsync(filePath)
+  fs.promises
+    .readFile(filePath)
     .then(file => {
       res.setHeader('Content-Type', 'application/json');
       res.setHeader('AMP-template-amp-creative', 'amp-mustache');
       res.end(file);
     })
-    .error(() => {
+    .catch(() => {
       res.status(404);
       res.end('Not found: ' + filePath);
     });
@@ -856,17 +900,41 @@ app.get(['/dist/v0/amp-*.js'], (req, res, next) => {
 app.get('/test/manual/amp-video.amp.html', runVideoTestBench);
 
 app.get(
-  ['/examples/*.html', '/test/manual/*.html', '/test/fixtures/e2e/*/*.html'],
+  [
+    '/examples/(**/)?*.html',
+    '/test/manual/(**/)?*.html',
+    '/test/fixtures/e2e/(**/)?*.html',
+  ],
   (req, res, next) => {
     const filePath = req.path;
     const mode = SERVE_MODE;
     const inabox = req.query['inabox'];
     const stream = Number(req.query['stream']);
-    fs.readFileAsync(pc.cwd() + filePath, 'utf8')
+    const urlPrefix = getUrlPrefix(req);
+    fs.promises
+      .readFile(pc.cwd() + filePath, 'utf8')
       .then(file => {
         if (req.query['amp_js_v']) {
           file = addViewerIntegrationScript(req.query['amp_js_v'], file);
         }
+        if (req.query['mraid']) {
+          file = file
+            .replace(
+              '</head>',
+              '<script async host-service="amp-mraid" src="https://cdn.ampproject.org/v0/amp-mraid-0.1.js">' +
+                '</script>' +
+                '</head>'
+            )
+            .replace(
+              '<head>',
+              ' <head>' +
+                ' <script>' +
+                ' window.AMP_CONFIG = {' +
+                `   cdnUrl: "${urlPrefix}",` +
+                ' };' +
+                ' </script>'
+            );
+        }
         file = file.replace(/__TEST_SERVER_PORT__/g, TEST_SERVER_PORT);
 
         if (inabox && req.headers.origin) {
@@ -911,7 +979,7 @@ app.get(
 
         // Extract amp-consent for the given 'type' specified in URL query.
         if (
-          req.path.indexOf('/examples/cmp-vendors.amp.html') == 0 &&
+          req.path.indexOf('/examples/amp-consent/cmp-vendors.amp.html') == 0 &&
           req.query.type
         ) {
           const consent = file.match(
@@ -1067,14 +1135,15 @@ app.get('/adzerk/*', (req, res) => {
   }
   const filePath =
     pc.cwd() + '/extensions/amp-ad-network-adzerk-impl/0.1/data/' + match[1];
-  fs.readFileAsync(filePath)
+  fs.promises
+    .readFile(filePath)
     .then(file => {
       res.setHeader('Content-Type', 'application/json');
       res.setHeader('AMP-Ad-Template-Extension', 'amp-mustache');
       res.setHeader('AMP-Ad-Response-Type', 'template');
       res.end(file);
     })
-    .error(() => {
+    .catch(() => {
       res.status(404);
       res.end('Not found: ' + filePath);
     });
@@ -1149,7 +1218,7 @@ app.get('/dist/iframe-transport-client-lib.js', (req, res, next) => {
 
 app.get('/dist/amp-inabox-host.js', (req, res, next) => {
   const mode = SERVE_MODE;
-  if (mode == 'compiled') {
+  if (mode != 'default') {
     req.url = req.url.replace('amp-inabox-host', 'amp4ads-host-v0');
   }
   next();
@@ -1160,7 +1229,8 @@ app.get('/dist/amp-inabox-host.js', (req, res, next) => {
  */
 app.get('/dist/sw(.max)?.js', (req, res, next) => {
   const filePath = req.path;
-  fs.readFileAsync(pc.cwd() + filePath, 'utf8')
+  fs.promises
+    .readFile(pc.cwd() + filePath, 'utf8')
     .then(file => {
       let n = new Date();
       // Round down to the nearest 5 minutes.
@@ -1191,8 +1261,8 @@ app.get('/dist/rtv/9[89]*/*.js', (req, res, next) => {
     // Cause a delay, to show the "stale-while-revalidate"
     if (req.path.includes('v0.js')) {
       const path = req.path.replace(/rtv\/\d+/, '');
-      return fs
-        .readFileAsync(pc.cwd() + path, 'utf8')
+      return fs.promises
+        .readFile(pc.cwd() + path, 'utf8')
         .then(file => {
           res.end(file);
         })
@@ -1209,7 +1279,8 @@ app.get('/dist/rtv/9[89]*/*.js', (req, res, next) => {
 
 app.get(['/dist/cache-sw.html'], (req, res, next) => {
   const filePath = '/test/manual/cache-sw.html';
-  fs.readFileAsync(pc.cwd() + filePath, 'utf8')
+  fs.promises
+    .readFile(pc.cwd() + filePath, 'utf8')
     .then(file => {
       let n = new Date();
       // Round down to the nearest 5 minutes.
@@ -1254,13 +1325,18 @@ app.get('/dist/diversions', (req, res) => {
  * Web worker binary.
  */
 app.get('/dist/ww(.max)?.js', (req, res) => {
-  fs.readFileAsync(pc.cwd() + req.path).then(file => {
+  fs.promises.readFile(pc.cwd() + req.path).then(file => {
     res.setHeader('Content-Type', 'text/javascript');
     res.setHeader('Access-Control-Allow-Origin', '*');
     res.end(file);
   });
 });
 
+app.get('/mraid.js', (req, res, next) => {
+  req.url = req.url.replace('mraid.js', 'examples/mraid/mraid.js');
+  next();
+});
+
 /**
  * Shadow viewer. Fetches shadow runtime from cdn by default.
  * Setting the param useLocal=1 will load the runtime from the local build.
@@ -1285,6 +1361,10 @@ app.use('/shadow/', (req, res) => {
   res.end(replaceUrls(SERVE_MODE, viewerHtml));
 });
 
+app.use('/mraid/', (req, res) => {
+  res.redirect(req.url + '?inabox=1&mraid=1');
+});
+
 /**
  * @param {string} ampJsVersion
  * @param {string} file
@@ -1381,12 +1461,13 @@ app.use('(/dist)?/rtv/*/v0/analytics-vendors/:vendor.json', (req, res) => {
   const max = serveMode === 'default' ? '.max' : '';
   const localVendorConfigPath = `${pc.cwd()}/dist/v0/analytics-vendors/${vendor}${max}.json`;
 
-  fs.readFileAsync(localVendorConfigPath)
+  fs.promises
+    .readFile(localVendorConfigPath)
     .then(file => {
       res.setHeader('Content-Type', 'application/json');
       res.end(file);
     })
-    .error(() => {
+    .catch(() => {
       res.status(404);
       res.end('Not found: ' + localVendorConfigPath);
     });
diff --git a/build-system/server/autocomplete-test-data.js b/build-system/server/autocomplete-test-data.js
new file mode 100644
index 0000000000000..bfbf741e85b9c
--- /dev/null
+++ b/build-system/server/autocomplete-test-data.js
@@ -0,0 +1,33 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const mentionEmails = [
+  'harrypotter@hogwarts.edu',
+  'albusdumbledore@hogwarts.edu',
+  'voldemort@deatheater.org',
+  'severussnape@hogwarts.edu',
+  'siriusblack@hogwarts.edu',
+  'hermionegranger@hogwarts.edu',
+  'ronweasley@hogwarts.edu',
+  'dracomalfoy@hogwarts.edu',
+  'nevillelongbottom@hogwarts.edu',
+  'rubeushagrid@hogwarts.edu',
+  'dobby@hogwarts.edu',
+  'bellatrixlestrange@deatheater.org',
+  'minervamcgonagall@hogwarts.edu',
+];
+
+module.exports = mentionEmails;
diff --git a/build-system/server/recaptcha-router.js b/build-system/server/recaptcha-router.js
index a401ff96ce2d9..eb5f485356444 100644
--- a/build-system/server/recaptcha-router.js
+++ b/build-system/server/recaptcha-router.js
@@ -17,8 +17,7 @@
 const argv = require('minimist')(process.argv.slice(2));
 const cors = require('./amp-cors');
 const pc = process;
-const BBPromise = require('bluebird');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const multer = require('multer');
 const recaptchaRouter = require('express').Router();
 
@@ -33,7 +32,7 @@ window.grecaptcha = {
 
 const recaptchaFrameRequestHandler = (req, res, next) => {
   if (argv._.includes('unit') || argv._.includes('integration')) {
-    fs.readFileAsync(pc.cwd() + req.path, 'utf8').then(file => {
+    fs.promises.readFile(pc.cwd() + req.path, 'utf8').then(file => {
       file = file.replace(
         /initRecaptcha\(.*\)/g,
         'initRecaptcha("/recaptcha/mock.js?sitekey=")'
diff --git a/build-system/server/routes/a4a-envelopes.js b/build-system/server/routes/a4a-envelopes.js
index db823b534ffb6..2514716a90329 100644
--- a/build-system/server/routes/a4a-envelopes.js
+++ b/build-system/server/routes/a4a-envelopes.js
@@ -15,8 +15,7 @@
  */
 
 const app = require('express').Router();
-const BBPromise = require('bluebird');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const log = require('fancy-log');
 const request = require('request');
 const {getServeMode, replaceUrls} = require('../app-utils');
@@ -26,11 +25,15 @@ const {red} = require('ansi-colors');
 // Examples:
 // http://localhost:8000/inabox/examples/animations.amp.html
 // http://localhost:8000/inabox/proxy/s/www.washingtonpost.com/amphtml/news/post-politics/wp/2016/02/21/bernie-sanders-says-lower-turnout-contributed-to-his-nevada-loss-to-hillary-clinton/
-app.use('/inabox/', (req, res) => {
+app.use(['/inabox', '/inabox-mraid'], (req, res) => {
   const templatePath =
     process.cwd() + '/build-system/server/server-inabox-template.html';
-  fs.readFileAsync(templatePath, 'utf8').then(template => {
+  fs.promises.readFile(templatePath, 'utf8').then(template => {
     template = template.replace(/SOURCE/g, 'AD_URL');
+    if (req.baseUrl == '/inabox-mraid') {
+      // MRAID does not load amp4ads-host-v0.js
+      template = template.replace('INABOX_ADS_TAG_INTEGRATION', '');
+    }
     const url = getInaboxUrl(req);
     res.end(fillTemplate(template, url.href, req.query));
   });
@@ -42,12 +45,17 @@ app.use('/inabox/', (req, res) => {
 // http://localhost:8000/inabox-friendly/proxy/s/www.washingtonpost.com/amphtml/news/post-politics/wp/2016/02/21/bernie-sanders-says-lower-turnout-contributed-to-his-nevada-loss-to-hillary-clinton/
 app.use('/inabox-(friendly|safeframe)', (req, res) => {
   const templatePath = '/build-system/server/server-inabox-template.html';
-  fs.readFileAsync(process.cwd() + templatePath, 'utf8')
+  fs.promises
+    .readFile(process.cwd() + templatePath, 'utf8')
     .then(template => {
-      const url = getInaboxUrl(req);
+      let url;
       if (req.baseUrl == '/inabox-friendly') {
-        template = template.replace('SRCDOC_ATTRIBUTE', 'srcdoc="BODY"');
+        url = getInaboxUrl(req, 'inabox-viewport-friendly');
+        template = template
+          .replace('SRCDOC_ATTRIBUTE', 'srcdoc="BODY"')
+          .replace('INABOX_ADS_TAG_INTEGRATION', '');
       } else {
+        url = getInaboxUrl(req);
         template = template
           .replace(
             /NAME/g,
@@ -78,7 +86,7 @@ app.use('/a4a(|-3p)/', (req, res) => {
   const force3p = req.baseUrl.startsWith('/a4a-3p');
   const templatePath = '/build-system/server/server-a4a-template.html';
   const url = getInaboxUrl(req);
-  fs.readFileAsync(process.cwd() + templatePath, 'utf8').then(template => {
+  fs.promises.readFile(process.cwd() + templatePath, 'utf8').then(template => {
     const content = fillTemplate(template, url.href, req.query)
       .replace(/CHECKSIG/g, force3p || '')
       .replace(/DISABLE3PFALLBACK/g, !force3p);
@@ -100,6 +108,9 @@ function getInaboxUrl(req, extraExperiment) {
   }
   // this tells local server to convert the AMP document to AMP4ADS spec
   url.searchParams.set('inabox', '1');
+  if (req.baseUrl == '/inabox-mraid') {
+    url.searchParams.set('mraid', '1');
+  }
   // turn on more logs if requested
   const logLevel = url.searchParams.get('log');
   if (logLevel) {
@@ -173,6 +184,10 @@ function fillTemplate(template, url, query, body) {
       .replace(/OFFSET/g, query.offset || '0px')
       .replace(/AD_WIDTH/g, query.width || '300')
       .replace(/AD_HEIGHT/g, query.height || '250')
+      .replace(
+        'INABOX_ADS_TAG_INTEGRATION',
+        '<script src="/examples/amphtml-ads/ads-tag-integration.js"></script>'
+      )
       // Clear out variables that are not already replaced beforehand.
       .replace(/NAME/g, 'inabox')
       .replace(/SOURCE/g, '')
diff --git a/build-system/server/routes/analytics.js b/build-system/server/routes/analytics.js
index 97429f7ec0162..6ebc992db200a 100644
--- a/build-system/server/routes/analytics.js
+++ b/build-system/server/routes/analytics.js
@@ -45,7 +45,7 @@ router.post('/rewriter', (req, res) => {
       reqBody: body,
     },
   };
-  const payload = Object.assign({}, body, extraUrlParams);
+  const payload = {...body, ...extraUrlParams};
   res.json(payload);
 });
 
diff --git a/build-system/server/server-a4a-template.html b/build-system/server/server-a4a-template.html
index 3f31b30e5b1ed..f2044243e18a5 100644
--- a/build-system/server/server-a4a-template.html
+++ b/build-system/server/server-a4a-template.html
@@ -9,11 +9,11 @@
   <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
 </head>
 <body>
-  <h1>A4A Envelope</h1>
+  <h1 id="title">A4A Envelope</h1>
   <div>url: AD_URL</div>
   <div>size: AD_WIDTHxAD_HEIGHT</div>
 
-  <div style="background: #eee; overflow: hidden;; height: OFFSET;">scroll down to see the ad</div>
+  <div style="background: #eee; overflow: hidden; height: OFFSET;">scroll down to see the ad</div>
 
   <amp-ad
       width="AD_WIDTH" height="AD_HEIGHT"
diff --git a/build-system/server/server-inabox-template.html b/build-system/server/server-inabox-template.html
index 0b45c4efb7632..d94d351dc9308 100644
--- a/build-system/server/server-inabox-template.html
+++ b/build-system/server/server-inabox-template.html
@@ -20,7 +20,7 @@
   </style>
 </head>
 <body>
-  <h1>In-a-box Envelope</h1>
+  <h1 id="title">In-a-box Envelope</h1>
   <div class="url">url: AD_URL</div>
   <div>size: AD_WIDTHxAD_HEIGHT</div>
 
@@ -41,6 +41,6 @@ <h1>In-a-box Envelope</h1>
 
   <div style="background: #eee; overflow: hidden;; height: 100vh;"></div>
 
-  <script src="/examples/amphtml-ads/ads-tag-integration.js"></script>
+  INABOX_ADS_TAG_INTEGRATION
 </body>
 </html>
diff --git a/build-system/tasks/build.js b/build-system/tasks/build.js
index 76e3f66d4cd78..c6ed6b7ff17ff 100644
--- a/build-system/tasks/build.js
+++ b/build-system/tasks/build.js
@@ -18,6 +18,7 @@ const log = require('fancy-log');
 const {
   bootstrapThirdPartyFrames,
   compileAllUnminifiedJs,
+  compileCoreRuntime,
   printConfigHelp,
   printNobuildHelp,
 } = require('./helpers');
@@ -33,6 +34,8 @@ const {doServe} = require('./serve');
 const {maybeUpdatePackages} = require('./update-packages');
 const {parseExtensionFlags} = require('./extension-helpers');
 
+const argv = require('minimist')(process.argv.slice(2));
+
 /**
  * Enables watching for file changes in css, extensions.
  * @return {!Promise}
@@ -40,7 +43,7 @@ const {parseExtensionFlags} = require('./extension-helpers');
 async function watch() {
   maybeUpdatePackages();
   createCtrlcHandler('watch');
-  return performBuild(/* watch */ true);
+  await performBuild(/* watch */ true);
 }
 
 /**
@@ -88,8 +91,12 @@ async function performBuild(watch) {
   printConfigHelp(watch ? 'gulp watch' : 'gulp build');
   parseExtensionFlags();
   await performPrerequisiteSteps(watch);
-  await compileAllUnminifiedJs(watch);
-  await buildExtensions({watch});
+  if (argv.core_runtime_only) {
+    await compileCoreRuntime(watch, /* minify */ false);
+  } else {
+    await compileAllUnminifiedJs(watch);
+    await buildExtensions({watch});
+  }
 }
 
 /**
@@ -122,6 +129,8 @@ build.flags = {
   extensions: '  Builds only the listed extensions.',
   extensions_from: '  Builds only the extensions from the listed AMP(s).',
   noextensions: '  Builds with no extensions.',
+  core_runtime_only: '  Builds only the core runtime.',
+  coverage: '  Adds code coverage instrumentation to JS files using istanbul.',
 };
 
 watch.description = 'Watches for changes in files, re-builds when detected';
@@ -131,6 +140,7 @@ watch.flags = {
   extensions_from:
     '  Watches and builds only the extensions from the listed AMP(s).',
   noextensions: '  Watches and builds with no extensions.',
+  core_runtime_only: '  Watches and builds only the core runtime.',
 };
 
 defaultTask.description =
diff --git a/build-system/tasks/bundle-size/APPROVERS.json b/build-system/tasks/bundle-size/APPROVERS.json
index a533db2ed2dea..d64fb815b5168 100644
--- a/build-system/tasks/bundle-size/APPROVERS.json
+++ b/build-system/tasks/bundle-size/APPROVERS.json
@@ -7,6 +7,10 @@
     "approvers": ["ampproject/wg-ads"],
     "threshold": 0.1
   },
+  "dist/v0/amp-analytics-0.1.js": {
+    "approvers": ["ampproject/wg-analytics"],
+    "threshold": 0.1
+  },
   "dist/v0/amp-story-0.1.js": {
     "approvers": ["ampproject/wg-stories"],
     "threshold": 0.5
diff --git a/build-system/tasks/bundle-size/index.js b/build-system/tasks/bundle-size/index.js
index ba14b5ab3f194..898fba1104819 100644
--- a/build-system/tasks/bundle-size/index.js
+++ b/build-system/tasks/bundle-size/index.js
@@ -16,14 +16,13 @@
 'use strict';
 
 const argv = require('minimist')(process.argv.slice(2));
-const BBPromise = require('bluebird');
 const brotliSize = require('brotli-size');
 const fs = require('fs');
 const globby = require('globby');
 const log = require('fancy-log');
 const path = require('path');
-const requestPost = BBPromise.promisify(require('request').post);
 const url = require('url');
+const util = require('util');
 const {
   gitCommitHash,
   gitTravisMasterBaseline,
@@ -40,6 +39,8 @@ const {
 } = require('../../compile/internal-version');
 const {cyan, green, red, yellow} = require('ansi-colors');
 
+const requestPost = util.promisify(require('request').post);
+
 const fileGlobs = ['dist/*.js', 'dist/v0/*-?.?.js'];
 const normalizedRtvNumber = '1234567890123';
 
diff --git a/build-system/tasks/changelog.js b/build-system/tasks/changelog.js
index df51ddbba3e83..c751476e156d0 100644
--- a/build-system/tasks/changelog.js
+++ b/build-system/tasks/changelog.js
@@ -24,18 +24,19 @@
 
 const argv = require('minimist')(process.argv.slice(2));
 const assert = require('assert');
-const BBPromise = require('bluebird');
 const childProcess = require('child_process');
 const colors = require('ansi-colors');
 const config = require('../test-configs/config');
 const extend = require('util')._extend;
 const git = require('gulp-git');
 const log = require('fancy-log');
-const request = BBPromise.promisify(require('request'));
+const util = require('util');
 
 const {GITHUB_ACCESS_TOKEN} = process.env;
-const exec = BBPromise.promisify(childProcess.exec);
-const gitExec = BBPromise.promisify(git.exec);
+
+const exec = util.promisify(childProcess.exec);
+const gitExec = util.promisify(git.exec);
+const request = util.promisify(require('request'));
 
 const {branch: overrideBranch, dryrun: isDryrun} = argv;
 
@@ -163,7 +164,7 @@ function getLastGitTag(gitMetadata) {
   const command = 'git describe --tags --abbrev=0';
 
   return exec(command).then(lastTag => {
-    gitMetadata.baseTag = lastTag.trim();
+    gitMetadata.baseTag = lastTag.stdout.trim();
     return gitMetadata;
   });
 }
@@ -182,7 +183,7 @@ function getCurrentBranchName(gitMetadata) {
   const command = 'git rev-parse --abbrev-ref HEAD';
 
   return exec(command).then(branchName => {
-    gitMetadata.branch = branchName.trim();
+    gitMetadata.branch = branchName.stdout.trim();
     return gitMetadata;
   });
 }
@@ -397,7 +398,7 @@ function getGitLog(gitMetadata) {
 function getGithubPullRequestsMetadata(gitMetadata) {
   // (erwinm): Github seems to only return data for the first 3 pages
   // from my manual testing.
-  return BBPromise.all([
+  return Promise.all([
     getClosedPullRequests(1),
     getClosedPullRequests(2),
     getClosedPullRequests(3),
@@ -421,9 +422,9 @@ function getGithubPullRequestsMetadata(gitMetadata) {
           // through github merge).
           return getPullRequest(prOptions, log);
         }
-        return BBPromise.resolve();
+        return Promise.resolve();
       });
-      return BBPromise.all(githubPrRequest).then(() => {
+      return Promise.all(githubPrRequest).then(() => {
         return gitMetadata;
       });
     });
@@ -444,9 +445,9 @@ function getGithubFilesMetadata(gitMetadata) {
       fileOptions.url = `${log.pr.url}/files`;
       return getPullRequestFiles(fileOptions, log.pr);
     }
-    return BBPromise.resolve();
+    return Promise.resolve();
   });
-  return BBPromise.all(githubFileRequests).then(() => {
+  return Promise.all(githubFileRequests).then(() => {
     return gitMetadata;
   });
 }
diff --git a/build-system/tasks/check-owners.js b/build-system/tasks/check-owners.js
index 385267840e059..6c572a0d3ee68 100644
--- a/build-system/tasks/check-owners.js
+++ b/build-system/tasks/check-owners.js
@@ -26,12 +26,12 @@ const fs = require('fs-extra');
 const JSON5 = require('json5');
 const log = require('fancy-log');
 const request = require('request');
-const utils = require('bluebird');
+const util = require('util');
 const {cyan, red, green} = require('ansi-colors');
 const {getFilesToCheck, usesFilesOrLocalChanges} = require('../common/utils');
 const {isTravisBuild} = require('../common/travis');
 
-const requestPost = utils.promisify(request.post);
+const requestPost = util.promisify(request.post);
 
 const OWNERS_SYNTAX_CHECK_URI =
   'http://ampproject-owners-bot.appspot.com/v0/syntax';
diff --git a/build-system/tasks/check-types.js b/build-system/tasks/check-types.js
index bad9d39e3b2cd..368f7cfc76658 100644
--- a/build-system/tasks/check-types.js
+++ b/build-system/tasks/check-types.js
@@ -28,6 +28,7 @@ const {cleanupBuildDir, closureCompile} = require('../compile/compile');
 const {compileCss} = require('./css');
 const {extensions, maybeInitializeExtensions} = require('./extension-helpers');
 const {maybeUpdatePackages} = require('./update-packages');
+const {transferSrcsToTempDir} = require('./helpers');
 
 /**
  * Dedicated type check path.
@@ -39,6 +40,7 @@ async function checkTypes() {
   process.env.NODE_ENV = 'production';
   cleanupBuildDir();
   maybeInitializeExtensions();
+  transferSrcsToTempDir({isChecktypes: true});
   const compileSrcs = [
     './src/amp.js',
     './src/amp-shadow.js',
@@ -80,7 +82,7 @@ async function checkTypes() {
           {
             include3pDirectories: true,
             includePolyfills: true,
-            extraGlobs: ['src/inabox/*.js'],
+            extraGlobs: ['src/inabox/*.js', '!node_modules/preact'],
             typeCheckOnly: true,
           }
         ),
diff --git a/build-system/tasks/csvify-size/index.js b/build-system/tasks/csvify-size/index.js
index d9375558c15b4..85f56a77355a9 100644
--- a/build-system/tasks/csvify-size/index.js
+++ b/build-system/tasks/csvify-size/index.js
@@ -15,12 +15,13 @@
  */
 'use strict';
 
-const BBPromise = require('bluebird');
 const childProcess = require('child_process');
-const exec = BBPromise.promisify(childProcess.exec);
 const colors = require('ansi-colors');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const log = require('fancy-log');
+const util = require('util');
+
+const exec = util.promisify(childProcess.exec);
 
 const prettyBytesUnits = ['B', 'kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
 
@@ -232,7 +233,7 @@ function serializeCheckout(logs) {
       // all the tables.
       return exec(`git checkout ${sha} ${filePath}`)
         .then(() => {
-          return fs.readFileAsync(`${filePath}`);
+          return fs.promises.readFile(`${filePath}`);
         })
         .then(file => {
           const quotedDateTime = `"${dateTime}"`;
@@ -266,7 +267,7 @@ async function csvifySize() {
     return serializeCheckout(logs.reverse()).then(rows => {
       rows.unshift.apply(rows, tableHeaders);
       const tbl = rows.map(row => row.join(',')).join('\n');
-      return fs.writeFileAsync('test/size.csv', `${tbl}\n`);
+      return fs.promises.writeFile('test/size.csv', `${tbl}\n`);
     });
   });
 }
diff --git a/build-system/tasks/dep-check.js b/build-system/tasks/dep-check.js
index 854f15699415f..172e0ce671774 100644
--- a/build-system/tasks/dep-check.js
+++ b/build-system/tasks/dep-check.js
@@ -16,10 +16,9 @@
 'use strict';
 
 const babelify = require('babelify');
-const BBPromise = require('bluebird');
 const browserify = require('browserify');
 const depCheckConfig = require('../test-configs/dep-check-config');
-const fs = BBPromise.promisifyAll(require('fs-extra'));
+const fs = require('fs-extra');
 const gulp = require('gulp');
 const log = require('fancy-log');
 const minimatch = require('minimatch');
@@ -164,7 +163,7 @@ const rules = depCheckConfig.rules.map(config => new Rule(config));
  */
 function getSrcs() {
   return fs
-    .readdirAsync('extensions')
+    .readdir('extensions')
     .then(dirItems => {
       // Look for extension entry points
       return flatten(
@@ -199,7 +198,7 @@ function getSrcs() {
  */
 function getGraph(entryModule) {
   let resolve;
-  const promise = new BBPromise(r => {
+  const promise = new Promise(r => {
     resolve = r;
   });
   const module = Object.create(null);
@@ -211,10 +210,7 @@ function getGraph(entryModule) {
   const bundler = browserify(entryModule, {
     debug: true,
     fast: true,
-  }).transform(
-    babelify,
-    Object.assign({}, BABELIFY_GLOBAL_TRANSFORM, {compact: false})
-  );
+  }).transform(babelify, {...BABELIFY_GLOBAL_TRANSFORM, compact: false});
 
   bundler.pipeline.get('deps').push(
     through.obj(function(row, enc, next) {
@@ -312,7 +308,7 @@ async function depCheck() {
       // This check is for extension folders that actually dont have
       // an extension entry point module yet.
       entryPoints = entryPoints.filter(x => fs.existsSync(x));
-      return BBPromise.all(entryPoints.map(getGraph));
+      return Promise.all(entryPoints.map(getGraph));
     })
     .then(flattenGraph)
     .then(runRules)
diff --git a/build-system/tasks/dist.js b/build-system/tasks/dist.js
index 70e666abf96a9..d5c4536896099 100644
--- a/build-system/tasks/dist.js
+++ b/build-system/tasks/dist.js
@@ -15,7 +15,6 @@
  */
 
 const colors = require('ansi-colors');
-const conf = require('../compile/build.conf');
 const file = require('gulp-file');
 const fs = require('fs-extra');
 const gulp = require('gulp');
@@ -23,6 +22,7 @@ const log = require('fancy-log');
 const {
   bootstrapThirdPartyFrames,
   compileAllMinifiedJs,
+  compileCoreRuntime,
   compileJs,
   endBuildStep,
   hostname,
@@ -30,6 +30,7 @@ const {
   printConfigHelp,
   printNobuildHelp,
   toPromise,
+  transferSrcsToTempDir,
 } = require('./helpers');
 const {
   createCtrlcHandler,
@@ -43,7 +44,6 @@ const {
   startNailgunServer,
   stopNailgunServer,
 } = require('./nailgun');
-const {BABEL_SRC_GLOBS, SRC_TEMP_DIR} = require('../compile/sources');
 const {buildExtensions, parseExtensionFlags} = require('./extension-helpers');
 const {cleanupBuildDir} = require('../compile/compile');
 const {compileCss, cssEntryPoints} = require('./css');
@@ -55,9 +55,6 @@ const {VERSION} = require('../compile/internal-version');
 const {green, cyan} = colors;
 const argv = require('minimist')(process.argv.slice(2));
 
-const babel = require('@babel/core');
-const globby = require('globby');
-
 const WEB_PUSH_PUBLISHER_FILES = [
   'amp-web-push-helper-frame',
   'amp-web-push-permission-dialog',
@@ -65,35 +62,6 @@ const WEB_PUSH_PUBLISHER_FILES = [
 
 const WEB_PUSH_PUBLISHER_VERSIONS = ['0.1'];
 
-function transferSrcsToTempDir() {
-  log(
-    'Performing multi-pass',
-    colors.cyan('babel'),
-    'transforms in',
-    colors.cyan(SRC_TEMP_DIR)
-  );
-  const files = globby.sync(BABEL_SRC_GLOBS);
-  files.forEach(file => {
-    if (file.startsWith('node_modules/') || file.startsWith('third_party/')) {
-      fs.copySync(file, `${SRC_TEMP_DIR}/${file}`);
-      return;
-    }
-
-    const {code} = babel.transformFileSync(file, {
-      plugins: conf.plugins({
-        isEsmBuild: argv.esm,
-        isForTesting: argv.fortesting,
-      }),
-      retainLines: true,
-      compact: false,
-    });
-    const name = `${SRC_TEMP_DIR}/${file}`;
-    fs.outputFileSync(name, code);
-    process.stdout.write('.');
-  });
-  console.log('\n');
-}
-
 /**
  * Prints a useful help message prior to the gulp dist task
  */
@@ -136,7 +104,7 @@ async function dist() {
   // own processing). Executed after `compileCss` and `compileJison` so their
   // results can be copied too.
   if (!argv.single_pass) {
-    transferSrcsToTempDir();
+    transferSrcsToTempDir({isForTesting: argv.fortesting});
   }
 
   await copyCss();
@@ -145,11 +113,15 @@ async function dist() {
 
   // Steps that use closure compiler. Small ones before large (parallel) ones.
   await startNailgunServer(distNailgunPort, /* detached */ false);
-  await buildExperiments({minify: true, watch: false});
-  await buildLoginDone('0.1', {minify: true, watch: false});
-  await buildWebPushPublisherFiles({minify: true, watch: false});
-  await compileAllMinifiedJs();
-  await buildExtensions({minify: true, watch: false});
+  if (argv.core_runtime_only) {
+    await compileCoreRuntime(/* watch */ false, /* minify */ true);
+  } else {
+    await buildExperiments({minify: true, watch: false});
+    await buildLoginDone('0.1', {minify: true, watch: false});
+    await buildWebPushPublisherFiles({minify: true, watch: false});
+    await compileAllMinifiedJs();
+    await buildExtensions({minify: true, watch: false});
+  }
   await stopNailgunServer(distNailgunPort);
 
   if (argv.esm) {
@@ -160,9 +132,10 @@ async function dist() {
     ]);
   }
 
-  await formatExtractedMessages();
-  await generateFileListing();
-
+  if (!argv.core_runtime_only) {
+    await formatExtractedMessages();
+    await generateFileListing();
+  }
   return exitCtrlcHandler(handlerProcess);
 }
 
@@ -304,7 +277,7 @@ async function generateFileListing() {
   const filesOut = `${distDir}/files.txt`;
   fs.writeFileSync(filesOut, '');
   const files = (await walk(distDir)).map(f => f.replace(`${distDir}/`, ''));
-  fs.writeFileSync(filesOut, files.join('\n'));
+  fs.writeFileSync(filesOut, files.join('\n') + '\n');
   endBuildStep('Generated', filesOut, startTime);
 }
 
@@ -467,6 +440,7 @@ dist.flags = {
   extensions: '  Builds only the listed extensions.',
   extensions_from: '  Builds only the extensions from the listed AMP(s).',
   noextensions: '  Builds with no extensions.',
+  core_runtime_only: '  Builds only the core runtime.',
   single_pass_dest:
     '  The directory closure compiler will write out to ' +
     'with --single_pass mode. The default directory is `dist`',
diff --git a/build-system/tasks/e2e/amp-driver.js b/build-system/tasks/e2e/amp-driver.js
index ceba50d541e31..6f39d22abc98e 100644
--- a/build-system/tasks/e2e/amp-driver.js
+++ b/build-system/tasks/e2e/amp-driver.js
@@ -57,6 +57,8 @@ const EnvironmentBehaviorMap = {
         'swipe',
         'iframeScroll',
       ];
+      // Correctly append extra params in original url
+      url = url.replace('#', '&');
       // TODO(estherkim): somehow allow non-8000 port and domain
       return (
         `http://localhost:8000/examples/viewer.html#href=${url}` +
@@ -72,6 +74,9 @@ const EnvironmentBehaviorMap = {
       const shadowHost = await controller.findElement(
         '.amp-doc-host[style="visibility: visible;"]'
       );
+      const doc = await controller.getDocumentElement();
+      const rect = await controller.getElementRect(shadowHost);
+      await controller./*OK*/ scrollTo(doc, {left: rect.left, top: rect.top});
       await controller.switchToShadow(shadowHost);
     },
 
diff --git a/build-system/tasks/e2e/describes-e2e.js b/build-system/tasks/e2e/describes-e2e.js
index deb314680f139..a42315ca75dd9 100644
--- a/build-system/tasks/e2e/describes-e2e.js
+++ b/build-system/tasks/e2e/describes-e2e.js
@@ -13,7 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
 // import to install chromedriver and geckodriver
 require('chromedriver'); // eslint-disable-line no-unused-vars
 require('geckodriver'); // eslint-disable-line no-unused-vars
@@ -21,12 +20,16 @@ require('geckodriver'); // eslint-disable-line no-unused-vars
 const chrome = require('selenium-webdriver/chrome');
 const firefox = require('selenium-webdriver/firefox');
 const puppeteer = require('puppeteer');
+const {
+  clearLastExpectError,
+  getLastExpectError,
+  installBrowserAssertions,
+} = require('./expect');
 const {
   SeleniumWebDriverController,
 } = require('./selenium-webdriver-controller');
 const {AmpDriver, AmpdocEnvironment} = require('./amp-driver');
-const {Builder, Capabilities} = require('selenium-webdriver');
-const {clearLastExpectError, getLastExpectError} = require('./expect');
+const {Builder, Capabilities, logging} = require('selenium-webdriver');
 const {installRepl, uninstallRepl} = require('./repl');
 const {isTravisBuild} = require('../../common/travis');
 const {PuppeteerController} = require('./puppeteer-controller');
@@ -35,7 +38,7 @@ const {PuppeteerController} = require('./puppeteer-controller');
 const SUB = ' ';
 const TEST_TIMEOUT = 40000;
 const SETUP_TIMEOUT = 30000;
-const SETUP_RETRIES = 1;
+const SETUP_RETRIES = 3;
 const DEFAULT_E2E_INITIAL_RECT = {width: 800, height: 600};
 const supportedBrowsers = new Set(['chrome', 'firefox', 'safari']);
 /**
@@ -45,6 +48,15 @@ const supportedBrowsers = new Set(['chrome', 'firefox', 'safari']);
  */
 const PUPPETEER_BROWSERS = new Set(['chrome']);
 
+/**
+ * Engine types for e2e testing.
+ * @enum {string}
+ */
+const EngineType = {
+  SELENIUM: 'selenium',
+  PUPPETEER: 'puppeteer',
+};
+
 /**
  * @typedef {{
  *  browsers: string,
@@ -71,18 +83,6 @@ let SeleniumConfigDef;
 /** @const {?DescribesConfigDef} */
 let describesConfig = null;
 
-/**
- * Map the browserName to the capabilities name. (firefox for example has a
- * prefix.
- *
- * @enum {string}
- */
-const capabilitiesKeys = {
-  'chrome': 'chromeOptions',
-  'firefox': 'moz:firefoxOptions',
-  'safari': 'safariOptions',
-};
-
 /**
  * Configure all tests. This may only be called once, since it is only read once
  * and writes after reading will not have any effect.
@@ -93,7 +93,7 @@ function configure(config) {
     throw new Error('describes.configure should only be called once');
   }
 
-  describesConfig = Object.assign({}, config);
+  describesConfig = {...config};
 }
 
 /**
@@ -130,9 +130,9 @@ async function createPuppeteer(opt_config = {}) {
  * @param {string} browserName
  * @param {!SeleniumConfigDef=} args
  * @param {?string} deviceName
- * @return {!SeleniumDriver}
+ * @return {!WebDriver}
  */
-async function createSelenium(browserName, args = {}, deviceName) {
+function createSelenium(browserName, args = {}, deviceName) {
   switch (browserName) {
     case 'safari':
       // Safari's only option is setTechnologyPreview
@@ -145,11 +145,19 @@ async function createSelenium(browserName, args = {}, deviceName) {
   }
 }
 
-async function createDriver(browserName, args, deviceName) {
+/**
+ *
+ * @param {string} browserName
+ * @param {!SeleniumConfigDef=} args
+ * @param {?string} deviceName
+ * @return {!WebDriver}
+ */
+function createDriver(browserName, args, deviceName) {
   const capabilities = Capabilities[browserName]();
-  capabilities.set(capabilitiesKeys[browserName], {'args': args});
-  const builder = new Builder().withCapabilities(capabilities);
 
+  const prefs = new logging.Preferences();
+  prefs.setLevel(logging.Type.PERFORMANCE, logging.Level.ALL);
+  capabilities.setLoggingPrefs(prefs);
   switch (browserName) {
     case 'firefox':
       const firefoxOptions = new firefox.Options();
@@ -158,17 +166,22 @@ async function createDriver(browserName, args, deviceName) {
         width: DEFAULT_E2E_INITIAL_RECT.width,
         height: DEFAULT_E2E_INITIAL_RECT.height,
       });
-      builder.setFirefoxOptions(firefoxOptions);
+      return new Builder()
+        .forBrowser('firefox')
+        .setFirefoxOptions(firefoxOptions)
+        .build();
     case 'chrome':
-      const chromeOptions = new chrome.Options();
+      const chromeOptions = new chrome.Options(capabilities);
       chromeOptions.addArguments(args);
       if (deviceName) {
         chromeOptions.setMobileEmulation({deviceName});
       }
-      builder.setChromeOptions(chromeOptions);
+      const driver = chrome.Driver.createSession(chromeOptions);
+      //TODO(estherkim): workaround. `onQuit()` was added in selenium-webdriver v4.0.0-alpha.5
+      //which is also when `Server terminated early with status 1` began appearing. Coincidence? Maybe.
+      driver.onQuit = null;
+      return driver;
   }
-
-  return await builder.build();
 }
 
 /**
@@ -371,7 +384,7 @@ function describeEnv(factory) {
         ? new Set(browsers.split(',').map(x => x.trim()))
         : supportedBrowsers;
 
-      if (engine === 'puppeteer') {
+      if (engine === EngineType.PUPPETEER) {
         const result = intersect(allowedBrowsers, PUPPETEER_BROWSERS);
         if (result.size === 0) {
           const browsersList = Array.from(allowedBrowsers).join(',');
@@ -483,33 +496,20 @@ class EndToEndFixture {
    * @param {number} retries
    */
   async setup(env, browserName, retries = 0) {
-    try {
-      const {testUrl, experiments = [], initialRect, deviceName} = this.spec;
-      const config = getConfig();
-      const controller = await getController(config, browserName, deviceName);
-      const ampDriver = new AmpDriver(controller);
-      env.controller = controller;
-      env.ampDriver = ampDriver;
-
-      const {environment} = env;
-
-      const url = new URL(testUrl);
-      if (experiments.length > 0) {
-        if (environment.includes('inabox')) {
-          // inabox experiments are toggled at server side using <meta> tag
-          url.searchParams.set('exp', experiments.join(','));
-        } else {
-          // AMP doc experiments are toggled via cookies
-          await toggleExperiments(ampDriver, url.href, experiments);
-        }
-      }
-
-      if (initialRect) {
-        const {width, height} = initialRect;
-        await controller.setWindowRect({width, height});
-      }
+    const config = getConfig();
+    const driver = getDriver(config, browserName, this.spec.deviceName);
+    const controller =
+      config.engine == EngineType.PUPPETEER
+        ? new PuppeteerController(driver)
+        : new SeleniumWebDriverController(driver);
+    const ampDriver = new AmpDriver(controller);
+    env.controller = controller;
+    env.ampDriver = ampDriver;
+
+    installBrowserAssertions(controller.networkLogger);
 
-      await ampDriver.navigateToEnvironment(environment, url.href);
+    try {
+      await setUpTest(env, this.spec);
     } catch (ex) {
       if (retries > 0) {
         await this.setup(env, browserName, --retries);
@@ -521,7 +521,7 @@ class EndToEndFixture {
 
   async teardown(env) {
     const {controller} = env;
-    if (controller) {
+    if (controller && controller.driver) {
       await controller.switchToParent();
       await controller.dispose();
     }
@@ -529,28 +529,49 @@ class EndToEndFixture {
 }
 
 /**
- * Get the controller object for the configured engine.
+ * Get the driver for the configured engine.
  * @param {!DescribesConfigDef} describesConfig
  * @param {string} browserName
  * @param {?string} deviceName
- * @return {!SeleniumWebDriverController}
+ * @return {!ThenableWebDriver}
  */
-async function getController(
-  {engine = 'selenium', headless = false},
+function getDriver(
+  {engine = EngineType.SELENIUM, headless = false},
   browserName,
   deviceName
 ) {
-  if (engine == 'puppeteer') {
-    const browser = await createPuppeteer({headless});
-    return new PuppeteerController(browser);
+  if (engine == EngineType.PUPPETEER) {
+    return createPuppeteer({headless});
   }
 
-  if (engine == 'selenium') {
-    const driver = await createSelenium(browserName, {headless}, deviceName);
-    return new SeleniumWebDriverController(driver);
+  if (engine == EngineType.SELENIUM) {
+    return createSelenium(browserName, {headless}, deviceName);
   }
 }
 
+async function setUpTest(
+  {environment, ampDriver, controller},
+  {testUrl, experiments = [], initialRect}
+) {
+  const url = new URL(testUrl);
+  if (experiments.length > 0) {
+    if (environment.includes('inabox')) {
+      // inabox experiments are toggled at server side using <meta> tag
+      url.searchParams.set('exp', experiments.join(','));
+    } else {
+      // AMP doc experiments are toggled via cookies
+      await toggleExperiments(ampDriver, url.href, experiments);
+    }
+  }
+
+  if (initialRect) {
+    const {width, height} = initialRect;
+    await controller.setWindowRect({width, height});
+  }
+
+  await ampDriver.navigateToEnvironment(environment, url.href);
+}
+
 /**
  * Toggle the given experiments for the given test URL domain.
  * @param {!AmpDriver} ampDriver
diff --git a/build-system/tasks/e2e/expect.js b/build-system/tasks/e2e/expect.js
index 4ea117904b5b8..324ed20d19788 100644
--- a/build-system/tasks/e2e/expect.js
+++ b/build-system/tasks/e2e/expect.js
@@ -15,10 +15,12 @@
  */
 
 const chai = require('chai');
+chai.use(require('chai-as-promised'));
 const {ControllerPromise} = require('./controller-promise');
 
 let installed;
 let lastExpectError;
+let networkLogger;
 
 function clearLastExpectError() {
   lastExpectError = null;
@@ -236,8 +238,45 @@ function overwriteUnsupported(_super) {
   };
 }
 
+function installBrowserAssertions(_networkLogger) {
+  networkLogger = _networkLogger;
+  chai.use(installBrowserWrappers);
+}
+
+function installBrowserWrappers(chai, utils) {
+  const {Assertion} = chai;
+  const should = chai.should(); // eslint-disable-line no-unused-vars
+
+  // Assert that a request with a testUrl was sent
+  // Example usage: await expect(testUrl).to.have.been.sent;
+  utils.addProperty(Assertion.prototype, 'sent', function() {
+    const assertAnySentRequests = function(url) {
+      const promise = networkLogger.getSentRequests(url);
+      return promise.should.eventually.not.have.length(0);
+    };
+
+    this.assert(
+      assertAnySentRequests(this._obj),
+      'expected #{this} to have been sent',
+      'expected #{this} to have been sent'
+    );
+  });
+
+  // Assert that a request was sent n number of times
+  // Example usage: await expect(testUrl).to.have.sentCount(n);
+  utils.addMethod(Assertion.prototype, 'sentCount', function(count) {
+    const assertSentCount = function(url, count) {
+      const promise = networkLogger.getSentRequests(url);
+      return promise.should.eventually.have.length(count);
+    };
+
+    this.assert(assertSentCount(this._obj, count));
+  });
+}
+
 module.exports = {
   clearLastExpectError,
   expect,
   getLastExpectError,
+  installBrowserAssertions,
 };
diff --git a/build-system/tasks/e2e/network-logger.js b/build-system/tasks/e2e/network-logger.js
new file mode 100644
index 0000000000000..86c21935b14e7
--- /dev/null
+++ b/build-system/tasks/e2e/network-logger.js
@@ -0,0 +1,67 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {logging} from 'selenium-webdriver';
+
+/** @enum {string} */
+const PerformanceMethods = {
+  'FRAME_ATTACHED': 'Page.frameAttached',
+  'FRAME_NAVIGATED': 'Page.frameNavigated',
+  'FRAME_STARTED_LOADING': 'Page.frameStartedLoading',
+  'FRAME_STOPPED_LOADING': 'Page.frameStoppedLoading',
+  'RESPONSE_RECEIVED': 'Network.responseReceived',
+  'REQUEST_WILL_BE_SENT': 'Network.requestWillBeSent',
+  'WINDOW_OPEN': 'Network.windowOpen',
+};
+
+class NetworkLogger {
+  /** @param {!WebDriver} driver */
+  constructor(driver) {
+    /** @type {WebDriver} */
+    this.driver_ = driver;
+  }
+
+  async getEntries_(networkMethod) {
+    const entries = await this.driver_
+      .manage()
+      .logs()
+      .get(logging.Type.PERFORMANCE);
+
+    return entries.filter(entry => {
+      const json = JSON.parse(entry.message);
+      entry.message = json.message;
+      return entry.message.method == networkMethod;
+    });
+  }
+
+  /**
+   * Gets sent requests with an optional url to filter by.
+   * @param {string=} url
+   * @return {Array<logging.Entry>}
+   */
+  async getSentRequests(url) {
+    const entries = await this.getEntries_(
+      PerformanceMethods.REQUEST_WILL_BE_SENT
+    );
+    if (url) {
+      return entries.filter(entry => entry.message.params.request.url == url);
+    }
+    return entries;
+  }
+}
+
+module.exports = {
+  NetworkLogger,
+};
diff --git a/build-system/tasks/e2e/package.json b/build-system/tasks/e2e/package.json
index 20d91dc2e4415..8343702fd24c3 100644
--- a/build-system/tasks/e2e/package.json
+++ b/build-system/tasks/e2e/package.json
@@ -4,11 +4,11 @@
   "version": "0.1.0",
   "description": "Gulp e2e",
   "devDependencies": {
-    "@babel/register": "7.7.0",
+    "@babel/register": "7.8.3",
     "babel-regenerator-runtime": "6.5.0",
-    "chromedriver": "78.0.1",
-    "puppeteer": "2.0.0",
+    "chromedriver": "79.0.2",
+    "puppeteer": "2.1.0",
     "geckodriver": "1.19.1",
-    "selenium-webdriver": "4.0.0-alpha.4"
+    "selenium-webdriver": "4.0.0-alpha.5"
   }
 }
diff --git a/build-system/tasks/e2e/puppeteer-controller.js b/build-system/tasks/e2e/puppeteer-controller.js
index 87d52b6839b98..1da6a6e3b8097 100644
--- a/build-system/tasks/e2e/puppeteer-controller.js
+++ b/build-system/tasks/e2e/puppeteer-controller.js
@@ -301,8 +301,11 @@ class PuppeteerController {
     this.isXpathInstalled_ = true;
 
     const scripts = await Promise.all([
-      fs.readFileAsync('third_party/wgxpath/wgxpath.js', 'utf8'),
-      fs.readFileAsync('build-system/tasks/e2e/driver/query-xpath.js', 'utf8'),
+      fs.promises.readFile('third_party/wgxpath/wgxpath.js', 'utf8'),
+      fs.promises.readFile(
+        'build-system/tasks/e2e/driver/query-xpath.js',
+        'utf8'
+      ),
     ]);
     const frame = await this.getCurrentFrame_();
     await frame.evaluate(scripts.join('\n\n'));
diff --git a/build-system/tasks/e2e/selenium-webdriver-controller.js b/build-system/tasks/e2e/selenium-webdriver-controller.js
index 72658531b4462..cff59c61c88f1 100644
--- a/build-system/tasks/e2e/selenium-webdriver-controller.js
+++ b/build-system/tasks/e2e/selenium-webdriver-controller.js
@@ -23,6 +23,7 @@ const {
 const {By, Condition, Key: SeleniumKey, error} = require('selenium-webdriver');
 const {ControllerPromise} = require('./controller-promise');
 const {expect} = require('chai');
+const {NetworkLogger} = require('./network-logger');
 
 const {NoSuchElementError} = error;
 
@@ -85,6 +86,8 @@ class SeleniumWebDriverController {
   constructor(driver) {
     this.driver = driver;
 
+    this.networkLogger = new NetworkLogger(driver);
+
     /** @private {?WebElement} */
     this.shadowRoot_ = null;
 
@@ -231,8 +234,11 @@ class SeleniumWebDriverController {
     this.isXpathInstalled_ = true;
 
     const scripts = await Promise.all([
-      fs.readFileAsync('third_party/wgxpath/wgxpath.js', 'utf8'),
-      fs.readFileAsync('build-system/tasks/e2e/driver/query-xpath.js', 'utf8'),
+      fs.promises.readFile('third_party/wgxpath/wgxpath.js', 'utf8'),
+      fs.promises.readFile(
+        'build-system/tasks/e2e/driver/query-xpath.js',
+        'utf8'
+      ),
     ]);
     await this.driver.executeScript(scripts.join('\n\n'));
   }
diff --git a/build-system/tasks/e2e/yarn.lock b/build-system/tasks/e2e/yarn.lock
index 4215617b3ce8d..cfd5e3b8f0a98 100644
--- a/build-system/tasks/e2e/yarn.lock
+++ b/build-system/tasks/e2e/yarn.lock
@@ -2,10 +2,10 @@
 # yarn lockfile v1
 
 
-"@babel/register@7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/register/-/register-7.7.0.tgz#4e23ecf840296ef79c605baaa5c89e1a2426314b"
-  integrity sha512-HV3GJzTvSoyOMWGYn2TAh6uL6g+gqKTgEZ99Q3+X9UURT1VPT/WcU46R61XftIc5rXytcOHZ4Z0doDlsjPomIg==
+"@babel/register@7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/register/-/register-7.8.3.tgz#5d5d30cfcc918437535d724b8ac1e4a60c5db1f8"
+  integrity sha512-t7UqebaWwo9nXWClIPLPloa5pN33A2leVs8Hf0e9g9YwUP8/H9NeR7DJU+4CXo23QtjChQv5a3DjEtT83ih1rg==
   dependencies:
     find-cache-dir "^2.0.0"
     lodash "^4.17.13"
@@ -13,6 +13,11 @@
     pirates "^4.0.0"
     source-map-support "^0.5.16"
 
+"@testim/chrome-version@^1.0.3":
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/@testim/chrome-version/-/chrome-version-1.0.6.tgz#e56c1a7f463ee6ceab363b69b642681efcedb809"
+  integrity sha512-sudmtuzBC6MduzAZe3dzc8Ehhtr0Wk/nDjCDBOWsZ5noSLBsdUED+NLuq2eUHHDb5B0FqXwTitAzoLoVZNQUeg==
+
 "@types/events@*":
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/@types/events/-/events-3.0.0.tgz#2862f3f58a9a7f7c3e78d79f130dd4d71c25c2a7"
@@ -27,6 +32,11 @@
     "@types/minimatch" "*"
     "@types/node" "*"
 
+"@types/mime-types@^2.1.0":
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/@types/mime-types/-/mime-types-2.1.0.tgz#9ca52cda363f699c69466c2a6ccdaad913ea7a73"
+  integrity sha1-nKUs2jY/aZxpRmwqbM2q2RPqenM=
+
 "@types/minimatch@*":
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
@@ -42,6 +52,11 @@ adm-zip@0.4.11:
   resolved "https://registry.yarnpkg.com/adm-zip/-/adm-zip-0.4.11.tgz#2aa54c84c4b01a9d0fb89bb11982a51f13e3d62a"
   integrity sha512-L8vcjDTCOIJk7wFvmlEUN7AsSb8T+2JrdP7KINBjzr24TJ5Mwj590sLu3BC7zNZowvJWa/JtPmD8eJCzdtDWjA==
 
+agent-base@5:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-5.1.1.tgz#e8fb3f242959db44d63be665db7a8e739537a32c"
+  integrity sha512-TMeqbNl2fMW0nMjTEPOwe3J/PRFP4vqeoNuQMG0HlMrtm5QxKqdvAkZ1pRBQ/ulIyDD5Yq0nJ7YbdD8ey0TO3g==
+
 agent-base@^4.3.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.3.0.tgz#8165f01c436009bccad0b1d122f05ed770efc6ee"
@@ -153,11 +168,12 @@ chownr@^1.0.1:
   resolved "https://registry.yarnpkg.com/chownr/-/chownr-1.1.1.tgz#54726b8b8fff4df053c42187e801fb4412df1494"
   integrity sha512-j38EvO5+LHX84jlo6h4UzmOwi0UgW61WRyPtJz4qaadK5eY3BTS5TY/S1Stc3Uk2lIM6TPevAlULiEJwie860g==
 
-chromedriver@78.0.1:
-  version "78.0.1"
-  resolved "https://registry.yarnpkg.com/chromedriver/-/chromedriver-78.0.1.tgz#2db3425a2cba6fcaf1a41d9538b16c3d06fa74a8"
-  integrity sha512-eOsyFk4xb9EECs1VMrDbxO713qN+Bu1XUE8K9AuePc3839TPdAegg72kpXSzkeNqRNZiHbnJUItIVCLFkDqceA==
+chromedriver@79.0.2:
+  version "79.0.2"
+  resolved "https://registry.yarnpkg.com/chromedriver/-/chromedriver-79.0.2.tgz#abcd7f95203e70eef28bb26696281c6f0cc3c1ea"
+  integrity sha512-jwgmcTb4UI2cqDAyJBJlGJ/Y6kRVO1VQ3sBw73fFz0TEqKSZfl61ToM53g+G8m5AWVa4ESFkSXEUfQtFZZ6QTA==
   dependencies:
+    "@testim/chrome-version" "^1.0.3"
     del "^4.1.1"
     extract-zip "^1.6.7"
     mkdirp "^0.5.1"
@@ -217,6 +233,13 @@ debug@2.6.9:
   dependencies:
     ms "2.0.0"
 
+debug@4, debug@^4.1.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
+  dependencies:
+    ms "^2.1.1"
+
 debug@4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.0.tgz#373687bffa678b38b1cd91f861b63850035ddc87"
@@ -231,13 +254,6 @@ debug@^3.1.0:
   dependencies:
     ms "^2.1.1"
 
-debug@^4.1.0:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
-  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
-  dependencies:
-    ms "^2.1.1"
-
 deep-is@^0.1.3:
   version "0.1.3"
   resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
@@ -472,13 +488,13 @@ https-proxy-agent@3.0.0:
     agent-base "^4.3.0"
     debug "^3.1.0"
 
-https-proxy-agent@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-3.0.1.tgz#b8c286433e87602311b01c8ea34413d856a4af81"
-  integrity sha512-+ML2Rbh6DAuee7d07tYGEKOEi2voWPUGan+ExdPbPW6Z3svq+JCqr0v8WmKPOkz1vOVykPCBSuobe7G8GJUtVg==
+https-proxy-agent@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-4.0.0.tgz#702b71fb5520a132a66de1f67541d9e62154d82b"
+  integrity sha512-zoDhWrkR3of1l9QAL8/scJZyLu8j/gBkcwcaQOZh7Gyh/+uJQzGVETdgT30akuwkpL8HTRfssqI3BZuV18teDg==
   dependencies:
-    agent-base "^4.3.0"
-    debug "^3.1.0"
+    agent-base "5"
+    debug "4"
 
 immediate@~3.0.5:
   version "3.0.6"
@@ -649,6 +665,11 @@ make-dir@^2.0.0, make-dir@^2.1.0:
     pify "^4.0.1"
     semver "^5.6.0"
 
+mime-db@1.43.0:
+  version "1.43.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.43.0.tgz#0a12e0502650e473d735535050e7c8f4eb4fae58"
+  integrity sha512-+5dsGEEovYbT8UY9yD7eE4XTc4UwJ1jBYlgaQQF38ENsKR3wj/8q8RFZrF9WIZpB2V1ArTVFUva8sAul1NzRzQ==
+
 mime-db@~1.37.0:
   version "1.37.0"
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.37.0.tgz#0b6a0ce6fdbe9576e25f1f2d2fde8830dc0ad0d8"
@@ -661,6 +682,13 @@ mime-types@^2.1.12, mime-types@~2.1.19:
   dependencies:
     mime-db "~1.37.0"
 
+mime-types@^2.1.25:
+  version "2.1.26"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.26.tgz#9c921fc09b7e149a65dfdc0da4d20997200b0a06"
+  integrity sha512-01paPWYgLrkqAyrlDorC1uDwl2p3qZT7yl806vW7DvDoxwXi46jsjFbg+WdwotBIk6/MbEhO/dh5aZ5sNj/dWQ==
+  dependencies:
+    mime-db "1.43.0"
+
 mime@^2.0.3:
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/mime/-/mime-2.4.0.tgz#e051fd881358585f3279df333fe694da0bcffdd6"
@@ -874,15 +902,17 @@ punycode@^2.1.0:
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
   integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==
 
-puppeteer@2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-2.0.0.tgz#0612992e29ec418e0a62c8bebe61af1a64d7ec01"
-  integrity sha512-t3MmTWzQxPRP71teU6l0jX47PHXlc4Z52sQv4LJQSZLq1ttkKS2yGM3gaI57uQwZkNaoGd0+HPPMELZkcyhlqA==
+puppeteer@2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-2.1.0.tgz#c10cabc5525f57c6766eed4f3006b6e10afcafc1"
+  integrity sha512-PC4oKMtwAElo8YtS/cYnk2/dew/3TonsGKKzjpFLWwkhBCteFsOZCVOXTt2QlP6w53mH0YsJE+fPLPzOW+DCug==
   dependencies:
+    "@types/mime-types" "^2.1.0"
     debug "^4.1.0"
     extract-zip "^1.6.6"
-    https-proxy-agent "^3.0.0"
+    https-proxy-agent "^4.0.0"
     mime "^2.0.3"
+    mime-types "^2.1.25"
     progress "^2.0.1"
     proxy-from-env "^1.0.0"
     rimraf "^2.6.1"
@@ -962,10 +992,10 @@ sax@>=0.6.0:
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
   integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
 
-selenium-webdriver@4.0.0-alpha.4:
-  version "4.0.0-alpha.4"
-  resolved "https://registry.yarnpkg.com/selenium-webdriver/-/selenium-webdriver-4.0.0-alpha.4.tgz#73694490e02c941d9d0bf7a36f7c49beb9372512"
-  integrity sha512-etJt20d8qInkxMAHIm5SEpPBSS+CdxVcybnxzSIB/GlWErb8pIWrArz/VA6VfUW0/6tIcokepXQ5ufvdzqqk1A==
+selenium-webdriver@4.0.0-alpha.5:
+  version "4.0.0-alpha.5"
+  resolved "https://registry.yarnpkg.com/selenium-webdriver/-/selenium-webdriver-4.0.0-alpha.5.tgz#e4683b3dbf827d70df09a7e43bf02ebad20fa7c1"
+  integrity sha512-hktl3DSrhzM59yLhWzDGHIX9o56DvA+cVK7Dw6FcJR6qQ4CGzkaHeXQPcdrslkWMTeq0Ci9AmCxq0EMOvm2Rkg==
   dependencies:
     jszip "^3.1.5"
     rimraf "^2.6.3"
diff --git a/build-system/tasks/extension-generator/extension-doc.template.md b/build-system/tasks/extension-generator/extension-doc.template.md
index f80bc4a10a359..9d8b492cbd2a7 100644
--- a/build-system/tasks/extension-generator/extension-doc.template.md
+++ b/build-system/tasks/extension-generator/extension-doc.template.md
@@ -61,16 +61,20 @@ limitations under the License.
   formats, include and filter multiple content blocks and code samples.
 -->
 
+## Usage
+
+One to three paragraph explaining the component usage. List important functionality. Explain why developers care about it.
+
 [filter formats=“websites”]
 
 Below is an example for websites.
 
-[example preview="inline" playground="true" imports="amp-component-name"]
+[example preview="inline" playground="true" imports="${name}"]
 
 ```html
-<amp-component-name required-attribute>
+<${name} required-attribute>
   I am a hello world inline executable code sample for websites!
-</amp-component-name>
+</${name}>
 ```
 
 [/example][/filter]
@@ -84,28 +88,24 @@ Below is an example for websites.
 
 Below is an example for ads.
 
-[example preview=“inline” playground=“true” imports="amp-component-name"]
+[example preview=“inline” playground=“true” imports="${name}"]
 
 ```html
-<amp-component-name required-attribute>
+<${name} required-attribute>
   I am a hello world inline executable code sample for ads!
-</amp-component-name>
+</${name}>
 ```
 
 [/example][/filter]
 
-## Usage
-
-One to three paragraph explaining the component usage. List important functionality. Explain why developers care about it.
-
 ### Behavior users should be aware of (optional)
 
 What to do if they want behavior. How to work around it.
 
 ```html
-<amp-component-name required-attribute>
+<${name} required-attribute>
   Code sample of behavior or behavior workaround.
-</amp-component-name>
+</${name}>
 ```
 
 ### Behavior restrictions
@@ -114,43 +114,49 @@ What is allowed, what isn't.
 
 ## Attributes
 
-### attribute-name
+### `attribute-name`
 
 Description of attribute. Use cases for this attribute.
 
-- `attribute-value-option-one` (default): `attribute-option-one-value` does this to `amp-component-name`.
-- `attribute-value-option-two`: `attribute-option-two-value` does this to `amp-component-name`.
+- `attribute-value-option-one` (default): `attribute-option-one-value` does this to `${name}`.
+- `attribute-value-option-two`: `attribute-option-two-value` does this to `${name}`.
 
 ### `optional-attribute-name` (optional)
 
-Here, I write what `optional-attribute-name` will do to `amp-component-name`.
+Here, I write what `optional-attribute-name` will do to `${name}`.
 
 ## Actions (optional)
 
-### action-name
+### `action-name`
 
-Description of action. Use cases of `action-name`. Include all the nuances, such as: `amp-component-name` needs to be identified with an `id` to work.
+Description of action. Use cases of `action-name`. Include all the nuances, such as: `${name}` needs to be identified with an `id` to work.
 
 ## Events (optional)
 
-### event-name
+### `event-name`
 
-Description of event. Use cases of event-name. Include all the nuances, such as: `amp-component-name` needs to be identified with an `id` to work.
+Description of event. Use cases of event-name. Include all the nuances, such as: `${name}` needs to be identified with an `id` to work.
 
 [example preview=”top-frame” playground=”true”]
 
 ```html
 <head>
-     <amp-component-name script tag>
+  <script
+    custom-element="${name}"
+    async
+    src="https://cdn.ampproject.org/v0/${name}-latest.js"
+  ></script>
 </head>
 <body>
-     <amp-component-name required-attribute
-       on="event-name: my-button.show">
-          Hello World!
-     </amp-component-name>
-     <button id="my-button" hidden>
-         Here I am!
-    </button>
+  <${name}
+    required-attribute
+    on="event-name: my-button.show"
+  >
+    Hello World!
+  </${name}>
+  <button id="my-button" hidden>
+    Here I am!
+  </button>
 </body>
 ```
 
@@ -170,7 +176,7 @@ Explain analytics.
 
 ## Accessibility (optional)
 
-Accessibility information related to `amp-component-name`.
+Accessibility information related to `${name}`.
 
 ## Validation
 
diff --git a/build-system/tasks/extension-helpers.js b/build-system/tasks/extension-helpers.js
index d219d9e60c9a4..9bc024a3a7650 100644
--- a/build-system/tasks/extension-helpers.js
+++ b/build-system/tasks/extension-helpers.js
@@ -109,11 +109,13 @@ function declareExtension(
   const defaultOptions = {hasCss: false};
   const versions = Array.isArray(version) ? version : [version];
   versions.forEach(v => {
-    extensionsObject[`${name}-${v}`] = Object.assign(
-      {name, version: v, latestVersion},
-      defaultOptions,
-      options
-    );
+    extensionsObject[`${name}-${v}`] = {
+      name,
+      version: v,
+      latestVersion,
+      ...defaultOptions,
+      ...options,
+    };
     if (includeLatest && v == latestVersion) {
       extensionsObject[`${name}-latest`] = extensionsObject[`${name}-${v}`];
     }
@@ -151,6 +153,19 @@ function maybeInitializeExtensions(
   }
 }
 
+/**
+ * Set the extensions to build from example documents
+ * (for internal use by `gulp performance`)
+ *
+ * @param {Array<string>} examples Path to example documents
+ */
+function setExtensionsToBuildFromDocuments(examples) {
+  extensionsToBuild = dedupe([
+    ...DEFAULT_EXTENSION_SET,
+    ...getExtensionsFromArg(examples.join(',')),
+  ]);
+}
+
 /**
  * Process the command line arguments --noextensions, --extensions, and
  * --extensions_from and return a list of the referenced extensions.
@@ -202,6 +217,10 @@ function parseExtensionFlags(preBuild = false) {
   }
 
   const buildOrPreBuild = preBuild ? 'pre-build' : 'build';
+  const coreRuntimeOnlyMessage =
+    green('⤷ Use ') +
+    cyan('--core_runtime_only ') +
+    green('to build just the core runtime.');
   const noExtensionsMessage =
     green('⤷ Use ') +
     cyan('--noextensions ') +
@@ -221,7 +240,9 @@ function parseExtensionFlags(preBuild = false) {
     cyan('foo.amp.html') +
     green('.');
 
-  if (preBuild) {
+  if (argv.core_runtime_only) {
+    log(green('Building just the core runtime.'));
+  } else if (preBuild) {
     log(
       green('Pre-building extension(s):'),
       cyan(getExtensionsToBuild(preBuild).join(', '))
@@ -240,6 +261,7 @@ function parseExtensionFlags(preBuild = false) {
     } else {
       log(green('Building all AMP extensions.'));
     }
+    log(coreRuntimeOnlyMessage);
     log(noExtensionsMessage);
     log(extensionsMessage);
     log(inaboxSetMessage);
@@ -334,7 +356,7 @@ async function buildExtensions(options) {
  */
 async function doBuildExtension(extensions, extension, options) {
   const e = extensions[extension];
-  let o = Object.assign({}, options);
+  let o = {...options};
   o = Object.assign(o, e);
   await buildExtension(
     e.name,
@@ -392,7 +414,7 @@ async function buildExtension(
         version,
         latestVersion,
         hasCss,
-        Object.assign({}, options, {continueOnError: true})
+        {...options, continueOnError: true}
       );
       if (options.onWatchBuild) {
         options.onWatchBuild(bundleComplete);
@@ -407,14 +429,12 @@ async function buildExtension(
       return;
     }
   }
-  if (argv.single_pass) {
-    return;
-  } else {
-    await buildExtensionJs(path, name, version, latestVersion, options);
-  }
   if (name === 'amp-analytics') {
     await vendorConfigs(options);
   }
+  if (!argv.single_pass) {
+    await buildExtensionJs(path, name, version, latestVersion, options);
+  }
 }
 
 /**
@@ -530,4 +550,5 @@ module.exports = {
   getExtensionsToBuild,
   maybeInitializeExtensions,
   parseExtensionFlags,
+  setExtensionsToBuildFromDocuments,
 };
diff --git a/build-system/tasks/generate-vendor-jsons.js b/build-system/tasks/generate-vendor-jsons.js
index c9f6f3c086478..cc8b5c45a6c13 100644
--- a/build-system/tasks/generate-vendor-jsons.js
+++ b/build-system/tasks/generate-vendor-jsons.js
@@ -59,11 +59,8 @@ function generateVendorJsons() {
       }
 
       // convert object to JSON string with indentation of 2 spaces
-      const configString = JSON.stringify(
-        ANALYTICS_CONFIG[vendorName],
-        null,
-        2
-      );
+      const configString =
+        JSON.stringify(ANALYTICS_CONFIG[vendorName], null, 2) + '\n';
       const fileName = vendorName + '.json';
 
       promises.push(
@@ -92,12 +89,13 @@ function generateVendorJsons() {
 
 function generateCanaryBgJson_(analyticsConfig, destPath) {
   // generate separate canary JSON file for Bolt Guard (BG)
-  const bgCanaryConfig = Object.assign({}, analyticsConfig['bg'], {
+  const bgCanaryConfig = {
+    ...analyticsConfig['bg'],
     'transport': {
       'iframe':
         'https://tpc.googlesyndication.com/b4a/experimental/b4a-runner.html',
     },
-  });
+  };
   const bgCanaryConfigStr = JSON.stringify(bgCanaryConfig, null, 2);
 
   return toPromise(
diff --git a/build-system/tasks/helpers.js b/build-system/tasks/helpers.js
index 23972e5980dc6..df3cea12e09cf 100644
--- a/build-system/tasks/helpers.js
+++ b/build-system/tasks/helpers.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+const babel = require('@babel/core');
 const babelify = require('babelify');
 const browserify = require('browserify');
 const buffer = require('vinyl-buffer');
@@ -22,8 +23,11 @@ const conf = require('../compile/build.conf');
 const del = require('del');
 const file = require('gulp-file');
 const fs = require('fs-extra');
+const globby = require('globby');
 const gulp = require('gulp');
+const gulpIf = require('gulp-if');
 const gulpWatch = require('gulp-watch');
+const istanbul = require('gulp-istanbul');
 const log = require('fancy-log');
 const path = require('path');
 const regexpSourcemaps = require('gulp-regexp-sourcemaps');
@@ -37,6 +41,7 @@ const {
 } = require('../compile/internal-version');
 const {altMainBundles, jsBundles} = require('../compile/bundles.config');
 const {applyConfig, removeConfig} = require('./prepend-global/index.js');
+const {BABEL_SRC_GLOBS, SRC_TEMP_DIR} = require('../compile/sources');
 const {closureCompile} = require('../compile/compile');
 const {isTravisBuild} = require('../common/travis');
 const {thirdPartyFrames} = require('../test-configs/config');
@@ -135,7 +140,7 @@ function doBuildJs(jsBundles, name, extraOptions) {
       target.srcDir,
       target.srcFilename,
       extraOptions.minify ? target.minifiedDestDir : target.destDir,
-      Object.assign({}, target.options, extraOptions)
+      {...target.options, ...extraOptions}
     );
   } else {
     return Promise.reject(red('Error:'), 'Could not find', cyan(name));
@@ -171,6 +176,23 @@ async function bootstrapThirdPartyFrames(watch, minify) {
   );
 }
 
+/**
+ * Compile and optionally minify the core runtime.
+ * @param {boolean} watch
+ * @param {boolean} minify
+ * @return {!Promise}
+ */
+async function compileCoreRuntime(watch, minify) {
+  await doBuildJs(jsBundles, 'amp.js', {
+    watch,
+    minify,
+    wrapper: wrappers.mainBinary,
+    singlePassCompilation: argv.single_pass,
+    esmPassCompilation: argv.esm,
+    includeOnlyESMLevelPolyfills: argv.esm,
+  });
+}
+
 /**
  * Compile and optionally minify the stylesheets and the scripts for the runtime
  * and drop them in the dist folder
@@ -178,18 +200,10 @@ async function bootstrapThirdPartyFrames(watch, minify) {
  * @param {boolean} minify
  * @return {!Promise}
  */
-function compileAllJs(watch, minify) {
+async function compileAllJs(watch, minify) {
   const startTime = Date.now();
-  return Promise.all([
+  await Promise.all([
     minify ? Promise.resolve() : doBuildJs(jsBundles, 'polyfills.js', {watch}),
-    doBuildJs(jsBundles, 'amp.js', {
-      watch,
-      minify,
-      wrapper: wrappers.mainBinary,
-      singlePassCompilation: argv.single_pass,
-      esmPassCompilation: argv.esm,
-      includeOnlyESMLevelPolyfills: argv.esm,
-    }),
     doBuildJs(jsBundles, 'alp.max.js', {watch, minify}),
     doBuildJs(jsBundles, 'examiner.max.js', {watch, minify}),
     doBuildJs(jsBundles, 'ww.max.js', {watch, minify}),
@@ -203,13 +217,13 @@ function compileAllJs(watch, minify) {
     doBuildJs(jsBundles, 'amp-inabox-host.js', {watch, minify}),
     doBuildJs(jsBundles, 'amp-shadow.js', {watch, minify}),
     doBuildJs(jsBundles, 'amp-inabox.js', {watch, minify}),
-  ]).then(() => {
-    endBuildStep(
-      minify ? 'Minified all' : 'Compiled all',
-      'runtime JS files',
-      startTime
-    );
-  });
+  ]);
+  await compileCoreRuntime(watch, minify);
+  endBuildStep(
+    minify ? 'Minified' : 'Compiled',
+    'all runtime JS files',
+    startTime
+  );
 }
 
 /**
@@ -363,21 +377,14 @@ function compileUnminifiedJs(srcDir, srcFilename, destDir, options) {
   const devWrapper = wrapper.replace('<%= contents %>', '$1');
 
   // TODO: @jonathantyng remove browserifyOptions #22757
-  const browserifyOptions = Object.assign(
-    {},
-    {
-      entries: entryPoint,
-      debug: true,
-      fast: true,
-    },
-    options.browserifyOptions
-  );
+  const browserifyOptions = {
+    entries: entryPoint,
+    debug: true,
+    fast: true,
+    ...options.browserifyOptions,
+  };
 
-  const babelifyOptions = Object.assign(
-    {},
-    BABELIFY_GLOBAL_TRANSFORM,
-    BABELIFY_PLUGINS
-  );
+  const babelifyOptions = {...BABELIFY_GLOBAL_TRANSFORM, ...BABELIFY_PLUGINS};
 
   let bundler = browserify(browserifyOptions).transform(
     babelify,
@@ -409,6 +416,7 @@ function compileUnminifiedJs(srcDir, srcFilename, destDir, options) {
         )
         .pipe(source(srcFilename))
         .pipe(buffer())
+        .pipe(gulpIf(argv.coverage, istanbul()))
         .pipe(sourcemaps.init({loadMaps: true}))
         .pipe(
           regexpSourcemaps(
@@ -653,12 +661,47 @@ function toPromise(readable) {
   });
 }
 
+/**
+ * @param {{isEsmBuild: boolean|undefined, isCheckTypes: boolean|undefined, isFortesting: boolean|undefined, isSinglePass: boolean|undefined}=} options
+ */
+function transferSrcsToTempDir(options = {}) {
+  log(
+    'Performing pre-closure',
+    colors.cyan('babel'),
+    'transforms in',
+    colors.cyan(SRC_TEMP_DIR)
+  );
+  const files = globby.sync(BABEL_SRC_GLOBS);
+  files.forEach(file => {
+    if (file.startsWith('node_modules/') || file.startsWith('third_party/')) {
+      fs.copySync(file, `${SRC_TEMP_DIR}/${file}`);
+      return;
+    }
+
+    const {code} = babel.transformFileSync(file, {
+      plugins: conf.plugins({
+        isEsmBuild: options.isEsmBuild,
+        isSinglePass: options.isSinglePass,
+        isForTesting: options.isForTesting,
+        isChecktypes: options.isChecktypes,
+      }),
+      retainLines: true,
+      compact: false,
+    });
+    const name = `${SRC_TEMP_DIR}/${file}`;
+    fs.outputFileSync(name, code);
+    process.stdout.write('.');
+  });
+  console.log('\n');
+}
+
 module.exports = {
   BABELIFY_GLOBAL_TRANSFORM,
   BABELIFY_PLUGINS,
   bootstrapThirdPartyFrames,
   compileAllMinifiedJs,
   compileAllUnminifiedJs,
+  compileCoreRuntime,
   compileJs,
   compileTs,
   devDependencies,
@@ -670,4 +713,5 @@ module.exports = {
   printConfigHelp,
   printNobuildHelp,
   toPromise,
+  transferSrcsToTempDir,
 };
diff --git a/build-system/tasks/karma.conf.js b/build-system/tasks/karma.conf.js
index af5f13f625f15..e05028d437d69 100644
--- a/build-system/tasks/karma.conf.js
+++ b/build-system/tasks/karma.conf.js
@@ -36,14 +36,11 @@ const SAUCE_TIMEOUT_CONFIG = {
   idleTimeout: 10 * 60,
 };
 
-const BABELIFY_CONFIG = Object.assign(
-  {},
-  BABELIFY_GLOBAL_TRANSFORM,
-  BABELIFY_PLUGINS,
-  {
-    sourceMapsAbsolute: true,
-  }
-);
+const BABELIFY_CONFIG = {
+  ...BABELIFY_GLOBAL_TRANSFORM,
+  ...BABELIFY_PLUGINS,
+  sourceMapsAbsolute: true,
+};
 
 const preprocessors = ['browserify'];
 
@@ -169,109 +166,87 @@ module.exports = {
     // SauceLabs configurations.
     // New configurations can be created here:
     // https://wiki.saucelabs.com/display/DOCS/Platform+Configurator#/
-    SL_Chrome: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'chrome',
-        platform: 'Windows 10',
-        version: 'latest',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_Chrome_Beta: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'chrome',
-        platform: 'Windows 10',
-        version: 'beta',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_Chrome_Android_7: Object.assign(
-      {
-        base: 'SauceLabs',
-        appiumVersion: '1.8.1',
-        deviceName: 'Android GoogleAPI Emulator',
-        browserName: 'Chrome',
-        platformName: 'Android',
-        platformVersion: '7.1',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_iOS_12: Object.assign(
-      {
-        base: 'SauceLabs',
-        appiumVersion: '1.9.1',
-        deviceName: 'iPhone X Simulator',
-        browserName: 'Safari',
-        platformName: 'iOS',
-        platformVersion: '12.0',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_iOS_11: Object.assign(
-      {
-        base: 'SauceLabs',
-        appiumVersion: '1.9.1',
-        deviceName: 'iPhone X Simulator',
-        browserName: 'Safari',
-        platformName: 'iOS',
-        platformVersion: '11.3',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_Firefox: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'firefox',
-        platform: 'Windows 10',
-        version: 'latest',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_Firefox_Beta: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'firefox',
-        platform: 'Windows 10',
-        version: 'beta',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_Safari_12: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'safari',
-        platform: 'macOS 10.13',
-        version: '12.1',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_Safari_11: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'safari',
-        platform: 'macOS 10.13',
-        version: '11.1',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_Edge: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'MicrosoftEdge',
-        platform: 'Windows 10',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
-    SL_IE: Object.assign(
-      {
-        base: 'SauceLabs',
-        browserName: 'internet explorer',
-        platform: 'Windows 10',
-      },
-      SAUCE_TIMEOUT_CONFIG
-    ),
+    SL_Chrome: {
+      base: 'SauceLabs',
+      browserName: 'chrome',
+      platform: 'Windows 10',
+      version: 'latest',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_Chrome_Beta: {
+      base: 'SauceLabs',
+      browserName: 'chrome',
+      platform: 'Windows 10',
+      version: 'beta',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_Chrome_Android_7: {
+      base: 'SauceLabs',
+      appiumVersion: '1.8.1',
+      deviceName: 'Android GoogleAPI Emulator',
+      browserName: 'Chrome',
+      platformName: 'Android',
+      platformVersion: '7.1',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_iOS_12: {
+      base: 'SauceLabs',
+      appiumVersion: '1.9.1',
+      deviceName: 'iPhone X Simulator',
+      browserName: 'Safari',
+      platformName: 'iOS',
+      platformVersion: '12.0',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_iOS_11: {
+      base: 'SauceLabs',
+      appiumVersion: '1.9.1',
+      deviceName: 'iPhone X Simulator',
+      browserName: 'Safari',
+      platformName: 'iOS',
+      platformVersion: '11.3',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_Firefox: {
+      base: 'SauceLabs',
+      browserName: 'firefox',
+      platform: 'Windows 10',
+      version: 'latest',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_Firefox_Beta: {
+      base: 'SauceLabs',
+      browserName: 'firefox',
+      platform: 'Windows 10',
+      version: 'beta',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_Safari_12: {
+      base: 'SauceLabs',
+      browserName: 'safari',
+      platform: 'macOS 10.13',
+      version: '12.1',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_Safari_11: {
+      base: 'SauceLabs',
+      browserName: 'safari',
+      platform: 'macOS 10.13',
+      version: '11.1',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_Edge: {
+      base: 'SauceLabs',
+      browserName: 'MicrosoftEdge',
+      platform: 'Windows 10',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
+    SL_IE: {
+      base: 'SauceLabs',
+      browserName: 'internet explorer',
+      platform: 'Windows 10',
+      ...SAUCE_TIMEOUT_CONFIG,
+    },
   },
 
   sauceLabs: {
diff --git a/build-system/tasks/lint.js b/build-system/tasks/lint.js
index cdf24dfbac548..1a7e2e772312f 100644
--- a/build-system/tasks/lint.js
+++ b/build-system/tasks/lint.js
@@ -169,7 +169,7 @@ function eslintRulesChanged() {
  * @return {!Array<string>}
  */
 function getFilesToLint(files) {
-  const filesToLint = globby.sync(files);
+  const filesToLint = globby.sync(files, {gitignore: true});
   if (!isTravisBuild()) {
     log(colors.green('INFO: ') + 'Running lint on the following files:');
     filesToLint.forEach(file => {
diff --git a/build-system/tasks/performance/README.md b/build-system/tasks/performance/README.md
new file mode 100644
index 0000000000000..0b1efc9191902
--- /dev/null
+++ b/build-system/tasks/performance/README.md
@@ -0,0 +1,5 @@
+# Performance test
+
+Use `gulp performance` to run this test. It measures performance for the current branch compared to the current release. By default, the command first needs to compile minified runtime and components from the current branch by executing the `gulp dist` task. To skip this step, use the `--nobuild` flag, but the task will throw an error if the dist files are missing. Only the runtime and components used by documents from the configured URLs are compiled.
+
+The `config.json` file contains settings. If you set `headless` to `false`, you will be able to watch the test run in Chrome. The default value for `runs` is 100, which takes ~10 minutes to run, and generates results with ~5% margin of error. Differences larger than this should be investigated. The `urls` array of strings must be set before running the test, and each URL will be tested separately.
diff --git a/build-system/tasks/performance/cache-documents.js b/build-system/tasks/performance/cache-documents.js
new file mode 100644
index 0000000000000..d3a0c416fc239
--- /dev/null
+++ b/build-system/tasks/performance/cache-documents.js
@@ -0,0 +1,35 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const {CONTROL, downloadToDisk, EXPERIMENT} = require('./helpers');
+
+/**
+ * Download sites specified in config in order to serve them locally
+ * for measurement (to avoid measuring network latency).
+ *
+ * @return {!Promise}
+ * @param {!Array<string>} urls
+ */
+function cacheDocuments(urls) {
+  return Promise.all(
+    urls.flatMap(url => [
+      downloadToDisk(url, CONTROL),
+      downloadToDisk(url, EXPERIMENT),
+    ])
+  );
+}
+
+module.exports = cacheDocuments;
diff --git a/build-system/tasks/performance/compile-scripts.js b/build-system/tasks/performance/compile-scripts.js
new file mode 100644
index 0000000000000..580b28995b063
--- /dev/null
+++ b/build-system/tasks/performance/compile-scripts.js
@@ -0,0 +1,35 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const argv = require('minimist')(process.argv.slice(2));
+const {dist} = require('../dist');
+const {EXPERIMENT, urlToCachePath} = require('./helpers');
+const {setExtensionsToBuildFromDocuments} = require('../extension-helpers.js');
+
+/**
+ * Compiles and minifies AMP runtime and components required by the urls
+ * argument, unless the --nobuild flag is passed.
+ * @param {Array<string>} urls
+ */
+async function compileScripts(urls) {
+  if (!argv.nobuild) {
+    const examples = urls.map(url => urlToCachePath(url, EXPERIMENT));
+    setExtensionsToBuildFromDocuments(examples);
+    await dist();
+  }
+}
+
+module.exports = compileScripts;
diff --git a/build-system/tasks/performance/config.json b/build-system/tasks/performance/config.json
new file mode 100644
index 0000000000000..fce643c6307d5
--- /dev/null
+++ b/build-system/tasks/performance/config.json
@@ -0,0 +1,5 @@
+{
+  "headless": true,
+  "runs": 100,
+  "urls": []
+}
diff --git a/build-system/tasks/performance/helpers.js b/build-system/tasks/performance/helpers.js
new file mode 100644
index 0000000000000..8d20813544d8c
--- /dev/null
+++ b/build-system/tasks/performance/helpers.js
@@ -0,0 +1,112 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const fetch = require('node-fetch');
+const fs = require('fs');
+const path = require('path');
+
+const CDN_URL = 'https://cdn.ampproject.org/';
+const CONTROL = 'control';
+const EXPERIMENT = 'experiment';
+const CACHE_PATH = path.join(__dirname, './cache');
+const CONTROL_CACHE_PATH = path.join(CACHE_PATH, `./${CONTROL}`);
+const EXPERIMENT_CACHE_PATH = path.join(CACHE_PATH, `./${EXPERIMENT}`);
+const RESULTS_PATH = path.join(__dirname, './results.json');
+
+/**
+ * Makes cache directories if they do not exist
+ */
+function touchDirs() {
+  [
+    CACHE_PATH,
+    CONTROL_CACHE_PATH,
+    path.join(CONTROL_CACHE_PATH, 'v0'),
+    EXPERIMENT_CACHE_PATH,
+    path.join(EXPERIMENT_CACHE_PATH, 'v0'),
+  ].forEach(dirPath => {
+    if (!fs.existsSync(dirPath)) {
+      fs.mkdirSync(dirPath);
+    }
+  });
+}
+
+/**
+ * Takes a URL string and sanitizes it for use as a filename.
+ * Appends `.html` if no extension is present because otherwise
+ * Chrome will not open the file as a webpage.
+ *
+ * @param {string} url
+ * @param {string} version Experiment or Control
+ * @return {string}
+ */
+function urlToCachePath(url, version = CONTROL) {
+  const directory =
+    version === CONTROL ? CONTROL_CACHE_PATH : EXPERIMENT_CACHE_PATH;
+  let sanitized = url.replace(/:/g, '').replace(/\//g, '_');
+  sanitized = /\.js|\.html/.test(sanitized) ? sanitized : `${sanitized}.html`;
+  return path.join(directory, sanitized);
+}
+
+/**
+ * Download a file to cache by url
+ *
+ * @param {string} url
+ * @param {string} version
+ * @return {!Promise<string>} Resolves with relative path to file
+ */
+function downloadToDisk(url, version = CONTROL) {
+  touchDirs();
+
+  return fetch(url)
+    .then(response => response.text())
+    .then(document => {
+      const filepath = urlToCachePath(url, version);
+      fs.writeFileSync(filepath, document);
+      return filepath.split(`performance/cache/${version}/`)[1];
+    });
+}
+
+/**
+ * Copy a script file from /dist to cache by url
+ *
+ * @param {string} url
+ * @param {string} version
+ * @return {!Promise<string>} Resolves with relative path to file
+ */
+function copyToCache(url, version = EXPERIMENT) {
+  touchDirs();
+
+  const filePath = url.split(CDN_URL)[1];
+
+  const fromPath = path.join(__dirname, '../../../dist/', filePath);
+  const destDir =
+    version === CONTROL ? CONTROL_CACHE_PATH : EXPERIMENT_CACHE_PATH;
+  const destPath = path.join(destDir, filePath);
+
+  fs.copyFileSync(fromPath, destPath);
+
+  return Promise.resolve(filePath);
+}
+
+module.exports = {
+  CDN_URL,
+  CONTROL,
+  EXPERIMENT,
+  RESULTS_PATH,
+  copyToCache,
+  downloadToDisk,
+  urlToCachePath,
+};
diff --git a/build-system/tasks/performance/index.js b/build-system/tasks/performance/index.js
new file mode 100644
index 0000000000000..da70a32162d38
--- /dev/null
+++ b/build-system/tasks/performance/index.js
@@ -0,0 +1,55 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const cacheDocuments = require('./cache-documents');
+const compileScripts = require('./compile-scripts');
+const getMetrics = require('./measure-documents');
+const loadConfig = require('./load-config');
+const log = require('fancy-log');
+const printReport = require('./print-report');
+const rewriteScriptTags = require('./rewrite-script-tags');
+const {cyan} = require('ansi-colors');
+const {execOrDie} = require('../../common/exec');
+
+function installPackages_() {
+  log('Running', cyan('yarn'), 'to install packages...');
+  execOrDie('npx yarn --cwd build-system/tasks/performance', {
+    'stdio': 'ignore',
+  });
+}
+
+/**
+ * @return {!Promise}
+ */
+async function performance() {
+  installPackages_();
+  const {headless, runs, urls} = new loadConfig();
+  await cacheDocuments(urls);
+  await compileScripts(urls);
+  await rewriteScriptTags(urls);
+  await getMetrics(urls, {headless, runs});
+  printReport(urls);
+}
+
+performance.description = '  Runs web performance test on current branch';
+
+performance.flags = {
+  'nobuild': 'Does not compile javascripts before running tests',
+};
+
+module.exports = {
+  performance,
+};
diff --git a/build-system/tasks/performance/load-config.js b/build-system/tasks/performance/load-config.js
new file mode 100644
index 0000000000000..2ec0e8372e2da
--- /dev/null
+++ b/build-system/tasks/performance/load-config.js
@@ -0,0 +1,35 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+const PATH = './config.json';
+
+/**
+ * Loads test config from ./config.json
+ * @return {{concurrency:number, headless:boolean, runs:number, urls:Array<string>}}
+ */
+function loadConfig() {
+  const file = fs.readFileSync(path.join(__dirname, PATH));
+  const config = JSON.parse(file);
+  if (config.urls.length < 1) {
+    throw new Error('No URLs found in config.');
+  }
+  return config;
+}
+
+module.exports = loadConfig;
diff --git a/build-system/tasks/performance/measure-documents.js b/build-system/tasks/performance/measure-documents.js
new file mode 100644
index 0000000000000..0ca3cbe7d79c3
--- /dev/null
+++ b/build-system/tasks/performance/measure-documents.js
@@ -0,0 +1,209 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const fs = require('fs');
+const {
+  CONTROL,
+  EXPERIMENT,
+  RESULTS_PATH,
+  urlToCachePath,
+} = require('./helpers');
+
+// Require Puppeteer dynamically to prevent throwing error in Travis
+let puppeteer;
+
+function requirePuppeteer_() {
+  puppeteer = require('puppeteer');
+}
+
+/**
+ * Setup measurement on page before navigating to the URL. Performance
+ * observers need to be initialized before content begins to load to take
+ * measurements.
+ *
+ * @param {Puppeteer.page} page
+ * @return {Promise} Resolves when script is evaluated
+ */
+const setupMeasurement = page =>
+  page.evaluateOnNewDocument(() => {
+    window.longTasks = [];
+    window.cumulativeLayoutShift = 0;
+    window.measureStarted = Date.now();
+    window.largestContentfulPaint = 0;
+
+    const longTaskObserver = new PerformanceObserver(list =>
+      list.getEntries().forEach(entry => window.longTasks.push(entry))
+    );
+
+    longTaskObserver.observe({entryTypes: ['longtask']});
+
+    const layoutShiftObserver = new PerformanceObserver(list =>
+      list
+        .getEntries()
+        .forEach(entry => (window.cumulativeLayoutShift += entry.value))
+    );
+
+    layoutShiftObserver.observe({entryTypes: ['layout-shift']});
+
+    const largestContentfulPaintObserver = new PerformanceObserver(list => {
+      const entries = list.getEntries();
+      const entry = entries[entries.length - 1];
+      window.largestContentfulPaint = entry.renderTime || entry.loadTime;
+    });
+
+    largestContentfulPaintObserver.observe({
+      entryTypes: ['largest-contentful-paint'],
+    });
+  });
+
+/**
+ * Evaluate script on the page to collect and calculate metrics
+ *
+ * @param {Puppeteer.page} page
+ * @return {Promise<object>} Resolves with page load metrics
+ */
+const readMetrics = page =>
+  page.evaluate(() => {
+    const entries = performance.getEntries();
+
+    function getMetric(name) {
+      const entry = entries.find(entry => entry.name === name);
+      return entry ? entry.startTime : 0;
+    }
+
+    const firstPaint = getMetric('first-paint');
+    const firstContentfulPaint = getMetric('first-contentful-paint');
+
+    function getMaxFirstInputDelay() {
+      let longest = 0;
+
+      window.longTasks.forEach(longTask => {
+        if (
+          longTask.startTime > firstContentfulPaint &&
+          longTask.duration > longest
+        ) {
+          longest = longTask.duration;
+        }
+      });
+
+      return longest;
+    }
+
+    function getTimeToInteractive() {
+      return Date.now() - window.measureStarted;
+    }
+
+    return {
+      visible: getMetric('visible'),
+      firstPaint,
+      firstContentfulPaint,
+      largestContentfulPaint: window.largestContentfulPaint,
+      timeToInteractive: getTimeToInteractive(),
+      maxFirstInputDelay: getMaxFirstInputDelay(),
+      cumulativeLayoutShift: window.cumulativeLayoutShift * 100,
+    };
+  });
+
+/**
+ * Writes measurements to ./results.json
+ *
+ * @param {string} url
+ * @param {string} version
+ * @param {*} metrics
+ */
+function writeMetrics(url, version, metrics) {
+  let results = {};
+
+  if (fs.existsSync(RESULTS_PATH)) {
+    results = JSON.parse(fs.readFileSync(RESULTS_PATH));
+  }
+
+  if (!results[url]) {
+    results[url] = {[CONTROL]: [], [EXPERIMENT]: []};
+  }
+
+  results[url][version].push(metrics);
+
+  fs.writeFileSync(RESULTS_PATH, JSON.stringify(results));
+}
+
+/**
+ * Opens Chrome, loads the URL from local file cache, and collects
+ * metrics for the specified URL and version
+ *
+ * @param {string} url
+ * @param {string} version "control" or "experiment"
+ * @param {Object} options
+ * @return {Promise}
+ */
+async function measureDocument(url, version, {headless}) {
+  const browser = await puppeteer.launch({
+    headless,
+    args: [
+      '--allow-file-access-from-files',
+      '--enable-blink-features=LayoutInstabilityAPI',
+    ],
+  });
+
+  const page = await browser.newPage();
+  await page.setCacheEnabled(false);
+  await setupMeasurement(page);
+
+  try {
+    await page.goto(`file:${urlToCachePath(url, version)}`, {
+      waitUntil: 'networkidle0',
+    });
+  } catch {
+    // site did not load
+    await browser.close();
+    return;
+  }
+
+  const metrics = await readMetrics(page);
+  writeMetrics(url, version, metrics);
+  await browser.close();
+}
+
+/**
+ * Loads cached local copies of the URLs in Chrome with Puppeteer and
+ * runs a script on the page to collect performance metrics. Saves
+ * performance metrics to results.json in this directory.
+ *
+ * @param {Array<string>} urls
+ * @param {{headless:boolean, runs:number}} options
+ * @return {Promise} Fulfills when all URLs have been measured
+ */
+async function measureDocuments(urls, {headless, runs}) {
+  requirePuppeteer_();
+
+  try {
+    fs.unlinkSync(RESULTS_PATH);
+  } catch {} // file does not exist (first run)
+
+  // Make an array of tasks to be executed
+  const tasks = urls.flatMap(url =>
+    Array.from({length: runs}).flatMap(() => [
+      measureDocument.bind(null, url, CONTROL, {headless}),
+      measureDocument.bind(null, url, EXPERIMENT, {headless}),
+    ])
+  );
+
+  // Excecute the tasks serially
+  const [first, ...rest] = tasks;
+  await rest.reduce((prev, task) => prev.then(task), first());
+}
+
+module.exports = measureDocuments;
diff --git a/build-system/tasks/performance/package.json b/build-system/tasks/performance/package.json
new file mode 100644
index 0000000000000..5a1405b35826b
--- /dev/null
+++ b/build-system/tasks/performance/package.json
@@ -0,0 +1,9 @@
+{
+  "private": true,
+  "name": "gulp-performance",
+  "version": "0.1.0",
+  "description": "Dev dependencies used by `gulp performance`",
+  "devDependencies": {
+    "puppeteer": "2.0.0"
+  }
+}
diff --git a/build-system/tasks/performance/print-report.js b/build-system/tasks/performance/print-report.js
new file mode 100644
index 0000000000000..2fb399d538c88
--- /dev/null
+++ b/build-system/tasks/performance/print-report.js
@@ -0,0 +1,103 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const fs = require('fs');
+const {CONTROL, EXPERIMENT, RESULTS_PATH} = require('./helpers');
+
+const HEADER_COLUMN = 22;
+const BODY_COLUMN = 12;
+const FULL_TABLE = 68;
+
+/**
+ * Computes an average for the specified key's values in the array of objects
+ *
+ * @param {Array<*>} arr
+ * @param {string} key
+ * @return {number} average
+ */
+const average = (arr, key) =>
+  Math.round(arr.reduce((sum, result) => sum + result[key], 0) / arr.length);
+
+/**
+ * Takes two numbers and generates a string representing the difference as
+ * a percent for use in printing the results
+ *
+ * @param {number} a
+ * @param {number} b
+ * @return {string} String representing the change as a percent
+ */
+function percent(a, b) {
+  if (a === 0) {
+    return b === 0 ? 'n/a' : `-${100 - Math.round((a / b) * 100)}`;
+  } else {
+    return `${100 - Math.round((b / a) * 100)}%`;
+  }
+}
+
+/**
+ * Generates header lines to be printed to the console for url
+ *
+ * @param {string} url
+ * @return {Array<string>} lines
+ */
+const headerLines = url => [
+  '\nPAGE LOAD METRICS\n',
+  `${url}\n\n`,
+  [
+    'METRIC'.padEnd(HEADER_COLUMN),
+    'BRANCH'.padEnd(BODY_COLUMN),
+    'PRODUCTION'.padEnd(BODY_COLUMN),
+    'CHANGE'.padEnd(BODY_COLUMN),
+  ].join(' | '),
+  `\n${''.padEnd(FULL_TABLE, '-')}\n`,
+];
+
+/**
+ * Generates row to be printed to the console for the metric
+ *
+ * @param {string} metric
+ * @param {Array<*>} results
+ * @return {Array<string>} lines
+ */
+function linesForMetric(metric, results) {
+  const control = average(results[CONTROL], metric);
+  const experiment = average(results[EXPERIMENT], metric);
+
+  return [
+    [
+      metric.padEnd(HEADER_COLUMN),
+      control.toString().padEnd(BODY_COLUMN),
+      experiment.toString().padEnd(BODY_COLUMN),
+      percent(control, experiment),
+    ].join(' | '),
+    `\n${''.padEnd(FULL_TABLE, '-')}\n`,
+  ];
+}
+
+function printReport(urls) {
+  const results = JSON.parse(fs.readFileSync(RESULTS_PATH));
+
+  urls.forEach(url => {
+    const keys = Object.keys(results[url][CONTROL][0]);
+    let lines = [];
+    lines = [...lines, ...headerLines(url)];
+    lines = [...lines, ...keys.flatMap(m => linesForMetric(m, results[url]))];
+    console /* OK */
+      .log(...lines);
+  });
+}
+
+module.exports = printReport;
diff --git a/build-system/tasks/performance/rewrite-script-tags.js b/build-system/tasks/performance/rewrite-script-tags.js
new file mode 100644
index 0000000000000..03b4c835f30f2
--- /dev/null
+++ b/build-system/tasks/performance/rewrite-script-tags.js
@@ -0,0 +1,80 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const fs = require('fs');
+const {
+  CDN_URL,
+  CONTROL,
+  EXPERIMENT,
+  copyToCache,
+  downloadToDisk,
+  urlToCachePath,
+} = require('./helpers');
+const {JSDOM} = require('jsdom');
+
+/**
+ * Lookup URL from cache and rewrite URLs to build from working branch
+ *
+ * @param {string} url
+ */
+async function useLocalScripts(url) {
+  const cachePath = urlToCachePath(url, EXPERIMENT);
+  const document = fs.readFileSync(cachePath);
+  const dom = new JSDOM(document);
+
+  const scripts = Array.from(dom.window.document.querySelectorAll('script'));
+  for (const script of scripts) {
+    if (script.src.startsWith(CDN_URL)) {
+      script.src = await copyToCache(script.src);
+    }
+  }
+
+  fs.writeFileSync(cachePath, dom.serialize());
+}
+
+/**
+ * Lookup URL from cache and download scripts to cache and rewrite URLs to local copy
+ *
+ * @param {string} url
+ */
+async function useRemoteScripts(url) {
+  const cachePath = urlToCachePath(url, CONTROL);
+  const document = fs.readFileSync(cachePath);
+  const dom = new JSDOM(document);
+
+  const scripts = Array.from(dom.window.document.querySelectorAll('script'));
+  for (const script of scripts) {
+    if (script.src.startsWith(CDN_URL)) {
+      script.src = await downloadToDisk(script.src);
+    }
+  }
+
+  fs.writeFileSync(cachePath, dom.serialize());
+}
+
+/**
+ * Rewrite script tags for each document downloaded from the urls
+ *
+ * @param {!Array<string>} urls
+ * @return {Promise}
+ */
+function rewriteScriptTags(urls) {
+  return Promise.all(
+    urls.flatMap(url => [useLocalScripts(url), useRemoteScripts(url)])
+  );
+}
+
+module.exports = rewriteScriptTags;
diff --git a/build-system/tasks/performance/yarn.lock b/build-system/tasks/performance/yarn.lock
new file mode 100644
index 0000000000000..e2eb8f23b7eb6
--- /dev/null
+++ b/build-system/tasks/performance/yarn.lock
@@ -0,0 +1,287 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+agent-base@^4.3.0:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.3.0.tgz#8165f01c436009bccad0b1d122f05ed770efc6ee"
+  integrity sha512-salcGninV0nPrwpGNn4VTXBb1SOuXQBiqbrNXoeizJsHrsL6ERFM2Ne3JUSBWRE6aeNJI2ROP/WEEIDUiDe3cg==
+  dependencies:
+    es6-promisify "^5.0.0"
+
+async-limiter@~1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.1.tgz#dd379e94f0db8310b08291f9d64c3209766617fd"
+  integrity sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ==
+
+balanced-match@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
+  integrity sha1-ibTRmasr7kneFk6gK4nORi1xt2c=
+
+brace-expansion@^1.1.7:
+  version "1.1.11"
+  resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
+  integrity sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==
+  dependencies:
+    balanced-match "^1.0.0"
+    concat-map "0.0.1"
+
+buffer-from@^1.0.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
+  integrity sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A==
+
+concat-map@0.0.1:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
+  integrity sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=
+
+concat-stream@1.6.2:
+  version "1.6.2"
+  resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.6.2.tgz#904bdf194cd3122fc675c77fc4ac3d4ff0fd1a34"
+  integrity sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==
+  dependencies:
+    buffer-from "^1.0.0"
+    inherits "^2.0.3"
+    readable-stream "^2.2.2"
+    typedarray "^0.0.6"
+
+core-util-is@~1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
+  integrity sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=
+
+debug@2.6.9:
+  version "2.6.9"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
+  integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==
+  dependencies:
+    ms "2.0.0"
+
+debug@^3.1.0:
+  version "3.2.6"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
+  integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==
+  dependencies:
+    ms "^2.1.1"
+
+debug@^4.1.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
+  dependencies:
+    ms "^2.1.1"
+
+es6-promise@^4.0.3:
+  version "4.2.8"
+  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.8.tgz#4eb21594c972bc40553d276e510539143db53e0a"
+  integrity sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w==
+
+es6-promisify@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/es6-promisify/-/es6-promisify-5.0.0.tgz#5109d62f3e56ea967c4b63505aef08291c8a5203"
+  integrity sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM=
+  dependencies:
+    es6-promise "^4.0.3"
+
+extract-zip@^1.6.6:
+  version "1.6.7"
+  resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.6.7.tgz#a840b4b8af6403264c8db57f4f1a74333ef81fe9"
+  integrity sha1-qEC0uK9kAyZMjbV/Txp0Mz74H+k=
+  dependencies:
+    concat-stream "1.6.2"
+    debug "2.6.9"
+    mkdirp "0.5.1"
+    yauzl "2.4.1"
+
+fd-slicer@~1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.0.1.tgz#8b5bcbd9ec327c5041bf9ab023fd6750f1177e65"
+  integrity sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU=
+  dependencies:
+    pend "~1.2.0"
+
+fs.realpath@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
+  integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8=
+
+glob@^7.1.3:
+  version "7.1.6"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.6.tgz#141f33b81a7c2492e125594307480c46679278a6"
+  integrity sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==
+  dependencies:
+    fs.realpath "^1.0.0"
+    inflight "^1.0.4"
+    inherits "2"
+    minimatch "^3.0.4"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
+
+https-proxy-agent@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-3.0.1.tgz#b8c286433e87602311b01c8ea34413d856a4af81"
+  integrity sha512-+ML2Rbh6DAuee7d07tYGEKOEi2voWPUGan+ExdPbPW6Z3svq+JCqr0v8WmKPOkz1vOVykPCBSuobe7G8GJUtVg==
+  dependencies:
+    agent-base "^4.3.0"
+    debug "^3.1.0"
+
+inflight@^1.0.4:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
+  integrity sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=
+  dependencies:
+    once "^1.3.0"
+    wrappy "1"
+
+inherits@2, inherits@^2.0.3, inherits@~2.0.3:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
+  integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
+
+isarray@~1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
+  integrity sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=
+
+mime@^2.0.3:
+  version "2.4.4"
+  resolved "https://registry.yarnpkg.com/mime/-/mime-2.4.4.tgz#bd7b91135fc6b01cde3e9bae33d659b63d8857e5"
+  integrity sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA==
+
+minimatch@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
+  integrity sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==
+  dependencies:
+    brace-expansion "^1.1.7"
+
+minimist@0.0.8:
+  version "0.0.8"
+  resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
+  integrity sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=
+
+mkdirp@0.5.1:
+  version "0.5.1"
+  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
+  integrity sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=
+  dependencies:
+    minimist "0.0.8"
+
+ms@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
+  integrity sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=
+
+ms@^2.1.1:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
+  integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
+
+once@^1.3.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
+  integrity sha1-WDsap3WWHUsROsF9nFC6753Xa9E=
+  dependencies:
+    wrappy "1"
+
+path-is-absolute@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
+  integrity sha1-F0uSaHNVNP+8es5r9TpanhtcX18=
+
+pend@~1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
+  integrity sha1-elfrVQpng/kRUzH89GY9XI4AelA=
+
+process-nextick-args@~2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
+  integrity sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==
+
+progress@^2.0.1:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8"
+  integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==
+
+proxy-from-env@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.0.0.tgz#33c50398f70ea7eb96d21f7b817630a55791c7ee"
+  integrity sha1-M8UDmPcOp+uW0h97gXYwpVeRx+4=
+
+puppeteer@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-2.0.0.tgz#0612992e29ec418e0a62c8bebe61af1a64d7ec01"
+  integrity sha512-t3MmTWzQxPRP71teU6l0jX47PHXlc4Z52sQv4LJQSZLq1ttkKS2yGM3gaI57uQwZkNaoGd0+HPPMELZkcyhlqA==
+  dependencies:
+    debug "^4.1.0"
+    extract-zip "^1.6.6"
+    https-proxy-agent "^3.0.0"
+    mime "^2.0.3"
+    progress "^2.0.1"
+    proxy-from-env "^1.0.0"
+    rimraf "^2.6.1"
+    ws "^6.1.0"
+
+readable-stream@^2.2.2:
+  version "2.3.6"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
+  integrity sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==
+  dependencies:
+    core-util-is "~1.0.0"
+    inherits "~2.0.3"
+    isarray "~1.0.0"
+    process-nextick-args "~2.0.0"
+    safe-buffer "~5.1.1"
+    string_decoder "~1.1.1"
+    util-deprecate "~1.0.1"
+
+rimraf@^2.6.1:
+  version "2.7.1"
+  resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.7.1.tgz#35797f13a7fdadc566142c29d4f07ccad483e3ec"
+  integrity sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==
+  dependencies:
+    glob "^7.1.3"
+
+safe-buffer@~5.1.0, safe-buffer@~5.1.1:
+  version "5.1.2"
+  resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
+  integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==
+
+string_decoder@~1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.1.1.tgz#9cf1611ba62685d7030ae9e4ba34149c3af03fc8"
+  integrity sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==
+  dependencies:
+    safe-buffer "~5.1.0"
+
+typedarray@^0.0.6:
+  version "0.0.6"
+  resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
+  integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
+
+util-deprecate@~1.0.1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
+  integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=
+
+wrappy@1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
+  integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=
+
+ws@^6.1.0:
+  version "6.2.1"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-6.2.1.tgz#442fdf0a47ed64f59b6a5d8ff130f4748ed524fb"
+  integrity sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==
+  dependencies:
+    async-limiter "~1.0.0"
+
+yauzl@2.4.1:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.4.1.tgz#9528f442dab1b2284e58b4379bb194e22e0c4005"
+  integrity sha1-lSj0QtqxsihOWLQ3m7GU4i4MQAU=
+  dependencies:
+    fd-slicer "~1.0.1"
diff --git a/build-system/tasks/prepend-global/index.js b/build-system/tasks/prepend-global/index.js
index 544fcccda6c73..70f105003f7cf 100644
--- a/build-system/tasks/prepend-global/index.js
+++ b/build-system/tasks/prepend-global/index.js
@@ -16,13 +16,14 @@
 'use strict';
 
 const argv = require('minimist')(process.argv.slice(2));
-const BBPromise = require('bluebird');
 const childProcess = require('child_process');
-const exec = BBPromise.promisify(childProcess.exec);
 const colors = require('ansi-colors');
-const fs = BBPromise.promisifyAll(require('fs'));
+const fs = require('fs');
 const log = require('fancy-log');
 const path = require('path');
+const util = require('util');
+
+const exec = util.promisify(childProcess.exec);
 
 const {red, cyan} = colors;
 
@@ -98,7 +99,7 @@ function writeTarget(filename, fileString, opt_dryrun) {
     log(fileString);
     return Promise.resolve();
   }
-  return fs.writeFileAsync(filename, fileString);
+  return fs.promises.writeFile(filename, fileString);
 }
 
 /**
@@ -135,8 +136,8 @@ function applyConfig(
   return checkoutBranchConfigs(filename, opt_localBranch, opt_branch)
     .then(() => {
       return Promise.all([
-        fs.readFileAsync(filename),
-        fs.readFileAsync(target),
+        fs.promises.readFile(filename),
+        fs.promises.readFile(target),
       ]);
     })
     .then(files => {
@@ -151,7 +152,7 @@ function applyConfig(
         configJson = enableLocalDev(config, target, configJson);
       }
       if (opt_fortesting) {
-        configJson = Object.assign({test: true}, configJson);
+        configJson = {test: true, ...configJson};
       }
       const targetString = files[1].toString();
       const configString = JSON.stringify(configJson);
@@ -209,7 +210,7 @@ function enableLocalDev(config, target, configJson) {
  * @return {!Promise}
  */
 function removeConfig(target) {
-  return fs.readFileAsync(target).then(file => {
+  return fs.promises.readFile(target).then(file => {
     let contents = file.toString();
     if (numConfigs(contents) == 0) {
       return Promise.resolve();
diff --git a/build-system/tasks/presubmit-checks.js b/build-system/tasks/presubmit-checks.js
index 9b6ecbbc5a9fb..23a88a69b645c 100644
--- a/build-system/tasks/presubmit-checks.js
+++ b/build-system/tasks/presubmit-checks.js
@@ -130,6 +130,7 @@ const forbiddenTerms = {
       'build-system/tasks/generate-runner.js',
       'build-system/tasks/helpers.js',
       'build-system/tasks/prettify.js',
+      'src/purifier/noop.js',
       'validator/nodejs/index.js', // NodeJs only.
       'validator/engine/parse-css.js',
       'validator/engine/validator-in-browser.js',
@@ -307,6 +308,7 @@ const forbiddenTerms = {
       'extensions/amp-fx-collection/0.1/providers/fx-provider.js',
       'extensions/amp-list/0.1/amp-list.js',
       'extensions/amp-next-page/0.1/next-page-service.js',
+      'extensions/amp-next-page/1.0/visibility-observer.js',
       'extensions/amp-position-observer/0.1/amp-position-observer.js',
       'extensions/amp-video-docking/0.1/amp-video-docking.js',
       'src/service/position-observer/position-observer-impl.js',
@@ -374,6 +376,7 @@ const forbiddenTerms = {
       'extensions/amp-subscriptions/0.1/viewer-subscription-platform.js',
       'extensions/amp-viewer-integration/0.1/highlight-handler.js',
       'extensions/amp-consent/0.1/consent-ui.js',
+      'extensions/amp-story/1.0/amp-story-viewer-messaging-handler.js',
 
       // iframe-messaging-client.sendMessage
       '3p/iframe-messaging-client.js',
@@ -417,6 +420,7 @@ const forbiddenTerms = {
       'extensions/amp-experiment/1.0/variant.js',
       'extensions/amp-user-notification/0.1/amp-user-notification.js',
       'extensions/amp-consent/0.1/consent-state-manager.js',
+      'extensions/amp-story/1.0/amp-story-quiz.js',
     ],
   },
   'getBaseCid': {
@@ -435,6 +439,7 @@ const forbiddenTerms = {
       'src/inabox/inabox-viewer.js',
       'src/service/cid-impl.js',
       'src/impression.js',
+      'src/ssr-template-helper.js',
       'extensions/amp-viewer-assistance/0.1/amp-viewer-assistance.js',
     ],
   },
@@ -589,7 +594,7 @@ const forbiddenTerms = {
   'overrideVisibilityState': {
     message: 'overrideVisibilityState is a restricted API.',
     whitelist: [
-      'src/runtime.js',
+      'src/multidoc-manager.js',
       'src/service/ampdoc-impl.js',
       'src/service/viewer-impl.js',
     ],
@@ -1125,6 +1130,7 @@ const forbiddenTermsSrcInclusive = {
       'build-system/tasks/check-links.js',
       'build-system/tasks/extension-generator/index.js',
       'build-system/tasks/helpers.js',
+      'build-system/tasks/performance/helpers.js',
       'dist.3p/current/integration.js',
       'extensions/amp-iframe/0.1/amp-iframe.js',
       'src/3p-frame.js',
@@ -1132,6 +1138,7 @@ const forbiddenTermsSrcInclusive = {
       'testing/local-amp-chrome-extension/background.js',
       'tools/errortracker/errortracker.go',
       'tools/experiments/experiments.js',
+      'validator/engine/validator.js',
       'validator/engine/validator-in-browser.js',
       'validator/nodejs/index.js',
       'validator/webui/serve-standalone.go',
@@ -1170,7 +1177,7 @@ const forbiddenTermsSrcInclusive = {
 
 // Terms that must appear in a source file.
 const requiredTerms = {
-  'Copyright 20(15|16|17|18|19) The AMP HTML Authors\\.': dedicatedCopyrightNoteSources,
+  'Copyright 20(15|16|17|18|19|20) The AMP HTML Authors\\.': dedicatedCopyrightNoteSources,
   'Licensed under the Apache License, Version 2\\.0': dedicatedCopyrightNoteSources,
   'http\\://www\\.apache\\.org/licenses/LICENSE-2\\.0': dedicatedCopyrightNoteSources,
 };
diff --git a/build-system/tasks/process-3p-github-pr.js b/build-system/tasks/process-3p-github-pr.js
index dde4a3cc1f932..1c3623585ca86 100644
--- a/build-system/tasks/process-3p-github-pr.js
+++ b/build-system/tasks/process-3p-github-pr.js
@@ -23,11 +23,12 @@
 'use strict';
 const argv = require('minimist')(process.argv.slice(2));
 const assert = require('assert');
-const BBPromise = require('bluebird');
 const colors = require('ansi-colors');
 const extend = require('util')._extend;
 const log = require('fancy-log');
-const request = BBPromise.promisify(require('request'));
+const util = require('util');
+
+const request = util.promisify(require('request'));
 
 const {GITHUB_ACCESS_TOKEN} = process.env;
 
@@ -140,7 +141,7 @@ function process3pGithubPr() {
   for (let batch = 1; batch < NUM_BATCHES; batch++) {
     arrayPromises.push(getIssues(batch));
   }
-  return BBPromise.all(arrayPromises)
+  return Promise.all(arrayPromises)
     .then(requests => [].concat.apply([], requests))
     .then(issues => {
       const allIssues = issues;
diff --git a/build-system/tasks/process-github-issues.js b/build-system/tasks/process-github-issues.js
index 4a79d2804766e..28b3d7f03f541 100644
--- a/build-system/tasks/process-github-issues.js
+++ b/build-system/tasks/process-github-issues.js
@@ -16,11 +16,12 @@
 'use strict';
 const argv = require('minimist')(process.argv.slice(2));
 const assert = require('assert');
-const BBPromise = require('bluebird');
 const colors = require('ansi-colors');
 const extend = require('util')._extend;
 const log = require('fancy-log');
-const request = BBPromise.promisify(require('request'));
+const util = require('util');
+
+const request = util.promisify(require('request'));
 
 const {GITHUB_ACCESS_TOKEN} = process.env;
 
@@ -121,7 +122,7 @@ function updateGitHubIssues() {
   for (let batch = 1; batch < NUM_BATCHES; batch++) {
     arrayPromises.push(getIssues(batch));
   }
-  return BBPromise.all(arrayPromises)
+  return Promise.all(arrayPromises)
     .then(requests => [].concat.apply([], requests))
     .then(issues => {
       const allIssues = issues;
diff --git a/build-system/tasks/release-tagging.js b/build-system/tasks/release-tagging.js
index 521be59151e9e..c5899a30cab87 100644
--- a/build-system/tasks/release-tagging.js
+++ b/build-system/tasks/release-tagging.js
@@ -16,15 +16,15 @@
 'use strict';
 
 const argv = require('minimist')(process.argv.slice(2));
-const BBPromise = require('bluebird');
 const colors = require('ansi-colors');
 const fs = require('fs-extra');
 const git = require('gulp-git');
 const log = require('fancy-log');
-const request = BBPromise.promisify(require('request'));
+const util = require('util');
 
 const {GITHUB_ACCESS_TOKEN} = process.env;
-const gitExec = BBPromise.promisify(git.exec);
+const gitExec = util.promisify(git.exec);
+const request = util.promisify(require('request'));
 
 const isDryrun = argv.dryrun;
 const verbose = argv.verbose || argv.v;
diff --git a/build-system/tasks/runtime-test/helpers.js b/build-system/tasks/runtime-test/helpers.js
index bb6a75974a276..e3771f1c79adb 100644
--- a/build-system/tasks/runtime-test/helpers.js
+++ b/build-system/tasks/runtime-test/helpers.js
@@ -397,7 +397,7 @@ async function runTestInBatchesWithBrowsers_(
     green('browser(s)...')
   );
   while (startIndex < endIndex) {
-    const configBatch = Object.assign({}, config);
+    const configBatch = {...config};
     configBatch.browsers = browsers.slice(startIndex, endIndex);
     log(
       green('Batch'),
diff --git a/build-system/tasks/runtime-test/runtime-test-base.js b/build-system/tasks/runtime-test/runtime-test-base.js
index b91008a84152f..47f64dfff24c3 100644
--- a/build-system/tasks/runtime-test/runtime-test-base.js
+++ b/build-system/tasks/runtime-test/runtime-test-base.js
@@ -242,7 +242,7 @@ class RuntimeTestConfig {
       const plugins = [instanbulPlugin].concat(this.babelifyConfig.plugins);
 
       this.browserify.transform = [
-        ['babelify', Object.assign({}, this.babelifyConfig, {plugins})],
+        ['babelify', {...this.babelifyConfig, plugins}],
       ];
     }
   }
diff --git a/build-system/tasks/serve.js b/build-system/tasks/serve.js
index cb56e3681a0ea..78e582211bab5 100644
--- a/build-system/tasks/serve.js
+++ b/build-system/tasks/serve.js
@@ -87,19 +87,17 @@ async function startServer(
     started = resolve;
   });
   setServeMode(modeOptions);
-  const options = Object.assign(
-    {
-      name: 'AMP Dev Server',
-      root: process.cwd(),
-      host: argv.host || 'localhost',
-      port: argv.port || 8000,
-      https: argv.https,
-      preferHttp1: true,
-      silent: true,
-      middleware: getMiddleware,
-    },
-    connectOptions
-  );
+  const options = {
+    name: 'AMP Dev Server',
+    root: process.cwd(),
+    host: argv.host || 'localhost',
+    port: argv.port || 8000,
+    https: argv.https,
+    preferHttp1: true,
+    silent: true,
+    middleware: getMiddleware,
+    ...connectOptions,
+  };
   connect.server(options, started);
   await startedPromise;
   url = `http${options.https ? 's' : ''}://${options.host}:${options.port}`;
diff --git a/build-system/tasks/todos.js b/build-system/tasks/todos.js
index ed4e4dec320eb..0b064e014e14e 100644
--- a/build-system/tasks/todos.js
+++ b/build-system/tasks/todos.js
@@ -15,13 +15,14 @@
  */
 'use strict';
 
-const BBPromise = require('bluebird');
 const colors = require('ansi-colors');
 const gulp = require('gulp');
 const log = require('fancy-log');
-const request = BBPromise.promisify(require('request'));
 const srcGlobs = require('../test-configs/config').presubmitGlobs;
 const through2 = require('through2');
+const util = require('util');
+
+const request = util.promisify(require('request'));
 
 const {GITHUB_ACCESS_TOKEN} = process.env;
 
diff --git a/build-system/tasks/visual-diff/index.js b/build-system/tasks/visual-diff/index.js
index 99256051b035f..82e95f66e6995 100644
--- a/build-system/tasks/visual-diff/index.js
+++ b/build-system/tasks/visual-diff/index.js
@@ -564,7 +564,7 @@ async function snapshotWebpages(browser, webpages) {
 
           // Create a default set of snapshot options for Percy and modify
           // them based on the test's configuration.
-          const snapshotOptions = Object.assign({}, DEFAULT_SNAPSHOT_OPTIONS);
+          const snapshotOptions = {...DEFAULT_SNAPSHOT_OPTIONS};
           if (webpage.enable_percy_javascript) {
             snapshotOptions.enableJavaScript = true;
           }
diff --git a/build-system/tasks/visual-diff/package.json b/build-system/tasks/visual-diff/package.json
index 3df5b3a762885..64554086f4ad7 100644
--- a/build-system/tasks/visual-diff/package.json
+++ b/build-system/tasks/visual-diff/package.json
@@ -4,8 +4,8 @@
   "version": "0.1.0",
   "description": "Gulp visual diff",
   "devDependencies": {
-    "@percy/agent": "0.20.2",
+    "@percy/agent": "0.20.12",
     "@percy/puppeteer": "1.0.8",
-    "puppeteer": "2.0.0"
+    "puppeteer": "2.1.0"
   }
 }
diff --git a/build-system/tasks/visual-diff/yarn.lock b/build-system/tasks/visual-diff/yarn.lock
index cf809df7a66cf..dad3f24aa913a 100644
--- a/build-system/tasks/visual-diff/yarn.lock
+++ b/build-system/tasks/visual-diff/yarn.lock
@@ -42,7 +42,7 @@
     debug "^4.1.1"
     semver "^5.6.0"
 
-"@oclif/command@^1.5.13", "@oclif/command@^1.5.3":
+"@oclif/command@1.5.19", "@oclif/command@^1.5.13", "@oclif/command@^1.5.3":
   version "1.5.19"
   resolved "https://registry.yarnpkg.com/@oclif/command/-/command-1.5.19.tgz#13f472450eb83bd6c6871a164c03eadb5e1a07ed"
   integrity sha512-6+iaCMh/JXJaB2QWikqvGE9//wLEVYYwZd5sud8aLoLKog1Q75naZh2vlGVtg5Mq/NqpqGQvdIjJb3Bm+64AUQ==
@@ -118,16 +118,15 @@
   resolved "https://registry.yarnpkg.com/@oclif/screen/-/screen-1.0.4.tgz#b740f68609dfae8aa71c3a6cab15d816407ba493"
   integrity sha512-60CHpq+eqnTxLZQ4PGHYNwUX572hgpMHGPtTWMjdTMsAvlm69lZV/4ly6O3sAYkomo4NggGcomrDpBe34rxUqw==
 
-"@percy/agent@0.20.2":
-  version "0.20.2"
-  resolved "https://registry.yarnpkg.com/@percy/agent/-/agent-0.20.2.tgz#e90115bb819732c817bdc5cdbbd492b19f6e291c"
-  integrity sha512-0tKbLO4YBRKVkkZdIx5IajoQ6HOYsMSKzq8dQVbYz9GCVz+JfKz7jIWSGRge6uSlSCPU78hybpCcBjD6Y4Y1yw==
+"@percy/agent@0.20.12":
+  version "0.20.12"
+  resolved "https://registry.yarnpkg.com/@percy/agent/-/agent-0.20.12.tgz#3d470e6883e54643a7caeefbcf86f9c7d589fc0c"
+  integrity sha512-dTIsTXIjUFhEAxeMPrnIrt19X5jjoZoyXc7Sw4lmBII9SJRaQJeXUTPKvuXRB242mbN/d4mgSp+tx/HowVAXfA==
   dependencies:
-    "@oclif/command" "1.5.16"
+    "@oclif/command" "1.5.19"
     "@oclif/config" "^1"
     "@oclif/plugin-help" "^2"
     "@oclif/plugin-not-found" "^1.2"
-    "@types/which" "^1.3.2"
     axios "^0.19.0"
     body-parser "^1.18.3"
     colors "^1.3.2"
@@ -136,13 +135,13 @@
     cross-spawn "^6.0.5"
     deepmerge "^4.0.0"
     express "^4.16.3"
-    follow-redirects "1.5.10"
+    follow-redirects "1.9.0"
     generic-pool "^3.7.1"
     globby "^10.0.1"
     image-size "^0.8.2"
     js-yaml "^3.13.1"
     percy-client "^3.2.0"
-    puppeteer "^1.13.0"
+    puppeteer "^2.0.0"
     retry-axios "^1.0.1"
     which "^2.0.1"
     winston "^3.0.0"
@@ -195,6 +194,11 @@
     "@types/minimatch" "*"
     "@types/node" "*"
 
+"@types/mime-types@^2.1.0":
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/@types/mime-types/-/mime-types-2.1.0.tgz#9ca52cda363f699c69466c2a6ccdaad913ea7a73"
+  integrity sha1-nKUs2jY/aZxpRmwqbM2q2RPqenM=
+
 "@types/minimatch@*":
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
@@ -205,11 +209,6 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-12.11.2.tgz#75ba3beda30d690b89a5089ca1c6e8e386150b76"
   integrity sha512-dsfE4BHJkLQW+reOS6b17xhZ/6FB1rB8eRRvO08nn5o+voxf3i74tuyFWNH6djdfgX7Sm5s6LD8t6mJug4dpDw==
 
-"@types/which@^1.3.2":
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/@types/which/-/which-1.3.2.tgz#9c246fc0c93ded311c8512df2891fb41f6227fdf"
-  integrity sha512-8oDqyLC7eD4HM307boe2QWKyuzdzWBj56xI/imSl2cpL+U3tCMaTAkMJ4ee5JBZ/FsOJlvRGeIShiZDAl1qERA==
-
 accepts@~1.3.7:
   version "1.3.7"
   resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.7.tgz#531bc726517a3b2b41f850021c6cc15eaab507cd"
@@ -218,6 +217,11 @@ accepts@~1.3.7:
     mime-types "~2.1.24"
     negotiator "0.6.2"
 
+agent-base@5:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-5.1.1.tgz#e8fb3f242959db44d63be665db7a8e739537a32c"
+  integrity sha512-TMeqbNl2fMW0nMjTEPOwe3J/PRFP4vqeoNuQMG0HlMrtm5QxKqdvAkZ1pRBQ/ulIyDD5Yq0nJ7YbdD8ey0TO3g==
+
 agent-base@^4.1.0:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.2.1.tgz#d89e5999f797875674c07d87f260fc41e83e8ca9"
@@ -630,6 +634,13 @@ debug@2.6.9:
   dependencies:
     ms "2.0.0"
 
+debug@4, debug@^4.1.0, debug@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
+  dependencies:
+    ms "^2.1.1"
+
 debug@=3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
@@ -644,13 +655,6 @@ debug@^3.0.0, debug@^3.1.0:
   dependencies:
     ms "^2.1.1"
 
-debug@^4.1.0, debug@^4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
-  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
-  dependencies:
-    ms "^2.1.1"
-
 deepmerge@^4.0.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-4.2.0.tgz#77a97af6746882cd1ed85d4b925be8cd4120b630"
@@ -914,7 +918,7 @@ follow-redirects@1.5.10:
   dependencies:
     debug "=3.1.0"
 
-follow-redirects@^1.9.0:
+follow-redirects@1.9.0, follow-redirects@^1.9.0:
   version "1.9.0"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.9.0.tgz#8d5bcdc65b7108fe1508649c79c12d732dcedb4f"
   integrity sha512-CRcPzsSIbXyVDl0QI01muNDu69S8trU4jArW9LpOt2WtC6LyUJetcIrmfHsRBx7/Jb6GHJUiuqyYxPooFfNt6A==
@@ -1096,6 +1100,14 @@ https-proxy-agent@^3.0.0:
     agent-base "^4.3.0"
     debug "^3.1.0"
 
+https-proxy-agent@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-4.0.0.tgz#702b71fb5520a132a66de1f67541d9e62154d82b"
+  integrity sha512-zoDhWrkR3of1l9QAL8/scJZyLu8j/gBkcwcaQOZh7Gyh/+uJQzGVETdgT30akuwkpL8HTRfssqI3BZuV18teDg==
+  dependencies:
+    agent-base "5"
+    debug "4"
+
 hyperlinker@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/hyperlinker/-/hyperlinker-1.0.0.tgz#23dc9e38a206b208ee49bc2d6c8ef47027df0c0e"
@@ -1359,6 +1371,11 @@ mime-db@1.40.0:
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.40.0.tgz#a65057e998db090f732a68f6c276d387d4126c32"
   integrity sha512-jYdeOMPy9vnxEqFRRo6ZvTZ8d9oPb+k18PKoYNYUe2stVEBPPwsln/qWzdbmaIvnhZ9v2P+CuecK+fpUfsV2mA==
 
+mime-db@1.43.0:
+  version "1.43.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.43.0.tgz#0a12e0502650e473d735535050e7c8f4eb4fae58"
+  integrity sha512-+5dsGEEovYbT8UY9yD7eE4XTc4UwJ1jBYlgaQQF38ENsKR3wj/8q8RFZrF9WIZpB2V1ArTVFUva8sAul1NzRzQ==
+
 mime-db@~1.37.0:
   version "1.37.0"
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.37.0.tgz#0b6a0ce6fdbe9576e25f1f2d2fde8830dc0ad0d8"
@@ -1371,6 +1388,13 @@ mime-types@^2.1.12, mime-types@~2.1.19:
   dependencies:
     mime-db "~1.37.0"
 
+mime-types@^2.1.25:
+  version "2.1.26"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.26.tgz#9c921fc09b7e149a65dfdc0da4d20997200b0a06"
+  integrity sha512-01paPWYgLrkqAyrlDorC1uDwl2p3qZT7yl806vW7DvDoxwXi46jsjFbg+WdwotBIk6/MbEhO/dh5aZ5sNj/dWQ==
+  dependencies:
+    mime-db "1.43.0"
+
 mime-types@~2.1.24:
   version "2.1.24"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.24.tgz#b6f8d0b3e951efb77dedeca194cff6d16f676f81"
@@ -1582,15 +1606,17 @@ punycode@^2.1.0:
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
   integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==
 
-puppeteer@2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-2.0.0.tgz#0612992e29ec418e0a62c8bebe61af1a64d7ec01"
-  integrity sha512-t3MmTWzQxPRP71teU6l0jX47PHXlc4Z52sQv4LJQSZLq1ttkKS2yGM3gaI57uQwZkNaoGd0+HPPMELZkcyhlqA==
+puppeteer@2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-2.1.0.tgz#c10cabc5525f57c6766eed4f3006b6e10afcafc1"
+  integrity sha512-PC4oKMtwAElo8YtS/cYnk2/dew/3TonsGKKzjpFLWwkhBCteFsOZCVOXTt2QlP6w53mH0YsJE+fPLPzOW+DCug==
   dependencies:
+    "@types/mime-types" "^2.1.0"
     debug "^4.1.0"
     extract-zip "^1.6.6"
-    https-proxy-agent "^3.0.0"
+    https-proxy-agent "^4.0.0"
     mime "^2.0.3"
+    mime-types "^2.1.25"
     progress "^2.0.1"
     proxy-from-env "^1.0.0"
     rimraf "^2.6.1"
@@ -1610,6 +1636,20 @@ puppeteer@^1.13.0:
     rimraf "^2.6.1"
     ws "^6.1.0"
 
+puppeteer@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-2.0.0.tgz#0612992e29ec418e0a62c8bebe61af1a64d7ec01"
+  integrity sha512-t3MmTWzQxPRP71teU6l0jX47PHXlc4Z52sQv4LJQSZLq1ttkKS2yGM3gaI57uQwZkNaoGd0+HPPMELZkcyhlqA==
+  dependencies:
+    debug "^4.1.0"
+    extract-zip "^1.6.6"
+    https-proxy-agent "^3.0.0"
+    mime "^2.0.3"
+    progress "^2.0.1"
+    proxy-from-env "^1.0.0"
+    rimraf "^2.6.1"
+    ws "^6.1.0"
+
 qs@6.7.0:
   version "6.7.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.7.0.tgz#41dc1a015e3d581f1621776be31afb2876a9b1bc"
diff --git a/build-system/test-configs/config.js b/build-system/test-configs/config.js
index 939bc6bc3beb3..dd4497b295608 100644
--- a/build-system/test-configs/config.js
+++ b/build-system/test-configs/config.js
@@ -130,6 +130,7 @@ const presubmitGlobs = [
   '!build/polyfills/*.js',
   '!third_party/**/*.*',
   '!validator/chromeextension/*.*',
+  '!src/purifier/node_modules/**/*.*',
   // Files in this testdata dir are machine-generated and are not part
   // of the AMP runtime, so shouldn't be checked.
   '!extensions/amp-a4a/*/test/testdata/*.js',
diff --git a/build-system/test-configs/conformance-config.textproto b/build-system/test-configs/conformance-config.textproto
index 9878ea246d84b..d2538baa9f080 100644
--- a/build-system/test-configs/conformance-config.textproto
+++ b/build-system/test-configs/conformance-config.textproto
@@ -40,6 +40,7 @@ requirement: {
   error_message: 'History.p.state is broken in IE11. Please use the helper methods provided in src/history.js'
   value: 'History.prototype.state'
   whitelist: 'src/history.js'
+  whitelist: 'extensions/amp-story/1.0/amp-story-viewer-messaging-handler.js'
 }
 
 # Strings
@@ -291,6 +292,7 @@ requirement: {
   # 3p ads are OK
   whitelist: 'ads/adhese.js'
   whitelist: 'ads/loka.js'
+  whitelist: 'ads/nativery.js'
   whitelist: 'ads/xlift.js'
 }
 
diff --git a/build-system/test-configs/dep-check-config.js b/build-system/test-configs/dep-check-config.js
index 04a5b68aa84e0..3bff9692d6bd0 100644
--- a/build-system/test-configs/dep-check-config.js
+++ b/build-system/test-configs/dep-check-config.js
@@ -85,6 +85,7 @@ exports.rules = [
       'extensions/amp-subscriptions-google/**/*.js->third_party/subscriptions-project/apis.js',
       'extensions/amp-subscriptions-google/**/*.js->third_party/subscriptions-project/config.js',
       'extensions/amp-subscriptions-google/**/*.js->third_party/subscriptions-project/swg.js',
+      'extensions/amp-subscriptions/**/*.js->third_party/subscriptions-project/aes_gcm.js',
       'extensions/amp-subscriptions/**/*.js->third_party/subscriptions-project/apis.js',
       'extensions/amp-subscriptions/**/*.js->third_party/subscriptions-project/config.js',
       'extensions/amp-timeago/0.1/amp-timeago.js->third_party/timeagojs/timeago.js',
@@ -247,6 +248,8 @@ exports.rules = [
       'extensions/amp-carousel/0.2/amp-carousel.js->extensions/amp-base-carousel/0.1/carousel.js',
       'extensions/amp-carousel/0.2/amp-carousel.js->extensions/amp-base-carousel/0.1/carousel-events.js',
       'extensions/amp-carousel/0.2/amp-carousel.js->extensions/amp-base-carousel/0.1/child-layout-manager.js',
+      'extensions/amp-inline-gallery/0.1/amp-inline-gallery.js->extensions/amp-base-carousel/0.1/carousel-events.js',
+      'extensions/amp-inline-gallery/0.1/amp-inline-gallery-thumbnails.js->extensions/amp-base-carousel/0.1/carousel-events.js',
 
       // Facebook components
       'extensions/amp-facebook-page/0.1/amp-facebook-page.js->extensions/amp-facebook/0.1/facebook-loader.js',
@@ -262,6 +265,7 @@ exports.rules = [
       'extensions/amp-story/1.0/animation.js->extensions/amp-animation/0.1/web-animation-types.js',
       // Story ads
       'extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.js->extensions/amp-story/1.0/amp-story-store-service.js',
+      'extensions/amp-story-auto-ads/0.1/story-ad-page.js->extensions/amp-story/1.0/amp-story-store-service.js',
       'extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.js->extensions/amp-story/1.0/events.js',
       // TODO(#24080) Remove this when story ads have full ad network support.
       'extensions/amp-story-auto-ads/0.1/story-ad-page.js->extensions/amp-ad-exit/0.1/config.js',
@@ -325,6 +329,8 @@ exports.rules = [
         'src/service/video-manager-impl.js',
       'extensions/amp-minute-media-player/0.1/amp-minute-media-player.js->' +
         'src/service/video-manager-impl.js',
+      'extensions/amp-redbull-player/0.1/amp-redbull-player.js->' +
+        'src/service/video-manager-impl.js',
       'extensions/amp-vimeo/0.1/amp-vimeo.js->' +
         'src/service/video-manager-impl.js',
       'extensions/amp-wistia-player/0.1/amp-wistia-player.js->' +
@@ -359,6 +365,12 @@ exports.rules = [
         'src/service/position-observer/position-observer-impl.js',
       'extensions/amp-next-page/0.1/next-page-service.js->' +
         'src/service/position-observer/position-observer-worker.js',
+      'extensions/amp-next-page/1.0/service.js->' +
+        'src/service/position-observer/position-observer-impl.js',
+      'extensions/amp-next-page/1.0/visibility-observer.js->' +
+        'src/service/position-observer/position-observer-worker.js',
+      'extensions/amp-next-page/1.0/visibility-observer.js->' +
+        'src/service/position-observer/position-observer-impl.js',
       'extensions/amp-user-notification/0.1/amp-user-notification.js->' +
         'src/service/notification-ui-manager.js',
       'extensions/amp-consent/0.1/amp-consent.js->' +
@@ -397,8 +409,6 @@ exports.rules = [
         'src/service/origin-experiments-impl.js',
       'extensions/amp-script/0.1/amp-script.js->' +
         'src/service/origin-experiments-impl.js',
-      'extensions/amp-live-list/0.1/live-list-manager.js->' +
-        'src/service/origin-experiments-impl.js',
       // For action macros.
       'extensions/amp-action-macro/0.1/amp-action-macro.js->' +
         'src/service/action-impl.js',
diff --git a/builtins/amp-img.js b/builtins/amp-img.js
index 1cd9621750dd0..c0e25d1e81902 100644
--- a/builtins/amp-img.js
+++ b/builtins/amp-img.js
@@ -16,6 +16,7 @@
 
 import {BaseElement} from '../src/base-element';
 import {Layout, isLayoutSizeDefined} from '../src/layout';
+import {Services} from '../src/services';
 import {dev} from '../src/log';
 import {guaranteeSrcForSrcsetUnsupportedBrowsers} from '../src/utils/img';
 import {isExperimentOn} from '../src/experiments';
@@ -98,6 +99,7 @@ export class AmpImg extends BaseElement {
         this.img_,
         /* opt_removeMissingAttrs */ true
       );
+      this.propagateDataset(this.img_);
       guaranteeSrcForSrcsetUnsupportedBrowsers(this.img_);
     }
   }
@@ -114,7 +116,7 @@ export class AmpImg extends BaseElement {
     // `src` url if it exists or the first srcset url.
     const src = this.element.getAttribute('src');
     if (src) {
-      this.preconnect.url(src, onLayout);
+      Services.preconnectFor(this.win).url(this.getAmpDoc(), src, onLayout);
     } else {
       const srcset = this.element.getAttribute('srcset');
       if (!srcset) {
@@ -124,7 +126,11 @@ export class AmpImg extends BaseElement {
       const srcseturl = /\S+/.exec(srcset);
       // Connect to the first url if it exists
       if (srcseturl) {
-        this.preconnect.url(srcseturl[0], onLayout);
+        Services.preconnectFor(this.win).url(
+          this.getAmpDoc(),
+          srcseturl[0],
+          onLayout
+        );
       }
     }
   }
@@ -179,6 +185,7 @@ export class AmpImg extends BaseElement {
     // It is important to call this before setting `srcset` attribute.
     this.maybeGenerateSizes_(/* sync setAttribute */ true);
     this.propagateAttributes(ATTRIBUTES_TO_PROPAGATE, this.img_);
+    this.propagateDataset(this.img_);
     guaranteeSrcForSrcsetUnsupportedBrowsers(this.img_);
     this.applyFillContent(this.img_, true);
     propagateObjectFitStyles(this.element, this.img_);
@@ -209,7 +216,7 @@ export class AmpImg extends BaseElement {
       return;
     }
 
-    const width = this.getLayoutWidth();
+    const width = this.element.getLayoutWidth();
     if (!this.shouldSetSizes_(width)) {
       return;
     }
@@ -264,7 +271,7 @@ export class AmpImg extends BaseElement {
     const img = dev().assertElement(this.img_);
     this.unlistenLoad_ = listen(img, 'load', () => this.hideFallbackImg_());
     this.unlistenError_ = listen(img, 'error', () => this.onImgLoadingError_());
-    if (this.getLayoutWidth() <= 0) {
+    if (this.element.getLayoutWidth() <= 0) {
       return Promise.resolve();
     }
     return this.loadPromise(img);
diff --git a/builtins/amp-img.md b/builtins/amp-img.md
index ce263b5b7a2ed..e3f9e43355e00 100644
--- a/builtins/amp-img.md
+++ b/builtins/amp-img.md
@@ -118,21 +118,24 @@ Learn more about using `amp-img` from these resources:
 
 ## Attributes
 
-**src**
+### src
 
 [filter formats="websites, stories, ads"]
 This attribute is similar to the `src` attribute on the `img` tag. The value must be a URL that points to a publicly-cacheable image file. Cache providers may rewrite these URLs when ingesting AMP files to point to a cached version of the image.
-[/filter]
+[/filter] <!-- formats="websites, stories, ads" -->
 
 [filter formats="email"]
 This attribute is similar to the `src` attribute on the `img` tag. For emails, the URL must be `https`.
-[/filter]
+[/filter] <!-- formats="email" -->
 
-**srcset**
+[filter formats="websites, stories, ads"]
+
+### srcset
 
 Same as `srcset` attribute on the `img` tag. For browsers that do not support `srcset`, `<amp-img>` will default to using `src`. If only `srcset` and no `src` is provided, the first url in the `srcset` will be selected.
+[/filter] <!-- formats="websites, stories, ads" -->
 
-**sizes**
+### sizes
 
 The value of the AMP `sizes` attribute is a sizes expression that selects the defined size corresponding to the media query based on the current window size. <strong>Additionally, AMP sets an inline style for `width` on the element</strong>. If the `srcset` attribute is provided, `<amp-img>` will autogenerate the HTML5 definition of the `sizes` attribute for the underlying `<img>`, when none is specified. If the `srcset` attribute is not provided, no `sizes` attribute will be autogenerated for the underlying `<amp-img>`.
 
@@ -144,22 +147,44 @@ For the `<img>` tag in `HTML`, the `sizes` attribute is used in conjunction with
 
 See [Responsive images with srcset, sizes & heights](https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/art_direction) for usage of `sizes` and `srcset`.
 
-**alt**
+### alt
 
 A string of alternate text, similar to the `alt` attribute on `img`.
 
-**attribution**
+### attribution
 
 A string that indicates the attribution of the image. For example, `attribution="CC courtesy of Cats on Flicker"`
 
-**height** and **width**
+### height and width
 
 An explicit size of the image, which is used by the AMP runtime to determine the aspect ratio without fetching the image.
 
-**common attributes**
+### common attributes
 
 This element includes [common attributes](https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes) extended to AMP components.
 
+### data attributes
+
+Data attributes are copied from the `amp-img` element to the internal `img` element created by the component.
+
+[filter formats="email"]
+
+### Invalid AMP email attributes
+
+The AMP for Email spec disallows the use of the following attributes on the AMP email format.
+
+- `[src]`
+- `[srcset]`
+- `srcset`
+- `lightbox`
+- `lightbox-thumbnail-id`
+- `object-fit`
+- `object-position`
+
+[tip type="read-on"]
+Enable a lightbox effect on `amp-img` in email by using the [`amp-image-lightbox`](../extensions/amp-image-lightbox/amp-image-lightbox.md) component with the `on` action.
+[/tip][/filter] <!-- formats="email" -->
+
 ## Styling
 
 `amp-img` can be styled directly via CSS properties. Setting a grey background
@@ -218,15 +243,26 @@ For example, instead of specifying `width="900"` and `height="675"`, you can jus
 
 #### Setting multiple source files for different screen resolutions
 
+[filter formats="websites, stories, ads"]
 The [`srcset`](#attributes) attribute should be used to provide different resolutions of the same image, that all have the same aspect ratio. The browser will automatically choose the most appropriate file from `srcset` based on the screen resolution and width of the user's device.
 
 In contrast, the [`media`](https://www.ampproject.org/docs/reference/common_attributes#media) attribute shows or hides AMP components, and should be used when designing responsive layouts. The appropriate way to display images with differing aspect ratios is to use multiple `<amp-img>` components, each with a `media` attribute that matches the screen widths in which to show each instance.
 
 See the guide on [creating responsive AMP pages](https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/responsive_design#displaying-responsive-images) for more details.
+[/filter]<!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+The [`media`](https://www.ampproject.org/docs/reference/common_attributes#media) attribute shows or hides AMP components, and should be used when designing responsive layouts. The appropriate way to display images with differing aspect ratios is to use multiple `<amp-img>` components, each with a `media` attribute that matches the screen widths in which to show each instance.
+
+See the guide on [creating responsive AMP pages](https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/responsive_design#displaying-responsive-images) for more details.
+[/filter]<!-- formats="email" -->
+
+[filter formats="websites, stories, ads"]
 
 #### Maintaining the aspect ratio for images with unknown dimensions
 
-The AMP layout system requires the aspect ratio of an image in advance before fetching the image; however, in some cases you might not know the image's dimensions. To display images with unknown dimensions and maintain the aspect ratios, combine AMP's [`fill`](https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/control_layout) layout with the [`object-fit`](https://css-tricks.com/almanac/properties/o/object-fit/) CSS property. For more information, see AMP By Example's [How to support images with unknown dimensions](https://amp.dev/documentation/examples/style-layout/how_to_support_images_with_unknown_dimensions/).
+The AMP layout system requires the aspect ratio of an image in advance before fetching the image; however, in some cases you might not know the image's dimensions. To display images with unknown dimensions and maintain the aspect ratios, combine AMP's [`fill`](https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/control_layout) layout with the [`object-fit`](https://css-tricks.com/almanac/properties/o/object-fit/) CSS property. For more information, see the [How to support images with unknown dimensions](https://amp.dev/documentation/examples/style-layout/how_to_support_images_with_unknown_dimensions/) example.
+[/filter]<!-- formats="websites, stories, ads" -->
 
 ## Validation
 
diff --git a/contributing/TESTING.md b/contributing/TESTING.md
index daae522153a59..cc64d1046f820 100644
--- a/contributing/TESTING.md
+++ b/contributing/TESTING.md
@@ -53,6 +53,7 @@ Before running these commands, make sure you have Node.js, yarn, and Gulp instal
 | `gulp dist --extensions=minimal_set`                      | Builds production binaries, with only the extensions needed to load `article.amp.html`.                                                                                                                                                       |
 | `gulp dist --extensions_from=examples/foo.amp.html`       | Builds production binaries, with only extensions from the listed examples.                                                                                                                                                                    |
 | `gulp dist --noextensions`                                | Builds production binaries without building any extensions.                                                                                                                                                                                   |
+| `gulp dist --core_runtime_only`                           | Builds production binary for just the core runtime.                                                                                                                                                                                           |
 | `gulp dist --fortesting`                                  | Builds production binaries for local testing. (Allows use cases like ads, tweets, etc. to work with minified sources. Overrides `TESTING_HOST` if specified. Uses the production `AMP_CONFIG` by default.)                                    |
 | `gulp dist --fortesting --config=<config>`                | Builds production binaries for local testing, with the specified `AMP_CONFIG`. `config` can be `prod` or `canary`. (Defaults to `prod`.)                                                                                                      |
 | `gulp lint`                                               | Validates JS files against the ESLint linter.                                                                                                                                                                                                 |
@@ -69,6 +70,7 @@ Before running these commands, make sure you have Node.js, yarn, and Gulp instal
 | `gulp build --extensions=minimal_set`                     | Builds the AMP library, with only the extensions needed to load `article.amp.html`.                                                                                                                                                           |
 | `gulp build --extensions_from=examples/foo.amp.html`      | Builds the AMP library, with only the extensions needed to load the listed examples.                                                                                                                                                          |
 | `gulp build --noextensions`                               | Builds the AMP library with no extensions.                                                                                                                                                                                                    |
+| `gulp build --core_runtime_only`                          | Builds only the core runtime of the AMP library.                                                                                                                                                                                              |
 | `gulp build --fortesting`                                 | Builds the AMP library and sets the `test` field in `AMP_CONFIG` to `true`.                                                                                                                                                                   |
 | `gulp check-links --files=<files-path-glob>`              | Reports dead links in `.md` files.                                                                                                                                                                                                            |
 | `gulp check-links --local_changes`                        | Reports dead links in `.md` files changed in the local branch.                                                                                                                                                                                |
@@ -80,6 +82,7 @@ Before running these commands, make sure you have Node.js, yarn, and Gulp instal
 | `gulp watch --extensions=minimal_set`                     | Watches for changes in files, re-builds only the extensions needed to load `article.amp.html`.                                                                                                                                                |
 | `gulp watch --extensions_from=examples/foo.amp.html`      | Watches for changes in files, re-builds only the extensions needed to load the listed examples.                                                                                                                                               |
 | `gulp watch --noextensions`                               | Watches for changes in files, re-builds with no extensions.                                                                                                                                                                                   |
+| `gulp watch --core_runtime_only`                          | Watches for changes in the core runtime, re-builds.                                                                                                                                                                                           |
 | `gulp pr-check`                                           | Runs all the Travis CI checks locally.                                                                                                                                                                                                        |
 | `gulp pr-check --nobuild`                                 | Runs all the Travis CI checks locally, but skips the `gulp build` step.                                                                                                                                                                       |
 | `gulp pr-check --files=<test-files-path-glob>`            | Runs all the Travis CI checks locally, and restricts tests to the files provided.                                                                                                                                                             |
diff --git a/contributing/contributing-code.md b/contributing/contributing-code.md
index 3eaa15dd7bdd0..cfa14e9a66d59 100644
--- a/contributing/contributing-code.md
+++ b/contributing/contributing-code.md
@@ -175,3 +175,35 @@ These guidelines are specific to the amphtml repository. Other ampproject repos
   - When creating a new directory (such as when creating a new AMP extension) the author of the pull request should designate themselves as an Owner of that directory.
   - Owners of an area may approve other Owners at or below their area of expertise following the normal PR process. To request becoming an Owner create a PR adding yourself to the appropriate OWNERS file and assign/cc a current Owner for that directory.
 - The list of Owners for a directory can be found in the [OWNERS](https://github.com/ampproject/amphtml/search?o=asc&q=filename%3A"OWNERS"&s=indexed) file in the directory or a parent directory.
+
+## Cherry-picks
+
+We have a well-defined process for handling requests for changes to the **experimental**/**beta**, **stable**, or **lts** release builds. These changes are known as "cherry-picks".
+
+**The bar for getting a cherry-pick into a live release is very high** because our goal is to produce high quality launches on a predictable schedule.
+
+**Keep in mind that performing a cherry-pick requires a significant amount of work from you and the on-duty engineer** and they can take a long time to process.
+
+- In general only fixes for [P0 issues](https://github.com/ampproject/amphtml/blob/master/contributing/issue-priorities.md) may be cherry-picked. P0 issues are those that:
+  - cause privacy or security issues
+  - cause user data loss
+  - break existing AMP web pages in a significant way
+  - cause an outage or critical production issue
+  - or would otherwise cause a significant harm to AMP's reputation if left unresolved
+- Regressions found in the **experimental**/**beta** releases that are not P0 _may_ be approved if they can be resolved with a rollback. Fixes other than rollbacks--no matter how simple they may seem--will not be approved because these have the potential to cause cascading problems and delay the release promotion of **beta** to **stable** for everyone.
+
+### Process for requesting a cherry-pick
+
+The following outlines the process to request a cherry-pick.
+
+- Ensure there is a [GitHub issue](https://github.com/ampproject/amphtml/issues/new/choose) filed for the problem that needs to be resolved _before_ filing the cherry-pick request issue.
+- File the cherry-pick request issue using the [Cherry-pick request template](https://github.com/ampproject/amphtml/issues/new?title=%F0%9F%8C%B8%20Cherry%20pick%20request%20for%20%3CYOUR_ISSUE_NUMBER%3E%20into%20%3CRELEASE_ISSUE_NUMBER%3E%20%28Pending%29&template=cherry_pick_template.md). Follow the instructions in the template, providing all the requested data. **Make sure you fill out this issue completely or your cherry-pick may not be seen or acted upon.**
+- Get the necessary approval for your cherry-pick, indicated via comments on the cherry-pick request issue.
+  - For cherry-picks into **experimental**/**beta**, at least one member of the [Approvers WG](https://github.com/orgs/ampproject/teams/wg-approvers/members) must approve the cherry-pick/rollback.
+  - For cherry-picks into **stable**/**lts** at least one member from the [Cherry-Pick Approvers group](https://github.com/orgs/ampproject/teams/cherry-pick-approvers/members) must approve the cherry-pick.
+- Once approved, the on-duty engineer handling releases will work with you to ensure the cherry-pick is made.
+- **Once the cherry-pick is made you are responsible for verifying the cherry-pick fixes the issue and does not cause other issues.**
+
+**If you are requesting a cherry-pick to fix an issue in production** it is likely you will _also_ need a cherry-pick into the **experimental**/**beta** releases. Problems cherry-picked in **stable** could be overridden after promoting **beta**. The on-duty engineer will help determine if you need to cherry-pick both release channels.
+
+If you run into any issues or have any questions when requesting a cherry-pick, please use the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)).
diff --git a/contributing/design-reviews.md b/contributing/design-reviews.md
index 358b48d02d131..7fc6e6bb9e2b9 100644
--- a/contributing/design-reviews.md
+++ b/contributing/design-reviews.md
@@ -27,33 +27,17 @@ Design reviews are a great way to discuss and refine your designs with knowledge
 
 The process for bringing a design to the design review is:
 
-- Determine if you need a design document; in many cases a fully detailed Intent-to-implement (I2I) GitHub issue or other GitHub issue describing the problem and proposed solution may be sufficient. If you have a reviewer work with them to decide what makes sense in your case, otherwise you can ask in the [#contributing Slack channel](https://amphtml.slack.com/messages/contributing/) ([sign up](https://bit.ly/amp-slack-signup)).
-- If you are going to create a design document, create it as a shared Google Document open to public comments:
-
-  - A short design doc is fine as long as it covers your design in sufficient detail to allow for a review by other members of the community.
-  - Take a look at [Design docs - A design doc](https://medium.com/@cramforce/design-docs-a-design-doc-a152f4484c6b) for tips on putting together a good design doc. [Phone call tracking in AMP](https://docs.google.com/document/d/1UDMYv0f2R9CvMUSBQhxjtkSnC4984t9dJeqwm_8WiAM/edit) and [New AMP Boilerplate](https://docs.google.com/document/d/1gZFaKvcDffceJNaI3bYfuYPtYU5u2y6UhE5wBPTsJ9w/edit) are examples of past AMP design docs.
-  - Add this license text to the top of your design doc before sharing it with anyone else in the community (updating the year if necessary):
-
-    ```js
-    Copyright 2019 The AMP HTML Authors. All Rights Reserved.
-
-    Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-    Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-
-    See the License for the specific language governing permissions and limitations under the License.
-    ```
-
+- Determine how to document your design.
+  - Most larger, more complex designs should use an [explainer](#explainers).
+  - For smaller issues, you may use a fully detailed Intent-to-implement (I2I) GitHub issue or other GitHub issue describing the problem and proposed solution.
+  - If you aren't sure which option you should use to document your design, ask your reviewer or the [#contributing Slack channel](https://amphtml.slack.com/messages/contributing/) ([sign up](https://bit.ly/amp-slack-signup)).
 - Perform a design pre-review with your reviewer if you have one; they may include other people that know the areas your design affects in this pre-review as well. If you don't have a reviewer you can request a pre-review in the [#contributing Slack channel](https://amphtml.slack.com/messages/contributing) ([sign up](https://bit.ly/amp-slack-signup)). It is fine to request a pre-review before your design is complete.
-
-- When your design is ready to be discussed at a design review add a comment on the [Design Review GitHub issue](https://github.com/ampproject/amphtml/labels/Type%3A%20Design%20Review) for the date/time that works best for you. Make sure to pay attention to the time since we rotate between times that work for differents parts of the world. Post a link to your GitHub issue/design doc and a brief summary by **Monday** on the week of your design review. In your comment on the Design Review issue you may want to point out details of the design you'd particularly like to cover in the review.
-
+- When your design is ready to be discussed at a design review add a comment on the [Design Review GitHub issue](https://github.com/ampproject/amphtml/labels/Type%3A%20Design%20Review) for the date/time that works best for you.
+  - You must add your design review topic to the design review issue at least 24 hours in advance of the design review.
+  - Your comment should point to the explainer, I2I or other GitHub issue describing the design that you want to discuss. Your design review comment **must** link to an explainer or GitHub issue. Topics that do not provide this link will not be discussed at the design review. You may highlight in this comment which parts of the design you'd like feedback on.
 - During the design review you'll lead the community in a conversation about your design. The design reviews are fairly informal and don't have a fixed structure.
-
-  - You don't need to have any slides or material other than your GitHub issue/design doc prepared for the design review.
-  - It can be helpful to present the GitHub issue/design doc during the meeting using the video conference "share your screen" functionality. (If you have technical trouble doing this, someone else at the meeting can handle it.)
+  - You don't need to have any slides or material other than your explainer/GitHub issue prepared for the design review.
+  - Present your explainer/issue during the meeting using the video conference "present" functionality. (If you have technical trouble doing this, someone else at the meeting can handle it.)
   - You can assume that the people at the meeting have at least skimmed through your design to understand the area being discussed, but they may not be completely familiar with the nuances of your design.
   - It is recommended that you start the discussion with a brief overview of your design.
   - After the initial overview, lead the attendees through the parts of the design you would like feedback on. If you have a reviewer, they may suggest particular areas to focus on in the discussion. Potential things to think about:
@@ -63,5 +47,31 @@ The process for bringing a design to the design review is:
     - Do we need to conduct user research before going in to the implementation?
   - Working Groups will be represented at the Design Review to allow you to gather feedback across their different areas of expertise.
   - We'll take notes during the design review and post them to the Design Review GitHub issue shortly after the meeting.
+- Update your design based on the feedback in the design review and any followup conversations in other channels.
+- Once your design is finalized, please provide a brief update at the start of a future design review (if you are able to attend).
+
+## Explainers
+
+For larger design topics (e.g. new features, or a significant change), the use of an explainer merged into the appropriate working group repository on GitHub is preferred.
+
+- An explainer is simply a document in the markdown format (md) that describes your proposed design.
+  - You create an explainer as a Pull Request, and comments/updates can be made using the normal PR review process.
+  - Explainers should be added to the appropriate Working Group repository. Explainers for work that span multiple working groups may be placed in any of the appropriate WG repos. Explainers for work that does not align with a WG may use the [ampproject design-doc](https://github.com/ampproject/design-docs) repository.
+  - You _may_ use a public Google document (with public comments enabled) instead of an md file for your explainer, but this has significant disadvantages. If you use a Google document, you _must_ submit a PDF version in the same repository you would have used for an explainer md file.
+  - The [W3C TAG Explainer document](https://w3ctag.github.io/explainers) describes what an explainer should contain and a recommended template. [Design docs - A design doc](https://medium.com/@cramforce/design-docs-a-design-doc-a152f4484c6b) also has tips on documenting a design.
+  - An explainer does not need to be "final" before being merged in. You may merge in a draft copy and handle updates through issues/PRs as needed.
+  - Explainers (whether as an md file or in a Google document) should be visible to the public, and any member of the community should be able to comment on it. The explainer should not link to non-public information except in extraordinary circumstances, and the non-public nature of the link and the reason for it not being public should be detailed.
+- See the ["Using React/Preact to implement AMP elements" explainer](https://github.com/ampproject/wg-bento/blob/master/react/explainer.md) for an example.
+- Add this license text to the top of your design doc before sharing it with anyone else in the community (updating the year if necessary):
+
+  ```js
+  Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
+
+  http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 
-- Update your design based on the feedback in the design review and any followup conversations in other channels. Once your design is finalized, please provide a brief update at the start of a future design review (if you are able to attend). If you create a design doc submit a PDF version in the [ampproject design-doc](https://github.com/ampproject/design-docs) repository.
+  See the License for the specific language governing permissions and limitations under the License.
+  ```
diff --git a/contributing/getting-started-e2e.md b/contributing/getting-started-e2e.md
index 3c760e98578b4..a484fb9d882b9 100644
--- a/contributing/getting-started-e2e.md
+++ b/contributing/getting-started-e2e.md
@@ -307,6 +307,9 @@ The common workflow for making changes to files in Git is:
 
 - if your code requires a new dependency, run `yarn add --exact [--dev] <packagename>`, which will automatically update `package.json` and `yarn.lock`
 
+  - If it is a build-time dependency, use the `--dev` flag
+  - If it is a runtime dependency, add it to `build-system/compile/sources.js`
+
 - if you manually edited `package.json`, run `yarn` to install the dependency and generate an updated `yarn.lock` file
 
 - tell Git that you care about these changes by _staging_ them using the `git add` command
@@ -582,9 +585,9 @@ AMP is pushed to production after undergoing testing. Generally, it takes about
 
 **Once the push of the build that includes your change is complete all users of AMP will be using the code you contributed!**
 
-You can see whether your change made it into a given build on the [amphtml Releases page](https://github.com/ampproject/amphtml/releases). The build marked `Pre-release` is the version on the Dev Channel and the build marked `Latest Release` is what is running in production. Your Pull Request will be listed in the first build that includes it; if you don't see your Pull Request listed it will likely be in the next build.
+You can see whether your change made it into a given build on the [amphtml Releases page](https://github.com/ampproject/amphtml/releases). The build marked `Pre-release` is the version on the Experimental Channel and the build marked `Latest Release` is what is running in production. Your Pull Request will be listed in the first build that includes it; if you don't see your Pull Request listed it will likely be in the next build.
 
-You can set your browser to use the Dev Channel build by enabling `dev-channel` on the [AMP Experiments](https://cdn.ampproject.org/experiments.html) page. This will let you see how your changes will affect any AMP page before your changes are rolled out to all AMP pages. Note that this only affects the browser in which you enable the experiment.
+You can set your browser to use the Experimental Channel build by enabling `experimental-channel` on the [AMP Experiments](https://cdn.ampproject.org/experiments.html) page. This will let you see how your changes will affect any AMP page before your changes are rolled out to all AMP pages. Note that this only affects the browser in which you enable the experiment.
 
 You can verify the AMP version your browser is using for a given page by looking at your browser's developer console. After loading an AMP page (e.g. [https://amp.dev](https://amp.dev)) the console will have a message like `Powered by AMP ⚡ HTML – Version <build number>`). The `<build number>` will match one of the build numbers on the [amphtml Releases page](https://github.com/ampproject/amphtml/releases).
 
diff --git a/contributing/getting-started-quick.md b/contributing/getting-started-quick.md
index 0d9713cf6ccb6..0866f1e6a6628 100644
--- a/contributing/getting-started-quick.md
+++ b/contributing/getting-started-quick.md
@@ -112,6 +112,8 @@ git checkout -b <branch name> master
 1. Edit files in your favorite editor
 2. Make sure your changes satisfy AMP's [code quality and style rules](getting-started-e2e.md#code-quality-and-style)
 3. If your code requires a new dependency, run `yarn add --dev --exact [packagename]`, which automatically updates `package.json` and `yarn.lock`
+   - If it is a build-time dependency, use the `--dev` flag
+   - If it is a runtime dependency, add it to `build-system/compile/sources.js`
 4. If you manually edited `package.json`, run `yarn` to install the dependency and generate an updated `yarn.lock` file
 5. Add each file you change: `git add <file>`
 6. Create a commit: `git commit -m "<your commit message>"`
@@ -155,6 +157,6 @@ git checkout -b <branch name> master
 
 - If your change affected internal documentation, tests, the build process, etc. you can generally see your changes right after they're merged.
 - If your change was to the code that runs on AMP pages across the web, you'll have to wait for the change to be included in a production release. Generally, it takes about 1-2 weeks for a change to be live for all users. See the [release schedule](release-schedule.md) for more specific details.
-- The [amphtml Releases page](https://github.com/ampproject/amphtml/releases) will list your PR in the first build that contains it. `Pre-release` is the build on the Dev Channel, `Latest Release` is the build in production.
-- Opt in to using the Dev Channel in a browser by enabling `dev-channel` on the [AMP Experiments](https://cdn.ampproject.org/experiments.html) page.
+- The [amphtml Releases page](https://github.com/ampproject/amphtml/releases) will list your PR in the first build that contains it. `Pre-release` is the build on the Experimental Channel, `Latest Release` is the build in production.
+- Opt in to using the Experimental Channel in a browser by enabling `experimental-channel` on the [AMP Experiments](https://cdn.ampproject.org/experiments.html) page.
 - Find the AMP version being used on a page in the developer console, i.e. `Powered by AMP ⚡ HTML – Version <build number>`.
diff --git a/contributing/lts-release.md b/contributing/lts-release.md
new file mode 100644
index 0000000000000..d1ce3383ff995
--- /dev/null
+++ b/contributing/lts-release.md
@@ -0,0 +1,37 @@
+# Long-Term Stable (lts) Release Channel
+
+The **lts** release channel provides a previous **stable** build for one-month intervals. On the second Monday of each month, the current **stable** release is promoted to **lts**. This channel is not recommended for all AMP publishers. It is provided so that publishers who wish to perform a QA cycle on their website less frequently may do so by opting specific web pages into the **lts** channel.
+
+In the event that the second Monday of the month falls during a [release freeze](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md#release-freezes) (such as on one of the major US holidays), the promotion will be performed after the end of the release freeze.
+
+> Note: The **lts** release channel is available only to AMP Websites; it is not available to AMP Actions, AMP for Email, AMP Stories, or AMP for Ads.
+
+## How to Opt-In
+
+### Standard AMP HTML runtime and extension scripts
+
+> Note: recommended for most sites
+
+```html
+<script async src="https://cdn.ampproject.org/v0.js"></script>
+<script
+  async
+  custom-element="amp-ad"
+  src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"
+></script>
+```
+
+### LTS AMP HTML runtime and extension scripts
+
+```html
+<script async src="https://cdn.ampproject.org/lts/v0.js"></script>
+<script
+  async
+  custom-element="amp-ad"
+  src="https://cdn.ampproject.org/lts/v0/amp-ad-0.1.js"
+></script>
+```
+
+While it is a requirement that the same version is used for the runtime and extension scripts, requesting **lts** is valid AMP. It will get the same cache benefits as the stable release channel.
+
+**Important**: Publishers using the **lts** release channel should be careful when using newly introduced features. Because of the longer cycle, the **lts** release may be as much as seven weeks behind the `HEAD` of [`ampproject/amphtml`](https://github.com/ampproject/amphtml). See the section on [determining if your change is in a release](https://github.com/ampproject/amphtml/blob/master/contributing/release-schedule.md#Determining-if-your-change-is-in-a-release) to validate if a change will be ready with your chosen release cycle.
diff --git a/contributing/release-schedule.md b/contributing/release-schedule.md
index 39c6cf65593f0..108b4841e692c 100644
--- a/contributing/release-schedule.md
+++ b/contributing/release-schedule.md
@@ -1,113 +1,79 @@
 # Release Schedule
 
-- [Detailed schedule](#detailed-schedule)
-- [Determining if your change is in production](#determining-if-your-change-is-in-production)
-- [Cherry picks](#cherry-picks)
-  - [Cherry pick criteria](#cherry-pick-criteria)
-  - [Process for requesting a cherry pick](#process-for-requesting-a-cherry-pick)
-- [AMP Dev Channel](#amp-dev-channel)
-- [AMP Release Candidate (RC) Channel](#amp-release-candidate-rc-channel)
-- [Release cadence](#release-cadence)
-- [Release freezes](#release-freezes)
+- [Release Channels](#release-channels)
+  - [Weekly](#weekly)
+  - [Long-Term Stable (lts)](#long-term-stable-lts)
+  - [AMP Experimental and Beta Channels](#amp-experimental-and-beta-channels)
+- [Determining if your change is in a release](#determining-if-your-change-is-in-a-release)
+- [Release Cadence](#release-cadence)
+  - [Detailed schedule](#detailed-schedule)
+  - [Release Freezes](#release-freezes)
 
 A new release of AMP is pushed to all AMP pages every week on Tuesday. **Once a change in AMP is merged into the master branch of the amphtml repository, it will typically take 1-2 weeks for the change be live for all users.**
 
-["Type: Release" GitHub issues](https://github.com/ampproject/amphtml/labels/Type%3A%20Release) are used to track the status of current and past releases (from the initial cut to canary testing to production). Announcements about releases are made on the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)).
+## Release Channels
 
-## Detailed schedule
+The AMP runtime and extensions are provided through a variety of different _release channels_. Each channel serves a purpose for developers and for the AMP HTML Project itself. See the [release cadence section](#release-cadence) for a more detailed breakdown of how and when code from the [`ampproject/amphtml`](https://github.com/ampproject/amphtml) repository makes it into release builds.
 
-We try to stick to this schedule as closely as possible, though complications may cause delays. You can track the latest status about any release in the ["Type: Release" GitHub issues](https://github.com/ampproject/amphtml/labels/Type%3A%20Release) and the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)).
+To determine if a PR has been included in any of the following release channels, look for the GitHub labels _PR Use: In Canary_, _PR Use: In Production_, or _PR Use: In LTS_ (see the section on [determining if your change is in a release](#Determining-if-your-change-is-in-a-release) for more details).
 
-- Tuesday @ [11am Pacific](https://www.google.com/search?q=11am+pacific+in+current+time+zone): a new canary release build is created from the [latest master build that passes all of our tests](https://travis-ci.org/ampproject/amphtml/branches) and is pushed to users of AMP who opted into the [AMP Dev Channel](#amp-dev-channel)
-- Wednesday: we check bug reports for Dev Channel users and if everything looks fine, we push the canary to 1% of AMP pages
-- Thursday-Monday: we continue to monitor error rates and bug reports for Dev Channel users and the 1% of pages with the canary build
-- Tuesday (about a week after the canary release build was cut): the canary is fully pushed to production (i.e. all AMP pages will now use this build)
+### Weekly
 
-## Determining if your change is in production
+The _weekly_ release channels are considered to be the primary "evergreen" release channels. A green build from the `master` branch is used to build the **experimental** and **beta** release channels; the **beta** release from the previous week is promoted to the **stable** release channel (see the [detailed schedule](#detailed-schedule)).
 
-You can determine what is in a given build using one of the following:
+There are two sets of build configurations used in creating release builds: the _canary_ configuration and the _production_ configuration. The **experimental** and **beta** release channels are built off of the same commit. However, the **experimental** channel uses the _canary_ configuration while the **beta** channel uses the _production_ configuration. The _canary_ configuration enables experimental components and features that may be turned off in _production_. It is possible to opt into the **experimental** or **beta** channels via the [experiments page](https://cdn.ampproject.org/experiments.html).
 
-- The ["Type: Release" GitHub issues](https://github.com/ampproject/amphtml/labels/Type%3A%20Release) for each release build will include a link to the specific [release page](https://github.com/ampproject/amphtml/releases) which lists the PRs in that release.
-  - The most recent "Type: Release" issue with `(Production)` in the title is the build currently in production.
-  - The "Type: Release" issue with `(Canary)` in the title tracks the current canary.
-- The [PR Use: In Canary](https://github.com/ampproject/amphtml/issues?utf8=%E2%9C%93&q=label%3A%22PR%20use%3A%20In%20Canary%22) and [PR Use: In Production](https://github.com/ampproject/amphtml/issues?utf8=%E2%9C%93&q=label%3A%22PR%20use%3A%20In%20Production%22) labels are added to PRs when they've made it into a canary/production build. There may be a delay between when the build is created and when it goes live.
+The **stable** release channel is built with the _production_ configuration and served to most AMP traffic. Since the **beta** release channel is also built from the _production_ configuration, it represents the exact build which will become **stable** the following week (modulo the possibility of cherry-picks; see [Contributing Code](https://github.com/ampproject/amphtml/blob/master/contributing/contributing-code.md#Cherry-picks)).
 
-## Cherry picks
+### Long-Term Stable (lts)
 
-We have a well-defined process for handling requests for changes to the canary release build or to the current production release build. These changes are known as "cherry picks".
+The **lts** release channel provides a previous **stable** build for one-month intervals. On the second Monday of each month, the current **stable** release is promoted to **lts**. This channel is not recommended for all AMP publishers. It is provided so that publishers who wish to perform a QA cycle on their website less frequently may do so by opting specific web pages into the **lts** channel (see the [**lts** readme](https://github.com/ampproject/amphtml/blob/master/contributing/lts-release.md)).
 
-### Cherry pick criteria
+In the event that the second Monday of the month falls on a holiday, the promotion will be performed after the end of the release freeze.
 
-**The bar for getting a cherry pick into canary or production is very high** because our goal is to produce high quality launches on a predictable schedule.
+Important: Publishers using the **lts** release channel should not use newly introduced features. Because of the longer cycle, the **lts** release may be as much as seven weeks behind the `HEAD` of [`ampproject/amphtml`](https://github.com/ampproject/amphtml). See the section on [determining if your change is in a release](#Determining-if-your-change-is-in-a-release) to validate if a change will be ready with your chosen release cycle.
 
-**Keep in mind that performing a cherry pick requires a significant amount of work from you and the onduty person** and they can take a long time to process.
+## Determining if your change is in a release
 
-- In general only fixes for [P0 issues](https://github.com/ampproject/amphtml/blob/master/contributing/issue-priorities.md) (causing "an outage or a critical production issue") may be cherry picked. P0 issues are those that:
-  - cause privacy or security issues
-  - cause user data loss
-  - break existing AMP web pages in a significant way
-  - or would otherwise cause a significant harm to AMP's reputation if left unresolved
-- Regressions found in the canary that are not P0 _may_ be approved if they can be resolved with a rollback. Fixes other than rollbacks--no matter how simple they may seem--will not be approved because these can cause cascading problems and delay the release of canary to production for everyone.
+[_Type: Release_ GitHub issues](https://github.com/ampproject/amphtml/labels/Type%3A%20Release) are used to track the status of current and past releases; from the initial cut, to testing via **experimantal**/**beta** channels, to eventual release via the **stable** and **lts** channels. Announcements about releases are made on the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)).
 
-### Process for requesting a cherry pick
+You can determine what changes are in a given build using one of the following:
 
-Use the following process to request a cherry pick if you have a change that you believe meets the [cherry pick criteria](#cherry-pick-criteria).
+- The [_Type: Release_ GitHub issues](https://github.com/ampproject/amphtml/labels/Type%3A%20Release) for each release build will include a link to the specific [release page](https://github.com/ampproject/amphtml/releases) listing the changes contained in that release.
+- The [_PR Use: In Canary_](https://github.com/ampproject/amphtml/issues?utf8=%E2%9C%93&q=label%3A%22PR%20use%3A%20In%20Canary%22), [_PR Use: In Production_](https://github.com/ampproject/amphtml/issues?utf8=%E2%9C%93&q=label%3A%22PR%20use%3A%20In%20Production%22), and [_PR Use: In LTS_](https://github.com/ampproject/amphtml/issues?utf8=%E2%9C%93&q=label%3A%22PR%20use%3A%20In%20LTS%22) labels are added to PRs when they've made it into a _weekly_ or **lts** build. There may be a delay between when the build is created and when the label is added.
 
-If you run into any issues or have any questions when requesting a cherry pick, please use the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)).
+> Note: These labels still use legacy release names. They will be renamed soon to reflect the new release channel names (**beta** and **stable**).
 
-- Ensure there is a GitHub issue filed for the problem that needs to be resolved _before_ filing the cherry pick request issue.
-- File the cherry pick request issue using the [Cherry pick request template](https://github.com/ampproject/amphtml/issues/new?title=%F0%9F%8C%B8%20Cherry%20pick%20request%20for%20%3CYOUR_ISSUE_NUMBER%3E%20into%20%3CRELEASE_ISSUE_NUMBER%3E%20%28Pending%29&template=cherry_pick_template.md). Follow the instructions in the template, providing all of the requested data. **Make sure you fill out this issue completely or your cherry pick may not be seen or acted upon.**
-- Get the necessary approval for your cherry pick (indicated via comments on the cherry pick request issue).
-  - For cherry picks into canary, at least one member of the [Approvers WG](https://github.com/orgs/ampproject/teams/wg-approvers/members) must approve the cherry pick.
-  - For cherry picks into prod:
-    - if the fix is a clean rollback that does not require any other changes, at least one member of the [Approvers WG](https://github.com/orgs/ampproject/teams/wg-approvers/members) must approve the cherry pick.
-    - otherwise, at least one member from the [Cherry Pick Approvers group](https://github.com/orgs/ampproject/teams/cherry-pick-approvers/members) must approve the cherry pick.
-- After the cherry pick has been approved, the person currently handling releases (onduty) will work with you to ensure the cherry pick is made.
-- **Once the cherry pick is made you are responsible for verifying that the cherry pick you requested fixes the reported issue and that it does not cause other issues.**
+### AMP Experimental and Beta Channels
 
-**If you are requesting a cherry pick to fix an issue in production** it is very likely you will _also_ need a cherry pick into the canary release since otherwise the problem your cherry pick addresses would reappear as soon as the canary release is pushed to production. Work with the onduty person to determine if you need a cherry pick to both and make sure your cherry pick request issue reflects what you determine.
+The _AMP Experimental Channel_ is a way to opt a browser into using the **experimental** release build of the AMP JS libraries. The _Experimental Channel_ **may be less stable** and it may contain features not yet available to all users.
 
-## AMP Dev Channel
+Opting into the _Experimental Channel_ is intended for:
 
-The AMP Dev Channel is a way to opt a browser into using the canary release build of the AMP JS libraries. The Dev Channel **may be less stable** and it may contain features not yet available to all users.
+- testing and playing with new features not yet available to all users
+- using in Quality Assurance (QA) to ensure that your site is compatible with upcoming features of AMP that are still under development
 
-Opting into the Dev Channel is great to:
+To opt your browser into the _AMP Experimental Channel_, go to [the AMP experiments page](https://cdn.ampproject.org/experiments.html) and activate the "AMP Experimental Channel" experiment. Please subscribe to our [low-volume announcements](https://groups.google.com/forum/#!forum/amphtml-announce) mailing list to get notified about important/breaking changes about AMP.
 
-- test and play with new features not yet available to all users
-- use in Quality Assurance (QA) to ensure that your site is compatible with upcoming features of AMP that are still under development
+The _AMP Beta Channel_ is a way to opt a browser into using the **beta** release build of the AMP JS libraries that will be promoted to **stable** during the subsequent release cycle (typically, a week later). It is similar to the _Experimental Channel_ described above, but it will not contain the experimental features that are still under development.
 
-When you opt into the AMP Dev Channel you are only affecting the AMP JS libraries in your browser; there is no way to force visitors to your site to use the AMP Dev Channel version of AMP.
+Opting into the _Beta Channel_ is intended for:
 
-To opt your browser into the AMP Dev Channel, go to [the AMP experiments page](https://cdn.ampproject.org/experiments.html) and activate the "AMP Dev Channel" experiment. Please subscribe to our [low-volume announcements](https://groups.google.com/forum/#!forum/amphtml-announce) mailing list to get notified about important/breaking changes about AMP.
+- testing and playing with the version of the AMP runtime that will be released soon
+- using in Quality Assurance (QA) to ensure that your site is compatible with the next version of AMP
 
-**If you find an issue that appears to only occur in the Dev Channel version of AMP**:
+When you opt into the _Experimental_ or _Beta_ channel, you are only affecting the AMP JS libraries in your browser; there is no way to force visitors to your site to use the _AMP Experimental/Beta Channel_ version of AMP.
 
-- please [file an issue](https://github.com/ampproject/amphtml/issues/new) with a description of the problem
-  - include a note that the problem is new to the Dev Channel build so that it can be properly prioritized
-  - include a URL to a page that reproduces the problem
-- ping the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)) with the issue you filed so we can delay the push of the Dev Channel version to production if needed
-
-## AMP Release Candidate (RC) Channel
-
-The AMP Release Candidate (RC) Channel is a way to opt a browser into using the build of the AMP JS libraries that will be released during the subsequent release cycle (typically, a week later). It is similar to the Dev Channel described above, but it will not contain the experimental features that are still under development.
-
-Opting into the RC Channel is great to:
-
-- test and play with the version of the AMP runtime that will be released soon
-- use in Quality Assurance (QA) to ensure that your site is compatible with the next version of AMP
+To opt your browser into one of these channels, go to [the AMP experiments page](https://cdn.ampproject.org/experiments.html) and activate the "AMP Experimental Channel" or "AMP Beta Channel" experiment. Please subscribe to our [low-volume announcements](https://groups.google.com/forum/#!forum/amphtml-announce) mailing list to get notified about important/breaking changes about AMP.
 
-Similar to the Dev channel, when you opt into the AMP RC Channel you are only affecting the AMP JS libraries in your browser; there is no way to force visitors to your site to use the AMP RC Channel version of AMP.
-
-To opt your browser into the AMP RC Channel, go to [the AMP experiments page](https://cdn.ampproject.org/experiments.html) and activate the "AMP RC Channel" experiment. Please subscribe to our [low-volume announcements](https://groups.google.com/forum/#!forum/amphtml-announce) mailing list to get notified about important/breaking changes about AMP.
-
-**If you find an issue that appears to only occur in the RC Channel version of AMP**:
+**If you find an issue that appears to only occur in the _Experimental/Beta Channel_ version of AMP**:
 
 - please [file an issue](https://github.com/ampproject/amphtml/issues/new) with a description of the problem
-  - include a note that the problem is new to the RC Channel build so that it can be properly prioritized
+  - include a note that the problem is new to the _Experimental/Beta Channel_ build so that it can be properly prioritized
   - include a URL to a page that reproduces the problem
-- ping the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)) with the issue you filed so we can delay the push of the RC Channel version to production if needed
+- ping the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)) with the issue you filed so we can delay the push of the _Experimental/Beta Channel_ version to production if needed
 
-## Release cadence
+## Release Cadence
 
 We are intentionally cautious with our release cadence.
 
@@ -117,21 +83,31 @@ In determining how often we should push new versions of AMP to everyone, we have
 - cache busting that might happen when we push a new version
 - the desire to get new features out quickly
 
-After considering all of these factors we have arrived at the 1-2 week push cycle. Thus far we have found this to be a reasonable compromise, but we will continue to evaluate all of these factors and may make changes in the future.
+After considering all of these factors, we have arrived at the 1-2 week push cycle. Thus far, we have found this to be a reasonable compromise, but we will continue to evaluate all of these factors and may make changes in the future.
+
+### Detailed schedule
+
+We try to stick to this schedule as closely as possible, though complications may cause delays. You can track the latest status about any release in the [_Type: Release_ GitHub issues](https://github.com/ampproject/amphtml/labels/Type%3A%20Release) and the [AMP Slack #release channel](https://amphtml.slack.com/messages/C4NVAR0H3/) ([sign up for Slack](https://bit.ly/amp-slack-signup)).
+
+- Tuesday @ [11am Pacific](https://www.google.com/search?q=11am+pacific+in+current+time+zone): new **experimental** and **beta** release builds are created from the [latest master build that passes all of our tests](https://travis-ci.org/ampproject/amphtml/branches) and are pushed to users of AMP who opted into the [AMP Experimental Channel](#amp-experimental-and-beta-channels) or [AMP Beta Channel](#amp-experimental-and-beta-channels), respectively.
+- Wednesday: we check bug reports for _Experimental Channel_ and _Beta Channel_ users and if everything looks fine, we push the **beta** to 1% of AMP pages
+- Thursday-Monday: we continue to monitor error rates and bug reports for _Experimental Channel_ and _Beta Channel_ users and the 1% of pages with the **experimental**/**beta** builds
+- Tuesday the following week: the **beta** build is fully promoted to **stable** (i.e. all AMP pages will now use this build)
 
-## Release freezes
+### Release Freezes
 
 There are occasions when we will skip a release of AMP to production, known as a release freeze.
 
 If a one week release freeze is announced for Week N:
 
-- The previous week's release build remains in canary/RC for an extra week, i.e. the release cut in Week N-1 is not pushed to production in Week N as would normally be the case. Instead, it will be pushed to production in Week N+1.
-- A new release build is _not_ made in the production freeze week (Week N).
-- The normal schedule will resume in Week N+1, i.e. a canary is cut in Week N+1 and pushed to production in Week N+2.
+- The previous week's release build remains in **experimental**/**beta** for an extra week, i.e. the release cut in Week N-1 is not pushed to **stable** in Week N as would normally be the case. Instead, it will be pushed to **stable** in Week N+1.
+- A new release build is _not_ made in the freeze week (Week N).
+- The normal schedule will resume in Week N+1, i.e. **experimental**/**beta** are cut in Week N+1 and promoted to **stable** in Week N+2.
+- If the **stable** release promoted during Week N-1 was originally scheduled to be promoted to **lts** during Week N, it will now be promoted to **lts** on the Monday of Week N+1.
 
-A release freeze will happen due to:
+A release freeze may happen due to:
 
-- Times when there are not enough people available to push the AMP release to production and monitor it. Currently most of the people performing AMP releases are based in the United States, so this will usually be the weeks of the major US holidays of Independence Day (July 4), Thanksgiving (fourth Thursday in November), Christmas (25 December) and New Year's Eve/Day (December 31/January 1).
+- Times when there are not enough people available to push the AMP release to **stable** and monitor it. Currently most of the people performing AMP releases are based in the United States, so this will usually be the weeks of the major US holidays of Independence Day (July 4), Thanksgiving (fourth Thursday in November), Christmas (25 December) and New Year's Eve/Day (December 31/January 1).
 - An emergency situation, such as a security or privacy issue as determined by the [Technical Steering Committee (TSC)](https://github.com/ampproject/meta-tsc) or the people performing the release.
 - Other situations when stability of the codebase is deemed to be particularly important as determined by the TSC.
 
diff --git a/css/ampdoc.css b/css/ampdoc.css
index b576e6865d604..1eea89a61a7d2 100644
--- a/css/ampdoc.css
+++ b/css/ampdoc.css
@@ -320,12 +320,14 @@ amp-autocomplete {
   display: inline-block !important;
 }
 
-amp-autocomplete > input {
-  padding: .5rem; /* default-ui-space-large */
-  border: 1px solid rgba(0,0,0,.33) /* default-ui-med-gray */
+amp-autocomplete > input,
+amp-autocomplete > textarea {
+  padding: 0.5rem; /* default-ui-space-large */
+  border: 1px solid rgba(0, 0, 0, 0.33); /* default-ui-med-gray */
 }
 
 amp-autocomplete > input,
+amp-autocomplete > textarea,
 .i-amphtml-autocomplete-results {
   font-size: 1rem; /* default-ui-font-size */
   line-height: 1.5rem; /* default-ui-space-large */
diff --git a/examples/ads.amp.html b/examples/ads.amp.html
index 5c2dd4a4d92a5..4c4ba67869b08 100644
--- a/examples/ads.amp.html
+++ b/examples/ads.amp.html
@@ -94,6 +94,7 @@
         <option>adreactor</option>
         <option>adsense</option>
         <option>adsensor</option>
+        <option>adservsolutions</option>
         <option>adsloom</option>
         <option>adsnative</option>
         <option>adspeed</option>
@@ -123,6 +124,7 @@
         <option>blade</option>
         <option>brainy</option>
         <option>bringhub</option>
+        <option>byplay</option>
         <option>caajainfeed</option>
         <option>capirs</option>
         <option>caprofitx</option>
@@ -194,6 +196,7 @@
         <option>mytarget</option>
         <option>mywidget</option>
         <option>nativeroll</option>
+        <option>nativery</option>
         <option>nativo</option>
         <option>navegg</option>
         <option>nend</option>
@@ -246,7 +249,9 @@
         <option>speakol</option>
         <option>spotx</option>
         <option>springAds</option>
+        <option>ssp</option>
         <option>strossle</option>
+        <option>sulvo</option>
         <option>sunmedia</option>
         <option>svknative</option>
         <option>swoop</option>
@@ -262,6 +267,7 @@
         <option>unruly</option>
         <option>uzou</option>
         <option>valuecommerce</option>
+        <option>vdo.ai</option>
         <option>videointelligence</option>
         <option>videonow</option>
         <option>viralize</option>
@@ -611,6 +617,13 @@ <h2>AdSensor</h2>
       data-adunit-id="1226707">
   </amp-ad>
 
+  <h2>AdServSolutions</h2>
+  <amp-ad width="300" height="250"
+      type="adservsolutions"
+      data-client="adservsolutions.com"
+      data-zid="1953913050">
+  </amp-ad>
+
   <h2>AdsLoom</h2>
   <amp-ad width="800" height="600"
              type="adsloom"
@@ -871,6 +884,12 @@ <h2>Bringhub Mini-Storefront</h2>
       heights="(max-width: 270px) 1280px, (max-width:553px) 640px, 338px">
   </amp-embed>
 
+  <h2>ByPlay</h2>
+  <amp-ad width="400" height="225"
+    type="byplay"
+    data-vast-url="https://h.f1.impact-ad.jp/adv?section_id=7693&env=dev">
+  </amp-ad>
+
   <h2>CA A.J.A. Infeed</h2>
   <amp-ad width="320" height="120"
       type="caajainfeed"
@@ -901,7 +920,7 @@ <h2>Cedato</h2>
 
   <h2>Conative</h2>
 
-    <amp-ad 
+    <amp-ad
         type="conative"
         height="250"
         width="300"
@@ -1535,6 +1554,14 @@ <h2>Nativeroll</h2>
   >
   </amp-ad>
 
+  <h2>Nativery</h2>
+  <amp-ad width="480" height="340"
+      layout="responsive"
+      type="nativery"
+      data-wid="5daf5a1dacf7e85862ae241a"
+  >
+  </amp-ad>
+
   <h2>Nativo</h2>
   <amp-ad width="350" height="150"
       type="nativo"
@@ -1798,8 +1825,8 @@ <h2>ReadMo</h2>
       type="readmo"
       layout="responsive"
       heights="(min-width: 1200px) 50%, (min-width: 780px) 60%, (max-width: 480px) 180%, 100%"
-      data-section="5591639"
-      data-url="https://techcrunch.com/"
+      data-section="amp-test"
+      data-url="https://yourdomain.com/"
       data-sponsored-by-label=""
       data-module="end-of-article">
   </amp-embed>
@@ -2052,12 +2079,29 @@ <h2>Spring Ads</h2>
           data-adslot="mrec">
   </amp-ad>
 
+  <h2>SSP</h2>
+  <amp-ad width="300" height="600"
+          type="ssp"
+          data-width="480"
+          data-height="300"
+          data-id="cnt-166991"
+          data-zoneid="166991">
+  </amp-ad>
+
   <h2>Strossle</h2>
   <amp-embed height="580"
              type="strossle"
              data-widgetid="widget-5b583cae934ad">
   </amp-embed>
 
+  <h2>Sulvo</h2>
+  <amp-ad
+    width=300 height=250
+    type="sulvo"
+    data-ad="example.com_display"
+    class="demand-supply">
+  </amp-ad>
+
   <h2>SunMedia</h2>
   <amp-ad width="300" height="1"
       type="sunmedia"
@@ -2286,6 +2330,17 @@ <h2>ValueCommerce</h2>
       data-pid="884466614">
   </amp-ad>
 
+  <h2>VDO.AI</h2>
+  <amp-ad width="375"
+      height="0"
+      id="_vdo_ads_player_ai_"
+      type="vdoai"
+      data-unitid="_vdo_ads_player_ai_"
+      data-tagname="publisher"
+      layout="responsive"
+      >
+  </amp-ad>
+
 <h2>Video intelligence</h2>
   <amp-ad width="500" height="400"
           type="videointelligence"
diff --git a/examples/amp-autocomplete.ssr.html b/examples/amp-autocomplete.ssr.html
new file mode 100644
index 0000000000000..a80ebdb9206cb
--- /dev/null
+++ b/examples/amp-autocomplete.ssr.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html ⚡ allow-viewer-render-template>
+  <head>
+    <meta charset="utf-8">
+    <title>Forms Examples in AMP</title>
+    <link rel="canonical" href="//example.com" >
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.1.js"></script>
+    <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
+  </head>
+  <body>
+    <h4>
+      Autocomplete Search (GET xhr cross origin current host > httpbin.org)
+    </h4>
+    <form
+      method="get"
+      action="https://httpbin.org/response-headers"
+      action-xhr="https://httpbin.org/response-headers"
+      target="_blank">
+      <amp-autocomplete
+        src="https://lively-and-awesome.appspot.com/ssr_amp_list/"
+        min-characters="0">
+        <input type="search" name="term" required />
+        <template type="amp-mustache">
+          <div class="product">{{name}}</div>
+        </template>
+      </amp-autocomplete>
+      <input type="submit" value="Search" />
+      <div submit-success>
+        <template type="amp-mustache">
+          <h1>You searched for: {{term}}</h1>
+        </template>
+      </div>
+    </form>
+  </body>
+</html>
diff --git a/examples/amp-consent-geooveride.html b/examples/amp-consent-geooveride.html
deleted file mode 100644
index 62da5d37ffe2e..0000000000000
--- a/examples/amp-consent-geooveride.html
+++ /dev/null
@@ -1,376 +0,0 @@
-<!doctype html>
-<html ⚡>
-<head>
-  <meta charset="utf-8">
-  <title>AMP Consent Test</title>
-  <link rel="canonical" href="amps.html" >
-  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-  <link href='https://fonts.googleapis.com/css?family=Georgia|Open+Sans|Roboto' rel='stylesheet' type='text/css'>
-
-  <style amp-custom>
-    body {
-      margin: 0;
-      font-family: 'Georgia', Serif;
-    }
-
-    .brand-logo {
-      font-family: 'Open Sans';
-    }
-
-    .ad-container {
-      display: flex;
-      justify-content: center;
-    }
-
-    .content-container p {
-      line-height: 24px;
-    }
-
-    header,
-    .article-body {
-      padding: 15px;
-    }
-
-    .full-bleed {
-      margin: 0 -15px;
-    }
-
-    figure {
-      margin: 0;
-    }
-
-    figcaption {
-      color: #6f757a;
-      padding: 15px 0;
-      font-size: .9em;
-    }
-
-    .author {
-      display: flex;
-      align-items: center;
-
-      background: #f4f4f4;
-      padding: 0 15px;
-
-      font-size: .8em;
-
-      border: solid #dcdcdc;
-      border-width: 1px 0;
-    }
-
-    .header-time {
-      color: #a8a3ae;
-      font-family: 'Roboto';
-      font-size: 12px;
-    }
-
-    .author p {
-      margin: 5px;
-    }
-
-    .byline {
-      font-family: 'Roboto';
-      display: inline-block;
-    }
-
-    .byline p {
-      line-height: normal;
-    }
-
-    .byline .brand {
-      color: #6f757a;
-    }
-
-    .standfirst {
-      color: #6f757a;
-    }
-
-    .mailto {
-      text-decoration: none;
-    }
-
-    #author-avatar {
-      margin: 10px;
-      border: 5px solid #fff;
-      width: 50px;
-      height: 50px;
-      border-radius: 50%;
-    }
-
-    h1 {
-      margin: 5px 0;
-      font-weight: normal;
-    }
-
-    footer {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      height: 226px;
-      background: #f4f4f4;
-    }
-
-    amp-consent {
-      min-height: 30px;
-      font-family: 'Roboto';
-      font-weight: 500;
-      line-height: 30px;
-      padding: 8px;
-      background: #46b6ac;
-    }
-
-    amp-consent button {
-      border: none;
-      border-radius: 2px;
-
-      color: #fafafa;
-      height: 26px;
-      min-width: 32px;
-      padding: 0 16px;
-      margin: 0 16px;
-      text-transform: uppercase;
-      letter-spacing: 0;
-      cursor: pointer;
-      vertical-align: middle;
-      line-height: 26px;
-      text-align: center;
-      background: #3f51b5;
-    }
-
-    hr {
-      margin: 0;
-    }
-  </style>
-  <script async custom-element="amp-geo" src="https://cdn.ampproject.org/v0/amp-geo-0.1.js"></script>
-  <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
-  <script async custom-element="amp-consent" src="https://cdn.ampproject.org/v0/amp-consent-0.1.js"></script>
-  <script>	
-    (self.AMP=self.AMP||[]).push(function(AMP){	    	
-      AMP.toggleExperiment('amp-consent-geo-override', true);	       	
-    });	   	
-  </script>	 
-  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-  <script async src="https://cdn.ampproject.org/v0.js"></script>
-</head>
-<body>
-  <header>
-    <div class="brand-logo">
-      PublisherLogo
-    </div>
-  </header>
-  <main role="main">
-    <h3>Image that is blocked by consent</h3>
-    <amp-img
-        data-block-on-consent
-        src="https://lh3.googleusercontent.com/pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w300-h200-no-n" width=300 height=200></amp-img>
-
-    <h3>Image that is NOT blocked by consent</h3>
-    <amp-img
-        src="https://lh3.googleusercontent.com/pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w300-h200-no-n" width=300 height=200></amp-img>
-
-     <amp-consent id='ABC' layout='nodisplay'>
-        <script type="application/json">{
-            "consentInstanceId": "myConsentId",
-            "consentRequired": true,
-
-            "geoOverride": {
-                "nafta": {
-                  "consentRequired": true
-                }, 
-                "waldo": {
-                  "checkConsentHref": "https://example.com/check-consent",
-                  "consentRequired": "remote"
-                },
-                "geoGroupUnknown": {
-                  "checkConsentHref": "https://example.com/check-consent",
-                  "consentRequired": true
-               }
-              },
-          "onUpdateHref": "http://localhost:8000/update-consent-v1",
-          "checkConsentHref": "http://localhost:8000/get-consent-v1",
-          "promptUI": "ui1",
-          "clientConfig": {
-            "mytest": "test",
-            "anothertest": "test2"
-          },
-          "policy": {
-            "default": {
-              "waitFor": {
-                "myConsentId": []
-                },
-              "timeout": {
-                "seconds": 5,
-                "fallbackAction": "reject"
-              }
-            }
-          },
-          "postPromptUI": "postPromptUI"
-        }</script>
-      <div id="ui1">
-        Can I load the image??
-        <button on="tap:ABC.accept" role="button">Accept</button>
-        <button on="tap:ABC.reject" role="button">Reject</button>
-        <button on="tap:ABC.dismiss" role="button">Dismiss</button>
-      </div>
-      <div id="postPromptUI">
-        Post Prompt UI
-        <button on="tap:ABC.prompt" role="button">Manage</button>
-      </div>
-    </amp-consent>
-
-
-    <amp-geo layout="nodisplay">
-    <script type="application/json">
-      {
-        "AmpBind": true,
-        "ISOCountryGroups": {
-          "nafta": [ "ca", "mx", "us", "unknown" ],
-          "waldo": [ "unknown" ],
-          "anz": [ "au", "nz" ]
-        }
-      }
-    </script>
-  </amp-geo>
-  <h1>My article title</h1>
-
-  The amp-geo config on this page is:
-
-  <pre>
-    <code>
-    &lt;amp-geo layout=&quot;nodisplay&quot;&gt;
-      &lt;script type=&quot;application/json&quot;&gt;
-        {
-          &quot;ISOCountryGroups&quot;: {
-            &quot;nafta&quot;: [ &quot;ca&quot;, &quot;mx&quot;, &quot;us&quot;, &quot;unknown&quot; ],
-            &quot;waldo&quot;: [ &quot;unknown&quot; ],
-            &quot;anz&quot;: [ &quot;au&quot;, &quot;nz&quot; ]
-          }
-        }
-      &lt;/script&gt;
-    &lt;/amp-geo&gt;
-    </code>
-  </pre>
-  <p>
-      This means that if your country is "unknown" you will appear in the "nafta" and "unknown" groups.  To change the country for testing append #amp-go=&lt;code&gt; to the url and reload the page (eg #amp-geo=nz)
-  </p>
-    <article>
-
-
-      <div class="content-container">
-        <header>
-          <h1 itemprop="headline">Lorem Ipsum</h1>
-          <time class="header-time" itemprop="datePublished"
-              datetime="2015-09-14 13:00">September 14, 2015</time>
-          <p class="standfirst">
-            Fusce pretium tempor justo, vitae consequat dolor maximus eget.
-          </p>
-        </header>
-
-        <div>
-        Revoke consent
-        <button class="button" on="tap:ABC.prompt" role="button">Manage</button>
-      </div>
-
-        <div class="author">
-          <div class="byline">
-            <p>
-              by <span itemscope itemtype="http://schema.org/Person"
-              itemprop="author"><b>Lorem Ipsum</b>
-              <a class="mailto" href="mailto:lorem.ipsum@">
-              lorem.ipsum@</a></span>
-            </p>
-            <p class="brand">PublisherName News Reporter<p>
-          </div>
-        </div>
-        <div class="article-body" itemprop="articleBody">
-          <p>
-            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-            Curabitur ullamcorper turpis vel commodo scelerisque. Phasellus
-            luctus nunc ut elit cursus, et imperdiet diam vehicula.
-            Duis et nisi sed urna blandit bibendum et sit amet erat.
-            Suspendisse potenti. Curabitur consequat volutpat arcu nec
-            elementum. Etiam a turpis ac libero varius condimentum.
-            Maecenas sollicitudin felis aliquam tortor vulputate,
-            ac posuere velit semper.
-          </p>
-          <p>
-            Fusce pretium tempor justo, vitae consequat dolor maximus eget.
-            Aliquam iaculis tincidunt quam sed maximus. Suspendisse faucibus
-            ornare sodales. Nullam id dolor vitae arcu consequat ornare a
-            et lectus. Sed tempus eget enim eget lobortis.
-            Mauris sem est, accumsan sed tincidunt ut, sagittis vel arcu.
-            Nullam in libero nisi.
-          </p>
-
-          <p>
-            Sed pharetra semper fringilla. Nulla fringilla, neque eget
-            varius suscipit, mi turpis congue odio, quis dignissim nisi
-            nulla at erat. Duis non nibh vel erat vehicula hendrerit eget
-            vel velit. Donec congue augue magna, nec eleifend dui porttitor
-            sed. Cras orci quam, dignissim nec elementum ac, bibendum et purus.
-            Ut elementum mi eget felis ultrices tempus. Maecenas nec sodales
-            ex. Phasellus ultrices, purus non egestas ullamcorper, felis
-            lorem ultrices nibh, in tristique mauris justo sed ante.
-            Nunc commodo purus feugiat metus bibendum consequat. Duis
-            finibus urna ut ligula auctor, sed vehicula ex aliquam.
-            Sed sed augue auctor, porta turpis ultrices, cursus diam.
-            In venenatis aliquet porta. Sed volutpat fermentum quam,
-            ac molestie nulla porttitor ac. Donec porta risus ut enim
-            pellentesque, id placerat elit ornare.
-          </p>
-          <p>
-            Curabitur convallis, urna quis pulvinar feugiat, purus diam
-            posuere turpis, sit amet tincidunt purus justo et mi. Donec
-            sapien urna, aliquam ut lacinia quis, varius vitae ex.
-            Maecenas efficitur iaculis lorem, at imperdiet orci viverra
-            in. Nullam eu erat eu metus ultrices viverra a sit amet leo.
-            Pellentesque est felis, pulvinar mollis sollicitudin et,
-            suscipit eget massa. Nunc bibendum non nunc et consequat.
-            Quisque auctor est vel leo faucibus, non faucibus magna ultricies.
-            Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
-            posuere cubilia Curae; Vestibulum tortor lacus, bibendum et
-            enim eu, vehicula placerat erat. Nullam gravida rhoncus accumsan.
-            Integer suscipit iaculis elit nec mollis. Vestibulum eget arcu
-            nec lectus finibus rutrum vel sed orci.
-          </p>
-
-          <figure>
-            <figcaption>
-              Fusce pretium tempor justo, vitae consequat dolor maximus eget.
-            </figcaption>
-          </figure>
-          <hr>
-
-          <p>
-            Cum sociis natoque penatibus et magnis dis parturient montes,
-            nascetur ridiculus mus. Nulla et viverra turpis. Fusce
-            viverra enim eget elit blandit, in finibus enim blandit. Integer
-            fermentum eleifend felis non posuere. In vulputate et metus at
-            aliquam. Praesent a varius est. Quisque et tincidunt nisi.
-            Nam porta urna at turpis lacinia, sit amet mattis eros elementum.
-            Etiam vel mauris mattis, dignissim tortor in, pulvinar arcu.
-            In molestie sem elit, tincidunt venenatis tortor aliquet sodales.
-            Ut elementum velit fermentum felis volutpat sodales in non libero.
-            Aliquam erat volutpat.
-          </p>
-
-          <p>
-            Morbi at velit vitae eros congue congue venenatis non dui.
-            Sed lacus sem, feugiat sed elementum sed, maximus sed lacus.
-            Integer accumsan magna in sagittis pharetra. Class aptent taciti
-            sociosqu ad litora torquent per conubia nostra, per inceptos
-            himenaeos. Suspendisse ac nisl efficitur ligula aliquam lacinia
-            eu in magna. Vestibulum non felis odio. Ut consectetur venenatis
-            felis aliquet maximus. Class aptent taciti sociosqu ad litora
-            torquent per conubia nostra, per inceptos himenaeos.
-          </p>
-        </div>
-      </div>
-    </article>
-  </main>
-
-  <footer>
-    <div class="brand-logo">PublisherLogo</div>
-  </footer>
-</body>
-</html>
diff --git a/examples/amphtml-ads/consent.a4a.html b/examples/amp-consent/amp-consent-amp-ad.amp.html
similarity index 97%
rename from examples/amphtml-ads/consent.a4a.html
rename to examples/amp-consent/amp-consent-amp-ad.amp.html
index ac00140828b29..a1ed012618e78 100644
--- a/examples/amphtml-ads/consent.a4a.html
+++ b/examples/amp-consent/amp-consent-amp-ad.amp.html
@@ -3,7 +3,7 @@
 <head>
   <meta charset="utf-8">
   <title>My AMP Page</title>
-  <link rel="canonical" href="consent.a4a.html" />
+  <link rel="canonical" href="amp-consent-amp-ad.amp.html" />
   <meta name="viewport" content="width=device-width,minimum-scale=1">
   <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
diff --git a/examples/amp-consent/amp-consent-client.html b/examples/amp-consent/amp-consent-client.html
new file mode 100644
index 0000000000000..a8c5261890057
--- /dev/null
+++ b/examples/amp-consent/amp-consent-client.html
@@ -0,0 +1,266 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Consent GEO Test</title>
+  <link rel="canonical" href="amp-consent.amp.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <meta name="amp-consent-blocking" content="amp-ad">
+
+  <link href='https://fonts.googleapis.com/css?family=Georgia|Open+Sans|Roboto' rel='stylesheet' type='text/css'>
+
+  <style amp-custom>
+    body {
+      margin: 0;
+      font-family: 'Georgia', Serif;
+    }
+    .brand-logo {
+      font-family: 'Open Sans';
+    }
+    .content-container p {
+      line-height: 24px;
+    }
+    header,
+    .article-body {
+      padding: 15px;
+    }
+    figure {
+      margin: 0;
+    }
+    figcaption {
+      color: #6f757a;
+      padding: 15px 0;
+      font-size: .9em;
+    }
+    .author {
+      display: flex;
+      align-items: center;
+      background: #f4f4f4;
+      padding: 0 15px;
+      font-size: .8em;
+      border: solid #dcdcdc;
+      border-width: 1px 0;
+    }
+    .header-time {
+      color: #a8a3ae;
+      font-family: 'Roboto';
+      font-size: 12px;
+    }
+    .author p {
+      margin: 5px;
+    }
+    .byline {
+      font-family: 'Roboto';
+      display: inline-block;
+    }
+    .byline p {
+      line-height: normal;
+    }
+    .byline .brand {
+      color: #6f757a;
+    }
+    .standfirst {
+      color: #6f757a;
+    }
+    .mailto {
+      text-decoration: none;
+    }
+    h1 {
+      margin: 5px 0;
+      font-weight: normal;
+    }
+    footer {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 226px;
+      background: #f4f4f4;
+    }
+    amp-consent {
+      min-height: 30px;
+      font-family: 'Roboto';
+      font-weight: 500;
+      line-height: 30px;
+      padding: 8px;
+      background: #46b6ac;
+    }
+    amp-consent button {
+      border: none;
+      border-radius: 2px;
+      color: #fafafa;
+      height: 26px;
+      min-width: 32px;
+      padding: 0 16px;
+      margin: 0 16px;
+      text-transform: uppercase;
+      letter-spacing: 0;
+      cursor: pointer;
+      vertical-align: middle;
+      line-height: 26px;
+      text-align: center;
+      background: #3f51b5;
+    }
+    hr {
+      margin: 0;
+    }
+  </style>
+  <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
+  <script async custom-element="amp-geo" src="https://cdn.ampproject.org/v0/amp-geo-0.1.js"></script>
+  <script async custom-element="amp-consent" src="https://cdn.ampproject.org/v0/amp-consent-0.1.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<header>
+  <div class="brand-logo">
+    PublisherLogo
+  </div>
+</header>
+<main role="main">
+  <p>This is a basic example of amp-consent where consent decision is collected and managed client side</p>
+  <h3>Image that is blocked by '_till_responded' consent</h3>
+
+  <amp-analytics type="_ping_">
+    <script type="application/json">
+      {
+        "requests": {
+          "old": "https://fake.com/analytics?consent=CONSENT_STATE"
+        },
+        "vars": {
+          "abc": "${timestamp}.${requestCount}"
+        },
+        "triggers": {
+          "onetime": {
+            "on": "visible",
+            "request": "old"
+          }
+        },
+        "transport": {
+          "beacon": false,
+          "xhrpost": false,
+          "image": true
+        }
+      }
+    </script>
+  </amp-analytics>
+  <amp-img
+    data-block-on-consent='_till_responded'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_till_accepted' consent</h3>
+  <amp-img
+    data-block-on-consent='_till_accepted'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_auto_reject' consent</h3>
+  <amp-img
+    data-block-on-consent='_auto_reject'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by 'default' consent</h3>
+  <amp-img
+    data-block-on-consent='default'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by default (not specified) consent</h3>
+  <amp-img
+    data-block-on-consent
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is NOT blocked by consent</h3>
+  <amp-img
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <amp-consent id='ABC' layout='nodisplay'>
+    <script type="application/json">{
+      "consentInstanceId": "consent-clinet",
+      "promptUI": "ui1",
+      "postPromptUI": "postPromptUI",
+      "consentRequired": "remote",
+      "checkConsentHref": "/check-consent?consentRequired=true&expireCache=false",
+      "onUpdateHref": "https://fake.com/update-consent-endpoint"
+    }</script>
+    <div id="ui1">
+        CA: Can I load the image??
+        <button on="tap:ABC.accept" role="button">Accept</button>
+        <button on="tap:ABC.reject" role="button">Reject</button>
+        <button on="tap:ABC.dismiss" role="button">Dismiss</button>
+      </div>
+      <div id="postPromptUI">
+        Post Prompt UI
+        <button on="tap:ABC.prompt" role="button">Manage</button>
+      </div>
+  </amp-consent>
+
+  <article>
+    <div class="content-container">
+      <header>
+        <h1 itemprop="headline">Lorem Ipsum</h1>
+        <time class="header-time" itemprop="datePublished"
+              datetime="2015-09-14 13:00">September 14, 2015</time>
+        <p class="standfirst">
+          Fusce pretium tempor justo, vitae consequat dolor maximus eget.
+        </p>
+      </header>
+
+      <div>
+        Revoke consent
+        <button class="button" on="tap:ABC.prompt" role="button">Manage</button>
+      </div>
+
+      <div class="author">
+        <div class="byline">
+          <p>
+            by <span itemscope itemtype="http://schema.org/Person"
+                     itemprop="author"><b>Lorem Ipsum</b>
+              <a class="mailto" href="mailto:lorem.ipsum@">
+              lorem.ipsum@</a></span>
+          </p>
+          <p class="brand">PublisherName News Reporter<p>
+        </div>
+      </div>
+      <div class="article-body" itemprop="articleBody">
+        <p>
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+          Curabitur ullamcorper turpis vel commodo scelerisque. Phasellus
+          luctus nunc ut elit cursus, et imperdiet diam vehicula.
+          Duis et nisi sed urna blandit bibendum et sit amet erat.
+          Suspendisse potenti. Curabitur consequat volutpat arcu nec
+          elementum. Etiam a turpis ac libero varius condimentum.
+          Maecenas sollicitudin felis aliquam tortor vulputate,
+          ac posuere velit semper.
+        </p>
+        <h1>_ping_ Ad Blocked by metaTags</h1>
+        <amp-ad width=300 height=250
+                type="_ping_"
+                data-url='/examples/img/bigbuckbunny.jpg'
+                data-valid='true'>
+        </amp-ad>
+
+        <p>
+          Curabitur convallis, urna quis pulvinar feugiat, purus diam
+          posuere turpis, sit amet tincidunt purus justo et mi. Donec
+          sapien urna, aliquam ut lacinia quis, varius vitae ex.
+          Maecenas efficitur iaculis lorem, at imperdiet orci viverra
+          in. Nullam eu erat eu metus ultrices viverra a sit amet leo.
+          Pellentesque est felis, pulvinar mollis sollicitudin et,
+          suscipit eget massa. Nunc bibendum non nunc et consequat.
+          Quisque auctor est vel leo faucibus, non faucibus magna ultricies.
+          Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
+          posuere cubilia Curae; Vestibulum tortor lacus, bibendum et
+          enim eu, vehicula placerat erat. Nullam gravida rhoncus accumsan.
+          Integer suscipit iaculis elit nec mollis. Vestibulum eget arcu
+          nec lectus finibus rutrum vel sed orci.
+        </p>
+      </div>
+    </div>
+    <button on="tap:ABC.prompt" role="button">Manage Consent</button>
+  </article>
+</main>
+
+<footer>
+  <div class="brand-logo">PublisherLogo</div>
+</footer>
+</body>
+</html>
diff --git a/test/manual/amp-consent-cmp.html b/examples/amp-consent/amp-consent-cmp.html
similarity index 94%
rename from test/manual/amp-consent-cmp.html
rename to examples/amp-consent/amp-consent-cmp.html
index 66c0f48919895..392d99724beb0 100644
--- a/test/manual/amp-consent-cmp.html
+++ b/examples/amp-consent/amp-consent-cmp.html
@@ -260,8 +260,7 @@ <h3>Image that is NOT blocked by consent</h3>
 
     <amp-consent id='ABC' layout='nodisplay' type='_ping_'>
       <script type="application/json">
-        {
-        "consents": {},
+      {
         "postPromptUI": "postPromptUI",
         "clientConfig": {
           "CMP_id": "test_id",
@@ -269,18 +268,6 @@ <h3>Image that is NOT blocked by consent</h3>
         }
       }
       </script>
-      <div id="ui1">
-        Please Accept to load image.
-        <button on="tap:ABC.accept" role="button">Accept</button>
-        <button on="tap:ABC.reject" role="button">Reject</button>
-        <button on="tap:ABC.dismiss" role="button">Dismiss</button>
-      </div>
-      <div id="ui2">
-        Please Accept to load image.
-        <button on="tap:ABC.accept" role="button">Accept</button>
-        <button on="tap:ABC.reject" role="button">Reject</button>
-        <button on="tap:ABC.dismiss" role="button">Dismiss</button>
-      </div>
       <div id="postPromptUI">
         Post Prompt UI
         <button on="tap:ABC.prompt(consent=_ping_)" role="button">Manage</button>
@@ -388,7 +375,7 @@ <h1 itemprop="headline">Lorem Ipsum</h1>
 
   <script>
     setTimeout(() => {
-      AMP.toggleExperiment('amp-consent-v2', true);
+      AMP.toggleExperiment('amp-consent-restrict-fullscreen', true);
     }, 500);
   </script>
 </body>
diff --git a/examples/amp-consent/amp-consent-geo.html b/examples/amp-consent/amp-consent-geo.html
new file mode 100644
index 0000000000000..a597c2e07efed
--- /dev/null
+++ b/examples/amp-consent/amp-consent-geo.html
@@ -0,0 +1,314 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Consent GEO in Iframe Test</title>
+  <link rel="canonical" href="amp-consent.amp.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <meta name="amp-consent-blocking" content="amp-ad">
+
+  <link href='https://fonts.googleapis.com/css?family=Georgia|Open+Sans|Roboto' rel='stylesheet' type='text/css'>
+
+  <style amp-custom>
+    body {
+      margin: 0;
+      font-family: 'Georgia', Serif;
+    }
+    .brand-logo {
+      font-family: 'Open Sans';
+    }
+    .content-container p {
+      line-height: 24px;
+    }
+    header,
+    .article-body {
+      padding: 15px;
+    }
+    figure {
+      margin: 0;
+    }
+    figcaption {
+      color: #6f757a;
+      padding: 15px 0;
+      font-size: .9em;
+    }
+    .author {
+      display: flex;
+      align-items: center;
+      background: #f4f4f4;
+      padding: 0 15px;
+      font-size: .8em;
+      border: solid #dcdcdc;
+      border-width: 1px 0;
+    }
+    .header-time {
+      color: #a8a3ae;
+      font-family: 'Roboto';
+      font-size: 12px;
+    }
+    .author p {
+      margin: 5px;
+    }
+    .byline {
+      font-family: 'Roboto';
+      display: inline-block;
+    }
+    .byline p {
+      line-height: normal;
+    }
+    .byline .brand {
+      color: #6f757a;
+    }
+    .standfirst {
+      color: #6f757a;
+    }
+    .mailto {
+      text-decoration: none;
+    }
+    h1 {
+      margin: 5px 0;
+      font-weight: normal;
+    }
+    footer {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 226px;
+      background: #f4f4f4;
+    }
+    amp-consent {
+      min-height: 30px;
+      font-family: 'Roboto';
+      font-weight: 500;
+      line-height: 30px;
+      padding: 8px;
+      background: #46b6ac;
+    }
+    amp-consent button {
+      border: none;
+      border-radius: 2px;
+      color: #fafafa;
+      height: 26px;
+      min-width: 32px;
+      padding: 0 16px;
+      margin: 0 16px;
+      text-transform: uppercase;
+      letter-spacing: 0;
+      cursor: pointer;
+      vertical-align: middle;
+      line-height: 26px;
+      text-align: center;
+      background: #3f51b5;
+    }
+    hr {
+      margin: 0;
+    }
+  </style>
+  <script async custom-element="amp-geo" src="https://cdn.ampproject.org/v0/amp-geo-0.1.js"></script>
+  <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
+  <script async custom-element="amp-consent" src="https://cdn.ampproject.org/v0/amp-consent-0.1.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  <script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<header>
+  <div class="brand-logo">
+    PublisherLogo
+  </div>
+</header>
+<main role="main">
+  <p>This example tests amp-consent with amp-geo using 'geoOverride' to prompt different UIs</p>
+  <h3>Image that is blocked by '_till_responded' consent</h3>
+  <amp-analytics type="_ping_">
+    <script type="application/json">
+      {
+        "requests": {
+          "old": "https://fake.com/analytics?consent=CONSENT_STATE"
+        },
+        "vars": {
+          "abc": "${timestamp}.${requestCount}"
+        },
+        "triggers": {
+          "onetime": {
+            "on": "visible",
+            "request": "old"
+          }
+        },
+        "transport": {
+          "beacon": false,
+          "xhrpost": false,
+          "image": true
+        }
+      }
+    </script>
+  </amp-analytics>
+  <amp-img
+    data-block-on-consent='_till_responded'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_till_accepted' consent</h3>
+  <amp-img
+    data-block-on-consent='_till_accepted'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_auto_reject' consent</h3>
+  <amp-img
+    data-block-on-consent='_auto_reject'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by 'default' consent</h3>
+  <amp-img
+    data-block-on-consent='default'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by default (not specified) consent</h3>
+  <amp-img
+    data-block-on-consent
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is NOT blocked by consent</h3>
+  <amp-img
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <amp-geo layout=nodisplay>
+    <script type="application/json">
+      {
+        "ISOCountryGroups": {
+          "na": ["ca", "mx", "us"],
+          "eea": ["preset-eea"],
+          "row": ["unknown"],
+          "useIframe": ["fake"]
+        }
+      }
+    </script>
+  </amp-geo>
+
+  <amp-consent id='ABC' layout='nodisplay'>
+    <script type="application/json">{
+      "consentInstanceId": "geotest",
+      "consentRequired": false,
+      "promptUI": "ui1",
+      "postPromptUI": "postPromptUI",
+      "clientConfig": {
+        "geoGroup": "default",
+        "CMP_id": "1234"
+      },
+      "geoOverride": {
+        "na": {
+          "checkConsentHref": "/check-consent?consentRequired=true&consentStateValue=unknown&consentRequired=true",
+          "consentRequired": "remote"
+        },
+        "eea": {
+          "promptUI": null,
+          "promptUISrc": "http://ads.localhost:8000/examples/amp-consent/diy-consent.html",
+          "checkConsentHref": "/check-consent?consentRequired=true&expireCache=true",
+          "consentRequired": true,
+          "clientConfig": {
+            "geoGroup": "eea",
+            "eea_config": "test"
+          }
+        },
+        "row": {
+          "checkConsentHref": "/check-consent?consentRequired=true&expireCache=true",
+          "consentRequired": true
+        },
+        "useIframe": {
+          "consentRequired": true,
+          "promptUI": "ui2"
+        }
+      }
+    }</script>
+    <div id="ui1">
+      Can I load the image??
+      <button on="tap:ABC.accept" role="button">Accept</button>
+      <button on="tap:ABC.reject" role="button">Reject</button>
+      <button on="tap:ABC.dismiss" role="button">Dismiss</button>
+    </div>
+    <div id="ui2">
+      Can I load the image??
+      <amp-iframe id='5678' width=300 height=50
+        sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox"
+        layout="responsive"
+        frameborder="0"
+        src="http://ads.localhost:8000/examples/amp-consent/diy-consent.html">
+        <placeholder></placeholder>
+      </amp-iframe>
+    </div>
+    <div id="postPromptUI">
+      Post Prompt UI
+      <button on="tap:ABC.prompt" role="button">Manage</button>
+    </div>
+  </amp-consent>
+  <article>
+
+    <div class="content-container">
+      <header>
+        <h1 itemprop="headline">Lorem Ipsum</h1>
+        <time class="header-time" itemprop="datePublished"
+              datetime="2015-09-14 13:00">September 14, 2015</time>
+        <p class="standfirst">
+          Fusce pretium tempor justo, vitae consequat dolor maximus eget.
+        </p>
+      </header>
+
+      <div>
+        Revoke consent
+        <button class="button" on="tap:ABC.prompt" role="button">Manage</button>
+      </div>
+
+      <div class="author">
+        <div class="byline">
+          <p>
+            by <span itemscope itemtype="http://schema.org/Person"
+                     itemprop="author"><b>Lorem Ipsum</b>
+              <a class="mailto" href="mailto:lorem.ipsum@">
+              lorem.ipsum@</a></span>
+          </p>
+          <p class="brand">PublisherName News Reporter<p>
+        </div>
+      </div>
+      <div class="article-body" itemprop="articleBody">
+        <p>
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+          Curabitur ullamcorper turpis vel commodo scelerisque. Phasellus
+          luctus nunc ut elit cursus, et imperdiet diam vehicula.
+          Duis et nisi sed urna blandit bibendum et sit amet erat.
+          Suspendisse potenti. Curabitur consequat volutpat arcu nec
+          elementum. Etiam a turpis ac libero varius condimentum.
+          Maecenas sollicitudin felis aliquam tortor vulputate,
+          ac posuere velit semper.
+        </p>
+        <h1>_ping_ Ad Blocked by metaTags</h1>
+        <amp-ad width=300 height=250
+                type="_ping_"
+                data-url='https://lh3.googleusercontent.com/pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w400-h300-no-n'
+                data-valid='true'>
+        </amp-ad>
+
+        <p>
+          Curabitur convallis, urna quis pulvinar feugiat, purus diam
+          posuere turpis, sit amet tincidunt purus justo et mi. Donec
+          sapien urna, aliquam ut lacinia quis, varius vitae ex.
+          Maecenas efficitur iaculis lorem, at imperdiet orci viverra
+          in. Nullam eu erat eu metus ultrices viverra a sit amet leo.
+          Pellentesque est felis, pulvinar mollis sollicitudin et,
+          suscipit eget massa. Nunc bibendum non nunc et consequat.
+          Quisque auctor est vel leo faucibus, non faucibus magna ultricies.
+          Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
+          posuere cubilia Curae; Vestibulum tortor lacus, bibendum et
+          enim eu, vehicula placerat erat. Nullam gravida rhoncus accumsan.
+          Integer suscipit iaculis elit nec mollis. Vestibulum eget arcu
+          nec lectus finibus rutrum vel sed orci.
+        </p>
+      </div>
+    </div>
+  </article>
+</main>
+
+<footer>
+  <div class="brand-logo">PublisherLogo</div>
+</footer>
+</body>
+</html>
diff --git a/examples/amp-consent/amp-consent-server.html b/examples/amp-consent/amp-consent-server.html
new file mode 100644
index 0000000000000..d69876e0deb6c
--- /dev/null
+++ b/examples/amp-consent/amp-consent-server.html
@@ -0,0 +1,252 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Consent GEO Test</title>
+  <link rel="canonical" href="amp-consent.amp.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <meta name="amp-consent-blocking" content="amp-ad">
+
+  <link href='https://fonts.googleapis.com/css?family=Georgia|Open+Sans|Roboto' rel='stylesheet' type='text/css'>
+
+  <style amp-custom>
+    body {
+      margin: 0;
+      font-family: 'Georgia', Serif;
+    }
+    .brand-logo {
+      font-family: 'Open Sans';
+    }
+    .content-container p {
+      line-height: 24px;
+    }
+    header,
+    .article-body {
+      padding: 15px;
+    }
+    figure {
+      margin: 0;
+    }
+    figcaption {
+      color: #6f757a;
+      padding: 15px 0;
+      font-size: .9em;
+    }
+    .author {
+      display: flex;
+      align-items: center;
+      background: #f4f4f4;
+      padding: 0 15px;
+      font-size: .8em;
+      border: solid #dcdcdc;
+      border-width: 1px 0;
+    }
+    .header-time {
+      color: #a8a3ae;
+      font-family: 'Roboto';
+      font-size: 12px;
+    }
+    .author p {
+      margin: 5px;
+    }
+    .byline {
+      font-family: 'Roboto';
+      display: inline-block;
+    }
+    .byline p {
+      line-height: normal;
+    }
+    .byline .brand {
+      color: #6f757a;
+    }
+    .standfirst {
+      color: #6f757a;
+    }
+    .mailto {
+      text-decoration: none;
+    }
+    h1 {
+      margin: 5px 0;
+      font-weight: normal;
+    }
+    footer {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 226px;
+      background: #f4f4f4;
+    }
+    amp-consent {
+      min-height: 30px;
+      font-family: 'Roboto';
+      font-weight: 500;
+      line-height: 30px;
+      padding: 8px;
+      background: #46b6ac;
+    }
+    amp-consent button {
+      border: none;
+      border-radius: 2px;
+      color: #fafafa;
+      height: 26px;
+      min-width: 32px;
+      padding: 0 16px;
+      margin: 0 16px;
+      text-transform: uppercase;
+      letter-spacing: 0;
+      cursor: pointer;
+      vertical-align: middle;
+      line-height: 26px;
+      text-align: center;
+      background: #3f51b5;
+    }
+    hr {
+      margin: 0;
+    }
+  </style>
+  <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
+  <script async custom-element="amp-geo" src="https://cdn.ampproject.org/v0/amp-geo-0.1.js"></script>
+  <script async custom-element="amp-consent" src="https://cdn.ampproject.org/v0/amp-consent-0.1.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<header>
+  <div class="brand-logo">
+    PublisherLogo
+  </div>
+</header>
+<main role="main">
+  <p>This is a basic example of amp-consent where consent decision is handled by server</p>
+  <h3>Image that is blocked by '_till_responded' consent</h3>
+
+  <amp-analytics type="_ping_">
+    <script type="application/json">
+      {
+        "requests": {
+          "old": "https://fake.com/analytics?consent=CONSENT_STATE"
+        },
+        "vars": {
+          "abc": "${timestamp}.${requestCount}"
+        },
+        "triggers": {
+          "onetime": {
+            "on": "visible",
+            "request": "old"
+          }
+        },
+        "transport": {
+          "beacon": false,
+          "xhrpost": false,
+          "image": true
+        }
+      }
+    </script>
+  </amp-analytics>
+  <amp-img
+    data-block-on-consent='_till_responded'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_till_accepted' consent</h3>
+  <amp-img
+    data-block-on-consent='_till_accepted'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_auto_reject' consent</h3>
+  <amp-img
+    data-block-on-consent='_auto_reject'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by 'default' consent</h3>
+  <amp-img
+    data-block-on-consent='default'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by default (not specified) consent</h3>
+  <amp-img
+    data-block-on-consent
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is NOT blocked by consent</h3>
+  <amp-img
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <amp-consent id='ABC' layout='nodisplay'>
+    <script type="application/json">{
+      "consentInstanceId": "consent-server",
+      "consentRequired": "remote",
+      "checkConsentHref": "/check-consent?consentRequired=true&consentStateValue=unknown&expireCache=false"
+    }</script>
+  </amp-consent>
+
+  <article>
+    <div class="content-container">
+      <header>
+        <h1 itemprop="headline">Lorem Ipsum</h1>
+        <time class="header-time" itemprop="datePublished"
+              datetime="2015-09-14 13:00">September 14, 2015</time>
+        <p class="standfirst">
+          Fusce pretium tempor justo, vitae consequat dolor maximus eget.
+        </p>
+      </header>
+
+      <div>
+        Revoke consent
+        <button class="button" on="tap:ABC.prompt" role="button">Manage</button>
+      </div>
+
+      <div class="author">
+        <div class="byline">
+          <p>
+            by <span itemscope itemtype="http://schema.org/Person"
+                     itemprop="author"><b>Lorem Ipsum</b>
+              <a class="mailto" href="mailto:lorem.ipsum@">
+              lorem.ipsum@</a></span>
+          </p>
+          <p class="brand">PublisherName News Reporter<p>
+        </div>
+      </div>
+      <div class="article-body" itemprop="articleBody">
+        <p>
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+          Curabitur ullamcorper turpis vel commodo scelerisque. Phasellus
+          luctus nunc ut elit cursus, et imperdiet diam vehicula.
+          Duis et nisi sed urna blandit bibendum et sit amet erat.
+          Suspendisse potenti. Curabitur consequat volutpat arcu nec
+          elementum. Etiam a turpis ac libero varius condimentum.
+          Maecenas sollicitudin felis aliquam tortor vulputate,
+          ac posuere velit semper.
+        </p>
+        <h1>_ping_ Ad Blocked by metaTags</h1>
+        <amp-ad width=300 height=250
+                type="_ping_"
+                data-url='/examples/img/bigbuckbunny.jpg'
+                data-valid='true'>
+        </amp-ad>
+
+        <p>
+          Curabitur convallis, urna quis pulvinar feugiat, purus diam
+          posuere turpis, sit amet tincidunt purus justo et mi. Donec
+          sapien urna, aliquam ut lacinia quis, varius vitae ex.
+          Maecenas efficitur iaculis lorem, at imperdiet orci viverra
+          in. Nullam eu erat eu metus ultrices viverra a sit amet leo.
+          Pellentesque est felis, pulvinar mollis sollicitudin et,
+          suscipit eget massa. Nunc bibendum non nunc et consequat.
+          Quisque auctor est vel leo faucibus, non faucibus magna ultricies.
+          Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
+          posuere cubilia Curae; Vestibulum tortor lacus, bibendum et
+          enim eu, vehicula placerat erat. Nullam gravida rhoncus accumsan.
+          Integer suscipit iaculis elit nec mollis. Vestibulum eget arcu
+          nec lectus finibus rutrum vel sed orci.
+        </p>
+      </div>
+    </div>
+  </article>
+</main>
+
+<footer>
+  <div class="brand-logo">PublisherLogo</div>
+</footer>
+</body>
+</html>
diff --git a/examples/amp-consent/cmp-vendors.amp.html b/examples/amp-consent/cmp-vendors.amp.html
index 84e4978c64f80..0bc3a5005ff44 100644
--- a/examples/amp-consent/cmp-vendors.amp.html
+++ b/examples/amp-consent/cmp-vendors.amp.html
@@ -96,6 +96,7 @@
           <!-- This should be in alphabetical order. _ping_ should be the first -->
           <option>_ping_</option>
           <option>didomi</option>
+          <option>Marfeel</option>
           <option>SourcePoint</option>
         </select>
         <input type="submit" value="Go">
@@ -164,6 +165,24 @@ <h3>Image that is NOT blocked by consent</h3>
         </amp-consent>
         <!-- End didomi example -->
 
+      <!-- Marfeel example -->
+      <amp-consent id='marfeelConsent' layout='nodisplay' type='Marfeel'>
+        <script type="application/json">
+          {
+            "postPromptUI": "postPromptUI",
+            "clientConfig": {
+              "consentLanguage": "en",
+              "publisherLogo": "https://marfeel.mgr.consensu.org/amp/img/marfeel-logo.png"
+            }
+          }
+        </script>
+        <div id="postPromptUI">
+          Post Prompt UI
+          <button on="tap:marfeelConsent.prompt(consent=Marfeel)" role="button">Manage</button>
+        </div>
+      </amp-consent>
+      <!-- End Marfeel example -->
+
       <!-- SourcePoint example -->
       <amp-consent id='consent' layout='nodisplay' type='SourcePoint'>
         <script type="application/json">
diff --git a/test/manual/diy-consent.html b/examples/amp-consent/diy-consent.html
similarity index 95%
rename from test/manual/diy-consent.html
rename to examples/amp-consent/diy-consent.html
index 2c8497830ddbf..d4e06b2edad9c 100644
--- a/test/manual/diy-consent.html
+++ b/examples/amp-consent/diy-consent.html
@@ -130,7 +130,8 @@ <h1>Thank you!</h1>
 if (window && window.name) {
   try {
     clientInfo = JSON.parse(window.name);
-    cmpId = clientInfo['clientConfig']['CMP_id'];
+    cmpId =
+        clientInfo['clientConfig'] && clientInfo['clientConfig']['CMP_id'];
     consentStr = clientInfo['consentString'];
     consentState = clientInfo['consentState'];
     // TODO: convert consentState to readable value
@@ -189,6 +190,20 @@ <h1>Thank you!</h1>
   parent.postMessage(readyObject, '*');
 }, 2000);
 
+// Send fullscreen every 2.5 seconds
+setInterval(() => {
+
+  // Our ready object
+  const readyObject = {
+    type: 'consent-ui',
+    action: 'enter-fullscreen'
+  };
+
+  console.log('diy-consent: Sending Fullscreen Message!', readyObject);
+
+  parent.postMessage(readyObject, '*');
+}, 2500);
+
 function registerClickConsentMessage(querySelector, type, action, info, timeout) {
   document.querySelector(querySelector).onclick = function () {
     // parent.postMessage("message to be sent", "http://the-website-that-will-receive-the-msg.com")
diff --git a/examples/amp-date-display.amp.html b/examples/amp-date-display.amp.html
index f6a58871a243c..c5fe7d1a465c9 100644
--- a/examples/amp-date-display.amp.html
+++ b/examples/amp-date-display.amp.html
@@ -17,7 +17,7 @@
       overflow: auto;
     }
   </style>
-  <script async custom-element="amp-date-display" src="https://cdn.ampproject.org/v0/amp-date-display-0.1.js"></script>
+  <script async custom-element="amp-date-display" src="https://cdn.ampproject.org/v0/amp-date-display-0.2.js"></script>
   <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
 </head>
diff --git a/examples/amp-redbull-player.amp.html b/examples/amp-redbull-player.amp.html
new file mode 100644
index 0000000000000..3281ec7103b14
--- /dev/null
+++ b/examples/amp-redbull-player.amp.html
@@ -0,0 +1,63 @@
+<!doctype html>
+<html amp lang="en">
+  <head>
+    <meta charset="utf-8">
+    <link rel="canonical" href="amps.html">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+      <style amp-custom>
+    </style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-redbull-player" src="https://cdn.ampproject.org/v0/amp-redbull-player-0.1.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  </head>
+  <body>
+    <h1>amp-redbull-player</h1>
+    <amp-redbull-player
+      id="rbvideo_1"
+      data-param-videoid="rrn:content:videos:3965a26c-052e-575f-a28b-ded6bee23ee1:en-INT"
+      data-param-locale="us"
+      height="169"
+      width="300"
+      layout="fixed">
+    </amp-redbull-player><br/>
+
+    <amp-redbull-player
+      id="rbvideo_2"
+      data-param-videoid="rrn:content:videos:3e27acc3-2fd2-44f4-9d6f-c1ec0ff587f1:en-INT"
+      data-param-locale="at"
+      data-param-skinid="stv"
+      height=169
+      width=300
+      layout="fixed">
+    </amp-redbull-player>
+    <amp-analytics>
+      <!-- Docs: https://amp.dev/documentation/components/amp-video-iframe/ -> postAnalyticsEvent(eventType[, vars]) -->
+      <!--
+        https://amp.dev/documentation/components/amp-analytics/#transport
+        "transport": {"xhrpost": false, "beacon": false, "image": true},
+      -->
+      <script type="application/json">
+        {
+          "requests": {
+            "base": "https://www.google-analytics.com/collect?",
+            "event": {
+              "baseUrl": "${base}${custom_request}"
+            }
+          },
+          "triggers": {
+            "rbvideo_1": {
+              "on": "video-custom-tracking-rbvideo_1",
+              "request": "event",
+              "selector": "#rbvideo_1"
+            },
+             "rbvideo_2": {
+              "on": "video-custom-tracking-rbvideo_2",
+              "request": "event",
+              "selector": "#rbvideo_2"
+            }
+          }
+        }
+      </script>
+    </amp-analytics>
+  </body>
+</html>
diff --git a/examples/amp-story-auto-ads.amp.html b/examples/amp-story-auto-ads.amp.html
index 1dea3715d7ea7..f2ff37d7d1b65 100644
--- a/examples/amp-story-auto-ads.amp.html
+++ b/examples/amp-story-auto-ads.amp.html
@@ -45,7 +45,11 @@
   <amp-analytics>
     <script type="application/json">
       {
-        "transport": {"beacon": "true", "xhrpost": "false", "image": "true"},
+        "transport": {
+          "beacon": false,
+          "xhrpost": false,
+          "image": true
+        },
         "requests": {
           "endpoint": "https://www.example.com",
           "base": "${endpoint}?id=${adId}zx=${timestamp}"
diff --git a/examples/amp-story/amp-story-branching.html b/examples/amp-story/amp-story-branching.html
index c7cdbf8bcfa8b..bf28ad6e90a50 100644
--- a/examples/amp-story/amp-story-branching.html
+++ b/examples/amp-story/amp-story-branching.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8">
     <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
     <script async custom-element="amp-story"
         src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
     <script async custom-element="amp-sidebar" src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script>
@@ -38,6 +39,30 @@
         poster-portrait-src="/examples/visual-tests/picsum.photos/image981_900x1600.jpg"
         poster-landscape-src="/examples/visual-tests/picsum.photos/image981_1600x900.jpg"
         poster-square-src="/examples/visual-tests/picsum.photos/image981_1600x1600.jpg">
+        <amp-analytics id="analytics1">
+            <script type="application/json">
+              {
+                "requests": {
+                  "endpoint": "https://raw.githubusercontent.com/ampproject/amphtml/master/examples/img/ampicon.png",
+                  "base": "${endpoint}?${type|default:foo}&path=${canonicalPath}",
+                  "pageView": "${base}?&index=${storyPageIndex}&count=${storyPageCount}&id=${storyPageId}&muted=${storyIsMuted}&progress=${storyProgress}",
+                  "click": "${base}?&index=${storyPageIndex}&id=${storyPageId}&bookendTargetHref=${storyBookendTargetHref}&bookendCardType=${storyBookendComponentType}&bookendCardPosition=${storyBookendComponentPosition}"
+                },
+                "triggers": {
+                  "trackSideBarOpen": {
+                    "on": "story-open",
+                    "tagName": "amp-sidebar",
+                    "request": "base"
+                  },
+                  "trackSideBarExit": {
+                    "on": "story-close",
+                    "tagName": "amp-sidebar",
+                    "request": "base"
+                  }
+                }
+              }
+            </script>
+          </amp-analytics>
       <amp-sidebar id="sidebar1" layout="nodisplay" >
         <button id="close-button" on="tap:sidebar1.close">Close</button>
         <ul>
diff --git a/examples/amp-story/ampconf.html b/examples/amp-story/ampconf.html
index c3808c7373b53..fbeebc1be309d 100644
--- a/examples/amp-story/ampconf.html
+++ b/examples/amp-story/ampconf.html
@@ -18,7 +18,7 @@
       box-sizing: border-box;
     }
     amp-story * {
-      font-family: 'Helvitica Nueve', sans-serif;
+      font-family: 'Helvetica Neue', sans-serif;
       color: white;
     }
     amp-story-page {
diff --git a/examples/amp-story/analytics.html b/examples/amp-story/analytics.html
index 1e1d1396a2e03..fa7025a1fb58e 100644
--- a/examples/amp-story/analytics.html
+++ b/examples/amp-story/analytics.html
@@ -61,6 +61,16 @@
                   "eventId": "clickOnBookend"
                 }
               },
+              "trackPageAttachmentOpen": {
+                "on": "story-open",
+                "tagName": "amp-story-page-attachment",
+                "request": "base"
+              },
+              "trackPageAttachmentClose": {
+                "on": "story-close",
+                "tagName": "amp-story-page-attachment",
+                "request": "base"
+              },
               "trackFocusedState": {
                 "on": "story-focus",
                 "tagName": "a",
@@ -79,11 +89,13 @@
                 }
               },
               "trackBookendEnter": {
-                "on": "story-bookend-enter",
+                "on": "story-open",
+                "tagName": "amp-story-bookend",
                 "request": "pageView"
               },
               "trackBookendExit": {
-                "on": "story-bookend-exit",
+                "on": "story-close",
+                "tagName": "amp-story-bookend",
                 "request": "pageView"
               },
               "trackAudioEnable": {
@@ -103,6 +115,14 @@
         <amp-story-grid-layer template="vertical">
           <h1>Page One</h1>
         </amp-story-grid-layer>
+        <amp-story-page-attachment layout="nodisplay">
+          <div>
+            <h1>Some really cool video</h1>
+              <p style="color: black">
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+              </p>
+          </div>
+        </amp-story-page-attachment>
       </amp-story-page>
 
       <amp-story-page id="p2">
@@ -118,7 +138,7 @@ <h1>Page Three</h1>
         </amp-story-grid-layer>
         <amp-story-cta-layer>
           <a>click me</a>
-        </amp-story-grid-layer>
+        </amp-story-cta-layer>
       </amp-story-page>
 
       <amp-story-page id="p4" style="background-color: grey">
diff --git a/examples/amp-story/embed.html b/examples/amp-story/embed.html
index 56eb7d783e04e..413ffa353d929 100644
--- a/examples/amp-story/embed.html
+++ b/examples/amp-story/embed.html
@@ -1,6 +1,6 @@
 <html>
   <head>
-    <title>AMP Story Embed Example</title>
+    <title>Story Embed (Non-AMP)</title>
     <script async src="../../dist/amp-story-embed.js"></script>
     <style page>
       body {
diff --git a/examples/amp-story/quiz.html b/examples/amp-story/quiz.html
new file mode 100644
index 0000000000000..303077e441a5f
--- /dev/null
+++ b/examples/amp-story/quiz.html
@@ -0,0 +1,132 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>amp-story-quiz example</title>
+  <link rel="canonical" href="amps.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <style amp-custom>
+    h1 #cat-facts-title {
+      color: white;
+      font-family: Helvetica;
+      text-align: center;
+      font-size: 48px;
+    }
+  </style>
+  <script async custom-element="amp-story"
+        src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
+        <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+  <amp-story standalone id="cat-facts"
+    title="Cat Facts!"
+    publisher="The AMP Team"
+    publisher-logo-src="./img/AMP-Brand-White-Icon.svg"
+    poster-portrait-src="./img/overview.jpg">
+
+    <amp-analytics id="analytics1">
+      <script type="application/json">
+        {
+          "requests": {
+            "endpoint": "https://raw.githubusercontent.com/ampproject/amphtml/master/examples/img/ampicon.png",
+            "base": "${endpoint}?${type|default:foo}&path=${canonicalPath}",
+            "click": "${base}?&index=${storyPageIndex}&id=${storyPageId}&reactionType=${storyReactionType}&reactionId=${storyReactionId}&reactionResponseId=${storyReactionResponse}"
+          },
+          "triggers": {
+            "trackQuizResponse": {
+              "on": "story-reaction",
+              "tagname": "amp-story-quiz",
+              "request": "click"
+            }
+          }
+        }
+      </script>
+    </amp-analytics>
+
+    <amp-story-page id="cover">
+      <amp-story-grid-layer template="fill">
+          <amp-img src="https://i.pinimg.com/originals/60/3d/be/603dbeae12bb77121f912d48aee8ee4e.jpg"
+          width="720" height="1280"
+          layout="responsive">
+      </amp-story-grid-layer>
+      <amp-story-grid-layer template="vertical">
+        <h1 id="cat-facts-title">Cat Facts!</h1>
+      </amp-story-grid-layer>
+    </amp-story-page>
+    <amp-story-page id="quiz-question-1">
+      <amp-story-grid-layer template="fill">
+          <amp-img src="https://dw5orfsilhv7r.cloudfront.net/wp-content/uploads/2016/03/petandco-wallpapers-cats-phone-01.png"
+          width="720" height="1280"
+          layout="responsive">
+      </amp-story-grid-layer>
+      <amp-story-grid-layer>
+        <amp-story-quiz
+          id='cat-question-appear'
+          endpoint="http://localhost:3000/reactions">
+          <h1>When did the domestic cat first appear on the scene?</h1>
+          <option>7,000 years ago</option>
+          <option correct>500,000 years ago</option>
+          <option>2 million years ago</option>
+          <option>34 million years ago</option>
+        </amp-story-quiz>
+      </amp-story-grid-layer>
+    </amp-story-page>
+    <amp-story-page id="quiz-question-2">
+        <amp-story-grid-layer template="fill">
+            <amp-img src="https://i.pinimg.com/originals/08/20/d3/0820d30c849627c7939761637ac90219.jpg"
+            width="720" height="1280"
+            layout="responsive">
+        </amp-story-grid-layer>
+        <amp-story-grid-layer>
+          <amp-story-quiz
+            id='cat-question-handedness'>
+            <h2>True or False: Cats can be right-pawed or left-pawed.</h2>
+            <option correct>True</option>
+            <option>False</option>
+            <option>The quick brown fox jumped over the lazy dog lorem ipsum dolor sit amet as d f ghjkl</option>
+          </amp-story-quiz>
+        </amp-story-grid-layer>
+      </amp-story-page>
+      <amp-story-page id="quiz-question-3">
+        <amp-story-grid-layer template="fill">
+            <amp-img src="https://i.pinimg.com/originals/8d/b1/e9/8db1e9b7cc3ee52b13cabe3a53c62f05.jpg"
+            width="720" height="1280"
+            layout="responsive">
+        </amp-story-grid-layer>
+        <style>
+          #cat-question-cute {
+            justify-content: flex-end;
+            align-content: flex-end;
+          }
+        </style>
+        <amp-story-grid-layer id="cat-question-cute">
+          <amp-story-quiz
+            id="cats-cute-quiz">
+            <h2>Are cats cute?</h2>
+            <option correct>Yes</option>
+            <option>No</option>
+          </amp-story-quiz>
+        </amp-story-grid-layer>
+        <amp-story-page-attachment layout="nodisplay" theme="dark">
+          <h1>Amazing title</h1>
+          <p>Bacon ipsum dolor cat cat cat.</p>
+          <amp-youtube
+              id="myLiveChannel"
+              data-live-channelid="UCB8Kb4pxYzsDsHxzBfnid4Q"
+              width="358"
+              height="204"
+              layout="responsive">
+            <amp-img
+                src="https://i.ytimg.com/vi/Wm1fWz-7nLQ/hqdefault_live.jpg"
+                placeholder
+                layout="fill">
+            </amp-img>
+          </amp-youtube>
+        </amp-story-page-attachment>
+      </amp-story-page>
+  </amp-story>
+</body>
+</html>
diff --git a/examples/amp-story/rtl.html b/examples/amp-story/rtl.html
index a14abc6d3749a..4aaece60bbf5f 100644
--- a/examples/amp-story/rtl.html
+++ b/examples/amp-story/rtl.html
@@ -18,7 +18,7 @@
       box-sizing: border-box;
     }
     amp-story * {
-      font-family: 'Helvitica Nueve', sans-serif;
+      font-family: 'Helvetica Neue', sans-serif;
       color: white;
     }
     amp-story-page {
diff --git a/examples/amp-story/supports-landscape-ads.html b/examples/amp-story/supports-landscape-ads.html
new file mode 100644
index 0000000000000..6ffd7710a7b06
--- /dev/null
+++ b/examples/amp-story/supports-landscape-ads.html
@@ -0,0 +1,110 @@
+<!doctype html>
+<html amp lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-story" src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
+  <script async custom-element="amp-story-auto-ads" src="https://cdn.ampproject.org/v0/amp-story-auto-ads-0.1.js"></script>
+  <title>AMP Story</title>
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <link rel="canonical" href="amp-story.amp.html">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <link href="https://fonts.googleapis.com/css?family=Lilita+One&display=swap" rel="stylesheet">
+  <style amp-custom>
+    amp-story-page {
+      background: slateblue;
+    }
+
+    .container {
+      justify-content: center;
+      align-content: center;
+    }
+
+    .num {
+      text-align: center;
+      color: white;
+      font-size: 300px;
+      font-family: 'Lilita One', cursive;
+    }
+  </style>
+</head>
+
+<body>
+  <amp-story standalone supports-landscape>
+    <amp-story-auto-ads>
+      <script type="application/json">
+        {
+          "ad-attributes": {
+            "type": "doubleclick",
+            "data-slot": "/30497360/a4a/amp_story_dfp_example"
+          }
+        }
+      </script>
+    </amp-story-auto-ads>
+
+    <amp-story-page id="page-1">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">1</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-2">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">2</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-3">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">3</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-4">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">4</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-5">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">5</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-6">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">6</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+
+    <amp-story-page id="page-7">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">7</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-8">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">8</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-9">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">9</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-10">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">10</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+  </amp-story>
+</body>
+
+</html>
diff --git a/examples/amp-subscriptions.amp.html b/examples/amp-subscriptions.amp.html
index 722a96deb1e97..ab070b31f6380 100644
--- a/examples/amp-subscriptions.amp.html
+++ b/examples/amp-subscriptions.amp.html
@@ -170,6 +170,69 @@
   </style>
 </head>
 <body>
+<!-- The following lines are only required if you use Propensity to Subscribe.
+     Most events required by Propensity are automatically generated by
+     amp-subscriptions.  Publisher buy-flow events may need to be manually
+     declared.  The onSubscriptionsLandingPage trigger below is a good example
+     of what a custom event would look like.
+     There are some exceptions:
+       * Past subscriptions - SwG is not aware of expired subscriptions.
+         Propensity ideally wants to know if the user was subscribed to
+         something in the past so a public method exists for publishers to
+         declare a past subscription (if it is known).  This information
+         improves the final score generated by Propensity.  An example is
+         provided in the onPastSubscriber trigger below.
+      * Subscriptions Landing Page - Only the publisher knows if their AMP page
+         is actually a subscriptions landing page (subscriptions focused instead
+         of news article focused).  A method is provided for publishers to
+         declare that the current page is the subscriptions landing page. An
+         example is provided in the onSubscriptionsLandingPage trigger below.
+      * User shown subscriptions ad - SwG is not aware of ads displayed.  The
+         publisher must declare any ad displayed to the user so Propensity is
+         aware.  An example is shown in the onAd trigger below, you will need
+         to adjust it so the CSS selector works for your page.
+-->
+<!--
+<amp-analytics type="subscriptions-propensity"
+  data-credentials="include"
+  credentials="include">
+  <script type="application/json">
+  {
+    "vars": {
+      "productId": "scenic-2017.appspot.com:news",
+      "publicationId": "scenic-2017.appspot.com"
+    },
+    "triggers": {
+      "onSubscriptionsLandingPage": {
+        "on": "visible",
+        "request": "sendEvent",
+        "vars": {
+          "event": "subscriptions_landing_page",
+          "data": "{\"source\": \"email marketing campaign 2019\", \"is_active\": false}"
+        }
+      },
+      "onPastSubscriber": {
+        "on": "visible",
+        "request": "sendSubscriptionState",
+        "vars": {
+          "state": "past_subscriber",
+          "products": "'product1', 'product2'"
+        }
+      },
+      "onAd": {
+        "on": "visible",
+        "selector": ".fallAd",
+        "request": "sendEvent",
+        "vars": {
+          "event": "ad_shown",
+          "data": "{\"ad_name\": \"fall_ad or custom name\"}"
+        }
+      }
+    }
+  }
+  </script>
+</amp-analytics>
+-->
 <amp-analytics type="googleanalytics" id="analytics2">
 <script type="application/json">
 {
diff --git a/examples/analytics-notification-with-geo.amp.html b/examples/analytics-notification-with-geo.amp.html
index c92a1004db863..06757f5e71aae 100644
--- a/examples/analytics-notification-with-geo.amp.html
+++ b/examples/analytics-notification-with-geo.amp.html
@@ -129,6 +129,6 @@
   <h2>Notification with amp-geo demo</h2>
   <p>This page has three "amp-user-notification" elements.  They
   are configured to trigger in different countries.  One for NAFTA (CA, MX, US).  One for multiple country groups and one for the negative matched country groups.</p>
-  <p>If you are using locahost or in the dev channel you can set your country using #amp-geo= with the two letter ISO country code.  For example #amp-geo=us.</p>
+  <p>If you are using localhost or in the experimental channel you can set your country using #amp-geo= with the two letter ISO country code.  For example #amp-geo=us.</p>
 </body>
 </html>
diff --git a/examples/analytics-notification.amp.html b/examples/analytics-notification.amp.html
index 67862dfbaa641..17adb8e6b86db 100644
--- a/examples/analytics-notification.amp.html
+++ b/examples/analytics-notification.amp.html
@@ -15,6 +15,10 @@
       padding: 8px;
       background: #46b6ac;
     }
+    
+    .analytic-notification-demo-text{
+      padding:16px;
+    }
 
     amp-user-notification .btn {
       border: none;
@@ -62,14 +66,19 @@
   <script async src="https://cdn.ampproject.org/v0.js"></script>
 </head>
 <body>
-
+  <div  class="analytic-notification-demo-text">
+    <h3>AMP Analytics Notification Demo</h3>
+    <p>This page uses the <a href="https://amp.dev/documentation/components/amp-user-notification/">amp-user-notification</a> to display a cookie concent banner at the bottom of the page.</p>
+    <p>When user dismisses the notification, the <a href="https://amp.dev/documentation/components/amp-analytics/">amp-analytics</a> component is used to post a 'cookie-concent-ping' request to an analytics server.</p>
+    <p>The analytics server doesn't exist so you will see an error in developer console.</p>
+  </div>
   <amp-user-notification
       layout=nodisplay
       id="amp-user-notification1"
-      data-show-if-href="https://example.com/api/show?timestamp=TIMESTAMP"
-      data-dismiss-href="https://example.com/api/echo/post">
-      This site uses cookies to personalize content.
-     <a class="btn" on="tap:amp-user-notification1.dismiss">I accept</a>
+      data-persist-dismissal="false">
+      This notification should ALWAYS show on every page visit.
+    <a href="#learn-more">Learn more.</a>
+    <button on="tap:amp-user-notification1.dismiss">Dismiss</button>
   </amp-user-notification>
 
   <amp-analytics data-consent-notification-id="amp-user-notification1">
diff --git a/examples/analytics-vendors.amp.html b/examples/analytics-vendors.amp.html
index 5c4f4afe5f612..fb9f6e706125e 100644
--- a/examples/analytics-vendors.amp.html
+++ b/examples/analytics-vendors.amp.html
@@ -55,11 +55,13 @@
       <option>baiduanalytics</option>
       <option>burt</option>
       <option>byside</option>
+      <option>captainmetrics</option>
       <option>chartbeat</option>
       <option>clicky</option>
       <option>colanalytics</option>
       <option>comscore</option>
       <option>cxense</option>
+      <option>deepbi</option>
       <option>dynatrace</option>
       <option>epica</option>
       <option>euleriananalytics</option>
@@ -78,6 +80,7 @@
       <option>mediametrie</option>
       <option>mediarithmics</option>
       <option>mediator</option>
+      <option>memo</option>
       <option>mobify</option>
       <option>mparticle</option>
       <option>mpulse</option>
@@ -101,6 +104,7 @@
       <option>shinystat</option>
       <option>simplereach</option>
       <option>snowplow</option>
+      <option>snowplow_v2</option>
       <option>teaanalytics</option>
       <option>tealiumcollect</option>
       <option>top100</option>
@@ -368,6 +372,71 @@
 </amp-analytics>
 <!-- End BySide example -->
 
+<!-- Captain Metrics tracking -->
+<amp-analytics type="captainmetrics" id="captainmetrics">
+<script type="application/json">
+  {
+    "vars": {
+      "projectId": "your_project_id"
+    },
+    "triggers": {
+      "pageview": {
+        "on": "visible",
+        "request": "hit",
+        "extraUrlParams": {
+          "type": "pageview",
+          "pageview": {
+            "title": "${title}",
+            "page": "${sourceUrl}",
+            "product": {
+              "externalId": "product-id",
+              "sku": "product-sku",
+              "name": "product-name",
+              "brand": "product-brand",
+              "category": "product-category",
+              "variant": "product-variant",
+              "price": 1000,
+              "currency": "EUR"
+            },
+            "props": {
+              "customProperty": "xxx"
+            }
+          }
+        }
+      },
+      "event": {
+        "on": "click",
+        "selector": "#event-test-button",
+        "request": "hit",
+        "extraUrlParams": {
+          "type": "event",
+          "event": {
+            "label": "my_event",
+            "value": 1,
+            "nonInteractive": false
+          },
+          "props": {
+            "customProperty": "xxx"
+          }
+        }
+      },
+      "hidden": {
+        "on": "hidden",
+        "request": "hit",
+        "extraUrlParams": {
+          "type": "timeSpent",
+          "timeSpent": {
+            "pageId": "${pageViewId}",
+            "secs": "${incrementalEngagedTime(cm)}"
+          }
+        }
+      }
+    }
+  }
+</script>
+</amp-analytics>
+<!-- End Captain Metrics example -->
+
 <!-- Chartbeat tracking -->
 <amp-analytics type="chartbeat" id="chartbeat">
 <script type="application/json">
@@ -430,6 +499,24 @@
 </amp-analytics>
 <!-- End Cxense example -->
 
+<!-- Deep.BI tracking -->
+<amp-analytics type="deepbi" id="deepbi">
+<script type="application/json">
+{
+  "vars": {
+    "datasetKey": "aBcDeFgHiJkL",
+    "accessKey": "aBcDeFgHiJkLMn0123456789",
+    "gdpr":"true"
+  },
+  "extraUrlParams": {
+    "dimension1": "value1"
+  }
+}
+</script>
+</amp-analytics>
+<!-- End Deep.BI example -->
+
+
 <!-- dynatrace tracking -->
 <amp-analytics type="dynatrace" id="dynatrace">
 <script type="application/json">
@@ -607,7 +694,6 @@
 
 <!--
   INFOnline example
-
   Important: url needs to point to a copy of
   amp-analytics-infonline.html on a different subdomain
   than your AMP files.
@@ -842,6 +928,21 @@
 </amp-analytics>
 <!-- End Mediator.media example -->
 
+<!-- Memo Tracking -->
+<amp-analytics type="memo" id="memo">
+<script type="application/json">
+  {
+    "vars": {
+      "pid": "000000000000000000000000",
+      "title": "Article Title",
+      "authors": ["Joe Author 1", "Jane Author 2"],
+      "published_at": "2019-01-01 00:00:00"
+    }
+  }
+</script>
+</amp-analytics>
+<!-- End Memo Example -->
+
 <!-- Mobify tracking -->
 <amp-analytics type="mobify" id="mobify">
 <script type="application/json">
@@ -1273,6 +1374,95 @@
 </amp-analytics>
 <!-- End Snowplow Analytics example -->
 
+<!-- Snowplow v2 Analytics tracking -->
+<amp-analytics type="snowplow_v2" id="snowplow_v2" data-credentials="include">
+<script type="application/json">
+  {
+    "vars": {
+      "collectorHost": "collector.snplow.net",
+      "appId": "amp-examples-v2.0.1",
+      "userId": "someUserId",
+      "customContexts":  "{\"schema\":\"iglu:com.snowplowanalytics.snowplow/gdpr/jsonschema/1-0-0\",\"data\":{\"basisForProcessing\":\"legitimate_interests\"}}"
+    },
+    "linkers": {
+      "enabled": true,
+      "proxyOnly": false,
+      "destinationDomains": ["localhost"]
+    },
+    "triggers": {
+      "defaultPageview": {
+        "on": "visible",
+        "request": "pageView"
+      },
+      "trackFirstPagePing": {
+        "on": "timer",
+        "request": "pagePing",
+        "timerSpec": {
+          "interval": 10,
+          "maxTimerLength": 9.99,
+          "immediate": false,
+          "startSpec": {
+            "on": "visible",
+            "selector": ":root"
+          },
+          "stopSpec": {
+            "on": "hidden",
+            "selector": ":root"
+          }
+        }
+      },
+      "trackPagePings": {
+        "on": "timer",
+        "request": "pagePing",
+        "timerSpec": {
+          "interval": 30,
+          "maxTimerLength": 1800,
+          "immediate": false,
+          "startSpec": {
+            "on": "visible",
+            "selector": ":root"
+          },
+          "stopSpec": {
+            "on": "hidden",
+            "selector": ":root"
+          }
+        }
+      },
+      "trackSelfDescribingEvent": {
+        "on": "click",
+        "selector": "a",
+        "request": "selfDescribingEvent",
+        "vars": {
+          "customEventSchemaVendor": "com.snowplowanalytics.snowplow",
+          "customEventSchemaName": "link_click",
+          "customEventSchemaVersion": "1-0-1",
+          "customEventSchemaData": "{\"targetUrl\":\"${targetUrl}\",\"elementId\":\"TEST\",\"elementContent\":\"${elementContent}\"}"
+        }
+      },
+      "clickOnTest1Trigger": {
+        "on": "click",
+        "selector": "#test1",
+        "request": "structEvent",
+        "vars": {
+          "structEventCategory": "examples",
+          "structEventAction": "clicked-test1"
+        }
+      },
+      "clickOnTopTrigger": {
+        "on": "click",
+        "selector": "#top",
+        "request": "structEvent",
+        "vars": {
+          "structEventCategory": "examples",
+          "structEventAction": "clicked-header"
+        }
+      }
+    }
+  }
+</script>
+</amp-analytics>
+<!-- End Snowplow Analytics example -->
+
 <!-- TEA Analytics Example
     Ensure you replace app_id with your appId.
     Ensure you replace channel with correct value.
@@ -1522,13 +1712,39 @@
       "author":"john suran",
       "creator":"john suran",
       "domain":"clientDomain",
-      "pubdate":"2015-01-01 00:00:00"
+      "pubdate":"2015-01-01 00:00:00",
+      "customKeys": ["source","user_status"],
+      "customValues": ["digital team","0"]
     },
     "triggers": {
-      "event": {
-        "on": "click",
-        "selector": "#test1",
-        "request": "finalbeat"
+      "videoPlays": {
+        "on": "video-play",
+        "selector": "#myVideo",
+        "request": "video-play",
+        "vars" : {
+          "video_id" : "myVideo",
+          "video_name" : "test test test",
+          "video_thumbnail" : "poster_test"
+        }
+      },
+      "videoPauses": {
+        "on": "video-pause",
+        "selector": "#myVideo",
+        "request": "video-pause"
+      },
+      "videoSecondsPlayed": {
+        "on": "video-seconds-played",
+        "selector": "#myVideo",
+        "videoSpec": {
+          "exclude-autoplay": false,
+          "interval": 10
+        },
+        "request": "video-info"
+      },
+      "videoEnded": {
+        "on": "video-ended",
+        "selector": "#myVideo",
+        "request": "video-stop"
       }
     }
   }
@@ -1632,6 +1848,9 @@ <h1 id="top">AMP Analytics</h1>
   Click here to generate an event
 </span>
 <p>
+Example of <a id="ext" data-vars-target-url="../"  data-vars-element-id="home" data-vars-element-content="Internal Link" href="../">Internal Link</a>.
+</p>
+<p>
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pellentesque augue quis elementum tempus. Pellentesque sit amet neque bibendum, sagittis purus vitae, pellentesque magna. Vestibulum non viverra metus, eget feugiat lacus. Nulla in maximus orci. Maecenas id turpis vel ipsum vestibulum bibendum ut sit amet magna. Nullam hendrerit ex at est eleifend, nec dignissim nibh rutrum. Aliquam quis tellus et nibh faucibus laoreet in eget turpis. Nam quam nisl, porttitor vel ex eget, dapibus placerat dui. Mauris commodo pellentesque leo, eu tempus quam. In hac habitasse platea dictumst. Suspendisse non ante finibus, luctus augue non, luctus orci. Vestibulum ornare lacinia aliquam. In sollicitudin vehicula vulputate. Sed mi elit, commodo nec sapien nec, pretium bibendum leo. Donec id justo tortor. Ut in mauris dapibus, laoreet metus vitae, dictum nisi.
 </p>
 <p>
diff --git a/examples/article-access-poool.amp.html b/examples/article-access-poool.amp.html
index ddfbd7978d183..8d56762d45c3d 100644
--- a/examples/article-access-poool.amp.html
+++ b/examples/article-access-poool.amp.html
@@ -261,6 +261,13 @@ <h1 itemprop="headline">Lorem Ipsum</h1>
                 Nullam in libero nisi.
               </p>
 
+              <amp-img
+                  src="img/panorama1.jpg"
+                  layout="responsive" width="360" placeholder
+                  alt="This is a test amp-img component inside unlocked content"
+                  height="216">
+              </amp-img>
+
               <p>
                 Sed pharetra semper fringilla. Nulla fringilla, neque eget
                 varius suscipit, mi turpis congue odio, quis dignissim nisi
diff --git a/examples/autocomplete.amp.html b/examples/autocomplete.amp.html
index ee56620f90387..37f5c44f45cd3 100644
--- a/examples/autocomplete.amp.html
+++ b/examples/autocomplete.amp.html
@@ -1,59 +1,194 @@
-<!doctype html>
+<!DOCTYPE html>
 <html ⚡>
-<head>
-  <meta charset="utf-8">
-  <script async src="https://cdn.ampproject.org/v0.js"></script>
-  <title>AMP Autocomplete Demo</title>
-  <link rel="canonical" href="amps.html">
-  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-  <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
-  <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
-  <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
-  <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
-  <style amp-custom>
-    body {
+  <head>
+    <meta charset="utf-8" />
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <title>AMP Autocomplete Demo</title>
+    <link rel="canonical" href="amps.html" />
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"/>
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
+    <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
+    <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-latest.js"></script>
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+    <style amp-custom>
+      body {
         padding: 15px;
-    }
-    .custom-population {
+      }
+      .custom {
         padding-top: 4px;
         font: 8pt 'Courier New', Courier, monospace;
-    }
-    input[name=favoriteState] {
-      width: 2em;
-    }
-    .out-of-stock {
-      text-align: right;
-      text-transform: uppercase;
-      font: 8pt 'Arial', sans-serif;
-      right: 0;
-    }
-
-    .autocomplete-partial {
-      font-weight: bold;
-    }
-
-    #select-example .autocomplete-partial {
-      color: red;
-      text-decoration: underline;
-    }
-  </style>
-</head>
-<body>
+      }
+      input[name='favoriteState'] {
+        width: 2em;
+      }
+      input[type='submit'] {
+        display: block;
+        margin-top: 10px;
+      }
+      .out-of-stock {
+        text-align: right;
+        text-transform: uppercase;
+        font: 8pt 'Arial', sans-serif;
+        right: 0;
+      }
+      .autocomplete-partial {
+        font-weight: bold;
+      }
+
+      #select-example .autocomplete-partial {
+        color: red;
+        text-decoration: underline;
+      }
+      .wide {
+        width: 50vw;
+      }
+      .autocomplete-selected {
+        color: blue;
+        text-decoration: underline;
+      }
+      .profile-pic {
+        width: 30px;
+        height: 30px;
+        margin-right: 10px;
+        margin-left: -5px;
+      }
+      .close-friends {
+        display: flex;
+        align-items: center;
+        line-height: 18px;
+      }
+      textarea {
+        padding: 0.5rem; /* default-ui-space-large */
+        border: 1px solid rgba(0, 0, 0, 0.33); /* default-ui-med-gray */
+        font-size: 1rem; /* default-ui-font-size */
+        line-height: 1.5rem; /* default-ui-space-large */        
+      }
+    </style>
+  </head>
+  <body>
     <h1>Autocomplete</h1>
+    <h2>Inline</h2>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <amp-autocomplete
+        inline="@"
+        min-characters="0"
+        suggest-first
+        filter="none"
+        src="/form/mention/query"
+        query="q"
+        on="select:AMP.setState({inlineInputSelect: event.value})"
+      >
+        <label>remote data</label><br />
+        <textarea
+          autoexpand
+          class="wide"
+          name="inlineInput"
+          placeholder="Reply"
+        ></textarea>
+        <template type="amp-mustache" id="amp-template-plain">
+          <div data-value="{{ . }}">
+            {{ . }}
+          </div>
+        </template>
+      </amp-autocomplete>
+      <amp-autocomplete
+        inline="+"
+        min-characters="0"
+        suggest-first
+        filter="prefix"
+        filter-value="email"
+      >
+        <label>local data</label><br />
+        <textarea
+          autoexpand
+          class="wide"
+          rows="2"
+          placeholder="Reply"
+          name="inlineInput2"
+        ></textarea>
+        <template type="amp-mustache" id="amp-template-rich">
+          <div class="close-friends" data-value="{{ email }}">
+            <amp-img
+              class="profile-pic"
+              height="20"
+              width="20"
+              layout="responsive"
+              alt="Profile picture of AMP logo"
+              src="./img/ampicon.png"
+            ></amp-img>
+            <div class="info">
+              <div>{{ name }}</div>
+              <div class="custom">{{ email }}</div>
+            </div>
+          </div>
+        </template>
+        <script type="application/json">
+          {
+            "items": [
+              {"email": "harrypotter@hogwarts.edu", "name": "Harry Potter"},
+              {
+                "email": "albusdumbledore@hogwarts.edu",
+                "name": "Albus Dumbledore"
+              },
+              {
+                "email": "voldemort@deatheater.org",
+                "name": "Tom Marvolo Riddle"
+              },
+              {"email": "severussnape@hogwarts.edu", "name": "Severus Snape"},
+              {"email": "siriusblack@hogwarts.edu", "name": "Sirius Black"},
+              {
+                "email": "hermionegranger@hogwarts.edu",
+                "name": "Hermione Granger"
+              },
+              {"email": "ronweasley@hogwarts.edu", "name": "Ron Weasley"},
+              {"email": "dracomalfoy@hogwarts.edu", "name": "Draco Malfoy"},
+              {
+                "email": "nevillelongbottom@hogwarts.edu",
+                "name": "Neville Longbottom"
+              },
+              {"email": "rubeushagrid@hogwarts.edu", "name": "Rubeus Hagrid"},
+              {"email": "dobby@hogwarts.edu", "name": "Dobby"},
+              {
+                "email": "bellatrixlestrange@deatheater.org",
+                "name": "Bellatrix Lestrange"
+              },
+              {
+                "email": "minervamcgonagall@hogwarts.edu",
+                "name": "Minerva McGonagall"
+              }
+            ]
+          }
+        </script>
+      </amp-autocomplete>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! {{inlineInput2}}
+        </template>
+      </div>
+    </form>
+    <p [text]="'Hello ' + inlineInputSelect">Hello World</p>
+
     <h2>Select Event</h2>
-  <p>min-characters = 0, partial red underline</p>
+    <p>min-characters = 0, partial red underline</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-    <amp-autocomplete id="select-example" filter="substring" min-characters="0" highlight-user-entry
-      src="autocomplete-cities.example.json" on="select:AMP.setState({inputSelect: event.value})">
-          <input name="input2" required>
+      <amp-autocomplete
+        id="select-example"
+        filter="substring"
+        min-characters="0"
+        highlight-user-entry
+        src="autocomplete-cities.example.json"
+        on="select:AMP.setState({inputSelect: event.value})"
+      >
+        <input name="input2" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input2}}
+          Success! {{input2}}
         </template>
-    </div>
+      </div>
     </form>
     <p [text]="'Hello ' + inputSelect">Hello World</p>
 
@@ -61,749 +196,966 @@ <h2>Disable browser autofill</h2>
     <p>form has no autocomplete attr</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
       <label for="frmEmailA">Personal Email</label>
-    <input name="email" id="frmEmailA" placeholder="name@example.com" required autocomplete="email"><br>
+      <input
+        name="email"
+        id="frmEmailA"
+        placeholder="name@example.com"
+        required
+        autocomplete="email"
+      /><br />
 
       <label for="frmEmailB">Autocomplete Email</label>
       <amp-autocomplete filter="substring" min-characters="0">
-      <input name="email" id="frmEmailB" placeholder="name@example.com" required autocomplete="email">
+        <input
+          name="email"
+          id="frmEmailB"
+          placeholder="name@example.com"
+          required
+          autocomplete="email"
+        />
         <script type="application/json">
-          { "items" : ["Email 1", "<span>Email</span> 2", "Email 3"]}
+          {"items": ["Email 1", "<span>Email</span> 2", "Email 3"]}
         </script>
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
+      <input name="submit-button" type="submit" value="Submit" />
     </form>
 
     <p>form has autocomplete="on"</p>
-    <form method="post" action-xhr="/form/echo-json/post" target="_blank" autocomplete="on">
+    <form
+      method="post"
+      action-xhr="/form/echo-json/post"
+      target="_blank"
+      autocomplete="on"
+    >
       <label for="frmEmailC">Personal Email</label>
-    <input name="email" id="frmEmailC" placeholder="name@example.com" required autocomplete="email"><br>
+      <input
+        name="email"
+        id="frmEmailC"
+        placeholder="name@example.com"
+        required
+        autocomplete="email"
+      /><br />
 
       <label for="frmEmailD">Autocomplete Email</label>
       <amp-autocomplete filter="substring" min-characters="0">
-      <input name="email" id="frmEmailD" placeholder="name@example.com" required autocomplete="email">
+        <input
+          name="email"
+          id="frmEmailD"
+          placeholder="name@example.com"
+          required
+          autocomplete="email"
+        />
         <script type="application/json">
-          { "items" : ["Email 1", "Email 2", "Email 3"]}
+          {"items": ["Email 1", "Email 2", "Email 3"]}
         </script>
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
+      <input name="submit-button" type="submit" value="Submit" />
     </form>
 
     <p>form and input have autocomplete="off"</p>
-    <form method="post" action-xhr="/form/echo-json/post" target="_blank" autocomplete="off">
+    <form
+      method="post"
+      action-xhr="/form/echo-json/post"
+      target="_blank"
+      autocomplete="off"
+    >
       <label for="frmEmailE">Personal Email</label>
-    <input name="email" id="frmEmailE" placeholder="name@example.com" required autocomplete="off"><br>
+      <input
+        name="email"
+        id="frmEmailE"
+        placeholder="name@example.com"
+        required
+        autocomplete="off"
+      /><br />
 
       <label for="frmEmailF">Autocomplete Email</label>
       <amp-autocomplete filter="substring" min-characters="0">
-      <input name="email" id="frmEmailF" placeholder="name@example.com" required autocomplete="email">
+        <input
+          name="email"
+          id="frmEmailF"
+          placeholder="name@example.com"
+          required
+          autocomplete="email"
+        />
         <script type="application/json">
-          { "items" : ["Email 1", "Email 2", "Email 3"]}
+          {"items": ["Email 1", "Email 2", "Email 3"]}
         </script>
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
+      <input name="submit-button" type="submit" value="Submit" />
     </form>
 
     <h2>Attributes</h2>
     <p>no attributes</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="substring" src="autocomplete-cities.example.json">
-      <input name="input1" required>
+      <amp-autocomplete
+        filter="substring"
+        src="autocomplete-cities.example.json"
+      >
+        <input name="input1" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input1}}
+          Success! {{input1}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>min-characters = 0</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="substring" min-characters="0" src="autocomplete-cities.example.json">
-      <input name="input2" required>
+      <amp-autocomplete
+        filter="substring"
+        min-characters="0"
+        src="autocomplete-cities.example.json"
+      >
+        <input name="input2" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input2}}
+          Success! {{input2}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>min-characters = 3</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="substring" min-characters="3" src="autocomplete-cities.example.json">
-      <input name="input3" required>
+      <amp-autocomplete
+        filter="substring"
+        min-characters="3"
+        src="autocomplete-cities.example.json"
+      >
+        <input name="input3" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input3}}
+          Success! {{input3}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>max-entries = 3</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="substring" max-entries="3" src="autocomplete-cities.example.json">
-      <input name="input4" required>
+      <amp-autocomplete
+        filter="substring"
+        max-entries="3"
+        src="autocomplete-cities.example.json"
+      >
+        <input name="input4" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input4}}
+          Success! {{input4}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>max-entries = 10, min-characters = 0</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="substring" max-entries="10" min-characters="0"  src="autocomplete-cities.example.json">
-          <input type="text" name="input5" required>
+      <amp-autocomplete
+        filter="substring"
+        max-entries="10"
+        min-characters="0"
+        src="autocomplete-cities.example.json"
+      >
+        <input type="text" name="input5" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input5}}
+          Success! {{input5}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>submit-on-enter</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-    <amp-autocomplete filter="substring" src="autocomplete-cities.example.json" submit-on-enter>
-      <input type="text" name="input6" required>
-    </amp-autocomplete>
-    <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
-      <template type="amp-mustache">
-        Success! {{input6}}
-      </template>
-    </div>
-  </form>
-
-  <p>highlight-user-entry</p>
-  <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-    <amp-autocomplete filter="substring" src="autocomplete-cities.example.json" highlight-user-entry>
-          <input type="text" name="input6" required>
+      <amp-autocomplete
+        filter="substring"
+        src="autocomplete-cities.example.json"
+        submit-on-enter
+      >
+        <input type="text" name="input6" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input6}}
+          Success! {{input6}}
         </template>
-    </div>
+      </div>
+    </form>
+
+    <p>highlight-user-entry</p>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <amp-autocomplete
+        filter="substring"
+        src="autocomplete-cities.example.json"
+        highlight-user-entry
+      >
+        <input type="text" name="input6" required />
+      </amp-autocomplete>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! {{input6}}
+        </template>
+      </div>
     </form>
 
     <p>suggest-first</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="prefix"
-        src="autocomplete-cities.example.json" suggest-first>
-          <input type="text" name="input6b" required>
+      <amp-autocomplete
+        filter="prefix"
+        src="autocomplete-cities.example.json"
+        suggest-first
+      >
+        <input type="text" name="input6b" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input6b}}
+          Success! {{input6b}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>suggest-first and submit-on-enter</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="prefix"
-        src="autocomplete-cities.example.json" suggest-first submit-on-enter>
-          <input type="text" name="input6b" required>
+      <amp-autocomplete
+        filter="prefix"
+        src="autocomplete-cities.example.json"
+        suggest-first
+        submit-on-enter
+      >
+        <input type="text" name="input6b" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input6b}}
+          Success! {{input6b}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>items</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
       <amp-autocomplete filter="prefix" items="fruit">
-          <input type="text" name="input6c" required>
-          <script type=application/json>
-            { "fruit" : ["apples", "bananas", "pears"] }
-           </script>
+        <input type="text" name="input6c" required />
+        <script type="application/json">
+          {"fruit": ["apples", "bananas", "pears"]}
+        </script>
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input6c}}
+          Success! {{input6c}}
         </template>
-    </div>
+      </div>
     </form>
 
     <h2>Filters</h2>
     <p>substring</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="substring" min-characters="0"
-        src="autocomplete-cities.example.json" submit-on-enter>
-          <input type="text" name="input7" required>
+      <amp-autocomplete
+        filter="substring"
+        min-characters="0"
+        src="autocomplete-cities.example.json"
+        submit-on-enter
+      >
+        <input type="text" name="input7" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input7}}
+          Success! {{input7}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>prefix</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="prefix" min-characters="0"
-        src="autocomplete-cities.example.json" submit-on-enter>
-          <input type="text" name="input8" required>
+      <amp-autocomplete
+        filter="prefix"
+        min-characters="0"
+        src="autocomplete-cities.example.json"
+        submit-on-enter
+      >
+        <input type="text" name="input8" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input8}}
+          Success! {{input8}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>token-prefix</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="token-prefix" min-characters="0"
-        src="autocomplete-cities.example.json" submit-on-enter>
-          <input type="text" name="input9" required>
+      <amp-autocomplete
+        filter="token-prefix"
+        min-characters="0"
+        src="autocomplete-cities.example.json"
+        submit-on-enter
+      >
+        <input type="text" name="input9" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input9}}
+          Success! {{input9}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>fuzzy</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="fuzzy" min-characters="0"
-        src="autocomplete-cities.example.json" submit-on-enter>
-          <input type="text" name="input9" required>
+      <amp-autocomplete
+        filter="fuzzy"
+        min-characters="0"
+        src="autocomplete-cities.example.json"
+        submit-on-enter
+      >
+        <input type="text" name="input9" required />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input9}}
+          Success! {{input9}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>none to inline data</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="none" min-characters="0"
-        [src]="manualFilterData" submit-on-enter>
-          <input type="text" name="input10" required
-            on="input-debounced:AMP.setState({ manualFilterData:
-              { 'items' : [event.value + ' 1', event.value + ' 2', event.value + ' 3'] } })">
-          <script type=application/json>
-           { "items" : [] }
-          </script>
+      <amp-autocomplete
+        filter="none"
+        min-characters="0"
+        [src]="manualFilterData"
+        submit-on-enter
+      >
+        <input
+          type="text"
+          name="input10"
+          required
+          on="input-debounced:AMP.setState({ manualFilterData:
+              { 'items' : [event.value + ' 1', event.value + ' 2', event.value + ' 3'] } })"
+        />
+        <script type="application/json">
+          {"items": []}
+        </script>
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input10}}
+          Success! {{input10}}
         </template>
-    </div>
+      </div>
     </form>
 
     <p>none to endpoint</p>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-      <amp-autocomplete filter="none" min-characters="0"
+      <amp-autocomplete
+        filter="none"
+        min-characters="0"
         src="/form/autocomplete/query"
-        [src]="'/form/autocomplete/query?q=' + (query || '')" submit-on-enter>
-          <input type="text" name="input11" required
-            on="input-debounced:AMP.setState({ query: event.value })">
+        [src]="'/form/autocomplete/query?q=' + (query || '')"
+        submit-on-enter
+      >
+        <input
+          type="text"
+          name="input11"
+          required
+          on="input-debounced:AMP.setState({ query: event.value })"
+        />
       </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    <div submit-success>
+      <input name="submit-button" type="submit" value="Submit" />
+      <div submit-success>
         <template type="amp-mustache">
-            Success! {{input11}}
+          Success! {{input11}}
         </template>
-    </div>
+      </div>
     </form>
 
     <h2>Datasources in form context</h2>
     <p>Static data</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Your favorite color (in Arabic)</span>
-                <amp-autocomplete filter="substring" min-characters="0">
-                    <input type="text" required>
-                    <script type="application/json">
-                        { "items" : [ 
-                          "أبيض", "أسود", "أحمر", "أصفر",
-                          "أخضر", "أزرق", "بني", "برتقالى"]
-                        }
-                    </script>
-                </amp-autocomplete>
-            </label><br>
-            <label>
-                <span>Your favorite color (in English)</span>
-                <amp-autocomplete filter="prefix" min-characters="0">
-                    <input type="text" required>
-                    <script type="application/json">
-                        { "items" : ["white", "black", "red", "yellow",
-                        "green", "blue", "brown", "orange"] }
-                    </script>
-                </amp-autocomplete>
-            </label>
-            <label>
-                <span>Your favorite color (in Arabic and English)</span>
-                <amp-autocomplete filter="prefix" min-characters="0">
-                    <input type="text" required>
-                    <script type="application/json">
-                        { "items" : ["أبيض", "white", "أسود", "black", "أحمر", "red", "أصفر", "yellow", "أخضر", 
-                        "green", "أزرق", "blue", "بني", "brown", "برتقالى", "orange"] }
-                    </script>
-                </amp-autocomplete>
-            </label>
-            <input name="submit-button" type="submit" value="Submit">
-        </fieldset>
-
-        <div submit-success>
-            <template type="amp-mustache">
-                Success! Thanks {{name}} for subscribing! Please make sure to check your email {{email}}
-                to confirm!
-            </template>
-        </div>
-        <div submit-error>
-            <template type="amp-mustache">
-                Oops! {{name}}, We apologies something went wrong. Please try again later.
-            </template>
-        </div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Your favorite color (in Arabic)</span>
+          <amp-autocomplete filter="substring" min-characters="0">
+            <input type="text" required />
+            <script type="application/json">
+              {
+                "items": [
+                  "أبيض",
+                  "أسود",
+                  "أحمر",
+                  "أصفر",
+                  "أخضر",
+                  "أزرق",
+                  "بني",
+                  "برتقالى"
+                ]
+              }
+            </script>
+          </amp-autocomplete> </label
+        ><br />
+        <label>
+          <span>Your favorite color (in English)</span>
+          <amp-autocomplete filter="prefix" min-characters="0">
+            <input type="text" required />
+            <script type="application/json">
+              {
+                "items": [
+                  "white",
+                  "black",
+                  "red",
+                  "yellow",
+                  "green",
+                  "blue",
+                  "brown",
+                  "orange"
+                ]
+              }
+            </script>
+          </amp-autocomplete>
+        </label>
+        <label>
+          <span>Your favorite color (in Arabic and English)</span>
+          <amp-autocomplete filter="prefix" min-characters="0">
+            <input type="text" required />
+            <script type="application/json">
+              {
+                "items": [
+                  "أبيض",
+                  "white",
+                  "أسود",
+                  "black",
+                  "أحمر",
+                  "red",
+                  "أصفر",
+                  "yellow",
+                  "أخضر",
+                  "green",
+                  "أزرق",
+                  "blue",
+                  "بني",
+                  "brown",
+                  "برتقالى",
+                  "orange"
+                ]
+              }
+            </script>
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Thanks {{name}} for subscribing! Please make sure to check
+          your email {{email}} to confirm!
+        </template>
+      </div>
+      <div submit-error>
+        <template type="amp-mustache">
+          Oops! {{name}}, We apologies something went wrong. Please try again
+          later.
+        </template>
+      </div>
     </form>
 
     <p>Remote data (with small data)</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Your hometown</span>
-                <amp-autocomplete filter="substring" min-characters="0"
-                    src="autocomplete-cities.example.json">
-                    <input type="text" name="city" required>
-                </amp-autocomplete>
-            </label>
-            <label>
-                <span>Favorite state, defined item property</span>
-                <amp-autocomplete filter="substring" min-characters="0"
-                    src="autocomplete-states.example.json" items="states">
-                    <input type="text" name="favoriteState" required>
-                </amp-autocomplete>
-            </label>
-            <input name="submit-button" type="submit" value="Submit">
-        </fieldset>
-
-        <div submit-success>
-            <template type="amp-mustache">
-                Success! Mailing a postcard to {{city}}.
-            </template>
-        </div>
-    </form>
-
-    <p>Both data sources provided (should cause warning and display remote data)</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Your hometown</span>
-                <amp-autocomplete filter="substring" min-characters="0"
-                    src="autocomplete-cities.example.json">
-                    <input type="text" name="city" required>
-                    <script type="application/json">
-                      { "items" : ["hello a", "hello b", "hello c"] }
-                    </script>
-                </amp-autocomplete>
-            </label>
-            <input name="submit-button" type="submit" value="Submit">
-        </fieldset>
-
-        <div submit-success>
-            <template type="amp-mustache">
-                Success! Mailing a postcard to {{city}}.
-            </template>
-        </div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Your hometown</span>
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="autocomplete-cities.example.json"
+          >
+            <input type="text" name="city" required />
+          </amp-autocomplete>
+        </label>
+        <label>
+          <span>Favorite state, defined item property</span>
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="autocomplete-states.example.json"
+            items="states"
+          >
+            <input type="text" name="favoriteState" required />
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{city}}.
+        </template>
+      </div>
+    </form>
+
+    <p>
+      Both data sources provided (should cause warning and display remote data)
+    </p>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Your hometown</span>
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="autocomplete-cities.example.json"
+          >
+            <input type="text" name="city" required />
+            <script type="application/json">
+              {"items": ["hello a", "hello b", "hello c"]}
+            </script>
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{city}}.
+        </template>
+      </div>
     </form>
 
     <p>Neither data sources provided (should cause warning)</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Your hometown</span>
-                <amp-autocomplete filter="substring" min-characters="0">
-                    <input type="text" name="city" required>
-                </amp-autocomplete>
-            </label>
-            <input name="submit-button" type="submit" value="Submit">
-        </fieldset>
-
-        <div submit-success>
-            <template type="amp-mustache">
-                Success! Mailing a postcard to {{city}}.
-            </template>
-        </div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Your hometown</span>
+          <amp-autocomplete filter="substring" min-characters="0">
+            <input type="text" name="city" required />
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{city}}.
+        </template>
+      </div>
     </form>
 
     <p>Dynamic data, changing json path</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Your hometown</span>
-                <amp-autocomplete filter="substring" min-characters="0"
-                    src="autocomplete-cities.example.json"
-                    [src]="srcUrl">
-                    <input type="text" name="value" required>
-                </amp-autocomplete>
-            </label>
-            <input name="submit-button" type="submit" value="Submit"><br>
-        </fieldset>
-
-        <div submit-success>
-            <template type="amp-mustache">
-                Success! Mailing a postcard to {{value}}.
-            </template>
-        </div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Your hometown</span>
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="autocomplete-cities.example.json"
+            [src]="srcUrl"
+          >
+            <input type="text" name="value" required />
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" /><br />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{value}}.
+        </template>
+      </div>
     </form>
-    <button on="tap:AMP.setState({ srcUrl: 'autocomplete-countries.example.json' })">Suggest countries</button>
-    <button on="tap:AMP.setState({ srcUrl: 'autocomplete-cities.example.json' })">Suggest US cities</button>
+    <button
+      on="tap:AMP.setState({ srcUrl: 'autocomplete-countries.example.json' })"
+    >
+      Suggest countries
+    </button>
+    <button
+      on="tap:AMP.setState({ srcUrl: 'autocomplete-cities.example.json' })"
+    >
+      Suggest US cities
+    </button>
 
     <p>Dynamic data, changing json object</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Your message</span>
-                <amp-autocomplete filter="substring" min-characters="0"
-                    [src]="srcJson">
-                    <input type="text" name="value" required>
-                    <script type="application/json">
-                      { "items" : ["hello a", "hello b", "hello c"] }
-                    </script>
-                </amp-autocomplete>
-            </label>
-            <input name="submit-button" type="submit" value="Submit"><br>
-        </fieldset>
-
-        <div submit-success>
-            <template type="amp-mustache">
-                Thanks for submitting "{{value}}".
-            </template>
-        </div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Your message</span>
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            [src]="srcJson"
+          >
+            <input type="text" name="value" required />
+            <script type="application/json">
+              {"items": ["hello a", "hello b", "hello c"]}
+            </script>
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" /><br />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Thanks for submitting "{{value}}".
+        </template>
+      </div>
     </form>
-    <button on="tap:AMP.setState({ srcJson: { 'items' : ['apple', 'banana', 'coconut']} })">Suggest fruit</button>
-    <button on="tap:AMP.setState({ srcJson: { 'items' : ['hello a', 'hello b', 'hello c'] } })">Suggest hellos</button>
+    <button
+      on="tap:AMP.setState({ srcJson: { 'items' : ['apple', 'banana', 'coconut']} })"
+    >
+      Suggest fruit
+    </button>
+    <button
+      on="tap:AMP.setState({ srcJson: { 'items' : ['hello a', 'hello b', 'hello c'] } })"
+    >
+      Suggest hellos
+    </button>
 
     <p>Dynamic data, changing json path and object</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Your hometown</span>
-                <amp-autocomplete filter="substring" min-characters="0"
-                    [src]="srcData">
-                    <input type="text" name="value" required>
-                    <script type="application/json">
-                      { "items" : ["hello a", "hello b", "hello c"] }
-                    </script>
-                </amp-autocomplete>
-            </label>
-            <input name="submit-button" type="submit" value="Submit"><br>
-        </fieldset>
-
-        <div submit-success>
-            <template type="amp-mustache">
-                Success! Mailing a postcard to {{value}}.
-            </template>
-        </div>
-    </form>
-    <button on="tap:AMP.setState({ srcData: { 'items' : ['apple', 'banana', 'coconut']} })">Suggest fruit</button>
-    <button on="tap:AMP.setState({ srcData: 'autocomplete-cities.example.json' })">Suggest US cities</button>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Your hometown</span>
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            [src]="srcData"
+          >
+            <input type="text" name="value" required />
+            <script type="application/json">
+              {"items": ["hello a", "hello b", "hello c"]}
+            </script>
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" /><br />
+      </fieldset>
 
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{value}}.
+        </template>
+      </div>
+    </form>
+    <button
+      on="tap:AMP.setState({ srcData: { 'items' : ['apple', 'banana', 'coconut']} })"
+    >
+      Suggest fruit
+    </button>
+    <button
+      on="tap:AMP.setState({ srcData: 'autocomplete-cities.example.json' })"
+    >
+      Suggest US cities
+    </button>
 
     <h2>Templates in search context</h2>
     <p>Plain Text, Submit on enter</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Search for</span>
-                <amp-autocomplete filter="token-prefix" submit-on-enter>
-                    <input type="search" name="term" required>
-                    <script type="application/json">
-                        { "items" : ["apple", "pineapple", "coconut", "pine apple"] }
-                    </script>
-                </amp-autocomplete>
-            </label>
-            <input type="submit" value="Search">
-        </fieldset>
-        <div submit-success>
-            <template type="amp-mustache">
-                <div>Here are the results for the search: {{term}}</div>
-            </template>
-        </div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Search for</span>
+          <amp-autocomplete filter="token-prefix" submit-on-enter>
+            <input type="search" name="term" required />
+            <script type="application/json">
+              {"items": ["apple", "pineapple", "coconut", "pine apple"]}
+            </script>
+          </amp-autocomplete>
+        </label>
+        <input type="submit" value="Search" />
+      </fieldset>
+      <div submit-success>
+        <template type="amp-mustache">
+          <div>Here are the results for the search: {{term}}</div>
+        </template>
+      </div>
     </form>
 
     <p>Rich Text, Template Child, Default Value Property</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Search for</span>
-                <amp-autocomplete filter="token-prefix" min-characters="0">
-                    <input type="search" name="term" required>
-                    <script type="application/json">
-                        { "items" : [
-                            {
-                                "value" : "Albany, New York",
-                                "areaCode" : 518,
-                                "population" : 98251
-                            }, {
-                                "value" : "Annapolis, Maryland",
-                                "areaCode" : 410,
-                                "population" : 39321
-                            }, {
-                                "value" : "Trenton, New Jersey",
-                                "areaCode" : 609,
-                                "population" : 84964
-                            }
-                        ] }
-                    </script>
-                    <template type="amp-mustache" id="amp-template-default">
-                        <div class="city-item" data-value="{{value}}">
-                            <div>{{value}}</div>
-                            <div class="custom-population">Population: {{population}}</div>
-                        </div>
-                        </template>
-                </amp-autocomplete>
-            </label>
-            <input type="submit" value="Search">
-        </fieldset>
-        <div submit-success>
-            <template type="amp-mustache">
-                <div>Here are the results for the search: {{term}}</div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Search for</span>
+          <amp-autocomplete filter="token-prefix" min-characters="0">
+            <input type="search" name="term" required />
+            <script type="application/json">
+              {
+                "items": [
+                  {
+                    "value": "Albany, New York",
+                    "areaCode": 518,
+                    "population": 98251
+                  },
+                  {
+                    "value": "Annapolis, Maryland",
+                    "areaCode": 410,
+                    "population": 39321
+                  },
+                  {
+                    "value": "Trenton, New Jersey",
+                    "areaCode": 609,
+                    "population": 84964
+                  }
+                ]
+              }
+            </script>
+            <template type="amp-mustache" id="amp-template-default">
+              <div class="city-item" data-value="{{value}}">
+                <div>{{value}}</div>
+                <div class="custom">Population: {{population}}</div>
+              </div>
             </template>
-        </div>
+          </amp-autocomplete>
+        </label>
+        <input type="submit" value="Search" />
+      </fieldset>
+      <div submit-success>
+        <template type="amp-mustache">
+          <div>Here are the results for the search: {{term}}</div>
+        </template>
+      </div>
     </form>
 
     <p>Rich Text, Template Child, Custom Value Property</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Search for</span>
-                <amp-autocomplete filter="token-prefix" filter-value="city" min-characters="0">
-                    <input type="search" name="term" required>
-                    <script type="application/json">
-                        { "items" : [
-                            {
-                                "city" : "Albany",
-                                "state" : "New York",
-                                "areaCode" : 518,
-                                "population" : 98251
-                            }, {
-                                "city" : "Annapolis",
-                                "state" : "Maryland",
-                                "areaCode" : 410,
-                                "population" : 39321
-                            }, {
-                                "city" : "Trenton",
-                                "state" : "New Jersey",
-                                "areaCode" : 609,
-                                "population" : 84964
-                            }
-                        ] }
-                    </script>
-                    <template type="amp-mustache" id="amp-template-custom">
-                        <div class="city-item" data-value="{{city}}, {{state}}">
-                            <div>{{city}}, {{state}}</div>
-                            <div class="custom-population">Population: {{population}}</div>
-                        </div>
-                    </template>
-                </amp-autocomplete>
-            </label>
-            <input type="submit" value="Search">
-        </fieldset>
-        <div submit-success>
-            <template type="amp-mustache">
-                <div>Here are the results for the search: {{term}}</div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Search for</span>
+          <amp-autocomplete
+            filter="token-prefix"
+            filter-value="city"
+            min-characters="0"
+          >
+            <input type="search" name="term" required />
+            <script type="application/json">
+              {
+                "items": [
+                  {
+                    "city": "Albany",
+                    "state": "New York",
+                    "areaCode": 518,
+                    "population": 98251
+                  },
+                  {
+                    "city": "Annapolis",
+                    "state": "Maryland",
+                    "areaCode": 410,
+                    "population": 39321
+                  },
+                  {
+                    "city": "Trenton",
+                    "state": "New Jersey",
+                    "areaCode": 609,
+                    "population": 84964
+                  }
+                ]
+              }
+            </script>
+            <template type="amp-mustache" id="amp-template-custom">
+              <div class="city-item" data-value="{{city}}, {{state}}">
+                <div>{{city}}, {{state}}</div>
+                <div class="custom">Population: {{population}}</div>
+              </div>
             </template>
-        </div>
+          </amp-autocomplete>
+        </label>
+        <input type="submit" value="Search" />
+      </fieldset>
+      <div submit-success>
+        <template type="amp-mustache">
+          <div>Here are the results for the search: {{term}}</div>
+        </template>
+      </div>
     </form>
 
     <p>Rich Text, Template Attribute, Default Value Property</p>
-    <form method="post"
-        action-xhr="/form/echo-json/post"
-        target="_blank">
-        <fieldset>
-            <label>
-                <span>Search for</span>
-                <amp-autocomplete filter="token-prefix" min-characters="0"
-                    template="amp-template-default">
-                    <input type="search" name="term" required>
-                    <script type="application/json">
-                        { "items" : [
-                            {
-                                "value" : "Albany, New York",
-                                "areaCode" : 518,
-                                "population" : 98251
-                            }, {
-                                "value" : "Annapolis, Maryland",
-                                "areaCode" : 410,
-                                "population" : 39321
-                            }, {
-                                "value" : "Trenton, New Jersey",
-                                "areaCode" : 609,
-                                "population" : 84964
-                            }
-                        ] }
-                    </script>
-                </amp-autocomplete>
-            </label>
-            <input type="submit" value="Search">
-        </fieldset>
-        <div submit-success>
-            <template type="amp-mustache">
-                <div>Here are the results for the search: {{term}}</div>
-            </template>
-        </div>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          <span>Search for</span>
+          <amp-autocomplete
+            filter="token-prefix"
+            min-characters="0"
+            template="amp-template-default"
+          >
+            <input type="search" name="term" required />
+            <script type="application/json">
+              {
+                "items": [
+                  {
+                    "value": "Albany, New York",
+                    "areaCode": 518,
+                    "population": 98251
+                  },
+                  {
+                    "value": "Annapolis, Maryland",
+                    "areaCode": 410,
+                    "population": 39321
+                  },
+                  {
+                    "value": "Trenton, New Jersey",
+                    "areaCode": 609,
+                    "population": 84964
+                  }
+                ]
+              }
+            </script>
+          </amp-autocomplete>
+        </label>
+        <input type="submit" value="Search" />
+      </fieldset>
+      <div submit-success>
+        <template type="amp-mustache">
+          <div>Here are the results for the search: {{term}}</div>
+        </template>
+      </div>
     </form>
 
     <h2>'Disabled' attribute</h2>
     <form method="post" action-xhr="/form/echo-json/post" target="_blank">
       <amp-autocomplete filter="substring" min-characters="0">
-        <input type="text">
-          <script type="application/json">
-            { "items" : [ { "value" : "apple",
-                            "disabled" : "true" },
-                          { "value" : "orange" },
-                          { "value" : "avocado",
-                            "disabled" : "true" },
-                          { "value" : "banana" } ] }
-          </script>
+        <input type="text" />
+        <script type="application/json">
+          {
+            "items": [
+              {"value": "apple", "disabled": "true"},
+              {"value": "orange"},
+              {"value": "avocado", "disabled": "true"},
+              {"value": "banana"}
+            ]
+          }
+        </script>
         <template type="amp-mustache">
           {{#disabled}}
-            <div data-disabled>
-              {{value}}
-              <span class="out-of-stock">out of stock</span>
-            </div>
-          {{/disabled}}
-          {{^disabled}}
-            <div data-value="{{value}}">
-              {{value}}
-            </div>
-          {{/disabled}}
-        </template> 
-      </amp-autocomplete>
-      <input name="submit-button" type="submit" value="Submit">
-    </form>
-
-  <h2>Fallback</h2>
-  <p>Invalid src path, fallback provided</p>
-  <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-    <fieldset>
-      <label>
-        Your hometown<br>
-        <amp-autocomplete filter="substring" min-characters="0" src="autocomplete-invalid.example.json">
-          <input type="text" name="city" required>
-          <div fallback>
-            Sorry, we couldn't load suggestions.
+          <div data-disabled>
+            {{value}}
+            <span class="out-of-stock">out of stock</span>
           </div>
-        </amp-autocomplete>
-      </label>
-      <input name="submit-button" type="submit" value="Submit">
-    </fieldset>
-
-    <div submit-success>
-      <template type="amp-mustache">
-        Success! Mailing a postcard to {{city}}.
-      </template>
-    </div>
-  </form>
-
-  <p>Failing src path, fallback provided</p>
-  <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-    <fieldset>
-      <label>
-        Your hometown<br>
-        <amp-autocomplete filter="substring" min-characters="0" src="/form/autocomplete/error"
-          [src]="'/form/autocomplete/error?q=' + (queryForFallback || '')">
-          <input type="text" name="city" required on="input-debounced:AMP.setState({ queryForFallback: event.value })">
-          <div fallback>
-            Sorry, we couldn't load suggestions.
+          {{/disabled}} {{^disabled}}
+          <div data-value="{{value}}">
+            {{value}}
           </div>
-        </amp-autocomplete>
-      </label>
-      <input name="submit-button" type="submit" value="Submit">
-    </fieldset>
-
-    <div submit-success>
-      <template type="amp-mustache">
-        Success! Mailing a postcard to {{city}}.
-      </template>
-    </div>
-  </form>
-
-  <p>Invalid src path, no fallback provided</p>
-  <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-    <fieldset>
-      <label>
-        Your hometown<br>
-        <amp-autocomplete filter="substring" min-characters="0" src="autocomplete-invalid.example.json">
-          <input type="text" name="city" required>
-        </amp-autocomplete>
-      </label>
-      <input name="submit-button" type="submit" value="Submit">
-    </fieldset>
-
-    <div submit-success>
-      <template type="amp-mustache">
-        Success! Mailing a postcard to {{city}}.
-      </template>
-    </div>
-  </form>
-
-  <p>Failing src path, no fallback provided</p>
-  <form method="post" action-xhr="/form/echo-json/post" target="_blank">
-    <fieldset>
-      <label>
-        Your hometown<br>
-        <amp-autocomplete filter="substring" min-characters="0" src="/form/autocomplete/error"
-          [src]="'/form/autocomplete/error?q=' + (queryForFallback2 || '')">
-          <input type="text" name="city" required on="input-debounced:AMP.setState({ queryForFallback2: event.value })">
-        </amp-autocomplete>
-      </label>
-      <input name="submit-button" type="submit" value="Submit">
-    </fieldset>
-
-    <div submit-success>
-      <template type="amp-mustache">
-        Success! Mailing a postcard to {{city}}.
-      </template>
-    </div>
-  </form>
-</body>
+          {{/disabled}}
+        </template>
+      </amp-autocomplete>
+      <input name="submit-button" type="submit" value="Submit" />
+    </form>
 
+    <h2>Fallback</h2>
+    <p>Invalid src path, fallback provided</p>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          Your hometown<br />
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="autocomplete-invalid.example.json"
+          >
+            <input type="text" name="city" required />
+            <div fallback>
+              Sorry, we couldn't load suggestions.
+            </div>
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{city}}.
+        </template>
+      </div>
+    </form>
+
+    <p>Failing src path, fallback provided</p>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          Your hometown<br />
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="/form/autocomplete/error"
+            [src]="'/form/autocomplete/error?q=' + (queryForFallback || '')"
+          >
+            <input
+              type="text"
+              name="city"
+              required
+              on="input-debounced:AMP.setState({ queryForFallback: event.value })"
+            />
+            <div fallback>
+              Sorry, we couldn't load suggestions.
+            </div>
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{city}}.
+        </template>
+      </div>
+    </form>
+
+    <p>Invalid src path, no fallback provided</p>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          Your hometown<br />
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="autocomplete-invalid.example.json"
+          >
+            <input type="text" name="city" required />
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{city}}.
+        </template>
+      </div>
+    </form>
+
+    <p>Failing src path, no fallback provided</p>
+    <form method="post" action-xhr="/form/echo-json/post" target="_blank">
+      <fieldset>
+        <label>
+          Your hometown<br />
+          <amp-autocomplete
+            filter="substring"
+            min-characters="0"
+            src="/form/autocomplete/error"
+            [src]="'/form/autocomplete/error?q=' + (queryForFallback2 || '')"
+          >
+            <input
+              type="text"
+              name="city"
+              required
+              on="input-debounced:AMP.setState({ queryForFallback2: event.value })"
+            />
+          </amp-autocomplete>
+        </label>
+        <input name="submit-button" type="submit" value="Submit" />
+      </fieldset>
+
+      <div submit-success>
+        <template type="amp-mustache">
+          Success! Mailing a postcard to {{city}}.
+        </template>
+      </div>
+    </form>
+  </body>
 </html>
diff --git a/examples/bind/basic.amp.html b/examples/bind/basic.amp.html
index 51bb8c98eaf72..6e435e206909f 100644
--- a/examples/bind/basic.amp.html
+++ b/examples/bind/basic.amp.html
@@ -9,7 +9,8 @@
   <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
   <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
-
+  <script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
+  <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js" ></script>
   <style amp-custom>
     .redBackground {
       background-color: red;
@@ -33,10 +34,19 @@ <h2>Basic example</h2>
     <button on="tap:AMP.setState({'foo': 'foo', 'isButtonDisabled': true, 'textClass': 'redBackground', 'imgSrc': 'https://amp.dev/static/samples/img/Shetland_Sheepdog.jpg', 'imgSize': 200, 'imgAlt': 'Sheepdog'})">Click me</button>
   </div>
 
+  <h3>"amp-state:" url example:</h3>
+  <amp-list src="amp-state:myState.animals" layout="fixed-height" height="300px">
+    <template type="amp-mustache">
+      <li style="padding-left: 20px">{{.}}</li>
+    </template>
+  </amp-list>
+
+
   <amp-state id="myState">
     <script type="application/json">
       {
-        "myStateKey1": "myStateValue1"
+        "myStateKey1": "myStateValue1",
+        "animals": { "items": ["okapis", "bears", "pigs"] }
       }
     </script>
   </amp-state>
diff --git a/examples/bind/forms.amp.html b/examples/bind/forms.amp.html
index 63736f1050386..0157cf6158883 100644
--- a/examples/bind/forms.amp.html
+++ b/examples/bind/forms.amp.html
@@ -74,5 +74,26 @@ <h4>Enter your name and email.</h4>
           </template>
       </div>
   </form>
+
+  <h2 class="sample-heading">Form validation with amp-bind input values</h2>
+  <button on="tap:AMP.setState({txt: 'hello'})">
+    set txt
+  </button>
+  <button on="tap:AMP.setState({txt: ''})">
+    clear
+  </button>
+  <form method="post" action-xhr="/form/echo-json/post" target="_blank"
+    custom-validation-reporting="show-all-on-submit">
+    <input type="text" name="name" placeholder="Name..." /><br />
+    <span visible-when-invalid="valueMissing"
+          validation-for="message">MISSING VALUE</span>
+    <textarea id="message" required [text]="txt" name="message"></textarea><br />
+    <input type="submit" value="Submit" />
+    <div submit-success>
+      <template type="amp-mustache">
+          Success! Thanks {{name}} for submitting this message: {{message}}
+      </template>
+  </div>
+  </form>
 </body>
 </html>
diff --git a/examples/date-picker.amp.html b/examples/date-picker.amp.html
index fbc9d1d86777b..2119e4d63daf5 100644
--- a/examples/date-picker.amp.html
+++ b/examples/date-picker.amp.html
@@ -334,7 +334,11 @@ <h3>min</h3>
     min="2018-12-10" [min]="rangeMin" max="2018-12-20" [max]="rangeMax"
 ></amp-date-picker>
 
-
+<h3>hide keyboard shortcuts panel</h3>
+<amp-date-picker
+    mode="static" type="single" layout="fixed-height" height="360"
+    hide-keyboard-shortcuts-panel
+></amp-date-picker>
 <div class="spacer"></div>
 </body>
 </html>
diff --git a/examples/forms.amp.html b/examples/forms.amp.html
index 3354addf7be59..83fcc41800581 100644
--- a/examples/forms.amp.html
+++ b/examples/forms.amp.html
@@ -182,6 +182,17 @@
     </script>
 </amp-analytics>
 
+<h4>Form with textarea</h4>
+<form method="post" action-xhr="/form/echo-json/post" target="_blank">
+  <textarea name="textarea-ctrl-submit">Press Ctrl+Enter to submit this text</textarea><br>
+  <input name="submit-button" type="submit" value="Submit" />
+  <div submit-success>
+    <template type="amp-mustache">
+      Success! {{textarea-ctrl-submit}}
+    </template>
+  </div>
+</form>
+
 <h4>Search (GET non-xhr same origin)</h4>
 <form method="get" action="/form/search-html/get" target="_blank">
     <fieldset>
diff --git a/examples/jwplayer.amp.html b/examples/jwplayer.amp.html
index 24c244013e4b2..0df0f02f85b30 100644
--- a/examples/jwplayer.amp.html
+++ b/examples/jwplayer.amp.html
@@ -36,8 +36,6 @@ <h3>Responsive contextual</h3>
         data-player-id="uoIbMPm3"
         data-media-id="BZ6tc0gy"
         data-content-search="__CONTEXTUAL__"
-        data-content-contextual=true
-        data-content-recency="9D"
         data-content-backfill=true
         layout="responsive" width="480" height="270">
     </amp-jwplayer>
diff --git a/examples/masking.amp.html b/examples/masking.amp.html
index daeac2d0e906a..7657777e13161 100644
--- a/examples/masking.amp.html
+++ b/examples/masking.amp.html
@@ -16,6 +16,50 @@
 </head>
 <body>
   <h1>Input Masking</h1>
+  <h2>Mask with amp-state</h2>
+  <form
+    method="post"
+    action-xhr="/form/echo-json/post"
+    target="_blank"
+    >
+      <label
+        >Masked input:
+        <input
+          [value]="maskedValue"
+          on="change:AMP.setState({maskedValue: event.value})"
+          name="statemask"
+          mask="000-000-000"
+          mask-output="alphanumeric" 
+          placeholder="Type some numbers..."
+      /></label>
+      <input type="submit">
+      <div submit-success>
+        <template type="amp-mustache">
+          {{statemask}}, 
+          {{statemask-unmasked}}
+        </template>
+      </div>
+    </form>
+    <div>
+      <div class="pt-15">
+        <button on="tap:AMP.setState({maskedValue:''})">
+          Reset value with AMP.setState
+        </button>
+      </div>
+      <div class="pt-15">
+        <label
+          ><button on="tap:AMP.setState({maskedValue:maskedValueProxy || ''})">
+            Apply value with AMP.setState
+          </button>
+          <input
+            [value]="maskedValueProxy"
+            on="change:AMP.setState({maskedValueProxy: event.value})"
+            name="maskedValueProxy"
+            mask="000-000-000"
+            placeholder="Type value to be applied..."
+        /></label>
+      </div>
+    </div>
 
   <h2>Named Masks</h2>
   <form method="post"
diff --git a/examples/viewer.html b/examples/viewer.html
index dededf384310d..b62f642109dd1 100644
--- a/examples/viewer.html
+++ b/examples/viewer.html
@@ -178,6 +178,16 @@
       text-decoration: underline;
     }
 
+    viewer[data-show-container="9"] #container9 {
+      visibility: visible;
+      -webkit-transform: none;
+      -ms-transform: none;
+      transform: none;
+    }
+    viewer[data-show-container="9"] #show-container9-anchor {
+      text-decoration: underline;
+    }
+
     viewer[data-show-container="dynamic"] #container-dynamic {
       visibility: visible;
       -webkit-transform: none;
@@ -467,6 +477,8 @@
           return this.ssrRenderAmpListTemplate_(data);
         } else if (ampComponentType == 'amp-form') {
           return this.ssrRenderAmpFormTemplate_(data);
+        } else if (ampComponentType == 'amp-autocomplete') {
+          return this.ssrRenderAmpAutocompleteTemplate_(data);
         } else {
           return Promise.reject({error: 'source amp component is not valid'})
         }
@@ -497,6 +509,27 @@
       });
     };
 
+    // TODO: We mock the template but don't verify the data
+    // that should be used to construct it. The data should be used
+    // and verified to an extent.
+    Viewer.prototype.ssrRenderAmpAutocompleteTemplate_ = function(data) {
+      // Mocked response.
+      return Promise.resolve({
+        "html":
+          "<div class='product' role='option' data-value='Apple'>Apple</div>"
+            + "<div class='product' role='option' data-value='Orange'>Orange</div>"
+            + "<div class='product' role='option' data-value='Pear'>Pear</div>"
+            + "<div class='product' role='option' data-value='Banana'>Banana</div>"
+            + "<div class='product' role='option' data-value='Watermelon'>Watermelon</div>",
+        "body" : "",
+        "init" : {
+          "headers": {
+            "Content-Type": "application/json",
+          }
+        }
+      });
+    };
+
     // TODO(alabiaga): We mock the template but don't verify the data
     // that should be used to construct it. The data should be used
     // and verified to an extent.
@@ -702,6 +735,13 @@
           'xhrInterceptor').start();
       addShowContainer('8');
 
+      new Viewer(
+          'container9',
+          '9',
+          './amp-autocomplete.ssr.html?amp_js_v=0.1',
+          false).start();
+      addShowContainer('9');
+
       if (href) {
         new Viewer(
             'container-dynamic',
@@ -759,6 +799,7 @@ <h1>Viewer</h1>
       <a class="show-container-anchor" id="show-container6-anchor">Six</a>
       <a class="show-container-anchor" id="show-container7-anchor">Seven</a>
       <a class="show-container-anchor" id="show-container8-anchor">Eight</a>
+      <a class="show-container-anchor" id="show-container9-anchor">Nine</a>
       <a class="show-container-anchor" id="show-containerdynamic-anchor" hidden>Dynamic</a>
       <a>|</a>
       <a id="visibilityToggle">Visible</a>
@@ -789,25 +830,30 @@ <h1>Viewer</h1>
       </div>
     </container>
     <container id="container6">
-        <div class="wait">
-          Please wait, the AMP doc will appear here...
-        </div>
+      <div class="wait">
+        Please wait, the AMP doc will appear here...
+      </div>
     </container>
     <container id="container7">
-    <div class="wait">
-      Please wait, the AMP doc will appear here...
-    </div>
+      <div class="wait">
+        Please wait, the AMP doc will appear here...
+      </div>
     </container>
     <container id="container-dynamic">
-    <div class="wait">
-      Please wait, the AMP doc will appear here...
-    </div>
+      <div class="wait">
+        Please wait, the AMP doc will appear here...
+      </div>
     </container>
     <container id="container8">
       <div class="wait">
         Please wait, the AMP doc will appear here...
       </div>
     </container>
+    <container id="container9">
+      <div class="wait">
+        Please wait, the AMP doc will appear here...
+      </div>
+    </container>
   </viewer>
 </body>
 </html>
diff --git a/examples/visual-tests/amp-autocomplete/amp-autocomplete.amp.html b/examples/visual-tests/amp-autocomplete/amp-autocomplete.amp.html
index 6bfb58c27140b..56221d9a443d2 100644
--- a/examples/visual-tests/amp-autocomplete/amp-autocomplete.amp.html
+++ b/examples/visual-tests/amp-autocomplete/amp-autocomplete.amp.html
@@ -54,7 +54,7 @@ <h2>Rich content, remote data</h2>
       filter="prefix" filter-value="countryName" min-characters="0">
       <input type="search" id="input2">
       <template type="amp-mustache">
-        <div value="{{countryName}}">
+        <div data-value="{{countryName}}">
           <h3>{{countryName}} ({{countryCode}})</h3>
           <div class="country-info">
             The population is <b>{{population}}</b>, and the capital is <b>{{capital}}</b>. The local currency is <b>{{currencyCode}}</b>.
@@ -69,5 +69,26 @@ <h3>{{countryName}} ({{countryCode}})</h3>
       </template>
     </div>
   </form>
+
+  <h2>Inline autocomplete</h2>
+  <form
+    id="form2"
+    method="get"
+    action="/form/search-html/get"
+    action-xhr="/form/search-json/get"
+    target="_blank">
+    <amp-autocomplete id="autocompleteInline" inline="@" filter="prefix" min-characters="0">
+      <input type="search" id="inputInline">
+      <script type="application/json">
+        { "items" : ["apple", "banana", "orange"] }
+      </script>
+    </amp-autocomplete>
+    <input type="submit" value="Submit">
+    <div submit-success>
+      <template type="amp-mustache">
+        Success!
+      </template>
+    </div>
+  </form>
 </body>
 </html>
diff --git a/examples/visual-tests/amp-autocomplete/amp-autocomplete.js b/examples/visual-tests/amp-autocomplete/amp-autocomplete.js
index b152ed82b85bc..bf4b567dccf5b 100644
--- a/examples/visual-tests/amp-autocomplete/amp-autocomplete.js
+++ b/examples/visual-tests/amp-autocomplete/amp-autocomplete.js
@@ -15,22 +15,38 @@
  */
 'use strict';
 
-const {verifySelectorsVisible} = require('../../../build-system/tasks/visual-diff/helpers');
+const {
+  verifySelectorsVisible,
+  verifySelectorsInvisible,
+} = require('../../../build-system/tasks/visual-diff/helpers');
 
 module.exports = {
-
   'tap input1 to focus and display results': async (page, name) => {
     await page.tap('input#input1');
-    await verifySelectorsVisible(page, name, ['amp-autocomplete#autocomplete1 > .i-amphtml-autocomplete-results']);
+    await verifySelectorsVisible(page, name, [
+      'amp-autocomplete#autocomplete1 > .i-amphtml-autocomplete-results',
+    ]);
   },
 
   'tap input-rtl to focus and display results': async (page, name) => {
     await page.tap('input#input-rtl');
-    await verifySelectorsVisible(page, name, ['amp-autocomplete#autocomplete-rtl > .i-amphtml-autocomplete-results']);
+    await verifySelectorsVisible(page, name, [
+      'amp-autocomplete#autocomplete-rtl > .i-amphtml-autocomplete-results',
+    ]);
   },
 
   'tap input2 to focus and display results': async (page, name) => {
     await page.tap('input#input2');
-    await verifySelectorsVisible(page, name, ['amp-autocomplete#autocomplete2 > .i-amphtml-autocomplete-results']);
+    await verifySelectorsVisible(page, name, [
+      'amp-autocomplete#autocomplete2 > .i-amphtml-autocomplete-results',
+    ]);
+  },
+
+  'type into inputInline to not display results': async (page, name) => {
+    await page.tap('#inputInline');
+    await page.keyboard.type('hello ');
+    await verifySelectorsInvisible(page, name, [
+      '#autocompleteInline > .i-amphtml-autocomplete-results',
+    ]);
   },
 };
diff --git a/examples/visual-tests/amp-mega-menu/amp-mega-menu.js b/examples/visual-tests/amp-mega-menu/amp-mega-menu.js
index 682f497918197..dbddf41fceb27 100644
--- a/examples/visual-tests/amp-mega-menu/amp-mega-menu.js
+++ b/examples/visual-tests/amp-mega-menu/amp-mega-menu.js
@@ -19,6 +19,7 @@ const {verifySelectorsVisible} = require('../../../build-system/tasks/visual-dif
 
 module.exports = {
   'click menu item one': async (page, name) => {
+    await page.waitFor('amp-mega-menu .i-amphtml-mega-menu-item:first-child .i-amphtml-mega-menu-heading');
     await page.tap('amp-mega-menu .i-amphtml-mega-menu-item:first-child .i-amphtml-mega-menu-heading');
     await page.waitFor(400);
     await verifySelectorsVisible(page, name, [
diff --git a/examples/visual-tests/amp-story/amp-story-quiz-sizing-positioning.html b/examples/visual-tests/amp-story/amp-story-quiz-sizing-positioning.html
new file mode 100644
index 0000000000000..3c9fa43ea3c28
--- /dev/null
+++ b/examples/visual-tests/amp-story/amp-story-quiz-sizing-positioning.html
@@ -0,0 +1,108 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>amp-story-quiz example</title>
+  <link rel="canonical" href="amps.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <style amp-custom>
+    h1 #cat-facts-title {
+      color: white;
+      font-family: Helvetica;
+      text-align: center;
+      font-size: 48px;
+    }
+  </style>
+  <script async custom-element="amp-story"
+        src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+  <amp-story standalone id="cat-facts"
+    title="Cat Facts!"
+    publisher="The AMP Team"
+    publisher-logo-src="./img/AMP-Brand-White-Icon.svg"
+    poster-portrait-src="./img/overview.jpg">
+    <amp-story-page id="quiz-question-3">
+      <amp-story-grid-layer template="fill">
+          <amp-img src="https://i.pinimg.com/originals/8d/b1/e9/8db1e9b7cc3ee52b13cabe3a53c62f05.jpg"
+          width="720" height="1280"
+          layout="responsive">
+      </amp-story-grid-layer>
+      <style>
+        #cat-question-cute {
+          justify-content: flex-end;
+          align-content: flex-end;
+        }
+      </style>
+      <amp-story-grid-layer id='cat-question-cute'>
+        <amp-story-quiz>
+          <h2>Are cats cute?</h2>
+          <option correct>Yes</option>
+          <option>No</option>
+        </amp-story-quiz>
+      </amp-story-grid-layer>
+      <amp-story-page-attachment layout="nodisplay" theme="dark">
+        <h1>Amazing title</h1>
+        <p>Bacon ipsum dolor cat cat cat.</p>
+        <amp-youtube
+            id="myLiveChannel"
+            data-live-channelid="UCB8Kb4pxYzsDsHxzBfnid4Q"
+            width="358"
+            height="204"
+            layout="responsive">
+          <amp-img
+              src="https://i.ytimg.com/vi/Wm1fWz-7nLQ/hqdefault_live.jpg"
+              placeholder
+              layout="fill">
+          </amp-img>
+        </amp-youtube>
+      </amp-story-page-attachment>
+    </amp-story-page>
+    <amp-story-page id="sleepy-cat">
+      <amp-story-grid-layer template="fill">
+          <amp-img src="https://i.pinimg.com/originals/60/3d/be/603dbeae12bb77121f912d48aee8ee4e.jpg"
+          width="720" height="1280"
+          layout="responsive">
+      </amp-story-grid-layer>
+      <amp-story-grid-layer template="vertical">
+        <h1 id="cat-facts-title">Cat Facts!</h1>
+      </amp-story-grid-layer>
+    </amp-story-page>
+    <amp-story-page id="quiz-question-1">
+      <amp-story-grid-layer template="fill">
+          <amp-img src="https://dw5orfsilhv7r.cloudfront.net/wp-content/uploads/2016/03/petandco-wallpapers-cats-phone-01.png"
+          width="720" height="1280"
+          layout="responsive">
+      </amp-story-grid-layer>
+      <amp-story-grid-layer>
+        <amp-story-quiz
+          id='cat-question-appear'>
+          <h1>When did the domestic cat first appear on the scene?</h1>
+          <option>7,000 years ago</option>
+          <option correct>500,000 years ago</option>
+          <option>2 million years ago</option>
+          <option>34 million years ago</option>
+        </amp-story-quiz>
+      </amp-story-grid-layer>
+    </amp-story-page>
+    <amp-story-page id="quiz-question-2">
+        <amp-story-grid-layer template="fill">
+            <amp-img src="https://i.pinimg.com/originals/08/20/d3/0820d30c849627c7939761637ac90219.jpg"
+            width="720" height="1280"
+            layout="responsive">
+        </amp-story-grid-layer>
+        <amp-story-grid-layer>
+          <amp-story-quiz
+            id='cat-question-handedness'>
+            <h2>True or False: Cats can be right-pawed or left-pawed.</h2>
+            <option correct>True</option>
+            <option>False</option>
+            <option>The quick brown fox jumped over the lazy dog lorem ipsum dolor sit amet as d f ghjkl</option>
+          </amp-story-quiz>
+        </amp-story-grid-layer>
+      </amp-story-page>
+  </amp-story>
+</body>
+</html>
diff --git a/examples/visual-tests/amp-story/info-dialog.html b/examples/visual-tests/amp-story/info-dialog.html
index 849ec4c478f48..7efdfdf25412e 100644
--- a/examples/visual-tests/amp-story/info-dialog.html
+++ b/examples/visual-tests/amp-story/info-dialog.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8">
     <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
     <script async custom-element="amp-story"
         src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
     <script async custom-element="amp-video"
@@ -63,20 +64,41 @@
         poster-portrait-src="/examples/visual-tests/picsum.photos/image981_900x1600.jpg"
         poster-landscape-src="/examples/visual-tests/picsum.photos/image981_1600x900.jpg"
         poster-square-src="/examples/visual-tests/picsum.photos/image981_1600x1600.jpg">
+        <amp-analytics id="analytics1">
+            <script type="application/json">
+              {
+                "requests": {
+                  "endpoint": "https://raw.githubusercontent.com/ampproject/amphtml/master/examples/img/ampicon.png",
+                  "base": "${endpoint}?${type|default:foo}&path=${canonicalPath}",
+                  "pageView": "${base}?&index=${storyPageIndex}&count=${storyPageCount}&id=${storyPageId}&muted=${storyIsMuted}&progress=${storyProgress}",
+                  "click": "${base}?&index=${storyPageIndex}&id=${storyPageId}&bookendTargetHref=${storyBookendTargetHref}&bookendCardType=${storyBookendComponentType}&bookendCardPosition=${storyBookendComponentPosition}"
+                },
+                "triggers": {
+                  "trackInfoDialogOpen": {
+                    "on": "story-open",
+                    "tagName": "amp-story-info-dialog",
+                    "request": "base"
+                  },
+                  "trackInfoDialogExit": {
+                    "on": "story-close",
+                    "tagName": "amp-story-info-dialog",
+                    "request": "base"
+                  }
+                }
+              }
+            </script>
+          </amp-analytics>
 
       <amp-story-page id="cover">
         <amp-story-grid-layer template="fill">
-          <amp-video autoplay layout="fill" poster="/examples/visual-tests/picsum.photos/image981_1600x900.jpg">
-          </amp-video>
+          <amp-img layout="fill" src="/examples/visual-tests/picsum.photos/image981_1600x900.jpg">
+          </amp-img>
         </amp-story-grid-layer>
         <amp-story-grid-layer template="vertical">
           <h1 id="hello-world">Hello world!</h1>
         </amp-story-grid-layer>
       </amp-story-page>
 
-      <amp-story-bookend src="bookend.json" layout="nodisplay">
-      </amp-story-bookend>
-
     </amp-story>
   </body>
 
diff --git a/examples/visual-tests/amp-video-docking/amp-video-docking.js b/examples/visual-tests/amp-video-docking/amp-video-docking.js
new file mode 100644
index 0000000000000..d4927ea787d5b
--- /dev/null
+++ b/examples/visual-tests/amp-video-docking/amp-video-docking.js
@@ -0,0 +1,116 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+'use strict';
+
+const {
+  verifySelectorsVisible,
+} = require('../../../build-system/tasks/visual-diff/helpers');
+
+async function scroll(page, _, target = 'bottom') {
+  await page.tap(`#scroll-${target}-button`);
+
+  // Scrolling takes 500ms as defined by the runtime, and leeway.
+  await page.waitFor(700);
+}
+
+async function dock(page, name) {
+  await page.tap('#play-button');
+  await page.waitFor(200); // active playback
+  await scroll(page);
+  await verifySelectorsVisible(page, name, ['.amp-video-docked-shadow']);
+}
+
+async function activateControlsBy(page, name, tapOrHover) {
+  if (tapOrHover == 'hover') {
+    await page.hover('.i-amphtml-video-docked-overlay');
+  } else {
+    await page.tap('.i-amphtml-video-docked-overlay');
+  }
+  await verifySelectorsVisible(page, name, ['.amp-video-docked-controls']);
+}
+
+const testControlsActivatedBy = tapOrHover => ({
+  [`displays dock controls (controls on ${tapOrHover})`]: async (
+    page,
+    name
+  ) => {
+    await dock(page);
+    await activateControlsBy(page, name, tapOrHover);
+  },
+
+  [`toggles controls button into paused (controls on ${tapOrHover})`]: async (
+    page,
+    name
+  ) => {
+    await dock(page, name);
+    await activateControlsBy(page, name, tapOrHover);
+    await page.tap('.amp-video-docked-pause');
+  },
+
+  [`toggles controls button into playing (controls on ${tapOrHover})`]: async (
+    page,
+    name
+  ) => {
+    await dock(page, name);
+    await activateControlsBy(page, name, tapOrHover);
+    await page.tap('.amp-video-docked-pause');
+    await page.tap('.amp-video-docked-play');
+  },
+
+  [`toggles controls button into muted (controls on ${tapOrHover})`]: async (
+    page,
+    name
+  ) => {
+    await dock(page, name);
+    await activateControlsBy(page, name, tapOrHover);
+    await page.tap('.amp-video-docked-mute');
+  },
+
+  [`toggles controls button into unmuted (controls on ${tapOrHover})`]: async (
+    page,
+    name
+  ) => {
+    await dock(page, name);
+    await activateControlsBy(page, name, tapOrHover);
+    await page.tap('.amp-video-docked-mute');
+    await page.tap('.amp-video-docked-unmute');
+  },
+
+  [`displays scrollback button on ad (controls on ${tapOrHover})`]: async (
+    page,
+    name
+  ) => {
+    await dock(page, name);
+    await activateControlsBy(page, name, tapOrHover);
+    await verifySelectorsVisible(page, name, [
+      '.amp-video-docked-control-set-scroll-back',
+    ]);
+  },
+});
+
+module.exports = {
+  "doesn't dock when not playing": scroll,
+
+  'docks when playing': dock,
+
+  'undocks when scrolling back': async (page, name) => {
+    await dock(page, name);
+    await scroll(page, name, 'video');
+  },
+
+  ...testControlsActivatedBy('hover'),
+  ...testControlsActivatedBy('tap'),
+};
diff --git a/examples/visual-tests/amp-video-docking/ltr.html b/examples/visual-tests/amp-video-docking/ltr.html
new file mode 100644
index 0000000000000..d16aa842a9be4
--- /dev/null
+++ b/examples/visual-tests/amp-video-docking/ltr.html
@@ -0,0 +1,51 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>amp-video-docking visual test</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-video-iframe" src="https://cdn.ampproject.org/v0/amp-video-iframe-0.1.js"></script>
+  <script async custom-element="amp-video-docking" src="https://cdn.ampproject.org/v0/amp-video-docking-0.1.js"></script>
+  <style amp-custom>
+    [placeholder],
+    [fallback] {
+      font-size: 4em;
+      padding: 1em;
+    }
+  </style>
+</head>
+<!--
+  This is the same as rtl.html, but WITHOUT body[dir=rtl] so the video will dock
+  from left-to-right.
+-->
+<body>
+  <amp-video-iframe
+    id="video"
+    src="./video-iframe-inner.html"
+    width="400"
+    height="300"
+    layout="responsive"
+    dock
+  >
+    <div placeholder>🖼</div>
+    <div fallback>😵</div>
+  </amp-video-iframe>
+  <button on="tap: video.play" id="play-button">play</button>
+  <button
+    on="tap: bottom.scrollTo(pos='bottom')"
+    id="scroll-bottom-button"
+  >
+    scroll to bottom
+  </button>
+  <button
+    on="tap: video.scrollTo(pos='top')"
+    id="scroll-video-button"
+  >
+    scroll to video
+  </button>
+  <div id="bottom" style="height: 200vh"></div>
+</body>
+</html>
diff --git a/examples/visual-tests/amp-video-docking/rtl.html b/examples/visual-tests/amp-video-docking/rtl.html
new file mode 100644
index 0000000000000..bd26977279519
--- /dev/null
+++ b/examples/visual-tests/amp-video-docking/rtl.html
@@ -0,0 +1,51 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>amp-video-docking visual test</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-video-iframe" src="https://cdn.ampproject.org/v0/amp-video-iframe-0.1.js"></script>
+  <script async custom-element="amp-video-docking" src="https://cdn.ampproject.org/v0/amp-video-docking-0.1.js"></script>
+  <style amp-custom>
+    [placeholder],
+    [fallback] {
+      font-size: 4em;
+      padding: 1em;
+    }
+  </style>
+</head>
+<!--
+  This is the same as ltr.html, but with body[dir=rtl] so the video will dock
+  from right-to-left.
+-->
+<body dir="rtl">
+  <amp-video-iframe
+    id="video"
+    src="./video-iframe-inner.html"
+    width="400"
+    height="300"
+    layout="responsive"
+    dock
+  >
+    <div placeholder>🖼</div>
+    <div fallback>😵</div>
+  </amp-video-iframe>
+  <button on="tap: video.play" id="play-button">play</button>
+  <button
+    on="tap: bottom.scrollTo(pos='bottom')"
+    id="scroll-bottom-button"
+  >
+    scroll to bottom
+  </button>
+  <button
+    on="tap: video.scrollTo(pos='top')"
+    id="scroll-video-button"
+  >
+    scroll to video
+  </button>
+  <div id="bottom" style="height: 200vh"></div>
+</body>
+</html>
diff --git a/examples/visual-tests/amp-video-docking/slot.html b/examples/visual-tests/amp-video-docking/slot.html
new file mode 100644
index 0000000000000..7c7087f6160b7
--- /dev/null
+++ b/examples/visual-tests/amp-video-docking/slot.html
@@ -0,0 +1,71 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>amp-video-docking visual test</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-video-iframe" src="https://cdn.ampproject.org/v0/amp-video-iframe-0.1.js"></script>
+  <script async custom-element="amp-video-docking" src="https://cdn.ampproject.org/v0/amp-video-docking-0.1.js"></script>
+  <style amp-custom>
+    body {
+      padding-top: 40px;
+    }
+    [placeholder],
+    [fallback] {
+      font-size: 4em;
+      padding: 1em;
+    }
+    .fixed {
+      position: fixed;
+      width: 200px;
+      height: 150px;
+      right: 22px;
+      top: 22px;
+      border: 4px dotted tomato;
+      padding: 4px;
+    }
+  </style>
+</head>
+<!--
+  This contains an amp-layout#slot element that the video docks into (see at end
+  of document.)
+-->
+<body>
+  <amp-video-iframe
+    id="video"
+    src="./video-iframe-inner.html"
+    width="400"
+    height="300"
+    layout="responsive"
+    dock="#slot"
+  >
+    <div placeholder>🖼</div>
+    <div fallback>😵</div>
+  </amp-video-iframe>
+  <button on="tap: video.play" id="play-button">play</button>
+  <button
+    on="tap: bottom.scrollTo(pos='bottom')"
+    id="scroll-bottom-button"
+  >
+    scroll to bottom
+  </button>
+  <button
+    on="tap: video.scrollTo(pos='top')"
+    id="scroll-video-button"
+  >
+    scroll to video
+  </button>
+  <div id="bottom" style="height: 200vh"></div>
+  <div class="fixed">
+    <amp-layout
+      layout="responsive"
+      width="400"
+      height="300"
+      id="slot"
+    ></amp-layout>
+  </div>
+</body>
+</html>
diff --git a/examples/visual-tests/amp-video-docking/video-iframe-inner.html b/examples/visual-tests/amp-video-docking/video-iframe-inner.html
new file mode 100644
index 0000000000000..a07db0706ac15
--- /dev/null
+++ b/examples/visual-tests/amp-video-docking/video-iframe-inner.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <script async src="https://cdn.ampproject.org/video-iframe-integration-v0.js"></script>
+</head>
+<body style="background: lightcoral">
+  <script>
+    // Mock video playback without actual video.
+    // https://go.amp.dev/c/amp-video-iframe#custom-integrations
+    (window.AmpVideoIframe = window.AmpVideoIframe || []).push(function(amp) {
+      amp.postEvent('canplay');
+
+      amp.method('play', function() {
+        amp.postEvent('playing');
+
+        setTimeout(function() {
+          amp.postEvent('ad_start');
+        }, 2000);
+      });
+
+      amp.method('pause', function() {
+        amp.postEvent('pause');
+      });
+
+      amp.method('mute', function() {
+        amp.postEvent('muted');
+      });
+
+      amp.method('unmute', function() {
+        amp.postEvent('unmuted');
+      });
+    });
+  </script>
+</body>
+</html>
diff --git a/examples/visual-tests/amphtml-ads/amp-fie-static.html b/examples/visual-tests/amphtml-ads/amp-fie-static.html
new file mode 100644
index 0000000000000..81df44143445e
--- /dev/null
+++ b/examples/visual-tests/amphtml-ads/amp-fie-static.html
@@ -0,0 +1,68 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMPHTML Ad FIE test</title>
+  <link rel="canonical" href="https://amp.dev/documentation/examples/introduction/hello_world/index.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
+</head>
+<body>
+<h1>AMPHTML ad - FIE - amphtml-ads/amp-creative.html</h1>
+<amp-ad width="300" height="250"
+        type="fake"
+        id="i-amphtml-demo-id-1"
+        a4a-conversion="true"
+        disable3pfallback="true"
+        src="/test/fixtures/e2e/amphtml-ads/amp-creative.html">
+  <div placeholder>Loading...</div>
+  <div fallback>Could not display the fake ad :(</div>
+</amp-ad>
+
+<h1>AMPHTML ad - FIE - /amphtml-ads/resource/amp-creative.html</h1>
+<amp-ad width="300" height="250"
+        type="fake"
+        id="i-amphtml-demo-id-2"
+        a4a-conversion="true"
+        disable3pfallback="true"
+        src="/examples/visual-tests/amphtml-ads/resource/amp-ads-fallback.html">
+  <div placeholder>Loading...</div>
+  <div fallback>Could not display the fake ad :(</div>
+</amp-ad>
+
+<h1>AMPHTML ad - FIE - amphtml-ads/carousel-ad.a4a.html</h1>
+<amp-ad width="300" height="250"
+        type="fake"
+        id="i-amphtml-demo-id-3"
+        a4a-conversion="true"
+        disable3pfallback="true"
+        src="/test/fixtures/e2e/amphtml-ads/carousel-ad.a4a.html">
+  <div placeholder>Loading...</div>
+  <div fallback>Could not display the fake ad :(</div>
+</amp-ad>
+
+<h1>AMPHTML ad - FIE - amphtml-ads/lightbox-ad.a4a.html</h1>
+<amp-ad width="300" height="250"
+        type="fake"
+        id="i-amphtml-demo-id-4"
+        a4a-conversion="true"
+        disable3pfallback="true"
+        src="/test/fixtures/e2e/amphtml-ads/lightbox-ad.a4a.html">
+  <div placeholder>Loading...</div>
+  <div fallback>Could not display the fake ad :(</div>
+</amp-ad>
+
+<h1>AMPHTML ad - FIE - amphtml-ads/slides-ad.a4a.html</h1>
+<amp-ad width="300" height="250"
+        type="fake"
+        id="i-amphtml-demo-id-5"
+        a4a-conversion="true"
+        disable3pfallback="true"
+        src="/test/fixtures/e2e/amphtml-ads/slides-ad.a4a.html">
+  <div placeholder>Loading...</div>
+  <div fallback>Could not display the fake ad :(</div>
+</amp-ad>
+</body>
+</html>
diff --git a/examples/visual-tests/iframe-wrapper.html b/examples/visual-tests/iframe-wrapper.html
new file mode 100644
index 0000000000000..a4bbfe4b2f2d0
--- /dev/null
+++ b/examples/visual-tests/iframe-wrapper.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+    <title>Percy iframe wrapper</title>
+    <style>
+      body {
+        margin: 0;
+        padding: 0;
+      }
+      #iframe {
+        border: 0;
+      }
+    </style>
+  </head>
+  <body>
+    <iframe id="iframe"></iframe>
+  </body>
+</html>
diff --git a/extensions/amp-3d-gltf/0.1/amp-3d-gltf.js b/extensions/amp-3d-gltf/0.1/amp-3d-gltf.js
index ed59acb8ac170..5c55d6daeb894 100644
--- a/extensions/amp-3d-gltf/0.1/amp-3d-gltf.js
+++ b/extensions/amp-3d-gltf/0.1/amp-3d-gltf.js
@@ -15,6 +15,7 @@
  */
 import {ActionTrust} from '../../../src/action-constants';
 import {Deferred} from '../../../src/utils/promise';
+import {Services} from '../../../src/services';
 import {assertHttpsUrl, resolveRelativeUrl} from '../../../src/url';
 import {dev, devAssert} from '../../../src/log';
 import {dict} from '../../../src/utils/object';
@@ -58,16 +59,20 @@ export class Amp3dGltf extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    preloadBootstrap(this.win, this.preconnect);
-    this.preconnect.url(
+    const preconnect = Services.preconnectFor(this.win);
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
+    preconnect.url(
+      this.getAmpDoc(),
       'https://cdnjs.cloudflare.com/ajax/libs/three.js/91/three.js',
       opt_onLayout
     );
-    this.preconnect.url(
+    preconnect.url(
+      this.getAmpDoc(),
       'https://cdn.jsdelivr.net/npm/three@0.91/examples/js/loaders/GLTFLoader.js',
       opt_onLayout
     );
-    this.preconnect.url(
+    preconnect.url(
+      this.getAmpDoc(),
       'https://cdn.jsdelivr.net/npm/three@0.91/examples/js/controls/OrbitControls.js',
       opt_onLayout
     );
diff --git a/extensions/amp-3q-player/0.1/amp-3q-player.js b/extensions/amp-3q-player/0.1/amp-3q-player.js
index b393c87459a68..646214bb70718 100644
--- a/extensions/amp-3q-player/0.1/amp-3q-player.js
+++ b/extensions/amp-3q-player/0.1/amp-3q-player.js
@@ -61,7 +61,11 @@ class Amp3QPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://playout.3qsdn.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://playout.3qsdn.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-a4a/0.1/amp-a4a.js b/extensions/amp-a4a/0.1/amp-a4a.js
index eb08dd0feda17..710d3bfe9d870 100644
--- a/extensions/amp-a4a/0.1/amp-a4a.js
+++ b/extensions/amp-a4a/0.1/amp-a4a.js
@@ -498,7 +498,11 @@ export class AmpA4A extends AMP.BaseElement {
     // matches amp-ad loader predicate such that A4A impl does not load.
     if (preconnect) {
       preconnect.forEach(p => {
-        this.preconnect.url(p, /*opt_preloadAs*/ true);
+        Services.preconnectFor(this.win).url(
+          this.getAmpDoc(),
+          p,
+          /*opt_preloadAs*/ true
+        );
       });
     }
   }
@@ -557,9 +561,14 @@ export class AmpA4A extends AMP.BaseElement {
    */
   shouldInitializePromiseChain_() {
     const slotRect = this.getIntersectionElementLayoutBox();
-    if (
+    const fixedSizeZeroHeightOrWidth =
       this.getLayout() != Layout.FLUID &&
-      (slotRect.height == 0 || slotRect.width == 0)
+      (slotRect.height == 0 || slotRect.width == 0);
+    if (
+      fixedSizeZeroHeightOrWidth ||
+      this.element.hasAttribute('hidden') ||
+      // TODO(levitzky): May need additional checks for other display:hidden cases.
+      this.element.classList.contains('i-amphtml-hidden-by-media-query')
     ) {
       dev().fine(
         TAG,
@@ -758,7 +767,8 @@ export class AmpA4A extends AMP.BaseElement {
         if (
           this.experimentalNonAmpCreativeRenderMethod_ == XORIGIN_MODE.NAMEFRAME
         ) {
-          this.preconnect.preload(
+          Services.preconnectFor(this.win).preload(
+            this.getAmpDoc(),
             getDefaultBootstrapBaseUrl(this.win, 'nameframe')
           );
         }
@@ -770,7 +780,10 @@ export class AmpA4A extends AMP.BaseElement {
           safeframeVersionHeader != DEFAULT_SAFEFRAME_VERSION
         ) {
           this.safeframeVersion = safeframeVersionHeader;
-          this.preconnect.preload(this.getSafeframePath());
+          Services.preconnectFor(this.win).preload(
+            this.getAmpDoc(),
+            this.getSafeframePath()
+          );
         }
         // Note: Resolving a .then inside a .then because we need to capture
         // two fields of fetchResponse, one of which is, itself, a promise,
@@ -856,13 +869,15 @@ export class AmpA4A extends AMP.BaseElement {
         );
         // Preload any fonts.
         (creativeMetaDataDef.customStylesheets || []).forEach(font =>
-          this.preconnect.preload(font.href)
+          Services.preconnectFor(this.win).preload(this.getAmpDoc(), font.href)
         );
 
         const urls = Services.urlForDoc(this.element);
         // Preload any AMP images.
         (creativeMetaDataDef.images || []).forEach(
-          image => urls.isSecure(image) && this.preconnect.preload(image)
+          image =>
+            urls.isSecure(image) &&
+            Services.preconnectFor(this.win).preload(this.getAmpDoc(), image)
         );
         return creativeMetaDataDef;
       })
diff --git a/extensions/amp-a4a/0.1/callout-vendors.js b/extensions/amp-a4a/0.1/callout-vendors.js
index fa0e7806b2bd4..5c8d37de3db2f 100644
--- a/extensions/amp-a4a/0.1/callout-vendors.js
+++ b/extensions/amp-a4a/0.1/callout-vendors.js
@@ -50,6 +50,20 @@ const RTC_VENDORS = jsonConfiguration({
   ////////////////////////////////////////////////////////////////////
 
   // Add vendors here
+  ozone: {
+    url:
+      'https://elb.the-ozone-project.com/openrtb2/amp?tag_id=PLACEMENT_ID&gdpr_consent=CONSENT_STRING&ad_unit_code=AD_UNIT_CODE&site_id=SITE_ID&publisher_id=PUBLISHER_ID&custom_data=TGT&pubcid=PUBCID&adcid=ADCID&w=ATTR(width)&h=ATTR(height)&ow=ATTR(data-override-width)&oh=ATTR(data-override-height)&ms=ATTR(data-multi-size)&slot=ATTR(data-slot)&curl=CANONICAL_URL&timeout=TIMEOUT&purl=HREF',
+    macros: [
+      'PLACEMENT_ID',
+      'SITE_ID',
+      'PUBLISHER_ID',
+      'AD_UNIT_CODE',
+      'PUBCID',
+    ],
+    errorReportingUrl:
+      'https://elb.the-ozone-project.com/amp_error?err=ERROR_TYPE&url=HREF',
+    disableKeyAppend: true,
+  },
   medianet: {
     url:
       'https://amprtc.media.net/rtb/getrtc?cid=CID&w=ATTR(width)&h=ATTR(height)&ow=ATTR(data-override-width)&oh=ATTR(data-override-height)&ms=ATTR(data-multi-size)&slot=ATTR(data-slot)&tgt=TGT&curl=CANONICAL_URL&to=TIMEOUT&purl=HREF',
@@ -72,8 +86,8 @@ const RTC_VENDORS = jsonConfiguration({
   },
   indexexchange: {
     url:
-      'https://amp.casalemedia.com/amprtc?v=1&w=ATTR(width)&h=ATTR(height)&ow=ATTR(data-override-width)&oh=ATTR(data-override-height)&ms=ATTR(data-multi-size)&s=SITE_ID&p=CANONICAL_URL',
-    macros: ['SITE_ID'],
+      'https://amp.casalemedia.com/amprtc?v=1&w=ATTR(width)&h=ATTR(height)&ow=ATTR(data-override-width)&oh=ATTR(data-override-height)&ms=ATTR(data-multi-size)&s=SITE_ID&p=CANONICAL_URL&consent_state=CONSENT_STATE&consent_string=CONSENT_STRING',
+    macros: ['SITE_ID', 'CONSENT_STATE', 'CONSENT_STRING'],
     disableKeyAppend: true,
   },
   lotame: {
@@ -155,6 +169,11 @@ const RTC_VENDORS = jsonConfiguration({
     macros: ['TAG_ID'],
     disableKeyAppend: true,
   },
+  prebidflux: {
+    url: 'https://prebid-server.flux-adserver.com/openrtb2/amp?tag_id=TAG_ID',
+    macros: ['TAG_ID'],
+    disableKeyAppend: true,
+  },
 });
 
 // DO NOT MODIFY: Setup for tests
diff --git a/extensions/amp-a4a/0.1/test/test-amp-a4a.js b/extensions/amp-a4a/0.1/test/test-amp-a4a.js
index 2d060b3f04405..57f2d2e93e956 100644
--- a/extensions/amp-a4a/0.1/test/test-amp-a4a.js
+++ b/extensions/amp-a4a/0.1/test/test-amp-a4a.js
@@ -191,7 +191,7 @@ describe('amp-a4a', () => {
    */
   function buildCreativeString(opt_additionalInfo) {
     const baseTestDoc = testFragments.minimalDocOneStyle;
-    const offsets = Object.assign({}, opt_additionalInfo || {});
+    const offsets = {...(opt_additionalInfo || {})};
     offsets.ampRuntimeUtf16CharOffsets = [
       baseTestDoc.indexOf('<style amp4ads-boilerplate'),
       baseTestDoc.lastIndexOf('</script>') + '</script>'.length,
@@ -1400,6 +1400,48 @@ describe('amp-a4a', () => {
       a4a.onLayoutMeasure();
       expect(a4a.adPromise_).to.be.ok;
     });
+    it('does not initialize promise chain when hidden by media query', async () => {
+      const fixture = await createIframePromise();
+      setupForAdTesting(fixture);
+      fetchMock.getOnce(
+        TEST_URL + '&__amp_source_origin=about%3Asrcdoc',
+        () => adResponse,
+        {name: 'ad'}
+      );
+      const {doc} = fixture;
+      const rect = layoutRectLtwh(0, 0, 200, 200);
+      const a4aElement = createA4aElement(doc, rect);
+      a4aElement.classList.add('i-amphtml-hidden-by-media-query');
+      const a4a = new MockA4AImpl(a4aElement);
+      a4a.buildCallback();
+      a4a.onLayoutMeasure();
+      expect(a4a.adPromise_).to.not.be.ok;
+      // test without media query
+      a4aElement.classList.remove('i-amphtml-hidden-by-media-query');
+      a4a.onLayoutMeasure();
+      expect(a4a.adPromise_).to.be.ok;
+    });
+    it('does not initialize promise chain when has attribute "hidden"', async () => {
+      const fixture = await createIframePromise();
+      setupForAdTesting(fixture);
+      fetchMock.getOnce(
+        TEST_URL + '&__amp_source_origin=about%3Asrcdoc',
+        () => adResponse,
+        {name: 'ad'}
+      );
+      const {doc} = fixture;
+      const rect = layoutRectLtwh(0, 0, 200, 200);
+      const a4aElement = createA4aElement(doc, rect);
+      a4aElement.setAttribute('hidden', '');
+      const a4a = new MockA4AImpl(a4aElement);
+      a4a.buildCallback();
+      a4a.onLayoutMeasure();
+      expect(a4a.adPromise_).to.not.be.ok;
+      // test without media query
+      a4aElement.removeAttribute('hidden');
+      a4a.onLayoutMeasure();
+      expect(a4a.adPromise_).to.be.ok;
+    });
 
     /**
      * @param {boolean} isValidCreative
@@ -1875,12 +1917,10 @@ describe('amp-a4a', () => {
         '<script type=application/json amp-ad-metadata>'
       );
       const actual = a4a.getAmpAdMetadata(creative);
-      const expected = Object.assign(
-        {
-          minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
-        },
-        metaData
-      );
+      const expected = {
+        minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
+        ...metaData,
+      };
       expect(actual).to.deep.equal(expected);
     });
     it('should return null if metadata opening tag is (truly) wrong', () => {
@@ -1920,24 +1960,20 @@ describe('amp-a4a', () => {
     it('should not include amp images if not an array', () => {
       metaData.images = 'https://foo.com';
       const actual = a4a.getAmpAdMetadata(buildCreativeString(metaData));
-      const expected = Object.assign(
-        {
-          minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
-        },
-        metaData
-      );
+      const expected = {
+        minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
+        ...metaData,
+      };
       delete expected.images;
       expect(actual).to.deep.equal(expected);
     });
     it('should tolerate missing images', () => {
       delete metaData.images;
       const actual = a4a.getAmpAdMetadata(buildCreativeString(metaData));
-      const expected = Object.assign(
-        {
-          minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
-        },
-        metaData
-      );
+      const expected = {
+        minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
+        ...metaData,
+      };
       delete expected.images;
       expect(actual).to.deep.equal(expected);
     });
@@ -1962,12 +1998,10 @@ describe('amp-a4a', () => {
       metaData.ctaType = '0';
       a4a.isSinglePageStoryAd = true;
       const actual = a4a.getAmpAdMetadata(buildCreativeString(metaData));
-      const expected = Object.assign(
-        {
-          minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
-        },
-        metaData
-      );
+      const expected = {
+        minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
+        ...metaData,
+      };
       delete expected.ctaType;
       expect(actual).to.deep.equal(expected);
       expect(a4a.element.dataset.varsCtatype).to.equal('0');
@@ -1978,12 +2012,10 @@ describe('amp-a4a', () => {
       metaData.ctaUrl = 'http://foo.com';
       a4a.isSinglePageStoryAd = true;
       const actual = a4a.getAmpAdMetadata(buildCreativeString(metaData));
-      const expected = Object.assign(
-        {
-          minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
-        },
-        metaData
-      );
+      const expected = {
+        minifiedCreative: testFragments.minimalDocOneStyleSrcDoc,
+        ...metaData,
+      };
       delete expected.ctaType;
       delete expected.ctaUrl;
       expect(actual).to.deep.equal(expected);
diff --git a/extensions/amp-a4a/0.1/test/test-real-time-config-manager.js b/extensions/amp-a4a/0.1/test/test-real-time-config-manager.js
index d96e9569c7a4b..a55619d5716b7 100644
--- a/extensions/amp-a4a/0.1/test/test-real-time-config-manager.js
+++ b/extensions/amp-a4a/0.1/test/test-real-time-config-manager.js
@@ -787,7 +787,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
     });
 
     it('should not modify rtcConfig if consent state is valid', () => {
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
       rtc.consentState_ = CONSENT_POLICY_STATE.SUFFICIENT;
       rtc.modifyRtcConfigForConsentStateSettings();
       expect(rtc.rtcConfig_).to.deep.equal(expectedRtcConfig);
@@ -795,7 +795,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
 
     it('should clear all callouts if global setting mismatched', () => {
       rtc.rtcConfig_.sendRegardlessOfConsentState = ['INSUFFICIENT'];
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
       expectedRtcConfig.vendors = {};
       expectedRtcConfig.urls = [];
       rtc.consentState_ = CONSENT_POLICY_STATE.UNKNOWN;
@@ -842,7 +842,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
           'macros': {'SLOT_ID': '1'},
         },
       };
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
       expectedRtcConfig.urls = [];
       rtc.consentState_ = CONSENT_POLICY_STATE.UNKNOWN;
       rtc.modifyRtcConfigForConsentStateSettings();
@@ -860,7 +860,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
           'url': 'https://www.other-rtc.com/example2',
         },
       ];
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
       expectedRtcConfig.vendors = {};
       rtc.consentState_ = CONSENT_POLICY_STATE.INSUFFICIENT;
       rtc.modifyRtcConfigForConsentStateSettings();
@@ -886,7 +886,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
         },
         'https://www.other-rtc.com/example2',
       ];
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
       expectedRtcConfig.vendors = {
         'vendorA': {
           'sendRegardlessOfConsentState': true,
@@ -924,7 +924,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
         'https://www.other-rtc.com/example2',
       ];
       rtc.rtcConfig_.sendRegardlessOfConsentState = ['INSUFFICIENT'];
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
       expectedRtcConfig.vendors = {
         'vendorA': {
           'sendRegardlessOfConsentState': true,
@@ -946,7 +946,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
 
     it('should always clear RTC for a new consent state', () => {
       rtc.consentState_ = 'FAKE_NEW_CONSENT_STATE';
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
 
       rtc.modifyRtcConfigForConsentStateSettings();
       expectedRtcConfig.urls = [];
@@ -956,7 +956,7 @@ describes.realWin('real-time-config-manager', {amp: true}, env => {
 
     it('should not clear RTC for a null consent state', () => {
       rtc.consentState_ = null;
-      const expectedRtcConfig = Object.assign({}, rtc.rtcConfig_);
+      const expectedRtcConfig = {...rtc.rtcConfig_};
       rtc.modifyRtcConfigForConsentStateSettings();
       expect(rtc.rtcConfig_).to.deep.equal(expectedRtcConfig);
     });
diff --git a/extensions/amp-a4a/rtc-documentation.md b/extensions/amp-a4a/rtc-documentation.md
index e2fe20220e91c..69230ac7c1acc 100644
--- a/extensions/amp-a4a/rtc-documentation.md
+++ b/extensions/amp-a4a/rtc-documentation.md
@@ -127,9 +127,11 @@ The `errorReportingUrl` property is optional. The only available macros are ERRO
 - APS
 - Automatad
 - Criteo
+- FLUX
 - IndexExchange
 - Lotame
 - Media.net
+- The Ozone Project
 - PubMatic OpenWrap
 - Purch
 - Rubicon
diff --git a/extensions/amp-a4a/rtc-publisher-implementation-guide.md b/extensions/amp-a4a/rtc-publisher-implementation-guide.md
index 51c67c8f384c6..2a53cb0ba643f 100644
--- a/extensions/amp-a4a/rtc-publisher-implementation-guide.md
+++ b/extensions/amp-a4a/rtc-publisher-implementation-guide.md
@@ -23,9 +23,11 @@ To use RTC, you must meet the following requirements:
 - APS
 - Automatad
 - Criteo
+- FLUX
 - IndexExchange
 - Lotame
 - Media.net
+- The Ozone Project
 - PubMatic OpenWrap
 - Purch
 - Rubicon
diff --git a/extensions/amp-access-poool/0.1/poool-impl.js b/extensions/amp-access-poool/0.1/poool-impl.js
index ba756a5f6b132..b38a954a8ff83 100644
--- a/extensions/amp-access-poool/0.1/poool-impl.js
+++ b/extensions/amp-access-poool/0.1/poool-impl.js
@@ -64,6 +64,9 @@ export class PooolVendor {
     /** @private {!../../amp-access/0.1/amp-access-source.AccessSource} */
     this.accessSource_ = accessSource;
 
+    /** @const @private {!../../../src/service/resources-interface.ResourcesInterface} */
+    this.resources_ = Services.resourcesForDoc(this.ampdoc);
+
     /** @private {string} */
     this.accessUrl_ = ACCESS_CONFIG['authorization'];
 
@@ -211,12 +214,22 @@ export class PooolVendor {
     const articlePreview = this.ampdoc
       .getRootNode()
       .querySelector('[poool-access-preview]');
-    articlePreview.setAttribute('amp-access-hide', '');
+
+    if (articlePreview) {
+      this.resources_.mutateElement(articlePreview, () => {
+        articlePreview.setAttribute('amp-access-hide', '');
+      });
+    }
 
     const articleContent = this.ampdoc
       .getRootNode()
       .querySelector('[poool-access-content]');
-    articleContent.removeAttribute('amp-access-hide');
+
+    if (articleContent) {
+      this.resources_.mutateElement(articleContent, () => {
+        articleContent.removeAttribute('amp-access-hide');
+      });
+    }
 
     resetStyles(this.iframe_, ['transform']);
   }
diff --git a/extensions/amp-access/0.1/amp-access.js b/extensions/amp-access/0.1/amp-access.js
index 1381c4ef76048..41560150ac80a 100644
--- a/extensions/amp-access/0.1/amp-access.js
+++ b/extensions/amp-access/0.1/amp-access.js
@@ -92,8 +92,8 @@ export class AccessService {
     /** @private @const {!../../../src/service/template-impl.Templates} */
     this.templates_ = Services.templatesFor(ampdoc.win);
 
-    /** @private @const {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(ampdoc);
+    /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(ampdoc);
 
     /** @private @const {?../../../src/service/performance-impl.Performance} */
     this.performance_ = Services.performanceForOrNull(ampdoc.win);
@@ -476,7 +476,7 @@ export class AccessService {
     if (on == wasOn) {
       return Promise.resolve();
     }
-    return this.resources_.mutateElement(element, () => {
+    return this.mutator_.mutateElement(element, () => {
       if (on) {
         element.removeAttribute('amp-access-hide');
       } else {
diff --git a/extensions/amp-access/0.1/test/test-amp-access-iframe.js b/extensions/amp-access/0.1/test/test-amp-access-iframe.js
index 61684766c4891..dbe011ab1e353 100644
--- a/extensions/amp-access/0.1/test/test-amp-access-iframe.js
+++ b/extensions/amp-access/0.1/test/test-amp-access-iframe.js
@@ -156,12 +156,13 @@ describes.fakeWin(
           expect(sendStub).to.be.calledOnce;
           expect(sendStub).to.be.calledWithExactly('start', {
             'protocol': 'amp-access',
-            'config': Object.assign({}, validConfig, {
+            'config': {
+              ...validConfig,
               'iframeVars': {
                 'VAR1': 'A',
                 'VAR2': 'B',
               },
-            }),
+            },
           });
         });
       });
diff --git a/extensions/amp-access/0.1/test/test-amp-access-source.js b/extensions/amp-access/0.1/test/test-amp-access-source.js
index af3e443524b0c..4b5006b1eb617 100644
--- a/extensions/amp-access/0.1/test/test-amp-access-source.js
+++ b/extensions/amp-access/0.1/test/test-amp-access-source.js
@@ -23,6 +23,7 @@ import {AccessSource} from '../amp-access-source';
 import {AccessVendorAdapter} from '../amp-access-vendor';
 import {cidServiceForDocForTesting} from '../../../../src/service/cid-impl';
 import {installPerformanceService} from '../../../../src/service/performance-impl';
+import {installPlatformService} from '../../../../src/service/platform-impl';
 import {toggleExperiment} from '../../../../src/experiments';
 
 describes.fakeWin(
@@ -45,6 +46,7 @@ describes.fakeWin(
       document = win.document;
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       element = document.createElement('script');
@@ -266,6 +268,7 @@ describes.fakeWin(
       clock.tick(0);
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       const config = {
@@ -385,6 +388,7 @@ describes.fakeWin(
       clock.tick(0);
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       const config = {
diff --git a/extensions/amp-access/0.1/test/test-amp-access.js b/extensions/amp-access/0.1/test/test-amp-access.js
index 8689bf27138c9..29ea90831f1b9 100644
--- a/extensions/amp-access/0.1/test/test-amp-access.js
+++ b/extensions/amp-access/0.1/test/test-amp-access.js
@@ -21,6 +21,7 @@ import {Observable} from '../../../../src/observable';
 import {Services} from '../../../../src/services';
 import {cidServiceForDocForTesting} from '../../../../src/service/cid-impl';
 import {installPerformanceService} from '../../../../src/service/performance-impl';
+import {installPlatformService} from '../../../../src/service/platform-impl';
 import {toggleExperiment} from '../../../../src/experiments';
 
 describes.fakeWin(
@@ -40,6 +41,7 @@ describes.fakeWin(
       document = win.document;
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       element = document.createElement('script');
@@ -275,6 +277,7 @@ describes.fakeWin(
       clock.tick(0);
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       configElement = document.createElement('script');
@@ -321,7 +324,7 @@ describes.fakeWin(
       adapterMock = env.sandbox.mock(adapter);
 
       env.sandbox
-        .stub(service.resources_, 'mutateElement')
+        .stub(service.mutator_, 'mutateElement')
         .callsFake((unusedElement, mutator) => {
           mutator();
           return Promise.resolve();
@@ -564,6 +567,7 @@ describes.fakeWin(
       document = win.document;
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       configElement = document.createElement('script');
@@ -588,7 +592,7 @@ describes.fakeWin(
       service = new AccessService(ampdoc);
 
       mutateElementStub = env.sandbox
-        .stub(service.resources_, 'mutateElement')
+        .stub(service.mutator_, 'mutateElement')
         .callsFake((unusedElement, mutator) => {
           mutator();
           return Promise.resolve();
@@ -724,6 +728,7 @@ describes.fakeWin(
       clock = env.sandbox.useFakeTimers();
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       configElement = document.createElement('script');
@@ -1124,6 +1129,7 @@ describes.fakeWin(
       document = win.document;
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       configElement = document.createElement('script');
@@ -1208,6 +1214,7 @@ describes.fakeWin(
       clock = env.sandbox.useFakeTimers();
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       configElement = document.createElement('script');
@@ -1620,6 +1627,7 @@ describes.fakeWin(
       document = win.document;
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       configElement = document.createElement('script');
@@ -1749,6 +1757,7 @@ describes.fakeWin(
       clock.tick(0);
 
       cidServiceForDocForTesting(ampdoc);
+      installPlatformService(win);
       installPerformanceService(win);
 
       configElement = document.createElement('script');
@@ -1814,7 +1823,7 @@ describes.fakeWin(
       adapterDonutsMock = env.sandbox.mock(adapterDonuts);
 
       env.sandbox
-        .stub(service.resources_, 'mutateElement')
+        .stub(service.mutator_, 'mutateElement')
         .callsFake((unusedElement, mutator) => {
           mutator();
           return Promise.resolve();
diff --git a/extensions/amp-accordion/amp-accordion.md b/extensions/amp-accordion/amp-accordion.md
index 4771f63700dc6..3fee221537834 100644
--- a/extensions/amp-accordion/amp-accordion.md
+++ b/extensions/amp-accordion/amp-accordion.md
@@ -49,6 +49,8 @@ Provides a way for viewers to glance at the content outline and jump to any sect
 
 The `amp-accordion` component allows you to display collapsible and expandable content sections. Each of the `amp-accordion` component’s immediate children is considered a section in the accordion. Each of these nodes must be a `<section>` tag.
 
+[filter formats="websites, ads"]
+
 - An `amp-accordion` can contain one or more `<section>` elements as its direct children.
 - Each `<section>` must contain exactly two direct children.
 - The first child (of the section) represents the heading for the section and must be a heading element (one of `h1`, `h2`, ..., `h6`, `header`).
@@ -56,6 +58,17 @@ The `amp-accordion` component allows you to display collapsible and expandable c
 - Clicking/tapping on the heading of a section expands or collapses the section.
 - The collapsed/expanded state of each section in the `amp-accordion` element will be preserved for the session level. To opt out of preserving this state, add the `disable-session-states` attribute to the `amp-accordion` element.
 
+[/filter] <!-- formats="websites, ads" -->
+[filter formats="email"]
+
+- An `amp-accordion` can contain one or more `<section>` elements as its direct children.
+- Each `<section>` must contain exactly two direct children.
+- The first child (of the section) represents the heading for the section and must be a heading element (one of `h1`, `h2`, ..., `h6`, `header`).
+- The second child (of the section) can be any tag allowed in AMP HTML and represents the content of the section.
+- Clicking/tapping on the heading of a section expands or collapses the section.
+
+[/filter] <!-- formats="email" -->
+
 #### Example: Displaying an accordion
 
 In this example, we display three sections, where the third section is expanded on page load. Also, we opted out of preserving the collapsed/expanded state by setting `disable-session-states`.
@@ -102,6 +115,8 @@ The events below will be triggered on `section`s of `accordion`.
   </tr>
 </table>
 
+[filter formats="websites, stories"]
+
 ### Actions
 
 <table>
@@ -119,30 +134,33 @@ The events below will be triggered on `section`s of `accordion`.
   </tr>
 </table>
 
+[/filter]<!-- formats="websites, stories" -->
+
 #### Attributes
 
-<table>
-  <tr>
-    <td width="40%"><strong><code>animate</code></strong></td>
-    <td>Set this attribute on the <code>&lt;amp-accordion&gt;</code> to animate the expansion / collapse of all accordion sections.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong><code>disable-session-states</code></strong></td>
-    <td>Set this attribute on the <code>&lt;amp-accordion&gt;</code> to opt out of preserving the collapsed/expanded state of the accordion.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong><code>expanded</code></strong></td>
-    <td>Set this attribute on a <code>&lt;section&gt;</code> to display the section as expanded on page load.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong><code>expand-single-section</code></strong></td>
-    <td>Set this attribute on the <code>&lt;amp-accordion&gt;</code> to only allow one <code>&lt;section&gt;</code> to be expanded at a time. If the user focuses on one <code>&lt;section&gt;</code> any other previously expanded <code>&lt;section&gt;</code> will be collapsed.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong><code>[data-expand]</code></strong></td>
-    <td>Bind this attribute on a <code>&lt;section&gt;</code> to expand or collapse the section. An expression that evaluates to <code>false</code> will collapse the section if it is expanded, and anything else will expand the section if it is collapsed.</td>
-  </tr>
-</table>
+##### `animate`
+
+Set this attribute on the `<amp-accordion>` to animate the expansion / collapse of all accordion sections.
+
+[filter formats="websites, stories"]
+
+##### `disable-session-states`
+
+Set this attribute on the `<amp-accordion>` to opt out of preserving the collapsed/expanded state of the accordion.
+
+[/filter]<!-- formats="websites, stories" -->
+
+##### `expanded`
+
+Set this attribute on a `<section>` to display the section as expanded on page load.
+
+##### `expand-single-section`
+
+Set this attribute on the `<amp-accordion>` to only allow one `<section>` to be expanded at a time. If the user focuses on one `<section>` any other previously expanded `<section>` will be collapsed.
+
+##### `[data-expand]`
+
+Bind this attribute on a `<section>` to expand or collapse the section. An expression that evaluates to `false` will collapse the section if it is expanded, and anything else will expand the section if it is collapsed.
 
 ## Styling
 
diff --git a/extensions/amp-action-macro/0.1/amp-action-macro.js b/extensions/amp-action-macro/0.1/amp-action-macro.js
index c6193b8f6ea2a..c48efff7baf28 100644
--- a/extensions/amp-action-macro/0.1/amp-action-macro.js
+++ b/extensions/amp-action-macro/0.1/amp-action-macro.js
@@ -103,6 +103,11 @@ export class AmpActionMacro extends AMP.BaseElement {
     return true;
   }
 
+  /** @override */
+  isLayoutSupported(unusedLayout) {
+    return true;
+  }
+
   /**
    * Checks if the invoking element is defined after the action being invoked.
    * This constraint is to prevent possible recursive calls.
diff --git a/extensions/amp-ad-custom/amp-ad-custom.md b/extensions/amp-ad-custom/amp-ad-custom.md
index 1246b04d4f673..b688f8068866b 100644
--- a/extensions/amp-ad-custom/amp-ad-custom.md
+++ b/extensions/amp-ad-custom/amp-ad-custom.md
@@ -51,11 +51,11 @@ The ad network needs to provide a new serving endpoint that returns a CORS respo
 
 ```js
 {
-  templateUrl: "https://adexample.com/amp_template_1.html"
+  templateUrl: "https://adexample.com/amp_template_1.html",
   data: {
     clickUrl: "https://buy.com/buy-1",
     buttonText: "Buy now"
-  }
+  },
   analytics: {
     type: "googleanalytics",
     config: {
diff --git a/extensions/amp-ad-exit/0.1/amp-ad-exit.js b/extensions/amp-ad-exit/0.1/amp-ad-exit.js
index 9dde83d20eb19..933c73065511a 100644
--- a/extensions/amp-ad-exit/0.1/amp-ad-exit.js
+++ b/extensions/amp-ad-exit/0.1/amp-ad-exit.js
@@ -90,7 +90,9 @@ export class AmpAdExit extends AMP.BaseElement {
   /**
    * @param {!../../../src/service/action-impl.ActionInvocation} invocation
    */
-  exit({args, event}) {
+  exit(invocation) {
+    const {args} = invocation;
+    let {event} = invocation;
     const target = this.targets_[args['target']];
     userAssert(target, `Exit target not found: '${args['target']}'`);
     userAssert(event, 'Unexpected null event');
diff --git a/extensions/amp-ad-exit/0.1/test-e2e/test-amp-ad-exit.js b/extensions/amp-ad-exit/0.1/test-e2e/test-amp-ad-exit.js
index a777f8a31f56f..5c9800df544e8 100644
--- a/extensions/amp-ad-exit/0.1/test-e2e/test-amp-ad-exit.js
+++ b/extensions/amp-ad-exit/0.1/test-e2e/test-amp-ad-exit.js
@@ -24,7 +24,7 @@ describes.endtoend(
   env => {
     let controller;
 
-    beforeEach(async () => {
+    beforeEach(() => {
       controller = env.controller;
     });
 
@@ -91,6 +91,10 @@ describes.endtoend(
       await expect(await controller.getCurrentUrl()).to.match(
         /^http:\/\/localhost:8000\/\?product2&r=0\.\d+$/
       );
+
+      await expect(
+        'http://localhost:8000/amp4test/request-bank/e2e/deposit/tracking'
+      ).to.have.sentCount(1);
     });
   }
 );
diff --git a/extensions/amp-ad-network-adsense-impl/0.1/amp-ad-network-adsense-impl.js b/extensions/amp-ad-network-adsense-impl/0.1/amp-ad-network-adsense-impl.js
index d3849ca4de885..eeec543efc62c 100644
--- a/extensions/amp-ad-network-adsense-impl/0.1/amp-ad-network-adsense-impl.js
+++ b/extensions/amp-ad-network-adsense-impl/0.1/amp-ad-network-adsense-impl.js
@@ -214,25 +214,23 @@ export class AmpAdNetworkAdsenseImpl extends AmpA4A {
    */
   divertExperiments() {
     const experimentInfoMap = /** @type {!Object<string,
-        !../../../src/experiments.ExperimentInfo>} */ (Object.assign(
-      {
-        [FORMAT_EXP]: {
-          isTrafficEligible: () =>
-            !this.responsiveState_ &&
-            Number(this.element.getAttribute('width')) > 0 &&
-            Number(this.element.getAttribute('height')) > 0,
-          branches: ['21062003', '21062004'],
-        },
-        [[FIE_CSS_CLEANUP_EXP.branch]]: {
-          isTrafficEligible: () => true,
-          branches: [
-            [FIE_CSS_CLEANUP_EXP.control],
-            [FIE_CSS_CLEANUP_EXP.experiment],
-          ],
-        },
+        !../../../src/experiments.ExperimentInfo>} */ ({
+      [FORMAT_EXP]: {
+        isTrafficEligible: () =>
+          !this.responsiveState_ &&
+          Number(this.element.getAttribute('width')) > 0 &&
+          Number(this.element.getAttribute('height')) > 0,
+        branches: ['21062003', '21062004'],
+      },
+      [[FIE_CSS_CLEANUP_EXP.branch]]: {
+        isTrafficEligible: () => true,
+        branches: [
+          [FIE_CSS_CLEANUP_EXP.control],
+          [FIE_CSS_CLEANUP_EXP.experiment],
+        ],
       },
-      AMPDOC_FIE_EXPERIMENT_INFO_MAP
-    ));
+      ...AMPDOC_FIE_EXPERIMENT_INFO_MAP,
+    });
     const setExps = randomlySelectUnsetExperiments(this.win, experimentInfoMap);
     Object.keys(setExps).forEach(expName =>
       addExperimentIdToElement(setExps[expName], this.element)
@@ -323,6 +321,7 @@ export class AmpAdNetworkAdsenseImpl extends AmpA4A {
       'bc': global.SVGElement && global.document.createElementNS ? '1' : null,
       'ctypes': this.getCtypes_(),
       'host': this.element.getAttribute('data-ad-host'),
+      'h_ch': this.element.getAttribute('data-ad-host-channel'),
       'hl': this.element.getAttribute('data-language'),
       'to': this.element.getAttribute('data-tag-origin'),
       'pv': sharedStateParams.pv,
@@ -367,14 +366,12 @@ export class AmpAdNetworkAdsenseImpl extends AmpA4A {
         this,
         ADSENSE_BASE_URL,
         startTime,
-        Object.assign(
-          {
-            'adsid': identity.token || null,
-            'jar': identity.jar || null,
-            'pucrd': identity.pucrd || null,
-          },
-          parameters
-        ),
+        {
+          'adsid': identity.token || null,
+          'jar': identity.jar || null,
+          'pucrd': identity.pucrd || null,
+          ...parameters,
+        },
         experimentIds
       );
     });
@@ -537,7 +534,10 @@ export class AmpAdNetworkAdsenseImpl extends AmpA4A {
 
   /** @override */
   getPreconnectUrls() {
-    this.preconnect.preload(getDefaultBootstrapBaseUrl(this.win, 'nameframe'));
+    Services.preconnectFor(this.win).preload(
+      this.getAmpDoc(),
+      getDefaultBootstrapBaseUrl(this.win, 'nameframe')
+    );
     return ['https://googleads.g.doubleclick.net'];
   }
 
@@ -564,7 +564,7 @@ export class AmpAdNetworkAdsenseImpl extends AmpA4A {
           event['source'] == this.iframe.contentWindow
         ) {
           this.renderStarted();
-          this.iframe.setAttribute('visible', '');
+          setStyles(this.iframe, {'visibility': ''});
           this.win.removeEventListener('message', stickyMsgListener);
         }
       };
diff --git a/extensions/amp-ad-network-adsense-impl/0.1/test/test-amp-ad-network-adsense-impl.js b/extensions/amp-ad-network-adsense-impl/0.1/test/test-amp-ad-network-adsense-impl.js
index 82870b95c289f..4d12760abe252 100644
--- a/extensions/amp-ad-network-adsense-impl/0.1/test/test-amp-ad-network-adsense-impl.js
+++ b/extensions/amp-ad-network-adsense-impl/0.1/test/test-amp-ad-network-adsense-impl.js
@@ -30,7 +30,6 @@ import {
   AmpAdXOriginIframeHandler, // eslint-disable-line no-unused-vars
 } from '../../../amp-ad/0.1/amp-ad-xorigin-iframe-handler';
 import {CONSENT_POLICY_STATE} from '../../../../src/consent-state';
-import {Preconnect} from '../../../../src/preconnect';
 import {Services} from '../../../../src/services';
 import {
   addAttributesToElement,
@@ -1236,12 +1235,16 @@ describes.realWin(
 
     describe('#preconnect', () => {
       it('should preload nameframe', () => {
-        const preloadSpy = env.sandbox.spy(Preconnect.prototype, 'preload');
+        const preconnect = Services.preconnectFor(win);
+        env.sandbox.spy(preconnect, 'preload');
         expect(impl.getPreconnectUrls()).to.deep.equal([
           'https://googleads.g.doubleclick.net',
         ]);
-        expect(preloadSpy).to.be.calledOnce;
-        expect(preloadSpy.args[0]).to.match(/nameframe/);
+        expect(preconnect.preload).to.be.calledOnce;
+        expect(preconnect.preload).to.be.calledWithMatch(
+          env.sandbox.match.object,
+          /nameframe/
+        );
       });
     });
 
@@ -1365,18 +1368,13 @@ describes.realWin(
         impl.renderStarted = () => {
           promiseResolver();
         };
-        let key, val;
         impl.iframe = {
           contentWindow: window,
-          setAttribute: (k, v) => {
-            key = k;
-            val = v;
-          },
+          style: {'visibility': 'hidden'},
         };
         win.postMessage('fill_sticky', '*');
         return renderPromise.then(() => {
-          expect(key).to.equal('visible');
-          expect(val).to.equal('');
+          expect(impl.iframe.style['visibility']).to.equal('');
         });
       });
 
diff --git a/extensions/amp-ad-network-doubleclick-impl/0.1/amp-ad-network-doubleclick-impl.js b/extensions/amp-ad-network-doubleclick-impl/0.1/amp-ad-network-doubleclick-impl.js
index 650f35ae51b35..1240d87704761 100644
--- a/extensions/amp-ad-network-doubleclick-impl/0.1/amp-ad-network-doubleclick-impl.js
+++ b/extensions/amp-ad-network-doubleclick-impl/0.1/amp-ad-network-doubleclick-impl.js
@@ -132,12 +132,12 @@ const DOUBLECLICK_SRA_EXP_BRANCHES = {
 };
 
 /** @const {string} */
-const FLEXIBLE_AD_SLOTS_EXP = 'flexAdSlots';
+const ZINDEX_EXP = 'zIndexExp';
 
-/** @const @enum{string} */
-const FLEXIBLE_AD_SLOTS_BRANCHES = {
-  CONTROL: '21063173',
-  EXPERIMENT: '21063174',
+/**@const @enum{string} */
+const ZINDEX_EXP_BRANCHES = {
+  NO_ZINDEX: '21065356',
+  HOLDBACK: '21065357',
 };
 
 /**
@@ -297,14 +297,17 @@ export class AmpAdNetworkDoubleclickImpl extends AmpA4A {
      */
     this.shouldSandbox_ = false;
 
-    /** @private {boolean} */
-    this.sendFlexibleAdSlotParams_ = true;
-
     /**
      * Set after the ad request is built.
      * @private {?FlexibleAdSlotDataTypeDef}
      */
     this.flexibleAdSlotData_ = null;
+
+    /**
+     * If true, will add a z-index to flex ad slots upon expansion.
+     * @private {boolean}
+     */
+    this.inZIndexHoldBack_ = false;
   }
 
   /**
@@ -384,44 +387,38 @@ export class AmpAdNetworkDoubleclickImpl extends AmpA4A {
       }
     }
     const experimentInfoMap = /** @type {!Object<string,
-        !../../../src/experiments.ExperimentInfo>} */ (Object.assign(
-      {
-        // Only select into SRA experiments if SRA not already explicitly
-        // enabled and refresh is not being used by any slot.
-        [DOUBLECLICK_SRA_EXP]: {
-          isTrafficEligible: () =>
-            !forcedExperimentId &&
-            !this.win.document./*OK*/ querySelector(
-              'meta[name=amp-ad-enable-refresh], ' +
-                'amp-ad[type=doubleclick][data-enable-refresh], ' +
-                'meta[name=amp-ad-doubleclick-sra]'
-            ),
-          branches: Object.keys(DOUBLECLICK_SRA_EXP_BRANCHES).map(
-            key => DOUBLECLICK_SRA_EXP_BRANCHES[key]
+        !../../../src/experiments.ExperimentInfo>} */ ({
+      [DOUBLECLICK_SRA_EXP]: {
+        isTrafficEligible: () =>
+          !forcedExperimentId &&
+          !this.win.document./*OK*/ querySelector(
+            'meta[name=amp-ad-enable-refresh], ' +
+              'amp-ad[type=doubleclick][data-enable-refresh], ' +
+              'meta[name=amp-ad-doubleclick-sra]'
           ),
-        },
-        [FLEXIBLE_AD_SLOTS_EXP]: {
-          isTrafficEligible: () => true,
-          branches: Object.values(FLEXIBLE_AD_SLOTS_BRANCHES),
-        },
-        [[FIE_CSS_CLEANUP_EXP.branch]]: {
-          isTrafficEligible: () => true,
-          branches: [
-            [FIE_CSS_CLEANUP_EXP.control],
-            [FIE_CSS_CLEANUP_EXP.experiment],
-          ],
-        },
+        branches: Object.keys(DOUBLECLICK_SRA_EXP_BRANCHES).map(
+          key => DOUBLECLICK_SRA_EXP_BRANCHES[key]
+        ),
+      },
+      [[FIE_CSS_CLEANUP_EXP.branch]]: {
+        isTrafficEligible: () => true,
+        branches: [
+          [FIE_CSS_CLEANUP_EXP.control],
+          [FIE_CSS_CLEANUP_EXP.experiment],
+        ],
+      },
+      [ZINDEX_EXP]: {
+        isTrafficEligible: () => true,
+        branches: Object.values(ZINDEX_EXP_BRANCHES),
       },
-      AMPDOC_FIE_EXPERIMENT_INFO_MAP
-    ));
+      ...AMPDOC_FIE_EXPERIMENT_INFO_MAP,
+    });
     const setExps = this.randomlySelectUnsetExperiments_(experimentInfoMap);
     Object.keys(setExps).forEach(
       expName => setExps[expName] && this.experimentIds.push(setExps[expName])
     );
-    if (
-      setExps[FLEXIBLE_AD_SLOTS_EXP] == FLEXIBLE_AD_SLOTS_BRANCHES.EXPERIMENT
-    ) {
-      this.sendFlexibleAdSlotParams_ = false;
+    if (setExps[ZINDEX_EXP] == ZINDEX_EXP_BRANCHES.HOLDBACK) {
+      this.inZIndexHoldBack_ = true;
     }
   }
 
@@ -544,51 +541,45 @@ export class AmpAdNetworkDoubleclickImpl extends AmpA4A {
     let msz = null;
     let psz = null;
     let fws = null;
-    if (this.sendFlexibleAdSlotParams_) {
-      this.flexibleAdSlotData_ = getFlexibleAdSlotData(
-        this.win,
-        this.element.parentElement
-      );
-      const {fwSignal, slotWidth, parentWidth} = this.flexibleAdSlotData_;
-      // If slotWidth is -1, that means its width must be determined by its
-      // parent container, and so should have the same value as parentWidth.
-      msz = `${slotWidth == -1 ? parentWidth : slotWidth}x-1`;
-      psz = `${parentWidth}x-1`;
-      fws = fwSignal ? fwSignal : '0';
-    }
-    return Object.assign(
-      {
-        'iu': this.element.getAttribute('data-slot'),
-        'co':
-          this.jsonTargeting && this.jsonTargeting['cookieOptOut'] ? '1' : null,
-        'adk': this.adKey,
-        'sz': this.isSinglePageStoryAd ? '1x1' : this.parameterSize,
-        'output': 'html',
-        'impl': 'ifr',
-        'tfcd': tfcd == undefined ? null : tfcd,
-        'adtest': isInManualExperiment(this.element) ? 'on' : null,
-        'ifi': this.ifi_,
-        'rc': this.refreshCount_ || null,
-        'frc': Number(this.fromResumeCallback) || null,
-        'fluid': this.isFluidRequest_ ? 'height' : null,
-        'fsf': this.forceSafeframe ? '1' : null,
-        // Both msz/psz send a height of -1 because height expansion is
-        // disallowed in AMP.
-        'msz': msz,
-        'psz': psz,
-        'fws': fws,
-        'scp': serializeTargeting(
-          (this.jsonTargeting && this.jsonTargeting['targeting']) || null,
-          (this.jsonTargeting && this.jsonTargeting['categoryExclusions']) ||
-            null,
-          null
-        ),
-        'spsa': this.isSinglePageStoryAd
-          ? `${pageLayoutBox.width}x${pageLayoutBox.height}`
-          : null,
-      },
-      googleBlockParameters(this)
+    this.flexibleAdSlotData_ = getFlexibleAdSlotData(
+      this.win,
+      this.element.parentElement
     );
+    const {fwSignal, slotWidth, parentWidth} = this.flexibleAdSlotData_;
+    // If slotWidth is -1, that means its width must be determined by its
+    // parent container, and so should have the same value as parentWidth.
+    msz = `${slotWidth == -1 ? parentWidth : slotWidth}x-1`;
+    psz = `${parentWidth}x-1`;
+    fws = fwSignal ? fwSignal : '0';
+    return {
+      'iu': this.element.getAttribute('data-slot'),
+      'co':
+        this.jsonTargeting && this.jsonTargeting['cookieOptOut'] ? '1' : null,
+      'adk': this.adKey,
+      'sz': this.isSinglePageStoryAd ? '1x1' : this.parameterSize,
+      'output': 'html',
+      'impl': 'ifr',
+      'tfcd': tfcd == undefined ? null : tfcd,
+      'adtest': isInManualExperiment(this.element) ? 'on' : null,
+      'ifi': this.ifi_,
+      'rc': this.refreshCount_ || null,
+      'frc': Number(this.fromResumeCallback) || null,
+      'fluid': this.isFluidRequest_ ? 'height' : null,
+      'fsf': this.forceSafeframe ? '1' : null,
+      'msz': msz,
+      'psz': psz,
+      'fws': fws,
+      'scp': serializeTargeting(
+        (this.jsonTargeting && this.jsonTargeting['targeting']) || null,
+        (this.jsonTargeting && this.jsonTargeting['categoryExclusions']) ||
+          null,
+        null
+      ),
+      'spsa': this.isSinglePageStoryAd
+        ? `${pageLayoutBox.width}x${pageLayoutBox.height}`
+        : null,
+      ...googleBlockParameters(this),
+    };
   }
 
   /**
@@ -1291,7 +1282,9 @@ export class AmpAdNetworkDoubleclickImpl extends AmpA4A {
     const {parentWidth, parentStyle} = this.flexibleAdSlotData_;
     const isRtl = isRTL(this.win.document);
     const dirStr = isRtl ? 'Right' : 'Left';
-    const /** !Object<string, string> */ style = {'z-index': '11'};
+    const /** !Object<string, string> */ style = this.inZIndexHoldBack_
+        ? {'z-index': '11'}
+        : {};
     // Compute offset margins if the slot is not centered by default.
     if (parentStyle.textAlign != 'center') {
       const getMarginStr = marginNum => `${Math.round(marginNum)}px`;
diff --git a/extensions/amp-ad-network-doubleclick-impl/0.1/safeframe-host.js b/extensions/amp-ad-network-doubleclick-impl/0.1/safeframe-host.js
index 55ad564c6eff7..f7ad93f0c54fa 100644
--- a/extensions/amp-ad-network-doubleclick-impl/0.1/safeframe-host.js
+++ b/extensions/amp-ad-network-doubleclick-impl/0.1/safeframe-host.js
@@ -161,10 +161,9 @@ export class SafeframeHostApi {
     this.creativeSize_ = creativeSize;
 
     /** @private {{width:number, height:number}} */
-    this.initialCreativeSize_ = /** @type {{width:number, height:number}} */ (Object.assign(
-      {},
-      creativeSize
-    ));
+    this.initialCreativeSize_ = /** @type {{width:number, height:number}} */ ({
+      ...creativeSize,
+    });
 
     /** @protected {?Promise} */
     this.delay_ = null;
diff --git a/extensions/amp-ad-network-doubleclick-impl/0.1/sra-utils.js b/extensions/amp-ad-network-doubleclick-impl/0.1/sra-utils.js
index 0c63a61a28e54..dc908fc482050 100644
--- a/extensions/amp-ad-network-doubleclick-impl/0.1/sra-utils.js
+++ b/extensions/amp-ad-network-doubleclick-impl/0.1/sra-utils.js
@@ -207,7 +207,7 @@ export function getTargetingAndExclusions(impls) {
     } else {
       // Need to create a copy otherwise later delete operations will modify
       // first slot's targeting.
-      commonKVs = Object.assign({}, impl.jsonTargeting['targeting']);
+      commonKVs = {...impl.jsonTargeting['targeting']};
     }
   }
   let hasScp = false;
diff --git a/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-amp-ad-network-doubleclick-impl.js b/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-amp-ad-network-doubleclick-impl.js
index 9ea2323e71e10..0525f9071ad5b 100644
--- a/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-amp-ad-network-doubleclick-impl.js
+++ b/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-amp-ad-network-doubleclick-impl.js
@@ -376,6 +376,13 @@ describes.realWin('amp-ad-network-doubleclick-impl', realWinConfig, env => {
         margin: '',
         isAlreadyCentered: true,
       },
+      {
+        direction: 'ltr',
+        parentWidth: 300,
+        newWidth: 250,
+        margin: '-25px',
+        inZIndexHoldBack: true,
+      },
     ].forEach((testCase, testNum) => {
       it(`should adjust slot CSS after expanding width #${testNum}`, () => {
         if (testCase.isMultiSizeResponse) {
@@ -408,6 +415,7 @@ describes.realWin('amp-ad-network-doubleclick-impl', realWinConfig, env => {
           },
         };
         impl.win.document.body.dir = testCase.direction;
+        impl.inZIndexHoldBack_ = testCase.inZIndexHoldBack;
         impl.extractSize({
           get(name) {
             switch (name) {
@@ -420,7 +428,7 @@ describes.realWin('amp-ad-network-doubleclick-impl', realWinConfig, env => {
           },
         });
         expect(impl.element.style[`margin${dirStr}`]).to.equal(testCase.margin);
-        if (!testCase.isMultiSizeResponse) {
+        if (!testCase.isMultiSizeResponse && testCase.inZIndexHoldBack) {
           // We use a fixed '11' value for z-index.
           expect(impl.element.style.zIndex).to.equal('11');
         }
@@ -1009,19 +1017,6 @@ describes.realWin('amp-ad-network-doubleclick-impl', realWinConfig, env => {
       });
     });
 
-    it('should not include msz/psz if not in holdback experiment', () => {
-      env.sandbox
-        .stub(impl, 'randomlySelectUnsetExperiments_')
-        .returns({flexAdSlots: '21063174'});
-      impl.setPageLevelExperiments();
-      return impl.getAdUrl().then(url => {
-        expect(url).to.not.match(/(\?|&)msz=/);
-        expect(url).to.not.match(/(\?|&)psz=/);
-        expect(url).to.not.match(/(\?|&)fws=/);
-        expect(url).to.match(/(=|%2C)21063174(%2C|&|$)/);
-      });
-    });
-
     it('should include msz/psz by default', () => {
       return impl.getAdUrl().then(url => {
         expect(url).to.match(/(\?|&)msz=[0-9]+x-1(&|$)/);
diff --git a/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-doubleclick-sra.js b/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-doubleclick-sra.js
index a80dd37f6bb97..a48b89094e943 100644
--- a/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-doubleclick-sra.js
+++ b/extensions/amp-ad-network-doubleclick-impl/0.1/test/test-doubleclick-sra.js
@@ -73,14 +73,12 @@ describes.realWin('Doubleclick SRA', config, env => {
   });
 
   function createAndAppendAdElement(opt_attributes, opt_type, opt_domElement) {
-    const element = createElementWithAttributes(
-      doc,
-      opt_type || 'amp-ad',
-      Object.assign(
-        {type: 'doubleclick', height: 320, width: 50},
-        opt_attributes
-      )
-    );
+    const element = createElementWithAttributes(doc, opt_type || 'amp-ad', {
+      type: 'doubleclick',
+      height: 320,
+      width: 50,
+      ...opt_attributes,
+    });
     (opt_domElement || doc.body).appendChild(element);
     return element;
   }
diff --git a/extensions/amp-ad/0.1/amp-ad-3p-impl.js b/extensions/amp-ad/0.1/amp-ad-3p-impl.js
index 15e6860b9f05c..be1168817df9e 100644
--- a/extensions/amp-ad/0.1/amp-ad-3p-impl.js
+++ b/extensions/amp-ad/0.1/amp-ad-3p-impl.js
@@ -28,6 +28,7 @@ import {
   LayoutPriority,
   isLayoutSizeDefined,
 } from '../../../src/layout';
+import {Services} from '../../../src/services';
 import {adConfig} from '../../../ads/_config';
 import {clamp} from '../../../src/utils/math';
 import {computedStyle, setStyle} from '../../../src/style';
@@ -233,20 +234,26 @@ export class AmpAd3PImpl extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
+    const preconnect = Services.preconnectFor(this.win);
     // We always need the bootstrap.
-    preloadBootstrap(this.win, this.preconnect, this.config.remoteHTMLDisabled);
+    preloadBootstrap(
+      this.win,
+      this.getAmpDoc(),
+      preconnect,
+      this.config.remoteHTMLDisabled
+    );
     if (typeof this.config.prefetch == 'string') {
-      this.preconnect.preload(this.config.prefetch, 'script');
+      preconnect.preload(this.getAmpDoc(), this.config.prefetch, 'script');
     } else if (this.config.prefetch) {
       this.config.prefetch.forEach(p => {
-        this.preconnect.preload(p, 'script');
+        preconnect.preload(this.getAmpDoc(), p, 'script');
       });
     }
     if (typeof this.config.preconnect == 'string') {
-      this.preconnect.url(this.config.preconnect, opt_onLayout);
+      preconnect.url(this.getAmpDoc(), this.config.preconnect, opt_onLayout);
     } else if (this.config.preconnect) {
       this.config.preconnect.forEach(p => {
-        this.preconnect.url(p, opt_onLayout);
+        preconnect.url(this.getAmpDoc(), p, opt_onLayout);
       });
     }
     // If fully qualified src for ad script is specified we preconnect to it.
@@ -254,7 +261,7 @@ export class AmpAd3PImpl extends AMP.BaseElement {
     if (src) {
       // We only preconnect to the src because we cannot know whether the URL
       // will have caching headers set.
-      this.preconnect.url(src);
+      preconnect.url(this.getAmpDoc(), src);
     }
   }
 
diff --git a/extensions/amp-ad/0.1/amp-ad-ui.js b/extensions/amp-ad/0.1/amp-ad-ui.js
index 32ab5f7e19064..24844a8ea30ea 100644
--- a/extensions/amp-ad/0.1/amp-ad-ui.js
+++ b/extensions/amp-ad/0.1/amp-ad-ui.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {ancestorElementsByTag} from '../../../src/dom';
 import {getAdContainer} from '../../../src/ad-helper';
 
@@ -95,9 +96,9 @@ export class AmpAdUIHandler {
     let attemptCollapsePromise;
     if (this.containerElement_) {
       // Collapse the container element if there's one
-      attemptCollapsePromise = this.element_
-        .getResources()
-        .attemptCollapse(this.containerElement_);
+      attemptCollapsePromise = Services.mutatorForDoc(
+        this.element_.getAmpDoc()
+      ).attemptCollapse(this.containerElement_);
       attemptCollapsePromise.then(() => {});
     } else {
       attemptCollapsePromise = this.baseInstance_.attemptCollapse();
diff --git a/extensions/amp-ad/0.1/amp-ad-xorigin-iframe-handler.js b/extensions/amp-ad/0.1/amp-ad-xorigin-iframe-handler.js
index 8ef238c36c904..5ded336d20e3f 100644
--- a/extensions/amp-ad/0.1/amp-ad-xorigin-iframe-handler.js
+++ b/extensions/amp-ad/0.1/amp-ad-xorigin-iframe-handler.js
@@ -285,11 +285,18 @@ export class AmpAdXOriginIframeHandler {
       setStyle(this.iframe, 'visibility', 'hidden');
     }
 
-    Promise.race([
-      renderStartPromise,
-      iframeLoadPromise,
-      timer.promise(VISIBILITY_TIMEOUT),
-    ]).then(() => {
+    // If A4A where creative is responsible for triggering render start (e.g
+    // no fill for sticky ad case), only trigger if renderStart listener promise
+    // explicitly fired (though we do not expect this to occur for A4A).
+    const triggerRenderStartPromise =
+      opt_isA4A && opt_letCreativeTriggerRenderStart
+        ? renderStartPromise
+        : Promise.race([
+            renderStartPromise,
+            iframeLoadPromise,
+            timer.promise(VISIBILITY_TIMEOUT),
+          ]);
+    triggerRenderStartPromise.then(() => {
       // Common signal RENDER_START invoked at toggle visibility time
       // Note: 'render-start' msg and common signal RENDER_START are different
       // 'render-start' msg is a way for implemented Ad to display ad earlier
diff --git a/extensions/amp-ad/0.1/test/test-amp-ad-3p-impl.js b/extensions/amp-ad/0.1/test/test-amp-ad-3p-impl.js
index 2cbf11889f0cd..889dc65d16824 100644
--- a/extensions/amp-ad/0.1/test/test-amp-ad-3p-impl.js
+++ b/extensions/amp-ad/0.1/test/test-amp-ad-3p-impl.js
@@ -70,7 +70,7 @@ describes.realWin(
         registryBackup[k] = adConfig[k];
         delete adConfig[k];
       });
-      adConfig['_ping_'] = Object.assign({}, registryBackup['_ping_']);
+      adConfig['_ping_'] = {...registryBackup['_ping_']};
       win = env.win;
       ad3p = createAmpAd(win);
       win.document.body.appendChild(ad3p.element);
diff --git a/extensions/amp-ad/0.1/test/test-amp-ad-xorigin-iframe-handler.js b/extensions/amp-ad/0.1/test/test-amp-ad-xorigin-iframe-handler.js
index 9b9e0dbcd8026..263f8939f12e6 100644
--- a/extensions/amp-ad/0.1/test/test-amp-ad-xorigin-iframe-handler.js
+++ b/extensions/amp-ad/0.1/test/test-amp-ad-xorigin-iframe-handler.js
@@ -40,6 +40,8 @@ describe('amp-ad-xorigin-iframe-handler', () => {
     ampdoc = ampdocService.getSingleDoc();
     const adElement = document.createElement('container-element');
     adElement.getAmpDoc = () => ampdoc;
+    adElement.togglePlaceholder = () => {};
+    adElement.toggleFallback = () => {};
     adElement.isBuilt = () => {
       return true;
     };
diff --git a/extensions/amp-ad/amp-ad.md b/extensions/amp-ad/amp-ad.md
index 36f67be400ee6..30542beaa31e9 100644
--- a/extensions/amp-ad/amp-ad.md
+++ b/extensions/amp-ad/amp-ad.md
@@ -266,6 +266,7 @@ See [amp-ad rules](https://github.com/ampproject/amphtml/blob/master/extensions/
 - [AdReactor](../../ads/adreactor.md)
 - [AdSense](../../ads/google/adsense.md)
 - [AdSensor](../../ads/adsensor.md)
+- [AdServSolutions](../../ads/adservsolutions.md)
 - [AdsLoom](../../ads/adsloom.md)
 - [AdsNative](../../ads/adsnative.md)
 - [AdSpeed](../../ads/adspeed.md)
@@ -295,6 +296,7 @@ See [amp-ad rules](https://github.com/ampproject/amphtml/blob/master/extensions/
 - [Blade](../../ads/blade.md)
 - [brainy](../../ads/brainy.md)
 - [Broadstreet Ads](../../ads/broadstreetads.md)
+- [ByPlay](../../ads/byplay.md)
 - [CA A.J.A. Infeed](../../ads/caajainfeed.md)
 - [CA-ProFit-X](../../ads/caprofitx.md)
 - [Cedato](../../ads/cedato.md)
@@ -364,6 +366,7 @@ See [amp-ad rules](https://github.com/ampproject/amphtml/blob/master/extensions/
 - [myTarget](../../ads/mytarget.md)
 - [myWidget](../../ads/mywidget.md)
 - [NativeRoll](../../ads/nativeroll.md)
+- [Nativery](../../ads/nativery.md)
 - [Nativo](../../ads/nativo.md)
 - [Navegg](../../ads/navegg.md)
 - [Nend](../../ads/nend.md)
@@ -405,6 +408,7 @@ See [amp-ad rules](https://github.com/ampproject/amphtml/blob/master/extensions/
 - [Sharethrough](../../ads/sharethrough.md)
 - [SHE Media](../../ads/shemedia.md)
 - [Sklik](../../ads/sklik.md)
+- [SSP](../../ads/ssp.md)
 - [SlimCut Media](../../ads/slimcutmedia.md)
 - [Smart AdServer](../../ads/smartadserver.md)
 - [smartclip](../../ads/smartclip.md)
@@ -415,6 +419,7 @@ See [amp-ad rules](https://github.com/ampproject/amphtml/blob/master/extensions/
 - [Speakol](../../ads/speakol.md)
 - [SpotX](../../ads/spotx.md)
 - [SpringAds](../../ads/springAds.md)
+- [Sulvo](../../ads/sulvo.md)
 - [SunMedia](../../ads/sunmedia.md)
 - [Swoop](../../ads/swoop.md)
 - [TcsEmotion](../../ads/tcsemotion.md)
diff --git a/extensions/amp-addthis/0.1/addthis-utils/eng.js b/extensions/amp-addthis/0.1/addthis-utils/eng.js
index c3cf58da03ca6..5d7885483e4e0 100644
--- a/extensions/amp-addthis/0.1/addthis-utils/eng.js
+++ b/extensions/amp-addthis/0.1/addthis-utils/eng.js
@@ -26,7 +26,8 @@ import {pixelDrop} from './pixel';
  * @param {{monitors: *, loc: Location, ampDoc: !../../../../src/service/ampdoc-impl.AmpDoc, pubId: string}} params
  * @return {{al: (string|undefined), amp: number, dc: number, dp: string, dt: string, fp: string, ict: string, ivh: number, pct: number, pfm: number, ph: number, pub: string, sh: number, sid: string}}
  */
-const getEngData = ({monitors, loc, ampDoc, pubId}) => {
+const getEngData = params => {
+  const {monitors, loc, ampDoc, pubId} = params;
   const {
     dwellMonitor,
     scrollMonitor,
diff --git a/extensions/amp-addthis/0.1/addthis-utils/lojson.js b/extensions/amp-addthis/0.1/addthis-utils/lojson.js
index 38508828b0a24..477ca727e8e83 100644
--- a/extensions/amp-addthis/0.1/addthis-utils/lojson.js
+++ b/extensions/amp-addthis/0.1/addthis-utils/lojson.js
@@ -72,10 +72,11 @@ let LojsonDataDef;
 let AtConfigDef;
 
 /**
- * @param {!LojsonDataDef} param1
+ * @param {!LojsonDataDef} jsonData
  * @return {!JsonObject}
  */
-export function getLojsonData({loc, title, pubId, atConfig, referrer, ampDoc}) {
+export function getLojsonData(jsonData) {
+  const {loc, title, pubId, atConfig, referrer, ampDoc} = jsonData;
   const {href, hostname, host, search, pathname, hash, protocol, port} = loc;
   const pageInfo = {
     du: href.split('#').shift(),
diff --git a/extensions/amp-addthis/0.1/addthis-utils/mode.js b/extensions/amp-addthis/0.1/addthis-utils/mode.js
index 84d8b33f28d55..d96104014052a 100644
--- a/extensions/amp-addthis/0.1/addthis-utils/mode.js
+++ b/extensions/amp-addthis/0.1/addthis-utils/mode.js
@@ -42,14 +42,15 @@ export function getAddThisMode(_) {
 }
 
 /**
- * @param {{pubId: string, widgetId: string, productCode: string}} _
+ * @param {{pubId: string, widgetId: string, productCode: string}} mode
  * @return {{
- * hasPubId:boolean,
- * hasWidgetId:boolean,
- * hasProductCode:boolean
+ *   hasPubId: boolean,
+ *   hasWidgetId: boolean,
+ *   hasProductCode: boolean
  * }}
  */
-export function getAddThisModeObject({pubId, widgetId, productCode}) {
+export function getAddThisModeObject(mode) {
+  const {pubId, widgetId, productCode} = mode;
   const hasPubId = isPubId(pubId);
   // widget ids are 4-character strings with lower-case letters and numbers only
   const hasWidgetId = isWidgetId(widgetId);
diff --git a/extensions/amp-addthis/0.1/addthis-utils/pixel.js b/extensions/amp-addthis/0.1/addthis-utils/pixel.js
index cbe86c4ea1091..f66b2f0d42e9a 100644
--- a/extensions/amp-addthis/0.1/addthis-utils/pixel.js
+++ b/extensions/amp-addthis/0.1/addthis-utils/pixel.js
@@ -40,9 +40,10 @@ const groupPixelsByTime = pixelList => {
   // Clean delay value; if it's empty/doesn't exist, default to [0]
   const cleanedPixels = pixelList.map(pixel => {
     const {delay} = pixel;
-    return Object.assign({}, pixel, {
+    return {
+      ...pixel,
       delay: Array.isArray(delay) && delay.length ? delay : [0],
-    });
+    };
   });
 
   const delayMap = cleanedPixels
@@ -54,7 +55,8 @@ const groupPixelsByTime = pixelList => {
       }));
     })
     .reduce((a, b) => a.concat(b), []) // flatten
-    .reduce((currentDelayMap, {delay, pixels}) => {
+    .reduce((currentDelayMap, curDelay) => {
+      const {delay, pixels} = curDelay;
       if (!currentDelayMap[delay]) {
         currentDelayMap[delay] = [];
       }
@@ -87,7 +89,8 @@ const getIframeName = url =>
     .host.split('.')
     .concat(pixelatorFrameTitle.toLowerCase().replace(/\s/, '_'));
 
-const iframeDrop = (url, ampDoc, {name, title}) => {
+const iframeDrop = (url, ampDoc, data) => {
+  const {name, title} = data;
   const doc = ampDoc.win.document;
   const iframe = createElementWithAttributes(
     doc,
@@ -127,19 +130,14 @@ const dropPixelatorPixel = (url, ampDoc) => {
 
 /**
  * Requests groups of pixels at specified delays
- * @param  {Array<{
- * delay: number,
- * id: string,
- * url: string
- * }>} pixels
- * @param  {{
- * sid: string,
- * ampDoc: *
- * }} options
+ * @param  {Array<{delay: number, id: string,url: string}>} pixels
+ * @param  {{sid: string, ampDoc: *}} options
  */
-const dropPixelGroups = (pixels, {sid, ampDoc}) => {
+const dropPixelGroups = (pixels, options) => {
+  const {sid, ampDoc} = options;
   const pixelGroups = groupPixelsByTime(pixels);
-  pixelGroups.forEach(({delay, pixels}) => {
+  pixelGroups.forEach(pixelGroup => {
+    const {delay, pixels} = pixelGroup;
     setTimeout(() => {
       const pids = pixels.map(pixel => {
         dropPixelatorPixel(pixel.url, ampDoc);
diff --git a/extensions/amp-addthis/0.1/addthis-utils/pjson.js b/extensions/amp-addthis/0.1/addthis-utils/pjson.js
index 3d9c34ce60d8b..f4f6e428cbe8f 100644
--- a/extensions/amp-addthis/0.1/addthis-utils/pjson.js
+++ b/extensions/amp-addthis/0.1/addthis-utils/pjson.js
@@ -27,19 +27,17 @@ const SHARE = 300;
 
 /**
  * @param {{
- * loc:Location,
- * referrer:string,
- * title:string,
- * ampDoc: *,
- * pubId:string,
- * data: {
- *   url: string,
- *   service: string
- * }
+ *   loc:Location,
+ *   referrer:string,
+ *   title:string,
+ *   ampDoc: *,
+ *   pubId:string,
+ *   data: {url: string, service: string}
  * }} pjson
  * @return {{amp: number, cb: number, dc: number, dest: *, gen: number, mk: string, pub: *, rb: number, sid, url}}
  */
-const getPjsonData = ({loc, referrer, title, ampDoc, pubId, data}) => {
+const getPjsonData = pjson => {
+  const {loc, referrer, title, ampDoc, pubId, data} = pjson;
   const {href, hostname, search, pathname, hash, protocol, port} = loc;
   /** @typedef {{
    * du: string,
diff --git a/extensions/amp-addthis/0.1/amp-addthis.js b/extensions/amp-addthis/0.1/amp-addthis.js
index f433dbb964455..36a5f947840ff 100644
--- a/extensions/amp-addthis/0.1/amp-addthis.js
+++ b/extensions/amp-addthis/0.1/amp-addthis.js
@@ -245,13 +245,15 @@ class AmpAddThis extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url(ORIGIN, opt_onLayout);
-    this.preconnect.url(API_SERVER, opt_onLayout);
-    this.preconnect.url(COOKIELESS_API_SERVER, opt_onLayout);
-    this.preconnect.url(SHARECOUNTER_SERVER, opt_onLayout);
+    const preconnect = Services.preconnectFor(this.win);
+    const ampdoc = this.getAmpDoc();
+    preconnect.url(ampdoc, ORIGIN, opt_onLayout);
+    preconnect.url(ampdoc, API_SERVER, opt_onLayout);
+    preconnect.url(ampdoc, COOKIELESS_API_SERVER, opt_onLayout);
+    preconnect.url(ampdoc, SHARECOUNTER_SERVER, opt_onLayout);
     // Images, etc.:
-    this.preconnect.url('https://cache.addthiscdn.com', opt_onLayout);
-    this.preconnect.url('https://su.addthis.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://cache.addthiscdn.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://su.addthis.com', opt_onLayout);
   }
 
   /** @override */
@@ -407,7 +409,8 @@ class AmpAddThis extends AMP.BaseElement {
    * @param {*} [input.pubId]
    * @memberof AmpAddThis
    */
-  setupListeners_({ampDoc, loc, pubId}) {
+  setupListeners_(input) {
+    const {ampDoc, loc, pubId} = input;
     // Send "engagement" analytics on page hide.
     listen(ampDoc.win, 'pagehide', () =>
       callEng({
diff --git a/extensions/amp-addthis/0.1/config-manager.js b/extensions/amp-addthis/0.1/config-manager.js
index d42ce5a4cd483..a7f0f0adc47c9 100644
--- a/extensions/amp-addthis/0.1/config-manager.js
+++ b/extensions/amp-addthis/0.1/config-manager.js
@@ -121,15 +121,16 @@ export class ConfigManager {
    * @param {string} [input.containerClassName]
    * @private
    */
-  sendConfiguration_({
-    iframe,
-    widgetId,
-    pubId,
-    shareConfig,
-    atConfig,
-    productCode,
-    containerClassName,
-  }) {
+  sendConfiguration_(input) {
+    const {
+      iframe,
+      widgetId,
+      pubId,
+      shareConfig,
+      atConfig,
+      productCode,
+      containerClassName,
+    } = input;
     const pubData = this.dataForPubId_[pubId];
     const {
       config: dashboardConfig,
@@ -192,28 +193,29 @@ export class ConfigManager {
    * Register relevant data with the configuration manager and prepare
    * request/response cycle between frames.
    * @param {{
-   * pubId: string,
-   * activeToolsMonitor: Object<string,string>,
-   * atConfig: Object<string,string>,
-   * widgetId: string,
-   * containerClassName: string,
-   * productCode: string,
-   * iframe: !Element,
-   * iframeLoadPromise: !Promise,
-   * shareConfig: (JsonObject|undefined)
-   * }} _
+   *   pubId: string,
+   *   activeToolsMonitor: Object<string,string>,
+   *   atConfig: Object<string,string>,
+   *   widgetId: string,
+   *   containerClassName: string,
+   *   productCode: string,
+   *   iframe: !Element,
+   *   iframeLoadPromise: !Promise,
+   *   shareConfig: (JsonObject|undefined)
+   * }} config
    */
-  register({
-    pubId,
-    widgetId,
-    productCode,
-    containerClassName,
-    iframe,
-    iframeLoadPromise,
-    shareConfig,
-    atConfig,
-    activeToolsMonitor,
-  }) {
+  register(config) {
+    const {
+      pubId,
+      widgetId,
+      productCode,
+      containerClassName,
+      iframe,
+      iframeLoadPromise,
+      shareConfig,
+      atConfig,
+      activeToolsMonitor,
+    } = config;
     if (!this.activeToolsMonitor_) {
       this.activeToolsMonitor_ = activeToolsMonitor;
     }
@@ -258,7 +260,8 @@ export class ConfigManager {
    * Relinquish as many element references as possible.
    * @param {{pubId:string, iframe:Element}} param
    */
-  unregister({pubId, iframe}) {
+  unregister(param) {
+    const {pubId, iframe} = param;
     this.configProviderIframes_ = this.configProviderIframes_.filter(
       providerFrame => providerFrame !== iframe
     );
diff --git a/extensions/amp-addthis/0.1/post-message-dispatcher.js b/extensions/amp-addthis/0.1/post-message-dispatcher.js
index 121ea97dd9feb..f073724738af8 100644
--- a/extensions/amp-addthis/0.1/post-message-dispatcher.js
+++ b/extensions/amp-addthis/0.1/post-message-dispatcher.js
@@ -89,9 +89,10 @@ export class PostMessageDispatcher {
       case CONFIGURATION_EVENT: {
         this.emit_(
           CONFIGURATION_EVENT,
-          /** @type {!JsonObject} */ (Object.assign({}, data, {
+          /** @type {!JsonObject} */ ({
+            ...data,
             'source': event.source,
-          }))
+          })
         );
         break;
       }
diff --git a/extensions/amp-addthis/0.1/test/test-amp-addthis.js b/extensions/amp-addthis/0.1/test/test-amp-addthis.js
index eb01fc7bb39f6..9a4e0b63b81e4 100644
--- a/extensions/amp-addthis/0.1/test/test-amp-addthis.js
+++ b/extensions/amp-addthis/0.1/test/test-amp-addthis.js
@@ -591,7 +591,7 @@ describes.realWin(
     });
 
     it('getSessionId: returns a string of 16 characters containing 0-9 a-f', () => {
-      expect(typeof getSessionId() === 'string').to.equal(true);
+      expect(typeof getSessionId()).to.equal('string');
       expect(getSessionId().length).to.equal(16);
       expect(/^[0-9a-f]{16}$/.test(getSessionId())).to.equal(true);
 
@@ -602,7 +602,7 @@ describes.realWin(
     });
 
     it('createCUID: returns a string of 16 characters containing 0-9 a-f', () => {
-      expect(typeof createCUID() === 'string').to.equal(true);
+      expect(typeof createCUID()).to.equal('string');
 
       const a = createCUID();
       const b = createCUID();
diff --git a/extensions/amp-analytics/0.1/activity-impl.js b/extensions/amp-analytics/0.1/activity-impl.js
index ddc0dc2480dc2..3d5ae89b76f78 100644
--- a/extensions/amp-analytics/0.1/activity-impl.js
+++ b/extensions/amp-analytics/0.1/activity-impl.js
@@ -83,17 +83,16 @@ class ActivityHistory {
    * @param {ActivityEventDef} activityEvent
    */
   push(activityEvent) {
-    if (!this.prevActivityEvent_) {
-      this.prevActivityEvent_ = activityEvent;
-    }
-
-    if (this.prevActivityEvent_.time < activityEvent.time) {
+    if (
+      this.prevActivityEvent_ &&
+      this.prevActivityEvent_.time < activityEvent.time
+    ) {
       this.totalEngagedTime_ += findEngagedTimeBetween(
         this.prevActivityEvent_,
         activityEvent.time
       );
-      this.prevActivityEvent_ = activityEvent;
     }
+    this.prevActivityEvent_ = activityEvent;
   }
 
   /**
@@ -126,6 +125,13 @@ const ACTIVE_EVENT_TYPES = [
   'keydown',
   'keyup',
 ];
+/**
+ * Array of event types which will be listened for on the document to indicate
+ * leave from document. Other activities are also observed on the AmpDoc and Viewport
+ * objects. See {@link setUpActivityListeners_} for listener implementation.
+ * @private @const {Array<string>}
+ */
+const INACTIVE_EVENT_TYPES = ['mouseleave'];
 
 /**
  * @param {!../../../src/service/ampdoc-impl.AmpDoc} ampDoc
@@ -164,6 +170,9 @@ export class Activity {
     /** @private @const {function()} */
     this.boundHandleActivity_ = this.handleActivity_.bind(this);
 
+    /** @private @const {function()} */
+    this.boundHandleInactive_ = this.handleInactive_.bind(this);
+
     /** @private @const {function()} */
     this.boundHandleVisibilityChange_ = this.handleVisibilityChange_.bind(this);
 
@@ -228,15 +237,17 @@ export class Activity {
 
   /** @private */
   setUpActivityListeners_() {
-    for (let i = 0; i < ACTIVE_EVENT_TYPES.length; i++) {
-      this.unlistenFuncs_.push(
-        listen(
-          this.ampdoc.getRootNode(),
-          ACTIVE_EVENT_TYPES[i],
-          this.boundHandleActivity_
-        )
-      );
-    }
+    this.setUpListenersFromArray_(
+      this.ampdoc.getRootNode(),
+      ACTIVE_EVENT_TYPES,
+      this.boundHandleActivity_
+    );
+
+    this.setUpListenersFromArray_(
+      this.ampdoc.getRootNode(),
+      INACTIVE_EVENT_TYPES,
+      this.boundHandleInactive_
+    );
 
     this.unlistenFuncs_.push(
       this.ampdoc.onVisibilityChanged(this.boundHandleVisibilityChange_)
@@ -248,6 +259,18 @@ export class Activity {
     this.viewport_.onScroll(this.boundHandleActivity_);
   }
 
+  /**
+   *  @private
+   *  @param {!EventTarget} target
+   *  @param {Array<string>} events
+   *  @param {function()} listener
+   */
+  setUpListenersFromArray_(target, events, listener) {
+    for (let i = 0; i < events.length; i++) {
+      this.unlistenFuncs_.push(listen(target, events[i], listener));
+    }
+  }
+
   /** @private */
   handleActivity_() {
     if (this.ignoreActivity_) {
diff --git a/extensions/amp-analytics/0.1/amp-analytics.js b/extensions/amp-analytics/0.1/amp-analytics.js
index c911ab400bbfe..2f286d51f0ac2 100644
--- a/extensions/amp-analytics/0.1/amp-analytics.js
+++ b/extensions/amp-analytics/0.1/amp-analytics.js
@@ -175,10 +175,7 @@ export class AmpAnalytics extends AMP.BaseElement {
   resumeCallback() {
     if (this.iniPromise_) {
       this.iniPromise_.then(() => {
-        this.transport_.maybeInitIframeTransport(
-          this.getAmpDoc().win,
-          this.element
-        );
+        this.transport_.maybeInitIframeTransport(this.element);
       });
     }
   }
@@ -294,11 +291,7 @@ export class AmpAnalytics extends AMP.BaseElement {
       this.element
     );
 
-    this.transport_.maybeInitIframeTransport(
-      this.getAmpDoc().win,
-      this.element,
-      this.preconnect
-    );
+    this.transport_.maybeInitIframeTransport(this.element);
 
     const promises = [];
     // Trigger callback can be synchronous. Do the registration at the end.
@@ -392,7 +385,11 @@ export class AmpAnalytics extends AMP.BaseElement {
    * @visibleForTesting
    */
   preload(url, opt_preloadAs) {
-    this.preconnect.preload(url, opt_preloadAs);
+    Services.preconnectFor(this.win).preload(
+      this.getAmpDoc(),
+      url,
+      opt_preloadAs
+    );
   }
 
   /**
@@ -540,7 +537,7 @@ export class AmpAnalytics extends AMP.BaseElement {
           requests[k] = new RequestHandler(
             this.element,
             request,
-            this.preconnect,
+            Services.preconnectFor(this.win),
             this.transport_,
             this.isSandbox_
           );
diff --git a/extensions/amp-analytics/0.1/analytics-root.js b/extensions/amp-analytics/0.1/analytics-root.js
index 82bc3ae5f559b..1f13dbc7c6e75 100644
--- a/extensions/amp-analytics/0.1/analytics-root.js
+++ b/extensions/amp-analytics/0.1/analytics-root.js
@@ -185,7 +185,7 @@ export class AnalyticsRoot {
    * Returns the tracker for the specified name and list of allowed types.
    *
    * @param {string} name
-   * @param {!Object<string, function(new:./events.EventTracker)>} whitelist
+   * @param {!Object<string, typeof ./events.EventTracker>} whitelist
    * @return {?./events.EventTracker}
    */
   getTrackerForWhitelist(name, whitelist) {
@@ -201,7 +201,7 @@ export class AnalyticsRoot {
    * has not been requested before, it will be created.
    *
    * @param {string} name
-   * @param {function(new:./events.CustomEventTracker, !AnalyticsRoot)|function(new:./events.ClickEventTracker, !AnalyticsRoot)|function(new:./events.ScrollEventTracker, !AnalyticsRoot)|function(new:./events.SignalTracker, !AnalyticsRoot)|function(new:./events.IniLoadTracker, !AnalyticsRoot)|function(new:./events.VideoEventTracker, !AnalyticsRoot)|function(new:./events.VideoEventTracker, !AnalyticsRoot)|function(new:./events.VisibilityTracker, !AnalyticsRoot)|function(new:./events.AmpStoryEventTracker, !AnalyticsRoot)} klass
+   * @param {typeof ./events.CustomEventTracker|typeof ./events.ClickEventTracker|typeof ./events.ScrollEventTracker|typeof ./events.SignalTracker|typeof ./events.IniLoadTracker|typeof ./events.VideoEventTracker|typeof ./events.VideoEventTracker|typeof ./events.VisibilityTracker|typeof ./events.AmpStoryEventTracker} klass
    * @return {!./events.EventTracker}
    */
   getTracker(name, klass) {
diff --git a/extensions/amp-analytics/0.1/events.js b/extensions/amp-analytics/0.1/events.js
index 12dd05ee387e2..4a3702730c1d3 100644
--- a/extensions/amp-analytics/0.1/events.js
+++ b/extensions/amp-analytics/0.1/events.js
@@ -63,7 +63,7 @@ const ALLOWED_FOR_ALL_ROOT_TYPES = ['ampdoc', 'embed'];
  * @const {!Object<string, {
  *     name: string,
  *     allowedFor: !Array<string>,
- *     klass: function(new:./events.EventTracker)
+ *     klass: typeof ./events.EventTracker
  *   }>}
  */
 const TRACKER_TYPE = Object.freeze({
@@ -188,7 +188,7 @@ export function getTrackerKeyName(eventType) {
 
 /**
  * @param {string} parentType
- * @return {!Object<string, function(new:EventTracker)>}
+ * @return {!Object<string, typeof EventTracker>}
  */
 export function getTrackerTypesForParentType(parentType) {
   const filtered = {};
@@ -1395,7 +1395,7 @@ function removeInternalVars(details) {
   if (!details) {
     return details;
   }
-  const clean = Object.assign({}, details);
+  const clean = {...details};
   delete clean[videoAnalyticsCustomEventTypeKey];
   return /** @type {!JsonObject} */ (clean);
 }
diff --git a/extensions/amp-analytics/0.1/iframe-transport-vendors.js b/extensions/amp-analytics/0.1/iframe-transport-vendors.js
index 9c4f3e1b2dc05..2d4e40d6e9648 100644
--- a/extensions/amp-analytics/0.1/iframe-transport-vendors.js
+++ b/extensions/amp-analytics/0.1/iframe-transport-vendors.js
@@ -33,9 +33,10 @@ const prodConfig = {
  *
  * @const {!Object}
  */
-const canaryConfig = Object.assign({}, prodConfig, {
+const canaryConfig = {
+  ...prodConfig,
   'bg': 'https://tpc.googlesyndication.com/b4a/experimental/b4a-runner.html',
-});
+};
 
 export const IFRAME_TRANSPORTS = /** @type {!JsonObject} */ (prodConfig);
 export const IFRAME_TRANSPORTS_CANARY = /** @type {!JsonObject} */ (canaryConfig);
diff --git a/extensions/amp-analytics/0.1/iframe-transport.js b/extensions/amp-analytics/0.1/iframe-transport.js
index 4ddfda84a3fa2..6fb6d3b275c34 100644
--- a/extensions/amp-analytics/0.1/iframe-transport.js
+++ b/extensions/amp-analytics/0.1/iframe-transport.js
@@ -38,6 +38,19 @@ const LONG_TASK_REPORTING_THRESHOLD = 5;
  *  }} */
 export let FrameData;
 
+/**
+ * @param {!Window} ampWin
+ * @param {boolean=} opt_forceProdUrl
+ * @return {string}
+ * @visibleForTesting
+ */
+export function getIframeTransportScriptUrlForTesting(
+  ampWin,
+  opt_forceProdUrl
+) {
+  return getIframeTransportScriptUrl(ampWin, opt_forceProdUrl);
+}
+
 /**
  * Get the URL of the client lib
  * @param {!Window} ampWin The window object of the AMP document
@@ -45,7 +58,7 @@ export let FrameData;
  *     in local/test modes.
  * @return {string}
  */
-export function getIframeTransportScriptUrl(ampWin, opt_forceProdUrl) {
+function getIframeTransportScriptUrl(ampWin, opt_forceProdUrl) {
   if (
     (getMode().localDev || getMode().test) &&
     !opt_forceProdUrl &&
diff --git a/extensions/amp-analytics/0.1/instrumentation.js b/extensions/amp-analytics/0.1/instrumentation.js
index a5e7319cf3cd6..b5f1431098ac4 100644
--- a/extensions/amp-analytics/0.1/instrumentation.js
+++ b/extensions/amp-analytics/0.1/instrumentation.js
@@ -36,7 +36,7 @@ const PROP = '__AMP_AN_ROOT';
 
 /**
  * @implements {../../../src/service.Disposable}
- * @private
+ * @package
  * @visibleForTesting
  */
 export class InstrumentationService {
diff --git a/extensions/amp-analytics/0.1/linker-manager.js b/extensions/amp-analytics/0.1/linker-manager.js
index b5b1e56875975..62b5f78295709 100644
--- a/extensions/amp-analytics/0.1/linker-manager.js
+++ b/extensions/amp-analytics/0.1/linker-manager.js
@@ -173,7 +173,7 @@ export class LinkerManager {
     const location = WindowInterface.getLocation(this.ampdoc_.win);
     const isProxyOrigin = this.urlService_.isProxyOrigin(location);
     linkerNames.forEach(name => {
-      const mergedConfig = Object.assign({}, defaultConfig, config[name]);
+      const mergedConfig = {...defaultConfig, ...config[name]};
 
       if (mergedConfig['enabled'] !== true) {
         user().info(
diff --git a/extensions/amp-analytics/0.1/requests.js b/extensions/amp-analytics/0.1/requests.js
index 8b1b0da3b9be5..9d49833840acb 100644
--- a/extensions/amp-analytics/0.1/requests.js
+++ b/extensions/amp-analytics/0.1/requests.js
@@ -30,7 +30,7 @@ export class RequestHandler {
   /**
    * @param {!Element} element
    * @param {!JsonObject} request
-   * @param {!../../../src/preconnect.Preconnect} preconnect
+   * @param {!../../../src/preconnect.PreconnectService} preconnect
    * @param {./transport.Transport} transport
    * @param {boolean} isSandbox
    */
@@ -80,7 +80,7 @@ export class RequestHandler {
     /** @private {!Array<!Promise<!BatchSegmentDef>>} */
     this.batchSegmentPromises_ = [];
 
-    /** @private {!../../../src/preconnect.Preconnect} */
+    /** @private {!../../../src/preconnect.PreconnectService} */
     this.preconnect_ = preconnect;
 
     /** @private {./transport.Transport} */
@@ -174,7 +174,7 @@ export class RequestHandler {
         });
     }
 
-    const params = Object.assign({}, configParams, trigger['extraUrlParams']);
+    const params = {...configParams, ...trigger['extraUrlParams']};
     const timestamp = this.win.Date.now();
     const batchSegmentPromise = expandExtraUrlParams(
       this.variableService_,
@@ -249,7 +249,7 @@ export class RequestHandler {
       : baseUrlTemplatePromise;
 
     preconnectPromise.then(preUrl => {
-      this.preconnect_.url(preUrl, true);
+      this.preconnect_.url(this.ampdoc_, preUrl, true);
     });
 
     Promise.all([
@@ -420,7 +420,7 @@ export function expandPostMessage(
   }
 
   return basePromise.then(expandedMsg => {
-    const params = Object.assign({}, configParams, trigger['extraUrlParams']);
+    const params = {...configParams, ...trigger['extraUrlParams']};
     //return base url with the appended extra url params;
     return expandExtraUrlParams(
       variableService,
diff --git a/extensions/amp-analytics/0.1/resource-timing.js b/extensions/amp-analytics/0.1/resource-timing.js
index 73d53ee1513bb..d0357798a3bba 100644
--- a/extensions/amp-analytics/0.1/resource-timing.js
+++ b/extensions/amp-analytics/0.1/resource-timing.js
@@ -256,7 +256,10 @@ function serialize(entries, resourceTimingSpec, ampdoc) {
     Math.round(val - relativeTo).toString(encoding['base'] || 10);
 
   const promises = filterEntries(entries, resources)
-    .map(({entry, name}) => entryToExpansionOptions(entry, name, format))
+    .map(resourceTimingEntry => {
+      const {entry, name} = resourceTimingEntry;
+      return entryToExpansionOptions(entry, name, format);
+    })
     .map(expansion =>
       variableService.expandTemplate(encoding['entry'], expansion)
     );
diff --git a/extensions/amp-analytics/0.1/test-e2e/test-iframe-transport.js b/extensions/amp-analytics/0.1/test-e2e/test-iframe-transport.js
new file mode 100644
index 0000000000000..9f479593907e3
--- /dev/null
+++ b/extensions/amp-analytics/0.1/test-e2e/test-iframe-transport.js
@@ -0,0 +1,50 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describes.endtoend(
+  'amp-analytics iframe transport',
+  {
+    testUrl:
+      'http://localhost:8000/test/fixtures/e2e/amphtml-ads/botguard.a4a.html',
+    environments: ['a4a-fie'],
+  },
+  env => {
+    let controller;
+
+    beforeEach(async () => {
+      controller = env.controller;
+    });
+
+    it('should inject transport iframe in the parent doc', async () => {
+      await controller.switchToParent();
+      const transportIframe = await controller.findElement('body > iframe');
+      await expect(
+        controller.getElementAttribute(transportIframe, 'src')
+      ).to.equal('https://tpc.googlesyndication.com/b4a/b4a-runner.html');
+      await expect(
+        controller.getElementAttribute(transportIframe, 'sandbox')
+      ).to.equal('allow-scripts allow-same-origin');
+      await expect(
+        controller.getElementAttribute(transportIframe, 'name')
+      ).to.equal(
+        '{"scriptSrc":"http://localhost:8000/dist/iframe-transport-client-lib.js","sentinel":"1","type":"bg"}'
+      );
+      await expect(
+        controller.getElementAttribute(transportIframe, 'data-amp-3p-sentinel')
+      ).to.equal('1');
+    });
+  }
+);
diff --git a/extensions/amp-analytics/0.1/test/test-config-new.js b/extensions/amp-analytics/0.1/test/test-config-new.js
new file mode 100644
index 0000000000000..327ebc95b8cd9
--- /dev/null
+++ b/extensions/amp-analytics/0.1/test/test-config-new.js
@@ -0,0 +1,984 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {AnalyticsConfig, expandConfigRequest, mergeObjects} from '../config';
+import {Services} from '../../../../src/services';
+import {installDocService} from '../../../../src/service/ampdoc-impl';
+import {map} from '../../../../src/utils/object';
+import {stubService} from '../../../../testing/test-helper';
+import {user} from '../../../../src/log';
+
+describes.realWin('AnalyticsConfig', {amp: false}, env => {
+  let win;
+  let doc;
+  const vendorName = 'test-vendor';
+  let fakeVendorJson;
+  let fakeRemoteJson;
+  let fakeRewriterJson;
+  let xhrStub;
+
+  beforeEach(() => {
+    win = env.win;
+    doc = win.document;
+    xhrStub = stubXhr();
+    xhrStub.callsFake(url => {
+      if (url.indexOf(`${vendorName}.json`) >= 0) {
+        return Promise.resolve({
+          json: () => fakeVendorJson,
+        });
+      }
+      if (url.indexOf('/remote') >= 0) {
+        return Promise.resolve({
+          json: () => fakeRemoteJson,
+        });
+      }
+      if (url.indexOf('/rewriter') >= 0) {
+        return Promise.resolve({
+          json: () => fakeRewriterJson,
+        });
+      }
+    });
+  });
+
+  describe('handles top level fields correctly', () => {
+    it('propogates requestOrigin into each request object', () => {
+      fakeVendorJson = {
+        'requestOrigin': 'https://example.com',
+        'requests': {'test1': '/test1', 'test2': '/test1/test2'},
+      };
+
+      const element = getAnalyticsTag({}, {'type': vendorName});
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'test1': {
+            origin: 'https://example.com',
+            baseUrl: '/test1',
+          },
+          'test2': {
+            origin: 'https://example.com',
+            baseUrl: '/test1/test2',
+          },
+        });
+      });
+    });
+
+    it('does not overwrite existing origin in request object', () => {
+      fakeVendorJson = {
+        'requestOrigin': 'https://toplevel.com',
+        'requests': {
+          'test1': {
+            origin: 'https://nested.com',
+            baseUrl: '/test1',
+          },
+        },
+      };
+
+      const element = getAnalyticsTag({}, {'type': vendorName});
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'test1': {
+            origin: 'https://nested.com',
+            baseUrl: '/test1',
+          },
+        });
+      });
+    });
+
+    it('handles empty string request origin', () => {
+      fakeVendorJson = {
+        'requestOrigin': '',
+        'requests': {
+          'test1': {
+            baseUrl: '/test1',
+          },
+        },
+      };
+
+      const element = getAnalyticsTag({}, {'type': vendorName});
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'test1': {
+            origin: '',
+            baseUrl: '/test1',
+          },
+        });
+      });
+    });
+
+    it('handles undefined request origin', () => {
+      fakeVendorJson = {
+        'requestOrigin': undefined,
+        'requests': {
+          'test1': {
+            baseUrl: '/test1',
+          },
+        },
+      };
+
+      const element = getAnalyticsTag({}, {'type': vendorName});
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'test1': {
+            origin: undefined,
+            baseUrl: '/test1',
+          },
+        });
+      });
+    });
+  });
+
+  describe('merges requests correctly', () => {
+    it('inline and vendor both string', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '/bar', 'bar': 'foobar'},
+      };
+
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': 'https://example.com/${bar}'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'foo': {
+            baseUrl: 'https://example.com/${bar}',
+          },
+          'bar': {
+            baseUrl: 'foobar',
+          },
+        });
+        expect(config['triggers']).to.deep.equal([
+          {
+            'on': 'visible',
+            'request': 'foo',
+          },
+        ]);
+      });
+    });
+
+    it('inline and vendor string and object', () => {
+      fakeVendorJson = {
+        'requests': {
+          'foo': 'foo',
+          'bar': {
+            'baseUrl': 'bar-v',
+            'batchInterval': 2,
+          },
+        },
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {
+            'foo': {
+              'baseUrl': 'https://example.com/${bar}',
+              'batchInterval': 0,
+            },
+            'bar': 'bar-i',
+          },
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'foo': {
+            'baseUrl': 'https://example.com/${bar}',
+            'batchInterval': 0,
+          },
+          'bar': {
+            'baseUrl': 'bar-i',
+            'batchInterval': 2,
+          },
+        });
+        expect(config['triggers']).to.deep.equal([
+          {
+            'on': 'visible',
+            'request': 'foo',
+          },
+        ]);
+      });
+    });
+
+    it('inline and vendor both object', () => {
+      fakeVendorJson = {
+        'requests': {
+          'foo': {
+            'baseUrl': 'foo',
+            'batchInterval': 5,
+          },
+          'bar': {
+            'baseUrl': 'bar-v',
+          },
+        },
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {
+            'foo': {
+              'baseUrl': 'https://example.com/${bar}',
+              'batchInterval': 0,
+            },
+            'bar': {
+              'batchInterval': 3,
+            },
+          },
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'foo': {
+            'baseUrl': 'https://example.com/${bar}',
+            'batchInterval': 0,
+          },
+          'bar': {
+            'baseUrl': 'bar-v',
+            'batchInterval': 3,
+          },
+        });
+        expect(config['triggers']).to.deep.equal([
+          {
+            'on': 'visible',
+            'request': 'foo',
+          },
+        ]);
+      });
+    });
+
+    it('inline and remote both string', () => {
+      fakeRemoteJson = {
+        requests: {
+          foo: 'https://example.com/remote',
+        },
+      };
+
+      const element = getAnalyticsTag(
+        {
+          'vars': {'title': 'local'},
+          'requests': {'foo': 'https://example.com/${title}'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {
+          'config': '/remote',
+        }
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']).to.deep.equal({
+          'foo': {
+            'baseUrl': 'https://example.com/remote',
+          },
+        });
+        expect(config['triggers']).to.deep.equal([
+          {
+            'on': 'visible',
+            'request': 'foo',
+          },
+        ]);
+      });
+    });
+  });
+
+  describe('mergeObjects', () => {
+    it('merges objects correctly', function() {
+      expect(mergeObjects({}, {})).to.deep.equal({});
+      expect(mergeObjects(map({'a': 0}), map({'b': 1}))).to.deep.equal(
+        map({'a': 0, 'b': 1})
+      );
+      expect(mergeObjects({'foo': 1}, {'1': 1})).to.deep.equal({
+        'foo': 1,
+        '1': 1,
+      });
+      expect(mergeObjects({'1': 1}, {'bar': 'bar'})).to.deep.equal({
+        '1': 1,
+        'bar': 'bar',
+      });
+      expect(
+        mergeObjects({'foo': [1, 2, 3, 4]}, {'bar': [4, 5, 6, 7]})
+      ).to.deep.equal({'foo': [1, 2, 3, 4], 'bar': [4, 5, 6, 7]});
+      expect(
+        mergeObjects(null, {'foo': 'bar', 'baz': {'foobar': ['abc', 'def']}})
+      ).to.deep.equal({'foo': 'bar', 'baz': {'foobar': ['abc', 'def']}});
+      expect(
+        mergeObjects(undefined, {
+          'foo': 'bar',
+          'baz': {'foobar': ['abc', 'def']},
+        })
+      ).to.deep.equal({'foo': 'bar', 'baz': {'foobar': ['abc', 'def']}});
+      expect(
+        mergeObjects(
+          {'baz': 'bar', 'foobar': {'foobar': ['abc', 'def']}},
+          {'foo': 'bar', 'baz': {'foobar': ['abc', 'def']}}
+        )
+      ).to.deep.equal({
+        'foo': 'bar',
+        'baz': 'bar',
+        'foobar': {'foobar': ['abc', 'def']},
+      });
+    });
+  });
+
+  describe('vendor only configs', () => {
+    it('succeeds for vendor optout config', () => {
+      fakeVendorJson = {
+        'requests': {
+          'pageview': '//fake-url',
+        },
+        'triggers': {
+          'pageview': {
+            'on': 'visible',
+            'request': 'pageview',
+          },
+        },
+        optout: true,
+      };
+      const element = getAnalyticsTag({}, {'type': vendorName});
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['optout']).to.be.true;
+      });
+    });
+
+    it('fails for inline optout config', () => {
+      const element = getAnalyticsTag({
+        'requests': {'foo': 'https://example.com/bar'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'optout': 'foo.bar',
+      });
+      return expect(
+        new AnalyticsConfig(element).loadConfig()
+      ).to.be.rejectedWith(
+        /optout property is only available to vendor config/
+      );
+    });
+
+    it('succeeds for vendor iframePing config', () => {
+      fakeVendorJson = {
+        'requests': {
+          'pageview': '//fake-url',
+        },
+        'triggers': {
+          'pageview': {
+            'on': 'visible',
+            'request': 'pageview',
+            'iframePing': true,
+          },
+        },
+      };
+      const element = getAnalyticsTag({}, {'type': vendorName});
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['triggers']).to.deep.equal({
+          'pageview': {
+            'on': 'visible',
+            'request': 'pageview',
+            'iframePing': true,
+          },
+        });
+      });
+    });
+
+    it('fails for inlined iframePing config', () => {
+      const element = getAnalyticsTag({
+        'element': {'foo': 'https://example.com/bar'},
+        'triggers': [{'on': 'visible', 'iframePing': true}],
+      });
+      return expect(
+        new AnalyticsConfig(element).loadConfig()
+      ).to.be.rejectedWith(
+        /iframePing config is only available to vendor config/
+      );
+    });
+
+    it('succeeds for vendor iframe transport config', () => {
+      fakeVendorJson = {
+        'requests': {
+          'pageview': '//fake-url',
+        },
+        'triggers': {
+          'pageview': {
+            'on': 'visible',
+            'request': 'pageview',
+          },
+        },
+        transport: {
+          image: false,
+          xhrpost: false,
+          beacon: false,
+          iframe: '//fake-url',
+        },
+      };
+      const element = getAnalyticsTag({}, {'type': vendorName});
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['transport']).to.deep.equal({
+          image: false,
+          xhrpost: false,
+          beacon: false,
+          iframe: '//fake-url',
+        });
+      });
+    });
+
+    it('fails for inlined iframe transport config', () => {
+      expectAsyncConsoleError(
+        /Inline configs are not allowed to specify transport iframe/
+      );
+      expectAsyncConsoleError(
+        '[AmpAnalytics <unknown id>] Inline or remote config ' +
+          'should not overwrite vendor transport settings'
+      );
+      fakeVendorJson = {
+        'requests': {
+          'pageview': '//fake-url',
+        },
+        'triggers': {
+          'pageview': {
+            'on': 'visible',
+            'request': 'pageview',
+          },
+        },
+        transport: {
+          image: false,
+          xhrpost: false,
+          beacon: false,
+          iframe: '//fake-url',
+        },
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': 'https://example.com/bar'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+          transport: {
+            image: false,
+            xhrpost: false,
+            beacon: false,
+            iframe: '//fake-url2',
+          },
+        },
+        {'type': vendorName}
+      );
+      return new AnalyticsConfig(element).loadConfig();
+    });
+  });
+
+  describe('remote config', () => {
+    it('fetches and merges remote config', () => {
+      expectAsyncConsoleError(
+        /Remote configs are not allowed to specify transport iframe/
+      );
+
+      fakeRemoteJson = {
+        vars: {'title': 'remote'},
+        transport: {
+          iframe: '//fake-url',
+        },
+      };
+
+      const element = getAnalyticsTag(
+        {
+          'vars': {'title': 'local'},
+          'requests': {'foo': 'https://example.com/${title}'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {
+          'config': '/remote',
+        }
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['vars']['title']).to.equal('remote');
+        // iframe transport from remote config is ignored
+        expect(config['transport']['iframe']).to.be.undefined;
+      });
+    });
+
+    it('should not fetch remote config if sandboxed', () => {
+      fakeRemoteJson = {
+        vars: {'title': 'remote'},
+      };
+      const element = getAnalyticsTag(
+        {
+          'vars': {'title': 'local'},
+          'requests': {'foo': 'https://example.com/${title}'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {
+          'config': '/remote',
+          'sandbox': 'true',
+        }
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['vars']['title']).to.equal('local');
+      });
+    });
+
+    it('fetches and merges remote config with credentials', () => {
+      fakeRemoteJson = {
+        vars: {'title': 'remote'},
+      };
+
+      const element = getAnalyticsTag(
+        {
+          'vars': {'title': 'local'},
+          'requests': {'foo': 'https://example.com/${title}'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {
+          'config': '/remote',
+          'data-credentials': 'include',
+        }
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(xhrStub).to.be.calledWith('/remote', {
+          credentials: 'include',
+        });
+        expect(config['vars']['title']).to.equal('remote');
+      });
+    });
+  });
+
+  describe('should re-write configuration if configured', () => {
+    it('should fully rewrite a configuration', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '//vendor'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {
+          'url': '/rewriter',
+        },
+      };
+      fakeRewriterJson = {
+        'requests': {'foo': '/rewriter'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': '//inlined'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']['foo']).to.deep.equal({
+          baseUrl: '/rewriter',
+        });
+      });
+    });
+
+    it('should resolve and send publisher enabled varGroups', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '//vendor'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {
+          'url': '/rewriter',
+          'varGroups': {
+            'feature1': {
+              'key': 'cats',
+              'cid': 'CLIENT_ID(foo)',
+            },
+            'feature2': {
+              'bad': 'dontsendme',
+            },
+          },
+        },
+      };
+
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': '//inlined'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+          'configRewriter': {
+            'varGroups': {
+              'feature1': {'enabled': true},
+            },
+          },
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(() => {
+        expect(xhrStub).to.be.calledWith('/rewriter', {
+          body: {
+            requests: {foo: '//inlined'},
+            triggers: [{on: 'visible', request: 'foo'}],
+            configRewriter: {
+              vars: {
+                cid: 'amp12345',
+                key: 'cats',
+              },
+            },
+          },
+          method: 'POST',
+        });
+      });
+    });
+
+    it('should resolve and send vendor enabled varGroups', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '//vendor'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {
+          'url': '/rewriter',
+          'varGroups': {
+            'feature1': {
+              'key': 'cats',
+              'cid': 'CLIENT_ID(foo)',
+              'enabled': true,
+            },
+          },
+        },
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': '//inlined'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(() => {
+        expect(xhrStub).to.be.calledWith('/rewriter', {
+          body: {
+            requests: {foo: '//inlined'},
+            triggers: [{on: 'visible', request: 'foo'}],
+            configRewriter: {
+              vars: {
+                cid: 'amp12345',
+                key: 'cats',
+              },
+            },
+          },
+          method: 'POST',
+        });
+      });
+    });
+
+    it('should not send configRewriter object if no vars are enabled', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '//vendor'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {
+          'url': '/rewriter',
+          'varGroups': {
+            'feature1': {
+              'key': 'cats',
+              'cid': 'CLIENT_ID(foo)',
+            },
+          },
+        },
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': '//inlined'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(() => {
+        expect(xhrStub).to.be.calledWith('/rewriter', {
+          body: {
+            requests: {foo: '//inlined'},
+            triggers: [{on: 'visible', request: 'foo'}],
+          },
+          method: 'POST',
+        });
+      });
+    });
+
+    it('should support amp-analytics-variables macros in varGroups', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '//vendor'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {
+          'url': '/rewriter',
+          'varGroups': {
+            'feature1': {
+              'hasValue': '$NOT(foo)',
+              'enabled': true,
+            },
+          },
+        },
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': '//inlined'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(() => {
+        expect(xhrStub).to.be.calledWith('/rewriter', {
+          body: {
+            requests: {foo: '//inlined'},
+            triggers: [{on: 'visible', request: 'foo'}],
+            configRewriter: {
+              vars: {
+                hasValue: 'false',
+              },
+            },
+          },
+          method: 'POST',
+        });
+      });
+    });
+
+    it('should merge rewritten configuration and use vendor', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '//vendor'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {
+          'url': '/rewriter',
+        },
+      };
+      fakeRemoteJson = {
+        'requests': {'foo': '//remote'},
+      };
+
+      fakeRewriterJson = {
+        'requests': {'foo': '//rewriter'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': '//inlined'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName, 'config': '//remote'}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(xhrStub).to.be.calledWith('/rewriter', {
+          body: {
+            requests: {foo: '//remote'},
+            triggers: [{on: 'visible', request: 'foo'}],
+          },
+          method: 'POST',
+        });
+
+        expect(config['requests']['foo']).to.deep.equal({
+          baseUrl: '//rewriter',
+        });
+      });
+    });
+
+    it('should ignore config rewriter if no url provided', () => {
+      fakeVendorJson = {
+        'requests': {'foo': '//vendor'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {},
+      };
+      const element = getAnalyticsTag(
+        {
+          'requests': {'foo': '//inlined'},
+          'triggers': [{'on': 'visible', 'request': 'foo'}],
+        },
+        {'type': vendorName}
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']['foo']).to.deep.equal({
+          baseUrl: '//inlined',
+        });
+      });
+    });
+
+    it('should ignore inlined config rewriter', () => {
+      fakeRewriterJson = {
+        'requests': {'foo': '//rewriter'},
+      };
+      const element = getAnalyticsTag({
+        'requests': {'foo': '//inlined'},
+        'triggers': [{'on': 'visible', 'request': 'foo'}],
+        'configRewriter': {
+          'url': '//rewriter',
+        },
+      });
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(config['requests']['foo']).to.deep.equal({
+          baseUrl: '//inlined',
+        });
+      });
+    });
+  });
+
+  describe('expandConfigRequest', () => {
+    it('expandConfigRequest function', () => {
+      let config = {
+        'requests': {
+          'foo': 'test',
+          'bar': {
+            'baseUrl': 'test1',
+          },
+          'foobar': {},
+        },
+      };
+      config = expandConfigRequest(config);
+      expect(config).to.jsonEqual({
+        'requests': {
+          'foo': {
+            'baseUrl': 'test',
+          },
+          'bar': {
+            'baseUrl': 'test1',
+          },
+          'foobar': {},
+        },
+      });
+    });
+  });
+
+  describe('warning message', () => {
+    it('shows the warning', () => {
+      fakeVendorJson = {
+        'requests': {'test1': '/test1', 'test2': '/test1/test2'},
+        'warningMessage': 'I am a warning',
+      };
+
+      const element = getAnalyticsTag(
+        {},
+        {'type': vendorName, 'id': 'analyticsId'}
+      );
+      const usrObj = user();
+      const spy = env.sandbox.spy(usrObj, 'warn');
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(spy).callCount(1);
+        expect(spy).to.have.been.calledWith(
+          'AmpAnalytics analyticsId',
+          'Warning from analytics vendor%s%s: %s',
+          ' test-vendor',
+          '',
+          'I am a warning'
+        );
+        expect(config['warningMessage']).to.be.undefined;
+      });
+    });
+
+    it('handles incorrect inputs', () => {
+      fakeVendorJson = {
+        'requests': {'test1': '/test1', 'test2': '/test2'},
+        'warningMessage': {
+          'message': 'I am deprecated',
+          'configVersion': '0.1',
+        },
+      };
+
+      const element = getAnalyticsTag(
+        {},
+        {'type': vendorName, 'id': 'analyticsId'}
+      );
+      const usrObj = user();
+      const spy = env.sandbox.spy(usrObj, 'warn');
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(spy).callCount(1);
+        expect(spy).to.have.been.calledWith(
+          'AmpAnalytics analyticsId',
+          'Warning from analytics vendor%s%s: %s',
+          ' test-vendor',
+          '',
+          '[object Object]'
+        );
+        expect(config['warningMessage']).to.be.undefined;
+      });
+    });
+
+    it('handles remote config', () => {
+      const element = getAnalyticsTag(
+        {},
+        {'config': 'www.vendorConfigLocation.com', 'id': 'analyticsId'}
+      );
+
+      const usrObj = user();
+      const spy = env.sandbox.spy(usrObj, 'warn');
+      xhrStub.returns(
+        Promise.resolve({
+          json: () => {
+            return {
+              'warningMessage':
+                'The config you are working with has been deprecated',
+            };
+          },
+        })
+      );
+
+      return new AnalyticsConfig(element).loadConfig().then(config => {
+        expect(spy).callCount(1);
+        expect(spy).to.have.been.calledWith(
+          'AmpAnalytics analyticsId',
+          'Warning from analytics vendor%s%s: %s',
+          '',
+          ' with remote config url www.vendorConfigLocation.com',
+          'The config you are working with has been deprecated'
+        );
+        expect(config['warningMessage']).to.be.undefined;
+      });
+    });
+  });
+
+  function getAnalyticsTag(config, attrs) {
+    config = JSON.stringify(config);
+    const el = doc.createElement('amp-analytics');
+    const script = doc.createElement('script');
+    script.textContent = config;
+    script.setAttribute('type', 'application/json');
+    el.appendChild(script);
+    for (const k in attrs) {
+      el.setAttribute(k, attrs[k]);
+    }
+    doc.body.appendChild(el);
+    return el;
+  }
+
+  function stubXhr() {
+    installDocService(win, true);
+
+    const expandStringStub = env.sandbox.stub();
+    expandStringStub.withArgs('CLIENT_ID(foo)').resolves('amp12345');
+    expandStringStub.resolvesArg(0);
+
+    const macros = {
+      a: 'b',
+    };
+    expandStringStub.withArgs('$NOT(foo)', macros).resolves('false');
+    stubService(
+      env.sandbox,
+      win,
+      'amp-analytics-variables',
+      'getMacros'
+    ).returns(macros);
+
+    env.sandbox.stub(Services, 'urlReplacementsForDoc').returns({
+      'expandUrlAsync': url => Promise.resolve(url),
+      'expandStringAsync': expandStringStub,
+    });
+
+    return stubService(env.sandbox, win, 'xhr', 'fetchJson');
+  }
+});
diff --git a/extensions/amp-analytics/0.1/test/test-config.js b/extensions/amp-analytics/0.1/test/test-config.js
index 3c223edb01b62..ed2da198873d7 100644
--- a/extensions/amp-analytics/0.1/test/test-config.js
+++ b/extensions/amp-analytics/0.1/test/test-config.js
@@ -22,7 +22,8 @@ import {map} from '../../../../src/utils/object';
 import {stubService} from '../../../../testing/test-helper';
 import {user} from '../../../../src/log';
 
-describes.realWin('AnalyticsConfig', {amp: false}, env => {
+// TODO(zhouyx@): Remove after ANALYTICS_VENDOR_SPLIT clean up
+describes.realWin.skip('AnalyticsConfig', {amp: false}, env => {
   let win;
   let doc;
 
diff --git a/extensions/amp-analytics/0.1/test/test-iframe-transport.js b/extensions/amp-analytics/0.1/test/test-iframe-transport.js
index ed9f3543c5370..14ec432638e23 100644
--- a/extensions/amp-analytics/0.1/test/test-iframe-transport.js
+++ b/extensions/amp-analytics/0.1/test/test-iframe-transport.js
@@ -16,7 +16,7 @@
 
 import {
   IframeTransport,
-  getIframeTransportScriptUrl,
+  getIframeTransportScriptUrlForTesting,
 } from '../iframe-transport';
 import {addParamsToUrl} from '../../../../src/url';
 import {expectPostMessage} from '../../../../testing/iframe.js';
@@ -172,13 +172,13 @@ describes.realWin('amp-analytics.iframe-transport', {amp: true}, env => {
   });
 
   it('gets correct client lib URL in local/test mode', () => {
-    const url = getIframeTransportScriptUrl(env.ampdoc.win);
+    const url = getIframeTransportScriptUrlForTesting(env.ampdoc.win);
     expect(url).to.contain(env.win.location.host);
     expect(url).to.contain('/dist/iframe-transport-client-lib.js');
   });
 
   it('gets correct client lib URL in prod mode', () => {
-    const url = getIframeTransportScriptUrl(env.ampdoc.win, true);
+    const url = getIframeTransportScriptUrlForTesting(env.ampdoc.win, true);
     expect(url).to.contain(urls.thirdParty);
     expect(url).to.contain('/iframe-transport-client-v0.js');
     expect(url).to.equal(
diff --git a/extensions/amp-analytics/0.1/test/test-requests.js b/extensions/amp-analytics/0.1/test/test-requests.js
index dac210d4f3176..bfcd34e7b8499 100644
--- a/extensions/amp-analytics/0.1/test/test-requests.js
+++ b/extensions/amp-analytics/0.1/test/test-requests.js
@@ -216,6 +216,7 @@ describes.realWin('Requests', {amp: 1}, env => {
         handler.send({}, {}, expansionOptions, {});
         yield macroTask();
         expect(preconnectSpy).to.be.calledWith(
+          env.sandbox.match.object, // AmpDoc
           'r2?cid=CLIENT_ID(scope)&var=expanded'
         );
       });
diff --git a/extensions/amp-analytics/0.1/test/test-transport.js b/extensions/amp-analytics/0.1/test/test-transport.js
index ab7d26be8874b..c4a5bab7c65c5 100644
--- a/extensions/amp-analytics/0.1/test/test-transport.js
+++ b/extensions/amp-analytics/0.1/test/test-transport.js
@@ -21,6 +21,7 @@ import {
 } from '../../../../testing/test-helper';
 import {Transport} from '../transport';
 import {getMode} from '../../../../src/mode';
+import {installDocService} from '../../../../src/service/ampdoc-impl';
 import {installTimerService} from '../../../../src/service/timer-impl';
 import {loadPromise} from '../../../../src/event-helper';
 
@@ -44,6 +45,9 @@ describes.realWin(
       openXhrStub = env.sandbox.stub();
       sendXhrStub = env.sandbox.stub();
       sendBeaconStub = env.sandbox.stub();
+
+      // Needed for PreconnectService.
+      installDocService(win, true);
     });
 
     it('prefers beacon over xhrpost and image', () => {
@@ -386,12 +390,8 @@ describes.realWin(
 
         const ampAnalyticsEl = null;
 
-        const preconnectSpy = env.sandbox.spy();
-        transport.maybeInitIframeTransport(win, ampAnalyticsEl, {
-          preload: preconnectSpy,
-        });
+        transport.maybeInitIframeTransport(ampAnalyticsEl);
         expect(transport.iframeTransport_).to.be.null;
-        expect(preconnectSpy).to.not.be.called;
       });
 
       it('initialize iframe transport when used', () => {
@@ -412,12 +412,8 @@ describes.realWin(
           'amp-analytics'
         );
 
-        const preconnectSpy = env.sandbox.spy();
-        transport.maybeInitIframeTransport(win, ampAnalyticsEl, {
-          preload: preconnectSpy,
-        });
+        transport.maybeInitIframeTransport(ampAnalyticsEl);
         expect(transport.iframeTransport_).to.be.ok;
-        expect(preconnectSpy).to.be.called;
 
         transport.deleteIframeTransport();
         expect(transport.iframeTransport_).to.be.null;
@@ -442,12 +438,8 @@ describes.realWin(
           'amp-analytics'
         );
 
-        const preconnectSpy = env.sandbox.spy();
-        transport.maybeInitIframeTransport(win, ampAnalyticsEl, {
-          preload: preconnectSpy,
-        });
+        transport.maybeInitIframeTransport(ampAnalyticsEl);
         expect(transport.iframeTransport_).to.be.ok;
-        expect(preconnectSpy).to.be.called;
 
         transport.deleteIframeTransport();
         expect(transport.iframeTransport_).to.be.null;
diff --git a/extensions/amp-analytics/0.1/test/test-variables.js b/extensions/amp-analytics/0.1/test/test-variables.js
index c9fe98a7379d2..5aac712754b1a 100644
--- a/extensions/amp-analytics/0.1/test/test-variables.js
+++ b/extensions/amp-analytics/0.1/test/test-variables.js
@@ -142,19 +142,27 @@ describes.fakeWin('amp-analytics.VariableService', {amp: true}, env => {
     it('expands array vars', () => {
       check(
         '${array}',
-        'xy%26x,MACRO(abc,def),MACRO(abc%2Cdef)%26123,%24%7Bfoo%7D',
+        '123,xy%26x,MACRO(abc,def),MACRO(abc%2Cdef)%26123,bar,',
         {
           'foo': 'bar',
           'array': [
+            123,
             'xy&x', // special chars should be encoded
             'MACRO(abc,def)', // do not encode macro
             'MACRO(abc,def)&123', // this is not a macro
-            '${foo}', // vars in array is not expanded
+            '${foo}', // vars in array should be expanded
+            '${bar}', // undefined vars should be empty
           ],
         }
       );
     });
 
+    it('handles array with no vars', () => {
+      check('${array}', 'foo,bar', {
+        'array': ['foo', 'bar'],
+      });
+    });
+
     it('handles empty var name', () => {
       check('${}', '', {});
     });
diff --git a/extensions/amp-analytics/0.1/test/test-vendors-new.js b/extensions/amp-analytics/0.1/test/test-vendors-new.js
new file mode 100644
index 0000000000000..3cd2ec9376933
--- /dev/null
+++ b/extensions/amp-analytics/0.1/test/test-vendors-new.js
@@ -0,0 +1,217 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {AmpAnalytics} from '../amp-analytics';
+import {AnalyticsConfig} from '../config';
+import {ExpansionOptions} from '../variables';
+import {IFRAME_TRANSPORTS} from '../iframe-transport-vendors';
+import {
+  ImagePixelVerifier,
+  mockWindowInterface,
+} from '../../../../testing/test-helper';
+import {Services} from '../../../../src/services';
+import {hasOwn} from '../../../../src/utils/object';
+import {macroTask} from '../../../../testing/yield';
+
+/* global require: false */
+const VENDOR_REQUESTS = require('./vendor-requests.json');
+
+describes.realWin(
+  'amp-analytics',
+  {
+    amp: {
+      extensions: ['amp-analytics'],
+    },
+    mockFetch: false,
+  },
+  function(env) {
+    let win, doc;
+    let requestVerifier;
+
+    beforeEach(() => {
+      win = env.win;
+      doc = win.document;
+      const wi = mockWindowInterface(env.sandbox);
+      wi.getLocation.returns(win.location);
+      requestVerifier = new ImagePixelVerifier(wi);
+    });
+
+    describe('Should not contain iframe transport if not whitelisted', () => {
+      for (const vendor in VENDOR_REQUESTS) {
+        it('test vendor: ' + vendor, () => {
+          const el = doc.createElement('amp-analytics');
+          el.setAttribute('type', vendor);
+          doc.body.appendChild(el);
+          const analyticsConfig = new AnalyticsConfig(el);
+          return analyticsConfig.loadConfig().then(config => {
+            if (
+              hasOwn(config, 'transport') &&
+              hasOwn(config.transport, 'iframe')
+            ) {
+              expect(config['transport']['iframe']).to.equal(
+                IFRAME_TRANSPORTS[vendor]
+              );
+            }
+          });
+        });
+      }
+    });
+
+    describe('vendor request tests', () => {
+      for (const vendor in VENDOR_REQUESTS) {
+        describe('analytics vendor: ' + vendor, function() {
+          let config;
+          let analytics;
+          beforeEach(done => {
+            const urlReplacements = Services.urlReplacementsForDoc(
+              doc.documentElement
+            );
+            window.sandbox
+              .stub(urlReplacements.getVariableSource(), 'get')
+              .callsFake(function(name) {
+                expect(this.replacements_).to.have.property(name);
+                const defaultValue = `_${name.toLowerCase()}_`;
+                return {
+                  sync: () => defaultValue,
+                };
+              });
+
+            window.sandbox
+              .stub(ExpansionOptions.prototype, 'getVar')
+              .callsFake(function(name) {
+                let val = this.vars[name];
+                if (val == null || val == '') {
+                  val = '!' + name;
+                }
+                return val;
+              });
+
+            analytics = getAnalyticsTag(doc, vendor);
+            analytics.layoutCallback().then(() => {
+              config = analytics.config_;
+              done();
+            });
+          });
+
+          it('test requests', function*() {
+            const outputConfig = {};
+            if (!config.requests) {
+              throw new Error(
+                'Request for ' +
+                  vendor +
+                  ' not found. Please make sure you run ' +
+                  '"gulp vendor-configs" or build amp-analytics ' +
+                  'before running the test'
+              );
+            }
+            for (const name in config.requests) {
+              // Wait for event queue to clear.
+              // To prevent default triggers
+              yield macroTask();
+              analytics.handleEvent_(
+                {
+                  request: name,
+                },
+                {
+                  vars: Object.create(null),
+                }
+              );
+
+              // Reset $requestCount value after each
+              analytics.config_['vars']['requestCount'] = 0;
+
+              yield macroTask();
+              expect(requestVerifier.hasRequestSent()).to.be.true;
+              let url = requestVerifier.getLastRequestUrl();
+
+              const vendorData = VENDOR_REQUESTS[vendor];
+              if (!vendorData) {
+                throw new Error(
+                  'Add vendor ' + vendor + ' to vendor-requests.json'
+                );
+              }
+              const val = vendorData[name];
+              if (val == '<ignore for test>') {
+                url = '<ignore for test>';
+              }
+              if (val == null) {
+                throw new Error(
+                  'Define ' +
+                    vendor +
+                    '.' +
+                    name +
+                    ' in vendor-requests.json. Expected value: ' +
+                    url
+                );
+              }
+              outputConfig[name] = url;
+              // Write this out for easy copy pasting.
+              if (url !== val) {
+                throw new Error(
+                  `Vendor ${vendor}, request ${name} doesn't match` +
+                    `Expected value ${val}, get value ${url}`
+                );
+              }
+              expect(url).to.equal(val);
+            }
+            writeOutput(vendor, outputConfig);
+          });
+        });
+      }
+    });
+  }
+);
+
+/**
+ * Get the AmpAnalytics instance
+ * @param {string} vendor
+ */
+function getAnalyticsTag(doc, vendor) {
+  const el = doc.createElement('amp-analytics');
+  el.setAttribute('type', vendor);
+
+  // Overwrite transport method to use image
+  expectAsyncConsoleError(/should not overwrite vendor transport/);
+  const script = doc.createElement('script');
+  script.setAttribute('type', 'application/json');
+  script.textContent = JSON.stringify({
+    'transport': {
+      'iframe': false,
+      'image': true,
+    },
+  });
+  el.appendChild(script);
+
+  doc.body.appendChild(el);
+  el.connectedCallback();
+  const analytics = new AmpAnalytics(el);
+  analytics.createdCallback();
+  analytics.buildCallback();
+  return analytics;
+}
+
+// Cache firstChild before append div to doc
+const {firstChild} = top.document.body;
+
+function writeOutput(vendor, output) {
+  const vendorDiv = top.document.createElement('h3');
+  vendorDiv.textContent = vendor;
+  top.document.body.insertBefore(vendorDiv, firstChild);
+
+  const out = top.document.createElement('div');
+  out.textContent = JSON.stringify(output, null, '  ');
+  top.document.body.insertBefore(out, firstChild);
+}
diff --git a/extensions/amp-analytics/0.1/test/test-vendors.js b/extensions/amp-analytics/0.1/test/test-vendors.js
index 45431b9514ead..21661b040b7da 100644
--- a/extensions/amp-analytics/0.1/test/test-vendors.js
+++ b/extensions/amp-analytics/0.1/test/test-vendors.js
@@ -17,36 +17,41 @@
 import {ANALYTICS_CONFIG} from '../vendors';
 import {AmpAnalytics} from '../amp-analytics';
 import {ExpansionOptions} from '../variables';
-import {IFRAME_TRANSPORTS} from '../iframe-transport-vendors';
+//import {IFRAME_TRANSPORTS} from '../iframe-transport-vendors';
 import {
   ImagePixelVerifier,
   mockWindowInterface,
 } from '../../../../testing/test-helper';
 import {Services} from '../../../../src/services';
-import {hasOwn} from '../../../../src/utils/object';
+//import {hasOwn} from '../../../../src/utils/object';
 import {macroTask} from '../../../../testing/yield';
 
+// TODO(zhouyx@): Remove after ANALYTICS_VENDOR_SPLIT clean up
+
 /* global require: false */
 const VENDOR_REQUESTS = require('./vendor-requests.json');
-const AnalyticsConfig = Object.assign({}, ANALYTICS_CONFIG);
-
-describe('iframe transport', () => {
-  it('Should not contain iframe transport if not whitelisted', () => {
-    for (const vendor in AnalyticsConfig) {
-      const vendorEntry = AnalyticsConfig[vendor];
-      if (
-        hasOwn(vendorEntry, 'transport') &&
-        hasOwn(vendorEntry.transport, 'iframe')
-      ) {
-        expect(vendorEntry['transport']['iframe']).to.equal(
-          IFRAME_TRANSPORTS[vendor]
-        );
-      }
-    }
-  });
-});
-
-describes.realWin(
+const AnalyticsConfig = {...ANALYTICS_CONFIG};
+
+// TODO(zhouyx@) Fix the "describe block" if we are going to revert the test
+// "Top-level "describe" blocks in test files have been deprecated"
+
+// describe.skip('iframe transport', () => {
+//   it('Should not contain iframe transport if not whitelisted', () => {
+//     for (const vendor in AnalyticsConfig) {
+//       const vendorEntry = AnalyticsConfig[vendor];
+//       if (
+//         hasOwn(vendorEntry, 'transport') &&
+//         hasOwn(vendorEntry.transport, 'iframe')
+//       ) {
+//         expect(vendorEntry['transport']['iframe']).to.equal(
+//           IFRAME_TRANSPORTS[vendor]
+//         );
+//       }
+//     }
+//   });
+// });
+
+describes.realWin.skip(
   'amp-analytics',
   {
     amp: {
diff --git a/extensions/amp-analytics/0.1/test/vendor-requests.json b/extensions/amp-analytics/0.1/test/vendor-requests.json
index 990273740165e..c9a39c8bb67c6 100644
--- a/extensions/amp-analytics/0.1/test/vendor-requests.json
+++ b/extensions/amp-analytics/0.1/test/vendor-requests.json
@@ -1,7 +1,4 @@
 {
-  "_fake_": {
-    "endpoint": "/analytics/fake"
-  },
   "acquialift": {
     "base": "https://us-east-1-decisionapi.lift.acquia.com/capture?account_id=xxxxxxxx&site_id=xxxxxxxx",
     "basicCapture": "https://us-east-1-decisionapi.lift.acquia.com/capture?account_id=xxxxxxxx&site_id=xxxxxxxx&ident=_client_id_&identsrc=amp&es=Amp&url=_canonical_url_&rurl=_document_referrer_&cttl=_title_",
@@ -52,12 +49,15 @@
     "pageview": "//webcare.byside.com/BWA!webcareId/amp/pixel.php?webcare_id=!webcareId&bwch=!channel&lang=pt&fid=!fid&bwit=A&tuid=_client_id_&suid=&puid=_page_view_id_p_timestamp_&referrer=_document_referrer_&page=_source_url_&amppage=_ampdoc_url_&bwpt=_title_&bres=_viewport_width_x_viewport_height_&res=_screen_width_x_screen_height_&v=v20171116a&ampv=_amp_version_&viewer=_viewer_&ua=_user_agent_&r=_random_",
     "event": "//webcare.byside.com/BWA!webcareId/amp/signal.php?event_id=!eventId&event_label=!eventLabel&fields=!fields&webcare_id=!webcareId&bwch=!channel&lang=pt&fid=!fid&bwit=A&tuid=_client_id_&suid=&puid=_page_view_id_p_timestamp_&referrer=_document_referrer_&page=_source_url_&amppage=_ampdoc_url_&bwpt=_title_&bres=_viewport_width_x_viewport_height_&res=_screen_width_x_screen_height_&v=v20171116a&ampv=_amp_version_&viewer=_viewer_&ua=_user_agent_&r=_random_"
   },
+  "captainmetrics": {
+    "hit": "https://photon.captainmetrics.com/amp/?cId=_client_id_&sId=W2CX8IhWFDNI_pvEhheYkaODWeJu0zIDlM5YaCtUeKAvYaEfTW5Rhxy_13DvjsZy&ts=_timestamp_&rand=_random_&pId=!projectId&ampV=_amp_version_&v=1&lang=_browser_language_&ua=_user_agent_&res=_screen_height_x_screen_width_&aRes=_available_screen_height_x_available_screen_width_&off=_timezone_&tz=_timezone_code_&lp=_source_url_&ref=_external_referrer_&ampRef=_ampdoc_url_&pageId=_page_view_id_"
+  },
   "chartbeat": {
     "host": "https://ping.chartbeat.net",
-    "basePrefix": "/ping?h=!domain&p=_canonical_path_&u=_client_id_&d=_canonical_host_&g=!uid&g0=!sections&g1=!authors&g2=!zone&g3=!sponsorName&g4=!contentType&c=120&x=_scroll_top_&y=_scroll_height_&o=_scroll_width_&w=_viewport_height_&j=!decayTime&R=1&W=0&I=0&E=_total_engaged_time_&r=_document_referrer_&t=_page_view_id__client_id_&b=_page_load_time_&i=_title_&T=_timestamp_&tz=_timezone_&C=2",
+    "basePrefix": "/ping?h=!domain&p=_canonical_path_&u=_client_id_&d=_canonical_host_&g=!uid&g0=!sections&g1=!authors&g2=!zone&g3=!sponsorName&g4=!contentType&c=!totalTime&x=_scroll_top_&m=!maxScrollDepth&y=_scroll_height_&o=_scroll_width_&w=_viewport_height_&j=!decayTime&R=1&W=0&I=0&E=_total_engaged_time_&r=_document_referrer_&t=_page_view_id__client_id_&b=_page_load_time_&i=_title_&T=_timestamp_&tz=_timezone_&sn=1&C=2",
     "baseSuffix": "&_",
-    "interval": "https://ping.chartbeat.net/ping?h=!domain&p=_canonical_path_&u=_client_id_&d=_canonical_host_&g=!uid&g0=!sections&g1=!authors&g2=!zone&g3=!sponsorName&g4=!contentType&c=120&x=_scroll_top_&y=_scroll_height_&o=_scroll_width_&w=_viewport_height_&j=!decayTime&R=1&W=0&I=0&E=_total_engaged_time_&r=_document_referrer_&t=_page_view_id__client_id_&b=_page_load_time_&i=_title_&T=_timestamp_&tz=_timezone_&C=2&_",
-    "anchorClick": "https://ping.chartbeat.net/ping?h=!domain&p=_canonical_path_&u=_client_id_&d=_canonical_host_&g=!uid&g0=!sections&g1=!authors&g2=!zone&g3=!sponsorName&g4=!contentType&c=120&x=_scroll_top_&y=_scroll_height_&o=_scroll_width_&w=_viewport_height_&j=!decayTime&R=1&W=0&I=0&E=_total_engaged_time_&r=_document_referrer_&t=_page_view_id__client_id_&b=_page_load_time_&i=_title_&T=_timestamp_&tz=_timezone_&C=2&_"
+    "interval": "https://ping.chartbeat.net/ping?h=!domain&p=_canonical_path_&u=_client_id_&d=_canonical_host_&g=!uid&g0=!sections&g1=!authors&g2=!zone&g3=!sponsorName&g4=!contentType&c=!totalTime&x=_scroll_top_&m=!maxScrollDepth&y=_scroll_height_&o=_scroll_width_&w=_viewport_height_&j=!decayTime&R=1&W=0&I=0&E=_total_engaged_time_&r=_document_referrer_&t=_page_view_id__client_id_&b=_page_load_time_&i=_title_&T=_timestamp_&tz=_timezone_&sn=1&C=2&_",
+    "anchorClick": "https://ping.chartbeat.net/ping?h=!domain&p=_canonical_path_&u=_client_id_&d=_canonical_host_&g=!uid&g0=!sections&g1=!authors&g2=!zone&g3=!sponsorName&g4=!contentType&c=!totalTime&x=_scroll_top_&m=!maxScrollDepth&y=_scroll_height_&o=_scroll_width_&w=_viewport_height_&j=!decayTime&R=1&W=0&I=0&E=_total_engaged_time_&r=_document_referrer_&t=_page_view_id__client_id_&b=_page_load_time_&i=_title_&T=_timestamp_&tz=_timezone_&sn=1&C=2&_"
   },
   "clicky": {
     "base": "https://in.getclicky.com/in.php?site_id=!site_id",
@@ -80,6 +80,11 @@
     "base": "https://scomcluster.cxense.com/Repo/rep.gif",
     "pageview": "https://scomcluster.cxense.com/Repo/rep.gif?ver=1&typ=pgv&sid=!siteId&ckp=_client_id_&loc=_source_url_&rnd=_random_&ref=_document_referrer_&ltm=_timestamp_&wsz=_screen_width_x_screen_height_&bln=_browser_language_&chs=_document_charset_&col=_screen_color_depth_&tzo=_timezone_&cp_cx_channel=amp"
   },
+  "deepbi": {
+    "base": "https://api.deep.bi/v1/pixel/!datasetKey/p.gif?accessKey=!accessKey&gdpr=true&page_href=_source_url_&referrer_href=_document_referrer_&page_title=_title_&amp=true",
+    "pageview": "https://api.deep.bi/v1/pixel/!datasetKey/p.gif?accessKey=!accessKey&gdpr=true&page_href=_source_url_&referrer_href=_document_referrer_&page_title=_title_&amp=true&event_type=page-open",
+    "event": "https://api.deep.bi/v1/pixel/!datasetKey/p.gif?accessKey=!accessKey&gdpr=true&page_href=_source_url_&referrer_href=_document_referrer_&page_title=_title_&amp=true&event_type=event"
+  },
   "dynatrace": {
     "endpoint": "https://!tenant.live.dynatrace.com:443/ampbf/!tenantpath",
     "pageview": "https://!tenant.live.dynatrace.com:443/ampbf/!tenantpath?type=js&flavor=amp&v=1&a=1%7C1%7C_load_%7C_load_%7C-%7C_nav_timing_%7C_nav_timing_%7C0%2C2%7C2%7C_onload_%7C_load_%7C-%7C_nav_timing_%7C_nav_timing_%7C0&fId=_page_view_id_&vID=_client_id_&url=_source_url_&title=_title_&sw=_screen_width_&sh=_screen_height_&w=_viewport_width_&h=_viewport_height_&nt=a_nav_type_b_nav_timing_c_nav_timing_d_nav_timing_e_nav_timing_f_nav_timing_g_nav_timing_h_nav_timing_i_nav_timing_j_nav_timing_k_nav_timing_l_nav_timing_m_nav_timing_n_nav_timing_o_nav_timing_p_nav_timing_q_nav_timing_r_nav_timing_s_nav_timing_t_nav_timing_&app=ampapp&time=_timestamp_"
@@ -130,10 +135,10 @@
     "host": "https://www.google-analytics.com",
     "basePrefix": "v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_",
     "baseSuffix": "&a=_page_view_id_&z=_random_",
-    "pageview": "https://www.google-analytics.com/r/collect?v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_&t=pageview&jid=_random_&_r=1&a=_page_view_id_&z=_random_",
+    "pageview": "https://www.google-analytics.com/r/collect?v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_&t=pageview&jid=_random_&_r=1&a=_page_view_id_&z=_random_&aae=true",
     "event": "https://www.google-analytics.com/collect?v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_&t=event&jid=&ec=!eventCategory&ea=!eventAction&el=!eventLabel&ev=0&a=_page_view_id_&z=_random_",
     "social": "https://www.google-analytics.com/collect?v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_&t=social&jid=&sa=!socialAction&sn=!socialNetwork&st=!socialTarget&a=_page_view_id_&z=_random_",
-    "timing": "https://www.google-analytics.com/collect?v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_&t=!timingRequestType&jid=&plt=_page_load_time_&dns=_domain_lookup_time_&tcp=_tcp_connect_time_&rrt=_redirect_time_&srt=_server_response_time_&pdt=_page_download_time_&clt=_content_load_time_&dit=_dom_interactive_time_&a=_page_view_id_&z=_random_",
+    "timing": "https://www.google-analytics.com/collect?v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_&t=!timingRequestType&jid=&plt=_page_load_time_&dns=_domain_lookup_time_&tcp=_tcp_connect_time_&rrt=_redirect_time_&srt=_server_response_time_&pdt=_page_download_time_&clt=_content_load_time_&dit=_dom_interactive_time_&a=_page_view_id_&z=_random_&aae=true",
     "error": "https://www.google-analytics.com/collect?v=1&_v=a1&ds=AMP&aip&_s=1&dt=_title_&sr=_screen_width_x_screen_height_&_utmht=_timestamp_&cid=_client_id_&tid=!account&dl=_source_url_&dr=_external_referrer_&sd=_screen_color_depth_&ul=_browser_language_&de=_document_charset_&t=exception&exd=!errorName-!errorMessage&a=_page_view_id_&z=_random_"
   },
   "gtag": {
@@ -222,6 +227,12 @@
     "s2": "//collector.mediator.media/script/!mediator_id/amp/register/?url=_canonical_url_&ref=_document_referrer_&e=s2",
     "s3": "//collector.mediator.media/script/!mediator_id/amp/register/?url=_canonical_url_&ref=_document_referrer_&e=s3"
   },
+  "memo": {
+    "host": "https://elsa.memoinsights.com",
+    "baseParams": "amp=true&pid=!pid&title=_title_&url=_canonical_url_&date=!published_at&authors=!authors&referrer=_document_referrer_&page_url=_source_url_&user_id=_client_id_&domain=_canonical_host_&v=amp",
+    "visible": "https://elsa.memoinsights.com/n?amp=true&pid=!pid&title=_title_&url=_canonical_url_&date=!published_at&authors=!authors&referrer=_document_referrer_&page_url=_source_url_&user_id=_client_id_&domain=_canonical_host_&v=amp",
+    "timer": "https://elsa.memoinsights.com/t?amp=true&pid=!pid&title=_title_&url=_canonical_url_&date=!published_at&authors=!authors&referrer=_document_referrer_&page_url=_source_url_&user_id=_client_id_&domain=_canonical_host_&v=amp&t=5000&e=5000"
+  },
   "metrika": {
     "pageview": "https://mc.yandex.ru/watch/!counterId?browser-info=amp%3A1%3Az%3A_timezone_%3Ai%3A_timestamp_%3Arn%3A_random_%3Ala%3A_browser_language_%3Aen%3A_document_charset_%3Arqn%3A1%3As%3A_screen_width_x_screen_height_x_screen_color_depth_%3Aw%3A_available_screen_width_x_available_screen_height_%3Ads%3A_domain_lookup_time_%2C_tcp_connect_time_%2C_server_response_time_%2C_page_download_time_%2C_redirect_time_%2C_nav_timing_%2C_nav_redirect_count_%2C_nav_timing_%2C_nav_timing_%2C_nav_timing_%2C_page_load_time_%2C_nav_timing_%2C_content_load_time_%3Auid%3A_client_id_%3Apvid%3A_page_view_id_%3At%3A_title_&site-info=!yaParams&page-url=_source_url_&page-ref=_document_referrer_",
     "notBounce": "https://mc.yandex.ru/watch/!counterId?browser-info=ar%3A1%3Anb%3A1%3Aamp%3A1%3Az%3A_timezone_%3Ai%3A_timestamp_%3Arn%3A_random_%3Ala%3A_browser_language_%3Aen%3A_document_charset_%3Arqn%3A1%3As%3A_screen_width_x_screen_height_x_screen_color_depth_%3Aw%3A_available_screen_width_x_available_screen_height_%3Ads%3A_domain_lookup_time_%2C_tcp_connect_time_%2C_server_response_time_%2C_page_download_time_%2C_redirect_time_%2C_nav_timing_%2C_nav_redirect_count_%2C_nav_timing_%2C_nav_timing_%2C_nav_timing_%2C_page_load_time_%2C_nav_timing_%2C_content_load_time_%3Auid%3A_client_id_%3Apvid%3A_page_view_id_%3At%3A_title_&page-url=_source_url_&page-ref=_document_referrer_",
@@ -271,7 +282,7 @@
   },
   "nielsen": {
     "session": "https://!prefixuaid-linkage.imrworldwide.com/cgi-bin/gn?prd=session&c13=asid,P!apid&sessionId=_client_id___page_view_id_&pingtype=4&enc=false&c61=createtm,_timestamp_&rnd=_random_",
-    "cloudapi": "https://!prefixcloudapi.imrworldwide.com/nmapi/v2/!apid/_client_id___page_view_id_/a?b=%7B%22devInfo%22%3A%7B%22devId%22%3A%22_client_id___page_view_id_%22%2C%22apn%22%3A%22!apn%22%2C%22apv%22%3A%22!apv%22%2C%22apid%22%3A%22!apid%22%7D%2C%22metadata%22%3A%7B%22static%22%3A%7B%22type%22%3A%22static%22%2C%22section%22%3A%22!section%22%2C%22assetid%22%3A%22_page_view_id_%22%2C%22segA%22%3A%22!segA%22%2C%22segB%22%3A%22!segB%22%2C%22segC%22%3A%22!segC%22%2C%22adModel%22%3A%220%22%2C%22dataSrc%22%3A%22cms%22%7D%2C%22content%22%3A%7B%7D%2C%22ad%22%3A%7B%7D%7D%2C%22event%22%3A%22playhead%22%2C%22position%22%3A%22_timestamp_%22%2C%22data%22%3A%7B%22hidden%22%3A%22_background_state_%22%2C%22blur%22%3A%22_background_state_%22%2C%22position%22%3A%22_timestamp_%22%7D%2C%22type%22%3A%22static%22%2C%22utc%22%3A%22_timestamp_%22%2C%22index%22%3A%221%22%2C%22pageURL%22%3A%22_canonical_url_%22%7D"
+    "cloudapi": "https://!prefixcloudapi.imrworldwide.com/nmapi/v2/!apid/_client_id___page_view_id_/a?b=%7B%22devInfo%22%3A%7B%22devId%22%3A%22_client_id___page_view_id_%22%2C%22apn%22%3A%22!apn%22%2C%22apv%22%3A%22!apv%22%2C%22apid%22%3A%22!apid%22%7D%2C%22metadata%22%3A%7B%22static%22%3A%7B%22type%22%3A%22static%22%2C%22section%22%3A%22!section%22%2C%22assetid%22%3A%22_page_view_id_%22%2C%22segA%22%3A%22!segA%22%2C%22segB%22%3A%22!segB%22%2C%22segC%22%3A%22!segC%22%2C%22adModel%22%3A%220%22%2C%22dataSrc%22%3A%22cms%22%7D%2C%22content%22%3A%7B%7D%2C%22ad%22%3A%7B%7D%7D%2C%22event%22%3A%22playhead%22%2C%22position%22%3A%22_timestamp_%22%2C%22data%22%3A%7B%22hidden%22%3A%22_background_state_%22%2C%22blur%22%3A%22_background_state_%22%2C%22position%22%3A%22_timestamp_%22%7D%2C%22type%22%3A%22static%22%2C%22utc%22%3A%22_timestamp_%22%2C%22index%22%3A%221%22%2C%22pageURL%22%3A%22_ampdoc_url_%22%7D"
   },
   "nielsen-marketing-cloud": {
     "host": "loadeu.exelator.com",
@@ -348,6 +359,12 @@
     "conversion_params": "&hbt=1&pvid=_page_view_id_&asurl=_source_url_&ash=_scroll_height_&asnh=_screen_height_&aasnh=_available_screen_height_&avh=_viewport_height_&ast=_scroll_top_&atet=_total_engaged_time_",
     "conversion": "https://adserver.pressboard.ca/track/attention-amp?&amp=1&url=_canonical_url_&referrer=_document_referrer_&ts=_timestamp_&ua=_user_agent_&rand=_random_&uid=_client_id_&mid=!mediaId&cid=!campaignId&sid=!storyRequestId&geoid=!geoNameId&cn=!country&rg=!region&ct=!city&dbi=!dbInstance&tz=!timeZoneOffset&hbt=1&pvid=_page_view_id_&asurl=_source_url_&ash=_scroll_height_&asnh=_screen_height_&aasnh=_available_screen_height_&avh=_viewport_height_&ast=_scroll_top_&atet=_total_engaged_time_"
   },
+  "subscriptions-propensity": {
+    "baseParams": "u_tz=240&v=1&cookie=_client_id_&cdm=!sourceHostName&_amp_source_origin=_source_host_&extrainfo=",
+    "sendBase": "https://pubads.g.doubleclick.net/subopt/data?u_tz=240&v=1&cookie=_client_id_&cdm=!sourceHostName&_amp_source_origin=_source_host_&extrainfo=",
+    "sendEvent": "https://pubads.g.doubleclick.net/subopt/data?u_tz=240&v=1&cookie=_client_id_&cdm=!sourceHostName&_amp_source_origin=_source_host_&extrainfo=!data&events=!publicationId%3A!event",
+    "sendSubscriptionState": "https://pubads.g.doubleclick.net/subopt/data?u_tz=240&v=1&cookie=_client_id_&cdm=!sourceHostName&_amp_source_origin=_source_host_&extrainfo=%7B%22product%22%3A%20%5B!products%5D%7D&states=!publicationId%3A!state"
+  },
   "quantcast": {
     "host": "https://pixel.quantserve.com/pixel",
     "pageview": "https://pixel.quantserve.com/pixel;r=_random_;a=!pcode;labels=!labels;fpan=;fpa=_client_id_;ns=0;ce=1;cm=;je=0;sr=_screen_width_x_screen_height_x_screen_color_depth_;enc=n;et=_timestamp_;ref=_document_referrer_;url=_canonical_url_"
@@ -395,6 +412,13 @@
     "pageView": "https://!collectorHost/i?url=_canonical_url_&page=_title_&res=_screen_width_x_screen_height_&stm=_timestamp_&tz=_timezone_code_&aid=!appId&p=web&tv=amp-0.3&cd=_screen_color_depth_&cs=_document_charset_&duid=_client_id_&lang=_browser_language_&refr=_document_referrer_&vp=_viewport_width_x_viewport_height_&ds=_scroll_width_x_scroll_height_&e=pv",
     "structEvent": "https://!collectorHost/i?url=_canonical_url_&page=_title_&res=_screen_width_x_screen_height_&stm=_timestamp_&tz=_timezone_code_&aid=!appId&p=web&tv=amp-0.3&cd=_screen_color_depth_&cs=_document_charset_&duid=_client_id_&lang=_browser_language_&refr=_document_referrer_&vp=_viewport_width_x_viewport_height_&ds=_scroll_width_x_scroll_height_&e=se&se_ca=!structEventCategory&se_ac=!structEventAction&se_la=!structEventLabel&se_pr=!structEventProperty&se_va=!structEventValue"
   },
+  "snowplow_v2": {
+    "basePrefix": "https://!collectorHost/i?p=web&tv=amp-1.0.0&url=_ampdoc_url_&page=_title_&res=_screen_width_x_screen_height_&dtm=_timestamp_&tz=_timezone_code_&aid=!appId&cd=_screen_color_depth_&cs=_document_charset_&lang=_browser_language_&refr=_document_referrer_&vp=_viewport_width_x_viewport_height_&ua=_user_agent_&ds=_scroll_width_x_scroll_height_&uid=!userId&co=%7B%22schema%22%3A%22iglu%3Acom.snowplowanalytics.snowplow%2Fcontexts%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%5B%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_id%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampClientId%22%3A%22_client_id_%22%2C%20%22domainUserid%22%3A%20%22_query_param_%22%2C%20%22userId%22%3A%20%22!userId%22%7D%7D%2C!customContexts%2C%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_web_page%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampPageViewId%22%3A%22_page_view_id_64_%22%7D%7D%5D%7D",
+    "pageView": "https://!collectorHost/i?p=web&tv=amp-1.0.0&e=pv&url=_ampdoc_url_&page=_title_&res=_screen_width_x_screen_height_&dtm=_timestamp_&tz=_timezone_code_&aid=!appId&cd=_screen_color_depth_&cs=_document_charset_&lang=_browser_language_&refr=_document_referrer_&vp=_viewport_width_x_viewport_height_&ua=_user_agent_&ds=_scroll_width_x_scroll_height_&uid=!userId&co=%7B%22schema%22%3A%22iglu%3Acom.snowplowanalytics.snowplow%2Fcontexts%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%5B%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_id%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampClientId%22%3A%22_client_id_%22%2C%20%22domainUserid%22%3A%20%22_query_param_%22%2C%20%22userId%22%3A%20%22!userId%22%7D%7D%2C!customContexts%2C%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_web_page%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampPageViewId%22%3A%22_page_view_id_64_%22%7D%7D%5D%7D",
+    "structEvent": "https://!collectorHost/i?p=web&tv=amp-1.0.0&e=se&se_ca=!structEventCategory&se_ac=!structEventAction&se_la=!structEventLabel&se_pr=!structEventProperty&se_va=!structEventValue&url=_ampdoc_url_&page=_title_&res=_screen_width_x_screen_height_&dtm=_timestamp_&tz=_timezone_code_&aid=!appId&cd=_screen_color_depth_&cs=_document_charset_&lang=_browser_language_&refr=_document_referrer_&vp=_viewport_width_x_viewport_height_&ua=_user_agent_&ds=_scroll_width_x_scroll_height_&uid=!userId&co=%7B%22schema%22%3A%22iglu%3Acom.snowplowanalytics.snowplow%2Fcontexts%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%5B%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_id%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampClientId%22%3A%22_client_id_%22%2C%20%22domainUserid%22%3A%20%22_query_param_%22%2C%20%22userId%22%3A%20%22!userId%22%7D%7D%2C!customContexts%2C%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_web_page%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampPageViewId%22%3A%22_page_view_id_64_%22%7D%7D%5D%7D",
+    "pagePing": "https://!collectorHost/i?p=web&tv=amp-1.0.0&e=pp&pp_mix=_scroll_left_&pp_miy=_scroll_top_&url=_ampdoc_url_&page=_title_&res=_screen_width_x_screen_height_&dtm=_timestamp_&tz=_timezone_code_&aid=!appId&cd=_screen_color_depth_&cs=_document_charset_&lang=_browser_language_&refr=_document_referrer_&vp=_viewport_width_x_viewport_height_&ua=_user_agent_&ds=_scroll_width_x_scroll_height_&uid=!userId&co=%7B%22schema%22%3A%22iglu%3Acom.snowplowanalytics.snowplow%2Fcontexts%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%5B%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_id%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampClientId%22%3A%22_client_id_%22%2C%20%22domainUserid%22%3A%20%22_query_param_%22%2C%20%22userId%22%3A%20%22!userId%22%7D%7D%2C!customContexts%2C%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_web_page%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampPageViewId%22%3A%22_page_view_id_64_%22%7D%7D%5D%7D",
+    "selfDescribingEvent": "https://!collectorHost/i?p=web&tv=amp-1.0.0&e=ue&ue_pr=%7B%22schema%22%3A%22iglu%3Acom.snowplowanalytics.snowplow%2Funstruct_event%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22schema%22%3A%22iglu%3A!customEventSchemaVendor%2F!customEventSchemaName%2Fjsonschema%2F!customEventSchemaVersion%22%2C%22data%22%3A!customEventSchemaData%7D%7D&url=_ampdoc_url_&page=_title_&res=_screen_width_x_screen_height_&dtm=_timestamp_&tz=_timezone_code_&aid=!appId&cd=_screen_color_depth_&cs=_document_charset_&lang=_browser_language_&refr=_document_referrer_&vp=_viewport_width_x_viewport_height_&ua=_user_agent_&ds=_scroll_width_x_scroll_height_&uid=!userId&co=%7B%22schema%22%3A%22iglu%3Acom.snowplowanalytics.snowplow%2Fcontexts%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%5B%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_id%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampClientId%22%3A%22_client_id_%22%2C%20%22domainUserid%22%3A%20%22_query_param_%22%2C%20%22userId%22%3A%20%22!userId%22%7D%7D%2C!customContexts%2C%7B%22schema%22%3A%22iglu%3Adev.amp.snowplow%2Famp_web_page%2Fjsonschema%2F1-0-0%22%2C%22data%22%3A%7B%22ampPageViewId%22%3A%22_page_view_id_64_%22%7D%7D%5D%7D"
+  },
   "teaanalytics": {
     "domain": "https://!channel/v1/amp",
     "commonParams": "user.user_unique_id=_client_id_&header.app_id=!app_id&header.language=_browser_language_&header.screen_height=_screen_height_&header.screen_width=_screen_width_&header.resolution=_screen_height_x_screen_width_&header.tz_offset=_timezone_&header.tz_name=_timezone_code_&header.referrer=_document_referrer_&header.custom.user_agent=_user_agent_&event.local_time_ms=_timestamp_&event.params._staging_flag=!debug&verbose=!debug",
@@ -440,10 +464,16 @@
   "upscore": {
     "host": "https://hit-pool.upscore.com/amp?",
     "basePrefix": "u_id=_client_id_&hit_id=_page_view_id_&scTop=_scroll_top_&scHeight=_scroll_height_&vHeight=_viewport_height_&domain=!domain&load=_dom_interactive_time_&timespent=_total_engaged_time_",
-    "initialHit": "author=!author&creator=!creator&o_id=!object_id&o_type=!object_type&pubdate=!pubdate&ref=_document_referrer_&section=!section&url=_ampdoc_url_&agent=_user_agent_&location=_amp_geo_",
+    "initialHit": "author=!author&creator=!creator&o_id=!object_id&o_type=!object_type&pubdate=!pubdate&ref=_document_referrer_&section=!section&url=_canonical_url_&agent=_user_agent_&location=_amp_geo_&c_keys=!customKeys&c_values=!customValues",
     "finalbeat": "https://hit-pool.upscore.com/amp?u_id=_client_id_&hit_id=_page_view_id_&scTop=_scroll_top_&scHeight=_scroll_height_&vHeight=_viewport_height_&domain=!domain&load=_dom_interactive_time_&timespent=_total_engaged_time_&type=final",
     "heartbeat": "https://hit-pool.upscore.com/amp?u_id=_client_id_&hit_id=_page_view_id_&scTop=_scroll_top_&scHeight=_scroll_height_&vHeight=_viewport_height_&domain=!domain&load=_dom_interactive_time_&timespent=_total_engaged_time_&type=pulse",
-    "pageview": "https://hit-pool.upscore.com/amp?u_id=_client_id_&hit_id=_page_view_id_&scTop=_scroll_top_&scHeight=_scroll_height_&vHeight=_viewport_height_&domain=!domain&load=_dom_interactive_time_&timespent=_total_engaged_time_&author=!author&creator=!creator&o_id=!object_id&o_type=!object_type&pubdate=!pubdate&ref=_document_referrer_&section=!section&url=_ampdoc_url_&agent=_user_agent_&location=_amp_geo_&type=init"
+    "pageview": "https://hit-pool.upscore.com/amp?u_id=_client_id_&hit_id=_page_view_id_&scTop=_scroll_top_&scHeight=_scroll_height_&vHeight=_viewport_height_&domain=!domain&load=_dom_interactive_time_&timespent=_total_engaged_time_&author=!author&creator=!creator&o_id=!object_id&o_type=!object_type&pubdate=!pubdate&ref=_document_referrer_&section=!section&url=_canonical_url_&agent=_user_agent_&location=_amp_geo_&c_keys=!customKeys&c_values=!customValues&type=init",
+    "videoBase": "https://hit-pool.upscore.com/amp?url=_canonical_url_&video_id=!video_id",
+    "videoTime": "ct=!currentTime&d=!duration",
+    "video-play": "https://hit-pool.upscore.com/amp?url=_canonical_url_&video_id=!video_id&e=video_start&ct=!currentTime&d=!duration&video_name=!video_name&video_thumb=!video_thumbnail",
+    "video-pause": "https://hit-pool.upscore.com/amp?url=_canonical_url_&video_id=!video_id&e=video_pause&ct=!currentTime&d=!duration",
+    "video-stop": "https://hit-pool.upscore.com/amp?url=_canonical_url_&video_id=!video_id&e=video_stop&ct=!currentTime&d=!duration",
+    "video-info": "https://hit-pool.upscore.com/amp?url=_canonical_url_&video_id=!video_id&e=video_position&ct=!currentTime&d=!duration"
   },
   "vponanalytics": {
     "host": "<ignore for test>",
diff --git a/extensions/amp-analytics/0.1/transport.js b/extensions/amp-analytics/0.1/transport.js
index 71235824b9d02..1e488dfaf720e 100644
--- a/extensions/amp-analytics/0.1/transport.js
+++ b/extensions/amp-analytics/0.1/transport.js
@@ -21,7 +21,7 @@ import {
   TransportSerializers,
   defaultSerializer,
 } from './transport-serializer';
-import {IframeTransport, getIframeTransportScriptUrl} from './iframe-transport';
+import {IframeTransport} from './iframe-transport';
 import {Services} from '../../../src/services';
 import {WindowInterface} from '../../../src/window-interface';
 import {
@@ -36,6 +36,7 @@ import {getMode} from '../../../src/mode';
 import {getTopWindow} from '../../../src/service';
 import {loadPromise} from '../../../src/event-helper';
 import {removeElement} from '../../../src/dom';
+import {toWin} from '../../../src/types';
 import {toggle} from '../../../src/style';
 
 /** @const {string} */
@@ -146,30 +147,27 @@ export class Transport {
    * user navigates/swipes away from the page, and is recreated if the user
    * navigates back to the page.
    *
-   * @param {!Window} win
    * @param {!Element} element
-   * @param {(!../../../src/preconnect.Preconnect)=} opt_preconnect
    */
-  maybeInitIframeTransport(win, element, opt_preconnect) {
+  maybeInitIframeTransport(element) {
     if (!this.options_['iframe'] || this.iframeTransport_) {
       return;
     }
-    if (opt_preconnect) {
-      opt_preconnect.preload(getIframeTransportScriptUrl(win), 'script');
-    }
 
+    // In the case of FIE rendering, we should be using the parent doc win.
+    const topWin = getTopWindow(toWin(element.ownerDocument.defaultView));
     const type = element.getAttribute('type');
     // In inabox there is no amp-ad element.
     const ampAdResourceId = this.isInabox_
       ? '1'
       : user().assertString(
-          getAmpAdResourceId(element, getTopWindow(win)),
+          getAmpAdResourceId(element, topWin),
           'No friendly amp-ad ancestor element was found ' +
             'for amp-analytics tag with iframe transport.'
         );
 
     this.iframeTransport_ = new IframeTransport(
-      win,
+      topWin,
       type,
       this.options_,
       ampAdResourceId
diff --git a/extensions/amp-analytics/0.1/variables.js b/extensions/amp-analytics/0.1/variables.js
index 89e1d150d182e..224ed63995886 100644
--- a/extensions/amp-analytics/0.1/variables.js
+++ b/extensions/amp-analytics/0.1/variables.js
@@ -223,7 +223,7 @@ export class VariableService {
         cookieReader(this.ampdoc_.win, dev().assertElement(element), name),
       'CONSENT_STATE': getConsentStateStr(element),
     };
-    const merged = Object.assign({}, this.macros_, elementMacros);
+    const merged = {...this.macros_, ...elementMacros};
     return /** @type {!JsonObject} */ (merged);
   }
 
@@ -277,14 +277,15 @@ export class VariableService {
       let value = options.getVar(name);
 
       if (typeof value == 'string') {
-        value = this.expandTemplateSync(
-          value,
-          new ExpansionOptions(
-            options.vars,
-            options.iterations - 1,
-            true /* noEncode */
-          )
-        );
+        value = this.expandValue_(value, options);
+      } else if (isArray(value)) {
+        // Treat each value as a template and expand
+        for (let i = 0; i < value.length; i++) {
+          value[i] =
+            typeof value[i] == 'string'
+              ? this.expandValue_(value[i], options)
+              : value[i];
+        }
       }
 
       if (!options.noEncode) {
@@ -297,6 +298,22 @@ export class VariableService {
     });
   }
 
+  /**
+   * @param {string} value
+   * @param {!ExpansionOptions} options
+   * @return {string}
+   */
+  expandValue_(value, options) {
+    return this.expandTemplateSync(
+      value,
+      new ExpansionOptions(
+        options.vars,
+        options.iterations - 1,
+        true /* noEncode */
+      )
+    );
+  }
+
   /**
    * @param {string} value
    * @return {!Promise<string>}
diff --git a/extensions/amp-analytics/0.1/vendors.js b/extensions/amp-analytics/0.1/vendors.js
index c89f495041395..06bed443e28cc 100644
--- a/extensions/amp-analytics/0.1/vendors.js
+++ b/extensions/amp-analytics/0.1/vendors.js
@@ -38,11 +38,13 @@ import {BAIDUANALYTICS_CONFIG} from './vendors/baiduanalytics';
 import {BG_CONFIG} from './vendors/bg';
 import {BURT_CONFIG} from './vendors/burt';
 import {BYSIDE_CONFIG} from './vendors/byside';
+import {CAPTAINMETRICS_CONFIG} from './vendors/captainmetrics';
 import {CHARTBEAT_CONFIG} from './vendors/chartbeat';
 import {CLICKY_CONFIG} from './vendors/clicky';
 import {COLANALYTICS_CONFIG} from './vendors/colanalytics';
 import {COMSCORE_CONFIG} from './vendors/comscore';
 import {CXENSE_CONFIG} from './vendors/cxense';
+import {DEEPBI_CONFIG} from './vendors/deepbi';
 import {DYNATRACE_CONFIG} from './vendors/dynatrace';
 import {EPICA_CONFIG} from './vendors/epica';
 import {EULERIANANALYTICS_CONFIG} from './vendors/euleriananalytics';
@@ -63,6 +65,7 @@ import {MARINSOFTWARE_CONFIG} from './vendors/marinsoftware';
 import {MEDIAMETRIE_CONFIG} from './vendors/mediametrie';
 import {MEDIARITHMICS_CONFIG} from './vendors/mediarithmics';
 import {MEDIATOR_CONFIG} from './vendors/mediator';
+import {MEMO_CONFIG} from './vendors/memo';
 import {METRIKA_CONFIG} from './vendors/metrika';
 import {MOAT_CONFIG} from './vendors/moat';
 import {MOBIFY_CONFIG} from './vendors/mobify';
@@ -89,6 +92,8 @@ import {SEGMENT_CONFIG} from './vendors/segment';
 import {SHINYSTAT_CONFIG} from './vendors/shinystat';
 import {SIMPLEREACH_CONFIG} from './vendors/simplereach';
 import {SNOWPLOW_CONFIG} from './vendors/snowplow';
+import {SNOWPLOW_V2_CONFIG} from './vendors/snowplow_v2';
+import {SUBSCRIPTIONS_PROPENSITY_CONFIG} from './vendors/subscriptions-propensity';
 import {TEAANALYTICS_CONFIG} from './vendors/teaanalytics';
 import {TEALIUMCOLLECT_CONFIG} from './vendors/tealiumcollect';
 import {TOP100_CONFIG} from './vendors/top100';
@@ -112,7 +117,6 @@ const DEFAULT_CONFIG = jsonLiteral({
     'ampGeo': 'AMP_GEO',
     'ampState': 'AMP_STATE',
     'ampVersion': 'AMP_VERSION',
-    'ancestorOrigin': 'ANCESTOR_ORIGIN',
     'authdata': 'AUTHDATA',
     'availableScreenHeight': 'AVAILABLE_SCREEN_HEIGHT',
     'availableScreenWidth': 'AVAILABLE_SCREEN_WIDTH',
@@ -194,11 +198,13 @@ export const ANALYTICS_CONFIG = ANALYTICS_VENDOR_SPLIT
       'bg': includeJsonLiteral(BG_CONFIG),
       'burt': includeJsonLiteral(BURT_CONFIG),
       'byside': includeJsonLiteral(BYSIDE_CONFIG),
+      'captainmetrics': includeJsonLiteral(CAPTAINMETRICS_CONFIG),
       'chartbeat': includeJsonLiteral(CHARTBEAT_CONFIG),
       'clicky': includeJsonLiteral(CLICKY_CONFIG),
       'colanalytics': includeJsonLiteral(COLANALYTICS_CONFIG),
       'comscore': includeJsonLiteral(COMSCORE_CONFIG),
       'cxense': includeJsonLiteral(CXENSE_CONFIG),
+      'deepbi': includeJsonLiteral(DEEPBI_CONFIG),
       'dynatrace': includeJsonLiteral(DYNATRACE_CONFIG),
       'epica': includeJsonLiteral(EPICA_CONFIG),
       'euleriananalytics': includeJsonLiteral(EULERIANANALYTICS_CONFIG),
@@ -219,6 +225,7 @@ export const ANALYTICS_CONFIG = ANALYTICS_VENDOR_SPLIT
       'mediametrie': includeJsonLiteral(MEDIAMETRIE_CONFIG),
       'mediarithmics': includeJsonLiteral(MEDIARITHMICS_CONFIG),
       'mediator': includeJsonLiteral(MEDIATOR_CONFIG),
+      'memo': includeJsonLiteral(MEMO_CONFIG),
       'metrika': includeJsonLiteral(METRIKA_CONFIG),
       'moat': includeJsonLiteral(MOAT_CONFIG),
       'mobify': includeJsonLiteral(MOBIFY_CONFIG),
@@ -241,6 +248,9 @@ export const ANALYTICS_CONFIG = ANALYTICS_VENDOR_SPLIT
       'piano': includeJsonLiteral(PIANO_CONFIG),
       'pinpoll': includeJsonLiteral(PINPOLL_CONFIG),
       'pressboard': includeJsonLiteral(PRESSBOARD_CONFIG),
+      'subscriptions-propensity': includeJsonLiteral(
+        SUBSCRIPTIONS_PROPENSITY_CONFIG
+      ),
       'quantcast': includeJsonLiteral(QUANTCAST_CONFIG),
       'retargetly': includeJsonLiteral(RETARGETLY_CONFIG),
       'rakam': includeJsonLiteral(RAKAM_CONFIG),
@@ -249,6 +259,7 @@ export const ANALYTICS_CONFIG = ANALYTICS_VENDOR_SPLIT
       'shinystat': includeJsonLiteral(SHINYSTAT_CONFIG),
       'simplereach': includeJsonLiteral(SIMPLEREACH_CONFIG),
       'snowplow': includeJsonLiteral(SNOWPLOW_CONFIG),
+      'snowplow_v2': includeJsonLiteral(SNOWPLOW_V2_CONFIG),
       'teaanalytics': includeJsonLiteral(TEAANALYTICS_CONFIG),
       'tealiumcollect': includeJsonLiteral(TEALIUMCOLLECT_CONFIG),
       'top100': includeJsonLiteral(TOP100_CONFIG),
@@ -291,11 +302,10 @@ function mergeIframeTransportConfig(config, iframeTransportConfig) {
   for (const vendor in iframeTransportConfig) {
     if (hasOwn(iframeTransportConfig, vendor)) {
       const url = iframeTransportConfig[vendor];
-      config[vendor]['transport'] = Object.assign(
-        {},
-        config[vendor]['transport'],
-        {'iframe': url}
-      );
+      config[vendor]['transport'] = {
+        ...config[vendor]['transport'],
+        'iframe': url,
+      };
     }
   }
 }
diff --git a/extensions/amp-analytics/0.1/vendors/_fake_.json b/extensions/amp-analytics/0.1/vendors/_fake_.json
new file mode 100644
index 0000000000000..2487668228ce3
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/_fake_.json
@@ -0,0 +1,35 @@
+{
+  "requests": {
+    "endpoint": "/analytics/fake"
+  },
+  "transport": {
+    "useBody": true
+  },
+  "triggers": {
+    "view": {
+      "on": "visible",
+      "request": "endpoint"
+    }
+  },
+  "configRewriter": {
+    "url": "/analytics/rewriter",
+    "varGroups": {
+      "feature1": {
+        "dr": "DOCUMENT_REFERRER",
+        "su": "SOURCE_URL"
+      },
+      "feature2": {
+        "name": "cats",
+        "title": "TITLE"
+      },
+      "alwaysOnFeature": {
+        "title2": "TITLE",
+        "enabled": true
+      }
+    }
+  },
+  "vars": {
+    "clientId": "CLIENT_ID(_fake_)",
+    "dataSource": "AMP"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/acquialift.json b/extensions/amp-analytics/0.1/vendors/acquialift.json
new file mode 100644
index 0000000000000..52bc3f58d2883
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/acquialift.json
@@ -0,0 +1,24 @@
+{
+  "vars": {
+    "decisionApiUrl": "us-east-1-decisionapi.lift.acquia.com",
+    "accountId": "xxxxxxxx",
+    "siteId": "xxxxxxxx"
+  },
+  "transport": {
+    "beacon": true,
+    "xhrpost": true,
+    "image": false
+  },
+  "requests": {
+    "base": "https://${decisionApiUrl}/capture?account_id=${accountId}&site_id=${siteId}",
+    "basicCapture": "${base}&ident=${clientId(tc_ptid)}&identsrc=amp&es=Amp&url=${canonicalUrl}&rurl=${documentReferrer}&cttl=${title}",
+    "pageview": "${basicCapture}&en=Content View",
+    "click": "${basicCapture}&en=Click-Through"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/adobeanalytics.json b/extensions/amp-analytics/0.1/vendors/adobeanalytics.json
new file mode 100644
index 0000000000000..7754dfae6290d
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/adobeanalytics.json
@@ -0,0 +1,21 @@
+{
+  "transport": {
+    "xhrpost": false,
+    "beacon": false,
+    "image": true
+  },
+  "vars": {
+    "pageName": "TITLE",
+    "host": "",
+    "reportSuites": "",
+    "linkType": "o",
+    "linkUrl": "",
+    "linkName": ""
+  },
+  "requests": {
+    "requestPath": "/b/ss/${reportSuites}/0/amp-1.0/s${random}",
+    "basePrefix": "vid=z${clientId(adobe_amp_id)}&ndh=0&ce=${documentCharset}&pageName=${pageName}&g=${ampdocUrl}&r=${documentReferrer}&bh=${availableScreenHeight}&bw=${availableScreenWidth}&c=${screenColorDepth}&j=amp&s=${screenWidth}x${screenHeight}",
+    "pageview": "https://${host}${requestPath}?${basePrefix}",
+    "click": "https://${host}${requestPath}?${basePrefix}&pe=lnk_${linkType}&pev1=${linkUrl}&pev2=${linkName}"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/adobeanalytics_nativeConfig.json b/extensions/amp-analytics/0.1/vendors/adobeanalytics_nativeConfig.json
new file mode 100644
index 0000000000000..0b6b56838bd6e
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/adobeanalytics_nativeConfig.json
@@ -0,0 +1,9 @@
+{
+  "triggers": {
+    "pageLoad": {
+      "on": "visible",
+      "request": "iframeMessage",
+      "iframePing": true
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/afsanalytics.json b/extensions/amp-analytics/0.1/vendors/afsanalytics.json
new file mode 100644
index 0000000000000..df2c602a6f80c
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/afsanalytics.json
@@ -0,0 +1,25 @@
+{
+  "vars": {
+    "server": "www",
+    "websiteid": "xxxxxxxx",
+    "event": "click",
+    "clicklabel": "clicked from AMP page"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "requests": {
+    "host": "//${server}.afsanalytics.com",
+    "base": "${host}/cgi_bin/",
+    "pageview": "${base}connect.cgi?usr=${websiteid}Pauto&js=1&amp=1&title=${title}&url=${canonicalUrl}&refer=${documentReferrer}&resolution=${screenWidth}x${screenHeight}&color=${screenColorDepth}&Tips=${random}",
+    "click": "${base}click.cgi?usr=${websiteid}&event=${event}&exit=${clicklabel}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/alexametrics.json b/extensions/amp-analytics/0.1/vendors/alexametrics.json
new file mode 100644
index 0000000000000..e044649a85a48
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/alexametrics.json
@@ -0,0 +1,22 @@
+{
+  "requests": {
+    "base": "https://${ampAtrkHost}/atrk.gif?account=${atrk_acct}&domain=${domain}",
+    "pageview": "${base}&jsv=amp-${ampVersion}&frame_height=${viewportHeight}&frame_width=${viewportWidth}&title=${title}&time=${timestamp}&time_zone_offset=${timezone}&screen_params=${screenWidth}x${screenHeight}x${screenColorDepth}&ref_url=${documentReferrer}&host_url=${sourceUrl}&random_number=${random}&user_cookie=${clientId(__auc)}&user_cookie_flag=0&user_lang=${browserLanguage}&amp_doc_url=${ampdocUrl}"
+  },
+  "vars": {
+    "atrk_acct": "",
+    "domain": "",
+    "ampAtrkHost": "certify-amp.alexametrics.com"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "xhrpost": false,
+    "beacon": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/amplitude.json b/extensions/amp-analytics/0.1/vendors/amplitude.json
new file mode 100644
index 0000000000000..183bb3560d399
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/amplitude.json
@@ -0,0 +1,38 @@
+{
+  "transport": {
+    "beacon": true,
+    "xhrpost": true,
+    "useBody": true,
+    "image": false
+  },
+  "vars": {
+    "deviceId": "CLIENT_ID(amplitude_amp_id)"
+  },
+  "requests": {
+    "host": "https://api.amplitude.com",
+    "event": {
+      "baseUrl": "${host}/amp/event"
+    }
+  },
+  "extraUrlParams": {
+    "api_key": "${apiKey}",
+    "device_id": "${deviceId}",
+    "library": "amp/${ampVersion}",
+    "time": "${timestamp}",
+    "language": "${browserLanguage}",
+    "user_agent": "${userAgent}"
+  },
+  "linkers": {
+    "amplitude": {
+      "ids": {
+        "amplitude_amp_id": "${deviceId}"
+      },
+      "proxyOnly": false
+    }
+  },
+  "cookies": {
+    "amplitude_amp_id": {
+      "value": "LINKER_PARAM(amplitude, amplitude_amp_id)"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/atinternet.json b/extensions/amp-analytics/0.1/vendors/atinternet.json
new file mode 100644
index 0000000000000..ce4fd2b0bbdb4
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/atinternet.json
@@ -0,0 +1,17 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "vars": {
+    "pixelPath": "hit.xiti",
+    "domain": ".xiti.com"
+  },
+  "requests": {
+    "base": "https://${log}${domain}/${pixelPath}?s=${site}&ts=${timestamp}&r=${screenWidth}x${screenHeight}x${screenColorDepth}&re=${availableScreenWidth}x${availableScreenHeight}",
+    "suffix": "&medium=amp&${extraUrlParams}&ref=${documentReferrer}",
+    "pageview": "${base}&p=${title}&s2=${level2}${suffix}",
+    "click": "${base}&pclick=${title}&s2click=${level2}&p=${label}&s2=${level2Click}&type=click&click=${type}${suffix}"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/baiduanalytics.json b/extensions/amp-analytics/0.1/vendors/baiduanalytics.json
new file mode 100644
index 0000000000000..7da1b82e3aa8f
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/baiduanalytics.json
@@ -0,0 +1,13 @@
+{
+  "requests": {
+    "host": "https://hm.baidu.com",
+    "base": "${host}/hm.gif?si=${token}&nv=0&st=4&v=pixel-1.0&rnd=${timestamp}",
+    "pageview": "${base}&et=0",
+    "event": "${base}&ep=${category}*${action}*${label}*${value}&et=4&api=8_0"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/bg.canary.json b/extensions/amp-analytics/0.1/vendors/bg.canary.json
new file mode 100644
index 0000000000000..0cb688e226132
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/bg.canary.json
@@ -0,0 +1,5 @@
+{
+  "transport": {
+    "iframe": "https://tpc.googlesyndication.com/b4a/experimental/b4a-runner.html"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/bg.json b/extensions/amp-analytics/0.1/vendors/bg.json
new file mode 100644
index 0000000000000..79d59f1572761
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/bg.json
@@ -0,0 +1,5 @@
+{
+  "transport": {
+    "iframe": "https://tpc.googlesyndication.com/b4a/b4a-runner.html"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/burt.json b/extensions/amp-analytics/0.1/vendors/burt.json
new file mode 100644
index 0000000000000..e3402482af005
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/burt.json
@@ -0,0 +1,32 @@
+{
+  "vars": {
+    "trackingKey": "ignore",
+    "category": "",
+    "subCategory": ""
+  },
+  "requests": {
+    "host": "//${trackingKey}.c.richmetrics.com/",
+    "base": "${host}imglog?e=${trackingKey}&pi=${trackingKey}|${pageViewId}|${canonicalPath}|${clientId(burt-amp-user-id)}&ui=${clientId(burt-amp-user-id)}&v=amp&ts=${timestamp}&sn=${requestCount}&",
+    "pageview": "${base}type=page&ca=${category}&sc=${subCategory}&ln=${browserLanguage}&lr=${documentReferrer}&eu=${sourceUrl}&tz=${timezone}&pd=${scrollWidth}x${scrollHeight}&sd=${screenWidth}x${screenHeight}&wd=${availableScreenWidth}x${availableScreenHeight}&ws=${scrollLeft}x${scrollTop}",
+    "pageping": "${base}type=pageping"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "pageping": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 15,
+        "maxTimerLength": 1200
+      },
+      "request": "pageping"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/byside.json b/extensions/amp-analytics/0.1/vendors/byside.json
new file mode 100644
index 0000000000000..278adc72d7ab2
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/byside.json
@@ -0,0 +1,47 @@
+{
+  "vars": {
+    "webcareZone": "webcare",
+    "webcareId": "",
+    "channel": "",
+    "fid": "",
+    "lang": "pt"
+  },
+  "requests": {
+    "host": "//${webcareZone}.byside.com/",
+    "base": "${host}BWA${webcareId}/amp/",
+    "pageview": "${base}pixel.php",
+    "event": "${base}signal.php?event_id=${eventId}&event_label=${eventLabel}&fields=${fields}"
+  },
+  "extraUrlParams": {
+    "webcare_id": "${webcareId}",
+    "bwch": "${channel}",
+    "lang": "${lang}",
+    "fid": "${fid}",
+    "bwit": "A",
+    "tuid": "${clientId(byside_webcare_tuid)}",
+    "suid": "",
+    "puid": "${pageViewId}p${timestamp}",
+    "referrer": "${documentReferrer}",
+    "page": "${sourceUrl}",
+    "amppage": "${ampdocUrl}",
+    "bwpt": "${title}",
+    "bres": "${viewportWidth}x${viewportHeight}",
+    "res": "${screenWidth}x${screenHeight}",
+    "v": "v20171116a",
+    "ampv": "${ampVersion}",
+    "viewer": "${viewer}",
+    "ua": "${userAgent}",
+    "r": "${random}"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/captainmetrics.js b/extensions/amp-analytics/0.1/vendors/captainmetrics.js
new file mode 100644
index 0000000000000..519de8812264a
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/captainmetrics.js
@@ -0,0 +1,74 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {jsonLiteral} from '../../../../src/json';
+
+const CAPTAINMETRICS_CONFIG = jsonLiteral({
+  'transport': {
+    'beacon': true,
+    'xhrpost': true,
+    'useBody': true,
+    'image': false,
+  },
+  'vars': {
+    'hostDomain': 'photon.captainmetrics.com',
+    'deviceId': 'CLIENT_ID(_cm_cid)',
+    'sessionId': '$HASH(PAGE_VIEW_IDCLIENT_ID(_cm_cid))',
+    'page': 'SOURCE_URL',
+    'projectId': '',
+  },
+  'requests': {
+    'hit': {
+      'baseUrl': 'https://${hostDomain}/amp/',
+    },
+  },
+  'extraUrlParams': {
+    'cId': '${deviceId}',
+    'sId': '${sessionId}',
+    'ts': '${timestamp}',
+    'rand': '${random}',
+    'pId': '${projectId}',
+    'ampV': '${ampVersion}',
+    'v': '1',
+    'lang': '${browserLanguage}',
+    'ua': '${userAgent}',
+    'res': '${screenHeight}x${screenWidth}',
+    'aRes': '${availableScreenHeight}x${availableScreenWidth}',
+    'off': '${timezone}',
+    'tz': '${timezoneCode}',
+    'lp': '${page}',
+    'ref': '${externalReferrer}',
+    'ampRef': '${ampdocUrl}',
+    'pageId': '${pageViewId}',
+  },
+  'linkers': {
+    '_cm_amp': {
+      'ids': {
+        'cId': '${deviceId}',
+        'sId': '${sessionId}',
+      },
+      'enabled': true,
+      'proxyOnly': false,
+    },
+  },
+  'cookies': {
+    '_cm_cid': {
+      'value': 'LINKER_PARAM(_cm_amp, cId)',
+    },
+  },
+});
+
+export {CAPTAINMETRICS_CONFIG};
diff --git a/extensions/amp-analytics/0.1/vendors/captainmetrics.json b/extensions/amp-analytics/0.1/vendors/captainmetrics.json
new file mode 100644
index 0000000000000..98380d4b6925a
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/captainmetrics.json
@@ -0,0 +1,54 @@
+{
+  "transport": {
+    "beacon": true,
+    "xhrpost": true,
+    "useBody": true,
+    "image": false
+  },
+  "vars": {
+    "hostDomain": "photon.captainmetrics.com",
+    "deviceId": "CLIENT_ID(_cm_cid)",
+    "sessionId": "$HASH(PAGE_VIEW_IDCLIENT_ID(_cm_cid))",
+    "page": "SOURCE_URL",
+    "projectId": ""
+  },
+  "requests": {
+    "hit": {
+      "baseUrl": "https://${hostDomain}/amp/"
+    }
+  },
+  "extraUrlParams": {
+    "cId": "${deviceId}",
+    "sId": "${sessionId}",
+    "ts": "${timestamp}",
+    "rand": "${random}",
+    "pId": "${projectId}",
+    "ampV": "${ampVersion}",
+    "v": "1",
+    "lang": "${browserLanguage}",
+    "ua": "${userAgent}",
+    "res": "${screenHeight}x${screenWidth}",
+    "aRes": "${availableScreenHeight}x${availableScreenWidth}",
+    "off": "${timezone}",
+    "tz": "${timezoneCode}",
+    "lp": "${page}",
+    "ref": "${externalReferrer}",
+    "ampRef": "${ampdocUrl}",
+    "pageId": "${pageViewId}"
+  },
+  "linkers": {
+    "_cm_amp": {
+      "ids": {
+        "cId": "${deviceId}",
+        "sId": "${sessionId}"
+      },
+      "enabled": true,
+      "proxyOnly": false
+    }
+  },
+  "cookies": {
+    "_cm_cid": {
+      "value": "LINKER_PARAM(_cm_amp, cId)"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/chartbeat.js b/extensions/amp-analytics/0.1/vendors/chartbeat.js
index 5916eabe27529..b11f60586fc0e 100644
--- a/extensions/amp-analytics/0.1/vendors/chartbeat.js
+++ b/extensions/amp-analytics/0.1/vendors/chartbeat.js
@@ -30,8 +30,9 @@ const CHARTBEAT_CONFIG = jsonLiteral({
       'g2=${zone}&' +
       'g3=${sponsorName}&' +
       'g4=${contentType}&' +
-      'c=120&' +
+      'c=${totalTime}&' +
       'x=${scrollTop}&' +
+      'm=${maxScrollDepth}&' +
       'y=${scrollHeight}&' +
       'o=${scrollWidth}&' +
       'w=${viewportHeight}&' +
@@ -46,6 +47,7 @@ const CHARTBEAT_CONFIG = jsonLiteral({
       'i=${title}&' +
       'T=${timestamp}&' +
       'tz=${timezone}&' +
+      'sn=${requestCount}&' +
       'C=2',
     'baseSuffix': '&_',
     'interval': '${host}${basePrefix}${baseSuffix}',
diff --git a/extensions/amp-analytics/0.1/vendors/chartbeat.json b/extensions/amp-analytics/0.1/vendors/chartbeat.json
new file mode 100644
index 0000000000000..17e3f51b046db
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/chartbeat.json
@@ -0,0 +1,35 @@
+{
+  "requests": {
+    "host": "https://ping.chartbeat.net",
+    "basePrefix": "/ping?h=${domain}&p=${canonicalPath}&u=${clientId(_cb)}&d=${canonicalHost}&g=${uid}&g0=${sections}&g1=${authors}&g2=${zone}&g3=${sponsorName}&g4=${contentType}&c=${totalTime}&x=${scrollTop}&m=${maxScrollDepth}&y=${scrollHeight}&o=${scrollWidth}&w=${viewportHeight}&j=${decayTime}&R=1&W=0&I=0&E=${totalEngagedTime}&r=${documentReferrer}&t=${pageViewId}${clientId(_cb)}&b=${pageLoadTime}&i=${title}&T=${timestamp}&tz=${timezone}&sn=${requestCount}&C=2",
+    "baseSuffix": "&_",
+    "interval": "${host}${basePrefix}${baseSuffix}",
+    "anchorClick": "${host}${basePrefix}${baseSuffix}"
+  },
+  "triggers": {
+    "trackInterval": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 15,
+        "maxTimerLength": 7200
+      },
+      "request": "interval",
+      "vars": {
+        "decayTime": 30
+      }
+    },
+    "trackAnchorClick": {
+      "on": "click",
+      "selector": "a",
+      "request": "anchorClick",
+      "vars": {
+        "decayTime": 30
+      }
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/clicky.json b/extensions/amp-analytics/0.1/vendors/clicky.json
new file mode 100644
index 0000000000000..d361bf53df346
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/clicky.json
@@ -0,0 +1,30 @@
+{
+  "vars": {
+    "site_id": ""
+  },
+  "requests": {
+    "base": "https://in.getclicky.com/in.php?site_id=${site_id}",
+    "baseSuffix": "&mime=${contentType}&x=${random}",
+    "pageview": "${base}&res=${screenWidth}x${screenHeight}&lang=${browserLanguage}&secure=1&type=pageview&href=${canonicalPath}&title=${title}${baseSuffix}",
+    "interval": "${base}&type=ping${baseSuffix}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "interval": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 60,
+        "maxTimerLength": 600
+      },
+      "request": "interval"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/colanalytics.json b/extensions/amp-analytics/0.1/vendors/colanalytics.json
new file mode 100644
index 0000000000000..b0b0006c99f6b
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/colanalytics.json
@@ -0,0 +1,18 @@
+{
+  "requests": {
+    "host": "https://ase.clmbtech.com",
+    "base": "${host}/message",
+    "pageview": "${base}?cid=${id}&val_101=${id}&val_101=${canonicalPath}&ch=${canonicalHost}&uuid=${uid}&au=${authors}&zo=${zone}&sn=${sponsorName}&ct=${contentType}&st=${scrollTop}&sh=${scrollHeight}&dct=${decayTime}&tet=${totalEngagedTime}&dr=${documentReferrer}&plt=${pageLoadTime}&val_108=${title}&val_120=3"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/comscore.json b/extensions/amp-analytics/0.1/vendors/comscore.json
new file mode 100644
index 0000000000000..9ef372ab8aff7
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/comscore.json
@@ -0,0 +1,21 @@
+{
+  "vars": {
+    "c2": "1000001"
+  },
+  "requests": {
+    "host": "https://sb.scorecardresearch.com",
+    "base": "${host}/b?",
+    "pageview": "${base}c1=2&c2=${c2}&cs_ucfr=$IF($EQUALS(${consentState}, sufficient), 1)$IF($EQUALS(${consentState}, insufficient), 0)$IF($EQUALS(${consentState}, ), )&cs_amp_consent=${consentState}&cs_pv=${pageViewId}&c12=${clientId(comScore)}&rn=${random}&c8=${title}&c7=${canonicalUrl}&c9=${documentReferrer}&cs_c7amp=${ampdocUrl}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/cxense.json b/extensions/amp-analytics/0.1/vendors/cxense.json
new file mode 100644
index 0000000000000..692a99d660764
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/cxense.json
@@ -0,0 +1,18 @@
+{
+  "requests": {
+    "host": "https://scomcluster.cxense.com",
+    "base": "${host}/Repo/rep.gif",
+    "pageview": "${base}?ver=1&typ=pgv&sid=${siteId}&ckp=${clientId(cX_P)}&loc=${sourceUrl}&rnd=${random}&ref=${documentReferrer}&ltm=${timestamp}&wsz=${screenWidth}x${screenHeight}&bln=${browserLanguage}&chs=${documentCharset}&col=${screenColorDepth}&tzo=${timezone}&cp_cx_channel=amp"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/deepbi.js b/extensions/amp-analytics/0.1/vendors/deepbi.js
new file mode 100644
index 0000000000000..ff30f76d341b1
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/deepbi.js
@@ -0,0 +1,44 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {jsonLiteral} from '../../../../src/json';
+
+const DEEPBI_CONFIG = jsonLiteral({
+  'requestOrigin': 'https://${endpoint}',
+  'vars': {
+    'gdpr': true,
+    'endpoint': 'api.deep.bi',
+  },
+  'requests': {
+    'base':
+      '/v1/pixel/${datasetKey}/p.gif?accessKey=${accessKey}&gdpr=${gdpr}&page_href=${sourceUrl}&referrer_href=${documentReferrer}&page_title=${title}&amp=true',
+    'pageview': '${base}&event_type=page-open',
+    'event': '${base}&event_type=event',
+  },
+  'triggers': {
+    'defaultPageview': {
+      'on': 'visible',
+      'request': 'pageview',
+    },
+  },
+  'transport': {
+    'beacon': false,
+    'xhrpost': false,
+    'image': true,
+  },
+});
+
+export {DEEPBI_CONFIG};
diff --git a/extensions/amp-analytics/0.1/vendors/deepbi.json b/extensions/amp-analytics/0.1/vendors/deepbi.json
new file mode 100644
index 0000000000000..7ba60d0672a9e
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/deepbi.json
@@ -0,0 +1,23 @@
+{
+  "requestOrigin": "https://${endpoint}",
+  "vars": {
+    "gdpr": true,
+    "endpoint": "api.deep.bi"
+  },
+  "requests": {
+    "base": "/v1/pixel/${datasetKey}/p.gif?accessKey=${accessKey}&gdpr=${gdpr}&page_href=${sourceUrl}&referrer_href=${documentReferrer}&page_title=${title}&amp=true",
+    "pageview": "${base}&event_type=page-open",
+    "event": "${base}&event_type=event"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/dynatrace.json b/extensions/amp-analytics/0.1/vendors/dynatrace.json
new file mode 100644
index 0000000000000..d19f791b4d63e
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/dynatrace.json
@@ -0,0 +1,25 @@
+{
+  "requests": {
+    "endpoint": "${protocol}://${tenant}${separator}${environment}:${port}/ampbf/${tenantpath}",
+    "pageview": "${endpoint}?type=js&flavor=amp&v=1&a=1%7C1%7C_load_%7C_load_%7C-%7C${navTiming(navigationStart)}%7C${navTiming(domContentLoadedEventEnd)}%7C0%2C2%7C2%7C_onload_%7C_load_%7C-%7C${navTiming(domContentLoadedEventStart)}%7C${navTiming(domContentLoadedEventEnd)}%7C0&fId=${pageViewId}&vID=${clientId(rxVisitor)}&url=${sourceUrl}&title=${title}&sw=${screenWidth}&sh=${screenHeight}&w=${viewportWidth}&h=${viewportHeight}&nt=a${navType}b${navTiming(navigationStart)}c${navTiming(navigationStart,redirectStart)}d${navTiming(navigationStart,redirectEnd)}e${navTiming(navigationStart,fetchStart)}f${navTiming(navigationStart,domainLookupStart)}g${navTiming(navigationStart,domainLookupEnd)}h${navTiming(navigationStart,connectStart)}i${navTiming(navigationStart,connectEnd)}j${navTiming(navigationStart,secureConnectionStart)}k${navTiming(navigationStart,requestStart)}l${navTiming(navigationStart,responseStart)}m${navTiming(navigationStart,responseEnd)}n${navTiming(navigationStart,domLoading)}o${navTiming(navigationStart,domInteractive)}p${navTiming(navigationStart,domContentLoadedEventStart)}q${navTiming(navigationStart,domContentLoadedEventEnd)}r${navTiming(navigationStart,domComplete)}s${navTiming(navigationStart,loadEventStart)}t${navTiming(navigationStart,loadEventEnd)}&app=${app}&time=${timestamp}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "vars": {
+    "app": "ampapp",
+    "protocol": "https",
+    "tenant": "",
+    "environment": "live.dynatrace.com",
+    "port": "443",
+    "separator": "."
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/epica.json b/extensions/amp-analytics/0.1/vendors/epica.json
new file mode 100644
index 0000000000000..4a9e930ce05d0
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/epica.json
@@ -0,0 +1,22 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "vars": {
+    "anonymousId": "CLIENT_ID(epica_amp_id)"
+  },
+  "requests": {
+    "host": "https://cat.poder.io/api/v1/pixel",
+    "base": "?writeKey=${writeKey}&context.library.name=amp&anonymousId=${anonymousId}&context.locale=${browserLanguage}&context.page.path=${canonicalPath}&context.page.url=${canonicalUrl}&context.page.referrer=${documentReferrer}&context.page.title=${title}&context.screen.width=${screenWidth}&context.screen.height=${screenHeight}",
+    "page": "${host}/page${base}&name=${name}",
+    "track": "${host}/track${base}&event=${event}"
+  },
+  "triggers": {
+    "page": {
+      "on": "visible",
+      "request": "page"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/euleriananalytics.json b/extensions/amp-analytics/0.1/vendors/euleriananalytics.json
new file mode 100644
index 0000000000000..940d49aeae020
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/euleriananalytics.json
@@ -0,0 +1,19 @@
+{
+  "vars": {
+    "analyticsHost": "",
+    "documentLocation": "SOURCE_URL"
+  },
+  "requests": {
+    "base": "https://${analyticsHost}",
+    "basePrefix": "-/${random}?euid-amp=${clientId(etuix)}&url=${documentLocation}&",
+    "pageview": "${base}/col2/${basePrefix}rf=${externalReferrer}&urlp=${pagePath}&ss=${screenWidth}x${screenHeight}&sd=${screenColorDepth}",
+    "action": "${base}/action/${basePrefix}eact=${actionCode}&actr=${actionRef}",
+    "user": "${base}/uparam/${basePrefix}euk${userParamKey}=${userParamVal}",
+    "contextflag": "${base}/cflag2/${basePrefix}ecf0k=${cflagKey}&ecf0v=${cflagVal}"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/facebookpixel.json b/extensions/amp-analytics/0.1/vendors/facebookpixel.json
new file mode 100644
index 0000000000000..eff4e315c4253
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/facebookpixel.json
@@ -0,0 +1,26 @@
+{
+  "vars": {
+    "pixelId": "PIXEL-ID"
+  },
+  "requests": {
+    "host": "https://www.facebook.com",
+    "base": "${host}/tr?noscript=1",
+    "pageview": "${base}&ev=PageView&id=${pixelId}",
+    "event": "${base}&ev=${eventName}&id=${pixelId}&cd[content_name]=${content_name}",
+    "eventViewContent": "${base}&ev=ViewContent&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_name]=${content_name}&cd[content_type]=${content_type}&cd[content_ids]=${content_ids}",
+    "eventSearch": "${base}&ev=Search&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_category]=${content_category}&cd[content_ids]=${content_ids}&cd[search_string]=${search_string}",
+    "eventAddToCart": "${base}&ev=AddToCart&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_name]=${content_name}&cd[content_type]=${content_type}&cd[content_ids]=${content_ids}",
+    "eventAddToWishlist": "${base}&ev=AddToWishlist&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_name]=${content_name}&cd[content_category]=${content_category}&cd[content_ids]=${content_ids}",
+    "eventInitiateCheckout": "${base}&ev=InitiateCheckout&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_name]=${content_name}&cd[content_category]=${content_category}&cd[num_items]=${num_items}&cd[content_ids]=${content_ids}",
+    "eventAddPaymentInfo": "${base}&ev=AddPaymentInfo&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_category]=${content_category}&cd[content_ids]=${content_ids}",
+    "eventPurchase": "${base}&ev=Purchase&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_name]=${content_name}&cd[content_type]=${content_type}&cd[content_ids]=${content_ids}&cd[num_items]=${num_items}",
+    "eventLead": "${base}&ev=Lead&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_name]=${content_name}&cd[content_category]=${content_category}",
+    "eventCompleteRegistration": "${base}&ev=CompleteRegistration&id=${pixelId}&cd[value]=${value}&cd[currency]=${currency}&cd[content_name]=${content_name}&cd[status]=${status}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/gemius.json b/extensions/amp-analytics/0.1/vendors/gemius.json
new file mode 100644
index 0000000000000..9fa494ee1ab2f
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/gemius.json
@@ -0,0 +1,21 @@
+{
+  "vars": {
+    "dnt": "0"
+  },
+  "requests": {
+    "base": "https://${prefix}.hit.gemius.pl/_${timestamp}/redot.gif?l=91&id=${identifier}&tz=${timezone}&col=${screenColorDepth}&screen=${screenWidth}x${screenHeight}&window=${viewportWidth}x${viewportHeight}&fr=1&href=${sourceUrl}&ref=${documentReferrer}&sarg=${canonicalUrl}&extra=gemamp%3D1%7Campid%3D${clientId(gemius)}%7C${extraparams}&nc=${dnt}",
+    "pageview": "${base}&et=view&hsrc=1",
+    "event": "${base}&et=action&hsrc=3"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/googleadwords.json b/extensions/amp-analytics/0.1/vendors/googleadwords.json
new file mode 100644
index 0000000000000..df0cfa44f4c6d
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/googleadwords.json
@@ -0,0 +1,15 @@
+{
+  "requests": {
+    "conversion_prefix": "https://www.googleadservices.com/pagead/conversion/",
+    "remarketing_prefix": "https://googleads.g.doubleclick.net/pagead/viewthroughconversion/",
+    "common_params": "${googleConversionId}/?cv=amp2&label=${googleConversionLabel}&random=${random}&url=${sourceUrl}&ref=${documentReferrer}&fst=${pageViewId}&num=${counter(googleadwords)}&fmt=3&async=1&u_h=${screenHeight}&u_w=${screenWidth}&u_ah=${availableScreenHeight}&u_aw=${availableScreenWidth}&u_cd=${screenColorDepth}&u_tz=${timezone}&tiba=${title}&guid=ON&script=0",
+    "conversion_params": "value=${googleConversionValue}&currency_code=${googleConversionCurrency}&bg=${googleConversionColor}&hl=${googleConversionLanguage}",
+    "conversion": "${conversion_prefix}${common_params}&${conversion_params}",
+    "remarketing": "${remarketing_prefix}${common_params}"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/googleanalytics.json b/extensions/amp-analytics/0.1/vendors/googleanalytics.json
new file mode 100644
index 0000000000000..222ea4254a402
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/googleanalytics.json
@@ -0,0 +1,78 @@
+{
+  "vars": {
+    "eventValue": "0",
+    "documentLocation": "SOURCE_URL",
+    "clientId": "CLIENT_ID(AMP_ECID_GOOGLE,,_ga)",
+    "dataSource": "AMP",
+    "anonymizeIP": "aip",
+    "errorParam": "${errorName}-${errorMessage}"
+  },
+  "requests": {
+    "host": "https://www.google-analytics.com",
+    "basePrefix": "v=1&_v=a1&ds=${dataSource}&${anonymizeIP}&_s=${requestCount}&dt=${title}&sr=${screenWidth}x${screenHeight}&_utmht=${timestamp}&cid=${clientId}&tid=${account}&dl=${documentLocation}&dr=${externalReferrer}&sd=${screenColorDepth}&ul=${browserLanguage}&de=${documentCharset}",
+    "baseSuffix": "&a=${pageViewId}&z=${random}",
+    "pageview": "${host}/r/collect?${basePrefix}&t=pageview&jid=${random}&_r=1${baseSuffix}",
+    "event": "${host}/collect?${basePrefix}&t=event&jid=&ec=${eventCategory}&ea=${eventAction}&el=${eventLabel}&ev=${eventValue}${baseSuffix}",
+    "social": "${host}/collect?${basePrefix}&t=social&jid=&sa=${socialAction}&sn=${socialNetwork}&st=${socialTarget}${baseSuffix}",
+    "timing": "${host}/collect?${basePrefix}&t=${timingRequestType}&jid=&plt=${pageLoadTime}&dns=${domainLookupTime}&tcp=${tcpConnectTime}&rrt=${redirectTime}&srt=${serverResponseTime}&pdt=${pageDownloadTime}&clt=${contentLoadTime}&dit=${domInteractiveTime}${baseSuffix}",
+    "error": "${host}/collect?${basePrefix}&t=exception&exd=${errorParam}${baseSuffix}"
+  },
+  "triggers": {
+    "performanceTiming": {
+      "on": "visible",
+      "request": "timing",
+      "sampleSpec": {
+        "sampleOn": "${clientId}",
+        "threshold": 1
+      },
+      "vars": {
+        "timingRequestType": "timing"
+      }
+    },
+    "adwordsTiming": {
+      "on": "visible",
+      "request": "timing",
+      "enabled": "${queryParam(gclid)}",
+      "vars": {
+        "timingRequestType": "adtiming"
+      }
+    },
+    "storyProgress": {
+      "on": "story-page-visible",
+      "enabled": false,
+      "request": "event",
+      "vars": {
+        "eventAction": "story_progress",
+        "eventCategory": "${title}",
+        "eventLabel": "${storyPageId}"
+      }
+    },
+    "storyEnd": {
+      "on": "story-last-page-visible",
+      "enabled": false,
+      "request": "event",
+      "vars": {
+        "eventAction": "story_complete",
+        "eventCategory": "${title}"
+      }
+    }
+  },
+  "extraUrlParamsReplaceMap": {
+    "dimension": "cd",
+    "metric": "cm"
+  },
+  "optout": "_gaUserPrefs.ioo",
+  "optoutElementId": "__gaOptOutExtension",
+  "linkers": {
+    "_gl": {
+      "ids": {
+        "_ga": "${clientId}"
+      }
+    }
+  },
+  "cookies": {
+    "_ga": {
+      "value": "LINKER_PARAM(_gl, _ga)"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/gtag.json b/extensions/amp-analytics/0.1/vendors/gtag.json
new file mode 100644
index 0000000000000..d5115c86893ed
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/gtag.json
@@ -0,0 +1,50 @@
+{
+  "configRewriter": {
+    "url": "https://www.googletagmanager.com/gtag/amp",
+    "varGroups": {
+      "dns": {
+        "dr": "DOCUMENT_REFERRER",
+        "dl": "SOURCE_URL"
+      },
+      "conversion": {
+        "gclsrc": "QUERY_PARAM(gclsrc)",
+        "hasGcl": "$IF(QUERY_PARAM(gclid), 1, 0)",
+        "hasDcl": "$IF(QUERY_PARAM(dclid), 1, 0)",
+        "hasExtRef": "$IF(EXTERNAL_REFERRER, 1, 0)",
+        "hasDocRef": "$IF(DOCUMENT_REFERRER, 1, 0)",
+        "enabled": true
+      }
+    }
+  },
+  "vars": {
+    "eventValue": "0",
+    "clientId": "CLIENT_ID(AMP_ECID_GOOGLE,,_ga)",
+    "dataSource": "AMP",
+    "anonymizeIP": "aip",
+    "errorParam": "${errorName}-${errorMessage}"
+  },
+  "requests": {
+    "uaHost": "https://www.google-analytics.com",
+    "uaBasePrefix": "v=1&_v=a1&ds=${dataSource}&${anonymizeIP}&_s=${requestCount}&dt=${title}&sr=${screenWidth}x${screenHeight}&cid=${clientId}&tid=${trackingId}&dl=${sourceUrl}&dr=${externalReferrer}&sd=${screenColorDepth}&ul=${browserLanguage}&de=${documentCharset}",
+    "uaBaseSuffix": "&a=${pageViewId}&z=${random}",
+    "uaPageviewCommon": "&t=pageview&jid=${random}&gjid=${random}&_r=1",
+    "uaPageview": "${uaHost}/r/collect?${uaBasePrefix}${uaPageviewCommon}${uaBaseSuffix}",
+    "uaPageviewNpa": "${uaHost}/collect?${uaBasePrefix}${uaPageviewCommon}${uaBaseSuffix}",
+    "uaEvent": "${uaHost}/collect?${uaBasePrefix}&t=event&jid=${uaBaseSuffix}",
+    "uaTiming": "${uaHost}/collect?${uaBasePrefix}&jid=&plt=${pageLoadTime}&dns=${domainLookupTime}&tcp=${tcpConnectTime}&rrt=${redirectTime}&srt=${serverResponseTime}&pdt=${pageDownloadTime}&clt=${contentLoadTime}&dit=${domInteractiveTime}${uaBaseSuffix}",
+    "uaError": "${uaHost}/collect?${uaBasePrefix}&t=exception&exd=${errorParam}${uaBaseSuffix}",
+    "awConversionPrefix": "https://www.googleadservices.com/pagead/conversion/",
+    "awRemarketingPrefix": "https://googleads.g.doubleclick.net/pagead/viewthroughconversion/",
+    "awCommonParams": "${conversionId}/?cv=amp3&label=${conversionLabel}&random=${random}&url=${sourceUrl}&ref=${documentReferrer}&fst=${pageViewId}&num=${counter(googleadwords)}&fmt=3&async=1&u_h=${screenHeight}&u_w=${screenWidth}&u_ah=${availableScreenHeight}&u_aw=${availableScreenWidth}&u_cd=${screenColorDepth}&u_tz=${timezone}&tiba=${title}&guid=ON&script=0",
+    "awConversion": "${awConversionPrefix}${awCommonParams}",
+    "awRemarketing": "${awRemarketingPrefix}${awCommonParams}",
+    "flBase": "https://ad.doubleclick.net/activity;src=${flSrc};type=${flType};cat=${flCat}",
+    "flDynamicBase": "https://${flSrc}.fls.doubleclick.net/activityi;src=${flSrc};type=${flType};cat=${flCat}",
+    "dnsBase": "https://ad.doubleclick.net/ddm/clk/"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/ibeatanalytics.json b/extensions/amp-analytics/0.1/vendors/ibeatanalytics.json
new file mode 100644
index 0000000000000..3d1bf9d07a018
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/ibeatanalytics.json
@@ -0,0 +1,13 @@
+{
+  "requests": {
+    "host": "https://ibeat.indiatimes.com",
+    "base": "https://ibeat.indiatimes.com/iBeat/pageTrendlogAmp.html",
+    "pageview": "${base}?&h=${h}&d=${h}&url=${url}&k=${key}&ts=${time}&ch=${channel}&sid=${uid}&at=${agentType}&ref=${documentReferrer}&aid=${aid}&loc=1&ct=1&cat=${cat}&scat=${scat}&ac=1&tg=${tags}&ctids=${catIds}&pts=${pagePublishTime}&auth=${author}&pos=${position}&iBeatField=${ibeatFields}&cid=${clientId(MSCSAuthDetails)}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/infonline.json b/extensions/amp-analytics/0.1/vendors/infonline.json
new file mode 100644
index 0000000000000..7257ae0363103
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/infonline.json
@@ -0,0 +1,22 @@
+{
+  "vars": {
+    "sv": "ke",
+    "ap": "1"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "requests": {
+    "pageview": "${url}?st=${st}&sv=${sv}&ap=${ap}&co=${co}&cp=${cp}&ps=${ps}&host=${canonicalHost}&path=${canonicalPath}&type=pageview",
+    "event": "${url}?st=${st}&ev=${ev}&sv=${sv}&ap=${ap}&co=${co}&cp=${cp}&ps=${ps}&host=${canonicalHost}&path=${canonicalPath}&type=event"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview",
+      "iframePing": true
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/iplabel.json b/extensions/amp-analytics/0.1/vendors/iplabel.json
new file mode 100644
index 0000000000000..f66327c3d3028
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/iplabel.json
@@ -0,0 +1,30 @@
+{
+  "requests": {
+    "collectorUrl": "m.col.ip-label.net",
+    "endpoint": "https://${collectorUrl}/coll/",
+    "onload": "${endpoint}?T=${trackerId}&m=2502|${navTiming(navigationStart)}|2508|${navTiming(domainLookupStart)}|2509|${navTiming(domainLookupEnd)}|2510|${navTiming(connectStart)}|2512|${navTiming(connectEnd)}|2514|${navTiming(responseStart)}|2515|${navTiming(responseEnd)}|2517|${navTiming(domInteractive)}|2520|${navTiming(loadEventStart)}&ts=${timestamp}&ua=${userAgent}&d=${ipldim}&i=${clientip}&d[1]=${customdim}&d[2]=${business}&d[3]=${abtesting}&d[4]=${infrastructure}&d[5]=${customer}&u=${urlgroup}&w=${availableScreenWidth}&h=${availableScreenHeight}&r=${documentReferrer}&l=${browserLanguage}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "onload"
+    }
+  },
+  "transport": {
+    "beacon": true,
+    "xhrpost": true,
+    "image": {
+      "suppressWarnings": true
+    }
+  },
+  "vars": {
+    "trackerId": "notrackerID",
+    "customdim": "",
+    "business": "",
+    "abtesting": "",
+    "infrastructure": "",
+    "customer": "",
+    "clientip": "",
+    "urlgroup": ""
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/keen.json b/extensions/amp-analytics/0.1/vendors/keen.json
new file mode 100644
index 0000000000000..1f1aa64d78055
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/keen.json
@@ -0,0 +1,58 @@
+{
+  "requests": {
+    "base": "https://api.keen.io/3.0/projects/${projectId}/events",
+    "pageview": "${base}/pageviews?api_key=${writeKey}",
+    "click": "${base}/clicks?api_key=${writeKey}",
+    "custom": "${base}/${collection}?api_key=${writeKey}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "extraUrlParams": {
+    "amp": true,
+    "ampdocHostname": "${ampdocHostname}",
+    "ampdocUrl": "${ampdocUrl}",
+    "ampVersion": "${ampVersion}",
+    "backgroundState": "${backgroundState}",
+    "backgroundedAtStart": "${backgroundedAtStart}",
+    "browserLanguage": "${browserLanguage}",
+    "canonicalHost": "${canonicalHost}",
+    "canonicalHostname": "${canonicalHostname}",
+    "canonicalPath": "${canonicalPath}",
+    "canonicalUrl": "${canonicalUrl}",
+    "clientId": "CLIENT_ID(cid)",
+    "contentLoadTime": "${contentLoadTime}",
+    "documentReferrer": "${documentReferrer}",
+    "domainLookupTime": "${domainLookupTime}",
+    "domInteractiveTime": "${domInteractiveTime}",
+    "externalReferrer": "${externalReferrer}",
+    "incrementalEngagedTime": "${incrementalEngagedTime}",
+    "pageDownloadTime": "${pageDownloadTime}",
+    "pageLoadTime": "${pageLoadTime}",
+    "screenHeight": "${screenHeight}",
+    "screenWidth": "${screenWidth}",
+    "screenColorDepth": "${screenColorDepth}",
+    "scrollHeight": "${scrollHeight}",
+    "scrollWidth": "${scrollWidth}",
+    "scrollTop": "${scrollTop}",
+    "scrollLeft": "${scrollLeft}",
+    "serverResponseTime": "${serverResponseTime}",
+    "timestamp": "${timestamp}",
+    "timezone": "${timezone}",
+    "title": "${title}",
+    "totalEngagedTime": "${totalEngagedTime}",
+    "totalTime": "${totalTime}",
+    "userAgent": "${userAgent}",
+    "viewportHeight": "${viewportHeight}",
+    "viewportWidth": "${viewportWidth}"
+  },
+  "transport": {
+    "beacon": true,
+    "xhrpost": true,
+    "img": false,
+    "useBody": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/kenshoo.json b/extensions/amp-analytics/0.1/vendors/kenshoo.json
new file mode 100644
index 0000000000000..b1c620849d128
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/kenshoo.json
@@ -0,0 +1,37 @@
+{
+  "vars": {
+    "clientId": "CLIENT_ID(ken_amp_id)",
+    "channelClickId": "QUERY_PARAM(gclid)"
+  },
+  "requests": {
+    "host": "https://amp.xg4ken.com",
+    "parameters": "ampcid=${clientId}&chcid=${channelClickId}&tid=${tid}&uid=${userId}&domain=${canonicalHostname}",
+    "landingPage": "${host}/amp/v1/match?${parameters}"
+  },
+  "triggers": {
+    "trackLandingPage": {
+      "enabled": "QUERY_PARAM(gclid)",
+      "on": "visible",
+      "request": "landingPage"
+    }
+  },
+  "linkers": {
+    "linker": {
+      "ids": {
+        "clientId": "${clientId}",
+        "channelClickId": "${channelClickId}"
+      },
+      "proxyOnly": false,
+      "enabled": true
+    }
+  },
+  "cookies": {
+    "enabled": true,
+    "ken_gclid": {
+      "value": "QUERY_PARAM(gclid)"
+    },
+    "ken_amp_gclid": {
+      "value": "QUERY_PARAM(gclid)"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/krux.json b/extensions/amp-analytics/0.1/vendors/krux.json
new file mode 100644
index 0000000000000..027b4076be23b
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/krux.json
@@ -0,0 +1,18 @@
+{
+  "requests": {
+    "beaconHost": "https://beacon.krxd.net",
+    "timing": "t_navigation_type=0&t_dns=${domainLookupTime}&t_tcp=${tcpConnectTime}&t_http_request=${serverResponseTime}&t_http_response=${pageDownloadTime}&t_content_ready=${contentLoadTime}&t_window_load=${pageLoadTime}&t_redirect=${redirectTime}",
+    "common": "source=amp&confid=${confid}&_kpid=${pubid}&_kcp_s=${site}&_kcp_sc=${section}&_kcp_ssc=${subsection}&_kcp_d=${canonicalHost}&_kpref_=${documentReferrer}&_kua_kx_amp_client_id=${clientId(_kuid_)}&_kua_kx_lang=${browserLanguage}&_kua_kx_tech_browser_language=${browserLanguage}&_kua_kx_tz=${timezone}",
+    "pageview": "${beaconHost}/pixel.gif?${common}&${timing}",
+    "event": "${beaconHost}/event.gif?${common}&${timing}&pageview=false"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "extraUrlParamsReplaceMap": {
+    "user.": "_kua_",
+    "page.": "_kpa_"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/linkpulse.json b/extensions/amp-analytics/0.1/vendors/linkpulse.json
new file mode 100644
index 0000000000000..40c80109da0a0
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/linkpulse.json
@@ -0,0 +1,41 @@
+{
+  "vars": {
+    "id": "",
+    "pageUrl": "CANONICAL_URL",
+    "title": "TITLE",
+    "section": "",
+    "channel": "amp",
+    "type": "",
+    "host": "pp.lp4.io",
+    "empty": ""
+  },
+  "requests": {
+    "base": "https://${host}",
+    "pageview": "${base}/p?i=${id}&r=${documentReferrer}&p=${pageUrl}&s=${section}&t=${type}&c=${channel}&mt=${title}&_t=amp&_r=${random}",
+    "pageload": "${base}/pl?i=${id}&ct=${domInteractiveTime}&rt=${pageDownloadTime}&pt=${pageLoadTime}&p=${pageUrl}&c=${channel}&t=${type}&s=${section}&_t=amp&_r=${random}",
+    "ping": "${base}/u?i=${id}&u=${clientId(_lp4_u)}&p=${pageUrl}&uActive=true&isPing=yes&c=${channel}&t=${type}&s=${section}&_t=amp&_r=${random}"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "pageload": {
+      "on": "visible",
+      "request": "pageload"
+    },
+    "ping": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 30,
+        "maxTimerLength": 7200
+      },
+      "request": "ping"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/lotame.json b/extensions/amp-analytics/0.1/vendors/lotame.json
new file mode 100644
index 0000000000000..42bbc1f29237c
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/lotame.json
@@ -0,0 +1,16 @@
+{
+  "requests": {
+    "pageview": "https://bcp.crwdcntrl.net/amp?c=${account}&pv=y"
+  },
+  "triggers": {
+    "track pageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/marinsoftware.json b/extensions/amp-analytics/0.1/vendors/marinsoftware.json
new file mode 100644
index 0000000000000..f844c3540c17d
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/marinsoftware.json
@@ -0,0 +1,13 @@
+{
+  "requests": {
+    "base": "https://tracker.marinsm.com/tp",
+    "baseParams": "cid=${trackerId}&ampVersion=${ampVersion}&ds=AMP&ref=${externalReferrer}&page=${sourceUrl}&uuid=${clientId(marin_amp_id)}&rnd=${random}",
+    "pageView": "${base}?${baseParams}&act=1",
+    "conversion": "${base}?${baseParams}&act=2&trans=UTM:I|${orderId}|${marinConversionType}|${productName}|${category}|${price}|${quantity}"
+  },
+  "transport": {
+    "beacon": true,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/mediametrie.json b/extensions/amp-analytics/0.1/vendors/mediametrie.json
new file mode 100644
index 0000000000000..f8472e4ba2318
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/mediametrie.json
@@ -0,0 +1,17 @@
+{
+  "requests": {
+    "host": "https://prof.estat.com/m/web",
+    "pageview": "${host}/${serial}?c=${level1}&dom=${ampdocUrl}&enc=${documentCharset}&l3=${level3}&l4=${level4}&n=${random}&p=${level2}&r=${documentReferrer}&sch=${screenHeight}&scw=${screenWidth}&tn=amp&v=1&vh=${availableScreenHeight}&vw=${availableScreenWidth}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/mediarithmics.json b/extensions/amp-analytics/0.1/vendors/mediarithmics.json
new file mode 100644
index 0000000000000..b5adb7098eeed
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/mediarithmics.json
@@ -0,0 +1,23 @@
+{
+  "vars": {
+    "domain": "events.mediarithmics.com",
+    "url": "SOURCE_URL",
+    "event_name": "$page_view",
+    "referrer": "DOCUMENT_REFERRER"
+  },
+  "requests": {
+    "host": "https://${domain}",
+    "pageview": "${host}/v1/visits/pixel?$site_token=${site_token}&$url=${url}&$ev=${event_name}&$referrer=${referrer}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/mediator.json b/extensions/amp-analytics/0.1/vendors/mediator.json
new file mode 100644
index 0000000000000..397490d63c7dc
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/mediator.json
@@ -0,0 +1,64 @@
+{
+  "requests": {
+    "host": "//collector.mediator.media/script/${mediator_id}/amp/",
+    "renderstart": "${host}init/?url=${canonicalUrl}",
+    "prefix": "${host}register/?url=${canonicalUrl}&ref=${documentReferrer}&",
+    "suffix": "vh=${viewportHeight}&sh=${scrollHeight}&st=${scrollTop}",
+    "pageview": "${prefix}e=v",
+    "timer": "${prefix}e=t&${suffix}",
+    "s0": "${prefix}e=s0",
+    "s1": "${prefix}e=s1",
+    "s2": "${prefix}e=s2",
+    "s3": "${prefix}e=s3"
+  },
+  "vars": {
+    "mediator_id": ""
+  },
+  "triggers": {
+    "renderStart": {
+      "on": "render-start",
+      "request": "renderstart"
+    },
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "scrollPing0": {
+      "on": "scroll",
+      "scrollSpec": {
+        "verticalBoundaries": [5]
+      },
+      "request": "s0"
+    },
+    "scrollPing1": {
+      "on": "scroll",
+      "scrollSpec": {
+        "verticalBoundaries": [35]
+      },
+      "request": "s1"
+    },
+    "scrollPing2": {
+      "on": "scroll",
+      "scrollSpec": {
+        "verticalBoundaries": [65]
+      },
+      "request": "s2"
+    },
+    "scrollPing3": {
+      "on": "scroll",
+      "scrollSpec": {
+        "verticalBoundaries": [95]
+      },
+      "request": "s3"
+    },
+    "pageTimer": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 5,
+        "maxTimerLength": 600,
+        "immediate": false
+      },
+      "request": "timer"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/memo.js b/extensions/amp-analytics/0.1/vendors/memo.js
new file mode 100644
index 0000000000000..5e178a52ea897
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/memo.js
@@ -0,0 +1,63 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {jsonLiteral} from '../../../../src/json';
+
+const MEMO_CONFIG = jsonLiteral({
+  'vars': {
+    'pid': '',
+    'published_at': '',
+    'authors': [],
+  },
+  'requests': {
+    'host': 'https://elsa.memoinsights.com',
+    'baseParams':
+      'amp=true' +
+      '&pid=${pid}' +
+      '&title=${title}' +
+      '&url=${canonicalUrl}' +
+      '&date=${published_at}' +
+      '&authors=${authors}' +
+      '&referrer=${documentReferrer}' +
+      '&page_url=${sourceUrl}' +
+      '&user_id=${clientId(memo_amp_id)}' +
+      '&domain=${canonicalHost}' +
+      '&v=amp',
+    'visible': '${host}/n?${baseParams}',
+    'timer': '${host}/t?${baseParams}&t=5000&e=5000',
+  },
+  'triggers': {
+    'visible': {
+      'on': 'visible',
+      'request': 'visible',
+    },
+    'timer': {
+      'on': 'timer',
+      'timerSpec': {
+        'interval': 5,
+        'maxTimerLength': 1200,
+      },
+      'request': 'timer',
+    },
+  },
+  'transport': {
+    'beacon': false,
+    'xhrpost': false,
+    'image': true,
+  },
+});
+
+export {MEMO_CONFIG};
diff --git a/extensions/amp-analytics/0.1/vendors/memo.json b/extensions/amp-analytics/0.1/vendors/memo.json
new file mode 100644
index 0000000000000..6432785b1c3cd
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/memo.json
@@ -0,0 +1,32 @@
+{
+  "vars": {
+    "pid": "",
+    "published_at": "",
+    "authors": []
+  },
+  "requests": {
+    "host": "https://elsa.memoinsights.com",
+    "baseParams": "amp=true&pid=${pid}&title=${title}&url=${canonicalUrl}&date=${published_at}&authors=${authors}&referrer=${documentReferrer}&page_url=${sourceUrl}&user_id=${clientId(memo_amp_id)}&domain=${canonicalHost}&v=amp",
+    "visible": "${host}/n?${baseParams}",
+    "timer": "${host}/t?${baseParams}&t=5000&e=5000"
+  },
+  "triggers": {
+    "visible": {
+      "on": "visible",
+      "request": "visible"
+    },
+    "timer": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 5,
+        "maxTimerLength": 1200
+      },
+      "request": "timer"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/metrika.json b/extensions/amp-analytics/0.1/vendors/metrika.json
new file mode 100644
index 0000000000000..fc5d75f1ce9c3
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/metrika.json
@@ -0,0 +1,28 @@
+{
+  "transport": {
+    "beacon": true,
+    "xhrpost": true,
+    "image": false
+  },
+  "requests": {
+    "pageview": "${_watch}?browser-info=${_brInfo}&${_siteInfo}&${_suffix}",
+    "notBounce": "${_watch}?browser-info=ar%3A1%3Anb%3A1%3A${_brInfo}&${_suffix}",
+    "externalLink": "${_watch}?browser-info=ln%3A1%3A${_brInfo}&${_suffix}",
+    "reachGoal": "${_watch}?browser-info=ar%3A1%3A${_brInfo}&${_siteInfo}&${_goalSuffix}",
+    "_domain": "https://mc.yandex.ru",
+    "_watch": "${_domain}/watch/${counterId}",
+    "_suffix": "page-url=${sourceUrl}&page-ref=${documentReferrer}",
+    "_goalSuffix": "page-url=goal%3A%2F%2F${sourceHost}%2F${goalId}&page-ref=${sourceUrl}",
+    "_techInfo": "amp%3A1%3Az%3A${timezone}%3Ai%3A${timestamp}%3Arn%3A${random}%3Ala%3A${browserLanguage}%3Aen%3A${documentCharset}%3Arqn%3A${requestCount}%3As%3A${screenWidth}x${screenHeight}x${screenColorDepth}%3Aw%3A${availableScreenWidth}x${availableScreenHeight}%3Ads%3A${_timings}%3Auid%3A${clientId(_ym_uid)}%3Apvid%3A${pageViewId}",
+    "_timings": "${domainLookupTime}%2C${tcpConnectTime}%2C${serverResponseTime}%2C${pageDownloadTime}%2C${redirectTime}%2C${navTiming(redirectStart,redirectEnd)}%2C${navRedirectCount}%2C${navTiming(domLoading,domInteractive)}%2C${navTiming(domContentLoadedEventStart,domContentLoadedEventEnd)}%2C${navTiming(navigationStart,domComplete)}%2C${pageLoadTime}%2C${navTiming(loadEventStart,loadEventEnd)}%2C${contentLoadTime}",
+    "_brInfo": "${_techInfo}%3A${_title}",
+    "_title": "t%3A${title}",
+    "_siteInfo": "site-info=${yaParams}"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/moat.json b/extensions/amp-analytics/0.1/vendors/moat.json
new file mode 100644
index 0000000000000..ad01fee3d5672
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/moat.json
@@ -0,0 +1,72 @@
+{
+  "vars": {
+    "element": ":root"
+  },
+  "requests": {
+    "load": "{\"type\":\"load\",\"pcode\":\"${pcode}\",\"l0t\":\"${l0t}\",\"acctType\":\"${acctType}\",\"adType\":\"${adType}\",\"qs\":\"${qs}\",\"element\":{\"src\":\"${htmlAttr(img,src,width)}\",\"viewer\":\"${viewer}\"},\"document\":{\"AMPDocumentHostname\":\"${ampdocHostname}\",\"AMPDocumentURL\":\"${ampdocUrl}\",\"canonicalHost\":\"${canonicalHost}\",\"canonicalHostname\":\"${canonicalHostname}\",\"canonicalPath\":\"${canonicalPath}\",\"canonicalURL\":\"${canonicalUrl}\",\"documentCharset\":\"${documentCharset}\",\"documentReferrer\":\"${documentReferrer}\",\"externalReferrer\":\"${externalReferrer}\",\"sourceURL\":\"${sourceUrl}\",\"sourceHost\":\"${sourceHost}\",\"sourceHostname\":\"${sourceHostname}\",\"sourcePath\":\"${sourcePath}\",\"title\":\"${title}\",\"viewer\":\"${viewer}\"},\"device\":{\"availableScreenHeight\":\"${availableScreenHeight}\",\"availableScreenWidth\":\"${availableScreenWidth}\",\"browserLanguage\":\"${browserLanguage}\",\"screenColorDepth\":\"${screenColorDepth}\",\"screenHeight\":\"${screenHeight}\",\"screenWidth\":\"${screenWidth}\",\"scrollHeight\":\"${scrollHeight}\",\"scrollWidth\":\"${scrollWidth}\",\"scrollLeft\":\"${scrollLeft}\",\"scrollTop\":\"${scrollTop}\",\"timezone\":\"${timezone}\",\"userAgent\":\"${userAgent}\",\"viewportHeight\":\"${viewportHeight}\",\"viewportWidth\":\"${viewportWidth}\"},\"requestCount\":\"${requestCount}\",\"timeStamp\":\"${timestamp}\"}",
+    "unload": "{\"type\":\"unload\",\"pcode\":\"${pcode}\",\"l0t\":\"${l0t}\",\"requestCount\":\"${requestCount}\",\"timeStamp\":\"${timestamp}\"}",
+    "click": "{\"type\":\"click\",\"pcode\":\"${pcode}\",\"l0t\":\"${l0t}\",\"requestCount\":\"${requestCount}\",\"timeStamp\":\"${timestamp}\"}",
+    "viewability": "{\"type\":\"viewability\",\"pcode\":\"${pcode}\",\"l0t\":\"${l0t}\",\"backgroundState\":\"${backgroundState}\",\"intersectionRect\":\"${intersectionRect}\",\"intersectionRatio\":\"${intersectionRatio}\",\"maxVisiblePercentage\":\"${maxVisiblePercentage}\",\"minVisiblePercentage\":\"${minVisiblePercentage}\",\"x\":\"${elementX}\",\"y\":\"${elementY}\",\"height\":\"${elementHeight}\",\"width\":\"${elementWidth}\",\"viewportHeight\":\"${viewportHeight}\",\"viewportWidth\":\"${viewportWidth}\",\"opacity\":\"${opacity}\",\"timeStamp\":\"${timestamp}\",\"requestCount\":\"${requestCount}\"}",
+    "iframe": "{\"type\":\"iframe\",\"pcode\":\"${pcode}\",\"height\":\"${elementHeight}\",\"width\":\"${elementWidth}\",\"x\":\"${elementX}\",\"y\":\"${elementY}\",\"requestCount\":\"${requestCount}\"}"
+  },
+  "triggers": {
+    "load": {
+      "on": "ini-load",
+      "request": "load"
+    },
+    "unload": {
+      "on": "ad-refresh",
+      "selector": "${element}",
+      "request": "unload"
+    },
+    "click": {
+      "on": "click",
+      "selector": "${element}",
+      "request": "click"
+    },
+    "viewability": {
+      "on": "visible",
+      "selector": "${element}",
+      "request": "viewability",
+      "visibilitySpec": {
+        "repeat": true,
+        "visiblePercentageThresholds": [
+          [0, 0],
+          [0, 5],
+          [5, 10],
+          [10, 15],
+          [15, 20],
+          [20, 25],
+          [25, 30],
+          [30, 35],
+          [35, 40],
+          [40, 45],
+          [45, 50],
+          [50, 55],
+          [55, 60],
+          [60, 65],
+          [65, 70],
+          [70, 75],
+          [75, 80],
+          [80, 85],
+          [85, 90],
+          [90, 95],
+          [95, 100],
+          [100, 100]
+        ]
+      }
+    },
+    "iframe": {
+      "on": "visible",
+      "selector": ":root",
+      "request": "iframe",
+      "visibilitySpec": {
+        "repeat": true,
+        "visiblePercentageThresholds": [[0, 0]]
+      }
+    }
+  },
+  "transport": {
+    "iframe": "https://z.moatads.com/ampanalytics093284/iframe.html"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/mobify.json b/extensions/amp-analytics/0.1/vendors/mobify.json
new file mode 100644
index 0000000000000..30d3aa6f19de9
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/mobify.json
@@ -0,0 +1,30 @@
+{
+  "vars": {
+    "projectSlug": "mobify-project-id",
+    "templateName": "page-type"
+  },
+  "requests": {
+    "_host": "https://engagement-collector.mobify.net",
+    "_dimensions": "%22platform%22%3a%22AMP%22%2c%22client_id%22%3a%22${clientId(sandy-client-id)}%22%2c%22title%22%3a%22${title}%22%2c%22location%22%3a%22${sourceUrl}%22%2c%22page%22%3a%22${sourcePath}%22%2c%22src_location%22%3a%22${ampdocUrl}%22%2c%22referrer%22%3a%22${documentReferrer}%22%2c%22templateName%22%3a%22${templateName}%22",
+    "_basePrefix": "${_host}/s.gif?slug=${projectSlug}&timestamp_local=${timestamp}&channel=web&dimensions=%7b${_dimensions}%7d",
+    "ampstart": "${_basePrefix}&data=%7b%22category%22%3a%22timing%22%2c%22action%22%3a%22ampStart%22%2c%22value%22%3a${navTiming(navigationStart,domLoading)}%7d",
+    "pageview": "${_basePrefix}&data=%7b%22action%22%3a%22pageview%22%7d",
+    "pageload": "${_basePrefix}&data=%7b%22category%22%3a%22timing%22%2c%22action%22%3a%22load%22%2c%22value%22%3a${pageLoadTime}%7d",
+    "pagedcl": "${_basePrefix}&data=%7b%22category%22%3a%22timing%22%2c%22action%22%3a%22DOMContentLoaded%22%2c%22value%22%3a${contentLoadTime}%7d"
+  },
+  "triggers": {
+    "triggerName": {
+      "on": "visible",
+      "request": ["ampstart", "pageload", "pagedcl"]
+    },
+    "pageview": {
+      "on": "ini-load",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": true,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/mparticle.json b/extensions/amp-analytics/0.1/vendors/mparticle.json
new file mode 100644
index 0000000000000..55412de0ed79a
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/mparticle.json
@@ -0,0 +1,19 @@
+{
+  "vars": {
+    "eventType": "Unknown",
+    "debug": false,
+    "amp_clientId": "CLIENT_ID(mparticle_amp_id)"
+  },
+  "requests": {
+    "host": "https://pixels.mparticle.com",
+    "endpointPath": "/v1/${apiKey}/Pixel",
+    "baseParams": "et=${eventType}&amp_id=${amp_clientId}&attrs_k=${eventAttributes_Keys}&attrs_v=${eventAttributes_Values}&ua_k=${userAttributes_Keys}&ua_v=${userAttributes_Values}&ui_t=${userIdentities_Types}&ui_v=${userIdentities_Values}&flags_k=${customFlags_Keys}&flags_v=${customFlags_Values}&ct=${timestamp}&dbg=${debug}&lc=${location}&av=${appVersion}",
+    "pageview": "${host}${endpointPath}?dt=ScreenView&n=${pageName}&hn=${ampdocUrl}&ttl=${title}&path=${canonicalPath}&${baseParams}",
+    "event": "${host}${endpointPath}?dt=AppEvent&n=${eventName}&${baseParams}"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/mpulse.json b/extensions/amp-analytics/0.1/vendors/mpulse.json
new file mode 100644
index 0000000000000..dd09939c49cfb
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/mpulse.json
@@ -0,0 +1,22 @@
+{
+  "requests": {
+    "onvisible": "https://${beacon_url}?h.d=${h.d}&h.key=${h.key}&h.t=${h.t}&h.cr=${h.cr}&rt.start=navigation&rt.si=${clientId(amp_mpulse)}&rt.ss=${timestamp}&rt.end=${timestamp}&t_resp=${navTiming(navigationStart,responseStart)}&t_page=${navTiming(responseStart,loadEventStart)}&t_done=${navTiming(navigationStart,loadEventStart)}&nt_nav_type=${navType}&nt_red_cnt=${navRedirectCount}&nt_nav_st=${navTiming(navigationStart)}&nt_red_st=${navTiming(redirectStart)}&nt_red_end=${navTiming(redirectEnd)}&nt_fet_st=${navTiming(fetchStart)}&nt_dns_st=${navTiming(domainLookupStart)}&nt_dns_end=${navTiming(domainLookupEnd)}&nt_con_st=${navTiming(connectStart)}&nt_ssl_st=${navTiming(secureConnectionStart)}&nt_con_end=${navTiming(connectEnd)}&nt_req_st=${navTiming(requestStart)}&nt_res_st=${navTiming(responseStart)}&nt_unload_st=${navTiming(unloadEventStart)}&nt_unload_end=${navTiming(unloadEventEnd)}&nt_domloading=${navTiming(domLoading)}&nt_res_end=${navTiming(responseEnd)}&nt_domint=${navTiming(domInteractive)}&nt_domcontloaded_st=${navTiming(domContentLoadedEventStart)}&nt_domcontloaded_end=${navTiming(domContentLoadedEventEnd)}&nt_domcomp=${navTiming(domComplete)}&nt_load_st=${navTiming(loadEventStart)}&nt_load_end=${navTiming(loadEventEnd)}&v=1&http.initiator=amp&u=${sourceUrl}&amp.u=${ampdocUrl}&r2=${documentReferrer}&scr.xy=${screenWidth}x${screenHeight}"
+  },
+  "triggers": {
+    "onvisible": {
+      "on": "visible",
+      "request": "onvisible"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "extraUrlParamsReplaceMap": {
+    "ab_test": "h.ab",
+    "page_group": "h.pg",
+    "custom_dimension.": "cdim.",
+    "custom_metric.": "cmet."
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/navegg.json b/extensions/amp-analytics/0.1/vendors/navegg.json
new file mode 100644
index 0000000000000..77e733cafe123
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/navegg.json
@@ -0,0 +1,18 @@
+{
+  "requests": {
+    "pageview": "https://amp.navdmp.com/amp?aid=${clientId(navegg_id)}&url=${canonicalUrl}&ref=${documentReferrer}&tit=${title}&lan=${browserLanguage}&acc=${account}&v=7"
+  },
+  "triggers": {
+    "trackpageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": {
+      "suppressWarnings": true
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/newrelic.json b/extensions/amp-analytics/0.1/vendors/newrelic.json
new file mode 100644
index 0000000000000..57bf5b06f8536
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/newrelic.json
@@ -0,0 +1,16 @@
+{
+  "requests": {
+    "pageview": "https://${beacon}/amp?appId=${appId}&licenseKey=${licenseKey}&ampUrl=${ampdocUrl}&canonicalUrl=${canonicalUrl}&timeToDomContentLoadedEventEnd=${navTiming(domContentLoadedEventEnd)}&timeToDomInteractive=${navTiming(domInteractive)}&timeToDomComplete=${navTiming(domComplete)}&timeToDomLoading=${navTiming(domLoading)}&timeToResponseStart=${navTiming(responseStart)}&timeToResponseEnd=${navTiming(responseEnd)}&timeToLoadEventStart=${navTiming(loadEventStart)}&timeToLoadEventEnd=${navTiming(loadEventEnd)}&timeToConnectStart=${navTiming(connectStart)}&timeToConnectEnd=${navTiming(connectEnd)}&timeToFetchStart=${navTiming(fetchStart)}&timeToRequestStart=${navTiming(requestStart)}&timeToUnloadEventStart=${navTiming(unloadEventStart)}&timeToUnloadEventEnd=${navTiming(unloadEventEnd)}&timeToDomainLookupStart=${navTiming(domainLookupStart)}&timeToDomainLookupEnd=${navTiming(domainLookupEnd)}&timeToRedirectStart=${navTiming(redirectStart)}&timeToRedirectEnd=${navTiming(redirectEnd)}&timeToSecureConnection=${navTiming(secureConnectionStart)}&timestamp=${timestamp}&ampVersion=${ampVersion}&pageLoadTime=${pageLoadTime}"
+  },
+  "vars": {
+    "beacon": "bam.nr-data.net",
+    "appId": [],
+    "licenseKey": ""
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "ini-load",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/nielsen-marketing-cloud.json b/extensions/amp-analytics/0.1/vendors/nielsen-marketing-cloud.json
new file mode 100644
index 0000000000000..9f5da49d9eff3
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/nielsen-marketing-cloud.json
@@ -0,0 +1,22 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "vars": {
+    "pubId": "",
+    "siteId": ""
+  },
+  "requests": {
+    "host": "loadeu.exelator.com",
+    "pathPrefix": "load/",
+    "trackurl": "https://${host}/${pathPrefix}?p=${pubId}&g=${siteId}&j=0"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "trackurl"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/nielsen.js b/extensions/amp-analytics/0.1/vendors/nielsen.js
index 6306157f17570..03535d06f4624 100644
--- a/extensions/amp-analytics/0.1/vendors/nielsen.js
+++ b/extensions/amp-analytics/0.1/vendors/nielsen.js
@@ -25,7 +25,7 @@ const NIELSEN_CONFIG = jsonLiteral({
     'session':
       'https://${prefix}uaid-linkage.imrworldwide.com/cgi-bin/gn?prd=session&c13=asid,P${apid}&sessionId=${sessionId}_${pageViewId}&pingtype=4&enc=false&c61=createtm,${timestamp}&rnd=${random}',
     'cloudapi':
-      'https://${prefix}cloudapi.imrworldwide.com/nmapi/v2/${apid}/${sessionId}_${pageViewId}/a?b=%7B%22devInfo%22%3A%7B%22devId%22%3A%22${sessionId}_${pageViewId}%22%2C%22apn%22%3A%22${apn}%22%2C%22apv%22%3A%22${apv}%22%2C%22apid%22%3A%22${apid}%22%7D%2C%22metadata%22%3A%7B%22static%22%3A%7B%22type%22%3A%22static%22%2C%22section%22%3A%22${section}%22%2C%22assetid%22%3A%22${pageViewId}%22%2C%22segA%22%3A%22${segA}%22%2C%22segB%22%3A%22${segB}%22%2C%22segC%22%3A%22${segC}%22%2C%22adModel%22%3A%220%22%2C%22dataSrc%22%3A%22cms%22%7D%2C%22content%22%3A%7B%7D%2C%22ad%22%3A%7B%7D%7D%2C%22event%22%3A%22playhead%22%2C%22position%22%3A%22${timestamp}%22%2C%22data%22%3A%7B%22hidden%22%3A%22${backgroundState}%22%2C%22blur%22%3A%22${backgroundState}%22%2C%22position%22%3A%22${timestamp}%22%7D%2C%22type%22%3A%22static%22%2C%22utc%22%3A%22${timestamp}%22%2C%22index%22%3A%22${requestCount}%22%2C%22pageURL%22%3A%22${canonicalUrl}%22%7D',
+      'https://${prefix}cloudapi.imrworldwide.com/nmapi/v2/${apid}/${sessionId}_${pageViewId}/a?b=%7B%22devInfo%22%3A%7B%22devId%22%3A%22${sessionId}_${pageViewId}%22%2C%22apn%22%3A%22${apn}%22%2C%22apv%22%3A%22${apv}%22%2C%22apid%22%3A%22${apid}%22%7D%2C%22metadata%22%3A%7B%22static%22%3A%7B%22type%22%3A%22static%22%2C%22section%22%3A%22${section}%22%2C%22assetid%22%3A%22${pageViewId}%22%2C%22segA%22%3A%22${segA}%22%2C%22segB%22%3A%22${segB}%22%2C%22segC%22%3A%22${segC}%22%2C%22adModel%22%3A%220%22%2C%22dataSrc%22%3A%22cms%22%7D%2C%22content%22%3A%7B%7D%2C%22ad%22%3A%7B%7D%7D%2C%22event%22%3A%22playhead%22%2C%22position%22%3A%22${timestamp}%22%2C%22data%22%3A%7B%22hidden%22%3A%22${backgroundState}%22%2C%22blur%22%3A%22${backgroundState}%22%2C%22position%22%3A%22${timestamp}%22%7D%2C%22type%22%3A%22static%22%2C%22utc%22%3A%22${timestamp}%22%2C%22index%22%3A%22${requestCount}%22%2C%22pageURL%22%3A%22${ampdocUrl}%22%7D',
   },
   'triggers': {
     'visible': {
diff --git a/extensions/amp-analytics/0.1/vendors/nielsen.json b/extensions/amp-analytics/0.1/vendors/nielsen.json
new file mode 100644
index 0000000000000..e88bc580250c0
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/nielsen.json
@@ -0,0 +1,35 @@
+{
+  "vars": {
+    "sessionId": "CLIENT_ID(imrworldwide)",
+    "prefix": ""
+  },
+  "requests": {
+    "session": "https://${prefix}uaid-linkage.imrworldwide.com/cgi-bin/gn?prd=session&c13=asid,P${apid}&sessionId=${sessionId}_${pageViewId}&pingtype=4&enc=false&c61=createtm,${timestamp}&rnd=${random}",
+    "cloudapi": "https://${prefix}cloudapi.imrworldwide.com/nmapi/v2/${apid}/${sessionId}_${pageViewId}/a?b=%7B%22devInfo%22%3A%7B%22devId%22%3A%22${sessionId}_${pageViewId}%22%2C%22apn%22%3A%22${apn}%22%2C%22apv%22%3A%22${apv}%22%2C%22apid%22%3A%22${apid}%22%7D%2C%22metadata%22%3A%7B%22static%22%3A%7B%22type%22%3A%22static%22%2C%22section%22%3A%22${section}%22%2C%22assetid%22%3A%22${pageViewId}%22%2C%22segA%22%3A%22${segA}%22%2C%22segB%22%3A%22${segB}%22%2C%22segC%22%3A%22${segC}%22%2C%22adModel%22%3A%220%22%2C%22dataSrc%22%3A%22cms%22%7D%2C%22content%22%3A%7B%7D%2C%22ad%22%3A%7B%7D%7D%2C%22event%22%3A%22playhead%22%2C%22position%22%3A%22${timestamp}%22%2C%22data%22%3A%7B%22hidden%22%3A%22${backgroundState}%22%2C%22blur%22%3A%22${backgroundState}%22%2C%22position%22%3A%22${timestamp}%22%7D%2C%22type%22%3A%22static%22%2C%22utc%22%3A%22${timestamp}%22%2C%22index%22%3A%22${requestCount}%22%2C%22pageURL%22%3A%22${ampdocUrl}%22%7D"
+  },
+  "triggers": {
+    "visible": {
+      "on": "visible",
+      "request": ["session", "cloudapi"]
+    },
+    "hidden": {
+      "on": "hidden",
+      "request": "cloudapi"
+    },
+    "duration": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 10,
+        "maxTimerLength": 86400,
+        "immediate": false
+      },
+      "request": "cloudapi"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true,
+    "referrerPolicy": "no-referrer"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/oewa.json b/extensions/amp-analytics/0.1/vendors/oewa.json
new file mode 100644
index 0000000000000..4894207b8fa9b
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/oewa.json
@@ -0,0 +1,17 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "requests": {
+    "pageview": "${url}?s=${s}&amp=1&cp=${cp}&host=${canonicalHost}&path=${canonicalPath}"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview",
+      "iframePing": true
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/oewadirect.json b/extensions/amp-analytics/0.1/vendors/oewadirect.json
new file mode 100644
index 0000000000000..a875a5c4affde
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/oewadirect.json
@@ -0,0 +1,16 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "requests": {
+    "pageview": "https://${s}.oewabox.at/j0=,,,r=${canonicalUrl};+,amp=1+cp=${cp}+ssl=1+hn=${canonicalHost};;;?lt=${pageViewId}&x=${screenWidth}x${screenHeight}x24&c=CLIENT_ID(oewa)"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/oracleInfinityAnalytics.json b/extensions/amp-analytics/0.1/vendors/oracleInfinityAnalytics.json
new file mode 100644
index 0000000000000..48d860fdb4277
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/oracleInfinityAnalytics.json
@@ -0,0 +1,68 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "requests": {
+    "host": "https://dc.oracleinfinity.io/${guid}/dcs.gif?",
+    "baseUrl": "dcssip=${dcssip}&dcsuri=${dcsuri}",
+    "baseRef": "&dcsref=${documentReferrer}",
+    "baseEs": "&WT.es=${sourceHost}${sourcePath}",
+    "baseTi": "&WT.ti=${ti}&dcsdat=${timestamp}",
+    "basePrefix": "${baseUrl}${baseTi}${baseRef}${baseEs}",
+    "screenBs": "&WT.bs=${availableScreenWidth}x${availableScreenHeight}",
+    "screenSr": "&WT.sr=${screenWidth}x${screenHeight}",
+    "screenDc": "&WT.cd=${screenColorDepth}",
+    "screenMeasures": "${screenBs}${screenSr}${screenDc}",
+    "browserUl": "&WT.ul=${browserLanguage}",
+    "browserLe": "&WT.le=${documentCharset}",
+    "browserMeasures": "${browserUl}${browserLe}&WT.js=Yes",
+    "sessCof": "&WT.co_f=${clientId(WT_AMP)}",
+    "sessVer": "&ora.tv_amp=1.0.0&ora.amp_ver=${ampVersion}",
+    "sessionization": "${sessCof}${sessVer}&dcscfg=3",
+    "baseP1": "${host}${basePrefix}",
+    "baseP2": "${screenMeasures}${browserMeasures}${sessionization}",
+    "baseDl": "&WT.dl=${dl}",
+    "pageview": "${baseP1}${baseP2}${baseDl}",
+    "event": "${baseP1}${baseP2}${baseDl}",
+    "dlPdf": "a[href$=\".pdf\"]",
+    "dlXls": ",a[href$=\".xls\"]",
+    "dlPpt": ",a[href$=\".ppt\"]",
+    "dlZip": ",a[href$=\".zip\"]",
+    "dlTxt": ",a[href$=\".txt\"]",
+    "dlRtf": ",a[href$=\".rtf\"]",
+    "dlXml": ",a[href$=\".xml\"]",
+    "downLoad": "${dlPdf}${dlXls}${dlPpt}${dlZip}${dlTxt}${dlRtf}${dlXml}"
+  },
+  "vars": {
+    "dcssip": "${sourceHost}",
+    "dcsuri": "${sourcePath}",
+    "dl": "0",
+    "ti": "${title}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "trackAnchorClicks": {
+      "on": "click",
+      "selector": "a",
+      "request": "event",
+      "vars": {
+        "dl": "99",
+        "ti": "Link Click"
+      }
+    }
+  },
+  "trackDownloadClicks": {
+    "on": "click",
+    "selector": "${downLoad}",
+    "request": "event",
+    "vars": {
+      "dl": "20",
+      "ti": "Download Click"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/parsely.json b/extensions/amp-analytics/0.1/vendors/parsely.json
new file mode 100644
index 0000000000000..03ed81fee3bb0
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/parsely.json
@@ -0,0 +1,28 @@
+{
+  "requests": {
+    "host": "https://srv.pixel.parsely.com",
+    "basePrefix": "${host}/plogger/?rand=${timestamp}&idsite=${apikey}&url=${ampdocUrl}&urlref=${documentReferrer}&screen=${screenWidth}x${screenHeight}%7C${availableScreenWidth}x${availableScreenHeight}%7C${screenColorDepth}&title=${title}&date=${timestamp}&ampid=${clientId(_parsely_visitor)}",
+    "pageview": "${basePrefix}&action=pageview&metadata={\"canonical_url\":\"${canonicalUrl}\"}",
+    "heartbeat": "${basePrefix}&action=heartbeat&tt=${totalEngagedTime}&inc=${incrementalEngagedTime(parsely-js)}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "defaultHeartbeat": {
+      "on": "timer",
+      "enabled": "${incrementalEngagedTime(parsely-js,false)}",
+      "timerSpec": {
+        "interval": 10,
+        "maxTimerLength": 7200
+      },
+      "request": "heartbeat"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/permutive.json b/extensions/amp-analytics/0.1/vendors/permutive.json
new file mode 100644
index 0000000000000..c5c2b89199911
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/permutive.json
@@ -0,0 +1,50 @@
+{
+  "vars": {
+    "identity": "${clientId(_ga)}"
+  },
+  "requests": {
+    "track": "https://${namespace}.amp.permutive.com/track?k=${key}&i=${identity}&it=amp",
+    "pageview": "${track}&e=Pageview&_ep_isp_info=%24ip_isp_info&_ep_geo_info=%24ip_geo_info",
+    "engagement": "${track}&e=PageviewEngagement&_ep_engaged_time=5",
+    "completion": "${track}&e=PageviewEngagement&_ep_completion=0.25",
+    "custom": "${track}&e=${event}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "trackEngagement": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 5,
+        "maxTimerLength": 600,
+        "immediate": false
+      },
+      "request": "engagement"
+    },
+    "trackCompletion": {
+      "on": "scroll",
+      "scrollSpec": {
+        "verticalBoundaries": [25, 50, 75, 100]
+      },
+      "request": "completion"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "extraUrlParams": {
+    "properties.client.type": "amp",
+    "properties.client.title": "${title}",
+    "properties.client.domain": "${canonicalHost}",
+    "properties.client.url": "${canonicalUrl}",
+    "properties.client.referrer": "${documentReferrer}",
+    "properties.client.user_agent": "${userAgent}"
+  },
+  "extraUrlParamsReplaceMap": {
+    "properties.": "_ep_"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/piStats.json b/extensions/amp-analytics/0.1/vendors/piStats.json
new file mode 100644
index 0000000000000..26a2eb831858c
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/piStats.json
@@ -0,0 +1,18 @@
+{
+  "requests": {
+    "host": "https://events.pi-stats.com",
+    "basePrefix": "${host}/eventsamp/?e=PageLoad&pid=${property}&url=${ampdocUrl}&cnt=${cntId}&lang=${language}&ref=${documentReferrer}&id=${clientId(piStatsDEVICEID)}&ua=${userAgent}&ctype=web&blang=${browserLanguage}&v=2.0&dist=Javascript",
+    "pageview": "${basePrefix}&eventtype=pageview"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/piano.json b/extensions/amp-analytics/0.1/vendors/piano.json
new file mode 100644
index 0000000000000..0460266869b5c
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/piano.json
@@ -0,0 +1,8 @@
+{
+  "requests": {
+    "host": "https://api-v3.tinypass.com",
+    "basePrefix": "/api/v3",
+    "baseSuffix": "&pageview_id=${pageViewId}&rand=${random}&amp_client_id=${clientId}&aid=${aid}",
+    "pageview": "${host}${basePrefix}/page/track?url=${canonicalUrl}&referer=${documentReferrer}&content_created=${contentCreated}&content_author=${contentAuthor}&content_section=${contentSection}&timezone_offset=${timezone}&tags=${tags}&amp_url=${ampdocUrl}&screen=${screenWidth}x${screenHeight}${baseSuffix}"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/pinpoll.json b/extensions/amp-analytics/0.1/vendors/pinpoll.json
new file mode 100644
index 0000000000000..8a681fb8e7a3a
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/pinpoll.json
@@ -0,0 +1,16 @@
+{
+  "requests": {
+    "pageview": "${protocol}://${host}/${version}?url=${sourceUrl}&sourceHost=${sourceHost}&sourceHostname=${sourceHostname}&sourcePath=${sourcePath}&canonicalUrl=${canonicalUrl}&platform=AMP&title=${title}&referrer=${documentReferrer}&screenHeight=${screenHeight}&screenWidth=${screenWidth}&screenColorDepth=${screenColorDepth}&ua=${userAgent}&clientId=${clientId(pinpoll)}"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "vars": {
+    "version": "v1",
+    "protocol": "https",
+    "host": "pa.pinpoll.com"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/pressboard.json b/extensions/amp-analytics/0.1/vendors/pressboard.json
new file mode 100644
index 0000000000000..bc960acbf3613
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/pressboard.json
@@ -0,0 +1,40 @@
+{
+  "vars": {
+    "mediaId": "",
+    "campaignId": "",
+    "storyRequestId": "",
+    "geoNameId": "",
+    "country": "",
+    "region": "",
+    "city": "",
+    "dbInstance": "",
+    "timeZoneOffset": "",
+    "clientId": "CLIENT_ID(_pressboardmedia)"
+  },
+  "requests": {
+    "host": "https://adserver.pressboard.ca",
+    "common_params": "&amp=1&url=${canonicalUrl}&referrer=${documentReferrer}&ts=${timestamp}&ua=${userAgent}&rand=${random}&uid=${clientId}&mid=${mediaId}&cid=${campaignId}&sid=${storyRequestId}&geoid=${geoNameId}&cn=${country}&rg=${region}&ct=${city}&dbi=${dbInstance}&tz=${timeZoneOffset}",
+    "conversion_params": "&hbt=${requestCount}&pvid=${pageViewId}&asurl=${sourceUrl}&ash=${scrollHeight}&asnh=${screenHeight}&aasnh=${availableScreenHeight}&avh=${viewportHeight}&ast=${scrollTop}&atet=${totalEngagedTime}",
+    "conversion": "${host}/track/attention-amp?${common_params}${conversion_params}"
+  },
+  "triggers": {
+    "pageTimer": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 1,
+        "startSpec": {
+          "on": "visible"
+        },
+        "stopSpec": {
+          "on": "hidden"
+        }
+      },
+      "request": "conversion"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/quantcast.json b/extensions/amp-analytics/0.1/vendors/quantcast.json
new file mode 100644
index 0000000000000..1c106fe6ff42a
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/quantcast.json
@@ -0,0 +1,20 @@
+{
+  "vars": {
+    "labels": ""
+  },
+  "requests": {
+    "host": "https://pixel.quantserve.com/pixel",
+    "pageview": "${host};r=${random};a=${pcode};labels=${labels};fpan=;fpa=${clientId(__qca)};ns=0;ce=1;cm=;je=0;sr=${screenWidth}x${screenHeight}x${screenColorDepth};enc=n;et=${timestamp};ref=${documentReferrer};url=${canonicalUrl}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/rakam.json b/extensions/amp-analytics/0.1/vendors/rakam.json
new file mode 100644
index 0000000000000..103691646faa8
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/rakam.json
@@ -0,0 +1,10 @@
+{
+  "vars": {
+    "deviceId": "CLIENT_ID(rakam_device_id)"
+  },
+  "requests": {
+    "base": "?api.api_key=${writeKey}&prop._platform=amp&prop._device_id=${deviceId}&prop.locale=${browserLanguage}&prop.path=${canonicalPath}&prop.url=${canonicalUrl}&prop.color_depth=${screenColorDepth}&prop._referrer=${documentReferrer}&prop.title=${title}&prop.timezone=${timezone}&prop._time=${timestamp}&prop.resolution=${screenWidth} × ${screenHeight}",
+    "pageview": "https://${apiEndpoint}/event/pixel${base}&collection=${pageViewName}",
+    "custom": "https://${apiEndpoint}/event/pixel${base}&collection=${collection}"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/reppublika.json b/extensions/amp-analytics/0.1/vendors/reppublika.json
new file mode 100644
index 0000000000000..eeb091621f06f
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/reppublika.json
@@ -0,0 +1,13 @@
+{
+  "requests": {
+    "host": "https://t5.mindtake.com",
+    "basePrefix": "/tag/cid/",
+    "baseSuffix": "Service=${service}&Category=${category}&Url=${sourceUrl}&Device=${device}&uid=${random}",
+    "pageview": "${host}${basePrefix}${code}/track.gif?${baseSuffix}"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/retargetly.json b/extensions/amp-analytics/0.1/vendors/retargetly.json
new file mode 100644
index 0000000000000..64d6512131c83
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/retargetly.json
@@ -0,0 +1,17 @@
+{
+  "requests": {
+    "host": "https://api.retargetly.com",
+    "page": "${host}/api?id=${accountId}&src=${sourceId}&url=${sourceUrl}&n=${title}&ref=${documentReferrer}&ua=${userAgent}&random=${random}&bl=${browserLanguage}&source=amp"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "page"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/segment.json b/extensions/amp-analytics/0.1/vendors/segment.json
new file mode 100644
index 0000000000000..b2bcca6a121a0
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/segment.json
@@ -0,0 +1,35 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "vars": {
+    "anonymousId": "CLIENT_ID(AMP_ECID_GOOGLE,,_ga)"
+  },
+  "requests": {
+    "host": "https://api.segment.io/v1/pixel",
+    "base": "?writeKey=${writeKey}&context.library.name=amp&anonymousId=${anonymousId}&context.locale=${browserLanguage}&context.page.path=${canonicalPath}&context.page.url=${canonicalUrl}&context.page.referrer=${documentReferrer}&context.page.title=${title}&context.screen.width=${screenWidth}&context.screen.height=${screenHeight}",
+    "page": "${host}/page${base}&name=${name}",
+    "track": "${host}/track${base}&event=${event}"
+  },
+  "triggers": {
+    "page": {
+      "on": "visible",
+      "request": "page"
+    }
+  },
+  "linkers": {
+    "segment": {
+      "ids": {
+        "s_amp_id": "${anonymousId}"
+      },
+      "proxyOnly": false
+    }
+  },
+  "cookies": {
+    "_ga": {
+      "value": "LINKER_PARAM(segment, s_amp_id)"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/shinystat.json b/extensions/amp-analytics/0.1/vendors/shinystat.json
new file mode 100644
index 0000000000000..3963f5d86ee60
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/shinystat.json
@@ -0,0 +1,23 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "requests": {
+    "base": "https://amp.shinystat.com/cgi-bin/shinyamp.cgi",
+    "commpar": "AMP=1&RM=${random}&USER=${account}&PAG=${page}&HR=${sourceUrl}&REFER=${documentReferrer}&RES=${screenWidth}X${screenHeight}&COLOR=${screenColorDepth}&CID=${clientId(AMP_CID)}&PAGID=${pageViewId}&TITL=${title}&RQC=${requestCount}",
+    "pagepar": "&VIE=${viewer}&PLT=${pageLoadTime}",
+    "eventpar": "&SSXL=1",
+    "linkpar": "&LINK=${outboundLink}",
+    "pageview": "${base}?${commpar}${pagepar}",
+    "event": "${base}?${commpar}${eventpar}",
+    "link": "${base}?${commpar}${linkpar}"
+  },
+  "triggers": {
+    "pageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/simplereach.json b/extensions/amp-analytics/0.1/vendors/simplereach.json
new file mode 100644
index 0000000000000..bb6ce6e479198
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/simplereach.json
@@ -0,0 +1,29 @@
+{
+  "vars": {
+    "pid": "",
+    "published_at": "",
+    "authors": [],
+    "channels": [],
+    "tags": []
+  },
+  "requests": {
+    "host": "https://edge.simplereach.com",
+    "baseParams": "amp=true&pid=${pid}&title=${title}&url=${canonicalUrl}&date=${published_at}&authors=${authors}&channels=${categories}&tags=${tags}&referrer=${documentReferrer}&page_url=${sourceUrl}&user_id=${clientId(sr_amp_id)}&domain=${canonicalHost}&article_id=${article_id}&ignore_metadata=${ignore_metadata}",
+    "visible": "${host}/n?${baseParams}",
+    "timer": "${host}/t?${baseParams}&t=5000&e=5000"
+  },
+  "triggers": {
+    "visible": {
+      "on": "visible",
+      "request": "visible"
+    },
+    "timer": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 5,
+        "maxTimerLength": 1200
+      },
+      "request": "timer"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/snowplow.js b/extensions/amp-analytics/0.1/vendors/snowplow.js
index bd4481cf0e8b9..2695596959bf9 100644
--- a/extensions/amp-analytics/0.1/vendors/snowplow.js
+++ b/extensions/amp-analytics/0.1/vendors/snowplow.js
@@ -14,6 +14,8 @@
  * limitations under the License.
  */
 
+// To contribute, please submit issues and PRs to https://github.com/snowplow-incubator/amphtml
+
 import {jsonLiteral} from '../../../../src/json';
 
 const SNOWPLOW_CONFIG = jsonLiteral({
@@ -43,6 +45,10 @@ const SNOWPLOW_CONFIG = jsonLiteral({
     'xhrpost': false,
     'image': true,
   },
+  'warningMessage': {
+    'message':
+      'This version of Snowplow AMP tracking is deprecated. Please use snowplow_v2.',
+  },
 });
 
 export {SNOWPLOW_CONFIG};
diff --git a/extensions/amp-analytics/0.1/vendors/snowplow.json b/extensions/amp-analytics/0.1/vendors/snowplow.json
new file mode 100644
index 0000000000000..4f337cdfe6026
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/snowplow.json
@@ -0,0 +1,16 @@
+{
+  "vars": {
+    "duid": "CLIENT_ID(_sp_id)"
+  },
+  "requests": {
+    "aaVersion": "amp-0.3",
+    "basePrefix": "https://${collectorHost}/i?url=${canonicalUrl}&page=${title}&res=${screenWidth}x${screenHeight}&stm=${timestamp}&tz=${timezoneCode}&aid=${appId}&p=web&tv=${aaVersion}&cd=${screenColorDepth}&cs=${documentCharset}&duid=${duid}&lang=${browserLanguage}&refr=${documentReferrer}&vp=${viewportWidth}x${viewportHeight}&ds=${scrollWidth}x${scrollHeight}",
+    "pageView": "${basePrefix}&e=pv",
+    "structEvent": "${basePrefix}&e=se&se_ca=${structEventCategory}&se_ac=${structEventAction}&se_la=${structEventLabel}&se_pr=${structEventProperty}&se_va=${structEventValue}"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/snowplow_v2.js b/extensions/amp-analytics/0.1/vendors/snowplow_v2.js
new file mode 100644
index 0000000000000..5a83ed62a7013
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/snowplow_v2.js
@@ -0,0 +1,88 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// To contribute, please submit issues and PRs to https://github.com/snowplow-incubator/amphtml
+
+import {jsonLiteral} from '../../../../src/json';
+
+const SNOWPLOW_V2_CONFIG = jsonLiteral({
+  'linkers': {
+    'linker': {
+      'ids': {
+        '_sp_duid': '${duid}',
+        'amp_id': '${ampVistorId}',
+      },
+    },
+  },
+  'cookies': {
+    'enabled': true,
+    '_sp_duid': {
+      'value':
+        '$IF($IF(COOKIE(_sp_duid), COOKIE(_sp_duid), LINKER_PARAM(linker,_sp_duid)), $IF(COOKIE(_sp_duid), COOKIE(_sp_duid), LINKER_PARAM(linker,_sp_duid)), $SUBSTR(QUERY_PARAM(_sp),0,36))',
+    },
+  },
+  'vars': {
+    'aaVersion': 'amp-1.0.0',
+    'ampVistorId': 'CLIENT_ID(_sp_id)',
+    'nullString': 'null',
+    'customEventTemplate': [
+      '{',
+      '"schema":"iglu:com.snowplowanalytics.snowplow/unstruct_event/jsonschema/1-0-0",',
+      '"data":{',
+      '"schema":"iglu:${customEventSchemaVendor}/${customEventSchemaName}/jsonschema/${customEventSchemaVersion}",',
+      '"data":',
+      '${customEventSchemaData}',
+      '}',
+      '}',
+    ].join(''),
+    'contextsHead':
+      '{"schema":"iglu:com.snowplowanalytics.snowplow/contexts/jsonschema/1-0-0","data":[{"schema":"iglu:dev.amp.snowplow/amp_id/jsonschema/1-0-0","data":{"ampClientId":"${ampVistorId}", "domainUserid": "COOKIE(_sp_duid)", "userId": "${userId}"}},$REPLACE(`${customContexts}`, `^,*(.+?),*$`, `$1,`)',
+    'contextsTail':
+      '{"schema":"iglu:dev.amp.snowplow/amp_web_page/jsonschema/1-0-0","data":{"ampPageViewId":"PAGE_VIEW_ID_64"}}]}',
+  },
+  'requests': {
+    'basePrefix': 'https://${collectorHost}/i?p=web&tv=${aaVersion}',
+    'pageView': '${basePrefix}&e=pv',
+    'structEvent':
+      '${basePrefix}&e=se&se_ca=${structEventCategory}&se_ac=${structEventAction}&se_la=${structEventLabel}&se_pr=${structEventProperty}&se_va=$IF(${structEventValue}, ${structEventValue}, ${nullString})',
+    'pagePing': '${basePrefix}&e=pp&pp_mix=${scrollLeft}&pp_miy=${scrollTop}',
+    'selfDescribingEvent': '${basePrefix}&e=ue&ue_pr=${customEventTemplate}',
+  },
+  'extraUrlParams': {
+    'url': '${ampdocUrl}',
+    'page': '${title}',
+    'res': '${screenWidth}x${screenHeight}',
+    'dtm': '${timestamp}',
+    'tz': '${timezoneCode}',
+    'aid': '${appId}',
+    'cd': '${screenColorDepth}',
+    'cs': '${documentCharset}',
+    'lang': '${browserLanguage}',
+    'refr': '${documentReferrer}',
+    'vp': '${viewportWidth}x${viewportHeight}',
+    'ua': '${userAgent}',
+    'ds': '${scrollWidth}x${scrollHeight}',
+    'uid': '${userId}',
+    'co': '${contextsHead}${contextsTail}',
+  },
+  'transport': {
+    'beacon': false,
+    'xhrpost': false,
+    'image': true,
+  },
+});
+
+export {SNOWPLOW_V2_CONFIG};
diff --git a/extensions/amp-analytics/0.1/vendors/snowplow_v2.json b/extensions/amp-analytics/0.1/vendors/snowplow_v2.json
new file mode 100644
index 0000000000000..410315e6acd57
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/snowplow_v2.json
@@ -0,0 +1,53 @@
+{
+  "linkers": {
+    "linker": {
+      "ids": {
+        "_sp_duid": "${duid}",
+        "amp_id": "${ampVistorId}"
+      }
+    }
+  },
+  "cookies": {
+    "enabled": true,
+    "_sp_duid": {
+      "value": "$IF($IF(COOKIE(_sp_duid), COOKIE(_sp_duid), LINKER_PARAM(linker,_sp_duid)), $IF(COOKIE(_sp_duid), COOKIE(_sp_duid), LINKER_PARAM(linker,_sp_duid)), $SUBSTR(QUERY_PARAM(_sp),0,36))"
+    }
+  },
+  "vars": {
+    "aaVersion": "amp-1.0.0",
+    "ampVistorId": "CLIENT_ID(_sp_id)",
+    "nullString": "null",
+    "customEventTemplate": "{\"schema\":\"iglu:com.snowplowanalytics.snowplow/unstruct_event/jsonschema/1-0-0\",\"data\":{\"schema\":\"iglu:${customEventSchemaVendor}/${customEventSchemaName}/jsonschema/${customEventSchemaVersion}\",\"data\":${customEventSchemaData}}}",
+    "contextsHead": "{\"schema\":\"iglu:com.snowplowanalytics.snowplow/contexts/jsonschema/1-0-0\",\"data\":[{\"schema\":\"iglu:dev.amp.snowplow/amp_id/jsonschema/1-0-0\",\"data\":{\"ampClientId\":\"${ampVistorId}\", \"domainUserid\": \"COOKIE(_sp_duid)\", \"userId\": \"${userId}\"}},$REPLACE(`${customContexts}`, `^,*(.+?),*$`, `$1,`)",
+    "contextsTail": "{\"schema\":\"iglu:dev.amp.snowplow/amp_web_page/jsonschema/1-0-0\",\"data\":{\"ampPageViewId\":\"PAGE_VIEW_ID_64\"}}]}"
+  },
+  "requests": {
+    "basePrefix": "https://${collectorHost}/i?p=web&tv=${aaVersion}",
+    "pageView": "${basePrefix}&e=pv",
+    "structEvent": "${basePrefix}&e=se&se_ca=${structEventCategory}&se_ac=${structEventAction}&se_la=${structEventLabel}&se_pr=${structEventProperty}&se_va=$IF(${structEventValue}, ${structEventValue}, ${nullString})",
+    "pagePing": "${basePrefix}&e=pp&pp_mix=${scrollLeft}&pp_miy=${scrollTop}",
+    "selfDescribingEvent": "${basePrefix}&e=ue&ue_pr=${customEventTemplate}"
+  },
+  "extraUrlParams": {
+    "url": "${ampdocUrl}",
+    "page": "${title}",
+    "res": "${screenWidth}x${screenHeight}",
+    "dtm": "${timestamp}",
+    "tz": "${timezoneCode}",
+    "aid": "${appId}",
+    "cd": "${screenColorDepth}",
+    "cs": "${documentCharset}",
+    "lang": "${browserLanguage}",
+    "refr": "${documentReferrer}",
+    "vp": "${viewportWidth}x${viewportHeight}",
+    "ua": "${userAgent}",
+    "ds": "${scrollWidth}x${scrollHeight}",
+    "uid": "${userId}",
+    "co": "${contextsHead}${contextsTail}"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/subscriptions-propensity.js b/extensions/amp-analytics/0.1/vendors/subscriptions-propensity.js
new file mode 100644
index 0000000000000..68daf0dcafc48
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/subscriptions-propensity.js
@@ -0,0 +1,99 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {jsonLiteral} from '../../../../src/json';
+
+const SUBSCRIPTIONS_PROPENSITY_CONFIG = jsonLiteral({
+  'vars': {
+    'clientId': 'CLIENT_ID(__gads)',
+    'productObj': '{"product": [${products}]}',
+    'stateParams': '${publicationId}:${state}',
+    'eventParams': '${publicationId}:${event}',
+  },
+  'requests': {
+    'baseUrl': 'https://pubads.g.doubleclick.net/subopt',
+    'baseParams':
+      'u_tz=240&v=1&cookie=${clientId}&cdm=${sourceHostName}&_amp_source_origin=${sourceHost}&extrainfo=',
+    'sendBase': '${baseUrl}/data?${baseParams}',
+    'sendSubscriptionState': '${sendBase}${productObj}&states=${stateParams}',
+    'sendEvent': '${sendBase}${data}&events=${eventParams}',
+  },
+  'triggers': {
+    'onSubscribed': {
+      'on': 'subscriptions-access-granted',
+      'request': 'sendSubscriptionState',
+      'vars': {
+        'state': 'subscriber',
+        'products': '"${productId}"',
+      },
+    },
+    'onNotSubscribed': {
+      'on': 'subscriptions-access-denied',
+      'request': 'sendSubscriptionState',
+      'vars': {
+        'state': 'non_subscriber',
+        'products': '"${productId}"',
+      },
+    },
+    'onShowOffers': {
+      'on': 'subscriptions-action-showOffers-started',
+      'request': 'sendEvent',
+      'vars': {
+        'event': 'offers_shown',
+        'data': '{"skus": "${skus}","source": "${source}"}',
+      },
+    },
+    'onPaywall': {
+      'on': 'subscriptions-paywall-activated',
+      'request': 'sendEvent',
+      'vars': {
+        'event': 'paywall',
+        'data': '{"is_active": false, "source": "${source}"}',
+      },
+    },
+    'onSelectOffer': {
+      'on': 'subscriptions-action-subscribe-started',
+      'request': 'sendEvent',
+      'vars': {
+        'event': 'offer_selected',
+        'data': '{"is_active": true,"product": "${product}"}',
+      },
+    },
+    'onStartBuyflow': {
+      'on': 'subscriptions-action-subscribe-started',
+      'request': 'sendEvent',
+      'vars': {
+        'event': 'payment_flow_start',
+        'data': '{"is_active": true,"product": "${product}"}',
+      },
+    },
+    'onPaymentComplete': {
+      'on': 'subscriptions-action-subscribe-success',
+      'request': 'sendEvent',
+      'vars': {
+        'event': 'payment_complete',
+        'data': '{"is_active": true,"product": "${product}"}',
+      },
+    },
+  },
+  'transport': {
+    'beacon': true,
+    'xhrpost': false,
+    'image': false,
+  },
+});
+
+export {SUBSCRIPTIONS_PROPENSITY_CONFIG};
diff --git a/extensions/amp-analytics/0.1/vendors/subscriptions-propensity.json b/extensions/amp-analytics/0.1/vendors/subscriptions-propensity.json
new file mode 100644
index 0000000000000..f3c0caf84c1d9
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/subscriptions-propensity.json
@@ -0,0 +1,77 @@
+{
+  "vars": {
+    "clientId": "CLIENT_ID(__gads)",
+    "productObj": "{\"product\": [${products}]}",
+    "stateParams": "${publicationId}:${state}",
+    "eventParams": "${publicationId}:${event}"
+  },
+  "requests": {
+    "baseParams": "u_tz=240&v=1&cookie=${clientId}&cdm=${sourceHostName}&_amp_source_origin=${sourceHost}&extrainfo=",
+    "sendBase": "https://pubads.g.doubleclick.net/subopt/data?${baseParams}",
+    "sendSubscriptionState": "${sendBase}${productObj}&states=${stateParams}",
+    "sendEvent": "${sendBase}${data}&events=${eventParams}"
+  },
+  "triggers": {
+    "onSubscribed": {
+      "on": "subscriptions-access-granted",
+      "request": "sendSubscriptionState",
+      "vars": {
+        "state": "subscriber",
+        "products": "\"${productId}\""
+      }
+    },
+    "onNotSubscribed": {
+      "on": "subscriptions-access-denied",
+      "request": "sendSubscriptionState",
+      "vars": {
+        "state": "non_subscriber",
+        "products": "\"${productId}\""
+      }
+    },
+    "onShowOffers": {
+      "on": "subscriptions-action-showOffers-started",
+      "request": "sendEvent",
+      "vars": {
+        "event": "offers_shown",
+        "data": "{\"skus\": \"${skus}\",\"source\": \"${source}\"}"
+      }
+    },
+    "onPaywall": {
+      "on": "subscriptions-paywall-activated",
+      "request": "sendEvent",
+      "vars": {
+        "event": "paywall",
+        "data": "{\"is_active\": false, \"source\": \"${source}\"}"
+      }
+    },
+    "onSelectOffer": {
+      "on": "subscriptions-action-subscribe-started",
+      "request": "sendEvent",
+      "vars": {
+        "event": "offer_selected",
+        "data": "{\"is_active\": true,\"product\": \"${product}\"}"
+      }
+    },
+    "onStartBuyflow": {
+      "on": "subscriptions-action-subscribe-started",
+      "request": "sendEvent",
+      "vars": {
+        "event": "payment_flow_start",
+        "data": "{\"is_active\": true,\"product\": \"${product}\"}"
+      }
+    },
+    "onPaymentComplete": {
+      "on": "subscriptions-action-subscribe-success",
+      "request": "sendEvent",
+      "vars": {
+        "event": "payment_complete",
+        "data": "{\"is_active\": true,\"product\": \"${product}\"}"
+      }
+    }
+  },
+  "transport": {
+    "beacon": true,
+    "xhrpost": false,
+    "image": false
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/teaanalytics.json b/extensions/amp-analytics/0.1/vendors/teaanalytics.json
new file mode 100644
index 0000000000000..7182b7c524b59
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/teaanalytics.json
@@ -0,0 +1,13 @@
+{
+  "vars": {
+    "userUniqueId": "${clientId(__tea_sdk__user_unique_id)}",
+    "debug": 0
+  },
+  "requests": {
+    "domain": "https://${channel}/v1/amp",
+    "commonParams": "user.user_unique_id=${userUniqueId}&header.app_id=${app_id}&header.language=${browserLanguage}&header.screen_height=${screenHeight}&header.screen_width=${screenWidth}&header.resolution=${screenHeight}x${screenWidth}&header.tz_offset=${timezone}&header.tz_name=${timezoneCode}&header.referrer=${documentReferrer}&header.custom.user_agent=${userAgent}&event.local_time_ms=${timestamp}&event.params._staging_flag=${debug}&verbose=${debug}",
+    "base": "${domain}?${commonParams}&rnd=${random}",
+    "pageview": "${base}&event=predefine_pageview&event.params.url=${sourceUrl}&event.params.url_path=${sourcePath}&event.params.title=${title}",
+    "event": "${base}"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/tealiumcollect.json b/extensions/amp-analytics/0.1/vendors/tealiumcollect.json
new file mode 100644
index 0000000000000..570dc3f35f4f5
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/tealiumcollect.json
@@ -0,0 +1,32 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "vars": {
+    "account": "TEALIUM_ACCOUNT",
+    "profile": "TEALIUM_PROFILE",
+    "datasource": "TEALIUM_DATASOURCE",
+    "visitor_id": "CLIENT_ID(AMP_ECID_GOOGLE,,_ga)"
+  },
+  "requests": {
+    "host": "https://collect.tealiumiq.com",
+    "base": "${host}/event/?${tealium}&${dom1}&${dom2}&${datetime}&tealium_event=${tealium_event}&amp_version=${ampVersion}&amp_request_count=${requestCount}",
+    "tealium": "tealium_account=${account}&tealium_profile=${profile}&tealium_datasource=${datasource}&tealium_visitor_id=${visitor_id}",
+    "dom1": "url=${sourceUrl}&ampdoc_url=${ampdocUrl}&domain=${sourceHost}&pathname=${sourcePath}&amp_hostname=${ampdocHostname}&canonical_hostname=${canonicalHostname}",
+    "dom2": "title=${title}&viewport_width=${availableScreenWidth}&viewport_height=${availableScreenHeight}",
+    "datetime": "timestamp=${timestamp}&tz=${timezone}&lang=${browserLanguage}",
+    "pageview": "${base}&referrer=${documentReferrer}&screen_size=${screenWidth}x${screenHeight}&content_load_ms=${contentLoadTime}&page_view_id=${pageViewId}",
+    "event": "${base}&scroll_y=${scrollTop}&scroll_x=${scrollLeft}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview",
+      "vars": {
+        "tealium_event": "screen_view"
+      }
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/top100.json b/extensions/amp-analytics/0.1/vendors/top100.json
new file mode 100644
index 0000000000000..8d6bba978d926
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/top100.json
@@ -0,0 +1,26 @@
+{
+  "vars": {
+    "pid": "",
+    "rid": "PAGE_VIEW_ID",
+    "ruid": "CLIENT_ID(ruid)",
+    "version": "1.0.0"
+  },
+  "requests": {
+    "host": "https://kraken.rambler.ru",
+    "base": "${host}/cnt/?pid=${pid}&rid=${rid}&v=${version}&rn=${random}&ruid=${ruid}&ct=amp",
+    "pageview": "${base}&et=pv${_pageData}${_screenData}",
+    "_screenData": "&sr=${screenWidth}x${screenHeight}&cd=${screenColorDepth}-bit&bs=${scrollWidth}x${scrollHeight}",
+    "_pageData": "&pt=${title}&rf=${documentReferrer}&en=${documentCharset}&la=${browserLanguage}&tz=${timezone}"
+  },
+  "triggers": {
+    "trackPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/topmailru.json b/extensions/amp-analytics/0.1/vendors/topmailru.json
new file mode 100644
index 0000000000000..939ffb62a8928
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/topmailru.json
@@ -0,0 +1,24 @@
+{
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  },
+  "vars": {
+    "url": "${sourceUrl}",
+    "referrer": "${documentReferrer}"
+  },
+  "requests": {
+    "pageView": "${_domain}/counter?${_basicMessage};title=${title}",
+    "reachGoal": "${_domain}/tracker?${_basicMessage};title=${title};e=RG%3A${value}%2F${goal}",
+    "sendEvent": "${_domain}/tracker?${_basicMessage};e=CE%3A${value}%2F${category}%3B${action}%3B${label}",
+    "_domain": "https://top-fwz1.mail.ru",
+    "_basicMessage": "js=13;id=${id};u=${url};r=${referrer};s=${screenWidth}*${screenHeight};vp=${viewportWidth}*${viewportHeight};st=${start};gender=${gender};age=${age};pid=${pid};userid=${userid};device=${device};params=${params};_=${random}"
+  },
+  "triggers": {
+    "pageView": {
+      "on": "visible",
+      "request": "pageView"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/treasuredata.json b/extensions/amp-analytics/0.1/vendors/treasuredata.json
new file mode 100644
index 0000000000000..59dba6222961a
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/treasuredata.json
@@ -0,0 +1,14 @@
+{
+  "vars": {
+    "host": "in.treasuredata.com",
+    "writeKey": "",
+    "database": "",
+    "table": "events"
+  },
+  "requests": {
+    "base": "https://${host}/postback/v3/event/${database}",
+    "baseParams": "td_write_key=${writeKey}&td_global_id=td_global_id&td_client_id=CLIENT_ID(_td)&td_charset=DOCUMENT_CHARSET&td_language=BROWSER_LANGUAGE&td_color=SCREEN_COLOR_DEPTH&td_screen=${screenWidth}x${scrollHeight}&td_viewport=${availableScreenWidth}x${availableScreenHeight}&td_title=TITLE&td_url=SOURCE_URL&td_user_agent=USER_AGENT&td_host=SOURCE_HOST&td_path=SOURCE_PATH&td_referrer=DOCUMENT_REFERRER&td_ip=td_ip",
+    "pageview": "${base}/${table}?${baseParams}",
+    "event": "${base}/${table}?${baseParams}"
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/umenganalytics.json b/extensions/amp-analytics/0.1/vendors/umenganalytics.json
new file mode 100644
index 0000000000000..01e779c9fcaf9
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/umenganalytics.json
@@ -0,0 +1,24 @@
+{
+  "vars": {
+    "siteid": "",
+    "initial_view_time": "",
+    "eventName": "",
+    "eventProps": ""
+  },
+  "requests": {
+    "base": "https://b.cnzz.com/utrack?&_siteid=${siteid}&_distinct_id=${clientId(umeng_amp_id)}&_t=${timestamp}&_s=google&_b=web&_r=${externalReferrer}&_h=${screenHeight}&_w=${screenWidth}&_ivt=${initial_view_time}",
+    "pageview": "${base}&_ename=$w_page_view&_eprops=${eventProps}",
+    "event": "${base}&_ename=${eventName}&_eprops=${eventProps}"
+  },
+  "triggers": {
+    "defaultPageview": {
+      "on": "visible",
+      "request": "pageview"
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/upscore.js b/extensions/amp-analytics/0.1/vendors/upscore.js
index 9cb0f84d884f8..df62496e6b6ac 100644
--- a/extensions/amp-analytics/0.1/vendors/upscore.js
+++ b/extensions/amp-analytics/0.1/vendors/upscore.js
@@ -36,12 +36,21 @@ const UPSCORE_CONFIG = jsonLiteral({
       'pubdate=${pubdate}&' +
       'ref=${documentReferrer}&' +
       'section=${section}&' +
-      'url=${ampdocUrl}&' +
+      'url=${canonicalUrl}&' +
       'agent=${userAgent}&' +
-      'location=${ampGeo(ISOCountry)}',
+      'location=${ampGeo(ISOCountry)}&' +
+      'c_keys=${customKeys}&' +
+      'c_values=${customValues}',
     'finalbeat': '${host}${basePrefix}&type=final',
     'heartbeat': '${host}${basePrefix}&type=pulse',
     'pageview': '${host}${basePrefix}&${initialHit}&type=init',
+    'videoBase': '${host}url=${canonicalUrl}&video_id=${video_id}',
+    'videoTime': 'ct=${currentTime}&d=${duration}',
+    'video-play':
+      '${videoBase}&e=video_start&${videoTime}&video_name=${video_name}&video_thumb=${video_thumbnail}',
+    'video-pause': '${videoBase}&e=video_pause&${videoTime}',
+    'video-stop': '${videoBase}&e=video_stop&${videoTime}',
+    'video-info': '${videoBase}&e=video_position&${videoTime}',
   },
   'triggers': {
     'initHit': {
diff --git a/extensions/amp-analytics/0.1/vendors/upscore.json b/extensions/amp-analytics/0.1/vendors/upscore.json
new file mode 100644
index 0000000000000..e76a16f88ea50
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/upscore.json
@@ -0,0 +1,45 @@
+{
+  "requests": {
+    "host": "https://hit-pool.upscore.com/amp?",
+    "basePrefix": "u_id=${clientId(upscore)}&hit_id=${pageViewId}&scTop=${scrollTop}&scHeight=${scrollHeight}&vHeight=${viewportHeight}&domain=${domain}&load=${domInteractiveTime}&timespent=${totalEngagedTime}",
+    "initialHit": "author=${author}&creator=${creator}&o_id=${object_id}&o_type=${object_type}&pubdate=${pubdate}&ref=${documentReferrer}&section=${section}&url=${canonicalUrl}&agent=${userAgent}&location=${ampGeo(ISOCountry)}&c_keys=${customKeys}&c_values=${customValues}",
+    "finalbeat": "${host}${basePrefix}&type=final",
+    "heartbeat": "${host}${basePrefix}&type=pulse",
+    "pageview": "${host}${basePrefix}&${initialHit}&type=init",
+    "videoBase": "${host}url=${canonicalUrl}&video_id=${video_id}",
+    "videoTime": "ct=${currentTime}&d=${duration}",
+    "video-play": "${videoBase}&e=video_start&${videoTime}&video_name=${video_name}&video_thumb=${video_thumbnail}",
+    "video-pause": "${videoBase}&e=video_pause&${videoTime}",
+    "video-stop": "${videoBase}&e=video_stop&${videoTime}",
+    "video-info": "${videoBase}&e=video_position&${videoTime}"
+  },
+  "triggers": {
+    "initHit": {
+      "on": "visible",
+      "request": "pageview"
+    },
+    "pulse": {
+      "on": "timer",
+      "timerSpec": {
+        "interval": 10,
+        "immediate": false,
+        "stopSpec": {
+          "on": "hidden"
+        }
+      },
+      "request": "heartbeat"
+    },
+    "final": {
+      "on": "hidden",
+      "visibilitySpec": {
+        "totalTimeMin": 5000
+      },
+      "request": "finalbeat"
+    }
+  },
+  "transport": {
+    "beacon": true,
+    "xhrpost": true,
+    "image": false
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/vponanalytics.json b/extensions/amp-analytics/0.1/vendors/vponanalytics.json
new file mode 100644
index 0000000000000..2ab6233a29f5d
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/vponanalytics.json
@@ -0,0 +1,35 @@
+{
+  "vars": {
+    "ctid": "${clientId(vpadn-ctid)}"
+  },
+  "requests": {
+    "host": "https://tags-dmp.vpadn.com",
+    "sync": "https://ids-dmp.vpadn.com/set?t=${timestamp}&dn=&ctid=${ctid}",
+    "scroll": "${host}/et?t=${timestamp}&sdkn=j&sdkv=1.2.0&lk=${licence_key}&en=UTF-8&ctid=${ctid}&ev=element_interact&pl={\"name\":\"${category}\",\"action\":\"${action}\",\"value\":\"${documentReferrer}\"}",
+    "event": "${host}/et?t=${timestamp}&sdkn=j&sdkv=1.2.0&lk=${licence_key}&en=UTF-8&ctid=${ctid}&ev=${ev_name}&pl=${payload}",
+    "elementInteract": "${host}/et?t=${timestamp}&sdkn=j&sdkv=1.2.0&lk=${licence_key}&en=UTF-8&ctid=${ctid}&ev=element_interact&pl={\"name\":\"${category}\",\"action\":\"${action}\",\"value\":\"${label}\"}"
+  },
+  "extraUrlParams": {
+    "is_amp": "1",
+    "page_id": "${pageViewId}"
+  },
+  "triggers": {
+    "cookieSync": {
+      "on": "visible",
+      "request": "sync"
+    },
+    "trackPageview": {
+      "on": "visible",
+      "request": "event",
+      "vars": {
+        "ev_name": "page_view",
+        "payload": "{\"title\":\"${title}\",\"current\":\"${canonicalUrl}\",\"previous\":\"${documentReferrer}\"}"
+      }
+    }
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/webengage.json b/extensions/amp-analytics/0.1/vendors/webengage.json
new file mode 100644
index 0000000000000..edab4e9dd1f8a
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/webengage.json
@@ -0,0 +1,17 @@
+{
+  "requests": {
+    "base": "https://c.${region}.webengage.com/amp?licenseCode=${licenseCode}&luid=${clientId(we_luid)}&pageUrl=${canonicalUrl}&pageTitle=${title}&referrer=${documentReferrer}&vh=${viewportHeight}&vw=${viewportWidth}&category=application",
+    "wePageview": {
+      "baseUrl": "${base}&eventName=Page Viewed"
+    }
+  },
+  "extraUrlParams": {
+    "isAmp": 1
+  },
+  "triggers": {
+    "wePageviewTrigger": {
+      "on": "visible",
+      "request": "wePageview"
+    }
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/webtrekk.json b/extensions/amp-analytics/0.1/vendors/webtrekk.json
new file mode 100644
index 0000000000000..f0fad10c1ead0
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/webtrekk.json
@@ -0,0 +1,17 @@
+{
+  "requests": {
+    "trackURL": "https://${trackDomain}/${trackId}/wt",
+    "parameterPrefix": "?p=432,${contentId},1,${screenWidth}x${screenHeight},${screenColorDepth},1,${timestamp},${documentReferrer},${viewportWidth}x${viewportHeight},0&tz=${timezone}&eid=${clientId(amp-wt3-eid)}&la=${browserLanguage}",
+    "parameterSuffix": "&pu=${sourceUrl}",
+    "pageParameter": "&cp1=${pageParameter1}&cp2=${pageParameter2}&cp3=${pageParameter3}&cp4=${pageParameter4}&cp5=${pageParameter5}&cp6=${pageParameter6}&cp7=${pageParameter7}&cp8=${pageParameter8}&cp9=${pageParameter9}&cp10=${pageParameter10}",
+    "pageCategories": "&cg1=${pageCategory1}&cg2=${pageCategory2}&cg3=${pageCategory3}&cg4=${pageCategory4}&cg5=${pageCategory5}&cg6=${pageCategory6}&cg7=${pageCategory7}&cg8=${pageCategory8}&cg9=${pageCategory9}&cg10=${pageCategory10}",
+    "pageview": "${trackURL}${parameterPrefix}${pageParameter}${pageCategories}${parameterSuffix}",
+    "actionParameter": "&ck1=${actionParameter1}&ck2=${actionParameter2}&ck3=${actionParameter3}&ck4=${actionParameter4}&ck5=${actionParameter5}",
+    "event": "${trackURL}${parameterPrefix}&ct=${actionName}${actionParameter}${parameterSuffix}"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/0.1/vendors/webtrekk_v2.json b/extensions/amp-analytics/0.1/vendors/webtrekk_v2.json
new file mode 100644
index 0000000000000..da20415a6c986
--- /dev/null
+++ b/extensions/amp-analytics/0.1/vendors/webtrekk_v2.json
@@ -0,0 +1,39 @@
+{
+  "vars": {
+    "actionName": "webtrekk_ignore",
+    "contentId": "${title}",
+    "mediaName": "${id}",
+    "everId": "${clientId(amp-wt3-eid)}"
+  },
+  "requests": {
+    "trackURL": "https://${trackDomain}/${trackId}/wt",
+    "basePrefix": "?p=440,${contentId},1,${screenWidth}x${screenHeight},${screenColorDepth},1,",
+    "baseSuffix": ",${documentReferrer},${viewportWidth}x${viewportHeight},0&tz=${timezone}&eid=${everId}&la=${browserLanguage}",
+    "parameterPrefix": "${basePrefix}${timestamp}${baseSuffix}",
+    "parameterSuffix": "&pu=${sourceUrl}&eor=1",
+    "pageview": "${trackURL}${parameterPrefix}&${extraUrlParams}&cp570=${pageLoadTime}${parameterSuffix}",
+    "event": "${trackURL}${parameterPrefix}&ct=${actionName}&${extraUrlParams}${parameterSuffix}",
+    "scroll": "${trackURL}${parameterPrefix}&ct=${actionName}&ck540=${verticalScrollBoundary}${parameterSuffix}",
+    "mediaPrefix": "${trackURL}${basePrefix}${baseSuffix}&mi=${mediaName}",
+    "mediaSuffix": "&mt1=${currentTime}&mt2=${duration}&${extraUrlParams}${parameterSuffix}&x=${playedTotal}",
+    "mediaPlay": "${mediaPrefix}&mk=play${mediaSuffix}",
+    "mediaPause": "${mediaPrefix}&mk=pause${mediaSuffix}",
+    "mediaPosition": "${mediaPrefix}&mk=pos${mediaSuffix}",
+    "mediaEnded": "${mediaPrefix}&mk=eof${mediaSuffix}"
+  },
+  "extraUrlParamsReplaceMap": {
+    "pageParameter": "cp",
+    "contentGroup": "cg",
+    "actionParameter": "ck",
+    "sessionParameter": "cs",
+    "ecommerceParameter": "cb",
+    "urmCategory": "uc",
+    "campaignParameter": "cc",
+    "mediaCategory": "mg"
+  },
+  "transport": {
+    "beacon": false,
+    "xhrpost": false,
+    "image": true
+  }
+}
diff --git a/extensions/amp-analytics/amp-analytics.md b/extensions/amp-analytics/amp-analytics.md
index 0c3096ddcb7b4..cb4584e0ffd9b 100644
--- a/extensions/amp-analytics/amp-analytics.md
+++ b/extensions/amp-analytics/amp-analytics.md
@@ -393,13 +393,13 @@ The following config sends out the first request ping after 1 second and then se
 
 The `amp-analytics` component defines many basic variables that can be used in requests. A list of all such variables is available in the [`amp-analytics` Variables Guide](./analytics-vars.md). In addition, all of the variables supported by [AMP HTML Substitutions Guide](../../spec/amp-var-substitutions.md) are also supported.
 
-The `vars` configuration object can be used to define new key-value pairs or override existing variables that can be referenced in `request` values. New variables are commonly used to specify publisher specific information. Arrays can be used to specify a list of values that should be URL encoded separately while preserving the comma delimiter.
+The `vars` configuration object can be used to define new key-value pairs or override existing variables that can be referenced in `request` values. New variables are commonly used to specify publisher specific information. Arrays can be used to specify a list of values that should be URL encoded separately while preserving the comma delimiter. Substituting built-in and custom variables within arrays is supported, except when the variable expands into another array.
 
 ```json
 "vars": {
   "account": "ABC123",
   "countryCode": "tr",
-  "tags": ["Swift,Jonathan", "Gulliver's Travels"]
+  "tags": ["Swift,Jonathan", "Gulliver's Travels", "${account}"]
 }
 ```
 
diff --git a/extensions/amp-analytics/amp-video-analytics.md b/extensions/amp-analytics/amp-video-analytics.md
index 9ca1432df6289..751e57a144668 100644
--- a/extensions/amp-analytics/amp-video-analytics.md
+++ b/extensions/amp-analytics/amp-video-analytics.md
@@ -31,6 +31,7 @@ AMP video analytics gathers data about how users interact with videos in AMP doc
 | `<amp-nexxtv-player>` | Partial support<sup>[1]</sup> |
 | `<amp-ooyala-player>` | Partial support<sup>[1]</sup> |
 | `<amp-youtube>`       | Partial support<sup>[1]</sup> |
+| `<amp-viqeo-player>`  | Full support                  |
 
 <sup>[1]</sup> Partial support means that all [video analytics common variables](#common-variables) are included, except for `currentTime`, `duration`, `playedRangesJson`, and `playedTotal`.
 
@@ -206,6 +207,24 @@ All video analytics triggers expose the following variables. These variables are
 | `width`            | Number  | Specifies the width of video (in px).                                                                          |
 | `playedRangesJson` | String  | Represents segments of time the user has watched the video (in JSON format). For example, `[[1, 10], [5, 20]]` |
 
+## Click-to-play Events
+
+Click events set directly on video component elements (like `amp-video`) will not be captured consistently due to implementation details of the browser's native video player or the player component itself.
+
+You can capture independent `play`/`pause` events by using the [`video-play`](#video-play-trigger-on-video-play) and [`video-pause`](#video-pause-trigger-on-video-pause) triggers.
+
+If you'd like to capture the initial `play` event (e.g. click-to-play), you can [place an overlay on the video player](https://amp.dev/documentation/examples/multimedia-animations/click-to-play_overlay_for_amp-video/) and configure a `click` analytics request that refers to the overlay element (`#myOverlay`):
+
+```javascript
+"triggers": {
+  "video-clicked": {
+    "on": "click",
+    "request": "event",
+    "selector": "#myOverlay"
+  },
+}
+```
+
 ## Video analytics variables
 
 Video analytics contributes the following variables to [AMP URL Variable Substitutions](../../spec/amp-var-substitutions.md).
diff --git a/extensions/amp-analytics/integrating-analytics.md b/extensions/amp-analytics/integrating-analytics.md
index c464b40f8f78c..10d5d50bdfb58 100644
--- a/extensions/amp-analytics/integrating-analytics.md
+++ b/extensions/amp-analytics/integrating-analytics.md
@@ -21,7 +21,7 @@ Before you can add your analytics service to AMP HTML runtime, you may need to:
 
 ## Adding your configuration to the AMP HTML runtime
 
-1. Create an [Intent-To-Implement issue](../../CONTRIBUTING.md#contributing-features) stating that you'll be adding your analytics service's configuration to AMP HTML's runtime.
+1. Create an [Intent-To-Implement issue](../../CONTRIBUTING.md#contributing-features) stating that you'll be adding your analytics service's configuration to AMP HTML's runtime. Be sure to include **cc @ampproject/wg-analytics** in your description.
 1. Develop a patch that implements the following: 1. A new configuration file in the vendors [folder](https://github.com/ampproject/amphtml/tree/master/extensions/amp-analytics/0.1/vendors) including any options above and beyond the default, such as: 1. `"vars": {}` for additional default variables. 1. `"requests": {}` for requests that your service will use. 1. `"optout":` if needed. We currently don't have a great opt-out system, so please reach out to help us design one that works well for you. 1. `"warningMessage":` if needed. Displays warning information from the vendor (such as deprecation or migration) in the console. 1. Import your configuration and include it in ANALYTICS_CONFIG in [vendors.js](0.1/vendors.js). 1. If you are using iframe transport, add a new line to ANALYTICS_IFRAME_TRANSPORT_CONFIG in iframe-transport-vendors.js containing `"*vendor-name*": "*url*"` 1. An example in the [examples/analytics-vendors.amp.html](../../examples/analytics-vendors.amp.html)
    reference. 1. A test in the [extensions/amp-analytics/0.1/test/vendor-requests.json
    ](../../extensions/amp-analytics/0.1/test/vendor-requests.json) file. 1. A new batch plugin if required. Please refer to [Add Batch Plugin](#add-batch-plugin) for instructions.
diff --git a/extensions/amp-anim/amp-anim.md b/extensions/amp-anim/amp-anim.md
index b98953c6961bc..4dae0e4e06ef2 100644
--- a/extensions/amp-anim/amp-anim.md
+++ b/extensions/amp-anim/amp-anim.md
@@ -60,41 +60,53 @@ In the future, additional functionality, such as animation playback control, cou
 
 ## Attributes
 
-<table>
-  <tr>
-    <td width="40%"><strong>src</strong></td>
-    <td>
-        [filter formats="websites, stories, ads"]
-        Similar to the <code>src</code> attribute on the <code>img</code> tag. The value must be a URL that
-        points to a publicly-cacheable image file. Cache providers may rewrite these
-        URLs when ingesting AMP files to point to a cached version of the image.
-        [/filter]
-        [filter formats="email"]
-        Similar to the <code>src</code> attribute on the `img` tag. For emails, the URL must be <code>https</code>. 
-        [/filter]
-    </td>
-  </tr>
-  <tr>
-     <td width="40%"><strong>srcset</strong></td>
-     <td>Same as <code>srcset</code> attribute on the <code>img</code> tag.</td>
-   </tr>
-   <tr>
-      <td width="40%"><strong>alt</strong></td>
-      <td>A string of alternate text, similar to the <code>alt</code> attribute on <code>img</code>.</td>
-    </tr>
-    <tr>
-       <td width="40%"><strong>attribution</strong></td>
-       <td>A string that indicates the attribution of the image. For example, <code>attribution="CC courtesy of Cats on Flicker"</code>.</td>
-     </tr>
-     <tr>
-        <td width="40%"><strong>height and width</strong></td>
-        <td>An explicit size of the image, which is used by the AMP runtime to determine the aspect ratio without fetching the image.</td>
-      </tr>
-      <tr>
-         <td width="40%"><strong>common attributes</strong></td>
-         <td>This element includes <a href="https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes">common attributes</a> extended to AMP components.</td>
-       </tr>
-</table>
+### src
+
+Similar to the `src` attribute on the `img` tag. The value must be a URL that
+points to a publicly-cacheable image file. Cache providers and email clients may rewrite these
+URLs when ingesting AMP files to point to a cached version of the image.
+
+[filter formats="email"]
+
+In AMP email, this <strong>must</strong> be an absolute URL.
+
+[/filter] <!-- formats="email" -->
+
+[filter formats="websites, ads, stories"]
+
+### srcset
+
+Same as `srcset` attribute on the `img` tag.
+
+[/filter] <!-- formats="websites, ads, stories" -->
+
+### alt
+
+A string of alternate text, similar to the `alt` attribute on `img`.
+
+### attribution
+
+A string that indicates the attribution of the image. For example, `attribution="CC courtesy of Cats on Flicker"`.
+
+### height and width
+
+An explicit size of the image, which is used by the AMP runtime to determine the aspect ratio without fetching the image.
+
+### Common attributes
+
+This element includes [common attributes](https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes) extended to AMP components.
+
+[filter formats="email"]
+
+### Invalid AMP email attributes
+
+The AMP for Email spec disallows the use of the following attributes on the AMP email format.
+
+- `srcset`
+- `object-fit`
+- `object-position`
+
+[/filter] <!-- formats="email" -->
 
 ## Styling
 
diff --git a/extensions/amp-animation/amp-animation.md b/extensions/amp-animation/amp-animation.md
index 18c12cbac5512..64966033d8d94 100644
--- a/extensions/amp-animation/amp-animation.md
+++ b/extensions/amp-animation/amp-animation.md
@@ -670,7 +670,7 @@ The animation can be triggered via a `trigger` attribute or an `on` action.
 
 ### `trigger` attribute
 
-Currently, `visibility` is the only available value for the `trigger` attribute. The `visibility` triggers when the underlying document or embed are visible (in viewport).
+The only available value for the `trigger` attribute is `visibility`. The animation runs when the underlying document or embed are visible (in viewport).
 
 For instance:
 
@@ -680,6 +680,8 @@ For instance:
 </amp-animation>
 ```
 
+Important: If the `amp-animation` component is a direct child of the document `body`, and not imported through an embedded element, it will start as soon as the `body` is loaded, regardless if it, or the animated element, is placed below the initial viewport.
+
 ### Triggering via `on` action
 
 For instance:
diff --git a/extensions/amp-apester-media/0.1/amp-apester-media.css b/extensions/amp-apester-media/0.1/amp-apester-media.css
index e5d1728f71423..f0749dfdb9c51 100644
--- a/extensions/amp-apester-media/0.1/amp-apester-media.css
+++ b/extensions/amp-apester-media/0.1/amp-apester-media.css
@@ -70,3 +70,7 @@
   zoom: 1;
   -webkit-overflow-scrolling: touch !important;
 }
+.amp-apester-companion {
+  display: block;
+  margin: 10px auto;
+}
diff --git a/extensions/amp-apester-media/0.1/amp-apester-media.js b/extensions/amp-apester-media/0.1/amp-apester-media.js
index cbf62cc328cd2..30ac7269d70f8 100644
--- a/extensions/amp-apester-media/0.1/amp-apester-media.js
+++ b/extensions/amp-apester-media/0.1/amp-apester-media.js
@@ -14,7 +14,6 @@
  * limitations under the License.
  */
 import {CSS} from '../../../build/amp-apester-media-0.1.css';
-import {CustomEventReporterBuilder} from '../../../src/extension-analytics';
 import {IntersectionObserverApi} from '../../../src/intersection-observer-polyfill';
 import {Services} from '../../../src/services';
 import {addParamsToUrl} from '../../../src/url';
@@ -22,16 +21,15 @@ import {dev, userAssert} from '../../../src/log';
 import {dict} from '../../../src/utils/object';
 import {
   extractTags,
-  generatePixelURL,
   getPlatform,
   registerEvent,
   setFullscreenOff,
   setFullscreenOn,
 } from './utils';
 import {getLengthNumeral, isLayoutSizeDefined} from '../../../src/layout';
+import {handleCompanionAds} from './monetization';
 import {removeElement} from '../../../src/dom';
 import {setStyles} from '../../../src/style';
-
 /** @const */
 const TAG = 'amp-apester-media';
 /**
@@ -65,7 +63,7 @@ class AmpApesterMedia extends AMP.BaseElement {
     /**
      * @const @private {string}
      */
-    this.loaderUrl_ = 'https://static.apester.com/js/assets/loader.gif';
+    this.loaderUrl_ = 'https://static.apester.com/js/assets/loader_100x100.gif';
     /** @private {boolean}  */
     this.seen_ = false;
     /** @private {?Element}  */
@@ -103,9 +101,10 @@ class AmpApesterMedia extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(onLayout) {
-    this.preconnect.url(this.displayBaseUrl_, onLayout);
-    this.preconnect.url(this.rendererBaseUrl_, onLayout);
-    this.preconnect.url(this.staticContent_, onLayout);
+    const preconnect = Services.preconnectFor(this.win);
+    preconnect.url(this.getAmpDoc(), this.displayBaseUrl_, onLayout);
+    preconnect.url(this.getAmpDoc(), this.rendererBaseUrl_, onLayout);
+    preconnect.url(this.getAmpDoc(), this.staticContent_, onLayout);
   }
 
   /** @override */
@@ -224,7 +223,8 @@ class AmpApesterMedia extends AMP.BaseElement {
       });
   }
 
-  /** @param {string} id
+  /**
+   *  @param {string} id
    *  @param {boolean} usePlayer
    *  @return {string}
    * */
@@ -289,23 +289,6 @@ class AmpApesterMedia extends AMP.BaseElement {
     return overflow;
   }
 
-  /**
-   * @param {JsonObject} publisher
-   */
-  report3rdPartyPixel_(publisher) {
-    if (publisher && publisher['trackingPixel']) {
-      const affiliateId = publisher['trackingPixel']['affiliateId'];
-      const publisherId = publisher['publisherId'];
-      if (affiliateId) {
-        const eventName = 'interactionLoaded';
-        const builder = new CustomEventReporterBuilder(this.element);
-        builder.track(eventName, generatePixelURL(publisherId, affiliateId));
-        const reporter = builder.build();
-        reporter.trigger(eventName);
-      }
-    }
-  }
-
   /** @override */
   layoutCallback() {
     this.element.classList.add('amp-apester-container');
@@ -319,13 +302,11 @@ class AmpApesterMedia extends AMP.BaseElement {
         const payload = response['payload'];
         // If it's a playlist we choose a media randomly.
         // The response will be an array.
-        const media = /** @type {JsonObject} */ (this.embedOptions_.playlist
+        const media = /** @type {!JsonObject} */ (this.embedOptions_.playlist
           ? payload[Math.floor(Math.random() * payload.length)]
           : payload);
-
         const interactionId = media['interactionId'];
         const usePlayer = media['usePlayer'];
-
         const src = this.constructUrlFromMedia_(interactionId, usePlayer);
         const iframe = this.constructIframe_(src);
         this.intersectionObserverApi_ = new IntersectionObserverApi(
@@ -342,6 +323,7 @@ class AmpApesterMedia extends AMP.BaseElement {
             const overflow = this.constructOverflow_();
             this.element.appendChild(overflow);
             this.element.appendChild(iframe);
+            handleCompanionAds(media, this.element);
           })
           .then(() => {
             return this.loadPromise(iframe).then(() => {
@@ -359,7 +341,6 @@ class AmpApesterMedia extends AMP.BaseElement {
                   }
                 }
                 this.togglePlaceholder(false);
-                this.report3rdPartyPixel_(media['publisher']);
                 this.ready_ = true;
                 let height = 0;
                 if (media && media['data'] && media['data']['size']) {
diff --git a/extensions/amp-apester-media/0.1/monetization/companion/display.js b/extensions/amp-apester-media/0.1/monetization/companion/display.js
new file mode 100644
index 0000000000000..2077eac6c2dd2
--- /dev/null
+++ b/extensions/amp-apester-media/0.1/monetization/companion/display.js
@@ -0,0 +1,89 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {createElementWithAttributes} from '../../../../../src/dom';
+import {getValueForExpr} from '../../../../../src/json';
+const ALLOWED_AD_PROVIDER = 'gdt';
+import {dict} from '../../../../../src/utils/object';
+
+/**
+ * @param {!JsonObject} media
+ * @param {!AmpElement} apesterElement
+ */
+export function handleCompanionDisplay(media, apesterElement) {
+  const companionOptions = getValueForExpr(
+    /**@type {!JsonObject}*/ (media),
+    'campaignData.companionOptions'
+  );
+  if (!companionOptions) {
+    return;
+  }
+  const enabledDisplayAd = getValueForExpr(
+    /**@type {!JsonObject}*/ (companionOptions),
+    'enabled'
+  );
+  const settings = getValueForExpr(
+    /**@type {!JsonObject}*/ (companionOptions),
+    'settings'
+  );
+
+  if (
+    enabledDisplayAd &&
+    settings &&
+    settings['bannerAdProvider'] === ALLOWED_AD_PROVIDER
+  ) {
+    const slot = settings['slot'];
+    const defaultBannerSizes = [[300, 250]];
+    const bannerSizes = settings['bannerSizes'] || defaultBannerSizes;
+    constructCompanionDisplayAd(slot, bannerSizes, apesterElement);
+  }
+}
+
+/**
+ * @param {string} slot
+ * @param {Array} bannerSizes
+ * @param {!AmpElement} apesterElement
+ * @return {!Element}
+ */
+function constructCompanionDisplayAd(slot, bannerSizes, apesterElement) {
+  const maxWidth = Math.max.apply(
+    null,
+    bannerSizes.map(s => s[0])
+  );
+  const maxHeight = Math.max.apply(
+    null,
+    bannerSizes.map(s => s[1])
+  );
+
+  const multiSizeData = bannerSizes.map(size => size.join('x')).join();
+  const ampAd = createElementWithAttributes(
+    /** @type {!Document} */ (apesterElement.ownerDocument),
+    'amp-ad',
+    dict({
+      'width': `${maxWidth}`,
+      'height': '0',
+      'type': 'doubleclick',
+      'layout': 'fixed',
+      'data-slot': `${slot}`,
+      'data-multi-size-validation': 'false',
+      'data-multi-size': multiSizeData,
+    })
+  );
+  ampAd.classList.add('amp-apester-companion');
+  apesterElement.parentNode.insertBefore(ampAd, apesterElement.nextSibling);
+  apesterElement.getResources().attemptChangeSize(ampAd, maxHeight);
+  return ampAd;
+}
diff --git a/extensions/amp-apester-media/0.1/monetization/companion/video.js b/extensions/amp-apester-media/0.1/monetization/companion/video.js
new file mode 100644
index 0000000000000..69edb960eec12
--- /dev/null
+++ b/extensions/amp-apester-media/0.1/monetization/companion/video.js
@@ -0,0 +1,161 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {Services} from '../../../../../src/services';
+const ALLOWED_AD_PROVIDER = 'sr';
+import {createElementWithAttributes} from '../../../../../src/dom';
+import {dict} from '../../../../../src/utils/object';
+import {getValueForExpr} from '../../../../../src/json';
+
+/**
+ * @param {!JsonObject} media
+ * @param {!AmpElement} apesterElement
+ * @param {!JsonObject} consentObj
+ */
+export function handleCompanionVideo(media, apesterElement, consentObj) {
+  const companionCampaignOptions = getValueForExpr(
+    /**@type {!JsonObject}*/ (media),
+    'campaignData.companionCampaignOptions'
+  );
+  const videoSettings = getValueForExpr(
+    /**@type {!JsonObject}*/ (media),
+    'campaignData.companionOptions.video'
+  );
+  const position = getCompanionPosition(
+    /**@type {!JsonObject}*/ (videoSettings)
+  );
+
+  if (
+    !companionCampaignOptions ||
+    !videoSettings ||
+    !videoSettings['enabled'] ||
+    videoSettings['provider'] !== ALLOWED_AD_PROVIDER ||
+    !position ||
+    position === 'floating'
+  ) {
+    return;
+  }
+  const macros = getSrMacros(
+    media,
+    companionCampaignOptions['companionCampaignId'],
+    apesterElement,
+    consentObj
+  );
+  addCompanionSrElement(
+    videoSettings['videoTag'],
+    position,
+    /** @type {!JsonObject} */ (macros),
+    apesterElement
+  );
+}
+
+/**
+ * @param {!JsonObject} video
+ * @return {?string}
+ */
+function getCompanionPosition(video) {
+  if (!video) {
+    return null;
+  }
+  if (video['companion']['enabled']) {
+    return 'above';
+  }
+  if (video['companion_below']['enabled']) {
+    return 'below';
+  }
+  if (video['floating']['enabled']) {
+    return 'floating';
+  }
+  return null;
+}
+
+/**
+ * @param {string} videoTag
+ * @param {string} position
+ * @param {!JsonObject} macros
+ * @param {!AmpElement} apesterElement
+ */
+function addCompanionSrElement(videoTag, position, macros, apesterElement) {
+  const size = getCompanionVideoAdSize(apesterElement);
+  const ampBladeAd = createElementWithAttributes(
+    /** @type {!Document} */ (apesterElement.ownerDocument),
+    'amp-ad',
+    dict({
+      'width': size.width,
+      'height': '0',
+      'type': 'blade',
+      'layout': 'fixed',
+      'data-blade_player_type': 'bladex',
+      'servingDomain': 'ssr.streamrail.net',
+      'data-blade_macros': JSON.stringify(macros),
+      'data-blade_player_id': videoTag,
+      'data-blade_api_key': '5857d2ee263dc90002000001',
+    })
+  );
+
+  ampBladeAd.classList.add('amp-apester-companion');
+
+  const relativeElement =
+    position === 'below' ? apesterElement.nextSibling : apesterElement;
+  apesterElement.parentNode.insertBefore(ampBladeAd, relativeElement);
+
+  apesterElement.getResources().attemptChangeSize(ampBladeAd, size.height);
+}
+
+/**
+ * @param {!AmpElement} apesterElement
+ * @return {{height: number, width: number}}
+ */
+export function getCompanionVideoAdSize(apesterElement) {
+  const adWidth = apesterElement./*REVIEW*/ clientWidth;
+  const adRatio = 0.6;
+  const adHeight = Math.ceil(adWidth * adRatio);
+  return {width: adWidth, height: adHeight};
+}
+
+/**
+ * @param {!JsonObject} interactionModel
+ * @param {?string} campaignId
+ * @param {!AmpElement} apesterElement
+ * @param {!JsonObject} consentObj
+ * @return {!JsonObject}
+ */
+function getSrMacros(interactionModel, campaignId, apesterElement, consentObj) {
+  const interactionId = interactionModel['interactionId'];
+  const publisherId = interactionModel['publisherId'];
+  const publisher = interactionModel['publisher'];
+
+  const pageUrl = Services.documentInfoForDoc(apesterElement).canonicalUrl;
+
+  const macros = dict({
+    'param1': interactionId,
+    'param2': publisherId,
+    'param6': campaignId,
+    'page_url': pageUrl, // eslint-disable-line google-camelcase/google-camelcase
+  });
+
+  if (consentObj['gdpr']) {
+    macros['gdpr'] = consentObj['gdpr'];
+    macros['user_consent'] = consentObj['user_consent']; // eslint-disable-line google-camelcase/google-camelcase
+    macros['param4'] = consentObj['gdprString'];
+  }
+
+  if (publisher && publisher.groupId) {
+    macros['param7'] = `apester.com:${publisher.groupId}`;
+    macros['schain'] = `1.0,1!apester.com,${publisher.groupId},1,,,,`;
+  }
+  return macros;
+}
diff --git a/extensions/amp-apester-media/0.1/monetization/consent-util.js b/extensions/amp-apester-media/0.1/monetization/consent-util.js
new file mode 100644
index 0000000000000..f4c5b1e790e78
--- /dev/null
+++ b/extensions/amp-apester-media/0.1/monetization/consent-util.js
@@ -0,0 +1,76 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {dict} from '../../../../src/utils/object';
+import {
+  getConsentPolicyInfo,
+  getConsentPolicyState,
+} from '../../../../src/consent';
+
+import {dev} from '../../../../src/log';
+
+import {CONSENT_POLICY_STATE} from '../../../../src/consent-state';
+
+const TAG = 'amp-apester-media';
+
+const AWAIT_TIME_OUT_FOR_RESPONSE = 3000;
+
+const awaitPromiseTimeout = () => {
+  return new Promise(resolve => {
+    setTimeout(() => {
+      resolve([CONSENT_POLICY_STATE.UNKNOWN, undefined]);
+    }, AWAIT_TIME_OUT_FOR_RESPONSE);
+  });
+};
+/**
+ * @param {AmpElement} apesterElement
+ * @return {Promise<!JsonObject>}
+ * */
+export function getConsentData(apesterElement) {
+  const consentStatePromise = getConsentPolicyState(apesterElement).catch(
+    err => {
+      dev().error(TAG, 'Error determining consent state', err);
+      return CONSENT_POLICY_STATE.UNKNOWN;
+    }
+  );
+  const consentStringPromise = getConsentPolicyInfo(
+    apesterElement,
+    'default'
+  ).catch(err => {
+    dev().error(TAG, 'Error determining consent string', err);
+    return undefined;
+  });
+  const consentDataPromise = Promise.all([
+    consentStatePromise,
+    consentStringPromise,
+  ]);
+  return Promise.race([consentDataPromise, awaitPromiseTimeout()]).then(
+    consentDataResponse => {
+      const consentStatus = consentDataResponse[0];
+      const gdprString = consentDataResponse[1];
+      switch (consentStatus) {
+        case CONSENT_POLICY_STATE.SUFFICIENT:
+          return dict({'gdpr': 1, 'user_consent': 1, 'gdprString': gdprString});
+        case CONSENT_POLICY_STATE.INSUFFICIENT:
+        case CONSENT_POLICY_STATE.UNKNOWN:
+          return dict({'gdpr': 1, 'user_consent': 0, 'gdprString': gdprString});
+        case CONSENT_POLICY_STATE.UNKNOWN_NOT_REQUIRED:
+        default:
+          return {};
+      }
+    }
+  );
+}
diff --git a/extensions/amp-apester-media/0.1/monetization/index.js b/extensions/amp-apester-media/0.1/monetization/index.js
new file mode 100644
index 0000000000000..ccd4b3d43d4fb
--- /dev/null
+++ b/extensions/amp-apester-media/0.1/monetization/index.js
@@ -0,0 +1,34 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {getConsentData} from './consent-util';
+import {handleCompanionDisplay} from './companion/display';
+import {handleCompanionVideo} from './companion/video';
+
+/**
+ * @param {!JsonObject} media
+ * @param {!AmpElement} apesterElement
+ * @return {!Promise}
+ */
+export function handleCompanionAds(media, apesterElement) {
+  const monetizationSettings = media['campaignData'];
+  if (monetizationSettings && !monetizationSettings.disabledAmpCompanionAds) {
+    return getConsentData(apesterElement).then(consentData => {
+      handleCompanionDisplay(media, apesterElement);
+      handleCompanionVideo(media, apesterElement, consentData);
+    });
+  }
+  return Promise.resolve();
+}
diff --git a/extensions/amp-apester-media/0.1/test/test-amp-apester-monetization.js b/extensions/amp-apester-media/0.1/test/test-amp-apester-monetization.js
new file mode 100644
index 0000000000000..624b2b2b27dda
--- /dev/null
+++ b/extensions/amp-apester-media/0.1/test/test-amp-apester-monetization.js
@@ -0,0 +1,171 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {handleCompanionAds} from '../monetization/index';
+import {installDocService} from '../../../../src/service/ampdoc-impl';
+import {
+  registerServiceBuilderForDoc,
+  resetServiceForTesting,
+} from '../../../../src/service';
+describes.realWin('amp-apester-media-monetization', {}, env => {
+  let win, doc;
+  let baseElement;
+  let resources;
+  let docInfo;
+  const queryAmpAdBladeSelector = myDoc =>
+    myDoc.querySelector('amp-ad[type=blade]');
+  const queryAmpAdDisplaySelector = myDoc =>
+    myDoc.querySelector('amp-ad[type=doubleclick]');
+
+  beforeEach(() => {
+    win = env.win;
+    doc = win.document;
+
+    baseElement = doc.createElement('amp-apester-media');
+
+    resources = {
+      attemptChangeSize: () => env.sandbox.stub(),
+    };
+
+    baseElement.getResources = () => resources;
+
+    doc.body.appendChild(baseElement);
+    docInfo = {
+      canonicalUrl: 'https://www.example.com/path',
+      sourceUrl: 'https://source.example.com/path',
+    };
+    installDocService(win, /* isSingleDoc */ true);
+    resetServiceForTesting(win, 'documentInfo');
+    return registerServiceBuilderForDoc(doc, 'documentInfo', () => {
+      return {
+        get: () => docInfo,
+      };
+    });
+  });
+
+  it('Should show a companion display ad', async () => {
+    const media = createCampaignData({display: true});
+    await handleCompanionAds(media, baseElement);
+    const displayAd = queryAmpAdDisplaySelector(doc);
+    expect(displayAd).to.exist;
+    expect(baseElement.nextSibling).to.be.equal(displayAd);
+  });
+  it('Should show an SR companion ad below', async () => {
+    const media = createCampaignData({
+      display: false,
+      srAbove: false,
+      srBelow: true,
+    });
+    await handleCompanionAds(media, baseElement);
+    const srAdBelow = queryAmpAdBladeSelector(doc);
+    expect(srAdBelow).to.exist;
+    expect(baseElement.nextSibling).to.be.equal(srAdBelow);
+  });
+  it('Should show an SR companion ad above', async () => {
+    const media = createCampaignData({
+      display: false,
+      srAbove: true,
+      srBelow: false,
+    });
+    await handleCompanionAds(media, baseElement);
+    const srAboveAd = queryAmpAdBladeSelector(doc);
+    expect(srAboveAd).to.exist;
+    expect(baseElement.previousSibling).to.be.equal(srAboveAd);
+  });
+  it('Should show an SR companion above with display companion', async () => {
+    const media = createCampaignData({
+      display: true,
+      srAbove: true,
+      srBelow: false,
+    });
+    await handleCompanionAds(media, baseElement);
+    const displayAd = queryAmpAdDisplaySelector(doc);
+    expect(displayAd).to.exist;
+    expect(baseElement.nextSibling).to.be.equal(displayAd);
+    const srAboveAd = queryAmpAdBladeSelector(doc);
+    expect(srAboveAd).to.exist;
+    expect(baseElement.previousSibling).to.be.equal(srAboveAd);
+  });
+  it('Should not show ads if disabled amp companion ads', async () => {
+    const media = createCampaignData({
+      display: true,
+      srAbove: true,
+      srBelow: false,
+      disabledAmpCompanionAds: true,
+    });
+    await handleCompanionAds(media, baseElement);
+    const displayAd = queryAmpAdDisplaySelector(doc);
+    expect(displayAd).to.not.exist;
+    const srAboveAd = queryAmpAdBladeSelector(doc);
+    expect(srAboveAd).to.not.exist;
+  });
+});
+
+function createCampaignData({
+  display,
+  srAbove,
+  srBelow,
+  disabledAmpCompanionAds,
+}) {
+  const media = {};
+  const campaignData = {
+    'companionOptions': {
+      'settings': {
+        'slot': '/57806026/Dev_DT_300x250',
+        'options': {
+          'refreshOnClick': 'none',
+          'lockTime': 5000,
+        },
+        'bannerAdProvider': 'gdt',
+        'bannerSizes': [[300, 250]],
+      },
+      'enabled': false,
+      'video': {
+        'videoTag': '5d14c0ded1fb9900016a3118',
+        'enabled': false,
+        'floating': {
+          'enabled': false,
+        },
+        'companion': {
+          'enabled': false,
+        },
+        'companion_below': {
+          'enabled': false,
+        },
+        'provider': 'sr',
+      },
+    },
+    'companionCampaignOptions': {
+      'companionCampaignId': '5d8b267a50bf9482f458d2ca',
+    },
+  };
+  if (display) {
+    campaignData.companionOptions.enabled = true;
+  }
+  if (srAbove) {
+    campaignData.companionOptions.video.enabled = true;
+    campaignData.companionOptions.video.companion.enabled = true;
+  }
+  if (srBelow) {
+    campaignData.companionOptions.video.enabled = true;
+    campaignData.companionOptions.video.companion_below.enabled = true;
+  }
+  if (disabledAmpCompanionAds) {
+    campaignData.disabledAmpCompanionAds = true;
+  }
+  media.campaignData = campaignData;
+  return media;
+}
diff --git a/extensions/amp-apester-media/OWNERS b/extensions/amp-apester-media/OWNERS
index e6937061c41bf..a3e3dde3c8f59 100644
--- a/extensions/amp-apester-media/OWNERS
+++ b/extensions/amp-apester-media/OWNERS
@@ -4,7 +4,7 @@
 {
   rules: [
     {
-      owners: [{name: 'mrsufgi'}, {name: 'ampproject/wg-ui-and-a11y'}],
+      owners: [{name: 'OmriKeret'}, {name: 'ampproject/wg-ui-and-a11y'}],
     },
   ],
 }
diff --git a/extensions/amp-app-banner/0.1/amp-app-banner.js b/extensions/amp-app-banner/0.1/amp-app-banner.js
index 18cc763e45ca8..5e69626d3e650 100644
--- a/extensions/amp-app-banner/0.1/amp-app-banner.js
+++ b/extensions/amp-app-banner/0.1/amp-app-banner.js
@@ -225,7 +225,11 @@ export class AmpIosAppBanner extends AbstractAppBanner {
     if (!this.element.parentNode) {
       return;
     }
-    this.preconnect.url('https://itunes.apple.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://itunes.apple.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
@@ -367,9 +371,16 @@ export class AmpAndroidAppBanner extends AbstractAppBanner {
     if (!this.element.parentNode) {
       return;
     }
-    this.preconnect.url('https://play.google.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://play.google.com',
+      opt_onLayout
+    );
     if (this.manifestHref_) {
-      this.preconnect.preload(this.manifestHref_);
+      Services.preconnectFor(this.win).preload(
+        this.getAmpDoc(),
+        this.manifestHref_
+      );
     }
   }
 
diff --git a/extensions/amp-app-banner/0.1/test/test-amp-app-banner.js b/extensions/amp-app-banner/0.1/test/test-amp-app-banner.js
index 942cd2c065761..fa164cc1e6d89 100644
--- a/extensions/amp-app-banner/0.1/test/test-amp-app-banner.js
+++ b/extensions/amp-app-banner/0.1/test/test-amp-app-banner.js
@@ -159,12 +159,14 @@ describes.realWin(
     function testSuiteIos() {
       it('should preconnect to app store', () => {
         return getAppBanner({iosMeta}).then(banner => {
+          const preconnect = Services.preconnectFor(win);
+          env.sandbox.stub(preconnect, 'url');
+
           const impl = banner.implementation_;
-          env.sandbox.stub(impl.preconnect, 'url');
           impl.preconnectCallback(true);
-          expect(impl.preconnect.url.called).to.be.true;
-          expect(impl.preconnect.url).to.be.calledOnce;
-          expect(impl.preconnect.url).to.have.been.calledWith(
+          expect(preconnect.url).to.be.calledOnce;
+          expect(preconnect.url).to.have.been.calledWith(
+            env.sandbox.match.object, // AmpDoc
             'https://itunes.apple.com'
           );
         });
@@ -242,18 +244,21 @@ describes.realWin(
     function testSuiteAndroid() {
       it('should preconnect to play store and preload manifest', () => {
         return getAppBanner({androidManifest}).then(banner => {
+          const preconnect = Services.preconnectFor(win);
+          env.sandbox.stub(preconnect, 'url');
+          env.sandbox.stub(preconnect, 'preload');
+
           const impl = banner.implementation_;
-          env.sandbox.stub(impl.preconnect, 'url');
-          env.sandbox.stub(impl.preconnect, 'preload');
           impl.preconnectCallback(true);
-          expect(impl.preconnect.url.called).to.be.true;
-          expect(impl.preconnect.url).to.have.been.calledOnce;
-          expect(impl.preconnect.url).to.have.been.calledWith(
+          expect(preconnect.url).to.have.been.calledOnce;
+          expect(preconnect.url).to.have.been.calledWith(
+            env.sandbox.match.object, // AmpDoc
             'https://play.google.com'
           );
-          expect(impl.preconnect.preload.called).to.be.true;
-          expect(impl.preconnect.preload).to.be.calledOnce;
-          expect(impl.preconnect.preload).to.have.been.calledWith(
+
+          expect(preconnect.preload).to.be.calledOnce;
+          expect(preconnect.preload).to.have.been.calledWith(
+            env.sandbox.match.object, // AmpDoc
             'https://example.com/manifest.json'
           );
         });
@@ -261,18 +266,20 @@ describes.realWin(
 
       it('should preconnect to play store and preload origin-manifest', () => {
         return getAppBanner({originManifest: androidManifest}).then(banner => {
+          const preconnect = Services.preconnectFor(win);
+          env.sandbox.stub(preconnect, 'url');
+          env.sandbox.stub(preconnect, 'preload');
+
           const impl = banner.implementation_;
-          env.sandbox.stub(impl.preconnect, 'url');
-          env.sandbox.stub(impl.preconnect, 'preload');
           impl.preconnectCallback(true);
-          expect(impl.preconnect.url.called).to.be.true;
-          expect(impl.preconnect.url).to.have.been.calledOnce;
-          expect(impl.preconnect.url).to.have.been.calledWith(
+          expect(preconnect.url).to.have.been.calledOnce;
+          expect(preconnect.url).to.have.been.calledWith(
+            env.sandbox.match.object, // AmpDoc
             'https://play.google.com'
           );
-          expect(impl.preconnect.preload.called).to.be.true;
-          expect(impl.preconnect.preload).to.be.calledOnce;
-          expect(impl.preconnect.preload).to.have.been.calledWith(
+          expect(preconnect.preload).to.be.calledOnce;
+          expect(preconnect.preload).to.have.been.calledWith(
+            env.sandbox.match.object, // AmpDoc
             'https://example.com/manifest.json'
           );
         });
diff --git a/extensions/amp-auto-ads/0.1/adsense-network-config.js b/extensions/amp-auto-ads/0.1/adsense-network-config.js
index 560eed210ea6c..cde28235f6865 100644
--- a/extensions/amp-auto-ads/0.1/adsense-network-config.js
+++ b/extensions/amp-auto-ads/0.1/adsense-network-config.js
@@ -18,6 +18,7 @@ import {Services} from '../../../src/services';
 import {buildUrl} from '../../../ads/google/a4a/shared/url-builder';
 import {dict} from '../../../src/utils/object';
 import {parseUrlDeprecated} from '../../../src/url';
+import {toWin} from '../../../src/types';
 
 /**
  * @implements {./ad-network-config.AdNetworkConfigDef}
@@ -46,6 +47,7 @@ export class AdSenseNetworkConfig {
   getConfigUrl() {
     const docInfo = Services.documentInfoForDoc(this.autoAmpAdsElement_);
     const canonicalHostname = parseUrlDeprecated(docInfo.canonicalUrl).hostname;
+    const win = toWin(this.autoAmpAdsElement_.ownerDocument.defaultView);
     return buildUrl(
       '//pagead2.googlesyndication.com/getconfig/ama',
       {
@@ -53,6 +55,8 @@ export class AdSenseNetworkConfig {
         'plah': canonicalHostname,
         'ama_t': 'amp',
         'url': docInfo.canonicalUrl,
+        'debug_experiment_id':
+          (/(?:#|,)deid=([\d,]+)/i.exec(win.location.hash) || [])[1] || null,
       },
       4096
     );
@@ -65,8 +69,14 @@ export class AdSenseNetworkConfig {
       'data-ad-client': this.autoAmpAdsElement_.getAttribute('data-ad-client'),
     });
     const dataAdHost = this.autoAmpAdsElement_.getAttribute('data-ad-host');
+    const dataAdHostChannel = this.autoAmpAdsElement_.getAttribute(
+      'data-ad-host-channel'
+    );
     if (dataAdHost) {
       attributesObj['data-ad-host'] = dataAdHost;
+      if (dataAdHostChannel) {
+        attributesObj['data-ad-host-channel'] = dataAdHostChannel;
+      }
     }
     return attributesObj;
   }
diff --git a/extensions/amp-auto-ads/0.1/amp-auto-ads.js b/extensions/amp-auto-ads/0.1/amp-auto-ads.js
index 73dc0eec84444..abc97750b62ba 100644
--- a/extensions/amp-auto-ads/0.1/amp-auto-ads.js
+++ b/extensions/amp-auto-ads/0.1/amp-auto-ads.js
@@ -22,11 +22,7 @@ import {
 } from './ad-tracker';
 import {AnchorAdStrategy} from './anchor-ad-strategy';
 import {Attributes, getAttributesFromConfigObj} from './attributes';
-import {
-  NO_OP_EXP,
-  RESPONSIVE_SIZING_HOLDBACK_BRANCH,
-  getPlacementsFromConfigObj,
-} from './placement';
+import {NO_OP_EXP, getPlacementsFromConfigObj} from './placement';
 import {Services} from '../../../src/services';
 import {dict} from '../../../src/utils/object';
 import {getAdNetworkConfig} from './ad-network-config';
@@ -39,14 +35,6 @@ const TAG = 'amp-auto-ads';
 /** @const */
 const AD_TAG = 'amp-ad';
 
-/** @const {!{branch: string, control: string, holdback: string}}
- */
-export const RESPONSIVE_SIZING_EXP = {
-  branch: 'use-responsive-ads-for-responsive-sizing-in-auto-ads',
-  control: '368226532',
-  holdback: RESPONSIVE_SIZING_HOLDBACK_BRANCH,
-};
-
 export class AmpAutoAds extends AMP.BaseElement {
   /** @override */
   buildCallback() {
@@ -67,9 +55,7 @@ export class AmpAutoAds extends AMP.BaseElement {
     );
 
     const whenVisible = this.getAmpDoc().whenFirstVisible();
-    const responsiveSizingBranch = this.getUseResponsiveForResponsiveExperimentBranch(
-      adNetwork.isResponsiveEnabled()
-    );
+    this.divertNoOpExperiment(adNetwork.isResponsiveEnabled());
 
     whenVisible
       .then(() => {
@@ -82,14 +68,9 @@ export class AmpAutoAds extends AMP.BaseElement {
         const noConfigReason = configObj['noConfigReason'];
         if (noConfigReason) {
           this.user().warn(TAG, noConfigReason);
-          return;
         }
 
-        const placements = getPlacementsFromConfigObj(
-          ampdoc,
-          configObj,
-          responsiveSizingBranch
-        );
+        const placements = getPlacementsFromConfigObj(ampdoc, configObj);
         const attributes = /** @type {!JsonObject} */ (Object.assign(
           dict({}),
           adNetwork.getAttributes(),
@@ -117,28 +98,18 @@ export class AmpAutoAds extends AMP.BaseElement {
   }
 
   /**
-   * Selects into the use responsive ads for sizing in auto ads experiment branch.
+   * Selects branch of the no op experiment.
    * @param {boolean} isResponsiveEnabled
-   * @return {?string} id of selected branch, if any.
    */
-  getUseResponsiveForResponsiveExperimentBranch(isResponsiveEnabled) {
+  divertNoOpExperiment(isResponsiveEnabled) {
     const experimentInfoMap = /** @type {!Object<string,
-        !../../../src/experiments.ExperimentInfo>} */ ({
-      [[RESPONSIVE_SIZING_EXP.branch]]: {
-        isTrafficEligible: () => isResponsiveEnabled,
-        branches: [
-          [RESPONSIVE_SIZING_EXP.control],
-          [RESPONSIVE_SIZING_EXP.holdback],
-        ],
-      },
+				  !../../../src/experiments.ExperimentInfo>} */ ({
       [[NO_OP_EXP.branch]]: {
         isTrafficEligible: () => isResponsiveEnabled,
         branches: [[NO_OP_EXP.control], [NO_OP_EXP.experiment]],
       },
     });
-    return randomlySelectUnsetExperiments(this.win, experimentInfoMap)[
-      RESPONSIVE_SIZING_EXP.branch
-    ];
+    randomlySelectUnsetExperiments(this.win, experimentInfoMap);
   }
 
   /** @override */
diff --git a/extensions/amp-auto-ads/0.1/placement.js b/extensions/amp-auto-ads/0.1/placement.js
index 9ff60adaeb871..9b62446597a27 100644
--- a/extensions/amp-auto-ads/0.1/placement.js
+++ b/extensions/amp-auto-ads/0.1/placement.js
@@ -21,14 +21,12 @@ import {
 } from '../../../src/layout-rect';
 import {Services} from '../../../src/services';
 import {addExperimentIdToElement} from '../../../ads/google/a4a/traffic-experiments';
-import {clamp} from '../../../src/utils/math';
 import {
   closestAncestorElementBySelector,
   createElementWithAttributes,
   scopedQuerySelectorAll,
   whenUpgradedToCustomElement,
 } from '../../../src/dom';
-import {computedStyle} from '../../../src/style';
 import {dev, user} from '../../../src/log';
 import {dict} from '../../../src/utils/object';
 import {getElementLayoutBox} from './utils';
@@ -45,9 +43,6 @@ export const NO_OP_EXP = {
   experiment: '44710303',
 };
 
-/** @const */
-export const RESPONSIVE_SIZING_HOLDBACK_BRANCH = '368226533';
-
 /**
  * @typedef {{
  *   width: (number|undefined),
@@ -63,11 +58,6 @@ let PlacementSizingDef;
  */
 const TARGET_AD_HEIGHT_PX = 250;
 
-/**
- * @const
- */
-const MAXIMUM_RESPONSIVE_WIDTH = 1200;
-
 /**
  * @enum {number}
  */
@@ -123,7 +113,6 @@ export class Placement {
    * @param {!Position} position
    * @param {function(!Element, !Element)} injector
    * @param {!JsonObject<string, string>} attributes
-   * @param {?string} responsiveSizingBranch
    * @param {!../../../src/layout-rect.LayoutMarginsChangeDef=} opt_margins
    */
   constructor(
@@ -132,17 +121,13 @@ export class Placement {
     position,
     injector,
     attributes,
-    responsiveSizingBranch,
     opt_margins
   ) {
     /** @const {!../../../src/service/ampdoc-impl.AmpDoc} */
     this.ampdoc = ampdoc;
 
-    /** @const @private {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(anchorElement);
-
-    /** @const @private {!../../../src/service/viewport/viewport-interface.ViewportInterface} */
-    this.viewport_ = Services.viewportForDoc(anchorElement);
+    /** @const @private {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(anchorElement);
 
     /** @const @private {!Element} */
     this.anchorElement_ = anchorElement;
@@ -162,9 +147,6 @@ export class Placement {
      */
     this.margins_ = opt_margins;
 
-    /** @const @private {?string} */
-    this.responsiveSizingBranch_ = responsiveSizingBranch;
-
     /** @private {?Element} */
     this.adElement_ = null;
 
@@ -227,18 +209,9 @@ export class Placement {
           this.state_ = PlacementState.TOO_NEAR_EXISTING_AD;
           return this.state_;
         }
-        const useResponsiveAdElement =
-          isResponsiveEnabled &&
-          this.responsiveSizingBranch_ != RESPONSIVE_SIZING_HOLDBACK_BRANCH;
-        this.adElement_ = useResponsiveAdElement
+        this.adElement_ = isResponsiveEnabled
           ? this.createResponsiveAdElement_(baseAttributes)
           : this.createAdElement_(baseAttributes, sizing.width);
-        if (this.responsiveSizingBranch_) {
-          addExperimentIdToElement(
-            this.responsiveSizingBranch_,
-            this.adElement_
-          );
-        }
         const noOpExpBranch = getExperimentBranch(
           this.ampdoc.win,
           NO_OP_EXP.branch
@@ -248,7 +221,7 @@ export class Placement {
         }
         this.injector_(this.anchorElement_, this.getAdElement());
 
-        if (useResponsiveAdElement) {
+        if (isResponsiveEnabled) {
           return (
             whenUpgradedToCustomElement(this.getAdElement())
               // Responsive ads set their own size when built.
@@ -265,85 +238,49 @@ export class Placement {
           );
         }
 
-        return this.getPlacementSizing_(sizing, isResponsiveEnabled).then(
-          placement => {
-            // CustomElement polyfill does not call connectedCallback
-            // synchronously. So we explicitly wait for CustomElement to be
-            // ready.
-            return whenUpgradedToCustomElement(this.getAdElement())
-              .then(() => this.getAdElement().whenBuilt())
-              .then(() => {
-                return this.resources_.attemptChangeSize(
-                  this.getAdElement(),
-                  placement.height,
-                  placement.width,
-                  placement.margins
-                );
-              })
-              .then(
-                () => {
-                  this.state_ = PlacementState.PLACED;
-                  return this.state_;
-                },
-                () => {
-                  this.state_ = PlacementState.RESIZE_FAILED;
-                  return this.state_;
-                }
+        return this.getPlacementSizing_(sizing).then(placement => {
+          // CustomElement polyfill does not call connectedCallback
+          // synchronously. So we explicitly wait for CustomElement to be
+          // ready.
+          return whenUpgradedToCustomElement(this.getAdElement())
+            .then(() => this.getAdElement().whenBuilt())
+            .then(() => {
+              return this.mutator_.attemptChangeSize(
+                this.getAdElement(),
+                placement.height,
+                placement.width,
+                placement.margins
               );
-          }
-        );
+            })
+            .then(
+              () => {
+                this.state_ = PlacementState.PLACED;
+                return this.state_;
+              },
+              () => {
+                this.state_ = PlacementState.RESIZE_FAILED;
+                return this.state_;
+              }
+            );
+        });
       });
     });
   }
 
   /**
    * Gets instructions for the placement in terms of height, width and margins.
-   * If responsive is on, ad should be placed at full viewport width and a
-   * proportionate height, and the margins are adjusted so that the ad edges
-   * stick to both ends of the viewport.
+   * This is intended to be used for non-responsive auto ads only.
    * @param {!./ad-network-config.SizeInfoDef} sizing
-   * @param {boolean} isResponsiveEnabled
    * @return {!Promise<!PlacementSizingDef>}
    * @private
    */
-  getPlacementSizing_(sizing, isResponsiveEnabled) {
-    const viewportWidth = this.viewport_.getWidth();
-    if (isResponsiveEnabled && viewportWidth <= MAXIMUM_RESPONSIVE_WIDTH) {
-      const viewportHeight = this.viewport_.getHeight();
-      const responsiveHeight = getResponsiveHeightForContext_(
-        viewportWidth,
-        viewportHeight
-      );
-      let margins = cloneLayoutMarginsChangeDef(this.margins_);
-      return getElementLayoutBox(this.anchorElement_)
-        .then(layoutBox => {
-          const direction = computedStyle(this.ampdoc.win, this.anchorElement_)[
-            'direction'
-          ];
-          if (layoutBox.left !== 0) {
-            margins = margins || {};
-            if (direction == 'rtl') {
-              margins.right = layoutBox.left;
-            } else {
-              margins.left = -layoutBox.left;
-            }
-          }
-        })
-        .then(() => {
-          return Promise.resolve({
-            width: viewportWidth,
-            height: responsiveHeight,
-            margins,
-          });
-        });
-    } else {
-      return Promise.resolve(
-        /** @type {!PlacementSizingDef} */ ({
-          height: sizing.height || TARGET_AD_HEIGHT_PX,
-          margins: this.margins_,
-        })
-      );
-    }
+  getPlacementSizing_(sizing) {
+    return Promise.resolve(
+      /** @type {!PlacementSizingDef} */ ({
+        height: sizing.height || TARGET_AD_HEIGHT_PX,
+        margins: this.margins_,
+      })
+    );
   }
 
   /**
@@ -399,14 +336,9 @@ export class Placement {
 /**
  * @param {!../../../src/service/ampdoc-impl.AmpDoc} ampdoc
  * @param {!JsonObject} configObj
- * @param {?string} responsiveSizingBranch id of selected branch in responsive sizing experiment, if any.
  * @return {!Array<!Placement>}
  */
-export function getPlacementsFromConfigObj(
-  ampdoc,
-  configObj,
-  responsiveSizingBranch
-) {
+export function getPlacementsFromConfigObj(ampdoc, configObj) {
   const placementObjs = configObj['placements'];
   if (!placementObjs) {
     user().info(TAG, 'No placements in config');
@@ -414,12 +346,7 @@ export function getPlacementsFromConfigObj(
   }
   const placements = [];
   placementObjs.forEach(placementObj => {
-    getPlacementsFromObject(
-      ampdoc,
-      placementObj,
-      placements,
-      responsiveSizingBranch
-    );
+    getPlacementsFromObject(ampdoc, placementObj, placements);
   });
   return placements;
 }
@@ -430,14 +357,8 @@ export function getPlacementsFromConfigObj(
  * @param {!../../../src/service/ampdoc-impl.AmpDoc} ampdoc
  * @param {!JsonObject} placementObj
  * @param {!Array<!Placement>} placements
- * @param {?string} responsiveSizingBranch
  */
-function getPlacementsFromObject(
-  ampdoc,
-  placementObj,
-  placements,
-  responsiveSizingBranch
-) {
+function getPlacementsFromObject(ampdoc, placementObj, placements) {
   const injector = INJECTORS[placementObj['pos']];
   if (!injector) {
     user().warn(TAG, 'No injector for position');
@@ -479,7 +400,6 @@ function getPlacementsFromObject(
         placementObj['pos'],
         injector,
         attributes,
-        responsiveSizingBranch,
         margins
       )
     );
@@ -552,18 +472,3 @@ function isPositionValid(anchorElement, position) {
     return false;
   });
 }
-
-/**
- * Calculates the appropriate height for a full-width responsive ad.
- * @param {number} viewportWidth
- * @param {number} viewportHeight
- * @return {number}
- * @private
- */
-function getResponsiveHeightForContext_(viewportWidth, viewportHeight) {
-  const minHeight = 100;
-  const maxHeight = Math.min(300, viewportHeight);
-  // We aim for a 6:5 aspect ratio.
-  const idealHeight = Math.round(viewportWidth / 1.2);
-  return clamp(idealHeight, minHeight, maxHeight);
-}
diff --git a/extensions/amp-auto-ads/0.1/test/test-adsense-network-config.js b/extensions/amp-auto-ads/0.1/test/test-adsense-network-config.js
index 420584a5853c2..b4f49b7161a69 100644
--- a/extensions/amp-auto-ads/0.1/test/test-adsense-network-config.js
+++ b/extensions/amp-auto-ads/0.1/test/test-adsense-network-config.js
@@ -43,6 +43,7 @@ describes.realWin(
     describe('AdSense', () => {
       const AD_CLIENT = 'ca-pub-1234';
       const AD_HOST = 'ca-pub-5678';
+      const AD_HOST_CHANNEL = '987654';
 
       beforeEach(() => {
         ampAutoAdsElem.setAttribute('data-ad-client', AD_CLIENT);
@@ -98,6 +99,26 @@ describes.realWin(
         ampAutoAdsElem.removeAttribute('data-ad-host');
       });
 
+      it('should add data-ad-host-channel to attributes if set on ampAutoAdsElem', () => {
+        ampAutoAdsElem.setAttribute('data-ad-host', AD_HOST);
+        ampAutoAdsElem.setAttribute('data-ad-host-channel', AD_HOST_CHANNEL);
+        const adNetwork = getAdNetworkConfig('adsense', ampAutoAdsElem);
+        expect(adNetwork.getAttributes()).to.deep.equal({
+          'type': 'adsense',
+          'data-ad-client': AD_CLIENT,
+          'data-ad-host': AD_HOST,
+          'data-ad-host-channel': AD_HOST_CHANNEL,
+        });
+      });
+
+      it('should add data-ad-host-channel to attributes only if also data-ad-host is present', () => {
+        ampAutoAdsElem.setAttribute('data-ad-host-channel', AD_HOST_CHANNEL);
+        const adNetwork = getAdNetworkConfig('adsense', ampAutoAdsElem);
+        expect(adNetwork.getAttributes()).to.not.have.property(
+          'data-ad-host-channel'
+        );
+      });
+
       it('should get the default ad constraints', () => {
         const viewportMock = env.sandbox.mock(
           Services.viewportForDoc(env.win.document)
diff --git a/extensions/amp-auto-ads/0.1/test/test-amp-auto-ads.js b/extensions/amp-auto-ads/0.1/test/test-amp-auto-ads.js
index 9e0191496005f..b317e780537d7 100644
--- a/extensions/amp-auto-ads/0.1/test/test-amp-auto-ads.js
+++ b/extensions/amp-auto-ads/0.1/test/test-amp-auto-ads.js
@@ -15,14 +15,11 @@
  */
 
 import '../../../amp-ad/0.1/amp-ad';
+import '../amp-auto-ads';
 import {BaseElement} from '../../../../src/base-element';
-import {RESPONSIVE_SIZING_EXP} from '../amp-auto-ads';
 import {Services} from '../../../../src/services';
-import {
-  forceExperimentBranch,
-  toggleExperiment,
-} from '../../../../src/experiments';
 import {getA4ARegistry} from '../../../../ads/_a4a-config';
+import {toggleExperiment} from '../../../../src/experiments';
 import {waitForChild} from '../../../../src/dom';
 
 class FakeA4A extends BaseElement {
@@ -46,503 +43,536 @@ class FakeA4A extends BaseElement {
   }
 }
 
-describes.repeated(
-  'responsive sizing experiment',
+describes.realWin(
+  'amp-auto-ads',
   {
-    'control': {branch: RESPONSIVE_SIZING_EXP.control},
-    'holdback': {branch: RESPONSIVE_SIZING_EXP.holdback},
+    amp: {
+      runtimeOn: true,
+      extensions: ['amp-ad', 'amp-auto-ads'],
+    },
   },
-  (name, variant) => {
-    describes.realWin(
-      'amp-auto-ads',
-      {
-        amp: {
-          runtimeOn: true,
-          extensions: ['amp-ad', 'amp-auto-ads'],
-        },
-      },
-      env => {
-        const OPT_IN_STATUS_ANCHOR_ADS = 2;
-
-        let win;
-        let doc;
-        let container;
-        let anchor1;
-        let anchor2;
-        let anchor3;
-        let anchor4;
-        let xhr;
-        let whenVisible;
-        let configObj;
-
-        beforeEach(() => {
-          win = env.win;
-          doc = win.document;
-          const a4aRegistry = getA4ARegistry();
-          a4aRegistry['_ping_'] = () => true;
-
-          toggleExperiment(win, 'amp-auto-ads', true);
-          forceExperimentBranch(
-            win,
-            RESPONSIVE_SIZING_EXP.branch,
-            variant.branch
-          );
-
-          // There seem to be a lot of tests that don't clean up after themselves,
-          // meaning there are a lot of <AMP-AD>s left over in the DOM.
-          // An alternative to doing this clean up would be for this test to do all
-          // its DOM stuff in a dedicated window, but trying that seems to result in a
-          // lot of errors.
-          const ampAds = doc.getElementsByTagName('AMP-AD');
-          while (ampAds.length) {
-            ampAds[0].parentNode.removeChild(ampAds[0]);
-          }
-
-          const extensions = Services.extensionsFor(win);
-          env.sandbox
-            .stub(extensions, 'loadElementClass')
-            .returns(Promise.resolve(el => new FakeA4A(el)));
-
-          const viewportMock = env.sandbox.mock(Services.viewportForDoc(doc));
-          viewportMock
-            .expects('getSize')
-            .returns({width: 320, height: 500})
-            .atLeast(1);
-
-          container = doc.createElement('div');
-          doc.body.appendChild(container);
-
-          anchor1 = doc.createElement('div');
-          anchor1.id = 'anId1';
-          container.appendChild(anchor1);
-
-          const spacer = doc.createElement('div');
-          spacer.style.height = '1000px';
-          container.appendChild(spacer);
-
-          anchor2 = doc.createElement('div');
-          anchor2.id = 'anId2';
-          container.appendChild(anchor2);
-
-          const spacer2 = doc.createElement('div');
-          spacer2.style.height = '490px';
-          container.appendChild(spacer2);
-
-          anchor3 = doc.createElement('div');
-          anchor3.id = 'anId3';
-          container.appendChild(anchor3);
-
-          const spacer3 = doc.createElement('div');
-          spacer3.style.height = '500px';
-          container.appendChild(spacer3);
-
-          anchor4 = doc.createElement('div');
-          anchor4.id = 'anId4';
-          container.appendChild(anchor4);
-
-          configObj = {
-            placements: [
-              {
-                anchor: {
-                  selector: 'DIV#anId1',
-                },
-                pos: 2,
-                type: 1,
-              },
-              {
-                anchor: {
-                  selector: 'DIV#anId2',
-                },
-                pos: 2,
-                type: 1,
-              },
-              {
-                anchor: {
-                  selector: 'DIV#anId3',
-                },
-                pos: 2,
-                type: 1,
-              },
-              {
-                anchor: {
-                  selector: 'DIV#anId4',
-                },
-                pos: 2,
-                type: 1,
-              },
-            ],
-            optInStatus: [1],
-          };
-
-          xhr = Services.xhrFor(win);
-          xhr.fetchJson = () => {
-            return Promise.resolve({
-              json() {
-                return Promise.resolve(configObj);
-              },
-            });
-          };
-          env.sandbox.spy(xhr, 'fetchJson');
+  env => {
+    const OPT_IN_STATUS_ANCHOR_ADS = 2;
+
+    let win;
+    let doc;
+    let container;
+    let anchor1;
+    let anchor2;
+    let anchor3;
+    let anchor4;
+    let xhr;
+    let whenVisible;
+    let configObj;
+
+    beforeEach(() => {
+      win = env.win;
+      doc = win.document;
+      const a4aRegistry = getA4ARegistry();
+      a4aRegistry['_ping_'] = () => true;
+
+      toggleExperiment(win, 'amp-auto-ads', true);
+
+      // There seem to be a lot of tests that don't clean up after themselves,
+      // meaning there are a lot of <AMP-AD>s left over in the DOM.
+      // An alternative to doing this clean up would be for this test to do all
+      // its DOM stuff in a dedicated window, but trying that seems to result in a
+      // lot of errors.
+      const ampAds = doc.getElementsByTagName('AMP-AD');
+      while (ampAds.length) {
+        ampAds[0].parentNode.removeChild(ampAds[0]);
+      }
 
-          whenVisible = env.sandbox.stub(env.ampdoc, 'whenFirstVisible');
-          whenVisible.returns(Promise.resolve());
+      const extensions = Services.extensionsFor(win);
+      env.sandbox
+        .stub(extensions, 'loadElementClass')
+        .returns(Promise.resolve(el => new FakeA4A(el)));
+
+      const viewportMock = env.sandbox.mock(Services.viewportForDoc(doc));
+      viewportMock
+        .expects('getSize')
+        .returns({width: 320, height: 500})
+        .atLeast(1);
+
+      container = doc.createElement('div');
+      doc.body.appendChild(container);
+
+      anchor1 = doc.createElement('div');
+      anchor1.id = 'anId1';
+      container.appendChild(anchor1);
+
+      const spacer = doc.createElement('div');
+      spacer.style.height = '1000px';
+      container.appendChild(spacer);
+
+      anchor2 = doc.createElement('div');
+      anchor2.id = 'anId2';
+      container.appendChild(anchor2);
+
+      const spacer2 = doc.createElement('div');
+      spacer2.style.height = '490px';
+      container.appendChild(spacer2);
+
+      anchor3 = doc.createElement('div');
+      anchor3.id = 'anId3';
+      container.appendChild(anchor3);
+
+      const spacer3 = doc.createElement('div');
+      spacer3.style.height = '500px';
+      container.appendChild(spacer3);
+
+      anchor4 = doc.createElement('div');
+      anchor4.id = 'anId4';
+      container.appendChild(anchor4);
+
+      configObj = {
+        placements: [
+          {
+            anchor: {
+              selector: 'DIV#anId1',
+            },
+            pos: 2,
+            type: 1,
+          },
+          {
+            anchor: {
+              selector: 'DIV#anId2',
+            },
+            pos: 2,
+            type: 1,
+          },
+          {
+            anchor: {
+              selector: 'DIV#anId3',
+            },
+            pos: 2,
+            type: 1,
+          },
+          {
+            anchor: {
+              selector: 'DIV#anId4',
+            },
+            pos: 2,
+            type: 1,
+          },
+        ],
+        optInStatus: [1],
+      };
+
+      xhr = Services.xhrFor(win);
+      xhr.fetchJson = () => {
+        return Promise.resolve({
+          json() {
+            return Promise.resolve(configObj);
+          },
         });
+      };
+      env.sandbox.spy(xhr, 'fetchJson');
 
-        function getAmpAutoAds(type) {
-          const ampAutoAds = doc.createElement('amp-auto-ads');
-          if (type !== 'NONE') {
-            ampAutoAds.setAttribute('type', type || '_ping_');
-          }
-          doc.body.appendChild(ampAutoAds);
-          return ampAutoAds.build().then(() => {
-            return ampAutoAds.layoutCallback();
-          });
-        }
+      whenVisible = env.sandbox.stub(env.ampdoc, 'whenFirstVisible');
+      whenVisible.returns(Promise.resolve());
+    });
 
-        function verifyAdElement(adElement) {
-          expect(adElement.tagName).to.equal('AMP-AD');
-          expect(adElement.getAttribute('type')).to.equal('_ping_');
-        }
+    function getAmpAutoAds(type) {
+      const ampAutoAds = doc.createElement('amp-auto-ads');
+      if (type !== 'NONE') {
+        ampAutoAds.setAttribute('type', type || '_ping_');
+      }
+      doc.body.appendChild(ampAutoAds);
+      return ampAutoAds.build().then(() => {
+        return ampAutoAds.layoutCallback();
+      });
+    }
 
-        it('should wait for viewer visible', () => {
-          let resolve;
-          const visible = new Promise(res => {
-            resolve = res;
-          });
-          whenVisible.returns(visible);
+    function verifyAdElement(adElement) {
+      expect(adElement.tagName).to.equal('AMP-AD');
+      expect(adElement.getAttribute('type')).to.equal('_ping_');
+    }
 
-          return getAmpAutoAds().then(() => {
-            return Promise.resolve()
-              .then(() => {
-                expect(xhr.fetchJson).to.not.have.been.called;
-                resolve();
-                return visible;
-              })
-              .then(() => {
-                expect(xhr.fetchJson).to.have.been.called;
-              });
+    it('should wait for viewer visible', () => {
+      let resolve;
+      const visible = new Promise(res => {
+        resolve = res;
+      });
+      whenVisible.returns(visible);
+
+      return getAmpAutoAds().then(() => {
+        return Promise.resolve()
+          .then(() => {
+            expect(xhr.fetchJson).to.not.have.been.called;
+            resolve();
+            return visible;
+          })
+          .then(() => {
+            expect(xhr.fetchJson).to.have.been.called;
           });
+      });
+    });
+
+    it('should insert three ads on page using config', () => {
+      return getAmpAutoAds().then(() => {
+        return new Promise(resolve => {
+          waitForChild(
+            anchor4,
+            parent => {
+              return parent.childNodes.length > 0;
+            },
+            () => {
+              expect(anchor1.childNodes).to.have.lengthOf(1);
+              expect(anchor2.childNodes).to.have.lengthOf(1);
+              expect(anchor3.childNodes).to.have.lengthOf(0);
+              expect(anchor4.childNodes).to.have.lengthOf(1);
+              verifyAdElement(anchor1.childNodes[0]);
+              verifyAdElement(anchor2.childNodes[0]);
+              verifyAdElement(anchor4.childNodes[0]);
+              resolve();
+            }
+          );
         });
+      });
+    });
+
+    it('should insert ads with the config provided attributes', () => {
+      configObj.attributes = {
+        'bad-name': 'should be filtered',
+        'data-custom-att-1': 'val-1',
+        'data-custom-att-2': 'val-2',
+      };
+
+      return getAmpAutoAds().then(() => {
+        return new Promise(resolve => {
+          waitForChild(
+            anchor4,
+            parent => {
+              return parent.childNodes.length > 0;
+            },
+            () => {
+              expect(anchor1.childNodes).to.have.lengthOf(1);
+              expect(
+                anchor1.childNodes[0].getAttribute('data-custom-att-1')
+              ).to.equal('val-1');
+              expect(
+                anchor1.childNodes[0].getAttribute('data-custom-att-2')
+              ).to.equal('val-2');
+
+              expect(anchor2.childNodes).to.have.lengthOf(1);
+              expect(
+                anchor2.childNodes[0].getAttribute('data-custom-att-1')
+              ).to.equal('val-1');
+              expect(
+                anchor2.childNodes[0].getAttribute('data-custom-att-2')
+              ).to.equal('val-2');
+
+              expect(anchor4.childNodes).to.have.lengthOf(1);
+              expect(
+                anchor4.childNodes[0].getAttribute('data-custom-att-1')
+              ).to.equal('val-1');
+              expect(
+                anchor4.childNodes[0].getAttribute('data-custom-att-2')
+              ).to.equal('val-2');
+              resolve();
+            }
+          );
+        });
+      });
+    });
+
+    it('should override ad network type with config provided attribute', () => {
+      configObj.attributes = {
+        'type': '_ping_',
+      };
+
+      return getAmpAutoAds('doubleclick').then(() => {
+        return new Promise(resolve => {
+          waitForChild(
+            anchor4,
+            parent => {
+              return parent.childNodes.length > 0;
+            },
+            () => {
+              expect(anchor1.childNodes).to.have.lengthOf(1);
+              expect(anchor1.childNodes[0].getAttribute('type')).to.equal(
+                '_ping_'
+              );
 
-        it('should insert three ads on page using config', () => {
-          return getAmpAutoAds().then(() => {
-            return new Promise(resolve => {
-              waitForChild(
-                anchor4,
-                parent => {
-                  return parent.childNodes.length > 0;
-                },
-                () => {
-                  expect(anchor1.childNodes).to.have.lengthOf(1);
-                  expect(anchor2.childNodes).to.have.lengthOf(1);
-                  expect(anchor3.childNodes).to.have.lengthOf(0);
-                  expect(anchor4.childNodes).to.have.lengthOf(1);
-                  verifyAdElement(anchor1.childNodes[0]);
-                  verifyAdElement(anchor2.childNodes[0]);
-                  verifyAdElement(anchor4.childNodes[0]);
-                  resolve();
-                }
+              expect(anchor2.childNodes).to.have.lengthOf(1);
+              expect(anchor2.childNodes[0].getAttribute('type')).to.equal(
+                '_ping_'
               );
-            });
-          });
-        });
 
-        it('should insert ads with the config provided attributes', () => {
-          configObj.attributes = {
-            'bad-name': 'should be filtered',
-            'data-custom-att-1': 'val-1',
-            'data-custom-att-2': 'val-2',
-          };
-
-          return getAmpAutoAds().then(() => {
-            return new Promise(resolve => {
-              waitForChild(
-                anchor4,
-                parent => {
-                  return parent.childNodes.length > 0;
-                },
-                () => {
-                  expect(anchor1.childNodes).to.have.lengthOf(1);
-                  expect(
-                    anchor1.childNodes[0].getAttribute('data-custom-att-1')
-                  ).to.equal('val-1');
-                  expect(
-                    anchor1.childNodes[0].getAttribute('data-custom-att-2')
-                  ).to.equal('val-2');
-
-                  expect(anchor2.childNodes).to.have.lengthOf(1);
-                  expect(
-                    anchor2.childNodes[0].getAttribute('data-custom-att-1')
-                  ).to.equal('val-1');
-                  expect(
-                    anchor2.childNodes[0].getAttribute('data-custom-att-2')
-                  ).to.equal('val-2');
-
-                  expect(anchor4.childNodes).to.have.lengthOf(1);
-                  expect(
-                    anchor4.childNodes[0].getAttribute('data-custom-att-1')
-                  ).to.equal('val-1');
-                  expect(
-                    anchor4.childNodes[0].getAttribute('data-custom-att-2')
-                  ).to.equal('val-2');
-                  resolve();
-                }
+              expect(anchor4.childNodes).to.have.lengthOf(1);
+              expect(anchor4.childNodes[0].getAttribute('type')).to.equal(
+                '_ping_'
               );
-            });
-          });
+              resolve();
+            }
+          );
+        });
+      });
+    });
+
+    it('should fetch a config from the correct URL', () => {
+      return getAmpAutoAds().then(() => {
+        expect(xhr.fetchJson).to.have.been.calledWith(
+          '//lh3.googleusercontent.com/' +
+            'pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w400-h300-no-n',
+          {
+            mode: 'cors',
+            method: 'GET',
+            credentials: 'omit',
+          }
+        );
+        expect(xhr.fetchJson).to.be.calledOnce;
+      });
+    });
+
+    it('should throw an error if no type', () => {
+      return allowConsoleError(() => {
+        return getAmpAutoAds('NONE').catch(err => {
+          expect(err.message).to.include('Missing type attribute');
+          expect(xhr.fetchJson).not.to.have.been.called;
+        });
+      });
+    });
+
+    it('should not try and fetch config if unknown type', () => {
+      return allowConsoleError(() => {
+        return getAmpAutoAds('unknowntype').catch(err => {
+          expect(err.message).to.include('No AdNetworkConfig for type');
+          expect(xhr.fetchJson).not.to.have.been.called;
+        });
+      });
+    });
+
+    it('should not try and fetch config if experiment off', () => {
+      return allowConsoleError(() => {
+        toggleExperiment(env.win, 'amp-auto-ads', false);
+        return getAmpAutoAds().catch(err => {
+          expect(err.message).to.include('Experiment is off');
+          expect(xhr.fetchJson).not.to.have.been.called;
+        });
+      });
+    });
+
+    it('should still run ad strategies even when noConfigReason present.', () => {
+      configObj['optInStatus'].push(OPT_IN_STATUS_ANCHOR_ADS);
+      configObj.stickyAdAttributes = {
+        'data-no-fill': 'true',
+      };
+      configObj['noConfigReason'] = 'a reason';
+
+      return getAmpAutoAds().then(() => {
+        const bannerAdsPromise = new Promise(resolve => {
+          waitForChild(
+            anchor4,
+            parent => {
+              return parent.childNodes.length > 0;
+            },
+            () => {
+              expect(anchor1.childNodes).to.have.lengthOf(1);
+              expect(anchor2.childNodes).to.have.lengthOf(1);
+              expect(anchor3.childNodes).to.have.lengthOf(0);
+              expect(anchor4.childNodes).to.have.lengthOf(1);
+              verifyAdElement(anchor1.childNodes[0]);
+              verifyAdElement(anchor2.childNodes[0]);
+              verifyAdElement(anchor4.childNodes[0]);
+              expect(anchor4.childNodes[0].hasAttribute('data-no-fill')).to.to
+                .be.false;
+              resolve();
+            }
+          );
         });
 
-        it('should override ad network type with config provided attribute', () => {
-          configObj.attributes = {
-            'type': '_ping_',
-          };
-
-          return getAmpAutoAds('doubleclick').then(() => {
-            return new Promise(resolve => {
-              waitForChild(
-                anchor4,
-                parent => {
-                  return parent.childNodes.length > 0;
-                },
-                () => {
-                  expect(anchor1.childNodes).to.have.lengthOf(1);
-                  expect(anchor1.childNodes[0].getAttribute('type')).to.equal(
-                    '_ping_'
-                  );
-
-                  expect(anchor2.childNodes).to.have.lengthOf(1);
-                  expect(anchor2.childNodes[0].getAttribute('type')).to.equal(
-                    '_ping_'
-                  );
-
-                  expect(anchor4.childNodes).to.have.lengthOf(1);
-                  expect(anchor4.childNodes[0].getAttribute('type')).to.equal(
-                    '_ping_'
-                  );
-                  resolve();
-                }
-              );
-            });
+        const anchorAdPromise = new Promise(resolve => {
+          waitForChild(
+            env.win.document.body,
+            parent => {
+              return parent.firstChild.tagName == 'AMP-STICKY-AD';
+            },
+            () => {
+              const stickyAd = env.win.document.body.firstChild;
+              const ampAd = stickyAd.firstChild;
+              expect(ampAd.getAttribute('data-no-fill')).to.equal('true');
+              resolve();
+            }
+          );
+        });
+        return Promise.all([bannerAdsPromise, anchorAdPromise]);
+      });
+    });
+
+    describe('Anchor Ad', () => {
+      it('should not insert anchor ad if not opted in', () => {
+        return getAmpAutoAds().then(() => {
+          return new Promise(resolve => {
+            setTimeout(() => {
+              expect(
+                env.win.document.getElementsByTagName('AMP-STICKY-AD')
+              ).to.have.lengthOf(0);
+              resolve();
+            }, 500);
           });
         });
+      });
+
+      it('should insert three ads plus anchor ad', () => {
+        configObj['optInStatus'].push(OPT_IN_STATUS_ANCHOR_ADS);
 
-        it('should fetch a config from the correct URL', () => {
-          return getAmpAutoAds().then(() => {
-            expect(xhr.fetchJson).to.have.been.calledWith(
-              '//lh3.googleusercontent.com/' +
-                'pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w400-h300-no-n',
-              {
-                mode: 'cors',
-                method: 'GET',
-                credentials: 'omit',
+        return getAmpAutoAds().then(() => {
+          const bannerAdsPromise = new Promise(resolve => {
+            waitForChild(
+              anchor4,
+              parent => {
+                return parent.childNodes.length > 0;
+              },
+              () => {
+                expect(anchor1.childNodes).to.have.lengthOf(1);
+                expect(anchor2.childNodes).to.have.lengthOf(1);
+                expect(anchor3.childNodes).to.have.lengthOf(0);
+                expect(anchor4.childNodes).to.have.lengthOf(1);
+                verifyAdElement(anchor1.childNodes[0]);
+                verifyAdElement(anchor2.childNodes[0]);
+                verifyAdElement(anchor4.childNodes[0]);
+                resolve();
               }
             );
-            expect(xhr.fetchJson).to.be.calledOnce;
           });
-        });
 
-        it('should throw an error if no type', () => {
-          return allowConsoleError(() => {
-            return getAmpAutoAds('NONE').catch(err => {
-              expect(err.message).to.include('Missing type attribute');
-              expect(xhr.fetchJson).not.to.have.been.called;
-            });
+          const anchorAdPromise = new Promise(resolve => {
+            waitForChild(
+              env.win.document.body,
+              parent => {
+                return parent.firstChild.tagName == 'AMP-STICKY-AD';
+              },
+              () => {
+                resolve();
+              }
+            );
           });
-        });
 
-        it('should not try and fetch config if unknown type', () => {
-          return allowConsoleError(() => {
-            return getAmpAutoAds('unknowntype').catch(err => {
-              expect(err.message).to.include('No AdNetworkConfig for type');
-              expect(xhr.fetchJson).not.to.have.been.called;
-            });
-          });
+          return Promise.all([bannerAdsPromise, anchorAdPromise]);
         });
-
-        it('should not try and fetch config if experiment off', () => {
-          return allowConsoleError(() => {
-            toggleExperiment(env.win, 'amp-auto-ads', false);
-            return getAmpAutoAds().catch(err => {
-              expect(err.message).to.include('Experiment is off');
-              expect(xhr.fetchJson).not.to.have.been.called;
-            });
+      });
+
+      it('should insert anchor anchor ad only', () => {
+        configObj = {
+          optInStatus: [2],
+        };
+
+        return getAmpAutoAds().then(() => {
+          return new Promise(resolve => {
+            waitForChild(
+              env.win.document.body,
+              parent => {
+                return parent.firstChild.tagName == 'AMP-STICKY-AD';
+              },
+              () => {
+                resolve();
+              }
+            );
           });
         });
-
-        describe('Anchor Ad', () => {
-          it('should not insert anchor ad if not opted in', () => {
-            return getAmpAutoAds().then(() => {
-              return new Promise(resolve => {
-                setTimeout(() => {
-                  expect(
-                    env.win.document.getElementsByTagName('AMP-STICKY-AD')
-                  ).to.have.lengthOf(0);
-                  resolve();
-                }, 500);
-              });
-            });
-          });
-
-          it('should insert three ads plus anchor ad', () => {
-            configObj['optInStatus'].push(OPT_IN_STATUS_ANCHOR_ADS);
-
-            return getAmpAutoAds().then(() => {
-              const bannerAdsPromise = new Promise(resolve => {
-                waitForChild(
-                  anchor4,
-                  parent => {
-                    return parent.childNodes.length > 0;
-                  },
-                  () => {
-                    expect(anchor1.childNodes).to.have.lengthOf(1);
-                    expect(anchor2.childNodes).to.have.lengthOf(1);
-                    expect(anchor3.childNodes).to.have.lengthOf(0);
-                    expect(anchor4.childNodes).to.have.lengthOf(1);
-                    verifyAdElement(anchor1.childNodes[0]);
-                    verifyAdElement(anchor2.childNodes[0]);
-                    verifyAdElement(anchor4.childNodes[0]);
-                    resolve();
-                  }
-                );
-              });
-
-              const anchorAdPromise = new Promise(resolve => {
-                waitForChild(
-                  env.win.document.body,
-                  parent => {
-                    return parent.firstChild.tagName == 'AMP-STICKY-AD';
-                  },
-                  () => {
-                    resolve();
-                  }
-                );
-              });
-
-              return Promise.all([bannerAdsPromise, anchorAdPromise]);
-            });
-          });
-
-          it('should insert anchor anchor ad only', () => {
-            configObj = {
-              optInStatus: [2],
-            };
-
-            return getAmpAutoAds().then(() => {
-              return new Promise(resolve => {
-                waitForChild(
-                  env.win.document.body,
-                  parent => {
-                    return parent.firstChild.tagName == 'AMP-STICKY-AD';
-                  },
-                  () => {
-                    resolve();
-                  }
-                );
-              });
-            });
+      });
+
+      it('should insert three ads with base attribute and anchor anchor ad with provided anchor ad attributes.', () => {
+        configObj['optInStatus'].push(OPT_IN_STATUS_ANCHOR_ADS);
+        configObj.stickyAdAttributes = {
+          'data-no-fill': 'true',
+        };
+
+        return getAmpAutoAds().then(() => {
+          const bannerAdsPromise = new Promise(resolve => {
+            waitForChild(
+              anchor4,
+              parent => {
+                return parent.childNodes.length > 0;
+              },
+              () => {
+                expect(anchor1.childNodes).to.have.lengthOf(1);
+                expect(anchor2.childNodes).to.have.lengthOf(1);
+                expect(anchor3.childNodes).to.have.lengthOf(0);
+                expect(anchor4.childNodes).to.have.lengthOf(1);
+                verifyAdElement(anchor1.childNodes[0]);
+                verifyAdElement(anchor2.childNodes[0]);
+                verifyAdElement(anchor4.childNodes[0]);
+                expect(anchor4.childNodes[0].hasAttribute('data-no-fill')).to.be
+                  .false;
+                resolve();
+              }
+            );
           });
 
-          it('should insert three ads with base attribute and anchor anchor ad with provided anchor ad attributes.', () => {
-            configObj['optInStatus'].push(OPT_IN_STATUS_ANCHOR_ADS);
-            configObj.stickyAdAttributes = {
-              'data-no-fill': 'true',
-            };
-
-            return getAmpAutoAds().then(() => {
-              const bannerAdsPromise = new Promise(resolve => {
-                waitForChild(
-                  anchor4,
-                  parent => {
-                    return parent.childNodes.length > 0;
-                  },
-                  () => {
-                    expect(anchor1.childNodes).to.have.lengthOf(1);
-                    expect(anchor2.childNodes).to.have.lengthOf(1);
-                    expect(anchor3.childNodes).to.have.lengthOf(0);
-                    expect(anchor4.childNodes).to.have.lengthOf(1);
-                    verifyAdElement(anchor1.childNodes[0]);
-                    verifyAdElement(anchor2.childNodes[0]);
-                    verifyAdElement(anchor4.childNodes[0]);
-                    expect(anchor4.childNodes[0].hasAttribute('data-no-fill'))
-                      .to.be.false;
-                    resolve();
-                  }
-                );
-              });
-
-              const anchorAdPromise = new Promise(resolve => {
-                waitForChild(
-                  env.win.document.body,
-                  parent => {
-                    return parent.firstChild.tagName == 'AMP-STICKY-AD';
-                  },
-                  () => {
-                    const stickyAd = env.win.document.body.firstChild;
-                    const ampAd = stickyAd.firstChild;
-                    expect(ampAd.getAttribute('data-no-fill')).to.equal('true');
-                    resolve();
-                  }
-                );
-              });
-              return Promise.all([bannerAdsPromise, anchorAdPromise]);
-            });
+          const anchorAdPromise = new Promise(resolve => {
+            waitForChild(
+              env.win.document.body,
+              parent => {
+                return parent.firstChild.tagName == 'AMP-STICKY-AD';
+              },
+              () => {
+                const stickyAd = env.win.document.body.firstChild;
+                const ampAd = stickyAd.firstChild;
+                expect(ampAd.getAttribute('data-no-fill')).to.equal('true');
+                resolve();
+              }
+            );
           });
+          return Promise.all([bannerAdsPromise, anchorAdPromise]);
         });
-
-        describe('ad constraints', () => {
-          it('should insert 3 ads when using the default ad contraints', () => {
-            return getAmpAutoAds().then(() => {
-              return new Promise(resolve => {
-                waitForChild(
-                  anchor4,
-                  parent => {
-                    return parent.childNodes.length > 0;
-                  },
-                  () => {
-                    expect(anchor1.childNodes).to.have.lengthOf(1);
-                    expect(anchor2.childNodes).to.have.lengthOf(1);
-                    expect(anchor3.childNodes).to.have.lengthOf(0);
-                    expect(anchor4.childNodes).to.have.lengthOf(1);
-                    verifyAdElement(anchor1.childNodes[0]);
-                    verifyAdElement(anchor2.childNodes[0]);
-                    verifyAdElement(anchor4.childNodes[0]);
-                    resolve();
-                  }
-                );
-              });
-            });
+      });
+    });
+
+    describe('ad constraints', () => {
+      it('should insert 3 ads when using the default ad contraints', () => {
+        return getAmpAutoAds().then(() => {
+          return new Promise(resolve => {
+            waitForChild(
+              anchor4,
+              parent => {
+                return parent.childNodes.length > 0;
+              },
+              () => {
+                expect(anchor1.childNodes).to.have.lengthOf(1);
+                expect(anchor2.childNodes).to.have.lengthOf(1);
+                expect(anchor3.childNodes).to.have.lengthOf(0);
+                expect(anchor4.childNodes).to.have.lengthOf(1);
+                verifyAdElement(anchor1.childNodes[0]);
+                verifyAdElement(anchor2.childNodes[0]);
+                verifyAdElement(anchor4.childNodes[0]);
+                resolve();
+              }
+            );
           });
-
-          it('should insert 4 ads when using the config ad constraints', () => {
-            configObj.adConstraints = {
-              initialMinSpacing: '99px',
-              maxAdCount: 8,
-            };
-
-            return getAmpAutoAds().then(() => {
-              return new Promise(resolve => {
-                waitForChild(
-                  anchor4,
-                  parent => {
-                    return parent.childNodes.length > 0;
-                  },
-                  () => {
-                    expect(anchor1.childNodes).to.have.lengthOf(1);
-                    expect(anchor2.childNodes).to.have.lengthOf(1);
-                    expect(anchor3.childNodes).to.have.lengthOf(1);
-                    expect(anchor4.childNodes).to.have.lengthOf(1);
-                    verifyAdElement(anchor1.childNodes[0]);
-                    verifyAdElement(anchor2.childNodes[0]);
-                    verifyAdElement(anchor3.childNodes[0]);
-                    verifyAdElement(anchor4.childNodes[0]);
-                    resolve();
-                  }
-                );
-              });
-            });
+        });
+      });
+
+      it('should insert 4 ads when using the config ad constraints', () => {
+        configObj.adConstraints = {
+          initialMinSpacing: '99px',
+          maxAdCount: 8,
+        };
+
+        return getAmpAutoAds().then(() => {
+          return new Promise(resolve => {
+            waitForChild(
+              anchor4,
+              parent => {
+                return parent.childNodes.length > 0;
+              },
+              () => {
+                expect(anchor1.childNodes).to.have.lengthOf(1);
+                expect(anchor2.childNodes).to.have.lengthOf(1);
+                expect(anchor3.childNodes).to.have.lengthOf(1);
+                expect(anchor4.childNodes).to.have.lengthOf(1);
+                verifyAdElement(anchor1.childNodes[0]);
+                verifyAdElement(anchor2.childNodes[0]);
+                verifyAdElement(anchor3.childNodes[0]);
+                verifyAdElement(anchor4.childNodes[0]);
+                resolve();
+              }
+            );
           });
         });
-      }
-    );
+      });
+    });
   }
 );
diff --git a/extensions/amp-auto-ads/0.1/test/test-placement.js b/extensions/amp-auto-ads/0.1/test/test-placement.js
index 4b9effec5efdb..009feb8b85517 100644
--- a/extensions/amp-auto-ads/0.1/test/test-placement.js
+++ b/extensions/amp-auto-ads/0.1/test/test-placement.js
@@ -15,14 +15,12 @@
  */
 
 import '../../../amp-ad/0.1/amp-ad';
-import * as Utils from '../utils';
 import {AdTracker} from '../ad-tracker';
 import {
   NO_OP_EXP,
   PlacementState,
   getPlacementsFromConfigObj,
 } from '../placement';
-import {RESPONSIVE_SIZING_EXP} from '../amp-auto-ads';
 import {Services} from '../../../../src/services';
 import {forceExperimentBranch} from '../../../../src/experiments';
 import {isInExperiment} from '../../../../ads/google/a4a/traffic-experiments';
@@ -464,8 +462,8 @@ describes.realWin(
           maxAdCount: 10,
         });
 
-        const resources = Services.resourcesForDoc(anchor);
-        env.sandbox.stub(resources, 'attemptChangeSize').callsFake(() => {
+        const mutator = Services.mutatorForDoc(anchor);
+        env.sandbox.stub(mutator, 'attemptChangeSize').callsFake(() => {
           return Promise.reject();
         });
 
@@ -667,27 +665,23 @@ describes.realWin(
         anchor.id = 'anId';
         container.appendChild(anchor);
 
-        const resource = Services.resourcesForDoc(anchor);
-        env.sandbox.stub(resource, 'attemptChangeSize').callsFake(() => {
+        const mutator = Services.mutatorForDoc(anchor);
+        env.sandbox.stub(mutator, 'attemptChangeSize').callsFake(() => {
           return Promise.resolve();
         });
-        env.sandbox.stub(resource.viewport_, 'getWidth').callsFake(() => 2000);
+        env.sandbox.stub(mutator.viewport_, 'getWidth').callsFake(() => 2000);
 
-        const placements = getPlacementsFromConfigObj(
-          ampdoc,
-          {
-            placements: [
-              {
-                anchor: {
-                  selector: 'DIV#anId',
-                },
-                pos: 2,
-                type: 1,
+        const placements = getPlacementsFromConfigObj(ampdoc, {
+          placements: [
+            {
+              anchor: {
+                selector: 'DIV#anId',
               },
-            ],
-          },
-          RESPONSIVE_SIZING_EXP.control
-        );
+              pos: 2,
+              type: 1,
+            },
+          ],
+        });
         expect(placements).to.have.lengthOf(1);
 
         const attributes = {
@@ -716,116 +710,6 @@ describes.realWin(
             expect(adElement.style.marginLeft).to.equal('');
             expect(adElement.style.marginRight).to.equal('');
             expect(placementState).to.equal(PlacementState.RESIZE_FAILED);
-            expect(isInExperiment(adElement, RESPONSIVE_SIZING_EXP.control)).to
-              .be.true;
-          });
-      });
-
-      it('should resize to full-width responsive correctly in ltr', () => {
-        const anchor = doc.createElement('div');
-        anchor.id = 'anId';
-        container.appendChild(anchor);
-
-        const resource = Services.resourcesForDoc(anchor);
-        env.sandbox.stub(resource, 'attemptChangeSize').callsFake(() => {
-          return Promise.resolve();
-        });
-        env.sandbox.stub(win, 'getComputedStyle').callsFake(() => {
-          return {direction: 'ltr'};
-        });
-        env.sandbox.stub(Utils, 'getElementLayoutBox').callsFake(() => {
-          return Promise.resolve({left: 20});
-        });
-
-        const placements = getPlacementsFromConfigObj(
-          ampdoc,
-          {
-            placements: [
-              {
-                anchor: {
-                  selector: 'DIV#anId',
-                },
-                pos: 2,
-                type: 1,
-              },
-            ],
-          },
-          RESPONSIVE_SIZING_EXP.holdback
-        );
-        expect(placements).to.have.lengthOf(1);
-
-        const attributes = {
-          'type': '_ping_',
-        };
-
-        const sizing = {};
-
-        const adTracker = new AdTracker([], {
-          initialMinSpacing: 0,
-          subsequentMinSpacing: [],
-          maxAdCount: 10,
-        });
-        return placements[0]
-          .placeAd(attributes, sizing, adTracker, true)
-          .then(placementState => {
-            expect(
-              resource.attemptChangeSize
-            ).to.have.been.calledWith(anchor.firstChild, 150, 300, {left: -20});
-            expect(placementState).to.equal(PlacementState.PLACED);
-          });
-      });
-
-      it('should resize to full-width responsive correctly in rtl', () => {
-        const anchor = doc.createElement('div');
-        anchor.id = 'anId';
-        container.appendChild(anchor);
-
-        const resource = Services.resourcesForDoc(anchor);
-        env.sandbox.stub(resource, 'attemptChangeSize').callsFake(() => {
-          return Promise.resolve();
-        });
-        env.sandbox.stub(win, 'getComputedStyle').callsFake(() => {
-          return {direction: 'rtl'};
-        });
-        env.sandbox.stub(Utils, 'getElementLayoutBox').callsFake(() => {
-          return Promise.resolve({left: 20});
-        });
-
-        const placements = getPlacementsFromConfigObj(
-          ampdoc,
-          {
-            placements: [
-              {
-                anchor: {
-                  selector: 'DIV#anId',
-                },
-                pos: 2,
-                type: 1,
-              },
-            ],
-          },
-          RESPONSIVE_SIZING_EXP.holdback
-        );
-        expect(placements).to.have.lengthOf(1);
-
-        const attributes = {
-          'type': '_ping_',
-        };
-
-        const sizing = {};
-
-        const adTracker = new AdTracker([], {
-          initialMinSpacing: 0,
-          subsequentMinSpacing: [],
-          maxAdCount: 10,
-        });
-        return placements[0]
-          .placeAd(attributes, sizing, adTracker, true)
-          .then(placementState => {
-            expect(
-              resource.attemptChangeSize
-            ).to.have.been.calledWith(anchor.firstChild, 150, 300, {right: 20});
-            expect(placementState).to.equal(PlacementState.PLACED);
           });
       });
 
@@ -834,8 +718,8 @@ describes.realWin(
         anchor.id = 'anId';
         container.appendChild(anchor);
 
-        const resource = Services.resourcesForDoc(anchor);
-        env.sandbox.stub(resource, 'attemptChangeSize').callsFake(() => {
+        const mutator = Services.mutatorForDoc(anchor);
+        env.sandbox.stub(mutator, 'attemptChangeSize').callsFake(() => {
           return Promise.resolve();
         });
 
@@ -866,7 +750,7 @@ describes.realWin(
         return placements[0]
           .placeAd(attributes, sizing, adTracker)
           .then(placementState => {
-            expect(resource.attemptChangeSize).to.have.been.calledWith(
+            expect(mutator.attemptChangeSize).to.have.been.calledWith(
               anchor.firstChild,
               250,
               undefined
@@ -875,64 +759,13 @@ describes.realWin(
           });
       });
 
-      it('should report resize failed when resize not allowed - responsive', () => {
-        const anchor = doc.createElement('div');
-        anchor.id = 'anId';
-        container.appendChild(anchor);
-
-        const resource = Services.resourcesForDoc(anchor);
-        env.sandbox.stub(resource, 'attemptChangeSize').callsFake(() => {
-          return Promise.reject(new Error('Resize failed'));
-        });
-
-        const placements = getPlacementsFromConfigObj(
-          ampdoc,
-          {
-            placements: [
-              {
-                anchor: {
-                  selector: 'DIV#anId',
-                },
-                pos: 2,
-                type: 1,
-              },
-            ],
-          },
-          RESPONSIVE_SIZING_EXP.holdback
-        );
-        expect(placements).to.have.lengthOf(1);
-
-        const attributes = {
-          'type': '_ping_',
-        };
-
-        const sizing = {};
-
-        const adTracker = new AdTracker([], {
-          initialMinSpacing: 0,
-          subsequentMinSpacing: [],
-          maxAdCount: 10,
-        });
-        return placements[0]
-          .placeAd(attributes, sizing, adTracker, true)
-          .then(placementState => {
-            expect(resource.attemptChangeSize).to.have.been.calledWith(
-              anchor.firstChild,
-              150,
-              300,
-              undefined
-            );
-            expect(placementState).to.equal(PlacementState.RESIZE_FAILED);
-          });
-      });
-
       it('should report resize failed when resize not allowed', () => {
         const anchor = doc.createElement('div');
         anchor.id = 'anId';
         container.appendChild(anchor);
 
-        const resource = Services.resourcesForDoc(anchor);
-        env.sandbox.stub(resource, 'attemptChangeSize').callsFake(() => {
+        const mutator = Services.mutatorForDoc(anchor);
+        env.sandbox.stub(mutator, 'attemptChangeSize').callsFake(() => {
           return Promise.reject(new Error('Resize failed'));
         });
 
@@ -963,7 +796,7 @@ describes.realWin(
         return placements[0]
           .placeAd(attributes, sizing, adTracker)
           .then(placementState => {
-            expect(resource.attemptChangeSize).to.have.been.calledWith(
+            expect(mutator.attemptChangeSize).to.have.been.calledWith(
               anchor.firstChild,
               250,
               undefined
diff --git a/extensions/amp-auto-lightbox/0.1/amp-auto-lightbox.js b/extensions/amp-auto-lightbox/0.1/amp-auto-lightbox.js
index 5d3ef2ed85413..cc72ba866b22a 100644
--- a/extensions/amp-auto-lightbox/0.1/amp-auto-lightbox.js
+++ b/extensions/amp-auto-lightbox/0.1/amp-auto-lightbox.js
@@ -245,6 +245,8 @@ export class Scanner {
   static getCandidates(root) {
     const selector = candidateSelector('amp-img');
     const candidates = toArray(root.querySelectorAll(selector));
+    // TODO(alanorozco): DOM mutations should be wrapped in mutate contexts.
+    // Alternatively, use in-memory "visited" marker instead of attribute.
     candidates.forEach(markAsVisited);
     return candidates;
   }
@@ -283,7 +285,10 @@ export class DocMetaAnnotations {
    */
   static getAllLdJsonTypes(ampdoc) {
     return toArray(getRootNode(ampdoc).querySelectorAll(SCRIPT_LD_JSON))
-      .map(({textContent}) => (tryParseJson(textContent) || {})['@type'])
+      .map(el => {
+        const {textContent} = el;
+        return (tryParseJson(textContent) || {})['@type'];
+      })
       .filter(typeOrUndefined => typeOrUndefined);
   }
 
@@ -418,9 +423,11 @@ export function scan(ampdoc, opt_root) {
   return runCandidates(ampdoc, Scanner.getCandidates(root));
 }
 
-AMP.extension(TAG, '0.1', ({ampdoc}) => {
+AMP.extension(TAG, '0.1', AMP => {
+  const {ampdoc} = AMP;
   ampdoc.whenReady().then(() => {
-    getRootNode(ampdoc).addEventListener(AmpEvents.DOM_UPDATE, ({target}) => {
+    getRootNode(ampdoc).addEventListener(AmpEvents.DOM_UPDATE, e => {
+      const {target} = e;
       scan(ampdoc, dev().assertElement(target));
     });
     scan(ampdoc);
diff --git a/extensions/amp-auto-lightbox/0.1/test/test-amp-auto-lightbox.js b/extensions/amp-auto-lightbox/0.1/test/test-amp-auto-lightbox.js
index 254867d2d54c5..a469500b947cb 100644
--- a/extensions/amp-auto-lightbox/0.1/test/test-amp-auto-lightbox.js
+++ b/extensions/amp-auto-lightbox/0.1/test/test-amp-auto-lightbox.js
@@ -137,14 +137,18 @@ describes.realWin(
           it(`${accepts ? 'accepts' : 'rejects'} ${accepts || rejects}`, () => {
             [
               html`
-                <amp-img src="asada.png"></amp-img>
+                <amp-img src="asada.png" layout="flex-item"></amp-img>
               `,
               html`
-                <div><amp-img src="adobada.png"></amp-img></div>
+                <div>
+                  <amp-img src="adobada.png" layout="flex-item"></amp-img>
+                </div>
               `,
               html`
                 <div>
-                  <div><amp-img src="carnitas.png"></amp-img></div>
+                  <div>
+                    <amp-img src="carnitas.png" layout="flex-item"></amp-img>
+                  </div>
                 </div>
               `,
             ].forEach(unwrapped => {
@@ -446,7 +450,7 @@ describes.realWin(
         mockCandidates([
           mockLoadedSignal(
             html`
-              <amp-img></amp-img>
+              <amp-img layout="flex-item"></amp-img>
             `,
             true
           ),
@@ -466,7 +470,7 @@ describes.realWin(
         mockCandidates([
           mockLoadedSignal(
             html`
-              <amp-img></amp-img>
+              <amp-img layout="flex-item"></amp-img>
             `,
             true
           ),
@@ -483,19 +487,19 @@ describes.realWin(
       it('sets attribute only for candidates that meet criteria', async () => {
         const a = mockLoadedSignal(
           html`
-            <amp-img src="a.png"></amp-img>
+            <amp-img src="a.png" layout="flex-item"></amp-img>
           `,
           true
         );
         const b = mockLoadedSignal(
           html`
-            <amp-img src="b.png"></amp-img>
+            <amp-img src="b.png" layout="flex-item"></amp-img>
           `,
           true
         );
         const c = mockLoadedSignal(
           html`
-            <amp-img src="c.png"></amp-img>
+            <amp-img src="c.png" layout="flex-item"></amp-img>
           `,
           true
         );
@@ -520,7 +524,7 @@ describes.realWin(
           [1, 2, 3].map(() =>
             mockLoadedSignal(
               html`
-                <amp-img src="a.png"></amp-img>
+                <amp-img src="a.png" layout="flex-item"></amp-img>
               `,
               true
             )
@@ -543,14 +547,14 @@ describes.realWin(
       it('filters out candidates that fail to load', async () => {
         const shouldNotLoad = mockLoadedSignal(
           html`
-            <amp-img src="bla.png"></amp-img>
+            <amp-img src="bla.png" layout="flex-item"></amp-img>
           `,
           false
         );
 
         const shouldLoad = mockLoadedSignal(
           html`
-            <amp-img src="bla.png"></amp-img>
+            <amp-img src="bla.png" layout="flex-item"></amp-img>
           `,
           true
         );
@@ -681,6 +685,7 @@ describes.realWin(
 
             const lightboxable = createElementWithAttributes(doc, 'amp-img', {
               [LIGHTBOXABLE_ATTR]: '',
+              layout: 'flex-item',
             });
 
             doc.head.appendChild(extensionScript);
@@ -715,6 +720,7 @@ describes.realWin(
 
             const lightboxable = createElementWithAttributes(doc, 'amp-img', {
               [LIGHTBOXABLE_ATTR]: '',
+              layout: 'flex-item',
             });
 
             doc.head.appendChild(extensionScript);
@@ -730,7 +736,7 @@ describes.realWin(
     describe('apply', () => {
       it('sets attribute', async () => {
         const element = html`
-          <amp-img src="chabuddy.g"></amp-img>
+          <amp-img src="chabuddy.g" layout="flex-item"></amp-img>
         `;
 
         await apply(env.ampdoc, element);
@@ -742,7 +748,7 @@ describes.realWin(
         const candidates = [1, 2, 3].map(
           () =>
             html`
-              <amp-img></amp-img>
+              <amp-img layout="flex-item"></amp-img>
             `
         );
 
@@ -757,7 +763,7 @@ describes.realWin(
 
       it('dispatches event', async () => {
         const element = html`
-          <amp-img src="chabuddy.g"></amp-img>
+          <amp-img src="chabuddy.g" layout="flex-item"></amp-img>
         `;
 
         element.dispatchCustomEvent = env.sandbox.spy();
diff --git a/extensions/amp-autocomplete/0.1/amp-autocomplete.css b/extensions/amp-autocomplete/0.1/amp-autocomplete.css
index 2a52a2241274a..50a30b2e6ff85 100644
--- a/extensions/amp-autocomplete/0.1/amp-autocomplete.css
+++ b/extensions/amp-autocomplete/0.1/amp-autocomplete.css
@@ -16,11 +16,13 @@
 
 /* NOTE: styles that affect sizing are in ampdoc.css to avoid FOUC */
 amp-autocomplete,
-amp-autocomplete > input {
+amp-autocomplete > input,
+amp-autocomplete > textarea {
   font-family: sans-serif; /* default-ui-font-stack */
 }
 
-amp-autocomplete > input {
+amp-autocomplete > input,
+amp-autocomplete > textarea {
   border-radius: 4px; /* default-ui-border-radius */
   box-sizing: border-box;
 }
diff --git a/extensions/amp-autocomplete/0.1/amp-autocomplete.js b/extensions/amp-autocomplete/0.1/amp-autocomplete.js
index b8ed630cb8be0..8453108e89a53 100644
--- a/extensions/amp-autocomplete/0.1/amp-autocomplete.js
+++ b/extensions/amp-autocomplete/0.1/amp-autocomplete.js
@@ -15,22 +15,33 @@
  */
 
 import {ActionTrust} from '../../../src/action-constants';
+import {AutocompleteBindingDef} from './autocomplete-binding-def';
+import {AutocompleteBindingInline} from './autocomplete-binding-inline';
+import {AutocompleteBindingSingle} from './autocomplete-binding-single';
 import {CSS} from '../../../build/amp-autocomplete-0.1.css';
 import {Keys} from '../../../src/utils/key-codes';
 import {Layout} from '../../../src/layout';
 import {Services} from '../../../src/services';
+import {SsrTemplateHelper} from '../../../src/ssr-template-helper';
 import {
   UrlReplacementPolicy,
   batchFetchJsonFor,
+  requestForBatchFetch,
 } from '../../../src/batched-json';
-import {childElementsByTag, removeChildren} from '../../../src/dom';
 import {createCustomEvent} from '../../../src/event-helper';
 import {dev, user, userAssert} from '../../../src/log';
+import {dict, hasOwn, map, ownProperty} from '../../../src/utils/object';
 import {getValueForExpr, tryParseJson} from '../../../src/json';
-import {hasOwn, map, ownProperty} from '../../../src/utils/object';
 import {includes, startsWith} from '../../../src/string';
-import {isEnumValue} from '../../../src/types';
+import {isArray, isEnumValue, toArray} from '../../../src/types';
 import {mod} from '../../../src/utils/math';
+import {once} from '../../../src/utils/function';
+import {removeChildren, tryFocus} from '../../../src/dom';
+import {
+  setupAMPCors,
+  setupInput,
+  setupJsonFetchInit,
+} from '../../../src/utils/xhr-utils';
 import {toggle} from '../../../src/style';
 import fuzzysearch from '../../../third_party/fuzzysearch/index';
 
@@ -54,6 +65,9 @@ export class AmpAutocomplete extends AMP.BaseElement {
   constructor(element) {
     super(element);
 
+    /** @private {AutocompleteBindingDef} */
+    this.binding_ = null;
+
     /**
      * The data extracted from the <script> tag optionally provided
      * as a child. For use with static data.
@@ -62,7 +76,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
     this.sourceData_ = null;
 
     /**
-     * The reference to the <input> tag provided as a child.
+     * The reference to the <input> or <textarea> provided as a child.
      * @private {?HTMLInputElement}
      */
     this.inputElement_ = null;
@@ -92,15 +106,9 @@ export class AmpAutocomplete extends AMP.BaseElement {
     this.maxEntries_ = null;
 
     /**
-     * If the "submit-on-enter" attribute is present on <autocomplete>.
-     */
-    this.submitOnEnter_ = false;
-
-    /**
-     * If the "suggest-first" attribute is present on <autocomplete>
-     * and the filter type is "prefix".
+     * If the "suggest-first" attribute is present on <autocomplete>.
      */
-    this.suggestFirst_ = false;
+    this.shouldSuggestFirst_ = false;
 
     /**
      * Whether or not the "Backspace" key has recently been fired.
@@ -118,6 +126,19 @@ export class AmpAutocomplete extends AMP.BaseElement {
      */
     this.highlightUserEntry_ = false;
 
+    /**
+     * The base value obtained from the "src" attribute on amp-autocomplete.
+     * Used for creating static network endpoints. See generateSrc_.
+     * @private {string}
+     */
+    this.srcBase_ = '';
+
+    /**
+     * The value of the "query" attribute on amp-autocomplete.
+     * @private {string}
+     */
+    this.queryKey_ = '';
+
     /**
      * The index of the active suggested item.
      * @private {number}
@@ -158,10 +179,28 @@ export class AmpAutocomplete extends AMP.BaseElement {
     this.templates_ = Services.templatesFor(this.win);
 
     /**
-     * The reference to the <template> tag provided as a child.
-     * @private {?Element}
+     * Whether a <template> or <script type="text/plain"> tag is present.
+     * @private {boolean}
+     */
+    this.hasTemplate_ = false;
+
+    /**
+     * @const {function():!../../../src/ssr-template-helper.SsrTemplateHelper}
+     */
+    this.getSsrTemplateHelper = once(
+      () =>
+        new SsrTemplateHelper(
+          TAG,
+          Services.viewerForDoc(this.element),
+          this.templates_
+        )
+    );
+
+    /**
+     * Whether server-side rendering is required.
+     * @private {boolean}
      */
-    this.templateElement_ = null;
+    this.isSsr_ = false;
 
     /** @private {?../../../src/service/action-impl.ActionService} */
     this.action_ = null;
@@ -178,6 +217,21 @@ export class AmpAutocomplete extends AMP.BaseElement {
     this.action_ = Services.actionServiceForDoc(this.element);
     this.viewport_ = Services.viewportForDoc(this.element);
 
+    this.inputElement_ = this.getSingleInputOrTextarea_();
+    const inputType = this.inputElement_.getAttribute('type');
+    userAssert(
+      !this.inputElement_.hasAttribute('type') ||
+        inputType === 'text' ||
+        inputType === 'search',
+      '%s requires the "type" attribute to be "text" or "search" if present on <input>. %s',
+      TAG,
+      this.element
+    );
+    this.binding_ = this.createBinding_();
+
+    this.queryKey_ = this.element.getAttribute('query');
+    this.srcBase_ = this.element.getAttribute('src');
+
     const jsonScript = this.element.querySelector(
       'script[type="application/json"]'
     );
@@ -191,58 +245,59 @@ export class AmpAutocomplete extends AMP.BaseElement {
       );
     }
 
-    const inputElements = childElementsByTag(this.element, 'INPUT');
-    userAssert(
-      inputElements.length === 1,
-      `${TAG} should contain exactly one <input> child`
-    );
-    this.inputElement_ = /** @type {!HTMLInputElement} */ (inputElements[0]);
-    if (this.inputElement_.hasAttribute('type')) {
-      const inputType = this.inputElement_.getAttribute('type');
-      userAssert(
-        inputType === 'text' || inputType === 'search',
-        `${TAG} requires the "type" attribute to be "text" or "search" if present on <input>`
-      );
-    }
     this.inputElement_.setAttribute('dir', 'auto');
     this.inputElement_.setAttribute('aria-autocomplete', 'both');
     this.inputElement_.setAttribute('role', 'combobox');
 
-    userAssert(this.inputElement_.form, `${TAG} should be inside a <form> tag`);
+    userAssert(
+      this.inputElement_.form,
+      '%s should be inside a <form> tag. %s',
+      TAG,
+      this.element
+    );
     if (this.inputElement_.form.hasAttribute('autocomplete')) {
       this.initialAutocompleteAttr_ = this.inputElement_.form.getAttribute(
         'autocomplete'
       );
     }
 
-    if (
-      this.templates_.hasTemplate(this.element, 'template, script[template]')
-    ) {
-      this.templateElement_ = this.templates_.findTemplate(
-        this.element,
-        'template, script[template]'
+    // When SSR is supported, it is required.
+    this.isSsr_ = this.getSsrTemplateHelper().isEnabled();
+    this.hasTemplate_ = this.templates_.hasTemplate(
+      this.element,
+      'template, script[template]'
+    );
+    if (this.isSsr_) {
+      userAssert(
+        this.srcBase_,
+        '%s requires data to be provided via "src" attribute for server-side rendering. %s',
+        TAG,
+        this.element
+      );
+      userAssert(
+        this.hasTemplate_,
+        `${TAG} should provide a <template> or <script type="plain/text"> element.`
+      );
+      userAssert(
+        !this.element.hasAttribute('filter'),
+        `${TAG} does not support client-side filter when server-side render is required.`
+      );
+      this.filter_ = FilterType.NONE;
+    } else {
+      this.filter_ = userAssert(
+        this.element.getAttribute('filter'),
+        '%s requires "filter" attribute. %s',
+        TAG,
+        this.element
+      );
+      userAssert(
+        isEnumValue(FilterType, this.filter_),
+        'Unexpected filter: %s. %s',
+        this.filter_,
+        this.element
       );
-      // Dummy render to verify existence of "data-value" attribute.
-      this.templates_
-        .renderTemplate(this.templateElement_, /** @type {!JsonObject} */ ({}))
-        .then(renderedEl => {
-          userAssert(
-            renderedEl.hasAttribute('data-value') ||
-              renderedEl.hasAttribute('data-disabled'),
-            `${TAG} requires a "data-value" or "data-disabled" attribute.`
-          );
-        });
     }
 
-    this.filter_ = userAssert(
-      this.element.getAttribute('filter'),
-      `${TAG} requires "filter" attribute.`
-    );
-    userAssert(
-      isEnumValue(FilterType, this.filter_),
-      `Unexpected filter: ${this.filter_}`
-    );
-
     // Read configuration attributes
     this.minChars_ = this.element.hasAttribute('min-characters')
       ? parseInt(this.element.getAttribute('min-characters'), 10)
@@ -250,22 +305,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
     this.maxEntries_ = this.element.hasAttribute('max-entries')
       ? parseInt(this.element.getAttribute('max-entries'), 10)
       : null;
-    this.submitOnEnter_ = this.element.hasAttribute('submit-on-enter');
-    if (this.element.hasAttribute('suggest-first')) {
-      if (this.filter_ === FilterType.PREFIX) {
-        this.suggestFirst_ = true;
-      } else {
-        user().error(
-          TAG,
-          '"suggest-first" requires "filter" to be prefix.' +
-            ' Unexpected "filter" type: ' +
-            this.filter_
-        );
-      }
-    }
-    this.suggestFirst_ =
-      this.element.hasAttribute('suggest-first') &&
-      this.filter_ === FilterType.PREFIX;
+    this.shouldSuggestFirst_ = this.binding_.shouldSuggestFirst();
     this.highlightUserEntry_ = this.element.hasAttribute(
       'highlight-user-entry'
     );
@@ -274,6 +314,34 @@ export class AmpAutocomplete extends AMP.BaseElement {
     this.element.setAttribute('aria-haspopup', 'listbox');
     this.container_ = this.createContainer_();
     this.element.appendChild(this.container_);
+
+    return Promise.resolve();
+  }
+
+  /**
+   * amp-autocomplete expects exactly one nested input or textarea.
+   * @return {!HTMLInputElement}
+   */
+  getSingleInputOrTextarea_() {
+    const possibleElements = this.element.querySelectorAll('input,textarea');
+    userAssert(
+      possibleElements.length == 1,
+      '%s should contain exactly one <input> or <textarea> descendant %s',
+      TAG,
+      this.element
+    );
+    return /** @type {!HTMLInputElement} */ (possibleElements[0]);
+  }
+
+  /**
+   * Creates a binding associated with singular autocomplete or
+   * inline autocomplete depending on the presence of the given element's "inline" attribute.
+   * @return {AutocompleteBindingDef}
+   */
+  createBinding_() {
+    return this.element.hasAttribute('inline')
+      ? new AutocompleteBindingInline(this)
+      : new AutocompleteBindingSingle(this);
   }
 
   /**
@@ -310,17 +378,70 @@ export class AmpAutocomplete extends AMP.BaseElement {
     const ampdoc = this.getAmpDoc();
     const policy = UrlReplacementPolicy.ALL;
     const itemsExpr = this.element.getAttribute('items') || 'items';
-    return batchFetchJsonFor(ampdoc, this.element, {
-      expr: itemsExpr,
-      urlReplacement: policy,
-    }).catch(() => {
-      user().warn(
-        TAG,
-        'Expected key "%s" in data but found nothing. Rendering empty results.',
-        itemsExpr
-      );
-      return [];
-    });
+    this.maybeSetSrcFromInput_();
+    if (this.isSsr_) {
+      return requestForBatchFetch(
+        this.element,
+        policy,
+        /* refresh */ false
+      ).then(request => {
+        request.xhrUrl = setupInput(this.win, request.xhrUrl, request.fetchOpt);
+        request.fetchOpt = setupAMPCors(
+          this.win,
+          request.xhrUrl,
+          request.fetchOpt
+        );
+        setupJsonFetchInit(request.fetchOpt);
+
+        const attributes = dict({
+          'ampAutocompleteAttributes': {
+            'items': itemsExpr,
+          },
+        });
+        return this.getSsrTemplateHelper().ssr(
+          this.element,
+          request,
+          /* opt_templates */ null,
+          attributes
+        );
+      });
+    } else {
+      return batchFetchJsonFor(ampdoc, this.element, {
+        expr: itemsExpr,
+        urlReplacement: policy,
+      }).catch(() => {
+        user().warn(
+          TAG,
+          'Expected key "%s" in data but found nothing. Rendering empty results.',
+          itemsExpr
+        );
+        return [];
+      });
+    }
+  }
+
+  /**
+   * Update value of "src" attribute if the "query" attribute is provided.
+   */
+  maybeSetSrcFromInput_() {
+    if (!this.queryKey_) {
+      return;
+    }
+    const src = this.generateSrc_(this.userInput_);
+    this.element.setAttribute('src', src);
+  }
+
+  /**
+   * Takes the given input and returns the constructed server endpoint for it.
+   * For use when publishers provide "src" and "query" attributes.
+   * @param {string} opt_query
+   * @return {string}
+   * @private
+   */
+  generateSrc_(opt_query = '') {
+    const encodedQueryKey = encodeURIComponent(this.queryKey_);
+    const encodedQuery = encodeURIComponent(opt_query);
+    return `${this.srcBase_}?${encodedQueryKey}=${encodedQuery}`;
   }
 
   /**
@@ -361,7 +482,8 @@ export class AmpAutocomplete extends AMP.BaseElement {
     });
     this.inputElement_.addEventListener('focus', () => {
       this.checkFirstInteractionAndMaybeFetchData_().then(() => {
-        this.toggleResultsHandler_(true);
+        const display = this.binding_.shouldShowOnFocus();
+        this.toggleResultsHandler_(display);
       });
     });
     this.inputElement_.addEventListener('blur', () => {
@@ -371,7 +493,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
       this.selectHandler_(e);
     });
 
-    return this.filterDataAndRenderResults_(this.sourceData_, this.userInput_);
+    return this.autocomplete_(this.sourceData_, this.userInput_);
   }
 
   /** @override */
@@ -384,7 +506,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
       return this.getRemoteData_().then(
         remoteData => {
           this.sourceData_ = remoteData || [];
-          this.filterDataAndRenderResults_(this.sourceData_, this.userInput_);
+          this.autocomplete_(this.sourceData_, this.userInput_);
         },
         e => {
           this.displayFallback_(e);
@@ -393,10 +515,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
     }
     if (typeof src === 'object') {
       this.sourceData_ = src['items'] || [];
-      return this.filterDataAndRenderResults_(
-        this.sourceData_,
-        this.userInput_
-      );
+      return this.autocomplete_(this.sourceData_, this.userInput_);
     }
     user().error(TAG, 'Unexpected "src" type: ' + src);
   }
@@ -441,28 +560,68 @@ export class AmpAutocomplete extends AMP.BaseElement {
   }
 
   /**
-   * Handle rendering results on user input.
+   * Displays autocomplete suggestions on user input if appropriate.
    * @return {!Promise}
    * @private
    */
   inputHandler_() {
+    if (
+      this.binding_.shouldAutocomplete(dev().assertElement(this.inputElement_))
+    ) {
+      return this.maybeFetchAndAutocomplete_();
+    }
+
+    return this.mutateElement(() => {
+      this.clearAllItems_();
+    });
+  }
+
+  /**
+   * First fetches if data is dynamic, then updates user input and
+   * displays autocomplete suggestions against it.
+   * @return {!Promise}
+   */
+  maybeFetchAndAutocomplete_() {
     // If the input is the first entry in the field.
-    const firstEntry =
+    const isFirstInteraction =
       this.userInput_.length === 0 && this.inputElement_.value.length === 1;
-    this.userInput_ = this.inputElement_.value;
-    return this.mutateElement(() => {
-      this.filterDataAndRenderResults_(this.sourceData_, this.userInput_);
-      this.toggleResults_(true);
-      if (this.suggestFirst_) {
-        if (!this.detectBackspace_ || firstEntry) {
-          this.updateActiveItem_(1);
-        }
-        // Reset flag.
-        this.detectBackspace_ = false;
-      }
+    this.userInput_ = this.binding_.getUserInputForUpdate(
+      dev().assertElement(this.inputElement_)
+    );
+
+    // Fetch if autocomplete data is dynamic.
+    // Required when server-side rendering or otherwise relies on a query key.
+    const maybeFetch =
+      this.isSsr_ || this.queryKey_
+        ? this.getRemoteData_()
+        : Promise.resolve(this.sourceData_);
+    return maybeFetch.then(data => {
+      this.sourceData_ = data;
+      return this.mutateElement(() => {
+        this.autocomplete_(this.sourceData_, this.userInput_).then(() => {
+          this.displaySuggestions_(isFirstInteraction);
+        });
+      });
     });
   }
 
+  /**
+   * Toggle the container of suggestions to show.
+   * If the publisher has opted to autosuggest the first option, do this as well.
+   * @param {boolean} isFirstInteraction
+   */
+  displaySuggestions_(isFirstInteraction) {
+    this.toggleResults_(true);
+
+    // Detecting backspace enables "suggest-first" to respect user deletion.
+    if (this.shouldSuggestFirst_) {
+      if (!this.detectBackspace_ || isFirstInteraction) {
+        this.updateActiveItem_(1);
+      }
+      this.detectBackspace_ = false;
+    }
+  }
+
   /**
    * Handle selecting items on user mousedown.
    * @param {!Event} event
@@ -477,27 +636,47 @@ export class AmpAutocomplete extends AMP.BaseElement {
   }
 
   /**
-   * Filter the source data according to the given opt_input and render it in
-   * the results container_.
-   * @param {?Array<!JsonObject|string>} sourceData
-   * @param {string=} opt_input
+   * Display autocomplete suggestions and render it in the results container_.
+   * When client side rendering, filter the source data according to the given opt_input.
+   * @param {?Array<!JsonObject|string>} data
+   * @param {string} opt_input
    * @return {!Promise}
    * @private
    */
-  filterDataAndRenderResults_(sourceData, opt_input = '') {
+  autocomplete_(data, opt_input = '') {
     this.clearAllItems_();
-    if (
-      opt_input.length < this.minChars_ ||
-      !sourceData ||
-      !sourceData.length
-    ) {
+    if (opt_input.length < this.minChars_ || !data) {
+      return Promise.resolve();
+    } else if (this.isSsr_) {
+      return hasOwn(data, 'html')
+        ? this.renderResults_(
+            data,
+            dev().assertElement(this.container_),
+            opt_input
+          )
+        : Promise.resolve();
+    } else {
+      return this.filterDataAndRenderResults_(data, opt_input);
+    }
+  }
+
+  /**
+   * Client-side filter the source data according to the given opt_input
+   * and render it in the results container_.
+   * @param {?Array<!JsonObject|string>} sourceData
+   * @param {string} input
+   * @return {!Promise}
+   * @private
+   */
+  filterDataAndRenderResults_(sourceData, input) {
+    if (!sourceData.length) {
       return Promise.resolve();
     }
-    const filteredData = this.filterData_(sourceData, opt_input);
+    const filteredData = this.filterData_(sourceData, input);
     return this.renderResults_(
       filteredData,
       dev().assertElement(this.container_),
-      opt_input
+      input
     );
   }
 
@@ -512,13 +691,22 @@ export class AmpAutocomplete extends AMP.BaseElement {
   renderResults_(filteredData, container, input) {
     let renderPromise = Promise.resolve();
     this.resetActiveElement_();
-    if (this.templateElement_) {
-      renderPromise = this.templates_
-        .renderTemplateArray(this.templateElement_, filteredData)
-        .then(renderedChildren => {
-          renderedChildren.map(child => {
+    if (this.hasTemplate_) {
+      renderPromise = this.getSsrTemplateHelper()
+        .applySsrOrCsrTemplate(this.element, filteredData)
+        .then(rendered => {
+          const elements = isArray(rendered)
+            ? rendered
+            : toArray(rendered.children);
+          elements.forEach(child => {
             if (child.hasAttribute('data-disabled')) {
               child.setAttribute('aria-disabled', 'true');
+            } else if (!child.hasAttribute('data-value')) {
+              user().warn(
+                TAG,
+                'Expected a "data-value" or "data-disabled" attribute on the rendered template item. %s',
+                child
+              );
             }
             child.classList.add('i-amphtml-autocomplete-item');
             child.setAttribute('role', 'option');
@@ -529,7 +717,9 @@ export class AmpAutocomplete extends AMP.BaseElement {
       filteredData.forEach(item => {
         userAssert(
           typeof item === 'string',
-          `${TAG} data must provide template for non-string items.`
+          '%s data must provide template for non-string items. %s',
+          TAG,
+          this.element
         );
         container.appendChild(
           this.createElementFromItem_(/** @type {string} */ (item), input)
@@ -561,7 +751,10 @@ export class AmpAutocomplete extends AMP.BaseElement {
       }
       userAssert(
         typeof item === 'string',
-        `${TAG} data property "${itemsExpr}" must map to string type.`
+        '%s data property "%s" must map to string type. %s',
+        TAG,
+        itemsExpr,
+        this.element
       );
       item = item.toLocaleLowerCase();
       switch (this.filter_) {
@@ -574,9 +767,13 @@ export class AmpAutocomplete extends AMP.BaseElement {
         case FilterType.FUZZY:
           return fuzzysearch(input, item);
         case FilterType.CUSTOM:
-          throw new Error(`Filter not yet supported: ${this.filter_}`);
+          throw new Error(
+            'Filter not yet supported: %s',
+            this.filter_,
+            this.element
+          );
         default:
-          throw new Error(`Unexpected filter: ${this.filter_}`);
+          throw new Error('Unexpected filter: %s', this.filter_, this.element);
       }
     });
 
@@ -727,7 +924,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
       () => {
         if (!display) {
           this.userInput_ = this.inputElement_.value;
-          this.filterDataAndRenderResults_(this.sourceData_, this.userInput_);
+          this.autocomplete_(this.sourceData_, this.userInput_);
           this.resetActiveElement_();
         }
         this.setResultDisplayDirection_(renderAbove);
@@ -749,7 +946,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
     return this.getRemoteData_().then(
       remoteData => {
         this.sourceData_ = remoteData;
-        this.filterDataAndRenderResults_(this.sourceData_);
+        this.autocomplete_(this.sourceData_);
       },
       e => {
         this.displayFallback_(e);
@@ -788,7 +985,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
    * @return {boolean}
    * @private
    */
-  resultsShowing_() {
+  areResultsDisplayed_() {
     return (
       !this.container_.hasAttribute('hidden') &&
       this.container_.children.length > 0
@@ -820,11 +1017,19 @@ export class AmpAutocomplete extends AMP.BaseElement {
     if (element === null || element.hasAttribute('data-disabled')) {
       return;
     }
-    this.inputElement_.value = this.userInput_ = element.getAttribute(
-      'data-value'
-    );
-    this.fireSelectEvent_(this.userInput_);
+    const selectedValue =
+      element.getAttribute('data-value') || element.textContent;
+
+    this.fireSelectEvent_(selectedValue);
     this.clearAllItems_();
+    this.toggleResults_(false);
+
+    this.inputElement_.value = this.binding_.getUserInputForUpdateWithSelection(
+      selectedValue,
+      this.inputElement_,
+      this.userInput_
+    );
+    this.userInput_ = this.binding_.getUserInputForUpdate(this.inputElement_);
   }
 
   /**
@@ -850,7 +1055,11 @@ export class AmpAutocomplete extends AMP.BaseElement {
    * @private
    */
   updateActiveItem_(delta) {
-    if (delta === 0 || !this.resultsShowing_() || this.fallbackDisplayed_) {
+    if (
+      delta === 0 ||
+      !this.areResultsDisplayed_() ||
+      this.fallbackDisplayed_
+    ) {
       return Promise.resolve();
     }
     // Active element logic
@@ -862,15 +1071,13 @@ export class AmpAutocomplete extends AMP.BaseElement {
     }
     const activeIndex = mod(index, enabledElements.length);
     const newActiveElement = enabledElements[activeIndex];
-    this.inputElement_.value = newActiveElement.getAttribute('data-value');
+    const newValue = newActiveElement.getAttribute('data-value');
 
-    // Highlight if suggest-first is present.
-    if (this.suggestFirst_) {
-      this.inputElement_.setSelectionRange(
-        this.userInput_.length,
-        this.inputElement_.value.length
-      );
-    }
+    this.binding_.displayActiveItemInInput(
+      dev().assertElement(this.inputElement_),
+      newValue,
+      this.userInput_
+    );
 
     // Element visibility logic
     let shouldScroll, newTop;
@@ -906,6 +1113,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
         this.inputElement_.setAttribute('aria-activedescendant', elementId);
         this.activeIndex_ = activeIndex;
         this.activeElement_ = newActiveElement;
+        tryFocus(dev().assertElement(this.activeElement_));
       }
     );
   }
@@ -926,7 +1134,10 @@ export class AmpAutocomplete extends AMP.BaseElement {
    * @private
    */
   displayUserInput_() {
-    this.inputElement_.value = this.userInput_;
+    this.binding_.resetInputOnWrapAround(
+      this.userInput_,
+      dev().assertElement(this.inputElement_)
+    );
     this.resetActiveElement_();
   }
 
@@ -971,7 +1182,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
     switch (event.key) {
       case Keys.DOWN_ARROW:
         event.preventDefault();
-        if (this.resultsShowing_()) {
+        if (this.areResultsDisplayed_()) {
           // Disrupt loop around to display user input.
           if (this.activeIndex_ === this.getEnabledItems_().length - 1) {
             this.displayUserInput_();
@@ -980,7 +1191,7 @@ export class AmpAutocomplete extends AMP.BaseElement {
           return this.updateActiveItem_(1);
         }
         return this.mutateElement(() => {
-          this.filterDataAndRenderResults_(this.sourceData_, this.userInput_);
+          this.autocomplete_(this.sourceData_, this.userInput_);
           this.toggleResults_(true);
         });
       case Keys.UP_ARROW:
@@ -992,39 +1203,38 @@ export class AmpAutocomplete extends AMP.BaseElement {
         }
         return this.updateActiveItem_(-1);
       case Keys.ENTER:
-        if (this.resultsShowing_() && !this.submitOnEnter_) {
+        const shouldPreventSubmit = this.binding_.shouldPreventFormSubmissionOnEnter(
+          !!this.activeElement_
+        );
+        if (this.areResultsDisplayed_() && shouldPreventSubmit) {
           event.preventDefault();
         }
-        if (this.suggestFirst_) {
-          const inputLength = this.inputElement_.value.length;
-          this.inputElement_.setSelectionRange(inputLength, inputLength);
-        }
+        this.binding_.removeSelectionHighlighting(this.inputElement_);
         return this.mutateElement(() => {
-          if (this.activeElement_) {
+          if (this.areResultsDisplayed_() && !!this.activeElement_) {
             this.selectItem_(this.activeElement_);
             this.resetActiveElement_();
-          } else {
-            this.toggleResults_(false);
+            return Promise.resolve();
           }
+          this.toggleResults_(false);
         });
       case Keys.ESCAPE:
         // Select user's partial input and hide results.
         return this.mutateElement(() => {
           if (!this.fallbackDisplayed_) {
+            event.preventDefault();
             this.displayUserInput_();
             this.toggleResults_(false);
           }
         });
       case Keys.TAB:
-        if (this.activeElement_) {
-          this.userInput_ = this.inputElement_.value;
-          this.fireSelectEvent_(this.userInput_);
+        if (this.areResultsDisplayed_() && this.activeElement_) {
+          event.preventDefault();
+          this.selectItem_(this.activeElement_);
         }
         return Promise.resolve();
       case Keys.BACKSPACE:
-        if (this.suggestFirst_) {
-          this.detectBackspace_ = true;
-        }
+        this.detectBackspace_ = this.shouldSuggestFirst_;
         return Promise.resolve();
       default:
         return Promise.resolve();
diff --git a/extensions/amp-autocomplete/0.1/autocomplete-binding-def.js b/extensions/amp-autocomplete/0.1/autocomplete-binding-def.js
new file mode 100644
index 0000000000000..d92c4a86d53f3
--- /dev/null
+++ b/extensions/amp-autocomplete/0.1/autocomplete-binding-def.js
@@ -0,0 +1,91 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * AutocompleteBindingDef is an interface that provides the specific
+ * implementation of amp-autocomplete user input interaction behavior.
+ * @interface
+ */
+export class AutocompleteBindingDef {
+  /**
+   * Whether the binding should attempt to display
+   * autocomplete suggestions on user input.
+   * @param {!HTMLInputElement} unusedInputEl
+   * @return {boolean}
+   */
+  shouldAutocomplete(unusedInputEl) {}
+
+  /**
+   * The value to use as the partial user input when generating autocomplete suggestions
+   * @param {!HTMLInputElement} unusedInputEl
+   * @return {string}
+   */
+  getUserInputForUpdate(unusedInputEl) {}
+
+  /**
+   * The value to show in the user input element after a suggestion has been selected
+   * @param {string} unusedSelection
+   * @param {!HTMLInputElement} unusedInputEl
+   * @param {string} unusedInput
+   * @return {string}
+   */
+  getUserInputForUpdateWithSelection(
+    unusedSelection,
+    unusedInputEl,
+    unusedInput
+  ) {}
+
+  /**
+   * Restore the input element to display the user's non-autocompleted partial string
+   * @param {string} unusedUserInput
+   * @param {!HTMLInputElement} unusedInputEl
+   */
+  resetInputOnWrapAround(unusedUserInput, unusedInputEl) {}
+
+  /**
+   * Whether or not the autocomplete can abide by the "suggest-first" attribute
+   * @return {boolean}
+   */
+  shouldSuggestFirst() {}
+
+  /**
+   * Whether or not the autocomplete should show suggestions when the input element has been focused
+   * @return {boolean}
+   */
+  shouldShowOnFocus() {}
+
+  /**
+   * Updates the input element text with the user highlighted active suggestion (before selection)
+   *
+   * @param {!HTMLInputElement} unusedInputEl
+   * @param {string} unusedNewValue
+   * @param {string} unusedUserInput
+   */
+  displayActiveItemInInput(unusedInputEl, unusedNewValue, unusedUserInput) {}
+
+  /**
+   * Resets any highlighting done by the SelectionAPI
+   * @param {HTMLInputElement} unusedInputEl
+   */
+  removeSelectionHighlighting(unusedInputEl) {}
+
+  /**
+   * Whether the autocomplete should escape the 'Enter' keydown event
+   * @param {boolean} unusedActiveElement
+   * @return {boolean}
+   */
+  shouldPreventFormSubmissionOnEnter(unusedActiveElement) {}
+}
diff --git a/extensions/amp-autocomplete/0.1/autocomplete-binding-inline.js b/extensions/amp-autocomplete/0.1/autocomplete-binding-inline.js
new file mode 100644
index 0000000000000..b02d0f63137a5
--- /dev/null
+++ b/extensions/amp-autocomplete/0.1/autocomplete-binding-inline.js
@@ -0,0 +1,196 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {ownProperty} from '../../../src/utils/object';
+import {tryFocus} from '../../../src/dom';
+import {userAssert} from '../../../src/log';
+
+const TAG = 'amp-autocomplete';
+
+/**
+ * Inline implementation of autocomplete. This supports autocompleting
+ * multiple input values as part of a larger freeform input element.
+ * @implements {./autocomplete-binding-def.AutocompleteBindingDef}
+ * @package
+ */
+export class AutocompleteBindingInline {
+  /**
+   * Stores the regex match value associated with the portion of the user input to suggest against.
+   * For use when "inline_" is true.
+   * @param {!AMP.BaseElement} ampElement
+   */
+  constructor(ampElement) {
+    const {element} = ampElement;
+    /** @private {!Element} */
+    this.element_ = element;
+
+    /** @private {string} */
+    this.trigger_ = this.element_.getAttribute('inline');
+    userAssert(
+      this.trigger_ !== '',
+      'Empty value for the "inline" attr is unsupported, %s. %s',
+      TAG,
+      element
+    );
+    userAssert(
+      this.trigger_ !== '',
+      `AutocompleteBindingInline does not support an empty value in the constructor.`
+    );
+
+    /** @private {?RegExpResult} */
+    this.match_ = null;
+
+    const delimiter = this.trigger_.replace(/([()[{*+.$^\\|?])/g, '\\$1');
+    const pattern = `((${delimiter}|^${delimiter})(\\w+)?)`;
+    this.regex_ = new RegExp(pattern, 'gm');
+  }
+
+  /**
+   * Returns true if a match on the publisher-provided trigger is found in the input element value.
+   * Otherwise, should not display any suggestions.
+   * @param {!HTMLInputElement} inputEl
+   * @return {boolean}
+   */
+  shouldAutocomplete(inputEl) {
+    const match = this.getClosestPriorMatch_(this.regex_, inputEl);
+    this.match_ = match;
+    return !!match;
+  }
+
+  /**
+   * Finds the closest string in the user input prior to the cursor
+   * to display suggestions.
+   * @param {RegExp} regex
+   * @param {!HTMLInputElement} inputEl
+   * @return {?RegExpResult}
+   * @private
+   */
+  getClosestPriorMatch_(regex, inputEl) {
+    if (!regex) {
+      return null;
+    }
+
+    const {value, selectionStart: cursor} = inputEl;
+    let match, lastMatch;
+
+    while ((match = regex.exec(value)) !== null) {
+      if (match[0].length + ownProperty(match, 'index') > cursor) {
+        break;
+      }
+      lastMatch = match;
+    }
+
+    if (
+      !lastMatch ||
+      lastMatch[0].length + ownProperty(lastMatch, 'index') < cursor
+    ) {
+      return null;
+    }
+    return lastMatch;
+  }
+
+  /**
+   * Display suggestions based on the partial string following the trigger
+   * in the input element value.
+   * @param {!HTMLInputElement} unusedInputEl
+   * @return {string}
+   */
+  getUserInputForUpdate(unusedInputEl) {
+    if (!this.match_ || !this.match_[0]) {
+      return '';
+    }
+    return this.match_[0].slice(this.trigger_.length);
+  }
+
+  /**
+   * Replace the user input matched in the input element value with the
+   * selected item value from the autocomplete suggestions.
+   * @param {string} selection
+   * @param {!HTMLInputElement} inputEl
+   * @param {string} userInput
+   * @return {string}
+   */
+  getUserInputForUpdateWithSelection(selection, inputEl, userInput) {
+    if (!this.match_) {
+      return inputEl.value;
+    }
+    let cursor = inputEl.selectionStart;
+    const startIndex = Number(ownProperty(this.match_, 'index'));
+    const userInputLength = userInput.length;
+    if (cursor >= startIndex + userInputLength) {
+      cursor = cursor - userInputLength;
+    }
+
+    tryFocus(inputEl);
+    cursor = cursor + selection.length + 1;
+    inputEl.setSelectionRange(cursor, cursor);
+    this.match_ = null;
+
+    const {value} = inputEl;
+
+    const pre = value.slice(0, startIndex + this.trigger_.length);
+    const post = value.slice(
+      startIndex + this.trigger_.length + userInputLength
+    );
+    return pre + selection + ' ' + post;
+  }
+
+  /**
+   * @param {string} unusedUserInput
+   * @param {!HTMLInputElement} unusedInputEl
+   */
+  resetInputOnWrapAround(unusedUserInput, unusedInputEl) {}
+
+  /**
+   * Always accept the "suggest-first" attribute regardless of filter type.
+   * This is because this binding does not perform any highlighting via the
+   * SelectionAPI when a user navigates to an unselected suggestion item.
+   * @return {boolean}
+   */
+  shouldSuggestFirst() {
+    return this.element_.hasAttribute('suggest-first');
+  }
+
+  /**
+   * Never show suggestions on focus because focus occurs every selection.
+   * @return {boolean}
+   */
+  shouldShowOnFocus() {
+    return false;
+  }
+
+  /**
+   * @param {!HTMLInputElement} unusedInputEl
+   * @param {string} unusedNewValue
+   * @param {string} unusedUserInput
+   */
+  displayActiveItemInInput(unusedInputEl, unusedNewValue, unusedUserInput) {}
+
+  /**
+   * @param {HTMLInputElement} unusedInputEl
+   */
+  removeSelectionHighlighting(unusedInputEl) {}
+
+  /**
+   * If results are not showing or there is no actively navigated-to suggestion item,
+   * the user should be able to 'Enter' to add a new line.
+   * @param {boolean} activeElement
+   * @return {boolean}
+   */
+  shouldPreventFormSubmissionOnEnter(activeElement) {
+    return activeElement;
+  }
+}
diff --git a/extensions/amp-autocomplete/0.1/autocomplete-binding-single.js b/extensions/amp-autocomplete/0.1/autocomplete-binding-single.js
new file mode 100644
index 0000000000000..7e4a8d71fc95d
--- /dev/null
+++ b/extensions/amp-autocomplete/0.1/autocomplete-binding-single.js
@@ -0,0 +1,147 @@
+import {userAssert} from '../../../src/log';
+
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Single implementation of autocomplete. This supports autocompleting
+ * a single input value in its entirety.
+ * @implements {./autocomplete-binding-def.AutocompleteBindingDef}
+ * @package
+ */
+export class AutocompleteBindingSingle {
+  /**
+   * @param {!AMP.BaseElement} ampElement
+   */
+  constructor(ampElement) {
+    const {element} = ampElement;
+    /** @private {!Element} */
+    this.element_ = element;
+
+    /**
+     * The Single implementation of autocomplete should highlight
+     * the diff between the user input and the active suggestion
+     * when the attribute "suggest-first" is present.
+     * See displayActiveItemInInput() for more.
+     * @private {boolean}
+     */
+    this.shouldSuggestFirst_ = element.hasAttribute('suggest-first');
+    const filter = element.getAttribute('filter');
+    userAssert(
+      !this.shouldSuggestFirst_ || filter === 'prefix',
+      '"suggest-first" requires "filter" type "prefix". ' +
+        ' Unexpected "filter" type: %s, %s',
+      filter,
+      this.element_
+    );
+
+    /**
+     * The Single implementation of autocomplete will allow form
+     * submission with selection when "submit-on-enter" is present.
+     * @private {boolean}
+     */
+    this.submitOnEnter_ = element.hasAttribute('submit-on-enter');
+  }
+
+  /**
+   * Always try to autocomplete.
+   * @param {!HTMLInputElement} unusedInputEl
+   * @return {boolean}
+   */
+  shouldAutocomplete(unusedInputEl) {
+    return true;
+  }
+
+  /**
+   * The user input for generating suggestions is the full entry in the input element so far.
+   * @param {?HTMLInputElement} inputEl
+   * @return {string}
+   */
+  getUserInputForUpdate(inputEl) {
+    return inputEl.value || '';
+  }
+
+  /**
+   * Returns the full selection.
+   * @param {string} selection
+   * @param {!HTMLInputElement} unusedInputEl
+   * @param {string} unusedInput
+   * @return {string}
+   */
+  getUserInputForUpdateWithSelection(selection, unusedInputEl, unusedInput) {
+    return selection;
+  }
+
+  /**
+   * Input element value should be reset to the partially recorded user input.
+   * @param {string} userInput
+   * @param {!HTMLInputElement} inputEl
+   */
+  resetInputOnWrapAround(userInput, inputEl) {
+    inputEl.value = userInput;
+  }
+
+  /** @return {boolean} */
+  shouldSuggestFirst() {
+    return this.shouldSuggestFirst_;
+  }
+
+  /**
+   * Always display suggestions if there are any on focus.
+   * @return {boolean}
+   */
+  shouldShowOnFocus() {
+    return true;
+  }
+
+  /**
+   * Replace the input element value with the navigated-to suggestion item and
+   * highlight the difference between the possible selection and the user input.
+   *
+   * e.g. User input "ba" + navigation to "banana" will display "ba|nana|",
+   * where |nana| is highlighted in the input field via the SelectionAPI.
+   * @param {!HTMLInputElement} inputEl
+   * @param {string} newValue
+   * @param {string} userInput
+   */
+  displayActiveItemInInput(inputEl, newValue, userInput) {
+    inputEl.value = newValue;
+
+    // Should highlight when "suggest-first" is present.
+    if (this.shouldSuggestFirst_) {
+      inputEl.setSelectionRange(userInput.length, newValue.length);
+    }
+  }
+
+  /**
+   * Remove any highlighting via the SelectionAPI.
+   * @param {HTMLInputElement} inputEl
+   */
+  removeSelectionHighlighting(inputEl) {
+    const inputLength = inputEl.value.length;
+    inputEl.setSelectionRange(inputLength, inputLength);
+  }
+
+  /**
+   * If results are showing or the publisher provided "submit-on-enter",
+   * the user should only be able to 'Enter' to select a suggestion.
+   * @param {boolean} unusedActiveElement
+   * @return {boolean}
+   */
+  shouldPreventFormSubmissionOnEnter(unusedActiveElement) {
+    return !this.submitOnEnter_;
+  }
+}
diff --git a/extensions/amp-autocomplete/0.1/test-e2e/test-amp-autocomplete-inline.js b/extensions/amp-autocomplete/0.1/test-e2e/test-amp-autocomplete-inline.js
new file mode 100644
index 0000000000000..f8b888e37db62
--- /dev/null
+++ b/extensions/amp-autocomplete/0.1/test-e2e/test-amp-autocomplete-inline.js
@@ -0,0 +1,149 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describes.endtoend(
+  'amp-autocomplete',
+  {
+    testUrl:
+      'http://localhost:8000/test/manual/amp-autocomplete/amp-autocomplete-inline.amp.html',
+    // TODO: Restore 'environments' to default after supporting fourth test in
+    // shadow environment.
+    environments: ['single', 'viewer-demo'],
+    initialRect: {width: 800, height: 800},
+  },
+  env => {
+    let controller;
+
+    beforeEach(() => {
+      controller = env.controller;
+    });
+
+    it('<amp-autocomplete inline> should render', async () => {
+      const autocomplete = await controller.findElement('#autocomplete');
+      await expect(
+        controller.getElementProperty(autocomplete, 'children')
+      ).to.have.length(3);
+
+      const input = await controller.findElement('#input');
+      await expect(controller.getElementAttribute(input, 'type')).to.equal(
+        'text'
+      );
+
+      const script = await controller.findElement('#script');
+      await expect(controller.getElementAttribute(script, 'type')).to.equal(
+        'application/json'
+      );
+
+      const renderedResults = await controller.findElement(
+        '.i-amphtml-autocomplete-results'
+      );
+      await expect(
+        controller.getElementProperty(renderedResults, 'children')
+      ).to.have.length(3);
+      await expect(controller.getElementAttribute(renderedResults, 'hidden'))
+        .not.to.be.null;
+    });
+
+    it('<amp-autocomplete inline> should display results on trigger', async () => {
+      const renderedResults = await controller.findElement(
+        '.i-amphtml-autocomplete-results'
+      );
+      await expect(
+        controller.getElementProperty(renderedResults, 'children')
+      ).to.have.length(3);
+
+      // Does not display suggested items on blur.
+      await expect(controller.getElementAttribute(renderedResults, 'hidden'))
+        .not.to.be.null;
+      const focusButton = await controller.findElement('#focusButton');
+      await controller.click(focusButton);
+
+      // Does not display suggested items on focus.
+      await expect(controller.getElementAttribute(renderedResults, 'hidden')).to
+        .not.to.be.null;
+      // Does not display suggested items on any input.
+      await controller.type(input, 'ap');
+      await expect(controller.getElementAttribute(renderedResults, 'hidden')).to
+        .not.to.be.null;
+
+      // Displays suggested items on trigger.
+      const input = await controller.findElement('#input');
+      await controller.type(input, ' @');
+      await expect(controller.getElementAttribute(renderedResults, 'hidden')).to
+        .to.be.null;
+    });
+
+    it('<amp-autocomplete inline> should narrow suggestions to input', async () => {
+      const renderedResults = await controller.findElement(
+        '.i-amphtml-autocomplete-results'
+      );
+      const focusButton = await controller.findElement('#focusButton');
+      await expect(controller.getElementAttribute(renderedResults, 'hidden'))
+        .not.to.be.null;
+      await controller.click(focusButton);
+
+      // Displays all suggested items on trigger.
+      const input = await controller.findElement('#input');
+      await controller.type(input, '@');
+      await expect(controller.getElementAttribute(renderedResults, 'hidden')).to
+        .to.be.null;
+      await expect(
+        controller.getElementProperty(renderedResults, 'children')
+      ).to.have.length(3);
+
+      // New input narrows down suggested items.
+      await controller.type(input, 'ap');
+      await expect(controller.getElementAttribute(renderedResults, 'hidden')).to
+        .be.null;
+      await expect(
+        controller.getElementProperty(renderedResults, 'children')
+      ).to.have.length(1);
+    });
+
+    it('<amp-autocomplete inline> should select an item', async () => {
+      const renderedResults = await controller.findElement(
+        '.i-amphtml-autocomplete-results'
+      );
+      const focusButton = await controller.findElement('#focusButton');
+      await expect(controller.getElementAttribute(renderedResults, 'hidden'))
+        .not.to.be.null;
+      await expect(
+        controller.getElementProperty(renderedResults, 'children')
+      ).to.have.length(3);
+
+      // Displays all suggested items on trigger.
+      const input = await controller.findElement('#input');
+      await controller.click(focusButton);
+      await controller.type(input, '@');
+      await expect(controller.getElementAttribute(renderedResults, 'hidden')).to
+        .be.null;
+      const itemElements = await controller.findElements(
+        '.i-amphtml-autocomplete-item'
+      );
+      await expect(controller.getElementText(itemElements[0])).to.equal(
+        'apple'
+      );
+      await controller.click(itemElements[0]);
+
+      // Displays no items after selecting one.
+      await expect(controller.getElementAttribute(renderedResults, 'hidden'))
+        .not.to.be.null;
+      await expect(controller.getElementProperty(input, 'value')).to.equal(
+        '@apple '
+      );
+    });
+  }
+);
diff --git a/extensions/amp-autocomplete/0.1/test-e2e/test-amp-autocomplete.js b/extensions/amp-autocomplete/0.1/test-e2e/test-amp-autocomplete.js
index 4abf2948de721..b5c5b552fa2c1 100644
--- a/extensions/amp-autocomplete/0.1/test-e2e/test-amp-autocomplete.js
+++ b/extensions/amp-autocomplete/0.1/test-e2e/test-amp-autocomplete.js
@@ -22,7 +22,6 @@ describes.endtoend(
     // TODO: Restore 'environments' to default after supporting fourth test in
     // shadow environment.
     environments: ['single', 'viewer-demo'],
-    experiments: ['amp-autocomplete'],
     initialRect: {width: 800, height: 800},
   },
   env => {
diff --git a/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete-bindings.js b/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete-bindings.js
new file mode 100644
index 0000000000000..65950131ecfbc
--- /dev/null
+++ b/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete-bindings.js
@@ -0,0 +1,217 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import '../amp-autocomplete';
+import {AutocompleteBindingInline} from '../autocomplete-binding-inline';
+import {AutocompleteBindingSingle} from '../autocomplete-binding-single';
+import {createElementWithAttributes} from '../../../../src/dom';
+
+describes.realWin(
+  'amp-autocomplete bindings',
+  {
+    amp: {
+      extensions: ['amp-autocomplete'],
+    },
+  },
+  env => {
+    let win, doc, input;
+
+    beforeEach(() => {
+      win = env.win;
+      doc = win.document;
+      input = doc.createElement('input');
+    });
+
+    function stubAmpAutocomplete(attributes) {
+      const element = createElementWithAttributes(
+        doc,
+        'div',
+        Object.assign(attributes, {layout: 'container'})
+      );
+      return {element, win: env.win};
+    }
+
+    describe('Single binding', () => {
+      let binding;
+      const getBindingSingle = attributes =>
+        new AutocompleteBindingSingle(stubAmpAutocomplete(attributes));
+
+      beforeEach(() => {
+        binding = getBindingSingle({filter: 'substring'});
+      });
+
+      it('should always intend to autocomplete', () => {
+        expect(binding.shouldAutocomplete(input)).to.be.true;
+      });
+
+      it('should provide partial user input from the given input', () => {
+        expect(binding.getUserInputForUpdate(input)).to.equal('');
+        input.value = 'hello';
+        expect(binding.getUserInputForUpdate(input)).to.equal('hello');
+      });
+
+      it('should set the input value to the given value', () => {
+        input.value = 'selection';
+        binding.resetInputOnWrapAround('', input);
+        expect(input.value).to.equal('');
+        binding.resetInputOnWrapAround('asdf', input);
+        expect(input.value).to.equal('asdf');
+      });
+
+      it('should not suggest first when attribute is not present', () => {
+        expect(binding.shouldSuggestFirst()).to.be.false;
+      });
+
+      it('should error when suggest first is present without prefix filter', () => {
+        expect(() => getBindingSingle({'suggest-first': 'true'})).to.throw(
+          /"suggest-first" requires "filter" type "prefix"/
+        );
+      });
+
+      it('should not suggest first when attribute is not present', () => {
+        binding = getBindingSingle({
+          'suggest-first': 'true',
+          'filter': 'prefix',
+        });
+        expect(binding.shouldSuggestFirst()).to.be.true;
+      });
+
+      it('should always show on focus', () => {
+        expect(binding.shouldShowOnFocus()).to.be.true;
+      });
+
+      it('should display active item in input', () => {
+        input.focus();
+        const selectionSpy = env.sandbox.spy(input, 'setSelectionRange');
+        expect(input.value).to.equal('');
+
+        binding.displayActiveItemInInput(input, 'apple', '');
+        expect(input.value).to.equal('apple');
+        expect(selectionSpy).not.to.have.been.called;
+
+        binding.shouldSuggestFirst_ = true;
+        binding.displayActiveItemInInput(input, 'apple', '');
+        expect(input.value).to.equal('apple');
+        expect(selectionSpy).to.have.been.calledWith(0, 5);
+      });
+
+      it('should remove highlighting', () => {
+        input.value = 'apple';
+        input.setSelectionRange(0, 5);
+        expect(input.selectionStart).to.equal(0);
+        binding.removeSelectionHighlighting(input);
+        expect(input.selectionEnd).to.equal(5);
+      });
+
+      it('should prevent submission when "submit-on-enter" is absent', () => {
+        expect(binding.shouldPreventFormSubmissionOnEnter(true)).to.be.true;
+        expect(binding.shouldPreventFormSubmissionOnEnter(false)).to.be.true;
+      });
+
+      it('should not prevent submission when "submit-on-enter" is true', () => {
+        binding = getBindingSingle({'submit-on-enter': 'true'});
+        expect(binding.shouldPreventFormSubmissionOnEnter(true)).to.be.false;
+        expect(binding.shouldPreventFormSubmissionOnEnter(false)).to.be.false;
+      });
+    });
+
+    describe('Inline binding', () => {
+      let pre, userInput, match, binding;
+      const getBindingInline = attributes =>
+        new AutocompleteBindingInline(stubAmpAutocomplete(attributes));
+
+      beforeEach(() => {
+        pre = 'My friend is ';
+        userInput = 'har';
+        match = {0: '@' + userInput, index: pre.length};
+        binding = getBindingInline({filter: 'substring', inline: '@'});
+      });
+
+      it('should not always autocomplete', () => {
+        expect(binding.shouldAutocomplete(input)).to.be.false;
+      });
+
+      it('should autocomplete based on found matches', () => {
+        env.sandbox
+          .stub(binding, 'getClosestPriorMatch_')
+          .onFirstCall()
+          .returns(match)
+          .onSecondCall()
+          .returns(null);
+        expect(binding.shouldAutocomplete(input)).to.be.true;
+        expect(binding.match_).to.equal(match);
+
+        expect(binding.shouldAutocomplete(input)).to.be.false;
+        expect(binding.match_).to.be.null;
+      });
+
+      it('should provide partial user input based on the stored match', () => {
+        expect(binding.getUserInputForUpdate(input)).to.equal('');
+        binding.match_ = match;
+        expect(binding.getUserInputForUpdate(input)).to.equal(userInput);
+      });
+
+      it('should provide new input value based on the stored match', () => {
+        const text = pre + '@' + userInput;
+        const selection = 'harrypotter@gmail.com';
+
+        expect(input.value).to.equal('');
+        expect(
+          binding.getUserInputForUpdateWithSelection(selection, input, '')
+        ).to.equal(input.value);
+
+        input.value = text;
+        expect(
+          binding.getUserInputForUpdateWithSelection(selection, input, match[0])
+        ).to.equal(text);
+
+        binding.match_ = match;
+        expect(
+          binding.getUserInputForUpdateWithSelection(selection, input, match[0])
+        ).to.equal(pre + '@' + selection + ' ');
+      });
+
+      it('should not do anything to input value', () => {
+        const initial = input.value;
+        const selectionSpy = env.sandbox.spy(input, 'setSelectionRange');
+        binding.resetInputOnWrapAround('', input);
+        binding.resetInputOnWrapAround('asdf', input);
+        binding.displayActiveItemInInput(input, 'apple', '');
+        binding.removeSelectionHighlighting(input);
+        expect(input.value).to.equal(initial);
+        expect(selectionSpy).not.to.have.been.called;
+      });
+
+      it('should not suggest first if attribute is absent', () => {
+        expect(binding.shouldSuggestFirst()).to.be.false;
+      });
+
+      it('should suggest first if attribute is present', () => {
+        binding = getBindingInline({'inline': '@', 'suggest-first': 'true'});
+        expect(binding.shouldSuggestFirst()).to.be.true;
+      });
+
+      it('should never show on focus', () => {
+        expect(binding.shouldShowOnFocus()).to.be.false;
+      });
+
+      it('should prevent default whenever there are active suggestions shown', () => {
+        expect(binding.shouldPreventFormSubmissionOnEnter(true)).to.be.true;
+        expect(binding.shouldPreventFormSubmissionOnEnter(false)).to.be.false;
+      });
+    });
+  }
+);
diff --git a/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete-init.js b/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete-init.js
index 6673981db649d..04b7cab4c9619 100644
--- a/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete-init.js
+++ b/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete-init.js
@@ -77,8 +77,18 @@ describes.realWin(
       return ampAutocomplete.build().then(() => ampAutocomplete);
     }
 
+    it('should build with "inline" and "query" when specified', () => {
+      return getAutocomplete({
+        'filter': 'substring',
+        'query': 'q',
+      }).then(ampAutocomplete => {
+        const impl = ampAutocomplete.implementation_;
+        expect(impl.queryKey_).to.equal('q');
+      });
+    });
+
     it('should layout', () => {
-      let impl, filterAndRenderSpy, clearAllSpy, filterSpy, renderSpy;
+      let impl, autocompleteSpy, clearAllSpy, filterSpy, renderSpy;
       return getAutocomplete({
         'filter': 'substring',
       })
@@ -89,10 +99,7 @@ describes.realWin(
           expect(impl.inputElement_).not.to.be.null;
           expect(impl.container_).not.to.be.null;
           expect(impl.filter_).to.equal('substring');
-          filterAndRenderSpy = env.sandbox.spy(
-            impl,
-            'filterDataAndRenderResults_'
-          );
+          autocompleteSpy = env.sandbox.spy(impl, 'autocomplete_');
           clearAllSpy = env.sandbox.spy(impl, 'clearAllItems_');
           filterSpy = env.sandbox.spy(impl, 'filterData_');
           renderSpy = env.sandbox.spy(impl, 'renderResults_');
@@ -100,7 +107,7 @@ describes.realWin(
         })
         .then(() => {
           expect(impl.inputElement_.hasAttribute('autocomplete')).to.be.true;
-          expect(filterAndRenderSpy).to.have.been.calledOnce;
+          expect(autocompleteSpy).to.have.been.calledOnce;
           expect(clearAllSpy).to.have.been.calledOnce;
           expect(filterSpy).not.to.have.been.called;
           expect(renderSpy).not.to.have.been.called;
@@ -139,7 +146,7 @@ describes.realWin(
     });
 
     it('should not render remote data before first user interaction', () => {
-      let impl, filterAndRenderSpy, clearAllSpy, filterSpy, renderSpy;
+      let impl, autocompleteSpy, clearAllSpy, filterSpy, renderSpy;
       return getAutocomplete(
         {
           'filter': 'substring',
@@ -154,10 +161,7 @@ describes.realWin(
           expect(impl.inputElement_).not.to.be.null;
           expect(impl.container_).not.to.be.null;
           expect(impl.filter_).to.equal('substring');
-          filterAndRenderSpy = env.sandbox.spy(
-            impl,
-            'filterDataAndRenderResults_'
-          );
+          autocompleteSpy = env.sandbox.spy(impl, 'autocomplete_');
           clearAllSpy = env.sandbox.spy(impl, 'clearAllItems_');
           filterSpy = env.sandbox.spy(impl, 'filterData_');
           renderSpy = env.sandbox.spy(impl, 'renderResults_');
@@ -165,7 +169,7 @@ describes.realWin(
         })
         .then(() => {
           expect(impl.inputElement_.hasAttribute('autocomplete')).to.be.true;
-          expect(filterAndRenderSpy).to.have.been.calledOnce;
+          expect(autocompleteSpy).to.have.been.calledOnce;
           expect(clearAllSpy).to.have.been.calledOnce;
           expect(filterSpy).not.to.have.been.called;
           expect(renderSpy).not.to.have.been.called;
@@ -175,7 +179,7 @@ describes.realWin(
     it('should require filter attribute', () => {
       return allowConsoleError(() => {
         return expect(getAutocomplete({})).to.be.rejectedWith(
-          'amp-autocomplete requires "filter" attribute.​​​'
+          /requires "filter" attribute/
         );
       });
     });
diff --git a/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete.js b/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete.js
index 31056b35a82d8..5c867924482ff 100644
--- a/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete.js
+++ b/extensions/amp-autocomplete/0.1/test/test-amp-autocomplete.js
@@ -15,7 +15,10 @@
  */
 
 import '../amp-autocomplete';
+import {AmpAutocomplete} from '../amp-autocomplete';
 import {Keys} from '../../../../src/utils/key-codes';
+import {createElementWithAttributes} from '../../../../src/dom';
+import {htmlFor} from '../../../../src/static-template';
 
 describes.realWin(
   'amp-autocomplete unit tests',
@@ -25,66 +28,90 @@ describes.realWin(
     },
   },
   env => {
-    let win, doc, element, impl;
+    let win, doc, impl;
 
     beforeEach(() => {
       win = env.win;
       doc = win.document;
+      return buildAmpAutocomplete().then(ampAutocomplete => {
+        impl = ampAutocomplete;
+      });
+    });
 
+    function buildAmpAutocomplete(wantSsr) {
       const form = doc.createElement('form');
-      const ampAutocomplete = doc.createElement('amp-autocomplete');
-      ampAutocomplete.setAttribute('layout', 'container');
-      ampAutocomplete.setAttribute('filter', 'substring');
+      const element = createElementWithAttributes(doc, 'amp-autocomplete', {
+        layout: 'container',
+        filter: 'substring',
+      });
 
       const input = win.document.createElement('input');
       input.setAttribute('type', 'text');
-      ampAutocomplete.appendChild(input);
+      element.appendChild(input);
 
       const script = win.document.createElement('script');
       script.setAttribute('type', 'application/json');
       script.innerHTML = '{ "items" : ["apple", "banana", "orange"] }';
-      ampAutocomplete.appendChild(script);
+      element.appendChild(script);
 
-      form.appendChild(ampAutocomplete);
+      form.appendChild(element);
       doc.body.appendChild(form);
-      return ampAutocomplete.build().then(() => {
-        element = ampAutocomplete;
-        impl = element.implementation_;
+
+      if (wantSsr) {
+        element.removeAttribute('filter');
+        element.setAttribute('src', 'example.json');
+        const template = doc.createElement('template');
+        element.appendChild(template);
+      }
+
+      const ampAutocomplete = new AmpAutocomplete(element);
+      const ssrTemplateHelper = ampAutocomplete.getSsrTemplateHelper();
+      env.sandbox.stub(ssrTemplateHelper, 'isEnabled').returns(wantSsr);
+
+      return ampAutocomplete.buildCallback().then(() => {
+        return ampAutocomplete;
       });
-    });
+    }
+
+    function getRenderedSuggestions() {
+      const html = htmlFor(doc);
+      return html`
+        <div>
+          <div data-value="apple"></div>
+          <div data-value="mango"></div>
+          <div data-value="pear"></div>
+        </div>
+      `;
+    }
 
     describe('mutatedAttributesCallback_()', () => {
-      let remoteDataSpy;
-      let filterAndRenderSpy;
+      let remoteDataSpy, autocompleteSpy;
 
       beforeEach(() => {
         remoteDataSpy = env.sandbox
           .stub(impl, 'getRemoteData_')
           .resolves(['a', 'b', 'c']);
-        filterAndRenderSpy = env.sandbox.spy(
-          impl,
-          'filterDataAndRenderResults_'
-        );
+        autocompleteSpy = env.sandbox.spy(impl, 'autocomplete_');
       });
 
       it('should resolve when param is {}', () => {
         return impl.mutatedAttributesCallback({}).then(() => {
           expect(remoteDataSpy).not.to.have.been.called;
-          expect(filterAndRenderSpy).not.to.have.been.called;
+          expect(autocompleteSpy).not.to.have.been.called;
         });
       });
 
       it('should resolve when src is undefined', () => {
         return impl.mutatedAttributesCallback({'src': undefined}).then(() => {
           expect(remoteDataSpy).not.to.have.been.called;
-          expect(filterAndRenderSpy).not.to.have.been.called;
+          expect(autocompleteSpy).not.to.have.been.called;
         });
       });
 
       it('should resolve when src is null', () => {
         return impl.mutatedAttributesCallback({'src': null}).then(() => {
           expect(remoteDataSpy).not.to.have.been.called;
-          expect(filterAndRenderSpy).not.to.have.been.called;
+          expect(autocompleteSpy).not.to.have.been.called;
         });
       });
 
@@ -94,8 +121,8 @@ describes.realWin(
           .then(() => {
             expect(remoteDataSpy).to.have.been.calledOnce;
             expect(impl.sourceData_).to.have.ordered.members(['a', 'b', 'c']);
-            expect(filterAndRenderSpy).to.have.been.calledOnce;
-            expect(filterAndRenderSpy).to.have.been.calledWith(
+            expect(autocompleteSpy).to.have.been.calledOnce;
+            expect(autocompleteSpy).to.have.been.calledWith(
               ['a', 'b', 'c'],
               ''
             );
@@ -108,8 +135,8 @@ describes.realWin(
           .then(() => {
             expect(remoteDataSpy).not.to.have.been.called;
             expect(impl.sourceData_).to.have.ordered.members(['a', 'b', 'c']);
-            expect(filterAndRenderSpy).to.have.been.calledOnce;
-            expect(filterAndRenderSpy).to.have.been.calledWith(
+            expect(autocompleteSpy).to.have.been.calledOnce;
+            expect(autocompleteSpy).to.have.been.calledWith(
               ['a', 'b', 'c'],
               ''
             );
@@ -122,8 +149,8 @@ describes.realWin(
           .then(() => {
             expect(remoteDataSpy).not.to.have.been.called;
             expect(impl.sourceData_).to.be.an('array').that.is.empty;
-            expect(filterAndRenderSpy).to.have.been.calledOnce;
-            expect(filterAndRenderSpy).to.have.been.calledWith([], '');
+            expect(autocompleteSpy).to.have.been.calledOnce;
+            expect(autocompleteSpy).to.have.been.calledWith([], '');
           });
       });
     });
@@ -177,14 +204,14 @@ describes.realWin(
       expect(element.innerHTML).to.equal('hello');
     });
 
-    describe('filterDataAndRenderResults_()', () => {
+    describe('autocomplete_()', () => {
       let clearAllItemsSpy;
       let renderSpy;
       let filterDataSpy;
 
       beforeEach(() => {
         expect(impl.container_).not.to.be.null;
-        expect(impl.container_.children.length).to.equal(0);
+        expect(impl.container_.children).to.have.length(0);
         clearAllItemsSpy = env.sandbox.spy(impl, 'clearAllItems_');
         filterDataSpy = env.sandbox.spy(impl, 'filterData_');
         renderSpy = env.sandbox.spy(impl, 'renderResults_');
@@ -192,7 +219,7 @@ describes.realWin(
 
       it('should only clear if input < minChars_', () => {
         impl.minChars_ = 3;
-        return impl.filterDataAndRenderResults_([], 'ap').then(() => {
+        return impl.autocomplete_([], 'ap').then(() => {
           expect(clearAllItemsSpy).to.have.been.calledOnce;
           expect(filterDataSpy).not.to.have.been.called;
           expect(renderSpy).not.to.have.been.called;
@@ -200,7 +227,7 @@ describes.realWin(
       });
 
       it('should only clear if data is null', () => {
-        return impl.filterDataAndRenderResults_(null, 'ap').then(() => {
+        return impl.autocomplete_(null, 'ap').then(() => {
           expect(clearAllItemsSpy).to.have.been.calledOnce;
           expect(filterDataSpy).not.to.have.been.called;
           expect(renderSpy).not.to.have.been.called;
@@ -208,7 +235,7 @@ describes.realWin(
       });
 
       it('should only clear if data is []', () => {
-        return impl.filterDataAndRenderResults_([], 'ap').then(() => {
+        return impl.autocomplete_([], 'ap').then(() => {
           expect(clearAllItemsSpy).to.have.been.calledOnce;
           expect(filterDataSpy).not.to.have.been.called;
           expect(renderSpy).not.to.have.been.called;
@@ -217,57 +244,83 @@ describes.realWin(
 
       it('should pass on valid arguments', () => {
         impl.minChars_ = 2;
-        return impl
-          .filterDataAndRenderResults_(impl.sourceData_, 'ap')
-          .then(() => {
-            expect(clearAllItemsSpy).to.have.been.calledOnce;
-            expect(filterDataSpy).to.have.been.calledWith(
-              impl.sourceData_,
-              'ap'
-            );
-            expect(renderSpy).to.have.been.calledWith(
-              ['apple'],
-              impl.container_
-            );
-            expect(impl.container_.children.length).to.equal(1);
-            expect(impl.container_.children[0].innerText).to.equal('apple');
-          });
+        return impl.autocomplete_(impl.sourceData_, 'ap').then(() => {
+          expect(clearAllItemsSpy).to.have.been.calledOnce;
+          expect(filterDataSpy).to.have.been.calledWith(impl.sourceData_, 'ap');
+          expect(renderSpy).to.have.been.calledWith(['apple'], impl.container_);
+          expect(impl.container_.children).to.have.length(1);
+          expect(impl.container_.children[0].innerText).to.equal('apple');
+        });
       });
     });
 
-    it('renderResults_() should update the container_ with plain text', () => {
-      const createSpy = env.sandbox.spy(impl, 'createElementFromItem_');
-      return impl.renderResults_(['apple'], impl.container_).then(() => {
-        expect(impl.container_.children.length).to.equal(1);
+    describe('getRemoteData_()', () => {
+      it('should proxy XHR to viewer', async () => {
+        impl = await buildAmpAutocomplete(true);
+        impl.element.setAttribute('src', '');
+        const rendered = getRenderedSuggestions();
+        const ssrSpy = env.sandbox
+          .stub(impl.getSsrTemplateHelper(), 'ssr')
+          .returns(Promise.resolve({rendered}));
+        await impl.getRemoteData_();
+        expect(ssrSpy).to.be.calledOnce;
+      });
+    });
+
+    describe('renderResults()', () => {
+      it('should delegate template rendering to viewer', async () => {
+        impl = await buildAmpAutocomplete(true);
+        const data = ['apple', 'mango', 'pear'];
+        env.sandbox
+          .stub(impl.getSsrTemplateHelper(), 'applySsrOrCsrTemplate')
+          .returns(Promise.resolve(getRenderedSuggestions()));
+        await impl.renderResults_(data, impl.container_);
+        expect(impl.getSsrTemplateHelper().applySsrOrCsrTemplate).to.be
+          .calledOnce;
+        expect(
+          impl.getSsrTemplateHelper().applySsrOrCsrTemplate
+        ).to.have.been.calledWith(impl.element, data);
+        expect(impl.container_.children[0].getAttribute('data-value')).to.equal(
+          data[0]
+        );
+        expect(impl.container_.children[1].getAttribute('data-value')).to.equal(
+          data[1]
+        );
+        expect(impl.container_.children[2].getAttribute('data-value')).to.equal(
+          data[2]
+        );
+        expect(impl.container_.children).to.have.length(3);
+      });
+
+      it('should update the container_ with plain text', async () => {
+        const createSpy = env.sandbox.spy(impl, 'createElementFromItem_');
+        await impl.renderResults_(['apple'], impl.container_);
+        expect(impl.container_.children).to.have.length(1);
         expect(impl.container_.children[0].innerText).to.equal('apple');
         expect(createSpy).to.have.been.calledOnce;
         expect(createSpy).to.have.been.calledWith('apple');
       });
-    });
 
-    it('renderResults_() should update the container_ with rich text', () => {
-      const sourceData = [{value: 'apple'}, {value: 'mango'}, {value: 'pear'}];
-      impl.templateElement_ = doc.createElement('template');
-      const renderedChildren = [];
-      sourceData.forEach(item => {
-        const renderedChild = doc.createElement('div');
-        renderedChild.setAttribute('data-value', item.value);
-        renderedChildren.push(renderedChild);
-      });
-      const renderTemplateSpy = env.sandbox
-        .stub(impl.templates_, 'renderTemplateArray')
-        .returns(Promise.resolve(renderedChildren));
-
-      return impl.renderResults_(sourceData, impl.container_).then(() => {
-        expect(impl.container_.children.length).to.equal(3);
+      it('should update the container_ with rich text', async () => {
+        const sourceData = [
+          {value: 'apple'},
+          {value: 'mango'},
+          {value: 'pear'},
+        ];
+        impl = await buildAmpAutocomplete(true);
+        const renderTemplateSpy = env.sandbox
+          .stub(impl.getSsrTemplateHelper(), 'applySsrOrCsrTemplate')
+          .returns(Promise.resolve(getRenderedSuggestions()));
+        await impl.renderResults_(sourceData, impl.container_);
+        expect(impl.container_.children).to.have.length(3);
         expect(impl.container_.children[0].getAttribute('data-value')).to.equal(
-          'apple'
+          sourceData[0].value
         );
         expect(impl.container_.children[1].getAttribute('data-value')).to.equal(
-          'mango'
+          sourceData[1].value
         );
         expect(impl.container_.children[2].getAttribute('data-value')).to.equal(
-          'pear'
+          sourceData[2].value
         );
         expect(renderTemplateSpy).to.have.been.calledOnce;
       });
@@ -310,11 +363,11 @@ describes.realWin(
       // Remaining filters should error
       impl.filter_ = 'custom';
       expect(() => impl.filterData_(['a', 'b', 'c'], 'a')).to.throw(
-        'Filter not yet supported: custom'
+        /Filter not yet supported:/
       );
       impl.filter_ = 'invalid';
       expect(() => impl.filterData_(['a', 'b', 'c'], 'a')).to.throw(
-        'Unexpected filter: invalid'
+        /Unexpected filter:/
       );
     });
 
@@ -389,53 +442,95 @@ describes.realWin(
     });
 
     it('should show and hide results on toggle', () => {
-      expect(impl.resultsShowing_()).to.be.false;
+      expect(impl.areResultsDisplayed_()).to.be.false;
       return impl.renderResults_(['apple'], impl.container_).then(() => {
-        expect(impl.resultsShowing_()).to.be.false;
+        expect(impl.areResultsDisplayed_()).to.be.false;
         impl.toggleResults_(true);
-        expect(impl.resultsShowing_()).to.be.true;
+        expect(impl.areResultsDisplayed_()).to.be.true;
         impl.toggleResults_(false);
-        expect(impl.resultsShowing_()).to.be.false;
+        expect(impl.areResultsDisplayed_()).to.be.false;
       });
     });
 
     describe('inputHandler_() on input', () => {
-      let renderSpy, toggleResultsSpy, updateActiveSpy;
+      let renderSpy,
+        toggleResultsSpy,
+        updateActiveSpy,
+        clearAllItemsSpy,
+        remoteDataSpy;
+
+      it('should only clear items if binding should not autocomplete', () => {
+        return impl
+          .layoutCallback()
+          .then(() => {
+            renderSpy = env.sandbox.spy(impl, 'renderResults_');
+            toggleResultsSpy = env.sandbox.spy(impl, 'toggleResults_');
+            clearAllItemsSpy = env.sandbox.spy(impl, 'clearAllItems_');
+            env.sandbox
+              .stub(impl.binding_, 'shouldAutocomplete')
+              .returns(false);
+            return impl.inputHandler_();
+          })
+          .then(() => {
+            expect(clearAllItemsSpy).to.have.been.calledOnce;
+            expect(renderSpy).not.to.have.been.called;
+            expect(toggleResultsSpy).not.to.have.been.called;
+          });
+      });
+
+      it('should only fetch data when autocompleting for SSR', async () => {
+        impl = await buildAmpAutocomplete(true);
+        await impl.layoutCallback();
+        const autocompleteSpy = env.sandbox.spy(impl, 'autocomplete_');
+        toggleResultsSpy = env.sandbox.spy(impl, 'toggleResults_');
+        remoteDataSpy = env.sandbox
+          .stub(impl, 'getRemoteData_')
+          .resolves(['abc']);
+        env.sandbox.stub(impl.binding_, 'shouldAutocomplete').returns(true);
+        await impl.inputHandler_();
+        expect(remoteDataSpy).to.have.been.calledOnce;
+        expect(autocompleteSpy).to.have.been.calledOnce;
+        expect(toggleResultsSpy).to.have.been.calledOnce;
+        await impl.inputHandler_();
+        expect(remoteDataSpy).to.have.been.calledTwice;
+        expect(autocompleteSpy).to.have.been.calledTwice;
+        expect(toggleResultsSpy).to.have.been.calledTwice;
+      });
 
       it('should record and respond to input', () => {
-        return element
+        return impl
           .layoutCallback()
           .then(() => {
             impl.inputElement_.value = 'a';
             renderSpy = env.sandbox.spy(impl, 'renderResults_');
             toggleResultsSpy = env.sandbox.spy(impl, 'toggleResults_');
             updateActiveSpy = env.sandbox.spy(impl, 'updateActiveItem_');
-            expect(impl.suggestFirst_).to.be.false;
+            expect(impl.shouldSuggestFirst_).to.be.false;
             return impl.inputHandler_();
           })
           .then(() => {
             expect(renderSpy).to.have.been.calledOnce;
             expect(toggleResultsSpy).to.have.been.calledWith(true);
-            expect(impl.container_.children.length).to.equal(3);
+            expect(impl.container_.children).to.have.length(3);
             expect(updateActiveSpy).not.to.have.been.called;
           });
       });
 
       it('should suggest first item when present', () => {
-        return element
+        return impl
           .layoutCallback()
           .then(() => {
             impl.inputElement_.value = 'a';
             renderSpy = env.sandbox.spy(impl, 'renderResults_');
             toggleResultsSpy = env.sandbox.spy(impl, 'toggleResults_');
             updateActiveSpy = env.sandbox.spy(impl, 'updateActiveItem_');
-            impl.suggestFirst_ = true;
+            impl.shouldSuggestFirst_ = true;
             return impl.inputHandler_();
           })
           .then(() => {
             expect(renderSpy).to.have.been.calledOnce;
             expect(toggleResultsSpy).to.have.been.calledWith(true);
-            expect(impl.container_.children.length).to.equal(3);
+            expect(impl.container_.children).to.have.length(3);
             expect(updateActiveSpy).to.have.been.calledWith(1);
           });
       });
@@ -453,10 +548,10 @@ describes.realWin(
 
       it('should updateActiveItem_ when results showing on Down arrow', () => {
         env.sandbox
-          .stub(impl, 'resultsShowing_')
+          .stub(impl, 'areResultsDisplayed_')
           .onFirstCall()
           .returns(true);
-        return element
+        return impl
           .layoutCallback()
           .then(() => {
             impl.activeIndex_ = 0;
@@ -470,8 +565,8 @@ describes.realWin(
       });
 
       it('should displayUserInput_ when looping on Down arrow', () => {
-        env.sandbox.stub(impl, 'resultsShowing_').returns(true);
-        return element
+        env.sandbox.stub(impl, 'areResultsDisplayed_').returns(true);
+        return impl
           .layoutCallback()
           .then(() => {
             return impl.keyDownHandler_(event);
@@ -484,20 +579,17 @@ describes.realWin(
       });
 
       it('should display results if not already on Down arrow', () => {
-        let filterAndRenderSpy, toggleResultsSpy;
-        return element
+        let autocompleteSpy, toggleResultsSpy;
+        return impl
           .layoutCallback()
           .then(() => {
-            filterAndRenderSpy = env.sandbox.spy(
-              impl,
-              'filterDataAndRenderResults_'
-            );
+            autocompleteSpy = env.sandbox.spy(impl, 'autocomplete_');
             toggleResultsSpy = env.sandbox.spy(impl, 'toggleResults_');
             return impl.keyDownHandler_(event);
           })
           .then(() => {
             expect(eventPreventSpy).to.have.been.calledOnce;
-            expect(filterAndRenderSpy).to.have.been.calledOnce;
+            expect(autocompleteSpy).to.have.been.calledOnce;
             expect(toggleResultsSpy).to.have.been.calledWith(true);
             expect(displayInputSpy).not.to.have.been.called;
             expect(updateActiveSpy).not.to.have.been.called;
@@ -505,7 +597,7 @@ describes.realWin(
       });
 
       it('should updateActiveItem_ on Up arrow', () => {
-        return element
+        return impl
           .layoutCallback()
           .then(() => {
             event.key = Keys.UP_ARROW;
@@ -519,7 +611,7 @@ describes.realWin(
       });
 
       it('should displayUserInput_ when looping on Up arrow', () => {
-        return element
+        return impl
           .layoutCallback()
           .then(() => {
             event.key = Keys.UP_ARROW;
@@ -542,7 +634,7 @@ describes.realWin(
       };
       let selectItemSpy, resetSpy, clearAllSpy, eventPreventSpy;
       function layoutAndSetSpies() {
-        return element.layoutCallback().then(() => {
+        return impl.layoutCallback().then(() => {
           eventPreventSpy = env.sandbox.spy(event, 'preventDefault');
           selectItemSpy = env.sandbox.spy(impl, 'selectItem_');
           resetSpy = env.sandbox.spy(impl, 'resetActiveElement_');
@@ -568,7 +660,7 @@ describes.realWin(
         return layoutAndSetSpies()
           .then(() => {
             impl.activeElement_ = impl.createElementFromItem_('abc');
-            env.sandbox.stub(impl, 'resultsShowing_').returns(true);
+            env.sandbox.stub(impl, 'areResultsDisplayed_').returns(true);
             return impl.keyDownHandler_(event);
           })
           .then(() => {
@@ -577,108 +669,63 @@ describes.realWin(
             expect(clearAllSpy).to.have.been.calledOnce;
             expect(resetSpy).to.have.been.calledOnce;
             expect(eventPreventSpy).to.have.been.calledOnce;
-            expect(impl.submitOnEnter_).to.be.false;
           });
       });
 
-      it('should call event.preventDefault when submitOnEnter_ is true', () => {
+      it('should call event.preventDefault based on binding', () => {
         return layoutAndSetSpies()
           .then(() => {
-            impl.submitOnEnter_ = true;
             impl.activeElement_ = impl.createElementFromItem_('abc');
+            env.sandbox.stub(impl, 'areResultsDisplayed_').returns(true);
+            env.sandbox
+              .stub(impl.binding_, 'shouldPreventFormSubmissionOnEnter')
+              .returns(true);
             return impl.keyDownHandler_(event);
           })
           .then(() => {
-            expect(impl.inputElement_.value).to.equal('abc');
             expect(selectItemSpy).to.have.been.calledOnce;
             expect(clearAllSpy).to.have.been.calledOnce;
             expect(resetSpy).to.have.been.calledOnce;
-            expect(eventPreventSpy).not.to.have.been.called;
-            expect(impl.submitOnEnter_).to.be.true;
+            expect(eventPreventSpy).to.have.been.called;
           });
       });
     });
 
-    it('should call keyDownHandler_() on Enter not event.preventDefault', () => {
-      const event = {
-        key: Keys.ENTER,
-        preventDefault: () => {},
-        target: {textContent: 'hello'},
-      };
-      let selectItemSpy, resetSpy, clearAllSpy, eventPreventSpy;
-      return element
-        .layoutCallback()
-        .then(() => {
-          eventPreventSpy = env.sandbox.spy(event, 'preventDefault');
-          selectItemSpy = env.sandbox.spy(impl, 'selectItem_');
-          resetSpy = env.sandbox.spy(impl, 'resetActiveElement_');
-          clearAllSpy = env.sandbox.spy(impl, 'clearAllItems_');
-          env.sandbox.stub(impl, 'resultsShowing_').returns(true);
-          return impl.keyDownHandler_(event);
-        })
-        .then(() => {
-          expect(impl.inputElement_.value).to.equal('');
-          expect(selectItemSpy).not.to.have.been.called;
-          expect(clearAllSpy).not.to.have.been.called;
-          expect(resetSpy).not.to.have.been.called;
-          expect(eventPreventSpy).to.have.been.calledOnce;
-          impl.activeElement_ = impl.createElementFromItem_('abc');
-          return impl.keyDownHandler_(event);
-        })
-        .then(() => {
-          expect(impl.inputElement_.value).to.equal('abc');
-          expect(selectItemSpy).to.have.been.calledOnce;
-          expect(clearAllSpy).to.have.been.calledOnce;
-          expect(resetSpy).to.have.been.calledOnce;
-          expect(eventPreventSpy).to.have.been.calledTwice;
-          expect(impl.submitOnEnter_).to.be.false;
-          impl.submitOnEnter_ = true;
-          impl.activeElement_ = impl.createElementFromItem_('abc');
-          return impl.keyDownHandler_(event);
-        })
-        .then(() => {
-          expect(impl.inputElement_.value).to.equal('abc');
-          expect(selectItemSpy).to.have.been.calledTwice;
-          expect(clearAllSpy).to.have.been.calledTwice;
-          expect(resetSpy).to.have.been.calledTwice;
-          expect(eventPreventSpy).to.have.been.calledTwice;
-          expect(impl.submitOnEnter_).to.be.true;
-        });
-    });
-
     it('should call keyDownHandler_() on Esc', () => {
-      const event = {key: Keys.ESCAPE};
+      const event = {key: Keys.ESCAPE, preventDefault: () => {}};
       const displayInputSpy = env.sandbox.spy(impl, 'displayUserInput_');
       const resetSpy = env.sandbox.spy(impl, 'resetActiveElement_');
       const toggleResultsSpy = env.sandbox.spy(impl, 'toggleResults_');
-      return element
+      return impl
         .layoutCallback()
         .then(() => {
           impl.userInput_ = 'a';
           return impl.renderResults_(impl.sourceData_, impl.container_);
         })
         .then(() => {
-          expect(impl.container_.children.length).to.equal(3);
+          expect(impl.container_.children).to.have.length(3);
           expect(resetSpy).to.have.been.calledOnce;
           impl.toggleResults_(true);
-          expect(impl.resultsShowing_()).to.be.true;
+          expect(impl.areResultsDisplayed_()).to.be.true;
           return impl.keyDownHandler_(event);
         })
         .then(() => {
           expect(displayInputSpy).to.have.been.calledOnce;
           expect(resetSpy).to.have.been.calledTwice;
           expect(toggleResultsSpy).to.have.been.calledWith(false);
-          expect(impl.resultsShowing_()).to.be.false;
+          expect(impl.areResultsDisplayed_()).to.be.false;
         });
     });
 
     it('should call keyDownHandler_() on Tab', () => {
-      const event = {key: Keys.TAB};
+      const event = {key: Keys.TAB, preventDefault: () => {}};
+      const eventPreventSpy = env.sandbox.spy(event, 'preventDefault');
       impl.inputElement_.value = 'expected';
       impl.activeElement_ = doc.createElement('div');
       expect(impl.userInput_).not.to.equal(impl.inputElement_.value);
+      env.sandbox.stub(impl, 'areResultsDisplayed_').returns(true);
       const fireEventSpy = env.sandbox.spy(impl, 'fireSelectEvent_');
-      return element
+      return impl
         .layoutCallback()
         .then(() => {
           return impl.keyDownHandler_(event);
@@ -686,6 +733,7 @@ describes.realWin(
         .then(() => {
           expect(impl.userInput_).to.equal(impl.inputElement_.value);
           expect(fireEventSpy).to.have.been.calledWith(impl.userInput_);
+          expect(eventPreventSpy).to.have.been.calledOnce;
         });
     });
 
@@ -693,10 +741,10 @@ describes.realWin(
       const event = {key: Keys.BACKSPACE};
 
       it('should set flag to true when suggest-first is present', () => {
-        return element
+        return impl
           .layoutCallback()
           .then(() => {
-            impl.suggestFirst_ = true;
+            impl.shouldSuggestFirst_ = true;
             expect(impl.detectBackspace_).to.be.false;
             return impl.keyDownHandler_(event);
           })
@@ -706,10 +754,10 @@ describes.realWin(
       });
 
       it('should not set flag when suggest-first is absent', () => {
-        return element
+        return impl
           .layoutCallback()
           .then(() => {
-            expect(impl.suggestFirst_).to.be.false;
+            expect(impl.shouldSuggestFirst_).to.be.false;
             expect(impl.detectBackspace_).to.be.false;
             return impl.keyDownHandler_(event);
           })
@@ -721,7 +769,7 @@ describes.realWin(
 
     it('should call keyDownHandler_() and fallthrough on any other key', () => {
       const event = {key: Keys.LEFT_ARROW};
-      return element.layoutCallback().then(() => {
+      return impl.layoutCallback().then(() => {
         return expect(impl.keyDownHandler_(event)).to.be.fulfilled;
       });
     });
@@ -729,7 +777,7 @@ describes.realWin(
     it('should call toggleResultsHandler_()', () => {
       const toggleResultsSpy = env.sandbox.spy(impl, 'toggleResults_');
       const resetSpy = env.sandbox.spy(impl, 'resetActiveElement_');
-      return element
+      return impl
         .layoutCallback()
         .then(() => {
           return impl.toggleResultsHandler_(true);
@@ -754,7 +802,7 @@ describes.realWin(
       const getItemSpy = env.sandbox.spy(impl, 'getItemElement_');
       const selectItemSpy = env.sandbox.spy(impl, 'selectItem_');
       let mockEl = doc.createElement('div');
-      return element
+      return impl
         .layoutCallback()
         .then(() => {
           impl.toggleResults_(true);
@@ -779,7 +827,7 @@ describes.realWin(
       const fireEventSpy = env.sandbox.spy(impl, 'fireSelectEvent_');
       const triggerSpy = env.sandbox.spy(impl.action_, 'trigger');
       const mockEl = doc.createElement('div');
-      return element.layoutCallback().then(() => {
+      return impl.layoutCallback().then(() => {
         impl.toggleResults_(true);
         mockEl.setAttribute('data-value', 'test');
         impl.selectItem_(mockEl);
@@ -791,7 +839,7 @@ describes.realWin(
 
     it('should support marking active items', () => {
       let resetSpy;
-      return element
+      return impl
         .layoutCallback()
         .then(() => {
           expect(impl.activeElement_).to.be.null;
@@ -800,7 +848,7 @@ describes.realWin(
           return impl.renderResults_(impl.sourceData_, impl.container_);
         })
         .then(() => {
-          expect(impl.container_.children.length).to.equal(3);
+          expect(impl.container_.children).to.have.length(3);
           impl.activeElement_ = doc.createElement('div');
           expect(impl.activeElement_).not.to.be.null;
           expect(impl.resetActiveElement_()).to.equal();
@@ -876,25 +924,22 @@ describes.realWin(
       expect(impl.selectItem_(disabledItem)).to.be.undefined;
     });
 
-    it('should not return disabled items from getEnabledItems_()', () => {
-      impl.templateElement_ = doc.createElement('template');
+    it('should not return disabled items from getEnabledItems_()', async () => {
+      impl = await buildAmpAutocomplete(true);
       const sourceData = ['apple', 'mango', 'pear'];
-      const renderedChildren = sourceData.map(item => {
-        const renderedChild = doc.createElement('div');
-        renderedChild.setAttribute('data-value', item);
-        return renderedChild;
-      });
-      renderedChildren[2].setAttribute('data-disabled', '');
+      const rendered = getRenderedSuggestions();
+      rendered.children[2].removeAttribute('data-value', '');
+      rendered.children[2].setAttribute('data-disabled', '');
       env.sandbox
-        .stub(impl.templates_, 'renderTemplateArray')
-        .returns(Promise.resolve(renderedChildren));
+        .stub(impl.getSsrTemplateHelper(), 'applySsrOrCsrTemplate')
+        .returns(Promise.resolve(rendered));
 
-      return impl.renderResults_(sourceData, impl.container_).then(() => {
-        expect(impl.container_.children.length).to.equal(3);
-        expect(impl.getEnabledItems_().length).to.equal(2);
-        expect(impl.container_.children[2].hasAttribute('aria-disabled')).to.be
-          .true;
-      });
+      await impl.renderResults_(sourceData, impl.container_);
+      expect(impl.container_.children).to.have.length(3);
+      expect(impl.getEnabledItems_()).to.have.length(2);
+      expect(
+        impl.container_.children[2].getAttribute('aria-disabled')
+      ).to.equal('true');
     });
 
     describe('fallback on error', () => {
@@ -912,7 +957,7 @@ describes.realWin(
       });
 
       it('should throw error when fallback is not provided', () => {
-        return element.layoutCallback().catch(e => {
+        return impl.layoutCallback().catch(e => {
           expect(getDataSpy).to.have.been.calledOnce;
           expect(fallbackSpy).to.have.been.calledWith(e);
           expect(toggleFallbackSpy).not.to.have.been.called;
@@ -921,7 +966,7 @@ describes.realWin(
 
       it('should not display fallback before user interaction', () => {
         env.sandbox.stub(impl, 'getFallback').returns(true);
-        return element.layoutCallback().then(() => {
+        return impl.layoutCallback().then(() => {
           expect(getDataSpy).not.to.have.been.called;
           expect(fallbackSpy).not.to.have.been.called;
           expect(toggleFallbackSpy).not.to.have.been.called;
@@ -930,7 +975,7 @@ describes.realWin(
 
       it('should display fallback after user interaction if provided', () => {
         env.sandbox.stub(impl, 'getFallback').returns(true);
-        return element.layoutCallback().then(() => {
+        return impl.layoutCallback().then(() => {
           impl.checkFirstInteractionAndMaybeFetchData_().then(() => {
             expect(getDataSpy).to.have.been.calledOnce;
             expect(fallbackSpy).to.have.been.calledWith('Error for test');
@@ -939,5 +984,16 @@ describes.realWin(
         });
       });
     });
+
+    it('should generate expected src values from "query" attribute', () => {
+      return impl.layoutCallback().then(() => {
+        impl.queryKey_ = 'q';
+        impl.srcBase_ = 'https://www.data.com/';
+        expect(impl.generateSrc_('')).to.equal('https://www.data.com/?q=');
+        expect(impl.generateSrc_('abc')).to.equal(
+          'https://www.data.com/?q=abc'
+        );
+      });
+    });
   }
 );
diff --git a/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.html b/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.html
index ea39c5e01cba8..99bef5d0eac8e 100644
--- a/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.html
+++ b/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.html
@@ -18,311 +18,530 @@
   Tests for the amp-autocomplete tag.
 -->
 
-<!doctype html>
+<!DOCTYPE html>
 <html ⚡>
-<head>
-  <meta charset="utf-8">
-  <title>amp-autocomplete example</title>
-  <link rel="canonical" href="amps.html">
-  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-  <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
-  <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
-  <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
-  <script async src="https://cdn.ampproject.org/v0.js"></script>
-</head>
-<body>
-  <!-- Valid: input and script tags -->
-  <amp-autocomplete>
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: input and src attr -->
-  <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: input and [src] attr -->
-  <amp-autocomplete [src]="foo.bar">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: input tag with type "text" and script tag -->
-  <amp-autocomplete>
-    <input type="text">
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: input tag with type "search" and script tag -->
-  <amp-autocomplete>
-    <input type="search">
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: input tag with type "search" and src attr -->
-  <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and filter=prefix attribute -->
-  <amp-autocomplete filter="prefix">
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and filter=prefix attribute -->
-  <amp-autocomplete filter="prefix" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and filter=token-prefix attribute -->
-  <amp-autocomplete filter="token-prefix">
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and filter=token-prefix attribute -->
-  <amp-autocomplete filter="token-prefix" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and filter=substring attribute -->
-  <amp-autocomplete filter="substring">
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and filter=substring attribute -->
-  <amp-autocomplete filter="substring" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and filter=fuzzy attribute -->
-  <amp-autocomplete filter="fuzzy">
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and filter=fuzzy attribute -->
-  <amp-autocomplete filter="fuzzy" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and filter=none attribute -->
-  <amp-autocomplete filter="none">
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and filter=none attribute -->
-  <amp-autocomplete filter="none" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and filter=custom and filter-expr attribute -->
-  <amp-autocomplete filter="custom" filter-expr="true">
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and filter=custom and filter-expr attribute -->
-  <amp-autocomplete filter="custom" filter-expr="true" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and items=property attribute -->
-  <amp-autocomplete items="property">
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and items=property attribute -->
-  <amp-autocomplete items="property" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and min-characters attribute -->
-  <amp-autocomplete min-characters=3>
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and min-characters attribute -->
-  <amp-autocomplete min-characters=3 src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-</amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and max-entries attribute -->
-  <amp-autocomplete max-entries=10>
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and max-entries attribute -->
-  <amp-autocomplete max-entries=10 src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component suggest-first attribute and filter attribute-->
-  <amp-autocomplete suggest-first filter="prefix">
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component suggest-first attribute and filter!="prefix" attribute-->
-  <amp-autocomplete suggest-first filter="substring">
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and suggest-first attribute -->
-  <amp-autocomplete suggest-first src="https://data.com/articles.json?ref=CANONICAL_URL" filter="prefix">
-      <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and highlight-user-entry attribute -->
-  <amp-autocomplete highlight-user-entry>
-    <input type="text">
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and highlight-user-entry attribute -->
-  <amp-autocomplete highlight-user-entry src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input type="text">
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and submit-on-enter attribute -->
-  <amp-autocomplete submit-on-enter>
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and submit-on-enter attribute -->
-  <amp-autocomplete submit-on-enter src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and rich content template -->
-  <amp-autocomplete>
-    <input>
-    <script type="application/json"> {} </script>
-    <template type="amp-mustache" id="amp-template-default">
-      <div class="city-item" data-value="{{value}}">
+  <head>
+    <meta charset="utf-8" />
+    <title>amp-autocomplete example</title>
+    <link rel="canonical" href="amps.html" />
+    <meta
+      name="viewport"
+      content="width=device-width,minimum-scale=1,initial-scale=1"
+    />
+    <style amp-boilerplate>
+      body {
+        -webkit-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+        -moz-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+        -ms-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+        animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+      }
+      @-webkit-keyframes -amp-start {
+        from {
+          visibility: hidden;
+        }
+        to {
+          visibility: visible;
+        }
+      }
+      @-moz-keyframes -amp-start {
+        from {
+          visibility: hidden;
+        }
+        to {
+          visibility: visible;
+        }
+      }
+      @-ms-keyframes -amp-start {
+        from {
+          visibility: hidden;
+        }
+        to {
+          visibility: visible;
+        }
+      }
+      @-o-keyframes -amp-start {
+        from {
+          visibility: hidden;
+        }
+        to {
+          visibility: visible;
+        }
+      }
+      @keyframes -amp-start {
+        from {
+          visibility: hidden;
+        }
+        to {
+          visibility: visible;
+        }
+      }
+    </style>
+    <noscript
+      ><style amp-boilerplate>
+        body {
+          -webkit-animation: none;
+          -moz-animation: none;
+          -ms-animation: none;
+          animation: none;
+        }
+      </style></noscript
+    >
+    <script
+      async
+      custom-element="amp-autocomplete"
+      src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"
+    ></script>
+    <script
+      async
+      custom-element="amp-bind"
+      src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"
+    ></script>
+    <script
+      async
+      custom-element="amp-form"
+      src="https://cdn.ampproject.org/v0/amp-form-0.1.js"
+    ></script>
+    <script
+      async
+      custom-template="amp-mustache"
+      src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"
+    ></script>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+  </head>
+  <body>
+    <!-- Valid: amp-component with static data and filter=prefix attribute -->
+    <amp-autocomplete filter="prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and filter=prefix attribute -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: textarea and src attr -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <textarea></textarea>
+    </amp-autocomplete>
+
+    <!-- Valid: textarea with other attr, autocomplete with src attr -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <textarea autoexpand placeholder="Reply"></textarea>
+    </amp-autocomplete>
+
+    <!-- Valid: input and src and query attr -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+      query="q"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: input and [src] attr -->
+    <amp-autocomplete filter="prefix" [src]="foo.bar">
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: input tag with type "text" and script tag -->
+    <amp-autocomplete filter="prefix">
+      <input type="text" />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: input tag with type "search" and script tag -->
+    <amp-autocomplete filter="prefix">
+      <input type="search" />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and filter=token-prefix attribute -->
+    <amp-autocomplete filter="token-prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and filter=token-prefix attribute -->
+    <amp-autocomplete
+      filter="token-prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and filter=substring attribute -->
+    <amp-autocomplete filter="substring">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and filter=substring attribute -->
+    <amp-autocomplete
+      filter="substring"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and filter=fuzzy attribute -->
+    <amp-autocomplete filter="fuzzy">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and filter=fuzzy attribute -->
+    <amp-autocomplete
+      filter="fuzzy"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and filter=none attribute -->
+    <amp-autocomplete filter="none">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and filter=none attribute -->
+    <amp-autocomplete
+      filter="none"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and filter=custom and filter-expr attribute -->
+    <amp-autocomplete filter="custom" filter-expr="true">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and filter=custom and filter-expr attribute -->
+    <amp-autocomplete
+      filter="custom"
+      filter-expr="true"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and inline=@ attribute -->
+    <amp-autocomplete inline="@" filter="prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and inline=@ attribute -->
+    <amp-autocomplete
+      filter="prefix"
+      inline="@"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and items=property attribute -->
+    <amp-autocomplete filter="prefix" items="property">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and items=property attribute -->
+    <amp-autocomplete
+      filter="prefix"
+      items="property"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and min-characters attribute -->
+    <amp-autocomplete filter="prefix" min-characters="3">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and min-characters attribute -->
+    <amp-autocomplete
+      filter="prefix"
+      min-characters="3"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and max-entries attribute -->
+    <amp-autocomplete filter="prefix" max-entries="10">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and max-entries attribute -->
+    <amp-autocomplete
+      filter="prefix"
+      max-entries="10"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component suggest-first attribute and filter attribute-->
+    <amp-autocomplete suggest-first filter="prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component suggest-first attribute and filter!="prefix" attribute-->
+    <amp-autocomplete suggest-first filter="substring">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and suggest-first attribute -->
+    <amp-autocomplete
+      suggest-first
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+      filter="prefix"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and highlight-user-entry attribute -->
+    <amp-autocomplete filter="prefix" highlight-user-entry>
+      <input type="text" />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and highlight-user-entry attribute -->
+    <amp-autocomplete
+      filter="prefix"
+      highlight-user-entry
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input type="text" />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and submit-on-enter attribute -->
+    <amp-autocomplete filter="prefix" submit-on-enter>
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and submit-on-enter attribute -->
+    <amp-autocomplete
+      filter="prefix"
+      submit-on-enter
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and rich content template -->
+    <amp-autocomplete filter="prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+      <template type="amp-mustache" id="amp-template-default">
+        <div class="city-item" data-value="{{value}}">
           <div>{{value}}</div>
           <div class="custom-population">Population: {{population}}</div>
-      </div>
-    </template>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and rich content template -->
-  <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-    <template type="amp-mustache" id="amp-template-default">
-      <div class="city-item" data-value="{{value}}">
+        </div>
+      </template>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and rich content template -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+      <template type="amp-mustache" id="amp-template-default">
+        <div class="city-item" data-value="{{value}}">
           <div>{{value}}</div>
           <div class="custom-population">Population: {{population}}</div>
-      </div>
-    </template>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and rich content template -->
-  <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-    <template type="amp-mustache" id="amp-template-default">
-      {{#disabled}}
+        </div>
+      </template>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and rich content template -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+      <template type="amp-mustache" id="amp-template-default">
+        {{#disabled}}
         <div data-disabled>
           <b>{{value}}</b>
         </div>
-      {{/disabled}}
-      {{^disabled}}
-      <div class="city-item" data-value="{{value}}">
+        {{/disabled}} {{^disabled}}
+        <div class="city-item" data-value="{{value}}">
+          <div>{{value}}</div>
+          <div class="custom-population">Population: {{population}}</div>
+        </div>
+        {{/disabled}}
+      </template>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and template attr -->
+    <amp-autocomplete filter="prefix" template="my-template-id">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and template attr -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+      template="my-template-id"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with static data and template script child -->
+    <amp-autocomplete filter="prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+      <script type="text/plain" template="amp-mustache">
+        <div class="city-item" data-value="{{value}}">
           <div>{{value}}</div>
           <div class="custom-population">Population: {{population}}</div>
-      </div>
-      {{/disabled}}
-    </template>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and template attr -->
-  <amp-autocomplete template="my-template-id">
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and template attr -->
-  <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL" template="my-template-id">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with static data and template script child -->
-  <amp-autocomplete>
-    <input>
-    <script type="application/json"> {} </script>
-    <script type="text/plain" template="amp-mustache">
-      <div class="city-item" data-value="{{value}}">
-        <div>{{value}}</div>
-        <div class="custom-population">Population: {{population}}</div>
-      </div>
-    </script>
-  </amp-autocomplete>
-
-  <!-- Valid: amp-component with remote data and template attr -->
-  <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-    <script type="application/json"> {} </script>
-    <script type="text/plain" template="amp-mustache">
-      <div class="city-item" data-value="{{value}}">
-        <div>{{value}}</div>
-        <div class="custom-population">Population: {{population}}</div>
-      </div>
-    </script>
-  </amp-autocomplete>
-
-  <!-- Invalid: width is mistyped -->
-  <amp-autocomplete widht=100>
-    <input>
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Invalid: responsive layout is not supported -->
-  <amp-autocomplete layout="responsive">
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Invalid: amp-autocomplete with invalid input types -->
-  <amp-autocomplete widht=100>
-    <input type="button">
-      <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
-  <amp-autocomplete filter="custom">
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
-  <amp-autocomplete filter="custom" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-
-  <!-- Invalid: amp-component suggest-first attribute and no filter attribute-->
-  <amp-autocomplete suggest-first>
-    <input type="text">
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Invalid: amp-autocomplete with unexpected filter -->
-  <amp-autocomplete filter="random">
-    <input>
-    <script type="application/json"> {} </script>
-  </amp-autocomplete>
-
-  <!-- Invalid: amp-autocomplete with unexpected filter and src attr -->
-  <amp-autocomplete filter="random" src="https://data.com/articles.json?ref=CANONICAL_URL">
-    <input>
-  </amp-autocomplete>
-</body>
+        </div>
+      </script>
+    </amp-autocomplete>
+
+    <!-- Valid: amp-component with remote data and template attr -->
+    <amp-autocomplete
+      filter="prefix"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+      <script type="text/plain" template="amp-mustache">
+        <div class="city-item" data-value="{{value}}">
+          <div>{{value}}</div>
+          <div class="custom-population">Population: {{population}}</div>
+        </div>
+      </script>
+    </amp-autocomplete>
+
+    <!-- Invalid: filter unspecified -->
+    <amp-autocomplete>
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Invalid: width is mistyped -->
+    <amp-autocomplete widht="100" filter="prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Invalid: responsive layout is not supported -->
+    <amp-autocomplete layout="responsive" filter="prefix">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Invalid: amp-autocomplete with invalid input types -->
+    <amp-autocomplete widht="100" filter="prefix">
+      <input type="button" />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
+    <amp-autocomplete filter="custom">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
+    <amp-autocomplete
+      filter="custom"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Invalid: amp-autocomplete with unexpected filter -->
+    <amp-autocomplete filter="random">
+      <input />
+      <script type="application/json">
+        {}
+      </script>
+    </amp-autocomplete>
+
+    <!-- Invalid: amp-autocomplete with unexpected filter and src attr -->
+    <amp-autocomplete
+      filter="random"
+      src="https://data.com/articles.json?ref=CANONICAL_URL"
+    >
+      <input />
+    </amp-autocomplete>
+
+    <!-- Invalid: amp-autocomplete with query attr missing src attr -->
+    <amp-autocomplete filter="prefix" query="q">
+      <input />
+    </amp-autocomplete>
+  </body>
 </html>
diff --git a/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.out b/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.out
index 0aa929c27bc96..608c00b4113a7 100644
--- a/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.out
+++ b/extensions/amp-autocomplete/0.1/test/validator-amp-autocomplete.out
@@ -19,329 +19,550 @@ FAIL
 |    Tests for the amp-autocomplete tag.
 |  -->
 |
-|  <!doctype html>
+|  <!DOCTYPE html>
 |  <html ⚡>
-|  <head>
-|    <meta charset="utf-8">
-|    <title>amp-autocomplete example</title>
-|    <link rel="canonical" href="amps.html">
-|    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-|    <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
-|    <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
-|    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
-|    <script async src="https://cdn.ampproject.org/v0.js"></script>
-|  </head>
-|  <body>
-|    <!-- Valid: input and script tags -->
-|    <amp-autocomplete>
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: input and src attr -->
-|    <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: input and [src] attr -->
-|    <amp-autocomplete [src]="foo.bar">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: input tag with type "text" and script tag -->
-|    <amp-autocomplete>
-|      <input type="text">
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: input tag with type "search" and script tag -->
-|    <amp-autocomplete>
-|      <input type="search">
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: input tag with type "search" and src attr -->
-|    <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and filter=prefix attribute -->
-|    <amp-autocomplete filter="prefix">
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and filter=prefix attribute -->
-|    <amp-autocomplete filter="prefix" src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and filter=token-prefix attribute -->
-|    <amp-autocomplete filter="token-prefix">
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and filter=token-prefix attribute -->
-|    <amp-autocomplete filter="token-prefix" src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and filter=substring attribute -->
-|    <amp-autocomplete filter="substring">
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and filter=substring attribute -->
-|    <amp-autocomplete filter="substring" src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and filter=fuzzy attribute -->
-|    <amp-autocomplete filter="fuzzy">
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and filter=fuzzy attribute -->
-|    <amp-autocomplete filter="fuzzy" src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and filter=none attribute -->
-|    <amp-autocomplete filter="none">
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and filter=none attribute -->
-|    <amp-autocomplete filter="none" src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and filter=custom and filter-expr attribute -->
-|    <amp-autocomplete filter="custom" filter-expr="true">
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and filter=custom and filter-expr attribute -->
-|    <amp-autocomplete filter="custom" filter-expr="true" src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and items=property attribute -->
-|    <amp-autocomplete items="property">
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and items=property attribute -->
-|    <amp-autocomplete items="property" src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and min-characters attribute -->
-|    <amp-autocomplete min-characters=3>
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and min-characters attribute -->
-|    <amp-autocomplete min-characters=3 src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|  </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and max-entries attribute -->
-|    <amp-autocomplete max-entries=10>
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and max-entries attribute -->
-|    <amp-autocomplete max-entries=10 src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component suggest-first attribute and filter attribute-->
-|    <amp-autocomplete suggest-first filter="prefix">
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component suggest-first attribute and filter!="prefix" attribute-->
-|    <amp-autocomplete suggest-first filter="substring">
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and suggest-first attribute -->
-|    <amp-autocomplete suggest-first src="https://data.com/articles.json?ref=CANONICAL_URL" filter="prefix">
-|        <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and highlight-user-entry attribute -->
-|    <amp-autocomplete highlight-user-entry>
-|      <input type="text">
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and highlight-user-entry attribute -->
-|    <amp-autocomplete highlight-user-entry src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input type="text">
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and submit-on-enter attribute -->
-|    <amp-autocomplete submit-on-enter>
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and submit-on-enter attribute -->
-|    <amp-autocomplete submit-on-enter src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and rich content template -->
-|    <amp-autocomplete>
-|      <input>
-|      <script type="application/json"> {} </script>
-|      <template type="amp-mustache" id="amp-template-default">
-|        <div class="city-item" data-value="{{value}}">
+|    <head>
+|      <meta charset="utf-8" />
+|      <title>amp-autocomplete example</title>
+|      <link rel="canonical" href="amps.html" />
+|      <meta
+|        name="viewport"
+|        content="width=device-width,minimum-scale=1,initial-scale=1"
+|      />
+|      <style amp-boilerplate>
+|        body {
+|          -webkit-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+|          -moz-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+|          -ms-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+|          animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+|        }
+|        @-webkit-keyframes -amp-start {
+|          from {
+|            visibility: hidden;
+|          }
+|          to {
+|            visibility: visible;
+|          }
+|        }
+|        @-moz-keyframes -amp-start {
+|          from {
+|            visibility: hidden;
+|          }
+|          to {
+|            visibility: visible;
+|          }
+|        }
+|        @-ms-keyframes -amp-start {
+|          from {
+|            visibility: hidden;
+|          }
+|          to {
+|            visibility: visible;
+|          }
+|        }
+|        @-o-keyframes -amp-start {
+|          from {
+|            visibility: hidden;
+|          }
+|          to {
+|            visibility: visible;
+|          }
+|        }
+|        @keyframes -amp-start {
+|          from {
+|            visibility: hidden;
+|          }
+|          to {
+|            visibility: visible;
+|          }
+|        }
+|      </style>
+|      <noscript
+|        ><style amp-boilerplate>
+|          body {
+|            -webkit-animation: none;
+|            -moz-animation: none;
+|            -ms-animation: none;
+|            animation: none;
+|          }
+|        </style></noscript
+|      >
+|      <script
+|        async
+|        custom-element="amp-autocomplete"
+|        src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"
+|      ></script>
+|      <script
+|        async
+|        custom-element="amp-bind"
+|        src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"
+|      ></script>
+|      <script
+|        async
+|        custom-element="amp-form"
+|        src="https://cdn.ampproject.org/v0/amp-form-0.1.js"
+|      ></script>
+|      <script
+|        async
+|        custom-template="amp-mustache"
+|        src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"
+|      ></script>
+|      <script async src="https://cdn.ampproject.org/v0.js"></script>
+|    </head>
+|    <body>
+|      <!-- Valid: amp-component with static data and filter=prefix attribute -->
+|      <amp-autocomplete filter="prefix">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and filter=prefix attribute -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: textarea and src attr -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <textarea></textarea>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: textarea with other attr, autocomplete with src attr -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <textarea autoexpand placeholder="Reply"></textarea>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: input and src and query attr -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|        query="q"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: input and [src] attr -->
+|      <amp-autocomplete filter="prefix" [src]="foo.bar">
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: input tag with type "text" and script tag -->
+|      <amp-autocomplete filter="prefix">
+|        <input type="text" />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: input tag with type "search" and script tag -->
+|      <amp-autocomplete filter="prefix">
+|        <input type="search" />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and filter=token-prefix attribute -->
+|      <amp-autocomplete filter="token-prefix">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and filter=token-prefix attribute -->
+|      <amp-autocomplete
+|        filter="token-prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and filter=substring attribute -->
+|      <amp-autocomplete filter="substring">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and filter=substring attribute -->
+|      <amp-autocomplete
+|        filter="substring"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and filter=fuzzy attribute -->
+|      <amp-autocomplete filter="fuzzy">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and filter=fuzzy attribute -->
+|      <amp-autocomplete
+|        filter="fuzzy"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and filter=none attribute -->
+|      <amp-autocomplete filter="none">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and filter=none attribute -->
+|      <amp-autocomplete
+|        filter="none"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and filter=custom and filter-expr attribute -->
+|      <amp-autocomplete filter="custom" filter-expr="true">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and filter=custom and filter-expr attribute -->
+|      <amp-autocomplete
+|        filter="custom"
+|        filter-expr="true"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and inline=@ attribute -->
+|      <amp-autocomplete inline="@" filter="prefix">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and inline=@ attribute -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        inline="@"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and items=property attribute -->
+|      <amp-autocomplete filter="prefix" items="property">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and items=property attribute -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        items="property"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and min-characters attribute -->
+|      <amp-autocomplete filter="prefix" min-characters="3">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and min-characters attribute -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        min-characters="3"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and max-entries attribute -->
+|      <amp-autocomplete filter="prefix" max-entries="10">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and max-entries attribute -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        max-entries="10"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component suggest-first attribute and filter attribute-->
+|      <amp-autocomplete suggest-first filter="prefix">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component suggest-first attribute and filter!="prefix" attribute-->
+|      <amp-autocomplete suggest-first filter="substring">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and suggest-first attribute -->
+|      <amp-autocomplete
+|        suggest-first
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|        filter="prefix"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and highlight-user-entry attribute -->
+|      <amp-autocomplete filter="prefix" highlight-user-entry>
+|        <input type="text" />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and highlight-user-entry attribute -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        highlight-user-entry
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input type="text" />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and submit-on-enter attribute -->
+|      <amp-autocomplete filter="prefix" submit-on-enter>
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and submit-on-enter attribute -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        submit-on-enter
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and rich content template -->
+|      <amp-autocomplete filter="prefix">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|        <template type="amp-mustache" id="amp-template-default">
+|          <div class="city-item" data-value="{{value}}">
 |            <div>{{value}}</div>
 |            <div class="custom-population">Population: {{population}}</div>
-|        </div>
-|      </template>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and rich content template -->
-|    <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|      <template type="amp-mustache" id="amp-template-default">
-|        <div class="city-item" data-value="{{value}}">
+|          </div>
+|        </template>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and rich content template -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|        <template type="amp-mustache" id="amp-template-default">
+|          <div class="city-item" data-value="{{value}}">
 |            <div>{{value}}</div>
 |            <div class="custom-population">Population: {{population}}</div>
-|        </div>
-|      </template>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and rich content template -->
-|    <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|      <template type="amp-mustache" id="amp-template-default">
-|        {{#disabled}}
+|          </div>
+|        </template>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and rich content template -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|        <template type="amp-mustache" id="amp-template-default">
+|          {{#disabled}}
 |          <div data-disabled>
 |            <b>{{value}}</b>
 |          </div>
-|        {{/disabled}}
-|        {{^disabled}}
-|        <div class="city-item" data-value="{{value}}">
+|          {{/disabled}} {{^disabled}}
+|          <div class="city-item" data-value="{{value}}">
+|            <div>{{value}}</div>
+|            <div class="custom-population">Population: {{population}}</div>
+|          </div>
+|          {{/disabled}}
+|        </template>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and template attr -->
+|      <amp-autocomplete filter="prefix" template="my-template-id">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and template attr -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|        template="my-template-id"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with static data and template script child -->
+|      <amp-autocomplete filter="prefix">
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|        <script type="text/plain" template="amp-mustache">
+|          <div class="city-item" data-value="{{value}}">
 |            <div>{{value}}</div>
 |            <div class="custom-population">Population: {{population}}</div>
-|        </div>
-|        {{/disabled}}
-|      </template>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and template attr -->
-|    <amp-autocomplete template="my-template-id">
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and template attr -->
-|    <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL" template="my-template-id">
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with static data and template script child -->
-|    <amp-autocomplete>
-|      <input>
-|      <script type="application/json"> {} </script>
-|      <script type="text/plain" template="amp-mustache">
-|        <div class="city-item" data-value="{{value}}">
-|          <div>{{value}}</div>
-|          <div class="custom-population">Population: {{population}}</div>
-|        </div>
-|      </script>
-|    </amp-autocomplete>
-|
-|    <!-- Valid: amp-component with remote data and template attr -->
-|    <amp-autocomplete src="https://data.com/articles.json?ref=CANONICAL_URL">
-|      <input>
-|      <script type="application/json"> {} </script>
-|      <script type="text/plain" template="amp-mustache">
-|        <div class="city-item" data-value="{{value}}">
-|          <div>{{value}}</div>
-|          <div class="custom-population">Population: {{population}}</div>
-|        </div>
-|      </script>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: width is mistyped -->
-|    <amp-autocomplete widht=100>
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:283:2 The attribute 'widht' may not appear in tag 'amp-autocomplete'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input>
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: responsive layout is not supported -->
-|    <amp-autocomplete layout="responsive">
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:289:2 The specified layout 'RESPONSIVE' is not supported by tag 'amp-autocomplete'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: amp-autocomplete with invalid input types -->
-|    <amp-autocomplete widht=100>
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:295:2 The attribute 'widht' may not appear in tag 'amp-autocomplete'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input type="button">
+|          </div>
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Valid: amp-component with remote data and template attr -->
+|      <amp-autocomplete
+|        filter="prefix"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|        <script type="text/plain" template="amp-mustache">
+|          <div class="city-item" data-value="{{value}}">
+|            <div>{{value}}</div>
+|            <div class="custom-population">Population: {{population}}</div>
+|          </div>
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: filter unspecified -->
+|      <amp-autocomplete>
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:479:4 The mandatory attribute 'filter' is missing in tag 'amp-autocomplete'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: width is mistyped -->
+|      <amp-autocomplete widht="100" filter="prefix">
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:487:4 The attribute 'widht' may not appear in tag 'amp-autocomplete'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: responsive layout is not supported -->
+|      <amp-autocomplete layout="responsive" filter="prefix">
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:495:4 The specified layout 'RESPONSIVE' is not supported by tag 'amp-autocomplete'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: amp-autocomplete with invalid input types -->
+|      <amp-autocomplete widht="100" filter="prefix">
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:503:4 The attribute 'widht' may not appear in tag 'amp-autocomplete'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        <input type="button" />
+>>       ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:504:6 The attribute 'type' in tag 'input' is set to the invalid value 'button'. (see https://amp.dev/documentation/components/amp-form)
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
+|      <amp-autocomplete filter="custom">
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:511:4 The attribute 'filter-expr' in tag 'amp-autocomplete' is missing or incorrect, but required by attribute 'filter'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
+|      <amp-autocomplete
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:519:4 The attribute 'filter-expr' in tag 'amp-autocomplete' is missing or incorrect, but required by attribute 'filter'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        filter="custom"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: amp-autocomplete with unexpected filter -->
+|      <amp-autocomplete filter="random">
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:527:4 The attribute 'filter' in tag 'amp-autocomplete' is set to the invalid value 'random'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        <input />
+|        <script type="application/json">
+|          {}
+|        </script>
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: amp-autocomplete with unexpected filter and src attr -->
+|      <amp-autocomplete
+>>     ^~~~~~~~~
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:535:4 The attribute 'filter' in tag 'amp-autocomplete' is set to the invalid value 'random'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        filter="random"
+|        src="https://data.com/articles.json?ref=CANONICAL_URL"
+|      >
+|        <input />
+|      </amp-autocomplete>
+|
+|      <!-- Invalid: amp-autocomplete with query attr missing src attr -->
+|      <amp-autocomplete filter="prefix" query="q">
 >>     ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:296:4 The attribute 'type' in tag 'input' is set to the invalid value 'button'. (see https://amp.dev/documentation/components/amp-form)
-|        <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
-|    <amp-autocomplete filter="custom">
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:301:2 The attribute 'filter-expr' in tag 'amp-autocomplete' is missing or incorrect, but required by attribute 'filter'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: amp-autocomplete with filter=custom and no filter-expr attribute -->
-|    <amp-autocomplete filter="custom" src="https://data.com/articles.json?ref=CANONICAL_URL">
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:307:2 The attribute 'filter-expr' in tag 'amp-autocomplete' is missing or incorrect, but required by attribute 'filter'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: amp-component suggest-first attribute and no filter attribute-->
-|    <amp-autocomplete suggest-first>
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:312:2 The attribute 'filter' in tag 'amp-autocomplete' is missing or incorrect, but required by attribute 'suggest-first'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input type="text">
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: amp-autocomplete with unexpected filter -->
-|    <amp-autocomplete filter="random">
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:318:2 The attribute 'filter' in tag 'amp-autocomplete' is set to the invalid value 'random'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input>
-|      <script type="application/json"> {} </script>
-|    </amp-autocomplete>
-|
-|    <!-- Invalid: amp-autocomplete with unexpected filter and src attr -->
-|    <amp-autocomplete filter="random" src="https://data.com/articles.json?ref=CANONICAL_URL">
->>   ^~~~~~~~~
-amp-autocomplete/0.1/test/validator-amp-autocomplete.html:324:2 The attribute 'filter' in tag 'amp-autocomplete' is set to the invalid value 'random'. (see https://amp.dev/documentation/components/amp-autocomplete)
-|      <input>
-|    </amp-autocomplete>
-|  </body>
+amp-autocomplete/0.1/test/validator-amp-autocomplete.html:543:4 The attribute 'src' in tag 'amp-autocomplete' is missing or incorrect, but required by attribute 'query'. (see https://amp.dev/documentation/components/amp-autocomplete)
+|        <input />
+|      </amp-autocomplete>
+|    </body>
 |  </html>
diff --git a/extensions/amp-autocomplete/amp-autocomplete.md b/extensions/amp-autocomplete/amp-autocomplete.md
index cfe28bd5bfd59..eed1c4b6ce358 100644
--- a/extensions/amp-autocomplete/amp-autocomplete.md
+++ b/extensions/amp-autocomplete/amp-autocomplete.md
@@ -59,7 +59,7 @@ Example:
 <amp-autocomplete filter="substring" id="myAutocomplete">
   <input />
   <script type="application/json">
-    { "items": ["a", "b", "c"] }
+    {"items": ["a", "b", "c"]}
   </script>
 </amp-autocomplete>
 ```
@@ -84,6 +84,11 @@ Example:
     <td>The URL of the remote endpoint that returns the JSON that will be filtered and rendered within this <code>amp-autocomplete</code>. This must be a CORS HTTP service and the URL's protocol must be HTTPS. The endpoint must implement the requirements specified in the <a href="https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests?referrer=ampproject.org">CORS Requests in AMP</a> spec. If fetching the data at the src URL fails, the <code>amp-autocomplete</code> triggers a fallback. The src attribute may be omitted if the <code>[src]</code> attribute exists.
     </td>
   </tr>
+  <tr>
+    <td width="40%"><strong>query (optional)</strong></td>
+    <td>The query parameter to generate a static remote endpoint that returns the JSON that will be filtered and rendered within this <code>amp-autocomplete</code>. This requires the presence of the <code>src</code> attribute. For example, if <code>src="http://www.example.com"</code> and <code>query="q"</code>, then when a user types in <code>abc</code>, the component will retrieve data from <code>http://www.example.com?q=abc</code>.
+    </td>
+  </tr>
   <tr>
     <td width="40%"><strong>filter-expr (optional)</strong></td>
     <td>Required if <code>filter==custom</code></td>
@@ -148,6 +153,11 @@ Example:
       In the first example, the JSON payload is queued by the "items" key, and thus no component attribute is needed because the default value corresponds. In the second example, the JSON payload is queued by the "fruit" key, so the <code>items</code> attribute is given the value <code>"fruit"</code> so as to accurately etrieve the intended datasource. In both examples, the end user interaction is the same.
     </td>
   </tr>
+  <tr>
+    <td width="40%"><strong>inline (optional)</strong></td>
+    <td>Whether the <code>amp-autocomplete</code> should autosuggest on the full user input or only a triggered substring of the user input. By default when the attribute is absent, suggestions will be based on the full user input. The attribute cannot have an empty value but must take a single character token, i.e. <code>@</code> which activates the autocomplete behavior. For example, if <code>inline="@"</code> then user input of <code>hello</code> will not retrieve suggestions but a user input of <code>hello @abc</code> might trigger options filtered on the substring <code>abc</code>. Currently triggered substrings are delimited on whitespace characters, however this is subject to change in the future.
+    </td>
+  </tr>
 </table>
 
 ## Events
diff --git a/extensions/amp-autocomplete/validator-amp-autocomplete.protoascii b/extensions/amp-autocomplete/validator-amp-autocomplete.protoascii
index 803ec9a2c354f..4d51a74030ac1 100644
--- a/extensions/amp-autocomplete/validator-amp-autocomplete.protoascii
+++ b/extensions/amp-autocomplete/validator-amp-autocomplete.protoascii
@@ -41,14 +41,24 @@ tags: {  # <amp-autocomplete>
       if_value_regex: "custom"
       also_requires_attr: "filter-expr"
     }
+    mandatory: true
   }
   attrs: {
     name: "filter-expr"
     requires_extension: "amp-bind"
   }
   attrs: { name: "filter-value" }
+  attrs: { name: "highlight-user-entry" }
+  attrs: { name: "inline" }
+  attrs: { name: "items" }
   attrs: { name: "max-entries" }
   attrs: { name: "min-characters" }
+  attrs: {
+    name: "query"
+    trigger: {
+      also_requires_attr: "src"
+    }
+  }
   attrs: {
     name: "src"
     value_url: {
@@ -59,13 +69,8 @@ tags: {  # <amp-autocomplete>
   attrs: { name: "submit-on-enter" }
   attrs: {
     name: "suggest-first"
-    trigger: {
-      also_requires_attr: "filter"
-    }
   }
-  attrs: { name: "highlight-user-entry" }
   attrs: { name: "template" }
-  attrs: { name: "items" }
   # amp-bind
   attrs: {
     name: "[src]"
diff --git a/extensions/amp-base-carousel/0.1/amp-base-carousel.css b/extensions/amp-base-carousel/0.1/amp-base-carousel.css
index a4429d1633879..dbffa37f82ac4 100644
--- a/extensions/amp-base-carousel/0.1/amp-base-carousel.css
+++ b/extensions/amp-base-carousel/0.1/amp-base-carousel.css
@@ -61,8 +61,8 @@ amp-base-carousel[dir="rtl"] .i-amphtml-base-carousel-arrow-next-slot {
 
 amp-base-carousel[loop="false"] .i-amphtml-base-carousel-arrow-prev-slot > [disabled],
 amp-base-carousel[loop="false"] .i-amphtml-base-carousel-arrow-next-slot > [disabled],
-amp-base-carousel[i-amphtml-base-carousel-hide-buttons] .i-amphtml-base-carousel-arrow-prev-slot,
-amp-base-carousel[i-amphtml-base-carousel-hide-buttons] .i-amphtml-base-carousel-arrow-next-slot {
+amp-base-carousel[i-amphtml-base-carousel-hide-buttons] .i-amphtml-base-carousel-arrow-prev-slot > *,
+amp-base-carousel[i-amphtml-base-carousel-hide-buttons] .i-amphtml-base-carousel-arrow-next-slot > * {
   opacity: 0;
   /** 
    * Note, screen readers can still activate the buttons when hide buttons is
@@ -71,25 +71,134 @@ amp-base-carousel[i-amphtml-base-carousel-hide-buttons] .i-amphtml-base-carousel
   pointer-events: none;
 }
 
-.i-amphtml-base-carousel-prev,
-.i-amphtml-base-carousel-next {
-  filter: drop-shadow(0px 1px 2px #4a4a4a);
-  width: 40px;
-  height: 40px;
-  padding: 20px;
+.i-amphtml-base-carousel-arrow-backdrop,
+.i-amphtml-base-carousel-arrow-background,
+.i-amphtml-base-carousel-arrow-frosting {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+}
+
+
+.i-amphtml-base-carousel-arrow-frosting {
+  /**
+   * Add a frosted glass effect to the pagination dots background. The backdrop
+   * and background elements will apply a darkening on top of the blurring.
+   */
+  backdrop-filter: blur(3px);
+}
+
+.i-amphtml-base-carousel-arrow-backdrop {
+  /**
+   * Instead of using a plain background color, we use a backdrop-filter to
+   * make the effective background partially dependent on the current
+   * backdrop (e.g. the image on a carousel slide). This allows the pagination
+   * backgroud to be distinguishable on very dark backgrounds, while still
+   * having it be semi-transparent.
+   *
+   * This can be harder to distinguish on middle greys. For this current
+   * current configuration, hsl(0, 0%, 31%) to hsl(0, 0%, 35%) can appear quite
+   * close to the background color.
+   *
+   * The blur here is used for averaging the backdrop color, so that sharp
+   * contrasts (e.g. edge of sky and landscape) do not cause immediate shifts
+   * in the container color.
+   *
+   * The greyscale is used to have the container slightly tinted by the inverse
+   * color, but also not be too tinted.
+   */
+   backdrop-filter: blur(12px) invert(1) grayscale(0.6) brightness(0.8);
+   /**
+    * Note: we use a opacity rather than a filter function due to a bug in
+    * Chrome: https://bugs.chromium.org/p/chromium/issues/detail?id=991656.
+    * Otherwise, we could use the opacity function and combine this with the
+    * i-amphtml-inline-gallery-pagination-background class as the background of the pagination container
+    * rather than needing two separate Elements for it.
+    */
+   opacity: 0.5;
+}
+
+.i-amphtml-base-carousel-arrow-background {
+  /**
+   * Note: we always add some darkening using background-color, since we do not
+   * change the dot color. Note that this applies on top of the backdrop based
+   * color, rather than affecting it.
+   */
+  background-color: rgba(0, 0, 0, 0.3);
+  box-shadow:
+      0 0 0px 1px rgba(0, 0, 0, 0.08) inset,
+      0 1px 4px 1px rgba(0, 0, 0, 0.2);
+  transition: 200ms background-color;
+}
+
+/**
+ * Only do hover state for devices that support it to workaround iOS showing
+ * the hover state after you click a button.
+ */
+@media (hover: hover) {
+  .i-amphtml-base-carousel-arrow:hover .i-amphtml-base-carousel-arrow-background {
+    background-color: rgba(255, 255, 255, 0.8);
+  }
+}
+
+.i-amphtml-base-carousel-arrow:active .i-amphtml-base-carousel-arrow-background {
+  background-color: rgba(255, 255, 255, 1.0);
+  transition-duration: 0ms;
+}
+
+.i-amphtml-base-carousel-arrow {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 36px;
+  height: 36px;
+  padding: 0;
+  margin: 12px;
   background-color: transparent;
   border: none;
   outline: none;
+  stroke: #fff;
+  transition: 200ms stroke;
 }
 
-.i-amphtml-base-carousel-prev {
-  background-image: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path  d="M14,7.4 L9.4,12 L14,16.6" fill="none" stroke="#fff" stroke-width="2px" stroke-linejoin="round" stroke-linecap="round" /></svg>');
+/**
+ * Only do hover state for devices that support it to workaround iOS showing
+ * the hover state after you click a button.
+ */
+ @media (hover: hover) {
+  .i-amphtml-base-carousel-arrow:hover {
+    stroke: #222;
+  }
 }
 
-.i-amphtml-base-carousel-next {
-  background-image: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path  d="M10,7.4 L14.6,12 L10,16.6" fill="none" stroke="#fff" stroke-width="2px" stroke-linejoin="round" stroke-linecap="round" /></svg>');
+.i-amphtml-base-carousel-arrow:active {
+  stroke: #222;
+  transition-duration: 0ms;
 }
 
+.i-amphtml-base-carousel-arrow-icon {
+  position: relative;
+  z-index: 1;
+  width: 24px;
+  height: 24px;
+}
+
+.i-amphtml-base-carousel-arrow-background,
+.i-amphtml-base-carousel-arrow-icon {
+  /**
+   * Workaround for iOS not stacking things correctly, causing the arrow
+   * components to mix incorrectly. This may work by forcing a separate layer
+   * where z-index may not do so correctly. Note this issue does not occur on
+   * all pages.
+   */
+  transform: translateZ(1px);
+}
+
+
 amp-base-carousel .i-amphtml-carousel-slotted > .i-amphtml-replaced-content {
   /*
    * Apply contain object-fit to all replaced content to avoid distorted ratios.
diff --git a/extensions/amp-base-carousel/0.1/amp-base-carousel.js b/extensions/amp-base-carousel/0.1/amp-base-carousel.js
index b664605ba41d2..3c8f5b4cfc99f 100644
--- a/extensions/amp-base-carousel/0.1/amp-base-carousel.js
+++ b/extensions/amp-base-carousel/0.1/amp-base-carousel.js
@@ -20,29 +20,40 @@ import {CSS} from '../../../build/amp-base-carousel-0.1.css';
 import {Carousel} from './carousel.js';
 import {CarouselEvents} from './carousel-events';
 import {ChildLayoutManager} from './child-layout-manager';
+import {Keys} from '../../../src/utils/key-codes';
 import {
   ResponsiveAttributes,
   getResponsiveAttributeValue,
 } from './responsive-attributes';
 import {Services} from '../../../src/services';
 import {createCustomEvent, getDetail} from '../../../src/event-helper';
-import {dev} from '../../../src/log';
+import {dev, devAssert} from '../../../src/log';
 import {dict} from '../../../src/utils/object';
 import {htmlFor} from '../../../src/static-template';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {
+  isRTL,
   iterateCursor,
   scopedQuerySelectorAll,
   toggleAttribute,
 } from '../../../src/dom';
 import {toArray} from '../../../src/types';
 
+/**
+ * @enum {number}
+ */
+const Controls = {
+  ALWAYS: 0,
+  NEVER: 1,
+  AUTO: 2,
+};
+
 /**
  * @param {!Element} el The Element to check.
  * @return {boolean} Whether or not the Element is a sizer Element.
  */
 function isSizer(el) {
-  return el.tagName == 'I-AMPHTML-SIZER';
+  return el.tagName === 'I-AMPHTML-SIZER';
 }
 
 class AmpCarousel extends AMP.BaseElement {
@@ -83,6 +94,9 @@ class AmpCarousel extends AMP.BaseElement {
 
     /** @private {?ChildLayoutManager} */
     this.childLayoutManager_ = null;
+
+    /** @private {!Controls} */
+    this.controls_ = Controls.AUTO;
   }
 
   /**
@@ -96,7 +110,7 @@ class AmpCarousel extends AMP.BaseElement {
         this.carousel_.updateAdvanceCount(Number(newValue) || 0);
       },
       'auto-advance': newValue => {
-        this.carousel_.updateAutoAdvance(newValue == 'true');
+        this.carousel_.updateAutoAdvance(newValue === 'true');
       },
       'auto-advance-count': newValue => {
         this.carousel_.updateAutoAdvanceCount(Number(newValue) || 0);
@@ -107,23 +121,26 @@ class AmpCarousel extends AMP.BaseElement {
       'auto-advance-loops': newValue => {
         this.carousel_.updateAutoAdvanceLoops(Number(newValue) || 0);
       },
+      'controls': newValue => {
+        this.updateControls_(newValue);
+      },
       'dir': newValue => {
         this.carousel_.updateForwards(newValue != 'rtl');
       },
       'horizontal': newValue => {
-        this.carousel_.updateHorizontal(newValue == 'true');
+        this.carousel_.updateHorizontal(newValue === 'true');
       },
       'loop': newValue => {
-        this.carousel_.updateLoop(newValue == 'true');
+        this.carousel_.updateLoop(newValue === 'true');
       },
       'mixed-length': newValue => {
-        this.carousel_.updateMixedLength(newValue == 'true');
+        this.carousel_.updateMixedLength(newValue === 'true');
       },
       'slide': newValue => {
         this.carousel_.goToSlide(Number(newValue));
       },
       'snap': newValue => {
-        this.carousel_.updateSnap(newValue == 'true');
+        this.carousel_.updateSnap(newValue === 'true');
       },
       'snap-align': newValue => {
         this.carousel_.updateAlignment(newValue);
@@ -206,12 +223,19 @@ class AmpCarousel extends AMP.BaseElement {
     }
   }
 
+  /**
+   * @return {!Array<!Element>} The slides in the carousel.
+   */
+  getSlides() {
+    return this.slides_;
+  }
+
   /**
    * Moves the Carousel to a given index.
    * @param {number} index
    */
-  goToSlide(index) {
-    this.carousel_.goToSlide(index, {smoothScroll: false});
+  goToSlide(index, {smoothScroll = false, actionSource} = {}) {
+    this.carousel_.goToSlide(index, {smoothScroll, actionSource});
   }
 
   /**
@@ -241,9 +265,9 @@ class AmpCarousel extends AMP.BaseElement {
     // Figure out which "slot" the children go into.
     children.forEach(c => {
       const slot = c.getAttribute('slot');
-      if (slot == 'prev-arrow') {
+      if (slot === 'prev-arrow') {
         prevArrow = c;
-      } else if (slot == 'next-arrow') {
+      } else if (slot === 'next-arrow') {
         nextArrow = c;
       } else if (!isSizer(c)) {
         this.slides_.push(c);
@@ -278,7 +302,7 @@ class AmpCarousel extends AMP.BaseElement {
     const html = htmlFor(this.element);
     return html`
       <div class="i-amphtml-carousel-content">
-        <div class="i-amphtml-carousel-scroll"></div>
+        <div class="i-amphtml-carousel-scroll" tabindex="-1"></div>
         <div class="i-amphtml-base-carousel-arrows">
           <div class="i-amphtml-base-carousel-arrow-prev-slot"></div>
           <div class="i-amphtml-base-carousel-arrow-next-slot"></div>
@@ -295,9 +319,22 @@ class AmpCarousel extends AMP.BaseElement {
     const html = htmlFor(this.element);
     return html`
       <button
-        class="i-amphtml-base-carousel-next"
+        class="i-amphtml-base-carousel-arrow"
         aria-label="Next item in carousel"
-      ></button>
+      >
+        <div class="i-amphtml-base-carousel-arrow-frosting"></div>
+        <div class="i-amphtml-base-carousel-arrow-backdrop"></div>
+        <div class="i-amphtml-base-carousel-arrow-background"></div>
+        <svg class="i-amphtml-base-carousel-arrow-icon" viewBox="0 0 24 24">
+          <path
+            d="M10,7.4 L14.6,12 L10,16.6"
+            fill="none"
+            stroke-width="2px"
+            stroke-linejoin="round"
+            stroke-linecap="round"
+          />
+        </svg>
+      </button>
     `;
   }
 
@@ -309,9 +346,22 @@ class AmpCarousel extends AMP.BaseElement {
     const html = htmlFor(this.element);
     return html`
       <button
-        class="i-amphtml-base-carousel-prev"
+        class="i-amphtml-base-carousel-arrow"
         aria-label="Previous item in carousel"
-      ></button>
+      >
+        <div class="i-amphtml-base-carousel-arrow-frosting"></div>
+        <div class="i-amphtml-base-carousel-arrow-backdrop"></div>
+        <div class="i-amphtml-base-carousel-arrow-background"></div>
+        <svg class="i-amphtml-base-carousel-arrow-icon" viewBox="0 0 24 24">
+          <path
+            d="M14,7.4 L9.4,12 L14,16.6"
+            fill="none"
+            stroke-width="2px"
+            stroke-linejoin="round"
+            stroke-linecap="round"
+          />
+        </svg>
+      </button>
     `;
   }
 
@@ -371,21 +421,24 @@ class AmpCarousel extends AMP.BaseElement {
   initializeActions_() {
     this.registerAction(
       'prev',
-      ({trust}) => {
+      actionInvocation => {
+        const {trust} = actionInvocation;
         this.carousel_.prev(this.getActionSource_(trust));
       },
       ActionTrust.LOW
     );
     this.registerAction(
       'next',
-      ({trust}) => {
+      actionInvocation => {
+        const {trust} = actionInvocation;
         this.carousel_.next(this.getActionSource_(trust));
       },
       ActionTrust.LOW
     );
     this.registerAction(
       'goToSlide',
-      ({args, trust}) => {
+      actionInvocation => {
+        const {args, trust} = actionInvocation;
         this.carousel_.goToSlide(args['index'] || -1, {
           actionSource: this.getActionSource_(trust),
         });
@@ -414,6 +467,9 @@ class AmpCarousel extends AMP.BaseElement {
       const detail = getDetail(event);
       this.carousel_.goToSlide(detail['index']);
     });
+    this.element.addEventListener('keydown', event => {
+      this.onKeydown_(event);
+    });
     this.prevArrowSlot_.addEventListener('click', event => {
       // Make sure the slot itself was not clicked, since that fills the
       // entire height of the gallery.
@@ -430,6 +486,40 @@ class AmpCarousel extends AMP.BaseElement {
     });
   }
 
+  /**
+   * @return {boolean} Whether or not controls should be hidden.
+   */
+  shouldHideControls_() {
+    if (this.controls_ === Controls.NEVER) {
+      return true;
+    }
+
+    if (this.controls_ === Controls.ALWAYS) {
+      return false;
+    }
+
+    return this.hadTouch_;
+  }
+
+  /**
+   * @param {string} controls
+   * @private
+   */
+  updateControls_(controls) {
+    switch (controls) {
+      case 'always':
+        this.controls_ = Controls.ALWAYS;
+        break;
+      case 'never':
+        this.controls_ = Controls.NEVER;
+        break;
+      default:
+        this.controls_ = Controls.AUTO;
+        break;
+    }
+    this.updateUi_();
+  }
+
   /**
    * Updates the UI of the <amp-base-carousel> itself, but not the internal
    * implementation.
@@ -441,17 +531,17 @@ class AmpCarousel extends AMP.BaseElement {
     // TODO(sparhami) for Shadow DOM, we will need to get the assigned nodes
     // instead.
     iterateCursor(this.prevArrowSlot_.children, child => {
-      const disabled = !loop && index == 0;
+      const disabled = !loop && index === 0;
       toggleAttribute(child, 'disabled', disabled);
     });
     iterateCursor(this.nextArrowSlot_.children, child => {
-      const disabled = !loop && index == this.slides_.length - 1;
+      const disabled = !loop && index === this.slides_.length - 1;
       toggleAttribute(child, 'disabled', disabled);
     });
     toggleAttribute(
       this.element,
       'i-amphtml-base-carousel-hide-buttons',
-      this.hadTouch_
+      this.shouldHideControls_()
     );
   }
 
@@ -476,6 +566,31 @@ class AmpCarousel extends AMP.BaseElement {
     this.updateUi_();
   }
 
+  /**
+   * Handle a keyup, potentially going to the next/previous set of slides,
+   * depending on the carousel configuration.
+   * @param {!Event} event
+   */
+  onKeydown_(event) {
+    const isRight = event.key === Keys.RIGHT_ARROW;
+    const isLeft = event.key === Keys.LEFT_ARROW;
+
+    if (!isRight && !isLeft) {
+      return;
+    }
+
+    const rtl = isRTL(devAssert(this.element.ownerDocument));
+    const next = (isRight && !rtl) || (isLeft && rtl);
+
+    if (next) {
+      this.carousel_.next();
+    } else {
+      this.carousel_.prev();
+    }
+
+    event.preventDefault();
+  }
+
   /**
    * @return {number} The initial index for the carousel.
    * @private
@@ -492,9 +607,9 @@ class AmpCarousel extends AMP.BaseElement {
    */
   isHighTrustActionSource_(actionSource) {
     return (
-      actionSource == ActionSource.WHEEL ||
-      actionSource == ActionSource.TOUCH ||
-      actionSource == ActionSource.GENERIC_HIGH_TRUST
+      actionSource === ActionSource.WHEEL ||
+      actionSource === ActionSource.TOUCH ||
+      actionSource === ActionSource.GENERIC_HIGH_TRUST
     );
   }
 
@@ -514,7 +629,7 @@ class AmpCarousel extends AMP.BaseElement {
     const action = createCustomEvent(this.win, `slidescroll.${name}`, data);
     this.action_.trigger(this.element, name, action, trust);
     this.element.dispatchCustomEvent(name, data);
-    this.hadTouch_ = this.hadTouch_ || actionSource == ActionSource.TOUCH;
+    this.hadTouch_ = this.hadTouch_ || actionSource === ActionSource.TOUCH;
     this.updateUi_();
   }
 
diff --git a/extensions/amp-base-carousel/0.1/array-util.js b/extensions/amp-base-carousel/0.1/array-util.js
index f8e721bbe8280..9cbd0837bfc17 100644
--- a/extensions/amp-base-carousel/0.1/array-util.js
+++ b/extensions/amp-base-carousel/0.1/array-util.js
@@ -25,7 +25,8 @@ import {mod} from '../../../src/utils/math';
  * @param {!IArrayLike} arr An array like Object.
  * @return {number}
  */
-export function forwardWrappingDistance(a, b, {length}) {
+export function forwardWrappingDistance(a, b, arr) {
+  const {length} = arr;
   return a === b ? length : mod(b - a, length);
 }
 
@@ -38,6 +39,7 @@ export function forwardWrappingDistance(a, b, {length}) {
  * @param {!IArrayLike} arr An array like Object.
  * @return {number}
  */
-export function backwardWrappingDistance(a, b, {length}) {
+export function backwardWrappingDistance(a, b, arr) {
+  const {length} = arr;
   return a === b ? length : mod(a - b, length);
 }
diff --git a/extensions/amp-base-carousel/0.1/auto-advance.js b/extensions/amp-base-carousel/0.1/auto-advance.js
index b9b722cda4cf3..5493d6c74a5da 100644
--- a/extensions/amp-base-carousel/0.1/auto-advance.js
+++ b/extensions/amp-base-carousel/0.1/auto-advance.js
@@ -15,8 +15,9 @@
  */
 
 import {ActionSource} from './action-source';
+import {CarouselEvents} from './carousel-events';
 import {debounce} from '../../../src/utils/rate-limit';
-import {listen, listenOnce} from '../../../src/event-helper';
+import {getDetail, listen, listenOnce} from '../../../src/event-helper';
 
 const MIN_AUTO_ADVANCE_INTERVAL = 1000;
 
@@ -41,11 +42,13 @@ export class AutoAdvance {
   /**
    * @param {{
    *   win: !Window,
+   *   element: !Element,
    *   scrollContainer: !Element,
    *   advanceable: !AdvanceDef
    * }} config
    */
-  constructor({win, scrollContainer, advanceable}) {
+  constructor(config) {
+    const {win, element, scrollContainer, advanceable} = config;
     /** @private @const */
     this.win_ = win;
 
@@ -91,6 +94,9 @@ export class AutoAdvance {
       () => this.handleTouchStart_(),
       {capture: true, passive: true}
     );
+    listen(element, CarouselEvents.INDEX_CHANGE, event => {
+      this.handleIndexChange_(event);
+    });
   }
 
   /**
@@ -171,11 +177,18 @@ export class AutoAdvance {
    * @private
    */
   createDebouncedAdvance_(interval) {
-    this.debouncedAdvance_ = debounce(
+    const debouncedAdvance = debounce(
       this.win_,
-      () => this.advance_(),
+      () => {
+        if (debouncedAdvance != this.debouncedAdvance_) {
+          return;
+        }
+
+        this.advance_();
+      },
       interval
     );
+    this.debouncedAdvance_ = debouncedAdvance;
   }
 
   /**
@@ -214,6 +227,18 @@ export class AutoAdvance {
     this.resetAutoAdvance_();
   }
 
+  /**
+   * @param {!Event} event
+   */
+  handleIndexChange_(event) {
+    const detail = getDetail(event);
+    const actionSource = detail['actionSource'];
+
+    if (actionSource && actionSource !== ActionSource.AUTOPLAY) {
+      this.stop();
+    }
+  }
+
   /**
    * Advances, as long as we should still auto advance.
    */
diff --git a/extensions/amp-base-carousel/0.1/carousel-accessibility.js b/extensions/amp-base-carousel/0.1/carousel-accessibility.js
index 51584f869d4ed..0c1a2123e219c 100644
--- a/extensions/amp-base-carousel/0.1/carousel-accessibility.js
+++ b/extensions/amp-base-carousel/0.1/carousel-accessibility.js
@@ -38,7 +38,8 @@ export class CarouselAccessibility {
    *   stoppable: !StoppableDef,
    * }} config
    */
-  constructor({win, element, scrollContainer, runMutate, stoppable}) {
+  constructor(config) {
+    const {win, element, scrollContainer, runMutate, stoppable} = config;
     /** @protected @const */
     this.win_ = win;
 
diff --git a/extensions/amp-base-carousel/0.1/carousel.css b/extensions/amp-base-carousel/0.1/carousel.css
index 8ead4124f93ea..fb1a40605a7aa 100644
--- a/extensions/amp-base-carousel/0.1/carousel.css
+++ b/extensions/amp-base-carousel/0.1/carousel.css
@@ -35,6 +35,7 @@
   width: 100%;
   height: 100%;
   align-items: center;
+  outline: none;
 
   scroll-behavior: smooth;
   -webkit-overflow-scrolling: touch !important;
diff --git a/extensions/amp-base-carousel/0.1/carousel.js b/extensions/amp-base-carousel/0.1/carousel.js
index e69865bdfe33b..db19ac22caf12 100644
--- a/extensions/amp-base-carousel/0.1/carousel.js
+++ b/extensions/amp-base-carousel/0.1/carousel.js
@@ -151,7 +151,8 @@ export class Carousel {
    *   runMutate: function(function()),
    * }} config
    */
-  constructor({win, element, scrollContainer, runMutate}) {
+  constructor(config) {
+    const {win, element, scrollContainer, runMutate} = config;
     /** @private @const */
     this.win_ = win;
 
@@ -167,6 +168,7 @@ export class Carousel {
     /** @private @const */
     this.autoAdvance_ = new AutoAdvance({
       win,
+      element,
       scrollContainer,
       advanceable: this,
     });
@@ -605,6 +607,7 @@ export class Carousel {
   updateSlides(slides) {
     this.slides_ = slides;
     this.carouselAccessibility_.updateSlides(slides);
+    // TODO(sparhami) Should need to call `this.updateUi()` here.
   }
 
   /**
@@ -733,7 +736,7 @@ export class Carousel {
         dict({
           'index': index,
           'total': this.slides_.length,
-          'offset': offset,
+          'offset': this.forwards_ ? -offset : offset,
           'slides': this.slides_,
         }),
         {
@@ -823,6 +826,22 @@ export class Carousel {
    * scrolling continually.
    */
   handleScrollEnd_() {
+    // For now, do not handle scrollend when requestedIndex_ is set (e.g.
+    // from a call to advance, via arrow buttons). This is because updating
+    // the scroll position causes a scrollend, so if you advance while a
+    // smooth scroll is in progress, the resetScrollReferencePoint_ would cause
+    // it to jump to the final slide.
+    // The scrollend is likely triggered due to what causes
+    // https://bugs.chromium.org/p/chromium/issues/detail?id=1018842, though it
+    // is unclear if this will ever be changed.
+    // TODO(https://bugs.chromium.org/p/chromium/issues/detail?id=1018842):
+    // Remove this if/when scrollend stops firing when adjusting the scroll
+    // position. We will want to make sure that this works if/when Safari
+    // impelemnts scrollend as well.
+    if (this.requestedIndex_ !== null) {
+      return;
+    }
+
     this.resetScrollReferencePoint_();
   }
 
@@ -1230,7 +1249,8 @@ export class Carousel {
    * }} options
    * @private
    */
-  scrollSlideIntoView_(slide, {smoothScroll}) {
+  scrollSlideIntoView_(slide, options) {
+    const {smoothScroll} = options;
     const runner = smoothScroll ? (el, cb) => cb() : runDisablingSmoothScroll;
     runner(this.scrollContainer_, () => {
       scrollContainerToElement(
diff --git a/extensions/amp-base-carousel/0.1/child-layout-manager.js b/extensions/amp-base-carousel/0.1/child-layout-manager.js
index c6ff115cdc26b..438742dcd2c81 100644
--- a/extensions/amp-base-carousel/0.1/child-layout-manager.js
+++ b/extensions/amp-base-carousel/0.1/child-layout-manager.js
@@ -119,14 +119,15 @@ export class ChildLayoutManager {
    *  viewportIntersectionCallback: (function(!Element, boolean)|undefined)
    * }} config
    */
-  constructor({
-    ampElement,
-    intersectionElement,
-    intersectionThreshold = DEFAULT_INTERSECTION_THRESHOLD,
-    nearbyMarginInPercent = DEFAULT_NEARBY_MARGIN,
-    viewportIntersectionThreshold = intersectionThreshold,
-    viewportIntersectionCallback = () => {},
-  }) {
+  constructor(config) {
+    const {
+      ampElement,
+      intersectionElement,
+      intersectionThreshold = DEFAULT_INTERSECTION_THRESHOLD,
+      nearbyMarginInPercent = DEFAULT_NEARBY_MARGIN,
+      viewportIntersectionThreshold = intersectionThreshold,
+      viewportIntersectionCallback = () => {},
+    } = config;
     /** @private @const */
     this.ampElement_ = ampElement;
 
@@ -259,8 +260,12 @@ export class ChildLayoutManager {
    */
   processNearingChanges_(entries) {
     entries
-      .filter(({isIntersecting}) => isIntersecting)
-      .forEach(({target}) => {
+      .filter(entry => {
+        const {isIntersecting} = entry;
+        return isIntersecting;
+      })
+      .forEach(entry => {
+        const {target} = entry;
         target[NEAR_VIEWPORT_FLAG] = ViewportChangeState.ENTER;
       });
 
@@ -276,8 +281,12 @@ export class ChildLayoutManager {
    */
   processBackingAwayChanges_(entries) {
     entries
-      .filter(({isIntersecting}) => !isIntersecting)
-      .forEach(({target}) => {
+      .filter(entry => {
+        const {isIntersecting} = entry;
+        return !isIntersecting;
+      })
+      .forEach(entry => {
+        const {target} = entry;
         target[NEAR_VIEWPORT_FLAG] = ViewportChangeState.LEAVE;
       });
 
@@ -292,7 +301,8 @@ export class ChildLayoutManager {
    * @param {!Array<!IntersectionObserverEntry>} entries
    */
   processInViewportChanges_(entries) {
-    entries.forEach(({target, isIntersecting}) => {
+    entries.forEach(entry => {
+      const {target, isIntersecting} = entry;
       target[IN_VIEWPORT_FLAG] = isIntersecting
         ? ViewportChangeState.ENTER
         : ViewportChangeState.LEAVE;
diff --git a/extensions/amp-base-carousel/0.1/responsive-attributes.js b/extensions/amp-base-carousel/0.1/responsive-attributes.js
index 7f254a932f369..80907452c99a9 100644
--- a/extensions/amp-base-carousel/0.1/responsive-attributes.js
+++ b/extensions/amp-base-carousel/0.1/responsive-attributes.js
@@ -173,7 +173,8 @@ export class ResponsiveAttributes {
    * @private
    */
   setOnchange_(mediaQueryListsAndValues, fn) {
-    mediaQueryListsAndValues.forEach(({mediaQueryList}) => {
+    mediaQueryListsAndValues.forEach(mediaQueryDef => {
+      const {mediaQueryList} = mediaQueryDef;
       mediaQueryList.onchange = fn;
     });
   }
diff --git a/extensions/amp-base-carousel/0.1/test-e2e/test-hidden-controls.js b/extensions/amp-base-carousel/0.1/test-e2e/test-hidden-controls.js
new file mode 100644
index 0000000000000..d466cbc120d04
--- /dev/null
+++ b/extensions/amp-base-carousel/0.1/test-e2e/test-hidden-controls.js
@@ -0,0 +1,77 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {getNextArrow} from './helpers';
+
+describes.endtoend(
+  'AMP carousel arrows with hidden controls',
+  {
+    testUrl:
+      'http://localhost:8000/test/manual/amp-base-carousel/hidden-controls.amp.html',
+    experiments: ['amp-base-carousel'],
+    environments: ['single'],
+  },
+  async function(env) {
+    /**
+     * A helper function for expecting an error from an async function since we
+     * don't have ChaiAsExpected and we cannot wait for errors from
+     * @param {function()} fn A function to run
+     * @param {!RegExp} regExp A regular expression to match the error message.
+     */
+    async function expectAysncError(fn, regExp) {
+      let error;
+
+      try {
+        await fn();
+      } catch (e) {
+        error = e;
+      } finally {
+        await expect(error, 'Expected an error to be thrown.').to.not.be
+          .undefined;
+        await expect(error.toString()).to.match(regExp);
+      }
+    }
+
+    let controller;
+
+    beforeEach(async () => {
+      controller = env.controller;
+    });
+
+    it('should not go to the next slide', async () => {
+      const nextArrow = await getNextArrow(controller);
+
+      // The test driver should throw an error, since the element is not
+      // clickable.
+      // TODO(sparhami) Ideally we would do something like:
+      // `await expect(() => controller.click(nextArrow)).to.throw();`, but
+      // that  does not work for a few reasons, including:
+      // * Click does not return a ControllerPromise
+      // * ControllerPromise uses a Promise rejection to singal it is not done
+      //   yet. The wrapper logic would need to be modified to allow for an
+      //   expected error type or message to sort circuit the waiting, allowing
+      //   use of something like:
+      //   ```
+      //   await expect(() => controller.click(nextArrow))
+      //      .to.throw(/ElementClickInterceptedError/);
+      //   ```
+      expectAysncError(
+        () => controller.click(nextArrow),
+        /ElementClickInterceptedError/
+      );
+    });
+  }
+);
diff --git a/extensions/amp-base-carousel/0.1/test-e2e/test-rtl.js b/extensions/amp-base-carousel/0.1/test-e2e/test-rtl.js
index f04260307fa9c..8f040bb3af3fa 100644
--- a/extensions/amp-base-carousel/0.1/test-e2e/test-rtl.js
+++ b/extensions/amp-base-carousel/0.1/test-e2e/test-rtl.js
@@ -18,6 +18,7 @@ import {getNextArrow, getPrevArrow, getSlide} from './helpers';
 
 const pageWidth = 800;
 const pageHeight = 600;
+const arrowMargin = 12;
 
 describes.endtoend(
   'AMP carousel rtl',
@@ -57,10 +58,10 @@ describes.endtoend(
       // TODO(sparhami) seems like it would be better to modify getElementRect
       // to return us the right coordinate as well like DomRect.
       await expect(controller.getElementRect(prevArrow)).to.include({
-        right: pageWidth,
+        right: pageWidth - arrowMargin,
       });
       await expect(controller.getElementRect(nextArrow)).to.include({
-        left: 0,
+        left: arrowMargin,
       });
     });
   }
diff --git a/extensions/amp-beopinion/0.1/amp-beopinion.js b/extensions/amp-beopinion/0.1/amp-beopinion.js
index 8616fb619f662..829458de1c213 100644
--- a/extensions/amp-beopinion/0.1/amp-beopinion.js
+++ b/extensions/amp-beopinion/0.1/amp-beopinion.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {getIframe, preloadBootstrap} from '../../../src/3p-frame';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {listenFor} from '../../../src/iframe-helper';
@@ -36,12 +37,21 @@ class AmpBeOpinion extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    preloadBootstrap(this.win, this.preconnect);
+    const preconnect = Services.preconnectFor(this.win);
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
     // Hosts the script that renders widgets.
-    this.preconnect.preload('https://widget.beopinion.com/sdk.js', 'script');
-    this.preconnect.url('https://s.beopinion.com', opt_onLayout);
-    this.preconnect.url('https://t.beopinion.com', opt_onLayout);
-    this.preconnect.url('https://data.beopinion.com', opt_onLayout);
+    preconnect.preload(
+      this.getAmpDoc(),
+      'https://widget.beopinion.com/sdk.js',
+      'script'
+    );
+    preconnect.url(this.getAmpDoc(), 'https://s.beopinion.com', opt_onLayout);
+    preconnect.url(this.getAmpDoc(), 'https://t.beopinion.com', opt_onLayout);
+    preconnect.url(
+      this.getAmpDoc(),
+      'https://data.beopinion.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-bind/0.1/amp-state.js b/extensions/amp-bind/0.1/amp-state.js
index c733641229e0f..f327cfa2427fe 100644
--- a/extensions/amp-bind/0.1/amp-state.js
+++ b/extensions/amp-bind/0.1/amp-state.js
@@ -236,7 +236,7 @@ export class AmpState extends AMP.BaseElement {
       // As a rule, initialization should skip evaluation.
       // If we're not initializing then this must be a mutation, so we must
       // skip <amp-state> evaluation to prevent update cycles.
-      bind.setState(state, /* skipEval */ isInit, /* skipAmpState */ !isInit);
+      bind.setState(state, {skipEval: isInit, skipAmpState: !isInit});
     });
   }
 
diff --git a/extensions/amp-bind/0.1/bind-impl.js b/extensions/amp-bind/0.1/bind-impl.js
index fb90ae9911a58..4714808bfccf3 100644
--- a/extensions/amp-bind/0.1/bind-impl.js
+++ b/extensions/amp-bind/0.1/bind-impl.js
@@ -177,8 +177,8 @@ export class Bind {
      */
     this.maxNumberOfBindings_ = 1000;
 
-    /** @const @private {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(ampdoc);
+    /** @const @private {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(ampdoc);
 
     /**
      * The current values of all bound expressions on the page.
@@ -250,14 +250,13 @@ export class Bind {
 
   /**
    * Merges `state` into the current state and immediately triggers an
-   * evaluation unless `opt_skipEval` is false.
+   * evaluation unless `skipEval` is false.
    * @param {!JsonObject} state
-   * @param {boolean=} opt_skipEval
-   * @param {boolean=} opt_skipAmpState
+   * @param {!BindSetStateOptionsDef} opts options bag
    * @return {!Promise}
    */
-  setState(state, opt_skipEval, opt_skipAmpState) {
-    dev().info(TAG, 'setState (init=%s):', opt_skipEval, state);
+  setState(state, opts = {}) {
+    dev().info(TAG, 'setState (init=%s):', opts.skipEval, state);
 
     try {
       deepMerge(this.state_, state, MAX_MERGE_DEPTH);
@@ -265,13 +264,18 @@ export class Bind {
       user().error(TAG, 'Failed to merge result from AMP.setState().', e);
     }
 
-    if (opt_skipEval) {
+    if (opts.skipEval) {
       return Promise.resolve();
     }
 
     const promise = this.initializePromise_
       .then(() => this.evaluate_())
-      .then(results => this.apply_(results, opt_skipAmpState));
+      .then(results =>
+        this.apply_(results, {
+          skipAmpState: opts.skipAmpState,
+          constrain: opts.constrain,
+        })
+      );
 
     if (getMode().test) {
       promise.then(() => {
@@ -485,7 +489,7 @@ export class Bind {
     return rescanPromise.then(() => {
       if (options.update) {
         return this.evaluate_().then(results =>
-          this.applyElements_(results, addedElements)
+          this.apply_(results, {constrain: addedElements})
         );
       }
     });
@@ -1186,39 +1190,37 @@ export class Bind {
   }
 
   /**
-   * Applies expression results to all elements in the document.
+   * Applies expression results to elements in the document.
+   *
    * @param {Object<string, BindExpressionResultDef>} results
-   * @param {boolean=} opt_skipAmpState
+   * @param {Object} opts options bag
+   * @param {boolean=} opts.skipAmpState
+   * @param {Array<!Element>=} opts.constrain restricts the application to children of specified elements.
    * @return {!Promise}
    * @private
    */
-  apply_(results, opt_skipAmpState) {
-    const promises = this.boundElements_.map(boundElement => {
+  apply_(results, opts) {
+    const promises = [];
+
+    this.boundElements_.forEach(boundElement => {
       // If this evaluation is triggered by an <amp-state> mutation, we must
       // ignore updates to any <amp-state> element to prevent update cycles.
-      if (opt_skipAmpState && boundElement.element.tagName === 'AMP-STATE') {
-        return Promise.resolve();
+      if (opts.skipAmpState && boundElement.element.tagName === 'AMP-STATE') {
+        return;
       }
-      return this.applyBoundElement_(results, boundElement);
-    });
-    return Promise.all(promises);
-  }
 
-  /**
-   * Applies expression results to only given elements and their descendants.
-   * @param {Object<string, BindExpressionResultDef>} results
-   * @param {!Array<!Element>} elements
-   * @return {!Promise}
-   */
-  applyElements_(results, elements) {
-    const promises = [];
-    this.boundElements_.forEach(boundElement => {
-      elements.forEach(element => {
-        if (element.contains(boundElement.element)) {
-          promises.push(this.applyBoundElement_(results, boundElement));
-        }
-      });
+      // If this is a constrained application, then restrict to specified
+      // elements and their subtrees.
+      if (
+        opts.constrain &&
+        !opts.constrain.some(el => el.contains(boundElement.element))
+      ) {
+        return;
+      }
+
+      promises.push(this.applyBoundElement_(results, boundElement));
     });
+
     return Promise.all(promises);
   }
 
@@ -1234,7 +1236,7 @@ export class Bind {
     if (updates.length === 0) {
       return Promise.resolve();
     }
-    return this.resources_.mutateElement(element, () => {
+    return this.mutator_.mutateElement(element, () => {
       const mutations = map();
       let width, height;
 
@@ -1256,10 +1258,9 @@ export class Bind {
       });
 
       if (width !== undefined || height !== undefined) {
-        // TODO(choumx): Add new Resources method for adding change-size
         // request without scheduling vsync pass since `mutateElement()`
         // will schedule a pass after a short delay anyways.
-        this.resources_./*OK*/ changeSize(element, height, width);
+        this.mutator_./*OK*/ changeSize(element, height, width);
       }
 
       if (typeof element.mutatedAttributesCallback === 'function') {
diff --git a/extensions/amp-bind/0.1/bind-macro.js b/extensions/amp-bind/0.1/bind-macro.js
index 35f8af58701f8..02ad255534c5d 100644
--- a/extensions/amp-bind/0.1/bind-macro.js
+++ b/extensions/amp-bind/0.1/bind-macro.js
@@ -42,7 +42,7 @@ export class BindMacro {
    * @return {BindExpressionResultDef}
    */
   evaluate(scope, args) {
-    const copy = /** @type {!JsonObject} */ (Object.assign({}, scope));
+    const copy = /** @type {!JsonObject} */ ({...scope});
     for (let i = 0; i < this.argumentNames_.length; i++) {
       copy[this.argumentNames_[i]] = args[i];
     }
diff --git a/extensions/amp-bind/0.1/test/integration/test-bind-impl.js b/extensions/amp-bind/0.1/test/integration/test-bind-impl.js
index 5911ff35d2b6b..21e5232ec7cf9 100644
--- a/extensions/amp-bind/0.1/test/integration/test-bind-impl.js
+++ b/extensions/amp-bind/0.1/test/integration/test-bind-impl.js
@@ -70,18 +70,14 @@ function onBindReady(env, bind) {
  * @param {!Object} env
  * @param {!Bind} bind
  * @param {!Object} state
- * @param {boolean=} opt_isAmpStateMutation
+ * @param {boolean=} skipAmpState
  * @return {!Promise}
  */
-function onBindReadyAndSetState(env, bind, state, opt_isAmpStateMutation) {
+function onBindReadyAndSetState(env, bind, state, skipAmpState) {
   return bind
     .initializePromiseForTesting()
     .then(() => {
-      return bind.setState(
-        state,
-        /* opt_skipEval */ undefined,
-        opt_isAmpStateMutation
-      );
+      return bind.setState(state, {skipAmpState});
     })
     .then(() => {
       env.flushVsync();
diff --git a/extensions/amp-bind/0.1/test/test-amp-state.js b/extensions/amp-bind/0.1/test/test-amp-state.js
index e36e500e7c211..d392449697bd7 100644
--- a/extensions/amp-bind/0.1/test/test-amp-state.js
+++ b/extensions/amp-bind/0.1/test/test-amp-state.js
@@ -108,8 +108,7 @@ describes.realWin(
 
       expect(bind.setState).calledWithMatch(
         {myAmpState: {remote: 'data'}},
-        true,
-        false
+        {skipEval: true, skipAmpState: false}
       );
     });
 
@@ -180,8 +179,7 @@ describes.realWin(
 
       expect(bind.setState).calledWithMatch(
         {myAmpState: {local: 'data'}},
-        true,
-        false
+        {skipEval: true, skipAmpState: false}
       );
 
       // await one macro-task to let viewer/fetch promise chains resolve.
@@ -200,8 +198,7 @@ describes.realWin(
       expect(ampState.fetch_).to.not.have.been.called;
       expect(bind.setState).calledWithMatch(
         {myAmpState: {local: 'data'}},
-        true,
-        false
+        {skipEval: true, skipAmpState: false}
       );
 
       whenFirstVisiblePromiseResolve();
@@ -212,8 +209,7 @@ describes.realWin(
 
       expect(bind.setState).calledWithMatch(
         {myAmpState: {remote: 'data'}},
-        true,
-        false
+        {skipEval: true, skipAmpState: false}
       );
     });
 
@@ -252,8 +248,7 @@ describes.realWin(
       expect(ampState.fetch_).to.have.been.called;
       expect(bind.setState).calledWithMatch(
         {myAmpState: {remote: 'data'}},
-        false,
-        true
+        {skipEval: false, skipAmpState: true}
       );
     });
 
@@ -282,8 +277,7 @@ describes.realWin(
 
       expect(bind.setState).calledWithMatch(
         {myAmpState: {remote: 'data'}},
-        true,
-        false
+        {skipEval: true, skipAmpState: false}
       );
     });
   }
diff --git a/extensions/amp-bind/amp-bind.md b/extensions/amp-bind/amp-bind.md
index e38f8f11173c5..90e092ef97f93 100644
--- a/extensions/amp-bind/amp-bind.md
+++ b/extensions/amp-bind/amp-bind.md
@@ -93,6 +93,8 @@ For performance and to avoid the risk of unexpected content jumping, `amp-bind`
 
 ### A slightly more complex example
 
+[filter formats="websites, stories, ads"]
+
 ```html
 <!-- Store complex nested JSON data in <amp-state> elements. -->
 <amp-state id="myAnimals">
@@ -129,6 +131,37 @@ For performance and to avoid the risk of unexpected content jumping, `amp-bind`
 <button on="tap:AMP.setState({currentAnimal: 'cat'})">Set to Cat</button>
 ```
 
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+
+```html
+<!-- Store complex nested JSON data in <amp-state> elements. -->
+<amp-state id="myAnimals">
+  <script type="application/json">
+    {
+      "dog": {
+        "imageUrl": "/img/dog.jpg",
+        "style": "greenBackground"
+      },
+      "cat": {
+        "imageUrl": "/img/cat.jpg",
+        "style": "redBackground"
+      }
+    }
+  </script>
+</amp-state>
+
+<p [text]="'This is a ' + currentAnimal + '.'">This is a dog.</p>
+
+<!-- CSS classes can also be added or removed with [class]. -->
+<p class="greenBackground" [class]="myAnimals[currentAnimal].style">
+  Each animal has a different background color.
+</p>
+```
+
+[/filter] <!-- formats="email" -->
+
 When the button is pressed:
 
 1.  **State** is updated with `currentAnimal` defined as `'cat'`.
@@ -364,18 +397,32 @@ encodeURIComponent('Hello world')</pre>
 
 `amp-bind` expression fragments can be reused by defining an `amp-bind-macro`. The `amp-bind-macro` element allows you to define an expression that takes zero or more arguments and references the current state. A macro can be invoked like a function by referencing its `id` attribute value from anywhere in your doc.
 
+[example preview="inline" playground="true" imports="amp-bind"]
+
 ```html
 <amp-bind-macro
   id="circleArea"
   arguments="radius"
   expression="3.14 * radius * radius"
 ></amp-bind-macro>
-
-<div>
-  The circle has an area of <span [text]="circleArea(myCircle.radius)">0</span>.
-</div>
+<p>
+  Input a radius value
+</p>
+<input
+  type="number"
+  min="0"
+  max="100"
+  value="0"
+  on="input-throttled:AMP.setState({myCircle:{radius: event.value}})"
+/>
+<p>
+  The circle has an area of
+  <span [text]="circleArea(myCircle.radius)">0</span>.
+</p>
 ```
 
+[/example]
+
 A macro can also call other macros <i>defined before itself</i>. A macro cannot call itself recursively.
 
 ### Bindings
@@ -433,161 +480,344 @@ Notes on bindings:
 
 #### Element-specific attributes
 
-Only binding to the following components and attributes are allowed:
+Binding to the following components and attributes are allowed:
 
-<table>
-  <tr>
-    <th>Component</th>
-    <th>Attribute(s)</th>
-    <th>Behavior</th>
-  </tr>
-  <tr>
-    <td class="col-thirty"><code>&lt;amp-brightcove&gt;</code></td>
-    <td class="col-fourty"><code>[data-account]</code><br><code>[data-embed]</code><br><code>[data-player]</code><br><code>[data-player-id]</code><br><code>[data-playlist-id]</code><br><code>[data-video-id]</code></td>
-    <td class="col-thirty">Changes the displayed Brightcove video.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-carousel type=slides&gt;</code></td>
-    <td><code>[slide]</code><sup>*</sup></td>
-    <td>Changes the currently displayed slide index. <a href="https://amp.dev/documentation/examples/multimedia-animations/image_galleries_with_amp-carousel/#linking-carousels-with-amp-bind">See an example</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-date-picker&gt;</code></td>
-    <td>
-      <code>[min]</code><br>
-      <code>[max]</code>
-    </td>
-    <td>
-      Sets the earliest selectable date<br>
-      Sets the latest selectable date
-    </td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-google-document-embed&gt;</code></td>
-    <td><code>[src]</code><br><code>[title]</code></td>
-    <td>Displays the document at the updated URL.<br>Changes the document's title.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-iframe&gt;</code></td>
-    <td><code>[src]</code></td>
-    <td>Changes the iframe's source URL.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-img&gt;</code></td>
-    <td><code>[alt]</code><br><code>[attribution]</code><br><code>[src]</code><br><code>[srcset]</code></td>
-    <td>Recommend binding to <code>[srcset]</code> instead of <code>[src]</code> to support responsive images.<br>See corresponding <a href="https://www.ampproject.org/docs/reference/components/media/amp-img#attributes">amp-img attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-lightbox&gt;</code></td>
-    <td><code>[open]</code><sup>*</sup></td>
-    <td>
-      Toggles display of the lightbox. Tip: Use <code>on="lightboxClose: AMP.setState(...)"</code> to update variables when the lightbox is closed.
-    </td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-list&gt;</code></td>
-    <td><code>[src]</code></td>
-    <td>
-      If expression is a string, fetches and renders JSON from the string URL.
-      If expression is an object or array, renders the expression data.
-    </td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-selector&gt;</code></td>
-    <td><code>[selected]</code><sup>*</sup><br><code>[disabled]</code></td>
-    <td>Changes the currently selected children element(s)<br>identified by their <code>option</code> attribute values. Supports a comma-separated list of values for multiple selection. <a href="https://amp.dev/documentation/examples/multimedia-animations/image_galleries_with_amp-carousel/#linking-carousels-with-amp-bind">See an example</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-state&gt;</code></td>
-    <td><code>[src]</code></td>
-    <td>Fetches JSON from the new URL and merges it into the existing state. <em>Note the following update will ignore <code>&lt;amp-state&gt;</code> elements to prevent cycles.</em></td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-twitter&gt;</code></td>
-    <td><code>[data-tweetid]</code></td>
-    <td>Changes the displayed Tweet.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-video&gt;</code></td>
-    <td><code>[alt]</code><br><code>[attribution]</code><br><code>[controls]</code><br><code>[loop]</code><br><code>[poster]</code><br><code>[preload]</code><br><code>[src]</code></td>
-    <td>See corresponding <a href="https://www.ampproject.org/docs/reference/components/media/amp-video#attributes">amp-video attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;amp-youtube&gt;</code></td>
-    <td><code>[data-videoid]</code></td>
-    <td>Changes the displayed YouTube video.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;a&gt;</code></td>
-    <td><code>[href]</code></td>
-    <td>Changes the link.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;button&gt;</code></td>
-    <td><code>[disabled]</code><br><code>[type]</code><br><code>[value]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Attributes">button attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;details&gt;</code></td>
-    <td><code>[open]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Attributes">details attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;fieldset&gt;</code></td>
-    <td><code>[disabled]</code></td>
-    <td>Enables or disables the fieldset.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;image&gt;</code></td>
-    <td><code>[xlink:href]</code><br>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Element/image">image attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;input&gt;</code></td>
-    <td><code>[accept]</code><br><code>[accessKey]</code><br><code>[autocomplete]</code><br><code>[checked]</code><br><code>[disabled]</code><br><code>[height]</code><br><code>[inputmode]</code><br><code>[max]</code><br><code>[maxlength]</code><br><code>[min]</code><br><code>[minlength]</code><br><code>[multiple]</code><br><code>[pattern]</code><br><code>[placeholder]</code><br><code>[readonly]</code><br><code>[required]</code><br><code>[selectiondirection]</code><br><code>[size]</code><br><code>[spellcheck]</code><br><code>[step]</code><br><code>[type]</code><br><code>[value]</code><br><code>[width]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes">input attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;option&gt;</code></td>
-    <td><code>[disabled]</code><br><code>[label]</code><br><code>[selected]</code><br><code>[value]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#Attributes">option attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;optgroup&gt;</code></td>
-    <td><code>[disabled]</code><br><code>[label]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/optgroup#Attributes">optgroup attributes</a></td>
-  </tr>
-  <tr>
-    <td><code>&lt;section&gt;</code></td>
-    <td><code>[data-expand]</code></td>
-    <td>Changes the expansion of a <code>section</code> in an <a href="https://amp.dev/documentation/components/amp-accordion">amp-accordion</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;select&gt;</code></td>
-    <td><code>[autofocus]</code><br><code>[disabled]</code><br><code>[multiple]</code><br><code>[required]</code><br><code>[size]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select#Attributes">select attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;source&gt;</code></td>
-    <td><code>[src]</code><br><code>[type]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source#Attributes">source attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;track&gt;</code></td>
-    <td><code>[label]</code><br><code>[src]</code><br><code>[srclang]</code></td>
-    <td>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track#Attributes">track attributes</a>.</td>
-  </tr>
-  <tr>
-    <td><code>&lt;textarea&gt;</code></td>
-    <td><code>[autocomplete]</code><br><code>[autofocus]</code><br><code>[cols]</code><br><code>[disabled]</code><br><code>[defaultText]</code><br><code>[maxlength]</code><br><code>[minlength]</code><br><code>[placeholder]</code><br><code>[readonly]</code><br><code>[required]</code><br><code>[rows]</code><br><code>[selectiondirection]</code><br><code>[selectionend]</code><br><code>[selectionstart]</code><br><code>[spellcheck]</code><br><code>[wrap]</code></td>
-    <td>Use <code>[defaultText]</code> to update initial text, and <code>[text]</code> to update current text.<br>See corresponding <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes">textarea attributes</a>.</td>
-  </tr>
-</table>
-<sup>*</sup>Denotes bindable attributes that don't have a non-bindable counterpart.
+[filter formats="websites"]
+
+##### `<amp-brightcove>`
+
+- `[data-account]`
+- `[data-embed]`
+- `[data-player]`
+- `[data-player-id]`
+- `[data-playlist-id]`
+- `[data-video-id]` Changes the displayed Brightcove video.
+  [/filter] <!-- formats="websites" -->
+
+##### `<amp-carousel type=slides>`
+
+- `[slide]` Changes the currently displayed slide index.
+
+[See an example](https://amp.dev/documentation/examples/multimedia-animations/image_galleries_with_amp-carousel/#linking-carousels-with-amp-bind).
+
+[filter formats="websites"]
+
+##### `<amp-date-picker>`
+
+- `[min]` Sets the earliest selectable date
+- `[max]` Sets the latest selectable date
+
+##### `<amp-google-document-embed>`
+
+- `[src]` Displays the document at the updated URL.
+- `[title]` Changes the document's title.
+
+##### `<amp-iframe>`
+
+- `[src]` Changes the iframe's source URL.
+
+[/filter] <!-- formats="websites" -->
+[filter formats="websites, ads"]
+
+##### `<amp-img>`
+
+- `[alt]`
+- `[attribution]`
+- `[src]`
+- `[srcset]`
+
+Bind to `[srcset]` instead of `[src]` to support responsive images. See corresponding [`amp-img` attributes](../../builtins/amp-img.md#attributes).
+[/filter] <!-- formats="websites, ads" -->
+[filter formats="email"]
+
+##### `<amp-img>`
+
+- `[alt]`
+- `[attribution]`
+  [/filter] <!-- formats="email" -->
+
+##### `<amp-lightbox>`
+
+- `[open]` Toggles display of the lightbox.
+
+[tip type="default"]
+Use `on="lightboxClose: AMP.setState(...)"` to update variables when the lightbox is closed.
+[/tip]
+
+[filter formats="websites, stories"]
+
+##### `<amp-list>`
+
+- `[src]`
+
+If the expression is a string, it fetches and renders JSON from the string URL. If the expression is an object or array, it renders the expression data.
+[/filter] <!-- formats="websites, stories" -->
+
+[filter formats="websites, email"]
+
+##### `<amp-selector>`
+
+- `[selected]` Changes the currently selected children element(s) identified by their `option` attribute values. Supports a comma-separated list of values for multiple selection. [See an example](https://amp.dev/documentation/examples/multimedia-animations/image_galleries_with_amp-carousel/?format=email#linking-carousels-with-amp-bind).
+- `[disabled]`
+
+[tip type="note"]
+`[selected]` does not have a non-bindable attribute. The AMP Validator will throw an error if `selected` is used.
+[/tip]
+
+[/filter] <!-- formats="websites, email" -->
+
+[filter formats="websites, stories, ads"]
+
+##### `<amp-state>`
+
+- `[src]`
+
+Fetches JSON from the new URL and merges it into the existing state. The following update will ignore `<amp-state>`elements to prevent cycles.
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="websites, stories"]
+
+##### `<amp-twitter>`
+
+- `[data-tweetid]` Changes the displayed Tweet.
+
+[/filter] <!-- formats="websites" -->
+
+[filter formats="websites, stories, ads"]
+
+##### `<amp-video>`
+
+- `[alt]`
+- `[attribution]`
+- `[controls]`
+- `[loop]`
+- `[poster]`
+- `[preload]`
+- `[src]`
+
+See corresponding [`amp-video` attributes](../amp-video/amp-video.md#attributes).
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="websites, ads"]
+
+##### `<amp-youtube>`
+
+- `[data-videoid]` Changes the displayed YouTube video.
+
+[/filter] <!-- formats="websites, ads" -->
+
+[filter formats="websites, stories, ads"]
+
+##### `<a>`
+
+- `[href]` Changes the link.
+
+##### `<button>`
+
+- `[disabled]`
+- `[type]`
+- `[value]`
+
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+
+##### `<button>`
+
+- `[disabled]`
+- `[value]`
+
+See corresponding [button attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Attributes).
+
+[/filter] <!-- formats="email" -->
+
+##### `<details>`
+
+- `[open]`
+
+See corresponding [details attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#Attributes).
+
+##### `<fieldset>`
+
+- `[disabled]` Enables or disables the fieldset.
+
+##### `<image>`
+
+- `[xlink:href]`
+
+See corresponding [image attributes](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/image).
+
+[filter formats="websites, stories, ads"]
+
+##### `<input>`
+
+- `[accept]`
+- `[accessKey]`
+- `[autocomplete]`
+- `[checked]`
+- `[disabled]`
+- `[height]`
+- `[inputmode]`
+- `[max]`
+- `[maxlength]`
+- `[multiple]`
+- `[pattern]`
+- `[placeholder]`
+- `[readonly]`
+- `[required]`
+- `[selectiondirection]`
+- `[size]`
+- `[spellcheck]`
+- `[step]`
+- `[type]`
+- `[value]`
+- `[width]`
+
+See corresponding [input attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes).
+
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+
+##### `<input>`
+
+- `[autocomplete]`
+- `[disabled]`
+- `[height]`
+- `[max]`
+- `[maxlength]`
+- `[multiple]`
+- `[pattern]`
+- `[placeholder]`
+- `[readonly]`
+- `[required]`
+- `[size]`
+- `[spellcheck]`
+- `[step]`
+- `[value]`
+- `[width]`
+
+See corresponding [input attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes).
+
+[/filter] <!-- formats="email" -->
+
+##### `<option>`
+
+- `[disabled]`
+- `[label]`
+- `[selected]`
+- `[value]`
+
+See corresponding [option attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#Attributes).
+
+##### `<optgroup>`
+
+- `[disabled]`
+- `[label]`
+
+See corresponding [optgroup attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/optgroup#Attributes).
+
+##### `<section>`
+
+- `[data-expand]` Changes the expansion of a `section` in an [`amp-accordion`](../amp-accordion/amp-accordion.md).
+
+[filter formats="websites, stories, ads"]
+
+##### `<select>`
+
+- `[autofocus]`
+- `[disabled]`
+- `[multiple]`
+- `[required]`
+- `[size]`
+
+See corresponding [select attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select#Attributes).
+
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+
+##### `<select>`
+
+- `[disabled]`
+- `[multiple]`
+- `[required]`
+- `[size]`
+
+See corresponding [select attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select#Attributes).
+
+[/filter] <!-- formats="email" -->
+
+##### `<source>`
+
+- `[src]`
+- `[type]`
+
+See corresponding [source attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source#Attributes).
+
+##### `<track>`
+
+- [label]
+- [src]
+- [srclang]
+
+See corresponding [track attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track#Attributes).
+
+[filter formats="websites, stories, ads"]
+
+##### `<textarea>`
+
+- `[autocomplete]`
+- `[autofocus]`
+- `[cols]`
+- `[disabled]`
+- `[defaultText]`
+- `[maxlength]`
+- `[minlength]`
+- `[placeholder]`
+- `[readonly]`
+- `[required]`
+- `[rows]`
+- `[selectiondirection]`
+- `[selectionend]`
+- `[selectionstart]`
+- `[spellcheck]`
+- `[wrap]`
+
+Use `[defaultText]` to update initial text, and `[text]` to update current text. See corresponding [textarea attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes).
+
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+
+##### `<textarea>`
+
+- `[autocomplete]`
+- `[cols]`
+- `[disabled]`
+- `[defaultText]`
+- `[maxlength]`
+- `[minlength]`
+- `[placeholder]`
+- `[readonly]`
+- `[required]`
+- `[rows]`
+- `[spellcheck]`
+- `[wrap]`
+
+Use `[defaultText]` to update initial text, and `[text]` to update current text. See corresponding [textarea attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes).
+
+[/filter] <!-- formats="email" -->
 
 ## Debugging
 
-Test in development mode (with the URL fragment `#development=1`) to highlight warnings and errors during development and to access special debugging functions.
+[filter formats="websites, stories, ads"]
+Test in development mode, byt adding the URL fragment `#development=1` to highlight warnings and errors during development and to access special debugging functions.
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+Test in development mode by saving the email as an HTML file. Test in the browser by adding the URL fragment `#development=1` to highlight warnings and errors during development and to access special debugging functions.
+[/filter] <!-- formats="email" -->
 
 ### Warnings
 
@@ -658,6 +888,7 @@ Use `AMP.printState()` to print the current state to the console.
 
 ### `<amp-state>` specification
 
+[filter formats="websites, stories, ads"]
 An `amp-state` element may contain either a child `<script>` element **OR** a `src` attribute containing a CORS URL to a remote JSON endpoint, but not both.
 
 ```html
@@ -672,33 +903,67 @@ An `amp-state` element may contain either a child `<script>` element **OR** a `s
 <amp-state id="myRemoteState" src="https://data.com/articles.json"> </amp-state>
 ```
 
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+An `amp-state` element must contain a child `<script>` element.
+
+```html
+<amp-state id="myLocalState">
+  <script type="application/json">
+    {
+      "foo": "bar"
+    }
+  </script>
+</amp-state>
+```
+
+[/filter] <!-- formats="email" -->
+
+[filter formats="websites, stories, ads"]
+
 #### XHR batching
 
 AMP batches XMLHttpRequests (XHRs) to JSON endpoints, that is, you can use a single JSON data request as a data source for multiple consumers (e.g., multiple `amp-state` elements) on an AMP page.
 
 For example, if your `amp-state` element makes an XHR to an endpoint, while the XHR is in flight, all subsequent XHRs to the same endpoint won't trigger and will instead return the results from the first XHR.
 
+[/filter] <!-- formats="websites, stories, ads" -->
+
 #### Attributes
 
-<table>
-  <tr>
-    <td width="40%"><strong>src</strong></td>
-    <td><p>The URL of the remote endpoint that will return the JSON that will update this <code>amp-state</code>. This must be a CORS HTTP service.</p>
-<p>The <code>src</code> attribute allows all standard URL variable substitutions. See the <a href="../../spec/amp-var-substitutions.md">Substitutions Guide</a> for more info.</p>
-<p>{% call callout('Important', type='caution') %}
-  The endpoint must implement the requirements specified in the <a href="https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests">CORS Requests in AMP</a> spec.
-  {% endcall %}</p></td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>credentials (optional)</strong></td>
-    <td><p>Defines a <code>credentials</code> option as specified by the <a href="https://fetch.spec.whatwg.org/">Fetch API</a>.</p>
-<ul>
-  <li>Supported values: `omit`, `include`</li>
-  <li>Default: `omit`</li>
-</ul>
-<p>To send credentials, pass the value of <code>include</code>. If this value is set, the response must follow the <a href="https://www.ampproject.org/docs/fundamentals/amp-cors-requests#cors-security-in-amp">AMP CORS security guidelines</a>.</p></td>
-  </tr>
-</table>
+[filter formats="websites, stories, ads"]
+
+##### src
+
+The URL of the remote endpoint that will return the JSON that will update this `amp-state`. This must be a CORS HTTP service. The `src` attribute allows all standard URL variable substitutions. See the [Substitutions Guide](../../spec/amp-var-substitutions.md) for more info.
+
+[tip type="important"]
+The endpoint must implement the requirements specified in the [CORS Requests in AMP](https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests) spec.
+[/tip]
+
+##### credentials (optional)
+
+Defines a `credentials` option as specified by the [Fetch API](https://fetch.spec.whatwg.org/).
+
+- Supported values: `omit`, `include`
+- Default: `omit`
+
+To send credentials, pass the value of `include`. If this value is set, the response must follow the [AMP CORS security guidelines](https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/amp-cors-requests/#cors-security-in-amp).
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+
+##### Invalid AMP email attributes
+
+The AMP for Email spec disallows the use of the following attributes on the AMP email format.
+
+- `[src]`
+- `src`
+- `credentials`
+- `overridable`
+
+[/filter] <!-- formats="email" -->
 
 ### Deep-merge with `AMP.setState()`
 
diff --git a/extensions/amp-bodymovin-animation/0.1/amp-bodymovin-animation.js b/extensions/amp-bodymovin-animation/0.1/amp-bodymovin-animation.js
index a938713dacd4c..521c559010add 100644
--- a/extensions/amp-bodymovin-animation/0.1/amp-bodymovin-animation.js
+++ b/extensions/amp-bodymovin-animation/0.1/amp-bodymovin-animation.js
@@ -72,12 +72,13 @@ export class AmpBodymovinAnimation extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
+    const preconnect = Services.preconnectFor(this.win);
     const scriptToLoad =
       this.renderer_ === 'svg'
         ? 'https://cdnjs.cloudflare.com/ajax/libs/bodymovin/4.13.0/bodymovin_light.min.js'
         : 'https://cdnjs.cloudflare.com/ajax/libs/bodymovin/4.13.0/bodymovin.min.js';
-    preloadBootstrap(this.win, this.preconnect);
-    this.preconnect.url(scriptToLoad, opt_onLayout);
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
+    preconnect.url(this.getAmpDoc(), scriptToLoad, opt_onLayout);
   }
 
   /** @override */
diff --git a/extensions/amp-brid-player/0.1/amp-brid-player.js b/extensions/amp-brid-player/0.1/amp-brid-player.js
index bf761cd1a7312..d06eaa42bb0a8 100644
--- a/extensions/amp-brid-player/0.1/amp-brid-player.js
+++ b/extensions/amp-brid-player/0.1/amp-brid-player.js
@@ -79,8 +79,16 @@ class AmpBridPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://services.brid.tv', opt_onLayout);
-    this.preconnect.url('https://cdn.brid.tv', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://services.brid.tv',
+      opt_onLayout
+    );
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://cdn.brid.tv',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-brightcove/0.1/amp-brightcove.js b/extensions/amp-brightcove/0.1/amp-brightcove.js
index 85f40c5668c82..36add55fbc000 100644
--- a/extensions/amp-brightcove/0.1/amp-brightcove.js
+++ b/extensions/amp-brightcove/0.1/amp-brightcove.js
@@ -89,7 +89,10 @@ class AmpBrightcove extends AMP.BaseElement {
 
   /** @override */
   preconnectCallback() {
-    this.preconnect.url('https://players.brightcove.net');
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://players.brightcove.net'
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-byside-content/0.1/amp-byside-content.js b/extensions/amp-byside-content/0.1/amp-byside-content.js
index ec146c077e7ec..48af9ba325bc7 100644
--- a/extensions/amp-byside-content/0.1/amp-byside-content.js
+++ b/extensions/amp-byside-content/0.1/amp-byside-content.js
@@ -129,7 +129,11 @@ export class AmpBysideContent extends AMP.BaseElement {
    */
   preconnectCallback(onLayout) {
     if (this.origin_) {
-      this.preconnect.url(this.origin_, onLayout);
+      Services.preconnectFor(this.win).url(
+        this.getAmpDoc(),
+        this.origin_,
+        onLayout
+      );
     }
   }
 
diff --git a/extensions/amp-carousel/0.1/amp-carousel.css b/extensions/amp-carousel/0.1/amp-carousel.css
index a612b2eb7012f..c6d7395b1fb51 100644
--- a/extensions/amp-carousel/0.1/amp-carousel.css
+++ b/extensions/amp-carousel/0.1/amp-carousel.css
@@ -90,6 +90,17 @@ amp-carousel .amp-carousel-button.amp-disabled {
   visibility: hidden;
 }
 
+amp-carousel[i-amphtml-carousel-hide-buttons] .amp-carousel-button-prev,
+amp-carousel[i-amphtml-carousel-hide-buttons] .amp-carousel-button-next {
+  opacity: 0;
+  /** 
+   * Note, screen readers can still activate the buttons when hide buttons is
+   * specified, even though we have `pointer-events: none`.
+   */
+  pointer-events: none;
+  visibility: visible !important;
+}
+
 /* Begin SlideScroll */
 .i-amphtml-slidescroll {
 }
diff --git a/extensions/amp-carousel/0.1/base-carousel.js b/extensions/amp-carousel/0.1/base-carousel.js
index 885a76f023061..02e005b57a002 100644
--- a/extensions/amp-carousel/0.1/base-carousel.js
+++ b/extensions/amp-carousel/0.1/base-carousel.js
@@ -15,6 +15,7 @@
  */
 import {Keys} from '../../../src/utils/key-codes';
 import {Services} from '../../../src/services';
+import {toggleAttribute} from '../../../src/dom';
 
 /**
  * @abstract
@@ -181,18 +182,12 @@ export class BaseCarousel extends AMP.BaseElement {
     }
     this.getVsync().mutate(() => {
       const className = 'i-amphtml-carousel-button-start-hint';
+      const hideAttribute = 'i-amphtml-carousel-hide-buttons';
       this.element.classList.add(className);
       Services.timerFor(this.win).delay(() => {
         this.mutateElement(() => {
           this.element.classList.remove(className);
-          this.prevButton_.classList.toggle(
-            'i-amphtml-screen-reader',
-            !this.showControls_
-          );
-          this.nextButton_.classList.toggle(
-            'i-amphtml-screen-reader',
-            !this.showControls_
-          );
+          toggleAttribute(this.element, hideAttribute, !this.showControls_);
         });
       }, 4000);
     });
diff --git a/extensions/amp-carousel/0.1/scrollable-carousel.js b/extensions/amp-carousel/0.1/scrollable-carousel.js
index 61f25f32eedc6..7f6695d39d2cd 100644
--- a/extensions/amp-carousel/0.1/scrollable-carousel.js
+++ b/extensions/amp-carousel/0.1/scrollable-carousel.js
@@ -59,6 +59,8 @@ export class AmpScrollableCarousel extends BaseCarousel {
 
     this.container_ = this.element.ownerDocument.createElement('div');
     this.container_.classList.add('i-amphtml-scrollable-carousel-container');
+    // Focusable container makes it possible to fully consume Arrow key events.
+    this.container_.setAttribute('tabindex', '-1');
     this.element.appendChild(this.container_);
 
     this.cells_.forEach(cell => {
@@ -298,7 +300,7 @@ export class AmpScrollableCarousel extends BaseCarousel {
    * @private
    */
   withinWindow_(pos, callback) {
-    const containerWidth = this.getLayoutWidth();
+    const containerWidth = this.element.getLayoutWidth();
     for (let i = 0; i < this.cells_.length; i++) {
       const cell = this.cells_[i];
       if (
@@ -367,8 +369,7 @@ export class AmpScrollableCarousel extends BaseCarousel {
 
   /** @override */
   hasNext() {
-    // TODO(jridgewell): this could be using cached values from Layers.
-    const containerWidth = this.getLayoutWidth();
+    const containerWidth = this.element.getLayoutWidth();
     const scrollWidth = this.container_./*OK*/ scrollWidth;
     const maxPos = Math.max(scrollWidth - containerWidth, 0);
     return this.pos_ != maxPos;
diff --git a/extensions/amp-carousel/0.1/slidescroll.js b/extensions/amp-carousel/0.1/slidescroll.js
index c5c77074ccf3f..984f8f3a2f3b1 100644
--- a/extensions/amp-carousel/0.1/slidescroll.js
+++ b/extensions/amp-carousel/0.1/slidescroll.js
@@ -162,6 +162,8 @@ export class AmpSlideScroll extends BaseSlides {
     this.noOfSlides_ = this.slides_.length;
 
     this.slidesContainer_ = this.win.document.createElement('div');
+    // Focusable container makes it possible to fully consume Arrow key events.
+    this.slidesContainer_.setAttribute('tabindex', '-1');
     this.slidesContainer_.classList.add('i-amphtml-slides-container');
     // Let screen reader know that this is a live area and changes
     // to it (such after pressing next) should be announced to the
@@ -302,7 +304,7 @@ export class AmpSlideScroll extends BaseSlides {
 
   /** @override */
   onLayoutMeasure() {
-    this.slideWidth_ = this.getLayoutWidth();
+    this.slideWidth_ = this.element.getLayoutWidth();
   }
 
   /** @override */
diff --git a/extensions/amp-carousel/0.1/test-e2e/test-hidden-controls.js b/extensions/amp-carousel/0.1/test-e2e/test-hidden-controls.js
new file mode 100644
index 0000000000000..00afc34db9e03
--- /dev/null
+++ b/extensions/amp-carousel/0.1/test-e2e/test-hidden-controls.js
@@ -0,0 +1,77 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describes.endtoend(
+  'AMP carousel 0.1 buttons with hidden controls',
+  {
+    testUrl:
+      'http://localhost:8000/test/manual/amp-carousel/0.1/hidden-controls.amp.html',
+    experiments: ['amp-carousel'],
+    environments: ['single'],
+  },
+  async function(env) {
+    /**
+     * A helper function for expecting an error from an async function since we
+     * don't have ChaiAsExpected and we cannot wait for errors from
+     * @param {function()} fn A function to run
+     * @param {!RegExp} regExp A regular expression to match the error message.
+     */
+    async function expectAysncError(fn, regExp) {
+      let error;
+
+      try {
+        await fn();
+      } catch (e) {
+        error = e;
+      } finally {
+        await expect(error, 'Expected an error to be thrown.').to.not.be
+          .undefined;
+        await expect(error.toString()).to.match(regExp);
+      }
+    }
+
+    let controller;
+
+    beforeEach(async () => {
+      controller = env.controller;
+    });
+
+    it('should not go to the next slide', async () => {
+      const nextArrow = await controller.findElement(
+        '.amp-carousel-button-next'
+      );
+
+      // The test driver should throw an error, since the element is not
+      // clickable.
+      // TODO(sparhami) Ideally we would do something like:
+      // `await expect(() => controller.click(nextArrow)).to.throw();`, but
+      // that  does not work for a few reasons, including:
+      // * Click does not return a ControllerPromise
+      // * ControllerPromise uses a Promise rejection to singal it is not done
+      //   yet. The wrapper logic would need to be modified to allow for an
+      //   expected error type or message to sort circuit the waiting, allowing
+      //   use of something like:
+      //   ```
+      //   await expect(() => controller.click(nextArrow))
+      //      .to.throw(/ElementClickInterceptedError/);
+      //   ```
+      expectAysncError(
+        () => controller.click(nextArrow),
+        /ElementClickInterceptedError/
+      );
+    });
+  }
+);
diff --git a/extensions/amp-carousel/0.1/test/test-slidescroll.js b/extensions/amp-carousel/0.1/test/test-slidescroll.js
index 1a7408c509a99..d04bb35d4c716 100644
--- a/extensions/amp-carousel/0.1/test/test-slidescroll.js
+++ b/extensions/amp-carousel/0.1/test/test-slidescroll.js
@@ -639,8 +639,11 @@ describes.realWin(
 
     it('should handle layout measures (orientation changes)', async () => {
       const ampSlideScroll = await getAmpSlideScroll();
+      const getLayoutWidthStub = env.sandbox.stub(
+        ampSlideScroll,
+        'getLayoutWidth'
+      );
       const impl = ampSlideScroll.implementation_;
-      const getLayoutWidthStub = env.sandbox.stub(impl, 'getLayoutWidth');
 
       getLayoutWidthStub.returns(200);
       impl.onLayoutMeasure();
diff --git a/extensions/amp-carousel/0.2/amp-carousel.js b/extensions/amp-carousel/0.2/amp-carousel.js
index c7a9e9b4f3ba5..15f61d3335a16 100644
--- a/extensions/amp-carousel/0.2/amp-carousel.js
+++ b/extensions/amp-carousel/0.2/amp-carousel.js
@@ -45,7 +45,8 @@ class AmpCarousel extends AMP.BaseElement {
   setupActions_() {
     this.registerAction(
       'goToSlide',
-      ({args, trust}) => {
+      actionInvocation => {
+        const {args, trust} = actionInvocation;
         this.carousel_.goToSlide(args['index'] || 0, {
           actionSource: this.getActionSource_(trust),
         });
@@ -54,7 +55,8 @@ class AmpCarousel extends AMP.BaseElement {
     );
     this.registerAction(
       'toggleAutoplay',
-      ({args}) => {
+      actionInvocation => {
+        const {args} = actionInvocation;
         // args will be `null` if not present, so we cannot use a default value above
         const toggle = args ? args['toggleOn'] : undefined;
         this.toggleAutoplay_(toggle);
@@ -222,7 +224,7 @@ class AmpCarousel extends AMP.BaseElement {
 
   /** @override */
   mutatedAttributesCallback(mutations) {
-    if (mutations['slide']) {
+    if (mutations['slide'] !== undefined) {
       this.carousel_.goToSlide(Number(mutations['slide']));
     }
   }
@@ -479,6 +481,11 @@ class AmpCarousel extends AMP.BaseElement {
     const isSlides = type == CarouselType.SLIDES;
 
     this.type_ = isSlides ? CarouselType.SLIDES : CarouselType.CAROUSEL;
+    // Use center alignment for slides to make sure fractional widths
+    // do not cause the wrong slide to be considered as active. For example,
+    // a slide is positioned at 100.5px, but the updated scroll position is
+    // truncated to 100px.
+    this.carousel_.updateAlignment(isSlides ? 'center' : 'start');
     this.carousel_.updateHideScrollbar(isSlides);
     this.carousel_.updateMixedLength(!isSlides);
     this.carousel_.updateSnap(isSlides);
diff --git a/extensions/amp-carousel/amp-carousel.md b/extensions/amp-carousel/amp-carousel.md
index 8697afee2c146..76a97f72caf35 100644
--- a/extensions/amp-carousel/amp-carousel.md
+++ b/extensions/amp-carousel/amp-carousel.md
@@ -148,54 +148,59 @@ In the following example, we have a carousel of three images with preview button
 
 ## Attributes
 
-<table>
-  <tr>
-    <td width="40%"><strong>type</strong></td>
-    <td>Specifies the display type for the carousel items, which can be:
+### type
+
+Specifies the display type for the carousel items, which can be:
+
 <ul>
   <li><strong><code>carousel</code></strong> (default): All slides are shown and are scrollable horizontally. Each slide may specify a different width using CSS.</li>
   <li><strong><code>slides</code></strong>: Shows a single slide at a time, with each slide snapping into place as the user swipes.</li>
-</ul></td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>controls (optional)</strong></td>
-    <td>Permanently displays left and right arrows for the user to navigate carousel items on mobile devices.
-By default, navigational arrows disappear after the user swipes to another slide on mobile.
-The visibility of arrows can also be controlled via styling, and a media query can be used to only display arrows at certain screen widths. On desktop, arrows are always displayed unless only a single child is present.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>data-next-button-aria-label (optional)</strong></td>
-    <td>Sets the aria-label for the <code>amp-carousel-button-next</code>. If no value is given, the aria-label defaults to 'Next item in carousel'.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>data-prev-button-aria-label (optional)</strong></td>
-    <td>Sets the aria-label for the <code>amp-carousel-button-prev</code>. If no value is given, the aria-label defaults to 'Previous item in carousel'.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>data-button-count-format (optional)</strong></td>
-    <td>A format string that looks like <code>(%s of %s)</code>, used as a suffix to the aria-label for <code>amp-carousel-button-next</code>/<code>amp-carousel-button-prev</code>. This provides information to users using a screen reader on their progress through the carousel. If no value is given, this defaults to '(%s of %s)'.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>autoplay (optional)</strong></td>
-    <td><p>Regularly advances to the next slide without user interaction. If the user manually changes slides, then autoplay is stopped.<br>
-  If present without a value:</p>
+</ul>
+
+### controls (optional)
+
+Permanently displays left and right arrows for the user to navigate carousel items on mobile devices. By default, navigational arrows disappear after the user swipes to another slide on mobile.
+
+The visibility of arrows can also be controlled via styling, and a media query can be used to only display arrows at certain screen widths. On desktop, arrows are always displayed unless only a single child is present.
+
+### data-next-button-aria-label (optional)
+
+Sets the aria-label for the `amp-carousel-button-next`. If no value is given, the aria-label defaults to 'Next item in carousel'.
+
+### data-prev-button-aria-label (optional)
+
+Sets the aria-label for the `amp-carousel-button-prev`. If no value is given, the aria-label defaults to 'Previous item in carousel'.
+
+### data-button-count-format (optional)
+
+A format string that looks like `(%s of %s)`, used as a suffix to the aria-label for `amp-carousel-button-next`/`amp-carousel-button-prev`. This provides information to users using a screen reader on their progress through the carousel. If no value is given, this defaults to `(%s of %s)`.
+
+### autoplay (optional)
+
+Regularly advances to the next slide without user interaction. If the user manually changes slides, then autoplay is stopped.
+
+If present without a value:
+
 <ul>
-  <li>By default, advances a slide in 5000 millisecond intervals (5 seconds); this can be overridden by the <code>delay</code> attribute.</li>
+  <li>By default, advances a slide in 5000 millisecond intervals (5 seconds); this can be overridden by the `delay` attribute.</li>
   <li>Requires at least 2 slides for autoplay to occur.</li>
 </ul>
-<p>If present with a value:</p>
+
+If present with a value:
+
 <ul>
   <li>Stops autoplaying after the requisite number of loops are made.</li>
-</ul></td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>delay (optional)</strong></td>
-    <td>Specifies the duration (in milliseconds) to delay advancing to the next slide when <code>autoplay</code> is enabled.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>loop (optional)</strong></td>
-    <td><p>Allows the user to advance past the first item or the final item. There must be at least 3 slides for looping to occur.</p>
-<p><em>Example: Displays a slides carousel with controls, looping, and delayed autoplay</em></p>
+</ul>
+
+### delay (optional)
+
+Specifies the duration (in milliseconds) to delay advancing to the next slide when `autoplay` is enabled.
+
+### loop (optional)
+
+Allows the user to advance past the first item or the final item. There must be at least 3 slides for looping to occur.
+
+The example below displays a slide carousel with controls, looping, and delayed autoplay.
 
 [example preview="inline" playground="true" imports="amp-carousel"]
 
@@ -221,21 +226,22 @@ The visibility of arrows can also be controlled via styling, and a media query c
 </amp-carousel>
 ```
 
-[/example]</td>
+[/example]
+
+### slide (optional)
+
+Specifies what index should be shown when the carousel is first rendered. This can be updated with [`amp-bind`](https://amp.dev/documentation/components/amp-bind) to change which index is shown.
+
+### common attributes
+
+This element includes [common attributes](https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes) extended to AMP components.
 
-  </tr>
-  <tr>
-    <td width="40%"><strong>slide (optional)</strong></td>
-    <td>Specifies what index should be shown when the carousel is first rendered. This can be updated with <code><a href="https://amp.dev/documentation/components/amp-bind">amp-bind</a></code> to change which index is shown.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>common attributes</strong></td>
-    <td>This element includes <a href="https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes">common attributes</a> extended to AMP components.</td>
-  </tr>
 </table>
 
 ## Styling
 
+[filter formats="websites, ads"]
+
 - You may use the `amp-carousel` element selector to style it freely.
 - You may use the `.amp-carousel-slide` class selector to target carousel items.
 - The visual state of an `amp-carousel` button when it's disabled is hidden.
@@ -269,6 +275,35 @@ Note that the SVG content needs to have certain characters, including `<`, `>` a
 }
 ```
 
+[/filter]<!-- formats="websites, ads" -->
+
+[filter formats="email"]
+
+- You may use the `amp-carousel` element selector to style it freely.
+- You may use the `.amp-carousel-slide` class selector to target carousel items.
+- The visual state of an `amp-carousel` button when it's disabled is hidden.
+- By default, `.amp-carousel-button` uses an inlined SVG as the background-image of the buttons. You may override this with your own image. Some email clients may not support SVG.
+
+_Example: Overriding the default `.amp-carousel-button` inlined SVG_
+
+```css
+.amp-carousel-button-prev {
+  background-image: url('http://example.com/arrow.png');
+}
+```
+
+You can position the carousel buttons using align-self and/or relative positioning. Note that the carousel arrows are automatically flipped in RTL, so you should not change their flex order.
+
+```css
+.amp-carousel-button-prev {
+  position: relative;
+  bottom: 20px;
+  align-self: flex-end;
+}
+```
+
+[/filter]<!-- formats="email" -->
+
 ## Differences from `<amp-carousel>` 0.1
 
 - `autoplay` is allowed on `type="carousel"`
diff --git a/extensions/amp-connatix-player/0.1/amp-connatix-player.js b/extensions/amp-connatix-player/0.1/amp-connatix-player.js
index 4b37053ff9348..7daf92a3991fa 100644
--- a/extensions/amp-connatix-player/0.1/amp-connatix-player.js
+++ b/extensions/amp-connatix-player/0.1/amp-connatix-player.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {addParamsToUrl} from '../../../src/url';
 import {dict} from '../../../src/utils/object';
 import {getData} from '../../../src/event-helper';
@@ -111,7 +112,11 @@ export class AmpConnatixPlayer extends AMP.BaseElement {
    */
   preconnectCallback(onLayout) {
     // Serves the player assets
-    this.preconnect.url(this.iframeDomain_, onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      this.iframeDomain_,
+      onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-consent/0.1/amp-consent.js b/extensions/amp-consent/0.1/amp-consent.js
index 099854dd87671..aa9a8db789fbb 100644
--- a/extensions/amp-consent/0.1/amp-consent.js
+++ b/extensions/amp-consent/0.1/amp-consent.js
@@ -16,6 +16,7 @@
 
 import {
   CONSENT_ITEM_STATE,
+  convertEnumValueToState,
   getConsentStateValue,
   hasStoredValue,
 } from './consent-info';
@@ -87,8 +88,12 @@ export class AmpConsent extends AMP.BaseElement {
     /** @private {?function()} */
     this.dialogResolver_ = null;
 
+    /** @private {boolean} */
     this.isPromptUIOn_ = false;
 
+    /** @private {boolean} */
+    this.consentStateChangedViaPromptUI_ = false;
+
     /** @private {boolean} */
     this.consentUIPending_ = false;
 
@@ -100,6 +105,9 @@ export class AmpConsent extends AMP.BaseElement {
 
     /** @private {?string} */
     this.consentId_ = null;
+
+    /** @private {?string} */
+    this.matchedGeoGroup_ = null;
   }
 
   /** @override */
@@ -115,19 +123,20 @@ export class AmpConsent extends AMP.BaseElement {
       'amp-consent should have an id'
     );
 
-    const config = new ConsentConfig(this.element);
+    const configManager = new ConsentConfig(this.element);
 
-    return config.getConsentConfigPromise().then(validatedConfig => {
+    return configManager.getConsentConfigPromise().then(validatedConfig => {
+      this.matchedGeoGroup_ = configManager.getMatchedGeoGroup();
       this.initialize_(validatedConfig);
     });
   }
 
   /**
    *
-   * @param {!JsonObject} config
+   * @param {!JsonObject} validatedConfig
    */
-  initialize_(config) {
-    this.consentConfig_ = config;
+  initialize_(validatedConfig) {
+    this.consentConfig_ = validatedConfig;
 
     // ConsentConfig has verified that there's one and only one consent instance
     this.consentId_ = this.consentConfig_['consentInstanceId'];
@@ -387,6 +396,8 @@ export class AmpConsent extends AMP.BaseElement {
       return;
     }
 
+    this.consentStateChangedViaPromptUI_ = true;
+
     if (action == ACTION_TYPE.ACCEPT) {
       //accept
       this.consentStateManager_.updateConsentInstanceState(
@@ -414,7 +425,11 @@ export class AmpConsent extends AMP.BaseElement {
    */
   init_() {
     this.passSharedData_();
-    this.maybeSetDirtyBit_();
+    if (isExperimentOn(this.win, 'amp-consent-geo-override')) {
+      this.syncRemoteConsentState_();
+    } else {
+      this.maybeSetDirtyBit_();
+    }
 
     this.getConsentRequiredPromise_()
       .then(isConsentRequired => {
@@ -439,11 +454,34 @@ export class AmpConsent extends AMP.BaseElement {
    * @return {!Promise<boolean>}
    */
   getConsentRequiredPromise_() {
-    userAssert(
-      this.consentConfig_['checkConsentHref'] ||
-        this.consentConfig_['promptIfUnknownForGeoGroup'],
-      'neither checkConsentHref nor promptIfUnknownForGeoGroup is defined'
-    );
+    if (!isExperimentOn(this.win, 'amp-consent-geo-override')) {
+      return this.getConsentRequiredPromiseLegacy_();
+    }
+    return this.consentStateManager_
+      .getConsentInstanceInfo()
+      .then(storedInfo => {
+        if (hasStoredValue(storedInfo)) {
+          return Promise.resolve(true);
+        }
+        const consentRequired = this.consentConfig_['consentRequired'];
+        if (typeof consentRequired === 'boolean') {
+          return Promise.resolve(consentRequired);
+        }
+        return this.getConsentRemote_().then(consentResponse => {
+          // `promptIfUnknown` is a legacy field
+          return consentResponse['consentRequired'] !== undefined
+            ? !!consentResponse['consentRequired']
+            : !!consentResponse['promptIfUnknown'];
+        });
+      });
+  }
+
+  /**
+   * Returns a promise that resolve when amp-consent knows
+   * if the consent is required.
+   * @return {!Promise<boolean>}
+   */
+  getConsentRequiredPromiseLegacy_() {
     let consentRequiredPromise = null;
     if (this.consentConfig_['promptIfUnknownForGeoGroup']) {
       const geoGroup = this.consentConfig_['promptIfUnknownForGeoGroup'];
@@ -500,6 +538,50 @@ export class AmpConsent extends AMP.BaseElement {
     });
   }
 
+  /**
+   * Clear cache for server side decision and then sync.
+   */
+  syncRemoteConsentState_() {
+    this.getConsentRemote_().then(response => {
+      if (!response) {
+        return;
+      }
+      // Ideally we should fallback to true if either are true.
+      const expireCache =
+        response['expireCache'] || response['forcePromptOnNext'];
+      if (expireCache) {
+        this.consentStateManager_.setDirtyBit();
+      }
+
+      // Decision from promptUI takes precedence over consent decision from response
+      if (
+        !!response['consentRequired'] &&
+        !this.consentStateChangedViaPromptUI_
+      ) {
+        this.updateCacheIfNotNull_(
+          response['consentStateValue'],
+          response['consentString'] || undefined
+        );
+      }
+    });
+  }
+
+  /**
+   * Sync with local storage if consentRequired is true.
+   * @param {string=} responseStateValue
+   * @param {string=} responseConsentString
+   */
+  updateCacheIfNotNull_(responseStateValue, responseConsentString) {
+    const consentStateValue = convertEnumValueToState(responseStateValue);
+    // consentStateValue and consentString are treated as a pair that will update together
+    if (consentStateValue !== null) {
+      this.consentStateManager_.updateConsentInstanceState(
+        consentStateValue,
+        responseConsentString
+      );
+    }
+  }
+
   /**
    * Returns a promise that if user is in the given geoGroup
    * @param {string} geoGroup
@@ -532,6 +614,7 @@ export class AmpConsent extends AMP.BaseElement {
           'consentStateValue': getConsentStateValue(storedInfo['consentState']),
           'consentString': storedInfo['consentString'],
           'isDirty': !!storedInfo['isDirty'],
+          'matchedGeoGroup': this.matchedGeoGroup_,
         });
         if (this.consentConfig_['clientConfig']) {
           request['clientConfig'] = this.consentConfig_['clientConfig'];
@@ -546,10 +629,13 @@ export class AmpConsent extends AMP.BaseElement {
         const ampdoc = this.getAmpDoc();
         const sourceBase = getSourceUrl(ampdoc.getUrl());
         const resolvedHref = resolveRelativeUrl(href, sourceBase);
+        const xhrService = Services.xhrFor(this.win);
         return ampdoc.whenFirstVisible().then(() => {
-          return Services.xhrFor(this.win)
+          return xhrService
             .fetchJson(resolvedHref, init)
-            .then(res => res.json());
+            .then(res =>
+              xhrService.xssiJson(res, this.consentConfig_['xssiPrefix'])
+            );
         });
       });
     }
@@ -615,6 +701,30 @@ export class AmpConsent extends AMP.BaseElement {
       });
     });
   }
+
+  /**
+   * @return {?ConsentStateManager}
+   * @visibleForTesting
+   */
+  getConsentStateManagerForTesting() {
+    return this.consentStateManager_;
+  }
+
+  /**
+   * @return {!Promise<boolean>}
+   * @visibleForTesting
+   */
+  getConsentRequiredPromiseForTesting() {
+    return this.getConsentRequiredPromise_();
+  }
+
+  /**
+   * @return {boolean}
+   * @visibleForTesting
+   */
+  getIsPromptUiOnForTesting() {
+    return this.isPromptUIOn_;
+  }
 }
 
 AMP.extension('amp-consent', '0.1', AMP => {
diff --git a/extensions/amp-consent/0.1/cmps.js b/extensions/amp-consent/0.1/cmps.js
index 42e7bc17bb0aa..656a24599ed42 100644
--- a/extensions/amp-consent/0.1/cmps.js
+++ b/extensions/amp-consent/0.1/cmps.js
@@ -31,7 +31,7 @@ if (getMode().test || getMode().localDev) {
   CMP_CONFIG['_ping_'] = {
     'consentInstanceId': '_ping_',
     'checkConsentHref': '/get-consent-v1',
-    'promptUISrc': '/test/manual/diy-consent.html',
+    'promptUISrc': '/examples/amp-consent/diy-consent.html',
   };
 }
 
@@ -41,6 +41,12 @@ CMP_CONFIG['didomi'] = {
   'promptUISrc': 'https://sdk-amp.privacy-center.org/loader.html',
 };
 
+CMP_CONFIG['Marfeel'] = {
+  'consentInstanceId': 'Marfeel',
+  'checkConsentHref': 'https://live.mrf.io/cmp/consents/amp',
+  'promptUISrc': 'https://marfeel.mgr.consensu.org/amp/index.html',
+};
+
 CMP_CONFIG['SourcePoint'] = {
   'consentInstanceId': 'SourcePoint',
   'checkConsentHref': 'https://sourcepoint.mgr.consensu.org/consent/v2/amp',
diff --git a/extensions/amp-consent/0.1/consent-config.js b/extensions/amp-consent/0.1/consent-config.js
index e91a4f786b5bd..56a92b92d45f0 100644
--- a/extensions/amp-consent/0.1/consent-config.js
+++ b/extensions/amp-consent/0.1/consent-config.js
@@ -18,7 +18,7 @@ import {CMP_CONFIG} from './cmps';
 import {CONSENT_POLICY_STATE} from '../../../src/consent-state';
 import {GEO_IN_GROUP} from '../../amp-geo/0.1/amp-geo-in-group';
 import {Services} from '../../../src/services';
-import {deepMerge, map} from '../../../src/utils/object';
+import {deepMerge, hasOwn, map} from '../../../src/utils/object';
 import {devAssert, user, userAssert} from '../../../src/log';
 import {getChildJsonConfig} from '../../../src/json';
 import {isExperimentOn} from '../../../src/experiments';
@@ -42,6 +42,9 @@ export class ConsentConfig {
     /** @private {!Window} */
     this.win_ = toWin(element.ownerDocument.defaultView);
 
+    /** @private {?string} */
+    this.matchedGeoGroup_ = null;
+
     /** @private {?Promise<!JsonObject>} */
     this.configPromise_ = null;
   }
@@ -57,6 +60,15 @@ export class ConsentConfig {
     return this.configPromise_;
   }
 
+  /**
+   * Returns the matched geoGroup. Call after getConsentConfigPromise
+   * has resolved.
+   * @return {?string}
+   */
+  getMatchedGeoGroup() {
+    return this.matchedGeoGroup_;
+  }
+
   /**
    * Convert the inline config to new format
    * @param {!JsonObject} config
@@ -151,6 +163,24 @@ export class ConsentConfig {
         }
       }
     }
+
+    // TODO(micajuineho): delete promptIfUnknownForGeoGroup, once we migrate fully
+    // Migrate to geoOverride
+    const group = config['promptIfUnknownForGeoGroup'];
+    if (typeof group === 'string') {
+      config['consentRequired'] = false;
+      config['geoOverride'] = {
+        [group]: {
+          'consentRequired': true,
+        },
+      };
+    } else if (
+      config['consentRequired'] === undefined &&
+      config['checkConsentHref']
+    ) {
+      config['consentRequired'] = 'remote';
+    }
+
     return this.mergeGeoOverride_(config).then(mergedConfig =>
       this.validateMergedGeoOverride_(mergedConfig)
     );
@@ -172,12 +202,21 @@ export class ConsentConfig {
         TAG
       );
       const mergedConfig = map(config);
-
       const geoGroups = Object.keys(config['geoOverride']);
       // Stop at the first group that the geoService says we're in and then merge configs.
       for (let i = 0; i < geoGroups.length; i++) {
         if (geoService.isInCountryGroup(geoGroups[i]) === GEO_IN_GROUP.IN) {
-          deepMerge(mergedConfig, config['geoOverride'][geoGroups[i]], 1);
+          const geoConfig = config['geoOverride'][geoGroups[i]];
+          if (hasOwn(geoConfig, 'consentInstanceId')) {
+            user().error(
+              TAG,
+              'consentInstanceId cannot be overriden in geoGroup:',
+              geoGroups[i]
+            );
+            delete geoConfig['consentInstanceId'];
+          }
+          deepMerge(mergedConfig, geoConfig, 1);
+          this.matchedGeoGroup_ = geoGroups[i];
           break;
         }
       }
@@ -192,7 +231,13 @@ export class ConsentConfig {
    * @return {!JsonObject}
    */
   validateMergedGeoOverride_(mergedConfig) {
-    if (mergedConfig['consentRequired'] === 'remote') {
+    const consentRequired = mergedConfig['consentRequired'];
+    userAssert(
+      typeof consentRequired === 'boolean' || consentRequired === 'remote',
+      '`consentRequired` is required',
+      TAG
+    );
+    if (consentRequired === 'remote') {
       userAssert(
         mergedConfig['checkConsentHref'],
         '%s: `checkConsentHref` must be specified if `consentRequired` is remote',
diff --git a/extensions/amp-consent/0.1/consent-info.js b/extensions/amp-consent/0.1/consent-info.js
index d2b6176fdb670..6c92ead2105cd 100644
--- a/extensions/amp-consent/0.1/consent-info.js
+++ b/extensions/amp-consent/0.1/consent-info.js
@@ -26,7 +26,7 @@ import {isEnumValue, isObject} from '../../../src/types';
  * DITRYBIT: Set when the stored consent info need to be revoked next time.
  * @enum {string}
  */
-const STORAGE_KEY = {
+export const STORAGE_KEY = {
   STATE: 's',
   STRING: 'r',
   IS_DIRTY: 'd',
@@ -109,10 +109,7 @@ export function recalculateConsentStateValue(newState, previousState) {
   if (!isEnumValue(CONSENT_ITEM_STATE, newState)) {
     newState = CONSENT_ITEM_STATE.UNKNOWN;
   }
-  if (
-    newState == CONSENT_ITEM_STATE.DISMISSED ||
-    newState == CONSENT_ITEM_STATE.UNKNOWN
-  ) {
+  if (newState == CONSENT_ITEM_STATE.DISMISSED) {
     return previousState || CONSENT_ITEM_STATE.UNKNOWN;
   }
   if (newState == CONSENT_ITEM_STATE.NOT_REQUIRED) {
@@ -242,7 +239,7 @@ export function constructConsentInfo(
  * @param {*} value
  * @return {!CONSENT_ITEM_STATE}
  */
-function convertValueToState(value) {
+export function convertValueToState(value) {
   if (value === true || value === 1) {
     return CONSENT_ITEM_STATE.ACCEPTED;
   } else if (value === false || value === 0) {
@@ -251,6 +248,22 @@ function convertValueToState(value) {
   return CONSENT_ITEM_STATE.UNKNOWN;
 }
 
+/**
+ * Helper function to convert response enum value to CONSENT_ITEM_STATE value
+ * @param {*} value
+ * @return {?CONSENT_ITEM_STATE}
+ */
+export function convertEnumValueToState(value) {
+  if (value === 'accepted') {
+    return CONSENT_ITEM_STATE.ACCEPTED;
+  } else if (value === 'rejected') {
+    return CONSENT_ITEM_STATE.REJECTED;
+  } else if (value === 'unknown') {
+    return CONSENT_ITEM_STATE.UNKNOWN;
+  }
+  return null;
+}
+
 /**
  *
  * @param {!ConsentInfoDef} info
diff --git a/extensions/amp-consent/0.1/consent-policy-manager.js b/extensions/amp-consent/0.1/consent-policy-manager.js
index 3bc528fff3eb9..b907b1be9fd5f 100644
--- a/extensions/amp-consent/0.1/consent-policy-manager.js
+++ b/extensions/amp-consent/0.1/consent-policy-manager.js
@@ -19,7 +19,6 @@ import {CONSENT_POLICY_STATE} from '../../../src/consent-state';
 import {Deferred} from '../../../src/utils/promise';
 import {Observable} from '../../../src/observable';
 import {getServicePromiseForDoc} from '../../../src/service';
-import {isExperimentOn} from '../../../src/experiments';
 import {isFiniteNumber, isObject} from '../../../src/types';
 import {map} from '../../../src/utils/object';
 import {user, userAssert} from '../../../src/log';
@@ -79,16 +78,6 @@ export class ConsentPolicyManager {
     this.consentString_ = null;
   }
 
-  /**
-   * Is Multi-consent experiment enabled?
-   *
-   * @param {!Window} win
-   * @return {boolean}
-   */
-  static isMultiSupported(win) {
-    return isExperimentOn(win, 'multi-consent');
-  }
-
   /**
    *
    * @param {string} consentInstanceId
diff --git a/extensions/amp-consent/0.1/consent-state-manager.js b/extensions/amp-consent/0.1/consent-state-manager.js
index da5507549014a..352b578db18c1 100644
--- a/extensions/amp-consent/0.1/consent-state-manager.js
+++ b/extensions/amp-consent/0.1/consent-state-manager.js
@@ -97,8 +97,7 @@ export class ConsentStateManager {
       dev().error(TAG, 'instance not registered');
       return;
     }
-
-    this.instance_.update(state, consentStr);
+    this.instance_.update(state, consentStr, false);
 
     if (this.consentChangeHandler_) {
       this.consentChangeHandler_(constructConsentInfo(state, consentStr));
@@ -194,6 +193,15 @@ export class ConsentStateManager {
     }
     return this.consentReadyPromise_;
   }
+
+  /**
+   * Get last consent instance stored.
+   * @visibleForTesting
+   * @return {?ConsentInfoDef}
+   */
+  getSavedInstanceForTesting() {
+    return this.instance_.savedConsentInfo_;
+  }
 }
 
 /**
@@ -336,6 +344,14 @@ export class ConsentInstance {
         return;
       }
 
+      if (consentInfo['consentState'] === CONSENT_ITEM_STATE.UNKNOWN) {
+        // Remove stored value if the consentState is unknown
+        // Do not consilidate with the value == null check below,
+        // because UNKNOWN and DISMISS are different
+        storage.remove(this.storageKey_);
+        return;
+      }
+
       const consentStr = consentInfo['consentString'];
       if (consentStr && consentStr.length > 150) {
         // Verify the length of consentString.
diff --git a/extensions/amp-consent/0.1/consent-ui.js b/extensions/amp-consent/0.1/consent-ui.js
index 6ffde093c09b9..e6fffbf5a9743 100644
--- a/extensions/amp-consent/0.1/consent-ui.js
+++ b/extensions/amp-consent/0.1/consent-ui.js
@@ -84,6 +84,12 @@ export class ConsentUI {
       config['uiConfig'] &&
       config['uiConfig']['overlay'] === true;
 
+    /** @private {boolean} */
+    this.restrictFullscreenOn_ = isExperimentOn(
+      baseInstance.win,
+      'amp-consent-restrict-fullscreen'
+    );
+
     /** @private {boolean} */
     this.scrollEnabled_ = true;
 
@@ -202,7 +208,7 @@ export class ConsentUI {
 
           this.showIframe_();
 
-          if (!this.isPostPrompt_) {
+          if (!this.isPostPrompt_ && !this.restrictFullscreenOn_) {
             this.ui_./*OK*/ focus();
           }
         });
@@ -670,8 +676,13 @@ export class ConsentUI {
     }
 
     if (data['action'] === 'enter-fullscreen') {
-      // TODO (@torch2424) Send response back if enter fullscreen was succesful
-      if (!this.isIframeVisible_) {
+      // Do nothing if iframe not visible or it's not the active element.
+      if (
+        !this.isIframeVisible_ ||
+        (this.restrictFullscreenOn_ &&
+          this.document_.activeElement !== this.ui_)
+      ) {
+        // TODO (@torch2424) Send response back if enter fullscreen was succesful
         return;
       }
 
diff --git a/extensions/amp-consent/0.1/test-e2e/common.js b/extensions/amp-consent/0.1/test-e2e/common.js
new file mode 100644
index 0000000000000..1569678e9b47a
--- /dev/null
+++ b/extensions/amp-consent/0.1/test-e2e/common.js
@@ -0,0 +1,117 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+let ui1;
+let ui2;
+let postPromptUi;
+let tillResponded;
+let accepted;
+let autoReject;
+let defaultBlock;
+let notBlocked;
+let twitter;
+
+export function resetAllElements() {
+  ui1 = undefined;
+  ui2 = undefined;
+  postPromptUi = undefined;
+  tillResponded = undefined;
+  accepted = undefined;
+  autoReject = undefined;
+  defaultBlock = undefined;
+  notBlocked = undefined;
+  twitter = undefined;
+}
+
+export async function findElements(controller) {
+  ui1 = await controller.findElement('#ui1');
+  ui2 = await controller.findElement('#ui2');
+  postPromptUi = await controller.findElement('#postPromptUI');
+  tillResponded = await controller.findElement(
+    '[data-block-on-consent="_till_responded"]'
+  );
+  accepted = await controller.findElement(
+    '[data-block-on-consent="_till_accepted"]'
+  );
+  autoReject = await controller.findElement(
+    '[data-block-on-consent="_auto_reject"]'
+  );
+  defaultBlock = await controller.findElement(
+    '[data-block-on-consent="default"]'
+  );
+  notBlocked = await controller.findElement(
+    '[src="/examples/img/ima-poster.png"]'
+  );
+  twitter = await controller.findElement('[data-tweetid="885634330868850689"]');
+}
+
+export async function verifyElementsBuilt(controller, builtMap) {
+  const elementsMap = {
+    'tillResponded': tillResponded,
+    'accepted': accepted,
+    'autoReject': autoReject,
+    'defaultBlock': defaultBlock,
+    'notBlocked': notBlocked,
+    'twitter': twitter,
+  };
+
+  await expect(builtMap.length).to.equal(elementsMap.length);
+  const elementIds = Object.keys(elementsMap);
+
+  for (let i = 0; i < elementIds.length; i++) {
+    const elementId = elementIds[i];
+    const element = elementsMap[elementId];
+    const shouldBeBuilt = builtMap[elementId];
+
+    if (shouldBeBuilt) {
+      // Should be visible
+      await expect(
+        controller.getElementAttribute(element, 'class')
+      ).to.not.match(/amp-notbuilt/);
+    } else {
+      // Should not be visible
+      await expect(controller.getElementAttribute(element, 'class')).to.match(
+        /amp-notbuilt/
+      );
+    }
+  }
+}
+
+export async function verifyPromptsHidden(controller, hiddenMap) {
+  const elementsMap = {
+    'ui1': ui1,
+    'ui2': ui2,
+    'postPromptUi': postPromptUi,
+  };
+
+  await expect(hiddenMap.length).to.equal(elementsMap.length);
+  const elementIds = Object.keys(elementsMap);
+
+  for (let i = 0; i < elementIds.length; i++) {
+    const elementId = elementIds[i];
+    const element = elementsMap[elementId];
+    const shouldBeHidden = hiddenMap[elementId];
+
+    if (shouldBeHidden) {
+      // Should be hidden
+      await expect(controller.getElementProperty(element, 'hidden')).to.be.true;
+    } else {
+      // Should not be hidden
+      await expect(controller.getElementProperty(element, 'hidden')).to.be
+        .false;
+    }
+  }
+}
diff --git a/extensions/amp-consent/0.1/test-e2e/test-amp-consent-client-side.js b/extensions/amp-consent/0.1/test-e2e/test-amp-consent-client-side.js
new file mode 100644
index 0000000000000..c53a81ec2e5cd
--- /dev/null
+++ b/extensions/amp-consent/0.1/test-e2e/test-amp-consent-client-side.js
@@ -0,0 +1,105 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  findElements,
+  resetAllElements,
+  verifyElementsBuilt,
+  verifyPromptsHidden,
+} from './common';
+
+describes.endtoend(
+  'amp-consent',
+  {
+    testUrl:
+      'http://localhost:8000/test/manual/amp-consent/amp-consent-basic-uses.amp.html#amp-geo=de',
+    experiments: ['amp-consent-geo-override'],
+    // TODO (micajuineho): Add shadow-demo after #25985 is fixed and viewer-demo when...
+    environments: ['single'],
+  },
+  env => {
+    let controller;
+
+    beforeEach(() => {
+      controller = env.controller;
+    });
+
+    it('should work with client side decision', async () => {
+      resetAllElements();
+      const currentUrl = await controller.getCurrentUrl();
+
+      // Verify no local storage decision
+      await findElements(controller);
+      await verifyElementsBuilt(controller, {
+        'tillResponded': false,
+        'accepted': false,
+        'autoReject': true,
+        'defaultBlock': false,
+        'notBlocked': true,
+        'twitter': false,
+      });
+      await verifyPromptsHidden(controller, {
+        'ui1': true,
+        'ui2': false,
+        'postPromptUi': true,
+      });
+
+      // Client-side decision
+      const acceptButton = await controller.findElement('#accept');
+      await controller.click(acceptButton);
+
+      await verifyElementsBuilt(controller, {
+        'tillResponded': true,
+        'accepted': true,
+        'autoReject': true,
+        'defaultBlock': true,
+        'notBlocked': true,
+        'twitter': true,
+      });
+      await verifyPromptsHidden(controller, {
+        'ui1': true,
+        'ui2': true,
+        'postPromptUi': false,
+      });
+
+      // Navigate away to random page
+      await controller.navigateTo('http://localhost:8000/');
+      // Visit website again
+      await controller.navigateTo(currentUrl);
+
+      // Verify all elements are still built
+      await findElements(controller);
+      await verifyElementsBuilt(controller, {
+        'tillResponded': true,
+        'accepted': true,
+        'autoReject': true,
+        'defaultBlock': true,
+        'notBlocked': true,
+        'twitter': true,
+      });
+      await verifyPromptsHidden(controller, {
+        'ui1': true,
+        'ui2': true,
+        'postPromptUi': false,
+      });
+
+      // Check the analytics request consentState
+      await expect(
+        'http://localhost:8000/amp4test/request-bank/e2e/deposit/tracking?consentState=sufficient'
+      ).to.have.been.sent;
+    });
+  }
+);
diff --git a/extensions/amp-consent/0.1/test-e2e/test-amp-consent-server-side-expire-cache.js b/extensions/amp-consent/0.1/test-e2e/test-amp-consent-server-side-expire-cache.js
new file mode 100644
index 0000000000000..e3776822e7a11
--- /dev/null
+++ b/extensions/amp-consent/0.1/test-e2e/test-amp-consent-server-side-expire-cache.js
@@ -0,0 +1,95 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  findElements,
+  resetAllElements,
+  verifyElementsBuilt,
+  verifyPromptsHidden,
+} from './common';
+
+describes.endtoend(
+  'amp-consent',
+  {
+    testUrl:
+      'http://localhost:8000/test/manual/amp-consent/amp-consent-basic-uses.amp.html#amp-geo=mx',
+    experiments: ['amp-consent-geo-override'],
+    // TODO (micajuineho): Add shadow-demo after #25985 is fixed, and viewer-demo when...
+    environments: ['single'],
+  },
+  env => {
+    let controller;
+
+    beforeEach(() => {
+      controller = env.controller;
+    });
+
+    it('should respect server side decision and clear on next visit', async () => {
+      resetAllElements();
+      const currentUrl = await controller.getCurrentUrl();
+      const nextGeoUrl = currentUrl.replace('mx', 'ca');
+
+      // Check the analytics request consentState
+      await expect(
+        'http://localhost:8000/amp4test/request-bank/e2e/deposit/tracking?consentState=insufficient'
+      ).to.have.been.sent;
+
+      // Block/unblock elements based off of 'reject' from response
+      await findElements(controller);
+      await verifyElementsBuilt(controller, {
+        'tillResponded': true,
+        'accepted': false,
+        'autoReject': true,
+        'defaultBlock': false,
+        'notBlocked': true,
+        'twitter': false,
+      });
+      // TODO (micajuineho) this should change once #26006 is fixed.
+      await verifyPromptsHidden(controller, {
+        'ui1': false,
+        'ui2': true,
+        'postPromptUi': true,
+      });
+
+      // Navigate away to random page
+      await controller.navigateTo('http://localhost:8000/');
+      // Refresh to differnt geolocation
+      await controller.navigateTo(nextGeoUrl);
+
+      // Verify it listened to new response
+      await findElements(controller);
+      await verifyElementsBuilt(controller, {
+        'tillResponded': true,
+        'accepted': true,
+        'autoReject': true,
+        'defaultBlock': true,
+        'notBlocked': true,
+        'twitter': true,
+      });
+      // TODO (micajuineho) this should change once #26006 is fixed.
+      await verifyPromptsHidden(controller, {
+        'ui1': false,
+        'ui2': true,
+        'postPromptUi': true,
+      });
+
+      // Check the analytics request consentState
+      await expect(
+        'http://localhost:8000/amp4test/request-bank/e2e/deposit/tracking?consentState=sufficient'
+      ).to.have.been.sent;
+    });
+  }
+);
diff --git a/extensions/amp-consent/0.1/test-e2e/test-amp-consent-server-side.js b/extensions/amp-consent/0.1/test-e2e/test-amp-consent-server-side.js
new file mode 100644
index 0000000000000..eff4929e98bb7
--- /dev/null
+++ b/extensions/amp-consent/0.1/test-e2e/test-amp-consent-server-side.js
@@ -0,0 +1,88 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  findElements,
+  resetAllElements,
+  verifyElementsBuilt,
+  verifyPromptsHidden,
+} from './common';
+
+describes.endtoend(
+  'amp-consent',
+  {
+    testUrl:
+      'http://localhost:8000/test/manual/amp-consent/amp-consent-basic-uses.amp.html#amp-geo=us',
+    experiments: ['amp-consent-geo-override'],
+    // TODO (micajuineho): Add shadow-demo after #25985 is fixed and viewer-demo when...
+    environments: ['single'],
+  },
+  env => {
+    let controller;
+
+    beforeEach(() => {
+      controller = env.controller;
+    });
+
+    it('should respect server side decision and persist it', async () => {
+      resetAllElements();
+
+      const currentUrl = await controller.getCurrentUrl();
+
+      // Block/unblock elements based off of 'reject' from response
+      await findElements(controller);
+      await verifyElementsBuilt(controller, {
+        'tillResponded': true,
+        'accepted': false,
+        'autoReject': true,
+        'defaultBlock': false,
+        'notBlocked': true,
+        'twitter': false,
+      });
+      await verifyPromptsHidden(controller, {
+        'ui1': true,
+        'ui2': true,
+        'postPromptUi': false,
+      });
+
+      // Navigate away to random page
+      await controller.navigateTo('http://localhost:8000/');
+      // Visit website again
+      await controller.navigateTo(currentUrl);
+
+      // Verify same behavior after refresh
+      await findElements(controller);
+      await verifyElementsBuilt(controller, {
+        'tillResponded': true,
+        'accepted': false,
+        'autoReject': true,
+        'defaultBlock': false,
+        'notBlocked': true,
+        'twitter': false,
+      });
+      await verifyPromptsHidden(controller, {
+        'ui1': true,
+        'ui2': true,
+        'postPromptUi': false,
+      });
+
+      // Check the analytics request consentState
+      await expect(
+        'http://localhost:8000/amp4test/request-bank/e2e/deposit/tracking?consentState=insufficient'
+      ).to.have.been.sent;
+    });
+  }
+);
diff --git a/extensions/amp-consent/0.1/test/test-amp-consent.js b/extensions/amp-consent/0.1/test/test-amp-consent.js
index 839a704888412..5d69b47604c8d 100644
--- a/extensions/amp-consent/0.1/test/test-amp-consent.js
+++ b/extensions/amp-consent/0.1/test/test-amp-consent.js
@@ -15,7 +15,11 @@
  */
 
 import {ACTION_TYPE, AmpConsent} from '../amp-consent';
-import {CONSENT_ITEM_STATE} from '../consent-info';
+import {
+  CONSENT_ITEM_STATE,
+  STORAGE_KEY,
+  getConsentStateValue,
+} from '../consent-info';
 import {GEO_IN_GROUP} from '../../../amp-geo/0.1/amp-geo-in-group';
 import {dict} from '../../../../src/utils/object';
 import {macroTask} from '../../../../testing/yield';
@@ -24,6 +28,7 @@ import {
   resetServiceForTesting,
 } from '../../../../src/service';
 import {toggleExperiment} from '../../../../src/experiments';
+import {xhrServiceForTesting} from '../../../../src/service/xhr-impl';
 
 describes.realWin(
   'amp-consent',
@@ -42,6 +47,7 @@ describes.realWin(
     let requestBody;
     let ISOCountryGroups;
     let xhrServiceMock;
+    let storageMock;
 
     beforeEach(() => {
       doc = env.win.document;
@@ -54,6 +60,11 @@ describes.realWin(
         'https://response1/': '{"promptIfUnknown": true}',
         'https://response2/': '{}',
         'https://response3/': '{"promptIfUnknown": false}',
+        'https://geo-override-check/': '{"consentRequired": false}',
+        'https://geo-override-check2/': '{"consentRequired": true}',
+        'http://www.origin.com/r/1': '{}',
+        'https://invalid.response.com/': '{"consentRequired": 3}',
+        'https://xssi-prefix/': 'while(1){"consentRequired": false}',
       };
 
       xhrServiceMock = {
@@ -65,8 +76,23 @@ describes.realWin(
             json() {
               return Promise.resolve(JSON.parse(jsonMockResponses[url]));
             },
+            text() {
+              return Promise.resolve(jsonMockResponses[url]);
+            },
           });
         },
+        xssiJson: xhrServiceForTesting(win).xssiJson,
+      };
+
+      storageMock = {
+        setNonBoolean: () => {},
+        get: name => {
+          return Promise.resolve(storageValue[name]);
+        },
+        set: (name, value) => {
+          storageValue[name] = value;
+          return Promise.resolve();
+        },
       };
 
       resetServiceForTesting(win, 'xhr');
@@ -86,15 +112,7 @@ describes.realWin(
 
       resetServiceForTesting(win, 'storage');
       registerServiceBuilder(win, 'storage', function() {
-        return Promise.resolve({
-          get: name => {
-            return Promise.resolve(storageValue[name]);
-          },
-          set: (name, value) => {
-            storageValue[name] = value;
-            return Promise.resolve();
-          },
-        });
+        return Promise.resolve(storageMock);
       });
     });
 
@@ -103,20 +121,16 @@ describes.realWin(
         let consentElement;
 
         it('get consent/policy/postPromptUI config', async () => {
-          consentElement = createConsentElement(
-            doc,
-            dict({
-              'consents': {
-                'test': {
-                  'checkConsentHref': '/override',
-                },
-              },
-              'clientConfig': {
-                'test': 'ABC',
-              },
-              'postPromptUI': 'test',
-            })
-          );
+          const config = dict({
+            'consentInstanceId': 'test',
+            'checkConsentHref': '/override',
+            'consentRequired': true,
+            'clientConfig': {
+              'test': 'ABC',
+            },
+            'postPromptUI': 'test',
+          });
+          consentElement = createConsentElement(doc, config);
           const postPromptUI = document.createElement('div');
           postPromptUI.setAttribute('id', 'test');
           consentElement.appendChild(postPromptUI);
@@ -126,16 +140,7 @@ describes.realWin(
 
           expect(ampConsent.postPromptUI_).to.not.be.null;
           expect(ampConsent.consentId_).to.equal('test');
-          expect(ampConsent.consentConfig_).to.deep.equal(
-            dict({
-              'consentInstanceId': 'test',
-              'checkConsentHref': '/override',
-              'postPromptUI': 'test',
-              'clientConfig': {
-                'test': 'ABC',
-              },
-            })
-          );
+          expect(ampConsent.consentConfig_).to.deep.equal(config);
 
           expect(Object.keys(ampConsent.policyConfig_)).to.have.length(4);
           expect(ampConsent.policyConfig_['default']).to.be.ok;
@@ -149,11 +154,8 @@ describes.realWin(
           consentElement = createConsentElement(
             doc,
             dict({
-              'consents': {
-                'XYZ': {
-                  'checkConsentHref': '/r/1',
-                },
-              },
+              'checkConsentHref': '/r/1',
+              'consentInstanceId': 'XYZ',
             })
           );
           const ampConsent = new AmpConsent(consentElement);
@@ -198,14 +200,446 @@ describes.realWin(
           'consentStateValue': 'unknown',
           'consentString': undefined,
           'isDirty': false,
+          'matchedGeoGroup': null,
+        });
+      });
+
+      it('send post request to server with no matched group', async () => {
+        await ampConsent.buildCallback();
+        await macroTask();
+        expect(requestBody).to.deep.equal({
+          'consentInstanceId': 'ABC',
+          'consentStateValue': 'unknown',
+          'consentString': undefined,
+          'isDirty': false,
+          'matchedGeoGroup': null,
         });
       });
 
       it('read promptIfUnknown from server response', async () => {
         await ampConsent.buildCallback();
         await macroTask();
-        return ampConsent.getConsentRequiredPromise_().then(isRequired => {
-          expect(isRequired).to.be.true;
+        return ampConsent
+          .getConsentRequiredPromiseForTesting()
+          .then(isRequired => {
+            expect(isRequired).to.be.true;
+          });
+      });
+
+      it('respects the xssiPrefix option', async () => {
+        const remoteConfig = {
+          'consentInstanceId': 'abc',
+          'checkConsentHref': 'https://xssi-prefix/',
+          'xssiPrefix': 'while(1)',
+        };
+        ampConsent = getAmpConsent(doc, remoteConfig);
+        await ampConsent.buildCallback();
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .false;
+      });
+    });
+
+    describe('geo-override server communication', () => {
+      let ampConsent;
+      beforeEach(() => {
+        toggleExperiment(win, 'amp-consent-geo-override', true);
+      });
+
+      afterEach(() => {
+        toggleExperiment(win, 'amp-consent-geo-override', false);
+      });
+
+      it('checks local storage before making sever request', async () => {
+        const config = {
+          'consentInstanceId': 'abc',
+          'consentRequired': 'remote',
+          'checkConsentHref': 'https://geo-override-check2/',
+        };
+        const localStorageSpy = env.sandbox.spy(storageMock, 'get');
+        const fetchSpy = env.sandbox.spy(xhrServiceMock, 'fetchJson');
+
+        ampConsent = getAmpConsent(doc, config);
+        await ampConsent.buildCallback();
+        await macroTask();
+        expect(localStorageSpy).to.be.calledBefore(fetchSpy);
+        expect(fetchSpy).to.be.calledOnce;
+        const instanceInfo = await ampConsent
+          .getConsentStateManagerForTesting()
+          .getConsentInstanceInfo();
+
+        expect(instanceInfo.consentState).to.equal(CONSENT_ITEM_STATE.UNKNOWN);
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .true;
+      });
+
+      it('respects existing local storage decision', async () => {
+        const config = {
+          'consentInstanceId': 'abc',
+          'consentRequired': 'remote',
+          'checkConsentHref': 'https://geo-override-false/',
+        };
+        storageValue = {
+          'amp-consent:abc': false,
+        };
+        ampConsent = getAmpConsent(doc, config);
+
+        await ampConsent.buildCallback();
+        await macroTask();
+        const instanceInfo = await ampConsent
+          .getConsentStateManagerForTesting()
+          .getConsentInstanceInfo();
+        expect(instanceInfo.consentState).to.equal(CONSENT_ITEM_STATE.REJECTED);
+      });
+
+      it('sends post request to server when consentRequired is remote', async () => {
+        const remoteConfig = {
+          'consentInstanceId': 'abc',
+          'consentRequired': 'remote',
+          'checkConsentHref': 'https://geo-override-check/',
+        };
+        ampConsent = getAmpConsent(doc, remoteConfig);
+        await ampConsent.buildCallback();
+        await macroTask();
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .false;
+      });
+
+      it('resolves consentRequired to remote response with old format', async () => {
+        const remoteConfig = {
+          'consents': {
+            'oldConsent': {
+              'checkConsentHref': 'https://geo-override-check2/',
+            },
+          },
+        };
+        ampConsent = getAmpConsent(doc, remoteConfig);
+        await ampConsent.buildCallback();
+        await macroTask();
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .true;
+      });
+
+      it('send post request to server with matched group', async () => {
+        const remoteConfig = {
+          'consentInstanceId': 'abc',
+          'geoOverride': {
+            'nafta': {
+              'checkConsentHref': 'https://geo-override-check2/',
+              'consentRequired': true,
+            },
+          },
+        };
+        ISOCountryGroups = ['nafta'];
+        ampConsent = getAmpConsent(doc, remoteConfig);
+        await ampConsent.buildCallback();
+        await macroTask();
+        expect(requestBody).to.deep.equal({
+          'consentInstanceId': 'abc',
+          'consentStateValue': 'unknown',
+          'consentString': undefined,
+          'isDirty': false,
+          'matchedGeoGroup': 'nafta',
+        });
+      });
+
+      it('only geoOverrides the first matched group', async () => {
+        const remoteConfig = {
+          'consentInstanceId': 'abc',
+          'geoOverride': {
+            'na': {
+              'checkConsentHref': 'https://geo-override-check2/',
+              'consentRequired': true,
+            },
+            'eea': {
+              'consentRequired': false,
+            },
+          },
+        };
+        ISOCountryGroups = ['na', 'eea'];
+        ampConsent = getAmpConsent(doc, remoteConfig);
+        await ampConsent.buildCallback();
+        await macroTask();
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .true;
+        expect(ampConsent.matchedGeoGroup_).to.equal('na');
+        expect(requestBody).to.deep.equal({
+          'consentInstanceId': 'abc',
+          'consentStateValue': 'unknown',
+          'consentString': undefined,
+          'isDirty': false,
+          'matchedGeoGroup': 'na',
+        });
+      });
+
+      it('fallsback to true with invalide remote reponse', async () => {
+        const remoteConfig = {
+          'consentInstanceId': 'abc',
+          'consentRequired': 'remote',
+          'checkConsentHref': 'https://invalid.response.com/',
+        };
+        ampConsent = getAmpConsent(doc, remoteConfig);
+        await ampConsent.buildCallback();
+        await macroTask();
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .true;
+      });
+
+      describe('remote server response', () => {
+        beforeEach(() => {
+          jsonMockResponses = {
+            'https://server-test-1/':
+              '{"consentRequired": false, "consentStateValue": "unknown", "consentString": "hello"}',
+            'https://server-test-2/':
+              '{"consentRequired": true, "consentStateValue": "rejected", "consentString": "mystring"}',
+            'https://server-test-3/':
+              '{"consentRequired": true, "consentStateValue": "unknown"}',
+            'https://geo-override-check2/': '{"consentRequired": true}',
+          };
+        });
+
+        it('should not update local storage when response is false', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': 'remote',
+            'checkConsentHref': 'https://server-test-1/',
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getConsentInstanceInfo();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('unknown');
+          // 3 is dismissed, 4 is not requried, and 5 is unknown.
+          // All 3 turn into 'unknown'.
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 4,
+            'consentString': undefined,
+            'isDirty': undefined,
+          });
+        });
+
+        it('should not update local storage when response is null', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': 'remote',
+            'checkConsentHref': 'https://geo-override-check2/',
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getConsentInstanceInfo();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('unknown');
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 5,
+            'consentString': undefined,
+            'isDirty': undefined,
+          });
+          expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+            .true;
+        });
+
+        it('updates local storage and uses those values', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': 'remote',
+            'checkConsentHref': 'https://server-test-2/',
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getConsentInstanceInfo();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('rejected');
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 2,
+            'consentString': 'mystring',
+            'isDirty': undefined,
+          });
+        });
+
+        it('accepts unknown as a response', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': 'remote',
+            'checkConsentHref': 'https://server-test-3/',
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getConsentInstanceInfo();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('unknown');
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 5,
+            'consentString': undefined,
+            'isDirty': undefined,
+          });
+        });
+      });
+
+      describe('syncing while local storage exists', () => {
+        beforeEach(() => {
+          jsonMockResponses = {
+            'https://server-test-4/':
+              '{"consentRequired": true, "consentStateValue": "accepted", "consentString": "newstring"}',
+            'https://geo-override-check2/': '{"consentRequired": true}',
+          };
+        });
+
+        it('syncs data from server with existing local storage', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': true,
+            'checkConsentHref': 'https://server-test-4/',
+          };
+          // 0 represents 'rejected' in storage
+          storageValue = {
+            'amp-consent:abc': {
+              [STORAGE_KEY.STATE]: 0,
+              [STORAGE_KEY.STRING]: 'oldstring',
+            },
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getConsentInstanceInfo();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('accepted');
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 1,
+            'consentString': 'newstring',
+            'isDirty': undefined,
+          });
+        });
+
+        it('should not sync data if response is null', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': true,
+            'checkConsentHref': 'https://geo-override-check2/',
+          };
+          // 0 represents 'rejected' in storage
+          storageValue = {
+            'amp-consent:abc': {
+              [STORAGE_KEY.STATE]: 0,
+              [STORAGE_KEY.STRING]: 'mystring',
+            },
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getConsentInstanceInfo();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('rejected');
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 2,
+            'consentString': 'mystring',
+            'isDirty': undefined,
+          });
+        });
+      });
+
+      describe('expire cache', () => {
+        beforeEach(() => {
+          jsonMockResponses = {
+            'https://expire-cache/':
+              '{"expireCache": true,"consentRequired": true, "consentStateValue": null, "consentString": null}',
+            'https://expire-cache-2/':
+              '{"expireCache": true,"consentRequired": true, "consentStateValue": "invalidState"}',
+          };
+        });
+
+        it('should set dirty bit', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': 'remote',
+            'checkConsentHref': 'https://expire-cache/',
+          };
+          // 0 represents 'rejected' in storage
+          storageValue = {
+            'amp-consent:abc': {
+              [STORAGE_KEY.STATE]: 0,
+              [STORAGE_KEY.STRING]: 'mystring',
+            },
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getSavedInstanceForTesting();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('rejected');
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 2,
+            'consentString': 'mystring',
+            'isDirty': true,
+          });
+        });
+
+        it('should not update cache with invalid consent info', async () => {
+          const inlineConfig = {
+            'consentInstanceId': 'abc',
+            'consentRequired': 'remote',
+            'checkConsentHref': 'https://expire-cache-2/',
+          };
+          // 0 represents 'rejected' in storage
+          storageValue = {
+            'amp-consent:abc': {
+              [STORAGE_KEY.STATE]: 0,
+              [STORAGE_KEY.STRING]: 'mystring',
+            },
+          };
+          ampConsent = getAmpConsent(doc, inlineConfig);
+          await ampConsent.buildCallback();
+          await macroTask();
+          const stateManagerInfo = await ampConsent
+            .getConsentStateManagerForTesting()
+            .getSavedInstanceForTesting();
+          const stateValue = getConsentStateValue(
+            stateManagerInfo.consentState
+          );
+
+          expect(stateValue).to.equal('rejected');
+          expect(stateManagerInfo).to.deep.equal({
+            'consentState': 2,
+            'consentString': 'mystring',
+            'isDirty': true,
+          });
         });
       });
     });
@@ -230,9 +664,8 @@ describes.realWin(
         ampConsent = new AmpConsent(consentElement);
         ISOCountryGroups = ['unknown', 'testGroup'];
         await ampConsent.buildCallback();
-        return ampConsent.getConsentRequiredPromise_().then(isRequired => {
-          expect(isRequired).to.be.true;
-        });
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .true;
       });
 
       it('not in geo group', async () => {
@@ -240,9 +673,8 @@ describes.realWin(
         ampConsent = new AmpConsent(consentElement);
         ISOCountryGroups = ['unknown'];
         await ampConsent.buildCallback();
-        return ampConsent.getConsentRequiredPromise_().then(isRequired => {
-          expect(isRequired).to.be.false;
-        });
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .false;
       });
 
       it('geo override promptIfUnknown', async () => {
@@ -261,9 +693,8 @@ describes.realWin(
         doc.body.appendChild(consentElement);
         ampConsent = new AmpConsent(consentElement);
         await ampConsent.buildCallback();
-        return ampConsent.getConsentRequiredPromise_().then(isRequired => {
-          expect(isRequired).to.be.false;
-        });
+        expect(await ampConsent.getConsentRequiredPromiseForTesting()).to.be
+          .false;
       });
     });
 
@@ -394,6 +825,33 @@ describes.realWin(
         });
       });
 
+      afterEach(() => {
+        toggleExperiment(win, 'amp-consent-geo-override', false);
+      });
+
+      it('should not show promptUI if local storage has decision', async () => {
+        toggleExperiment(win, 'amp-consent-geo-override', true);
+        const config = {
+          'consentInstanceId': 'abc',
+          'consentRequired': 'remote',
+          'checkConsentHref': 'https://geo-override-check2/',
+          'promptUI': '123',
+        };
+        storageValue = {
+          'amp-consent:abc': true,
+        };
+
+        ampConsent = getAmpConsent(doc, config);
+        await ampConsent.buildCallback();
+        await macroTask();
+        const instanceInfo = await ampConsent
+          .getConsentStateManagerForTesting()
+          .getConsentInstanceInfo();
+
+        expect(instanceInfo.consentState).to.equal(CONSENT_ITEM_STATE.ACCEPTED);
+        expect(ampConsent.isPromptUIOn_).to.be.false;
+      });
+
       it('update current displaying status', async () => {
         await ampConsent.buildCallback();
         await macroTask();
@@ -485,6 +943,56 @@ describes.realWin(
           expect(postPromptUI).to.have.display('none');
         });
 
+        describe('hide/show postPromptUI with local storage', () => {
+          beforeEach(() => {
+            toggleExperiment(win, 'amp-consent-geo-override', true);
+            defaultConfig = dict({
+              'consentInstanceId': 'ABC',
+              'consentRequired': true,
+              'postPromptUI': 'test2',
+            });
+            consentElement = createConsentElement(doc, defaultConfig);
+            postPromptUI = doc.createElement('div');
+            postPromptUI.setAttribute('id', 'test2');
+            consentElement.appendChild(postPromptUI);
+            doc.body.appendChild(consentElement);
+            ampConsent = new AmpConsent(consentElement);
+          });
+
+          afterEach(() => {
+            toggleExperiment(win, 'amp-consent-geo-override', false);
+          });
+
+          it('hides postPromptUI with no local storage decision', async () => {
+            await ampConsent.buildCallback();
+            expect(postPromptUI).to.have.display('none');
+          });
+
+          it('shows postPromptUI with local storage decision', async () => {
+            const scheduleDisplaySpy = env.sandbox.spy(
+              ampConsent,
+              'scheduleDisplay_'
+            );
+
+            storageValue = {
+              'amp-consent:ABC': true,
+            };
+            await ampConsent.buildCallback();
+            ampConsent.element.classList.remove('i-amphtml-notbuilt');
+            await macroTask();
+            const instanceInfo = await ampConsent
+              .getConsentStateManagerForTesting()
+              .getConsentInstanceInfo();
+
+            expect(instanceInfo.consentState).to.equal(
+              CONSENT_ITEM_STATE.ACCEPTED
+            );
+            expect(scheduleDisplaySpy).to.not.be.called;
+            expect(postPromptUI).to.not.be.null;
+            expect(postPromptUI).to.not.have.display('none');
+          });
+        });
+
         describe('hide/show postPromptUI', () => {
           beforeEach(() => {
             defaultConfig = dict({
@@ -505,7 +1013,7 @@ describes.realWin(
             ampConsent = new AmpConsent(consentElement);
           });
 
-          it('hide postPromptUI', async () => {
+          it('hide postPromptUI with no local storage', async () => {
             await ampConsent.buildCallback();
             ampConsent.element.classList.remove('i-amphtml-notbuilt');
             await macroTask();
@@ -551,3 +1059,16 @@ export function createConsentElement(doc, config, opt_type) {
   consentElement.appendChild(scriptElement);
   return consentElement;
 }
+
+/**
+ * Create an <amp-consent> element and return AmpConsent object.
+ * @param {Document} doc
+ * @param {!JsonObject} config
+ * @param {string=} opt_type
+ * @return {Element}
+ */
+export function getAmpConsent(doc, config) {
+  const consentElement = createConsentElement(doc, config);
+  doc.body.appendChild(consentElement);
+  return new AmpConsent(consentElement);
+}
diff --git a/extensions/amp-consent/0.1/test/test-consent-config.js b/extensions/amp-consent/0.1/test/test-consent-config.js
index 9ce29c1c1a9d3..cd8adfe9ecd90 100644
--- a/extensions/amp-consent/0.1/test/test-consent-config.js
+++ b/extensions/amp-consent/0.1/test/test-consent-config.js
@@ -54,6 +54,7 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
         dict({
           'consentInstanceId': 'ABC',
           'checkConsentHref': 'https://response1',
+          'consentRequired': 'remote',
         })
       );
     });
@@ -68,12 +69,13 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
         dict({
           'consentInstanceId': '_ping_',
           'checkConsentHref': '/get-consent-v1',
-          'promptUISrc': '/test/manual/diy-consent.html',
+          'promptUISrc': '/examples/amp-consent/diy-consent.html',
+          'consentRequired': 'remote',
         })
       );
     });
 
-    it('support deprecated config format', () => {
+    it('converts deprecated format to new format', async () => {
       appendConfigScriptElement(
         doc,
         element,
@@ -96,10 +98,15 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
           'postPromptUI': 'test',
         })
       );
+      env.sandbox.stub(Services, 'geoForDocOrNull').returns(
+        Promise.resolve({
+          isInCountryGroup() {
+            return false;
+          },
+        })
+      );
       const consentConfig = new ConsentConfig(element);
-      return expect(
-        consentConfig.getConsentConfigPromise()
-      ).to.eventually.deep.equal(
+      expect(await consentConfig.getConsentConfigPromise()).to.deep.equal(
         dict({
           'consentInstanceId': 'ABC',
           'promptIfUnknownForGeoGroup': 'eea',
@@ -107,6 +114,7 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
           'clientConfig': {
             'test': 'ABC',
           },
+          'consentRequired': false,
           'uiConfig': {
             'overlay': true,
           },
@@ -115,7 +123,55 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
       );
     });
 
-    it('merge inline config w/ cmp config', () => {
+    it('converts deprecated format to with consentRequired true', async () => {
+      appendConfigScriptElement(
+        doc,
+        element,
+        dict({
+          'consents': {
+            'ABC': {
+              'promptIfUnknownForGeoGroup': 'eea',
+              'checkConsentHref': '/href',
+              'clientConfig': {
+                'test': 'error',
+              },
+            },
+          },
+          'clientConfig': {
+            'test': 'ABC',
+          },
+          'uiConfig': {
+            'overlay': true,
+          },
+          'postPromptUI': 'test',
+        })
+      );
+      env.sandbox.stub(Services, 'geoForDocOrNull').returns(
+        Promise.resolve({
+          isInCountryGroup() {
+            return GEO_IN_GROUP.IN;
+          },
+        })
+      );
+      const consentConfig = new ConsentConfig(element);
+      expect(await consentConfig.getConsentConfigPromise()).to.deep.equal(
+        dict({
+          'consentInstanceId': 'ABC',
+          'promptIfUnknownForGeoGroup': 'eea',
+          'checkConsentHref': '/href',
+          'clientConfig': {
+            'test': 'ABC',
+          },
+          'consentRequired': true,
+          'uiConfig': {
+            'overlay': true,
+          },
+          'postPromptUI': 'test',
+        })
+      );
+    });
+
+    it('merge inline config w/ cmp config', async () => {
       appendConfigScriptElement(
         doc,
         element,
@@ -137,15 +193,21 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
           'postPromptUI': 'test',
         })
       );
+      env.sandbox.stub(Services, 'geoForDocOrNull').returns(
+        Promise.resolve({
+          isInCountryGroup() {
+            return false;
+          },
+        })
+      );
       element.setAttribute('type', '_ping_');
       const consentConfig = new ConsentConfig(element);
-      return expect(
-        consentConfig.getConsentConfigPromise()
-      ).to.eventually.deep.equal(
+      expect(await consentConfig.getConsentConfigPromise()).to.deep.equal(
         dict({
           'consentInstanceId': '_ping_',
           'checkConsentHref': '/override',
-          'promptUISrc': '/test/manual/diy-consent.html',
+          'consentRequired': false,
+          'promptUISrc': '/examples/amp-consent/diy-consent.html',
           'promptIfUnknownForGeoGroup': 'eea',
           'postPromptUI': 'test',
           'clientConfig': {
@@ -182,6 +244,10 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
               'checkConsentHref': 'https://example.com/check-consent',
               'consentRequired': true,
             },
+            'invalid': {
+              'consentInstanceId': 'error',
+              'checkConsentHref': 'https://example.com/check-consent',
+            },
           },
         };
       });
@@ -277,6 +343,65 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
           'consentRequired': true,
         });
       });
+
+      it('should have remote consentRequired if checkConsentHref', async () => {
+        geoConfig = {
+          'consentInstanceId': 'abc',
+          'checkConsentHref': 'https://example.com/check-consent',
+        };
+        appendConfigScriptElement(doc, element, geoConfig);
+        const consentConfig = new ConsentConfig(element);
+        expect(await consentConfig.getConsentConfigPromise()).to.deep.equal({
+          'consentInstanceId': 'abc',
+          'checkConsentHref': 'https://example.com/check-consent',
+          'consentRequired': 'remote',
+        });
+      });
+
+      it('should convert promptIfUnknownForGeoGroup', async () => {
+        geoConfig = {
+          'consentInstanceId': 'abc',
+          'promptIfUnknownForGeoGroup': 'na',
+        };
+        env.sandbox.stub(Services, 'geoForDocOrNull').returns(
+          Promise.resolve({
+            isInCountryGroup(geoGroup) {
+              if (geoGroup === 'na') {
+                return GEO_IN_GROUP.IN;
+              }
+              return GEO_IN_GROUP.NOT_IN;
+            },
+          })
+        );
+        appendConfigScriptElement(doc, element, geoConfig);
+        const consentConfig = new ConsentConfig(element);
+        expect(await consentConfig.getConsentConfigPromise()).to.deep.equal({
+          'consentInstanceId': 'abc',
+          'consentRequired': true,
+          'promptIfUnknownForGeoGroup': 'na',
+        });
+      });
+
+      it('should not override consentInstanceId', async () => {
+        expectAsyncConsoleError(/consentInstanceId/, 1);
+        appendConfigScriptElement(doc, element, geoConfig);
+        env.sandbox.stub(Services, 'geoForDocOrNull').returns(
+          Promise.resolve({
+            isInCountryGroup(geoGroup) {
+              if (geoGroup === 'invalid') {
+                return GEO_IN_GROUP.IN;
+              }
+              return GEO_IN_GROUP.NOT_IN;
+            },
+          })
+        );
+        const consentConfig = new ConsentConfig(element);
+        expect(await consentConfig.getConsentConfigPromise()).to.deep.equal({
+          'consentInstanceId': 'abc',
+          'consentRequired': false,
+          'checkConsentHref': 'https://example.com/check-consent',
+        });
+      });
     });
 
     it('assert valid config', async () => {
@@ -370,23 +495,23 @@ describes.realWin('ConsentConfig', {amp: 1}, env => {
       ).to.throw(multiScriptError);
     });
 
-    it('remove not supported policy', () => {
-      toggleExperiment(win, 'multi-consent', false);
+    it('remove not supported policy', async () => {
       appendConfigScriptElement(
         doc,
         element,
         dict({
           'consentInstanceId': 'ABC',
+          'checkConsentHref': 'example.com/',
           'policy': {
             'ABC': undefined,
           },
         })
       );
       const consentConfig = new ConsentConfig(element);
-      return expect(
-        consentConfig.getConsentConfigPromise()
-      ).to.eventually.deep.equal({
+      expect(await consentConfig.getConsentConfigPromise()).to.deep.equal({
         'consentInstanceId': 'ABC',
+        'checkConsentHref': 'example.com/',
+        'consentRequired': 'remote',
         'policy': {},
       });
     });
diff --git a/extensions/amp-consent/0.1/test/test-consent-info.js b/extensions/amp-consent/0.1/test/test-consent-info.js
index c509310c6c484..4cf8e41755e39 100644
--- a/extensions/amp-consent/0.1/test/test-consent-info.js
+++ b/extensions/amp-consent/0.1/test/test-consent-info.js
@@ -171,11 +171,13 @@ describes.fakeWin('ConsentInfo', {}, () => {
       newState
     );
 
-    // UNKNOWN/DISMISS/NOT_REQUIRED cannot override reject/accept
+    // UNKNOWN will clear stored REJECTED/ACCEPTED
     newState = CONSENT_ITEM_STATE.UNKNOWN;
     expect(recalculateConsentStateValue(newState, previousState)).to.equal(
-      previousState
+      CONSENT_ITEM_STATE.UNKNOWN
     );
+
+    //DISMISS/NOT_REQUIRED cannot override reject/accept
     newState = CONSENT_ITEM_STATE.DISMISSED;
     expect(recalculateConsentStateValue(newState, previousState)).to.equal(
       previousState
@@ -185,12 +187,8 @@ describes.fakeWin('ConsentInfo', {}, () => {
       previousState
     );
 
-    // UNKNOWN/DISMISS cannot override NOT_REQUIRED
+    // DISMISS cannot override NOT_REQUIRED
     previousState = CONSENT_ITEM_STATE.NOT_REQUIRED;
-    newState = CONSENT_ITEM_STATE.UNKNOWN;
-    expect(recalculateConsentStateValue(newState, previousState)).to.equal(
-      previousState
-    );
     newState = CONSENT_ITEM_STATE.DISMISSED;
     expect(recalculateConsentStateValue(newState, previousState)).to.equal(
       previousState
diff --git a/extensions/amp-consent/0.1/test/test-consent-state-manager.js b/extensions/amp-consent/0.1/test/test-consent-state-manager.js
index cddd606fe827b..2eb26ec5ef10d 100644
--- a/extensions/amp-consent/0.1/test/test-consent-state-manager.js
+++ b/extensions/amp-consent/0.1/test/test-consent-state-manager.js
@@ -281,6 +281,18 @@ describes.realWin('ConsentStateManager', {amp: 1}, env => {
             'amp-consent:test',
             composeStoreValue(consentInfo)
           );
+
+          instance.update(CONSENT_ITEM_STATE.DISMISS);
+          yield macroTask();
+          storageSetSpy.resetHistory();
+          storageRemoveSpy.resetHistory();
+          expect(storageSetSpy).to.not.be.called;
+          expect(storageRemoveSpy).to.not.be.called;
+
+          instance.update(CONSENT_ITEM_STATE.UNKNOWN, 'test');
+          yield macroTask();
+          expect(storageSetSpy).to.not.be.called;
+          expect(storageRemoveSpy).to.be.calledOnce;
         });
 
         it('remove consentInfo when consentStr length exceeds', function*() {
diff --git a/extensions/amp-consent/0.1/test/test-consent-ui.js b/extensions/amp-consent/0.1/test/test-consent-ui.js
index 6df4f54627953..9b347a6a67a19 100644
--- a/extensions/amp-consent/0.1/test/test-consent-ui.js
+++ b/extensions/amp-consent/0.1/test/test-consent-ui.js
@@ -294,6 +294,103 @@ describes.realWin(
           })
         );
       });
+
+      describe('fullscreen user interaction experiment', () => {
+        beforeEach(() => {
+          toggleExperiment(win, 'amp-consent-restrict-fullscreen', true);
+        });
+
+        afterEach(() => {
+          toggleExperiment(win, 'amp-consent-restrict-fullscreen', false);
+        });
+
+        it('should not change document.activeElement', () => {
+          const {activeElement} = doc;
+          consentUI = new ConsentUI(mockInstance, {
+            'promptUISrc': 'https//promptUISrc',
+          });
+          const showIframeSpy = env.sandbox.spy(consentUI, 'showIframe_');
+
+          consentUI.show(false);
+          consentUI.iframeReady_.resolve();
+
+          return whenCalled(showIframeSpy).then(() =>
+            expect(activeElement).to.equal(doc.activeElement)
+          );
+        });
+
+        it('should not expand if iframe is not in focus', async () => {
+          consentUI = new ConsentUI(mockInstance, {
+            'promptUISrc': 'https//promptUISrc',
+          });
+
+          consentUI.show(false);
+          consentUI.iframeReady_.resolve();
+          await macroTask();
+
+          // not currently fullscreen
+          expect(consentUI.isFullscreen_).to.be.false;
+          expect(
+            consentUI.parent_.classList.contains(
+              consentUiClasses.iframeFullscreen
+            )
+          ).to.be.false;
+
+          // Send expand
+          consentUI.handleIframeMessages_({
+            source: consentUI.ui_.contentWindow,
+            data: {
+              type: 'consent-ui',
+              action: 'enter-fullscreen',
+            },
+          });
+
+          expect(consentUI.isFullscreen_).to.be.false;
+          expect(
+            consentUI.parent_.classList.contains(
+              consentUiClasses.iframeFullscreen
+            )
+          ).to.be.false;
+        });
+
+        it('should expand if iframe is in focus', async () => {
+          consentUI = new ConsentUI(mockInstance, {
+            'promptUISrc': 'https//promptUISrc',
+          });
+
+          consentUI.show(false);
+          consentUI.iframeReady_.resolve();
+          await macroTask();
+
+          // not currently fullscreen
+          expect(consentUI.isFullscreen_).to.be.false;
+          expect(
+            consentUI.parent_.classList.contains(
+              consentUiClasses.iframeFullscreen
+            )
+          ).to.be.false;
+
+          // focus on iframe
+          consentUI.ui_.focus();
+          expect(doc.activeElement).to.equal(consentUI.ui_);
+
+          // Send expand
+          consentUI.handleIframeMessages_({
+            source: consentUI.ui_.contentWindow,
+            data: {
+              type: 'consent-ui',
+              action: 'enter-fullscreen',
+            },
+          });
+
+          expect(consentUI.isFullscreen_).to.be.true;
+          expect(
+            consentUI.parent_.classList.contains(
+              consentUiClasses.iframeFullscreen
+            )
+          ).to.be.true;
+        });
+      });
     });
 
     describe('overlay', () => {
diff --git a/extensions/amp-consent/amp-consent.md b/extensions/amp-consent/amp-consent.md
index 61d9af26c83b8..bb267d878ec86 100644
--- a/extensions/amp-consent/amp-consent.md
+++ b/extensions/amp-consent/amp-consent.md
@@ -71,7 +71,7 @@ If you also include an `<amp-user-notification>` element on the page, the UI ass
 
 ## Consent configuration
 
-The `<amp-consent>` element requires a JSON configuration object that specifies the extension's behavior. A `consents` object is required within the JSON object.
+The `<amp-consent>` element requires a JSON configuration object that specifies the extension's behavior.
 
 Example:
 
@@ -79,14 +79,18 @@ Example:
 <amp-consent layout="nodisplay" id="consent-element">
   <script type="application/json">
     {
-      "consents": {
-        "my-consent": {
-          "checkConsentHref": "https://example.com/api/show-consent",
-          "promptUI": "consent-ui"
-        }
-      }
+      "consentInstanceId": "my-consent",
+      "consentRequired": "remote",
+      "checkConsentHref": "https://example.com/api/check-consent",
+      "promptUI": "consent-ui",
+      "onUpdateHref": "https://example.com/update-consent"
     }
   </script>
+  <div id="consent-ui">
+    <button on="tap:consent-element.accept" role="button">Accept</button>
+    <button on="tap:consent-element.reject" role="button">Reject</button>
+    <button on="tap:consent-element.dismiss" role="button">Dismiss</button>
+  </div>
 </amp-consent>
 ```
 
@@ -94,39 +98,69 @@ Example:
 
 #### Consent instance ID
 
-Currently, the `consents` object only supports a single consent instance. A consent instance must have an ID specified within the `consents` object (in the example above, "my-consent" is the id). The consent instance ID is used to generate a key when storing the user consent state.
+`consentInstanceId`: The identifier of a consent configuration.
 
 #### checkConsentHref
 
-`checkConsentHref`: Instructs AMP to make a CORS POST request with credentials to the specified URL to remotely configure the consent. The purpose is to determine if a prompt UI should be shown if the consent state is unknown.
-
-`checkConsentHref` is required if [`promptIfUnknownForGeoGroup`](#promptifunknownforgeogroup) is not defined.
+`checkConsentHref`: Instructs AMP to make a CORS POST request with credentials to the specified URL to remotely configure the consent. The purpose can be any of 1) determine if consent is required for the user, 2) get the consent state from server, 3) get extra `sharedData` from server to share with AMP components.
 
 ##### Request
 
 AMP sends the consent instance ID in the `consentInstanceId` field with the POST request.
 
-```html
-{ "consentInstanceId": "my-consent" }
+```
+{
+  "consentInstanceId": {string},
+  "consentStateValue": {enum}, // the stored consent state in client cache
+                               // takes value of ["accepted", "rejected", "unknown"]
+  "consentString": {string},   // the stored consent string in client cache
+  "matchedGeoGroup": {string}, // (new) the user's geoGroup detected by AMP.
+}
 ```
 
 ##### Response
 
-AMP expects the response to be a JSON object with a `promptIfUnknown` value that tells AMP if a prompt should be displayed when the user consent state is unknown.
+AMP expects the response to be a JSON object like the following:
 
-```html
-{ "promptIfUnknown": true/false }
+```
+{
+  "consentRequired": {boolean}                  // Whether consent is required from the user.
+                                                // The value is required it is used to
+                                                // determine if consent is required. If not
+                                                // found, AMP will unblock content as consent is not required.
+  "consentStateValue": {?enum} [default: null], // The latest consent state known
+                                                // by the server
+                                                // Takes value of ["accepted", "rejected",
+                                                // "unknown"].
+                                                // The value will be ignored if
+                                                // "consentRequired: false".
+                                                // If the value is non-null, it will be cached at client.
+  "consentString": {?string} [default: null],   // The latest consent string known by the server.
+                                                // If the value is non-null,
+                                                // and if the consentStateValue is "accepted" or "rejected",
+                                                // the value will be cached at client.
+  "expireCache": {boolean} [default: false]     // Indicate that the cache needs to be cleared
+                                                // Set to `true` in conjunction with
+                                                // consentStateValue='accepted'/'rejected'
+                                                // to enforce server side consent state
+}
 ```
 
-If the response doesn't have `promptIfUnknown` set or has `promptIfUnknown` set to false, no prompt UI will be displayed on page load.
+**Note: The legacy `promptIfUnknown` is migrating to `consentRequired` as prompt is no longer strictly required to manage consents.**
 
-Currently, AMP will not show consent prompt with a known consent state (i.e. the user has already accepted or rejected the consent), and will only show a prompt if `promptIfUnknown = true` with a unknown consent state, or upon user action. See below for details on how to display a prompt.
+The `consentStateValue` can be thought of as a signal for the runtime to block and unblock components. The value `accepted` instructs AMP that the user has given consent (or doesn't revoke consent in the opt-out case). This can be used to serve personalized ads in some scenarios. The value `rejected` means the user doesn't give consent (or has revoked consent in the opt-out case) and vendors may decide to not serve personalized ads.
 
 Optionally, additional key-value pairs can be returned in the response as the `sharedData` field.
 
-```html
-{ "promptIfUnknown": true/false, "sharedData": { "a-key": "some-string-value",
-"key-with-bool-value": true, "key-with-numeric-value": 123 } }
+```json
+{
+  "consentRequire": true,
+  "sharedData": {
+    "a-key": "some-string-value",
+    "key-with-bool-value": true,
+    "key-with-numeric-value": 123
+  }
+}
 ```
 
 The `sharedData` is made available to other AMP extensions just like the consent
@@ -137,28 +171,123 @@ current user to the 3rd party vendor extensions.
 
 Unlike consent state, this `shareData` is not persisted in client side storage.
 
+#### consentRequired
+
+`consentRequired`: It accepts a boolean value indicating if a consent is required. `<amp-consent>` will unblock components with an `UNKNOWN_NOT_REQUIRED` state if `consentRequired: false` and there's no previous consent decision stored in client cache. It makes sense mostly with a combination of [geoOverride](#geooverride) config so that only a certain regions require consent.
+
+It can also be set to `consentRequired: "remote"` to fetch the value remotely from the `checkConsentHref` endpoint. This is
+useful when publishers want to use their own server to decide if consent is required. For example, they want to have their own geo detection, or use the existing consent state for a known user. When used without `geoOverride`(#geooverride), the `consentRequired` value is set to `remote` by default if not specified.
+
+Note that this value will be ignored if there is previous consent state stored in client cache (see [Client caching](#client-caching) section for examples).
+
 #### onUpdateHref
 
 `onUpdateHref`: Instructs AMP to make a CORS HTTPS POST request with credentials to the specified URL whenever the stored consent state changes.
 
 AMP sends the consent instance ID, a generated user id only for this usage and the consent state along with the POST request.
 
-```html
-{ "consentInstanceId": "my-consent", "ampUserId": "xxx", "consentState":
-true/false, }
 ```
+{
+  "consentInstanceId": "my-consent",
+  "ampUserId": "xxx",
+  "consentStateValue": "accepted"/"rejected"/"unknown"
+}
+```
+
+#### promptUI
 
-#### promptIfUnknownForGeoGroup
+`promptUI`: Specifies the prompt element that is shown to collect the user's consent. The prompt element should be child element of `<amp-consent>` with an `id` that is referenced by the `promptUI`. See the [Prompt UI](#prompt-ui) section for details on how a user interacts with the prompt UI.
 
-`promptIfUnknownForGeoGroup` Provides an alternative way to instruct AMP to display consent prompt or not when consent state is unknown.
+The consent decisions collected from user via this prompt UI will be stored in `localStorage` as client cache. See the [Client caching](#client-caching) section for how the cache is used.
 
-To use `promptIfUnknownForGeoGroup`, a `<amp-geo>` component must be included and properly configured. The `promptIfUnknownForGeoGroup` then accepts a key of a geo group of country codes. More details on how `<amp-geo>` works can be found [here](https://github.com/ampproject/amphtml/blob/master/extensions/amp-geo/amp-geo.md).
+#### geoOverride
 
-In the case that `checkConsentHref` and `promptIfUnknownForGeoGroup` are both defined. The value from `<amp-geo>` will be respected.
+`geoOverride` provides a way to utilize the `<amp-geo>` component to detect user's geo location to assist client side decisions.
 
-#### promptUI
+`geoOverride` is a JSON object keyed by geo group codes which are defined in `<amp-geo>` (details [here](https://github.com/ampproject/amphtml/blob/master/extensions/amp-geo/amp-geo.md)). Each geo override should be a valid `<amp-consent>` config object. AMP will take all the values in the corresponding `geoOverride` to override the existing config. The only exception here is that the `consentInstanceId` cannot be overwritten by `geoOverride` config, because AMP only manage and store consent information in a single instance.
 
-`promptUI`: Specifies the prompt element that is shown to collect the user's consent. The prompt element should be child element of `<amp-consent>` with an `id` that is referenced by the `promptUI`. See the [Prompt UI](#prompt-ui) section for details on how a user interacts with the prompt UI.
+Two important tips when configuring `amp-geo`:
+
+- All geo groups should be mutually exclusive. The behavior is undetermined if a user falls into multiple geo override.
+- Provide an `geoGroupUnknown` override for users that are failed be be identified by `<amp-geo>`.
+
+Take the following config as an example:
+
+```json
+{
+  "onUpdateHref": "https://example.com/update-consent",
+  "promptUI": "consent-ui",
+  "consentRequired": false,
+
+  "geoOverride": {
+    "geoGroup1": {
+      "consentRequired": true
+    },
+    "geoGroup2": {
+      "checkConsentHref": "https://example.com/check-consent",
+      "consentRequired": "remote"
+    },
+    "geoGroupUnknown": {
+      "checkConsentHref": "https://example.com/check-consent",
+      "consentRequired": true
+    }
+  }
+}
+```
+
+For users outside `geoGroup1`, `geoGroup2` & `geoGroupUknown`, the merged config is
+
+```json
+{
+  "onUpdateHref": "https://example.com/update-consent",
+  "promptUI": "consent-ui",
+  "consentRequired": false
+}
+```
+
+`<amp-consent>` does nothing because `"consentRequired": false`.
+
+For users in `geoGroup1`, the merged config is
+
+```json
+{
+  "onUpdateHref": "https://example.com/update-consent",
+  "promptUI": "consent-ui",
+  "consentRequired": true
+}
+```
+
+Because `checkConsentHref` is not specified, both consent collection and storage are completely handled at client side. AMP will prompt the consent UI if and only if the client cache is empty.
+
+For users in `geoGroup2`, the merged config is
+
+```json
+{
+  "onUpdateHref": "https://example.com/update-consent",
+  "promptUI": "consent-ui",
+  "checkConsentHref": "https://example.com/check-consent",
+  "consentRequired": "remote"
+}
+```
+
+If client cache is empty, AMP will wait for `checkConsentHref` response to decide whether a consent is required from the user. If the response contains `consentRequired: true` and `consentStateValue: unknown`, then AMP will collect consent via the specified prompt UI. If `consentStateValue` is 'accepted' or 'rejected', then it will use this value and also sync to cache.
+
+For users in `geoGroupUnknown`, the merged config is
+
+```json
+{
+  "onUpdateHref": "https://example.com/update-consent",
+  "promptUI": "consent-ui",
+  "checkConsentHref": "https://example.com/check-consent",
+  "consentRequired": true
+}
+```
+
+AMP will check client cache and server in parallel to find the previous consent state. Because `"consentRequired": true` it will collect consent via the specified prompt UI if cache is empty w/o waiting for the server response. The server response is mainly for cache refresh or fetching `shareData`.
+
+#### xssiPrefix
+
+`xssiPrefix`: Causes `<amp-consent>` to strip a prefix from the `checkConsentHref` endpoint's response. If the prefix is not present in the response, then this option will have no effect. `xssiPrefix` can be useful for APIs that include [security prefixes](http://patorjk.com/blog/2013/02/05/crafty-tricks-for-avoiding-xssi/) like `)]}` to help prevent cross site scripting attacks.
 
 ## Consent Management
 
@@ -180,12 +309,9 @@ _Example_: Displays a prompt user interface
 <amp-consent layout="nodisplay" id="consent-element">
   <script type="application/json">
     {
-      "consents": {
-        "my-consent": {
-          "checkConsentHref": "https://foo.com/api/show-consent",
-          "promptUI": "consent-ui"
-        }
-      }
+      "consentInstanceId": "my-consent",
+      "checkConsentHref": "https://foo.com/api/show-consent",
+      "promptUI": "consent-ui"
     }
   </script>
   <div id="consent-ui">
@@ -299,9 +425,19 @@ The post-prompt UI provides one user action type that can be used to allow the u
 
 The `<amp-consent>` element can be used to block any other AMP components on the page from loading (except `<amp-consent>` itself).
 
+### Client caching
+
+The consent information (from the response or from user action on client side) will be cached on client side in localStorage. The cached value if exist will always be used by `<amp-consent>` to unblock content for performance optimization. Server endpoint can instruct `<amp-consent>` to erase the stored value so that it won't be used to unblock content the next visit using the `expireCache: true`.
+
+A couple of implications with this behavior:
+
+- When stored user consent no longer applies, the change will be synced through `checkConsentHref` response. But the change will be applied one-time off due to the client cache.
+- When a user travels, `<amp-consent>` will use the stored consent. It's up to the `checkConsentHref` response to erase stored value using `expireCache: true` and `consentRequired: false`.
+- If a promptUI is used to collect user consent. Using `expireCache: true` will prompt consent dialog and block users from content on their following visits.
+
 ### Basic blocking behaviors
 
-To block components, add the `data-block-on-consent` attribute to the AMP component. This ensures that `buildCallback` of the component isn't called until consent has been accepted, or if the consent prompt has been skipped by the `checkConsentHref` response or `promptIfUnknownForGeoGroup` when consent is unknown. In effect, this means that all behaviors of the element (e.g. sending analytics pings for `<amp-analytics>` or the loading of an `<amp-ad>`) are delayed until the relevant consent instance is accepted.
+To block components, add the `data-block-on-consent` attribute to the AMP component. This ensures that `buildCallback` of the component isn't called until consent has been accepted, or if consent is not required for the user based on the `consentRequired` value. In effect, this means that all behaviors of the element (e.g. sending analytics pings for `<amp-analytics>` or the loading of an `<amp-ad>`) are delayed until the relevant consent instance is accepted.
 
 Individual components may override this behavior to provide more specialized handling. Please refer to each component's documentation for details.
 
@@ -434,37 +570,33 @@ Example:
 
 Use the `<amp-consent>` component which allows configuring a custom UI with `Accept`, `Reject` and `Dismiss` states. It is up to each amp-component vendor how they interpret these states, so please read your vendor's documentation carefully.
 
-Note that you must configure either the [`promptIfUnknownForGeoGroup`](#promptifunknownforgeogroup) attribute or the checkConsentHref request.
-
 ##### How can I stop showing all of my content to users from the EEA?
 
 You could consider hiding all your content for EEA users by implementing [`<amp-geo>`](https://amp.dev/documentation/components/amp-geo). See [this blog post](https://www.ampproject.org/latest/blog/dynamic-geo-personalization/) for more details.
 
 ##### How can I target consent for only EEA users?
 
-Use [`<amp-geo>`](https://amp.dev/documentation/components/amp-geo) to configure a country group and hook up the country group to `promptIfUnknownForGeoGroup` attribute in `<amp-consent>`. If the user accesses the AMP page from a country that's configured in the list, the appropriate consent UI will be invoked.
+Use [`<amp-geo>`](https://amp.dev/documentation/components/amp-geo) to configure a country group and hook up the country group to `geoOverride` attribute in `<amp-consent>`. If the user accesses the AMP page from a country that's configured in the list, the appropriate consent UI will be invoked.
 
 ##### Can I make the consent UI blocking?
 
 Yes. The UI is not prescriptive. If you do end up providing a non-blocking version of the UI, dismissing the UI will lead to a `dismiss` state. It is up to each vendor (ads & analytics) how they would process `accept`, `reject` and `dismiss`.
 
-##### What is `checkConsentHref`? And why is it mandatory?
+##### What is `checkConsentHref`? And is it mandatory?
 
-Note that [`checkConsentHref`](#checkconsenthref) is not mandatory if you configure the [`promptIfUnknownForGeoGroup`](#promptifunknownforgeogroup) attribute.
+Note that [`checkConsentHref`](#checkconsenthref) is not mandatory if you collect consent and store consent completely at client side.
 
-`checkConsentHref` gives you, the publisher, the ability to know if a consent must be shown to the user. For example, by using this call, you may determine the user's geo-location on the server-side, allowing you to suppress the consent. You can also instead use `<amp-geo>` and `promptIfUnknownForGeoGroup` to achieve the same result without any server-side setup.
+`checkConsentHref` gives you, the publisher, the ability to know if a consent must be shown to the user. For example, by using this call, you may determine the user's geo-location on the server-side, allowing you to suppress the consent. You can also instead use `<amp-geo>` and `geoOverride` to achieve the same result without any server-side setup.
 
 You may also choose to suppress the consent if you detect that the user doesn't need consent because they accepted consent on a different property or for alternate reasons.
 
-##### What is `promptIfUnknown`?
+##### What is `consentRequired`?
 
-`promptIfUnknown` is a response key set on the `checkConsentHref` request, which is made on every pageview.
-
-Responses to `promptIfUnknown` can have a boolean value. A value of `true` shows the consent; a value of `false` does not show the consent.
+[`consentRequired`](#consentRequired) is used to determine if consent is required for the user. It can be specified in the config of `<amp-consent>` for different geo regions, it can also be retrieved from the `checkConsentHref` endpoint.
 
 ##### I also manage consent on non-AMP pages, how can I reconcile the two?
 
-You can configure `checkConsentHref` to call your own server-side endpoint to detect consent state for the user and reconcile how you want AMP to behave with a response on `promptIfUnknown`.
+You can configure `checkConsentHref` to call your own server-side endpoint to detect consent state for the user and reconcile how you want AMP to behave with using a response from the [`checkConsentHref`](#checkConsentHref).
 
 ##### How can I send additional information to an ad network/analytics provider?
 
@@ -476,7 +608,7 @@ You should try out the [advanced consent flows](https://amp.dev/documentation/ex
 
 ##### How can I show a persistent UX element for users to update their consent preferences?
 
-You can use the optional [post-prompt UI](#post-prompt) to accomplish this. View this [sample on AMP By Example](https://amp.dev/documentation/examples/user-consent/basic_user_consent_flow/) for a similar implementation.
+You can use the optional [post-prompt UI](#post-prompt) to accomplish this. View this [sample on AMP By Example](https://amp.dev/documentation/examples/user-consent/client_side_user_consent_flow/) for a similar implementation.
 
 ##### Can I keep the non-EU experience unchanged and just deliver an "opt-out" experience to all EU users?
 
@@ -511,5 +643,7 @@ Join in on the discussion where we are discussing [upcoming potential features](
 ## Supported Consent Management Platforms
 
 - Didomi : [Website](https://www.didomi.io/) - [Documentation](https://developers.didomi.io/cmp/amp)
-- SourcePoint : [Website](https://www.sourcepoint.com/) - [Documentation](/extensions/amp-consent/cmps/sourcepoint.md)
+- Marfeel : [Website](https://www.marfeel.com/) - [Documentation](https://github.com/ampproject/amphtml/blob/master/extensions/amp-consent/cmps/marfeel.md)
+- SourcePoint : [Website](https://www.sourcepoint.com/) - [Documentation](https://github.com/ampproject/amphtml/blob/master/extensions/amp-consent/cmps/sourcepoint.md)
+
 - Your Integrated platform here!
diff --git a/extensions/amp-consent/cmps/marfeel.md b/extensions/amp-consent/cmps/marfeel.md
new file mode 100644
index 0000000000000..8e4da884444b3
--- /dev/null
+++ b/extensions/amp-consent/cmps/marfeel.md
@@ -0,0 +1,50 @@
+<!---
+Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# Marfeel
+
+CMP used through Marfeel platform in order to handle and enforce user consent.
+
+## Example
+
+```html
+<amp-consent id="consent" layout="nodisplay" type="Marfeel">
+  <script type="application/json">
+    {
+      "postPromptUI": "postPromptUI",
+      "clientConfig": {
+        "consentLanguage": "language-code",
+        "publisherLogo": "website-logo"
+      }
+    }
+  </script>
+  <div id="postPromptUI">
+    Post Prompt UI
+    <button on="tap:consent.prompt(consent=Marfeel)" role="button">
+      Manage
+    </button>
+  </div>
+</amp-consent>
+```
+
+## Configuration
+
+| Attribute       |  Type  | Mandatory | Description                                         |
+| --------------- | :----: | :-------: | --------------------------------------------------- |
+| consentLanguage | String |    yes    | Language code (in ISO-639-1) to display the consent |
+| publisherLogo   | String |    yes    | URL of your website logo                            |
+
+Please contact [Marfeel](https://marfeel.com) for further details regarding the configuration of this CMP.
diff --git a/extensions/amp-dailymotion/0.1/amp-dailymotion.js b/extensions/amp-dailymotion/0.1/amp-dailymotion.js
index 5b6c7e38edb97..e3241f36bd93e 100644
--- a/extensions/amp-dailymotion/0.1/amp-dailymotion.js
+++ b/extensions/amp-dailymotion/0.1/amp-dailymotion.js
@@ -112,9 +112,17 @@ class AmpDailymotion extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://www.dailymotion.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://www.dailymotion.com',
+      opt_onLayout
+    );
     // Host that Dailymotion uses to serve JS needed by player.
-    this.preconnect.url('https://static1.dmcdn.net', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://static1.dmcdn.net',
+      opt_onLayout
+    );
   }
 
   /**
diff --git a/extensions/amp-date-display/0.1/amp-date-display.js b/extensions/amp-date-display/0.1/amp-date-display.js
index b8a9f11ec53b4..93f54a0ccf989 100644
--- a/extensions/amp-date-display/0.1/amp-date-display.js
+++ b/extensions/amp-date-display/0.1/amp-date-display.js
@@ -252,7 +252,8 @@ export class AmpDateDisplay extends AMP.BaseElement {
     const hour12 = data.hour % 12 || 12;
 
     // Override type since Object.assign is not understood
-    return /** @type {!EnhancedVariablesDef} */ (Object.assign({}, data, {
+    return /** @type {!EnhancedVariablesDef} */ ({
+      ...data,
       yearTwoDigit: this.padStart_(data.year % 100),
       monthTwoDigit: this.padStart_(data.month),
       dayTwoDigit: this.padStart_(data.day),
@@ -262,7 +263,7 @@ export class AmpDateDisplay extends AMP.BaseElement {
       minuteTwoDigit: this.padStart_(data.minute),
       secondTwoDigit: this.padStart_(data.second),
       dayPeriod: data.hour < 12 ? 'am' : 'pm',
-    }));
+    });
   }
 
   /**
diff --git a/extensions/amp-date-display/0.2/amp-date-display.js b/extensions/amp-date-display/0.2/amp-date-display.js
new file mode 100644
index 0000000000000..5645bd63749a6
--- /dev/null
+++ b/extensions/amp-date-display/0.2/amp-date-display.js
@@ -0,0 +1,97 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {AsyncRender} from './async-render';
+import {DateDisplay} from './date-display';
+import {Fragment, createElement} from '../../../src/preact';
+import {PreactBaseElement} from '../../../src/preact/base-element';
+import {RenderDomTree} from './render-dom-tree';
+import {Services} from '../../../src/services';
+import {dict} from '../../../src/utils/object';
+import {isExperimentOn} from '../../../src/experiments';
+import {isLayoutSizeDefined} from '../../../src/layout';
+import {userAssert} from '../../../src/log';
+
+/** @const {string} */
+const TAG = 'amp-date-display';
+
+class AmpDateDisplay extends PreactBaseElement {
+  /** @override */
+  init() {
+    const templates = Services.templatesFor(this.win);
+    let rendered = false;
+
+    return dict({
+      /**
+       * @param {!JsonObject} data
+       * @param {*} children
+       * @return {*}
+       */
+      'render': (data, children) => {
+        // We only render once in AMP mode, but React mode may rerender
+        // serveral times.
+        if (rendered) {
+          return children;
+        }
+        rendered = true;
+
+        const host = this.element;
+        const domPromise = templates
+          .findAndRenderTemplate(host, data)
+          .then(rendered => {
+            const container = document.createElement('div');
+            container.appendChild(rendered);
+
+            return createElement(RenderDomTree, {
+              'dom': container,
+              'host': host,
+            });
+          });
+        const asyncRender = createElement(AsyncRender, null, domPromise);
+        return createElement(Fragment, null, children, asyncRender);
+      },
+    });
+  }
+
+  /** @override */
+  isLayoutSupported(layout) {
+    userAssert(
+      isExperimentOn(this.win, 'amp-date-display-v2'),
+      'expected amp-date-display-v2 experiment to be enabled'
+    );
+    return isLayoutSizeDefined(layout);
+  }
+}
+
+/** @override */
+AmpDateDisplay.Component = DateDisplay;
+
+/** @override */
+AmpDateDisplay.passthrough = true;
+
+/** @override */
+AmpDateDisplay.props = {
+  'displayIn': {attr: 'display-in'},
+  'offsetSeconds': {attr: 'offset-seconds', type: 'number'},
+  'locale': {attr: 'locale'},
+  'datetime': {attr: 'datetime'},
+  'timestampMs': {attr: 'timestamp-ms', type: 'number'},
+  'timestampSeconds': {attr: 'timestamp-seconds', type: 'number'},
+};
+
+AMP.extension(TAG, '0.2', AMP => {
+  AMP.registerElement(TAG, AmpDateDisplay);
+});
diff --git a/extensions/amp-date-display/0.2/async-render.js b/extensions/amp-date-display/0.2/async-render.js
new file mode 100644
index 0000000000000..662b779195ce0
--- /dev/null
+++ b/extensions/amp-date-display/0.2/async-render.js
@@ -0,0 +1,37 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {useResourcesNotify} from '../../../src/preact/utils';
+import {useState} from '../../../src/preact';
+
+/**
+ * Renders the children prop, waiting for it to resolve if it is a promise.
+ *
+ * @param {!JsonObject} props
+ * @return {Preact.Renderable}
+ */
+export function AsyncRender(props) {
+  const children = props['children'];
+  const {0: state, 1: set} = useState(children);
+  useResourcesNotify();
+
+  if (state && state.then) {
+    Promise.resolve(children).then(set);
+    return null;
+  }
+
+  return state;
+}
diff --git a/extensions/amp-date-display/0.2/date-display.js b/extensions/amp-date-display/0.2/date-display.js
new file mode 100644
index 0000000000000..37d0a0178b998
--- /dev/null
+++ b/extensions/amp-date-display/0.2/date-display.js
@@ -0,0 +1,221 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {useResourcesNotify} from '../../../src/preact/utils';
+import {userAssert} from '../../../src/log';
+
+/** @const {string} */
+const DEFAULT_LOCALE = 'en';
+
+/** @const {number} */
+const DEFAULT_OFFSET_SECONDS = 0;
+
+/** @typedef {{
+  year: number,
+  month: number,
+  monthName: string,
+  monthNameShort: string,
+  day: number,
+  dayName: string,
+  dayNameShort: string,
+  hour: number,
+  minute: number,
+  second: number,
+  iso: string,
+}} */
+let VariablesV2Def;
+
+/** @typedef {{
+  year: number,
+  month: number,
+  monthName: string,
+  monthNameShort: string,
+  day: number,
+  dayName: string,
+  dayNameShort: string,
+  hour: number,
+  minute: number,
+  second: number,
+  iso: string,
+  yearTwoDigit: string,
+  monthTwoDigit: string,
+  dayTwoDigit: string,
+  hourTwoDigit: string,
+  hour12: string,
+  hour12TwoDigit: string,
+  minuteTwoDigit: string,
+  secondTwoDigit: string,
+  dayPeriod: string,
+ }} */
+let EnhancedVariablesV2Def;
+
+/**
+ * @param {!JsonObject} props
+ * @return {Preact.Renderable}
+ */
+export function DateDisplay(props) {
+  const render = props['render'];
+  const data = /** @type {!JsonObject} */ (getDataForTemplate(props));
+  useResourcesNotify();
+
+  return render(data, props['children']);
+}
+
+/**
+ * @param {!JsonObject} props
+ * @return {!EnhancedVariablesV2Def}
+ */
+function getDataForTemplate(props) {
+  const {
+    'displayIn': displayIn = '',
+    'locale': locale = DEFAULT_LOCALE,
+    'offsetSeconds': offsetSeconds = DEFAULT_OFFSET_SECONDS,
+  } = props;
+
+  const epoch = getEpoch(props);
+  const offset = offsetSeconds * 1000;
+  const date = new Date(epoch + offset);
+
+  const basicData =
+    displayIn.toLowerCase() === 'utc'
+      ? getVariablesInUTC(date, locale)
+      : getVariablesInLocal(date, locale);
+
+  return enhanceBasicVariables(basicData);
+}
+
+/**
+ * @param {!JsonObject} props
+ * @return {number|undefined}
+ */
+function getEpoch(props) {
+  const {
+    'datetime': datetime = '',
+    'timestampMs': timestampMs = 0,
+    'timestampSeconds': timestampSeconds = 0,
+  } = props;
+
+  let epoch;
+  if (datetime.toLowerCase() === 'now') {
+    epoch = Date.now();
+  } else if (datetime) {
+    epoch = Date.parse(datetime);
+    userAssert(!isNaN(epoch), 'Invalid date: %s', datetime);
+  } else if (timestampMs) {
+    epoch = timestampMs;
+  } else if (timestampSeconds) {
+    epoch = timestampSeconds * 1000;
+  }
+
+  userAssert(
+    epoch !== undefined,
+    'One of datetime, timestamp-ms, or timestamp-seconds is required'
+  );
+
+  return epoch;
+}
+
+/**
+ * @param {number} input
+ * @return {string}
+ */
+function padStart(input) {
+  if (input > 9) {
+    return input.toString();
+  }
+
+  return '0' + input;
+}
+
+/**
+ * @param {!VariablesV2Def} data
+ * @return {!EnhancedVariablesV2Def}
+ */
+function enhanceBasicVariables(data) {
+  const hour12 = data.hour % 12 || 12;
+
+  // Override type since Object.assign is not understood
+  return /** @type {!EnhancedVariablesV2Def} */ ({
+    ...data,
+    'yearTwoDigit': padStart(data.year % 100),
+    'monthTwoDigit': padStart(data.month),
+    'dayTwoDigit': padStart(data.day),
+    'hourTwoDigit': padStart(data.hour),
+    'hour12': hour12,
+    'hour12TwoDigit': padStart(hour12),
+    'minuteTwoDigit': padStart(data.minute),
+    'secondTwoDigit': padStart(data.second),
+    'dayPeriod': data.hour < 12 ? 'am' : 'pm',
+  });
+}
+
+/**
+ * @param {!Date} date
+ * @param {string} locale
+ * @return {!VariablesV2Def}
+ */
+function getVariablesInLocal(date, locale) {
+  return {
+    'year': date.getFullYear(),
+    'month': date.getMonth() + 1,
+    'monthName': date.toLocaleDateString(locale, {month: 'long'}),
+    'monthNameShort': date.toLocaleDateString(locale, {
+      month: 'short',
+    }),
+    'day': date.getDate(),
+    'dayName': date.toLocaleDateString(locale, {weekday: 'long'}),
+    'dayNameShort': date.toLocaleDateString(locale, {
+      weekday: 'short',
+    }),
+    'hour': date.getHours(),
+    'minute': date.getMinutes(),
+    'second': date.getSeconds(),
+    'iso': date.toISOString(),
+  };
+}
+
+/**
+ * @param {!Date} date
+ * @param {string} locale
+ * @return {!VariablesV2Def}
+ */
+function getVariablesInUTC(date, locale) {
+  return {
+    'year': date.getUTCFullYear(),
+    'month': date.getUTCMonth() + 1,
+    'monthName': date.toLocaleDateString(locale, {
+      month: 'long',
+      timeZone: 'UTC',
+    }),
+    'monthNameShort': date.toLocaleDateString(locale, {
+      month: 'short',
+      timeZone: 'UTC',
+    }),
+    'day': date.getUTCDate(),
+    'dayName': date.toLocaleDateString(locale, {
+      weekday: 'long',
+      timeZone: 'UTC',
+    }),
+    'dayNameShort': date.toLocaleDateString(locale, {
+      weekday: 'short',
+      timeZone: 'UTC',
+    }),
+    'hour': date.getUTCHours(),
+    'minute': date.getUTCMinutes(),
+    'second': date.getUTCSeconds(),
+    'iso': date.toISOString(),
+  };
+}
diff --git a/extensions/amp-date-display/0.2/render-dom-tree.js b/extensions/amp-date-display/0.2/render-dom-tree.js
new file mode 100644
index 0000000000000..bdfafd5a4916d
--- /dev/null
+++ b/extensions/amp-date-display/0.2/render-dom-tree.js
@@ -0,0 +1,47 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {AmpEvents} from '../../../src/amp-events';
+import {createCustomEvent} from '../../../src/event-helper';
+import {dev, devAssert} from '../../../src/log';
+import {removeChildren} from '../../../src/dom';
+import {useResourcesNotify} from '../../../src/preact/utils';
+
+/**
+ * Clears the host element and appends the DOM tree into it.
+ *
+ * @param {!JsonObject} props
+ * @return {null}
+ */
+export function RenderDomTree(props) {
+  const {'dom': dom, 'host': host} = props;
+  useResourcesNotify();
+
+  removeChildren(dev().assertElement(host));
+  if (dom) {
+    host.appendChild(dom);
+  }
+
+  const event = createCustomEvent(
+    devAssert(host.ownerDocument.defaultView),
+    AmpEvents.DOM_UPDATE,
+    /* detail */ null,
+    {bubbles: true}
+  );
+  host.dispatchEvent(event);
+
+  return null;
+}
diff --git a/extensions/amp-date-display/0.2/test/test-amp-date-display.js b/extensions/amp-date-display/0.2/test/test-amp-date-display.js
new file mode 100644
index 0000000000000..2ed1100bb289b
--- /dev/null
+++ b/extensions/amp-date-display/0.2/test/test-amp-date-display.js
@@ -0,0 +1,246 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import '../../../amp-mustache/0.2/amp-mustache';
+import '../amp-date-display';
+import * as lolex from 'lolex';
+import {waitForChildPromise} from '../../../../src/dom';
+
+describes.realWin(
+  'amp-date-display',
+  {
+    amp: {
+      extensions: ['amp-mustache:0.2', 'amp-date-display:0.2'],
+    },
+  },
+  env => {
+    let win;
+    let element;
+    let clock;
+
+    async function getRenderedData() {
+      await waitForChildPromise(element, () => {
+        // The rendered container inserts a div element.
+        return element.querySelector('div');
+      });
+
+      return JSON.parse(element.textContent);
+    }
+
+    beforeEach(() => {
+      win = env.win;
+      clock = lolex.install({
+        target: window,
+        now: new Date('2018-01-01T08:00:00Z'),
+      });
+
+      element = win.document.createElement('amp-date-display');
+      const template = document.createElement('template');
+      template.setAttribute('type', 'amp-mustache');
+      template.content.textContent = JSON.stringify({
+        year: '{{year}}',
+        yearTwoDigit: '{{yearTwoDigit}}',
+        month: '{{month}}',
+        monthTwoDigit: '{{monthTwoDigit}}',
+        monthName: '{{monthName}}',
+        monthNameShort: '{{monthNameShort}}',
+        day: '{{day}}',
+        dayTwoDigit: '{{dayTwoDigit}}',
+        dayName: '{{dayName}}',
+        dayNameShort: '{{dayNameShort}}',
+        hour: '{{hour}}',
+        hourTwoDigit: '{{hourTwoDigit}}',
+        hour12: '{{hour12}}',
+        hour12TwoDigit: '{{hour12TwoDigit}}',
+        minute: '{{minute}}',
+        minuteTwoDigit: '{{minuteTwoDigit}}',
+        second: '{{second}}',
+        secondTwoDigit: '{{secondTwoDigit}}',
+        dayPeriod: '{{dayPeriod}}',
+        iso: '{{iso}}',
+      });
+      element.appendChild(template);
+      element.setAttribute('layout', 'nodisplay');
+      win.document.body.appendChild(element);
+    });
+
+    afterEach(() => {
+      clock.uninstall();
+    });
+
+    // Unfortunately, we cannot test the most interesting case of UTC datetime
+    // displayed in local, because the test would work in only one time zone.
+
+    it('provides all variables in UTC and English (default)', async () => {
+      element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
+      element.setAttribute('display-in', 'UTC');
+      element.build();
+
+      const data = await getRenderedData();
+
+      expect(data.year).to.equal('2001');
+      expect(data.yearTwoDigit).to.equal('01');
+      expect(data.month).to.equal('2');
+      expect(data.monthTwoDigit).to.equal('02');
+      expect(data.monthName).to.equal('February');
+      expect(data.monthNameShort).to.equal('Feb');
+      expect(data.day).to.equal('3');
+      expect(data.dayTwoDigit).to.equal('03');
+      expect(data.dayName).to.equal('Saturday');
+      expect(data.dayNameShort).to.equal('Sat');
+      expect(data.hour).to.equal('4');
+      expect(data.hourTwoDigit).to.equal('04');
+      expect(data.hour12).to.equal('4');
+      expect(data.hour12TwoDigit).to.equal('04');
+      expect(data.minute).to.equal('5');
+      expect(data.minuteTwoDigit).to.equal('05');
+      expect(data.second).to.equal('6');
+      expect(data.secondTwoDigit).to.equal('06');
+      expect(data.dayPeriod).to.equal('am');
+    });
+
+    it('provides all variables in local and English (default)', async () => {
+      element.setAttribute('datetime', '2001-02-03T04:05:06.007');
+      element.build();
+
+      const data = await getRenderedData();
+
+      expect(data.year).to.equal('2001');
+      expect(data.yearTwoDigit).to.equal('01');
+      expect(data.month).to.equal('2');
+      expect(data.monthTwoDigit).to.equal('02');
+      expect(data.monthName).to.equal('February');
+      expect(data.monthNameShort).to.equal('Feb');
+      expect(data.day).to.equal('3');
+      expect(data.dayTwoDigit).to.equal('03');
+      expect(data.dayName).to.equal('Saturday');
+      expect(data.dayNameShort).to.equal('Sat');
+      expect(data.hour).to.equal('4');
+      expect(data.hourTwoDigit).to.equal('04');
+      expect(data.hour12).to.equal('4');
+      expect(data.hour12TwoDigit).to.equal('04');
+      expect(data.minute).to.equal('5');
+      expect(data.minuteTwoDigit).to.equal('05');
+      expect(data.second).to.equal('6');
+      expect(data.secondTwoDigit).to.equal('06');
+      expect(data.dayPeriod).to.equal('am');
+    });
+
+    describe('correctly parses', () => {
+      it('now keyword', async () => {
+        element.setAttribute('datetime', 'now');
+        element.build();
+
+        const {iso} = await getRenderedData();
+        const dateFromParsed = new Date(iso);
+
+        // Because of the runtime there could be a several ms difference.
+        expect(dateFromParsed.getTime()).to.equal(Date.now());
+      });
+
+      it('day only ISO 8601 date', async () => {
+        element.setAttribute('datetime', '2001-02-03');
+        element.build();
+
+        const data = await getRenderedData();
+
+        expect(data.iso).to.equal('2001-02-03T00:00:00.000Z');
+      });
+
+      it('full ISO 8601 date in UTC time zone', async () => {
+        element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
+        element.build();
+
+        const data = await getRenderedData();
+
+        expect(data.iso).to.equal('2001-02-03T04:05:06.007Z');
+      });
+
+      it('full ISO 8601 date without time zone (interpreted as local)', async () => {
+        element.setAttribute('datetime', '2001-02-03T04:05:06.007');
+        element.build();
+
+        const data = await getRenderedData();
+        const result =
+          `${data.year}-${data.monthTwoDigit}-${data.dayTwoDigit}` +
+          `T${data.hourTwoDigit}:${data.minuteTwoDigit}:${data.secondTwoDigit}`;
+
+        expect(result).to.equal('2001-02-03T04:05:06');
+      });
+
+      it('full ISO 8601 date in a custom time zone', async () => {
+        element.setAttribute('datetime', '2001-02-03T04:05:06.007+08:00');
+        element.build();
+
+        const data = await getRenderedData();
+
+        expect(data.iso).to.equal('2001-02-02T20:05:06.007Z');
+      });
+
+      it('seconds since the UNIX epoch', async () => {
+        element.setAttribute('timestamp-seconds', '981173106');
+        element.build();
+
+        const data = await getRenderedData();
+
+        expect(data.iso).to.equal('2001-02-03T04:05:06.000Z');
+      });
+
+      it('miliseconds since the UNIX epoch', async () => {
+        element.setAttribute('timestamp-ms', '981173106007');
+        element.build();
+
+        const data = await getRenderedData();
+
+        expect(data.iso).to.equal('2001-02-03T04:05:06.007Z');
+      });
+    });
+
+    it('adds offset seconds', async () => {
+      element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
+      element.setAttribute('offset-seconds', '1234567');
+      element.build();
+
+      const data = await getRenderedData();
+
+      expect(data.iso).to.equal('2001-02-17T11:01:13.007Z');
+    });
+
+    it('subtracts offset seconds', async () => {
+      element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
+      element.setAttribute('offset-seconds', '-1234567');
+      element.build();
+
+      const data = await getRenderedData();
+
+      expect(data.iso).to.equal('2001-01-19T21:08:59.007Z');
+    });
+
+    it('provides variables in Czech when "cs" locale is passed', async () => {
+      element.setAttribute('datetime', '2001-02-03T04:05:06.007Z');
+      element.setAttribute('display-in', 'UTC');
+      element.setAttribute('locale', 'cs');
+      element.build();
+
+      const data = await getRenderedData();
+
+      expect(data.monthName).to.equal('únor');
+      expect(data.monthNameShort).to.equal('úno');
+      expect(data.dayName).to.equal('sobota');
+      expect(data.dayNameShort).to.equal('so');
+    });
+  }
+);
diff --git a/extensions/amp-date-picker/0.1/amp-date-picker.js b/extensions/amp-date-picker/0.1/amp-date-picker.js
index 70bbdabe16301..280844cac0abc 100644
--- a/extensions/amp-date-picker/0.1/amp-date-picker.js
+++ b/extensions/amp-date-picker/0.1/amp-date-picker.js
@@ -92,6 +92,7 @@ const attributesToForward = [
   'number-of-months',
   'minimum-nights',
   'maximum-nights',
+  'hide-keyboard-shortcuts-panel',
 ];
 
 /** @enum {string} */
@@ -276,7 +277,7 @@ export class AmpDatePicker extends AMP.BaseElement {
     /** @private */
     this.type_ = DatePickerType.SINGLE;
 
-    /** @private {?function(new:React.Component, !Object)} */
+    /** @private {?typeof React.Component} */
     this.pickerClass_ = null;
 
     /** @private {!DatePickerMode} */
@@ -1936,11 +1937,10 @@ export class AmpDatePicker extends AMP.BaseElement {
    * @return {!Promise}
    */
   render(opt_additionalProps) {
-    const props = /** @type {!JsonObject} */ (Object.assign(
-      {},
-      this.props_,
-      opt_additionalProps
-    ));
+    const props = /** @type {!JsonObject} */ ({
+      ...this.props_,
+      ...opt_additionalProps,
+    });
     const shouldBeOpen = props['isOpen'] || this.mode_ == DatePickerMode.STATIC;
     const Picker = shouldBeOpen ? this.pickerClass_ : null;
 
@@ -1952,34 +1952,30 @@ export class AmpDatePicker extends AMP.BaseElement {
         // the picker expands 1 behind where it should for the number of weeks
         // in the month.
         this.reactRender_(
-          this.react_.createElement(
-            Picker,
-            Object.assign(
-              {},
-              dict({
-                'allowBlockedEndDate': this.allowBlockedEndDate_,
-                'min': props['min'],
-                'max': props['max'],
-                'date': props['date'],
-                'startDate': props['startDate'],
-                'endDate': props['endDate'],
-                'isRTL': this.isRTL_,
-                'onDateChange': this.onDateChange,
-                'onDatesChange': this.onDatesChange,
-                'onFocusChange': this.onFocusChange,
-                'onMount': this.onMount,
-                'renderDay': this.renderDay,
-                'blocked': this.blocked_,
-                'highlighted': this.highlighted_,
-                'firstDayOfWeek': this.firstDayOfWeek_,
-                'daySize': this.daySize_,
-                'weekDayFormat': this.weekDayFormat_,
-                'isFocused': props['isFocused'], // should automatically focus
-                'focused': props['focused'],
-              }),
-              props
-            )
-          ),
+          this.react_.createElement(Picker, {
+            ...dict({
+              'allowBlockedEndDate': this.allowBlockedEndDate_,
+              'min': props['min'],
+              'max': props['max'],
+              'date': props['date'],
+              'startDate': props['startDate'],
+              'endDate': props['endDate'],
+              'isRTL': this.isRTL_,
+              'onDateChange': this.onDateChange,
+              'onDatesChange': this.onDatesChange,
+              'onFocusChange': this.onFocusChange,
+              'onMount': this.onMount,
+              'renderDay': this.renderDay,
+              'blocked': this.blocked_,
+              'highlighted': this.highlighted_,
+              'firstDayOfWeek': this.firstDayOfWeek_,
+              'daySize': this.daySize_,
+              'weekDayFormat': this.weekDayFormat_,
+              'isFocused': props['isFocused'], // should automatically focus
+              'focused': props['focused'],
+            }),
+            ...props,
+          }),
           this.container_
         );
       } else {
diff --git a/extensions/amp-date-picker/0.1/date-picker-common.js b/extensions/amp-date-picker/0.1/date-picker-common.js
index d344327cfbe76..024813dfc48f7 100644
--- a/extensions/amp-date-picker/0.1/date-picker-common.js
+++ b/extensions/amp-date-picker/0.1/date-picker-common.js
@@ -20,8 +20,8 @@ import {requireExternal} from '../../../src/module';
 /**
  * A higher-order component that wraps a specific date-picker implmentation
  * with common functionality.
- * @param {function(new:React.Component, !JsonObject)} WrappedComponent A date-picker component to wrap
- * @return {function(new:React.Component, !JsonObject)} A date picker component with common functionality
+ * @param {typeof React.Component} WrappedComponent A date-picker component to wrap
+ * @return {typeof React.Component} A date picker component with common functionality
  */
 export function withDatePickerCommon(WrappedComponent) {
   const reactDates = requireExternal('react-dates');
@@ -216,19 +216,15 @@ export function withDatePickerCommon(WrappedComponent) {
       initialVisibleMonth || date || startDate || endDate || undefined;
     props['initialVisibleMonth'] = () => Moment(initialDate);
 
-    return react.createElement(
-      WrappedComponent,
-      Object.assign(
-        {},
-        props,
-        dict({
-          'daySize': Number(daySize),
-          'isDayBlocked': this.isDayBlocked,
-          'isDayHighlighted': this.isDayHighlighted,
-          'isOutsideRange': this.isOutsideRange,
-        })
-      )
-    );
+    return react.createElement(WrappedComponent, {
+      ...props,
+      ...dict({
+        'daySize': Number(daySize),
+        'isDayBlocked': this.isDayBlocked,
+        'isDayHighlighted': this.isDayHighlighted,
+        'isOutsideRange': this.isOutsideRange,
+      }),
+    });
   };
 
   /** @dict */
diff --git a/extensions/amp-date-picker/0.1/date-range-picker.js b/extensions/amp-date-picker/0.1/date-range-picker.js
index 0ed247818f93d..78538cef786cc 100644
--- a/extensions/amp-date-picker/0.1/date-range-picker.js
+++ b/extensions/amp-date-picker/0.1/date-range-picker.js
@@ -22,7 +22,7 @@ import {wrap as withMaximumNights} from './wrappers/maximum-nights';
 
 /**
  * Create a DateRangePicker React component
- * @return {function(new:React.Component, !JsonObject)} A date range picker component class
+ * @return {typeof React.Component} A date range picker component class
  */
 function createDateRangePickerBase() {
   const constants = /** @type {JsonObject} */ (requireExternal(
@@ -30,7 +30,7 @@ function createDateRangePickerBase() {
   ));
   const DAY_SIZE = constants['DAY_SIZE'];
   const HORIZONTAL_ORIENTATION = constants['HORIZONTAL_ORIENTATION'];
-  const DayPickerRangeController = /** @type {function(new: React.Component, !JsonObject)} */ (requireExternal(
+  const DayPickerRangeController = /** @type {typeof  React.Component} */ (requireExternal(
     'react-dates'
   )['DayPickerRangeController']);
 
@@ -94,12 +94,12 @@ function createDateRangePickerBase() {
   return WrappedDayPickerRangeController;
 }
 
-/** @private {?function(new:React.Component, !JsonObject)} */
+/** @private {?typeof React.Component} */
 let DateRangePicker_ = null;
 
 /**
  * Creates a date range picker, injecting its dependencies.
- * @return {function(new:React.Component, !JsonObject)} A date range picker component class
+ * @return {typeof React.Component} A date range picker component class
  */
 export function createDateRangePicker() {
   if (!DateRangePicker_) {
diff --git a/extensions/amp-date-picker/0.1/react-utils.js b/extensions/amp-date-picker/0.1/react-utils.js
index 22d1d92c1af0b..953de667e7958 100644
--- a/extensions/amp-date-picker/0.1/react-utils.js
+++ b/extensions/amp-date-picker/0.1/react-utils.js
@@ -20,7 +20,7 @@ import {requireExternal} from '../../../src/module';
  * Create a React component that can render Promises.
  * Note: The nested class cannot be named Deferred, since src/promise.js already
  * exports a class with that name.
- * @return {function(new:React.Component, !Object)}
+ * @return {typeof React.Component}
  */
 function createDeferred_() {
   const react = requireExternal('react');
@@ -97,12 +97,12 @@ function shallowDiffers(a, b) {
   return false;
 }
 
-/** @private {?function(new:React.Component, !Object)} */
+/** @private {?typeof React.Component} */
 let DeferredType_ = null;
 
 /**
  * Creates a single date picker.
- * @return {function(new:React.Component, !Object)} A date picker class
+ * @return {typeof React.Component} A date picker class
  */
 export function createDeferred() {
   if (!DeferredType_) {
diff --git a/extensions/amp-date-picker/0.1/single-date-picker.js b/extensions/amp-date-picker/0.1/single-date-picker.js
index 1b55288f5e255..7711d3a5dbc61 100644
--- a/extensions/amp-date-picker/0.1/single-date-picker.js
+++ b/extensions/amp-date-picker/0.1/single-date-picker.js
@@ -21,7 +21,7 @@ import {withDatePickerCommon} from './date-picker-common';
 
 /**
  * Create a SingleDatePicker React component
- * @return {function(new:React.Component, !JsonObject)} A single date picker component class
+ * @return {typeof React.Component} A single date picker component class
  */
 function createSingleDatePickerBase() {
   const constants = /** @type {!JsonObject} */ (requireExternal(
@@ -30,7 +30,7 @@ function createSingleDatePickerBase() {
 
   const DAY_SIZE = constants['DAY_SIZE'];
   const HORIZONTAL_ORIENTATION = constants['HORIZONTAL_ORIENTATION'];
-  const DayPickerSingleDateController = /** @type {function(new: React.Component, !JsonObject)} */ (requireExternal(
+  const DayPickerSingleDateController = /** @type {typeof  React.Component} */ (requireExternal(
     'react-dates'
   )['DayPickerSingleDateController']);
 
@@ -96,8 +96,8 @@ function createSingleDatePickerBase() {
  * Fixes bug where overlay single date pickers do not open to
  * the month containing the selected date.
  * https://github.com/airbnb/react-dates/issues/931
- * @param {function(new:React.Component, !JsonObject)} WrappedComponent A date-picker component to wrap
- * @return {function(new:React.Component, !JsonObject)} A class with a preset focused prop
+ * @param {typeof React.Component} WrappedComponent A date-picker component to wrap
+ * @return {typeof React.Component} A class with a preset focused prop
  */
 function withFocusedTrueHack(WrappedComponent) {
   const react = requireExternal('react');
@@ -118,19 +118,19 @@ function withFocusedTrueHack(WrappedComponent) {
 
   /** @override */
   FocusedTrueHack.prototype.render = function() {
-    const props = Object.assign({}, this.props, dict({'focused': true}));
+    const props = {...this.props, ...dict({'focused': true})};
     return react.createElement(WrappedComponent, props);
   };
 
   return FocusedTrueHack;
 }
 
-/** @private {?function(new:React.Component, !JsonObject)} */
+/** @private {?typeof React.Component} */
 let SingleDatePicker_ = null;
 
 /**
  * Creates a single date picker, injecting its dependencies
- * @return {function(new:React.Component, !JsonObject)} A date picker component class
+ * @return {typeof React.Component} A date picker component class
  */
 export function createSingleDatePicker() {
   if (!SingleDatePicker_) {
diff --git a/extensions/amp-date-picker/0.1/test/test-amp-date-picker-bind.js b/extensions/amp-date-picker/0.1/test/test-amp-date-picker-bind.js
index 20894ea553e0a..262e8ad388c15 100644
--- a/extensions/amp-date-picker/0.1/test/test-amp-date-picker-bind.js
+++ b/extensions/amp-date-picker/0.1/test/test-amp-date-picker-bind.js
@@ -46,7 +46,7 @@ describes.realWin(
      * }}
      */
     function createDatePicker(opt_attrs = {}, opt_parent = document.body) {
-      const attrs = Object.assign({}, DEFAULT_ATTRS, opt_attrs);
+      const attrs = {...DEFAULT_ATTRS, ...opt_attrs};
       let input = null;
       let endInput = null;
       if (attrs['mode'] === 'overlay') {
diff --git a/extensions/amp-date-picker/0.1/test/test-amp-date-picker-state.js b/extensions/amp-date-picker/0.1/test/test-amp-date-picker-state.js
index 7f501c0056cba..5cf9dcae187c3 100644
--- a/extensions/amp-date-picker/0.1/test/test-amp-date-picker-state.js
+++ b/extensions/amp-date-picker/0.1/test/test-amp-date-picker-state.js
@@ -43,7 +43,7 @@ describes.realWin(
      * }}
      */
     function createDatePicker(opt_attrs = {}, opt_parent = document.body) {
-      const attrs = Object.assign({}, opt_attrs);
+      const attrs = {...opt_attrs};
       let input = null;
       let endInput = null;
       if (attrs['mode'] === 'overlay') {
diff --git a/extensions/amp-date-picker/0.1/test/test-amp-date-picker.js b/extensions/amp-date-picker/0.1/test/test-amp-date-picker.js
index 5e5d9c990986c..1f650add01075 100644
--- a/extensions/amp-date-picker/0.1/test/test-amp-date-picker.js
+++ b/extensions/amp-date-picker/0.1/test/test-amp-date-picker.js
@@ -50,7 +50,7 @@ describes.realWin(
     };
 
     function createDatePicker(opt_attrs, opt_parent = document.body) {
-      const attrs = Object.assign({}, DEFAULT_ATTRS, opt_attrs);
+      const attrs = {...DEFAULT_ATTRS, ...opt_attrs};
       const element = createElementWithAttributes(
         document,
         'amp-date-picker',
@@ -96,7 +96,7 @@ describes.realWin(
      */
     function createDateTemplate(body, opt_attrs) {
       const template = createTemplate(body);
-      const attrs = Object.assign({}, DEFAULT_TEMPLATE_ATTRS, opt_attrs);
+      const attrs = {...DEFAULT_TEMPLATE_ATTRS, ...opt_attrs};
       for (const key in attrs) {
         template.setAttribute(key, attrs[key]);
       }
diff --git a/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.html b/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.html
index e6e8c7e2ce6aa..140ea53ef8b93 100644
--- a/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.html
+++ b/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.html
@@ -130,6 +130,9 @@
   <!-- Valid: amp-date-picker with allow-blocked-end-date -->
   <amp-date-picker allow-blocked-end-date layout="fixed-height" height="360">
   </amp-date-picker>
+  <!-- Valid: amp-date-picker with hide-keyboard-shortcuts-panel -->
+  <amp-date-picker layout="fixed-height" height="360" hide-keyboard-shortcuts-panel>
+  </amp-date-picker>
 
   <!-- Invalid: single amp-date-picker with start-input-selector -->
   <amp-date-picker type="single" mode="static" start-input-selector="#x3" layout="fixed-height" height="360">
diff --git a/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.out b/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.out
index 13b59f8be3ef9..5c7a3abc2c97f 100644
--- a/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.out
+++ b/extensions/amp-date-picker/0.1/test/validator-amp-date-picker.out
@@ -131,101 +131,104 @@ FAIL
 |    <!-- Valid: amp-date-picker with allow-blocked-end-date -->
 |    <amp-date-picker allow-blocked-end-date layout="fixed-height" height="360">
 |    </amp-date-picker>
+|    <!-- Valid: amp-date-picker with hide-keyboard-shortcuts-panel -->
+|    <amp-date-picker layout="fixed-height" height="360" hide-keyboard-shortcuts-panel>
+|    </amp-date-picker>
 |
 |    <!-- Invalid: single amp-date-picker with start-input-selector -->
 |    <amp-date-picker type="single" mode="static" start-input-selector="#x3" layout="fixed-height" height="360">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:135:2 The attribute 'type' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'single'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:138:2 The attribute 'type' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'single'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: range amp-date-picker with input-selector -->
 |    <amp-date-picker type="range" input-selector="#a4" layout="fixed-height" height="360">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:138:2 The attribute 'type' in tag 'amp-date-picker[type=single][mode=static]' is set to the invalid value 'range'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:141:2 The attribute 'type' in tag 'amp-date-picker[type=single][mode=static]' is set to the invalid value 'range'. (see https://amp.dev/documentation/components/amp-date-picker)
 |      </amp-date-picker>
 |    <!-- Invalid: amp-date-picker with implicit mode="static" without layout -->
 |    <amp-date-picker></amp-date-picker>
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:141:2 Incomplete layout attributes specified for tag 'amp-date-picker[type=single][mode=static]'. For example, provide attributes 'width' and 'height'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:144:2 Incomplete layout attributes specified for tag 'amp-date-picker[type=single][mode=static]'. For example, provide attributes 'width' and 'height'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    <!-- Invalid: amp-date-picker with explicit mode="static" without layout -->
 |    <amp-date-picker mode="static">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:143:2 Incomplete layout attributes specified for tag 'amp-date-picker[type=single][mode=static]'. For example, provide attributes 'width' and 'height'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:146:2 Incomplete layout attributes specified for tag 'amp-date-picker[type=single][mode=static]'. For example, provide attributes 'width' and 'height'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: overlay amp-date-picker with fullscreen attribute -->
 |    <amp-date-picker mode="overlay" fullscreen>
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:146:2 The attribute 'fullscreen' may not appear in tag 'amp-date-picker[type=single][mode=overlay]'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:149:2 The attribute 'fullscreen' may not appear in tag 'amp-date-picker[type=single][mode=overlay]'. (see https://amp.dev/documentation/components/amp-date-picker)
 |      <input type="text" name="date4">
 |    </amp-date-picker>
 |    <!-- Invalid: width is mistyped. -->
 |    <amp-date-picker height="360" wdith="360">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:150:2 The attribute 'wdith' may not appear in tag 'amp-date-picker[type=single][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:153:2 The attribute 'wdith' may not appear in tag 'amp-date-picker[type=single][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: amp-date-picker with bad day-size-->
 |    <amp-date-picker type="range" layout="fixed-height" height="360"
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:153:2 The attribute 'day-size' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'five'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:156:2 The attribute 'day-size' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'five'. (see https://amp.dev/documentation/components/amp-date-picker)
 |        day-size="five">
 |    </amp-date-picker>
 |    <!-- Invalid: amp-date-picker with bad number-of-months -->
 |    <amp-date-picker type="range" layout="fixed-height" height="360"
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:157:2 The attribute 'number-of-months' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'twele'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:160:2 The attribute 'number-of-months' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'twele'. (see https://amp.dev/documentation/components/amp-date-picker)
 |        number-of-months="twele">
 |    </amp-date-picker>
 |    <!-- Invalid: amp-date-picker with bad first-day-of-week -->
 |    <amp-date-picker type="range" layout="fixed-height" height="360"
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:161:2 The attribute 'first-day-of-week' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value '7'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:164:2 The attribute 'first-day-of-week' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value '7'. (see https://amp.dev/documentation/components/amp-date-picker)
 |        first-day-of-week="7">
 |    </amp-date-picker>
 |    <!-- Invalid: amp-date-picker templates outside amp-date-picker -->
 |    <template info-template type="amp-mustache"></template>
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:165:2 The parent tag of tag 'amp-date-picker > template [info-template]' is 'body', but it can only be 'amp-date-picker'. (see https://amp.dev/documentation/components/amp-mustache)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:168:2 The parent tag of tag 'amp-date-picker > template [info-template]' is 'body', but it can only be 'amp-date-picker'. (see https://amp.dev/documentation/components/amp-mustache)
 |    <template date-template dates="2018-01-01" type="amp-mustache"></template>
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:166:2 The parent tag of tag 'amp-date-picker > template [date-template]' is 'body', but it can only be 'amp-date-picker'. (see https://amp.dev/documentation/components/amp-mustache)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:169:2 The parent tag of tag 'amp-date-picker > template [date-template]' is 'body', but it can only be 'amp-date-picker'. (see https://amp.dev/documentation/components/amp-mustache)
 |    <!-- Invalid: amp-date-picker with bad maximum nights -->
 |    <amp-date-picker type="range" layout="fixed-height" height="360" maximum-nights="zero">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:168:2 The attribute 'maximum-nights' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'zero'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:171:2 The attribute 'maximum-nights' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'zero'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: amp-date-picker with bad minimum nights -->
 |    <amp-date-picker type="range" layout="fixed-height" height="360" minimum-nights="zero">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:171:2 The attribute 'minimum-nights' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'zero'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:174:2 The attribute 'minimum-nights' in tag 'amp-date-picker[type=range][mode=static]' is set to the invalid value 'zero'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: single amp-date-picker with maximum nights -->
 |    <amp-date-picker layout="fixed-height" height="360" maximum-nights="0">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:174:2 The mandatory attribute 'type' is missing in tag 'amp-date-picker[type=range][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:177:2 The mandatory attribute 'type' is missing in tag 'amp-date-picker[type=range][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: single amp-date-picker with minimum nights -->
 |    <amp-date-picker layout="fixed-height" height="360" minimum-nights="0">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:177:2 The mandatory attribute 'type' is missing in tag 'amp-date-picker[type=range][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:180:2 The mandatory attribute 'type' is missing in tag 'amp-date-picker[type=range][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: single amp-date-picker with start-date attribute -->
 |    <amp-date-picker layout="fixed-height" height="360" start-date="2018-01-01">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:180:2 The mandatory attribute 'type' is missing in tag 'amp-date-picker[type=range][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:183:2 The mandatory attribute 'type' is missing in tag 'amp-date-picker[type=range][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: range amp-date-picker with date attribute -->
 |    <amp-date-picker type="range" layout="fixed-height" height="360" date="2018-01-01">
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:183:2 The attribute 'type' in tag 'amp-date-picker[type=single][mode=static]' is set to the invalid value 'range'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:186:2 The attribute 'type' in tag 'amp-date-picker[type=single][mode=static]' is set to the invalid value 'range'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: static amp-date-picker with touch-keyboard-editable -->
 |    <amp-date-picker layout="fixed-height" height="360" touch-keyboard-editable>
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:186:2 The attribute 'touch-keyboard-editable' may not appear in tag 'amp-date-picker[type=single][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:189:2 The attribute 'touch-keyboard-editable' may not appear in tag 'amp-date-picker[type=single][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
 |    </amp-date-picker>
 |    <!-- Invalid: amp-date-picker with http src -->
 |    <amp-date-picker layout="fixed-height" height="360"
 >>   ^~~~~~~~~
-amp-date-picker/0.1/test/validator-amp-date-picker.html:189:2 Invalid URL protocol 'http:' for attribute 'src' in tag 'amp-date-picker[type=single][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
+amp-date-picker/0.1/test/validator-amp-date-picker.html:192:2 Invalid URL protocol 'http:' for attribute 'src' in tag 'amp-date-picker[type=single][mode=static]'. (see https://amp.dev/documentation/components/amp-date-picker)
 |        src="http://data.com/dates.json?ref=CANONICAL_URL">
 |    </amp-date-picker>
 |  </body>
diff --git a/extensions/amp-date-picker/0.1/wrappers/maximum-nights.js b/extensions/amp-date-picker/0.1/wrappers/maximum-nights.js
index 7b50d107251ee..4f652d7c74b58 100644
--- a/extensions/amp-date-picker/0.1/wrappers/maximum-nights.js
+++ b/extensions/amp-date-picker/0.1/wrappers/maximum-nights.js
@@ -18,8 +18,8 @@ import {requireExternal} from '../../../../src/module';
 
 /**
  * Implements the `maximum-nights` attribute on the date range picker.
- * @param {function(new:React.Component, !JsonObject)} WrappedComponent A date-picker component to wrap
- * @return {function(new:React.Component, !JsonObject)}
+ * @param {typeof React.Component} WrappedComponent A date-picker component to wrap
+ * @return {typeof React.Component}
  */
 export function wrap(WrappedComponent) {
   const react = requireExternal('react');
@@ -64,7 +64,7 @@ export function wrap(WrappedComponent) {
 
   /** @override */
   MaximumNights.prototype.render = function() {
-    const props = Object.assign({}, this.props);
+    const props = {...this.props};
     props['isOutsideRange'] = this.isOutsideRange_;
     return react.createElement(WrappedComponent, props);
   };
diff --git a/extensions/amp-date-picker/amp-date-picker.md b/extensions/amp-date-picker/amp-date-picker.md
index 8fb83e9216cf7..557534d1bb826 100644
--- a/extensions/amp-date-picker/amp-date-picker.md
+++ b/extensions/amp-date-picker/amp-date-picker.md
@@ -560,6 +560,10 @@ If present, keeps the date picker overlay open after the user selects a date or
 
 If present, keeps the date picker open after the user clears the date or dates. By default, this attribute is not present.
 
+##### hide-keyboard-shortcuts-panel
+
+If present, hides the keyboard shortcuts panel at the bottom of the picker. By default, this attribute is not present.
+
 ##### common attributes
 
 This element includes [common attributes](https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes) extended to AMP components.
diff --git a/extensions/amp-date-picker/validator-amp-date-picker.protoascii b/extensions/amp-date-picker/validator-amp-date-picker.protoascii
index 07633ddae673f..4379338e24cb6 100644
--- a/extensions/amp-date-picker/validator-amp-date-picker.protoascii
+++ b/extensions/amp-date-picker/validator-amp-date-picker.protoascii
@@ -170,6 +170,10 @@ attr_lists: {
     name: "open-after-select"
     value: ""
   }
+  attrs: {
+    name: "hide-keyboard-shortcuts-panel"
+    value: ""
+  }
   attrs: {
     name: "src"
     value_url: {
diff --git a/extensions/amp-delight-player/0.1/amp-delight-player.js b/extensions/amp-delight-player/0.1/amp-delight-player.js
index 680db41e85fbe..e659dadbe457c 100644
--- a/extensions/amp-delight-player/0.1/amp-delight-player.js
+++ b/extensions/amp-delight-player/0.1/amp-delight-player.js
@@ -119,7 +119,11 @@ class AmpDelightPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(onLayout) {
-    this.preconnect.url(this.baseURL_, onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      this.baseURL_,
+      onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-embedly-card/0.1/amp-embedly-card-impl.js b/extensions/amp-embedly-card/0.1/amp-embedly-card-impl.js
index b776bb82783e8..a2fbbff048e8d 100644
--- a/extensions/amp-embedly-card/0.1/amp-embedly-card-impl.js
+++ b/extensions/amp-embedly-card/0.1/amp-embedly-card-impl.js
@@ -16,6 +16,7 @@
 
 import {TAG as KEY_TAG} from './amp-embedly-key';
 import {Layout} from '../../../src/layout';
+import {Services} from '../../../src/services';
 import {getIframe} from '../../../src/3p-frame';
 import {listenFor} from '../../../src/iframe-helper';
 import {removeElement} from '../../../src/dom';
@@ -115,6 +116,10 @@ export class AmpEmbedlyCard extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://cdn.embedly.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://cdn.embedly.com',
+      opt_onLayout
+    );
   }
 }
diff --git a/extensions/amp-facebook-comments/0.1/amp-facebook-comments.js b/extensions/amp-facebook-comments/0.1/amp-facebook-comments.js
index b67f030dd5eed..b5db6b87d4b7f 100644
--- a/extensions/amp-facebook-comments/0.1/amp-facebook-comments.js
+++ b/extensions/amp-facebook-comments/0.1/amp-facebook-comments.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {createLoaderLogo} from '../../amp-facebook/0.1/facebook-loader';
 import {dashToUnderline} from '../../../src/string';
 import {getData, listen} from '../../../src/event-helper';
@@ -54,13 +55,15 @@ class AmpFacebookComments extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://facebook.com', opt_onLayout);
+    const preconnect = Services.preconnectFor(this.win);
+    preconnect.url(this.getAmpDoc(), 'https://facebook.com', opt_onLayout);
     // Hosts the facebook SDK.
-    this.preconnect.preload(
+    preconnect.preload(
+      this.getAmpDoc(),
       'https://connect.facebook.net/' + this.dataLocale_ + '/sdk.js',
       'script'
     );
-    preloadBootstrap(this.win, this.preconnect);
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
   }
 
   /** @override */
diff --git a/extensions/amp-facebook-like/0.1/amp-facebook-like.js b/extensions/amp-facebook-like/0.1/amp-facebook-like.js
index 913ada55a9ef3..b7bdf0cb81f4c 100644
--- a/extensions/amp-facebook-like/0.1/amp-facebook-like.js
+++ b/extensions/amp-facebook-like/0.1/amp-facebook-like.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {dashToUnderline} from '../../../src/string';
 import {getData, listen} from '../../../src/event-helper';
 import {getIframe, preloadBootstrap} from '../../../src/3p-frame';
@@ -53,13 +54,15 @@ class AmpFacebookLike extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://facebook.com', opt_onLayout);
+    const preconnect = Services.preconnectFor(this.win);
+    preconnect.url(this.getAmpDoc(), 'https://facebook.com', opt_onLayout);
     // Hosts the facebook SDK.
-    this.preconnect.preload(
+    preconnect.preload(
+      this.getAmpDoc(),
       'https://connect.facebook.net/' + this.dataLocale_ + '/sdk.js',
       'script'
     );
-    preloadBootstrap(this.win, this.preconnect);
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
   }
 
   /** @override */
diff --git a/extensions/amp-facebook-page/0.1/amp-facebook-page.js b/extensions/amp-facebook-page/0.1/amp-facebook-page.js
index fd67bda7eb87d..13ce9fcf92134 100644
--- a/extensions/amp-facebook-page/0.1/amp-facebook-page.js
+++ b/extensions/amp-facebook-page/0.1/amp-facebook-page.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {createLoaderLogo} from '../../amp-facebook/0.1/facebook-loader';
 import {dashToUnderline} from '../../../src/string';
 import {getData, listen} from '../../../src/event-helper';
@@ -54,13 +55,15 @@ class AmpFacebookPage extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://facebook.com', opt_onLayout);
+    const preconnect = Services.preconnectFor(this.win);
+    preconnect.url(this.getAmpDoc(), 'https://facebook.com', opt_onLayout);
     // Hosts the facebook SDK.
-    this.preconnect.preload(
+    preconnect.preload(
+      this.getAmpDoc(),
       'https://connect.facebook.net/' + this.dataLocale_ + '/sdk.js',
       'script'
     );
-    preloadBootstrap(this.win, this.preconnect);
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
   }
 
   /** @override */
diff --git a/extensions/amp-facebook/0.1/amp-facebook.js b/extensions/amp-facebook/0.1/amp-facebook.js
index 347b26a385faf..54b134e7b351f 100644
--- a/extensions/amp-facebook/0.1/amp-facebook.js
+++ b/extensions/amp-facebook/0.1/amp-facebook.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {createLoaderLogo} from './facebook-loader';
 import {dashToUnderline} from '../../../src/string';
 import {getData, listen} from '../../../src/event-helper';
@@ -58,13 +59,15 @@ class AmpFacebook extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://facebook.com', opt_onLayout);
+    const preconnect = Services.preconnectFor(this.win);
+    preconnect.url(this.getAmpDoc(), 'https://facebook.com', opt_onLayout);
     // Hosts the facebook SDK.
-    this.preconnect.preload(
+    preconnect.preload(
+      this.getAmpDoc(),
       'https://connect.facebook.net/' + this.dataLocale_ + '/sdk.js',
       'script'
     );
-    preloadBootstrap(this.win, this.preconnect);
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
   }
 
   /** @override */
diff --git a/extensions/amp-fit-text/0.1/test-e2e/test-amp-fit-text.js b/extensions/amp-fit-text/0.1/test-e2e/test-amp-fit-text.js
new file mode 100644
index 0000000000000..cf27f03bcb1b1
--- /dev/null
+++ b/extensions/amp-fit-text/0.1/test-e2e/test-amp-fit-text.js
@@ -0,0 +1,65 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describes.endtoend(
+  'amp-fit-text',
+  {
+    testUrl:
+      'http://localhost:8000/test/fixtures/e2e/amp-fit-text/amp-fit-text.html',
+    environments: 'ampdoc-amp4ads-preset',
+  },
+  env => {
+    let controller;
+
+    beforeEach(async () => {
+      controller = env.controller;
+    });
+
+    it('should render in correct font-size', async () => {
+      await verifyElementStyles(await selectContentDiv('test1'), {
+        'font-size': '32px',
+      });
+
+      await verifyElementStyles(await selectContentDiv('test2'), {
+        'font-size': '42px',
+        'overflow': 'hidden',
+      });
+
+      await verifyElementStyles(await selectContentDiv('test3'), {
+        'font-size': '16px',
+      });
+
+      await verifyElementStyles(await selectContentDiv('test4'), {
+        'font-size': '20px',
+      });
+    });
+
+    async function selectContentDiv(id) {
+      return await controller.findElement(
+        `#${id} .i-amphtml-fit-text-content > div`
+      );
+    }
+
+    async function verifyElementStyles(element, styles) {
+      for (const name in styles) {
+        const value = styles[name];
+        await expect(controller.getElementCssValue(element, name)).to.equal(
+          value
+        );
+      }
+    }
+  }
+);
diff --git a/extensions/amp-form/0.1/amp-form-textarea.js b/extensions/amp-form/0.1/amp-form-textarea.js
index 43c690bf34359..56c2b6cc1f708 100644
--- a/extensions/amp-form/0.1/amp-form-textarea.js
+++ b/extensions/amp-form/0.1/amp-form-textarea.js
@@ -176,8 +176,8 @@ export function handleInitialOverflowElements(textareas) {
  * @visibleForTesting
  */
 export function getHasOverflow(element) {
-  const resources = Services.resourcesForDoc(element);
-  return resources.measureElement(() => {
+  const mutator = Services.mutatorForDoc(element);
+  return mutator.measureElement(() => {
     return element./*OK*/ scrollHeight > element./*OK*/ clientHeight;
   });
 }
@@ -206,16 +206,16 @@ function resizeTextareaElements(elements) {
  * @param {!Element} element
  */
 function handleTextareaDrag(element) {
-  const resources = Services.resourcesForDoc(element);
+  const mutator = Services.mutatorForDoc(element);
 
   Promise.all([
-    resources.measureElement(() => element./*OK*/ scrollHeight),
+    mutator.measureElement(() => element./*OK*/ scrollHeight),
     listenOncePromise(element, 'mouseup'),
   ]).then(results => {
     const heightMouseDown = results[0];
     let heightMouseUp = 0;
 
-    return resources.measureMutateElement(
+    return mutator.measureMutateElement(
       element,
       () => {
         heightMouseUp = element./*OK*/ scrollHeight;
@@ -248,7 +248,7 @@ function maybeRemoveResizeBehavior(element, startHeight, endHeight) {
  * @visibleForTesting
  */
 export function maybeResizeTextarea(element) {
-  const resources = Services.resourcesForDoc(element);
+  const mutator = Services.mutatorForDoc(element);
   const win = /** @type {!Window} */ (devAssert(
     element.ownerDocument.defaultView
   ));
@@ -263,7 +263,7 @@ export function maybeResizeTextarea(element) {
   // element's content, or 2. the element itself.
   const minScrollHeightPromise = getShrinkHeight(element);
 
-  return resources.measureMutateElement(
+  return mutator.measureMutateElement(
     element,
     () => {
       const computed = computedStyle(win, element);
@@ -319,7 +319,7 @@ function getShrinkHeight(textarea) {
   const doc = /** @type {!Document} */ (devAssert(textarea.ownerDocument));
   const win = /** @type {!Window} */ (devAssert(doc.defaultView));
   const body = /** @type {!HTMLBodyElement} */ (devAssert(doc.body));
-  const resources = Services.resourcesForDoc(textarea);
+  const mutator = Services.mutatorForDoc(textarea);
 
   const clone = textarea.cloneNode(/*deep*/ false);
   clone.classList.add(AMP_FORM_TEXTAREA_CLONE_CSS);
@@ -328,7 +328,7 @@ function getShrinkHeight(textarea) {
   let resultingHeight = 0;
   let shouldKeepTop = false;
 
-  return resources
+  return mutator
     .measureMutateElement(
       body,
       () => {
@@ -354,7 +354,7 @@ function getShrinkHeight(textarea) {
       }
     )
     .then(() => {
-      return resources.measureMutateElement(
+      return mutator.measureMutateElement(
         body,
         () => {
           resultingHeight = clone./*OK*/ scrollHeight;
diff --git a/extensions/amp-form/0.1/amp-form.js b/extensions/amp-form/0.1/amp-form.js
index c66ab7a027273..afefaa5204521 100644
--- a/extensions/amp-form/0.1/amp-form.js
+++ b/extensions/amp-form/0.1/amp-form.js
@@ -31,6 +31,7 @@ import {
 import {FormDirtiness} from './form-dirtiness';
 import {FormEvents} from './form-events';
 import {FormSubmitService} from './form-submit-service';
+import {Keys} from '../../../src/utils/key-codes';
 import {
   SOURCE_ORIGIN_PARAM,
   addParamsToUrl,
@@ -70,6 +71,7 @@ import {installStylesForDoc} from '../../../src/style-installer';
 import {isAmp4Email} from '../../../src/format';
 import {isArray, toArray, toWin} from '../../../src/types';
 import {triggerAnalyticsEvent} from '../../../src/analytics';
+import {tryParseJson} from '../../../src/json';
 
 /** @const {string} */
 const TAG = 'amp-form';
@@ -152,8 +154,8 @@ export class AmpForm {
     /** @const @private {!../../../src/service/action-impl.ActionService} */
     this.actions_ = Services.actionServiceForDoc(this.form_);
 
-    /** @const @private {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(this.form_);
+    /** @const @private {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(this.form_);
 
     /** @const @private {!../../../src/service/viewer-interface.ViewerInterface}  */
     this.viewer_ = Services.viewerForDoc(this.form_);
@@ -256,6 +258,13 @@ export class AmpForm {
     return url;
   }
 
+  /**
+   * @return {string|undefined} the value of the form's xssi-prefix attribute.
+   */
+  getXssiPrefix() {
+    return this.form_.getAttribute('xssi-prefix');
+  }
+
   /**
    * Builds fetch request data for amp-form elements.
    * @param {string} url
@@ -391,10 +400,20 @@ export class AmpForm {
       true
     );
 
+    this.form_.addEventListener(
+      AmpEvents.FORM_VALUE_CHANGE,
+      e => {
+        checkUserValidityAfterInteraction_(dev().assertElement(e.target));
+        this.validator_.onInput(e);
+      },
+      true
+    );
+
     //  Form verification is not supported when SSRing templates is enabled.
-    if (!this.ssrTemplateHelper_.isSupported()) {
+    if (!this.ssrTemplateHelper_.isEnabled()) {
       this.form_.addEventListener('change', e => {
-        this.verifier_.onCommit().then(({updatedElements, errors}) => {
+        this.verifier_.onCommit().then(updatedErrors => {
+          const {updatedElements, errors} = updatedErrors;
           updatedElements.forEach(checkUserValidityAfterInteraction_);
           // Tell the validation to reveal any input.validationMessage added
           // by the form verifier.
@@ -687,7 +706,7 @@ export class AmpForm {
    */
   handleXhrSubmit_(trust) {
     let p;
-    if (this.ssrTemplateHelper_.isSupported()) {
+    if (this.ssrTemplateHelper_.isEnabled()) {
       p = this.handleSsrTemplate_(trust);
     } else {
       this.submittingWithTrust_(trust);
@@ -789,19 +808,18 @@ export class AmpForm {
    */
   handleSsrTemplateResponse_(response, trust) {
     const init = response['init'];
+    // response['body'] is serialized as a string in the response.
+    const body = tryParseJson(response['body'], error =>
+      user().error(TAG, 'Failed to parse response JSON: %s', error)
+    );
     if (init) {
       const status = init['status'];
       if (status >= 300) {
         /** HTTP status codes of 300+ mean redirects and errors. */
-        return this.handleSubmitFailure_(
-          status,
-          response,
-          trust,
-          response['body']
-        );
+        return this.handleSubmitFailure_(status, response, trust, body);
       }
     }
-    return this.handleSubmitSuccess_(response, trust, response['body']);
+    return this.handleSubmitSuccess_(response, trust, body);
   }
 
   /**
@@ -949,8 +967,8 @@ export class AmpForm {
    * @private
    */
   handleXhrSubmitSuccess_(response, incomingTrust) {
-    return response
-      .json()
+    return this.xhr_
+      .xssiJson(response, this.getXssiPrefix())
       .then(
         json =>
           this.handleSubmitSuccess_(
@@ -999,7 +1017,9 @@ export class AmpForm {
     let promise;
     if (e && e.response) {
       const error = /** @type {!Error} */ (e);
-      promise = error.response.json().catch(() => null);
+      promise = this.xhr_
+        .xssiJson(error.response, this.getXssiPrefix())
+        .catch(() => null);
     } else {
       promise = Promise.resolve(null);
     }
@@ -1069,7 +1089,7 @@ export class AmpForm {
    * @private
    */
   assertSsrTemplate_(value, msg) {
-    const supported = this.ssrTemplateHelper_.isSupported();
+    const supported = this.ssrTemplateHelper_.isEnabled();
     userAssert(
       supported === value,
       '[amp-form]: viewerRenderTemplate | %s',
@@ -1123,6 +1143,12 @@ export class AmpForm {
     }
     const redirectTo = response.headers.get(REDIRECT_TO_HEADER);
     if (redirectTo) {
+      const doc = this.form_.ownerDocument;
+      userAssert(
+        !(doc && isAmp4Email(doc)),
+        'Redirects not supported in AMP4Email.',
+        this.form_
+      );
       userAssert(
         this.target_ != '_blank',
         'Redirecting to target=_blank using AMP-Redirect-To is currently ' +
@@ -1231,7 +1257,7 @@ export class AmpForm {
           .then(rendered => {
             rendered.id = messageId;
             rendered.setAttribute('i-amphtml-rendered', '');
-            return this.resources_.mutateElement(
+            return this.mutator_.mutateElement(
               dev().assertElement(container),
               () => {
                 container.appendChild(rendered);
@@ -1250,7 +1276,7 @@ export class AmpForm {
         // this container are now visible so they get scheduled for layout.
         // This will be unnecessary when the AMP Layers implementation is
         // complete.
-        this.resources_.mutateElement(container, () => {});
+        this.mutator_.mutateElement(container, () => {});
       }
     }
 
@@ -1571,7 +1597,8 @@ export class AmpFormService {
 
       this.installSubmissionHandlers_(root.querySelectorAll('form'));
       AmpFormTextarea.install(ampdoc);
-      this.installGlobalEventListener_(root);
+      this.installDomUpdateEventListener_(root);
+      this.installFormSubmissionShortcutForTextarea_(root);
     });
   }
 
@@ -1599,11 +1626,36 @@ export class AmpFormService {
    * @param {!Document|!ShadowRoot} doc
    * @private
    */
-  installGlobalEventListener_(doc) {
+  installDomUpdateEventListener_(doc) {
     doc.addEventListener(AmpEvents.DOM_UPDATE, () => {
       this.installSubmissionHandlers_(doc.querySelectorAll('form'));
     });
   }
+
+  /**
+   * Listen for Ctrl/Cmd + Enter in textarea elements
+   * to trigger form submission when relevant.
+   * @param {!Document|!ShadowRoot} doc
+   */
+  installFormSubmissionShortcutForTextarea_(doc) {
+    doc.addEventListener('keydown', e => {
+      if (
+        e.defaultPrevented ||
+        e.key != Keys.ENTER ||
+        !(e.ctrlKey || e.metaKey) ||
+        e.target.tagName !== 'TEXTAREA'
+      ) {
+        return;
+      }
+      const {form} = e.target;
+      const ampForm = form ? formOrNullForElement(form) : null;
+      if (!ampForm) {
+        return;
+      }
+      ampForm.handleSubmitEvent_(e);
+      e.preventDefault();
+    });
+  }
 }
 
 AMP.extension(TAG, '0.1', AMP => {
diff --git a/extensions/amp-form/0.1/form-validators.js b/extensions/amp-form/0.1/form-validators.js
index 12f697207419c..7b1c26d41e4f2 100644
--- a/extensions/amp-form/0.1/form-validators.js
+++ b/extensions/amp-form/0.1/form-validators.js
@@ -85,8 +85,8 @@ export class FormValidator {
     /** @protected @const {!../../../src/service/ampdoc-impl.AmpDoc} */
     this.ampdoc = Services.ampdoc(form);
 
-    /** @const @protected {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources = Services.resourcesForDoc(form);
+    /** @const @protected {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator = Services.mutatorForDoc(form);
 
     /** @protected @const {!Document|!ShadowRoot} */
     this.root = this.ampdoc.getRootNode();
@@ -379,7 +379,7 @@ export class AbstractCustomValidator extends FormValidator {
     input.setAttribute('aria-invalid', 'true');
     input.setAttribute('aria-describedby', validationId);
 
-    this.resources.mutateElement(validation, () =>
+    this.mutator.mutateElement(validation, () =>
       validation.classList.add('visible')
     );
   }
@@ -397,7 +397,7 @@ export class AbstractCustomValidator extends FormValidator {
     input.removeAttribute('aria-invalid');
     input.removeAttribute('aria-describedby');
 
-    this.resources.mutateElement(visibleValidation, () =>
+    this.mutator.mutateElement(visibleValidation, () =>
       visibleValidation.classList.remove('visible')
     );
   }
diff --git a/extensions/amp-form/0.1/test/test-amp-form-textarea.js b/extensions/amp-form/0.1/test/test-amp-form-textarea.js
index 779ece9bdcc76..e92916c3afc7a 100644
--- a/extensions/amp-form/0.1/test/test-amp-form-textarea.js
+++ b/extensions/amp-form/0.1/test/test-amp-form-textarea.js
@@ -87,13 +87,13 @@ describes.realWin(
         textarea.innerHTML = 'small text';
         doc.body.appendChild(textarea);
 
-        const fakeResources = {
+        const fakeMutator = {
           measureMutateElement(unusedElement, measurer, mutator) {
             measurer();
             return mutator() || Promise.resolve();
           },
         };
-        env.sandbox.stub(Services, 'resourcesForDoc').returns(fakeResources);
+        env.sandbox.stub(Services, 'mutatorForDoc').returns(fakeMutator);
 
         const initialHeight = textarea.clientHeight;
         return maybeResizeTextarea(textarea).then(() => {
@@ -109,13 +109,13 @@ describes.realWin(
         textarea.innerHTML = 'big text'.repeat(100);
         doc.body.appendChild(textarea);
 
-        const fakeResources = {
+        const fakeMutator = {
           measureMutateElement(unusedElement, measurer, mutator) {
             measurer();
             return mutator() || Promise.resolve();
           },
         };
-        env.sandbox.stub(Services, 'resourcesForDoc').returns(fakeResources);
+        env.sandbox.stub(Services, 'mutatorForDoc').returns(fakeMutator);
 
         const initialHeight = textarea.clientHeight;
         return maybeResizeTextarea(textarea).then(() => {
@@ -131,13 +131,13 @@ describes.realWin(
         textarea.innerHTML = 'big text'.repeat(100);
         doc.body.appendChild(textarea);
 
-        const fakeResources = {
+        const fakeMutator = {
           measureMutateElement(unusedElement, measurer, mutator) {
             measurer();
             return mutator() || Promise.resolve();
           },
         };
-        env.sandbox.stub(Services, 'resourcesForDoc').returns(fakeResources);
+        env.sandbox.stub(Services, 'mutatorForDoc').returns(fakeMutator);
 
         const initialHeight = textarea.clientHeight;
         let increasedHeight;
diff --git a/extensions/amp-form/0.1/test/test-amp-form.js b/extensions/amp-form/0.1/test/test-amp-form.js
index 2e39c0ccd2abc..3f76d353077ad 100644
--- a/extensions/amp-form/0.1/test/test-amp-form.js
+++ b/extensions/amp-form/0.1/test/test-amp-form.js
@@ -31,6 +31,7 @@ import {
 import {DIRTINESS_INDICATOR_CLASS} from '../form-dirtiness';
 import {Services} from '../../../../src/services';
 import {cidServiceForDocForTesting} from '../../../../src/service/cid-impl';
+import {createCustomEvent} from '../../../../src/event-helper';
 import {
   createFormDataWrapper,
   isFormDataWrapper,
@@ -74,9 +75,9 @@ describes.repeated(
           createTextNode = ownerDoc.createTextNode.bind(ownerDoc);
 
           // Force sync mutateElement to make testing easier.
-          const resources = Services.resourcesForDoc(env.ampdoc);
+          const mutator = Services.mutatorForDoc(env.ampdoc);
           mutateElementStub = env.sandbox
-            .stub(resources, 'mutateElement')
+            .stub(mutator, 'mutateElement')
             .callsArg(1);
 
           // This needs to be stubbed to stop the function from,
@@ -96,7 +97,7 @@ describes.repeated(
           env.ampdoc.getBody().appendChild(form);
           const ampForm = new AmpForm(form, 'amp-form-test-id');
           env.sandbox
-            .stub(ampForm.ssrTemplateHelper_, 'isSupported')
+            .stub(ampForm.ssrTemplateHelper_, 'isEnabled')
             .returns(false);
           return Promise.resolve(ampForm);
         }
@@ -243,10 +244,13 @@ describes.repeated(
               env.sandbox.stub(form, 'submit');
               env.sandbox.stub(form, 'checkValidity').returns(true);
               env.sandbox.stub(ampForm, 'analyticsEvent_');
-              ampForm.ssrTemplateHelper_.isSupported.restore();
+              ampForm.ssrTemplateHelper_.isEnabled.restore();
               env.sandbox
-                .stub(ampForm.ssrTemplateHelper_, 'isSupported')
+                .stub(ampForm.ssrTemplateHelper_, 'isEnabled')
                 .returns(true);
+              env.sandbox
+                .stub(ampForm.viewer_, 'isTrustedViewer')
+                .returns(Promise.resolve(true));
 
               return ampForm;
             });
@@ -303,17 +307,16 @@ describes.repeated(
                 .returns(template);
 
               const ssr = env.sandbox.stub(ampForm.ssrTemplateHelper_, 'ssr');
+              const response = {
+                init: {status: 200},
+                html: '<div>much success</div>',
+                body: '{"message": "hello"}',
+              };
               ssr
                 .onFirstCall()
-                .resolves({
-                  init: {status: 200},
-                  html: '<div>much success</div>',
-                })
+                .resolves(response)
                 .onSecondCall()
-                .resolves({
-                  init: {status: 200},
-                  html: '<div>much success</div>',
-                });
+                .resolves(response);
 
               const handleSubmitEventPromise = ampForm.handleSubmitEvent_(
                 event
@@ -379,17 +382,16 @@ describes.repeated(
                 .returns(template);
 
               const ssr = env.sandbox.stub(ampForm.ssrTemplateHelper_, 'ssr');
+              const response = {
+                init: {status: 404},
+                html: '<div>much error</div>',
+                body: '{"message": "error"}',
+              };
               ssr
                 .onFirstCall()
-                .resolves({
-                  init: {status: 404},
-                  html: '<div>much error</div>',
-                })
+                .resolves(response)
                 .onSecondCall()
-                .resolves({
-                  init: {status: 404},
-                  html: '<div>much error</div>',
-                });
+                .resolves(response);
 
               const handleSubmitEventPromise = ampForm.handleSubmitEvent_(
                 event
@@ -855,6 +857,29 @@ describes.repeated(
           });
         });
 
+        it('should check validity on FORM_VALUE_CHANGE event', () => {
+          setCheckValiditySupportedForTesting(true);
+          return getAmpForm(getForm()).then(ampForm => {
+            const form = ampForm.form_;
+            const emailInput = createElement('input');
+            emailInput.setAttribute('name', 'email');
+            emailInput.setAttribute('required', '');
+            form.appendChild(emailInput);
+            env.sandbox.spy(form, 'checkValidity');
+            env.sandbox.spy(ampForm.validator_, 'onInput');
+
+            const event = createCustomEvent(
+              env.win,
+              AmpEvents.FORM_VALUE_CHANGE,
+              /* detail */ null,
+              {bubbles: true}
+            );
+            emailInput.dispatchEvent(event);
+            expect(form.checkValidity).to.be.called;
+            expect(ampForm.validator_.onInput).to.be.calledWith(event);
+          });
+        });
+
         it('should allow verifying elements with a presubmit request', () => {
           const formPromise = getAmpForm(getVerificationForm());
           const fetchReject = {
@@ -1246,6 +1271,25 @@ describes.repeated(
           });
         });
 
+        it('should respect the xssi-prefix option when parsing json', async () => {
+          const form = createElement('form');
+          form.setAttribute('method', 'GET');
+          form.setAttribute('action-xhr', 'https://example.com/xssi-json');
+          form.setAttribute('xssi-prefix', 'while(1)');
+
+          const ampForm = await getAmpForm(form);
+          env.sandbox.stub(ampForm.xhr_, 'fetch').resolves('{}');
+          env.sandbox.stub(ampForm.xhr_, 'xssiJson').resolves({});
+
+          ampForm.handleSubmitEvent_({
+            target: ampForm.form_,
+            preventDefault: () => {},
+          });
+
+          await whenCalled(ampForm.xhr_.xssiJson);
+          expect(ampForm.xhr_.xssiJson).to.be.calledWith('{}', 'while(1)');
+        });
+
         it('should trigger amp-form-submit analytics event with form data', () => {
           return getAmpForm(getForm()).then(ampForm => {
             env.sandbox.stub(ampForm.xhr_, 'fetch').resolves({
@@ -1414,6 +1458,7 @@ describes.repeated(
 
           env.sandbox.stub(Services, 'xhrFor').returns({
             fetch: () => Promise.resolve({json: () => Promise.resolve()}),
+            xssiJson: () => Promise.resolve({}),
           });
 
           const ampForm = await getAmpForm(form);
@@ -2393,7 +2438,7 @@ describes.repeated(
                 .stub(Services, 'navigationForDoc')
                 .returns({navigateTo});
               env.sandbox
-                .stub(ampForm.ssrTemplateHelper_, 'isSupported')
+                .stub(ampForm.ssrTemplateHelper_, 'isEnabled')
                 .returns(false);
             });
 
diff --git a/extensions/amp-form/0.1/test/test-form-validators.js b/extensions/amp-form/0.1/test/test-form-validators.js
index 2fd9c23a3e6d4..7e14b195afe1b 100644
--- a/extensions/amp-form/0.1/test/test-form-validators.js
+++ b/extensions/amp-form/0.1/test/test-form-validators.js
@@ -113,8 +113,8 @@ describes.realWin('form-validators', {amp: true}, env => {
 
   beforeEach(() => {
     // Force sync mutateElement to make testing easier.
-    const resources = Services.resourcesForDoc(env.ampdoc);
-    env.sandbox.stub(resources, 'mutateElement').callsArg(1);
+    const mutator = Services.mutatorForDoc(env.ampdoc);
+    env.sandbox.stub(mutator, 'mutateElement').callsArg(1);
   });
 
   describe('getFormValidator', () => {
diff --git a/extensions/amp-form/amp-form.md b/extensions/amp-form/amp-form.md
index b80586102c83d..014bf7db52c06 100644
--- a/extensions/amp-form/amp-form.md
+++ b/extensions/amp-form/amp-form.md
@@ -100,6 +100,8 @@ Here's an example of a basic form:
 
 ## Attributes
 
+[filter formats="websites, stories, ads"]
+
 ##### target
 
 Indicates where to display the form response after submitting the form. The value must be `_blank` or `_top`.
@@ -111,9 +113,9 @@ Specifies a server endpoint to handle the form input. The value must be an `http
 - For `method=GET`: use this attribute or [`action-xhr`](#action-xhr).
 - For `method=POST`: use the [`action-xhr`](#action-xhr) attribute.
 
-{% call callout('Note', type='note') %}
+[tip type="note"]
 The `target` and `action` attributes are only used for non-xhr GET requests. The AMP runtime will use `action-xhr` to make the request and will ignore `action` and `target`. When `action-xhr` is not provided, AMP makes a GET request to the `action` endpoint and uses `target` to open a new window (if `_blank`). The AMP runtime might also fallback to using `action` and `target` in cases where the `amp-form` extension fails to load.
-{% endcall %}
+[/tip][/filter] <!-- formats="websites, stories, ads" -->
 
 ##### action-xhr
 
@@ -129,7 +131,9 @@ The value for `action-xhr` can be the same or a different endpoint than `action`
 
 To learn about redirecting the user after successfully submitting the form, see the [Redirecting after a submission](#redirecting-after-a-submission) section below.
 
-##### data-initialize-from-url
+[filter formats="websites, stories, ads"]
+
+##### data-initialize-from-url (optional)
 
 Initializes form fields from the window URL's search string, where the query parameter name matches the field's name. When this attribute is present, `<input>`, `<select>`, and `<textarea>` fields can optionally be initialized.
 
@@ -153,16 +157,40 @@ Limitations:
 - Fields that take advantage of [variable substitutions](#variable-substitutions) (fields with attribute `data-amp-replace`) are not supported.
 - This feature is not supported on AMP pages delivered by an [AMP cache](https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/how_amp_pages_are_cached/). The `data-initialize-from-url` and `data-allow-initialization` attributes will not cause AMP validation failures, but the form fields will not be initialized from the URL.
 
+##### xssi-prefix (optional)
+
+Specifies that a prefix should be stripped prior to parsing the fetched json from the `action-xhr` endpoint. If the prefix is not present in the response, then this attribute will have no effect.
+This can be useful for APIs that include [security prefixes](http://patorjk.com/blog/2013/02/05/crafty-tricks-for-avoiding-xssi/) like `)]}` to help prevent cross site scripting attacks.
+
+[/filter] <!-- formats="websites, stories, ads" -->
+
 ##### Other form attributes
 
 All other [form attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form) are optional.
 
+[filter formats="websites, stories, ads"]
+
 ##### custom-validation-reporting
 
 This is an optional attribute that enables and selects a custom validation reporting strategy. Valid values are one of: `show-first-on-submit`, `show-all-on-submit` or `as-you-go`.
 
 See the [Custom Validation](#custom-validations) section for more details.
 
+[/filter] <!-- formats="websites, stories, ads" -->
+
+[filter formats="email"]
+
+##### Invalid AMP email attributes
+
+The AMP for Email spec disallows the use of the following attributes on the AMP email format.
+
+- `action`
+- `name`
+- `target`
+- `verify-xhr`
+
+[/filter]<!-- formats="email" -->
+
 ## Inputs and fields
 
 **Allowed**:
@@ -195,21 +223,9 @@ Learn more about [Actions and Events in AMP](https://amp.dev/documentation/guide
 
 ## Events
 
-The `amp-form` exposes the following events:
+Use `amp-form` events with the [`on` attribute](https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#on)
 
-| Event            | Fired when                                                                                                           |
-| ---------------- | -------------------------------------------------------------------------------------------------------------------- |
-| `submit`         | The form is submitted and before the submission is complete.                                                         |
-| `submit-success` | The form submission is done and the response is a success.                                                           |
-| `submit-error`   | The form submission is done and the response is an error.                                                            |
-| `verify`         | Asynchronous verification is initiated.                                                                              |
-| `verify-error`   | Asynchronous verification is done and the response is an error.                                                      |
-| `valid`          | The form's validation state changes to "valid" (in accordance with its [reporting strategy](#reporting-strategies)). |
-| `invalid`        | The form's validation state to "invalid" (in accordance with its [reporting strategy](#reporting-strategies)).       |
-
-These events can be used via the [`on` attribute](https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#on).
-
-For example, the following listens to both the `submit-success` and `submit-error` events and shows different lightboxes depending on the event:
+The following example listens to both the `submit-success` and `submit-error` events and shows different lightboxes depending on the event:
 
 ```html
 <form
@@ -219,7 +235,38 @@ For example, the following listens to both the `submit-success` and `submit-erro
 ></form>
 ```
 
-See the [full example here](../../examples/forms.amp.html).
+### `amp-form` event list
+
+#### `submit`
+
+The form is submitted and before the submission is complete.
+
+#### `submit-success`
+
+The form submission is done and the response is a success.
+
+#### `submit-error`
+
+The form submission is done and the response is an error.
+
+[filter formats="websites, ads"]
+
+#### `verify`
+
+Asynchronous verification is initiated.
+
+#### `verify-error`
+
+Asynchronous verification is done and the response is an error.
+
+#### `valid`
+
+The form's validation state changes to "valid" (in accordance with its [reporting strategy](#reporting-strategies)).
+
+#### `invalid`
+
+The form's validation state to "invalid" (in accordance with its [reporting strategy](#reporting-strategies)).
+[/filter]<!-- formats="websites, ads" -->
 
 #### Input events
 
@@ -328,7 +375,7 @@ You can render success or error responses in your form by using [extended templa
 
 ### To render responses with templating:
 
-- Apply a response attribute to _any direct child_ of the `<form>` element.
+- Apply a response attribute to any descendent of the `<form>` element.
 - Render the response in the child element by including a template via `<template></template>` or `<script type="text/plain"></script>` tag inside it or by referencing a template with a `template="id_of_other_template"` attribute.
 - Provide a valid JSON object for responses to `submit-success` and `submit-error`. Both success and error responses should have a `Content-Type: application/json` header.
 
@@ -463,6 +510,8 @@ Then `amp-bind` updates the `<p>` element's text to match the `subscibe` state:
 ...
 ```
 
+[filter formats="websites, ads"]
+
 ### Redirecting after a submission
 
 You can redirect users to a new page after a successful form submission by setting the `AMP-Redirect-To` response header and specifying a redirect URL. The redirect URL must be a HTTPS URL, otherwise AMP will throw an error and redirection won't occur. HTTP response headers are configured via your server.
@@ -687,6 +736,8 @@ Note how `CANONICAL_HOSTNAME` above did not get replaced because it was not in t
 
 Substitutions will happen on every subsequent submission. Read more about [variable substitutions in AMP](../../spec/amp-var-substitutions.md).
 
+[/filter]<!-- formats="websites, ads" -->
+
 ## Polyfills
 
 The `amp-form` extension provide polyfills for behaviors and functionality missing from some browsers or being implemented in the next version of CSS.
diff --git a/extensions/amp-fx-collection/0.1/fx-type.js b/extensions/amp-fx-collection/0.1/fx-type.js
index 1a6528ddc1f63..af55f199d6ef2 100644
--- a/extensions/amp-fx-collection/0.1/fx-type.js
+++ b/extensions/amp-fx-collection/0.1/fx-type.js
@@ -96,7 +96,7 @@ let FxBindingDef;
 
 /**
  * Include respective `FxType`s here.
- * @private @const {!Object<!FxType, !FxBindingDef>}
+ * @package @const {!Object<!FxType, !FxBindingDef>}
  */
 export const FxBindings = {
   [FxType.FADE_IN]: {
diff --git a/extensions/amp-fx-collection/0.1/providers/amp-fx-presets.js b/extensions/amp-fx-collection/0.1/providers/amp-fx-presets.js
index f658a2ddf1062..d8e61fa72d0d6 100644
--- a/extensions/amp-fx-collection/0.1/providers/amp-fx-presets.js
+++ b/extensions/amp-fx-collection/0.1/providers/amp-fx-presets.js
@@ -55,7 +55,7 @@ function flyIn(fxElement, axis, coeff) {
 
   // only do this on the first element
   if (!fxElement.initialTrigger) {
-    Services.resourcesForDoc(element).mutateElement(element, () => {
+    Services.mutatorForDoc(element).mutateElement(element, () => {
       const style = computedStyle(fxElement.win, element);
       const prop = axisIsX ? 'left' : 'top';
       const propAsLength = style[prop] === 'auto' ? '0px' : style[prop];
diff --git a/extensions/amp-fx-collection/0.1/providers/fx-provider.js b/extensions/amp-fx-collection/0.1/providers/fx-provider.js
index 08f78c475a834..84f32a755897c 100644
--- a/extensions/amp-fx-collection/0.1/providers/fx-provider.js
+++ b/extensions/amp-fx-collection/0.1/providers/fx-provider.js
@@ -64,7 +64,7 @@ export function installScrollToggledFx(ampdoc, element, type) {
   registerServiceBuilderForDoc(ampdoc, fxScrollDispatch, ScrollToggleDispatch);
   const dispatch = getServiceForDoc(ampdoc, fxScrollDispatch);
 
-  const resources = Services.resourcesForDoc(element);
+  const mutator = Services.mutatorForDoc(element);
 
   let shouldMutate = true;
 
@@ -94,7 +94,7 @@ export function installScrollToggledFx(ampdoc, element, type) {
     installScrollToggleStyles(element);
   };
 
-  resources.measureMutateElement(element, measure, mutate);
+  mutator.measureMutateElement(element, measure, mutate);
 }
 
 /**
@@ -113,7 +113,7 @@ function scrollToggle(element, isShown, position) {
     scrollToggleFloatIn(element, offset);
   };
 
-  Services.resourcesForDoc(element).measureMutateElement(
+  Services.mutatorForDoc(element).measureMutateElement(
     element,
     measure,
     mutate
@@ -150,8 +150,8 @@ export class FxElement {
     /** @private @const {!../../../../src/service/viewport/viewport-interface.ViewportInterface} */
     this.viewport_ = Services.viewportForDoc(element);
 
-    /** @const @private {!../../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(element);
+    /** @const @private {!../../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(element);
 
     /** @type {?number} */
     this.viewportHeight = null;
@@ -245,7 +245,7 @@ export class FxElement {
 
   /** @private	*/
   updateViewportHeight_() {
-    this.resources_.measureElement(() => {
+    this.mutator_.measureElement(() => {
       this.viewportHeight = this.viewport_.getHeight();
     });
   }
@@ -261,7 +261,7 @@ export class FxElement {
    * @private
    */
   getAdjustedViewportHeight_() {
-    return this.resources_.measureElement(() => {
+    return this.mutator_.measureElement(() => {
       const viewportHeight = this.viewport_.getHeight();
 
       let offsetTop = 0;
diff --git a/extensions/amp-fx-flying-carpet/0.1/amp-fx-flying-carpet.js b/extensions/amp-fx-flying-carpet/0.1/amp-fx-flying-carpet.js
index d1566e930ac5a..baa95a7ae31d8 100644
--- a/extensions/amp-fx-flying-carpet/0.1/amp-fx-flying-carpet.js
+++ b/extensions/amp-fx-flying-carpet/0.1/amp-fx-flying-carpet.js
@@ -157,7 +157,7 @@ export class AmpFlyingCarpet extends AMP.BaseElement {
       this.initialPositionChecked_ = true;
     }
 
-    const width = this.getLayoutWidth();
+    const width = this.element.getLayoutWidth();
     setStyle(this.container_, 'width', width, 'px');
     Services.ownersForDoc(this.element).scheduleLayout(
       this.element,
diff --git a/extensions/amp-fx-flying-carpet/0.1/test/test-amp-fx-flying-carpet.js b/extensions/amp-fx-flying-carpet/0.1/test/test-amp-fx-flying-carpet.js
index 7aac91639ace2..d4f795071940e 100644
--- a/extensions/amp-fx-flying-carpet/0.1/test/test-amp-fx-flying-carpet.js
+++ b/extensions/amp-fx-flying-carpet/0.1/test/test-amp-fx-flying-carpet.js
@@ -146,7 +146,7 @@ describes.realWin(
         impl.mutateElement = function(callback) {
           callback();
         };
-        impl.getLayoutWidth = () => width;
+        flyingCarpet.getLayoutWidth = () => width;
 
         impl.layoutCallback();
         expect(container.style.width).to.equal(width + 'px');
diff --git a/extensions/amp-geo/amp-geo.md b/extensions/amp-geo/amp-geo.md
index 5407d4f1e2678..418dd3738677c 100644
--- a/extensions/amp-geo/amp-geo.md
+++ b/extensions/amp-geo/amp-geo.md
@@ -249,7 +249,7 @@ The string `{{AMP_ISO_COUNTRY_HOTPATCH}}` must be replaced at serving time with
 
 ### Debugging
 
-Adding `#amp-geo=XX` to the document url forces the country to appear as the country `XX`. This allows you to test without having to VPN to a country. For security reasons, to prevent sharing of geo-spoofing urls, this feature is only available to users who have enabled the [Dev Channel](https://amp.dev/documentation/guides-and-tutorials/learn/experimental) or who are testing locally (i.e., `amp-geo.js` is served in development mode via [`gulp serve`](https://github.com/ampproject/amphtml/blob/master/contributing/DEVELOPING.md)).
+Adding `#amp-geo=XX` to the document url forces the country to appear as the country `XX`. This allows you to test without having to VPN to a country. For security reasons, to prevent sharing of geo-spoofing urls, this feature is only available to users who have enabled the [Experimental Channel](https://amp.dev/documentation/guides-and-tutorials/learn/experimental) or who are testing locally (i.e., `amp-geo.js` is served in development mode via [`gulp serve`](https://github.com/ampproject/amphtml/blob/master/contributing/DEVELOPING.md)).
 
 **Note:** Debugging in DevChannel may not work in Safari due to [ITP](https://webkit.org/blog/8311/intelligent-tracking-prevention-2-0/).
 
diff --git a/extensions/amp-gfycat/0.1/amp-gfycat.js b/extensions/amp-gfycat/0.1/amp-gfycat.js
index e512480876447..f6d67444a1521 100644
--- a/extensions/amp-gfycat/0.1/amp-gfycat.js
+++ b/extensions/amp-gfycat/0.1/amp-gfycat.js
@@ -53,12 +53,14 @@ class AmpGfycat extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
+    const preconnect = Services.preconnectFor(this.win);
+    const ampdoc = this.getAmpDoc();
     // Gfycat iframe
-    this.preconnect.url('https://gfycat.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://gfycat.com', opt_onLayout);
 
     // Iframe video and poster urls
-    this.preconnect.url('https://giant.gfycat.com', opt_onLayout);
-    this.preconnect.url('https://thumbs.gfycat.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://giant.gfycat.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://thumbs.gfycat.com', opt_onLayout);
   }
 
   /** @override */
diff --git a/extensions/amp-gist/0.1/amp-gist.js b/extensions/amp-gist/0.1/amp-gist.js
index 05f9ce34ca8e6..32863fc401163 100644
--- a/extensions/amp-gist/0.1/amp-gist.js
+++ b/extensions/amp-gist/0.1/amp-gist.js
@@ -28,6 +28,7 @@
  */
 
 import {Layout} from '../../../src/layout';
+import {Services} from '../../../src/services';
 import {getIframe} from '../../../src/3p-frame';
 import {listenFor} from '../../../src/iframe-helper';
 import {removeElement} from '../../../src/dom';
@@ -46,7 +47,11 @@ export class AmpGist extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://gist.github.com/', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://gist.github.com/',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-google-document-embed/0.1/amp-google-document-embed.js b/extensions/amp-google-document-embed/0.1/amp-google-document-embed.js
index 17bc45f38434d..c09628352cdc0 100644
--- a/extensions/amp-google-document-embed/0.1/amp-google-document-embed.js
+++ b/extensions/amp-google-document-embed/0.1/amp-google-document-embed.js
@@ -27,6 +27,7 @@
  * </code>
  */
 
+import {Services} from '../../../src/services';
 import {addParamToUrl} from '../../../src/url';
 import {dev, userAssert} from '../../../src/log';
 import {isLayoutSizeDefined} from '../../../src/layout';
@@ -53,7 +54,11 @@ export class AmpDriveViewer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://docs.google.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://docs.google.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-google-vrview-image/0.1/amp-google-vrview-image.js b/extensions/amp-google-vrview-image/0.1/amp-google-vrview-image.js
index 455178b3258b3..f326ba2c56591 100644
--- a/extensions/amp-google-vrview-image/0.1/amp-google-vrview-image.js
+++ b/extensions/amp-google-vrview-image/0.1/amp-google-vrview-image.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {addParamToUrl, assertHttpsUrl} from '../../../src/url';
 import {isExperimentOn} from '../../../src/experiments';
 import {isLayoutSizeDefined} from '../../../src/layout';
@@ -71,8 +72,11 @@ class AmpGoogleVrviewImage extends AMP.BaseElement {
   /** @override */
   preconnectCallback() {
     if (this.src_) {
-      this.preconnect.preload(this.src_);
-      this.preconnect.preload(this.imageSrc_);
+      Services.preconnectFor(this.win).preload(this.getAmpDoc(), this.src_);
+      Services.preconnectFor(this.win).preload(
+        this.getAmpDoc(),
+        this.imageSrc_
+      );
     }
   }
 
diff --git a/extensions/amp-hulu/0.1/amp-hulu.js b/extensions/amp-hulu/0.1/amp-hulu.js
index 4d2cf2b2cd36e..0c6cea874080d 100644
--- a/extensions/amp-hulu/0.1/amp-hulu.js
+++ b/extensions/amp-hulu/0.1/amp-hulu.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {devAssert, userAssert} from '../../../src/log';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {removeElement} from '../../../src/dom';
@@ -32,7 +33,10 @@ class AmpHulu extends AMP.BaseElement {
 
   /** @override */
   preconnectCallback() {
-    this.preconnect.preload(this.getVideoIframeSrc_());
+    Services.preconnectFor(this.win).preload(
+      this.getAmpDoc(),
+      this.getVideoIframeSrc_()
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-iframe/0.1/amp-iframe.js b/extensions/amp-iframe/0.1/amp-iframe.js
index 089e466797798..ec259ed281058 100644
--- a/extensions/amp-iframe/0.1/amp-iframe.js
+++ b/extensions/amp-iframe/0.1/amp-iframe.js
@@ -279,7 +279,11 @@ export class AmpIframe extends AMP.BaseElement {
    */
   preconnectCallback(onLayout) {
     if (this.iframeSrc) {
-      this.preconnect.url(this.iframeSrc, onLayout);
+      Services.preconnectFor(this.win).url(
+        this.getAmpDoc(),
+        this.iframeSrc,
+        onLayout
+      );
     }
   }
 
diff --git a/extensions/amp-iframe/amp-iframe.md b/extensions/amp-iframe/amp-iframe.md
index b147a3c64d72a..cc595dd1d8621 100644
--- a/extensions/amp-iframe/amp-iframe.md
+++ b/extensions/amp-iframe/amp-iframe.md
@@ -113,7 +113,7 @@ If <code>frameborder</code> is not specified, by default, it will be set to <cod
 <br><br>
 If you are iframing a document that was not specifically created with sandboxing in mind, you will most likely need to add <code>allow-scripts allow-same-origin</code> to the <code>sandbox</code> attribute and you might need to allow additional capabilities.
 <br><br>
-Note also, that the sandbox applies to all windows opened from a sandboxed iframe. This includes new windows created by a link with <code>target=_blank</code> (add <code>allow-popups</code> to allow this to happen). Adding <code>allow-popups-to-escape-sandbox</code> to the <code>sandbox</code> attribute, makes those new windows behave like non-sandboxed new windows. This is likely most of the time what you want and expect. Unfortunately, as of this writing, <code>allow-popups-to-escape-sandbox</code> is only supported by Chrome.
+Note also, that the sandbox applies to all windows opened from a sandboxed iframe. This includes new windows created by a link with <code>target=_blank</code> (add <code>allow-popups</code> to allow this to happen). Adding <code>allow-popups-to-escape-sandbox</code> to the <code>sandbox</code> attribute, makes those new windows behave like non-sandboxed new windows. This is likely most of the time what you want and expect. Unfortunately, as of this writing, <code>allow-popups-to-escape-sandbox</code> is supported by Chrome, Firefox, Safari and Opera but not Edge.
 <br><br>
 See the <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-sandbox">docs on MDN</a> for further details on the sandbox attribute.</td>
   </tr>
diff --git a/extensions/amp-ima-video/0.1/amp-ima-video.js b/extensions/amp-ima-video/0.1/amp-ima-video.js
index b32c56845f68e..3fa11e8459404 100644
--- a/extensions/amp-ima-video/0.1/amp-ima-video.js
+++ b/extensions/amp-ima-video/0.1/amp-ima-video.js
@@ -133,23 +133,25 @@ class AmpImaVideo extends AMP.BaseElement {
 
   /** @override */
   preconnectCallback() {
-    const {element, preconnect} = this;
+    const {element} = this;
+    const preconnect = Services.preconnectFor(this.win);
     preconnect.preload(
+      this.getAmpDoc(),
       'https://imasdk.googleapis.com/js/sdkloader/ima3.js',
       'script'
     );
     const source = element.getAttribute('data-src');
     if (source) {
-      preconnect.url(source);
+      preconnect.url(this.getAmpDoc(), source);
     }
     if (this.preconnectSource_) {
-      preconnect.url(this.preconnectSource_);
+      preconnect.url(this.getAmpDoc(), this.preconnectSource_);
     }
     if (this.preconnectTrack_) {
-      preconnect.url(this.preconnectTrack_);
+      preconnect.url(this.getAmpDoc(), this.preconnectTrack_);
     }
-    preconnect.url(element.getAttribute('data-tag'));
-    preloadBootstrap(this.win, preconnect);
+    preconnect.url(this.getAmpDoc(), element.getAttribute('data-tag'));
+    preloadBootstrap(this.win, this.getAmpDoc(), preconnect);
   }
 
   /** @override */
diff --git a/extensions/amp-inline-gallery/0.1/amp-inline-gallery-pagination.css b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-pagination.css
new file mode 100644
index 0000000000000..f9a2297efe2ea
--- /dev/null
+++ b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-pagination.css
@@ -0,0 +1,190 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+amp-inline-gallery-pagination {
+  font-size: 12px;
+  /*
+   * TODO(https://github.com/ampproject/amphtml/issues/25888)
+   * Use a better, common set of fonts for sans-serif.
+   */
+  font-family: sans-serif;
+  line-height: 1;
+}
+
+.i-amphtml-inline-gallery-pagination-container {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+}
+
+.i-amphtml-inline-gallery-pagination-dots {
+  position: relative;
+  align-self: center;
+  z-index: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  max-width: 60%;
+}
+
+/**
+ * Used to allow the spacing of the dots to become more compact as more dots
+ * are added.
+ */
+.i-amphtml-inline-gallery-pagination-dot-container {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  width: 16px;
+  min-width: 14px;
+  justify-content: center;
+}
+
+.i-amphtml-inline-gallery-pagination-dot {
+  position: relative;
+  background-color: rgba(0, 0, 0, 0.2);
+}
+
+.i-amphtml-inline-gallery-pagination-dot-progress {
+  position: absolute;
+  top: 0;
+  background-color: rgba(0, 0, 0, 0.6);
+  opacity: 0; /** For no custom property support */
+  opacity: calc(1 - var(--percentage-falloff));
+}
+
+[i-amphtml-inline-gallery-pagination-dot-active="true"] .i-amphtml-inline-gallery-pagination-dot-progress {
+  opacity: 1; /** For no custom property support */
+  opacity: calc(1 - var(--percentage-falloff));
+}
+
+.i-amphtml-inline-gallery-pagination-dot,
+.i-amphtml-inline-gallery-pagination-dot-progress {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+}
+
+.i-amphtml-inline-gallery-pagination-numbers {
+  position: relative;
+  align-self: flex-end;
+  z-index: 0;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  padding: 0 8px;
+}
+
+.i-amphtml-inline-gallery-pagination-count {
+  z-index: 1;
+}
+
+.i-amphtml-inline-gallery-pagination-dots[hidden],
+.i-amphtml-inline-gallery-pagination-numbers[hidden] {
+  display: none;
+}
+
+/** Inset pagination styling. */
+amp-inline-gallery-pagination[inset]:not(.i-amphtml-hidden-by-media-query) {
+  position: absolute !important;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  bottom: var(--i-amphtml-caption-height, 0);
+  display: flex !important;
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-container {
+  margin: 18px;
+  height: 20px;
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-backdrop,
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-background,
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-frosting {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  border-radius: 12px;
+}
+
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-frosting {
+  /**
+   * Add a frosted glass effect to the pagination dots background. The backdrop
+   * and background elements will apply a darkening on top of the blurring.
+   */
+  backdrop-filter: blur(3px);
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-backdrop {
+  /**
+   * Instead of using a plain background color, we use a backdrop-filter to
+   * make the effective background partially dependent on the current
+   * backdrop (e.g. the image on a carousel slide). This allows the pagination
+   * backgroud to be distinguishable on very dark backgrounds, while still
+   * having it be semi-transparent.
+   *
+   * This can be harder to distinguish on middle greys. For this current
+   * current configuration, hsl(0, 0%, 31%) to hsl(0, 0%, 35%) can appear quite
+   * close to the background color.
+   *
+   * The blur here is used for averaging the backdrop color, so that sharp
+   * contrasts (e.g. edge of sky and landscape) do not cause immediate shifts
+   * in the container color.
+   *
+   * The greyscale is used to have the container slightly tinted by the inverse
+   * color, but also not be too tinted.
+   */
+   backdrop-filter: blur(12px) invert(1) grayscale(0.6) brightness(0.8);
+   /**
+    * Note: we use a opacity rather than a filter function due to a bug in
+    * Chrome: https://bugs.chromium.org/p/chromium/issues/detail?id=991656.
+    * Otherwise, we could use the opacity function and combine this with the
+    * i-amphtml-inline-gallery-pagination-background class as the background of the pagination container
+    * rather than needing two separate Elements for it.
+    */
+   opacity: 0.5;
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-background {
+  /**
+   * Note: we always add some darkening using background-color, since we do not
+   * change the dot color. Note that this applies on top of the backdrop based
+   * color, rather than affecting it.
+   */
+   background-color: rgba(0, 0, 0, 0.3);
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-dots {
+  padding: 0 4px;
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-numbers {
+  color: #fff;
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-dot {
+  background-color: rgba(255, 255, 255, 0.35);
+}
+
+amp-inline-gallery-pagination[inset] .i-amphtml-inline-gallery-pagination-dot-progress {
+  background-color: #fff;
+}
diff --git a/extensions/amp-inline-gallery/0.1/amp-inline-gallery-pagination.js b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-pagination.js
new file mode 100644
index 0000000000000..b0f25fc91b79a
--- /dev/null
+++ b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-pagination.js
@@ -0,0 +1,260 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {InlineGalleryEvents} from './inline-gallery-events';
+import {Layout} from '../../../src/layout';
+import {createCustomEvent} from '../../../src/event-helper';
+import {devAssert} from '../../../src/log';
+import {dict} from '../../../src/utils/object';
+import {htmlFor} from '../../../src/static-template';
+import {scopedQuerySelectorAll} from '../../../src/dom';
+import {setImportantStyles} from '../../../src/style.js';
+import {toArray} from '../../../src/types';
+
+/**
+ * The maximum number of dots to show before converting to a count.
+ */
+const MAX_DOT_COUNT = 8;
+
+/**
+ * Returns a number falling off from one to zero, based on a progress
+ * percentage and a power to decay at.
+ * TODO(sparhami) Move to math.js.
+ * @param {number} percentage A number between one and zero.
+ * @param {number} power A number greater than or equal to one.
+ * @return {number} A number between one and zero.
+ */
+export function exponentialFalloff(percentage, power) {
+  devAssert(percentage >= 0);
+  devAssert(percentage <= 1);
+  devAssert(power >= 1);
+  return Math.max(0, 1 - 1 / Math.pow(percentage, -1 / power));
+}
+
+export class AmpInlineGalleryPagination extends AMP.BaseElement {
+  /** @param {!AmpElement} element */
+  constructor(element) {
+    super(element);
+
+    /** @private {number} */
+    this.total_ = 0;
+
+    /** @private {?boolean} */
+    this.useDots_ = null;
+
+    /** @private {?Element} */
+    this.paginationDots_ = null;
+
+    /** @private {?Element} */
+    this.paginationNumbersEl_ = null;
+
+    /** @private {?Element} */
+    this.paginationIndexEl_ = null;
+
+    /** @private {?Element} */
+    this.paginationTotalEl_ = null;
+  }
+
+  /** @override */
+  isLayoutSupported(layout) {
+    return layout == Layout.FIXED_HEIGHT;
+  }
+
+  /** @override */
+  buildCallback() {
+    this.element.appendChild(this.createDom_());
+
+    this.paginationDots_ = this.element.querySelector(
+      '.i-amphtml-inline-gallery-pagination-dots'
+    );
+    this.paginationNumbersEl_ = this.element.querySelector(
+      '.i-amphtml-inline-gallery-pagination-numbers'
+    );
+    this.paginationIndexEl_ = this.element.querySelector(
+      '.i-amphtml-inline-gallery-pagination-index'
+    );
+    this.paginationTotalEl_ = this.element.querySelector(
+      '.i-amphtml-inline-gallery-pagination-total'
+    );
+  }
+
+  /**
+   * @return {!Element}
+   * @private
+   */
+  createDom_() {
+    const html = htmlFor(this.element);
+    return html`
+      <div
+        class="i-amphtml-inline-gallery-pagination-container"
+        aria-hidden="true"
+      >
+        <div class="i-amphtml-inline-gallery-pagination-dots" hidden>
+          <div class="i-amphtml-inline-gallery-pagination-frosting"></div>
+          <div class="i-amphtml-inline-gallery-pagination-backdrop"></div>
+          <div class="i-amphtml-inline-gallery-pagination-background"></div>
+        </div>
+        <div class="i-amphtml-inline-gallery-pagination-numbers" hidden>
+          <div class="i-amphtml-inline-gallery-pagination-frosting"></div>
+          <div class="i-amphtml-inline-gallery-pagination-backdrop"></div>
+          <div class="i-amphtml-inline-gallery-pagination-background"></div>
+          <div class="i-amphtml-inline-gallery-pagination-count">
+            <span class="i-amphtml-inline-gallery-pagination-index"></span>
+            <span> / </span>
+            <span class="i-amphtml-inline-gallery-pagination-total"></span>
+          </div>
+        </div>
+      </div>
+    `;
+  }
+
+  /**
+   * @param {number} index
+   * @return {!Element}
+   * @private
+   */
+  createPaginationDot_(index) {
+    const html = htmlFor(this.element);
+    const content = html`
+      <div class="i-amphtml-inline-gallery-pagination-dot-container">
+        <div class="i-amphtml-inline-gallery-pagination-dot">
+          <div class="i-amphtml-inline-gallery-pagination-dot-progress"></div>
+        </div>
+      </div>
+    `;
+
+    content.onclick = () => {
+      const event = createCustomEvent(
+        this.win,
+        InlineGalleryEvents.GO_TO_SLIDE,
+        dict({
+          'index': index,
+        }),
+        {
+          bubbles: true,
+        }
+      );
+      this.element.dispatchEvent(event);
+    };
+
+    return content;
+  }
+
+  /**
+   * Updates the total number of slides, switching between dots mode / numbers
+   * mode depending on the available space.
+   * @param {number} total
+   * @param {boolean} force
+   * @private
+   */
+  updateTotal_(total, force = false) {
+    if (total == this.total_ && !force) {
+      return;
+    }
+
+    const useDots = total <= MAX_DOT_COUNT;
+    const dotCount = useDots ? total : 0;
+
+    if (total === this.total_ && useDots === this.useDots_) {
+      return;
+    }
+
+    this.total_ = total;
+    this.useDots_ = useDots;
+
+    // Update the UI for both dots / numbers.
+    this.paginationDots_.hidden = !useDots;
+    this.paginationNumbersEl_.hidden = useDots;
+    this.paginationTotalEl_.textContent = total;
+    this.createDots_(dotCount);
+  }
+
+  /**
+   * @return {!Array<!Element>}
+   * @private
+   */
+  getDots_() {
+    return toArray(
+      scopedQuerySelectorAll(
+        devAssert(this.paginationDots_),
+        '> .i-amphtml-inline-gallery-pagination-dot-container'
+      )
+    );
+  }
+
+  /**
+   * Creates the correct number of dots, removing any extras.
+   * @param {number} dotCount
+   * @private
+   */
+  createDots_(dotCount) {
+    const dots = this.getDots_();
+    for (let i = dotCount; i < dots.length; i++) {
+      this.paginationDots_.removeChild(dots[i]);
+    }
+    for (let i = dots.length; i < dotCount; i++) {
+      this.paginationDots_.appendChild(this.createPaginationDot_(i));
+    }
+  }
+
+  /**
+   * Updates all the dots, if there are any (not using numbers).
+   * @param {number} index
+   * @param {number} offset
+   * @private
+   */
+  updateDots_(index, offset) {
+    this.getDots_().forEach((dot, i) => {
+      const distance = i - (index + offset);
+      const percentage = Math.max(1 - Math.abs(distance), 0);
+      const percentageFalloff = exponentialFalloff(percentage, 2);
+
+      setImportantStyles(dot, {
+        '--percentage-falloff': percentageFalloff,
+      });
+
+      // Apply a class to style dots when custom properties are not supported.
+      if (offset == 0) {
+        dot.setAttribute(
+          'i-amphtml-inline-gallery-pagination-dot-active',
+          i === index
+        );
+      }
+    });
+  }
+
+  /**
+   * Updates the progress numbers display.
+   * @param {number} index
+   * @private
+   */
+  updateNumbers_(index) {
+    this.paginationIndexEl_.textContent = index + 1;
+  }
+
+  /**
+   * @param {number} total
+   * @param {number} index
+   * @param {number} offset
+   */
+  updateProgress(total, index, offset) {
+    this.mutateElement(() => {
+      this.updateTotal_(total);
+      this.updateDots_(index, offset);
+      this.updateNumbers_(index);
+    });
+  }
+}
diff --git a/extensions/amp-inline-gallery/0.1/amp-inline-gallery-thumbnails.css b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-thumbnails.css
new file mode 100644
index 0000000000000..8f4d0ce3fbe95
--- /dev/null
+++ b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-thumbnails.css
@@ -0,0 +1,55 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+amp-inline-gallery-thumbnails .i-amphtml-carousel-content {
+  padding: 0;
+  padding: 0 calc(var(--thumbnail-margin, 0) / 2);
+}
+
+.i-amphtml-inline-gallery-thumbnails-container  {
+  box-sizing: border-box;
+  width: auto !important;
+  height: 100%;
+  flex-basis: content;
+  padding: 0;
+  padding: var(--thumbnail-margin, 0) calc(var(--thumbnail-margin, 0) / 2);
+  /** Used for responsive sizing based on height. */
+  writing-mode: vertical-lr;
+}
+
+.i-amphtml-inline-gallery-thumbnails-thumbnail {
+  position: relative;
+  width: auto;
+  height: 100%;
+}
+
+.i-amphtml-inline-gallery-thumbnails-resizer {
+  position: static;
+  height: 100%;
+}
+
+.i-amphtml-inline-gallery-thumbnails-image,
+.i-amphtml-inline-gallery-thumbnails-default {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+}
+
+.i-amphtml-inline-gallery-thumbnails-default {
+  background-color: #999;
+}
\ No newline at end of file
diff --git a/extensions/amp-inline-gallery/0.1/amp-inline-gallery-thumbnails.js b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-thumbnails.js
new file mode 100644
index 0000000000000..9874c82ee0e4f
--- /dev/null
+++ b/extensions/amp-inline-gallery/0.1/amp-inline-gallery-thumbnails.js
@@ -0,0 +1,247 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {CarouselEvents} from '../../amp-base-carousel/0.1/carousel-events';
+import {InlineGalleryEvents} from './inline-gallery-events';
+import {createCustomEvent} from '../../../src/event-helper';
+import {dict} from '../../../src/utils/object';
+import {htmlFor} from '../../../src/static-template';
+import {isLayoutSizeDefined} from '../../../src/layout';
+import {matches, scopedQuerySelector} from '../../../src/dom';
+import {setStyle} from '../../../src/style';
+
+/**
+ * Renders a carousel of thumbnails for an inline gallery.
+ *
+ * TODO(sparhami) Look into syncing the state between the main carousel and
+ * the thumbnails. One potential solution is to only change the position when
+ * the new slide would be outside of the currently visibile thumbnails. More
+ * investigation / UX work is needed here.
+ * TODO(sparhami) Change amp-base-carousel to move one viewport of items at
+ * a time when using `mixed-length="true"`.
+ * TODO(sparhami) Look into styling for the active thumbnail and other
+ * customizations.
+ * TODO(sparhami) Make non-looping thumbnails the default; need to make sure
+ * the next arrow works properly for that case.
+ */
+export class AmpInlineGalleryThumbnails extends AMP.BaseElement {
+  /** @param {!AmpElement} element */
+  constructor(element) {
+    super(element);
+
+    /** @private {?Element} */
+    this.carousel_ = null;
+
+    /** @private {?number} */
+    this.thumbAspectRatio_ = null;
+  }
+
+  /** @override */
+  isLayoutSupported(layout) {
+    return isLayoutSizeDefined(layout);
+  }
+
+  /** @override */
+  buildCallback() {
+    const aspectRatioWidth =
+      Number(this.element.getAttribute('aspect-ratio-width')) || 0;
+    const aspectRatioHeight =
+      Number(this.element.getAttribute('aspect-ratio-height')) || 0;
+    if (aspectRatioWidth && aspectRatioHeight) {
+      this.thumbAspectRatio_ = aspectRatioWidth / aspectRatioHeight;
+    }
+
+    // The pagination indicator should be controlled by the gallery's main
+    // carousel and not the carousel from the thumbnail strip. We stop
+    // propagation since the gallery is not interested in slide changes from
+    // our carousel.
+    this.element.addEventListener(CarouselEvents.OFFSET_CHANGE, event => {
+      event.stopPropagation();
+    });
+    this.element.addEventListener(CarouselEvents.INDEX_CHANGE, event => {
+      event.stopPropagation();
+    });
+  }
+
+  /**
+   * @param {!Array<!Element>} slides The slides to create thumbnails for.
+   */
+  setSlides(slides) {
+    const thumbnails = slides.map((slide, index) => {
+      return this.createThumbnailForElement_(slide, index);
+    });
+
+    this.mutateElement(() => {
+      this.createCarousel_(thumbnails);
+    });
+  }
+
+  /**
+   * @param {!Element} srcElement
+   * @param {number} index
+   * @return {!Element}
+   */
+  createThumbnailForElement_(srcElement, index) {
+    // Create a thumbnail container (to handle item padding) and a thumbnail
+    // with a resizer, to save the right amount of space based on the aspect
+    // ratio.
+    const html = htmlFor(this.element);
+    const content = html`
+      <div class="i-amphtml-inline-gallery-thumbnails-container">
+        <div class="i-amphtml-inline-gallery-thumbnails-thumbnail">
+          <div class="i-amphtml-inline-gallery-thumbnails-resizer"></div>
+        </div>
+      </div>
+    `;
+
+    // If an thumb width/height aspect ratio specified, used that. Otherwise
+    // use the aspect ratio of the element we are creating a thumb and
+    // fall back to a square if anything goes wrong.
+    const srcAspectRatio =
+      srcElement./*OK*/ offsetWidth / srcElement./*OK*/ offsetHeight;
+    const aspectRatio = this.thumbAspectRatio_ || srcAspectRatio || 1;
+    // Use a padding-right (along with `writing-mode: vertical-lr` in the CSS)
+    // to make the width match the aspect ratio for the available height. Note
+    // that we do not use an `svg` with a `viewBox` as that has problems in
+    // Firefox.
+    setStyle(
+      content.querySelector('.i-amphtml-inline-gallery-thumbnails-resizer'),
+      'padding-right',
+      100 * aspectRatio,
+      '%'
+    );
+
+    content
+      .querySelector('.i-amphtml-inline-gallery-thumbnails-thumbnail')
+      .appendChild(this.getThumbnailContent_(srcElement));
+    content.onclick = () => {
+      this.element.dispatchEvent(
+        createCustomEvent(
+          this.win,
+          InlineGalleryEvents.GO_TO_SLIDE,
+          dict({
+            'index': index,
+          }),
+          {
+            bubbles: true,
+          }
+        )
+      );
+      this.carousel_.getImpl().then(impl => {
+        impl.goToSlide(index, {smoothScroll: true});
+      });
+    };
+    return content;
+  }
+
+  /**
+   * @return {!Element} An element to use when there is no image available
+   *    for the thumbnail.
+   */
+  createDefaultThumbnail_() {
+    const div = document.createElement('div');
+    div.className = 'i-amphtml-inline-gallery-thumbnails-default';
+    return div;
+  }
+
+  /**
+   * Creates a thumbnail element for a given slide. If the slide is an image
+   * directly contains an image, then the image is used. Otherwise, a
+   * placeholder element is created instead.
+   * @param {!Element} slide
+   * @return {!Element}
+   */
+  getThumbnailContent_(slide) {
+    const image = matches(slide, 'amp-img, img')
+      ? slide
+      : scopedQuerySelector(slide, '> amp-img, > img');
+
+    if (!image) {
+      return this.createDefaultThumbnail_();
+    }
+
+    // Create a new thumbnail image, we do not want to clone since the
+    // elemnet may have inline styles, classes or attributes that affect
+    // rendering that we do not want.
+    const thumbImg = document.createElement('amp-img');
+    thumbImg.className = 'i-amphtml-inline-gallery-thumbnails-image';
+    thumbImg.setAttribute('layout', 'fill');
+
+    // Use the attribute since this may be an amp-img.
+    const src = image.getAttribute('src');
+    if (src) {
+      thumbImg.setAttribute('src', src);
+    }
+
+    // Use the attribute since this may be an amp-img.
+    const srcset = image.getAttribute('srcset');
+    if (srcset) {
+      thumbImg.setAttribute('srcset', srcset);
+    }
+
+    // Use the attribute since this may be an amp-img.
+    // TODO(sparhami) Simply copying over the sizes for a plain img is not
+    // ideal, since those will be based on what makes sense for the original
+    // carousel. We would ideally modify the length values for sizes based
+    // on the ratio of the size of the thumbnail to the original image. For
+    // example:
+    // `<img srcset="..." sizes="(max-width: 600px) 600px, 1200px">`
+    // to something like:
+    // `<img srcset="..." sizes="(max-width: 600px) 150px, 300px">`
+    const sizes = image.getAttribute('sizes');
+    if (sizes) {
+      thumbImg.setAttribute('sizes', sizes);
+    }
+
+    return thumbImg;
+  }
+
+  /**
+   * Creates a carousel to hold the thumbnails.
+   * TODO(sparhami) This should only create a carousel once and update slides
+   * rather than recreating.
+   * @param {!Array<!Element>} thumbnails
+   */
+  createCarousel_(thumbnails) {
+    if (this.carousel_) {
+      this.element.removeChild(this.carousel_);
+    }
+
+    // Note: The carousel is aria-hidden since it just duplicates the
+    // information of the original carousel.
+    // TODO(sparhami) Make the next/prev arrows move one carousel viewport
+    // at a time.
+    const html = htmlFor(this.element);
+    this.carousel_ = html`
+      <amp-base-carousel
+        layout="fill"
+        loop="true"
+        mixed-length="true"
+        snap="false"
+        snap-align="center"
+        controls="(pointer: fine) always, never"
+        aria-hidden="true"
+      >
+      </amp-base-carousel>
+    `;
+    thumbnails.forEach(t => this.carousel_.appendChild(t));
+
+    // We create with loop defaulting to false above, and allow it to be
+    // overwriten.
+    this.propagateAttributes(['loop'], this.carousel_);
+    this.element.appendChild(this.carousel_);
+  }
+}
diff --git a/extensions/amp-inline-gallery/0.1/amp-inline-gallery.css b/extensions/amp-inline-gallery/0.1/amp-inline-gallery.css
new file mode 100644
index 0000000000000..0f1d7bace89f8
--- /dev/null
+++ b/extensions/amp-inline-gallery/0.1/amp-inline-gallery.css
@@ -0,0 +1,28 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+amp-inline-gallery {
+  --i-amphtml-caption-height: 0px;
+}
+
+amp-inline-gallery > amp-base-carousel {
+  padding-bottom: var(--i-amphtml-caption-height);
+}
+
+amp-inline-gallery .i-amphtml-base-carousel-arrow-prev-slot,
+amp-inline-gallery .i-amphtml-base-carousel-arrow-next-slot {
+  margin-bottom: var(--i-amphtml-caption-height);
+}
diff --git a/extensions/amp-inline-gallery/0.1/amp-inline-gallery.js b/extensions/amp-inline-gallery/0.1/amp-inline-gallery.js
new file mode 100644
index 0000000000000..efe0dd2328a73
--- /dev/null
+++ b/extensions/amp-inline-gallery/0.1/amp-inline-gallery.js
@@ -0,0 +1,170 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {CSS as AmpInlineGalleryCSS} from '../../../build/amp-inline-gallery-0.1.css';
+import {AmpInlineGalleryPagination} from './amp-inline-gallery-pagination';
+import {CSS as AmpInlineGalleryPaginationCSS} from '../../../build/amp-inline-gallery-pagination-0.1.css';
+import {AmpInlineGalleryThumbnails} from './amp-inline-gallery-thumbnails';
+import {CSS as AmpInlineGalleryThumbnailsCSS} from '../../../build/amp-inline-gallery-thumbnails-0.1.css';
+import {CarouselEvents} from '../../amp-base-carousel/0.1/carousel-events';
+import {InlineGalleryEvents} from './inline-gallery-events';
+import {Layout} from '../../../src/layout';
+import {getDetail} from '../../../src/event-helper';
+import {
+  iterateCursor,
+  scopedQuerySelector,
+  scopedQuerySelectorAll,
+} from '../../../src/dom';
+import {toArray} from '../../../src/types';
+
+/**
+ * The selector of children to update the progress on as the gallery's carousel
+ * changes position.
+ */
+const CHILDREN_FOR_PROGRESS_SELECTOR = 'amp-inline-gallery-pagination';
+
+/**
+ * The selector for the element to contain the thumbnails.
+ */
+const THUMBNAILS_SELECTORS = 'amp-inline-gallery-thumbnails';
+
+/**
+ * The selector for the main carousel (i.e. not the one for the thumbnails).
+ */
+const CAROUSEL_SELECTOR =
+  ':not(amp-inline-gallery-thumbnails) > amp-base-carousel';
+
+class AmpInlineGallery extends AMP.BaseElement {
+  /** @param {!AmpElement} element */
+  constructor(element) {
+    super(element);
+  }
+
+  /** @override */
+  buildCallback() {
+    this.element.addEventListener(CarouselEvents.OFFSET_CHANGE, event => {
+      this.onOffsetChange_(event);
+    });
+    this.element.addEventListener(CarouselEvents.INDEX_CHANGE, event => {
+      this.onIndexChange_(event);
+    });
+    this.element.addEventListener(InlineGalleryEvents.GO_TO_SLIDE, event => {
+      this.onGoToSlide_(event);
+    });
+
+    // Update the slides to all the `amp-inline-gallery-thumbnails` elements,
+    // if any.
+    // TODO(sparhami) This should respond to changes in slides on the
+    // `amp-base-carousel`.
+    Promise.all([
+      scopedQuerySelector(this.element, CAROUSEL_SELECTOR).getImpl(),
+      Promise.all(
+        toArray(
+          scopedQuerySelectorAll(this.element, THUMBNAILS_SELECTORS)
+        ).map(el => el.getImpl())
+      ),
+    ]).then(data => {
+      const carouselImpl = data[0];
+      const thumbnailsImpls = data[1];
+      const slides = carouselImpl.getSlides();
+
+      thumbnailsImpls.forEach(impl => impl.setSlides(slides));
+    });
+  }
+
+  /** @override */
+  isLayoutSupported(layout) {
+    return layout === Layout.CONTAINER;
+  }
+
+  /**
+   * @param {number} total
+   * @param {number} index
+   * @param {number} offset
+   * @private
+   */
+  updateProgress_(total, index, offset) {
+    iterateCursor(
+      scopedQuerySelectorAll(this.element, CHILDREN_FOR_PROGRESS_SELECTOR),
+      el => {
+        el.getImpl().then(pagination => {
+          pagination.updateProgress(total, index, offset);
+        });
+      }
+    );
+  }
+
+  /**
+   * @param {!Event} event
+   * @private
+   */
+  onIndexChange_(event) {
+    const detail = getDetail(event);
+    const total = detail['total'];
+    const index = detail['index'];
+
+    this.updateProgress_(total, index, 0);
+  }
+
+  /**
+   * @param {!Event} event
+   * @private
+   */
+  onOffsetChange_(event) {
+    const detail = getDetail(event);
+    const total = detail['total'];
+    const index = detail['index'];
+    const offset = detail['offset'];
+
+    this.updateProgress_(total, index, offset);
+  }
+
+  /**
+   * @param {!Event} event
+   * @private
+   */
+  onGoToSlide_(event) {
+    const detail = getDetail(event);
+    const index = detail['index'];
+
+    iterateCursor(
+      scopedQuerySelectorAll(this.element, CAROUSEL_SELECTOR),
+      el => {
+        el.getImpl().then(carousel => {
+          carousel.goToSlide(index, {smoothScroll: true});
+        });
+      }
+    );
+  }
+}
+
+AMP.extension('amp-inline-gallery', '0.1', AMP => {
+  AMP.registerElement(
+    'amp-inline-gallery-pagination',
+    AmpInlineGalleryPagination,
+    AmpInlineGalleryPaginationCSS
+  );
+  AMP.registerElement(
+    'amp-inline-gallery-thumbnails',
+    AmpInlineGalleryThumbnails,
+    AmpInlineGalleryThumbnailsCSS
+  );
+  AMP.registerElement(
+    'amp-inline-gallery',
+    AmpInlineGallery,
+    AmpInlineGalleryCSS
+  );
+});
diff --git a/extensions/amp-inline-gallery/0.1/inline-gallery-events.js b/extensions/amp-inline-gallery/0.1/inline-gallery-events.js
new file mode 100644
index 0000000000000..9caa8fd03248b
--- /dev/null
+++ b/extensions/amp-inline-gallery/0.1/inline-gallery-events.js
@@ -0,0 +1,22 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @enum {string}
+ */
+export const InlineGalleryEvents = {
+  GO_TO_SLIDE: 'amp-inline-gallery:go-to-slide',
+};
diff --git a/extensions/amp-inputmask/0.1/mask-impl.js b/extensions/amp-inputmask/0.1/mask-impl.js
index db30a4a5a7027..db5771da6edb5 100644
--- a/extensions/amp-inputmask/0.1/mask-impl.js
+++ b/extensions/amp-inputmask/0.1/mask-impl.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {AmpEvents} from '../../../src/amp-events';
 import {MASK_SEPARATOR_CHAR, MaskChars, NamedMasks} from './constants';
 import {MaskInterface} from './mask-interface';
 import {dict} from '../../../src/utils/object';
@@ -95,6 +96,10 @@ export class Mask {
     }
 
     this.controller_ = this.Inputmask_(config);
+
+    this.element_.addEventListener(AmpEvents.FORM_VALUE_CHANGE, () => {
+      this.mask();
+    });
   }
 
   /**
diff --git a/extensions/amp-inputmask/0.1/test/test-mask-impl.js b/extensions/amp-inputmask/0.1/test/test-mask-impl.js
index dbbbe8486d0e5..334a3b04c3905 100644
--- a/extensions/amp-inputmask/0.1/test/test-mask-impl.js
+++ b/extensions/amp-inputmask/0.1/test/test-mask-impl.js
@@ -29,6 +29,7 @@ describes.sandboxed('amp-inputmask mask-impl', {}, env => {
       env.sandbox.stub(Mask, 'getInputmask_').returns(constructorStub);
 
       FakeElement.prototype.getAttribute = env.sandbox.stub();
+      FakeElement.prototype.addEventListener = env.sandbox.stub();
     });
 
     it(
diff --git a/extensions/amp-instagram/0.1/amp-instagram.js b/extensions/amp-instagram/0.1/amp-instagram.js
index 903fce5a157bf..0c9eabcb50f89 100644
--- a/extensions/amp-instagram/0.1/amp-instagram.js
+++ b/extensions/amp-instagram/0.1/amp-instagram.js
@@ -36,6 +36,7 @@
  */
 
 import {CSS} from '../../../build/amp-instagram-0.1.css';
+import {Services} from '../../../src/services';
 import {getData, listen} from '../../../src/event-helper';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {isObject} from '../../../src/types';
@@ -75,10 +76,15 @@ class AmpInstagram extends AMP.BaseElement {
   preconnectCallback(opt_onLayout) {
     // See
     // https://instagram.com/developer/embedding/?hl=en
-    this.preconnect.url('https://www.instagram.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://www.instagram.com',
+      opt_onLayout
+    );
     // Host instagram used for image serving. While the host name is
     // funky this appears to be stable in the post-domain sharding era.
-    this.preconnect.url(
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
       'https://instagram.fsnc1-1.fna.fbcdn.net',
       opt_onLayout
     );
diff --git a/extensions/amp-izlesene/0.1/amp-izlesene.js b/extensions/amp-izlesene/0.1/amp-izlesene.js
index 2c147ae7fb870..ad97b7e36e07d 100644
--- a/extensions/amp-izlesene/0.1/amp-izlesene.js
+++ b/extensions/amp-izlesene/0.1/amp-izlesene.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {addParamsToUrl} from '../../../src/url';
 import {devAssert, userAssert} from '../../../src/log';
 import {dict} from '../../../src/utils/object';
@@ -40,9 +41,16 @@ class AmpIzlesene extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url(this.getVideoIframeSrc_());
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      this.getVideoIframeSrc_()
+    );
     // Host that Izlesene uses to serve poster frames needed by player.
-    this.preconnect.url('https://i1.imgiz.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://i1.imgiz.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-jwplayer/0.1/amp-jwplayer.js b/extensions/amp-jwplayer/0.1/amp-jwplayer.js
index c7391bea98888..c32a253bcc03a 100644
--- a/extensions/amp-jwplayer/0.1/amp-jwplayer.js
+++ b/extensions/amp-jwplayer/0.1/amp-jwplayer.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {addParamsToUrl} from '../../../src/url';
 import {dict} from '../../../src/utils/object';
 import {isLayoutSizeDefined} from '../../../src/layout';
@@ -53,9 +54,17 @@ class AmpJWPlayer extends AMP.BaseElement {
    */
   preconnectCallback(onLayout) {
     // Host that serves player configuration and content redirects
-    this.preconnect.url('https://content.jwplatform.com', onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://content.jwplatform.com',
+      onLayout
+    );
     // CDN which hosts jwplayer assets
-    this.preconnect.url('https://ssl.p.jwpcdn.com', onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://ssl.p.jwpcdn.com',
+      onLayout
+    );
   }
 
   /** @override */
@@ -81,9 +90,6 @@ class AmpJWPlayer extends AMP.BaseElement {
     );
 
     this.contentSearch_ = element.getAttribute('data-content-search') || '';
-    this.contentContextual_ =
-      element.getAttribute('data-content-contextual') || '';
-    this.contentRecency_ = element.getAttribute('data-content-recency') || '';
     this.contentBackfill_ = element.getAttribute('data-content-backfill') || '';
   }
 
diff --git a/extensions/amp-jwplayer/0.1/test/test-amp-jwplayer.js b/extensions/amp-jwplayer/0.1/test/test-amp-jwplayer.js
index 10af83c0a2507..eba15eca495c2 100644
--- a/extensions/amp-jwplayer/0.1/test/test-amp-jwplayer.js
+++ b/extensions/amp-jwplayer/0.1/test/test-amp-jwplayer.js
@@ -87,13 +87,12 @@ describes.realWin(
         'data-playlist-id': '482jsTAr',
         'data-player-id': 'sDZEo0ea',
         'data-content-search': '__CONTEXTUAL__',
-        'data-content-contextual': true,
       });
       const iframe = jw.querySelector('iframe');
       expect(iframe).to.not.be.null;
       expect(iframe.tagName).to.equal('IFRAME');
       expect(iframe.src).to.equal(
-        'https://content.jwplatform.com/players/482jsTAr-sDZEo0ea.html?search=title_tag&contextual=true'
+        'https://content.jwplatform.com/players/482jsTAr-sDZEo0ea.html?search=title_tag'
       );
     });
     it('renders with a playlist and all parameters', async () => {
@@ -101,45 +100,15 @@ describes.realWin(
         'data-playlist-id': '482jsTAr',
         'data-player-id': 'sDZEo0ea',
         'data-content-search': 'dog',
-        'data-content-contextual': true,
-        'data-content-recency': '9D',
         'data-content-backfill': true,
       });
       const iframe = jw.querySelector('iframe');
       expect(iframe).to.not.be.null;
       expect(iframe.tagName).to.equal('IFRAME');
       expect(iframe.src).to.equal(
-        'https://content.jwplatform.com/players/482jsTAr-sDZEo0ea.html?search=dog&contextual=true&recency=9D&backfill=true'
+        'https://content.jwplatform.com/players/482jsTAr-sDZEo0ea.html?search=dog&backfill=true'
       );
     });
-    it('renders with a playlist and contextual, backfill parameters', async () => {
-      const jw = await getjwplayer({
-        'data-playlist-id': '482jsTAr',
-        'data-player-id': 'sDZEo0ea',
-        'data-content-contextual': true,
-        'data-content-backfill': true,
-      });
-      const iframe = jw.querySelector('iframe');
-      expect(iframe).to.not.be.null;
-      expect(iframe.tagName).to.equal('IFRAME');
-      expect(iframe.src).to.equal(
-        'https://content.jwplatform.com/players/482jsTAr-sDZEo0ea.html?contextual=true&backfill=true'
-      );
-    });
-    it('renders with a playlist and contextual parameter', async () => {
-      const jw = await getjwplayer({
-        'data-playlist-id': '482jsTAr',
-        'data-player-id': 'sDZEo0ea',
-        'data-content-contextual': true,
-      });
-      const iframe = jw.querySelector('iframe');
-      expect(iframe).to.not.be.null;
-      expect(iframe.tagName).to.equal('IFRAME');
-      expect(iframe.src).to.equal(
-        'https://content.jwplatform.com/players/482jsTAr-sDZEo0ea.html?contextual=true'
-      );
-    });
-
     it('fails if no media is specified', () => {
       return allowConsoleError(() => {
         return getjwplayer({
diff --git a/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.html b/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.html
index c8eac97963b08..917eca7094b77 100644
--- a/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.html
+++ b/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.html
@@ -57,8 +57,6 @@
       data-player-id="BjcwyK37"
       data-media-id="BZ6tc0gy"
       data-content-search="__CONTEXTUAL__"
-      data-content-contextual=true
-      data-content-recency="9D"
       data-content-backfill=true
       layout="responsive" width="160" height="90">
   </amp-jwplayer>
diff --git a/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.out b/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.out
index a69aa9a698630..cb22a39723a1b 100644
--- a/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.out
+++ b/extensions/amp-jwplayer/0.1/test/validator-amp-jwplayer.out
@@ -64,8 +64,6 @@ amp-jwplayer/0.1/test/validator-amp-jwplayer.html:51:2 The tag 'amp-jwplayer' is
 |        data-player-id="BjcwyK37"
 |        data-media-id="BZ6tc0gy"
 |        data-content-search="__CONTEXTUAL__"
-|        data-content-contextual=true
-|        data-content-recency="9D"
 |        data-content-backfill=true
 |        layout="responsive" width="160" height="90">
 |    </amp-jwplayer>
diff --git a/extensions/amp-jwplayer/amp-jwplayer.md b/extensions/amp-jwplayer/amp-jwplayer.md
index c890ba6740524..38f3b4decb43b 100644
--- a/extensions/amp-jwplayer/amp-jwplayer.md
+++ b/extensions/amp-jwplayer/amp-jwplayer.md
@@ -91,19 +91,11 @@ Example:
   </tr>
   <tr>
     <td width="40%"><strong>data-content-search</strong></td>
-    <td>Denotes the type of the playlist. This is a search playlist that takes in a keyword or phrase as the search query and generates a playlist based on that search query. If contextual article matching is desired, use the value <code>__CONTEXTUAL__</code> (data-content-contextual must also be <code>true</code>).)</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>data-content-contextual</strong></td>
-    <td>Enables the Player to grab the OG title (or HTML title if there is no OG title) of a given webpage and use that as the search query (required to do Contextual Article Matching). (<strong>'true' or 'false'</strong>)</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>data-content-recency</strong></td>
-    <td>Limits the videos added into the playlist based on their age (i.e. the playlist includes videos that are max [xx] days old). Specified in the format <code>xD</code>, where x is a numerical value (i.e. <code>'9D'</code>).</td>
+    <td>Denotes the type of the playlist. If contextual article matching is desired, use the value <code>`__CONTEXTUAL__`</code>. If a search playlist is desired, input a keyword or phrase used to generate the search playlist.</td>
   </tr>
   <tr>
     <td width="40%"><strong>data-content-backfill</strong></td>
-    <td>Ensures that there is always a search result. If there are no search results for the given query, this parameter ensures that a list of trending videos are served. (<strong>'true' or 'false'</strong>)</td>
+    <td>Ensures that a search or contextual playlist always returns a result. If there are no relevant results for the given query, this parameter ensures that a list of trending videos are served instead. (Boolean with default: <code>true</code>)</td>
   </tr>
   <tr>
     <td width="40%"><strong>common attributes</strong></td>
diff --git a/extensions/amp-kaltura-player/0.1/amp-kaltura-player.js b/extensions/amp-kaltura-player/0.1/amp-kaltura-player.js
index e14bf272ed2f5..68d9634c38416 100644
--- a/extensions/amp-kaltura-player/0.1/amp-kaltura-player.js
+++ b/extensions/amp-kaltura-player/0.1/amp-kaltura-player.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {addParamsToUrl} from '../../../src/url';
 import {dict} from '../../../src/utils/object';
 import {getDataParamsFromAttributes} from '../../../src/dom';
@@ -40,7 +41,11 @@ class AmpKaltura extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://cdnapisec.kaltura.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://cdnapisec.kaltura.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-lightbox-gallery/0.1/amp-lightbox-gallery.js b/extensions/amp-lightbox-gallery/0.1/amp-lightbox-gallery.js
index 6163841427644..96b776ace5042 100644
--- a/extensions/amp-lightbox-gallery/0.1/amp-lightbox-gallery.js
+++ b/extensions/amp-lightbox-gallery/0.1/amp-lightbox-gallery.js
@@ -50,7 +50,7 @@ import {getData, getDetail, isLoaded, listen} from '../../../src/event-helper';
 import {getElementServiceForDoc} from '../../../src/element-service';
 import {htmlFor} from '../../../src/static-template';
 import {isExperimentOn} from '../../../src/experiments';
-import {prepareImageAnimation} from '@ampproject/animations/dist/animations.mjs';
+import {prepareImageAnimation} from '@ampproject/animations';
 import {reportError} from '../../../src/error';
 import {setStyle, setStyles, toggle} from '../../../src/style';
 import {toArray} from '../../../src/types';
@@ -626,7 +626,8 @@ export class AmpLightboxGallery extends AMP.BaseElement {
    */
   setupGestures_() {
     const gestures = Gestures.get(dev().assertElement(this.carousel_));
-    gestures.onGesture(SwipeYRecognizer, ({data}) => {
+    gestures.onGesture(SwipeYRecognizer, e => {
+      const {data} = e;
       this.swipeGesture_(data);
     });
   }
@@ -1336,7 +1337,7 @@ export class AmpLightboxGallery extends AMP.BaseElement {
   updateVideoThumbnails_() {
     const thumbnails = this.manager_
       .getThumbnails(this.currentLightboxGroupId_)
-      .map((thumbnail, index) => Object.assign({index}, thumbnail))
+      .map((thumbnail, index) => ({index, ...thumbnail}))
       .filter(thumbnail => VIDEO_TAGS[thumbnail.element.tagName]);
 
     this.mutateElement(() => {
diff --git a/extensions/amp-lightbox-gallery/0.1/service/lightbox-manager-impl.js b/extensions/amp-lightbox-gallery/0.1/service/lightbox-manager-impl.js
index a0f9724d98e39..d3bcc6306d26f 100644
--- a/extensions/amp-lightbox-gallery/0.1/service/lightbox-manager-impl.js
+++ b/extensions/amp-lightbox-gallery/0.1/service/lightbox-manager-impl.js
@@ -150,7 +150,8 @@ export class LightboxManager {
     });
 
     // Process elements where the `lightbox` attr is dynamically set.
-    root.addEventListener(AutoLightboxEvents.NEWLY_SET, ({target}) => {
+    root.addEventListener(AutoLightboxEvents.NEWLY_SET, e => {
+      const {target} = e;
       this.processLightboxElement_(dev().assertElement(target));
     });
 
diff --git a/extensions/amp-lightbox-gallery/0.1/swipe-to-dismiss.js b/extensions/amp-lightbox-gallery/0.1/swipe-to-dismiss.js
index 0ea4df8a1c283..bbbd2d68abcf1 100644
--- a/extensions/amp-lightbox-gallery/0.1/swipe-to-dismiss.js
+++ b/extensions/amp-lightbox-gallery/0.1/swipe-to-dismiss.js
@@ -157,7 +157,8 @@ export class SwipeToDismiss {
    *   overlay: !Element,
    * }} config
    */
-  startSwipe({swipeElement, hiddenElement, mask, overlay}) {
+  startSwipe(config) {
+    const {swipeElement, hiddenElement, mask, overlay} = config;
     this.swipeElement_ = swipeElement;
     this.hiddenElement_ = hiddenElement;
     this.mask_ = mask;
diff --git a/extensions/amp-lightbox-gallery/0.1/utils.js b/extensions/amp-lightbox-gallery/0.1/utils.js
index e52c4eb78d1d3..867b07c905f5b 100644
--- a/extensions/amp-lightbox-gallery/0.1/utils.js
+++ b/extensions/amp-lightbox-gallery/0.1/utils.js
@@ -42,7 +42,7 @@ export function delayAfterDeferringToEventLoop(win, duration) {
  * Converts seconds to a timestamp formatted string.
  * @param {number} seconds
  * @return {string}
- * @private
+ * @package
  */
 export function secondsToTimestampString(seconds) {
   const h = Math.floor(seconds / 3600);
diff --git a/extensions/amp-lightbox/0.1/amp-lightbox.js b/extensions/amp-lightbox/0.1/amp-lightbox.js
index cdad0f124191d..0456549b9d9cb 100644
--- a/extensions/amp-lightbox/0.1/amp-lightbox.js
+++ b/extensions/amp-lightbox/0.1/amp-lightbox.js
@@ -713,7 +713,7 @@ function setTransparentBody(win, body) {
   const state = {};
   const ampdoc = Services.ampdocServiceFor(win).getAmpDoc(body);
 
-  Services.resourcesForDoc(ampdoc).measureMutateElement(
+  Services.mutatorForDoc(ampdoc).measureMutateElement(
     body,
     function measure() {
       state.alreadyTransparent =
diff --git a/extensions/amp-lightbox/amp-lightbox.md b/extensions/amp-lightbox/amp-lightbox.md
index ae52dc0885f80..d442722b47aee 100644
--- a/extensions/amp-lightbox/amp-lightbox.md
+++ b/extensions/amp-lightbox/amp-lightbox.md
@@ -69,41 +69,41 @@ For showing images in a lightbox, there's also the [`<amp-image-lightbox>`](http
 
 ## Attributes
 
-<table>
-  <tr>
-    <td width="40%"><strong>animate-in (optional)</strong></td>
-    <td>Defines the style of animation for opening the lightbox. By default, this will
-be set to <code>fade-in</code>. Valid values are <code>fade-in</code>, <code>fly-in-bottom</code> and
-<code>fly-in-top</code>.
-<br><br>
-<strong>Note</strong>: The <code>fly-in-*</code> animation presets modify the <code>transform</code> property of the
-<code>amp-lightbox</code> element. Do not rely on transforming the <code>amp-lightbox</code> element
-directly. If you need to apply a transform, set it on a nested element instead.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>close-button (required on AMPHTML ads)</strong></td>
-    <td>Renders a close button header at the top of the lightbox. This attribute is only
-required and valid for use with <a href="#a4a">AMPHTML Ads</a>.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>id (required)</strong></td>
-    <td>A unique identifer for the lightbox.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>layout (required)</strong></td>
-    <td>Must be set to <code>nodisplay</code>.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>scrollable (optional)</strong></td>
-    <td>When the <code>scrollable</code> attribute is present, the content of the lightbox can scroll when overflowing the height of the lightbox.
-<br><br>
-<strong>Note</strong>: The <code>scrollable</code> attribute is not allowed when using <code>&lt;amp-lightbox&gt;</code> inside an AMPHTML ad. For details, read the <a href="#a4a">Using amp-lightbox in AMPHTML ads</a> section.</td>
-  </tr>
-  <tr>
-    <td width="40%"><strong>scrollable (optional)</strong></td>
-    <td></td>
-  </tr>
-</table>
+### animate-in (optional)
+
+Defines the style of animation for opening the lightbox. By default, this will
+be set to `fade-in`. Valid values are `fade-in`, `fly-in-bottom` and `fly-in-top`.
+
+[tip type="important"]
+The `fly-in-top` and `fly-in-bottom` animation presets modify the `transform` property of the
+`amp-lightbox` element. Do not rely on transforming the `amp-lightbox` element
+directly. If you need to apply a transform, set it on a nested element instead.
+[/tip]
+
+[filter formats="ads"]
+
+### `close-button` (required)
+
+Renders a close button header at the top of the lightbox. This attribute is
+required for use with [AMPHTML Ads](#a4a). It is invalid on other AMP formats.
+
+[/filter]<!-- formats="ads" -->
+
+### `id` (required)
+
+A unique identifer for the lightbox.
+
+#### `layout` (required)
+
+Must be set to `nodisplay`.
+
+[filter formats="websites, stories"]
+
+### `scrollable` (optional)
+
+When the `scrollable` attribute is present, the content of the lightbox can scroll when overflowing the height of the lightbox.
+
+[/filter]<!-- formats="websites, stories" -->
 
 ## Styling
 
@@ -128,6 +128,8 @@ The `amp-lightbox` exposes the following actions you can use [AMP on-syntax to t
   </tr>
 </table>
 
+[filter formats="ads"]
+
 ## <a id="a4a"></a> Using `amp-lightbox` in AMPHTML ads
 
 {% call callout('Note', type='note') %}
@@ -145,6 +147,8 @@ For AMPHTML ads, the `close-button` attribute is required. This attribute causes
 
 The `close-button` attribute is required and only allowed in AMPHTML ads. In regular AMP documents, you can render a close button wherever you need it as part of the `<amp-lightbox>` content.
 
+[/filter]<!-- formats="ads" -->
+
 ### Scrollable lightboxes are disallowed
 
 For AMPHTML ads, scrollable lightboxes are not allowed.
diff --git a/extensions/amp-lightbox/validator-amp-lightbox.protoascii b/extensions/amp-lightbox/validator-amp-lightbox.protoascii
index 3bb3e3dc2d131..308668f217637 100644
--- a/extensions/amp-lightbox/validator-amp-lightbox.protoascii
+++ b/extensions/amp-lightbox/validator-amp-lightbox.protoascii
@@ -65,7 +65,10 @@ tags: {  # <amp-lightbox>
   }
   attrs: { name: "controls" }
   attrs: { name: "from" }
-  attrs: { name: "scrollable" }
+  attrs: {
+    name: "scrollable"
+    disabled_by: "amp4email"
+  }
   # <amp-bind>
   attrs: { name: "[open]" }
   attr_lists: "extended-amp-global"
diff --git a/extensions/amp-list/0.1/amp-list.js b/extensions/amp-list/0.1/amp-list.js
index cd439266634c0..5f1ac20c4c56a 100644
--- a/extensions/amp-list/0.1/amp-list.js
+++ b/extensions/amp-list/0.1/amp-list.js
@@ -22,7 +22,7 @@ import {
   DIFF_IGNORE,
   DIFF_KEY,
   markElementForDiffing,
-} from '../../../src/sanitation';
+} from '../../../src/purifier/sanitation';
 import {Deferred} from '../../../src/utils/promise';
 import {
   Layout,
@@ -60,6 +60,7 @@ import {
   setupJsonFetchInit,
 } from '../../../src/utils/xhr-utils';
 import {isArray, toArray} from '../../../src/types';
+import {isExperimentOn} from '../../../src/experiments';
 import {px, setStyles, toggle} from '../../../src/style';
 import {setDOM} from '../../../third_party/set-dom/set-dom';
 import {startsWith} from '../../../src/string';
@@ -71,6 +72,9 @@ const TAG = 'amp-list';
 const TABBABLE_ELEMENTS_QUERY =
   'button, a[href], input, select, textarea, [tabindex]:not([tabindex="-1"]), audio[controls], video[controls], [contenteditable]:not([contenteditable="false"])';
 
+// Technically the ':' is not considered part of the scheme, but it is useful to include.
+const AMP_STATE_URI_SCHEME = 'amp-state:';
+
 /**
  * @typedef {{
  *   data:(?JsonObject|string|undefined|!Array),
@@ -192,6 +196,7 @@ export class AmpList extends AMP.BaseElement {
     // is missing attributes in the constructor.
     this.initialSrc_ = this.element.getAttribute('src');
 
+    // TODO(amphtml): Decouple "initial content" from diffing in new version.
     if (this.element.hasAttribute('diffable')) {
       // Set container to the initial content, if it exists. This allows
       // us to DOM diff with the rendered result.
@@ -339,6 +344,49 @@ export class AmpList extends AMP.BaseElement {
     );
   }
 
+  /**
+   * Returns true if element's src points to amp-state.
+   *
+   * @param {string} src
+   * @return {boolean}
+   * @private
+   */
+  isAmpStateSrc_(src) {
+    return (
+      isExperimentOn(this.win, 'amp-list-init-from-state') &&
+      startsWith(src, AMP_STATE_URI_SCHEME)
+    );
+  }
+
+  /**
+   * Gets the json an amp-list that has an "amp-state:" uri. For example,
+   * src="amp-state:json.path".
+   *
+   * @param {string} src
+   * @return {Promise<!JsonObject>}
+   * @private
+   */
+  getAmpStateJson_(src) {
+    return Services.bindForDocOrNull(this.element)
+      .then(bind => {
+        userAssert(bind, '"amp-state:" URLs require amp-bind to be installed.');
+        userAssert(
+          !this.ssrTemplateHelper_.isEnabled(),
+          '[amp-list]: "amp-state" URIs cannot be used in SSR mode.'
+        );
+
+        const ampStatePath = src.slice(AMP_STATE_URI_SCHEME.length);
+        return bind.getState(ampStatePath);
+      })
+      .then(json => {
+        userAssert(
+          typeof json !== 'undefined',
+          `[amp-list] No data was found at provided uri: ${src}`
+        );
+        return json;
+      });
+  }
+
   /** @override */
   mutatedAttributesCallback(mutations) {
     dev().info(TAG, 'mutate:', this.element, mutations);
@@ -351,13 +399,17 @@ export class AmpList extends AMP.BaseElement {
     const renderLocalData = data => {
       // Remove the 'src' now that local data is used to render the list.
       this.element.setAttribute('src', '');
+      userAssert(
+        !this.ssrTemplateHelper_.isEnabled(),
+        '[amp-list] "[src]" may not be bound in SSR mode.'
+      );
+
       const array = /** @type {!Array} */ (isArray(data) ? data : [data]);
       this.resetIfNecessary_(/* isFetch */ false);
       return this.scheduleRender_(array, /* append */ false);
     };
 
     const src = mutations['src'];
-    const state = /** @type {!JsonObject} */ (mutations)['state'];
     if (src !== undefined) {
       if (typeof src === 'string') {
         // Defer to fetch in layoutCallback() before first layout.
@@ -370,9 +422,6 @@ export class AmpList extends AMP.BaseElement {
       } else {
         this.user().error(TAG, 'Unexpected "src" type: ' + src);
       }
-    } else if (state !== undefined) {
-      user().error(TAG, '[state] is deprecated, please use [src] instead.');
-      promise = renderLocalData(state);
     }
 
     const isLayoutContainer = mutations['is-layout-container'];
@@ -545,18 +594,29 @@ export class AmpList extends AMP.BaseElement {
    * @private
    */
   fetchList_(opt_refresh = false) {
-    if (!this.element.getAttribute('src')) {
+    const elementSrc = this.element.getAttribute('src');
+    if (!elementSrc) {
       return Promise.resolve();
     }
+
     let fetch;
-    if (this.ssrTemplateHelper_.isSupported()) {
+    if (this.ssrTemplateHelper_.isEnabled()) {
       fetch = this.ssrTemplate_(opt_refresh);
     } else {
-      fetch = this.prepareAndSendFetch_(opt_refresh).then(data => {
+      fetch = this.isAmpStateSrc_(elementSrc)
+        ? this.getAmpStateJson_(elementSrc)
+        : this.prepareAndSendFetch_(opt_refresh);
+      fetch = fetch.then(data => {
+        // Bail if the src has changed while resolving the xhr request.
+        if (elementSrc !== this.element.getAttribute('src')) {
+          return;
+        }
+
         const items = this.computeListItems_(data);
         if (this.loadMoreEnabled_) {
           this.updateLoadMoreSrc_(/** @type {!JsonObject} */ (data));
         }
+
         return this.scheduleRender_(
           items,
           /*opt_append*/ false,
@@ -620,6 +680,7 @@ export class AmpList extends AMP.BaseElement {
    * @return {!Promise}
    */
   ssrTemplate_(refresh) {
+    const elementSrc = this.element.getAttribute('src');
     let request;
     // Construct the fetch init data that would be called by the viewer
     // passed in as the 'originalRequest'.
@@ -678,7 +739,13 @@ export class AmpList extends AMP.BaseElement {
           throw user().createError('Error proxying amp-list templates', error);
         }
       )
-      .then(data => this.scheduleRender_(data, /* append */ false));
+      .then(data => {
+        // Bail if the src has changed while resolving the xhr request.
+        if (elementSrc !== this.element.getAttribute('src')) {
+          return;
+        }
+        this.scheduleRender_(data, /* append */ false);
+      });
   }
 
   /**
@@ -740,7 +807,7 @@ export class AmpList extends AMP.BaseElement {
       scheduleNextPass();
       current.rejecter();
     };
-    const isSSR = this.ssrTemplateHelper_.isSupported();
+    const isSSR = this.ssrTemplateHelper_.isEnabled();
     let renderPromise = this.ssrTemplateHelper_
       .applySsrOrCsrTemplate(this.element, current.data)
       .then(result => this.updateBindings_(result, current.append))
@@ -915,6 +982,12 @@ export class AmpList extends AMP.BaseElement {
 
   /**
    * Updates `this.container_` by DOM diffing its children against `elements`.
+   *
+   * TODO(amphtml): The diffing feature is dark-launched and highly complex.
+   * See markElementForDiffing() and markContainerForDiffing_() for examples.
+   * Validate whether or not this complexity is warranted before fully launching
+   * (e.g. in a new version) and pushing documentation.
+   *
    * @param {!Element} container
    * @param {!Array<!Element>} elements
    * @private
@@ -1242,6 +1315,7 @@ export class AmpList extends AMP.BaseElement {
       urlReplacement: this.getPolicy_(),
       refresh,
       token,
+      xssiPrefix: this.element.getAttribute('xssi-prefix') || undefined,
     });
   }
 
diff --git a/extensions/amp-list/0.1/test/test-amp-list.js b/extensions/amp-list/0.1/test/test-amp-list.js
index b9c09f2450529..46cc71f6f4d97 100644
--- a/extensions/amp-list/0.1/test/test-amp-list.js
+++ b/extensions/amp-list/0.1/test/test-amp-list.js
@@ -20,6 +20,10 @@ import {AmpEvents} from '../../../../src/amp-events';
 import {AmpList} from '../amp-list';
 import {Deferred} from '../../../../src/utils/promise';
 import {Services} from '../../../../src/services';
+import {
+  resetExperimentTogglesForTesting,
+  toggleExperiment,
+} from '../../../../src/experiments';
 
 describes.repeated(
   'amp-list',
@@ -89,7 +93,7 @@ describes.repeated(
           setBindService = resolve;
 
           ssrTemplateHelper = {
-            isSupported: () => false,
+            isEnabled: () => false,
             ssr: () => Promise.resolve(),
             applySsrOrCsrTemplate: env.sandbox.stub(),
           };
@@ -554,6 +558,7 @@ describes.repeated(
               img.setAttribute('src', src);
               // The ignore attribute is normally set by amp-mustache.
               img.setAttribute('i-amphtml-ignore', '');
+              img.setAttribute('layout', 'fixed');
               return img;
             }
 
@@ -692,7 +697,7 @@ describes.repeated(
 
           describe('SSR templates', () => {
             beforeEach(() => {
-              env.sandbox.stub(ssrTemplateHelper, 'isSupported').returns(true);
+              env.sandbox.stub(ssrTemplateHelper, 'isEnabled').returns(true);
             });
 
             it('should error if proxied fetch fails', () => {
@@ -803,6 +808,31 @@ describes.repeated(
                 attrs
               );
             });
+
+            it('"amp-state:" uri should skip rendering and emit an error', () => {
+              toggleExperiment(win, 'amp-list-init-from-state', true);
+
+              const ampStateEl = doc.createElement('amp-state');
+              ampStateEl.setAttribute('id', 'okapis');
+              const ampStateJson = doc.createElement('script');
+              ampStateJson.setAttribute('type', 'application/json');
+              ampStateEl.appendChild(ampStateJson);
+              doc.body.appendChild(ampStateEl);
+              list.element.setAttribute('src', 'amp-state:okapis');
+
+              listMock.expects('scheduleRender_').never();
+
+              const errorMsg = /cannot be used in SSR mode/;
+              expectAsyncConsoleError(errorMsg);
+              expect(list.layoutCallback()).eventually.rejectedWith(errorMsg);
+            });
+
+            it('Bound [src] should skip rendering and emit an error', async () => {
+              listMock.expects('scheduleRender_').never();
+              allowConsoleError(async () => {
+                await list.mutatedAttributesCallback({src: {}});
+              });
+            });
           });
 
           // TODO(aghassemi, #12476): Make this test work with sinon 4.0.
@@ -867,6 +897,7 @@ describes.repeated(
               signals: () => {
                 return {get: unusedName => false};
               },
+              getState: () => ({}),
             };
             setBindService(bind);
           });
@@ -886,15 +917,52 @@ describes.repeated(
 
           // Unlike [src] mutations with URLs, local data mutations should
           // always render immediately.
-          it('should render if [src] mutates with data (before layout)', () => {
+          it('should render if [src] mutates with data (before layout)', async () => {
             listMock.expects('scheduleRender_').once();
 
             element.setAttribute('src', 'https://new.com/list.json');
-            list.mutatedAttributesCallback({'src': [{title: 'Title1'}]});
+            await list.mutatedAttributesCallback({'src': [{title: 'Title1'}]});
             // `src` attribute should still be set to empty string.
             expect(element.getAttribute('src')).to.equal('');
           });
 
+          it('should not render if [src] has changed since the fetch was initiated', async () => {
+            const foo = doc.createElement('div');
+            const bar = doc.createElement('div');
+
+            // firstPromise won't resolve until the render triggered by secondPromise completes.
+            let resolveFirstPromise;
+            const firstPromise = new Promise(resolve => {
+              resolveFirstPromise = () => resolve({items: [foo]});
+            });
+            const secondPromise = Promise.resolve({items: [bar]});
+
+            listMock
+              .expects('fetch_')
+              .onFirstCall()
+              .returns(firstPromise)
+              .onSecondCall()
+              .returns(secondPromise)
+              .twice();
+
+            // Even though there are two fetches, the render associated with
+            // the first one should be cancelled due to an outdated src.
+            listMock
+              .expects('scheduleRender_')
+              .withArgs([bar])
+              .returns(Promise.resolve())
+              .once();
+
+            element.setAttribute('src', 'https://foo.com/list.json');
+            const layout1Promise = list.layoutCallback();
+
+            element.setAttribute('src', 'https://bar.com/list.json');
+            const layout2Promise = list.layoutCallback();
+            layout2Promise.then(() => resolveFirstPromise());
+
+            await Promise.all([layout1Promise, layout2Promise]);
+          });
+
           it('should render if [src] mutates with data', () => {
             const foo = doc.createElement('div');
             expectFetchAndRender(DEFAULT_FETCHED_DATA, [foo]);
@@ -1160,6 +1228,60 @@ describes.repeated(
               expect(bind.rescan).to.not.have.been.called;
             });
           });
+
+          describe('Using amp-state: protocol', () => {
+            const experimentName = 'amp-list-init-from-state';
+
+            beforeEach(() => {
+              resetExperimentTogglesForTesting(win);
+              element = createAmpListElement();
+              element.setAttribute('src', 'amp-state:okapis');
+              element.toggleLoading = () => {};
+              list = createAmpList(element);
+            });
+
+            it('should throw an error if used without the experiment enabled', async () => {
+              const errorMsg = /Invalid value: amp-state:okapis/;
+              expectAsyncConsoleError(errorMsg);
+              expect(list.layoutCallback()).to.eventually.throw(errorMsg);
+            });
+
+            it('should log an error if amp-bind was not included', async () => {
+              toggleExperiment(win, experimentName, true);
+              Services.bindForDocOrNull.returns(Promise.resolve(null));
+
+              const ampStateEl = doc.createElement('amp-state');
+              ampStateEl.setAttribute('id', 'okapis');
+              const ampStateJson = doc.createElement('script');
+              ampStateJson.setAttribute('type', 'application/json');
+              ampStateEl.appendChild(ampStateJson);
+              doc.body.appendChild(ampStateEl);
+
+              const errorMsg = /bind to be installed/;
+              expectAsyncConsoleError(errorMsg);
+              expect(list.layoutCallback()).eventually.rejectedWith(errorMsg);
+            });
+
+            it('should render a list using local data', async () => {
+              toggleExperiment(win, experimentName, true);
+              bind.getState = () => ({items: [1, 2, 3]});
+
+              const ampStateEl = doc.createElement('amp-state');
+              ampStateEl.setAttribute('id', 'okapis');
+              const ampStateJson = doc.createElement('script');
+              ampStateJson.setAttribute('type', 'application/json');
+              ampStateEl.appendChild(ampStateJson);
+              doc.body.appendChild(ampStateEl);
+
+              listMock
+                .expects('scheduleRender_')
+                .withExactArgs([1, 2, 3], /*append*/ false, {items: [1, 2, 3]})
+                .returns(Promise.resolve())
+                .once();
+
+              await list.layoutCallback();
+            });
+          });
         }); // with amp-bind
       }
     );
diff --git a/extensions/amp-list/0.1/test/validator-amp-list.html b/extensions/amp-list/0.1/test/validator-amp-list.html
index f4d399eda487d..02ad658739895 100644
--- a/extensions/amp-list/0.1/test/validator-amp-list.html
+++ b/extensions/amp-list/0.1/test/validator-amp-list.html
@@ -39,6 +39,11 @@
             [src]="foo.bar">
     <div></div>
   </amp-list>
+  <!-- Valid: amp-list with only data-amp-bind-src attribute -->
+  <amp-list width=10 height=10
+            data-amp-bind-src="foo.bar">
+    <div></div>
+  </amp-list>
   <!-- Valid: amp-list with both src and [src] attributes -->
   <amp-list width=10 height=10
             src="https://data.com/articles.json?ref=CANONICAL_URL"
@@ -142,7 +147,7 @@
             wdith=10 height=10>
     <div></div>
   </amp-list>
-  <!-- Invalid: missing at least src or [src]. -->
+  <!-- Invalid: missing at least src, [src] or data-amp-bind-src. -->
   <amp-list width=10 height=10>
     <div></div>
   </amp-list>
@@ -192,5 +197,11 @@
     <div></div>
   </amp-list>
   <template id="found"></template>
+  <!-- Valid: amp-list with src and xssi-prefix attribute -->
+  <amp-list width=10 height=10
+            src="https://data.com/articles.json?ref=CANONICAL_URL"
+            xssi-prefix="while(1)">
+    <div></div>
+  </amp-list>
 </body>
 </html>
diff --git a/extensions/amp-list/0.1/test/validator-amp-list.out b/extensions/amp-list/0.1/test/validator-amp-list.out
index 0204afdfa7458..c192e53f7737b 100644
--- a/extensions/amp-list/0.1/test/validator-amp-list.out
+++ b/extensions/amp-list/0.1/test/validator-amp-list.out
@@ -40,10 +40,15 @@ FAIL
 |              [src]="foo.bar">
 |      <div></div>
 |    </amp-list>
+|    <!-- Valid: amp-list with only data-amp-bind-src attribute -->
+|    <amp-list width=10 height=10
+|              data-amp-bind-src="foo.bar">
+|      <div></div>
+|    </amp-list>
 |    <!-- Valid: amp-list with both src and [src] attributes -->
 |    <amp-list width=10 height=10
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:43:2 The attribute '[state]' in tag 'amp-list' is deprecated - use '[src]' instead.
+amp-list/0.1/test/validator-amp-list.html:48:2 The attribute '[state]' may not appear in tag 'amp-list'. (see https://amp.dev/documentation/components/amp-list)
 |              src="https://data.com/articles.json?ref=CANONICAL_URL"
 |              [src]="foo.bar" [state]="baz.qux">
 |      <div></div>
@@ -87,7 +92,7 @@ amp-list/0.1/test/validator-amp-list.html:43:2 The attribute '[state]' in tag 'a
 |    <!-- Valid amp-list with deprecated auto-resize attribute -->
 |    <amp-list width=10 height=10
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:85:2 The attribute 'auto-resize' in tag 'amp-list' is deprecated - use 'replacement-to-be-determined-at-a-later-date' instead. (see https://github.com/ampproject/amphtml/issues/18849)
+amp-list/0.1/test/validator-amp-list.html:90:2 The attribute 'auto-resize' in tag 'amp-list' is deprecated - use 'replacement-to-be-determined-at-a-later-date' instead. (see https://github.com/ampproject/amphtml/issues/18849)
 |      src="https://data.com/articles.json?ref=CANONICAL_URL"
 |      auto-resize>
 |    <div></div>
@@ -139,7 +144,7 @@ amp-list/0.1/test/validator-amp-list.html:85:2 The attribute 'auto-resize' in ta
 |    <!-- Invalid: unsupported "binding" attribute value -->
 |    <amp-list width=10 height=10
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:135:2 The attribute 'binding' in tag 'amp-list' is set to the invalid value 'this-is-an-error'. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:140:2 The attribute 'binding' in tag 'amp-list' is set to the invalid value 'this-is-an-error'. (see https://amp.dev/documentation/components/amp-list)
 |              src="https://data.com/articles.json?ref=CANONICAL_URL"
 |              binding="this-is-an-error">
 |      <div></div>
@@ -147,34 +152,34 @@ amp-list/0.1/test/validator-amp-list.html:135:2 The attribute 'binding' in tag '
 |    <!-- Invalid: width is mistyped. -->
 |    <amp-list src="https://data.com/articles.json?ref=CANONICAL_URL"
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:141:2 The attribute 'wdith' may not appear in tag 'amp-list'. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:146:2 The attribute 'wdith' may not appear in tag 'amp-list'. (see https://amp.dev/documentation/components/amp-list)
 |              wdith=10 height=10>
 |      <div></div>
 |    </amp-list>
-|    <!-- Invalid: missing at least src or [src]. -->
+|    <!-- Invalid: missing at least src, [src] or data-amp-bind-src. -->
 |    <amp-list width=10 height=10>
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:146:2 The tag 'amp-list' is missing a mandatory attribute - pick at least one of ['src','[src]','data-amp-bind-src']. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:151:2 The tag 'amp-list' is missing a mandatory attribute - pick at least one of ['src','[src]','data-amp-bind-src']. (see https://amp.dev/documentation/components/amp-list)
 |      <div></div>
 |    </amp-list>
 |    <!-- Invalid: width/height missing, so it's container layout
 |         which isn't supported. -->
 |    <amp-list src="https://data.com/articles.json?ref=CANONICAL_URL">
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:151:2 Incomplete layout attributes specified for tag 'amp-list'. For example, provide attributes 'width' and 'height'. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:156:2 Incomplete layout attributes specified for tag 'amp-list'. For example, provide attributes 'width' and 'height'. (see https://amp.dev/documentation/components/amp-list)
 |      <div></div>
 |    </amp-list>
 |    <!-- Invalid amp-list with load-more attribute -->
 |    <amp-list width=10 height=10
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:155:2 The attribute 'load-more' in tag 'amp-list' is set to the invalid value ''. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:160:2 The attribute 'load-more' in tag 'amp-list' is set to the invalid value ''. (see https://amp.dev/documentation/components/amp-list)
 |      src="https://data.com/articles.json?ref=CANONICAL_URL"
 |      load-more></amp-list>
 |    </amp-list>
 |    <!-- Invalid amp-list with bad load-more attribute -->
 |    <amp-list width=10 height=10
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:160:2 The attribute 'load-more' in tag 'amp-list' is set to the invalid value 'gibberish'. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:165:2 The attribute 'load-more' in tag 'amp-list' is set to the invalid value 'gibberish'. (see https://amp.dev/documentation/components/amp-list)
 |      src="https://data.com/articles.json?ref=CANONICAL_URL"
 |      load-more="gibberish"
 |      load-more-bookmark="next"></amp-list>
@@ -182,26 +187,26 @@ amp-list/0.1/test/validator-amp-list.html:160:2 The attribute 'load-more' in tag
 |    <!-- Invalid load-more attributes -->
 |    <div load-more-button></div>
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:166:2 The attribute 'load-more-button' may not appear in tag 'div'.
+amp-list/0.1/test/validator-amp-list.html:171:2 The attribute 'load-more-button' may not appear in tag 'div'.
 |    <div load-more-loading></div>
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:167:2 The attribute 'load-more-loading' may not appear in tag 'div'.
+amp-list/0.1/test/validator-amp-list.html:172:2 The attribute 'load-more-loading' may not appear in tag 'div'.
 |    <div load-more-failed></div>
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:168:2 The attribute 'load-more-failed' may not appear in tag 'div'.
+amp-list/0.1/test/validator-amp-list.html:173:2 The attribute 'load-more-failed' may not appear in tag 'div'.
 |    <div load-more-end></div>
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:169:2 The attribute 'load-more-end' may not appear in tag 'div'.
+amp-list/0.1/test/validator-amp-list.html:174:2 The attribute 'load-more-end' may not appear in tag 'div'.
 |    <amp-list-load-more></amp-list-load-more>
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:170:2 The parent tag of tag 'amp-list-load-more' is 'body', but it can only be 'amp-list'. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:175:2 The parent tag of tag 'amp-list-load-more' is 'body', but it can only be 'amp-list'. (see https://amp.dev/documentation/components/amp-list)
 |    <amp-list width=10 height=10
 |      src="https://data.com/articles.json?ref=CANONICAL_URL"
 |      load-more="manual"
 |      load-more-bookmark="next">
 |      <button load-more-clickable></button>
 >>     ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:175:4 The parent tag of tag 'amp-list-load-more button[load-more-clickable]' is 'amp-list', but it can only be 'amp-list-load-more'. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:180:4 The parent tag of tag 'amp-list-load-more button[load-more-clickable]' is 'amp-list', but it can only be 'amp-list-load-more'. (see https://amp.dev/documentation/components/amp-list)
 |    </amp-list>
 |    <amp-list width=10 height=10
 |      src="https://data.com/articles.json?ref=CANONICAL_URL"
@@ -212,7 +217,7 @@ amp-list/0.1/test/validator-amp-list.html:175:4 The parent tag of tag 'amp-list-
 |    <!-- References to template elements -->
 |    <amp-list width=10 height=10
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:184:2 Attribute 'template' in tag 'amp-list' contains a value that does not match any other tags on the page. (see https://amp.dev/documentation/components/amp-list)
+amp-list/0.1/test/validator-amp-list.html:189:2 Attribute 'template' in tag 'amp-list' contains a value that does not match any other tags on the page. (see https://amp.dev/documentation/components/amp-list)
 |      src="https://data.com/articles.json?ref=CANONICAL_URL"
 |      template="missing">
 |      <div></div>
@@ -224,8 +229,14 @@ amp-list/0.1/test/validator-amp-list.html:184:2 Attribute 'template' in tag 'amp
 |    </amp-list>
 |    <template id="found"></template>
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:194:2 The mandatory attribute 'type' is missing in tag 'template'. (see https://amp.dev/documentation/components/amp-mustache)
+amp-list/0.1/test/validator-amp-list.html:199:2 The mandatory attribute 'type' is missing in tag 'template'. (see https://amp.dev/documentation/components/amp-mustache)
 >>   ^~~~~~~~~
-amp-list/0.1/test/validator-amp-list.html:194:2 The tag 'template' requires including the 'amp-mustache' extension JavaScript. (see https://amp.dev/documentation/components/amp-mustache)
+amp-list/0.1/test/validator-amp-list.html:199:2 The tag 'template' requires including the 'amp-mustache' extension JavaScript. (see https://amp.dev/documentation/components/amp-mustache)
+|    <!-- Valid: amp-list with src and xssi-prefix attribute -->
+|    <amp-list width=10 height=10
+|              src="https://data.com/articles.json?ref=CANONICAL_URL"
+|              xssi-prefix="while(1)">
+|      <div></div>
+|    </amp-list>
 |  </body>
 |  </html>
\ No newline at end of file
diff --git a/extensions/amp-list/amp-list.md b/extensions/amp-list/amp-list.md
index b596360a49a5c..2661f31184df5 100644
--- a/extensions/amp-list/amp-list.md
+++ b/extensions/amp-list/amp-list.md
@@ -213,10 +213,16 @@ The `<amp-list>` element exposes a `refresh` action that other elements can refe
 
 ### Dynamic resizing
 
+[filter formats="websites, stories"]
 In several cases, we may need the `<amp-list>` to resize on user interaction. For example, when the `<amp-list>` contains an amp-accordion that a user may tap on, when the contents of the `<amp-list>` change size due to bound CSS classes, or when the number of items inside an `<amp-list>` changes due to a bound `[src]` attribute. The `changeToLayoutContainer` action handles this by changing the amp list to `layout="CONTAINER"` when triggering this action. See the following example:
+[/filter]<!-- formats="websites, stories" -->
+
+[filter formats="email"]
+In several cases, we may need the `<amp-list>` to resize on user interaction. For example, when the `<amp-list>` contains an amp-accordion that a user may tap on, when the contents of the `<amp-list>` change size due to bound CSS classes. The `changeToLayoutContainer` action handles this by changing the amp list to `layout="CONTAINER"` when triggering this action. See the following example:
+[/filter]<!-- formats="email" -->
 
 ```html
-<button on="list.changeToLayoutContainer()">Show Grid</button>
+<button on="tap:list.changeToLayoutContainer()">Show Grid</button>
 <amp-list
   id="list"
   width="396"
@@ -232,20 +238,24 @@ In several cases, we may need the `<amp-list>` to resize on user interaction. Fo
 
 ## Attributes
 
-##### src (required)
+### src (required)
 
 The URL of the remote endpoint that returns the JSON that will be rendered
 within this `<amp-list>`. This must be a CORS HTTP service. The URL's protocol must be HTTPS.
 
-{% call callout('Important', type='caution') %}
+[tip type="important"]
 Your endpoint must implement the requirements specified in the [CORS Requests in AMP](https://www.ampproject.org/docs/fundamentals/amp-cors-requests) spec.
-{% endcall %}
+[/tip]
 
 If fetching the data at the `src` URL fails, the `<amp-list>` triggers a low-trust `fetch-error` event.
 
+[filter formats="websites, stories"]
 The `src` attribute may be omitted if the `[src]` attribute exists. `[src]` supports URL and non-URL expression values; see `amp-list` in [`amp-bind` element specific attributes documentation](https://amp.dev/documentation/components/amp-bind/#element-specific-attributes) for details.
+[/filter]<!-- formats="websites, stories" -->
+
+[filter formats="websites, stories"]
 
-##### credentials (optional)
+### credentials (optional)
 
 Defines a `credentials` option as specified by the [Fetch API](https://fetch.spec.whatwg.org/).
 
@@ -267,7 +277,9 @@ Here's an example that specifies including credentials to display personalized c
 </amp-list>
 ```
 
-##### items (optional)
+[/filter]<!-- formats="websites, stories" -->
+
+### items (optional)
 
 Defines the expression to locate the array to be rendered within the response. This is a dot-notated expression that navigates via fields of the JSON response.
 By defaut `<amp-list>` expects an array, the `single-item` attribute may be used to load data from an object.
@@ -284,23 +296,46 @@ When `items="items"` is specified (which, is the default) the response must be a
 }
 ```
 
-##### max-items (optional)
+### max-items (optional)
 
 An integer value specifying the maximum length of the items array to be rendered.
 The `items` array will be truncated to `max-items` entries if the returned value exceeds `max-items`.
 
-##### single-item (optional)
+### single-item (optional)
 
 Causes `<amp-list>` to treat the returned result as if it were a single element array. An object response will be wrapped in an array so
 `{items: {...}}` will behave as if it were `{items: [{...}]}`.
 
-##### reset-on-refresh (optional)
+[filter formats="websites, stories"]
+
+### xssi-prefix (optional)
+
+Causes `<amp-list>` to strip a prefix from the fetched JSON before parsing. This can be useful for APIs that include [security prefixes](http://patorjk.com/blog/2013/02/05/crafty-tricks-for-avoiding-xssi/) like `)]}` to help prevent cross site scripting attacks.
+
+For example, lets say we had an API that returned this response:
+
+```
+)]}{ "items": ["value"] }
+```
+
+We could instruct `amp-list` to remove the security prefix like so:
+
+```html
+<amp-list xssi-prefix=")]}" src="https://foo.com/list.json"></amp-list>
+```
+
+[/filter]<!-- formats="websites, stories" -->
+
+[filter formats="websites, stories"]
+
+### reset-on-refresh (optional)
 
 Displays a loading indicator and placeholder again when the list's source is refreshed via `amp-bind` or the `refresh()` action.
 
 By default, this will only trigger on refreshes that cause a network fetch. To reset on all refreshes, use `reset-on-refresh="always"`.
+[/filter]<!-- formats="websites, stories" -->
 
-##### binding (optional)
+### binding (optional)
 
 For pages using `<amp-list>` that also use `amp-bind`, controls whether or not to block render on the evaluation of bindings (e.g. `[text]`) in rendered children.
 
@@ -312,7 +347,12 @@ We recommend using `binding="no"` or `binding="refresh"` for faster performance.
 
 If `binding` attribute is not provided, default is `always`.
 
-##### [is-layout-container](optional)
+[filter formats="websites, stories"]
+
+<!-- prettier-ignore-start -->
+<!-- See: https://github.com/remarkjs/remark/issues/456 -->
+### [is-layout-container] (optional)
+<!-- prettier-ignore-end-->
 
 This is a bindable attribute that should always be `false` by default. When set to `true` via `amp-bind`, it changes the layout of the `<amp-list>` to `container`. This attribute is useful for handling dynamic resizing for amp-list.
 
@@ -320,10 +360,33 @@ This attribute cannot be true by default for the same reason why `<amp-list>` do
 
 Alternatively, one may also use the `changeToLayoutContainer` action.
 
-##### common attributes
+[/filter]<!-- formats="websites, stories" -->
+
+### Common attributes
 
 This element includes [common attributes](https://amp.dev/documentation/guides-and-tutorials/learn/common_attributes) extended to AMP components.
 
+[filter formats="email"]
+
+##### Invalid AMP email attributes
+
+The AMP for Email spec disallows the use of the following attributes on the AMP email format.
+
+- `[src]`
+- `[state]`
+- `[is-layout-container]`
+- `auto-resize`
+- `credentials`
+- `data-amp-bind-src`
+- `load-more`
+- `load-more-bookmark`
+- `reset-on-refresh`
+- `xssi-prefix`
+
+[/filter] <!-- formats="email" -->
+
+[filter formats="websites, stories"]
+
 ## Load more and infinite scroll
 
 We've introduced the `load-more` attributes with options `manual` and `auto` to allow pagination and infinite scroll.
@@ -492,6 +555,8 @@ For example:
 
 may make a request to something like `https://foo.com/list.json?0.8390278471201` where the RANDOM value is randomly generated upon each impression.
 
+[/filter] <!-- formats="websites, stories" -->
+
 ## Validation
 
 See [amp-list rules](https://github.com/ampproject/amphtml/blob/master/extensions/amp-list/validator-amp-list.protoascii) in the AMP validator specification.
diff --git a/extensions/amp-list/validator-amp-list.protoascii b/extensions/amp-list/validator-amp-list.protoascii
index 4f9d28f313967..0d36870e253b7 100644
--- a/extensions/amp-list/validator-amp-list.protoascii
+++ b/extensions/amp-list/validator-amp-list.protoascii
@@ -64,6 +64,10 @@ tags: {  # <amp-list> with mandatory src and/or [src] attr
     value: "refresh"
   }
   attrs: { name: "credentials" }
+  attrs: {
+    name: "data-amp-bind-src"
+    mandatory_anyof: "['src','[src]','data-amp-bind-src']"
+  }
   attrs: {
     name: "diffable"
     value: ""
@@ -88,6 +92,7 @@ tags: {  # <amp-list> with mandatory src and/or [src] attr
     value: "fetch"
   }
   attrs: { name: "single-item" }
+  attrs: { name: "xssi-prefix" }
   attrs: {
     name: "src"
     mandatory_anyof: "['src','[src]','data-amp-bind-src']"
@@ -109,10 +114,6 @@ tags: {  # <amp-list> with mandatory src and/or [src] attr
     name: "[src]"
     mandatory_anyof: "['src','[src]','data-amp-bind-src']"
   }
-  attrs: {
-    name: "[state]"
-    deprecation: "[src]"
-  }
   attr_lists: "extended-amp-global"
   amp_layout: {
     supported_layouts: FILL
@@ -233,6 +234,10 @@ tags: {  # <amp-list>
     name: "template"
     value_oneof_set: TEMPLATE_IDS
   }
+  # <amp-bind>
+  attrs: {
+    name: "[is-layout-container]"
+  }
   attr_lists: "extended-amp-global"
   amp_layout: {
     supported_layouts: FILL
diff --git a/extensions/amp-live-list/0.1/live-list-manager.js b/extensions/amp-live-list/0.1/live-list-manager.js
index 9250bec4cf0bc..e1c34f3525953 100644
--- a/extensions/amp-live-list/0.1/live-list-manager.js
+++ b/extensions/amp-live-list/0.1/live-list-manager.js
@@ -16,15 +16,10 @@
 
 import {Poller} from './poller';
 import {Services} from '../../../src/services';
-import {addParamsToUrl} from '../../../src/url';
-import {dict} from '../../../src/utils/object';
+import {addParamToUrl} from '../../../src/url';
 import {fetchDocument} from '../../../src/document-fetcher';
 import {getMode} from '../../../src/mode';
 import {getServicePromiseForDoc} from '../../../src/service';
-import {
-  installOriginExperimentsForDoc,
-  originExperimentsForDoc,
-} from '../../../src/service/origin-experiments-impl';
 import {startsWith} from '../../../src/string';
 import {toArray} from '../../../src/types';
 import {userAssert} from '../../../src/log';
@@ -82,9 +77,6 @@ export class LiveListManager {
     /** @private @const {boolean} */
     this.isTransformed_ = isDocTransformed(ampdoc.getRootNode());
 
-    /** @private {?boolean} */
-    this.enrolledInAppendRandomExperiment_ = null;
-
     // 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
@@ -155,17 +147,11 @@ export class LiveListManager {
   fetchDocument_() {
     let url = this.url_;
     if (this.latestUpdateTime_ > 0) {
-      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.random()),
-          })
-        : dict({
-            'amp_latest_update_time': String(this.latestUpdateTime_),
-          });
-      url = addParamsToUrl(url, parameters);
+      url = addParamToUrl(
+        url,
+        'amp_latest_update_time',
+        String(this.latestUpdateTime_)
+      );
     }
 
     if (this.isTransformed_) {
@@ -293,17 +279,6 @@ export class LiveListManager {
     // Polling may not be started yet if no live lists were registered by
     // doc ready in LiveListManager's constructor.
     if (liveList.isEnabled() && this.poller_ && this.ampdoc.isVisible()) {
-      if (this.enrolledInAppendRandomExperiment_ === null) {
-        // Origin Trial for cache busting requests for `amp-live-list`.
-        installOriginExperimentsForDoc(this.ampdoc);
-        originExperimentsForDoc(liveList.element)
-          .getExperiments()
-          .then(
-            trials =>
-              (this.enrolledInAppendRandomExperiment_ =
-                trials && trials.includes('amp-live-list-random'))
-          );
-      }
       this.poller_.start();
     }
   }
diff --git a/extensions/amp-live-list/0.1/test/test-amp-live-list.js b/extensions/amp-live-list/0.1/test/test-amp-live-list.js
index 86e459161183e..6f457c91f96b3 100644
--- a/extensions/amp-live-list/0.1/test/test-amp-live-list.js
+++ b/extensions/amp-live-list/0.1/test/test-amp-live-list.js
@@ -170,7 +170,7 @@ describes.realWin(
     });
 
     it('has a minimum interval', () => {
-      let attrs = Object.assign({}, dftAttrs, {'data-poll-interval': 17000});
+      let attrs = {...dftAttrs, 'data-poll-interval': 17000};
       buildElement(elem, attrs);
       liveList.buildCallback();
       expect(liveList.element.getAttribute('data-poll-interval')).to.equal(
@@ -178,7 +178,7 @@ describes.realWin(
       );
       expect(liveList.getInterval()).to.equal(17000);
 
-      attrs = Object.assign({}, dftAttrs, {'data-poll-interval': 4000});
+      attrs = {...dftAttrs, 'data-poll-interval': 4000};
       buildElement(elem, attrs);
       liveList.buildCallback();
       expect(liveList.element.getAttribute('data-poll-interval')).to.equal(
@@ -190,7 +190,7 @@ describes.realWin(
     });
 
     it('should enforce max-items-per-page', () => {
-      let attrs = Object.assign({}, dftAttrs, {'data-max-items-per-page': ''});
+      let attrs = {...dftAttrs, 'data-max-items-per-page': ''};
       buildElement(elem, attrs);
       // Errors out because no data-max-items-per-page is given
       expect(liveList.element.getAttribute('data-max-items-per-page')).to.equal(
@@ -203,7 +203,7 @@ describes.realWin(
       });
 
       // Errors out because data-max-items-per-page does not exist
-      attrs = Object.assign({}, dftAttrs);
+      attrs = {...dftAttrs};
       expect('data-max-items-per-page' in attrs).to.be.true;
       delete attrs['data-max-items-per-page'];
       expect('data-max-items-per-page' in attrs).to.be.false;
@@ -215,7 +215,7 @@ describes.realWin(
       });
 
       // Errors out because data-max-items-per-page is not parseable as a number
-      attrs = Object.assign({}, dftAttrs, {'data-max-items-per-page': 'hello'});
+      attrs = {...dftAttrs, 'data-max-items-per-page': 'hello'};
       buildElement(elem, attrs);
       expect(liveList.element.getAttribute('data-max-items-per-page')).to.equal(
         'hello'
@@ -226,7 +226,7 @@ describes.realWin(
         }).to.throw(/must have data-max-items-per-page/);
       });
 
-      attrs = Object.assign({}, dftAttrs, {'data-max-items-per-page': '10'});
+      attrs = {...dftAttrs, 'data-max-items-per-page': '10'};
       buildElement(elem, attrs);
       expect(liveList.element.getAttribute('data-max-items-per-page')).to.equal(
         '10'
@@ -1038,10 +1038,7 @@ describes.realWin(
       // append child 2 first
       itemsSlot.appendChild(child2);
       itemsSlot.appendChild(child1);
-      buildElement(
-        elem,
-        Object.assign({}, dftAttrs, {'data-max-items-per-page': 2})
-      );
+      buildElement(elem, {...dftAttrs, 'data-max-items-per-page': 2});
       env.sandbox.stub(liveList, 'isElementBelowViewport_').returns(true);
       liveList.buildCallback();
       const removeChildSpy = env.sandbox.spy(
@@ -1088,10 +1085,7 @@ describes.realWin(
       // append child 2 first
       itemsSlot.appendChild(child2);
       itemsSlot.appendChild(child1);
-      buildElement(
-        elem,
-        Object.assign({}, dftAttrs, {'data-max-items-per-page': 2})
-      );
+      buildElement(elem, {...dftAttrs, 'data-max-items-per-page': 2});
       const pred = env.sandbox.stub(liveList, 'isElementBelowViewport_');
       // id1
       pred.onCall(0).returns(true);
@@ -1287,7 +1281,7 @@ describes.realWin(
         child2.setAttribute('data-sort-time', oldDate - 1);
         itemsSlot.appendChild(child1);
         itemsSlot.appendChild(child2);
-        buildElement(elem, Object.assign({}, dftAttrs, {'sort': 'ascending'}));
+        buildElement(elem, {...dftAttrs, 'sort': 'ascending'});
         liveList.buildCallback();
         expect(liveList.itemsSlot_.childElementCount).to.equal(2);
         expect(elem.querySelector('[update]')).to.have.class('amp-hidden');
@@ -1343,13 +1337,11 @@ describes.realWin(
         // append child 2 first
         itemsSlot.appendChild(child1);
         itemsSlot.appendChild(child2);
-        buildElement(
-          elem,
-          Object.assign({}, dftAttrs, {
-            'data-max-items-per-page': 2,
-            'sort': 'ascending',
-          })
-        );
+        buildElement(elem, {
+          ...dftAttrs,
+          'data-max-items-per-page': 2,
+          'sort': 'ascending',
+        });
         env.sandbox.stub(liveList, 'isElementAboveViewport_').returns(true);
         liveList.buildCallback();
         const removeChildSpy = env.sandbox.spy(
@@ -1396,13 +1388,11 @@ describes.realWin(
         // append child 2 first
         itemsSlot.appendChild(child1);
         itemsSlot.appendChild(child2);
-        buildElement(
-          elem,
-          Object.assign({}, dftAttrs, {
-            'data-max-items-per-page': 2,
-            'sort': 'ascending',
-          })
-        );
+        buildElement(elem, {
+          ...dftAttrs,
+          'data-max-items-per-page': 2,
+          'sort': 'ascending',
+        });
         const pred = env.sandbox.stub(liveList, 'isElementAboveViewport_');
         // id1
         pred.onCall(0).returns(true);
diff --git a/extensions/amp-loader/0.1/amp-loader.js b/extensions/amp-loader/0.1/amp-loader.js
index 1d07ff5fddf3f..750a055e66b86 100644
--- a/extensions/amp-loader/0.1/amp-loader.js
+++ b/extensions/amp-loader/0.1/amp-loader.js
@@ -16,7 +16,6 @@
 
 import {CSS} from '../../../build/amp-loader-0.1.css';
 import {Services} from '../../../src/services';
-import {createSpinnerDom} from './spinner';
 import {htmlFor} from '../../../src/static-template';
 import {installStylesForDoc} from '../../../src/style-installer';
 import {isIframeVideoPlayerComponent} from '../../../src/layout';
@@ -55,6 +54,30 @@ const LOADER_BACKGROUND_TAGS = {
  */
 let loaderDom = null;
 
+/**
+ * @param {function(!Array<string>):!Element} html
+ * @return {!Element}
+ */
+function createSpinnerDom(html) {
+  // Extra wrapping div here is to workaround:
+  // https://bugs.chromium.org/p/chromium/issues/detail?id=1002748
+  // eslint-disable max-len
+  const content = html`
+    <div class="i-amphtml-new-loader-spinner-wrapper">
+      <svg class="i-amphtml-new-loader-spinner" viewBox="0 0 48 48">
+        <path
+          class="i-amphtml-new-loader-spinner-path"
+          fill="none"
+          d="M24 2a22 22 0 10.01 0m33.27 5.65a22 22 0 102.74-2.1m46.13 1.35a22 22 0 105.96-3.44m42.96 2.74a22 22 0 109.49-3.93m39.46 3.28a22 22 0 1013.13-3.52M253 4.95a22 22 0 1016.69-2.2m32.32 1.65a22 22 0 1019.98 0m29.06-.5a22 22 0 1022.79 3m26.28-3.44a22 22 0 1024.98 6.69m24.1-7.07a22 22 0 1026.4 10.94m22.71-11.27a22 22 0 1026.94 15.56m22.18-15.83a22 22 0 1026.54 20.37m22.59-20.58a22 22 0 1025.17 25.17M645.7 2.12a22 22 0 1022.84 29.76m26.31-29.85a22 22 0 1019.6 33.95M744 2a22 22 0 1015.56 37.56m33.59-37.53a22 22 0 1010.83 40.42M842.3 2.12a22 22 0 105.58 42.42m43.56-42.27a22 22 0 100 43.46m49.13-43.25a22 22 0 10-5.73 43.49m54.85-43.22a22 22 0 10-11.39 42.5m60.5-42.17a22 22 0 00-16.79 40.53m65.87-40.15a22 22 0 00-21.73 37.64m70.8-37.2a22 22 0 00-26.05 33.94m75.09-33.44a22 22 0 00-29.59 29.59M1235 4.95a22 22 0 00-32.25 24.75m81.23-24.15a22 22 0 00-33.95 19.6m82.9-18.95a22 22 0 00-34.66 14.36m83.58-13.66a22 22 0 00-34.38 9.21m83.25-8.46a22 22 0 00-33.17 4.37m82.01-3.58a22 22 0 00-31.11 0m81.35 2.63a22 22 0 00-32.52-3.42m82.32 6.36a22 22 0 00-33.45-7.11m82.77 10.3a22 22 0 00-33.85-11m82.66 14.36a22 22 0 00-33.71-15.01M1726 24a22 22 0 00-33-19.05m80.73 22.49a22 22 0 00-31.72-23.04m78.91 26.4a22 22 0 00-29.87-26.9m76.55 30.09a22 22 0 00-27.49-30.53m73.69 33.47a22 22 0 00-24.6-33.85m70.36 36.48a22 22 0 00-21.25-36.81m66.62 39.05a22 22 0 00-17.51-39.32m62.57 41.12a22 22 0 00-13.43-41.33m58.24 42.65a22 22 0 00-9.1-42.8m53.74 43.61a22 22 0 00-4.59-43.7M2184 46a22 22 0 100-44m44.56 43.73a22 22 0 104.59-43.7m40.05 42.89a22 22 0 109.1-42.8m35.71 41.48a22 22 0 1013.43-41.33m31.63 39.53a22 22 0 1017.51-39.32m27.86 37.08a22 22 0 1021.25-36.81m24.51 34.18a22 22 0 1024.6-33.85m21.6 30.91a22 22 0 1027.49-30.53m19.19 27.34a22 22 0 1029.87-26.9m17.32 23.54a22 22 0 1031.72-23.04M2642 24a22 22 0 1033-19.05m15.27 15.61a22 22 0 1033.71-15.01m15.1 11.65a22 22 0 1033.85-11m15.47 7.81a22 22 0 1033.45-7.11m16.35 4.17a22 22 0 1032.52-3.42m17.72.79a22 22 0 1031.11 0m17.73-.79a22 22 0 1032.52 3.42m16.35-4.17a22 22 0 1033.45 7.11m15.47-7.81a22 22 0 1033.85 11m15.1-11.65a22 22 0 1033.71 15.01M3133 4.95A22 22 0 103166 24m16.01-19.6a22 22 0 1031.72 23.04m17.32-23.54a22 22 0 1029.87 26.9m19.2-27.34a22 22 0 1027.49 30.53m21.59-30.91a22 22 0 1024.6 33.85m24.51-34.18a22 22 0 1021.25 36.81m27.87-37.08a22 22 0 1017.51 39.32m31.62-39.53a22 22 0 1013.43 41.33m35.71-41.48a22 22 0 109.1 42.8m40.05-42.89a22 22 0 104.59 43.7M3624 2a22 22 0 100 44m49.15-43.97a22 22 0 00-4.59 43.7m53.74-43.61a22 22 0 00-9.1 42.8m58.24-42.65a22 22 0 00-13.43 41.33m62.56-41.12a22 22 0 00-17.51 39.32m66.63-39.05a22 22 0 00-21.25 36.81m70.36-36.48a22 22 0 00-24.6 33.85m73.68-33.47a22 22 0 00-27.49 30.53m76.56-30.09a22 22 0 00-29.87 26.9m78.91-26.4a22 22 0 00-31.72 23.04M4115 4.95A22 22 0 004082 24m81.98-18.45a22 22 0 00-33.71 15.01m82.66-14.36a22 22 0 00-33.85 11m82.77-10.3a22 22 0 00-33.45 7.11m82.32-6.36a22 22 0 00-32.52 3.42"
+        ></path>
+      </svg>
+    </div>
+  `;
+  // eslint-enable max-len
+
+  return content;
+}
+
 /**
  * @param {!AmpElement} element Used to get a document to build HTML with.
  * @return {!Element} The loader DOM.
diff --git a/extensions/amp-loader/0.1/spinner.js b/extensions/amp-loader/0.1/spinner.js
deleted file mode 100644
index 03f1d84a3b3eb..0000000000000
--- a/extensions/amp-loader/0.1/spinner.js
+++ /dev/null
@@ -1,153 +0,0 @@
-import {polarToCartesian} from '../../../src/utils/math';
-
-/**
- * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/**
- * The number of frames to generate for each part of the animation. This and
- * svgSize correspond to the translate values for the animation in the CSS.
- */
-const steps = 30;
-
-/**
- * The width/height of the SVG''s viewbox. This and steps correspond to the
- * translate values for the animation in the CSS.
- */
-const svgSize = 48;
-
-/**
- * The radius for the spinner.
- */
-const radius = 22;
-
-/**
- * @param {number} x The x coordinate of the center of a circle.
- * @param {number} y The y coordinate of the center of a circle.
- * @param {number} radius The radius of a circle.
- * @param {number} startAngle The starting angle for the arc.
- * @param {number} endAngle The ending angle for the arc.
- * @return {string} The path for the arc.
- */
-function getCircleArcPath(x, y, radius, startAngle, endAngle) {
-  const start = polarToCartesian(x, y, radius, endAngle);
-  const end = polarToCartesian(x, y, radius, startAngle);
-  const deltaX = end.x - start.x;
-  const deltaY = end.y - start.y;
-
-  const largeArcFlag =
-    endAngle > startAngle != Math.abs(endAngle - startAngle) <= 180 ? 1 : 0;
-
-  return getArcPathCommands(
-    start.x,
-    start.y,
-    radius,
-    largeArcFlag,
-    deltaX,
-    deltaY
-  );
-}
-
-/**
- * @param {number} x The start x position.
- * @param {number} y The start y position.
- * @param {number} r The x/y radius of the arc.
- * @param {number} l The large arc flag.
- * @param {number} dx The x delta for the end position.
- * @param {number} dy The y delta for the end position.
- * @return {string} The commands for the desired arc as a string.
- */
-function getArcPathCommands(x, y, r, l, dx, dy) {
-  return (
-    `M ${x.toFixed(2)} ${y.toFixed(2)} ` +
-    `a ${r} ${r} 0 ${l} 0 ${dx.toFixed(2)} ${dy.toFixed(2)}`
-  );
-}
-
-/**
- * @return {string}
- */
-function getSpinnerPath() {
-  const center = svgSize / 2;
-
-  // The `d` command for the path we are building up.
-  let pathD = '';
-
-  // The offset for each frame of the animation.
-  let xOffset = 0;
-
-  // The current start angle for the arc.
-  let startAngle = -45;
-
-  // The current end angle for the arc.
-  let endAngle = -45;
-
-  /**
-   * Creates one phase of the animation, changing the start/end angles by the
-   * desired delta values.
-   * @param {number} startAngleDelta
-   * @param {number} endAngleDelta
-   * @param {number} startStep
-   */
-  const createPhase = (startAngleDelta, endAngleDelta, startStep = 0) => {
-    for (let i = 0; i < steps; i++) {
-      if (i >= startStep) {
-        pathD +=
-          getCircleArcPath(
-            center + xOffset,
-            center,
-            radius,
-            startAngle,
-            endAngle
-          ) + '\n';
-      }
-
-      startAngle += startAngleDelta / steps;
-      endAngle += endAngleDelta / steps;
-      xOffset += svgSize;
-    }
-  };
-
-  // The initial arc needs to be described seprately, since it is a circle and
-  // the normal code path does not generate this correctly.
-  pathD += getArcPathCommands(center, center - radius, radius, 1, 0.01, 0);
-  createPhase(360, 90, 1);
-  createPhase(90, 270);
-  createPhase(270, 90);
-
-  return pathD;
-}
-
-/**
- * @param {function(!Array<string>):!Element} html
- * @return {!Element}
- */
-export function createSpinnerDom(html) {
-  // Extra wrapping div here is to workaround:
-  // https://bugs.chromium.org/p/chromium/issues/detail?id=1002748
-  const content = html`
-    <div class="i-amphtml-new-loader-spinner-wrapper">
-      <svg class="i-amphtml-new-loader-spinner" viewbox="0 0 48 48">
-        <path class="i-amphtml-new-loader-spinner-path" fill="none"></path>
-      </svg>
-    </div>
-  `;
-
-  // We create the path with code, rather than inline it above, as it is
-  // significantly smaller as code.
-  content.querySelector('path').setAttribute('d', getSpinnerPath());
-
-  return content;
-}
diff --git a/extensions/amp-mathml/0.1/amp-mathml.js b/extensions/amp-mathml/0.1/amp-mathml.js
index 2e37e8b9a735c..7a295e076f282 100644
--- a/extensions/amp-mathml/0.1/amp-mathml.js
+++ b/extensions/amp-mathml/0.1/amp-mathml.js
@@ -13,8 +13,10 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
 import {CSS} from '../../../build/amp-mathml-0.1.css';
 import {Layout} from '../../../src/layout';
+import {Services} from '../../../src/services';
 import {getIframe} from '../../../src/3p-frame';
 import {listenFor} from '../../../src/iframe-helper';
 import {removeElement} from '../../../src/dom';
@@ -34,7 +36,10 @@ export class AmpMathml extends AMP.BaseElement {
    *
    */
   preconnectCallback() {
-    this.preconnect.url('https://cdnjs.cloudflare.com');
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://cdnjs.cloudflare.com'
+    );
   }
 
   /**
@@ -72,9 +77,11 @@ export class AmpMathml extends AMP.BaseElement {
           // Don't change the width if not inlined.
           data['width'] = undefined;
         }
-        this.element
-          .getResources()
-          ./*OK*/ changeSize(this.element, data['height'], data['width']);
+        Services.mutatorForDoc(this.getAmpDoc())./*OK*/ changeSize(
+          this.element,
+          data['height'],
+          data['width']
+        );
       },
       /* opt_is3P */ true
     );
diff --git a/extensions/amp-mega-menu/0.1/amp-mega-menu.js b/extensions/amp-mega-menu/0.1/amp-mega-menu.js
index c6c53baa49ac2..2024631c2f579 100644
--- a/extensions/amp-mega-menu/0.1/amp-mega-menu.js
+++ b/extensions/amp-mega-menu/0.1/amp-mega-menu.js
@@ -29,7 +29,6 @@ import {
   tryFocus,
 } from '../../../src/dom';
 import {dev, userAssert} from '../../../src/log';
-import {isExperimentOn} from '../../../src/experiments';
 import {mod} from '../../../src/utils/math';
 import {setModalAsClosed, setModalAsOpen} from '../../../src/modal';
 import {toArray} from '../../../src/types';
@@ -91,12 +90,6 @@ export class AmpMegaMenu extends AMP.BaseElement {
 
   /** @override */
   buildCallback() {
-    // TODO(#24898): remove this assert when cleaning up experiment post launch.
-    userAssert(
-      isExperimentOn(this.win, 'amp-mega-menu'),
-      'Turning on the amp-mega-menu experiment is necessary to use the amp-mega-menu component.'
-    );
-
     this.action_ = Services.actionServiceForDoc(this.element);
   }
 
diff --git a/extensions/amp-mega-menu/0.1/test/test-amp-mega-menu.js b/extensions/amp-mega-menu/0.1/test/test-amp-mega-menu.js
index ed2e3659e7ada..b5ba2a79d4365 100644
--- a/extensions/amp-mega-menu/0.1/test/test-amp-mega-menu.js
+++ b/extensions/amp-mega-menu/0.1/test/test-amp-mega-menu.js
@@ -17,7 +17,6 @@
 import '../amp-mega-menu';
 import {Keys} from '../../../../src/utils/key-codes';
 import {htmlFor} from '../../../../src/static-template';
-import {toggleExperiment} from '../../../../src/experiments';
 import {tryFocus} from '../../../../src/dom';
 
 describes.realWin(
@@ -36,9 +35,6 @@ describes.realWin(
 
       element = getAmpMegaMenu();
       doc.body.appendChild(element);
-
-      // TODO(#24898): remove this toggle when cleaning up experiment post launch.
-      toggleExperiment(win, 'amp-mega-menu', true);
     });
 
     function getAmpMegaMenu() {
diff --git a/extensions/amp-megaphone/0.1/amp-megaphone.js b/extensions/amp-megaphone/0.1/amp-megaphone.js
index e17f833e51a6b..0d3431a3e242e 100644
--- a/extensions/amp-megaphone/0.1/amp-megaphone.js
+++ b/extensions/amp-megaphone/0.1/amp-megaphone.js
@@ -27,6 +27,7 @@
  * </amp-megaphone>
  */
 
+import {Services} from '../../../src/services';
 import {addParamsToUrl} from '../../../src/url';
 import {dict} from '../../../src/utils/object';
 import {getData, listen} from '../../../src/event-helper';
@@ -60,12 +61,14 @@ class AmpMegaphone extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
+    const preconnect = Services.preconnectFor(this.win);
+    const ampdoc = this.getAmpDoc();
     // Pre-connects to the iframe source itself
-    this.preconnect.url(this.baseUrl_, opt_onLayout);
+    preconnect.url(ampdoc, this.baseUrl_, opt_onLayout);
     // Pre-connects to the megaphone static documents server (serves CSS and JS)
-    this.preconnect.url('https://assets.megaphone.fm', opt_onLayout);
+    preconnect.url(ampdoc, 'https://assets.megaphone.fm', opt_onLayout);
     // Pre-connects to the image assets server (for UI elements and playlist cover art)
-    this.preconnect.url('https://megaphone.imgix.net', opt_onLayout);
+    preconnect.url(ampdoc, 'https://megaphone.imgix.net', opt_onLayout);
   }
 
   /** @override */
diff --git a/extensions/amp-minute-media-player/0.1/amp-minute-media-player.js b/extensions/amp-minute-media-player/0.1/amp-minute-media-player.js
index 2e0217d3ff2f4..00e5bb3d87ffd 100644
--- a/extensions/amp-minute-media-player/0.1/amp-minute-media-player.js
+++ b/extensions/amp-minute-media-player/0.1/amp-minute-media-player.js
@@ -93,9 +93,16 @@ class AmpMinuteMediaPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(onLayout) {
-    this.preconnect.url(this.iframeSource_());
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      this.iframeSource_()
+    );
     // Host that serves player configuration and content redirects
-    this.preconnect.url('https://www.oo-syringe.com', onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://www.oo-syringe.com',
+      onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-mowplayer/0.1/amp-mowplayer.js b/extensions/amp-mowplayer/0.1/amp-mowplayer.js
index fb92bb133a930..573258036511a 100644
--- a/extensions/amp-mowplayer/0.1/amp-mowplayer.js
+++ b/extensions/amp-mowplayer/0.1/amp-mowplayer.js
@@ -83,10 +83,10 @@ class AmpMowplayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    const {preconnect} = this;
-    preconnect.url(this.getVideoIframeSrc_());
+    const preconnect = Services.preconnectFor(this.win);
+    preconnect.url(this.getAmpDoc(), this.getVideoIframeSrc_());
     // Host that mowplayer uses to serve JS needed by player.
-    preconnect.url('https://mowplayer.com', opt_onLayout);
+    preconnect.url(this.getAmpDoc(), 'https://mowplayer.com', opt_onLayout);
   }
 
   /** @override */
diff --git a/extensions/amp-mustache/0.1/amp-mustache.js b/extensions/amp-mustache/0.1/amp-mustache.js
index eacdf75091117..77e5a328c0ce4 100644
--- a/extensions/amp-mustache/0.1/amp-mustache.js
+++ b/extensions/amp-mustache/0.1/amp-mustache.js
@@ -26,7 +26,7 @@ import mustache from '../../../third_party/mustache/mustache';
 const TAG = 'amp-mustache';
 
 const BaseTemplate =
-  /** @type {function(new:../../../src/service/template-impl.BaseTemplate)} */ (AMP.BaseTemplate);
+  /** @type {typeof ../../../src/service/template-impl.BaseTemplate} */ (AMP.BaseTemplate);
 
 /**
  * Implements an AMP template for Mustache.js.
@@ -121,7 +121,7 @@ export class AmpMustache extends BaseTemplate {
   render(data) {
     let mustacheData = data;
     if (typeof data === 'object') {
-      mustacheData = Object.assign({}, data, this.nestedTemplates_);
+      mustacheData = {...data, ...this.nestedTemplates_};
     }
     const html = mustache.render(
       this.template_,
diff --git a/extensions/amp-mustache/0.1/test/test-amp-mustache.js b/extensions/amp-mustache/0.1/test/test-amp-mustache.js
index 7848c60f25304..bd28b85368988 100644
--- a/extensions/amp-mustache/0.1/test/test-amp-mustache.js
+++ b/extensions/amp-mustache/0.1/test/test-amp-mustache.js
@@ -459,6 +459,7 @@ describes.repeated(
         const result = template.render({
           value:
             '<table class="valid-class">' +
+            '<colgroup><col><col></colgroup>' +
             '<caption>caption</caption>' +
             '<thead><tr><th colspan="2">header</th></tr></thead>' +
             '<tbody><tr><td>' +
@@ -471,6 +472,7 @@ describes.repeated(
         });
         expect(result./*OK*/ innerHTML).to.equal(
           'value = <table class="valid-class">' +
+            '<colgroup><col><col></colgroup>' +
             '<caption>caption</caption>' +
             '<thead><tr><th colspan="2">header</th></tr></thead>' +
             '<tbody><tr><td>' +
diff --git a/extensions/amp-mustache/0.2/amp-mustache.js b/extensions/amp-mustache/0.2/amp-mustache.js
index a7f32c406e550..44ebadbf394b6 100644
--- a/extensions/amp-mustache/0.2/amp-mustache.js
+++ b/extensions/amp-mustache/0.2/amp-mustache.js
@@ -14,15 +14,16 @@
  * limitations under the License.
  */
 
+import {Purifier} from '../../../src/purifier/purifier';
 import {dict} from '../../../src/utils/object';
 import {iterateCursor, templateContentClone} from '../../../src/dom';
-import {purifyHtml, purifyTagsForTripleMustache} from '../../../src/purifier';
+import {rewriteAttributeValue} from '../../../src/url-rewrite';
 import mustache from '../../../third_party/mustache/mustache';
 
 const TAG = 'amp-mustache';
 
 const BaseTemplate =
-  /** @type {function(new:../../../src/service/template-impl.BaseTemplate)} */ (AMP.BaseTemplate);
+  /** @type {typeof ../../../src/service/template-impl.BaseTemplate} */ (AMP.BaseTemplate);
 
 /**
  * Implements an AMP template for Mustache.js.
@@ -38,9 +39,16 @@ export class AmpMustache extends BaseTemplate {
   constructor(element, win) {
     super(element, win);
 
+    /** @private @const {!Purifier} */
+    this.purifier_ = new Purifier(
+      this.win.document,
+      dict(),
+      rewriteAttributeValue
+    );
+
     // Unescaped templating (triple mustache) has a special, strict sanitizer.
     mustache.setUnescapedSanitizer(value =>
-      purifyTagsForTripleMustache(value, this.win.document)
+      this.purifier_.purifyTagsForTripleMustache(value)
     );
   }
 
@@ -112,7 +120,7 @@ export class AmpMustache extends BaseTemplate {
     let mustacheData = data;
     // Also render any nested templates.
     if (typeof data === 'object') {
-      mustacheData = Object.assign({}, data, this.nestedTemplates_);
+      mustacheData = {...data, ...this.nestedTemplates_};
     }
     const html = mustache.render(
       this.template_,
@@ -129,12 +137,9 @@ export class AmpMustache extends BaseTemplate {
    * @private
    */
   purifyAndSetHtml_(html) {
-    const body = purifyHtml(html, this.win.document);
-    // TODO(choumx): Remove innerHTML usage once DOMPurify bug is fixed.
-    // https://github.com/cure53/DOMPurify/pull/295
-    const root = this.win.document.createElement('div');
-    root./*OK*/ innerHTML = body./*OK*/ innerHTML;
-    return this.unwrap(root);
+    const body = this.purifier_.purifyHtml(`<div>${html}</div>`);
+    const div = body.firstElementChild;
+    return this.unwrap(div);
   }
 }
 
diff --git a/extensions/amp-mustache/0.2/test/test-amp-mustache.js b/extensions/amp-mustache/0.2/test/test-amp-mustache.js
index 0607e075ede71..084235964e03b 100644
--- a/extensions/amp-mustache/0.2/test/test-amp-mustache.js
+++ b/extensions/amp-mustache/0.2/test/test-amp-mustache.js
@@ -14,9 +14,9 @@
  * limitations under the License.
  */
 
-import * as purifier from '../../../../src/purifier';
 import * as service from '../../../../src/service';
 import {AmpMustache} from '../amp-mustache';
+import {Purifier} from '../../../../src/purifier/purifier';
 import mustache from '../../../../third_party/mustache/mustache';
 
 describes.repeated(
@@ -83,6 +83,23 @@ describes.repeated(
       expect(result./*OK*/ innerHTML).to.equal('value = abc');
     });
 
+    // https://github.com/ampproject/amphtml/pull/17401
+    it('should render attrs with non-HTML namespaces', () => {
+      innerHtmlSetup(
+        '<svg width=50 height=50><g><image xlink:href="foo.svg" width=50 height=50></image></g></svg>'
+      );
+      template.compileCallback();
+      const result = template.render({});
+      expect(result./*OK*/ outerHTML).to.equal(
+        '<svg height="50" width="50"><g><image height="50" width="50" xlink:href="foo.svg"></image></g></svg>'
+      );
+      // Make sure [xlink:href] has the right namespace.
+      const image = result.querySelector('image');
+      const href = image.getAttributeNode('xlink:href');
+      expect(href.namespaceURI).to.equal('http://www.w3.org/1999/xlink');
+      expect(href.value).to.equal('foo.svg');
+    });
+
     it('should render {{.}} from string', () => {
       textContentSetup('value = {{.}}');
       template.compileCallback();
@@ -457,6 +474,7 @@ describes.repeated(
         const result = template.render({
           value:
             '<table class="valid-class">' +
+            '<colgroup><col><col></colgroup>' +
             '<caption>caption</caption>' +
             '<thead><tr><th colspan="2">header</th></tr></thead>' +
             '<tbody><tr><td>' +
@@ -469,6 +487,7 @@ describes.repeated(
         });
         expect(result./*OK*/ innerHTML).to.equal(
           'value = <table class="valid-class">' +
+            '<colgroup><col><col></colgroup>' +
             '<caption>caption</caption>' +
             '<thead><tr><th colspan="2">header</th></tr></thead>' +
             '<tbody><tr><td>' +
@@ -571,11 +590,11 @@ describes.repeated(
       });
 
       it('should not mustache render but still purify html', () => {
-        window.sandbox.spy(purifier, 'purifyHtml');
+        window.sandbox.spy(Purifier.prototype, 'purifyHtml');
         window.sandbox.spy(mustache, 'render');
         template.setHtml('<div>test</div>');
         expect(mustache.render).to.have.not.been.called;
-        expect(purifier.purifyHtml).to.have.been.called;
+        expect(Purifier.prototype.purifyHtml).to.have.been.called;
       });
     });
 
diff --git a/extensions/amp-mustache/0.2/test/validator-amp-mustache-json.html b/extensions/amp-mustache/0.2/test/validator-amp-mustache-json.html
new file mode 100644
index 0000000000000..a26bf2097b978
--- /dev/null
+++ b/extensions/amp-mustache/0.2/test/validator-amp-mustache-json.html
@@ -0,0 +1,44 @@
+<!--
+  Copyright 2018 The AMP HTML Authors. All Rights Reserved.
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+      http://www.apache.org/licenses/LICENSE-2.0
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+  Tests json content inside mustache templates is not parsed by validator.
+-->
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <link rel="canonical" href="self.html" />
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  <script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
+<script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+</head>
+<body>
+<amp-list
+  width="auto"
+  height="100"
+  layout="fixed-height"
+  src="/example.json">
+  <template type="amp-mustache">
+    <amp-analytics>
+    <script type="application/json">
+     {{{ json_data }}}
+    </script>
+    <amp-analytics/>
+  </template>
+</amp-list>
+</body>
+</html>
diff --git a/extensions/amp-mustache/0.2/test/validator-amp-mustache-json.out b/extensions/amp-mustache/0.2/test/validator-amp-mustache-json.out
new file mode 100644
index 0000000000000..6a79c255415fe
--- /dev/null
+++ b/extensions/amp-mustache/0.2/test/validator-amp-mustache-json.out
@@ -0,0 +1,45 @@
+PASS
+|  <!--
+|    Copyright 2018 The AMP HTML Authors. All Rights Reserved.
+|    Licensed under the Apache License, Version 2.0 (the "License");
+|    you may not use this file except in compliance with the License.
+|    You may obtain a copy of the License at
+|        http://www.apache.org/licenses/LICENSE-2.0
+|    Unless required by applicable law or agreed to in writing, software
+|    distributed under the License is distributed on an "AS-IS" BASIS,
+|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+|    See the License for the specific language governing permissions and
+|    limitations under the license.
+|  -->
+|  <!--
+|    Test Description:
+|    Tests json content inside mustache templates is not parsed by validator.
+|  -->
+|  <!doctype html>
+|  <html ⚡>
+|  <head>
+|    <meta charset="utf-8">
+|    <link rel="canonical" href="self.html" />
+|    <meta name="viewport" content="width=device-width,minimum-scale=1">
+|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+|    <script async src="https://cdn.ampproject.org/v0.js"></script>
+|    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+|    <script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
+|  <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+|  </head>
+|  <body>
+|  <amp-list
+|    width="auto"
+|    height="100"
+|    layout="fixed-height"
+|    src="/example.json">
+|    <template type="amp-mustache">
+|      <amp-analytics>
+|      <script type="application/json">
+|       {{{ json_data }}}
+|      </script>
+|      <amp-analytics/>
+|    </template>
+|  </amp-list>
+|  </body>
+|  </html>
diff --git a/extensions/amp-mustache/0.2/test/validator-json-not-in-template.html b/extensions/amp-mustache/0.2/test/validator-json-not-in-template.html
new file mode 100644
index 0000000000000..e76d7a68e01f0
--- /dev/null
+++ b/extensions/amp-mustache/0.2/test/validator-json-not-in-template.html
@@ -0,0 +1,41 @@
+<!--
+  Copyright 2018 The AMP HTML Authors. All Rights Reserved.
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+      http://www.apache.org/licenses/LICENSE-2.0
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+  Tests json content is parsed by validator and warnings issued if invalid json.
+-->
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <link rel="canonical" href="self.html" />
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  <script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
+</head>
+<body>
+<amp-list
+  width="auto"
+  height="100"
+  layout="fixed-height"
+  src="/example.json">
+  <amp-analytics>
+    <script type="application/json">
+     {{{ json_data }}}
+    </script>
+  <amp-analytics/>
+</amp-list>
+</body>
+</html>
diff --git a/extensions/amp-mustache/0.2/test/validator-json-not-in-template.out b/extensions/amp-mustache/0.2/test/validator-json-not-in-template.out
new file mode 100644
index 0000000000000..ea5922010b6b5
--- /dev/null
+++ b/extensions/amp-mustache/0.2/test/validator-json-not-in-template.out
@@ -0,0 +1,44 @@
+PASS
+|  <!--
+|    Copyright 2018 The AMP HTML Authors. All Rights Reserved.
+|    Licensed under the Apache License, Version 2.0 (the "License");
+|    you may not use this file except in compliance with the License.
+|    You may obtain a copy of the License at
+|        http://www.apache.org/licenses/LICENSE-2.0
+|    Unless required by applicable law or agreed to in writing, software
+|    distributed under the License is distributed on an "AS-IS" BASIS,
+|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+|    See the License for the specific language governing permissions and
+|    limitations under the license.
+|  -->
+|  <!--
+|    Test Description:
+|    Tests json content is parsed by validator and warnings issued if invalid json.
+|  -->
+|  <!doctype html>
+|  <html ⚡>
+|  <head>
+|    <meta charset="utf-8">
+|    <link rel="canonical" href="self.html" />
+|    <meta name="viewport" content="width=device-width,minimum-scale=1">
+|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+|    <script async src="https://cdn.ampproject.org/v0.js"></script>
+|    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+|    <script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
+|  </head>
+|  <body>
+|  <amp-list
+|    width="auto"
+|    height="100"
+|    layout="fixed-height"
+|    src="/example.json">
+|    <amp-analytics>
+|      <script type="application/json">
+>>     ^~~~~~~~~
+amp-mustache/0.2/test/validator-json-not-in-template.html:35:4 The script tag contains invalid JSON that cannot be parsed.
+|       {{{ json_data }}}
+|      </script>
+|    <amp-analytics/>
+|  </amp-list>
+|  </body>
+|  </html>
diff --git a/extensions/amp-mustache/amp-mustache.md b/extensions/amp-mustache/amp-mustache.md
index 78cee8d44c2ee..bd7dd0eee5cce 100644
--- a/extensions/amp-mustache/amp-mustache.md
+++ b/extensions/amp-mustache/amp-mustache.md
@@ -109,7 +109,7 @@ that among other things, you can't use `amp-mustache` to:
 - Calculate tag name. E.g. `<{{tagName}}>` is not allowed.
 - Calculate attribute name. E.g. `<div {{attrName}}=something>` is not allowed.
 
-The output of "triple-mustache" is sanitized to only allow the following tags: `a`, `b`, `br`, `caption`, `colgroup`, `code`, `del`, `div`, `em`, `i`, `ins`, `li`, `mark`, `ol`, `p`, `q`, `s`, `small`, `span`, `strong`, `sub`, `sup`, `table`, `tbody`, `time`, `td`, `th`, `thead`, `tfoot`, `tr`, `u`, `ul`.
+The output of "triple-mustache" is sanitized to only allow the following tags: `a`, `b`, `br`, `caption`, `col`, `colgroup`, `code`, `del`, `div`, `em`, `hr`, `i`, `ins`, `li`, `mark`, `ol`, `p`, `q`, `s`, `small`, `span`, `strong`, `sub`, `sup`, `table`, `tbody`, `time`, `td`, `th`, `thead`, `tfoot`, `tr`, `u`, `ul`.
 
 ### Sanitization
 
diff --git a/extensions/amp-nested-menu/0.1/amp-nested-menu.js b/extensions/amp-nested-menu/0.1/amp-nested-menu.js
index 00953a0484c5b..2fc170da9064c 100644
--- a/extensions/amp-nested-menu/0.1/amp-nested-menu.js
+++ b/extensions/amp-nested-menu/0.1/amp-nested-menu.js
@@ -26,7 +26,6 @@ import {
   tryFocus,
 } from '../../../src/dom';
 import {dev, userAssert} from '../../../src/log';
-import {isExperimentOn} from '../../../src/experiments';
 import {toArray} from '../../../src/types';
 
 const TAG = 'amp-nested-menu';
@@ -66,11 +65,6 @@ export class AmpNestedMenu extends AMP.BaseElement {
 
   /** @override */
   buildCallback() {
-    // TODO(#25343): remove this assert when cleaning up experiment post launch.
-    userAssert(
-      isExperimentOn(this.win, 'amp-nested-menu'),
-      `Turning on the amp-nested-menu experiment is necessary to use the ${TAG} component.`
-    );
     const {element} = this;
 
     this.action_ = Services.actionServiceForDoc(this.element);
@@ -106,6 +100,10 @@ export class AmpNestedMenu extends AMP.BaseElement {
         submenuBtn.setAttribute('tabindex', 0);
       }
       submenuBtn.setAttribute('role', 'button');
+      // Adds aria-expanded to the submenu open button if present
+      if (submenuBtn.hasAttribute('amp-nested-submenu-open')) {
+        submenuBtn.setAttribute('aria-expanded', 'false');
+      }
       userAssert(
         this.action_.hasAction(submenuBtn, 'tap') == false,
         'submenu open/close buttons should not have tap actions registered.'
@@ -186,7 +184,13 @@ export class AmpNestedMenu extends AMP.BaseElement {
       submenu.setAttribute('open', '');
       this.currentSubmenu_ = submenu;
       // move focus to close element after submenu fully opens.
+      // TODO(wassgha): Use Animation.animate instead to get a promise back
       Services.timerFor(this.win).delay(() => {
+        const submenuParent = dev().assertElement(submenu.parentElement);
+        const submenuOpen = dev().assertElement(
+          scopedQuerySelector(submenuParent, '>[amp-nested-submenu-open]')
+        );
+        submenuOpen.setAttribute('aria-expanded', 'true');
         // Find the first close button that is not in one of the child menus.
         const submenuCloseCandidates = toArray(
           submenu.querySelectorAll('[amp-nested-submenu-close]')
@@ -235,11 +239,13 @@ export class AmpNestedMenu extends AMP.BaseElement {
       submenu.removeAttribute('open');
       this.currentSubmenu_ = parentMenu;
       // move focus back to open element after submenu fully closes.
+      // TODO(wassgha): Use Animation.animate instead to get a promise back
       Services.timerFor(this.win).delay(() => {
         const submenuParent = dev().assertElement(submenu.parentElement);
         const submenuOpen = dev().assertElement(
           scopedQuerySelector(submenuParent, '>[amp-nested-submenu-open]')
         );
+        submenuOpen.setAttribute('aria-expanded', 'false');
         tryFocus(submenuOpen);
       }, ANIMATION_TIMEOUT);
     }
@@ -270,11 +276,13 @@ export class AmpNestedMenu extends AMP.BaseElement {
         return;
       case Keys.LEFT_ARROW: /* fallthrough */
       case Keys.RIGHT_ARROW:
-        this.handleHorizontalArrowKeyDown_(e);
+        this.handleMenuNavigation_(e);
         break;
       case Keys.UP_ARROW: /* fallthrough */
       case Keys.DOWN_ARROW:
-        this.handleVerticalArrowKeyDown_(e);
+      case Keys.HOME:
+      case Keys.END:
+        this.handleMenuItemNavigation_(e);
         break;
     }
   }
@@ -284,7 +292,7 @@ export class AmpNestedMenu extends AMP.BaseElement {
    * @param {!Event} e
    * @private
    */
-  handleHorizontalArrowKeyDown_(e) {
+  handleMenuNavigation_(e) {
     let back = e.key == Keys.LEFT_ARROW;
     // Press right arrow key to go back if submenu opened from left.
     if (this.side_ == Side.LEFT) {
@@ -301,12 +309,12 @@ export class AmpNestedMenu extends AMP.BaseElement {
   }
 
   /**
-   * Handle up/down arrow key down event to navigate between items;
+   * Handle up/down/home/end key down event to navigate between items;
    * this requires each menu item to be under a li element and focusable.
    * @param {!Event} e
    * @private
    */
-  handleVerticalArrowKeyDown_(e) {
+  handleMenuItemNavigation_(e) {
     const target = dev().assertElement(e.target);
     const parentMenu = this.getParentMenu_(target);
     const item = closest(target, e => e.tagName == 'LI', parentMenu);
@@ -314,14 +322,26 @@ export class AmpNestedMenu extends AMP.BaseElement {
     if (!item) {
       return;
     }
-    const nextItem =
-      e.key == Keys.UP_ARROW
-        ? item.previousElementSibling
-        : item.nextElementSibling;
+
+    let nextItem;
+    if (e.key === Keys.UP_ARROW) {
+      nextItem = item.previousElementSibling;
+    } else if (e.key === Keys.DOWN_ARROW) {
+      nextItem = item.nextElementSibling;
+    } else if (e.key === Keys.HOME) {
+      nextItem = item.parentElement.firstElementChild;
+    } else if (e.key === Keys.END) {
+      nextItem = item.parentElement.lastElementChild;
+    } else {
+      // not a recognized key
+      return;
+    }
+
     // have reached the beginning or end of the list.
     if (!nextItem) {
       return;
     }
+
     const focusElement = nextItem.querySelector('button,a[href],[tabindex]');
     if (focusElement) {
       e.preventDefault();
diff --git a/extensions/amp-nested-menu/0.1/test/test-amp-nested-menu.js b/extensions/amp-nested-menu/0.1/test/test-amp-nested-menu.js
index a02f739efe7e9..2269c1713ff79 100644
--- a/extensions/amp-nested-menu/0.1/test/test-amp-nested-menu.js
+++ b/extensions/amp-nested-menu/0.1/test/test-amp-nested-menu.js
@@ -18,9 +18,10 @@ import '../amp-nested-menu';
 import * as lolex from 'lolex';
 import {Keys} from '../../../../src/utils/key-codes';
 import {htmlFor} from '../../../../src/static-template';
-import {toggleExperiment} from '../../../../src/experiments';
 import {tryFocus} from '../../../../src/dom';
 
+const ANIMATION_TIMEOUT = 600;
+
 describes.realWin(
   'amp-nested-menu component',
   {
@@ -36,9 +37,6 @@ describes.realWin(
       win = env.win;
       doc = win.document;
       clock = lolex.install({target: win});
-
-      // TODO(#25343): remove this toggle when cleaning up experiment post launch.
-      toggleExperiment(win, 'amp-nested-menu', true);
     });
 
     async function getNestedMenu(options) {
@@ -52,7 +50,7 @@ describes.realWin(
       element.appendChild(ul);
       doc.body.appendChild(element);
 
-      [1, 2, 3].forEach(i => {
+      [1, 2, 3, 4].forEach(i => {
         const item = htmlFor(doc)`
           <li>
             <button amp-nested-submenu-open></button>
@@ -102,13 +100,19 @@ describes.realWin(
       const submenuEl3 = doc.getElementById('submenu-3');
       expect(menuEl.hasAttribute('child-open')).to.be.false;
       expect(submenuEl1.hasAttribute('open')).to.be.false;
+      expect(openEl1.getAttribute('aria-expanded')).to.be.equal('false');
       const clickEvent = new Event('click', {bubbles: true});
       openEl1.dispatchEvent(clickEvent);
+      clock.tick(ANIMATION_TIMEOUT);
       expect(menuEl.hasAttribute('child-open')).to.be.true;
       expect(submenuEl1.hasAttribute('open')).to.be.true;
       expect(submenuEl1.hasAttribute('child-open')).to.be.false;
       expect(submenuEl3.hasAttribute('open')).to.be.false;
+      expect(openEl1.getAttribute('aria-expanded')).to.be.equal('true');
+      expect(openEl3.getAttribute('aria-expanded')).to.be.equal('false');
       openEl3.dispatchEvent(clickEvent);
+      clock.tick(ANIMATION_TIMEOUT);
+      expect(openEl3.getAttribute('aria-expanded')).to.be.equal('true');
       expect(submenuEl1.hasAttribute('child-open')).to.be.true;
       expect(submenuEl3.hasAttribute('open')).to.be.true;
     });
@@ -119,15 +123,25 @@ describes.realWin(
       const submenuEl1 = doc.getElementById('submenu-1');
       const closeEl3 = doc.getElementById('close-3');
       const submenuEl3 = doc.getElementById('submenu-3');
+      const openEl3 = doc.getElementById('open-3');
+      const openEl1 = doc.getElementById('open-1');
       menuEl.implementation_.open_(submenuEl1);
+      clock.tick(ANIMATION_TIMEOUT);
       menuEl.implementation_.open_(submenuEl3);
+      clock.tick(ANIMATION_TIMEOUT);
+      expect(openEl1.getAttribute('aria-expanded')).to.be.equal('true');
+      expect(openEl3.getAttribute('aria-expanded')).to.be.equal('true');
       expect(menuEl.hasAttribute('child-open')).to.be.true;
       expect(submenuEl1.hasAttribute('open')).to.be.true;
       const clickEvent = new Event('click', {bubbles: true});
       closeEl3.dispatchEvent(clickEvent);
+      clock.tick(ANIMATION_TIMEOUT);
+      expect(openEl3.getAttribute('aria-expanded')).to.be.equal('false');
       expect(submenuEl1.hasAttribute('child-open')).to.be.false;
       expect(submenuEl3.hasAttribute('open')).to.be.false;
       closeEl1.dispatchEvent(clickEvent);
+      clock.tick(ANIMATION_TIMEOUT);
+      expect(openEl1.getAttribute('aria-expanded')).to.be.equal('false');
       expect(menuEl.hasAttribute('child-open')).to.be.false;
       expect(submenuEl1.hasAttribute('open')).to.be.false;
     });
@@ -227,16 +241,36 @@ describes.realWin(
       expect(doc.activeElement).to.equal(openEl1);
     });
 
+    it('should focus on first/last items when home/end key is pressed', async () => {
+      await getNestedMenu();
+      const openEl1 = doc.getElementById('open-1');
+      const openEl4 = doc.getElementById('open-4');
+      tryFocus(openEl1);
+      expect(doc.activeElement).to.equal(openEl1);
+      const endKeyEvent = new KeyboardEvent('keydown', {
+        key: Keys.END,
+        bubbles: true,
+      });
+      openEl1.dispatchEvent(endKeyEvent);
+      expect(doc.activeElement).to.equal(openEl4);
+      const homeKeyEvent = new KeyboardEvent('keydown', {
+        key: Keys.HOME,
+        bubbles: true,
+      });
+      openEl4.dispatchEvent(homeKeyEvent);
+      expect(doc.activeElement).to.equal(openEl1);
+    });
+
     it('should shift focus to close/open button when submenu is opened/closed, respectively', async () => {
       const menuEl = await getNestedMenu();
       const openEl = doc.getElementById('open-1');
       const closeEl = doc.getElementById('close-1');
       const submenuEl = doc.getElementById('submenu-1');
       menuEl.implementation_.open_(submenuEl);
-      clock.tick(600);
+      clock.tick(ANIMATION_TIMEOUT);
       expect(doc.activeElement).to.equal(closeEl);
       menuEl.implementation_.close_(submenuEl);
-      clock.tick(600);
+      clock.tick(ANIMATION_TIMEOUT);
       expect(doc.activeElement).to.equal(openEl);
     });
   }
diff --git a/extensions/amp-nested-menu/amp-nested-menu.md b/extensions/amp-nested-menu/amp-nested-menu.md
index c68699c754607..28b74a0de175b 100644
--- a/extensions/amp-nested-menu/amp-nested-menu.md
+++ b/extensions/amp-nested-menu/amp-nested-menu.md
@@ -4,7 +4,6 @@ formats:
   - websites
 teaser:
   text: Displays a drilldown menu with arbitrary levels of nested submenus.
-experimental: true
 ---
 
 <!--
@@ -71,10 +70,6 @@ Only `<div>` tags may receive the `amp-nested-submenu` attribute. The submenu op
 
 The following example demonstrates an `<amp-nested-menu>` with two levels of nested submenus.
 
-[tip type="note"]
-We recommend wrapping every menu item in a `li` element to improve accessibility and keyboard support.
-[/tip]
-
 [example playground="true" preview="top-frame" imports="amp-sidebar"]
 
 ```html
@@ -204,11 +199,16 @@ The `<amp-nested-menu>` component can be styled with standard CSS.
 
 `<amp-nested-menu>` assigns `role=button` and `tabindex=0` on each submenu open/close element. When a submenu opens, focus shifts to the submenu close element inside it. When the submenu closes, focus shifts back to the submenu open element that opened it.
 
+[tip type="note"]
+Wrap every menu item in a `li` element to improve accessibility and keyboard support.
+[/tip]
+
 The component supports arrow key navigation as follows:
 
 - `LEFT`: if a submenu is open, close it and return to the parent menu.
 - `RIGHT`: if a submenu open element has focus, open the corresponding submenu.
 - `UP/DOWN`: shift focus between items within a menu (this works only if all menu items are wrapped inside `li` elements under the same list).
+- `END/HOME`: shift focus to the first/last item within a menu (similar to `UP/DOWN`)
 
 If `side=left`, then the functionalities of `LEFT` and `RIGHT` arrow keys are reversed.
 
diff --git a/extensions/amp-nested-menu/validator-amp-nested-menu.protoascii b/extensions/amp-nested-menu/validator-amp-nested-menu.protoascii
index 4d99758b8b6d0..d944fec2aad82 100644
--- a/extensions/amp-nested-menu/validator-amp-nested-menu.protoascii
+++ b/extensions/amp-nested-menu/validator-amp-nested-menu.protoascii
@@ -154,12 +154,14 @@ descendant_tag_list {
   tag: "OL"
   tag: "OPTION"
   tag: "P"
+  tag: "PATH"
   tag: "SECTION"
   tag: "SPAN"
   tag: "STRIKE"
   tag: "STRONG"
   tag: "SUB"
   tag: "SUP"
+  tag: "SVG"
   tag: "TABLE"
   tag: "TBODY"
   tag: "TD"
diff --git a/extensions/amp-next-page/0.1/next-page-service.js b/extensions/amp-next-page/0.1/next-page-service.js
index 5bf78a52248e4..0f2be79d175af 100644
--- a/extensions/amp-next-page/0.1/next-page-service.js
+++ b/extensions/amp-next-page/0.1/next-page-service.js
@@ -15,7 +15,7 @@
  */
 
 import {CSS} from '../../../build/amp-next-page-0.1.css';
-import {MultidocManager} from '../../../src/runtime';
+import {MultidocManager} from '../../../src/multidoc-manager';
 import {PositionObserverFidelity} from '../../../src/service/position-observer/position-observer-worker';
 import {Services} from '../../../src/services';
 import {VisibilityState} from '../../../src/visibility-state';
@@ -76,8 +76,8 @@ export class NextPageService {
     /** @private {?Element} */
     this.separator_ = null;
 
-    /** @private {?../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = null;
+    /** @private {?../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = null;
 
     /** @private {?MultidocManager} */
     this.multidocManager_ = null;
@@ -154,7 +154,7 @@ export class NextPageService {
 
     this.navigation_ = Services.navigationForDoc(ampDoc);
     this.viewport_ = Services.viewportForDoc(ampDoc);
-    this.resources_ = Services.resourcesForDoc(ampDoc);
+    this.mutator_ = Services.mutatorForDoc(ampDoc);
     this.multidocManager_ = new MultidocManager(
       win,
       Services.ampdocServiceFor(win),
@@ -241,6 +241,16 @@ export class NextPageService {
     return amp;
   }
 
+  /**
+   * Creates an invisible element used to measure the position of the documents
+   * @return {!Element}
+   */
+  createMeasurer_() {
+    const measurer = this.win_.document.createElement('div');
+    measurer.classList.add('i-amphtml-next-page-measurer');
+    return measurer;
+  }
+
   /**
    * Creates a default hairline separator element to go between two documents.
    * @return {!Element}
@@ -262,6 +272,9 @@ export class NextPageService {
 
       const container = this.win_.document.createElement('div');
 
+      const measurer = this.createMeasurer_();
+      container.appendChild(measurer);
+
       const separator = this.separator_.cloneNode(true);
       separator.removeAttribute('separator');
       container.appendChild(separator);
@@ -276,7 +289,7 @@ export class NextPageService {
       const page = this.nextArticle_;
       this.appendPageHandler_(container).then(() => {
         this.positionObserver_.observe(
-          separator,
+          measurer,
           PositionObserverFidelity.LOW,
           position => this.positionUpdate_(page, position)
         );
@@ -327,7 +340,7 @@ export class NextPageService {
                 this.positionObserver_.unobserve(articleLinks);
                 documentRef.recUnit.isObserving = true;
               }
-              this.resources_.mutateElement(container, () => {
+              this.mutator_.mutateElement(container, () => {
                 try {
                   documentRef.amp = this.attachShadowDoc_(shadowRoot, doc);
 
diff --git a/extensions/amp-next-page/0.1/test/test-amp-next-page.js b/extensions/amp-next-page/0.1/test/test-amp-next-page.js
index 264d54fd16871..380429f88dc11 100644
--- a/extensions/amp-next-page/0.1/test/test-amp-next-page.js
+++ b/extensions/amp-next-page/0.1/test/test-amp-next-page.js
@@ -66,7 +66,7 @@ describes.realWin(
 
       fetchDocumentMock = env.sandbox.mock(DocFetcher);
       env.sandbox
-        .stub(Services.resourcesForDoc(ampdoc), 'mutateElement')
+        .stub(Services.mutatorForDoc(ampdoc), 'mutateElement')
         .callsFake((unused, mutator) => {
           mutator();
           return Promise.resolve();
diff --git a/extensions/amp-next-page/1.0/amp-next-page.css b/extensions/amp-next-page/1.0/amp-next-page.css
new file mode 100644
index 0000000000000..51761a0c20cbf
--- /dev/null
+++ b/extensions/amp-next-page/1.0/amp-next-page.css
@@ -0,0 +1,39 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software'
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+.i-amphtml-next-page-document {
+  overflow: hidden;
+}
+
+.i-amphtml-next-page-document:not(.amp-next-page-visible) [i-amphtml-fixedid] {
+  display: none;
+}
+
+.i-amphtml-next-page-document.amp-next-page-visible {
+  opacity: 1;
+  overflow: visible;
+}
+
+/** Fixes collapsing margins when switching between the visible and hidden states */
+.i-amphtml-next-page-document:before,
+.i-amphtml-next-page-document:after {
+  content: ' ';
+  display: table;
+}
+
+.i-amphtml-next-page-placeholder {
+  background: #eee;
+}
diff --git a/extensions/amp-next-page/1.0/amp-next-page.js b/extensions/amp-next-page/1.0/amp-next-page.js
new file mode 100644
index 0000000000000..169e685598189
--- /dev/null
+++ b/extensions/amp-next-page/1.0/amp-next-page.js
@@ -0,0 +1,56 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {CSS} from '../../../build/amp-next-page-1.0.css';
+import {Layout} from '../../../src/layout';
+import {NextPageService} from './service';
+import {Services} from '../../../src/services';
+import {isExperimentOn} from '../../../src/experiments';
+import {userAssert} from '../../../src/log';
+
+const TAG = 'amp-next-page';
+const SERVICE = 'next-page';
+
+export class AmpNextPage extends AMP.BaseElement {
+  /** @param {!AmpElement} element */
+  constructor(element) {
+    super(element);
+
+    /** @private {?NextPageService} */
+    this.nextPageService_ = null;
+  }
+
+  /** @override */
+  isLayoutSupported(layout) {
+    return layout === Layout.CONTAINER;
+  }
+
+  /** @override */
+  buildCallback() {
+    userAssert(
+      isExperimentOn(this.win, 'amp-next-page-v2'),
+      'Experiment amp-next-page-v2 disabled'
+    );
+
+    this.nextPageService_ = Services.nextPageServiceForDoc(this.element);
+    return this.nextPageService_.build(this.element);
+  }
+}
+
+AMP.extension(TAG, '1.0', AMP => {
+  AMP.registerServiceForDoc(SERVICE, NextPageService);
+  AMP.registerElement(TAG, AmpNextPage, CSS);
+});
diff --git a/extensions/amp-next-page/1.0/page.js b/extensions/amp-next-page/1.0/page.js
new file mode 100644
index 0000000000000..c70d2a7c04258
--- /dev/null
+++ b/extensions/amp-next-page/1.0/page.js
@@ -0,0 +1,297 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {ViewportRelativePos} from './visibility-observer';
+import {VisibilityState} from '../../../src/visibility-state';
+import {devAssert} from '../../../src/log';
+
+/** @enum {number} */
+export const PageState = {
+  QUEUED: 0,
+  FETCHING: 1,
+  LOADED: 2,
+  FAILED: 3,
+  INSERTED: 4,
+  PAUSED: 5,
+};
+
+export const VISIBLE_DOC_CLASS = 'amp-next-page-visible';
+export const HIDDEN_DOC_CLASS = 'amp-next-page-hidden';
+
+export class Page {
+  /**
+   * @param {!./service.NextPageService} manager
+   * @param {{ url: string, title: string, image: string }} meta
+   */
+  constructor(manager, meta) {
+    /** @private @const {!./service.NextPageService} */
+    this.manager_ = manager;
+    /** @private @const {string} */
+    this.title_ = meta.title;
+    /** @private {string} */
+    this.url_ = meta.url;
+    /** @private {string} */
+    this.initialUrl_ = meta.url;
+    /** @private @const {string} */
+    this.image_ = meta.image;
+
+    /** @private {?../../../src/runtime.ShadowDoc} */
+    this.shadowDoc_ = null;
+    /** @private {?Element} */
+    this.container_ = null;
+    /** @private {?Document} */
+    this.cachedContent_ = null;
+    /** @private {!PageState} */
+    this.state_ = PageState.QUEUED;
+    /** @private {!VisibilityState} */
+    this.visibilityState_ = VisibilityState.PRERENDER;
+    /** @private {!ViewportRelativePos} */
+    this.relativePos_ = ViewportRelativePos.OUTSIDE_VIEWPORT;
+  }
+
+  /** @return {string} */
+  get url() {
+    return this.url_;
+  }
+
+  /**
+   * @param {string} url
+   */
+  set url(url) {
+    this.url_ = url;
+  }
+
+  /** @return {string} */
+  get initialUrl() {
+    return this.initialUrl_;
+  }
+
+  /** @return {string} */
+  get image() {
+    return this.image_;
+  }
+
+  /** @return {string} */
+  get title() {
+    return this.title_;
+  }
+
+  /** @return {!ViewportRelativePos} */
+  get relativePos() {
+    return this.relativePos_;
+  }
+
+  /** @return {!Document|!ShadowRoot|undefined} */
+  get document() {
+    if (!this.shadowDoc_) {
+      return;
+    }
+    return this.shadowDoc_.ampdoc.getRootNode();
+  }
+
+  /** @return {?Element} */
+  get container() {
+    return this.container_;
+  }
+
+  /** @return {?../../../src/runtime.ShadowDoc} */
+  get shadowDoc() {
+    return this.shadowDoc_;
+  }
+
+  /** @param {!ViewportRelativePos} position */
+  set relativePos(position) {
+    this.relativePos_ = position;
+  }
+
+  /**
+   * @return {boolean}
+   */
+  isVisible() {
+    return this.visibilityState_ === VisibilityState.VISIBLE;
+  }
+
+  /**
+   * @return {boolean}
+   */
+  isPaused() {
+    return this.state_ === PageState.PAUSED;
+  }
+
+  /**
+   * @return {!VisibilityState}
+   * @visibleForTesting
+   */
+  getVisibilityState() {
+    return this.visibilityState_;
+  }
+
+  /**
+   * @param {VisibilityState} visibilityState
+   */
+  setVisibility(visibilityState) {
+    if (visibilityState == this.visibilityState_) {
+      return;
+    }
+
+    //Reload the page if necessary
+    if (this.isPaused() && visibilityState === VisibilityState.VISIBLE) {
+      this.resume();
+    }
+
+    // Update visibility internally and at the shadow doc level
+    this.visibilityState_ = visibilityState;
+    if (this.shadowDoc_) {
+      this.shadowDoc_.setVisibilityState(visibilityState);
+      this.shadowDoc_.ampdoc
+        .getBody()
+        .classList.toggle(VISIBLE_DOC_CLASS, this.isVisible());
+      this.shadowDoc_.ampdoc
+        .getBody()
+        .classList.toggle(HIDDEN_DOC_CLASS, !this.isVisible());
+    }
+
+    if (this.isVisible()) {
+      // Switch the title and url of the page to reflect this page
+      this.manager_.setTitlePage(this);
+    }
+  }
+
+  /**
+   * Creates a placeholder in place of the original page and unloads
+   * the shadow root from memory
+   * @return {!Promise}
+   */
+  pause() {
+    if (!this.shadowDoc_) {
+      return Promise.resolve();
+    }
+    return this.shadowDoc_.close().then(() => {
+      this.manager_.closeDocument(this /** page */).then(() => {
+        this.shadowDoc_ = null;
+        this.visibilityState_ = VisibilityState.HIDDEN;
+        this.state_ = PageState.PAUSED;
+      });
+    });
+  }
+
+  /**
+   * Removes the placeholder and re-renders the page after its shadow
+   * root has been removed
+   */
+  resume() {
+    this.attach_(devAssert(this.cachedContent_));
+  }
+
+  /**
+   * @return {boolean}
+   */
+  isFetching() {
+    return this.state_ === PageState.FETCHING;
+  }
+
+  /**
+   * @return {boolean}
+   */
+  isLoaded() {
+    return (
+      this.state_ === PageState.LOADED || this.state_ === PageState.INSERTED
+    );
+  }
+
+  /**
+   * Asks the next-page manager to fetch the document's HTML
+   * and inserts it
+   * @return {!Promise}
+   */
+  fetch() {
+    // TOOD(wassgha): Should we re-fetch on failure? or show a failed state?
+    // or skip to the next available document? (currently breaks silently)
+    if (
+      this.state_ === PageState.INSERTED ||
+      this.state_ === PageState.FETCHING ||
+      this.state_ === PageState.FAILED
+    ) {
+      return Promise.resolve();
+    }
+
+    this.state_ = PageState.FETCHING;
+
+    return this.manager_
+      .fetchPageDocument(this)
+      .then(content => {
+        this.state_ = PageState.LOADED;
+        this.container_ = this.manager_.createDocumentContainerForPage(
+          this /** page */
+        );
+        // TODO(wassgha): To further optimize, this should ideally
+        // be parsed from the service worker instead of stored in memory
+        this.cachedContent_ = content;
+        this.attach_(content);
+      })
+      .catch(() => {
+        this.state_ = PageState.FAILED;
+        // TOOD(wassgha): Silently skips this page, should we re-try or show an error state?
+        this.manager_.setLastFetchedPage(this);
+      });
+  }
+
+  /**
+   * Inserts the fetched (or cached) HTML as the document's content
+   * @param {!Document} content
+   */
+  attach_(content) {
+    const shadowDoc = this.manager_.attachDocumentToPage(
+      this /** page */,
+      content,
+      this.isPaused() /** force */
+    );
+
+    if (shadowDoc) {
+      this.shadowDoc_ = shadowDoc;
+      if (!this.isPaused()) {
+        this.manager_.setLastFetchedPage(this);
+      }
+      this.state_ = PageState.INSERTED;
+    } else {
+      this.state_ = PageState.FAILED;
+    }
+  }
+}
+
+export class HostPage extends Page {
+  /**
+   * @param {!./service.NextPageService} manager
+   * @param {{ url: string, title: string, image: string }} meta
+   * @param {!PageState} initState
+   * @param {!VisibilityState} initVisibility
+   * @param {!Document} initDoc
+   */
+  constructor(manager, meta, initState, initVisibility, initDoc) {
+    super(manager, meta);
+    /** @override */
+    this.state_ = initState;
+    /** @override */
+    this.visibilityState_ = initVisibility;
+    /** @private {!Document} */
+    this.document_ = initDoc;
+  }
+
+  /** @override */
+  get document() {
+    return this.document_;
+  }
+}
diff --git a/extensions/amp-next-page/1.0/service.js b/extensions/amp-next-page/1.0/service.js
new file mode 100644
index 0000000000000..0603f82deb022
--- /dev/null
+++ b/extensions/amp-next-page/1.0/service.js
@@ -0,0 +1,775 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {CSS} from '../../../build/amp-next-page-1.0.css';
+import {HIDDEN_DOC_CLASS, HostPage, Page, PageState} from './page';
+import {MultidocManager} from '../../../src/multidoc-manager';
+import {Services} from '../../../src/services';
+import {VisibilityState} from '../../../src/visibility-state';
+import {
+  childElementByAttr,
+  childElementsByTag,
+  isJsonScriptTag,
+  removeElement,
+  scopedQuerySelector,
+} from '../../../src/dom';
+import {dev, devAssert, user, userAssert} from '../../../src/log';
+import {escapeCssSelectorIdent} from '../../../src/css';
+import {installStylesForDoc} from '../../../src/style-installer';
+import {
+  parseFavicon,
+  parseOgImage,
+  parseSchemaImage,
+} from '../../../src/mediasession-helper';
+import {setStyles, toggle} from '../../../src/style';
+import {toArray} from '../../../src/types';
+import {tryParseJson} from '../../../src/json';
+import {validatePage, validateUrl} from './utils';
+import VisibilityObserver, {ViewportRelativePos} from './visibility-observer';
+
+const TAG = 'amp-next-page';
+const PRERENDER_VIEWPORT_COUNT = 3;
+const NEAR_BOTTOM_VIEWPORT_COUNT = 1;
+const PAUSE_PAGE_COUNT = 5;
+
+const NEXT_PAGE_CLASS = 'i-amphtml-next-page';
+const DOC_CLASS = 'i-amphtml-next-page-document';
+const DOC_CONTAINER_CLASS = 'i-amphtml-next-page-document-container';
+const SHADOW_ROOT_CLASS = 'i-amphtml-next-page-shadow-root';
+const PLACEHOLDER_CLASS = 'i-amphtml-next-page-placeholder';
+
+/** @enum */
+export const Direction = {UP: 1, DOWN: -1};
+
+export class NextPageService {
+  /**
+   * @param  {!../../../src/service/ampdoc-impl.AmpDoc} ampdoc
+   */
+  constructor(ampdoc) {
+    /** @private @const {!../../../src/service/ampdoc-impl.AmpDoc} */
+    this.ampdoc_ = ampdoc;
+
+    /** @private @const {!Window} */
+    this.win_ = ampdoc.win;
+
+    /**
+     * @private
+     * @const {!../../../src/service/viewport/viewport-interface.ViewportInterface}
+     */
+    this.viewport_ = Services.viewportForDoc(ampdoc);
+
+    /**
+     * @private
+     * @const {!../../../src/service/mutator-interface.MutatorInterface}
+     */
+    this.mutator_ = Services.mutatorForDoc(ampdoc);
+
+    /** @private {?Element} */
+    this.separator_ = null;
+
+    /** @private {?Element} */
+    this.moreBox_ = null;
+
+    /** @private {?AmpElement} element */
+    this.element_ = null;
+
+    /** @private {?VisibilityObserver} */
+    this.visibilityObserver_ = null;
+
+    /** @private {?MultidocManager} */
+    this.multidocManager_ = null;
+
+    /** @private {?../../../src/service/history-impl.History} */
+    this.history_ = null;
+
+    /** @private {?Array<!Page>} */
+    this.pages_;
+
+    /** @private {?Page} */
+    this.lastFetchedPage_ = null;
+
+    /** @private {!Direction} */
+    this.scrollDirection_ = Direction.DOWN;
+
+    /** @private {number} */
+    this.lastScrollTop_ = 0;
+
+    /** @private {?Page} */
+    this.hostPage_ = null;
+
+    /** @private {!Object<string, !Element>} */
+    this.replaceableElements_ = {};
+  }
+
+  /**
+   * @return {boolean}
+   */
+  isBuilt() {
+    return !!this.pages_;
+  }
+
+  /**
+   * Builds the next-page service by fetching the required elements
+   * and the initial list of pages and installing scoll listeners
+   * @param {!AmpElement} element
+   */
+  build(element) {
+    // Prevent multiple amp-next-page on the same document
+    if (this.isBuilt()) {
+      return;
+    }
+
+    this.element_ = element;
+
+    // Get the separator and more box (and remove the provided elements in the process)
+    this.separator_ = this.getSeparatorElement_(element);
+    this.moreBox_ = this.getMoreBoxElement_(element);
+
+    // Create a reference to the host page
+    this.hostPage_ = this.createHostPage();
+    this.toggleHiddenAndReplaceableElements(this.win_.document);
+
+    this.history_ = Services.historyForDoc(this.ampdoc_);
+    this.initializeHistory();
+
+    this.multidocManager_ = new MultidocManager(
+      this.win_,
+      Services.ampdocServiceFor(this.win_),
+      Services.extensionsFor(this.win_),
+      Services.timerFor(this.win_)
+    );
+    this.visibilityObserver_ = new VisibilityObserver(this.ampdoc_);
+
+    // Have the suggestion box be always visible
+    this.element_.appendChild(this.moreBox_);
+
+    if (!this.pages_) {
+      this.pages_ = [this.hostPage_];
+      this.setLastFetchedPage(this.hostPage_);
+    }
+
+    this.parseAndQueuePages_();
+
+    this.getHostNextPageElement_().classList.add(NEXT_PAGE_CLASS);
+
+    this.viewport_.onScroll(() => this.updateScroll_());
+    this.viewport_.onResize(() => this.updateScroll_());
+    this.updateScroll_();
+  }
+
+  /**
+   * @return {!AmpElement}
+   * @private
+   */
+  getHostNextPageElement_() {
+    return dev().assertElement(this.element_);
+  }
+
+  /**
+   * @private
+   */
+  updateScroll_() {
+    this.updateScrollDirection_();
+    this.maybeFetchNext();
+  }
+
+  /**
+   * @param {boolean=} force
+   * @return {!Promise}
+   */
+  maybeFetchNext(force = false) {
+    // If a page is already queued to be fetched, wait for it
+    if (this.pages_.some(page => page.isFetching())) {
+      return Promise.resolve();
+    }
+    // If we're still too far from the bottom, early return
+    if (this.getViewportsAway_() > PRERENDER_VIEWPORT_COUNT && !force) {
+      return Promise.resolve();
+    }
+
+    const nextPage = this.pages_[this.getPageIndex_(this.lastFetchedPage_) + 1];
+    if (!nextPage) {
+      return Promise.resolve();
+    }
+    return nextPage.fetch();
+  }
+
+  /**
+   * Loops through pages and updates their visibility according
+   * to their relative position to the viewport
+   */
+  updateVisibility() {
+    this.pages_.forEach((page, index) => {
+      if (
+        page.relativePos === ViewportRelativePos.INSIDE_VIEWPORT ||
+        page.relativePos === ViewportRelativePos.CONTAINS_VIEWPORT
+      ) {
+        if (!page.isVisible()) {
+          page.setVisibility(VisibilityState.VISIBLE);
+        }
+        this.hidePreviousPages_(index);
+        this.resumePausedPages_(index);
+      } else if (page.relativePos === ViewportRelativePos.OUTSIDE_VIEWPORT) {
+        if (page.isVisible()) {
+          page.setVisibility(VisibilityState.HIDDEN);
+        }
+      }
+    });
+
+    // If no page is visible then the host page should be
+    if (!this.pages_.some(page => page.isVisible())) {
+      this.hostPage_.setVisibility(VisibilityState.VISIBLE);
+    }
+
+    // Hide elements if necessary
+    this.pages_
+      .filter(page => page.isVisible())
+      .forEach(page =>
+        this.toggleHiddenAndReplaceableElements(
+          /** @type {!Document|!ShadowRoot} */ (devAssert(page.document))
+        )
+      );
+  }
+
+  /**
+   * Makes sure that all pages preceding the current page are
+   * marked hidden if they are out of the viewport and additionally
+   * paused if they are too far from the current page
+   * @param {number} index index of the page to start at
+   * @param {number=} pausePageCountForTesting
+   * @return {!Promise}
+   * @private
+   */
+  hidePreviousPages_(index, pausePageCountForTesting) {
+    // The distance (in pages) to the currently visible page after which
+    // we start unloading pages from memory
+    const pausePageCount =
+      pausePageCountForTesting === undefined
+        ? PAUSE_PAGE_COUNT
+        : pausePageCountForTesting;
+
+    const scrollingDown = this.scrollDirection_ === Direction.DOWN;
+    // Hide the host (first) page if needed
+    if (scrollingDown && this.hostPage_.isVisible()) {
+      this.hostPage_.setVisibility(VisibilityState.HIDDEN);
+    }
+
+    // Get all the pages that the user scrolled past (or didn't see yet)
+    const previousPages = scrollingDown
+      ? this.pages_.slice(1, index).reverse()
+      : this.pages_.slice(index + 1);
+
+    // Find the ones that should be hidden (no longer inside the viewport)
+    return Promise.all(
+      previousPages
+        .filter(page => {
+          const shouldHide =
+            page.relativePos === ViewportRelativePos.LEAVING_VIEWPORT ||
+            page.relativePos === ViewportRelativePos.OUTSIDE_VIEWPORT;
+          return shouldHide;
+        })
+        .map((page, away) => {
+          // Hide all pages that are in the viewport
+          if (page.isVisible()) {
+            page.setVisibility(VisibilityState.HIDDEN);
+          }
+          // Pause those that are too far away
+          if (away >= pausePageCount) {
+            return page.pause();
+          }
+        })
+    );
+  }
+
+  /**
+   * Makes sure that all pages that are a few pages away from the
+   * currently visible page are re-inserted (if paused) and
+   * ready to become visible soon
+   * @param {number} index index of the page to start at
+   * @param {number=} pausePageCountForTesting
+   * @private
+   */
+  resumePausedPages_(index, pausePageCountForTesting) {
+    // The distance (in pages) to the currently visible page after which
+    // we start unloading pages from memory
+    const pausePageCount =
+      pausePageCountForTesting === undefined
+        ? PAUSE_PAGE_COUNT
+        : pausePageCountForTesting;
+
+    // Get all the pages that should be resumed
+    const nearViewportPages = this.pages_
+      .slice(1) // Ignore host page
+      .slice(
+        Math.max(0, index - pausePageCount - 1),
+        Math.min(this.pages_.length, index + pausePageCount + 1)
+      )
+      .filter(page => page.isPaused());
+
+    nearViewportPages.forEach(page => page.resume());
+  }
+
+  /**
+   * @param {!Page} page
+   */
+  setLastFetchedPage(page) {
+    this.lastFetchedPage_ = page;
+  }
+
+  /**
+   * Sets the title and url of the document to those of
+   * the provided page
+   * @param {?Page=} page
+   */
+  setTitlePage(page = this.hostPage_) {
+    if (!page) {
+      dev().warn(TAG, 'setTitlePage called before next-page-service is built');
+      return;
+    }
+    const {title, url} = page;
+    this.win_.document.title = title;
+    this.history_.replace({title, url});
+  }
+
+  /**
+   * Adds an initial entry in history that sub-pages can
+   * replace when they become visible
+   */
+  initializeHistory() {
+    const {title, url} = this.hostPage_;
+    this.history_.push(undefined /** opt_onPop */, {title, url});
+  }
+
+  /**
+   * Creates the initial (host) page based on the window's metadata
+   * @return {!Page}
+   */
+  createHostPage() {
+    const doc = this.win_.document;
+    const {title, location} = doc;
+    const {href: url} = location;
+    const image =
+      parseSchemaImage(doc) || parseOgImage(doc) || parseFavicon(doc) || '';
+    return new HostPage(
+      this,
+      {
+        url,
+        title,
+        image,
+      },
+      PageState.INSERTED /** initState */,
+      VisibilityState.VISIBLE /** initVisibility */,
+      doc /** initDoc */
+    );
+  }
+
+  /**
+   * Create a container element for the document and insert it into
+   * the amp-next-page element
+   * @param {!Page} page
+   * @return {!Element}
+   */
+  createDocumentContainerForPage(page) {
+    const container = this.win_.document.createElement('div');
+    container.classList.add(DOC_CONTAINER_CLASS);
+
+    const shadowRoot = this.win_.document.createElement('div');
+    shadowRoot.classList.add(SHADOW_ROOT_CLASS);
+    container.appendChild(shadowRoot);
+
+    // Insert the separator
+    container.appendChild(this.separator_.cloneNode(true));
+
+    // Insert the container
+    this.element_.insertBefore(container, this.moreBox_);
+
+    // Observe this page's visibility
+    this.visibilityObserver_.observe(
+      shadowRoot /** element */,
+      container /** parent */,
+      position => {
+        page.relativePos = position;
+        this.updateVisibility();
+      }
+    );
+
+    return container;
+  }
+
+  /**
+   * Appends the given document to the host page and installs
+   * a visibility observer to monitor it
+   * @param {!Page} page
+   * @param {!Document} content
+   * @param {boolean=} force
+   * @return {?../../../src/runtime.ShadowDoc}
+   */
+  attachDocumentToPage(page, content, force = false) {
+    // If the user already scrolled to the bottom, prevent rendering
+    if (this.getViewportsAway_() < NEAR_BOTTOM_VIEWPORT_COUNT && !force) {
+      // TODO(wassgha): Append a "load next article" button?
+      return null;
+    }
+
+    const container = dev().assertElement(page.container);
+    let shadowRoot = scopedQuerySelector(
+      container,
+      `> .${escapeCssSelectorIdent(SHADOW_ROOT_CLASS)}`
+    );
+
+    // Page has previously been deactivated so the shadow root
+    // will need to replace placeholder
+    // TODO(wassgha) This wouldn't be needed once we can resume a ShadowDoc
+    if (!shadowRoot) {
+      devAssert(page.isPaused());
+      const placeholder = dev().assertElement(
+        scopedQuerySelector(
+          container,
+          `> .${escapeCssSelectorIdent(PLACEHOLDER_CLASS)}`
+        ),
+        'Paused page does not have a placeholder'
+      );
+
+      shadowRoot = this.win_.document.createElement('div');
+      shadowRoot.classList.add(SHADOW_ROOT_CLASS);
+
+      container.replaceChild(shadowRoot, placeholder);
+    }
+
+    // Handles extension deny-lists
+    this.sanitizeDoc(content);
+
+    // Try inserting the shadow document
+    try {
+      const amp = this.multidocManager_.attachShadowDoc(
+        shadowRoot,
+        content,
+        '',
+        {
+          visibilityState: VisibilityState.PRERENDER,
+        }
+      );
+
+      const ampdoc = devAssert(amp.ampdoc);
+      installStylesForDoc(ampdoc, CSS, null, false, TAG);
+
+      const body = ampdoc.getBody();
+      body.classList.add(DOC_CLASS);
+
+      return amp;
+    } catch (e) {
+      dev().error(TAG, 'failed to attach shadow document for page', e);
+      return null;
+    }
+  }
+
+  /**
+   * Closes the shadow document of an inserted page and replaces it
+   * with a placeholder
+   * @param {!Page} page
+   * @return {!Promise}
+   */
+  closeDocument(page) {
+    if (page.isPaused()) {
+      return Promise.resolve();
+    }
+
+    const container = dev().assertElement(page.container);
+    const shadowRoot = dev().assertElement(
+      scopedQuerySelector(
+        container,
+        `> .${escapeCssSelectorIdent(SHADOW_ROOT_CLASS)}`
+      )
+    );
+
+    // Create a placeholder that gets displayed when the document becomes inactive
+    const placeholder = this.win_.document.createElement('div');
+    placeholder.classList.add(PLACEHOLDER_CLASS);
+
+    let docHeight = 0;
+    let docWidth = 0;
+    return this.mutator_.measureMutateElement(
+      shadowRoot,
+      () => {
+        docHeight = shadowRoot./*REVIEW*/ offsetHeight;
+        docWidth = shadowRoot./*REVIEW*/ offsetWidth;
+      },
+      () => {
+        setStyles(placeholder, {
+          'height': `${docHeight}px`,
+          'width': `${docWidth}px`,
+        });
+        container.replaceChild(placeholder, shadowRoot);
+      }
+    );
+  }
+
+  /**
+   * Removes redundancies and unauthorized extensions and elements
+   * @param {!Document} doc Document to attach.
+   */
+  sanitizeDoc(doc) {
+    // TODO(wassgha): Allow amp-analytics after bug bash
+    toArray(doc.querySelectorAll('amp-analytics')).forEach(removeElement);
+
+    // Parse for more pages and queue them
+    toArray(doc.querySelectorAll('amp-next-page')).forEach(el => {
+      this.parseAndQueuePages_(el);
+      removeElement(el);
+    });
+
+    // Mark document as hidden initially
+    doc.body.classList.add(HIDDEN_DOC_CLASS);
+
+    // Make sure all hidden elements are initially invisible
+    this.toggleHiddenAndReplaceableElements(doc, false /** isVisible */);
+  }
+
+  /**
+   * Hides or shows elements based on the `next-page-hide` and
+   * `next-page-replace` attributes
+   * @param {!Document|!ShadowRoot} doc Document to attach.
+   * @param {boolean=} isVisible Whether this page is visible or not
+   */
+  toggleHiddenAndReplaceableElements(doc, isVisible = true) {
+    // Hide elements that have [next-page-hide] on child documents
+    if (doc !== this.hostPage_.document) {
+      toArray(doc.querySelectorAll('[next-page-hide]')).forEach(element =>
+        toggle(element, false /** opt_display */)
+      );
+    }
+
+    // Element replacing is only concerned with the visible page
+    if (!isVisible) {
+      return;
+    }
+
+    // Replace elements that have [next-page-replace]
+    toArray(
+      doc.querySelectorAll('*:not(amp-next-page) [next-page-replace]')
+    ).forEach(element => {
+      let uniqueId = element.getAttribute('next-page-replace');
+      if (!uniqueId) {
+        uniqueId = String(Date.now() + Math.floor(Math.random() * 100));
+        element.setAttribute('next-page-replace', uniqueId);
+      }
+
+      if (
+        this.replaceableElements_[uniqueId] &&
+        this.replaceableElements_[uniqueId] !== element
+      ) {
+        toggle(this.replaceableElements_[uniqueId], false /** opt_display */);
+      }
+      this.replaceableElements_[uniqueId] = element;
+      toggle(element, true /** opt_display */);
+    });
+  }
+
+  /**
+   * @return {number} viewports left to reach the end of the document
+   * @private
+   */
+  getViewportsAway_() {
+    return Math.round(
+      (this.viewport_.getScrollHeight() -
+        this.viewport_.getScrollTop() -
+        this.viewport_.getHeight()) /
+        this.viewport_.getHeight()
+    );
+  }
+
+  /**
+   * @private
+   */
+  updateScrollDirection_() {
+    const scrollTop = this.viewport_.getScrollTop();
+    this.scrollDirection_ =
+      scrollTop > this.lastScrollTop_ ? Direction.DOWN : Direction.UP;
+    this.lastScrollTop_ = scrollTop;
+  }
+
+  /**
+   * @param {Page} desiredPage
+   * @return {number} The index of the page.
+   */
+  getPageIndex_(desiredPage) {
+    const pages = dev().assertArray(this.pages_);
+    return pages.indexOf(desiredPage);
+  }
+
+  /**
+   * @param {!Page} page
+   * @return {!Promise<!Document>}
+   */
+  fetchPageDocument(page) {
+    return Services.xhrFor(this.win_)
+      .fetch(page.url, {ampCors: false})
+      .then(response => {
+        // Make sure the response is coming from the same origin as the
+        // page and update the page's url in case of a redirection
+        validateUrl(response.url, this.ampdoc_.getUrl());
+        page.url = response.url;
+
+        return response.text();
+      })
+      .then(html => {
+        const doc = this.win_.document.implementation.createHTMLDocument('');
+        doc.open();
+        doc.write(html);
+        doc.close();
+        return doc;
+      })
+      .catch(e => user().error(TAG, 'failed to fetch %s', page.url, e));
+  }
+
+  /**
+   * Parses the amp-next-page element for inline or remote list of pages and
+   * add them to the queue
+   * @param {!Element=} element the container of the amp-next-page extension
+   * @private
+   */
+  parseAndQueuePages_(element = this.getHostNextPageElement_()) {
+    this.parsePages_(element).then(pages => {
+      pages.forEach(page => {
+        try {
+          validatePage(page, this.ampdoc_.getUrl());
+          // Prevent loops by checking if the page already exists
+          // we use initialUrl since the url can get updated if
+          // the page issues a redirect
+          if (this.pages_.some(p => p.initialUrl == page.url)) {
+            return;
+          }
+          // Queue the page for fetching
+          this.pages_.push(
+            new Page(this, {
+              url: page.url,
+              title: page.title,
+              image: page.image,
+            })
+          );
+        } catch (e) {
+          user().error(TAG, 'Failed to queue page', e);
+        }
+      });
+      // To be safe, if the pages were parsed after the user
+      // finished scrolling
+      this.maybeFetchNext();
+    });
+  }
+
+  /**
+   * @param {!Element} element the container of the amp-next-page extension
+   * @return {!Promise<Array>} List of pages to fetch
+   * @private
+   */
+  parsePages_(element) {
+    const inlinePages = this.getInlinePages_(element);
+    const src = element.getAttribute('src');
+    userAssert(
+      inlinePages || src,
+      '%s should contain a <script> child or a URL specified in [src]',
+      TAG
+    );
+
+    if (src) {
+      // TODO(wassgha): Implement loading pages from a URL
+      return Promise.resolve([]);
+    }
+
+    // TODO(wassgha): Implement recursively loading pages from subsequent documents
+    return Promise.resolve(inlinePages);
+  }
+
+  /**
+   * Reads the inline next pages from the element.
+   * @param {!Element} element the container of the amp-next-page extension
+   * @return {?Array} JSON object, or null if no inline pages specified.
+   * @private
+   */
+  getInlinePages_(element) {
+    const scriptElements = childElementsByTag(element, 'SCRIPT');
+    if (!scriptElements.length) {
+      return null;
+    }
+    userAssert(
+      scriptElements.length === 1,
+      `${TAG} should contain at most one <script> child`
+    );
+    const scriptElement = scriptElements[0];
+    userAssert(
+      isJsonScriptTag(scriptElement),
+      `${TAG} page list should ` +
+        'be inside a <script> tag with type="application/json"'
+    );
+
+    const pages = tryParseJson(scriptElement.textContent, error => {
+      user().error(TAG, 'failed to parse inline page list', error);
+    });
+
+    return user().assertArray(pages, `${TAG} page list should be an array`);
+  }
+
+  /**
+   * Reads the developer-provided separator element or defaults
+   * to the internal implementation of it
+   * @param {!Element} element the container of the amp-next-page extension
+   * @return {!Element}
+   * @private
+   */
+  getSeparatorElement_(element) {
+    const providedSeparator = childElementByAttr(element, 'separator');
+    // TODO(wassgha): Use templates (amp-mustache) to render the separator
+    if (providedSeparator) {
+      removeElement(providedSeparator);
+    }
+    return providedSeparator || this.buildDefaultSeparator_();
+  }
+
+  /**
+   * @return {!Element}
+   * @private
+   */
+  buildDefaultSeparator_() {
+    const separator = this.win_.document.createElement('div');
+    separator.classList.add('amp-next-page-default-separator');
+    return separator;
+  }
+
+  /**
+   * @param {!Element} element the container of the amp-next-page extension
+   * @return {!Element}
+   * @private
+   */
+  getMoreBoxElement_(element) {
+    const providedMoreBox = childElementByAttr(element, 'more-box');
+    // TODO(wassgha): Use templates (amp-mustache) to render the more box
+    if (providedMoreBox) {
+      removeElement(providedMoreBox);
+    }
+    return providedMoreBox || this.buildDefaultMoreBox_();
+  }
+
+  /**
+   * @return {!Element}
+   * @private
+   */
+  buildDefaultMoreBox_() {
+    // TODO(wassgha): Better default more box
+    const moreBox = this.win_.document.createElement('div');
+    moreBox.classList.add('amp-next-page-default-more-box');
+    return moreBox;
+  }
+}
diff --git a/extensions/amp-next-page/1.0/test/test-amp-next-page.js b/extensions/amp-next-page/1.0/test/test-amp-next-page.js
new file mode 100644
index 0000000000000..97214bacf8fe2
--- /dev/null
+++ b/extensions/amp-next-page/1.0/test/test-amp-next-page.js
@@ -0,0 +1,486 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import '../amp-next-page';
+import {Direction} from '../service';
+import {PageState} from '../page';
+import {Services} from '../../../../src/services';
+import {ViewportRelativePos} from '../visibility-observer';
+import {VisibilityState} from '../../../../src/visibility-state';
+import {setStyle} from '../../../../src/style';
+import {toggleExperiment} from '../../../../src/experiments';
+
+const MOCK_NEXT_PAGE = `<header>Header</header>
+    <div style="height:1000px"></div>
+    <footer>Footer</footer>`;
+const MOCK_NEXT_PAGE_WITH_RECOMMENDATIONS = `<header>Header</header>
+    <div style="height:1000px"></div>
+    <amp-next-page>
+        <script type="application/json">
+        [
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Title 3",
+            "url": "./document3"
+          },
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Title 4",
+            "url": "./document4"
+          },
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Title 2",
+            "url": "./document2"
+          }
+        ]
+      </script>
+    </amp-next-page>
+    <footer>Footer</footer>`;
+const VALID_CONFIG = [
+  {
+    'image': '/examples/img/hero@1x.jpg',
+    'title': 'Title 1',
+    'url': '/document1',
+  },
+  {
+    'image': '/examples/img/hero@1x.jpg',
+    'title': 'Title 2',
+    'url': '/document2',
+  },
+];
+
+describes.realWin(
+  'amp-next-page component',
+  {
+    amp: {
+      extensions: ['amp-next-page:1.0'],
+    },
+  },
+  env => {
+    let win, doc, ampdoc;
+
+    beforeEach(() => {
+      win = env.win;
+      doc = win.document;
+      ampdoc = env.ampdoc;
+
+      toggleExperiment(win, 'amp-next-page-v2', true);
+
+      // Mocks
+      ampdoc.getUrl = () => document.location.href;
+      win.document.title = 'Host page';
+    });
+
+    async function getAMPNextPage(options) {
+      options = options || {};
+
+      const element = doc.createElement('amp-next-page');
+
+      // Ensure element is off screen when it renders.
+      setStyle(element, 'marginTop', '10000px');
+
+      // Add inline config if specified
+      if (options.inlineConfig) {
+        const configElement = document.createElement('script');
+        configElement.setAttribute('id', 'next-page');
+        configElement.setAttribute('type', 'application/json');
+        configElement.textContent = JSON.stringify(options.inlineConfig);
+        element.appendChild(configElement);
+      }
+
+      if (options.src) {
+        element.setAttribute('src', options.src);
+      }
+
+      doc.body.appendChild(element);
+
+      return element;
+    }
+
+    afterEach(() => {
+      toggleExperiment(win, 'amp-next-page-v2', false);
+    });
+
+    describe('inline config', () => {
+      it('builds with valid inline config', async () => {
+        const element = await getAMPNextPage({
+          inlineConfig: VALID_CONFIG,
+        });
+
+        await element.build();
+        await element.layoutCallback();
+      });
+
+      it('errors on invalid inline config (object instead of array)', async () => {
+        const element = await getAMPNextPage({
+          inlineConfig: {
+            pages: [
+              {
+                'image': '/examples/img/hero@1x.jpg',
+                'title': 'Title 1',
+                'ampUrl': '/document1',
+              },
+              {
+                'image': '/examples/img/hero@1x.jpg',
+                'title': 'Title 2',
+                'ampUrl': '/document2',
+              },
+            ],
+          },
+        });
+
+        await allowConsoleError(() =>
+          element.build().catch(err => {
+            expect(err.message).to.include(
+              'amp-next-page page list should be an array'
+            );
+          })
+        );
+      });
+
+      it('errors on invalid inline config (ampUrl instead of url)', async () => {
+        const element = await getAMPNextPage({
+          inlineConfig: [
+            {
+              'image': '/examples/img/hero@1x.jpg',
+              'title': 'Title 1',
+              'ampUrl': '/document1',
+            },
+            {
+              'image': '/examples/img/hero@1x.jpg',
+              'title': 'Title 2',
+              'ampUrl': '/document2',
+            },
+          ],
+        });
+
+        await allowConsoleError(() =>
+          element.build().catch(err => {
+            expect(err.message).to.include('page url must be a string');
+          })
+        );
+      });
+
+      it('builds with valid inline config', async () => {
+        const element = await getAMPNextPage({
+          inlineConfig: VALID_CONFIG,
+        });
+
+        await element.build();
+        await element.layoutCallback();
+      });
+    });
+
+    describe('basic functionality', () => {
+      let element;
+      let service;
+
+      beforeEach(async () => {
+        element = await getAMPNextPage({
+          inlineConfig: VALID_CONFIG,
+        });
+
+        await element.build();
+        await element.layoutCallback();
+
+        service = Services.nextPageServiceForDoc(doc);
+      });
+
+      afterEach(async () => {
+        element.parentNode.removeChild(element);
+      });
+
+      it('should register pages from the given config', async () => {
+        // Page 1
+        expect(service.pages_[1].title).to.equal('Title 1');
+        expect(service.pages_[1].url).to.include('/document1');
+        expect(service.pages_[1].image).to.equal('/examples/img/hero@1x.jpg');
+        // Page 2
+        expect(service.pages_[2].title).to.equal('Title 2');
+        expect(service.pages_[2].url).to.include('/document2');
+        expect(service.pages_[2].image).to.equal('/examples/img/hero@1x.jpg');
+      });
+
+      it('should internally register the host page', async () => {
+        expect(service.pages_[0].title).to.equal('Host page');
+        expect(service.pages_[0].url).to.include('about:srcdoc');
+        expect(service.pages_[0].state_).to.equal(PageState.INSERTED);
+        expect(service.pages_[0].visibilityState_).to.equal(
+          VisibilityState.VISIBLE
+        );
+      });
+
+      it('should not fetch the next document before scrolling', async () => {
+        [1, 2].forEach(i => {
+          expect(service.pages_[i].state_).to.equal(PageState.QUEUED);
+          expect(service.pages_[i].visibilityState_).to.equal(
+            VisibilityState.PRERENDER
+          );
+        });
+      });
+
+      it('fetches the next document on scroll', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+        const firstPageFetchSpy = env.sandbox.spy(service.pages_[1], 'fetch');
+        const secondPageFetchSpy = env.sandbox.spy(service.pages_[2], 'fetch');
+
+        env.fetchMock.get(/\/document1/, MOCK_NEXT_PAGE);
+        await service.maybeFetchNext();
+
+        expect(firstPageFetchSpy).to.be.calledOnce;
+        expect(service.pages_[1].state_).to.equal(PageState.INSERTED);
+        expect(service.pages_[1].visibilityState_).to.equal(
+          VisibilityState.PRERENDER
+        );
+
+        expect(secondPageFetchSpy).to.not.be.called;
+        expect(service.pages_[2].state_).to.equal(PageState.QUEUED);
+        expect(service.pages_[2].visibilityState_).to.equal(
+          VisibilityState.PRERENDER
+        );
+      });
+
+      it('fetches the second document on scroll', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+        const firstPageFetchSpy = env.sandbox.spy(service.pages_[1], 'fetch');
+        const secondPageFetchSpy = env.sandbox.spy(service.pages_[2], 'fetch');
+
+        env.fetchMock.get(/\/document1/, MOCK_NEXT_PAGE);
+        env.fetchMock.get(/\/document2/, MOCK_NEXT_PAGE);
+        await service.maybeFetchNext();
+        await service.maybeFetchNext();
+
+        expect(firstPageFetchSpy).to.be.calledOnce;
+        expect(service.pages_[1].state_).to.equal(PageState.INSERTED);
+        expect(service.pages_[1].visibilityState_).to.equal(
+          VisibilityState.PRERENDER
+        );
+
+        expect(secondPageFetchSpy).to.be.calledOnce;
+        expect(service.pages_[2].state_).to.equal(PageState.INSERTED);
+        expect(service.pages_[2].visibilityState_).to.equal(
+          VisibilityState.PRERENDER
+        );
+      });
+
+      it('blocks documents which resolve to a different origin when fetched ', async () => {
+        expectAsyncConsoleError(
+          /Invalid page URL supplied to amp-next-page, pages must be from the same origin as the current document/,
+          2
+        );
+
+        env.fetchMock.get(/\/document1/, {
+          redirectUrl: 'https://othersite.com/article',
+          body: MOCK_NEXT_PAGE,
+        });
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+
+        await service.maybeFetchNext();
+
+        expect(service.pages_[1].state_).to.equal(PageState.FAILED);
+        expect(service.pages_[1].visibilityState_).to.equal(
+          VisibilityState.PRERENDER
+        );
+      });
+
+      it('adds the hidden class to elements that should be hidden', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+
+        env.fetchMock.get(
+          /\/document1/,
+          `${MOCK_NEXT_PAGE} <div next-page-hide id="hidden" />`
+        );
+        await service.maybeFetchNext();
+
+        expect(
+          service.pages_[1].document.getElementById('hidden')
+        ).to.have.attribute('hidden');
+      });
+
+      it('replaces elements with their most recent instance', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+
+        env.fetchMock.get(
+          /\/document1/,
+          `${MOCK_NEXT_PAGE} <div next-page-replace="replace-me" instance="1" />`
+        );
+        await service.maybeFetchNext();
+        service.pages_[1].setVisibility(VisibilityState.VISIBLE);
+
+        env.fetchMock.get(
+          /\/document2/,
+          `${MOCK_NEXT_PAGE} <div next-page-replace="replace-me" instance="2" />`
+        );
+        await service.maybeFetchNext();
+        service.pages_[1].relativePos = ViewportRelativePos.INSIDE_VIEWPORT;
+        service.updateVisibility();
+        service.pages_[1].relativePos = ViewportRelativePos.OUTSIDE_VIEWPORT;
+        service.pages_[2].relativePos = ViewportRelativePos.INSIDE_VIEWPORT;
+        service.updateVisibility();
+
+        expect(service.pages_[1].document.querySelector('[instance="1"]')).to.be
+          .ok;
+        expect(
+          service.pages_[1].document.querySelector('[instance="1"]')
+        ).to.have.attribute('hidden');
+        expect(service.pages_[2].document.querySelector('[instance="1"]')).to
+          .not.be.ok;
+      });
+
+      it('removes amp-analytics tags from child documents', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+
+        env.fetchMock.get(
+          /\/document1/,
+          `${MOCK_NEXT_PAGE} <amp-analytics id="analytics1"></amp-analytics>`
+        );
+        await service.maybeFetchNext();
+
+        expect(service.pages_[1].document.getElementById('analytics1')).to.be
+          .null;
+      });
+    });
+
+    describe('infinite loading', () => {
+      let element;
+      let service;
+
+      beforeEach(async () => {
+        element = await getAMPNextPage({
+          inlineConfig: VALID_CONFIG,
+        });
+
+        await element.build();
+        await element.layoutCallback();
+
+        service = Services.nextPageServiceForDoc(doc);
+      });
+
+      afterEach(async () => {
+        element.parentNode.removeChild(element);
+      });
+
+      it('recursively parses pages and avoids loops', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+
+        expect(service.pages_.length).to.equal(3);
+
+        env.fetchMock.get(/\/document1/, MOCK_NEXT_PAGE_WITH_RECOMMENDATIONS);
+        await service.maybeFetchNext();
+
+        // Adds the two documents coming from Document 1's recommendations
+        expect(service.pages_.length).to.equal(5);
+        expect(service.pages_.some(page => page.title == 'Title 3')).to.be.true;
+        expect(service.pages_.some(page => page.title == 'Title 4')).to.be.true;
+        // Avoids loops (ignores previously inserted page)
+        expect(
+          service.pages_.filter(page => page.title == 'Title 2').length
+        ).to.equal(1);
+      });
+
+      it('unloads pages and replaces them with a placeholder', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+        const secondPagePauseSpy = env.sandbox.spy(service.pages_[2], 'pause');
+
+        env.fetchMock.get(/\/document1/, MOCK_NEXT_PAGE);
+        env.fetchMock.get(/\/document2/, MOCK_NEXT_PAGE);
+        await service.maybeFetchNext();
+        await service.maybeFetchNext();
+
+        const {container} = service.pages_[2];
+        expect(container).to.be.ok;
+        expect(container.querySelector('.i-amphtml-next-page-placeholder')).to
+          .not.be.ok;
+        expect(container.querySelector('.i-amphtml-next-page-shadow-root')).to
+          .be.ok;
+
+        service.pages_[2].visibilityState_ = VisibilityState.VISIBLE;
+        service.scrollDirection_ = Direction.UP;
+
+        await service.hidePreviousPages_(
+          0 /** index */,
+          0 /** pausePageCountForTesting */
+        );
+
+        // Internally changes the state to paused
+        expect(secondPagePauseSpy).to.be.calledOnce;
+        expect(service.pages_[2].state_).to.equal(PageState.PAUSED);
+        expect(service.pages_[2].visibilityState_).to.equal(
+          VisibilityState.HIDDEN
+        );
+
+        // Replaces the inserted shadow doc with a placeholder of equal height
+        expect(container.querySelector('.i-amphtml-next-page-placeholder')).to
+          .be.ok;
+        expect(container.querySelector('.i-amphtml-next-page-shadow-root')).to
+          .not.be.ok;
+        expect(
+          win.getComputedStyle(
+            container.querySelector('.i-amphtml-next-page-placeholder')
+          ).height
+        ).to.equal('1036px');
+      });
+
+      it('reloads pages and removes the placeholder', async () => {
+        env.sandbox.stub(service, 'getViewportsAway_').returns(2);
+        const secondPageResumeSpy = env.sandbox.spy(
+          service.pages_[2],
+          'resume'
+        );
+
+        env.fetchMock.get(/\/document1/, MOCK_NEXT_PAGE);
+        env.fetchMock.get(/\/document2/, MOCK_NEXT_PAGE);
+        await service.maybeFetchNext();
+        await service.maybeFetchNext();
+
+        const {container} = service.pages_[2];
+        expect(container).to.be.ok;
+        service.pages_[2].visibilityState_ = VisibilityState.VISIBLE;
+        service.scrollDirection_ = Direction.UP;
+        await service.hidePreviousPages_(
+          0 /** index */,
+          0 /** pausePageCountForTesting */
+        );
+        expect(service.pages_[2].state_).to.equal(PageState.PAUSED);
+        expect(service.pages_[2].visibilityState_).to.equal(
+          VisibilityState.HIDDEN
+        );
+
+        service.scrollDirection_ = Direction.DOWN;
+        await service.resumePausedPages_(
+          1 /** index */,
+          0 /** pausePageCountForTesting */
+        );
+
+        // Replaces the inserted placeholder with the page's content
+        expect(secondPageResumeSpy).to.be.calledOnce;
+        expect(container.querySelector('.i-amphtml-next-page-placeholder')).to
+          .not.be.ok;
+        expect(container.querySelector('.i-amphtml-next-page-shadow-root')).to
+          .be.ok;
+        expect(
+          win.getComputedStyle(
+            container.querySelector('.i-amphtml-next-page-shadow-root')
+          ).height
+        ).to.equal('1036px');
+      });
+    });
+
+    describe('remote config', () => {
+      // TODO (wassgha): Implement once remote config is implemented
+    });
+  }
+);
diff --git a/extensions/amp-next-page/1.0/test/test-config.js b/extensions/amp-next-page/1.0/test/test-config.js
new file mode 100644
index 0000000000000..ffaada74e815c
--- /dev/null
+++ b/extensions/amp-next-page/1.0/test/test-config.js
@@ -0,0 +1,187 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {Page} from '../page';
+import {validatePage} from '../utils';
+
+describes.sandboxed('amp-next-page config', {}, () => {
+  const documentUrl = 'https://example.com/parent';
+  const documentUrlCdn =
+    'https://example-com.cdn.ampproject.org/c/s/example.com/parent';
+
+  it('rewrites relative URLs to absolute', () => {
+    const page = new Page(null, {
+      url: '/article1',
+      image: '/image.png',
+      title: 'Article 1',
+    });
+    expect(() => validatePage(page, documentUrl)).to.not.throw();
+    expect(page.url).to.equal('https://example.com/article1');
+  });
+
+  it('rewrites relative URLs when served from the cache', () => {
+    const page = new Page(null, {
+      url: '/article1',
+      image: '/image.png',
+      title: 'Article 1',
+    });
+    expect(() => validatePage(page, documentUrlCdn)).to.not.throw();
+    expect(page.url).to.equal(
+      'https://example-com.cdn.ampproject.org/c/s/example.com/article1'
+    );
+  });
+
+  it('rewrites canonical URLs when served from the cache', () => {
+    const page = new Page(null, {
+      url: 'https://example.com/art2?x=1',
+      image: '/image.png',
+      title: 'Article 1',
+    });
+    expect(() => validatePage(page, documentUrlCdn)).to.not.throw();
+    expect(page.url).to.equal(
+      'https://example-com.cdn.ampproject.org/c/s/example.com/art2?x=1'
+    );
+
+    const pageWithCdn = new Page(null, {
+      url: 'https://example-com.cdn.ampproject.org/c/s/example.com/art1',
+      image: '/image.png',
+      title: 'Article 1',
+    });
+    expect(() => validatePage(pageWithCdn, documentUrlCdn)).to.not.throw();
+    expect(pageWithCdn.url).to.equal(
+      'https://example-com.cdn.ampproject.org/c/s/example.com/art1'
+    );
+  });
+
+  it('rewrites non-HTTPS canonical URLs when served from the cache', () => {
+    const url = documentUrlCdn.replace('/s/', '/');
+
+    const page = new Page(null, {
+      url: 'http://example.com/art2?x=1',
+      image: '/image.png',
+      title: 'Article 1',
+    });
+    expect(() => validatePage(page, url)).to.not.throw();
+    expect(page.url).to.equal(
+      'https://example-com.cdn.ampproject.org/c/example.com/art2?x=1'
+    );
+  });
+
+  it("doesn't rewrite URLs if sourceOrigin and origin match", () => {
+    const page = new Page(null, {
+      url: 'https://example.com/article',
+      image: '/image.png',
+      title: 'Article 1',
+    });
+    expect(() => validatePage(page, documentUrl)).to.not.throw();
+    expect(page.url).to.equal('https://example.com/article');
+  });
+
+  it('throws on config with missing page title', () => {
+    const page = new Page(null, {
+      url: 'https://example.com/article',
+      image: '/image.png',
+    });
+
+    allowConsoleError(() => {
+      expect(() => validatePage(page, documentUrl)).to.throw(
+        'title must be a string'
+      );
+    });
+  });
+
+  it('throws on config with non-string page title', () => {
+    const page = new Page(null, {
+      url: 'https://example.com/article',
+      image: '/image.png',
+      title: {},
+    });
+
+    allowConsoleError(() => {
+      expect(() => validatePage(page, documentUrl)).to.throw(
+        'title must be a string'
+      );
+    });
+  });
+
+  it('throws on config with missing page image', () => {
+    const page = new Page(null, {
+      url: 'https://example.com/article',
+      title: 'Article 1',
+    });
+
+    allowConsoleError(() => {
+      expect(() => validatePage(page, documentUrl)).to.throw(
+        'image must be a string'
+      );
+    });
+  });
+
+  it('throws on config with non-string recommendation image', () => {
+    const page = new Page(null, {
+      url: 'https://example.com/article',
+      image: {},
+      title: 'Article 1',
+    });
+
+    allowConsoleError(() => {
+      expect(() => validatePage(page, documentUrl)).to.throw(
+        'image must be a string'
+      );
+    });
+  });
+
+  it('throws on config with pages from different domains', () => {
+    const page = new Page(null, {
+      url: 'https://othersite.com/article1',
+      image: 'https://othersite.com/image.png',
+      title: 'Article 1',
+    });
+
+    allowConsoleError(() => {
+      expect(() => validatePage(page, documentUrl)).to.throw(
+        'pages must be from the same origin as the current document'
+      );
+    });
+  });
+
+  it('throws on config with pages from different subdomains', () => {
+    const page = new Page(null, {
+      url: 'https://www.example.com/article1',
+      image: 'https://example.com/image.png',
+      title: 'Article 1',
+    });
+
+    allowConsoleError(() => {
+      expect(() => validatePage(page, documentUrl)).to.throw(
+        'pages must be from the same origin as the current document'
+      );
+    });
+  });
+
+  it('throws on config with pages on different ports', () => {
+    const page = new Page(null, {
+      url: 'https://example.com:8080/article1',
+      image: 'https://example.com/image.png',
+      title: 'Article 1',
+    });
+
+    allowConsoleError(() => {
+      expect(() => validatePage(page, documentUrl)).to.throw(
+        'pages must be from the same origin as the current document'
+      );
+    });
+  });
+});
diff --git a/extensions/amp-next-page/1.0/utils.js b/extensions/amp-next-page/1.0/utils.js
new file mode 100644
index 0000000000000..17a94c3ae0103
--- /dev/null
+++ b/extensions/amp-next-page/1.0/utils.js
@@ -0,0 +1,70 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  getSourceOrigin,
+  getSourceUrl,
+  parseUrlDeprecated,
+  resolveRelativeUrl,
+} from '../../../src/url';
+import {user, userAssert} from '../../../src/log';
+
+/**
+ * @param {string} url
+ * @param {string} hostUrl
+ * @return {!Location}
+ */
+export function validateUrl(url, hostUrl) {
+  const parsedUrl = parseUrlDeprecated(url);
+  const {origin} = parseUrlDeprecated(hostUrl);
+  const sourceOrigin = getSourceOrigin(hostUrl);
+
+  userAssert(
+    parsedUrl.origin === origin || parsedUrl.origin === sourceOrigin,
+    'Invalid page URL supplied to amp-next-page, pages must be from the same origin as the current document'
+  );
+
+  return parsedUrl;
+}
+
+/**
+ * @param {*} page
+ * @param {string} hostUrl
+ */
+export function validatePage(page, hostUrl) {
+  user().assertString(page.url, 'page url must be a string');
+
+  const base = getSourceUrl(hostUrl);
+  const {origin} = parseUrlDeprecated(hostUrl);
+  page.url = resolveRelativeUrl(page.url, base);
+
+  const url = validateUrl(page.url, hostUrl);
+  user().assertString(page.image, 'page image must be a string');
+  user().assertString(page.title, 'page title must be a string');
+
+  const sourceOrigin = getSourceOrigin(hostUrl);
+
+  // Rewrite canonical URLs to cache URLs, when served from the cache.
+  if (sourceOrigin !== origin && url.origin === sourceOrigin) {
+    page.url =
+      `${origin}/c/` +
+      (url.protocol === 'https:' ? 's/' : '') +
+      encodeURIComponent(url.host) +
+      url.pathname +
+      (url.search || '') +
+      (url.hash || '');
+  }
+}
diff --git a/extensions/amp-next-page/1.0/visibility-observer.js b/extensions/amp-next-page/1.0/visibility-observer.js
new file mode 100644
index 0000000000000..0536b6d9ad1b5
--- /dev/null
+++ b/extensions/amp-next-page/1.0/visibility-observer.js
@@ -0,0 +1,182 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  PositionInViewportEntryDef,
+  PositionObserverFidelity,
+} from '../../../src/service/position-observer/position-observer-worker';
+import {
+  PositionObserver, // eslint-disable-line no-unused-vars
+  installPositionObserverServiceForDoc,
+} from '../../../src/service/position-observer/position-observer-impl';
+import {RelativePositions} from '../../../src/layout-rect';
+import {Services} from '../../../src/services';
+import {devAssert} from '../../../src/log';
+
+/** @enum {number} */
+export const ViewportRelativePos = {
+  INSIDE_VIEWPORT: 0,
+  OUTSIDE_VIEWPORT: 1,
+  LEAVING_VIEWPORT: 2,
+  CONTAINS_VIEWPORT: 3,
+};
+
+export class VisibilityObserverEntry {
+  /**
+   * @param {!VisibilityObserver} observer
+   */
+  constructor(observer) {
+    /** @private {!VisibilityObserver} */
+    this.observer_ = observer;
+    /** @private {?RelativePositions} */
+    this.topSentinelPosition_ = null;
+    /** @private {?RelativePositions} */
+    this.bottomSentinelPosition_ = null;
+    /** @private {!ViewportRelativePos} */
+    this.relativePos_ = ViewportRelativePos.OUTSIDE_VIEWPORT;
+  }
+
+  /**
+   * @param {!Element} element
+   * @param {!Element} parent
+   * @param {function(!ViewportRelativePos)} callback
+   */
+  observe(element, parent, callback) {
+    const top = element.ownerDocument.createElement('div');
+    top.classList.add('i-amphtml-next-page-document-top-sentinel');
+    const bottom = element.ownerDocument.createElement('div');
+    bottom.classList.add('i-amphtml-next-page-document-bottom-sentinel');
+
+    parent.insertBefore(top, element);
+    parent.insertBefore(bottom, element.nextSibling);
+
+    this.observer_
+      .getPositionObserver()
+      .observe(top, PositionObserverFidelity.LOW, position =>
+        this.topSentinelPositionChanged(position, callback)
+      );
+    this.observer_
+      .getPositionObserver()
+      .observe(bottom, PositionObserverFidelity.LOW, position =>
+        this.bottomSentinelPositionChanged(position, callback)
+      );
+  }
+
+  /**
+   * Called when a position change is detected on the injected
+   * top sentinel element
+   * @param {?PositionInViewportEntryDef} position
+   * @param {function(!ViewportRelativePos)} callback
+   */
+  topSentinelPositionChanged(position, callback) {
+    const prevTopSentinelPosition = this.topSentinelPosition_;
+    if (!position || position.relativePos === prevTopSentinelPosition) {
+      return;
+    }
+    this.topSentinelPosition_ = position.relativePos;
+    this.updateRelativePos_(callback);
+  }
+
+  /**
+   * Called when a position change is detected on the injected
+   * bottom sentinel element
+   * @param {?PositionInViewportEntryDef} position
+   * @param {function(!ViewportRelativePos)} callback
+   */
+  bottomSentinelPositionChanged(position, callback) {
+    const prevBottomSentinelPosition = this.bottomSentinelPosition_;
+    if (!position || position.relativePos === prevBottomSentinelPosition) {
+      return;
+    }
+    this.bottomSentinelPosition_ = position.relativePos;
+    this.updateRelativePos_(callback);
+  }
+
+  /**
+   * Calculates the position of the element relative to the viewport
+   * based on the positions of the injected bottom and top sentinel elements
+   * @param {function(!ViewportRelativePos)} callback
+   * @private
+   */
+  updateRelativePos_(callback) {
+    const {topSentinelPosition_: top, bottomSentinelPosition_: bottom} = this;
+    const {INSIDE, TOP, BOTTOM} = RelativePositions;
+
+    devAssert(
+      top || bottom,
+      'scroll triggered without a top or bottom sentinel position'
+    );
+
+    if (top === INSIDE && bottom === INSIDE) {
+      // Both the top and bottom sentinel elements are within the
+      // viewport bounds meaning that the document is short enough
+      // to be contained inside the viewport
+      this.relativePos_ = ViewportRelativePos.INSIDE_VIEWPORT;
+    } else if ((!top || top === TOP) && (!bottom || bottom === BOTTOM)) {
+      // The head of the document is above the viewport and the
+      // foot of the document is below it, meaning that the viewport
+      // is looking at a section of the document
+      this.relativePos_ = ViewportRelativePos.CONTAINS_VIEWPORT;
+    } else if (
+      ((!top || top === TOP) && bottom === TOP) ||
+      (top === BOTTOM && (!bottom || bottom === BOTTOM))
+    ) {
+      // Both the top and the bottom of the document are either
+      // above or below the document meaning that the viewport hasn't
+      // reached the document yet or has passed it
+      this.relativePos_ = ViewportRelativePos.OUTSIDE_VIEWPORT;
+    } else {
+      // The remaining case is the case where the document is halfway
+      // through being scrolling into/out of the viewport in which case
+      // we don't need to update the visibility
+      this.relativePos_ = ViewportRelativePos.LEAVING_VIEWPORT;
+      return;
+    }
+
+    callback(this.relativePos_);
+  }
+}
+
+export default class VisibilityObserver {
+  /**
+   * @param {!../../../src/service/ampdoc-impl.AmpDoc} ampdoc
+   */
+  constructor(ampdoc) {
+    /** @private @const {!../../../src/service/ampdoc-impl.AmpDoc} */
+    this.ampdoc_ = ampdoc;
+    /** @private @const {Array<!VisibilityObserverEntry>} */
+    this.entries_ = [];
+  }
+
+  /**
+   * @param {!Element} element
+   * @param {!Element} parent
+   * @param {function(!ViewportRelativePos)} callback
+   */
+  observe(element, parent, callback) {
+    const entry = new VisibilityObserverEntry(this);
+    this.entries_.push(entry);
+    entry.observe(element, parent, callback);
+  }
+
+  /**
+   * @return {!PositionObserver}
+   */
+  getPositionObserver() {
+    installPositionObserverServiceForDoc(this.ampdoc_);
+    return Services.positionObserverForDoc(this.ampdoc_.getHeadNode());
+  }
+}
diff --git a/extensions/amp-next-page/amp-next-page.md b/extensions/amp-next-page/amp-next-page.md
index baf590f8ebac3..3b7058abf4b23 100644
--- a/extensions/amp-next-page/amp-next-page.md
+++ b/extensions/amp-next-page/amp-next-page.md
@@ -89,9 +89,42 @@ component will render a maximum of three documents (total) on screen at one sing
 
 [tip type="important"]
 **Important** [`<amp-analytics>`](../amp-analytics/amp-analytics.md) is [currently unsupported](https://github.com/ampproject/amphtml/issues/15807) on pages users land on through `<amp-next-page>`.
-Measuring pageviews is supported through [`<amp-pixel>`](../../builtins/amp-pixel.md).
+Tracking page views is supported through [`<amp-pixel>`](../../builtins/amp-pixel.md) or `<amp-analytics>` on the host page.
 [/tip]
 
+### Analytics triggers
+
+Partial support for analytics is included through the initial host page via two separate events. These are triggered by `<amp-next-page>` and you can track them in your [amp-analytics](https://amp.dev/documentation/components/amp-analytics) config:
+
+| Event                  | Fired when                                               |
+| ---------------------- | -------------------------------------------------------- |
+| `amp-next-page-scroll` | The user scrolls to a new page                           |
+| `amp-next-page-click`  | The user click on an article from the recommendation box |
+
+Both of the `triggers` provide the variables `fromUrl` and `toUrl` referring to the previous and current pages. They can be used as follows:
+
+```html
+<amp-analytics>
+  <script type="application/json">
+    {
+      "requests": {
+        "nextpage": "https://foo.com/pixel?RANDOM&toURL=${toURL}"
+      },
+      "triggers": {
+        "trackScrollThrough": {
+          "on": "amp-next-page-scroll",
+          "request": "nextpage"
+        },
+        "trackClickThrough": {
+          "on": "amp-next-page-click",
+          "request": "nextpage"
+        }
+      }
+    }
+  </script>
+</amp-analytics>
+```
+
 ### Recommendation box
 
 If the user reaches the end of a page before the next has loaded (or if the
diff --git a/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js b/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js
index b1319ef952463..882e753255be3 100644
--- a/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js
+++ b/extensions/amp-nexxtv-player/0.1/amp-nexxtv-player.js
@@ -65,7 +65,11 @@ class AmpNexxtvPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url(this.getVideoIframeSrc_(), opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      this.getVideoIframeSrc_(),
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-o2-player/0.1/amp-o2-player.js b/extensions/amp-o2-player/0.1/amp-o2-player.js
index 4c287e5d99ec6..a0c10165b64f8 100644
--- a/extensions/amp-o2-player/0.1/amp-o2-player.js
+++ b/extensions/amp-o2-player/0.1/amp-o2-player.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {dict} from '../../../src/utils/object';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {userAssert} from '../../../src/log';
@@ -44,7 +45,11 @@ class AmpO2Player extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(onLayout) {
-    this.preconnect.url(this.domain_, onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      this.domain_,
+      onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-ooyala-player/0.1/amp-ooyala-player.js b/extensions/amp-ooyala-player/0.1/amp-ooyala-player.js
index 0c6f5870ed5ee..44885fa89eb40 100644
--- a/extensions/amp-ooyala-player/0.1/amp-ooyala-player.js
+++ b/extensions/amp-ooyala-player/0.1/amp-ooyala-player.js
@@ -68,7 +68,11 @@ class AmpOoyalaPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://player.ooyala.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://player.ooyala.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-orientation-observer/0.1/amp-orientation-observer.js b/extensions/amp-orientation-observer/0.1/amp-orientation-observer.js
index 49adb4a66c96d..de6265c89f444 100644
--- a/extensions/amp-orientation-observer/0.1/amp-orientation-observer.js
+++ b/extensions/amp-orientation-observer/0.1/amp-orientation-observer.js
@@ -63,13 +63,13 @@ export class AmpOrientationObserver extends AMP.BaseElement {
     this.action_ = null;
 
     /** @private {Object<string, !Array<number>>} */
-    this.range_ = Object.assign({}, DEFAULT_RANGES);
+    this.range_ = {...DEFAULT_RANGES};
 
     /** @private {Object<string, number>} */
-    this.computedValue_ = Object.assign({}, DEFAULT_REST_VALUES);
+    this.computedValue_ = {...DEFAULT_REST_VALUES};
 
     /** @private {Object<string, number>} */
-    this.restValues_ = Object.assign({}, DEFAULT_REST_VALUES);
+    this.restValues_ = {...DEFAULT_REST_VALUES};
 
     /** @private {Object<string, !Array<number>>} */
     this.smoothingPoints_ = {beta: [], alpha: [], gamma: []};
diff --git a/extensions/amp-pinterest/0.1/amp-pinterest.js b/extensions/amp-pinterest/0.1/amp-pinterest.js
index 9c2ca768ecadb..6ffde052b1a06 100644
--- a/extensions/amp-pinterest/0.1/amp-pinterest.js
+++ b/extensions/amp-pinterest/0.1/amp-pinterest.js
@@ -36,9 +36,9 @@
 
 import {CSS} from '../../../build/amp-pinterest-0.1.css';
 import {FollowButton} from './follow-button';
-import {SaveButton} from './save-button';
-
 import {PinWidget} from './pin-widget';
+import {SaveButton} from './save-button';
+import {Services} from '../../../src/services';
 import {htmlFor} from '../../../src/static-template';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {user, userAssert} from '../../../src/log';
@@ -63,7 +63,11 @@ class AmpPinterest extends AMP.BaseElement {
    */
   preconnectCallback(onLayout) {
     // preconnect to widget APIpinMedia
-    this.preconnect.url('https://widgets.pinterest.com', onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://widgets.pinterest.com',
+      onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-playbuzz/0.1/amp-playbuzz.js b/extensions/amp-playbuzz/0.1/amp-playbuzz.js
index 67f15ac6906b1..354327d836448 100644
--- a/extensions/amp-playbuzz/0.1/amp-playbuzz.js
+++ b/extensions/amp-playbuzz/0.1/amp-playbuzz.js
@@ -89,7 +89,7 @@ class AmpPlaybuzz extends AMP.BaseElement {
    * @override
    */
   preconnectCallback() {
-    this.preconnect.url(this.iframeSrcUrl_);
+    Services.preconnectFor(this.win).url(this.getAmpDoc(), this.iframeSrcUrl_);
   }
 
   /** @override */
diff --git a/extensions/amp-position-observer/0.1/amp-position-observer.js b/extensions/amp-position-observer/0.1/amp-position-observer.js
index 6ea60727bfd46..590a5573c3e70 100644
--- a/extensions/amp-position-observer/0.1/amp-position-observer.js
+++ b/extensions/amp-position-observer/0.1/amp-position-observer.js
@@ -353,14 +353,17 @@ export class AmpVisibilityObserver extends AMP.BaseElement {
     let scene;
     if (this.targetId_) {
       scene = user().assertElement(
-        this.getAmpDoc().getElementById(this.targetId_),
+        // TODO(#22733): Change back to this.getAmpDoc once ampdoc-fie
+        // experiment is launched.
+        this.win.document.getElementById(this.targetId_),
         'No element found with id:' + this.targetId_
       );
     } else {
       scene = this.element.parentNode;
     }
-    // Hoist body to documentElement.
-    if (this.getAmpDoc().getBody() == scene) {
+    // Hoist body to documentElement, expected to work for both ampdoc and
+    // amp4ads in friendly iframe.
+    if (this.win.document.body === scene) {
       scene = this.win.document.documentElement;
     }
 
diff --git a/extensions/amp-position-observer/0.1/test-e2e/test-amp-position-observer.js b/extensions/amp-position-observer/0.1/test-e2e/test-scrollbound-animation.js
similarity index 100%
rename from extensions/amp-position-observer/0.1/test-e2e/test-amp-position-observer.js
rename to extensions/amp-position-observer/0.1/test-e2e/test-scrollbound-animation.js
diff --git a/extensions/amp-position-observer/0.1/test-e2e/test-target-id.js b/extensions/amp-position-observer/0.1/test-e2e/test-target-id.js
new file mode 100644
index 0000000000000..04327f1cef6ea
--- /dev/null
+++ b/extensions/amp-position-observer/0.1/test-e2e/test-target-id.js
@@ -0,0 +1,89 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describes.endtoend(
+  'amp-position-observer target in AMPHTML ad',
+  {
+    testUrl:
+      'http://localhost:8000/test/fixtures/e2e/amp-position-observer/target-id.html',
+    environments: 'amp4ads-preset',
+    initialRect: {width: 800, height: 600},
+  },
+  testScroll
+);
+
+async function testScroll(env) {
+  let controller;
+
+  beforeEach(() => {
+    controller = env.controller;
+  });
+
+  it('should animate clock hand while scrolling', async () => {
+    const step = 50;
+    const initPoint = {
+      'width': 45,
+      'height': 48,
+      'x': 151,
+      'y': 190,
+    };
+    const midPoint = {
+      'width': 33,
+      'height': 56,
+      'x': 150,
+      'y': 191,
+    };
+    const endPoint = {
+      'width': 18,
+      'height': 60,
+      'x': 150,
+      'y': 192,
+    };
+    await verifyClockHandRect(controller, initPoint);
+    await scrollParentWindowYBy(controller, step);
+    await verifyClockHandRect(controller, midPoint);
+    await scrollParentWindowYBy(controller, step);
+    await verifyClockHandRect(controller, endPoint);
+    await scrollParentWindowYBy(controller, -step);
+    await verifyClockHandRect(controller, midPoint);
+    await scrollParentWindowYBy(controller, -step);
+    await verifyClockHandRect(controller, initPoint);
+  });
+}
+
+async function scrollParentWindowYBy(controller, px) {
+  await controller.switchToParent();
+  const article = await controller.getDocumentElement();
+  await controller.scrollBy(article, {top: px});
+  await controller
+    .findElement('iframe')
+    .then(frame => controller.switchToFrame(frame));
+}
+
+async function verifyClockHandRect(controller, rect) {
+  const clockHand = await controller.findElement('.clock-hand');
+  const delta = controller
+    .getElementRect(clockHand)
+    .then(clockRect =>
+      Math.max(
+        Math.abs(clockRect.x - rect.x),
+        Math.abs(clockRect.y - rect.y),
+        Math.abs(clockRect.width - rect.width),
+        Math.abs(clockRect.height - rect.height)
+      )
+    );
+  await expect(delta).to.be.below(2);
+}
diff --git a/extensions/amp-powr-player/0.1/amp-powr-player.js b/extensions/amp-powr-player/0.1/amp-powr-player.js
index 46fbbce16d13d..d2fcd82705f41 100644
--- a/extensions/amp-powr-player/0.1/amp-powr-player.js
+++ b/extensions/amp-powr-player/0.1/amp-powr-player.js
@@ -87,7 +87,10 @@ class AmpPowrPlayer extends AMP.BaseElement {
 
   /** @override */
   preconnectCallback() {
-    this.preconnect.url('https://player.powr.com');
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://player.powr.com'
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-reach-player/0.1/amp-reach-player.js b/extensions/amp-reach-player/0.1/amp-reach-player.js
index 3dfdfd5b2a24c..10f5acf919b3e 100644
--- a/extensions/amp-reach-player/0.1/amp-reach-player.js
+++ b/extensions/amp-reach-player/0.1/amp-reach-player.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {isLayoutSizeDefined} from '../../../src/layout';
 
 class AmpReachPlayer extends AMP.BaseElement {
@@ -30,7 +31,11 @@ class AmpReachPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://player-cdn.beachfrontmedia.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://player-cdn.beachfrontmedia.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-recaptcha-input/0.1/test/test-amp-recaptcha-input.js b/extensions/amp-recaptcha-input/0.1/test/test-amp-recaptcha-input.js
index 5e10bd1a348b1..56dc9cff9b7f6 100644
--- a/extensions/amp-recaptcha-input/0.1/test/test-amp-recaptcha-input.js
+++ b/extensions/amp-recaptcha-input/0.1/test/test-amp-recaptcha-input.js
@@ -62,10 +62,7 @@ describes.realWin(
 
     describe('amp-recaptcha-input', () => {
       it('Rejects because data-name is missing', () => {
-        const ampRecaptchaInputConfig = Object.assign(
-          {},
-          ampRecaptchaInputAttributes
-        );
+        const ampRecaptchaInputConfig = {...ampRecaptchaInputAttributes};
         delete ampRecaptchaInputConfig['name'];
 
         return allowConsoleError(() => {
@@ -78,10 +75,7 @@ describes.realWin(
       });
 
       it('Rejects because data-sitekey is missing', () => {
-        const ampRecaptchaInputConfig = Object.assign(
-          {},
-          ampRecaptchaInputAttributes
-        );
+        const ampRecaptchaInputConfig = {...ampRecaptchaInputAttributes};
         delete ampRecaptchaInputConfig['data-sitekey'];
 
         return allowConsoleError(() => {
@@ -94,10 +88,7 @@ describes.realWin(
       });
 
       it('Rejects because data-action is missing', () => {
-        const ampRecaptchaInputConfig = Object.assign(
-          {},
-          ampRecaptchaInputAttributes
-        );
+        const ampRecaptchaInputConfig = {...ampRecaptchaInputAttributes};
         delete ampRecaptchaInputConfig['data-action'];
 
         return allowConsoleError(() => {
diff --git a/extensions/amp-redbull-player/0.1/amp-redbull-player.js b/extensions/amp-redbull-player/0.1/amp-redbull-player.js
new file mode 100644
index 0000000000000..edff56d97b07b
--- /dev/null
+++ b/extensions/amp-redbull-player/0.1/amp-redbull-player.js
@@ -0,0 +1,303 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {
+  SandboxOptions,
+  createFrameFor,
+  isJsonOrObj,
+  objOrParseJson,
+  originMatches,
+} from '../../../src/iframe-video';
+import {Services} from '../../../src/services';
+import {VideoEvents} from '../../../src/video-interface';
+import {addParamsToUrl} from '../../../src/url';
+import {dict} from '../../../src/utils/object';
+import {disableScrollingOnIframe} from '../../../src/iframe-helper';
+import {getData, listen} from '../../../src/event-helper';
+import {getDataParamsFromAttributes, removeElement} from '../../../src/dom';
+import {installVideoManagerForDoc} from '../../../src/service/video-manager-impl';
+import {isLayoutSizeDefined} from '../../../src/layout';
+import {userAssert} from '../../../src/log';
+
+/** @private @const */
+const TAG = 'amp-redbull-player';
+
+/** @private @const */
+const ANALYTICS_EVENT_TYPE_PREFIX = 'video-custom-';
+
+/** @private @const */
+const SANDBOX = [
+  SandboxOptions.ALLOW_SCRIPTS,
+  SandboxOptions.ALLOW_SAME_ORIGIN,
+  SandboxOptions.ALLOW_POPUPS,
+  SandboxOptions.ALLOW_POPUPS_TO_ESCAPE_SANDBOX,
+  SandboxOptions.ALLOW_TOP_NAVIGATION_BY_USER_ACTIVATION,
+];
+
+/** @implements {../../../src/video-interface.VideoInterface} */
+class AmpRedBullPlayer extends AMP.BaseElement {
+  /** @param {!AmpElement} element */
+  constructor(element) {
+    super(element);
+
+    /** @private {?Element} */
+    this.iframe_ = null;
+
+    /** @private {!UnlistenDef|null} */
+    this.unlistenFrame_ = null;
+
+    /** @private {string} */
+    this.tagId_ = '';
+
+    /**
+     * @param {!Event} e
+     * @return {undefined}
+     * @private
+     */
+    this.boundOnMessage_ = e => this.onMessage_(e);
+  }
+
+  /** @override */
+  isLayoutSupported(layout) {
+    return isLayoutSizeDefined(layout);
+  }
+
+  /** @override */
+  buildCallback() {
+    const {element} = this;
+
+    /*
+     * Required Paramaters: data-param-videoid
+     * Break creation if required parameters are missing!
+     */
+    userAssert(
+      element.getAttribute('data-param-videoid'),
+      'The data-param-videoid attribute is required for %s',
+      element
+    );
+
+    this.tagId_ = element.getAttribute('id') || 'rbvideo';
+
+    installVideoManagerForDoc(element);
+  }
+
+  /** @override */
+  layoutCallback() {
+    const {element} = this;
+
+    const params = getDataParamsFromAttributes(element);
+    const videoId = params['videoid'];
+    const skinId = params['skinid'] || 'com';
+    const locale = params['locale'] || 'global';
+
+    const origin = 'https://player.redbull.com/amp/amp-iframe.html';
+
+    const src = addParamsToUrl(
+      origin,
+      dict({
+        'videoId': videoId,
+        'skinId': skinId,
+        'ampTagId': this.tagId_,
+        'locale': locale,
+      })
+    );
+
+    this.iframe_ = disableScrollingOnIframe(
+      createFrameFor(this, src, '', SANDBOX)
+    );
+
+    this.unlistenFrame_ = listen(this.win, 'message', this.boundOnMessage_);
+    return this.loadPromise(this.iframe_).then(() => {
+      this.onReady_();
+    });
+  }
+
+  /** @private */
+  onReady_() {
+    Services.videoManagerForDoc(this.element).register(this);
+    this.iframe_.contentWindow./*OK*/ postMessage(
+      JSON.stringify(
+        dict({
+          'msg': 'amp-loaded',
+          'id': `${TAG}-${this.tagId_}`,
+        })
+      ),
+      '*'
+    );
+  }
+
+  /** @override */
+  unlayoutCallback() {
+    this.removeIframe_();
+    return true;
+  }
+
+  /** @private */
+  removeIframe_() {
+    if (this.iframe_) {
+      removeElement(this.iframe_);
+      this.iframe_ = null;
+    }
+    if (this.unlistenFrame_) {
+      this.unlistenFrame_();
+      this.unlistenFrame_ = null;
+    }
+  }
+
+  /**
+   * @param {!Event} event
+   * @private
+   */
+  originMatches_(event) {
+    return originMatches(event, this.iframe_, /.*/);
+  }
+
+  /**
+   * @param {!Event} event
+   * @private
+   */
+  onMessage_(event) {
+    if (!this.iframe_) {
+      return;
+    }
+
+    if (!this.originMatches_(event)) {
+      return;
+    }
+
+    const eventData = getData(event);
+    if (!isJsonOrObj(eventData)) {
+      return;
+    }
+
+    const data = objOrParseJson(eventData);
+
+    if (data['id'] === `redbull-amp-video-tracking-${this.tagId_}`) {
+      const type = ANALYTICS_EVENT_TYPE_PREFIX + data['type'];
+      this.dispatchCustomAnalyticsEvent_(type, data);
+    }
+  }
+
+  /**
+   * @param {string} eventType The eventType must be prefixed with video-custom- to prevent naming collisions with other analytics event types.
+   * @param {!Object<string, string>=} vars
+   */
+  dispatchCustomAnalyticsEvent_(eventType, vars) {
+    this.element.dispatchCustomEvent(
+      VideoEvents.CUSTOM_TICK,
+      dict({
+        'eventType': `video-custom-tracking-${this.tagId_}`,
+        'vars': vars,
+      })
+    );
+  }
+
+  /** @override */
+  isInteractive() {
+    return true;
+  }
+
+  /** @override */
+  supportsPlatform() {
+    return true;
+  }
+
+  /** @override */
+  preimplementsMediaSessionAPI() {
+    return false;
+  }
+
+  /** @override */
+  preimplementsAutoFullscreen() {
+    return false;
+  }
+
+  /** @override */
+  getCurrentTime() {
+    // Not supported.
+    return NaN;
+  }
+
+  /** @override */
+  getDuration() {
+    // Not supported.
+    return NaN;
+  }
+
+  /** @override */
+  getMetadata() {
+    // Not supported.
+  }
+
+  /** @override */
+  getPlayedRanges() {
+    // Not supported.
+    return [];
+  }
+
+  /** @override */
+  play(unusedIsAutoplay) {
+    // Not supported
+  }
+
+  /** @override */
+  pause() {
+    // Not supported
+  }
+
+  /** @override */
+  mute() {
+    // Not supported
+  }
+
+  /** @override */
+  unmute() {
+    // Not supported
+  }
+
+  /** @override */
+  showControls() {
+    // Not supported
+  }
+
+  /** @override */
+  hideControls() {
+    // Not supported
+  }
+
+  /** @override */
+  fullscreenEnter() {
+    // Not supported
+  }
+
+  /** @override */
+  fullscreenExit() {
+    // Not supported
+  }
+
+  /** @override */
+  isFullscreen() {
+    return false;
+  }
+
+  /** @override */
+  seekTo(unusedTimeSeconds) {
+    // Not supported
+  }
+}
+
+AMP.extension(TAG, '0.1', AMP => {
+  AMP.registerElement(TAG, AmpRedBullPlayer);
+});
diff --git a/extensions/amp-redbull-player/0.1/test/test-amp-redbull.js b/extensions/amp-redbull-player/0.1/test/test-amp-redbull.js
new file mode 100644
index 0000000000000..ea71a63f5d0ad
--- /dev/null
+++ b/extensions/amp-redbull-player/0.1/test/test-amp-redbull.js
@@ -0,0 +1,72 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import '../amp-redbull-player';
+
+describes.realWin(
+  'amp-redbull-player',
+  {
+    amp: {
+      extensions: ['amp-redbull-player'],
+    },
+  },
+  env => {
+    let win, doc;
+    beforeEach(() => {
+      win = env.win;
+      doc = win.document;
+    });
+
+    function getRedBullElement(videoId) {
+      const player = doc.createElement('amp-redbull-player');
+
+      if (videoId) {
+        player.setAttribute('data-param-videoid', videoId);
+      }
+
+      player.setAttribute('width', '222');
+      player.setAttribute('height', '111');
+      player.setAttribute('layout', 'responsive');
+
+      doc.body.appendChild(player);
+      return player.build().then(() => {
+        player.layoutCallback();
+        return player;
+      });
+    }
+
+    it('renders the Red Bull player', async () => {
+      const player = await getRedBullElement(
+        'rrn:content:videos:3965a26c-052e-575f-a28b-ded6bee23ee1:en-INT'
+      );
+      const playerIframe = player.querySelector('iframe');
+      expect(playerIframe).to.not.be.null;
+      expect(playerIframe.src).to.equal(
+        'https://player.redbull.com/amp/amp-iframe.html?videoId=' +
+          encodeURIComponent(
+            'rrn:content:videos:3965a26c-052e-575f-a28b-ded6bee23ee1:en-INT'
+          ) +
+          '&skinId=com&ampTagId=rbvideo&locale=global'
+      );
+    });
+
+    it('fails without videoId', () => {
+      return getRedBullElement(null).should.eventually.be.rejectedWith(
+        /The data-param-videoid attribute is required/
+      );
+    });
+  }
+);
diff --git a/extensions/amp-redbull-player/0.1/test/validator-amp-redbull.html b/extensions/amp-redbull-player/0.1/test/validator-amp-redbull.html
new file mode 100644
index 0000000000000..fd4704d4f3917
--- /dev/null
+++ b/extensions/amp-redbull-player/0.1/test/validator-amp-redbull.html
@@ -0,0 +1,51 @@
+<!--
+  Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+  Tests for the amp-redbull-player tag. See the inline comments.
+-->
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <link rel="canonical" href="./regular-html-version.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-redbull-player" data-amp-report-test="amp-redbull-player" src="https://cdn.ampproject.org/v0/amp-redbull-player-0.1.js"></script>
+</head>
+<body>
+    <!-- Valid implementation -->
+    <amp-redbull-player
+      id="rbvideo_1"
+      data-param-videoid="rrn:content:videos:3965a26c-052e-575f-a28b-ded6bee23ee1:en-INT"
+      data-param-locale="us"
+      height="169"
+      width="300"
+      layout="fixed">
+    </amp-redbull-player><br/>
+    <!-- Valid implementation -->
+    <amp-redbull-player
+      id="rbvideo_2"
+      data-param-videoid="rrn:content:videos:3e27acc3-2fd2-44f4-9d6f-c1ec0ff587f1:en-INT"
+      data-param-locale="at"
+      data-param-skinid="com"
+      height=200
+      width=400
+      layout="fixed">
+    </amp-redbull-player>
+</body>
+</html>
diff --git a/extensions/amp-redbull-player/0.1/test/validator-amp-redbull.out b/extensions/amp-redbull-player/0.1/test/validator-amp-redbull.out
new file mode 100644
index 0000000000000..7202b5e0661c8
--- /dev/null
+++ b/extensions/amp-redbull-player/0.1/test/validator-amp-redbull.out
@@ -0,0 +1,52 @@
+PASS
+|  <!--
+|    Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+|
+|    Licensed under the Apache License, Version 2.0 (the "License");
+|    you may not use this file except in compliance with the License.
+|    You may obtain a copy of the License at
+|
+|        http://www.apache.org/licenses/LICENSE-2.0
+|
+|    Unless required by applicable law or agreed to in writing, software
+|    distributed under the License is distributed on an "AS-IS" BASIS,
+|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+|    See the License for the specific language governing permissions and
+|    limitations under the license.
+|  -->
+|  <!--
+|    Test Description:
+|    Tests for the amp-redbull-player tag. See the inline comments.
+|  -->
+|  <!doctype html>
+|  <html ⚡>
+|  <head>
+|    <meta charset="utf-8">
+|    <link rel="canonical" href="./regular-html-version.html">
+|    <meta name="viewport" content="width=device-width,minimum-scale=1">
+|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+|    <script async src="https://cdn.ampproject.org/v0.js"></script>
+|    <script async custom-element="amp-redbull-player" data-amp-report-test="amp-redbull-player" src="https://cdn.ampproject.org/v0/amp-redbull-player-0.1.js"></script>
+|  </head>
+|  <body>
+|      <!-- Valid implementation -->
+|      <amp-redbull-player
+|        id="rbvideo_1"
+|        data-param-videoid="rrn:content:videos:3965a26c-052e-575f-a28b-ded6bee23ee1:en-INT"
+|        data-param-locale="us"
+|        height="169"
+|        width="300"
+|        layout="fixed">
+|      </amp-redbull-player><br/>
+|      <!-- Valid implementation -->
+|      <amp-redbull-player
+|        id="rbvideo_2"
+|        data-param-videoid="rrn:content:videos:3e27acc3-2fd2-44f4-9d6f-c1ec0ff587f1:en-INT"
+|        data-param-locale="at"
+|        data-param-skinid="com"
+|        height=200
+|        width=400
+|        layout="fixed">
+|      </amp-redbull-player>
+|  </body>
+|  </html>
diff --git a/extensions/amp-redbull-player/OWNERS b/extensions/amp-redbull-player/OWNERS
new file mode 100644
index 0000000000000..fd418f4fb2e74
--- /dev/null
+++ b/extensions/amp-redbull-player/OWNERS
@@ -0,0 +1,10 @@
+// For an explanation of the OWNERS rules and syntax, see:
+// https://github.com/ampproject/amp-github-apps/blob/master/owners/OWNERS.example
+
+{
+  rules: [
+    {
+      owners: [{name: 'wklopf'}, {name: 'ampproject/wg-ui-and-a11y'}],
+    },
+  ],
+}
diff --git a/extensions/amp-redbull-player/amp-redbull-player.md b/extensions/amp-redbull-player/amp-redbull-player.md
new file mode 100644
index 0000000000000..97df46d0af28b
--- /dev/null
+++ b/extensions/amp-redbull-player/amp-redbull-player.md
@@ -0,0 +1,78 @@
+---
+$category@: media
+formats:
+  - websites
+teaser:
+  text: Displays an Red Bull video.
+---
+
+<!---
+Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# amp-redbull-player
+
+Displays a <a href="https://player.redbull.com/demo/index.html">Red Bull Video Player</a>.
+
+<table>
+  <tr>
+    <td width="40%"><strong>Required Script</strong></td>
+    <td><code>&lt;script async custom-element="amp-redbull-player" src="https://cdn.ampproject.org/v0/amp-redbull-player-0.1.js">&lt;/script></code></td>
+  </tr>
+  <tr>
+    <td class="col-fourty"><strong><a href="https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/control_layout">Supported Layouts</a></strong></td>
+    <td>fill, fixed, fixed-height, flex-item, nodisplay, responsive</td>
+  </tr>
+</table>
+
+[TOC]
+
+## Example
+
+```html
+<amp-redbull-player
+  id="rbvideo"
+  data-param-videoid="rrn:content:videos:3965a26c-052e-575f-a28b-ded6bee23ee1:en-INT"
+  data-param-skinid="com"
+  data-param-locale="en"
+  height="360"
+  width="640"
+></amp-redbull-player>
+```
+
+## Attributes
+
+<table>
+  <tr>
+    <td width="40%"><strong>data-param-videoid (required)</strong></td>
+    <td>The video ID</a>.</td>
+  </tr>
+  <tr>
+    <td width="40%"><strong>data-param-skinid (optional)</strong></td>
+    <td>The ID of the skin to display. Value can be stv or com. Defaults to com</td>
+  </tr>
+  <tr>
+    <td width="40%"><strong>data-param-locale (optional)</strong></td>
+    <td>String value for the tracking configuration.</a>.</td>
+  </tr>
+  <tr>
+    <td width="40%"><strong>id (optional)</strong></td>
+    <td>Selector for the amp-analytics triggers configuration.</td>
+  </tr>
+</table>
+
+## Validation
+
+See [amp-redbull-player rules]`(https://github.com/ampproject/amphtml/blob/master/extensions/amp-redbull-player/validator-amp-player-player.protoascii)` in the AMP validator specification.
diff --git a/extensions/amp-redbull-player/validator-amp-redbull-player.protoascii b/extensions/amp-redbull-player/validator-amp-redbull-player.protoascii
new file mode 100644
index 0000000000000..8ee98822d6fe5
--- /dev/null
+++ b/extensions/amp-redbull-player/validator-amp-redbull-player.protoascii
@@ -0,0 +1,45 @@
+#
+# Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS-IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the license.
+#
+
+tags: {  # amp-redbull-player
+  html_format: AMP
+  tag_name: "SCRIPT"
+  extension_spec: {
+    name: "amp-redbull-player"
+    version: "0.1"
+    version: "latest"
+  }
+  attr_lists: "common-extension-attrs"
+}
+tags: {  # <amp-redbull-player>
+  html_format: AMP
+  tag_name: "AMP-REDBULL-PLAYER"
+  requires_extension: "amp-redbull-player"
+  attrs: {
+    name: "data-param-videoid"
+    mandatory: true
+  }
+  attr_lists: "extended-amp-global"
+  amp_layout: {
+    supported_layouts: FIXED
+    supported_layouts: FIXED_HEIGHT
+    supported_layouts: RESPONSIVE
+    supported_layouts: FILL
+    supported_layouts: FLEX_ITEM
+    supported_layouts: FLUID
+    supported_layouts: INTRINSIC
+  }
+}
diff --git a/extensions/amp-reddit/0.1/amp-reddit.js b/extensions/amp-reddit/0.1/amp-reddit.js
index e6502915ace97..1e756c9769ef4 100644
--- a/extensions/amp-reddit/0.1/amp-reddit.js
+++ b/extensions/amp-reddit/0.1/amp-reddit.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {getIframe, preloadBootstrap} from '../../../src/3p-frame';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {listenFor} from '../../../src/iframe-helper';
@@ -25,28 +26,32 @@ class AmpReddit extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(onLayout) {
+    const preconnect = Services.preconnectFor(this.win);
+    const ampdoc = this.getAmpDoc();
     // Required urls and scripts are different for comments and posts.
     if (this.element.getAttribute('data-embedtype') === 'comment') {
       // The domain for static comment permalinks.
-      this.preconnect.url('https://www.redditmedia.com', onLayout);
+      preconnect.url(ampdoc, 'https://www.redditmedia.com', onLayout);
       // The domain for JS and CSS used in rendering embeds.
-      this.preconnect.url('https://www.redditstatic.com', onLayout);
-      this.preconnect.preload(
+      preconnect.url(ampdoc, 'https://www.redditstatic.com', onLayout);
+      preconnect.preload(
+        ampdoc,
         'https://www.redditstatic.com/comment-embed.js',
         'script'
       );
     } else {
       // Posts don't use the static domain.
-      this.preconnect.url('https://www.reddit.com', onLayout);
+      preconnect.url(ampdoc, 'https://www.reddit.com', onLayout);
       // Posts defer to the embedly API.
-      this.preconnect.url('https://cdn.embedly.com', onLayout);
-      this.preconnect.preload(
+      preconnect.url(ampdoc, 'https://cdn.embedly.com', onLayout);
+      preconnect.preload(
+        ampdoc,
         'https://embed.redditmedia.com/widgets/platform.js',
         'script'
       );
     }
 
-    preloadBootstrap(this.win, this.preconnect);
+    preloadBootstrap(this.win, ampdoc, preconnect);
   }
 
   /** @override */
diff --git a/extensions/amp-script/0.1/amp-script.js b/extensions/amp-script/0.1/amp-script.js
index 2f1c79dac806b..b698cf287c9c3 100644
--- a/extensions/amp-script/0.1/amp-script.js
+++ b/extensions/amp-script/0.1/amp-script.js
@@ -16,13 +16,8 @@
 
 import * as WorkerDOM from '@ampproject/worker-dom/dist/amp/main.mjs';
 import {CSS} from '../../../build/amp-script-0.1.css';
-import {
-  DomPurifyDef,
-  createPurifier,
-  getAllowedTags,
-  validateAttributeChange,
-} from '../../../src/purifier';
 import {Layout, isLayoutSizeDefined} from '../../../src/layout';
+import {Purifier} from '../../../src/purifier/purifier';
 import {Services} from '../../../src/services';
 import {UserActivationTracker} from './user-activation-tracker';
 import {calculateExtensionScriptUrl} from '../../../src/service/extension-location';
@@ -46,11 +41,6 @@ const TAG = 'amp-script';
  */
 const MAX_TOTAL_SCRIPT_SIZE = 150000;
 
-/**
- * Size-contained elements up to 300px are allowed to mutate freely.
- */
-const MAX_FREE_MUTATION_HEIGHT = 300;
-
 /**
  * See src/transfer/Phase.ts in worker-dom.
  * @enum {number}
@@ -94,6 +84,9 @@ export class AmpScript extends AMP.BaseElement {
     /** @private {string} */
     this.debugId_ = 'amp-script[unknown].js';
 
+    /** @private {boolean} */
+    this.layoutCompleted_ = false;
+
     /**
      * If true, most production constraints are disabled including script size,
      * script hash sum for local scripts, etc. Default is false.
@@ -119,10 +112,9 @@ export class AmpScript extends AMP.BaseElement {
      */
     const htmlEl = this.element.ownerDocument.documentElement;
     this.development_ =
-      this.element.hasAttribute('development') ||
-      (htmlEl.hasAttribute('data-ampdevmode') &&
-        closestAncestorElementBySelector(this.element, '[data-ampdevmode]') !=
-          htmlEl);
+      htmlEl.hasAttribute('data-ampdevmode') &&
+      closestAncestorElementBySelector(this.element, '[data-ampdevmode]') !=
+        htmlEl;
 
     if (this.development_) {
       user().warn(
@@ -144,6 +136,24 @@ export class AmpScript extends AMP.BaseElement {
     });
   }
 
+  /**
+   * @override
+   */
+  onMeasureChanged() {
+    if (this.layoutCompleted_) {
+      return;
+    }
+
+    const {width, height} = this.getLayoutBox();
+    if (width === 0 && height === 0) {
+      user().warn(
+        TAG,
+        'Skipped initializing amp-script due to zero width and height.',
+        this.element
+      );
+    }
+  }
+
   /**
    * @param {!AmpScriptService} service
    * @visibleForTesting
@@ -152,8 +162,35 @@ export class AmpScript extends AMP.BaseElement {
     this.service_ = service;
   }
 
+  /**
+   * @return {?UserActivationTracker}
+   * @visibleForTesting
+   */
+  getUserActivation() {
+    return this.userActivation_;
+  }
+
   /** @override */
   layoutCallback() {
+    this.layoutCompleted_ = true;
+
+    // Layouts that use sizers (responsive, fluid) require the worker-dom
+    // subtree to be wrapped in a "fill content" container. This is because
+    // these layouts do _not_ constrain the size of the amp-script element
+    // via inline styles (they use sizerElement). However, this breaks
+    // "container" layout so only do it selectively.
+    let container;
+    if (this.element.sizerElement) {
+      container = this.win.document.createElement('div');
+      this.applyFillContent(container, true);
+      // Reparent all real children to the container.
+      const realChildren = this.getRealChildren();
+      for (let i = 0; i < realChildren.length; i++) {
+        container.appendChild(realChildren[i]);
+      }
+      this.element.appendChild(container);
+    }
+
     this.userActivation_ = new UserActivationTracker(this.element);
 
     // The displayed name of the combined script in dev tools.
@@ -202,7 +239,7 @@ export class AmpScript extends AMP.BaseElement {
         this.userActivation_.expandLongTask(promise);
         // TODO(dvoytenko): consider additional "progress" UI.
       },
-      sanitizer: new SanitizerImpl(this.win, this.element, sandboxTokens),
+      sanitizer: new SanitizerImpl(this, sandboxTokens),
       // Callbacks.
       onCreateWorker: data => {
         dev().info(TAG, 'Create worker:', data);
@@ -216,11 +253,13 @@ export class AmpScript extends AMP.BaseElement {
     };
 
     // Create worker and hydrate.
-    WorkerDOM.upgrade(this.element, workerAndAuthorScripts, config).then(
-      workerDom => {
-        this.workerDom_ = workerDom;
-      }
-    );
+    WorkerDOM.upgrade(
+      container || this.element,
+      workerAndAuthorScripts,
+      config
+    ).then(workerDom => {
+      this.workerDom_ = workerDom;
+    });
     return workerAndAuthorScripts;
   }
 
@@ -346,6 +385,22 @@ export class AmpScript extends AMP.BaseElement {
     return docOrigin === scriptOrigin;
   }
 
+  /**
+   * Returns true if mutations should be allowed based on container attributes.
+   * @return {boolean}
+   */
+  isMutationAllowedByFixedSize() {
+    return isLayoutSizeDefined(this.getLayout());
+  }
+
+  /**
+   * Returns true if mutations should be allowed based on recent user gesture.
+   * @return {boolean}
+   */
+  isMutationAllowedByUserGesture() {
+    return this.userActivation_.isActive();
+  }
+
   /**
    * @param {function()} flush
    * @param {number} phase
@@ -360,11 +415,8 @@ export class AmpScript extends AMP.BaseElement {
     const allowMutation =
       // Hydration is always allowed.
       phase != Phase.MUTATING ||
-      // Mutation depends on the gesture state and long tasks.
-      this.userActivation_.isActive() ||
-      // If the element is size-contained and small enough.
-      (isLayoutSizeDefined(this.getLayout()) &&
-        this.getLayoutBox().height <= MAX_FREE_MUTATION_HEIGHT);
+      this.isMutationAllowedByFixedSize() ||
+      this.isMutationAllowedByUserGesture();
 
     if (allowMutation) {
       this.vsync_.mutate(flush);
@@ -476,22 +528,38 @@ const FORM_ELEMENTS = [
  */
 export class SanitizerImpl {
   /**
-   * @param {!Window} win
-   * @param {!Element} element
+   * @param {!AmpScript} ampScript
    * @param {!Array<string>} sandboxTokens
    */
-  constructor(win, element, sandboxTokens) {
+  constructor(ampScript, sandboxTokens) {
     /** @private @const {!Window} */
-    this.win_ = win;
+    this.win_ = ampScript.win;
 
     /** @private @const {!Element} */
-    this.element_ = element;
+    this.element_ = ampScript.element;
 
-    /** @private @const {!DomPurifyDef} */
-    this.purifier_ = createPurifier(win.document, dict({'IN_PLACE': true}));
+    /** @private @const {!Purifier} */
+    this.purifier_ = new Purifier(
+      ampScript.win.document,
+      dict({'IN_PLACE': true}),
+      rewriteAttributeValue
+    );
 
     /** @private @const {!Object<string, boolean>} */
-    this.allowedTags_ = getAllowedTags();
+    this.allowedTags_ = this.purifier_.getAllowedTags();
+
+    /**
+     * @private
+     * @return {boolean}
+     */
+    this.allowFullEval_ = () => ampScript.isMutationAllowedByUserGesture();
+
+    /**
+     * @private
+     * @return {boolean}
+     */
+    this.shouldConstrainEval_ = () =>
+      !this.allowFullEval_() && ampScript.isMutationAllowedByFixedSize();
 
     // TODO(choumx): Support opt-in for variable substitutions.
     // For now, only allow built-in AMP components except amp-pixel.
@@ -541,7 +609,7 @@ export class SanitizerImpl {
     // that the tag itself is valid. E.g. a[href] is ok, but base[href] is not.
     if (this.allowedTags_[tag]) {
       const attr = attribute.toLowerCase();
-      if (validateAttributeChange(this.purifier_, node, attr, value)) {
+      if (this.purifier_.validateAttributeChange(node, attr, value)) {
         if (value == null) {
           node.removeAttribute(attr);
         } else {
@@ -591,7 +659,7 @@ export class SanitizerImpl {
 
     // worker-dom's supported properties and corresponding attribute name
     // differences are minor, e.g. acceptCharset vs. accept-charset.
-    if (validateAttributeChange(this.purifier_, node, prop, value)) {
+    if (this.purifier_.validateAttributeChange(node, prop, value)) {
       node[property] = value;
       return true;
     }
@@ -640,7 +708,23 @@ export class SanitizerImpl {
             dev().error(TAG, 'Invalid AMP.setState() argument: %s', value);
           });
           if (state) {
-            bind.setState(state, /* skipEval */ true, /* skipAmpState */ false);
+            // Only evaluate updates in case of recent user interaction or a small fixed layout.
+            const fullEval = this.allowFullEval_();
+            const constrain = this.shouldConstrainEval_()
+              ? [this.element_]
+              : undefined;
+
+            if (!fullEval && !constrain) {
+              user().warn(
+                TAG,
+                'AMP.setState only updated page state and did not reevaluate bindings due to lack of recent user interaction.'
+              );
+            }
+            bind.setState(state, {
+              skipEval: !fullEval && !constrain,
+              skipAmpState: false,
+              constrain,
+            });
           }
         }
       });
diff --git a/extensions/amp-script/0.1/test-e2e/test-amp-script.js b/extensions/amp-script/0.1/test-e2e/test-amp-script.js
index f0518d2b93405..3b36e624e07c6 100644
--- a/extensions/amp-script/0.1/test-e2e/test-amp-script.js
+++ b/extensions/amp-script/0.1/test-e2e/test-amp-script.js
@@ -17,7 +17,8 @@
 describes.endtoend(
   'amp-script e2e',
   {
-    testUrl: 'http://localhost:8000/test/manual/amp-script/test1.amp.html',
+    testUrl:
+      'http://localhost:8000/test/fixtures/e2e/amp-script/basic.amp.html',
     initialRect: {width: 600, height: 600},
     environments: ['single'],
     browsers: ['chrome', 'safari'],
@@ -51,5 +52,26 @@ describes.endtoend(
       const h1 = await controller.findElement('h1');
       await expect(controller.getElementText(h1)).to.equal('Hello World!');
     });
+
+    // In layout=responsive|fluid, amp-script creates a fill-content container
+    // div and reparents children to it. This ensures that the element sizing
+    // is respected.
+    it('should respect aspect ratio in layout=responsive', async () => {
+      const element = await controller.findElement(
+        'amp-script[layout="responsive"]'
+      );
+      await expect(controller.getElementAttribute(element, 'class')).to.contain(
+        'i-amphtml-layout'
+      );
+
+      const width = await controller.getElementAttribute(element, 'width');
+      const height = await controller.getElementAttribute(element, 'height');
+      const targetRatio = Number(width) / Number(height);
+
+      const rect = await controller.getElementRect(element);
+      const realRatio = rect.width / rect.height;
+
+      await expect(realRatio).to.equal(targetRatio);
+    });
   }
 );
diff --git a/extensions/amp-script/0.1/test/integration/test-amp-script.js b/extensions/amp-script/0.1/test/integration/test-amp-script.js
index 23c8a42c9e3a5..32d851ccf8248 100644
--- a/extensions/amp-script/0.1/test/integration/test-amp-script.js
+++ b/extensions/amp-script/0.1/test/integration/test-amp-script.js
@@ -23,14 +23,11 @@ function poll(description, condition, opt_onError) {
   return classicPoll(description, condition, opt_onError, TIMEOUT);
 }
 
-// TODO(choumx): If possible / desired, make these tests work on Single-pass,
-// on Windows (Edge, Firefox, and Chrome), and on Safari.
-// TODO (choumx@): Do not stub private method and unskip
 describe
   .configure()
-  .skipSafari()
   .skipSinglePass()
-  .skip('amp-script', function() {
+  .skipFirefox()
+  .run('amp-script', function() {
     this.timeout(TIMEOUT);
 
     let browser, doc, element;
@@ -65,7 +62,7 @@ describe
           yield browser.wait(100);
 
           env.sandbox
-            .stub(impl.userActivation_, 'isActive')
+            .stub(impl.getUserActivation(), 'isActive')
             .callsFake(() => true);
           browser.click('button#hello');
 
@@ -85,7 +82,7 @@ describe
           yield browser.wait(100);
 
           env.sandbox
-            .stub(impl.userActivation_, 'isActive')
+            .stub(impl.getUserActivation(), 'isActive')
             .callsFake(() => false);
           browser.click('button#hello');
 
@@ -106,11 +103,14 @@ describe
           yield browser.wait(100);
 
           env.sandbox
-            .stub(impl.userActivation_, 'isActive')
+            .stub(impl.getUserActivation(), 'isActive')
             .callsFake(() => true);
           // TODO(dvoytenko): Find a way to test this with the race condition when
           // the resource is fetched before the first polling iteration.
-          const stub = env.sandbox.stub(impl.userActivation_, 'expandLongTask');
+          const stub = env.sandbox.stub(
+            impl.getUserActivation(),
+            'expandLongTask'
+          );
           browser.click('button#long');
           yield poll('long task started', () => {
             return stub.callCount > 0;
@@ -150,7 +150,7 @@ describe
           yield browser.wait(100);
 
           env.sandbox
-            .stub(impl.userActivation_, 'isActive')
+            .stub(impl.getUserActivation(), 'isActive')
             .callsFake(() => true);
           browser.click('button#script');
 
@@ -173,7 +173,7 @@ describe
           yield browser.wait(100);
 
           env.sandbox
-            .stub(impl.userActivation_, 'isActive')
+            .stub(impl.getUserActivation(), 'isActive')
             .callsFake(() => true);
           browser.click('button#img');
 
@@ -189,7 +189,7 @@ describe
     );
 
     describes.integration(
-      'fixed small',
+      'defined-layout',
       {
         /* eslint-disable max-len */
         body: `
@@ -208,7 +208,7 @@ describe
           element = doc.querySelector('amp-script');
         });
 
-        it('should allow without gesture for small size-defined', function*() {
+        it('should allow mutation without gesture', function*() {
           yield poll('<amp-script> to be hydrated', () =>
             element.classList.contains('i-amphtml-hydrated')
           );
@@ -218,7 +218,7 @@ describe
           yield browser.wait(100);
 
           env.sandbox
-            .stub(impl.userActivation_, 'isActive')
+            .stub(impl.getUserActivation(), 'isActive')
             .callsFake(() => false);
           browser.click('button#hello');
           yield poll('mutations applied', () => {
@@ -228,47 +228,4 @@ describe
         });
       }
     );
-
-    describes.integration(
-      'fixed big',
-      {
-        /* eslint-disable max-len */
-        body: `
-      <amp-script layout=fixed width=300 height=301
-          src="/examples/amp-script/amp-script-demo.js">
-        <button id="hello">Insert</button>
-      </amp-script>
-    `,
-        /* eslint-enable max-len */
-        extensions: ['amp-script'],
-      },
-      env => {
-        beforeEach(() => {
-          browser = new BrowserController(env.win);
-          doc = env.win.document;
-          element = doc.querySelector('amp-script');
-        });
-
-        it('should terminate without gesture for big size-defined', function*() {
-          yield poll('<amp-script> to be hydrated', () =>
-            element.classList.contains('i-amphtml-hydrated')
-          );
-          const impl = yield element.getImpl();
-
-          // Give event listeners in hydration a moment to attach.
-          yield browser.wait(100);
-
-          env.sandbox
-            .stub(impl.userActivation_, 'isActive')
-            .callsFake(() => false);
-          browser.click('button#hello');
-
-          // Give mutations time to apply.
-          yield browser.wait(100);
-          yield poll('terminated', () => {
-            return element.classList.contains('i-amphtml-broken');
-          });
-        });
-      }
-    );
   });
diff --git a/extensions/amp-script/0.1/test/unit/test-amp-script.js b/extensions/amp-script/0.1/test/unit/test-amp-script.js
index ab1b2764fe4a5..873cfbbf87b8a 100644
--- a/extensions/amp-script/0.1/test/unit/test-amp-script.js
+++ b/extensions/amp-script/0.1/test/unit/test-amp-script.js
@@ -23,6 +23,7 @@ import {
 } from '../../amp-script';
 import {FakeWindow} from '../../../../../testing/fake-dom';
 import {Services} from '../../../../../src/services';
+import {user} from '../../../../../src/log';
 
 describes.fakeWin('AmpScript', {amp: {runtimeOn: false}}, env => {
   let element;
@@ -93,6 +94,37 @@ describes.fakeWin('AmpScript', {amp: {runtimeOn: false}}, env => {
     expect(service.checkSha384).to.be.called;
   });
 
+  describe('Initialization skipped warning due to zero height/width', () => {
+    it('should not warn when there is positive width/height', () => {
+      const warnStub = env.sandbox.stub(user(), 'warn');
+      env.sandbox.stub(script, 'getLayoutBox').returns({height: 1, width: 1});
+      script.onMeasureChanged();
+      expect(warnStub).to.have.callCount(0);
+    });
+
+    it('should warn if there is zero width/height', () => {
+      const warnStub = env.sandbox.stub(user(), 'warn');
+      env.sandbox.stub(script, 'getLayoutBox').returns({height: 0, width: 0});
+      script.onMeasureChanged();
+
+      expect(warnStub).calledWith(
+        'amp-script',
+        'Skipped initializing amp-script due to zero width and height.',
+        script.element
+      );
+      expect(warnStub).to.have.callCount(1);
+    });
+
+    it('should only warn if layoutCallback hasnt happened', () => {
+      const warnStub = env.sandbox.stub(user(), 'warn');
+      allowConsoleError(() => {
+        script.layoutCallback();
+      });
+      script.onMeasureChanged();
+      expect(warnStub).to.have.callCount(0);
+    });
+  });
+
   it('should fail on invalid sha384(author_js) for cross-origin src', () => {
     env.sandbox.stub(env.ampdoc, 'getUrl').returns('https://foo.example/');
     element.setAttribute('src', 'https://bar.example/bar.js');
@@ -157,13 +189,6 @@ describes.fakeWin('AmpScript', {amp: {runtimeOn: false}}, env => {
       expect(script.development_).false;
     });
 
-    it('development tag present should put it in dev mode', () => {
-      element.setAttribute('development', true);
-      script = new AmpScript(element);
-      script.buildCallback();
-      expect(script.development_).true;
-    });
-
     it('data-ampdevmode on just the element should not enable dev mode', () => {
       element.setAttribute('data-ampdevmode', true);
       script = new AmpScript(element);
@@ -248,13 +273,25 @@ describes.fakeWin('AmpScriptService', {amp: {runtimeOn: false}}, env => {
 
 describe('SanitizerImpl', () => {
   let el;
-  let s;
   let win;
+  let s;
+  let getSanitizer;
 
   beforeEach(() => {
     win = new FakeWindow();
-    s = new SanitizerImpl(win, /* element */ null, []);
     el = win.document.createElement('div');
+
+    getSanitizer = ({byUserGesture, byFixedSize}) =>
+      new SanitizerImpl(
+        {
+          win,
+          element: el,
+          isMutationAllowedByFixedSize: () => byFixedSize,
+          isMutationAllowedByUserGesture: () => byUserGesture,
+        },
+        []
+      );
+    s = getSanitizer({byUserGesture: false, byFixedSize: false});
   });
 
   describe('setAttribute', () => {
@@ -318,7 +355,15 @@ describe('SanitizerImpl', () => {
     });
 
     it('should allow changes to form elements if sandbox=allow-forms', () => {
-      s = new SanitizerImpl(win, /* element */ null, ['allow-forms']);
+      s = new SanitizerImpl(
+        {
+          win,
+          element: null,
+          isMutationAllowedByUserGesture: () => {},
+          isMutationAllowedbyFixedSize: () => {},
+        },
+        ['allow-forms']
+      );
 
       const form = win.document.createElement('form');
       s.setAttribute(form, 'action-xhr', 'https://example.com/post');
@@ -430,14 +475,15 @@ describe('SanitizerImpl', () => {
 
     beforeEach(() => {
       bind = {
-        getStateValue: () => {},
-        setState: () => {},
+        getStateValue: window.sandbox.stub(),
+        setState: window.sandbox.stub(),
+        constrain: window.sandbox.stub(),
       };
       window.sandbox.stub(Services, 'bindForDocOrNull').resolves(bind);
     });
 
-    it('AMP.setState(json)', async () => {
-      window.sandbox.spy(bind, 'setState');
+    it('AMP.setState(json), without user interaction', async () => {
+      s = getSanitizer({byUserGesture: false, byFixedSize: false});
 
       await s.setStorage(
         StorageLocation.AMP_STATE,
@@ -446,12 +492,45 @@ describe('SanitizerImpl', () => {
       );
 
       expect(bind.setState).to.be.calledOnce;
-      expect(bind.setState).to.be.calledWithExactly({foo: 'bar'}, true, false);
+      expect(bind.setState).to.be.calledWithExactly(
+        {foo: 'bar'},
+        {skipEval: true, constrain: undefined, skipAmpState: false}
+      );
     });
 
-    it('AMP.setState(not_json)', async () => {
-      window.sandbox.spy(bind, 'setState');
+    it('AMP.setState(json), with user interaction', async () => {
+      s = getSanitizer({byUserGesture: true, byFixedSize: false});
 
+      await s.setStorage(
+        StorageLocation.AMP_STATE,
+        /* key */ null,
+        '{"foo":"bar"}'
+      );
+
+      expect(bind.setState).to.be.calledOnce;
+      expect(bind.setState).to.be.calledWithExactly(
+        {foo: 'bar'},
+        {skipEval: false, constrain: undefined, skipAmpState: false}
+      );
+    });
+
+    it('AMP.setState(json), fixed size and no user interaction', async () => {
+      s = getSanitizer({byGesture: false, byFixedSize: true});
+
+      await s.setStorage(
+        StorageLocation.AMP_STATE,
+        /* key */ null,
+        '{"foo":"bar"}'
+      );
+
+      expect(bind.setState).to.be.calledOnce;
+      expect(bind.setState).to.be.calledWithExactly(
+        {foo: 'bar'},
+        {skipEval: false, constrain: [s.element_], skipAmpState: false}
+      );
+    });
+
+    it('AMP.setState(not_json)', async () => {
       await s.setStorage(
         StorageLocation.AMP_STATE,
         /* key */ null,
@@ -462,7 +541,7 @@ describe('SanitizerImpl', () => {
     });
 
     it('AMP.getState(string)', async () => {
-      window.sandbox.stub(bind, 'getStateValue').returns('bar');
+      bind.getStateValue.returns('bar');
 
       const state = await s.getStorage(StorageLocation.AMP_STATE, 'foo');
       expect(state).to.equal('bar');
@@ -472,7 +551,7 @@ describe('SanitizerImpl', () => {
     });
 
     it('AMP.getState()', async () => {
-      window.sandbox.stub(bind, 'getStateValue').returns({foo: 'bar'});
+      bind.getStateValue.returns({foo: 'bar'});
 
       const state = await s.getStorage(StorageLocation.AMP_STATE, '');
       expect(state).to.deep.equal({foo: 'bar'});
diff --git a/extensions/amp-script/amp-script.md b/extensions/amp-script/amp-script.md
index fb277bc829c49..8d6df31586af2 100644
--- a/extensions/amp-script/amp-script.md
+++ b/extensions/amp-script/amp-script.md
@@ -46,6 +46,10 @@ limitations under the License.
       </ul>
     </td>
   </tr>
+  <tr>
+    <td class="col-fourty"><strong><a href="https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/control_layout">Supported Layouts</a></strong></td>
+    <td>container, fill, fixed, fixed-height, flex-item, intrinsic, responsive</td>
+  </tr>
   <tr>
     <td class="col-fourty"><strong>Tutorials</strong></td>
     <td>
@@ -141,7 +145,7 @@ Under the hood, `amp-script` uses [@ampproject/worker-dom](https://github.com/am
 
 `amp-script` supports getting and setting [`amp-state`](https://amp.dev/documentation/components/amp-bind/#initializing-state-with-amp-state) JSON via JavaScript.
 
-This enables advanced interactions between `amp-script` and other AMP elements on the page via `amp-bind` [bindings](https://amp.dev/documentation/components/amp-bind/#bindings). Currently, invoking `AMP.setState()` from `amp-script` will only implicitly update state without mutating the DOM (similar to [`amp-state` initialization](https://amp.dev/documentation/examples/components/amp-bind/?referrer=ampbyexample.com#initializing-state)) &mdash; work is planned to allow mutations from `AMP.setState()` triggered by user gesture ([#24862](https://github.com/ampproject/amphtml/issues/24862)).
+This enables advanced interactions between `amp-script` and other AMP elements on the page via `amp-bind` [bindings](https://amp.dev/documentation/components/amp-bind/#bindings). Invoking `AMP.setState()` from `amp-script` may cause mutations to the DOM as long as it was triggered by user gesture, otherwise it will only implicitly set state (similar to [`amp-state` initialization](https://amp.dev/documentation/examples/components/amp-bind/?referrer=ampbyexample.com#initializing-state)).
 
 [tip type="default"]
 `AMP.setState()` requires the [`amp-bind`](https://amp.dev/documentation/components/amp-bind) extension script to be included in the document head.
@@ -196,13 +200,12 @@ If there's an API you'd like to see supported, please [file an issue](https://gi
 
 #### User gestures
 
-`amp-script` generally requires a user gesture to apply changes triggered by your JavaScript code to the page (we call these "mutations"). This requirement helps avoid poor user experience from unexpected content jumping.
+In some cases, `amp-script` requires a user gesture to apply changes triggered by your JavaScript code (we call these "mutations") to the `amp-script`'s DOM children. This helps avoid poor user experience from unexpected content jumping.
 
 The rules for mutations are as follows:
 
-1. Mutations are always accepted for five seconds after a user gesture.
-2. The five second interval is extended if the author script performs a `fetch()` as a result of the user gesture.
-3. Mutations are always accepted for `amp-script` elements with [`[layout!="container"]`](https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/control_layout#supported-values-for-the-layout-attribute) and `height < 300px`.
+1. For `amp-script` elements with [non-container layout](https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/control_layout#supported-values-for-the-layout-attribute), mutations are always allowed.
+2. For `amp-script` elements with container layout, mutations are allowed for five seconds following a user gesture. This five second window is extended once if a `fetch()` is triggered.
 
 #### Creating AMP elements
 
diff --git a/extensions/amp-script/validator-amp-script.protoascii b/extensions/amp-script/validator-amp-script.protoascii
index c0f6d5c693f57..7e7d1211b48d1 100644
--- a/extensions/amp-script/validator-amp-script.protoascii
+++ b/extensions/amp-script/validator-amp-script.protoascii
@@ -211,6 +211,7 @@ tags: {  # <amp-script>
     supported_layouts: FIXED
     supported_layouts: FIXED_HEIGHT
     supported_layouts: FLEX_ITEM
+    supported_layouts: INTRINSIC
     supported_layouts: NODISPLAY
     supported_layouts: RESPONSIVE
   }
diff --git a/extensions/amp-selector/validator-amp-selector.protoascii b/extensions/amp-selector/validator-amp-selector.protoascii
index a26f42d2249cd..1c6580e19e79f 100644
--- a/extensions/amp-selector/validator-amp-selector.protoascii
+++ b/extensions/amp-selector/validator-amp-selector.protoascii
@@ -15,6 +15,7 @@
 #
 tags: {
   html_format: AMP
+  html_format: AMP4ADS
   html_format: ACTIONS
   tag_name: "SCRIPT"
   extension_spec: {
@@ -40,6 +41,7 @@ tags: {
 }
 tags: {  # <amp-selector> for AMP (autoplay attribute allowed)
   html_format: AMP
+  html_format: AMP4ADS
   html_format: AMP4EMAIL
   html_format: ACTIONS
   tag_name: "AMP-SELECTOR"
@@ -93,6 +95,7 @@ tags: {  # <amp-selector> for AMP (autoplay attribute allowed)
 # always match, we want to prefer 'option' when both of them match.
 tags: {
   html_format: AMP
+  html_format: AMP4ADS
   html_format: AMP4EMAIL
   html_format: ACTIONS
   tag_name: "$REFERENCE_POINT"
@@ -113,6 +116,7 @@ tags: {
 }
 tags: {
   html_format: AMP
+  html_format: AMP4ADS
   html_format: AMP4EMAIL
   html_format: ACTIONS
   tag_name: "$REFERENCE_POINT"
diff --git a/extensions/amp-sidebar/0.1/amp-sidebar.js b/extensions/amp-sidebar/0.1/amp-sidebar.js
index e8725c8f5e417..d244243a6f353 100644
--- a/extensions/amp-sidebar/0.1/amp-sidebar.js
+++ b/extensions/amp-sidebar/0.1/amp-sidebar.js
@@ -157,15 +157,12 @@ export class AmpSidebar extends AMP.BaseElement {
       element.setAttribute('side', this.side_);
     }
 
-    // TODO(#25343): remove this check when cleaning up experiment post launch.
-    if (isExperimentOn(this.win, 'amp-nested-menu')) {
+    this.maybeBuildNestedMenu_();
+    // Nested menu may not be present during buildCallback if it is rendered
+    // dynamically with amp-list, in which case listen for dom update.
+    element.addEventListener(AmpEvents.DOM_UPDATE, () => {
       this.maybeBuildNestedMenu_();
-      // Nested menu may not be present during buildCallback if it is rendered
-      // dynamically with amp-list, in which case listen for dom update.
-      element.addEventListener(AmpEvents.DOM_UPDATE, () => {
-        this.maybeBuildNestedMenu_();
-      });
-    }
+    });
 
     // Get the toolbar attribute from the child navs.
     const toolbarElements = toArray(element.querySelectorAll('nav[toolbar]'));
@@ -548,7 +545,8 @@ export class AmpSidebar extends AMP.BaseElement {
       /* shouldNotPreventDefault */ false,
       /* shouldStopPropagation */ true
     );
-    gestures.onGesture(SwipeXRecognizer, ({data}) => {
+    gestures.onGesture(SwipeXRecognizer, e => {
+      const {data} = e;
       this.handleSwipe_(data);
     });
   }
diff --git a/extensions/amp-sidebar/0.1/amp-sidebar.md b/extensions/amp-sidebar/0.1/amp-sidebar.md
index 14587916674b5..77edc892c80df 100644
--- a/extensions/amp-sidebar/0.1/amp-sidebar.md
+++ b/extensions/amp-sidebar/0.1/amp-sidebar.md
@@ -206,6 +206,8 @@ In the following example, we display a `toolbar` if the window width is less tha
 See live demos at [AMP By Example](https://amp.dev/documentation/examples/components/amp-sidebar/).
 {% endcall %}
 
+[filter formats="stories"]
+
 ## Sidebar for Stories
 
 Use of `amp-sidebar` is supported within the `amp-story` [component](https://www.ampproject.org/stories/).
@@ -251,6 +253,8 @@ The following example shows a simple `amp-sidebar` within an `amp-story`.
   </body>
 ```
 
+[/filter]<!-- formats="stories" -->
+
 ## Attributes
 
 ##### side
@@ -326,6 +330,49 @@ When using `toolbar` feature, `autoscroll` only works if the `<nav toolbar>` ele
 
 Please see [this example file](https://github.com/ampproject/amphtml/blob/master/examples/amp-sidebar-autoscroll.amp.html) for a working example code.
 
+## Building Nested Menus
+
+`<amp-sidebar>` supports drilldown (nested) menus through a child component named [`<amp-nested-menu>`](../../amp-nested-menu/amp-nested-menu.md). With `<amp-nested-menu>`, `<amp-sidebar>` can support nesting one or more layers of submenus (and transition between them) as demonstrated by the following example:
+
+[tip type="note"]
+When using `amp-nested-menu`, wrap every menu item in a `li` element to improve accessibility and keyboard support.
+[/tip]
+
+[example playground="true" preview="top-frame" imports="amp-sidebar"]
+
+```html
+<button on="tap:sidebar1">Open Sidebar</button>
+<amp-sidebar id="sidebar1" layout="nodisplay" style="width:300px">
+  <amp-nested-menu layout="fill">
+    <ul>
+      <li>
+        <h4 amp-nested-submenu-open>Open Sub-Menu</h4>
+        <div amp-nested-submenu>
+          <ul>
+            <li>
+              <h4 amp-nested-submenu-close>Go back</h4>
+            </li>
+            <li>
+              <h4 amp-nested-submenu-open>Open Another Sub-Menu</h4>
+              <div amp-nested-submenu>
+                <h4 amp-nested-submenu-close>Go back</h4>
+              </div>
+            </li>
+          </ul>
+        </div>
+      </li>
+      <li>
+        <a href="https://amp.dev/">Link</a>
+      </li>
+    </ul>
+  </amp-nested-menu>
+</amp-sidebar>
+```
+
+[/example]
+
+See [`<amp-nested-menu>`](../../amp-nested-menu/amp-nested-menu.md) for the full documentation on nested menus along with advanced feature such as dynamic content loading.
+
 ## UX considerations
 
 When using `<amp-sidebar>`, keep in mind that your users will often view your page on mobile in an AMP viewer, which may display a fixed-position header. In addition, browsers often display their own fixed header at the top of the page. Adding another fixed-position element at the top of the screen would take up a large amount of mobile screen space with content that gives the user no new information.
diff --git a/extensions/amp-sidebar/0.1/swipe-to-dismiss.js b/extensions/amp-sidebar/0.1/swipe-to-dismiss.js
index a9c467242157e..3f54edc488655 100644
--- a/extensions/amp-sidebar/0.1/swipe-to-dismiss.js
+++ b/extensions/amp-sidebar/0.1/swipe-to-dismiss.js
@@ -149,7 +149,8 @@ export class SwipeToDismiss {
    *   mask: !Element,
    * }} config
    */
-  startSwipe({swipeElement, mask, direction, orientation}) {
+  startSwipe(config) {
+    const {swipeElement, mask, direction, orientation} = config;
     this.swipeElement_ = swipeElement;
     this.mask_ = mask;
     this.direction_ = direction;
diff --git a/extensions/amp-sidebar/0.2/amp-sidebar.js b/extensions/amp-sidebar/0.2/amp-sidebar.js
index cfc2e75041fb7..3db19a5eeedfa 100644
--- a/extensions/amp-sidebar/0.2/amp-sidebar.js
+++ b/extensions/amp-sidebar/0.2/amp-sidebar.js
@@ -548,7 +548,8 @@ export class AmpSidebar extends AMP.BaseElement {
       /* shouldNotPreventDefault */ false,
       /* shouldStopPropagation */ true
     );
-    gestures.onGesture(SwipeXRecognizer, ({data}) => {
+    gestures.onGesture(SwipeXRecognizer, e => {
+      const {data} = e;
       this.handleSwipe_(data);
     });
   }
diff --git a/extensions/amp-sidebar/0.2/swipe-to-dismiss.js b/extensions/amp-sidebar/0.2/swipe-to-dismiss.js
index a9c467242157e..3f54edc488655 100644
--- a/extensions/amp-sidebar/0.2/swipe-to-dismiss.js
+++ b/extensions/amp-sidebar/0.2/swipe-to-dismiss.js
@@ -149,7 +149,8 @@ export class SwipeToDismiss {
    *   mask: !Element,
    * }} config
    */
-  startSwipe({swipeElement, mask, direction, orientation}) {
+  startSwipe(config) {
+    const {swipeElement, mask, direction, orientation} = config;
     this.swipeElement_ = swipeElement;
     this.mask_ = mask;
     this.direction_ = direction;
diff --git a/extensions/amp-sidebar/validator-amp-sidebar.protoascii b/extensions/amp-sidebar/validator-amp-sidebar.protoascii
index 09fb65a18f729..5c3df0a1806e9 100644
--- a/extensions/amp-sidebar/validator-amp-sidebar.protoascii
+++ b/extensions/amp-sidebar/validator-amp-sidebar.protoascii
@@ -37,11 +37,11 @@ tags: {  # amp-sidebar
   }
   attr_lists: "common-extension-attrs"
 }
-tags: {  # <amp-sidebar> not in amp-story
+tags: {  # <amp-sidebar> not in amp-story or email
   html_format: AMP
-  html_format: AMP4EMAIL
   html_format: ACTIONS
   tag_name: "AMP-SIDEBAR"
+  spec_name: "amp-sidebar"
   # There is an alternate spec for amp-sidebar in amp-story.
   disallowed_ancestor: "AMP-STORY"
   requires_extension: "amp-sidebar"
@@ -59,6 +59,22 @@ tags: {  # <amp-sidebar> not in amp-story
   }
   spec_url: "https://amp.dev/documentation/components/amp-sidebar"
 }
+tags: {  # <amp-sidebar> in email
+  html_format: AMP4EMAIL
+  tag_name: "AMP-SIDEBAR"
+  spec_name: "amp-sidebar (AMP4EMAIL)"
+  requires_extension: "amp-sidebar"
+  attrs: {
+    name: "side"
+    value: "left"
+    value: "right"
+  }
+  attr_lists: "extended-amp-global"
+  amp_layout: {
+    supported_layouts: NODISPLAY
+  }
+  spec_url: "https://amp.dev/documentation/components/amp-sidebar"
+}
 tags: { # <amp-sidebar> in amp-story
   html_format: AMP
   tag_name: "AMP-SIDEBAR"
diff --git a/extensions/amp-skimlinks/0.1/link-rewriter/link-replacement-cache.js b/extensions/amp-skimlinks/0.1/link-rewriter/link-replacement-cache.js
index 6a2d1719eb9e2..076151ffde7e6 100644
--- a/extensions/amp-skimlinks/0.1/link-rewriter/link-replacement-cache.js
+++ b/extensions/amp-skimlinks/0.1/link-rewriter/link-replacement-cache.js
@@ -54,7 +54,8 @@ export class LinkReplacementCache {
    * @public
    */
   updateReplacementUrls(replacementList) {
-    replacementList.forEach(({anchor, replacementUrl}) => {
+    replacementList.forEach(replacementItem => {
+      const {anchor, replacementUrl} = replacementItem;
       const anchorIndex = this.anchorList_.indexOf(anchor);
       if (anchorIndex !== -1) {
         this.replacementList_[anchorIndex] = replacementUrl;
diff --git a/extensions/amp-skimlinks/0.1/test/helpers.js b/extensions/amp-skimlinks/0.1/test/helpers.js
index f70f2fee1b79f..a27a24d7fc6a7 100644
--- a/extensions/amp-skimlinks/0.1/test/helpers.js
+++ b/extensions/amp-skimlinks/0.1/test/helpers.js
@@ -57,7 +57,7 @@ const helpersFactory = env => {
     },
 
     createTrackingWithStubAnalytics(skimOptions) {
-      skimOptions = Object.assign({}, DEFAULT_SKIM_OPTIONS, skimOptions);
+      skimOptions = {...DEFAULT_SKIM_OPTIONS, ...skimOptions};
       this.stubCustomEventReporterBuilder();
 
       return new Tracking(env, skimOptions, 'my-page-referrer');
diff --git a/extensions/amp-skimlinks/0.1/test/test-affiliate-link-resolver.js b/extensions/amp-skimlinks/0.1/test/test-affiliate-link-resolver.js
index c3a5817f2d896..5a4ecc8af76cd 100644
--- a/extensions/amp-skimlinks/0.1/test/test-affiliate-link-resolver.js
+++ b/extensions/amp-skimlinks/0.1/test/test-affiliate-link-resolver.js
@@ -277,9 +277,10 @@ describes.fakeWin(
           const stubXhr = helpers.createStubXhr({
             'merchant_domains': ['merchant1.com', 'merchant2.com'],
           });
-          const skimOptions = Object.assign({}, DEFAULT_SKIM_OPTIONS, {
+          const skimOptions = {
+            ...DEFAULT_SKIM_OPTIONS,
             excludedDomains: ['excluded-merchant.com'],
-          });
+          };
 
           resolver = new AffiliateLinkResolver(stubXhr, skimOptions, waypoint);
         });
diff --git a/extensions/amp-skimlinks/0.1/test/test-tracking.js b/extensions/amp-skimlinks/0.1/test/test-tracking.js
index ed7a2243a8007..3fcfe68e7abb7 100644
--- a/extensions/amp-skimlinks/0.1/test/test-tracking.js
+++ b/extensions/amp-skimlinks/0.1/test/test-tracking.js
@@ -55,10 +55,11 @@ describes.fakeWin(
     });
 
     function setupTrackingService(skimOptions, trackingInfo) {
-      trackingInfo = Object.assign(
-        {pageImpressionId: 'page-imp-id', guid: 'guid'},
-        trackingInfo
-      );
+      trackingInfo = {
+        pageImpressionId: 'page-imp-id',
+        guid: 'guid',
+        ...trackingInfo,
+      };
       const trackingService = helpers.createTrackingWithStubAnalytics(
         skimOptions
       );
diff --git a/extensions/amp-skimlinks/0.1/test/test-waypoint.js b/extensions/amp-skimlinks/0.1/test/test-waypoint.js
index 36aff460156ca..2c251511fddfa 100644
--- a/extensions/amp-skimlinks/0.1/test/test-waypoint.js
+++ b/extensions/amp-skimlinks/0.1/test/test-waypoint.js
@@ -36,16 +36,13 @@ describes.fakeWin(
     });
 
     function getFakeTrackingInfo(data) {
-      return Object.assign(
-        {
-          pubcode,
-          // https://github.com/ampproject/amphtml/blob/master/spec/amp-var-substitutions.md
-          pageImpressionId: 'page_impression_id',
-          customTrackingId: null,
-          guid: 'user_guid',
-        },
-        data
-      );
+      return {
+        pubcode,
+        pageImpressionId: 'page_impression_id',
+        customTrackingId: null,
+        guid: 'user_guid',
+        ...data,
+      };
     }
 
     beforeEach(() => {
diff --git a/extensions/amp-skimlinks/0.1/tracking.js b/extensions/amp-skimlinks/0.1/tracking.js
index 6ffd5b239b29f..4d6cc0ed351d3 100644
--- a/extensions/amp-skimlinks/0.1/tracking.js
+++ b/extensions/amp-skimlinks/0.1/tracking.js
@@ -284,7 +284,8 @@ export class Tracking {
     let numberAffiliateLinks = 0;
     const urls = dict({});
 
-    anchorReplacementList.forEach(({replacementUrl, anchor}) => {
+    anchorReplacementList.forEach(anchorReplacement => {
+      const {replacementUrl, anchor} = anchorReplacement;
       const isExcluded = isExcludedAnchorUrl(anchor, this.skimOptions_);
       const isAffiliate = Boolean(replacementUrl);
       // Do not track na-links since the backend doesn't use them.
diff --git a/extensions/amp-soundcloud/0.1/amp-soundcloud.js b/extensions/amp-soundcloud/0.1/amp-soundcloud.js
index c207cf8be8042..232b815ca9c79 100644
--- a/extensions/amp-soundcloud/0.1/amp-soundcloud.js
+++ b/extensions/amp-soundcloud/0.1/amp-soundcloud.js
@@ -27,6 +27,7 @@
  * </amp-soundcloud>
  */
 
+import {Services} from '../../../src/services';
 import {dict} from '../../../src/utils/object';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {userAssert} from '../../../src/log';
@@ -45,7 +46,11 @@ class AmpSoundcloud extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://api.soundcloud.com/', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://api.soundcloud.com/',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-springboard-player/0.1/amp-springboard-player.js b/extensions/amp-springboard-player/0.1/amp-springboard-player.js
index c9ee346e226cd..205cea9ef8031 100644
--- a/extensions/amp-springboard-player/0.1/amp-springboard-player.js
+++ b/extensions/amp-springboard-player/0.1/amp-springboard-player.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {userAssert} from '../../../src/log';
 
@@ -46,8 +47,16 @@ class AmpSpringboardPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://cms.springboardplatform.com', opt_onLayout);
-    this.preconnect.url('https://www.springboardplatform.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://cms.springboardplatform.com',
+      opt_onLayout
+    );
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://www.springboardplatform.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads-attribution.css b/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads-attribution.css
index 848c7712d9d78..f961c3390c503 100644
--- a/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads-attribution.css
+++ b/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads-attribution.css
@@ -22,3 +22,10 @@
   /* 1 greater than cta layer. */
   z-index: 4 !important;
 }
+
+.i-amphtml-story-ad-fullbleed.i-amphtml-story-ad-attribution {
+  /* Ad will be 75vh, align bottom of icon to bottom of ad. */
+  bottom: 12.5vh !important;
+  left: 50% !important;
+  transform: translateX(-22.5vh) !important;
+}
diff --git a/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.css b/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.css
index 742562df9ecb5..abe5aabf00706 100644
--- a/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.css
+++ b/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.css
@@ -14,8 +14,7 @@
  * limitations under the License.
  */
 
-
-[desktop] amp-story-page[i-amphtml-loading] {
+ .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-loading][ad] {
   /* Move below viewport so that ad preloads */
   transform: scale(1.0) translateX(-100%) translateY(200%) !important;
 }
@@ -26,6 +25,13 @@
   align-items: center !important;
 }
 
+.i-amphtml-story-desktop-fullbleed .i-amphtml-cta-container {
+  /* Ad will be 75vh, align bottom of container to bottom of ad. */
+  bottom: 12.5vh !important;
+  /* 80% (default) - 12.5 (new bottom)*/
+  top: 67.5% !important;
+}
+
 /* If you are changing anything here that affects font, please update measurer
  in story-ad-button-text-fitter.js */
 .i-amphtml-story-ad-link {
@@ -41,7 +47,8 @@
   letter-spacing: 0.2px !important;
   line-height: 36px !important;
   overflow: hidden !important;
-  opacity: 0 !important;
+  /* no important on opacity b/c ff does not allow keyframes to override. */
+  opacity: 0;
   padding: 0 10px !important;
   position: absolute !important;
   text-align: center !important;
@@ -77,9 +84,21 @@ amp-story-page[active] .i-amphtml-story-ad-link {
 }
 
 /* TODO(ccordry): refactor centering logic in amp-ad.css and remove this hack.  */
-amp-ad[data-a4a-upgrade-type="amp-ad-network-doubleclick-impl"] > iframe,
-amp-ad[type="adsense"] > iframe {
+amp-story-page amp-ad[data-a4a-upgrade-type="amp-ad-network-doubleclick-impl"] > iframe,
+amp-story-page amp-ad[type="adsense"] > iframe {
   top: 0 !important;
   left: 0 !important;
   transform: translate(0) !important;
 }
+
+/* TODO(ccordry) allow advertisers to opt-in to fullscreen ads. */
+.i-amphtml-story-desktop-fullbleed .i-amphtml-story-grid-template-fill > amp-ad > iframe {
+  left: 50% !important;
+  right: auto !important;
+  margin: auto !important;
+  min-height: 75vh !important;
+  max-height: 75vh !important;
+  min-width: calc(3/5 * 75vh) !important;
+  max-width: calc(3/5 * 75vh) !important;
+  transform: translateX(-50%) !important;
+}
diff --git a/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.js b/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.js
index 34166ba45dcfe..059b431e1cb2a 100644
--- a/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.js
+++ b/extensions/amp-story-auto-ads/0.1/amp-story-auto-ads.js
@@ -247,12 +247,30 @@ export class AmpStoryAutoAds extends AMP.BaseElement {
 
   /**
    * Determines whether or not ad insertion is allowed based on how the story
-   * is served.
+   * is served, and the number of pages in the story.
    * @return {boolean}
    * @private
    */
   isAutomaticAdInsertionAllowed_() {
-    return !!this.storeService_.get(StateProperty.CAN_INSERT_AUTOMATIC_AD);
+    return (
+      !!this.storeService_.get(StateProperty.CAN_INSERT_AUTOMATIC_AD) &&
+      this.enoughPagesLeftInStory_(0) // Beginning of story.
+    );
+  }
+
+  /**
+   * Determine if enough pages in the story are left for ad placement to be
+   * possible.
+   * TODO(ccordry): also use this on subsequent ad requests.
+   * @param {number} pageIndex
+   * @return {boolean}
+   * @private
+   */
+  enoughPagesLeftInStory_(pageIndex) {
+    return (
+      this.storeService_.get(StateProperty.PAGE_IDS).length - pageIndex >
+      MIN_INTERVAL
+    );
   }
 
   /**
@@ -376,7 +394,8 @@ export class AmpStoryAutoAds extends AMP.BaseElement {
       this.config_,
       index,
       this.localizationService_,
-      devAssert(this.buttonFitter_)
+      devAssert(this.buttonFitter_),
+      devAssert(this.storeService_)
     );
 
     this.maybeForceAdPlacement_(page);
@@ -442,20 +461,25 @@ export class AmpStoryAutoAds extends AMP.BaseElement {
     if (this.adPageIds_[pageId]) {
       // We are switching to an ad.
       const adIndex = this.adPageIds_[pageId];
+      const adPage = this.adPages_[adIndex - 1];
+
+      if (!adPage.hasBeenViewed()) {
+        this.pendingAdView_ = false;
+        this.resetPageCount_();
+        if (this.enoughPagesLeftInStory_(pageIndex)) {
+          this.startNextAdPage_();
+        }
+      }
+
       // Tell the iframe that it is visible.
-      this.setVisibleAttribute_(this.adPages_[adIndex - 1]);
+      this.setVisibleAttribute_(adPage);
+
       // Fire the view event on the corresponding Ad.
       this.analyticsEvent_(AnalyticsEvents.AD_VIEWED, {
         [AnalyticsVars.AD_VIEWED]: Date.now(),
         [AnalyticsVars.AD_INDEX]: adIndex,
       });
 
-      // Previously inserted ad has been viewed.
-      this.pendingAdView_ = false;
-
-      // Start loading next ad.
-      this.startNextAdPage_();
-
       // Keeping track of this here so that we can contain the logic for when
       // we exit the ad within this extension.
       this.idOfAdShowing_ = adIndex;
@@ -484,7 +508,7 @@ export class AmpStoryAutoAds extends AMP.BaseElement {
           this.analyticsEventWithCurrentAd_(AnalyticsEvents.AD_DISCARDED, {
             [AnalyticsVars.AD_DISCARDED]: Date.now(),
           });
-          this.startNextAdPage_(/* failure */ true);
+          this.startNextAdPage_();
         }
       });
     }
@@ -544,21 +568,22 @@ export class AmpStoryAutoAds extends AMP.BaseElement {
   /**
    * Start the process over.
    * @private
-   * @param {boolean=} opt_failure If we are calling this due to failed ad.
    */
-  startNextAdPage_(opt_failure) {
+  startNextAdPage_() {
     if (!this.firstAdViewed_) {
       this.firstAdViewed_ = true;
     }
-
-    if (!opt_failure) {
-      // Don't reset the count on a failed ad.
-      this.uniquePagesCount_ = 0;
-    }
-
     this.schedulePage_();
   }
 
+  /**
+   * Reset the counter that tracks when to place ads.
+   * @private
+   */
+  resetPageCount_() {
+    this.uniquePagesCount_ = 0;
+  }
+
   /**
    * Place ad based on user config
    * @param {string} pageBeforeAdId
diff --git a/extensions/amp-story-auto-ads/0.1/story-ad-config.js b/extensions/amp-story-auto-ads/0.1/story-ad-config.js
index fddd0f90aad70..3ebb225809679 100644
--- a/extensions/amp-story-auto-ads/0.1/story-ad-config.js
+++ b/extensions/amp-story-auto-ads/0.1/story-ad-config.js
@@ -86,11 +86,7 @@ export class StoryAdConfig {
       }
     }
 
-    return /** @type {!JsonObject} */ (Object.assign(
-      {},
-      adAttributes,
-      requiredAttrs
-    ));
+    return /** @type {!JsonObject} */ ({...adAttributes, ...requiredAttrs});
   }
 
   /**
diff --git a/extensions/amp-story-auto-ads/0.1/story-ad-page.js b/extensions/amp-story-auto-ads/0.1/story-ad-page.js
index 72367cabcea76..c56ae25bac4e2 100644
--- a/extensions/amp-story-auto-ads/0.1/story-ad-page.js
+++ b/extensions/amp-story-auto-ads/0.1/story-ad-page.js
@@ -21,6 +21,10 @@ import {
 } from './story-ad-analytics';
 import {CommonSignals} from '../../../src/common-signals';
 import {CtaTypes} from './story-ad-localization';
+import {
+  StateProperty,
+  UIType,
+} from '../../amp-story/1.0/amp-story-store-service';
 import {assertConfig} from '../../amp-ad-exit/0.1/config';
 import {assertHttpsUrl} from '../../../src/url';
 import {CSS as attributionCSS} from '../../../build/amp-story-auto-ads-attribution-0.1.css';
@@ -38,6 +42,7 @@ import {dict} from '../../../src/utils/object';
 import {getA4AMetaTags, getFrameDoc} from './utils';
 import {getServicePromiseForDoc} from '../../../src/service';
 import {parseJson} from '../../../src/json';
+import {setStyle} from '../../../src/style';
 
 /** @const {string} */
 const TAG = 'amp-story-auto-ads:page';
@@ -48,6 +53,9 @@ const TIMEOUT_LIMIT = 10000; // 10 seconds
 /** @const {string} */
 const GLASS_PANE_CLASS = 'i-amphtml-glass-pane';
 
+/** @const {string} */
+const DESKTOP_FULLBLEED_CLASS = 'i-amphtml-story-ad-fullbleed';
+
 /** @enum {string} */
 const PageAttributes = {
   LOADING: 'i-amphtml-loading',
@@ -75,8 +83,9 @@ export class StoryAdPage {
    * @param {number} index
    * @param {!./story-ad-localization.StoryAdLocalization} localization
    * @param {!./story-ad-button-text-fitter.ButtonTextFitter} buttonFitter
+   * @param {!../../amp-story/0.1/amp-story-store-service.AmpStoryStoreService|!../../amp-story/1.0/amp-story-store-service.AmpStoryStoreService} storeService
    */
-  constructor(ampdoc, config, index, localization, buttonFitter) {
+  constructor(ampdoc, config, index, localization, buttonFitter, storeService) {
     /** @private @const {!JsonObject} */
     this.config_ = config;
 
@@ -107,6 +116,9 @@ export class StoryAdPage {
     /** @private {?Element} */
     this.adElement_ = null;
 
+    /** @private {?Element} */
+    this.adChoicesIcon_ = null;
+
     /** @private {?Document} */
     this.adDoc_ = null;
 
@@ -124,6 +136,12 @@ export class StoryAdPage {
 
     /** @private @const {./story-ad-button-text-fitter.ButtonTextFitter} */
     this.buttonFitter_ = buttonFitter;
+
+    /** @private {boolean} */
+    this.viewed_ = false;
+
+    /** @private @const {!../../amp-story/0.1/amp-story-store-service.AmpStoryStoreService|!../../amp-story/1.0/amp-story-store-service.AmpStoryStoreService} */
+    this.storeService_ = storeService;
   }
 
   /** @return {?Document} ad document within FIE */
@@ -148,6 +166,11 @@ export class StoryAdPage {
     return this.loaded_;
   }
 
+  /** @return {boolean} */
+  hasBeenViewed() {
+    return this.viewed_;
+  }
+
   /** @return {?Element} */
   getPageElement() {
     return this.pageElement_;
@@ -166,6 +189,7 @@ export class StoryAdPage {
    * respond accordingly.
    */
   toggleVisibility() {
+    this.viewed_ = true;
     // TODO(calebcordry): Properly handle visible attribute for custom ads.
     if (this.adDoc_) {
       toggleAttribute(
@@ -290,7 +314,14 @@ export class StoryAdPage {
       'id': this.id_,
     });
 
-    return createElementWithAttributes(this.doc_, 'amp-story-page', attributes);
+    const page = createElementWithAttributes(
+      this.doc_,
+      'amp-story-page',
+      attributes
+    );
+    // TODO(ccordry): Allow creative to change default background color.
+    setStyle(page, 'background-color', '#212125');
+    return page;
   }
 
   /**
@@ -471,7 +502,7 @@ export class StoryAdPage {
       })
     );
 
-    const adChoicesIcon = createElementWithAttributes(
+    this.adChoicesIcon_ = createElementWithAttributes(
       this.doc_,
       'img',
       dict({
@@ -479,16 +510,40 @@ export class StoryAdPage {
         'src': src,
       })
     );
+    this.storeService_.subscribe(
+      StateProperty.UI_STATE,
+      uiState => {
+        this.onUIStateUpdate_(uiState);
+      },
+      true /** callToInitialize */
+    );
 
-    adChoicesIcon.addEventListener(
+    this.adChoicesIcon_.addEventListener(
       'click',
       this.handleAttributionClick_.bind(this, href)
     );
 
-    createShadowRootWithStyle(root, adChoicesIcon, attributionCSS);
+    createShadowRootWithStyle(root, this.adChoicesIcon_, attributionCSS);
     this.pageElement_.appendChild(root);
   }
 
+  /**
+   * Reacts to UI state updates and passes the information along as
+   * attributes to the shadowed attribution icon.
+   * @param {!UIType} uiState
+   * @private
+   */
+  onUIStateUpdate_(uiState) {
+    if (!this.adChoicesIcon_) {
+      return;
+    }
+
+    this.adChoicesIcon_.classList.toggle(
+      DESKTOP_FULLBLEED_CLASS,
+      uiState === UIType.DESKTOP_FULLBLEED
+    );
+  }
+
   /**
    * @private
    * @param {string} href
diff --git a/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads-fullbleed.js b/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads-fullbleed.js
new file mode 100644
index 0000000000000..603971723bc25
--- /dev/null
+++ b/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads-fullbleed.js
@@ -0,0 +1,154 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  clickThroughPages,
+  switchToAdFrame,
+} from './test-amp-story-auto-ads-utils';
+
+const viewport = {
+  HEIGHT: 768,
+  WIDTH: 1024,
+};
+
+describes.endtoend(
+  'amp-story-auto-ads:fullbleed',
+  {
+    testUrl:
+      'http://localhost:8000/test/fixtures/e2e/amp-story-auto-ads/fullbleed.html',
+    initialRect: {width: viewport.WIDTH, height: viewport.HEIGHT},
+    environments: ['single', 'viewer-demo'],
+  },
+  env => {
+    let controller;
+
+    beforeEach(() => {
+      controller = env.controller;
+    });
+
+    it('should render correctly', async () => {
+      await clickThroughPages(controller, /* numPages */ 7);
+      const activePage = await controller.findElement('[active]');
+      await expect(controller.getElementAttribute(activePage, 'ad')).to.exist;
+      await validateAdSize(controller);
+      await validateAdOverlay(controller);
+      await validateAdAttribution(
+        controller,
+        '/test/fixtures/e2e/amphtml-ads/resource/icon.png' // iconUrl
+      );
+      await validateCta(
+        controller,
+        'https://www.amp.dev' // ctaUrl
+      );
+
+      await switchToAdFrame(controller);
+      const body = await controller.findElement('body');
+      await expect(controller.getElementAttribute(body, 'amp-story-visible')).to
+        .exist;
+      await controller.switchToParent();
+    });
+  }
+);
+
+async function validateAdSize(controller) {
+  const activeIframe = await controller.findElement('[active] iframe');
+  // Ad should be centered, 75vh tall, and 3/5 * 75vh wide.
+  await expect(controller.getElementRect(activeIframe)).to.include({
+    left: 339,
+    top: 96,
+    right: 685,
+    bottom: 672,
+  });
+}
+
+async function validateAdOverlay(controller) {
+  const overlayHost = await controller.findElement(
+    '.i-amphtml-ad-overlay-host'
+  );
+  await controller.switchToShadowRoot(overlayHost);
+
+  const adOverlayContainer = await controller.findElement(
+    '.i-amphtml-ad-overlay-container'
+  );
+  await expect(controller.getElementAttribute(adOverlayContainer, 'ad-showing'))
+    .to.exist;
+
+  const adBadge = await controller.findElement('.i-amphtml-story-ad-badge');
+  await expect(controller.getElementText(adBadge)).to.equal('Ad');
+  await expect(controller.getElementCssValue(adBadge, 'visibility')).to.equal(
+    'visible'
+  );
+  // Design spec is 14px from top, 16px from left.
+  await expect(controller.getElementRect(adBadge)).to.include({
+    left: 16,
+    top: 14,
+  });
+
+  await controller.switchToLight();
+}
+
+async function validateCta(controller, ctaUrl) {
+  const ctaButton = await controller.findElement('.i-amphtml-story-ad-link');
+  await expect(controller.getElementCssValue(ctaButton, 'visibility')).to.equal(
+    'visible'
+  );
+  await expect(controller.getElementAttribute(ctaButton, 'target')).to.equal(
+    '_blank'
+  );
+  await expect(controller.getElementAttribute(ctaButton, 'href')).to.equal(
+    ctaUrl
+  );
+  await expect(controller.getElementAttribute(ctaButton, 'role')).to.equal(
+    'link'
+  );
+  // Overlayed onto centered and resized iframe.
+  await expect(controller.getElementRect(ctaButton)).to.include({
+    bottom: 640,
+    height: 36,
+    width: 120,
+  });
+  await expect(controller.getElementCssValue(ctaButton, 'font-size')).to.equal(
+    '14px'
+  );
+}
+
+async function validateAdAttribution(controller, iconUrl) {
+  const attributionHost = await controller.findElement(
+    '.i-amphtml-attribution-host'
+  );
+  await controller.switchToShadowRoot(attributionHost);
+
+  const attribution = await controller.findElement(
+    '.i-amphtml-story-ad-attribution'
+  );
+  await expect(controller.getElementAttribute(attribution, 'src')).to.equal(
+    iconUrl
+  );
+  await expect(
+    controller.getElementCssValue(attribution, 'visibility')
+  ).to.equal('visible');
+
+  // Aligned to bottom-left of creative. Max height is 15px and asset will be
+  // scaled down proportionally to fit.
+  await expect(controller.getElementRect(attribution)).to.include({
+    bottom: 672,
+    left: 339,
+    height: 15,
+    width: 15,
+  });
+
+  await controller.switchToLight();
+}
diff --git a/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads-utils.js b/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads-utils.js
new file mode 100644
index 0000000000000..b737438a58b0a
--- /dev/null
+++ b/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads-utils.js
@@ -0,0 +1,27 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export async function clickThroughPages(controller, numPages) {
+  for (let i = 0; i < numPages; i++) {
+    const page = await controller.findElement('[active]');
+    await controller.click(page);
+  }
+}
+
+export async function switchToAdFrame(controller) {
+  const frame = await controller.findElement('#i-amphtml-ad-page-1 iframe');
+  await controller.switchToFrame(frame);
+}
diff --git a/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads.js b/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads.js
index 91ff5f017e0c3..715ece3aae1c0 100644
--- a/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads.js
+++ b/extensions/amp-story-auto-ads/0.1/test-e2e/test-amp-story-auto-ads.js
@@ -14,6 +14,11 @@
  * limitations under the License.
  */
 
+import {
+  clickThroughPages,
+  switchToAdFrame,
+} from './test-amp-story-auto-ads-utils';
+
 const viewport = {
   HEIGHT: 823,
   WIDTH: 500,
@@ -100,13 +105,6 @@ describes.endtoend(
   }
 );
 
-async function clickThroughPages(controller, numPages) {
-  for (let i = 0; i < numPages; i++) {
-    const page = await controller.findElement('[active]');
-    await controller.click(page);
-  }
-}
-
 async function validateAdOverlay(controller) {
   const overlayHost = await controller.findElement(
     '.i-amphtml-ad-overlay-host'
@@ -187,8 +185,3 @@ async function validateAdAttribution(controller, iconUrl) {
 
   await controller.switchToLight();
 }
-
-async function switchToAdFrame(controller) {
-  const frame = await controller.findElement('#i-amphtml-ad-page-1 iframe');
-  await controller.switchToFrame(frame);
-}
diff --git a/extensions/amp-story-auto-ads/0.1/test/test-amp-story-auto-ads.js b/extensions/amp-story-auto-ads/0.1/test/test-amp-story-auto-ads.js
index b8ea5a28ac4b9..f8c1448aca062 100644
--- a/extensions/amp-story-auto-ads/0.1/test/test-amp-story-auto-ads.js
+++ b/extensions/amp-story-auto-ads/0.1/test/test-amp-story-auto-ads.js
@@ -52,6 +52,8 @@ describes.realWin(
     let storyElement;
     let autoAds;
     let story;
+    let storeService;
+    let storeGetterStub;
 
     beforeEach(() => {
       win = env.win;
@@ -67,6 +69,100 @@ describes.realWin(
       storyElement.appendChild(adElement);
       story = new AmpStory(storyElement);
       autoAds = new AmpStoryAutoAds(adElement);
+      storeService = getStoreService(win);
+      storeGetterStub = env.sandbox.stub(storeService, 'get');
+      // Tests by default assume an 8 page parent story. Overide if needed.
+      storeGetterStub
+        .withArgs(StateProperty.PAGE_IDS)
+        .returns(['1', '2', '3', '4', '5', '6', '7', '8']);
+      storeGetterStub.callThrough();
+    });
+
+    describe('ad creation', () => {
+      beforeEach(() => {
+        new MockStoryImpl(storyElement);
+        addStoryAutoAdsConfig(adElement);
+      });
+
+      it('creates an ad when story pages > min interval', async () => {
+        await autoAds.buildCallback();
+        await autoAds.layoutCallback();
+        const ampAd = doc.querySelector('amp-ad');
+        expect(ampAd).to.exist;
+      });
+
+      it('doesnt create ad when story pages < min interval', async () => {
+        storeGetterStub
+          .withArgs(StateProperty.PAGE_IDS)
+          .returns(['1', '2', '3', '4']);
+        await autoAds.buildCallback();
+        await autoAds.layoutCallback();
+        const ampAd = doc.querySelector('amp-ad');
+        expect(ampAd).not.to.exist;
+      });
+
+      it('does not create multiple ads in stories of 8 pages', async () => {
+        await autoAds.buildCallback();
+        await autoAds.layoutCallback();
+
+        // Fake click to ad page.
+        storeService.dispatch(Action.CHANGE_PAGE, {
+          id: 'i-amphtml-ad-page-1',
+          index: 7,
+        });
+        const ampAds = doc.querySelectorAll('amp-ad');
+        expect(ampAds.length).to.equal(1);
+      });
+
+      it('creates multiple ads if enough pages', async () => {
+        storeGetterStub
+          .withArgs(StateProperty.PAGE_IDS)
+          .returns([
+            '1',
+            '2',
+            '3',
+            '4',
+            '5',
+            '6',
+            '7',
+            '8',
+            '9',
+            '10',
+            '11',
+            '12',
+            '13',
+            '14',
+            '15',
+          ]);
+        await autoAds.buildCallback();
+        await autoAds.layoutCallback();
+
+        // Fake click to ad page.
+        storeService.dispatch(Action.CHANGE_PAGE, {
+          id: 'i-amphtml-ad-page-1',
+          index: 7,
+        });
+        const ampAds = doc.querySelectorAll('amp-ad');
+        expect(ampAds.length).to.equal(2);
+      });
+
+      it('does not fetch new ad when viewing previous ad', async () => {
+        await autoAds.buildCallback();
+        await autoAds.layoutCallback();
+
+        // Fake click to ad page.
+        storeService.dispatch(Action.CHANGE_PAGE, {
+          id: 'i-amphtml-ad-page-1',
+          index: 7,
+        });
+        // Visit ad page again.
+        storeService.dispatch(Action.CHANGE_PAGE, {
+          id: 'i-amphtml-ad-page-1',
+          index: 7,
+        });
+        const ampAds = doc.querySelectorAll('amp-ad');
+        expect(ampAds.length).to.equal(1);
+      });
     });
 
     describe('service installation', () => {
@@ -132,30 +228,32 @@ describes.realWin(
 
     describe('visible attribute', () => {
       beforeEach(() => {
-        env.sandbox.stub(autoAds, 'analyticsEvent_').returns(NOOP);
-        autoAds.adPagesCreated_ = 1;
-        autoAds.adPageIds_ = {'ad-page-1': 1};
+        new MockStoryImpl(storyElement);
+        addStoryAutoAdsConfig(adElement);
       });
 
-      it('sets the visible attribute when showing', () => {
+      it('sets the visible attribute when showing', async () => {
         const setVisibleStub = env.sandbox.stub(
           autoAds,
           'setVisibleAttribute_'
         );
-        env.sandbox.stub(autoAds, 'startNextAdPage_').returns(NOOP);
+        await autoAds.buildCallback();
+        await autoAds.layoutCallback();
         // Switching to ad page.
-        autoAds.handleActivePageChange_(
-          /* pageIndex */ 1,
-          /* pageId */ 'ad-page-1'
-        );
+        storeService.dispatch(Action.CHANGE_PAGE, {
+          id: 'i-amphtml-ad-page-1',
+          index: 7,
+        });
         expect(setVisibleStub.calledOnce).to.be.true;
       });
 
-      it('removes the visible attribute when showing', () => {
+      it('removes the visible attribute when exiting', async () => {
         const removeVisibleStub = env.sandbox.stub(
           autoAds,
           'removeVisibleAttribute_'
         );
+        await autoAds.buildCallback();
+        await autoAds.layoutCallback();
         autoAds.idOfAdShowing_ = 'ad-page-1';
         autoAds.handleActivePageChange_(
           /* pageIndex */ 2,
@@ -166,13 +264,10 @@ describes.realWin(
     });
 
     describe('ad badge', () => {
-      let storeService;
-
       beforeEach(async () => {
         // Force sync mutateElement.
         env.sandbox.stub(autoAds, 'mutateElement').callsArg(0);
         addStoryAutoAdsConfig(adElement);
-        storeService = getStoreService(win);
         await story.buildCallback();
         // Fire these events so that story ads thinks the parent story is ready.
         story.signals().signal(CommonSignals.BUILT);
@@ -249,7 +344,9 @@ describes.realWin(
           element: storyElement,
           addPage: NOOP,
         };
+        autoAds.adPages_ = [{hasBeenViewed: () => false}];
         autoAds.setVisibleAttribute_ = NOOP;
+        autoAds.enoughPagesLeftInStory_ = NOOP;
         autoAds.adPagesCreated_ = 1;
         env.sandbox.stub(autoAds, 'startNextAdPage_');
         const analyticsStub = env.sandbox.stub(autoAds, 'analyticsEvent_');
@@ -283,12 +380,9 @@ describes.realWin(
 
     describe('development mode', () => {
       it('should immediately insert and navigate to ad page', async () => {
-        const storeService = await Services.storyStoreServiceForOrNull(win);
-        const storeStub = env.sandbox.stub(storeService, 'get');
-        storeStub
+        storeGetterStub
           .withArgs(StateProperty.CURRENT_PAGE_ID)
           .returns('story-page-0');
-        storeStub.callThrough();
 
         const storyImpl = new MockStoryImpl(storyElement);
         storyElement.getImpl = () => Promise.resolve(storyImpl);
diff --git a/extensions/amp-story-auto-ads/0.1/test/test-story-ad-page.js b/extensions/amp-story-auto-ads/0.1/test/test-story-ad-page.js
index 862171a1fc390..ee4d1c1067e95 100644
--- a/extensions/amp-story-auto-ads/0.1/test/test-story-ad-page.js
+++ b/extensions/amp-story-auto-ads/0.1/test/test-story-ad-page.js
@@ -16,6 +16,11 @@
 
 import * as dom from '../../../../src/dom';
 import * as service from '../../../../src/service';
+import {
+  Action,
+  UIType,
+  getStoreService,
+} from '../../../amp-story/1.0/amp-story-store-service';
 import {ButtonTextFitter} from '../story-ad-button-text-fitter';
 import {CommonSignals} from '../../../../src/common-signals';
 import {StoryAdAnalytics} from '../story-ad-analytics';
@@ -42,6 +47,7 @@ describes.realWin('story-ad-page', {amp: true}, env => {
   let doc;
   let storyAutoAdsEl;
   let storyAdPage;
+  let storeService;
 
   beforeEach(() => {
     win = env.win;
@@ -49,12 +55,14 @@ describes.realWin('story-ad-page', {amp: true}, env => {
     storyAutoAdsEl = doc.createElement('amp-story-auto-ads');
     doc.body.appendChild(storyAutoAdsEl);
     storyAutoAdsEl.getAmpDoc = () => env.ampdoc;
+    storeService = getStoreService(win);
     storyAdPage = new StoryAdPage(
       storyAutoAdsEl.getAmpDoc(),
       baseConfig,
       1, // index
       new StoryAdLocalization(win),
-      new ButtonTextFitter(env.ampdoc)
+      new ButtonTextFitter(env.ampdoc),
+      storeService
     );
   });
 
@@ -373,6 +381,32 @@ describes.realWin('story-ad-page', {amp: true}, env => {
       );
     });
 
+    it('propagates fullbleed state to attribution icon', async () => {
+      storeService.dispatch(Action.TOGGLE_UI, UIType.DESKTOP_FULLBLEED);
+
+      const iframe = doc.createElement('iframe');
+      ampAdElement.appendChild(iframe);
+      iframe.contentDocument.write(`
+          <head>
+            <meta name="amp4ads-vars-cta-type" content="SHOP">
+            <meta name="amp4ads-vars-cta-url" content="https://www.example.com">
+            <meta name="amp4ads-vars-attribution-icon" content="https://googleads.g.doubleclick.net/pagead/images/mtad/ad_choices_blue.png">
+            <meta name="amp4ads-vars-attribution-url" content="https://www.google.com">
+          </head>
+          <body></body>`);
+      await ampAdElement.signals().signal(CommonSignals.INI_LOAD);
+      await storyAdPage.maybeCreateCta();
+
+      const attribution = doc.querySelector('.i-amphtml-story-ad-attribution');
+      expect(attribution).to.have.class('i-amphtml-story-ad-fullbleed');
+
+      storeService.dispatch(Action.TOGGLE_UI, UIType.MOBILE);
+      expect(attribution).not.to.have.class('i-amphtml-story-ad-fullbleed');
+
+      storeService.dispatch(Action.TOGGLE_UI, UIType.DESKTOP_FULLBLEED);
+      expect(attribution).to.have.class('i-amphtml-story-ad-fullbleed');
+    });
+
     it('does not create attribution when missing icon', async () => {
       expectAsyncConsoleError(
         /amp-story-auto-ads attribution icon must be available/
diff --git a/extensions/amp-story/0.1/amp-story-consent.js b/extensions/amp-story/0.1/amp-story-consent.js
index 51fbcddb6e988..aa1293f003b64 100644
--- a/extensions/amp-story/0.1/amp-story-consent.js
+++ b/extensions/amp-story/0.1/amp-story-consent.js
@@ -32,7 +32,7 @@ import {
   getRGBFromCssColorValue,
   getTextColorForRGB,
 } from './utils';
-import {dev, user, userAssert} from '../../../src/log';
+import {dev, devAssert, user, userAssert} from '../../../src/log';
 import {dict} from './../../../src/utils/object';
 import {isArray} from '../../../src/types';
 import {parseJson} from '../../../src/json';
@@ -292,9 +292,11 @@ export class AmpStoryConsent extends AMP.BaseElement {
       );
     };
 
-    this.element
-      .getResources()
-      .measureMutateElement(this.storyConsentEl_, measurer, mutator);
+    Services.mutatorForDoc(this.getAmpDoc())./*OK*/ measureMutateElement(
+      devAssert(this.storyConsentEl_),
+      measurer,
+      mutator
+    );
   }
 
   /**
@@ -311,11 +313,10 @@ export class AmpStoryConsent extends AMP.BaseElement {
         'type="application/json"'
     );
 
-    this.storyConsentConfig_ = Object.assign(
-      {},
-      DEFAULT_OPTIONAL_PARAMETERS,
-      /** @type {Object} */ (parseJson(storyConsentScript.textContent))
-    );
+    this.storyConsentConfig_ = {
+      ...DEFAULT_OPTIONAL_PARAMETERS,
+      ...parseJson(storyConsentScript.textContent),
+    };
 
     user().assertString(
       this.storyConsentConfig_.title,
diff --git a/extensions/amp-story/0.1/amp-story-info-dialog.js b/extensions/amp-story/0.1/amp-story-info-dialog.js
index 2144744506738..4a408515aba3e 100644
--- a/extensions/amp-story/0.1/amp-story-info-dialog.js
+++ b/extensions/amp-story/0.1/amp-story-info-dialog.js
@@ -63,8 +63,8 @@ export class InfoDialog {
     /** @private @const {!Element} */
     this.parentEl_ = parentEl;
 
-    /** @private @const {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(getAmpdoc(this.win_.document));
+    /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(getAmpdoc(this.win_.document));
 
     /** @private {?Element} */
     this.moreInfoLinkEl_ = null;
@@ -103,7 +103,7 @@ export class InfoDialog {
       '.i-amphtml-story-info-dialog-container'
     );
 
-    const appendPromise = this.resources_.mutateElement(this.parentEl_, () => {
+    const appendPromise = this.mutator_.mutateElement(this.parentEl_, () => {
       this.parentEl_.appendChild(root);
     });
 
@@ -148,7 +148,7 @@ export class InfoDialog {
    * @private
    */
   onInfoDialogStateUpdated_(isOpen) {
-    this.resources_.mutateElement(dev().assertElement(this.element_), () => {
+    this.mutator_.mutateElement(dev().assertElement(this.element_), () => {
       this.element_.classList.toggle(DIALOG_VISIBLE_CLASS, isOpen);
     });
   }
@@ -204,7 +204,7 @@ export class InfoDialog {
       this.element_.querySelector('.i-amphtml-story-info-heading')
     );
 
-    return this.resources_.mutateElement(headingEl, () => {
+    return this.mutator_.mutateElement(headingEl, () => {
       headingEl.textContent = label;
     });
   }
@@ -219,7 +219,7 @@ export class InfoDialog {
       this.element_.querySelector('.i-amphtml-story-info-link')
     );
 
-    return this.resources_.mutateElement(linkEl, () => {
+    return this.mutator_.mutateElement(linkEl, () => {
       linkEl.setAttribute('href', pageUrl);
 
       // Add zero-width space character (\u200B) after "." and "/" characters
@@ -242,7 +242,7 @@ export class InfoDialog {
       this.element_.querySelector('.i-amphtml-story-info-moreinfo')
     );
 
-    return this.resources_.mutateElement(this.moreInfoLinkEl_, () => {
+    return this.mutator_.mutateElement(this.moreInfoLinkEl_, () => {
       const label = this.localizationService_.getLocalizedString(
         LocalizedStringId.AMP_STORY_DOMAIN_DIALOG_HEADING_LINK
       );
diff --git a/extensions/amp-story/0.1/amp-story-share.js b/extensions/amp-story/0.1/amp-story-share.js
index 4c2006568bced..b76e8cefa3b2e 100644
--- a/extensions/amp-story/0.1/amp-story-share.js
+++ b/extensions/amp-story/0.1/amp-story-share.js
@@ -61,13 +61,13 @@ const MIN_BUTTON_PADDING = 10;
 
 /**
  * Key for share providers in bookend config.
- * @private @const {string}
+ * @package @const {string}
  */
 export const SHARE_PROVIDERS_KEY = 'shareProviders';
 
 /**
  * Deprecated key for share providers in bookend config.
- * @private @const {string}
+ * @package @const {string}
  */
 export const DEPRECATED_SHARE_PROVIDERS_KEY = 'share-providers';
 
diff --git a/extensions/amp-story/0.1/amp-story-store-service.js b/extensions/amp-story/0.1/amp-story-store-service.js
index ee0850668b373..b6d02d44f4cf4 100644
--- a/extensions/amp-story/0.1/amp-story-store-service.js
+++ b/extensions/amp-story/0.1/amp-story-store-service.js
@@ -45,7 +45,7 @@ const TAG = 'amp-story';
  */
 export let State;
 
-/** @private @const @enum {string} */
+/** @package @const @enum {string} */
 export const StateProperty = {
   // Embed options.
   CAN_INSERT_AUTOMATIC_AD: 'caninsertautomaticad',
@@ -72,7 +72,7 @@ export const StateProperty = {
   CURRENT_PAGE_INDEX: 'currentpageindex',
 };
 
-/** @private @const @enum {string} */
+/** @package @const @enum {string} */
 export const Action = {
   CHANGE_PAGE: 'changepage',
   SET_CONSENT_ID: 'setconsentid',
@@ -98,46 +98,54 @@ const actions = (state, action, data) => {
   switch (action) {
     // Triggers the ad UI.
     case Action.TOGGLE_AD:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.AD_STATE]: !!data,
-      }));
+      });
     // Shows or hides the bookend.
     case Action.TOGGLE_BOOKEND:
       if (!state[StateProperty.CAN_SHOW_BOOKEND]) {
         return state;
       }
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.BOOKEND_STATE]: !!data,
-      }));
+      });
     // Triggers the desktop UI.
     case Action.TOGGLE_DESKTOP:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.DESKTOP_STATE]: !!data,
-      }));
+      });
     // Shows or hides the info dialog.
     case Action.TOGGLE_INFO_DIALOG:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.INFO_DIALOG_STATE]: !!data,
-      }));
+      });
     // Shows or hides the audio controls.
     case Action.TOGGLE_HAS_AUDIO:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.HAS_AUDIO_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_LANDSCAPE:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.LANDSCAPE_STATE]: !!data,
-      }));
+      });
     // Mutes or unmutes the story media.
     case Action.TOGGLE_MUTED:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.MUTED_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_SUPPORTED_BROWSER:
       if (data) {
         dev().error(TAG, 'Cannot exit unsupported browser state.');
       }
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.CAN_INSERT_AUTOMATIC_AD]: false,
         [StateProperty.CAN_SHOW_BOOKEND]: false,
         [StateProperty.CAN_SHOW_NAVIGATION_OVERLAY_HINT]: false,
@@ -148,20 +156,23 @@ const actions = (state, action, data) => {
         [StateProperty.HAS_AUDIO_STATE]: false,
         [StateProperty.MUTED_STATE]: true,
         [StateProperty.SUPPORTED_BROWSER_STATE]: false,
-      }));
+      });
     case Action.TOGGLE_SHARE_MENU:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.SHARE_MENU_STATE]: !!data,
-      }));
+      });
     case Action.SET_CONSENT_ID:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.CONSENT_ID]: data,
-      }));
+      });
     case Action.CHANGE_PAGE:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.CURRENT_PAGE_ID]: data.id,
         [StateProperty.CURRENT_PAGE_INDEX]: data.index,
-      }));
+      });
     default:
       dev().error(TAG, `Unknown action ${action}.`);
       return state;
@@ -183,11 +194,10 @@ export class AmpStoryStoreService {
     this.listeners_ = {};
 
     /** @private {!State} */
-    this.state_ = /** @type {!State} */ (Object.assign(
-      {},
-      this.getDefaultState_(),
-      this.getEmbedOverrides_()
-    ));
+    this.state_ = /** @type {!State} */ ({
+      ...this.getDefaultState_(),
+      ...this.getEmbedOverrides_(),
+    });
   }
 
   /**
@@ -232,7 +242,7 @@ export class AmpStoryStoreService {
    * @param  {*} data
    */
   dispatch(action, data) {
-    const oldState = Object.assign({}, this.state_);
+    const oldState = {...this.state_};
     this.state_ = actions(this.state_, action, data);
 
     Object.keys(this.listeners_).forEach(key => {
diff --git a/extensions/amp-story/0.1/embed-mode.js b/extensions/amp-story/0.1/embed-mode.js
index c857b843ca006..4a481cc306a14 100644
--- a/extensions/amp-story/0.1/embed-mode.js
+++ b/extensions/amp-story/0.1/embed-mode.js
@@ -61,7 +61,7 @@ export const EmbedModeParam = 'embedMode';
 /**
  * @param {string} str
  * @return {!EmbedMode}
- * @private
+ * @package
  */
 export function parseEmbedMode(str) {
   const params = parseQueryString(str);
diff --git a/extensions/amp-story/0.1/test/test-amp-story-info-dialog.js b/extensions/amp-story/0.1/test/test-amp-story-info-dialog.js
index e6f602ee66658..b17377055d2dd 100644
--- a/extensions/amp-story/0.1/test/test-amp-story-info-dialog.js
+++ b/extensions/amp-story/0.1/test/test-amp-story-info-dialog.js
@@ -43,8 +43,8 @@ describes.realWin('amp-story-share-menu', {amp: true}, env => {
     embedded = true;
     registerServiceBuilder(win, 'story-store', () => storeService);
 
-    // Making sure resource tasks run synchronously.
-    env.sandbox.stub(Services, 'resourcesForDoc').returns({
+    // Making sure mutator tasks run synchronously.
+    env.sandbox.stub(Services, 'mutatorForDoc').returns({
       mutateElement: (element, callback) => {
         callback();
         return Promise.resolve();
diff --git a/extensions/amp-story/0.1/test/validator-amp-story-cta-layer-error.out b/extensions/amp-story/0.1/test/validator-amp-story-cta-layer-error.out
index c956a6800d3c1..59f226d14272b 100644
--- a/extensions/amp-story/0.1/test/validator-amp-story-cta-layer-error.out
+++ b/extensions/amp-story/0.1/test/validator-amp-story-cta-layer-error.out
@@ -67,7 +67,7 @@ amp-story/0.1/test/validator-amp-story-cta-layer-error.html:54:6 Tag 'amp-story-
 >>     ^~~~~~~~~
 amp-story/0.1/test/validator-amp-story-cta-layer-error.html:61:4 The tag 'amp-story-cta-layer' may only appear as a descendant of tag 'amp-story-page'.
 >>     ^~~~~~~~~
-amp-story/0.1/test/validator-amp-story-cta-layer-error.html:61:4 Tag 'amp-story-cta-layer' is disallowed as child of tag 'amp-story'. Child tag must be one of ['amp-analytics', 'amp-consent', 'amp-geo', 'amp-pixel', 'amp-sidebar', 'amp-story-access', 'amp-story-auto-ads', 'amp-story-bookend', 'amp-story-page']. (see https://amp.dev/documentation/components/amp-story)
+amp-story/0.1/test/validator-amp-story-cta-layer-error.html:61:4 Tag 'amp-story-cta-layer' is disallowed as child of tag 'amp-story'. Child tag must be one of ['amp-analytics', 'amp-consent', 'amp-geo', 'amp-pixel', 'amp-sidebar', 'amp-story-auto-ads', 'amp-story-bookend', 'amp-story-page']. (see https://amp.dev/documentation/components/amp-story)
 |        <a href="http://www.google.com" class="button"> Illegal CTA layer outside of amp-story-page! </a>
 |      </amp-story-cta-layer>
 |    </amp-story>
diff --git a/extensions/amp-story/0.1/utils.js b/extensions/amp-story/0.1/utils.js
index d7ddefae5b5a2..9989de5efbc6c 100644
--- a/extensions/amp-story/0.1/utils.js
+++ b/extensions/amp-story/0.1/utils.js
@@ -141,7 +141,8 @@ export function getRGBFromCssColorValue(cssValue) {
  * @param  {!Object<string, number>} rgb  ie: {r: 0, g: 0, b: 0}
  * @return {string} '#fff' or '#000'
  */
-export function getTextColorForRGB({r, g, b}) {
+export function getTextColorForRGB(rgb) {
+  const {r, g, b} = rgb;
   // Calculates the relative luminance L.
   // https://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
   const getLinearRGBValue = x => {
diff --git a/extensions/amp-story/1.0/amp-story-access.js b/extensions/amp-story/1.0/amp-story-access.js
index 7fc9771ce7953..4678ba1647eaa 100644
--- a/extensions/amp-story/1.0/amp-story-access.js
+++ b/extensions/amp-story/1.0/amp-story-access.js
@@ -295,9 +295,7 @@ export class AmpStoryAccess extends AMP.BaseElement {
       // If there is only one configuration and the publisher provided a
       // namespace, we want to allow actions with or without namespace.
       if (accessConfig[0].namespace) {
-        accessConfig.push(
-          Object.assign({}, accessConfig[0], {namespace: undefined})
-        );
+        accessConfig.push({...accessConfig[0], namespace: undefined});
       }
     }
 
diff --git a/extensions/amp-story/1.0/amp-story-affiliate-link.js b/extensions/amp-story/1.0/amp-story-affiliate-link.js
index 1da389f89dc89..93e1b29248e1b 100644
--- a/extensions/amp-story/1.0/amp-story-affiliate-link.js
+++ b/extensions/amp-story/1.0/amp-story-affiliate-link.js
@@ -60,8 +60,8 @@ export class AmpStoryAffiliateLink {
     /** @private {string} */
     this.text_ = this.element_.textContent;
 
-    /** @private @const {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(getAmpdoc(this.win_.document));
+    /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(getAmpdoc(this.win_.document));
 
     /** @private @const {!./story-analytics.StoryAnalyticsService} */
     this.analyticsService_ = getAnalyticsService(this.win_, element);
@@ -75,7 +75,7 @@ export class AmpStoryAffiliateLink {
       return;
     }
 
-    this.resources_.mutateElement(this.element_, () => {
+    this.mutator_.mutateElement(this.element_, () => {
       this.element_.textContent = '';
       this.element_.toggleAttribute('pristine', true);
       this.addPulseElement_();
diff --git a/extensions/amp-story/1.0/amp-story-consent.js b/extensions/amp-story/1.0/amp-story-consent.js
index d92537c5b13e6..fccd66f34b0a6 100644
--- a/extensions/amp-story/1.0/amp-story-consent.js
+++ b/extensions/amp-story/1.0/amp-story-consent.js
@@ -326,11 +326,10 @@ export class AmpStoryConsent extends AMP.BaseElement {
         'type="application/json"'
     );
 
-    this.storyConsentConfig_ = Object.assign(
-      {},
-      DEFAULT_OPTIONAL_PARAMETERS,
-      /** @type {Object} */ (parseJson(storyConsentScript.textContent))
-    );
+    this.storyConsentConfig_ = {
+      ...DEFAULT_OPTIONAL_PARAMETERS,
+      ...parseJson(storyConsentScript.textContent),
+    };
 
     user().assertString(
       this.storyConsentConfig_.title,
diff --git a/extensions/amp-story/1.0/amp-story-desktop-panels.css b/extensions/amp-story/1.0/amp-story-desktop-panels.css
index 947aa598f21db..8b409c9525f44 100644
--- a/extensions/amp-story/1.0/amp-story-desktop-panels.css
+++ b/extensions/amp-story/1.0/amp-story-desktop-panels.css
@@ -29,7 +29,7 @@ amp-story[standalone].i-amphtml-story-desktop-panels {
 
 .i-amphtml-story-desktop-panels amp-story-page.i-amphtml-element {
   /* Pages are stacked to the right side of the screen and then animated in. */
-  transform: scale(0.9) translateX(calc(250% + 192px)) translateY(0%) !important;
+  transform: perspective(1px) scale(0.9) translateX(calc(250% + 192px)) translateY(0%) !important;
   opacity: 0.05 !important;
   transform-origin: left !important;
   border-radius: 0 !important;
@@ -37,15 +37,15 @@ amp-story[standalone].i-amphtml-story-desktop-panels {
 }
 
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page.i-amphtml-element {
-  transform: scale(0.9) translateX(calc(-350% - 192px)) translateY(0%) !important;
+  transform: perspective(1px) scale(0.9) translateX(calc(-350% - 192px)) translateY(0%) !important;
 }
 
 .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-visited] {
-  transform: scale(0.9) translateX(calc(-350% - 192px)) translateY(0%) !important;
+  transform: perspective(1px) scale(0.9) translateX(calc(-350% - 192px)) translateY(0%) !important;
 }
 
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-visited] {
-  transform: scale(0.9) translateX(calc(250% + 192px)) translateY(0%) !important;
+  transform: perspective(1px) scale(0.9) translateX(calc(250% + 192px)) translateY(0%) !important;
 }
 
 .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="-2"],
@@ -61,34 +61,36 @@ amp-story[standalone].i-amphtml-story-desktop-panels {
 
 .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="-2"],
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="2"] {
-  transform: perspective(1px) scale(0.9) translateX(calc(-250% - 128px)) translateY(0%) !important;
+  transform: perspective(1px) scale(0.9) translateX(calc(-5 * var(--i-amphtml-story-page-50vw, 50%) - 128px)) translateY(0%) !important;
 }
 
 .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="-1"],
 .i-amphtml-story-desktop-panels .prev-container > .i-amphtml-story-page-sentinel,
+[dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[active] + amp-story-page:not([i-amphtml-desktop-position]):not([distance]), /** Position n+1 page on load, before attributes are set. */
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="1"],
 [dir=rtl] .i-amphtml-story-desktop-panels .next-container > .i-amphtml-story-page-sentinel {
-  transform: perspective(1px) scale(0.9) translateX(calc(-150% - 64px)) translateY(0%) !important;
+  transform: perspective(1px) scale(0.9) translateX(calc(-3 * var(--i-amphtml-story-page-50vw, 50%) - 64px)) translateY(0%) !important;
 }
 
 .i-amphtml-story-desktop-panels amp-story-page[active],
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[active],
 .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="0"],
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="0"] {
-  transform: perspective(1px) scale(1.0) translateX(-50%) translateY(0%) !important;
+  transform: perspective(1px) scale(1.0) translateX(calc(-1 * var(--i-amphtml-story-page-50vw, 50%))) translateY(0%) !important;
   opacity: 1 !important;
 }
 
+.i-amphtml-story-desktop-panels amp-story-page[active] + amp-story-page:not([i-amphtml-desktop-position]):not([distance]), /** Position n+1 page on load, before attributes are set. */
 .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="1"],
 .i-amphtml-story-desktop-panels .next-container > .i-amphtml-story-page-sentinel,
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="-1"],
 [dir=rtl] .i-amphtml-story-desktop-panels .prev-container > .i-amphtml-story-page-sentinel {
-  transform: perspective(1px) scale(0.9) translate(calc(50% + 64px), 0%) !important;
+  transform: perspective(1px) scale(0.9) translate(calc(var(--i-amphtml-story-page-50vw, 50%) + 64px), 0%) !important;
 }
 
 .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="2"],
 [dir=rtl] .i-amphtml-story-desktop-panels amp-story-page[i-amphtml-desktop-position="-2"] {
-  transform: perspective(1px) scale(0.9) translate(calc(150% + 128px), 0%) !important;
+  transform: perspective(1px) scale(0.9) translate(calc(3 * var(--i-amphtml-story-page-50vw, 50%) + 128px), 0%) !important;
 }
 
 .i-amphtml-story-prev-hover > amp-story-page[i-amphtml-desktop-position="-1"] {
diff --git a/extensions/amp-story/1.0/amp-story-draggable-drawer.js b/extensions/amp-story/1.0/amp-story-draggable-drawer.js
index ab9cc4d1348c1..b05fd5faba066 100644
--- a/extensions/amp-story/1.0/amp-story-draggable-drawer.js
+++ b/extensions/amp-story/1.0/amp-story-draggable-drawer.js
@@ -79,13 +79,13 @@ export class DraggableDrawer extends AMP.BaseElement {
     /** @private {!Array<!Element>} AMP components within the drawer. */
     this.ampComponents_ = [];
 
-    /** @private {?Element} */
+    /** @protected {?Element} */
     this.containerEl_ = null;
 
     /** @protected {?Element} */
     this.contentEl_ = null;
 
-    /** @private {?Element} */
+    /** @protected {?Element} */
     this.headerEl_ = null;
 
     /** @protected {!DrawerState} */
@@ -266,8 +266,6 @@ export class DraggableDrawer extends AMP.BaseElement {
       return;
     }
 
-    event.stopPropagation();
-
     const coordinates = this.getClientTouchCoordinates_(event);
     if (!coordinates) {
       return;
@@ -275,6 +273,18 @@ export class DraggableDrawer extends AMP.BaseElement {
 
     const {x, y} = coordinates;
 
+    this.touchEventState_.swipingUp = y < this.touchEventState_.lastY;
+    this.touchEventState_.lastY = y;
+
+    if (
+      this.state_ === DrawerState.CLOSED &&
+      !this.touchEventState_.swipingUp
+    ) {
+      return;
+    }
+
+    event.stopPropagation();
+
     if (this.touchEventState_.isSwipeY === null) {
       this.touchEventState_.isSwipeY =
         Math.abs(this.touchEventState_.startY - y) >
@@ -284,9 +294,6 @@ export class DraggableDrawer extends AMP.BaseElement {
       }
     }
 
-    this.touchEventState_.swipingUp = y < this.touchEventState_.lastY;
-    this.touchEventState_.lastY = y;
-
     this.onSwipeY_({
       event,
       data: {
@@ -475,7 +482,7 @@ export class DraggableDrawer extends AMP.BaseElement {
 
   /**
    * Fully closes the drawer from its current position.
-   * @private
+   * @protected
    */
   closeInternal_() {
     if (this.state_ === DrawerState.CLOSED) {
diff --git a/extensions/amp-story/1.0/amp-story-embedded-component.js b/extensions/amp-story/1.0/amp-story-embedded-component.js
index 2743c2db216cd..306e199aa347b 100644
--- a/extensions/amp-story/1.0/amp-story-embedded-component.js
+++ b/extensions/amp-story/1.0/amp-story-embedded-component.js
@@ -29,6 +29,7 @@ import {
 } from './story-analytics';
 import {CSS} from '../../../build/amp-story-tooltip-1.0.css';
 import {EventType, dispatch} from './events';
+import {Keys} from '../../../src/utils/key-codes';
 import {LocalizedStringId} from '../../../src/localized-strings';
 import {Services} from '../../../src/services';
 import {addAttributesToElement, closest, matches} from '../../../src/dom';
@@ -53,10 +54,20 @@ const ActionIcon = {
 /** @private @const {number} */
 const TOOLTIP_CLOSE_ANIMATION_MS = 100;
 
+/**
+ * Since we don't know the actual width of the content inside the iframe
+ * and in responsive environments the iframe takes the whole width, we
+ * hardcode a limit based on what we know of how the embed behaves (only true
+ * for Twitter embeds). See #22334.
+ * @const {number}
+ * @private
+ */
+const MAX_TWEET_WIDTH_PX = 500;
+
 /**
  * Components that can be expanded.
  * @const {!Object}
- * @private
+ * @package
  */
 export const EXPANDABLE_COMPONENTS = {
   'amp-twitter': {
@@ -84,11 +95,10 @@ const LAUNCHABLE_COMPONENTS = {
  * @private
  * @const {!Object}
  */
-const INTERACTIVE_COMPONENTS = Object.assign(
-  {},
-  EXPANDABLE_COMPONENTS,
-  LAUNCHABLE_COMPONENTS
-);
+const INTERACTIVE_COMPONENTS = {
+  ...EXPANDABLE_COMPONENTS,
+  ...LAUNCHABLE_COMPONENTS,
+};
 
 /**
  * Gets the list of components with their respective selectors.
@@ -127,16 +137,13 @@ export function expandableElementsSelectors() {
  * Contains all interactive component CSS selectors.
  * @type {!Object}
  */
-const interactiveSelectors = Object.assign(
-  {},
-  getComponentSelectors(LAUNCHABLE_COMPONENTS),
-  getComponentSelectors(EXPANDABLE_COMPONENTS, INTERACTIVE_EMBED_SELECTOR),
-  {
-    EXPANDED_VIEW_OVERLAY:
-      '.i-amphtml-story-expanded-view-overflow, ' +
-      '.i-amphtml-expanded-view-close-button',
-  }
-);
+const interactiveSelectors = {
+  ...getComponentSelectors(LAUNCHABLE_COMPONENTS),
+  ...getComponentSelectors(EXPANDABLE_COMPONENTS, INTERACTIVE_EMBED_SELECTOR),
+  EXPANDED_VIEW_OVERLAY:
+    '.i-amphtml-story-expanded-view-overflow, ' +
+    '.i-amphtml-expanded-view-close-button',
+};
 
 /**
  * All selectors that should delegate to the AmpStoryEmbeddedComponent class.
@@ -197,19 +204,181 @@ const buildExpandedViewOverlay = element => htmlFor(element)`
 
 /**
  * Updates embed's corresponding <style> element with embedData.
+ * @param {!Element} target
  * @param {!Element} embedStyleEl
  * @param {!EmbedDataDef} embedData
  */
-function updateEmbedStyleEl(embedStyleEl, embedData) {
+function updateEmbedStyleEl(target, embedStyleEl, embedData) {
   const embedId = embedData.id;
+  embedStyleEl.textContent = `[${EMBED_ID_ATTRIBUTE_NAME}="${embedId}"]
+  ${buildStringStyleFromEl(target, embedData)}`;
+}
+
+/**
+ * Builds a string containing the corresponding style depending on the
+ * element.
+ * @param {!Element} target
+ * @param {!EmbedDataDef} embedData
+ * @return {string}
+ */
+function buildStringStyleFromEl(target, embedData) {
+  switch (target.tagName.toLowerCase()) {
+    case EXPANDABLE_COMPONENTS['amp-twitter'].selector:
+      return buildStringStyleForTweet(embedData);
+    default:
+      return buildDefaultStringStyle(embedData);
+  }
+}
+
+/**
+ * Builds string used in the <style> element for tweets. We ignore the height
+ * as its non-deterministic.
+ * @param {!EmbedDataDef} embedData
+ * @return {string}
+ */
+function buildStringStyleForTweet(embedData) {
+  return `{
+    width: ${px(embedData.width)} !important;
+    transform: ${embedData.transform} !important;
+    margin: 0 ${embedData.horizontalMargin}px !important;
+    }`;
+}
+
+/**
+ * Builds string used in the <style> element for default embeds.
+ * @param {!EmbedDataDef} embedData
+ * @return {string}
+ */
+function buildDefaultStringStyle(embedData) {
+  return `{
+    width: ${px(embedData.width)} !important;
+    height: ${px(embedData.height)} !important;
+    transform: ${embedData.transform} !important;
+    margin: ${embedData.verticalMargin}px ${
+    embedData.horizontalMargin
+  }px !important;
+    }`;
+}
+
+/**
+ * Measures syles for a given element in preparation for its expanded animation.
+ * @param {!Element} element
+ * @param {!Object} state
+ * @param {!DOMRect} pageRect
+ * @param {!DOMRect} elRect
+ * @return {!Object}
+ */
+function measureStyleForEl(element, state, pageRect, elRect) {
+  switch (element.tagName.toLowerCase()) {
+    case EXPANDABLE_COMPONENTS['amp-twitter'].selector:
+      return measureStylesForTwitter(state, pageRect, elRect);
+    default:
+      return measureDefaultStyles(state, pageRect, elRect);
+  }
+}
+
+/**
+ * Since amp-twitter handles its own resize events for its height, we don't
+ * resize based on its height, but rather just based on its width.
+ * @param {!Object} state
+ * @param {!DOMRect} pageRect
+ * @param {!DOMRect} elRect
+ * @return {!Object}
+ */
+function measureStylesForTwitter(state, pageRect, elRect) {
+  // If screen is very wide and story has supports-landscape attribute,
+  // we don't want it to take the whole width. We take the maximum width
+  // that the tweet can actually use instead.
+  state.newWidth = Math.min(pageRect.width, MAX_TWEET_WIDTH_PX);
+
+  state.scaleFactor =
+    Math.min(elRect.width, MAX_TWEET_WIDTH_PX) / state.newWidth;
+
+  state.horizontalMargin = -1 * ((state.newWidth - elRect.width) / 2);
+
+  return state;
+}
+
+/**
+ * Measures styles for a given element in preparation for its expanded
+ * animation.
+ * @param {!Object} state
+ * @param {!DOMRect} pageRect
+ * @param {!DOMRect} elRect
+ * @return {!Object}
+ */
+function measureDefaultStyles(state, pageRect, elRect) {
+  if (elRect.width >= elRect.height) {
+    state.newWidth = pageRect.width;
+    state.scaleFactor = elRect.width / state.newWidth;
+    state.newHeight = (elRect.height / elRect.width) * state.newWidth;
+  } else {
+    const maxHeight = pageRect.height - VERTICAL_PADDING;
+    state.newWidth = Math.min(
+      (elRect.width / elRect.height) * maxHeight,
+      pageRect.width
+    );
+    state.newHeight = (elRect.height / elRect.width) * state.newWidth;
+    state.scaleFactor = elRect.height / state.newHeight;
+  }
+
+  state.verticalMargin = -1 * ((state.newHeight - elRect.height) / 2);
+  state.horizontalMargin = -1 * ((state.newWidth - elRect.width) / 2);
+
+  return state;
+}
 
-  embedStyleEl.textContent = `[${EMBED_ID_ATTRIBUTE_NAME}="${embedId}"] {
-      width: ${px(embedData.width)} !important;
-      height: ${px(embedData.height)} !important;
-      transform: ${embedData.transform} !important;
-      margin: ${embedData.verticalMargin}px ${embedData.horizontalMargin}px
-          !important;
-      }`;
+/**
+ * Gets updated style object for a given element.
+ * @param {!Element} element
+ * @param {number} elId
+ * @param {!Object} state
+ * @return {!Object}
+ */
+function updateStyleForEl(element, elId, state) {
+  switch (element.tagName.toLowerCase()) {
+    case EXPANDABLE_COMPONENTS['amp-twitter'].selector:
+      return updateStylesForTwitter(elId, state);
+    default:
+      return updateDefaultStyles(elId, state);
+  }
+}
+
+/**
+ * Gets style object for an embedded component, setting negative margins
+ * to make up for the expanded size in preparation of the expanded animation.
+ * @param {number} elId
+ * @param {!Object} state
+ * @return {!Object}
+ */
+function updateDefaultStyles(elId, state) {
+  return {
+    id: elId,
+    width: state.newWidth,
+    height: state.newHeight,
+    scaleFactor: state.scaleFactor,
+    transform: `scale(${state.scaleFactor})`,
+    verticalMargin: state.verticalMargin,
+    horizontalMargin: state.horizontalMargin,
+  };
+}
+
+/**
+ * Gets style object for twitter. Notice there is no height or vertical margin
+ * since we don't know the final height of tweets even after layout, so we just
+ * let the embed handle its own height.
+ * @param {number} elId
+ * @param {!Object} state
+ * @return {!Object}
+ */
+function updateStylesForTwitter(elId, state) {
+  return {
+    id: elId,
+    width: state.newWidth,
+    scaleFactor: state.scaleFactor,
+    transform: `scale(${state.scaleFactor})`,
+    horizontalMargin: state.horizontalMargin,
+  };
 }
 
 /**
@@ -287,8 +456,8 @@ export class AmpStoryEmbeddedComponent {
     /** @private @const {!./amp-story-store-service.AmpStoryStoreService} */
     this.storeService_ = getStoreService(this.win_);
 
-    /** @private @const {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(getAmpdoc(this.win_.document));
+    /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(getAmpdoc(this.win_.document));
 
     /** @private @const {!./story-analytics.StoryAnalyticsService} */
     this.analyticsService_ = getAnalyticsService(this.win_, storyEl);
@@ -328,6 +497,11 @@ export class AmpStoryEmbeddedComponent {
       }
     );
 
+    /** @type {!../../../src/service/history-impl.History} */
+    this.historyService_ = Services.historyForDoc(
+      getAmpdoc(this.win_.document)
+    );
+
     /** @private {EmbeddedComponentState} */
     this.state_ = EmbeddedComponentState.HIDDEN;
 
@@ -336,6 +510,9 @@ export class AmpStoryEmbeddedComponent {
 
     /** @private {?Element} */
     this.buttonRight_ = null;
+
+    /** @private {number} */
+    this.historyId_ = -1;
   }
 
   /**
@@ -405,6 +582,11 @@ export class AmpStoryEmbeddedComponent {
         this.onFocusedStateUpdate_(null);
         this.scheduleEmbedToPause_(component.element);
         this.toggleExpandedView_(component.element);
+        this.historyService_
+          .push(() => this.close_())
+          .then(historyId => {
+            this.historyId_ = historyId;
+          });
         break;
       default:
         dev().warn(TAG, `EmbeddedComponentState ${this.state_} does not exist`);
@@ -435,7 +617,7 @@ export class AmpStoryEmbeddedComponent {
   toggleExpandedView_(targetToExpand) {
     if (!targetToExpand) {
       this.expandedViewOverlay_ &&
-        this.resources_.mutateElement(this.expandedViewOverlay_, () => {
+        this.mutator_.mutateElement(this.expandedViewOverlay_, () => {
           this.componentPage_.classList.toggle(
             'i-amphtml-expanded-mode',
             false
@@ -454,7 +636,7 @@ export class AmpStoryEmbeddedComponent {
     if (!this.expandedViewOverlay_) {
       this.buildAndAppendExpandedViewOverlay_();
     }
-    this.resources_.mutateElement(
+    this.mutator_.mutateElement(
       dev().assertElement(this.expandedViewOverlay_),
       () => {
         toggle(dev().assertElement(this.expandedViewOverlay_), true);
@@ -469,9 +651,8 @@ export class AmpStoryEmbeddedComponent {
    */
   buildAndAppendExpandedViewOverlay_() {
     this.expandedViewOverlay_ = buildExpandedViewOverlay(this.storyEl_);
-    this.resources_.mutateElement(
-      dev().assertElement(this.componentPage_),
-      () => this.componentPage_.appendChild(this.expandedViewOverlay_)
+    this.mutator_.mutateElement(dev().assertElement(this.componentPage_), () =>
+      this.componentPage_.appendChild(this.expandedViewOverlay_)
     );
   }
 
@@ -486,14 +667,12 @@ export class AmpStoryEmbeddedComponent {
       (target && matches(target, '.i-amphtml-expanded-view-close-button')) ||
       forceClose
     ) {
-      // Target is expanded and going into hidden mode.
-      this.close_();
-      this.toggleExpandedView_(null);
-      this.tooltip_.removeEventListener(
-        'click',
-        this.expandComponentHandler_,
-        true /** capture */
-      );
+      if (this.historyId_ !== -1) {
+        this.historyService_.goBack();
+      } else {
+        // Used for visual diff testing viewer.
+        this.close_();
+      }
     }
   }
 
@@ -543,6 +722,13 @@ export class AmpStoryEmbeddedComponent {
     this.storeService_.dispatch(Action.TOGGLE_INTERACTIVE_COMPONENT, {
       state: EmbeddedComponentState.HIDDEN,
     });
+
+    this.toggleExpandedView_(null);
+    this.tooltip_.removeEventListener(
+      'click',
+      this.expandComponentHandler_,
+      true /** capture */
+    );
   }
 
   /**
@@ -553,7 +739,7 @@ export class AmpStoryEmbeddedComponent {
    */
   onFocusedStateUpdate_(component) {
     if (!component) {
-      this.resources_.mutateElement(
+      this.mutator_.mutateElement(
         dev().assertElement(this.focusedStateOverlay_),
         () => {
           this.focusedStateOverlay_.classList.toggle('i-amphtml-hidden', true);
@@ -589,7 +775,7 @@ export class AmpStoryEmbeddedComponent {
       this.storyEl_.querySelector('amp-story-page[active]')
     );
 
-    this.resources_.mutateElement(
+    this.mutator_.mutateElement(
       dev().assertElement(this.focusedStateOverlay_),
       () => {
         this.focusedStateOverlay_.classList.toggle('i-amphtml-hidden', false);
@@ -632,6 +818,19 @@ export class AmpStoryEmbeddedComponent {
         this.owners_.schedulePause(this.storyEl_, embedEl);
       }
     });
+
+    this.win_.addEventListener('keyup', event => {
+      if (
+        event.key === Keys.ESCAPE &&
+        this.state_ === EmbeddedComponentState.EXPANDED
+      ) {
+        event.preventDefault();
+        this.maybeCloseExpandedView_(
+          null /** target */,
+          true /** forceClose */
+        );
+      }
+    });
   }
 
   /**
@@ -641,7 +840,7 @@ export class AmpStoryEmbeddedComponent {
    * @private
    */
   onUIStateUpdate_(uiState) {
-    this.resources_.mutateElement(
+    this.mutator_.mutateElement(
       dev().assertElement(this.focusedStateOverlay_),
       () => {
         [UIType.DESKTOP_FULLBLEED, UIType.DESKTOP_PANELS].includes(uiState)
@@ -760,7 +959,11 @@ export class AmpStoryEmbeddedComponent {
     embedStyleEl[
       AMP_EMBED_DATA
     ].transform = `scale(${embedStyleEl[AMP_EMBED_DATA].scaleFactor})`;
-    updateEmbedStyleEl(embedStyleEl, embedStyleEl[AMP_EMBED_DATA]);
+    updateEmbedStyleEl(
+      this.triggeringTarget_,
+      embedStyleEl,
+      embedStyleEl[AMP_EMBED_DATA]
+    );
   }
 
   /**
@@ -778,7 +981,7 @@ export class AmpStoryEmbeddedComponent {
       `Failed to look up embed style element with ID ${embedId}`
     );
     const embedData = embedStyleEl[AMP_EMBED_DATA];
-    this.resources_.measureMutateElement(
+    this.mutator_.measureMutateElement(
       target,
       /** measure */
       () => {
@@ -786,6 +989,12 @@ export class AmpStoryEmbeddedComponent {
         // TODO(#20832): Store DOMRect for the page in the store to avoid
         // having to call getBoundingClientRect().
         const pageRect = this.componentPage_./*OK*/ getBoundingClientRect();
+        const realHeight = target./*OK*/ offsetHeight;
+        const maxHeight = pageRect.height - VERTICAL_PADDING;
+        state.scaleFactor = 1;
+        if (realHeight > maxHeight) {
+          state.scaleFactor = maxHeight / realHeight;
+        }
 
         // Gap on the left of the element between full-screen size and
         // current size.
@@ -798,11 +1007,12 @@ export class AmpStoryEmbeddedComponent {
 
         // Gap on the top of the element between full-screen size and
         // current size.
-        const topGap = (embedData.height - targetRect.height) / 2;
+        const topGap = (realHeight * state.scaleFactor - targetRect.height) / 2;
         // Distance from top of page to what will be the top of the element in
         // full-screen.
         const fullScreenTop = targetRect.top - topGap - pageRect.top;
-        const centeredTop = pageRect.height / 2 - embedData.height / 2;
+        const centeredTop =
+          pageRect.height / 2 - (realHeight * state.scaleFactor) / 2;
         state.translateY = centeredTop - fullScreenTop;
       },
       /** mutate */
@@ -810,9 +1020,9 @@ export class AmpStoryEmbeddedComponent {
         target.classList.toggle('i-amphtml-expanded-component', true);
 
         embedData.transform = `translate3d(${state.translateX}px,
-            ${state.translateY}px, 0) scale(1)`;
+            ${state.translateY}px, 0) scale(${state.scaleFactor})`;
 
-        updateEmbedStyleEl(embedStyleEl, embedData);
+        updateEmbedStyleEl(target, embedStyleEl, embedData);
       }
     );
   }
@@ -824,15 +1034,15 @@ export class AmpStoryEmbeddedComponent {
    * that content around stays put.
    * @param {!Element} pageEl
    * @param {!Element} element
-   * @param {!../../../src/service/resources-interface.ResourcesInterface} resources
+   * @param {!../../../src/service/mutator-interface.MutatorInterface} mutator
    */
-  static prepareForAnimation(pageEl, element, resources) {
+  static prepareForAnimation(pageEl, element, mutator) {
     let elId = null;
 
     // When a window resize happens, we must reset the styles and prepare the
     // animation again.
     if (element.hasAttribute(EMBED_ID_ATTRIBUTE_NAME)) {
-      elId = element.getAttribute(EMBED_ID_ATTRIBUTE_NAME);
+      elId = parseInt(element.getAttribute(EMBED_ID_ATTRIBUTE_NAME), 10);
       const embedStyleEl = dev().assertElement(
         embedStyleEls[elId],
         `Failed to look up embed style element with ID ${elId}`
@@ -841,30 +1051,14 @@ export class AmpStoryEmbeddedComponent {
       embedStyleEl[AMP_EMBED_DATA] = {};
     }
 
-    const state = {};
-    resources.measureMutateElement(
+    let state = {};
+    mutator.measureMutateElement(
       element,
       /** measure */
       () => {
         const pageRect = pageEl./*OK*/ getBoundingClientRect();
         const elRect = element./*OK*/ getBoundingClientRect();
-
-        if (elRect.width >= elRect.height) {
-          state.newWidth = pageRect.width;
-          state.scaleFactor = elRect.width / state.newWidth;
-          state.newHeight = (elRect.height / elRect.width) * state.newWidth;
-        } else {
-          const maxHeight = pageRect.height - VERTICAL_PADDING;
-          state.newWidth = Math.min(
-            (elRect.width / elRect.height) * maxHeight,
-            pageRect.width
-          );
-          state.newHeight = (elRect.height / elRect.width) * state.newWidth;
-          state.scaleFactor = elRect.height / state.newHeight;
-        }
-
-        state.verticalMargin = -1 * ((state.newHeight - elRect.height) / 2);
-        state.horizontalMargin = -1 * ((state.newWidth - elRect.width) / 2);
+        state = measureStyleForEl(element, state, pageRect, elRect);
       },
       /** mutate */
       () => {
@@ -881,24 +1075,15 @@ export class AmpStoryEmbeddedComponent {
           embedStyleEls[elId] = embedStyleEl;
         }
 
-        embedStyleEls[elId][AMP_EMBED_DATA] = Object.assign(
-          {},
-          {
-            id: elId,
-            width: state.newWidth,
-            height: state.newHeight,
-            scaleFactor: state.scaleFactor,
-            transform: `scale(${state.scaleFactor})`,
-            verticalMargin: state.verticalMargin,
-            horizontalMargin: state.horizontalMargin,
-          }
-        );
+        embedStyleEls[elId][AMP_EMBED_DATA] = {
+          ...updateStyleForEl(element, elId, state),
+        };
 
         const embedStyleEl = dev().assertElement(
           embedStyleEls[elId],
           `Failed to look up embed style element with ID ${elId}`
         );
-        updateEmbedStyleEl(embedStyleEl, embedStyleEl[AMP_EMBED_DATA]);
+        updateEmbedStyleEl(element, embedStyleEl, embedStyleEl[AMP_EMBED_DATA]);
       }
     );
   }
@@ -933,7 +1118,7 @@ export class AmpStoryEmbeddedComponent {
       '.i-amphtml-tooltip-action-icon'
     );
 
-    this.resources_.mutateElement(dev().assertElement(actionIcon), () => {
+    this.mutator_.mutateElement(dev().assertElement(actionIcon), () => {
       actionIcon.classList.toggle(embedConfig.actionIcon, true);
     });
   }
@@ -964,7 +1149,7 @@ export class AmpStoryEmbeddedComponent {
 
     // Publisher specified a valid icon url.
     if (iconUrl) {
-      this.resources_.mutateElement(
+      this.mutator_.mutateElement(
         dev().assertElement(tooltipCustomIcon),
         () => {
           setImportantStyles(dev().assertElement(tooltipCustomIcon), {
@@ -976,12 +1161,9 @@ export class AmpStoryEmbeddedComponent {
     }
 
     // No icon src specified by publisher. Use default icon found in the config.
-    this.resources_.mutateElement(
-      dev().assertElement(tooltipCustomIcon),
-      () => {
-        tooltipCustomIcon.classList.add(embedConfig.customIconClassName);
-      }
-    );
+    this.mutator_.mutateElement(dev().assertElement(tooltipCustomIcon), () => {
+      tooltipCustomIcon.classList.add(embedConfig.customIconClassName);
+    });
   }
 
   /**
@@ -1019,7 +1201,7 @@ export class AmpStoryEmbeddedComponent {
   positionTooltip_(component) {
     const state = {arrowOnTop: false};
 
-    this.resources_.measureMutateElement(
+    this.mutator_.measureMutateElement(
       this.storyEl_,
       /** measure */
       () => {
@@ -1119,7 +1301,7 @@ export class AmpStoryEmbeddedComponent {
    * @private
    */
   clearTooltip_() {
-    this.resources_.mutateElement(dev().assertElement(this.tooltip_), () => {
+    this.mutator_.mutateElement(dev().assertElement(this.tooltip_), () => {
       const actionIcon = this.tooltip_.querySelector(
         '.i-amphtml-tooltip-action-icon'
       );
diff --git a/extensions/amp-story/1.0/amp-story-info-dialog.js b/extensions/amp-story/1.0/amp-story-info-dialog.js
index 95e90953e4dcf..cd21b04fda4a7 100644
--- a/extensions/amp-story/1.0/amp-story-info-dialog.js
+++ b/extensions/amp-story/1.0/amp-story-info-dialog.js
@@ -14,6 +14,11 @@
  * limitations under the License.
  */
 
+import {
+  ANALYTICS_TAG_NAME,
+  StoryAnalyticsEvent,
+  getAnalyticsService,
+} from './story-analytics';
 import {
   Action,
   StateProperty,
@@ -64,11 +69,14 @@ export class InfoDialog {
     /** @private @const {!./amp-story-store-service.AmpStoryStoreService} */
     this.storeService_ = getStoreService(this.win_);
 
+    /** @private {!./story-analytics.StoryAnalyticsService} */
+    this.analyticsService_ = getAnalyticsService(this.win_, parentEl);
+
     /** @private @const {!Element} */
     this.parentEl_ = parentEl;
 
-    /** @private @const {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(getAmpdoc(this.win_.document));
+    /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(getAmpdoc(this.win_.document));
 
     /** @private {?Element} */
     this.moreInfoLinkEl_ = null;
@@ -107,7 +115,7 @@ export class InfoDialog {
       '.i-amphtml-story-info-dialog-container'
     );
 
-    const appendPromise = this.resources_.mutateElement(this.parentEl_, () => {
+    const appendPromise = this.mutator_.mutateElement(this.parentEl_, () => {
       this.parentEl_.appendChild(root);
     });
 
@@ -152,9 +160,15 @@ export class InfoDialog {
    * @private
    */
   onInfoDialogStateUpdated_(isOpen) {
-    this.resources_.mutateElement(dev().assertElement(this.element_), () => {
+    this.mutator_.mutateElement(dev().assertElement(this.element_), () => {
       this.element_.classList.toggle(DIALOG_VISIBLE_CLASS, isOpen);
     });
+
+    this.element_[ANALYTICS_TAG_NAME] = 'amp-story-info-dialog';
+    this.analyticsService_.triggerEvent(
+      isOpen ? StoryAnalyticsEvent.OPEN : StoryAnalyticsEvent.CLOSE,
+      this.element_
+    );
   }
 
   /**
@@ -208,7 +222,7 @@ export class InfoDialog {
       this.element_.querySelector('.i-amphtml-story-info-heading')
     );
 
-    return this.resources_.mutateElement(headingEl, () => {
+    return this.mutator_.mutateElement(headingEl, () => {
       headingEl.textContent = label;
     });
   }
@@ -223,7 +237,7 @@ export class InfoDialog {
       this.element_.querySelector('.i-amphtml-story-info-link')
     );
 
-    return this.resources_.mutateElement(linkEl, () => {
+    return this.mutator_.mutateElement(linkEl, () => {
       linkEl.setAttribute('href', pageUrl);
 
       // Add zero-width space character (\u200B) after "." and "/" characters
@@ -246,7 +260,7 @@ export class InfoDialog {
       this.element_.querySelector('.i-amphtml-story-info-moreinfo')
     );
 
-    return this.resources_.mutateElement(this.moreInfoLinkEl_, () => {
+    return this.mutator_.mutateElement(this.moreInfoLinkEl_, () => {
       const label = this.localizationService_.getLocalizedString(
         LocalizedStringId.AMP_STORY_DOMAIN_DIALOG_HEADING_LINK
       );
diff --git a/extensions/amp-story/1.0/amp-story-page-attachment.js b/extensions/amp-story/1.0/amp-story-page-attachment.js
index 6d5c85b987afc..88332f02829b5 100644
--- a/extensions/amp-story/1.0/amp-story-page-attachment.js
+++ b/extensions/amp-story/1.0/amp-story-page-attachment.js
@@ -140,13 +140,15 @@ export class AmpStoryPageAttachment extends DraggableDrawer {
     const currentHistoryState = /** @type {!Object} */ (getState(
       this.win.history
     ));
-    const historyState = Object.assign({}, currentHistoryState, {
+    const historyState = {
+      ...currentHistoryState,
       [HistoryState.ATTACHMENT_PAGE_ID]: this.storeService_.get(
         StateProperty.CURRENT_PAGE_ID
       ),
-    });
+    };
 
     this.historyService_.push(() => this.closeInternal_(), historyState);
+    this.analyticsService_.triggerEvent(StoryAnalyticsEvent.OPEN, this.element);
     this.analyticsService_.triggerEvent(
       StoryAnalyticsEvent.PAGE_ATTACHMENT_ENTER
     );
@@ -183,6 +185,10 @@ export class AmpStoryPageAttachment extends DraggableDrawer {
 
     setHistoryState(this.win, HistoryState.ATTACHMENT_PAGE_ID, null);
 
+    this.analyticsService_.triggerEvent(
+      StoryAnalyticsEvent.CLOSE,
+      this.element
+    );
     this.analyticsService_.triggerEvent(
       StoryAnalyticsEvent.PAGE_ATTACHMENT_EXIT
     );
diff --git a/extensions/amp-story/1.0/amp-story-page.js b/extensions/amp-story/1.0/amp-story-page.js
index dd666c1d8c623..70c4b813e2f95 100644
--- a/extensions/amp-story/1.0/amp-story-page.js
+++ b/extensions/amp-story/1.0/amp-story-page.js
@@ -75,7 +75,7 @@ import {getMode} from '../../../src/mode';
 import {htmlFor} from '../../../src/static-template';
 import {isExperimentOn} from '../../../src/experiments';
 import {isMediaDisplayed, setTextBackgroundColor} from './utils';
-import {toggle} from '../../../src/style';
+import {px, toggle} from '../../../src/style';
 import {upgradeBackgroundAudio} from './audio';
 
 /**
@@ -191,17 +191,17 @@ export const NavigationDirection = {
  * animation.
  * @param {!Window} win
  * @param {!Element} page
- * @param {!../../../src/service/resources-interface.ResourcesInterface} resources
+ * @param {!../../../src/service/mutator-interface.MutatorInterface} mutator
  * @return {function(!Element, ?UnlistenDef)}
  */
-function debounceEmbedResize(win, page, resources) {
+function debounceEmbedResize(win, page, mutator) {
   return debounce(
     win,
     (el, unlisten) => {
       AmpStoryEmbeddedComponent.prepareForAnimation(
         page,
         dev().assertElement(el),
-        resources
+        mutator
       );
       if (unlisten) {
         unlisten();
@@ -233,6 +233,9 @@ export class AmpStoryPage extends AMP.BaseElement {
       100
     );
 
+    /** @private {boolean}  */
+    this.isFirstPage_ = false;
+
     /** @private {?LoadingSpinner} */
     this.loadingSpinner_ = null;
 
@@ -248,6 +251,9 @@ export class AmpStoryPage extends AMP.BaseElement {
     /** @private @const {!../../../src/service/resources-interface.ResourcesInterface} */
     this.resources_ = Services.resourcesForDoc(getAmpdoc(this.win.document));
 
+    /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(getAmpdoc(this.win.document));
+
     const deferred = new Deferred();
 
     /** @private @const {!./media-performance-metrics-service.MediaPerformanceMetricsService} */
@@ -267,9 +273,6 @@ export class AmpStoryPage extends AMP.BaseElement {
     /** @private @const {!function(*)} */
     this.mediaPoolRejectFn_ = deferred.reject;
 
-    /** @private {boolean}  */
-    this.prerenderAllowed_ = false;
-
     /** @private {!PageState} */
     this.state_ = PageState.NOT_ACTIVE;
 
@@ -292,9 +295,6 @@ export class AmpStoryPage extends AMP.BaseElement {
 
     /** @private {?number} Time at which an audio element failed playing. */
     this.playAudioElementFromTimestamp_ = null;
-
-    /** @private {?string} A textual description of the content of the page. */
-    this.description_ = null;
   }
 
   /**
@@ -317,10 +317,7 @@ export class AmpStoryPage extends AMP.BaseElement {
   /** @override */
   firstAttachedCallback() {
     // Only prerender the first story page.
-    this.prerenderAllowed_ = matches(
-      this.element,
-      'amp-story-page:first-of-type'
-    );
+    this.isFirstPage_ = matches(this.element, 'amp-story-page:first-of-type');
   }
 
   /** @override */
@@ -468,7 +465,9 @@ export class AmpStoryPage extends AMP.BaseElement {
 
     if (this.isActive()) {
       this.advancement_.start();
-      this.maybeStartAnimations();
+      this.prefersReducedMotion_()
+        ? this.maybeFinishAnimations_()
+        : this.maybeStartAnimations_();
       this.checkPageHasAudio_();
       this.renderOpenAttachmentUI_();
       this.findAndPrepareEmbeddedComponents_();
@@ -495,6 +494,51 @@ export class AmpStoryPage extends AMP.BaseElement {
     ]);
   }
 
+  /** @override */
+  onMeasureChanged() {
+    // Only measures from the first story page, that always gets built because
+    // of the prerendering optimizations in place.
+    if (!this.isFirstPage_) {
+      return;
+    }
+
+    return this.getVsync().runPromise(
+      {
+        measure: state => {
+          const uiState = this.storeService_.get(StateProperty.UI_STATE);
+          // The desktop panels UI uses CSS scale. Retrieving clientHeight/Width
+          // ensures we are getting the raw size, ignoring the scale.
+          const {width, height} =
+            uiState === UIType.DESKTOP_PANELS
+              ? {
+                  height: this.element./*OK*/ clientHeight,
+                  width: this.element./*OK*/ clientWidth,
+                }
+              : this.getLayoutBox();
+          state.vh = height / 100;
+          state.vw = width / 100;
+          state.fiftyVw = Math.round(width / 2);
+          state.vmin = Math.min(state.vh, state.vw);
+          state.vmax = Math.max(state.vh, state.vw);
+        },
+        mutate: state => {
+          if (state.vh === 0 && state.vw === 0) {
+            return;
+          }
+          this.win.document.documentElement.setAttribute(
+            'style',
+            `--story-page-vh: ${px(state.vh)};` +
+              `--story-page-vw: ${px(state.vw)};` +
+              `--story-page-vmin: ${px(state.vmin)};` +
+              `--story-page-vmax: ${px(state.vmax)};` +
+              `--i-amphtml-story-page-50vw: ${px(state.fiftyVw)};`
+          );
+        },
+      },
+      {}
+    );
+  }
+
   /**
    * @private
    */
@@ -509,13 +553,8 @@ export class AmpStoryPage extends AMP.BaseElement {
    */
   onUIStateUpdate_(uiState) {
     // On vertical rendering, render all the animations with their final state.
-    if (uiState === UIType.VERTICAL && this.animationManager_) {
-      this.signals()
-        .whenSignal(CommonSignals.LOAD_END)
-        .then(() => this.maybeApplyFirstAnimationFrame())
-        .then(() => {
-          this.animationManager_.finishAll();
-        });
+    if (uiState === UIType.VERTICAL) {
+      this.maybeFinishAnimations_();
     }
   }
 
@@ -610,7 +649,7 @@ export class AmpStoryPage extends AMP.BaseElement {
       const debouncePrepareForAnimation = debounceEmbedResize(
         this.win,
         this.element,
-        this.resources_
+        this.mutator_
       );
 
       if (forceResize) {
@@ -654,7 +693,7 @@ export class AmpStoryPage extends AMP.BaseElement {
 
   /** @override */
   prerenderAllowed() {
-    return this.prerenderAllowed_;
+    return this.isFirstPage_;
   }
 
   /**
@@ -1015,14 +1054,41 @@ export class AmpStoryPage extends AMP.BaseElement {
 
   /**
    * Starts playing animations, if the animation manager is available.
+   * @private
    */
-  maybeStartAnimations() {
+  maybeStartAnimations_() {
     if (!this.animationManager_) {
       return;
     }
     this.animationManager_.animateIn();
   }
 
+  /**
+   * Finishes playing animations instantly, if the animation manager is
+   * available.
+   * @private
+   */
+  maybeFinishAnimations_() {
+    if (!this.animationManager_) {
+      return;
+    }
+    this.signals()
+      .whenSignal(CommonSignals.LOAD_END)
+      .then(() => this.maybeApplyFirstAnimationFrame())
+      .then(() => {
+        this.animationManager_.finishAll();
+      });
+  }
+
+  /**
+   * Whether the device opted in prefers-reduced-motion.
+   * @return {boolean}
+   * @private
+   */
+  prefersReducedMotion_() {
+    return this.win.matchMedia('(prefers-reduced-motion: reduce)').matches;
+  }
+
   /**
    * @return {!Promise}
    */
@@ -1616,52 +1682,73 @@ export class AmpStoryPage extends AMP.BaseElement {
   }
 
   /**
-   * Sets the description of the page.
+   * Sets the description of the page, from its title and its videos
+   * alt/title attributes.
    * @private
    */
   setPageDescription_() {
-    this.description_ = this.element.getAttribute('title');
-
     if (this.isBotUserAgent_) {
       this.renderPageDescription_();
-    } else {
+    }
+
+    if (!this.isBotUserAgent_ && this.element.hasAttribute('title')) {
       // Strip the title attribute from the page on non-bot user agents, to
       // prevent the browser tooltip.
       if (!this.element.getAttribute('aria-label')) {
-        this.element.setAttribute('aria-label', this.description_);
+        this.element.setAttribute(
+          'aria-label',
+          this.element.getAttribute('title')
+        );
       }
       this.element.removeAttribute('title');
     }
   }
 
   /**
-   * Renders the page description in the page.
+   * Renders the page description, and videos title/alt attributes in the page.
    * @private
    */
   renderPageDescription_() {
-    if (!this.description_) {
-      return;
-    }
-
     const descriptionElId = `i-amphtml-story-${this.element.id}-description`;
     const descriptionEl = createElementWithAttributes(
       this.win.document,
-      'h2',
+      'div',
       dict({
         'class': 'i-amphtml-story-page-description',
         'id': descriptionElId,
       })
     );
-    descriptionEl./* OK */ textContent = this.description_;
 
-    this.element.parentElement.insertBefore(
-      descriptionEl,
-      this.element.nextElementSibling
-    );
+    const addTagToDescriptionEl = (tagName, text) => {
+      if (!text) {
+        return;
+      }
+      const el = this.win.document.createElement(tagName);
+      el./* OK */ textContent = text;
+      descriptionEl.appendChild(el);
+    };
+
+    addTagToDescriptionEl('h2', this.element.getAttribute('title'));
+
+    this.getMediaBySelector_(Selectors.ALL_AMP_VIDEO, true).forEach(videoEl => {
+      addTagToDescriptionEl('p', videoEl.getAttribute('alt'));
+      addTagToDescriptionEl('p', videoEl.getAttribute('title'));
+    });
 
-    if (!this.element.getAttribute('aria-labelledby')) {
-      this.element.setAttribute('aria-labelledby', descriptionElId);
+    if (descriptionEl.childElementCount === 0) {
+      return;
     }
+
+    this.mutateElement(() => {
+      this.element.parentElement.insertBefore(
+        descriptionEl,
+        this.element.nextElementSibling
+      );
+
+      if (!this.element.getAttribute('aria-labelledby')) {
+        this.element.setAttribute('aria-labelledby', descriptionElId);
+      }
+    });
   }
 
   /**
diff --git a/extensions/amp-story/1.0/amp-story-quiz.css b/extensions/amp-story/1.0/amp-story-quiz.css
new file mode 100644
index 0000000000000..b8341ad35d80e
--- /dev/null
+++ b/extensions/amp-story/1.0/amp-story-quiz.css
@@ -0,0 +1,328 @@
+/**
+ * Copyright 2017 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+@import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
+
+.i-amphtml-story-quiz-container {
+    --correct-color: #5BBA74 !important;
+    --correct-color-shaded: #2D8E42 !important;
+    --incorrect-color: #F34E4E !important;
+    --incorrect-color-shaded: #cc4141 !important;
+    --accent-color: #005AF0;
+    font-family: 'Poppins-bold', sans-serif !important;
+    background: var(--accent-color) !important;
+    border-radius: 32px !important;
+}
+
+.i-amphtml-story-quiz-prompt-container {
+    display: flex !important;
+    justify-items: center !important;
+    padding: 20px !important;
+    color: white !important;
+}
+
+.i-amphtml-story-quiz-prompt {
+    margin: 0px !important;
+    overflow : hidden !important;
+    text-overflow: ellipsis !important;
+    display: -webkit-box !important;
+    -webkit-line-clamp: 4 !important;
+    -webkit-box-orient: vertical !important;
+    visibility: visible !important;
+}
+
+h1.i-amphtml-story-quiz-prompt {
+    font-size: 28px !important;
+    line-height: 36px !important;
+    max-height: 144px !important;
+}
+
+h2.i-amphtml-story-quiz-prompt {
+    font-size: 22px !important;
+    line-height: 28px !important;
+    max-height: 112px !important;
+}
+
+h3.i-amphtml-story-quiz-prompt {
+    font-size: 18px !important;
+    line-height: 24px !important;
+    max-height: 96px !important;
+}
+
+.i-amphtml-story-quiz-option-container {
+    display: flex !important;
+    flex-direction: column;
+    background-color: white !important;
+    border-radius: 30px !important;
+    padding: 8px 8px 0px 8px !important;
+}
+
+.i-amphtml-story-quiz-option {
+    position: relative !important;
+    display: flex !important;
+    justify-items: start !important;
+    align-items: center !important;
+    border-radius: 30px !important;
+    padding: 8px 16px 8px 8px !important;
+    background-color: transparent !important;
+    margin-bottom: 8px !important;
+    color: #5F6368 !important;
+    border: solid 1px #DADCE0 !important;
+    font-size: 16px !important;
+    line-height: 20px !important;
+}
+
+/* Truncate option text and add an ellipsis after 2 lines. */
+.i-amphtml-story-quiz-option-text {
+    max-height: 40px !important;
+    overflow : hidden !important;
+    text-overflow: ellipsis !important;
+    display: -webkit-box !important;
+    -webkit-line-clamp: 2 !important;
+    -webkit-box-orient: vertical !important;
+    visibility: visible !important;
+}
+
+.i-amphtml-story-quiz-post-selection .i-amphtml-story-quiz-option-selected {
+    color: white !important;
+    border: solid 1px transparent !important;
+}
+
+.i-amphtml-story-quiz-answer-choice {
+    display: flex !important;
+    justify-content: center !important;
+    align-items: center !important;
+    height: 24px !important;
+    width: 24px !important;
+    min-width: 24px !important;
+    border-radius: 50% !important;
+    border: solid 2px !important;
+    padding: 5px !important;
+    margin-right: 16px !important;
+    color: var(--accent-color) !important;
+    font-size: 16px !important;
+    line-height: 16px !important;
+    font-weight: bold !important;
+}
+
+[dir=rtl ] .i-amphtml-story-quiz-answer-choice {
+    margin-left: 16px !important;
+    margin-right: 0px !important;
+}
+
+.i-amphtml-story-quiz-post-selection :not([correct]) > .i-amphtml-story-quiz-answer-choice {
+    color: var(--incorrect-color) !important;
+}
+
+.i-amphtml-story-quiz-post-selection [correct] > .i-amphtml-story-quiz-answer-choice {
+    color: var(--correct-color) !important;
+}
+
+.i-amphtml-story-quiz-post-selection .i-amphtml-story-quiz-option-selected > .i-amphtml-story-quiz-answer-choice {
+    border: solid 2px white !important;
+    animation: answer-choice-bounce forwards 600ms linear;
+}
+
+/** TODO(jackbsteinberg): Use a more a11y-friendly approach than font-size: 0px; */
+
+.i-amphtml-story-quiz-post-selection [correct] > .i-amphtml-story-quiz-answer-choice {
+    background-color: white !important;
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24' fill='%235BBA74'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z'/%3E%3C/svg%3E") !important;
+    background-repeat: no-repeat !important;
+    background-position: center !important;
+    font-size: 0 !important;
+}
+
+.i-amphtml-story-quiz-post-selection :not([correct]) > .i-amphtml-story-quiz-answer-choice {
+    background-color: white !important;
+    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24' fill='%23F34E4E'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E") !important;
+    background-repeat: no-repeat !important;
+    background-position: center !important;
+    font-size: 0 !important;
+}
+
+.i-amphtml-story-quiz-option > * {
+    position: relative !important;
+}
+
+.i-amphtml-story-quiz-option::before {
+    content: "" !important;
+    position: absolute !important;
+    top: -1px !important;
+    left: -1px !important;
+    width: 100% !important;
+    height: 100% !important;
+    border-radius: 32px !important;
+    font-size: 16px !important;
+    line-height: 20px !important;
+}
+
+.i-amphtml-story-quiz-post-selection .i-amphtml-story-quiz-option-selected[correct].i-amphtml-story-quiz-option::before {
+    animation: option-select-correct forwards 150ms cubic-bezier(0.0, 0.0, 0.2, 1) !important;
+    border: solid 1px !important;
+}
+
+.i-amphtml-story-quiz-post-selection .i-amphtml-story-quiz-option-selected:not([correct]).i-amphtml-story-quiz-option::before {
+    animation: option-select-incorrect forwards 150ms cubic-bezier(0.0, 0.0, 0.2, 1) !important;
+    border: solid 1px !important;
+}
+
+/**
+ * Proper bounce animation scale values calculated in a CodePen
+ * using methodology from Medium post "Spring Animation in CSS"
+ * by Thai Pangsakulyanont.
+ *
+ * https://codepen.io/jackbsteinberg/pen/ExaZpjZ
+ * https://medium.com/@dtinth/spring-animation-in-css-2039de6e1a03
+ */
+@keyframes answer-choice-bounce {
+    0% {
+        visibility: hidden;
+        border: solid 2px transparent;
+        transform: scale(0);
+    }
+    20% {
+        visibility: hidden;
+    }
+    21% { 
+      visibility: visible;
+      transform: scale(0.01); 
+    }
+    22% { 
+    transform: scale(0.013684856124433913); 
+    }
+    23% { transform: scale(0.051769509391971655); }
+    24% { transform: scale(0.10979880954474115); }
+    25% { transform: scale(0.18341305176970135); }
+    26% { transform: scale(0.2684509024266566); }
+    27% { transform: scale(0.3610325247585034); }
+    28% { transform: scale(0.45762347596723524); }
+    29% { transform: scale(0.5550803797992331); }
+    30% { transform: scale(0.6506797237526039); }
+    31% { transform: scale(0.7421313903611753); }
+    32% { transform: scale(0.8275787127008348); }
+    33% { transform: scale(0.9055869517056766); }
+    34% { transform: scale(0.9751221345284993); }
+    35% { transform: scale(1.0355221771929732); }
+    36% { transform: scale(1.0864621497121156); }
+    37% { transform: scale(1.1279154363439434); }
+    38% { transform: scale(1.1601124062343622); }
+    39% { transform: scale(1.1834980485255882); }
+    40% { transform: scale(1.1986898487351407); }
+    41% { transform: scale(1.206436996836743); }
+    42% { transform: scale(1.207581828257875); }
+    43% { transform: scale(1.2030242124007107); }
+    44% { transform: scale(1.1936894239073792); }
+    45% { transform: scale(1.1804998634975756); }
+    46% { transform: scale(1.164350840752402); }
+    47% { transform: scale(1.1460904928615012); }
+    48% { transform: scale(1.1265037925158579); }
+    49% { transform: scale(1.1063004955722653); }
+    50% { transform: scale(1.0861067949991137); }
+    51% { transform: scale(1.0664603815836224); }
+    52% { transform: scale(1.0478085631515224); }
+    53% { transform: scale(1.030509061484278); }
+    54% { transform: scale(1.0148330883076693); }
+    55% { transform: scale(1.0009702970651233); }
+    56% { transform: scale(0.9890352139507006); }
+    57% { transform: scale(0.9790747680699967); }
+    58% { transform: scale(0.9710765648274233); }
+    59% { transform: scale(0.9649775769542337); }
+    60% { transform: scale(0.960672962326338); }
+    61% { transform: scale(0.9580247553245481); }
+    62% { transform: scale(0.95687021755429); }
+    63% { transform: scale(0.9570296730184168); }
+    64% { transform: scale(0.9583136912471878); }
+    65% { transform: scale(0.9605295185305057); }
+    66% { transform: scale(0.9634866915404066); }
+    67% { transform: scale(0.9670017987172033); }
+    68% { transform: scale(0.9709023824217144); }
+    69% { transform: scale(0.9750299987781944); }
+    70% { transform: scale(0.9792424722317997); }
+    71% { transform: scale(0.9834153981228285); }
+    72% { transform: scale(0.987442959141541); }
+    73% { transform: scale(0.9912381305605557); }
+    74% { transform: scale(0.9947323549027182); }
+    75% { transform: scale(0.9978747694983578); }
+    76% { transform: scale(1.0006310705601353); }
+    77% { transform: scale(1.0029820953210673); }
+    78% { transform: scale(1.004922199815467); }
+    79% { transform: scale(1.0064575044046478); }
+    80% { transform: scale(1.0076040725187143); }
+    81% { transform: scale(1.008386080641916); }
+    82% { transform: scale(1.0088340296253053); }
+    83% { transform: scale(1.0089830392492103); }
+    84% { transform: scale(1.0088712598278986); }
+    85% { transform: scale(1.008538426762332); }
+    86% { transform: scale(1.0080245764803404); }
+    87% { transform: scale(1.007368935296965); }
+    88% { transform: scale(1.0066089864866092); }
+    89% { transform: scale(1.0057797153557928); }
+    90% { transform: scale(1.0049130273835836); }
+    91% { transform: scale(1.004037330572153); }
+    92% { transform: scale(1.0031772700147796); }
+    93% { transform: scale(1.0023536003154552); }
+    94% { transform: scale(1.0015831798389911); }
+    95% { transform: scale(1.0008790697761887); }
+    96% { transform: scale(1.0002507206086413); }
+    97% { transform: scale(0.9997042286789821); }
+    98% { transform: scale(0.9992426461382049); }
+    99% { transform: scale(0.9988663284742909); }
+    100% { 
+        border: solid 2px white;
+        transform: scale(1); 
+    }
+}
+
+@keyframes option-select-correct {
+    0% {
+        border-color: var(--correct-color);
+        background: var(--correct-color);
+        opacity: 0.2;
+        transform: scale(0.1);
+        color: var(--correct-color);
+    }
+    50% {
+        opacity: 1;
+        color: var(--correct-color);
+    }
+    100% {
+        border-color: var(--correct-color);
+        background: var(--correct-color);
+        transform: scale(1);
+        color: white;
+    }
+}
+
+@keyframes option-select-incorrect {
+    0% {
+        border-color: var(--incorrect-color);
+        background: var(--incorrect-color);
+        opacity: 0.2;
+        transform: scale(0.1);
+        color: var(--incorrect-color);
+    }
+    50% {
+        opacity: 1;
+        color: var(--incorrect-color);
+    }
+    100% {
+        border-color: var(--incorrect-color);
+        background: var(--incorrect-color);
+        transform: scale(1);
+        color: white;
+    }
+}
diff --git a/extensions/amp-story/1.0/amp-story-quiz.js b/extensions/amp-story/1.0/amp-story-quiz.js
new file mode 100644
index 0000000000000..6a11fdbc496bc
--- /dev/null
+++ b/extensions/amp-story/1.0/amp-story-quiz.js
@@ -0,0 +1,548 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  ANALYTICS_TAG_NAME,
+  StoryAnalyticsEvent,
+  getAnalyticsService,
+} from './story-analytics';
+import {AnalyticsVariable, getVariableService} from './variable-service';
+import {CSS} from '../../../build/amp-story-quiz-1.0.css';
+import {Services} from '../../../src/services';
+import {StateProperty, getStoreService} from './amp-story-store-service';
+import {addParamsToUrl, assertAbsoluteHttpOrHttpsUrl} from '../../../src/url';
+import {closest} from '../../../src/dom';
+import {createShadowRootWithStyle} from './utils';
+import {dev} from '../../../src/log';
+import {dict} from '../../../src/utils/object';
+import {getRequestService} from './amp-story-request-service';
+import {htmlFor} from '../../../src/static-template';
+import {toArray} from '../../../src/types';
+
+/** @const {!Array<string>} */
+const answerChoiceOptions = ['A', 'B', 'C', 'D'];
+
+/** @const {string} */
+const TAG = 'amp-story-quiz';
+
+// TODO(jackbsteinberg): Refactor quiz to extend a general interactive element class
+// and make this an enum on that class.
+/** @const {number} */
+const STORY_REACTION_TYPE_QUIZ = 0;
+
+/** @const {string} */
+const ENDPOINT_INVALID_ERROR =
+  'The publisher has specified an invalid datastore endpoint';
+
+/**
+ * @typedef {{
+ *    reactionValue: number,
+ *    totalCount: number,
+ *    selectedByUser: boolean,
+ * }}
+ */
+export let ReactionType;
+
+/**
+ * @typedef {{
+ *    totalResponseCount: number,
+ *    hasUserResponded: boolean,
+ *    responses: !Array<ReactionType>,
+ * }}
+ */
+export let ReactionResponseType;
+
+/**
+ * Generates the template for the quiz.
+ *
+ * @param {!Element} element
+ * @return {!Element}
+ */
+const buildQuizTemplate = element => {
+  const html = htmlFor(element);
+  return html`
+    <div class="i-amphtml-story-quiz-container">
+      <div class="i-amphtml-story-quiz-prompt-container"></div>
+      <div class="i-amphtml-story-quiz-option-container"></div>
+    </div>
+  `;
+};
+
+/**
+ * Generates the template for each option.
+ *
+ * @param {!Element} option
+ * @return {!Element}
+ */
+const buildOptionTemplate = option => {
+  const html = htmlFor(option);
+  return html`
+    <span class="i-amphtml-story-quiz-option">
+      <span class="i-amphtml-story-quiz-answer-choice"></span>
+    </span>
+  `;
+};
+
+export class AmpStoryQuiz extends AMP.BaseElement {
+  /**
+   * @param {!AmpElement} element
+   */
+  constructor(element) {
+    super(element);
+
+    /** @private @const {!./story-analytics.StoryAnalyticsService} */
+    this.analyticsService_ = getAnalyticsService(this.win, element);
+
+    /** @private {?Promise<!../../../src/service/cid-impl.CidDef>} */
+    this.clientIdService_ = Services.cidForDoc(this.element);
+
+    /** @private {?Promise<JsonObject>} */
+    this.clientIdPromise_ = null;
+
+    /** @private {boolean} */
+    this.hasUserSelection_ = false;
+
+    /** @private {?Element} */
+    this.quizEl_ = null;
+
+    /** @private {?string} */
+    this.reactionId_ = null;
+
+    /** @private {!./amp-story-request-service.AmpStoryRequestService} */
+    this.requestService_ = getRequestService(this.win, this.element);
+
+    /** @private {?Promise<?ReactionResponseType|?JsonObject|undefined>} */
+    this.responseDataPromise_ = null;
+
+    /** @private {?ReactionResponseType} */
+    this.responseData_ = null;
+
+    /** @private @const {!./amp-story-store-service.AmpStoryStoreService} */
+    this.storeService_ = getStoreService(this.win);
+
+    /** @const @private {!./variable-service.AmpStoryVariableService} */
+    this.variableService_ = getVariableService(this.win);
+  }
+
+  /** @override */
+  buildCallback() {
+    this.quizEl_ = buildQuizTemplate(this.element);
+    this.adjustGridLayer_();
+    this.attachContent_();
+    this.initializeListeners_();
+    createShadowRootWithStyle(this.element, this.quizEl_, CSS);
+  }
+
+  /** @override */
+  layoutCallback() {
+    return (this.responseDataPromise_ = this.element.hasAttribute('endpoint')
+      ? this.retrieveReactionData_()
+      : Promise.resolve());
+  }
+
+  /**
+   * Gets a Promise to return the unique AMP clientId
+   *
+   * @private
+   * @return {Promise<string>}
+   */
+  getClientId_() {
+    if (!this.clientIdPromise_) {
+      this.clientIdPromise_ = this.clientIdService_.then(data => {
+        return data.get(
+          {scope: 'amp-story', createCookieIfNotPresent: true},
+          /* consent */ Promise.resolve()
+        );
+      });
+    }
+    return this.clientIdPromise_;
+  }
+
+  /**
+   * Reacts to RTL state updates and triggers the UI for RTL.
+   *
+   * @param {boolean} rtlState
+   * @private
+   */
+  onRtlStateUpdate_(rtlState) {
+    this.mutateElement(() => {
+      rtlState
+        ? this.quizEl_.setAttribute('dir', 'rtl')
+        : this.quizEl_.removeAttribute('dir');
+    });
+  }
+
+  /** @override */
+  isLayoutSupported(layout) {
+    return layout === 'container';
+  }
+
+  /**
+   * @return {?Element}
+   */
+  getQuizElement() {
+    return this.quizEl_;
+  }
+
+  /**
+   * Add classes to adjust the bottom padding on the grid-layer
+   * to prevent overlap with the quiz.
+   *
+   * @private
+   */
+  adjustGridLayer_() {
+    const gridLayer = closest(dev().assertElement(this.element), el => {
+      return el.tagName.toLowerCase() === 'amp-story-grid-layer';
+    });
+
+    gridLayer.classList.add('i-amphtml-story-has-quiz');
+
+    if (gridLayer.parentElement.querySelector('amp-story-cta-layer')) {
+      gridLayer.classList.add('i-amphtml-story-has-CTA-layer');
+    }
+
+    if (gridLayer.parentElement.querySelector('amp-story-page-attachment')) {
+      gridLayer.classList.add('i-amphtml-story-has-page-attachment');
+    }
+  }
+
+  /**
+   * Finds the prompt and options content
+   * and adds it to the quiz element.
+   *
+   * @private
+   */
+  attachContent_() {
+    // TODO(jackbsteinberg): Optional prompt behavior must be implemented here
+    const promptInput = this.element.children[0];
+    // First child must be heading h1-h3
+    if (!['h1', 'h2', 'h3'].includes(promptInput.tagName.toLowerCase())) {
+      dev().error(
+        TAG,
+        'The first child must be a heading element <h1>, <h2>, or <h3>'
+      );
+    }
+
+    const prompt = document.createElement(promptInput.tagName);
+    prompt.textContent = promptInput.textContent;
+    prompt.classList.add('i-amphtml-story-quiz-prompt');
+    this.element.removeChild(promptInput);
+
+    const options = toArray(this.element.querySelectorAll('option'));
+    if (options.length < 2 || options.length > 4) {
+      dev().error(TAG, 'Improper number of options');
+    }
+
+    this.quizEl_
+      .querySelector('.i-amphtml-story-quiz-prompt-container')
+      .appendChild(prompt);
+
+    options.forEach((option, index) => this.configureOption_(option, index));
+
+    if (this.element.children.length !== 0) {
+      dev().error(TAG, 'Too many children');
+    }
+  }
+
+  /**
+   * Creates an option container with option content,
+   * adds styling and answer choices,
+   * and adds it to the quiz element.
+   *
+   * @param {Element} option
+   * @param {number} index
+   * @private
+   */
+  configureOption_(option, index) {
+    const convertedOption = buildOptionTemplate(dev().assertElement(option));
+
+    // Fill in the answer choice and set the option ID
+    convertedOption.querySelector(
+      '.i-amphtml-story-quiz-answer-choice'
+    ).textContent = answerChoiceOptions[index];
+    convertedOption.optionIndex_ = index;
+
+    // Extract and structure the option information
+    const optionText = document.createElement('span');
+    optionText.classList.add('i-amphtml-story-quiz-option-text');
+    optionText.textContent = option.textContent;
+    convertedOption.appendChild(optionText);
+
+    if (option.hasAttribute('correct')) {
+      convertedOption.setAttribute('correct', 'correct');
+    }
+    this.element.removeChild(option);
+
+    this.quizEl_
+      .querySelector('.i-amphtml-story-quiz-option-container')
+      .appendChild(convertedOption);
+  }
+
+  /**
+   * Attaches functions to each option to handle state transition.
+   *
+   * @private
+   */
+  initializeListeners_() {
+    // Add a listener for changes in the RTL state
+    this.storeService_.subscribe(
+      StateProperty.RTL_STATE,
+      rtlState => {
+        this.onRtlStateUpdate_(rtlState);
+      },
+      true /** callToInitialize */
+    );
+
+    // Add a click listener to the element to trigger the class change
+    this.quizEl_.addEventListener('click', e => this.handleTap_(e));
+  }
+
+  /**
+   * Handles a tap event on the quiz element.
+   *
+   * @param {Event} e
+   * @private
+   */
+  handleTap_(e) {
+    if (this.hasUserSelection_) {
+      return;
+    }
+
+    const optionEl = closest(
+      dev().assertElement(e.target),
+      element => {
+        return element.classList.contains('i-amphtml-story-quiz-option');
+      },
+      this.quizEl_
+    );
+
+    if (optionEl) {
+      this.handleOptionSelection_(optionEl);
+    }
+  }
+
+  /**
+   * Triggers the analytics event for quiz response.
+   *
+   * @param {!Element} optionEl
+   * @private
+   */
+  triggerAnalytics_(optionEl) {
+    this.variableService_.onVariableUpdate(
+      AnalyticsVariable.STORY_REACTION_ID,
+      this.element.getAttribute('id')
+    );
+    this.variableService_.onVariableUpdate(
+      AnalyticsVariable.STORY_REACTION_RESPONSE,
+      optionEl.optionIndex_
+    );
+    this.variableService_.onVariableUpdate(
+      AnalyticsVariable.STORY_REACTION_TYPE,
+      STORY_REACTION_TYPE_QUIZ
+    );
+
+    this.element[ANALYTICS_TAG_NAME] = 'amp-story-quiz';
+    this.analyticsService_.triggerEvent(
+      StoryAnalyticsEvent.REACTION,
+      this.element
+    );
+  }
+
+  /**
+   * @param {Element} selectedOption
+   * @private
+   */
+  updateQuizToPostSelectionState_(selectedOption) {
+    this.quizEl_.classList.add('i-amphtml-story-quiz-post-selection');
+    selectedOption.classList.add('i-amphtml-story-quiz-option-selected');
+  }
+
+  /**
+   * Triggers changes to quiz state on response interaction.
+   *
+   * @param {!Element} optionEl
+   * @private
+   */
+  handleOptionSelection_(optionEl) {
+    this.responseDataPromise_.then(() => {
+      if (this.hasUserSelection_) {
+        return;
+      }
+
+      this.triggerAnalytics_(optionEl);
+      this.hasUserSelection_ = true;
+
+      this.mutateElement(() => {
+        this.updateQuizToPostSelectionState_(optionEl);
+      });
+
+      if (this.element.hasAttribute('endpoint')) {
+        this.updateReactionData_(optionEl.optionIndex_);
+      }
+    });
+  }
+
+  /**
+   * Get the Reaction data from the datastore
+   *
+   * @return {?Promise<?ReactionResponseType|?JsonObject|undefined>}
+   * @private
+   */
+  retrieveReactionData_() {
+    return this.executeReactionRequest_(
+      dict({
+        'method': 'GET',
+      })
+    )
+      .then(response => {
+        this.handleSuccessfulDataRetrieval_(response);
+      })
+      .catch(error => {
+        dev().error(TAG, error);
+      });
+  }
+
+  /**
+   * Update the Reaction data in the datastore
+   *
+   * @param {number} reactionValue
+   * @private
+   */
+  updateReactionData_(reactionValue) {
+    this.executeReactionRequest_(
+      dict({
+        'method': 'POST',
+      }),
+      reactionValue
+    ).catch(error => {
+      dev().error(TAG, error);
+    });
+  }
+
+  /**
+   * Executes a Reactions API call.
+   *
+   * @param {Object} requestOptions
+   * @param {number=} reactionValue
+   * @return {Promise<ReactionResponseType|undefined>}
+   * @private
+   */
+  executeReactionRequest_(requestOptions, reactionValue) {
+    // TODO(jackbsteinberg): Add a default reactions endpoint.
+    if (!assertAbsoluteHttpOrHttpsUrl(this.element.getAttribute('endpoint'))) {
+      return Promise.reject(ENDPOINT_INVALID_ERROR);
+    }
+
+    if (this.reactionId_ === null) {
+      const quizPageId = closest(dev().assertElement(this.element), el => {
+        return el.tagName.toLowerCase() === 'amp-story-page';
+      }).getAttribute('id');
+
+      this.reactionId_ = `CANONICAL_URL#page=${quizPageId}`;
+    }
+
+    const requestVars = dict({
+      'reactionType': STORY_REACTION_TYPE_QUIZ,
+      'reactionId': this.reactionId_,
+    });
+
+    let url = this.element.getAttribute('endpoint');
+
+    if (requestOptions['method'] === 'POST') {
+      requestVars['reactionValue'] = reactionValue;
+      requestOptions['body'] = requestVars;
+    } else if (requestOptions['method'] === 'GET') {
+      url = addParamsToUrl(url, requestVars);
+    }
+
+    return this.getClientId_().then(clientId => {
+      requestVars['clientId'] = clientId;
+      return this.requestService_.executeRequest(url, requestOptions);
+    });
+  }
+
+  /**
+   * Handles incoming reaction data response
+   *
+   * RESPONSE FORMAT
+   * {
+   *  totalResponseCount: <number>
+   *  hasUserResponded: <boolean>
+   *  responses: [
+   *    {
+   *      reactionValue:
+   *      totalCount:
+   *      selectedByUser:
+   *    },
+   *    ...
+   *  ]
+   * }
+   * @param {ReactionResponseType|undefined} response
+   * @private
+   */
+  handleSuccessfulDataRetrieval_(response) {
+    if (!(response && 'data' in response)) {
+      dev().error(
+        TAG,
+        `Invalid reaction response, expected { data: ReactionResponseType, ...} but received ${response}`
+      );
+      return;
+    }
+
+    this.responseData_ = response.data;
+
+    this.hasUserSelection_ = this.responseData_.hasUserResponded;
+    if (this.hasUserSelection_) {
+      this.updateQuizOnDataRetrieval_();
+    }
+  }
+
+  /**
+   * Updates the quiz to reflect the state of the remote data.
+   *
+   * @private
+   */
+  updateQuizOnDataRetrieval_() {
+    let selectedOptionKey;
+    this.responseData_.responses.forEach(response => {
+      if (response.selectedByUser) {
+        selectedOptionKey = response.reactionValue;
+      }
+    });
+
+    if (selectedOptionKey === undefined) {
+      dev().error(TAG, `The user-selected reaction could not be found`);
+    }
+
+    const options = this.quizEl_.querySelectorAll(
+      '.i-amphtml-story-quiz-option'
+    );
+
+    if (selectedOptionKey >= options.length) {
+      dev().error(
+        TAG,
+        `Quiz #${this.element.getAttribute('id')} does not have option ${
+          answerChoiceOptions[selectedOptionKey]
+        }, but user selected option ${answerChoiceOptions[selectedOptionKey]}`
+      );
+      return;
+    }
+
+    this.mutateElement(() => {
+      this.updateQuizToPostSelectionState_(options[selectedOptionKey]);
+    });
+  }
+}
diff --git a/extensions/amp-story/1.0/amp-story-request-service.js b/extensions/amp-story/1.0/amp-story-request-service.js
index 226f779b33db6..667f6129398e0 100644
--- a/extensions/amp-story/1.0/amp-story-request-service.js
+++ b/extensions/amp-story/1.0/amp-story-request-service.js
@@ -71,7 +71,7 @@ export class AmpStoryRequestService {
       const credentials = bookendEl.getAttribute(
         BOOKEND_CREDENTIALS_ATTRIBUTE_NAME
       );
-      return this.loadJsonFromAttribute_(rawUrl, credentials);
+      return this.executeRequest(rawUrl, credentials ? {credentials} : {});
     }
 
     // Fallback. Check for an inline json config.
@@ -85,22 +85,15 @@ export class AmpStoryRequestService {
 
   /**
    * @param {string} rawUrl
-   * @param {string|null} credentials
+   * @param {Object=} opts
    * @return {(!Promise<!JsonObject>|!Promise<null>)}
-   * @private
    */
-  loadJsonFromAttribute_(rawUrl, credentials) {
-    const opts = {};
-
+  executeRequest(rawUrl, opts = {}) {
     if (!isProtocolValid(rawUrl)) {
       user().error(TAG, 'Invalid config url.');
       return Promise.resolve(null);
     }
 
-    if (credentials) {
-      opts.credentials = credentials;
-    }
-
     return Services.urlReplacementsForDoc(this.storyElement_)
       .expandUrlAsync(user().assertString(rawUrl))
       .then(url => this.xhr_.fetchJson(url, opts))
diff --git a/extensions/amp-story/1.0/amp-story-share-menu.js b/extensions/amp-story/1.0/amp-story-share-menu.js
index b2dc71e089965..d4174ba138185 100644
--- a/extensions/amp-story/1.0/amp-story-share-menu.js
+++ b/extensions/amp-story/1.0/amp-story-share-menu.js
@@ -14,6 +14,11 @@
  * limitations under the License.
  */
 
+import {
+  ANALYTICS_TAG_NAME,
+  StoryAnalyticsEvent,
+  getAnalyticsService,
+} from './story-analytics';
 import {
   Action,
   StateProperty,
@@ -89,6 +94,9 @@ export class ShareMenu {
     /** @private @const {!./amp-story-store-service.AmpStoryStoreService} */
     this.storeService_ = getStoreService(this.win_);
 
+    /** @private {!./story-analytics.StoryAnalyticsService} */
+    this.analyticsService_ = getAnalyticsService(this.win_, storyEl);
+
     /** @private @const {!Element} */
     this.parentEl_ = storyEl;
 
@@ -224,6 +232,11 @@ export class ShareMenu {
         this.element_.classList.toggle(VISIBLE_CLASS, isOpen);
       });
     }
+    this.element_[ANALYTICS_TAG_NAME] = 'amp-story-share-menu';
+    this.analyticsService_.triggerEvent(
+      isOpen ? StoryAnalyticsEvent.OPEN : StoryAnalyticsEvent.CLOSE,
+      this.element_
+    );
   }
 
   /**
diff --git a/extensions/amp-story/1.0/amp-story-share.js b/extensions/amp-story/1.0/amp-story-share.js
index f1d8e43333e3a..aec976c472ba1 100644
--- a/extensions/amp-story/1.0/amp-story-share.js
+++ b/extensions/amp-story/1.0/amp-story-share.js
@@ -63,13 +63,13 @@ const MIN_BUTTON_PADDING = 10;
 
 /**
  * Key for share providers in bookend config.
- * @private @const {string}
+ * @const {string}
  */
 export const SHARE_PROVIDERS_KEY = 'shareProviders';
 
 /**
  * Deprecated key for share providers in bookend config.
- * @private @const {string}
+ * @const {string}
  */
 export const DEPRECATED_SHARE_PROVIDERS_KEY = 'share-providers';
 
diff --git a/extensions/amp-story/1.0/amp-story-store-service.js b/extensions/amp-story/1.0/amp-story-store-service.js
index 7cda916c3de4a..25e96c8d489c2 100644
--- a/extensions/amp-story/1.0/amp-story-store-service.js
+++ b/extensions/amp-story/1.0/amp-story-store-service.js
@@ -111,7 +111,7 @@ export let InteractiveComponentDef;
  */
 export let State;
 
-/** @private @const @enum {string} */
+/** @const @enum {string} */
 export const StateProperty = {
   // Embed options.
   CAN_INSERT_AUTOMATIC_AD: 'canInsertAutomaticAd',
@@ -156,7 +156,7 @@ export const StateProperty = {
   PAGE_IDS: 'pageIds',
 };
 
-/** @private @const @enum {string} */
+/** @const @enum {string} */
 export const Action = {
   ADD_TO_ACTIONS_WHITELIST: 'addToActionsWhitelist',
   CHANGE_PAGE: 'setCurrentPageId',
@@ -214,17 +214,19 @@ const stateComparisonFunctions = {
 const actions = (state, action, data) => {
   switch (action) {
     case Action.ADD_NEW_PAGE_ID:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.NEW_PAGE_AVAILABLE_ID]: data,
-      }));
+      });
     case Action.ADD_TO_ACTIONS_WHITELIST:
       const newActionsWhitelist = [].concat(
         state[StateProperty.ACTIONS_WHITELIST],
         data
       );
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.ACTIONS_WHITELIST]: newActionsWhitelist,
-      }));
+      });
     // Triggers the amp-acess paywall.
     case Action.TOGGLE_ACCESS:
       // Don't change the PAUSED_STATE if ACCESS_STATE is not changed.
@@ -232,36 +234,42 @@ const actions = (state, action, data) => {
         return state;
       }
 
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.ACCESS_STATE]: !!data,
         [StateProperty.PAUSED_STATE]: !!data,
-      }));
+      });
     // Triggers the ad UI.
     case Action.TOGGLE_AD:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.AD_STATE]: !!data,
-      }));
+      });
     // Expands or collapses the affiliate link.
     case Action.TOGGLE_AFFILIATE_LINK:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.AFFILIATE_LINK_STATE]: data,
-      }));
+      });
     // Shows or hides the bookend.
     case Action.TOGGLE_BOOKEND:
       if (!state[StateProperty.CAN_SHOW_BOOKEND]) {
         return state;
       }
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.BOOKEND_STATE]: !!data,
         [StateProperty.PAUSED_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_CAN_SHOW_BOOKEND:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.CAN_SHOW_BOOKEND]: !!data,
-      }));
+      });
     case Action.TOGGLE_INTERACTIVE_COMPONENT:
       data = /** @type {InteractiveComponentDef} */ (data);
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.PAUSED_STATE]:
           data.state === EmbeddedComponentState.EXPANDED ||
           data.state === EmbeddedComponentState.FOCUSED,
@@ -269,65 +277,77 @@ const actions = (state, action, data) => {
           data.state !== EmbeddedComponentState.EXPANDED ||
           state.uiState === UIType.DESKTOP_PANELS,
         [StateProperty.INTERACTIVE_COMPONENT_STATE]: data,
-      }));
+      });
     // Shows or hides the info dialog.
     case Action.TOGGLE_INFO_DIALOG:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.INFO_DIALOG_STATE]: !!data,
         [StateProperty.PAUSED_STATE]: !!data,
-      }));
+      });
     // Shows or hides the audio controls.
     case Action.TOGGLE_STORY_HAS_AUDIO:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.STORY_HAS_AUDIO_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_STORY_HAS_BACKGROUND_AUDIO:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.STORY_HAS_BACKGROUND_AUDIO_STATE]: !!data,
-      }));
+      });
     // Mutes or unmutes the story media.
     case Action.TOGGLE_MUTED:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.MUTED_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_PAGE_HAS_AUDIO:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.PAGE_HAS_AUDIO_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_PAUSED:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.PAUSED_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_RTL:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.RTL_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_SIDEBAR:
       // Don't change the PAUSED_STATE if SIDEBAR_STATE is not changed.
       if (state[StateProperty.SIDEBAR_STATE] === data) {
         return state;
       }
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.PAUSED_STATE]: !!data,
         [StateProperty.SIDEBAR_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_HAS_SIDEBAR:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.HAS_SIDEBAR_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_SUPPORTED_BROWSER:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.SUPPORTED_BROWSER_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_SHARE_MENU:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.PAUSED_STATE]: !!data,
         [StateProperty.SHARE_MENU_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_SYSTEM_UI_IS_VISIBLE:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.SYSTEM_UI_IS_VISIBLE_STATE]: !!data,
-      }));
+      });
     case Action.TOGGLE_UI:
       if (
         state[StateProperty.UI_STATE] === UIType.VERTICAL &&
@@ -336,36 +356,42 @@ const actions = (state, action, data) => {
         dev().error(TAG, 'Cannot switch away from UIType.VERTICAL');
         return state;
       }
-      return /** @type {!State} */ (Object.assign({}, state, {
-        // Keep DESKTOP_STATE for compatiblity with v0.1.
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.DESKTOP_STATE]: data === UIType.DESKTOP_PANELS,
         [StateProperty.UI_STATE]: data,
-      }));
+      });
     case Action.TOGGLE_VIEWPORT_WARNING:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.VIEWPORT_WARNING_STATE]: !!data,
-      }));
+      });
     case Action.SET_CONSENT_ID:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.CONSENT_ID]: data,
-      }));
+      });
     case Action.CHANGE_PAGE:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.CURRENT_PAGE_ID]: data.id,
         [StateProperty.CURRENT_PAGE_INDEX]: data.index,
-      }));
+      });
     case Action.SET_ADVANCEMENT_MODE:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.ADVANCEMENT_MODE]: data,
-      }));
+      });
     case Action.SET_NAVIGATION_PATH:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.NAVIGATION_PATH]: data,
-      }));
+      });
     case Action.SET_PAGE_IDS:
-      return /** @type {!State} */ (Object.assign({}, state, {
+      return /** @type {!State} */ ({
+        ...state,
         [StateProperty.PAGE_IDS]: data,
-      }));
+      });
     default:
       dev().error(TAG, 'Unknown action %s.', action);
       return state;
@@ -387,11 +413,10 @@ export class AmpStoryStoreService {
     this.listeners_ = {};
 
     /** @private {!State} */
-    this.state_ = /** @type {!State} */ (Object.assign(
-      {},
-      this.getDefaultState_(),
-      this.getEmbedOverrides_()
-    ));
+    this.state_ = /** @type {!State} */ ({
+      ...this.getDefaultState_(),
+      ...this.getEmbedOverrides_(),
+    });
   }
 
   /**
@@ -436,7 +461,7 @@ export class AmpStoryStoreService {
    * @param  {*} data
    */
   dispatch(action, data) {
-    const oldState = Object.assign({}, this.state_);
+    const oldState = {...this.state_};
     this.state_ = actions(this.state_, action, data);
 
     let comparisonFn;
@@ -506,7 +531,7 @@ export class AmpStoryStoreService {
   /**
    * Retrieves the embed mode config, that will override the default state.
    * @return {!Object<StateProperty, *>} Partial state
-   * @private
+   * @protected
    */
   getEmbedOverrides_() {
     const embedMode = parseEmbedMode(this.win_.location.hash);
diff --git a/extensions/amp-story/1.0/amp-story-user-overridable.css b/extensions/amp-story/1.0/amp-story-user-overridable.css
index 0f98bdcfb4f31..1c23c356bd980 100644
--- a/extensions/amp-story/1.0/amp-story-user-overridable.css
+++ b/extensions/amp-story/1.0/amp-story-user-overridable.css
@@ -51,3 +51,11 @@ amp-story-grid-layer * {
 amp-story-grid-layer {
   padding: 68px 32px 32px; /* 44 + 24 */
 }
+
+amp-story-grid-layer.i-amphtml-story-has-page-attachment.i-amphtml-story-has-quiz {
+  padding-bottom: 104px;
+}
+
+amp-story-grid-layer.i-amphtml-story-has-CTA-layer.i-amphtml-story-has-quiz {
+  padding-bottom: 20%;
+}
diff --git a/extensions/amp-story/1.0/amp-story-viewer-messaging-handler.js b/extensions/amp-story/1.0/amp-story-viewer-messaging-handler.js
new file mode 100644
index 0000000000000..61b2160e6137c
--- /dev/null
+++ b/extensions/amp-story/1.0/amp-story-viewer-messaging-handler.js
@@ -0,0 +1,174 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  Action,
+  StateProperty,
+  getStoreService,
+} from './amp-story-store-service';
+import {AnalyticsVariable, getVariableService} from './variable-service';
+import {HistoryState, getHistoryState} from './utils';
+import {dev} from '../../../src/log';
+
+/** @type {string} */
+const TAG = 'amp-story-viewer-messaging-handler';
+
+/** @enum {number} */
+const DataSources = {
+  STORE_SERVICE: 0,
+  HISTORY: 1,
+  VARIABLE_SERVICE: 2,
+};
+
+/**
+ * @typedef {{
+ *   dataSource: !DataSources,
+ *   property: (!StateProperty|!HistoryState|!AnalyticsVariable)
+ * }}
+ */
+let GetStateConfigurationDef;
+
+/** @enum {!GetStateConfigurationDef} */
+const GET_STATE_CONFIGURATIONS = {
+  'CURRENT_PAGE_ID': {
+    dataSource: DataSources.STORE_SERVICE,
+    property: StateProperty.CURRENT_PAGE_ID,
+  },
+  'MUTED_STATE': {
+    dataSource: DataSources.STORE_SERVICE,
+    property: StateProperty.MUTED_STATE,
+  },
+  'PAGE_ATTACHMENT_STATE': {
+    dataSource: DataSources.HISTORY,
+    property: HistoryState.ATTACHMENT_PAGE_ID,
+  },
+  'STORY_PROGRESS': {
+    dataSource: DataSources.VARIABLE_SERVICE,
+    property: AnalyticsVariable.STORY_PROGRESS,
+  },
+};
+
+/** @typedef {{action: !Action, isValueValid: function(*):boolean}} */
+let SetStateConfigurationDef;
+
+/** @enum {!SetStateConfigurationDef} */
+const SET_STATE_CONFIGURATIONS = {
+  'MUTED_STATE': {
+    action: Action.TOGGLE_MUTED,
+    isValueValid: value => typeof value === 'boolean',
+  },
+};
+
+/**
+ * Viewer messaging handler.
+ */
+export class AmpStoryViewerMessagingHandler {
+  /**
+   * @param {!Window} win
+   * @param {!../../../src/service/viewer-interface.ViewerInterface} viewer
+   */
+  constructor(win, viewer) {
+    /** @private @const {!./amp-story-store-service.AmpStoryStoreService} */
+    this.storeService_ = getStoreService(win);
+
+    /** @private @const {!./variable-service.AmpStoryVariableService} */
+    this.variableService_ = getVariableService(win);
+
+    /** @private @const {!../../../src/service/viewer-interface.ViewerInterface} */
+    this.viewer_ = viewer;
+
+    /** @private @const {!Window} */
+    this.win_ = win;
+  }
+
+  /**
+   * @public
+   */
+  startListening() {
+    this.viewer_.onMessageRespond('getDocumentState', data =>
+      this.onGetDocumentState_(data)
+    );
+    this.viewer_.onMessageRespond('setDocumentState', data =>
+      this.onSetDocumentState_(data)
+    );
+  }
+
+  /**
+   * @param {string} eventType
+   * @param {?JsonObject|string|undefined} data
+   * @param {boolean=} cancelUnsent
+   */
+  send(eventType, data, cancelUnsent = false) {
+    this.viewer_.sendMessage(eventType, data, cancelUnsent);
+  }
+
+  /**
+   * Handles 'getDocumentState' viewer messages.
+   * @param {!Object=} data
+   * @return {!Promise}
+   * @private
+   */
+  onGetDocumentState_(data = {}) {
+    const {state} = data;
+    const config = GET_STATE_CONFIGURATIONS[state];
+
+    if (!config) {
+      return Promise.reject(`Invalid 'state' parameter`);
+    }
+
+    let value;
+
+    switch (config.dataSource) {
+      case DataSources.HISTORY:
+        value = !!getHistoryState(this.win_, config.property);
+        break;
+      case DataSources.STORE_SERVICE:
+        value = this.storeService_.get(config.property);
+        break;
+      case DataSources.VARIABLE_SERVICE:
+        value = this.variableService_.get()[config.property];
+        break;
+      default:
+        dev().error(TAG, 'Unknown data source %s.', config.dataSource);
+        break;
+    }
+
+    return Promise.resolve({state, value});
+  }
+
+  /**
+   * Handles 'setDocumentState' viewer messages.
+   * @param {!Object=} data
+   * @return {!Promise<!Object|undefined>}
+   * @private
+   */
+  onSetDocumentState_(data = {}) {
+    const {state, value} = data;
+    const config = SET_STATE_CONFIGURATIONS[state];
+
+    if (!config) {
+      return Promise.reject(`Invalid 'state' parameter`);
+    }
+
+    if (!config.isValueValid(value)) {
+      return Promise.reject(`Invalid 'value' parameter`);
+    }
+
+    this.storeService_.dispatch(config.action, value);
+
+    return Promise.resolve({state, value});
+  }
+}
diff --git a/extensions/amp-story/1.0/amp-story.css b/extensions/amp-story/1.0/amp-story.css
index 67c9574ef7b28..6cc998c243dfa 100644
--- a/extensions/amp-story/1.0/amp-story.css
+++ b/extensions/amp-story/1.0/amp-story.css
@@ -40,6 +40,15 @@ amp-consent {
   z-index: initial !important;
 }
 
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0s !important;
+    transition-duration: 0s !important;
+  }
+}
+
 /**
  * amp-hidden uses visiblity: hidden that does not propagate to shadow trees
  * because of amp-story-shadow-reset.css. Use display: none instead.
@@ -364,16 +373,6 @@ amp-story-grid-layer {
   left: 0 !important;
 }
 
-/**
- * Adds a width limit to make sure amp-twitter element only takes required
- * space, otherwise it takes whole width and causes a tooltip trigger in blank
- * space.
- * See #22334
- */
-amp-story-grid-layer amp-twitter {
-  max-width: 500px !important;
-}
-
 amp-story-grid-layer > * {
   pointer-events: auto !important;
 }
@@ -994,3 +993,12 @@ amp-story-page .i-amphtml-story-page-open-attachment-label {
   text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.36) !important;
   white-space: nowrap !important;
 }
+
+amp-story-quiz {
+  align-self: center;
+  width: auto !important;
+  height: auto !important;
+  /* 224px = the width of a narrow phone (320px) - tap-safe margins (48px * 2) */
+  min-width: 224px !important;
+  max-width: 400px !important;
+}
diff --git a/extensions/amp-story/1.0/amp-story.js b/extensions/amp-story/1.0/amp-story.js
index 37b4d9c6fbad2..be03be1ed702c 100644
--- a/extensions/amp-story/1.0/amp-story.js
+++ b/extensions/amp-story/1.0/amp-story.js
@@ -52,7 +52,9 @@ import {AmpStoryGridLayer} from './amp-story-grid-layer';
 import {AmpStoryHint} from './amp-story-hint';
 import {AmpStoryPage, NavigationDirection, PageState} from './amp-story-page';
 import {AmpStoryPageAttachment} from './amp-story-page-attachment';
+import {AmpStoryQuiz} from './amp-story-quiz';
 import {AmpStoryRenderService} from './amp-story-render-service';
+import {AmpStoryViewerMessagingHandler} from './amp-story-viewer-messaging-handler';
 import {AnalyticsVariable, getVariableService} from './variable-service';
 import {CSS} from '../../../build/amp-story-1.0.css';
 import {CommonSignals} from '../../../src/common-signals';
@@ -75,10 +77,7 @@ import {MediaPool, MediaType} from './media-pool';
 import {PaginationButtons} from './pagination-buttons';
 import {Services} from '../../../src/services';
 import {ShareMenu} from './amp-story-share-menu';
-import {
-  SwipeXYRecognizer,
-  SwipeYRecognizer,
-} from '../../../src/gesture-recognizers';
+import {SwipeXYRecognizer} from '../../../src/gesture-recognizers';
 import {SystemLayer} from './amp-story-system-layer';
 import {UnsupportedBrowserLayer} from './amp-story-unsupported-browser-layer';
 import {ViewportWarningLayer} from './amp-story-viewport-warning-layer';
@@ -95,7 +94,6 @@ import {
 } from '../../../src/dom';
 import {
   computedStyle,
-  px,
   resetStyles,
   setImportantStyles,
   toggle,
@@ -335,6 +333,11 @@ export class AmpStory extends AMP.BaseElement {
     /** @private @const {!../../../src/service/viewer-interface.ViewerInterface} */
     this.viewer_ = Services.viewerForDoc(this.element);
 
+    /** @private @const {?AmpStoryViewerMessagingHandler} */
+    this.viewerMessagingHandler_ = this.viewer_.isEmbedded()
+      ? new AmpStoryViewerMessagingHandler(this.win, this.viewer_)
+      : null;
+
     /**
      * Store the current paused state, to make sure the story does not play on
      * resume if it was previously paused.
@@ -605,40 +608,6 @@ export class AmpStory extends AMP.BaseElement {
     this.win.document.head.appendChild(meta);
   }
 
-  /**
-   * @private
-   */
-  updateViewportSizeStyles_() {
-    const pageEl =
-      (this.activePage_ && this.activePage_.element) ||
-      this.element.querySelector('amp-story-page');
-
-    if (!pageEl || !this.isStandalone_()) {
-      return;
-    }
-
-    return this.vsync_.runPromise(
-      {
-        measure: state => {
-          state.vh = pageEl./*OK*/ clientHeight / 100;
-          state.vw = pageEl./*OK*/ clientWidth / 100;
-          state.vmin = Math.min(state.vh, state.vw);
-          state.vmax = Math.max(state.vh, state.vw);
-        },
-        mutate: state => {
-          this.win.document.documentElement.setAttribute(
-            'style',
-            `--story-page-vh: ${px(state.vh)};` +
-              `--story-page-vw: ${px(state.vw)};` +
-              `--story-page-vmin: ${px(state.vmin)};` +
-              `--story-page-vmax: ${px(state.vmax)};`
-          );
-        },
-      },
-      {}
-    );
-  }
-
   /**
    * Builds the system layer DOM.
    * @param {string} initialPageId
@@ -830,22 +799,32 @@ export class AmpStory extends AMP.BaseElement {
 
     this.getViewport().onResize(debounce(this.win, () => this.onResize(), 300));
     this.installGestureRecognizers_();
+
+    // TODO(gmajoulet): migrate this to amp-story-viewer-messaging-handler once
+    // there is a way to navigate to pages that does not involve using private
+    // amp-story methods.
+    this.viewer_.onMessage('selectPage', data => this.onSelectPage_(data));
+
+    if (this.viewerMessagingHandler_) {
+      this.viewerMessagingHandler_.startListening();
+    }
   }
 
   /** @private */
   installGestureRecognizers_() {
+    // If the story is within a viewer that enabled the swipe capability, this
+    // disables the navigation education overlay to enable:
+    //   - horizontal swipe events to the next story
+    //   - vertical swipe events to close the viewer, or open a page attachment
+    if (this.viewer_.hasCapability('swipe')) {
+      return;
+    }
+
     const {element} = this;
     const gestures = Gestures.get(element, /* shouldNotPreventDefault */ true);
 
-    // If the story is within a viewer that enabled the swipe capability, this
-    // disables the navigation education overlay on the X axis to enable the
-    // swipe to the next story feature.
-    const swipeRecognizer = this.viewer_.hasCapability('swipe')
-      ? SwipeYRecognizer
-      : SwipeXYRecognizer;
-
     // Shows "tap to navigate" hint when swiping.
-    gestures.onGesture(swipeRecognizer, gesture => {
+    gestures.onGesture(SwipeXYRecognizer, gesture => {
       const {deltaX, deltaY} = gesture.data;
       const embedComponent = /** @type {InteractiveComponentDef} */ (this.storeService_.get(
         StateProperty.INTERACTIVE_COMPONENT_STATE
@@ -980,7 +959,10 @@ export class AmpStory extends AMP.BaseElement {
     this.initializeSidebar_();
     this.setThemeColor_();
 
-    const storyLayoutPromise = this.initializePages_()
+    const storyLayoutPromise = Promise.all([
+      this.getAmpDoc().whenFirstVisible(), // Pauses execution during prerender.
+      this.initializePages_(),
+    ])
       .then(() => {
         this.handleConsentExtension_();
         this.initializeStoryAccess_();
@@ -1006,7 +988,6 @@ export class AmpStory extends AMP.BaseElement {
         }
       })
       .then(() => this.switchTo_(initialPageId, NavigationDirection.NEXT))
-      .then(() => this.updateViewportSizeStyles_())
       .then(() => {
         const shouldReOpenAttachmentForPageId = getHistoryState(
           this.win,
@@ -1042,10 +1023,7 @@ export class AmpStory extends AMP.BaseElement {
     // visible.
     if (!this.getAmpDoc().hasBeenVisible()) {
       return whenUpgradedToCustomElement(firstPageEl).then(() => {
-        return Promise.all([
-          firstPageEl.whenBuilt(),
-          this.updateViewportSizeStyles_(),
-        ]);
+        return firstPageEl.whenBuilt();
       });
     }
 
@@ -1317,8 +1295,8 @@ export class AmpStory extends AMP.BaseElement {
    * @private
    */
   onNoNextPage_() {
-    if (this.viewer_.hasCapability('swipe')) {
-      this.viewer_./*OK*/ sendMessage('selectDocument', dict({'next': true}));
+    if (this.viewer_.hasCapability('swipe') && this.viewerMessagingHandler_) {
+      this.viewerMessagingHandler_.send('selectDocument', dict({'next': true}));
       return;
     }
 
@@ -1346,8 +1324,8 @@ export class AmpStory extends AMP.BaseElement {
    * @private
    */
   onNoPreviousPage_() {
-    if (this.viewer_.hasCapability('swipe')) {
-      this.viewer_./*OK*/ sendMessage(
+    if (this.viewer_.hasCapability('swipe') && this.viewerMessagingHandler_) {
+      this.viewerMessagingHandler_.send(
         'selectDocument',
         dict({'previous': true})
       );
@@ -1624,7 +1602,8 @@ export class AmpStory extends AMP.BaseElement {
           el.removeAttribute(Attributes.DESKTOP_POSITION);
         });
 
-        list.forEach(({page, position}) => {
+        list.forEach(entry => {
+          const {page, position} = entry;
           page.element.setAttribute(Attributes.DESKTOP_POSITION, position);
         });
       }
@@ -1722,8 +1701,6 @@ export class AmpStory extends AMP.BaseElement {
    * @visibleForTesting
    */
   onResize() {
-    this.updateViewportSizeStyles_();
-
     const uiState = this.getUIType_();
     this.storeService_.dispatch(Action.TOGGLE_UI, uiState);
 
@@ -1959,6 +1936,11 @@ export class AmpStory extends AMP.BaseElement {
    * @private
    */
   onSidebarStateUpdate_(sidebarState) {
+    this.analyticsService_.triggerEvent(
+      sidebarState ? StoryAnalyticsEvent.OPEN : StoryAnalyticsEvent.CLOSE,
+      this.sidebar_
+    );
+
     const actions = Services.actionServiceForDoc(this.element);
     if (this.win.MutationObserver) {
       if (!this.sidebarObserver_) {
@@ -2551,6 +2533,28 @@ export class AmpStory extends AMP.BaseElement {
     );
   }
 
+  /**
+   * Handles the selectPage viewer event.
+   * @param {!JsonObject} data
+   * @private
+   */
+  onSelectPage_(data) {
+    if (!data) {
+      return;
+    }
+
+    this.storeService_.dispatch(
+      Action.SET_ADVANCEMENT_MODE,
+      AdvancementMode.VIEWER_SELECT_PAGE
+    );
+
+    if (data['next']) {
+      this.next_();
+    } else if (data['previous']) {
+      this.previous_();
+    }
+  }
+
   /**
    * Checks for the presence of a sidebar. If a sidebar does exist, then an icon
    * permitting for the opening/closing of the sidebar is shown.
@@ -2726,5 +2730,6 @@ AMP.extension('amp-story', '1.0', AMP => {
   AMP.registerElement('amp-story-grid-layer', AmpStoryGridLayer);
   AMP.registerElement('amp-story-page', AmpStoryPage);
   AMP.registerElement('amp-story-page-attachment', AmpStoryPageAttachment);
+  AMP.registerElement('amp-story-quiz', AmpStoryQuiz);
   AMP.registerServiceForDoc('amp-story-render', AmpStoryRenderService);
 });
diff --git a/extensions/amp-story/1.0/bookend/amp-story-bookend.js b/extensions/amp-story/1.0/bookend/amp-story-bookend.js
index fc8c8c83a4163..dc8788b5e31b3 100644
--- a/extensions/amp-story/1.0/bookend/amp-story-bookend.js
+++ b/extensions/amp-story/1.0/bookend/amp-story-bookend.js
@@ -382,6 +382,10 @@ export class AmpStoryBookend extends DraggableDrawer {
       HistoryState.BOOKEND_ACTIVE
     );
     isActive ? this.open(shouldAnimate) : this.closeInternal_();
+    this.analyticsService_.triggerEvent(
+      isActive ? StoryAnalyticsEvent.OPEN : StoryAnalyticsEvent.CLOSE,
+      this.element
+    );
     setHistoryState(this.win, HistoryState.BOOKEND_ACTIVE, isActive);
   }
 
@@ -631,7 +635,7 @@ export class AmpStoryBookend extends DraggableDrawer {
       .then(localizationService => {
         const bookendEls = BookendComponent.buildElements(
           components,
-          this.win.document,
+          this.win,
           localizationService
         );
         const container = dev().assertElement(
diff --git a/extensions/amp-story/1.0/bookend/bookend-component.js b/extensions/amp-story/1.0/bookend/bookend-component.js
index 626ef06845170..96af3e2a6390a 100644
--- a/extensions/amp-story/1.0/bookend/bookend-component.js
+++ b/extensions/amp-story/1.0/bookend/bookend-component.js
@@ -152,12 +152,12 @@ export class BookendComponent {
    * Builds the bookend components elements by choosing the appropriate builder
    * class and appending the elements to the container.
    * @param {!Array<BookendComponentDef>} components
-   * @param {!Document} doc
+   * @param {!Window} win
    * @param {?../../../../src/service/localization.LocalizationService} localizationService
    * @return {!DocumentFragment}
    */
-  static buildElements(components, doc, localizationService) {
-    const fragment = doc.createDocumentFragment();
+  static buildElements(components, win, localizationService) {
+    const fragment = win.document.createDocumentFragment();
 
     components = prependTitle(components, localizationService);
     components.forEach((component, index) => {
@@ -165,7 +165,7 @@ export class BookendComponent {
       if (type && componentBuilderInstanceFor(type)) {
         const el = componentBuilderInstanceFor(type).buildElement(
           component,
-          doc,
+          win,
           {position: index}
         );
         fragment.appendChild(el);
diff --git a/extensions/amp-story/1.0/bookend/components/article.js b/extensions/amp-story/1.0/bookend/components/article.js
index d385d29e08f7e..f0432dcc1ea78 100644
--- a/extensions/amp-story/1.0/bookend/components/article.js
+++ b/extensions/amp-story/1.0/bookend/components/article.js
@@ -26,6 +26,7 @@ import {
   resolveImgSrc,
   userAssertValidProtocol,
 } from '../../utils';
+import {getSourceUrl, resolveRelativeUrl} from '../../../../../src/url';
 import {htmlFor, htmlRefs} from '../../../../../src/static-template';
 import {userAssert} from '../../../../../src/log';
 
@@ -90,8 +91,8 @@ export class ArticleComponent {
   }
 
   /** @override */
-  buildElement(articleData, doc, data) {
-    const html = htmlFor(doc);
+  buildElement(articleData, win, data) {
+    const html = htmlFor(win.document);
     //TODO(#14657, #14658): Binaries resulting from htmlFor are bloated.
     const el = html`
       <a
@@ -107,7 +108,14 @@ export class ArticleComponent {
         </div>
       </a>
     `;
-    addAttributesToElement(el, dict({'href': articleData.url}));
+
+    addAttributesToElement(
+      el,
+      dict({
+        'href': resolveRelativeUrl(articleData.url, getSourceUrl(win.location)),
+      })
+    );
+
     el[AMP_STORY_BOOKEND_COMPONENT_DATA] = {
       position: data.position,
       type: BOOKEND_COMPONENT_TYPES.SMALL,
@@ -128,7 +136,7 @@ export class ArticleComponent {
 
       addAttributesToElement(
         image,
-        dict({'src': resolveImgSrc(doc, articleData.image)})
+        dict({'src': resolveImgSrc(win, articleData.image)})
       );
 
       el.appendChild(imgEl);
diff --git a/extensions/amp-story/1.0/bookend/components/bookend-component-interface.js b/extensions/amp-story/1.0/bookend/components/bookend-component-interface.js
index 07a461bb8a210..67d5d248a9502 100644
--- a/extensions/amp-story/1.0/bookend/components/bookend-component-interface.js
+++ b/extensions/amp-story/1.0/bookend/components/bookend-component-interface.js
@@ -54,9 +54,9 @@ export class BookendComponentInterface {
   /**
    * Builds the DOM element for the component.
    * @param {../bookend-component.BookendComponentDef} unusedComponentJson
-   * @param {!Document} unusedDoc
+   * @param {!Window} unusedWin
    * @param {!Object} unusedData
    * @return {!Element}
    */
-  buildElement(unusedComponentJson, unusedDoc, unusedData) {}
+  buildElement(unusedComponentJson, unusedWin, unusedData) {}
 }
diff --git a/extensions/amp-story/1.0/bookend/components/cta-link.js b/extensions/amp-story/1.0/bookend/components/cta-link.js
index 99069da085444..884b04b0a5fe6 100644
--- a/extensions/amp-story/1.0/bookend/components/cta-link.js
+++ b/extensions/amp-story/1.0/bookend/components/cta-link.js
@@ -21,6 +21,7 @@ import {
 } from './bookend-component-interface';
 import {addAttributesToElement} from '../../../../../src/dom';
 import {dict} from '../../../../../src/utils/object';
+import {getSourceUrl, resolveRelativeUrl} from '../../../../../src/url';
 import {htmlFor, htmlRefs} from '../../../../../src/static-template';
 import {isArray} from '../../../../../src/types';
 import {userAssert} from '../../../../../src/log';
@@ -85,8 +86,8 @@ export class CtaLinkComponent {
   }
 
   /** @override */
-  buildElement(ctaLinksData, doc, data) {
-    const html = htmlFor(doc);
+  buildElement(ctaLinksData, win, data) {
+    const html = htmlFor(win.document);
     const container = html`
       <div
         class="i-amphtml-story-bookend-cta-link-wrapper
@@ -101,7 +102,15 @@ export class CtaLinkComponent {
     `;
     ctaLinksData['links'].forEach(currentLink => {
       const el = linkSeed.cloneNode(/* deep */ true);
-      addAttributesToElement(el, dict({'href': currentLink['url']}));
+      addAttributesToElement(
+        el,
+        dict({
+          'href': resolveRelativeUrl(
+            currentLink['url'],
+            getSourceUrl(win.location)
+          ),
+        })
+      );
 
       if (currentLink['amphtml'] === true) {
         addAttributesToElement(el, dict({'rel': 'amphtml'}));
diff --git a/extensions/amp-story/1.0/bookend/components/heading.js b/extensions/amp-story/1.0/bookend/components/heading.js
index 7ab744285d24f..6440d1ce78074 100644
--- a/extensions/amp-story/1.0/bookend/components/heading.js
+++ b/extensions/amp-story/1.0/bookend/components/heading.js
@@ -60,8 +60,8 @@ export class HeadingComponent {
   }
 
   /** @override */
-  buildElement(headingData, doc, data) {
-    const html = htmlFor(doc);
+  buildElement(headingData, win, data) {
+    const html = htmlFor(win.document);
     const template = html`
       <h3
         class="i-amphtml-story-bookend-component
diff --git a/extensions/amp-story/1.0/bookend/components/landscape.js b/extensions/amp-story/1.0/bookend/components/landscape.js
index 0abf616a544cf..f32e48f6e198b 100644
--- a/extensions/amp-story/1.0/bookend/components/landscape.js
+++ b/extensions/amp-story/1.0/bookend/components/landscape.js
@@ -26,6 +26,7 @@ import {
   resolveImgSrc,
   userAssertValidProtocol,
 } from '../../utils';
+import {getSourceUrl, resolveRelativeUrl} from '../../../../../src/url';
 import {htmlFor, htmlRefs} from '../../../../../src/static-template';
 import {userAssert} from '../../../../../src/log';
 
@@ -96,9 +97,9 @@ export class LandscapeComponent {
   }
 
   /** @override */
-  buildElement(landscapeData, doc, data) {
+  buildElement(landscapeData, win, data) {
     landscapeData = /** @type {LandscapeComponentDef} */ (landscapeData);
-    const html = htmlFor(doc);
+    const html = htmlFor(win.document);
     const el = html`
         <a class="i-amphtml-story-bookend-landscape
             i-amphtml-story-bookend-component" target="_top">
@@ -112,7 +113,16 @@ export class LandscapeComponent {
           <div class="i-amphtml-story-bookend-component-meta"
             ref="meta"></div>
         </a>`;
-    addAttributesToElement(el, dict({'href': landscapeData.url}));
+    addAttributesToElement(
+      el,
+      dict({
+        'href': resolveRelativeUrl(
+          landscapeData.url,
+          getSourceUrl(win.location)
+        ),
+      })
+    );
+
     el[AMP_STORY_BOOKEND_COMPONENT_DATA] = {
       position: data.position,
       type: BOOKEND_COMPONENT_TYPES.LANDSCAPE,
@@ -135,7 +145,7 @@ export class LandscapeComponent {
 
     addAttributesToElement(
       image,
-      dict({'src': resolveImgSrc(doc, landscapeData.image)})
+      dict({'src': resolveImgSrc(win, landscapeData.image)})
     );
 
     meta.textContent = landscapeData.domainName;
diff --git a/extensions/amp-story/1.0/bookend/components/portrait.js b/extensions/amp-story/1.0/bookend/components/portrait.js
index 5e3dfb88112df..8133462f3eef6 100644
--- a/extensions/amp-story/1.0/bookend/components/portrait.js
+++ b/extensions/amp-story/1.0/bookend/components/portrait.js
@@ -26,6 +26,7 @@ import {
   resolveImgSrc,
   userAssertValidProtocol,
 } from '../../utils';
+import {getSourceUrl, resolveRelativeUrl} from '../../../../../src/url';
 import {htmlFor, htmlRefs} from '../../../../../src/static-template';
 import {userAssert} from '../../../../../src/log';
 
@@ -96,9 +97,9 @@ export class PortraitComponent {
   }
 
   /** @override */
-  buildElement(portraitData, doc, data) {
+  buildElement(portraitData, win, data) {
     portraitData = /** @type {PortraitComponentDef} */ (portraitData);
-    const html = htmlFor(doc);
+    const html = htmlFor(win.document);
     const el = html`
         <a class="i-amphtml-story-bookend-portrait i-amphtml-story-bookend-component" target="_top">
           <h2 class="i-amphtml-story-bookend-component-category"
@@ -111,7 +112,16 @@ export class PortraitComponent {
           <div class="i-amphtml-story-bookend-component-meta"
             ref="meta"></div>
         </a>`;
-    addAttributesToElement(el, dict({'href': portraitData.url}));
+    addAttributesToElement(
+      el,
+      dict({
+        'href': resolveRelativeUrl(
+          portraitData.url,
+          getSourceUrl(win.location)
+        ),
+      })
+    );
+
     el[AMP_STORY_BOOKEND_COMPONENT_DATA] = {
       position: data.position,
       type: BOOKEND_COMPONENT_TYPES.PORTRAIT,
@@ -133,7 +143,7 @@ export class PortraitComponent {
 
     addAttributesToElement(
       image,
-      dict({'src': resolveImgSrc(doc, portraitData.image)})
+      dict({'src': resolveImgSrc(win, portraitData.image)})
     );
 
     meta.textContent = portraitData.domainName;
diff --git a/extensions/amp-story/1.0/bookend/components/text-box.js b/extensions/amp-story/1.0/bookend/components/text-box.js
index 127c17c610a99..41eeb2ce9650d 100644
--- a/extensions/amp-story/1.0/bookend/components/text-box.js
+++ b/extensions/amp-story/1.0/bookend/components/text-box.js
@@ -56,13 +56,14 @@ export class TextBoxComponent {
    * @return {!TextBoxComponentDef}
    * @override
    * */
-  build({type, text}) {
+  build(textboxJson) {
+    const {type, text} = textboxJson;
     return {type, text};
   }
 
   /** @override */
-  buildElement(textboxData, doc, data) {
-    const html = htmlFor(doc);
+  buildElement(textboxData, win, data) {
+    const html = htmlFor(win.document);
     const container = html`
       <div
         class="i-amphtml-story-bookend-textbox
diff --git a/extensions/amp-story/1.0/embed-mode.js b/extensions/amp-story/1.0/embed-mode.js
index c857b843ca006..4a481cc306a14 100644
--- a/extensions/amp-story/1.0/embed-mode.js
+++ b/extensions/amp-story/1.0/embed-mode.js
@@ -61,7 +61,7 @@ export const EmbedModeParam = 'embedMode';
 /**
  * @param {string} str
  * @return {!EmbedMode}
- * @private
+ * @package
  */
 export function parseEmbedMode(str) {
   const params = parseQueryString(str);
diff --git a/extensions/amp-story/1.0/page-advancement.js b/extensions/amp-story/1.0/page-advancement.js
index 2c05f0d1356d8..a7eab861d0627 100644
--- a/extensions/amp-story/1.0/page-advancement.js
+++ b/extensions/amp-story/1.0/page-advancement.js
@@ -430,11 +430,20 @@ class ManualAdvancement extends AdvancementConfig {
       dev().assertElement(event.target),
       el => {
         tagName = el.tagName.toLowerCase();
+
         if (tagName === 'amp-story-page-attachment') {
           shouldHandleEvent = false;
           return true;
         }
 
+        if (
+          tagName === 'amp-story-quiz' &&
+          !this.isInScreenSideEdge_(event, this.element_.getLayoutBox())
+        ) {
+          shouldHandleEvent = false;
+          return true;
+        }
+
         if (tagName === 'amp-story-page') {
           shouldHandleEvent = true;
           return true;
diff --git a/extensions/amp-story/1.0/progress-bar.js b/extensions/amp-story/1.0/progress-bar.js
index 38e93c157361d..010a15fa1cf94 100644
--- a/extensions/amp-story/1.0/progress-bar.js
+++ b/extensions/amp-story/1.0/progress-bar.js
@@ -97,8 +97,8 @@ export class ProgressBar {
     /** @private {!../../../src/service/ampdoc-impl.AmpDoc} */
     this.ampdoc_ = Services.ampdocServiceFor(this.win_).getSingleDoc();
 
-    /** @private @const {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(this.ampdoc_);
+    /** @private @const {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(this.ampdoc_);
 
     /** @private {!Object<string, number>} */
     this.segmentIdMap_ = map();
@@ -158,7 +158,7 @@ export class ProgressBar {
           this.clear_();
         }
 
-        this.segmentsAddedPromise_ = this.resources_.mutateElement(
+        this.segmentsAddedPromise_ = this.mutator_.mutateElement(
           this.getRoot(),
           () => {
             pageIds.forEach(id => {
@@ -197,7 +197,7 @@ export class ProgressBar {
     );
 
     Services.viewportForDoc(this.ampdoc_).onResize(
-      debounce(this.win_, () => this.onResize_(), 30)
+      debounce(this.win_, () => this.onResize_(), 300)
     );
 
     this.segmentsAddedPromise_.then(() => {
@@ -240,7 +240,7 @@ export class ProgressBar {
         -(this.firstExpandedSegmentIndex_ - this.getPrevEllipsisCount_()) *
         (ELLIPSE_WIDTH_PX + SEGMENTS_MARGIN_PX);
 
-      this.resources_.mutateElement(this.getRoot(), () => {
+      this.mutator_.mutateElement(this.getRoot(), () => {
         this.getRoot().classList.toggle(
           'i-amphtml-animate-progress',
           shouldAnimate
@@ -307,7 +307,7 @@ export class ProgressBar {
    * @private
    */
   getBarWidth_() {
-    return this.resources_.measureElement(() => {
+    return this.mutator_.measureElement(() => {
       return this.getRoot()./*OK*/ getBoundingClientRect().width;
     });
   }
@@ -373,7 +373,7 @@ export class ProgressBar {
    * @private
    */
   onRtlStateUpdate_(rtlState) {
-    this.resources_.mutateElement(this.getRoot(), () => {
+    this.mutator_.mutateElement(this.getRoot(), () => {
       rtlState
         ? this.getRoot().setAttribute('dir', 'rtl')
         : this.getRoot().removeAttribute('dir');
@@ -607,7 +607,7 @@ export class ProgressBar {
         nthChildIndex
       )}) .i-amphtml-story-page-progress-value`
     );
-    this.resources_.mutateElement(devAssert(progressEl), () => {
+    this.mutator_.mutateElement(devAssert(progressEl), () => {
       let transition = 'none';
       if (withTransition) {
         // Using an eased transition only if filling the bar to 0 or 1.
diff --git a/extensions/amp-story/1.0/story-analytics.js b/extensions/amp-story/1.0/story-analytics.js
index 9da551d683cf7..d94fa5c15a099 100644
--- a/extensions/amp-story/1.0/story-analytics.js
+++ b/extensions/amp-story/1.0/story-analytics.js
@@ -21,6 +21,9 @@ import {map} from '../../../src/utils/object';
 import {registerServiceBuilder} from '../../../src/service';
 import {triggerAnalyticsEvent} from '../../../src/analytics';
 
+/** @package @const {string} */
+export const ANALYTICS_TAG_NAME = '__AMP_ANALYTICS_TAG_NAME__';
+
 /** @enum {string} */
 export const StoryAnalyticsEvent = {
   BOOKEND_CLICK: 'story-bookend-click',
@@ -29,9 +32,12 @@ export const StoryAnalyticsEvent = {
   CLICK_THROUGH: 'story-click-through',
   FOCUS: 'story-focus',
   LAST_PAGE_VISIBLE: 'story-last-page-visible',
+  OPEN: 'story-open',
+  CLOSE: 'story-close',
   PAGE_ATTACHMENT_ENTER: 'story-page-attachment-enter',
   PAGE_ATTACHMENT_EXIT: 'story-page-attachment-exit',
   PAGE_VISIBLE: 'story-page-visible',
+  REACTION: 'story-reaction',
   STORY_MUTED: 'story-audio-muted',
   STORY_UNMUTED: 'story-audio-unmuted',
 };
@@ -43,6 +49,7 @@ export const AdvancementMode = {
   AUTO_ADVANCE_MEDIA: 'autoAdvanceMedia',
   MANUAL_ADVANCE: 'manualAdvance',
   ADVANCE_TO_ADS: 'manualAdvanceFromAd',
+  VIEWER_SELECT_PAGE: 'viewerSelectPage',
 };
 
 /** @typedef {!Object<string, !PageEventCountDef>} */
@@ -159,7 +166,8 @@ export class StoryAnalyticsService {
     }
 
     if (element) {
-      details.tagName = element.tagName.toLowerCase();
+      details.tagName =
+        element[ANALYTICS_TAG_NAME] || element.tagName.toLowerCase();
       Object.assign(
         vars,
         getDataParamsFromAttributes(
@@ -170,10 +178,7 @@ export class StoryAnalyticsService {
       );
     }
 
-    return /** @type {!JsonObject} */ (Object.assign(
-      {eventDetails: details},
-      vars
-    ));
+    return /** @type {!JsonObject} */ ({eventDetails: details, ...vars});
   }
 
   /**
diff --git a/extensions/amp-story/1.0/test/integration/test-amp-story-affiliate-link.js b/extensions/amp-story/1.0/test/integration/test-amp-story-affiliate-link.js
index 8a9f8e7a08570..d3fdfd5900d13 100644
--- a/extensions/amp-story/1.0/test/integration/test-amp-story-affiliate-link.js
+++ b/extensions/amp-story/1.0/test/integration/test-amp-story-affiliate-link.js
@@ -31,11 +31,11 @@ t.run('amp-story-affiliate link', () => {
       body: `
       <amp-story standalone>
         <amp-story-page id="page-1">
-          <amp-story-grid-layer template="vertical">            
+          <amp-story-grid-layer template="vertical">
             <h1>Third Page</h1>
             <a id="blink-1" href="https://amp.dev" role="link" target="_blank" affiliate-link-icon="shopping-cart">
               amp.devamp.devamp.devamp.devamp.devamp.dev
-            </a>      
+            </a>
           </amp-story-grid-layer>
         </amp-story-page>
       </amp-story>
@@ -77,7 +77,7 @@ t.run('amp-story-affiliate link', () => {
         expect(RequestBank.withdraw()).to.throw;
       });
 
-      it('should send analytics event on external click', async () => {
+      it.skip('should send analytics event on external click', async () => {
         browser.click('#blink-1');
         browser.click('#blink-1');
         const req = await RequestBank.withdraw();
diff --git a/extensions/amp-story/1.0/test/test-amp-story-access.js b/extensions/amp-story/1.0/test/test-amp-story-access.js
index 28a1585f919ec..b385bceed310b 100644
--- a/extensions/amp-story/1.0/test/test-amp-story-access.js
+++ b/extensions/amp-story/1.0/test/test-amp-story-access.js
@@ -47,7 +47,7 @@ describes.realWin('amp-story-access', {amp: true}, env => {
 
     storyEl = win.document.createElement('amp-story');
     const storyAccessEl = win.document.createElement('amp-story-access');
-    storyAccessEl.getResources = () => win.__AMP_SERVICES.resources.obj;
+    storyAccessEl.getAmpDoc = () => storyAccessEl;
 
     storyEl.appendChild(storyAccessEl);
 
diff --git a/extensions/amp-story/1.0/test/test-amp-story-bookend.js b/extensions/amp-story/1.0/test/test-amp-story-bookend.js
index 8af6882f97182..809ae21caa4e2 100644
--- a/extensions/amp-story/1.0/test/test-amp-story-bookend.js
+++ b/extensions/amp-story/1.0/test/test-amp-story-bookend.js
@@ -30,7 +30,10 @@ import {createElementWithAttributes} from '../../../../src/dom';
 import {registerServiceBuilder} from '../../../../src/service';
 import {user} from '../../../../src/log';
 
-describes.realWin('amp-story-bookend', {amp: true}, env => {
+const location =
+  'https://www.testorigin.com/amp-stories/example/path/google.com';
+
+describes.fakeWin('amp-story-bookend', {win: {location}, amp: true}, env => {
   let win;
   let doc;
   let storyElem;
@@ -293,172 +296,229 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
     });
   });
 
-  it(
-    'should add amp-to-amp linking to individual cta links when ' +
-      'specified in the JSON config',
-    async () => {
-      const userJson = {
-        'bookendVersion': 'v1.0',
-        'shareProviders': [
-          'email',
-          {'provider': 'facebook', 'app_id': '254325784911610'},
-          'whatsapp',
-        ],
-        'components': [
-          {
-            'type': 'cta-link',
-            'links': [
-              {
-                'text': 'buttonA',
-                'url': 'google.com',
-                'amphtml': true,
-              },
-            ],
-          },
-        ],
-      };
-
-      env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
-
-      bookend.build();
-      await bookend.loadConfigAndMaybeRenderBookend();
-      const ctaLinks = bookend.bookendEl_.querySelector(
-        '.i-amphtml-story-bookend-cta-link-wrapper'
-      );
-      expect(ctaLinks.children[0]).to.have.attribute('rel');
-      expect(ctaLinks.children[0].getAttribute('rel')).to.equal('amphtml');
-    }
-  );
-
-  it('should forward the correct target when clicking on an element', async () => {
+  it('should build the users share providers', async () => {
     const userJson = {
       'bookendVersion': 'v1.0',
       'shareProviders': [
         'email',
         {'provider': 'facebook', 'app_id': '254325784911610'},
+        {
+          'provider': 'twitter',
+          'text':
+            'This is custom share text that I' +
+            ' would like for the Twitter platform',
+        },
         'whatsapp',
       ],
       'components': [
         {
-          'type': 'cta-link',
-          'links': [
-            {
-              'text': 'buttonA',
-              'url': 'google.com',
-              'amphtml': true,
-            },
-          ],
+          'type': 'heading',
+          'text': 'My Heading Title!',
+        },
+        {
+          'type': 'small',
+          'title': 'This is an example article',
+          'url': 'http://example.com/article.html',
+          'image': 'http://placehold.it/256x128',
         },
       ],
     };
 
+    const expectedShareProviders = [
+      'email',
+      {'provider': 'facebook', 'app_id': '254325784911610'},
+      {
+        'provider': 'twitter',
+        'text':
+          'This is custom share text that I ' +
+          'would like for the Twitter platform',
+      },
+      'whatsapp',
+    ];
+
     env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
-    const clickSpy = env.sandbox.spy();
-    doc.addEventListener('click', clickSpy);
 
     bookend.build();
-    await bookend.loadConfigAndMaybeRenderBookend();
-    const ctaLinks = bookend.bookendEl_.querySelector(
-      '.i-amphtml-story-bookend-cta-link-wrapper'
-    );
-    ctaLinks.children[0].onclick = function(e) {
-      e.preventDefault(); // Make the test not actually navigate.
-    };
-    ctaLinks.children[0].click();
-
-    expect(clickSpy.getCall(0).args[0]).to.contain({
-      '__AMP_CUSTOM_LINKER_TARGET__': ctaLinks.children[0],
+    const config = await bookend.loadConfigAndMaybeRenderBookend();
+    config['shareProviders'].forEach((currProvider, index) => {
+      expect(currProvider).to.deep.equal(expectedShareProviders[index]);
     });
   });
 
-  it('should fire analytics event when clicking on a link', async () => {
+  it('should ignore empty share providers', async () => {
     const userJson = {
       'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
-        'whatsapp',
+      'shareProviders': [],
+      'components': [
+        {
+          'type': 'heading',
+          'text': 'My Heading Title!',
+        },
+        {
+          'type': 'small',
+          'title': 'This is an example article',
+          'url': 'http://example.com/article.html',
+          'image': 'http://placehold.it/256x128',
+        },
       ],
+    };
+
+    env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+
+    bookend.build();
+    const config = await bookend.loadConfigAndMaybeRenderBookend();
+    expect(config['shareProviders']).to.deep.equal([]);
+  });
+
+  it('should warn when trying to use system sharing', async () => {
+    const userJson = {
+      'bookendVersion': 'v1.0',
+      'shareProviders': ['system'],
       'components': [
         {
-          'type': 'cta-link',
-          'links': [
-            {
-              'text': 'buttonA',
-              'url': 'google.com',
-              'amphtml': true,
-            },
-          ],
+          'type': 'heading',
+          'text': 'My Heading Title!',
+        },
+        {
+          'type': 'small',
+          'title': 'This is an example article',
+          'url': 'http://example.com/article.html',
+          'image': 'http://placehold.it/256x128',
         },
       ],
     };
 
+    const userWarnStub = env.sandbox.stub(user(), 'warn');
+
     env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
-    const analyticsSpy = env.sandbox.spy(analytics, 'triggerEvent');
 
     bookend.build();
     await bookend.loadConfigAndMaybeRenderBookend();
-    const ctaLinks = bookend.bookendEl_.querySelector(
-      '.i-amphtml-story-bookend-cta-link-wrapper'
+    expect(userWarnStub).to.be.calledOnce;
+    expect(userWarnStub.args[0][1]).to.be.equal(
+      '`system` is not a valid ' +
+        'share provider type. Native sharing is ' +
+        'enabled by default and cannot be turned off.'
     );
-    ctaLinks.children[0].onclick = function(e) {
-      e.preventDefault(); // Make the test not actually navigate.
+  });
+
+  it('should reject invalid user json for a textbox component', () => {
+    const textBoxComponent = new TextBoxComponent();
+    const userJson = {
+      'bookendVersion': 'v1.0',
+      'shareProviders': [
+        'email',
+        {'provider': 'facebook', 'app-id': '254325784911610'},
+        'whatsapp',
+      ],
+      'components': [
+        {
+          'type': 'heading',
+          'title': 'test',
+        },
+        {
+          'type': 'small',
+          'url': 'http://example.com/article.html',
+          'image': 'http://placehold.it/256x128',
+        },
+        {
+          'type': 'textbox',
+          'text': 'http://example.com/article.html',
+        },
+      ],
     };
-    ctaLinks.children[0].click();
 
-    expect(analyticsSpy).to.have.been.calledWith(
-      StoryAnalyticsEvent.BOOKEND_CLICK
-    );
-    expect(
-      analyticsVariables.get()[AnalyticsVariable.BOOKEND_TARGET_HREF]
-    ).to.equal('http://localhost:9876/google.com');
-    expect(
-      analyticsVariables.get()[AnalyticsVariable.BOOKEND_COMPONENT_TYPE]
-    ).to.equal('cta-link');
-    expect(
-      analyticsVariables.get()[AnalyticsVariable.BOOKEND_COMPONENT_POSITION]
-    ).to.equal(1);
+    allowConsoleError(() => {
+      expect(() => textBoxComponent.assertValidity(userJson)).to.throw(
+        'Textbox component must contain ' +
+          '`text` array and at least one element inside it, ' +
+          'skipping invalid.'
+      );
+    });
+  });
+
+  it('should have a button to re-prompt the consent if story has one', () => {
+    const consentId = 'CONSENT_ID';
+    bookend.storeService_.dispatch(Action.SET_CONSENT_ID, consentId);
+
+    bookend.build();
+
+    const promptButtonEl = bookend
+      .getShadowRoot()
+      .querySelector(`[on="tap:${consentId}.prompt"]`);
+
+    expect(promptButtonEl).to.exist;
+  });
+
+  it('should not have a button to re-prompt the consent by default', () => {
+    bookend.build();
+
+    // No element with an "on" attribute ending with ".prompt".
+    const promptButtonEl = bookend
+      .getShadowRoot()
+      .querySelector('[on$=".prompt"]');
+
+    expect(promptButtonEl).to.be.null;
   });
 
-  it('should not fire analytics event when clicking non-clickable components', async () => {
+  it('should skip invalid component name and continue building', async () => {
     const userJson = {
       'bookendVersion': 'v1.0',
       'shareProviders': [
         'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
+        {'provider': 'facebook', 'app-id': '254325784911610'},
         'whatsapp',
       ],
       'components': [
         {
-          'type': 'textbox',
-          'text': [
-            'Food by Enrique McPizza',
-            'Choreography by Gabriel Filly',
-            'Script by Alan Ecma S.',
-            'Direction by Jon Tarantino',
-          ],
+          'type': 'invalid-type',
+          'title': 'test',
+        },
+        {
+          'type': 'small',
+          'title': 'This is an example article',
+          'domainName': 'example.com',
+          'url': 'http://example.com/article.html',
+          'image': 'http://placehold.it/256x128',
         },
       ],
     };
 
     env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
-    const analyticsSpy = env.sandbox.spy(analytics, 'triggerEvent');
 
     bookend.build();
-    await bookend.loadConfigAndMaybeRenderBookend();
-    const textEl = bookend.bookendEl_.querySelector(
-      '.i-amphtml-story-bookend-text'
+    expectAsyncConsoleError(
+      /[Component `invalid-type` is not supported. Skipping invalid]/
     );
 
-    textEl.click();
+    const config = await bookend.loadConfigAndMaybeRenderBookend();
+    // Still builds rest of valid components.
+
+    // We use config.components[1] because config.components[0] is a heading
+    // that we prepend when there is no heading present in the user config.
+    expect(config.components[1]).to.deep.equal(userJson.components[1]);
+  });
+
+  it('should not add a heading component when there are no components', async () => {
+    const userJson = {
+      'bookendVersion': 'v1.0',
+      'shareProviders': [
+        'email',
+        {'provider': 'facebook', 'app_id': '254325784911610'},
+        'whatsapp',
+      ],
+      'components': [],
+    };
+
+    env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
 
-    expect(analyticsSpy).to.not.have.been.called;
+    bookend.build();
+    const config = await bookend.loadConfigAndMaybeRenderBookend();
+    expect(config.components.length).to.equal(0);
   });
 
-  it(
-    'should not add amp-to-amp linking to cta links when not ' +
-      'specified in the JSON config',
-    async () => {
+  describe('analytics', () => {
+    it('should fire analytics event when clicking on a link', async () => {
       const userJson = {
         'bookendVersion': 'v1.0',
         'shareProviders': [
@@ -471,14 +531,9 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
             'type': 'cta-link',
             'links': [
               {
-                'text': 'buttonB',
-                'url': 'google.com',
-                'amphtml': '',
-              },
-              {
-                'text': 'longtext longtext longtext longtext longtext',
+                'text': 'buttonA',
                 'url': 'google.com',
-                'amphtml': false,
+                'amphtml': true,
               },
             ],
           },
@@ -486,21 +541,35 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
       };
 
       env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+      const analyticsSpy = env.sandbox.spy(analytics, 'triggerEvent');
 
       bookend.build();
       await bookend.loadConfigAndMaybeRenderBookend();
       const ctaLinks = bookend.bookendEl_.querySelector(
         '.i-amphtml-story-bookend-cta-link-wrapper'
       );
-      expect(ctaLinks.children[0]).to.not.have.attribute('rel');
-      expect(ctaLinks.children[1]).to.not.have.attribute('rel');
-    }
-  );
-
-  it(
-    'should add amp-to-amp linking to small articles when specified ' +
-      'in the JSON config',
-    async () => {
+      ctaLinks.children[0].onclick = function(e) {
+        e.preventDefault(); // Make the test not actually navigate.
+      };
+      ctaLinks.children[0].click();
+
+      expect(analyticsSpy).to.have.been.calledWith(
+        StoryAnalyticsEvent.BOOKEND_CLICK
+      );
+      expect(
+        analyticsVariables.get()[AnalyticsVariable.BOOKEND_TARGET_HREF]
+      ).to.equal(
+        'https://www.testorigin.com/amp-stories/example/path/google.com'
+      );
+      expect(
+        analyticsVariables.get()[AnalyticsVariable.BOOKEND_COMPONENT_TYPE]
+      ).to.equal('cta-link');
+      expect(
+        analyticsVariables.get()[AnalyticsVariable.BOOKEND_COMPONENT_POSITION]
+      ).to.equal(1);
+    });
+
+    it('should not fire analytics event when clicking non-clickable components', async () => {
       const userJson = {
         'bookendVersion': 'v1.0',
         'shareProviders': [
@@ -510,31 +579,32 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
         ],
         'components': [
           {
-            'type': 'small',
-            'title': 'This is an example article!',
-            'url': 'http://example.com/article.html',
-            'image': 'http://placehold.it/256x128',
-            'amphtml': true,
+            'type': 'textbox',
+            'text': [
+              'Food by Enrique McPizza',
+              'Choreography by Gabriel Filly',
+              'Script by Alan Ecma S.',
+              'Direction by Jon Tarantino',
+            ],
           },
         ],
       };
 
       env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+      const analyticsSpy = env.sandbox.spy(analytics, 'triggerEvent');
 
       bookend.build();
       await bookend.loadConfigAndMaybeRenderBookend();
-      const articles = bookend.bookendEl_.querySelectorAll(
-        '.i-amphtml-story-bookend-article'
+      const textEl = bookend.bookendEl_.querySelector(
+        '.i-amphtml-story-bookend-text'
       );
-      expect(articles[0]).to.have.attribute('rel');
-      expect(articles[0].getAttribute('rel')).to.equal('amphtml');
-    }
-  );
 
-  it(
-    'should not add amp-to-amp linking to small articles when not ' +
-      'specified in the JSON config',
-    async () => {
+      textEl.click();
+
+      expect(analyticsSpy).to.not.have.been.called;
+    });
+
+    it('should forward the correct target when clicking on an element', async () => {
       const userJson = {
         'bookendVersion': 'v1.0',
         'shareProviders': [
@@ -544,37 +614,41 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
         ],
         'components': [
           {
-            'type': 'small',
-            'title': 'This is an example article!',
-            'url': 'http://example.com/article.html',
-            'image': 'http://placehold.it/256x128',
-          },
-          {
-            'type': 'small',
-            'title': 'This is an example article!',
-            'url': 'http://example.com/article.html',
-            'image': 'http://placehold.it/256x128',
-            'amphtml': 'true',
+            'type': 'cta-link',
+            'links': [
+              {
+                'text': 'buttonA',
+                'url': 'google.com',
+                'amphtml': true,
+              },
+            ],
           },
         ],
       };
 
       env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+      const clickSpy = env.sandbox.spy();
+      doc.addEventListener('click', clickSpy);
 
       bookend.build();
       await bookend.loadConfigAndMaybeRenderBookend();
-      const articles = bookend.bookendEl_.querySelectorAll(
-        '.i-amphtml-story-bookend-article'
+      const ctaLinks = bookend.bookendEl_.querySelector(
+        '.i-amphtml-story-bookend-cta-link-wrapper'
       );
-      expect(articles[0]).to.not.have.attribute('rel');
-      expect(articles[1]).to.not.have.attribute('rel');
-    }
-  );
+      ctaLinks.children[0].onclick = function(e) {
+        e.preventDefault(); // Make the test not actually navigate.
+      };
+      ctaLinks.children[0].click();
 
-  it(
-    'should add amp-to-amp linking to portrait articles when specified ' +
-      'in the JSON config',
-    async () => {
+      expect(clickSpy.getCall(0).args[0]).to.contain({
+        '__AMP_CUSTOM_LINKER_TARGET__': ctaLinks.children[0],
+      });
+    });
+  });
+
+  describe('cta links component', () => {
+    it('should reject invalid user json', () => {
+      const ctaLinkComponent = new CtaLinkComponent();
       const userJson = {
         'bookendVersion': 'v1.0',
         'shareProviders': [
@@ -584,9 +658,156 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
         ],
         'components': [
           {
-            'type': 'portrait',
-            'title': 'example title',
-            'category': 'example category',
+            'type': 'heading',
+            'title': 'test',
+          },
+          {
+            'type': 'small',
+            'url': 'http://example.com/article.html',
+            'image': 'http://placehold.it/256x128',
+          },
+          {
+            'type': 'cta-link',
+            'links': [],
+          },
+        ],
+      };
+
+      allowConsoleError(() => {
+        expect(() => ctaLinkComponent.assertValidity(userJson)).to.throw(
+          'CTA link component must be an array ' +
+            'and contain at least one link inside it.'
+        );
+      });
+    });
+
+    it(
+      'should add amp-to-amp linking to individual cta links when ' +
+        'specified in the JSON config',
+      async () => {
+        const userJson = {
+          'bookendVersion': 'v1.0',
+          'shareProviders': [
+            'email',
+            {'provider': 'facebook', 'app_id': '254325784911610'},
+            'whatsapp',
+          ],
+          'components': [
+            {
+              'type': 'cta-link',
+              'links': [
+                {
+                  'text': 'buttonA',
+                  'url': 'google.com',
+                  'amphtml': true,
+                },
+              ],
+            },
+          ],
+        };
+
+        env.sandbox
+          .stub(requestService, 'loadBookendConfig')
+          .resolves(userJson);
+
+        bookend.build();
+        await bookend.loadConfigAndMaybeRenderBookend();
+        const ctaLinks = bookend.bookendEl_.querySelector(
+          '.i-amphtml-story-bookend-cta-link-wrapper'
+        );
+        expect(ctaLinks.children[0]).to.have.attribute('rel');
+        expect(ctaLinks.children[0].getAttribute('rel')).to.equal('amphtml');
+      }
+    );
+
+    it(
+      'should not add amp-to-amp linking to cta links when not ' +
+        'specified in the JSON config',
+      async () => {
+        const userJson = {
+          'bookendVersion': 'v1.0',
+          'shareProviders': [
+            'email',
+            {'provider': 'facebook', 'app_id': '254325784911610'},
+            'whatsapp',
+          ],
+          'components': [
+            {
+              'type': 'cta-link',
+              'links': [
+                {
+                  'text': 'buttonB',
+                  'url': 'google.com',
+                  'amphtml': '',
+                },
+                {
+                  'text': 'longtext longtext longtext longtext longtext',
+                  'url': 'google.com',
+                  'amphtml': false,
+                },
+              ],
+            },
+          ],
+        };
+
+        env.sandbox
+          .stub(requestService, 'loadBookendConfig')
+          .resolves(userJson);
+
+        bookend.build();
+        await bookend.loadConfigAndMaybeRenderBookend();
+        const ctaLinks = bookend.bookendEl_.querySelector(
+          '.i-amphtml-story-bookend-cta-link-wrapper'
+        );
+        expect(ctaLinks.children[0]).to.not.have.attribute('rel');
+        expect(ctaLinks.children[1]).to.not.have.attribute('rel');
+      }
+    );
+  });
+
+  describe('small article component', () => {
+    it('should reject invalid user json', () => {
+      const articleComponent = new ArticleComponent();
+      const userJson = {
+        'bookendVersion': 'v1.0',
+        'shareProviders': [
+          'email',
+          {'provider': 'facebook', 'app_id': '254325784911610'},
+          'whatsapp',
+        ],
+        'components': [
+          {
+            'type': 'heading',
+            'title': 'test',
+          },
+          {
+            'type': 'small',
+            'url': 'http://example.com/article.html',
+            'image': 'http://placehold.it/256x128',
+          },
+        ],
+      };
+
+      allowConsoleError(() => {
+        expect(() => articleComponent.assertValidity(userJson)).to.throw(
+          'Small article component must contain `title`, `url` fields, ' +
+            'skipping invalid.​​​'
+        );
+      });
+    });
+
+    it('should add amp-to-amp linking when specified in the JSON config', async () => {
+      const userJson = {
+        'bookendVersion': 'v1.0',
+        'shareProviders': [
+          'email',
+          {'provider': 'facebook', 'app_id': '254325784911610'},
+          'whatsapp',
+        ],
+        'components': [
+          {
+            'type': 'small',
+            'title': 'This is an example article!',
             'url': 'http://example.com/article.html',
             'image': 'http://placehold.it/256x128',
             'amphtml': true,
@@ -599,17 +820,13 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
       bookend.build();
       await bookend.loadConfigAndMaybeRenderBookend();
       const articles = bookend.bookendEl_.querySelectorAll(
-        '.i-amphtml-story-bookend-portrait'
+        '.i-amphtml-story-bookend-article'
       );
       expect(articles[0]).to.have.attribute('rel');
       expect(articles[0].getAttribute('rel')).to.equal('amphtml');
-    }
-  );
+    });
 
-  it(
-    'should not add amp-to-amp linking to portrait articles when not ' +
-      'specified in the JSON config',
-    async () => {
+    it('should not add amp-to-amp linking when not specified in the JSON config', async () => {
       const userJson = {
         'bookendVersion': 'v1.0',
         'shareProviders': [
@@ -619,16 +836,14 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
         ],
         'components': [
           {
-            'type': 'portrait',
-            'title': 'example title',
-            'category': 'example category',
+            'type': 'small',
+            'title': 'This is an example article!',
             'url': 'http://example.com/article.html',
             'image': 'http://placehold.it/256x128',
           },
           {
-            'type': 'portrait',
-            'title': 'example title',
-            'category': 'example category',
+            'type': 'small',
+            'title': 'This is an example article!',
             'url': 'http://example.com/article.html',
             'image': 'http://placehold.it/256x128',
             'amphtml': 'true',
@@ -641,17 +856,147 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
       bookend.build();
       await bookend.loadConfigAndMaybeRenderBookend();
       const articles = bookend.bookendEl_.querySelectorAll(
-        '.i-amphtml-story-bookend-portrait'
+        '.i-amphtml-story-bookend-article'
       );
       expect(articles[0]).to.not.have.attribute('rel');
       expect(articles[1]).to.not.have.attribute('rel');
-    }
-  );
+    });
+
+    it('should resolve relative url for origin url when served from the cache', () => {
+      const component = {
+        url: './other-article.html',
+        domainName: 'example.com',
+        type: 'small',
+        title: 'This is an example article',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
+
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+
+      const article = new ArticleComponent();
+      const el = article.buildElement(component, win, {position: 0});
+      expect(el.href).to.equal(
+        'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/other-article.html'
+      );
+    });
+
+    it('should respect specified absolute URL', () => {
+      const component = {
+        url: 'https://www.anothersite.com/article.html',
+        domainName: 'example.com',
+        type: 'small',
+        title: 'This is an example article',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
+
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+
+      const article = new ArticleComponent();
+      const el = article.buildElement(component, win, {position: 0});
+      expect(el.href).to.equal('https://www.anothersite.com/article.html');
+    });
+
+    it('should rewrite thumbnail image url for cached version', () => {
+      const component = {
+        url: 'http://example.com/article.html',
+        domainName: 'example.com',
+        type: 'small',
+        title: 'This is an example article',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
+
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+
+      const article = new ArticleComponent();
+      const el = article.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/i/s/www.nationalgeographic.com/amp-stories/assets/01-iconic-american-destinations.jpg'
+      );
+    });
+
+    it('should not rewrite thumbnail image url when using absolute url', () => {
+      const component = {
+        url: 'http://example.com/small.html',
+        domainName: 'example.com',
+        type: 'small',
+        title: 'This is an example small',
+        image: 'http://placehold.it/256x128',
+      };
+
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+      const small = new ArticleComponent();
+      const el = small.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'http://placehold.it/256x128'
+      );
+    });
+
+    it('should not rewrite thumbnail image for origin documents', () => {
+      const component = {
+        url: 'http://example.com/small.html',
+        domainName: 'example.com',
+        type: 'small',
+        title: 'This is an example small',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
 
-  it(
-    'should add amp-to-amp linking to landscape articles when ' +
-      'specified in the JSON config',
-    async () => {
+      win.location.resetHref(
+        'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+      const small = new ArticleComponent();
+      const el = small.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'https://www.nationalgeographic.com/amp-stories/assets/01-iconic-american-destinations.jpg'
+      );
+    });
+  });
+
+  describe('landscape component', () => {
+    it('should reject invalid user json', () => {
+      const landscapeComponent = new LandscapeComponent();
+      const userJson = {
+        'bookendVersion': 'v1.0',
+        'shareProviders': [
+          'email',
+          {'provider': 'facebook', 'app_id': '254325784911610'},
+          'whatsapp',
+        ],
+        'components': [
+          {
+            'type': 'heading',
+            'title': 'test',
+          },
+          {
+            'type': 'small',
+            'url': 'http://example.com/article.html',
+            'image': 'http://placehold.it/256x128',
+          },
+          {
+            'type': 'landscape',
+            'url': 'http://example.com/article.html',
+            'category': 'astronomy',
+            'image': 'http://placehold.it/256x128',
+          },
+        ],
+      };
+
+      allowConsoleError(() => {
+        expect(() => landscapeComponent.assertValidity(userJson)).to.throw(
+          'Landscape component must contain `title`, `image`, ' +
+            '`url` fields, skipping invalid.'
+        );
+      });
+    });
+
+    it('should add amp-to-amp linking when specified in the JSON config', async () => {
       const userJson = {
         'bookendVersion': 'v1.0',
         'shareProviders': [
@@ -680,13 +1025,9 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
       );
       expect(articles[0]).to.have.attribute('rel');
       expect(articles[0].getAttribute('rel')).to.equal('amphtml');
-    }
-  );
+    });
 
-  it(
-    'should not add amp-to-amp linking to landscape articles when not' +
-      ' specified in the JSON config',
-    async () => {
+    it('should not add amp-to-amp linking when not specified in the JSON config', async () => {
       const userJson = {
         'bookendVersion': 'v1.0',
         'shareProviders': [
@@ -722,472 +1063,295 @@ describes.realWin('amp-story-bookend', {amp: true}, env => {
       );
       expect(articles[0]).to.not.have.attribute('rel');
       expect(articles[1]).to.not.have.attribute('rel');
-    }
-  );
+    });
 
-  it('should build the users share providers', async () => {
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
-        {
-          'provider': 'twitter',
-          'text':
-            'This is custom share text that I' +
-            ' would like for the Twitter platform',
-        },
-        'whatsapp',
-      ],
-      'components': [
-        {
-          'type': 'heading',
-          'text': 'My Heading Title!',
-        },
-        {
-          'type': 'small',
-          'title': 'This is an example article',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-      ],
-    };
+    it('should resolve relative url for origin url when served from the cache', () => {
+      const component = {
+        url: './other-article.html',
+        domainName: 'example.com',
+        type: 'landscape',
+        title: 'This is an example landscape article',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
 
-    const expectedShareProviders = [
-      'email',
-      {'provider': 'facebook', 'app_id': '254325784911610'},
-      {
-        'provider': 'twitter',
-        'text':
-          'This is custom share text that I ' +
-          'would like for the Twitter platform',
-      },
-      'whatsapp',
-    ];
+      win.location.resetHref(
+        'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
 
-    env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+      const landscape = new LandscapeComponent();
 
-    bookend.build();
-    const config = await bookend.loadConfigAndMaybeRenderBookend();
-    config['shareProviders'].forEach((currProvider, index) => {
-      expect(currProvider).to.deep.equal(expectedShareProviders[index]);
+      const el = landscape.buildElement(component, win, {position: 0});
+      expect(el.href).to.equal(
+        'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/other-article.html'
+      );
     });
-  });
 
-  it('should ignore empty share providers', async () => {
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [],
-      'components': [
-        {
-          'type': 'heading',
-          'text': 'My Heading Title!',
-        },
-        {
-          'type': 'small',
-          'title': 'This is an example article',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-      ],
-    };
+    it('should respect specified absolute URL', () => {
+      const component = {
+        url: 'https://www.anothersite.com/article.html',
+        domainName: 'example.com',
+        type: 'landscape',
+        title: 'This is an example landscape article',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
 
-    env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+      const landscape = new LandscapeComponent();
+      const el = landscape.buildElement(component, win, {position: 0});
+      expect(el.href).to.equal('https://www.anothersite.com/article.html');
+    });
 
-    bookend.build();
-    const config = await bookend.loadConfigAndMaybeRenderBookend();
-    expect(config['shareProviders']).to.deep.equal([]);
-  });
+    it('should rewrite landscape thumbnail image url for cached version', () => {
+      const component = {
+        url: 'http://example.com/landscape.html',
+        domainName: 'example.com',
+        type: 'landscape',
+        title: 'This is an example landscape',
+        image: './assets/01-iconic-american-destinations.jpg',
+      };
 
-  it('should warn when trying to use system sharing', async () => {
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': ['system'],
-      'components': [
-        {
-          'type': 'heading',
-          'text': 'My Heading Title!',
-        },
-        {
-          'type': 'small',
-          'title': 'This is an example article',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-      ],
-    };
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
 
-    const userWarnStub = env.sandbox.stub(user(), 'warn');
+      const landscape = new LandscapeComponent();
+      const el = landscape.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/i/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/assets/01-iconic-american-destinations.jpg'
+      );
+    });
 
-    env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+    it('should not rewrite thumbnail image url when using absolute url', () => {
+      const component = {
+        url: 'http://example.com/landscape.html',
+        domainName: 'example.com',
+        type: 'landscape',
+        title: 'This is an example landscape',
+        image: 'http://placehold.it/256x128',
+      };
 
-    bookend.build();
-    await bookend.loadConfigAndMaybeRenderBookend();
-    expect(userWarnStub).to.be.calledOnce;
-    expect(userWarnStub.args[0][1]).to.be.equal(
-      '`system` is not a valid ' +
-        'share provider type. Native sharing is ' +
-        'enabled by default and cannot be turned off.'
-    );
-  });
-
-  it('should reject invalid user json for article', () => {
-    const articleComponent = new ArticleComponent();
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
-        'whatsapp',
-      ],
-      'components': [
-        {
-          'type': 'heading',
-          'title': 'test',
-        },
-        {
-          'type': 'small',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-      ],
-    };
-
-    allowConsoleError(() => {
-      expect(() => articleComponent.assertValidity(userJson)).to.throw(
-        'Small article component must contain `title`, `url` fields, ' +
-          'skipping invalid.​​​'
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
       );
-    });
-  });
-
-  it('should reject invalid user json for portrait article', () => {
-    const portraitComponant = new PortraitComponent();
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
-        'whatsapp',
-      ],
-      'components': [
-        {
-          'type': 'portrait',
-          'category': 'sample',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-      ],
-    };
-
-    allowConsoleError(() => {
-      expect(() => portraitComponant.assertValidity(userJson)).to.throw(
-        'Portrait component must contain `title`, `image`, ' +
-          '`url` fields, skipping invalid.'
+      const landscape = new LandscapeComponent();
+      const el = landscape.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'http://placehold.it/256x128'
       );
     });
-  });
 
-  it('should reject invalid user json for the cta links component', () => {
-    const ctaLinkComponent = new CtaLinkComponent();
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
-        'whatsapp',
-      ],
-      'components': [
-        {
-          'type': 'heading',
-          'title': 'test',
-        },
-        {
-          'type': 'small',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-        {
-          'type': 'cta-link',
-          'links': [],
-        },
-      ],
-    };
+    it('should not rewrite thumbnail image for origin documents', () => {
+      const component = {
+        url: 'http://example.com/landscape.html',
+        domainName: 'example.com',
+        type: 'small',
+        title: 'This is an example landscape',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
 
-    allowConsoleError(() => {
-      expect(() => ctaLinkComponent.assertValidity(userJson)).to.throw(
-        'CTA link component must be an array ' +
-          'and contain at least one link inside it.'
+      win.location.resetHref(
+        'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
       );
-    });
-  });
-
-  it('should reject invalid user json for a landscape component', () => {
-    const landscapeComponent = new LandscapeComponent();
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
-        'whatsapp',
-      ],
-      'components': [
-        {
-          'type': 'heading',
-          'title': 'test',
-        },
-        {
-          'type': 'small',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-        {
-          'type': 'landscape',
-          'url': 'http://example.com/article.html',
-          'category': 'astronomy',
-          'image': 'http://placehold.it/256x128',
-        },
-      ],
-    };
-
-    allowConsoleError(() => {
-      expect(() => landscapeComponent.assertValidity(userJson)).to.throw(
-        'Landscape component must contain `title`, `image`, ' +
-          '`url` fields, skipping invalid.'
+      const landscape = new LandscapeComponent();
+      const el = landscape.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'https://www.nationalgeographic.com/amp-stories/assets/01-iconic-american-destinations.jpg'
       );
     });
   });
 
-  it('should reject invalid user json for a textbox component', () => {
-    const textBoxComponent = new TextBoxComponent();
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app-id': '254325784911610'},
-        'whatsapp',
-      ],
-      'components': [
-        {
-          'type': 'heading',
-          'title': 'test',
-        },
-        {
-          'type': 'small',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-        {
-          'type': 'textbox',
-          'text': 'http://example.com/article.html',
-        },
-      ],
-    };
+  describe('portrait component', () => {
+    it('should reject invalid user json', () => {
+      const portraitComponant = new PortraitComponent();
+      const userJson = {
+        'bookendVersion': 'v1.0',
+        'shareProviders': [
+          'email',
+          {'provider': 'facebook', 'app_id': '254325784911610'},
+          'whatsapp',
+        ],
+        'components': [
+          {
+            'type': 'portrait',
+            'category': 'sample',
+            'url': 'http://example.com/article.html',
+            'image': 'http://placehold.it/256x128',
+          },
+        ],
+      };
 
-    allowConsoleError(() => {
-      expect(() => textBoxComponent.assertValidity(userJson)).to.throw(
-        'Textbox component must contain ' +
-          '`text` array and at least one element inside it, ' +
-          'skipping invalid.'
-      );
+      allowConsoleError(() => {
+        expect(() => portraitComponant.assertValidity(userJson)).to.throw(
+          'Portrait component must contain `title`, `image`, ' +
+            '`url` fields, skipping invalid.'
+        );
+      });
     });
-  });
-
-  it('should have a button to re-prompt the consent if story has one', () => {
-    const consentId = 'CONSENT_ID';
-    bookend.storeService_.dispatch(Action.SET_CONSENT_ID, consentId);
-
-    bookend.build();
-
-    const promptButtonEl = bookend
-      .getShadowRoot()
-      .querySelector(`[on="tap:${consentId}.prompt"]`);
-
-    expect(promptButtonEl).to.exist;
-  });
-
-  it('should not have a button to re-prompt the consent by default', () => {
-    bookend.build();
 
-    // No element with an "on" attribute ending with ".prompt".
-    const promptButtonEl = bookend
-      .getShadowRoot()
-      .querySelector('[on$=".prompt"]');
-
-    expect(promptButtonEl).to.be.null;
-  });
-
-  it('should skip invalid component name and continue building', async () => {
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app-id': '254325784911610'},
-        'whatsapp',
-      ],
-      'components': [
-        {
-          'type': 'invalid-type',
-          'title': 'test',
-        },
-        {
-          'type': 'small',
-          'title': 'This is an example article',
-          'domainName': 'example.com',
-          'url': 'http://example.com/article.html',
-          'image': 'http://placehold.it/256x128',
-        },
-      ],
-    };
+    it('should add amp-to-amp linking when specified in the JSON config', async () => {
+      const userJson = {
+        'bookendVersion': 'v1.0',
+        'shareProviders': [
+          'email',
+          {'provider': 'facebook', 'app_id': '254325784911610'},
+          'whatsapp',
+        ],
+        'components': [
+          {
+            'type': 'portrait',
+            'title': 'example title',
+            'category': 'example category',
+            'url': 'http://example.com/article.html',
+            'image': 'http://placehold.it/256x128',
+            'amphtml': true,
+          },
+        ],
+      };
 
-    env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+      env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
 
-    bookend.build();
-    expectAsyncConsoleError(
-      /[Component `invalid-type` is not supported. Skipping invalid]/
-    );
+      bookend.build();
+      await bookend.loadConfigAndMaybeRenderBookend();
+      const articles = bookend.bookendEl_.querySelectorAll(
+        '.i-amphtml-story-bookend-portrait'
+      );
+      expect(articles[0]).to.have.attribute('rel');
+      expect(articles[0].getAttribute('rel')).to.equal('amphtml');
+    });
 
-    const config = await bookend.loadConfigAndMaybeRenderBookend();
-    // Still builds rest of valid components.
+    it('should not add amp-to-amp linking when not specified in the JSON config', async () => {
+      const userJson = {
+        'bookendVersion': 'v1.0',
+        'shareProviders': [
+          'email',
+          {'provider': 'facebook', 'app_id': '254325784911610'},
+          'whatsapp',
+        ],
+        'components': [
+          {
+            'type': 'portrait',
+            'title': 'example title',
+            'category': 'example category',
+            'url': 'http://example.com/article.html',
+            'image': 'http://placehold.it/256x128',
+          },
+          {
+            'type': 'portrait',
+            'title': 'example title',
+            'category': 'example category',
+            'url': 'http://example.com/article.html',
+            'image': 'http://placehold.it/256x128',
+            'amphtml': 'true',
+          },
+        ],
+      };
 
-    // We use config.components[1] because config.components[0] is a heading
-    // that we prepend when there is no heading present in the user config.
-    expect(config.components[1]).to.deep.equal(userJson.components[1]);
-  });
+      env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
 
-  it('should not add a heading component when there are no components', async () => {
-    const userJson = {
-      'bookendVersion': 'v1.0',
-      'shareProviders': [
-        'email',
-        {'provider': 'facebook', 'app_id': '254325784911610'},
-        'whatsapp',
-      ],
-      'components': [],
-    };
+      bookend.build();
+      await bookend.loadConfigAndMaybeRenderBookend();
+      const articles = bookend.bookendEl_.querySelectorAll(
+        '.i-amphtml-story-bookend-portrait'
+      );
+      expect(articles[0]).to.not.have.attribute('rel');
+      expect(articles[1]).to.not.have.attribute('rel');
+    });
 
-    env.sandbox.stub(requestService, 'loadBookendConfig').resolves(userJson);
+    it('should resolve relative url for origin url when served from the cache', () => {
+      const component = {
+        url: './other-article.html',
+        domainName: 'example.com',
+        type: 'portrait',
+        title: 'This is an example portrait article',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
 
-    bookend.build();
-    const config = await bookend.loadConfigAndMaybeRenderBookend();
-    expect(config.components.length).to.equal(0);
-  });
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
 
-  it('should rewrite article thumbnail image url for cached version', async () => {
-    const component = {
-      url: 'http://example.com/article.html',
-      domainName: 'example.com',
-      type: 'small',
-      title: 'This is an example article',
-      image: '../../assets/01-iconic-american-destinations.jpg',
-    };
+      const portrait = new PortraitComponent();
+      const el = portrait.buildElement(component, win, {position: 0});
+      expect(el.href).to.equal(
+        'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/other-article.html'
+      );
+    });
 
-    const fakeDoc = {
-      createElement: doc.createElement.bind(doc),
-      body: doc.body,
-      location: {
-        href:
-          'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/',
-      },
-    };
-    const article = new ArticleComponent();
-    const el = article.buildElement(component, fakeDoc, {position: 0});
-    expect(el.querySelector('img').src).to.equal(
-      'https://www-nationalgeographic-com.cdn.ampproject.org/i/s/www.nationalgeographic.com/amp-stories/assets/01-iconic-american-destinations.jpg'
-    );
-  });
+    it('should respect specified absolute URL', () => {
+      const component = {
+        url: 'https://www.anothersite.com/article.html',
+        domainName: 'example.com',
+        type: 'portrait',
+        title: 'This is an example portrait article',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
 
-  it('should rewrite landscape thumbnail image url for cached version', async () => {
-    const component = {
-      url: 'http://example.com/landscape.html',
-      domainName: 'example.com',
-      type: 'landscape',
-      title: 'This is an example landscape',
-      image: './assets/01-iconic-american-destinations.jpg',
-    };
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
 
-    const fakeDoc = {
-      createElement: doc.createElement.bind(doc),
-      body: doc.body,
-      location: {
-        href:
-          'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/',
-      },
-    };
-    const landscape = new LandscapeComponent();
-    const el = landscape.buildElement(component, fakeDoc, {position: 0});
-    expect(el.querySelector('img').src).to.equal(
-      'https://www-nationalgeographic-com.cdn.ampproject.org/i/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/assets/01-iconic-american-destinations.jpg'
-    );
-  });
+      const portrait = new PortraitComponent();
+      const el = portrait.buildElement(component, win, {position: 0});
+      expect(el.href).to.equal('https://www.anothersite.com/article.html');
+    });
 
-  it('should rewrite portrait thumbnail image url for cached version', async () => {
-    const component = {
-      url: 'http://example.com/portrait.html',
-      domainName: 'example.com',
-      type: 'small',
-      title: 'This is an example portrait',
-      image: 'assets/01-iconic-american-destinations.jpg',
-    };
+    it('should rewrite thumbnail image url for cached version', () => {
+      const component = {
+        url: 'http://example.com/portrait.html',
+        domainName: 'example.com',
+        type: 'portrait',
+        title: 'This is an example portrait',
+        image: 'assets/01-iconic-american-destinations.jpg',
+      };
 
-    const fakeDoc = {
-      createElement: doc.createElement.bind(doc),
-      body: doc.body,
-      location: {
-        href:
-          'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/',
-      },
-    };
-    const portrait = new PortraitComponent();
-    const el = portrait.buildElement(component, fakeDoc, {position: 0});
-    expect(el.querySelector('img').src).to.equal(
-      'https://www-nationalgeographic-com.cdn.ampproject.org/i/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/assets/01-iconic-american-destinations.jpg'
-    );
-  });
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+      const portrait = new PortraitComponent();
+      const el = portrait.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/i/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/assets/01-iconic-american-destinations.jpg'
+      );
+    });
 
-  it('should not rewrite thumbnail image url when using absolute url', async () => {
-    const component = {
-      url: 'http://example.com/portrait.html',
-      domainName: 'example.com',
-      type: 'small',
-      title: 'This is an example portrait',
-      image: 'http://placehold.it/256x128',
-    };
+    it('should not rewrite thumbnail image url when using absolute url', () => {
+      const component = {
+        url: 'http://example.com/portrait.html',
+        domainName: 'example.com',
+        type: 'portrait',
+        title: 'This is an example portrait',
+        image: 'http://placehold.it/256x128',
+      };
 
-    const fakeDoc = {
-      createElement: doc.createElement.bind(doc),
-      body: doc.body,
-      location: {
-        href:
-          'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/',
-      },
-    };
-    const portrait = new PortraitComponent();
-    const el = portrait.buildElement(component, fakeDoc, {position: 0});
-    expect(el.querySelector('img').src).to.equal('http://placehold.it/256x128');
-  });
+      win.location.resetHref(
+        'https://www-nationalgeographic-com.cdn.ampproject.org/c/s/www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+      const portrait = new PortraitComponent();
+      const el = portrait.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'http://placehold.it/256x128'
+      );
+    });
 
-  it('should not rewrite thumbnail image for origin documents', async () => {
-    const component = {
-      url: 'http://example.com/portrait.html',
-      domainName: 'example.com',
-      type: 'small',
-      title: 'This is an example portrait',
-      image: '../../assets/01-iconic-american-destinations.jpg',
-    };
+    it('should not rewrite thumbnail image for origin documents', () => {
+      const component = {
+        url: 'http://example.com/portrait.html',
+        domainName: 'example.com',
+        type: 'small',
+        title: 'This is an example portrait',
+        image: '../../assets/01-iconic-american-destinations.jpg',
+      };
 
-    const fakeDoc = {
-      createElement: doc.createElement.bind(doc),
-      body: doc.body,
-      location: {
-        href:
-          'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/',
-      },
-    };
-    const portrait = new PortraitComponent();
-    const el = portrait.buildElement(component, fakeDoc, {position: 0});
-    expect(el.querySelector('img').src).to.equal(
-      'https://www.nationalgeographic.com/amp-stories/assets/01-iconic-american-destinations.jpg'
-    );
+      win.location.resetHref(
+        'https://www.nationalgeographic.com/amp-stories/travel/10-iconic-places-to-photograph/'
+      );
+      const portrait = new PortraitComponent();
+      const el = portrait.buildElement(component, win, {position: 0});
+      expect(el.querySelector('img').src).to.equal(
+        'https://www.nationalgeographic.com/amp-stories/assets/01-iconic-american-destinations.jpg'
+      );
+    });
   });
 });
diff --git a/extensions/amp-story/1.0/test/test-amp-story-consent.js b/extensions/amp-story/1.0/test/test-amp-story-consent.js
index ab1f03a2f978c..0b4921fb84df3 100644
--- a/extensions/amp-story/1.0/test/test-amp-story-consent.js
+++ b/extensions/amp-story/1.0/test/test-amp-story-consent.js
@@ -83,7 +83,7 @@ describes.realWin('amp-story-consent', {amp: true}, env => {
     setConfig(defaultConfig);
 
     storyConsentEl = win.document.createElement('amp-story-consent');
-    storyConsentEl.getResources = () => win.__AMP_SERVICES.resources.obj;
+    storyConsentEl.getAmpDoc = () => storyConsentEl;
     storyConsentEl.appendChild(storyConsentConfigEl);
 
     storyEl.appendChild(consentEl);
diff --git a/extensions/amp-story/1.0/test/test-amp-story-embedded-component.js b/extensions/amp-story/1.0/test/test-amp-story-embedded-component.js
index a175c8622fdf2..f720056d5dc97 100644
--- a/extensions/amp-story/1.0/test/test-amp-story-embedded-component.js
+++ b/extensions/amp-story/1.0/test/test-amp-story-embedded-component.js
@@ -42,8 +42,8 @@ describes.realWin('amp-story-embedded-component', {amp: true}, env => {
   beforeEach(() => {
     win = env.win;
 
-    // Making sure resource tasks run synchronously.
-    env.sandbox.stub(Services, 'resourcesForDoc').returns({
+    // Making sure mutator tasks run synchronously.
+    env.sandbox.stub(Services, 'mutatorForDoc').returns({
       mutateElement: (element, callback) => {
         callback();
         return Promise.resolve();
diff --git a/extensions/amp-story/1.0/test/test-amp-story-info-dialog.js b/extensions/amp-story/1.0/test/test-amp-story-info-dialog.js
index 2d8bf48e7c35e..1447db718b120 100644
--- a/extensions/amp-story/1.0/test/test-amp-story-info-dialog.js
+++ b/extensions/amp-story/1.0/test/test-amp-story-info-dialog.js
@@ -43,8 +43,8 @@ describes.realWin('amp-story-share-menu', {amp: true}, env => {
     embedded = true;
     registerServiceBuilder(win, 'story-store', () => storeService);
 
-    // Making sure resource tasks run synchronously.
-    env.sandbox.stub(Services, 'resourcesForDoc').returns({
+    // Making sure mutator tasks run synchronously.
+    env.sandbox.stub(Services, 'mutatorForDoc').returns({
       mutateElement: (element, callback) => {
         callback();
         return Promise.resolve();
diff --git a/extensions/amp-story/1.0/test/test-amp-story-quiz.js b/extensions/amp-story/1.0/test/test-amp-story-quiz.js
new file mode 100644
index 0000000000000..17acc3fb52491
--- /dev/null
+++ b/extensions/amp-story/1.0/test/test-amp-story-quiz.js
@@ -0,0 +1,281 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {AmpStoryQuiz} from '../amp-story-quiz';
+import {AmpStoryStoreService} from '../amp-story-store-service';
+import {AnalyticsVariable, getVariableService} from '../variable-service';
+import {Services} from '../../../../src/services';
+import {getAnalyticsService} from '../story-analytics';
+import {getRequestService} from '../amp-story-request-service';
+import {registerServiceBuilder} from '../../../../src/service';
+
+/**
+ * Populates the quiz with some number of prompts and some number of options
+ *
+ * @param {Window} win
+ * @param {AmpStoryQuiz} quiz
+ * @param {number} numPrompts
+ * @param {number} numOptions
+ */
+const populateQuiz = (win, quizElement, numPrompts = 1, numOptions = 4) => {
+  for (let i = 0; i < numPrompts; i++) {
+    const prompt = win.document.createElement('h1');
+    prompt.textContent = 'prompt';
+    quizElement.appendChild(prompt);
+  }
+
+  const option = win.document.createElement('option');
+  option.textContent = 'option';
+  for (let i = 0; i < numOptions; i++) {
+    quizElement.appendChild(option.cloneNode());
+  }
+
+  quizElement.setAttribute('id', 'TEST_quizId');
+};
+
+/**
+ * Populates the quiz with a prompt and three options
+ *
+ * @param {Window} win
+ * @param {AmpStoryQuiz} quiz
+ */
+const populateStandardQuizContent = (win, quizElement) => {
+  populateQuiz(win, quizElement);
+};
+
+/**
+ * Returns mock reaction data
+ *
+ * @return {Object}
+ * @private
+ */
+const getMockReactionData = () => {
+  return {
+    data: {
+      totalResponseCount: 10,
+      hasUserResponded: true,
+      responses: [
+        {
+          reactionValue: 0,
+          totalCount: 3,
+          selectedByUser: true,
+        },
+        {
+          reactionValue: 1,
+          totalCount: 3,
+          selectedByUser: false,
+        },
+        {
+          reactionValue: 2,
+          totalCount: 3,
+          selectedByUser: false,
+        },
+        {
+          reactionValue: 3,
+          totalCount: 1,
+          selectedByUser: false,
+        },
+      ],
+    },
+  };
+};
+
+describes.realWin(
+  'amp-story-quiz',
+  {
+    amp: true,
+  },
+  env => {
+    let win;
+    let ampStoryQuiz;
+    let storyEl;
+    let analytics;
+    let analyticsVars;
+    let requestService;
+
+    beforeEach(() => {
+      win = env.win;
+
+      env.sandbox
+        .stub(Services, 'cidForDoc')
+        .resolves({get: () => Promise.resolve('cid')});
+
+      const ampStoryQuizEl = win.document.createElement('amp-story-quiz');
+      ampStoryQuizEl.getResources = () => win.__AMP_SERVICES.resources.obj;
+
+      analyticsVars = getVariableService(win);
+      analytics = getAnalyticsService(win, win.document.body);
+      requestService = getRequestService(win, ampStoryQuizEl);
+
+      const storeService = new AmpStoryStoreService(win);
+      registerServiceBuilder(win, 'story-store', () => storeService);
+
+      storyEl = win.document.createElement('amp-story');
+      const storyPage = win.document.createElement('amp-story-page');
+      const gridLayer = win.document.createElement('amp-story-grid-layer');
+      gridLayer.appendChild(ampStoryQuizEl);
+      storyPage.appendChild(gridLayer);
+      storyEl.appendChild(storyPage);
+
+      win.document.body.appendChild(storyEl);
+      ampStoryQuiz = new AmpStoryQuiz(ampStoryQuizEl);
+
+      env.sandbox.stub(ampStoryQuiz, 'mutateElement').callsFake(fn => fn());
+    });
+
+    it('should take the html and reformat it', () => {
+      populateStandardQuizContent(win, ampStoryQuiz.element);
+      ampStoryQuiz.buildCallback();
+      expect(ampStoryQuiz.getQuizElement().children.length).to.equal(2);
+    });
+
+    it('should structure the content in the quiz element', () => {
+      populateStandardQuizContent(win, ampStoryQuiz.element);
+      ampStoryQuiz.buildCallback();
+
+      const quizContent = ampStoryQuiz.getQuizElement().children;
+      expect(quizContent[0]).to.have.class(
+        'i-amphtml-story-quiz-prompt-container'
+      );
+      expect(quizContent[1]).to.have.class(
+        'i-amphtml-story-quiz-option-container'
+      );
+
+      // check prompt container structure
+      expect(quizContent[0].children.length).to.equal(1);
+      expect(
+        quizContent[0].querySelectorAll('.i-amphtml-story-quiz-prompt')
+      ).to.have.length(1);
+
+      // check option container structure
+      expect(quizContent[1].childNodes.length).to.equal(4);
+      expect(
+        quizContent[1].querySelectorAll('.i-amphtml-story-quiz-option')
+      ).to.have.length(4);
+    });
+
+    it('should throw an error with fewer than one prompt', () => {
+      populateQuiz(win, ampStoryQuiz.element, 0);
+      expect(ampStoryQuiz.buildCallback).to.throw();
+    });
+
+    it('should throw an error with more than one prompt', () => {
+      populateQuiz(win, ampStoryQuiz.element, 2);
+      expect(ampStoryQuiz.buildCallback).to.throw();
+    });
+
+    it('should throw an error with fewer than two options', () => {
+      populateQuiz(win, ampStoryQuiz.element, 1, 1);
+      expect(ampStoryQuiz.buildCallback).to.throw();
+    });
+
+    it('should throw an error with more than four options', () => {
+      populateQuiz(win, ampStoryQuiz.element, 1, 5);
+      expect(ampStoryQuiz.buildCallback).to.throw();
+    });
+
+    it('should enter the post-interaction state on option click', async () => {
+      populateStandardQuizContent(win, ampStoryQuiz.element);
+      ampStoryQuiz.buildCallback();
+      await ampStoryQuiz.layoutCallback();
+
+      const quizElement = ampStoryQuiz.getQuizElement();
+      const quizOption = quizElement.querySelector(
+        '.i-amphtml-story-quiz-option'
+      );
+
+      quizOption.click();
+
+      // Microtask tick
+      await Promise.resolve();
+
+      expect(quizElement).to.have.class('i-amphtml-story-quiz-post-selection');
+      expect(quizOption).to.have.class('i-amphtml-story-quiz-option-selected');
+    });
+
+    it('should only record the first option response', async () => {
+      populateStandardQuizContent(win, ampStoryQuiz.element);
+      ampStoryQuiz.buildCallback();
+      await ampStoryQuiz.layoutCallback();
+
+      const quizElement = ampStoryQuiz.getQuizElement();
+      const quizOptions = quizElement.querySelectorAll(
+        '.i-amphtml-story-quiz-option'
+      );
+
+      quizOptions[0].click();
+      quizOptions[1].click();
+
+      // Microtask tick
+      await Promise.resolve();
+
+      expect(quizOptions[0]).to.have.class(
+        'i-amphtml-story-quiz-option-selected'
+      );
+      expect(quizOptions[1]).to.not.have.class(
+        'i-amphtml-story-quiz-option-selected'
+      );
+    });
+
+    it('should trigger an analytics event with the right variables on selection', async () => {
+      const trigger = env.sandbox.stub(analytics, 'triggerEvent');
+      populateStandardQuizContent(win, ampStoryQuiz.element);
+      ampStoryQuiz.buildCallback();
+      await ampStoryQuiz.layoutCallback();
+
+      const option = ampStoryQuiz
+        .getQuizElement()
+        .querySelector('.i-amphtml-story-quiz-option');
+
+      option.click();
+
+      // Microtask tick
+      await Promise.resolve();
+
+      expect(trigger).to.have.been.calledWith('story-reaction');
+
+      const variables = analyticsVars.get();
+      expect(variables[AnalyticsVariable.STORY_REACTION_ID]).to.equal(
+        'TEST_quizId'
+      );
+      expect(variables[AnalyticsVariable.STORY_REACTION_RESPONSE]).to.equal(0);
+      expect(variables[AnalyticsVariable.STORY_REACTION_TYPE]).to.equal(0);
+    });
+
+    it('should update the quiz when the user has already reacted', async () => {
+      // Fill the response to the requestService with mock reaction data
+      env.sandbox
+        .stub(requestService, 'executeRequest')
+        .resolves(getMockReactionData());
+
+      ampStoryQuiz.element.setAttribute('endpoint', 'http://localhost:8000');
+
+      populateStandardQuizContent(win, ampStoryQuiz.element);
+      ampStoryQuiz.buildCallback();
+      await ampStoryQuiz.layoutCallback();
+
+      const quizElement = ampStoryQuiz.getQuizElement();
+      const quizOptions = quizElement.querySelectorAll(
+        '.i-amphtml-story-quiz-option'
+      );
+
+      expect(quizElement).to.have.class('i-amphtml-story-quiz-post-selection');
+      expect(quizOptions[0]).to.have.class(
+        'i-amphtml-story-quiz-option-selected'
+      );
+    });
+  }
+);
diff --git a/extensions/amp-story/1.0/test/test-amp-story-viewer-messaging-handler.js b/extensions/amp-story/1.0/test/test-amp-story-viewer-messaging-handler.js
new file mode 100644
index 0000000000000..02936bbb51b28
--- /dev/null
+++ b/extensions/amp-story/1.0/test/test-amp-story-viewer-messaging-handler.js
@@ -0,0 +1,176 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  Action,
+  StateProperty,
+  getStoreService,
+} from '../amp-story-store-service';
+import {AmpStoryViewerMessagingHandler} from '../amp-story-viewer-messaging-handler';
+import {HistoryState, setHistoryState} from '../utils';
+
+describes.fakeWin('amp-story-viewer-messaging-handler', {}, env => {
+  let fakeViewerService;
+  let storeService;
+  let viewerMessagingHandler;
+
+  beforeEach(() => {
+    fakeViewerService = {
+      responderMap: {},
+      onMessageRespond(eventType, responder) {
+        this.responderMap[eventType] = responder;
+      },
+      receiveMessage(eventType, data) {
+        if (!this.responderMap[eventType]) {
+          return;
+        }
+        return this.responderMap[eventType](data);
+      },
+    };
+    viewerMessagingHandler = new AmpStoryViewerMessagingHandler(
+      env.win,
+      fakeViewerService
+    );
+    viewerMessagingHandler.startListening();
+    storeService = getStoreService(env.win);
+  });
+
+  describe('getDocumentState', () => {
+    it('should throw if no state', async () => {
+      try {
+        await fakeViewerService.receiveMessage('getDocumentState', undefined);
+        return Promise.reject('Previous line should throw an error');
+      } catch (error) {
+        expect(error).to.equal(`Invalid 'state' parameter`);
+      }
+    });
+
+    it('should throw if invalid state', async () => {
+      try {
+        await fakeViewerService.receiveMessage('getDocumentState', {
+          state: 'UNEXISTING_STATE',
+        });
+        return Promise.reject('Previous line should throw an error');
+      } catch (error) {
+        expect(error).to.equal(`Invalid 'state' parameter`);
+      }
+    });
+
+    it('should return the MUTED_STATE', async () => {
+      const response = await fakeViewerService.receiveMessage(
+        'getDocumentState',
+        {state: 'MUTED_STATE'}
+      );
+      expect(response).to.deep.equal({
+        state: 'MUTED_STATE',
+        value: storeService.get(StateProperty.MUTED_STATE),
+      });
+    });
+
+    it('should return the CURRENT_PAGE_ID', async () => {
+      storeService.dispatch(Action.CHANGE_PAGE, {id: 'foo', index: 0});
+      const response = await fakeViewerService.receiveMessage(
+        'getDocumentState',
+        {state: 'CURRENT_PAGE_ID'}
+      );
+      expect(response).to.deep.equal({
+        state: 'CURRENT_PAGE_ID',
+        value: storeService.get(StateProperty.CURRENT_PAGE_ID),
+      });
+    });
+
+    it('should return the PAGE_ATTACHMENT_STATE', async () => {
+      setHistoryState(env.win, HistoryState.ATTACHMENT_PAGE_ID, 'SOME_ID');
+      const response = await fakeViewerService.receiveMessage(
+        'getDocumentState',
+        {state: 'PAGE_ATTACHMENT_STATE'}
+      );
+      expect(response).to.deep.equal({
+        state: 'PAGE_ATTACHMENT_STATE',
+        value: true,
+      });
+      setHistoryState(env.win, HistoryState.ATTACHMENT_PAGE_ID, null);
+    });
+
+    it('should return the STORY_PROGRESS', async () => {
+      storeService.dispatch(Action.SET_PAGE_IDS, [1, 2, 3, 4]);
+      storeService.dispatch(Action.CHANGE_PAGE, {id: 3, index: 2});
+      const response = await fakeViewerService.receiveMessage(
+        'getDocumentState',
+        {state: 'STORY_PROGRESS'}
+      );
+      expect(response).to.deep.equal({
+        state: 'STORY_PROGRESS',
+        value: 0.5,
+      });
+    });
+  });
+
+  describe('setDocumentState', () => {
+    it('should throw if no state', async () => {
+      try {
+        await fakeViewerService.receiveMessage('setDocumentState', undefined);
+        return Promise.reject('Previous line should throw an error');
+      } catch (error) {
+        expect(error).to.equal(`Invalid 'state' parameter`);
+      }
+    });
+
+    it('should throw if invalid state', async () => {
+      try {
+        await fakeViewerService.receiveMessage('setDocumentState', {
+          state: 'UNEXISTING_STATE',
+          value: true,
+        });
+        return Promise.reject('Previous line should throw an error');
+      } catch (error) {
+        expect(error).to.equal(`Invalid 'state' parameter`);
+      }
+    });
+
+    it('should throw if no value', async () => {
+      try {
+        await fakeViewerService.receiveMessage('setDocumentState', {
+          state: 'MUTED_STATE',
+        });
+        return Promise.reject('Previous line should throw an error');
+      } catch (error) {
+        expect(error).to.equal(`Invalid 'value' parameter`);
+      }
+    });
+
+    it('should throw if invalid value', async () => {
+      try {
+        await fakeViewerService.receiveMessage('setDocumentState', {
+          state: 'MUTED_STATE',
+          value: 'true' /** only accepts booleans */,
+        });
+        return Promise.reject('Previous line should throw an error');
+      } catch (error) {
+        expect(error).to.equal(`Invalid 'value' parameter`);
+      }
+    });
+
+    it('should set a state', async () => {
+      storeService.dispatch(Action.TOGGLE_MUTED, false);
+      await fakeViewerService.receiveMessage('setDocumentState', {
+        state: 'MUTED_STATE',
+        value: true,
+      });
+      expect(storeService.get(StateProperty.MUTED_STATE)).to.be.true;
+    });
+  });
+});
diff --git a/extensions/amp-story/1.0/test/test-amp-story.js b/extensions/amp-story/1.0/test/test-amp-story.js
index d3f5b77abd3d7..48943ec355b85 100644
--- a/extensions/amp-story/1.0/test/test-amp-story.js
+++ b/extensions/amp-story/1.0/test/test-amp-story.js
@@ -54,6 +54,7 @@ describes.realWin(
     let win, ampdoc;
     let element;
     let hasSwipeCapability = false;
+    let isEmbedded = false;
     let story;
     let replaceStateStub;
 
@@ -117,6 +118,10 @@ describes.realWin(
         .stub(viewer, 'hasCapability')
         .withArgs('swipe')
         .returns(hasSwipeCapability);
+      env.sandbox
+        .stub(viewer, 'isEmbedded')
+        .withArgs()
+        .returns(isEmbedded);
       env.sandbox.stub(Services, 'viewerForDoc').returns(viewer);
 
       registerServiceBuilder(win, 'performance', () => ({
@@ -1116,14 +1121,20 @@ describes.realWin(
         });
 
         describe('with #cap=swipe', () => {
-          before(() => (hasSwipeCapability = true));
-          after(() => (hasSwipeCapability = false));
+          before(() => {
+            hasSwipeCapability = true;
+            isEmbedded = true;
+          });
+          after(() => {
+            hasSwipeCapability = false;
+            isEmbedded = false;
+          });
 
           it('should send a message when tapping on last page in viewer', async () => {
             await createStoryWithPages(1, ['cover']);
             const sendMessageStub = env.sandbox.stub(
-              story.viewer_,
-              'sendMessage'
+              story.viewerMessagingHandler_,
+              'send'
             );
 
             await story.layoutCallback();
@@ -1163,14 +1174,20 @@ describes.realWin(
         });
 
         describe('with #cap=swipe', () => {
-          before(() => (hasSwipeCapability = true));
-          after(() => (hasSwipeCapability = false));
+          before(() => {
+            hasSwipeCapability = true;
+            isEmbedded = true;
+          });
+          after(() => {
+            hasSwipeCapability = false;
+            isEmbedded = false;
+          });
 
           it('should send a message when tapping on last page in viewer', async () => {
             await createStoryWithPages(1, ['cover']);
             const sendMessageStub = env.sandbox.stub(
-              story.viewer_,
-              'sendMessage'
+              story.viewerMessagingHandler_,
+              'send'
             );
 
             await story.layoutCallback();
@@ -1503,7 +1520,7 @@ describes.realWin(
         };
 
         describe('without #cap=swipe', () => {
-          it('should handle touch events at the story level', async () => {
+          it('should handle h touch events at the story level', async () => {
             await createStoryWithPages(2);
             const touchmoveSpy = env.sandbox.spy();
             story.win.document.addEventListener('touchmove', touchmoveSpy);
@@ -1511,6 +1528,14 @@ describes.realWin(
             expect(touchmoveSpy).to.not.have.been.called;
           });
 
+          it('should handle v touch events at the story level', async () => {
+            await createStoryWithPages(2);
+            const touchmoveSpy = env.sandbox.spy();
+            story.win.document.addEventListener('touchmove', touchmoveSpy);
+            dispatchSwipeEvent(0, 100);
+            expect(touchmoveSpy).to.not.have.been.called;
+          });
+
           it('should trigger the navigation overlay', async () => {
             await createStoryWithPages(2);
             dispatchSwipeEvent(100, 0);
@@ -1527,7 +1552,7 @@ describes.realWin(
           before(() => (hasSwipeCapability = true));
           after(() => (hasSwipeCapability = false));
 
-          it('should let touch events bubble up to be forwarded', async () => {
+          it('should let h touch events bubble up to be forwarded', async () => {
             await createStoryWithPages(2);
             const touchmoveSpy = env.sandbox.spy();
             story.win.document.addEventListener('touchmove', touchmoveSpy);
@@ -1535,6 +1560,14 @@ describes.realWin(
             expect(touchmoveSpy).to.have.been.called;
           });
 
+          it('should let v touch events bubble up to be forwarded', async () => {
+            await createStoryWithPages(2);
+            const touchmoveSpy = env.sandbox.spy();
+            story.win.document.addEventListener('touchmove', touchmoveSpy);
+            dispatchSwipeEvent(0, 100);
+            expect(touchmoveSpy).to.have.been.called;
+          });
+
           it('should not trigger the navigation education overlay', async () => {
             await createStoryWithPages(2);
             dispatchSwipeEvent(100, 0);
diff --git a/extensions/amp-story/1.0/test/test-full-bleed-animations.js b/extensions/amp-story/1.0/test/test-full-bleed-animations.js
index bed051693aee7..c048a36f071f7 100644
--- a/extensions/amp-story/1.0/test/test-full-bleed-animations.js
+++ b/extensions/amp-story/1.0/test/test-full-bleed-animations.js
@@ -105,6 +105,7 @@ describes.realWin(
     ) {
       const img = win.document.createElement('amp-img');
       img.setAttribute('animate-in', animationName);
+      img.setAttribute('layout', 'fill');
 
       const gridLayer = win.document.createElement('amp-story-grid-layer');
       opt_gridLayerTempalate = opt_gridLayerTempalate.length
@@ -121,6 +122,7 @@ describes.realWin(
         ' attached as a child of a grid layer with fill template.',
       () => {
         createPages(ampStory.element, 2, ['cover', 'page-1']);
+        ampStory.buildCallback();
         return ampStory
           .layoutCallback()
           .then(() => {
@@ -152,6 +154,7 @@ describes.realWin(
         'template other than `fill`.',
       () => {
         createPages(ampStory.element, 2, ['cover', 'page-1']);
+        ampStory.buildCallback();
         return ampStory
           .layoutCallback()
           .then(() => {
@@ -182,6 +185,7 @@ describes.realWin(
         'animation is used.',
       () => {
         createPages(ampStory.element, 2, ['cover', 'page-1']);
+        ampStory.buildCallback();
         return ampStory
           .layoutCallback()
           .then(() => {
diff --git a/extensions/amp-story/1.0/test/test-live-story-manager.js b/extensions/amp-story/1.0/test/test-live-story-manager.js
index 4bfb2dd8a0602..5302501cedd00 100644
--- a/extensions/amp-story/1.0/test/test-live-story-manager.js
+++ b/extensions/amp-story/1.0/test/test-live-story-manager.js
@@ -85,6 +85,7 @@ describes.realWin(
 
     it('should build a dynamic live-list', async () => {
       createPages(ampStory.element, 2, ['cover', 'page-1']);
+      ampStory.buildCallback();
       liveStoryManager = new LiveStoryManager(ampStory);
       liveStoryManager.build();
 
@@ -96,6 +97,7 @@ describes.realWin(
 
     it('live-list id should equal story id + dymanic-list combo', async () => {
       createPages(ampStory.element, 2, ['cover', 'page-1']);
+      ampStory.buildCallback();
       liveStoryManager = new LiveStoryManager(ampStory);
       liveStoryManager.build();
 
@@ -109,6 +111,7 @@ describes.realWin(
 
     it('should throw if no story id is set', () => {
       createPages(ampStory.element, 2, ['cover', 'page-1']);
+      ampStory.buildCallback();
       liveStoryManager = new LiveStoryManager(ampStory);
       ampStory.element.removeAttribute('id');
 
@@ -123,6 +126,7 @@ describes.realWin(
 
     it('should append new page from server to client in update', async () => {
       createPages(ampStory.element, 2, ['cover', 'page-1']);
+      ampStory.buildCallback();
       expect(ampStory.element.children.length).to.equal(2);
       liveStoryManager = new LiveStoryManager(ampStory);
       liveStoryManager.build();
diff --git a/extensions/amp-story/1.0/test/validator-amp-story-access.html b/extensions/amp-story/1.0/test/validator-amp-story-access.html
deleted file mode 100644
index a4f293300199c..0000000000000
--- a/extensions/amp-story/1.0/test/validator-amp-story-access.html
+++ /dev/null
@@ -1,64 +0,0 @@
-<!--
-  Copyright 2018 The AMP HTML Authors. All Rights Reserved.
-  Licensed under the Apache License, Version 2.0 (the "License");
-  you may not use this file except in compliance with the License.
-  You may obtain a copy of the License at
-      http://www.apache.org/licenses/LICENSE-2.0
-  Unless required by applicable law or agreed to in writing, software
-  distributed under the License is distributed on an "AS-IS" BASIS,
-  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  See the License for the specific language governing permissions and
-  limitations under the license.
--->
-<!--
-  Test Description:
-  Tests for the amp-story-access tag.
--->
-<!doctype html>
-<html ⚡>
-<head>
-  <meta charset="utf-8">
-  <script async src="https://cdn.ampproject.org/v0.js"></script>
-  <script async custom-element="amp-story" src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
-  <script async custom-element="amp-access" src="https://cdn.ampproject.org/v0/amp-access-0.1.js"></script>
-  <title>My Story</title>
-  <meta name="description" content="Get started with amp-story">
-  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-  <link rel="canonical" href="grid-layer-templates.html">
-  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-  <script id="amp-access" type="application/json">
-    {
-      "authorization": "https://ampbyexample.com/components/amp-access/authorization?rid=READER_ID&url=CANONICAL_URL&ref=DOCUMENT_REFERRER&_=RANDOM",
-      "pingback": "https://ampbyexample.com/components/amp-access/authorization?rid=READER_ID&url=CANONICAL_URL&ref=DOCUMENT_REFERRER&_=RANDOM",
-      "login": "https://ampbyexample.com/components/amp-access/login?rid=READER_ID&url=CANONICAL_URL",
-      "authorizationFallbackResponse": {"error": true}
-    }
-  </script>
-</head>
-<body>
-  <amp-story standalone title="Foo" publisher="AMP" publisher-logo-src="http://example.com/foo.png" poster-portrait-src="http://example.com/foo.png">
-    <amp-story-access type="blocking">
-      <button on="tap:amp-access.login">Login to read more!</button>
-    </amp-story-access>
-
-    <amp-story-access id="foo" class="bar" amp-access="NOT access" type="notification">
-      <button on="tap:amp-access.login">Please subscribe or log in!</button>
-    </amp-story-access>
-
-    <amp-story-page id="cover">
-      <amp-story-grid-layer template="vertical">
-        <h1>Free page!</h1>
-      </amp-story-grid-layer>
-    </amp-story-page>
-
-    <amp-story-page id="page1" amp-access="access" amp-access-hide>
-      <amp-story-grid-layer template="fill">
-        <amp-img height="800" width="450" src="https://placekitten.com/g/450/800"></amp-img>
-      </amp-story-grid-layer>
-      <amp-story-grid-layer template="vertical">
-        <h1>You're reading premium content!</h1>
-      </amp-story-grid-layer>
-    </amp-story-page>
-  </amp-story>
-</body>
-</html>
diff --git a/extensions/amp-story/1.0/test/validator-amp-story-access.out b/extensions/amp-story/1.0/test/validator-amp-story-access.out
deleted file mode 100644
index b12cc5399291f..0000000000000
--- a/extensions/amp-story/1.0/test/validator-amp-story-access.out
+++ /dev/null
@@ -1,65 +0,0 @@
-PASS
-|  <!--
-|    Copyright 2018 The AMP HTML Authors. All Rights Reserved.
-|    Licensed under the Apache License, Version 2.0 (the "License");
-|    you may not use this file except in compliance with the License.
-|    You may obtain a copy of the License at
-|        http://www.apache.org/licenses/LICENSE-2.0
-|    Unless required by applicable law or agreed to in writing, software
-|    distributed under the License is distributed on an "AS-IS" BASIS,
-|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-|    See the License for the specific language governing permissions and
-|    limitations under the license.
-|  -->
-|  <!--
-|    Test Description:
-|    Tests for the amp-story-access tag.
-|  -->
-|  <!doctype html>
-|  <html ⚡>
-|  <head>
-|    <meta charset="utf-8">
-|    <script async src="https://cdn.ampproject.org/v0.js"></script>
-|    <script async custom-element="amp-story" src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
-|    <script async custom-element="amp-access" src="https://cdn.ampproject.org/v0/amp-access-0.1.js"></script>
-|    <title>My Story</title>
-|    <meta name="description" content="Get started with amp-story">
-|    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-|    <link rel="canonical" href="grid-layer-templates.html">
-|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-|    <script id="amp-access" type="application/json">
-|      {
-|        "authorization": "https://ampbyexample.com/components/amp-access/authorization?rid=READER_ID&url=CANONICAL_URL&ref=DOCUMENT_REFERRER&_=RANDOM",
-|        "pingback": "https://ampbyexample.com/components/amp-access/authorization?rid=READER_ID&url=CANONICAL_URL&ref=DOCUMENT_REFERRER&_=RANDOM",
-|        "login": "https://ampbyexample.com/components/amp-access/login?rid=READER_ID&url=CANONICAL_URL",
-|        "authorizationFallbackResponse": {"error": true}
-|      }
-|    </script>
-|  </head>
-|  <body>
-|    <amp-story standalone title="Foo" publisher="AMP" publisher-logo-src="http://example.com/foo.png" poster-portrait-src="http://example.com/foo.png">
-|      <amp-story-access type="blocking">
-|        <button on="tap:amp-access.login">Login to read more!</button>
-|      </amp-story-access>
-|
-|      <amp-story-access id="foo" class="bar" amp-access="NOT access" type="notification">
-|        <button on="tap:amp-access.login">Please subscribe or log in!</button>
-|      </amp-story-access>
-|
-|      <amp-story-page id="cover">
-|        <amp-story-grid-layer template="vertical">
-|          <h1>Free page!</h1>
-|        </amp-story-grid-layer>
-|      </amp-story-page>
-|
-|      <amp-story-page id="page1" amp-access="access" amp-access-hide>
-|        <amp-story-grid-layer template="fill">
-|          <amp-img height="800" width="450" src="https://placekitten.com/g/450/800"></amp-img>
-|        </amp-story-grid-layer>
-|        <amp-story-grid-layer template="vertical">
-|          <h1>You're reading premium content!</h1>
-|        </amp-story-grid-layer>
-|      </amp-story-page>
-|    </amp-story>
-|  </body>
-|  </html>
diff --git a/extensions/amp-story/1.0/test/validator-amp-story-amp-experiment-error.out b/extensions/amp-story/1.0/test/validator-amp-story-amp-experiment-error.out
index 54a97f3ef3074..4669f5607cc63 100644
--- a/extensions/amp-story/1.0/test/validator-amp-story-amp-experiment-error.out
+++ b/extensions/amp-story/1.0/test/validator-amp-story-amp-experiment-error.out
@@ -81,7 +81,7 @@ amp-story/1.0/test/validator-amp-story-amp-experiment-error.html:61:6 Tag 'amp-e
 |      <!-- Invalid: amp-experiment not allowed as a child of amp-story -->
 |      <amp-experiment>
 >>     ^~~~~~~~~
-amp-story/1.0/test/validator-amp-story-amp-experiment-error.html:77:4 Tag 'amp-experiment' is disallowed as child of tag 'amp-story'. Child tag must be one of ['amp-analytics', 'amp-consent', 'amp-geo', 'amp-pixel', 'amp-sidebar', 'amp-story-access', 'amp-story-auto-ads', 'amp-story-bookend', 'amp-story-page']. (see https://amp.dev/documentation/components/amp-story)
+amp-story/1.0/test/validator-amp-story-amp-experiment-error.html:77:4 Tag 'amp-experiment' is disallowed as child of tag 'amp-story'. Child tag must be one of ['amp-analytics', 'amp-consent', 'amp-geo', 'amp-pixel', 'amp-sidebar', 'amp-story-auto-ads', 'amp-story-bookend', 'amp-story-page']. (see https://amp.dev/documentation/components/amp-story)
 |          <script type="application/json">
 |            {
 |              "background-color-test": {
@@ -95,4 +95,4 @@ amp-story/1.0/test/validator-amp-story-amp-experiment-error.html:77:4 Tag 'amp-e
 |      </amp-experiment>
 |    </amp-story>
 |  </body>
-|  </html>
\ No newline at end of file
+|  </html>
diff --git a/extensions/amp-story/1.0/test/validator-amp-story-cta-layer-error.out b/extensions/amp-story/1.0/test/validator-amp-story-cta-layer-error.out
index feb64c37990da..c5cd12badaa0c 100644
--- a/extensions/amp-story/1.0/test/validator-amp-story-cta-layer-error.out
+++ b/extensions/amp-story/1.0/test/validator-amp-story-cta-layer-error.out
@@ -72,7 +72,7 @@ amp-story/1.0/test/validator-amp-story-cta-layer-error.html:60:6 The attribute '
 >>     ^~~~~~~~~
 amp-story/1.0/test/validator-amp-story-cta-layer-error.html:64:4 The tag 'amp-story-cta-layer' may only appear as a descendant of tag 'amp-story-page'.
 >>     ^~~~~~~~~
-amp-story/1.0/test/validator-amp-story-cta-layer-error.html:64:4 Tag 'amp-story-cta-layer' is disallowed as child of tag 'amp-story'. Child tag must be one of ['amp-analytics', 'amp-consent', 'amp-geo', 'amp-pixel', 'amp-sidebar', 'amp-story-access', 'amp-story-auto-ads', 'amp-story-bookend', 'amp-story-page']. (see https://amp.dev/documentation/components/amp-story)
+amp-story/1.0/test/validator-amp-story-cta-layer-error.html:64:4 Tag 'amp-story-cta-layer' is disallowed as child of tag 'amp-story'. Child tag must be one of ['amp-analytics', 'amp-consent', 'amp-geo', 'amp-pixel', 'amp-sidebar', 'amp-story-auto-ads', 'amp-story-bookend', 'amp-story-page']. (see https://amp.dev/documentation/components/amp-story)
 |        <a href="http://www.google.com" class="button"> Illegal CTA layer outside of amp-story-page! </a>
 |      </amp-story-cta-layer>
 |    </amp-story>
diff --git a/extensions/amp-story/1.0/utils.js b/extensions/amp-story/1.0/utils.js
index 571b98724c2bb..a2a5e48a0a993 100644
--- a/extensions/amp-story/1.0/utils.js
+++ b/extensions/amp-story/1.0/utils.js
@@ -152,7 +152,8 @@ export function getRGBFromCssColorValue(cssValue) {
  * @param  {!Object<string, number>} rgb  ie: {r: 0, g: 0, b: 0}
  * @return {string} '#fff' or '#000'
  */
-export function getTextColorForRGB({r, g, b}) {
+export function getTextColorForRGB(rgb) {
+  const {r, g, b} = rgb;
   // Calculates the relative luminance L.
   // https://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
   const getLinearRGBValue = x => {
@@ -237,13 +238,13 @@ export function getSourceOriginForElement(element, url) {
 
 /**
  * Resolves an image url and optimizes it if served from the cache.
- * @param {!Document} doc
+ * @param {!Window} win
  * @param {string} url
  * @return {string}
  */
-export function resolveImgSrc(doc, url) {
-  let urlSrc = resolveRelativeUrl(url, doc.location);
-  if (isProxyOrigin(doc.location.href)) {
+export function resolveImgSrc(win, url) {
+  let urlSrc = resolveRelativeUrl(url, win.location);
+  if (isProxyOrigin(win.location.href)) {
     // TODO(Enriqe): add extra params for resized image, for example:
     // (/ii/w${width}/s)
     urlSrc = urlSrc.replace('/c/s/', '/i/s/');
@@ -268,9 +269,10 @@ export const HistoryState = {
 export function setHistoryState(win, stateName, value) {
   const {history} = win;
   const state = getState(history) || {};
-  const newHistory = Object.assign({}, /** @type {!Object} */ (state), {
+  const newHistory = {
+    ...state,
     [stateName]: value,
-  });
+  };
 
   history.replaceState(newHistory, '');
 }
diff --git a/extensions/amp-story/1.0/variable-service.js b/extensions/amp-story/1.0/variable-service.js
index 07f8dced78468..5a65f8c72269c 100644
--- a/extensions/amp-story/1.0/variable-service.js
+++ b/extensions/amp-story/1.0/variable-service.js
@@ -28,6 +28,9 @@ export const AnalyticsVariable = {
   BOOKEND_COMPONENT_POSITION: 'storyBookendComponentPosition',
   BOOKEND_COMPONENT_TYPE: 'storyBookendComponentType',
   BOOKEND_TARGET_HREF: 'storyBookendTargetHref',
+  STORY_REACTION_ID: 'storyReactionId',
+  STORY_REACTION_RESPONSE: 'storyReactionResponse',
+  STORY_REACTION_TYPE: 'storyReactionType',
   STORY_PAGE_ID: 'storyPageId',
   STORY_PAGE_INDEX: 'storyPageIndex',
   STORY_PAGE_COUNT: 'storyPageCount',
@@ -70,6 +73,9 @@ export class AmpStoryVariableService {
       [AnalyticsVariable.BOOKEND_COMPONENT_POSITION]: null,
       [AnalyticsVariable.BOOKEND_COMPONENT_TYPE]: null,
       [AnalyticsVariable.BOOKEND_TARGET_HREF]: null,
+      [AnalyticsVariable.STORY_REACTION_ID]: null,
+      [AnalyticsVariable.STORY_REACTION_RESPONSE]: null,
+      [AnalyticsVariable.STORY_REACTION_TYPE]: null,
       [AnalyticsVariable.STORY_PAGE_INDEX]: null,
       [AnalyticsVariable.STORY_PAGE_ID]: null,
       [AnalyticsVariable.STORY_PAGE_COUNT]: null,
diff --git a/extensions/amp-story/amp-story-grid-layer.md b/extensions/amp-story/amp-story-grid-layer.md
index f2687e56bc0d7..2fabd10151f80 100644
--- a/extensions/amp-story/amp-story-grid-layer.md
+++ b/extensions/amp-story/amp-story-grid-layer.md
@@ -185,7 +185,6 @@ An `amp-story-grid-layer` can contain any of the following elements:
     <td>
       <ul>
         <li><code>&lt;amp-audio></code></li>
-        <li><code>&lt;amp-gfycat></code></li>
         <li><code>&lt;amp-google-vrview-image></code></li>
         <li><code>&lt;amp-img></code></li>
         <li><code>&lt;amp-video></code></li>
diff --git a/extensions/amp-story/validator-amp-story.protoascii b/extensions/amp-story/validator-amp-story.protoascii
index f63786123194f..627571eb090b3 100644
--- a/extensions/amp-story/validator-amp-story.protoascii
+++ b/extensions/amp-story/validator-amp-story.protoascii
@@ -104,7 +104,6 @@ tags: {  # <amp-story>
     child_tag_name_oneof: "AMP-GEO"
     child_tag_name_oneof: "AMP-PIXEL"
     child_tag_name_oneof: "AMP-SIDEBAR"
-    child_tag_name_oneof: "AMP-STORY-ACCESS"
     child_tag_name_oneof: "AMP-STORY-AUTO-ADS"
     child_tag_name_oneof: "AMP-STORY-BOOKEND"
     child_tag_name_oneof: "AMP-STORY-PAGE"
@@ -343,18 +342,6 @@ tags: {
   }
   spec_url: "https://amp.dev/documentation/components/amp-story"
 }
-tags: {  # <amp-story-access>
-  html_format: AMP
-  tag_name: "AMP-STORY-ACCESS"
-  requires_extension: "amp-access"
-  mandatory_parent: "AMP-STORY"
-  attrs: {
-    name: "type"
-    value: "blocking"
-    value: "notification"
-  }
-  attr_lists: "extended-amp-global"
-}
 tags: {  # <amp-story-bookend>
   html_format: AMP
   tag_name: "AMP-STORY-BOOKEND"
@@ -638,7 +625,6 @@ descendant_tag_list: {
   tag: "AMP-EXPERIMENT"
   tag: "AMP-FIT-TEXT"
   tag: "AMP-FONT"
-  tag: "AMP-GFYCAT"
   tag: "AMP-GIST"
   tag: "AMP-GOOGLE-VRVIEW-IMAGE"
   tag: "AMP-IMG"
@@ -811,12 +797,9 @@ descendant_tag_list {
   tag: "AMP-FX-COLLECTION"
   tag: "AMP-FX-FLYING-CARPET"
   tag: "AMP-GFYCAT"
-  tag: "AMP-GFYCAT"
-  tag: "AMP-GIST"
   tag: "AMP-GIST"
   tag: "AMP-GOOGLE-DOCUMENT-EMBED"
   tag: "AMP-GOOGLE-VRVIEW-IMAGE"
-  tag: "AMP-GOOGLE-VRVIEW-IMAGE"
   tag: "AMP-HULU"
   tag: "AMP-IMA-VIDEO"
   tag: "AMP-IMAGE-SLIDER"
@@ -827,8 +810,6 @@ descendant_tag_list {
   tag: "AMP-JWPLAYER"
   tag: "AMP-KALTURA-PLAYER"
   tag: "AMP-LIST"
-  tag: "AMP-LIST"
-  tag: "AMP-LIVE-LIST"
   tag: "AMP-LIVE-LIST"
   tag: "AMP-MATHML"
   tag: "AMP-MEGAPHONE"
diff --git a/extensions/amp-subscriptions-google/0.1/amp-subscriptions-google.js b/extensions/amp-subscriptions-google/0.1/amp-subscriptions-google.js
index 2d07d3ff76c43..f09eb3a63da16 100644
--- a/extensions/amp-subscriptions-google/0.1/amp-subscriptions-google.js
+++ b/extensions/amp-subscriptions-google/0.1/amp-subscriptions-google.js
@@ -37,6 +37,7 @@ import {PageConfig} from '../../../third_party/subscriptions-project/config';
 import {Services} from '../../../src/services';
 import {SubscriptionsScoreFactor} from '../../amp-subscriptions/0.1/score-factors.js';
 import {experimentToggles, isExperimentOn} from '../../../src/experiments';
+import {getData} from '../../../src/event-helper';
 import {installStylesForDoc} from '../../../src/style-installer';
 import {parseUrlDeprecated} from '../../../src/url';
 import {startsWith} from '../../../src/string';
@@ -143,6 +144,7 @@ export class GoogleSubscriptionsPlatform {
       isFromUserAction: false,
       additionalParameters: null,
     });
+    this.runtime_.analytics().setUrl(ampdoc.getUrl());
     resolver();
 
     this.runtime_.setOnLoginRequest(request => {
@@ -162,6 +164,21 @@ export class GoogleSubscriptionsPlatform {
       );
     });
     this.runtime_.setOnFlowStarted(e => {
+      // This information is used by Propensity.
+      const params = /** @type {!JsonObject} */ ({});
+      const data = /** @type {!JsonObject} */ (getData(e) || {});
+      switch (e.flow) {
+        case Action.SUBSCRIBE:
+          params['product'] =
+            data['skuId'] || data['product'] || 'unknown productId';
+          params['active'] = true;
+          break;
+        case Action.SHOW_OFFERS:
+          params['skus'] = data['skus'] || '*';
+          params['source'] = data['source'] || 'unknown triggering source';
+          params['active'] = data['active'] || null;
+          break;
+      }
       if (
         e.flow == Action.SUBSCRIBE ||
         e.flow == Action.CONTRIBUTE ||
@@ -171,7 +188,8 @@ export class GoogleSubscriptionsPlatform {
         this.subscriptionAnalytics_.actionEvent(
           this.getServiceId(),
           e.flow,
-          ActionStatus.STARTED
+          ActionStatus.STARTED,
+          params
         );
       }
     });
@@ -339,10 +357,24 @@ export class GoogleSubscriptionsPlatform {
     response.complete().then(() => {
       this.serviceAdapter_.resetPlatforms();
     });
+    let product;
+    try {
+      const entitlement =
+        response.entitlements && response.entitlements.getEntitlementForThis();
+      if (entitlement) {
+        product = entitlement.getSku();
+      }
+    } catch (ex) {}
+    const params = /** @type {!JsonObject} */ ({
+      'active': true,
+      'product': product || 'unknown subscriptionToken',
+    });
+
     this.subscriptionAnalytics_.actionEvent(
       this.getServiceId(),
       eventType,
-      ActionStatus.SUCCESS
+      ActionStatus.SUCCESS,
+      params
     );
   }
 
diff --git a/extensions/amp-subscriptions-google/0.1/test/test-amp-subscriptions-google.js b/extensions/amp-subscriptions-google/0.1/test/test-amp-subscriptions-google.js
index 5fa1e38bb6599..c76c0bf97ac5b 100644
--- a/extensions/amp-subscriptions-google/0.1/test/test-amp-subscriptions-google.js
+++ b/extensions/amp-subscriptions-google/0.1/test/test-amp-subscriptions-google.js
@@ -23,6 +23,7 @@ import {
   ConfiguredRuntime,
   Entitlements,
   SubscribeResponse,
+  Entitlement as SwgEntitlement,
 } from '../../../../third_party/subscriptions-project/swg';
 import {
   Entitlement,
@@ -36,6 +37,7 @@ import {SubscriptionsScoreFactor} from '../../../amp-subscriptions/0.1/score-fac
 import {toggleExperiment} from '../../../../src/experiments';
 
 const PLATFORM_ID = 'subscribe.google.com';
+const AMP_URL = 'myAMPurl.amp';
 
 describes.realWin('amp-subscriptions-google', {amp: true}, env => {
   let ampdoc;
@@ -60,6 +62,7 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
     element = env.win.document.createElement('script');
     element.id = 'amp-subscriptions';
     env.win.document.head.appendChild(element);
+    env.sandbox.stub(ampdoc, 'getUrl').callsFake(() => AMP_URL);
     pageConfig = new PageConfig('example.org:basic', true);
     xhr = Services.xhrFor(env.win);
     viewer = Services.viewerForDoc(ampdoc);
@@ -137,6 +140,11 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
     return stub.args[0][0];
   }
 
+  it('should set the current URL in analytics', () => {
+    const swgAnalytics = platform.runtime_.analytics();
+    expect(swgAnalytics.getContext().getUrl()).to.equal(AMP_URL);
+  });
+
   it('should reset runtime on platform reset', () => {
     expect(methods.reset).to.not.be.called;
     platform.reset();
@@ -158,7 +166,7 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
     ]);
   });
 
-  it('should proxy fetch via AMP fetcher', () => {
+  it('should proxy fetch via AMP fetcher', async () => {
     const fetchStub = env.sandbox
       .stub(xhr, 'fetchJson')
       .callsFake((url, init) => {
@@ -168,18 +176,16 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
           prerenderSafe: true,
         });
         return Promise.resolve({
-          json: () => {
-            return Promise.resolve({entitlements: entitlementResponse});
-          },
+          json: () => Promise.resolve({entitlements: entitlementResponse}),
         });
       });
-    return platform.getEntitlements().then(ents => {
-      expect(ents.service).to.equal(PLATFORM_ID);
-      expect(fetchStub).to.be.calledOnce;
-    });
+
+    const ents = await platform.getEntitlements();
+    expect(ents.service).to.equal(PLATFORM_ID);
+    expect(fetchStub).to.be.calledOnce;
   });
 
-  it('should proxy fetch non-granting response', () => {
+  it('should proxy fetch non-granting response', async () => {
     const fetchStub = env.sandbox
       .stub(xhr, 'fetchJson')
       .callsFake((url, init) => {
@@ -189,65 +195,60 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
           prerenderSafe: true,
         });
         return Promise.resolve({
-          json: () => {
-            return Promise.resolve({
+          json: () =>
+            Promise.resolve({
               entitlements: {
                 source: 'subscribe.google.com',
                 products: ['example.org:registered_user'],
                 subscriptionToken: 'tok1',
               },
-            });
-          },
+            }),
         });
       });
-    return platform.getEntitlements().then(ents => {
-      expect(ents.source).to.equal(PLATFORM_ID);
-      expect(ents.granted).to.be.false;
-      expect(fetchStub).to.be.calledOnce;
-    });
+
+    const ents = await platform.getEntitlements();
+    expect(ents.source).to.equal(PLATFORM_ID);
+    expect(ents.granted).to.be.false;
+    expect(fetchStub).to.be.calledOnce;
   });
 
-  it('should proxy fetch empty response', () => {
-    env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-      return Promise.resolve({
-        json: () => {
-          return Promise.resolve({
+  it('should proxy fetch empty response', async () => {
+    env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+      Promise.resolve({
+        json: () =>
+          Promise.resolve({
             entitlements: {},
-          });
-        },
-      });
-    });
-    return platform.getEntitlements().then(ents => {
-      expect(ents).to.be.null;
-    });
+          }),
+      })
+    );
+
+    const ents = await platform.getEntitlements();
+    expect(ents).to.be.null;
   });
 
-  it('should ack matching entitlements', () => {
-    env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-      return Promise.resolve({
-        json: () => {
-          return Promise.resolve({entitlements: entitlementResponse});
-        },
-      });
-    });
-    return platform.getEntitlements().then(() => {
-      expect(ackStub).to.be.calledOnce;
-    });
+  it('should ack matching entitlements', async () => {
+    env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+      Promise.resolve({
+        json: () => Promise.resolve({entitlements: entitlementResponse}),
+      })
+    );
+
+    await platform.getEntitlements();
+    expect(ackStub).to.be.calledOnce;
   });
 
-  it('should NOT ack non-matching entitlements', () => {
-    env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-      return Promise.resolve({
-        json: () => {
-          return Promise.resolve({
+  it('should NOT ack non-matching entitlements', async () => {
+    env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+      Promise.resolve({
+        json: () =>
+          Promise.resolve({
             entitlements: {},
-          });
-        },
-      });
-    });
-    return platform.getEntitlements().then(() => {
-      expect(ackStub).to.not.be.called;
-    });
+          }),
+      })
+    );
+
+    await platform.getEntitlements();
+    expect(ackStub).to.not.be.called;
   });
 
   it('should ignore activate when granted', () => {
@@ -316,7 +317,7 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
       .once();
     serviceAdapterMock.expects('delegateActionToLocal').never();
     callback(callbacks.loginRequest)({linkRequested: true});
-    await 'Promises...';
+    await 'Event loop tick';
     expect(methods.linkAccount).to.be.calledOnce.calledWithExactly({
       ampReaderId: 'ari1',
     });
@@ -366,12 +367,30 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
     callback(callbacks.flowCanceled)({flow: 'linkAccount'});
   });
 
-  it('should log subscribe start', () => {
-    analyticsMock
-      .expects('actionEvent')
-      .withExactArgs(PLATFORM_ID, Action.SUBSCRIBE, ActionStatus.STARTED)
-      .once();
-    callback(callbacks.flowStarted)({flow: Action.SUBSCRIBE});
+  describe('should log subscribe start', () => {
+    let productId;
+    let data;
+
+    afterEach(() => {
+      analyticsMock
+        .expects('actionEvent')
+        .withExactArgs(PLATFORM_ID, Action.SUBSCRIBE, ActionStatus.STARTED, {
+          active: true,
+          product: productId,
+        })
+        .once();
+      callback(callbacks.flowStarted)({flow: Action.SUBSCRIBE, data});
+    });
+    it('should work without a productId', () => {
+      productId = 'unknown productId';
+    });
+
+    it('should work with a productId', () => {
+      productId = 'PRODUCTID';
+      data = {
+        product: productId,
+      };
+    });
   });
 
   it('should log subscribe cancel', () => {
@@ -382,28 +401,66 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
     callback(callbacks.flowCanceled)({flow: Action.SUBSCRIBE});
   });
 
-  it('should reauthorize on complete subscribe', () => {
-    analyticsMock
-      .expects('actionEvent')
-      .withExactArgs(PLATFORM_ID, Action.SUBSCRIBE, ActionStatus.SUCCESS)
-      .once();
-    const promise = Promise.resolve();
-    const response = new SubscribeResponse(
-      null,
-      null,
-      null,
-      null,
-      null,
-      () => promise
-    );
-    const resetPlatformsPromise = new Promise(resolve => {
-      env.sandbox.stub(serviceAdapter, 'resetPlatforms').callsFake(() => {
-        resolve();
+  describe('should reauthorize on complete subscribe', () => {
+    let productId;
+    let entitlements;
+    const serviceId = 'serviceId';
+
+    afterEach(() => {
+      analyticsMock
+        .expects('actionEvent')
+        .withExactArgs(PLATFORM_ID, Action.SUBSCRIBE, ActionStatus.SUCCESS, {
+          active: true,
+          product: productId,
+        })
+        .once();
+      const promise = Promise.resolve();
+      const response = new SubscribeResponse(
+        null,
+        null,
+        null,
+        entitlements,
+        productId,
+        () => promise,
+        null
+      );
+      const resetPlatformsPromise = new Promise(resolve => {
+        env.sandbox.stub(serviceAdapter, 'resetPlatforms').callsFake(() => {
+          resolve();
+        });
+      });
+      callback(callbacks.subscribeResponse)(Promise.resolve(response));
+      expect(methods.reset).to.not.be.called;
+      return resetPlatformsPromise;
+    });
+
+    it('should work without entitlements', () => {
+      productId = 'unknown subscriptionToken';
+      entitlements = null;
+    });
+
+    it('should work with poorly formatted entitlements', () => {
+      productId = 'unknown subscriptionToken';
+      entitlements = new Entitlements(
+        serviceId,
+        null,
+        [new SwgEntitlement(null, [productId], null)],
+        productId
+      );
+    });
+
+    it('should work with Google formatted entitlements', () => {
+      productId = 'myProduct';
+      const token = JSON.stringify({
+        productId,
       });
+      entitlements = new Entitlements(
+        serviceId,
+        null,
+        [new SwgEntitlement('google', [productId], token)],
+        productId
+      );
     });
-    callback(callbacks.subscribeResponse)(Promise.resolve(response));
-    expect(methods.reset).to.not.be.called;
-    return resetPlatformsPromise;
   });
 
   it('should delegate native subscribe request', () => {
@@ -415,7 +472,7 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
     callback(callbacks.subscribeRequest)();
   });
 
-  it('should reset on successful login', () => {
+  it('should reset on successful login', async () => {
     const loginResult = Promise.resolve(true);
     serviceAdapterMock
       .expects('delegateActionToLocal')
@@ -423,12 +480,12 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
       .returns(loginResult)
       .once();
     callback(callbacks.loginRequest)({linkRequested: false});
-    return loginResult.then(() => {
-      expect(methods.reset).to.be.calledOnce.calledWithExactly();
-    });
+
+    await loginResult;
+    expect(methods.reset).to.be.calledOnce.calledWithExactly();
   });
 
-  it('should NOT reset on failed login', () => {
+  it('should NOT reset on failed login', async () => {
     const loginResult = Promise.resolve(false);
     serviceAdapterMock
       .expects('delegateActionToLocal')
@@ -436,12 +493,12 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
       .returns(loginResult)
       .once();
     callback(callbacks.loginRequest)({linkRequested: false});
-    return loginResult.then(() => {
-      expect(methods.reset).to.not.be.called;
-    });
+
+    await loginResult;
+    expect(methods.reset).to.not.be.called;
   });
 
-  it('should reset on successful subscribe', () => {
+  it('should reset on successful subscribe', async () => {
     const loginResult = Promise.resolve(true);
     serviceAdapterMock
       .expects('delegateActionToLocal')
@@ -449,9 +506,9 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
       .returns(loginResult)
       .once();
     callback(callbacks.subscribeRequest)();
-    return loginResult.then(() => {
-      expect(methods.reset).to.be.calledOnce.calledWithExactly();
-    });
+
+    await loginResult;
+    expect(methods.reset).to.be.calledOnce.calledWithExactly();
   });
 
   it('should infer the viewer from viewerUrl', () => {
@@ -464,36 +521,29 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
     expect(platform.isGoogleViewer_).to.be.true;
   });
 
-  it('should infer the viewer from origin', () => {
+  it('should infer the viewer from origin', async () => {
     delete ampdoc.params_['viewerUrl'];
     let viewerOrigin = null;
     env.sandbox.stub(viewer, 'getViewerOrigin').callsFake(() => viewerOrigin);
 
-    return Promise.resolve()
-      .then(() => {
-        viewerOrigin = Promise.resolve('');
-        platform = new GoogleSubscriptionsPlatform(ampdoc, {}, serviceAdapter);
-        return viewerOrigin;
-      })
-      .then(() => {
-        expect(platform.isGoogleViewer_).to.be.false;
+    await 'Event loop tick';
 
-        // Other origin.
-        viewerOrigin = Promise.resolve('https://other.com');
-        platform = new GoogleSubscriptionsPlatform(ampdoc, {}, serviceAdapter);
-        return viewerOrigin;
-      })
-      .then(() => {
-        expect(platform.isGoogleViewer_).to.be.false;
+    viewerOrigin = Promise.resolve('');
+    platform = new GoogleSubscriptionsPlatform(ampdoc, {}, serviceAdapter);
+    await viewerOrigin;
+    expect(platform.isGoogleViewer_).to.be.false;
 
-        // Google origin.
-        viewerOrigin = Promise.resolve('https://google.com');
-        platform = new GoogleSubscriptionsPlatform(ampdoc, {}, serviceAdapter);
-        return viewerOrigin;
-      })
-      .then(() => {
-        expect(platform.isGoogleViewer_).to.be.true;
-      });
+    // Other origin.
+    viewerOrigin = Promise.resolve('https://other.com');
+    platform = new GoogleSubscriptionsPlatform(ampdoc, {}, serviceAdapter);
+    await viewerOrigin;
+    expect(platform.isGoogleViewer_).to.be.false;
+
+    // Google origin.
+    viewerOrigin = Promise.resolve('https://google.com');
+    platform = new GoogleSubscriptionsPlatform(ampdoc, {}, serviceAdapter);
+    await viewerOrigin;
+    expect(platform.isGoogleViewer_).to.be.true;
   });
 
   it('should allow prerender if in a google viewer', () => {
@@ -590,46 +640,43 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
       .once();
     const executeStub = platform.runtime_.linkAccount;
     platform.executeAction(Action.LOGIN);
-    await 'Promises...';
+    await 'Event loop tick';
     expect(executeStub).to.be.calledWith();
   });
 
   describe('getEntitlements', () => {
-    it('should convert granted entitlements to internal shape', () => {
-      env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({entitlements: entitlementResponse});
-          },
-        });
-      });
-      return platform.getEntitlements().then(entitlement => {
-        expect(entitlement.source).to.be.equal('google');
-        expect(entitlement.granted).to.be.equal(true);
-        expect(entitlement.grantReason).to.be.equal(GrantReason.SUBSCRIBER);
-        expect(entitlement.data).to.deep.equal(entitlementResponse);
-      });
+    it('should convert granted entitlements to internal shape', async () => {
+      env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () => Promise.resolve({entitlements: entitlementResponse}),
+        })
+      );
+
+      const entitlement = await platform.getEntitlements();
+      expect(entitlement.source).to.be.equal('google');
+      expect(entitlement.granted).to.be.equal(true);
+      expect(entitlement.grantReason).to.be.equal(GrantReason.SUBSCRIBER);
+      expect(entitlement.data).to.deep.equal(entitlementResponse);
     });
 
-    it('should convert non granted internal shape with granted == false', () => {
-      env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({
+    it('should convert non granted internal shape with granted == false', async () => {
+      env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () =>
+            Promise.resolve({
               entitlements: {
                 source: 'google',
                 products: ['example.org:premium'],
                 subscriptionToken: '',
               },
-            });
-          },
-        });
-      });
-      return platform.getEntitlements().then(entitlement => {
-        expect(entitlement.source).to.be.equal('google');
-        expect(entitlement.granted).to.be.equal(false);
-        expect(entitlement.grantReason).to.be.null;
-      });
+            }),
+        })
+      );
+
+      const entitlement = await platform.getEntitlements();
+      expect(entitlement.source).to.be.equal('google');
+      expect(entitlement.granted).to.be.equal(false);
+      expect(entitlement.grantReason).to.be.null;
     });
   });
 
@@ -649,118 +696,104 @@ describes.realWin('amp-subscriptions-google', {amp: true}, env => {
       };
     }
 
-    it('should treat missing isReadyToPay as false', () => {
-      env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({entitlements: entitlementResponse});
-          },
-        });
-      });
-      return platform.getEntitlements().then(() => {
-        expect(
-          platform.getSupportedScoreFactor(
-            SubscriptionsScoreFactor.IS_READY_TO_PAY
-          )
-        ).to.equal(0);
-      });
+    it('should treat missing isReadyToPay as false', async () => {
+      env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () => Promise.resolve({entitlements: entitlementResponse}),
+        })
+      );
+
+      await platform.getEntitlements();
+      expect(
+        platform.getSupportedScoreFactor(
+          SubscriptionsScoreFactor.IS_READY_TO_PAY
+        )
+      ).to.equal(0);
     });
 
-    it('should handle isReadyToPay true', () => {
-      env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({
+    it('should handle isReadyToPay true', async () => {
+      env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () =>
+            Promise.resolve({
               isReadyToPay: true,
               entitlements: entitlementResponse,
-            });
-          },
-        });
-      });
+            }),
+        })
+      );
       //#TODO(jpettitt) remove stub when swj.js isRadyToPay is available
       env.sandbox
         .stub(platform.runtime_, 'getEntitlements')
         .resolves(fakeEntitlements(true));
 
-      return platform.getEntitlements().then(() => {
-        expect(
-          platform.getSupportedScoreFactor(
-            SubscriptionsScoreFactor.IS_READY_TO_PAY
-          )
-        ).to.equal(1);
-      });
+      await platform.getEntitlements();
+      expect(
+        platform.getSupportedScoreFactor(
+          SubscriptionsScoreFactor.IS_READY_TO_PAY
+        )
+      ).to.equal(1);
     });
 
-    it('should handle isReadyToPay false', () => {
-      env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({
+    it('should handle isReadyToPay false', async () => {
+      env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () =>
+            Promise.resolve({
               isReadyToPay: false,
               entitlements: entitlementResponse,
-            });
-          },
-        });
-      });
+            }),
+        })
+      );
       //#TODO(jpettitt) remove stub when swj.js isRadyToPay is available
       env.sandbox
         .stub(platform.runtime_, 'getEntitlements')
         .resolves(fakeEntitlements(false));
 
-      return platform.getEntitlements().then(() => {
-        expect(
-          platform.getSupportedScoreFactor(
-            SubscriptionsScoreFactor.IS_READY_TO_PAY
-          )
-        ).to.equal(0);
-      });
+      await platform.getEntitlements();
+      expect(
+        platform.getSupportedScoreFactor(
+          SubscriptionsScoreFactor.IS_READY_TO_PAY
+        )
+      ).to.equal(0);
     });
 
-    it('should call getEncryptedDocumentKey with google.com', () => {
-      env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({entitlements: {}});
-          },
-        });
-      });
-      return platform.getEntitlements().then(() => {
-        expect(getEncryptedDocumentKeyStub).to.be.calledWith('google.com');
-      });
+    it('should call getEncryptedDocumentKey with google.com', async () => {
+      env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () => Promise.resolve({entitlements: {}}),
+        })
+      );
+
+      await platform.getEntitlements();
+      expect(getEncryptedDocumentKeyStub).to.be.calledWith('google.com');
     });
 
-    it('should not add encryptedDocumentKey parameter to url', () => {
-      const fetchStub = env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({entitlements: {}});
-          },
-        });
-      });
-      return platform.getEntitlements().then(() => {
-        return expect(fetchStub).to.be.calledWith(
-          'https://news.google.com/swg/_/api/v1/publication/example.org/entitlements'
-        );
-      });
+    it('should not add encryptedDocumentKey parameter to url', async () => {
+      const fetchStub = env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () => Promise.resolve({entitlements: {}}),
+        })
+      );
+
+      await platform.getEntitlements();
+      expect(fetchStub).to.be.calledWith(
+        'https://news.google.com/swg/_/api/v1/publication/example.org/entitlements'
+      );
     });
 
-    it('should add encryptedDocumentKey parameter to url', () => {
-      const fetchStub = env.sandbox.stub(xhr, 'fetchJson').callsFake(() => {
-        return Promise.resolve({
-          json: () => {
-            return Promise.resolve({entitlements: {}});
-          },
-        });
-      });
+    it('should add encryptedDocumentKey parameter to url', async () => {
+      const fetchStub = env.sandbox.stub(xhr, 'fetchJson').callsFake(() =>
+        Promise.resolve({
+          json: () => Promise.resolve({entitlements: {}}),
+        })
+      );
 
-      getEncryptedDocumentKeyStub.callsFake(() => {
-        return 'encryptedDocumentKey';
-      });
-      return platform.getEntitlements().then(() => {
-        return expect(fetchStub).to.be.calledWith(
-          'https://news.google.com/swg/_/api/v1/publication/example.org/entitlements?crypt=encryptedDocumentKey'
-        );
-      });
+      getEncryptedDocumentKeyStub.callsFake(() => 'encryptedDocumentKey');
+
+      await platform.getEntitlements();
+      expect(fetchStub).to.be.calledWith(
+        'https://news.google.com/swg/_/api/v1/publication/example.org/entitlements?crypt=encryptedDocumentKey'
+      );
     });
   });
 });
diff --git a/extensions/amp-subscriptions/0.1/amp-subscriptions.js b/extensions/amp-subscriptions/0.1/amp-subscriptions.js
index 9e0552e84069d..155c8ea9fde54 100644
--- a/extensions/amp-subscriptions/0.1/amp-subscriptions.js
+++ b/extensions/amp-subscriptions/0.1/amp-subscriptions.js
@@ -272,6 +272,32 @@ export class SubscriptionService {
     );
   }
 
+  /**
+   * Internal function to wrap SwG decryption handling
+   * @param {!SubscriptionPlatform} platform
+   * @return {!Promise<?./entitlement.Entitlement>}
+   * @private
+   */
+  getEntitlements_(platform) {
+    return platform.getEntitlements().then(entitlements => {
+      if (
+        entitlements &&
+        entitlements.granted &&
+        this.cryptoHandler_.isDocumentEncrypted() &&
+        !entitlements.decryptedDocumentKey
+      ) {
+        const logChannel = platform.getServiceId() == 'local' ? user() : dev();
+        logChannel.error(
+          TAG,
+          `${platform.getServiceId()}: Subscription granted and encryption enabled, ` +
+            'but no decrypted document key returned.'
+        );
+        return null;
+      }
+      return entitlements;
+    });
+  }
+
   /**
    * @param {!SubscriptionPlatform} subscriptionPlatform
    * @return {!Promise}
@@ -288,7 +314,7 @@ export class SubscriptionService {
       : this.ampdoc_.whenFirstVisible();
     return visiblePromise.then(() => {
       return this.timer_
-        .timeoutPromise(timeout, subscriptionPlatform.getEntitlements())
+        .timeoutPromise(timeout, this.getEntitlements_(subscriptionPlatform))
         .then(entitlement => {
           entitlement =
             entitlement ||
@@ -393,8 +419,7 @@ export class SubscriptionService {
           origin
         );
         this.platformStore_.resolvePlatform('local', viewerPlatform);
-        viewerPlatform
-          .getEntitlements()
+        this.getEntitlements_(viewerPlatform)
           .then(entitlement => {
             devAssert(entitlement, 'Entitlement is null');
             // Viewer authorization is redirected to use local platform instead.
diff --git a/extensions/amp-subscriptions/0.1/crypto-handler.js b/extensions/amp-subscriptions/0.1/crypto-handler.js
index b0deef825fd83..3fe6d42da69f3 100644
--- a/extensions/amp-subscriptions/0.1/crypto-handler.js
+++ b/extensions/amp-subscriptions/0.1/crypto-handler.js
@@ -14,15 +14,12 @@
  * limitations under the License.
  */
 
-import {base64DecodeToBytes} from '../../../src/utils/base64';
+import {decryptAesGcm} from '../../../third_party/subscriptions-project/aes_gcm';
 import {iterateCursor} from '../../../src/dom';
 import {padStart} from '../../../src/string';
 import {toArray} from '../../../src/types';
 import {tryParseJson} from '../../../src/json';
-import {utf8Decode, utf8Encode} from '../../../src/utils/bytes';
-
-// Length of IV in AES-GCM encoded content.
-const AES_GCM_IV_LENGTH = 12;
+import {utf8Encode} from '../../../src/utils/bytes';
 
 export class CryptoHandler {
   /**
@@ -55,6 +52,14 @@ export class CryptoHandler {
       null;
   }
 
+  /**
+   * Checks if the document is encrypted by looking at the parsed keys.
+   * @return {boolean}
+   */
+  isDocumentEncrypted() {
+    return !!this.encryptedKeys_ && Object.keys(this.encryptedKeys_).length > 0;
+  }
+
   /**
    * This method is used for testing.
    * @return {?JsonObject}
@@ -114,9 +119,9 @@ export class CryptoHandler {
       const promises = [];
       iterateCursor(encryptedSections, encryptedSection => {
         promises.push(
-          this.decryptDocumentContent_(
-            encryptedSection.textContent,
-            decryptedDocumentKey
+          decryptAesGcm(
+            decryptedDocumentKey,
+            encryptedSection.textContent
           ).then(decryptedContent => {
             encryptedSection./*OK*/ outerHTML = decryptedContent;
           })
@@ -126,56 +131,4 @@ export class CryptoHandler {
     });
     return this.decryptionPromise_;
   }
-
-  /**
-   * @private
-   * @param {string} encryptedContent
-   * @param {string} decryptedDocumentKey
-   * @return {Promise<string>}
-   */
-  decryptDocumentContent_(encryptedContent, decryptedDocumentKey) {
-    // 1. Trim and remove all whitespaces (e.g. line breaks).
-    encryptedContent = encryptedContent.replace(/\s+/g, '');
-
-    // 2. Un-base64 the encrypted content. This way we get the actual encrypted
-    //    bytes.
-    const encryptedBytes = base64DecodeToBytes(encryptedContent);
-    const iv = encryptedBytes.slice(0, AES_GCM_IV_LENGTH);
-    const content = encryptedBytes.slice(AES_GCM_IV_LENGTH);
-
-    // 3. Get document Key in the correct format.
-    return this.stringToCryptoKey_(decryptedDocumentKey).then(function(
-      formattedDocKey
-    ) {
-      // 4. Decrypt.
-      return crypto.subtle
-        .decrypt(
-          {
-            name: 'AES-GCM',
-            iv,
-          },
-          formattedDocKey,
-          content
-        )
-        .then(function(buffer) {
-          // 5. Decryption gives us raw bytes and we need to turn them into text.
-          return utf8Decode(new Uint8Array(buffer));
-        });
-    });
-  }
-
-  /**
-   * @private
-   * @param {string} decryptedDocumentKey
-   * @return {!Promise<!webCrypto.CryptoKey>}
-   */
-  stringToCryptoKey_(decryptedDocumentKey) {
-    // 1. Un-base64 the encrypted content. This way we get the key bytes.
-    const documentKeyBytes = base64DecodeToBytes(decryptedDocumentKey);
-
-    // 2. Convert bytes to CryptoKey format.
-    return crypto.subtle.importKey('raw', documentKeyBytes, 'AES-GCM', true, [
-      'decrypt',
-    ]);
-  }
 }
diff --git a/extensions/amp-subscriptions/0.1/entitlement.js b/extensions/amp-subscriptions/0.1/entitlement.js
index 80822185f8624..0425535cb5c25 100644
--- a/extensions/amp-subscriptions/0.1/entitlement.js
+++ b/extensions/amp-subscriptions/0.1/entitlement.js
@@ -48,15 +48,16 @@ export class Entitlement {
    * @param {?JsonObject} [input.dataObject]
    * @param {?string} [input.decryptedDocumentKey]
    */
-  constructor({
-    source,
-    raw = '',
-    service,
-    granted = false,
-    grantReason = '',
-    dataObject,
-    decryptedDocumentKey,
-  }) {
+  constructor(input) {
+    const {
+      source,
+      raw = '',
+      service,
+      granted = false,
+      grantReason = '',
+      dataObject,
+      decryptedDocumentKey,
+    } = input;
     /** @const {string} */
     this.raw = raw;
     /** @const {string} */
@@ -94,11 +95,7 @@ export class Entitlement {
    * @return {!JsonObject}
    */
   jsonForPingback() {
-    return /** @type {!JsonObject} */ (Object.assign(
-      {},
-      {'raw': this.raw},
-      this.json()
-    ));
+    return /** @type {!JsonObject} */ ({'raw': this.raw, ...this.json()});
   }
 
   /**
diff --git a/extensions/amp-subscriptions/0.1/local-subscription-platform-base.js b/extensions/amp-subscriptions/0.1/local-subscription-platform-base.js
index 451648e3ed884..82385fed21bc5 100644
--- a/extensions/amp-subscriptions/0.1/local-subscription-platform-base.js
+++ b/extensions/amp-subscriptions/0.1/local-subscription-platform-base.js
@@ -109,7 +109,11 @@ export class LocalSubscriptionBasePlatform {
    * @protected
    */
   initializeListeners_() {
-    this.rootNode_.addEventListener('click', e => {
+    // Listen for `click` events bubbling up to the root node.
+    // If the root node has a `body` property, listen to events on that instead,
+    // to fix an iOS shadow DOM bug (https://github.com/ampproject/amphtml/issues/25754).
+    const el = this.rootNode_.body || this.rootNode_;
+    el.addEventListener('click', e => {
       const element = closestAncestorElementBySelector(
         dev().assertElement(e.target),
         '[subscriptions-action]'
diff --git a/extensions/amp-subscriptions/0.1/local-subscription-platform-remote.js b/extensions/amp-subscriptions/0.1/local-subscription-platform-remote.js
index 7d217fc197d84..241b9ff0bebb3 100644
--- a/extensions/amp-subscriptions/0.1/local-subscription-platform-remote.js
+++ b/extensions/amp-subscriptions/0.1/local-subscription-platform-remote.js
@@ -60,6 +60,8 @@ export class LocalSubscriptionRemotePlatform extends LocalSubscriptionBasePlatfo
     return this.urlBuilder_
       .buildUrl(this.authorizationUrl_, /* useAuthData */ false)
       .then(fetchUrl => {
+        // WARNING: If this key is really long, you might run into issues by hitting
+        // the maximum URL length in some browsers when sending the GET fetch URL.
         const encryptedDocumentKey = this.serviceAdapter_.getEncryptedDocumentKey(
           'local'
         );
diff --git a/extensions/amp-subscriptions/0.1/platform-store.js b/extensions/amp-subscriptions/0.1/platform-store.js
index 369417eed72ba..ce2729e99b15c 100644
--- a/extensions/amp-subscriptions/0.1/platform-store.js
+++ b/extensions/amp-subscriptions/0.1/platform-store.js
@@ -316,7 +316,8 @@ export class PlatformStore {
       this.grantStatusPromise_.resolve(false);
     } else {
       // Listen if any upcoming entitlements unblock the reader
-      this.onChange(({entitlement}) => {
+      this.onChange(e => {
+        const {entitlement} = e;
         if (entitlement.granted) {
           this.grantStatusPromise_.resolve(true);
         } else if (this.areAllPlatformsResolved_()) {
diff --git a/extensions/amp-subscriptions/0.1/renderer.js b/extensions/amp-subscriptions/0.1/renderer.js
index 745bfe47d6987..b40d96f5ee904 100644
--- a/extensions/amp-subscriptions/0.1/renderer.js
+++ b/extensions/amp-subscriptions/0.1/renderer.js
@@ -28,8 +28,8 @@ export class Renderer {
     /** @const @private */
     this.ampdoc_ = ampdoc;
 
-    /** @const @private {!../../../src/service/resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(ampdoc);
+    /** @const @private {!../../../src/service/mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(ampdoc);
 
     // Initial state is "unknown".
     this.setGrantState(null);
@@ -53,7 +53,7 @@ export class Renderer {
    * @private
    */
   setState_(type, state) {
-    this.resources_.mutateElement(this.ampdoc_.getBody(), () => {
+    this.mutator_.mutateElement(this.ampdoc_.getBody(), () => {
       this.getBodyElement_().classList.toggle(
         `${CSS_PREFIX}-${type}-unk`,
         state === null
@@ -99,7 +99,7 @@ export class Renderer {
    * @private
    */
   toggleState_(type, state) {
-    this.resources_.mutateElement(this.ampdoc_.getBody(), () => {
+    this.mutator_.mutateElement(this.ampdoc_.getBody(), () => {
       this.getBodyElement_().classList.toggle(`${CSS_PREFIX}-${type}`, state);
     });
   }
diff --git a/extensions/amp-subscriptions/0.1/test/test-actions.js b/extensions/amp-subscriptions/0.1/test/test-actions.js
index 82d8207c663fa..a27206f90c774 100644
--- a/extensions/amp-subscriptions/0.1/test/test-actions.js
+++ b/extensions/amp-subscriptions/0.1/test/test-actions.js
@@ -72,20 +72,19 @@ describes.realWin('Actions', {amp: true}, env => {
     expect(buildSpy).to.be.calledOnce;
   });
 
-  it('should prepare all URLs', () => {
-    return actions.build().then(() => {
-      const builtActions = actions.builtActionUrlMap_;
-      expect(Object.keys(builtActions)).to.have.length(2);
-      expect(builtActions[Action.LOGIN]).to.equal(
-        'https://example.org/login?rid=RD'
-      );
-      expect(builtActions[Action.SUBSCRIBE]).to.equal(
-        'https://example.org/subscribe?rid=RD&a=A'
-      );
-    });
+  it('should prepare all URLs', async () => {
+    await actions.build();
+    const builtActions = actions.builtActionUrlMap_;
+    expect(Object.keys(builtActions)).to.have.length(2);
+    expect(builtActions[Action.LOGIN]).to.equal(
+      'https://example.org/login?rid=RD'
+    );
+    expect(builtActions[Action.SUBSCRIBE]).to.equal(
+      'https://example.org/subscribe?rid=RD&a=A'
+    );
   });
 
-  it('should open the action popup window synchronously', () => {
+  it('should open the action popup window synchronously', async () => {
     analyticsMock
       .expects('event')
       .withExactArgs(
@@ -108,48 +107,39 @@ describes.realWin('Actions', {amp: true}, env => {
         }
       )
       .once();
-    return actions
-      .build()
-      .then(() => {
-        const promise = actions.execute(Action.LOGIN);
-        expect(openStub).to.be.calledOnce;
-        openResolver('#success=yes');
-        return promise;
-      })
-      .then(result => {
-        expect(result).to.be.true;
-      });
+
+    await actions.build();
+    const promise = actions.execute(Action.LOGIN);
+    expect(openStub).to.be.calledOnce;
+    openResolver('#success=yes');
+
+    const result = await promise;
+    expect(result).to.be.true;
   });
 
-  it('should accept success=true', () => {
-    return actions
-      .build()
-      .then(() => {
-        const promise = actions.execute(Action.LOGIN);
-        expect(openStub).to.be.calledOnce;
-        openResolver('#success=true');
-        return promise;
-      })
-      .then(result => {
-        expect(result).to.be.true;
-      });
+  it('should accept success=true', async () => {
+    await actions.build();
+
+    const promise = actions.execute(Action.LOGIN);
+    expect(openStub).to.be.calledOnce;
+    openResolver('#success=true');
+
+    const result = await promise;
+    expect(result).to.be.true;
   });
 
-  it('should accept success=1', () => {
-    return actions
-      .build()
-      .then(() => {
-        const promise = actions.execute(Action.LOGIN);
-        expect(openStub).to.be.calledOnce;
-        openResolver('#success=1');
-        return promise;
-      })
-      .then(result => {
-        expect(result).to.be.true;
-      });
+  it('should accept success=1', async () => {
+    await actions.build();
+
+    const promise = actions.execute(Action.LOGIN);
+    expect(openStub).to.be.calledOnce;
+    openResolver('#success=1');
+
+    const result = await promise;
+    expect(result).to.be.true;
   });
 
-  it('should accept success=no', () => {
+  it('should accept success=no', async () => {
     analyticsMock
       .expects('event')
       .withExactArgs(
@@ -172,46 +162,40 @@ describes.realWin('Actions', {amp: true}, env => {
         }
       )
       .once();
-    return actions
-      .build()
-      .then(() => {
-        const promise = actions.execute(Action.LOGIN);
-        expect(openStub).to.be.calledOnce;
-        openResolver('#success=no');
-        return promise;
-      })
-      .then(result => {
-        expect(result).to.be.false;
-      });
+
+    await actions.build();
+
+    const promise = actions.execute(Action.LOGIN);
+    expect(openStub).to.be.calledOnce;
+    openResolver('#success=no');
+
+    const result = await promise;
+    expect(result).to.be.false;
   });
 
-  it('should accept no response', () => {
-    return actions
-      .build()
-      .then(() => {
-        const promise = actions.execute(Action.LOGIN);
-        expect(openStub).to.be.calledOnce;
-        openResolver('');
-        return promise;
-      })
-      .then(result => {
-        expect(result).to.be.true;
-      });
+  it('should accept no response', async () => {
+    await actions.build();
+
+    const promise = actions.execute(Action.LOGIN);
+    expect(openStub).to.be.calledOnce;
+    openResolver('');
+
+    const result = await promise;
+    expect(result).to.be.true;
   });
 
-  it('should block re-execution of actions for some time', () => {
-    return actions.build().then(() => {
-      const promise = actions.execute(Action.LOGIN);
-      expect(openStub).to.be.calledOnce;
-      // Repeated call is blocked.
-      expect(actions.execute(Action.LOGIN)).to.equal(promise);
-      // After timeout, the call is allowed.
-      clock.tick(1001);
-      expect(actions.execute(Action.LOGIN)).to.not.equal(promise);
-    });
+  it('should block re-execution of actions for some time', async () => {
+    await actions.build();
+    const promise = actions.execute(Action.LOGIN);
+    expect(openStub).to.be.calledOnce;
+    // Repeated call is blocked.
+    expect(actions.execute(Action.LOGIN)).to.equal(promise);
+    // After timeout, the call is allowed.
+    clock.tick(1001);
+    expect(actions.execute(Action.LOGIN)).to.not.equal(promise);
   });
 
-  it('should handle failures', () => {
+  it('should handle failures', async () => {
     analyticsMock
       .expects('event')
       .withExactArgs(
@@ -234,25 +218,18 @@ describes.realWin('Actions', {amp: true}, env => {
         }
       )
       .once();
-    return actions
-      .build()
-      .then(() => {
-        const promise = actions.execute(Action.LOGIN);
-        expect(openStub).to.be.calledOnce;
-        openResolver(Promise.reject(new Error('broken')));
-        return promise;
-      })
-      .then(
-        () => {
-          throw new Error('must have failed');
-        },
-        reason => {
-          expect(() => {
-            throw reason;
-          }).to.throw(/broken/);
-          expect(actions.actionPromise_).to.be.null;
-        }
-      );
+
+    await actions.build();
+    const promise = actions.execute(Action.LOGIN);
+    expect(openStub).to.be.calledOnce;
+    openResolver(Promise.reject(new Error('broken')));
+    try {
+      await promise;
+      throw new Error('must have failed');
+    } catch (reason) {
+      expect(reason).to.contain(/broken/);
+      expect(actions.actionPromise_).to.be.null;
+    }
   });
 
   it('should disallow unknown action', () => {
diff --git a/extensions/amp-subscriptions/0.1/test/test-amp-subscriptions.js b/extensions/amp-subscriptions/0.1/test/test-amp-subscriptions.js
index 411c5a26bc9d5..8638036cb6e9f 100644
--- a/extensions/amp-subscriptions/0.1/test/test-amp-subscriptions.js
+++ b/extensions/amp-subscriptions/0.1/test/test-amp-subscriptions.js
@@ -396,14 +396,12 @@ describes.fakeWin('AmpSubscriptions', {amp: true}, env => {
 
   describe('selectAndActivatePlatform_', () => {
     function resolveRequiredPromises(entitlementSpec, grantEntitlementSpec) {
-      entitlementSpec = Object.assign(
-        {
-          service: 'local',
-          source: 'local',
-          raw: 'raw',
-        },
-        entitlementSpec
-      );
+      entitlementSpec = {
+        service: 'local',
+        source: 'local',
+        raw: 'raw',
+        ...entitlementSpec,
+      };
       if (!grantEntitlementSpec && entitlementSpec.granted) {
         grantEntitlementSpec = entitlementSpec;
       }
@@ -699,6 +697,92 @@ describes.fakeWin('AmpSubscriptions', {amp: true}, env => {
         origPlatforms
       );
     });
+
+    it('should return empty Entitlement on granted and empty decryptedDocumentKey', async () => {
+      const entitlement = new Entitlement({
+        source: 'local',
+        raw: 'raw',
+        granted: true,
+        grantReason: GrantReason.SUBSCRIBER,
+      });
+      env.sandbox
+        .stub(platform, 'getEntitlements')
+        .callsFake(() => Promise.resolve(entitlement));
+      env.sandbox
+        .stub(subscriptionService.cryptoHandler_, 'isDocumentEncrypted')
+        .callsFake(() => true);
+
+      const ent = await subscriptionService.fetchEntitlements_(platform);
+      expect(ent).to.be.deep.equal(Entitlement.empty('local'));
+    });
+  });
+
+  describe('getEntitlements_', () => {
+    let platform;
+    beforeEach(() => {
+      subscriptionService.pageConfig_ = pageConfig;
+      platform = localSubscriptionPlatformFactory(
+        ampdoc,
+        serviceConfig.services[0],
+        new ServiceAdapter(subscriptionService)
+      );
+      subscriptionService.platformStore_ = new PlatformStore(['local']);
+    });
+
+    it('should return null Entitlement on granted and empty decryptedDocumentKey', async () => {
+      const entitlement = new Entitlement({
+        source: 'local',
+        raw: 'raw',
+        granted: true,
+        grantReason: GrantReason.SUBSCRIBER,
+      });
+      env.sandbox
+        .stub(platform, 'getEntitlements')
+        .callsFake(() => Promise.resolve(entitlement));
+      env.sandbox
+        .stub(subscriptionService.cryptoHandler_, 'isDocumentEncrypted')
+        .callsFake(() => true);
+
+      const ent = await subscriptionService.getEntitlements_(platform);
+      expect(ent).to.be.null;
+    });
+
+    it('should return Entitlement on not granted and empty decryptedDocumentKey', async () => {
+      const entitlement = new Entitlement({
+        source: 'local',
+        raw: 'raw',
+        granted: false,
+        grantReason: GrantReason.SUBSCRIBER,
+      });
+      env.sandbox
+        .stub(platform, 'getEntitlements')
+        .callsFake(() => Promise.resolve(entitlement));
+      env.sandbox
+        .stub(subscriptionService.cryptoHandler_, 'isDocumentEncrypted')
+        .callsFake(() => true);
+
+      const ent = await subscriptionService.getEntitlements_(platform);
+      expect(ent).to.be.deep.equal(entitlement);
+    });
+
+    it('should return Entitlement on granted and decryptedDocumentKey', async () => {
+      const entitlement = new Entitlement({
+        source: 'local',
+        raw: 'raw',
+        granted: false,
+        grantReason: GrantReason.SUBSCRIBER,
+        decryptedDocumentKey: 'key',
+      });
+      env.sandbox
+        .stub(platform, 'getEntitlements')
+        .callsFake(() => Promise.resolve(entitlement));
+      env.sandbox
+        .stub(subscriptionService.cryptoHandler_, 'isDocumentEncrypted')
+        .callsFake(() => true);
+
+      const ent = await subscriptionService.getEntitlements_(platform);
+      expect(ent).to.be.deep.equal(entitlement);
+    });
   });
 
   describe('viewer authorization', () => {
@@ -822,7 +906,7 @@ describes.fakeWin('AmpSubscriptions', {amp: true}, env => {
       rejecter();
 
       // Wait for sendMessageAwaitResponse() to be rejected.
-      let ticks = 4;
+      let ticks = 5;
       while (ticks--) {
         await 'Event loop tick';
       }
diff --git a/extensions/amp-subscriptions/0.1/test/test-crypto-handler.js b/extensions/amp-subscriptions/0.1/test/test-crypto-handler.js
index 583bae2e0d237..f5c545059bf33 100644
--- a/extensions/amp-subscriptions/0.1/test/test-crypto-handler.js
+++ b/extensions/amp-subscriptions/0.1/test/test-crypto-handler.js
@@ -15,6 +15,7 @@
  */
 
 import {CryptoHandler} from '../crypto-handler';
+import {decryptAesGcm} from '../../../../third_party/subscriptions-project/aes_gcm';
 
 describes.realWin(
   'crypto handler',
@@ -99,73 +100,67 @@ describes.realWin(
     describe('getEncryptedDocumentKey', () => {
       it('should return null when there are no keys', () => {
         cryptoHandler = new CryptoHandler(ampdoc);
-        return expect(cryptoHandler.getEncryptedDocumentKey()).to.be.null;
+        expect(cryptoHandler.getEncryptedDocumentKey()).to.be.null;
       });
 
       it('should return null when call doesnt match keys', () => {
         cryptoHandler = new CryptoHandler(ampdoc);
-        return expect(cryptoHandler.getEncryptedDocumentKey('doesntExist')).to
-          .be.null;
+        expect(cryptoHandler.getEncryptedDocumentKey('doesntExist')).to.be.null;
       });
 
       it('should return expected value to a matching key', () => {
         cryptoHandler = new CryptoHandler(ampdoc);
-        return expect(cryptoHandler.getEncryptedDocumentKey('local')).to.equal(
+        expect(cryptoHandler.getEncryptedDocumentKey('local')).to.equal(
           encryptedKey
         );
       });
     });
 
-    describe('decryptDocumentContent_', () => {
-      it('should decrypt the content correctly', () => {
+    describe('decryptDocumentContent', () => {
+      it('should decrypt the content correctly', async () => {
         cryptoHandler = new CryptoHandler(ampdoc);
-        return cryptoHandler
-          .decryptDocumentContent_(encryptedContent, decryptedDocKey)
-          .then(actualContent => {
+        return await decryptAesGcm(decryptedDocKey, encryptedContent).then(
+          actualContent => {
             expect(actualContent.replace(/&#39;/g, "'")).to.equal(
               decryptedContent
             );
-          });
+          }
+        );
       });
     });
 
     describe('tryToDecryptDocument', () => {
       // eslint-disable-next-line max-len
-      it('should replace the encrypted content with decrypted content in multiple sections', () => {
+      it('should replace the encrypted content with decrypted content in multiple sections', async () => {
         cryptoHandler = new CryptoHandler(ampdoc);
-        return cryptoHandler.tryToDecryptDocument(decryptedDocKey).then(() => {
-          expect(cryptoSection1.textContent).to.equal(decryptedContent);
-          expect(cryptoSection2.textContent).to.equal(decryptedContent);
-        });
+        await cryptoHandler.tryToDecryptDocument(decryptedDocKey);
+        expect(cryptoSection1.textContent).to.equal(decryptedContent);
+        expect(cryptoSection2.textContent).to.equal(decryptedContent);
       });
 
-      it('should replace the encrypted content with decrypted content in multiple sections with SHA256 hash', () => {
+      it('should replace the encrypted content with decrypted content in multiple sections with SHA256 hash', async () => {
         win.document
           .querySelector('script[cryptokeys]')
           .setAttribute('sha-256-hash', decryptedDocKeyHash);
         cryptoHandler = new CryptoHandler(ampdoc);
-        return cryptoHandler.tryToDecryptDocument(decryptedDocKey).then(() => {
-          expect(cryptoSection1.textContent).to.equal(decryptedContent);
-          expect(cryptoSection2.textContent).to.equal(decryptedContent);
-        });
+
+        await cryptoHandler.tryToDecryptDocument(decryptedDocKey);
+        expect(cryptoSection1.textContent).to.equal(decryptedContent);
+        expect(cryptoSection2.textContent).to.equal(decryptedContent);
       });
 
-      it('should fail due to key hashes being unequal', () => {
+      it('should fail due to key hashes being unequal', async () => {
         win.document
           .querySelector('script[cryptokeys]')
           .setAttribute('sha-256-hash', decryptedDocKeyHash);
         cryptoHandler = new CryptoHandler(ampdoc);
         const fakeDocKey = '0nasdf234ikn23r09jijfakefake923r42aQ=';
-        return cryptoHandler.tryToDecryptDocument(fakeDocKey).then(
-          () => {
-            throw new Error('Promise should have rejected.');
-          },
-          reason => {
-            expect(() => {
-              throw reason;
-            }).to.throw('Invalid Document Key');
-          }
-        );
+        try {
+          await cryptoHandler.tryToDecryptDocument(fakeDocKey);
+          throw new Error('Promise should have rejected.');
+        } catch (reason) {
+          expect(reason.message).to.contain('Invalid Document Key');
+        }
       });
     });
   }
diff --git a/extensions/amp-subscriptions/0.1/test/test-dialog.js b/extensions/amp-subscriptions/0.1/test/test-dialog.js
index 0c8e7304914ee..ac8d60c36eec7 100644
--- a/extensions/amp-subscriptions/0.1/test/test-dialog.js
+++ b/extensions/amp-subscriptions/0.1/test/test-dialog.js
@@ -56,97 +56,79 @@ describes.realWin('AmpSubscriptions Dialog', {amp: true}, env => {
     expect(styles.position).to.equal('fixed');
   });
 
-  it('should open content when invisible', () => {
+  it('should open content when invisible', async () => {
+    let styles;
+
     const promise = dialog.open(content, false);
     expect(dialog.getRoot()).to.have.display('none');
-    return vsync
-      .mutatePromise(() => {})
-      .then(() => {
-        // First vsync displays the dialog.
-        expect(content.parentNode).to.equal(dialog.getRoot());
-        expect(dialog.isVisible()).to.be.true;
-        expect(dialog.getRoot()).to.have.display('block');
-        const styles = getComputedStyle(dialog.getRoot());
-        expect(styles.transform).to.contain('17');
-        return promise;
-      })
-      .then(() => vsync.mutatePromise(() => {}))
-      .then(() => {
-        expect(dialog.getRoot()).to.have.display('block');
-        const styles = getComputedStyle(dialog.getRoot());
-        expect(styles.transform).to.not.contain('17');
-        expect(dialog.closeButton_).to.have.display('none');
-        expect(updatePaddingSpy).to.be.calledOnce.calledWith(17);
-        expect(addToFixedLayerSpy).to.be.calledOnce.calledWith(
-          dialog.getRoot()
-        );
-        expect(dialog.isVisible()).to.be.true;
-      });
+
+    await vsync.mutatePromise(() => {});
+    // First vsync displays the dialog.
+    expect(content.parentNode).to.equal(dialog.getRoot());
+    expect(dialog.isVisible()).to.be.true;
+    expect(dialog.getRoot()).to.have.display('block');
+    styles = getComputedStyle(dialog.getRoot());
+    expect(styles.transform).to.contain('17');
+
+    await promise;
+    await vsync.mutatePromise(() => {});
+    expect(dialog.getRoot()).to.have.display('block');
+    styles = getComputedStyle(dialog.getRoot());
+    expect(styles.transform).to.not.contain('17');
+    expect(dialog.closeButton_).to.have.display('none');
+    expect(updatePaddingSpy).to.be.calledOnce.calledWith(17);
+    expect(addToFixedLayerSpy).to.be.calledOnce.calledWith(dialog.getRoot());
+    expect(dialog.isVisible()).to.be.true;
   });
 
-  it('should re-open content when visible', () => {
+  it('should re-open content when visible', async () => {
     const content2 = createElementWithAttributes(doc, 'div', {
       style: 'height:21px',
     });
     const promise = dialog.open(content2, false);
-    return vsync
-      .mutatePromise(() => {})
-      .then(() => {
-        expect(content2.parentNode).to.equal(dialog.getRoot());
-        return promise;
-      })
-      .then(() => {
-        expect(content2.parentNode).to.equal(dialog.getRoot());
-        expect(content.parentNode).to.be.null;
-        expect(dialog.getRoot()).to.have.display('block');
-        const styles = getComputedStyle(dialog.getRoot());
-        expect(styles.transform).to.not.contain('21');
-      });
+    await vsync.mutatePromise(() => {});
+    expect(content2.parentNode).to.equal(dialog.getRoot());
+
+    await promise;
+    expect(content2.parentNode).to.equal(dialog.getRoot());
+    expect(content.parentNode).to.be.null;
+    expect(dialog.getRoot()).to.have.display('block');
+    const styles = getComputedStyle(dialog.getRoot());
+    expect(styles.transform).to.not.contain('21');
   });
 
-  it('should close', () => {
-    return dialog
-      .open(content, false)
-      .then(() => {
-        expect(content.parentNode).to.equal(dialog.getRoot());
-        expect(dialog.getRoot()).to.have.display('block');
-        return dialog.close();
-      })
-      .then(() => {
-        expect(dialog.getRoot()).to.have.display('none');
-        expect(dialog.isVisible()).to.be.false;
-        expect(content.parentNode).to.equal(dialog.getRoot());
-        expect(dialog.getRoot().parentNode).to.equal(doc.body);
-      });
+  it('should close', async () => {
+    await dialog.open(content, false);
+    expect(content.parentNode).to.equal(dialog.getRoot());
+    expect(dialog.getRoot()).to.have.display('block');
+
+    await dialog.close();
+    expect(dialog.getRoot()).to.have.display('none');
+    expect(dialog.isVisible()).to.be.false;
+    expect(content.parentNode).to.equal(dialog.getRoot());
+    expect(dialog.getRoot().parentNode).to.equal(doc.body);
   });
 
-  it('should re-open after close', () => {
-    return dialog
-      .open(content, false)
-      .then(() => {
-        expect(dialog.isVisible()).to.be.true;
-        return dialog.close();
-      })
-      .then(() => {
-        expect(dialog.isVisible()).to.be.false;
-        return dialog.open(content, false);
-      })
-      .then(() => {
-        expect(dialog.isVisible()).to.be.true;
-      });
+  it('should re-open after close', async () => {
+    await dialog.open(content, false);
+    expect(dialog.isVisible()).to.be.true;
+
+    await dialog.close();
+    expect(dialog.isVisible()).to.be.false;
+
+    await dialog.open(content, false);
+    expect(dialog.isVisible()).to.be.true;
   });
 
-  it('should show close button', () => {
+  it('should show close button', async () => {
     doc.body.classList.add('i-amphtml-subs-grant-yes');
-    return dialog.open(content, true).then(() => {
-      expect(dialog.closeButton_).to.have.display('block');
-    });
+    await dialog.open(content, true);
+    expect(dialog.closeButton_).to.have.display('block');
   });
 
-  it('should not show close button if content is not granted', () => {
+  it('should not show close button if content is not granted', async () => {
     doc.body.classList.remove('i-amphtml-subs-grant-yes');
-    return dialog.open(content, true).then(() => {
-      expect(dialog.closeButton_).to.have.display('none');
-    });
+    await dialog.open(content, true);
+    expect(dialog.closeButton_).to.have.display('none');
   });
 });
diff --git a/extensions/amp-subscriptions/0.1/test/test-entitlement.js b/extensions/amp-subscriptions/0.1/test/test-entitlement.js
index c52f444ce7ebf..3872ea985e6e5 100644
--- a/extensions/amp-subscriptions/0.1/test/test-entitlement.js
+++ b/extensions/amp-subscriptions/0.1/test/test-entitlement.js
@@ -110,8 +110,6 @@ describes.realWin('EntitlementClass', {}, () => {
       dataObject,
     });
     const pingbackData = entitlement.jsonForPingback();
-    expect(pingbackData).to.deep.equal(
-      Object.assign({raw}, entitlement.json())
-    );
+    expect(pingbackData).to.deep.equal({raw, ...entitlement.json()});
   });
 });
diff --git a/extensions/amp-subscriptions/0.1/test/test-local-subscription-rendering.js b/extensions/amp-subscriptions/0.1/test/test-local-subscription-rendering.js
index bc836dbe3dece..caf39257bbb01 100644
--- a/extensions/amp-subscriptions/0.1/test/test-local-subscription-rendering.js
+++ b/extensions/amp-subscriptions/0.1/test/test-local-subscription-rendering.js
@@ -108,29 +108,23 @@ describes.realWin('local-subscriptions-rendering', {amp: true}, env => {
       });
     }
 
-    it('should display actions and action-sections', () => {
-      return renderer.render({loggedIn: true}).then(() => {
-        displayed([actions1]);
-      });
+    it('should display actions and action-sections', async () => {
+      await renderer.render({loggedIn: true});
+      displayed([actions1]);
     });
 
-    it('should display actions and action-sections', () => {
-      return renderer.render({subscribed: true}).then(() => {
-        displayed([actions2]);
-        expect(delegateUIStub).to.be.called;
-      });
+    it('should display actions and action-sections', async () => {
+      await renderer.render({subscribed: true});
+      displayed([actions2]);
+      expect(delegateUIStub).to.be.called;
     });
 
-    it('should hide sections on reset', () => {
-      return renderer
-        .render({subscribed: true})
-        .then(() => {
-          displayed([actions2]);
-          return renderer.reset();
-        })
-        .then(() => {
-          displayed([]);
-        });
+    it('should hide sections on reset', async () => {
+      await renderer.render({subscribed: true});
+      displayed([actions2]);
+
+      await renderer.reset();
+      displayed([]);
     });
   });
 
@@ -174,7 +168,7 @@ describes.realWin('local-subscriptions-rendering', {amp: true}, env => {
       dialogMock.verify();
     });
 
-    it('should render an element', () => {
+    it('should render an element', async () => {
       templatesMock.expects('renderTemplate').never();
       let content;
       dialogMock
@@ -187,16 +181,16 @@ describes.realWin('local-subscriptions-rendering', {amp: true}, env => {
           true
         )
         .once();
-      return renderer.renderDialog_({value: 'A'}).then(() => {
-        expect(content.id).to.equal('dialog1');
-        expect(content.textContent).to.equal('dialog1');
-        expect(content).to.not.equal(dialog1);
-        expect(content).to.not.have.attribute('subscriptions-dialog');
-        expect(content).to.not.have.attribute('subscriptions-display');
-      });
+
+      await renderer.renderDialog_({value: 'A'});
+      expect(content.id).to.equal('dialog1');
+      expect(content.textContent).to.equal('dialog1');
+      expect(content).to.not.equal(dialog1);
+      expect(content).to.not.have.attribute('subscriptions-dialog');
+      expect(content).to.not.have.attribute('subscriptions-display');
     });
 
-    it('should render a template', () => {
+    it('should render a template', async () => {
       const rendered = createElementWithAttributes(doc, 'div', {});
       const data = {value: 'B'};
       templatesMock
@@ -215,20 +209,20 @@ describes.realWin('local-subscriptions-rendering', {amp: true}, env => {
           true
         )
         .once();
-      return renderer.renderDialog_(data).then(() => {
-        expect(content).to.equal(rendered);
-      });
+
+      await renderer.renderDialog_(data);
+      expect(content).to.equal(rendered);
     });
 
-    it('should ignore rendering if nothing found', () => {
+    it('should ignore rendering if nothing found', async () => {
       templatesMock.expects('renderTemplate').never();
       dialogMock.expects('open').never();
-      return renderer.render({value: 'C'});
+      await renderer.render({value: 'C'});
     });
 
-    it('should hide the dialog on reset', () => {
+    it('should hide the dialog on reset', async () => {
       dialogMock.expects('close').once();
-      return renderer.reset();
+      await renderer.reset();
     });
   });
 });
diff --git a/extensions/amp-subscriptions/0.1/test/test-local-subscriptions-iframe-platform.js b/extensions/amp-subscriptions/0.1/test/test-local-subscriptions-iframe-platform.js
index 9760ac9fa3044..1d4c7c33db4f3 100644
--- a/extensions/amp-subscriptions/0.1/test/test-local-subscriptions-iframe-platform.js
+++ b/extensions/amp-subscriptions/0.1/test/test-local-subscriptions-iframe-platform.js
@@ -94,7 +94,7 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
       serviceAdapter
     );
     const domStub = env.sandbox.stub(
-      localSubscriptionPlatform.rootNode_,
+      localSubscriptionPlatform.rootNode_.body,
       'addEventListener'
     );
 
@@ -198,7 +198,7 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
       expect(connectStub).to.be.calledOnce;
     });
 
-    it('should resolve vars', () => {
+    it('should resolve vars', async () => {
       builderMock
         .expects('collectUrlVars')
         .withExactArgs('VAR1&VAR2', false)
@@ -209,7 +209,7 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
           })
         )
         .once();
-      const expectedConfigWithVars = Object.assign({}, expectedConfig);
+      const expectedConfigWithVars = {...expectedConfig};
       expectedConfigWithVars.config.iframeVars = {VAR1: 'A', VAR2: 'B'};
       serviceConfig.services[0]['iframeVars'] = ['VAR1', 'VAR2'];
       const localSubscriptionPlatform = localSubscriptionPlatformFactory(
@@ -223,13 +223,9 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
       const promise = localSubscriptionPlatform.connect();
       localSubscriptionPlatform.handleCommand_('connect');
 
-      return promise.then(() => {
-        expect(sendStub).to.be.calledOnce;
-        expect(sendStub).to.be.calledWithExactly(
-          'start',
-          expectedConfigWithVars
-        );
-      });
+      await promise;
+      expect(sendStub).to.be.calledOnce;
+      expect(sendStub).to.be.calledWithExactly('start', expectedConfigWithVars);
     });
   });
 
@@ -250,9 +246,7 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
       messengerMock.verify();
     });
 
-    it('should connect', () => {
-      return localSubscriptionPlatform.connectedPromise_;
-    });
+    it('should connect', () => localSubscriptionPlatform.connectedPromise_);
 
     describe('getEntitlements', () => {
       beforeEach(() => {
@@ -265,7 +259,7 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
         localSubscriptionPlatform.handleCommand_('connect');
       });
 
-      it('should return entitlement', () => {
+      it('should return entitlement', async () => {
         messengerMock
           .expects('sendCommandRsvp')
           .withExactArgs('authorize', {})
@@ -276,12 +270,12 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
             })
           )
           .once();
-        return localSubscriptionPlatform.getEntitlements().then(result => {
-          expect(result).to.be.instanceof(Entitlement);
-          expect(result.granted).to.be.true;
-          expect(result.grantReason).to.equal('SUBSCRIBER');
-          expect(result.source).to.equal('local-iframe');
-        });
+
+        const result = await localSubscriptionPlatform.getEntitlements();
+        expect(result).to.be.instanceof(Entitlement);
+        expect(result.granted).to.be.true;
+        expect(result.grantReason).to.equal('SUBSCRIBER');
+        expect(result.source).to.equal('local-iframe');
       });
     });
 
@@ -296,13 +290,14 @@ describes.fakeWin('LocalSubscriptionsIframePlatform', {amp: true}, env => {
         localSubscriptionPlatform.handleCommand_('connect');
       });
 
-      it('should send pingback', () => {
+      it('should send pingback', async () => {
         messengerMock
           .expects('sendCommandRsvp')
           .withExactArgs('pingback', {entitlement: {}})
           .returns(Promise.resolve())
           .once();
-        return localSubscriptionPlatform.pingback({});
+
+        await localSubscriptionPlatform.pingback({});
       });
     });
   });
diff --git a/extensions/amp-subscriptions/0.1/test/test-local-subscriptions.js b/extensions/amp-subscriptions/0.1/test/test-local-subscriptions.js
index 0d905e6bbfde3..e3f89740ff77c 100644
--- a/extensions/amp-subscriptions/0.1/test/test-local-subscriptions.js
+++ b/extensions/amp-subscriptions/0.1/test/test-local-subscriptions.js
@@ -86,9 +86,7 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
       .callsFake(() => Promise.resolve('reader1'));
     getEncryptedDocumentKeyStub = env.sandbox
       .stub(serviceAdapter, 'getEncryptedDocumentKey')
-      .callsFake(() => {
-        return null;
-      });
+      .callsFake(() => null);
     localSubscriptionPlatform = localSubscriptionPlatformFactory(
       ampdoc,
       serviceConfig.services[0],
@@ -98,7 +96,7 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
 
   it('initializeListeners_ should listen to clicks on rootNode', () => {
     const domStub = env.sandbox.stub(
-      localSubscriptionPlatform.rootNode_,
+      localSubscriptionPlatform.rootNode_.body,
       'addEventListener'
     );
 
@@ -117,9 +115,10 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
   });
 
   it('pingbackReturnsAllEntitlements should "pingbackAllEntitlements" config value', () => {
-    const testConfig = Object.assign({}, serviceConfig.services[0], {
+    const testConfig = {
+      ...serviceConfig.services[0],
       'pingbackAllEntitlements': true,
-    });
+    };
     const testLocalPlatform = localSubscriptionPlatformFactory(
       ampdoc,
       testConfig,
@@ -132,19 +131,19 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
     expect(localSubscriptionPlatform.isPrerenderSafe()).to.be.false;
   });
 
-  it('should fetch the entitlements on getEntitlements', () => {
+  it('should fetch the entitlements on getEntitlements', async () => {
     const fetchStub = env.sandbox
       .stub(localSubscriptionPlatform.xhr_, 'fetchJson')
       .callsFake(() => Promise.resolve({json: () => Promise.resolve(json)}));
-    return localSubscriptionPlatform.getEntitlements().then(ent => {
-      expect(fetchStub).to.be.calledOnce;
-      expect(fetchStub.getCall(0).args[0]).to.be.equals(authUrl);
-      expect(fetchStub.getCall(0).args[1].credentials).to.be.equals('include');
-      expect(ent).to.be.instanceof(Entitlement);
-    });
+
+    const ent = await localSubscriptionPlatform.getEntitlements();
+    expect(fetchStub).to.be.calledOnce;
+    expect(fetchStub.getCall(0).args[0]).to.be.equals(authUrl);
+    expect(fetchStub.getCall(0).args[1].credentials).to.be.equals('include');
+    expect(ent).to.be.instanceof(Entitlement);
   });
 
-  it('should buildUrl before fetchingAuth', () => {
+  it('should buildUrl before fetchingAuth', async () => {
     const builtUrl = 'builtUrl';
     const urlBuildingStub = env.sandbox
       .stub(localSubscriptionPlatform.urlBuilder_, 'buildUrl')
@@ -152,44 +151,42 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
     const fetchStub = env.sandbox
       .stub(localSubscriptionPlatform.xhr_, 'fetchJson')
       .callsFake(() => Promise.resolve({json: () => Promise.resolve(json)}));
-    return localSubscriptionPlatform.getEntitlements().then(() => {
-      expect(urlBuildingStub).to.be.calledWith(configAuthUrl, false);
-      expect(fetchStub).to.be.calledWith(builtUrl, {credentials: 'include'});
-    });
+
+    await localSubscriptionPlatform.getEntitlements();
+    expect(urlBuildingStub).to.be.calledWith(configAuthUrl, false);
+    expect(fetchStub).to.be.calledWith(builtUrl, {credentials: 'include'});
   });
 
-  it('should call getEncryptedDocumentKey with local', () => {
+  it('should call getEncryptedDocumentKey with local', async () => {
     env.sandbox
       .stub(localSubscriptionPlatform.xhr_, 'fetchJson')
       .callsFake(() => Promise.resolve({json: () => Promise.resolve(json)}));
-    return localSubscriptionPlatform.getEntitlements().then(() => {
-      expect(getEncryptedDocumentKeyStub).to.be.calledWith('local');
-    });
+
+    await localSubscriptionPlatform.getEntitlements();
+    expect(getEncryptedDocumentKeyStub).to.be.calledWith('local');
   });
 
-  it('should add encryptedDocumentKey parameter to url', () => {
+  it('should add encryptedDocumentKey parameter to url', async () => {
     const fetchStub = env.sandbox
       .stub(localSubscriptionPlatform.xhr_, 'fetchJson')
       .callsFake(() => Promise.resolve({json: () => Promise.resolve(json)}));
-    getEncryptedDocumentKeyStub.callsFake(() => {
-      return 'encryptedDocumentKey';
-    });
-    return localSubscriptionPlatform.getEntitlements().then(() => {
-      return expect(fetchStub).to.be.calledWith(
-        'https://lipsum.com/login/authorize?rid=reader1&crypt=encryptedDocumentKey'
-      );
-    });
+    getEncryptedDocumentKeyStub.callsFake(() => 'encryptedDocumentKey');
+
+    await localSubscriptionPlatform.getEntitlements();
+    expect(fetchStub).to.be.calledWith(
+      'https://lipsum.com/login/authorize?rid=reader1&crypt=encryptedDocumentKey'
+    );
   });
 
-  it('should not add encryptedDocumentKey parameter to url', () => {
+  it('should not add encryptedDocumentKey parameter to url', async () => {
     const fetchStub = env.sandbox
       .stub(localSubscriptionPlatform.xhr_, 'fetchJson')
       .callsFake(() => Promise.resolve({json: () => Promise.resolve(json)}));
-    return localSubscriptionPlatform.getEntitlements().then(() => {
-      return expect(fetchStub).to.be.calledWith(
-        'https://lipsum.com/login/authorize?rid=reader1'
-      );
-    });
+
+    await localSubscriptionPlatform.getEntitlements();
+    expect(fetchStub).to.be.calledWith(
+      'https://lipsum.com/login/authorize?rid=reader1'
+    );
   });
 
   describe('validateActionMap', () => {
@@ -353,7 +350,7 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
   });
 
   describe('executeAction', () => {
-    it('should call executeAction on actions_', () => {
+    it('should call executeAction on actions_', async () => {
       const actionString = 'action';
       const executeStub = env.sandbox
         .stub(localSubscriptionPlatform.actions_, 'execute')
@@ -361,14 +358,14 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
       const resetStub = env.sandbox.stub(serviceAdapter, 'resetPlatforms');
       localSubscriptionPlatform.executeAction(actionString);
       expect(executeStub).to.be.calledWith(actionString);
-      return executeStub().then(() => {
-        expect(resetStub).to.be.calledOnce;
-      });
+
+      await executeStub();
+      expect(resetStub).to.be.calledOnce;
     });
   });
 
   describe('render', () => {
-    it("should call renderer's render method", () => {
+    it("should call renderer's render method", async () => {
       const renderStub = env.sandbox.stub(
         localSubscriptionPlatform.renderer_,
         'render'
@@ -378,13 +375,12 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
         .callsFake(() => Promise.resolve({foo: 'bar'}));
       localSubscriptionPlatform.activate(entitlement);
       expect(stateSub).to.be.calledOnce;
-      return Promise.resolve().then(() => {
-        expect(renderStub).to.be.calledOnce;
-      });
+      await 'Event loop tick';
+      expect(renderStub).to.be.calledOnce;
     });
 
-    it('should build renderState', () => {
-      return expect(
+    it('should build renderState', async () => {
+      await expect(
         localSubscriptionPlatform.createRenderState_(entitlement)
       ).to.eventually.deep.equal({
         'source': 'sample-source',
@@ -416,32 +412,31 @@ describes.fakeWin('LocalSubscriptionsPlatform', {amp: true}, env => {
   });
 
   describe('pingback', () => {
-    it('should call `sendSignal` to the pingback signal', () => {
+    it('should call `sendSignal` to the pingback signal', async () => {
       const sendSignalStub = env.sandbox.stub(
         localSubscriptionPlatform.xhr_,
         'sendSignal'
       );
-      return localSubscriptionPlatform.pingback(entitlement).then(() => {
-        expect(sendSignalStub).to.be.calledOnce;
-        expect(sendSignalStub.getCall(0).args[0]).to.be.equal(pingbackUrl);
-        expect(sendSignalStub.getCall(0).args[1].body).to.equal(
-          JSON.stringify(entitlement.jsonForPingback())
-        );
-      });
+
+      await localSubscriptionPlatform.pingback(entitlement);
+      expect(sendSignalStub).to.be.calledOnce;
+      expect(sendSignalStub.getCall(0).args[0]).to.be.equal(pingbackUrl);
+      expect(sendSignalStub.getCall(0).args[1].body).to.equal(
+        JSON.stringify(entitlement.jsonForPingback())
+      );
     });
-    it('pingback should handle multiple entitlements ', () => {
+    it('pingback should handle multiple entitlements ', async () => {
       const sendSignalStub = env.sandbox.stub(
         localSubscriptionPlatform.xhr_,
         'sendSignal'
       );
 
-      return localSubscriptionPlatform.pingback([entitlement]).then(() => {
-        expect(sendSignalStub).to.be.calledOnce;
-        expect(sendSignalStub.getCall(0).args[0]).to.be.equal(pingbackUrl);
-        expect(sendSignalStub.getCall(0).args[1].body).to.equal(
-          JSON.stringify([entitlement.jsonForPingback()])
-        );
-      });
+      await localSubscriptionPlatform.pingback([entitlement]);
+      expect(sendSignalStub).to.be.calledOnce;
+      expect(sendSignalStub.getCall(0).args[0]).to.be.equal(pingbackUrl);
+      expect(sendSignalStub.getCall(0).args[1].body).to.equal(
+        JSON.stringify([entitlement.jsonForPingback()])
+      );
     });
   });
 });
diff --git a/extensions/amp-subscriptions/0.1/test/test-platform-store.js b/extensions/amp-subscriptions/0.1/test/test-platform-store.js
index 4bd35ef996c9a..a991b90d8515d 100644
--- a/extensions/amp-subscriptions/0.1/test/test-platform-store.js
+++ b/extensions/amp-subscriptions/0.1/test/test-platform-store.js
@@ -69,7 +69,7 @@ describes.realWin('Platform store', {}, env => {
     expect(platformStore.serviceIds_).to.be.equal(serviceIds);
   });
 
-  it('should resolve entitlement', () => {
+  it('should resolve entitlement', async () => {
     // Request entitlement promise even before it's resolved.
     const p = platformStore.getEntitlementPromiseFor('service2');
 
@@ -91,7 +91,7 @@ describes.realWin('Platform store', {}, env => {
       })
     );
     expect(platformStore.getEntitlementPromiseFor('service2')).to.equal(p);
-    return expect(p).to.eventually.equal(ent);
+    await expect(p).to.eventually.equal(ent);
   });
 
   it('should call onChange callbacks on every resolve', () => {
@@ -249,7 +249,7 @@ describes.realWin('Platform store', {}, env => {
     it(
       'should call selectApplicablePlatform_ if areAllPlatformsResolved_ ' +
         'is true',
-      () => {
+      async () => {
         const fakeResult = [entitlementsForService1, entitlementsForService2];
         const getAllPlatformsStub = env.sandbox
           .stub(platformStore, 'getAllPlatformsEntitlements')
@@ -257,10 +257,10 @@ describes.realWin('Platform store', {}, env => {
         const selectApplicablePlatformStub = env.sandbox
           .stub(platformStore, 'selectApplicablePlatform_')
           .callsFake(() => Promise.resolve());
-        return platformStore.selectPlatform(true).then(() => {
-          expect(getAllPlatformsStub).to.be.calledOnce;
-          expect(selectApplicablePlatformStub).to.be.calledOnce;
-        });
+
+        await platformStore.selectPlatform(true);
+        expect(getAllPlatformsStub).to.be.calledOnce;
+        expect(selectApplicablePlatformStub).to.be.calledOnce;
       }
     );
   });
@@ -534,7 +534,7 @@ describes.realWin('Platform store', {}, env => {
         anotherPlatform.getServiceId()
       );
     });
-    it('getScoreFactorStates should return promised score', () => {
+    it('getScoreFactorStates should return promised score', async () => {
       env.sandbox
         .stub(localPlatform, 'getSupportedScoreFactor')
         .callsFake(factor => fakeGetSupportedScoreFactor(factor, {}));
@@ -564,7 +564,8 @@ describes.realWin('Platform store', {}, env => {
           service: 'another',
         })
       );
-      return expect(
+
+      await expect(
         platformStore.getScoreFactorStates()
       ).to.eventually.deep.equal({
         local: {
@@ -655,7 +656,7 @@ describes.realWin('Platform store', {}, env => {
     it(
       'should not interfere with selectPlatform flow if using fallback, ' +
         'when reason is SUBSCRIBER',
-      () => {
+      async () => {
         const platform = new SubscriptionPlatform();
         const anotherPlatform = new SubscriptionPlatform();
         env.sandbox.stub(platform, 'getServiceId').callsFake(() => 'local');
@@ -673,20 +674,20 @@ describes.realWin('Platform store', {}, env => {
           serviceIds[0],
           entitlementsForService1
         );
-        return platformStore.selectPlatform().then(platform => {
-          expect(platformStore.entitlements_['local']).deep.equals(
-            fallbackEntitlement
-          );
-          // falbackEntitlement has Reason as SUBSCRIBER so it should win
-          expect(platform.getServiceId()).to.equal('local');
-        });
+
+        const selectedPlatform = await platformStore.selectPlatform();
+        expect(platformStore.entitlements_['local']).deep.equals(
+          fallbackEntitlement
+        );
+        // falbackEntitlement has Reason as SUBSCRIBER so it should win
+        expect(selectedPlatform.getServiceId()).to.equal('local');
       }
     );
 
     it(
       'should not interfere with selectPlatform flow if using fallback, ' +
         'when reason is not SUBSCRIBER',
-      () => {
+      async () => {
         const platform = new SubscriptionPlatform();
         const anotherPlatform = new SubscriptionPlatform();
         env.sandbox.stub(platform, 'getServiceId').callsFake(() => 'local');
@@ -705,13 +706,13 @@ describes.realWin('Platform store', {}, env => {
           serviceIds[0],
           entitlementsForService1
         );
-        return platformStore.selectPlatform().then(platform => {
-          expect(platformStore.entitlements_['local']).deep.equals(
-            fallbackEntitlement
-          );
-          // falbackEntitlement has Reason as SUBSCRIBER so it should win
-          expect(platform.getServiceId()).to.equal(serviceIds[0]);
-        });
+
+        const selectedPlatform = await platformStore.selectPlatform();
+        expect(platformStore.entitlements_['local']).deep.equals(
+          fallbackEntitlement
+        );
+        // falbackEntitlement has Reason as SUBSCRIBER so it should win
+        expect(selectedPlatform.getServiceId()).to.equal(serviceIds[0]);
       }
     );
   });
@@ -746,46 +747,41 @@ describes.realWin('Platform store', {}, env => {
       granted: false,
     });
 
-    it('should resolve with existing entitlement with subscriptions', () => {
+    it('should resolve with existing entitlement with subscriptions', async () => {
       platformStore.grantStatusEntitlement_ = subscribedEntitlement;
-      return platformStore.getGrantEntitlement().then(entitlement => {
-        expect(entitlement).to.equal(subscribedEntitlement);
-      });
+      const entitlement = await platformStore.getGrantEntitlement();
+      expect(entitlement).to.equal(subscribedEntitlement);
     });
 
-    it('should resolve with first entitlement with subscriptions', () => {
+    it('should resolve with first entitlement with subscriptions', async () => {
       platformStore.resolveEntitlement('service1', subscribedEntitlement);
-      return platformStore.getGrantEntitlement().then(entitlement => {
-        expect(entitlement).to.equal(subscribedEntitlement);
-      });
+      const entitlement = await platformStore.getGrantEntitlement();
+      expect(entitlement).to.equal(subscribedEntitlement);
     });
 
     it(
       'should resolve with metered entitlement when no ' +
         'platform is subscribed',
-      () => {
+      async () => {
         platformStore.resolveEntitlement('service1', noEntitlement);
         platformStore.resolveEntitlement('service2', meteringEntitlement);
-        return platformStore.getGrantEntitlement().then(entitlement => {
-          expect(entitlement).to.equal(meteringEntitlement);
-        });
+        const entitlement = await platformStore.getGrantEntitlement();
+        expect(entitlement).to.equal(meteringEntitlement);
       }
     );
 
-    it('should override metering with subscription', () => {
+    it('should override metering with subscription', async () => {
       platformStore.resolveEntitlement('service1', meteringEntitlement);
       platformStore.resolveEntitlement('service2', subscribedEntitlement);
-      return platformStore.getGrantEntitlement().then(entitlement => {
-        expect(entitlement).to.equal(subscribedEntitlement);
-      });
+      const entitlement = await platformStore.getGrantEntitlement();
+      expect(entitlement).to.equal(subscribedEntitlement);
     });
 
-    it('should resolve to null if nothing matched', () => {
+    it('should resolve to null if nothing matched', async () => {
       platformStore.resolveEntitlement('service1', noEntitlement);
       platformStore.resolveEntitlement('service2', noEntitlement);
-      return platformStore.getGrantEntitlement().then(entitlement => {
-        expect(entitlement).to.be.null;
-      });
+      const entitlement = await platformStore.getGrantEntitlement();
+      expect(entitlement).to.be.null;
     });
   });
 
@@ -800,9 +796,10 @@ describes.realWin('Platform store', {}, env => {
       const entitlement = new Entitlement(entitlementData);
       platformStore.saveGrantEntitlement_(entitlement);
       expect(platformStore.grantStatusEntitlement_).to.be.equal(null);
-      const anotherEntitlement = new Entitlement(
-        Object.assign({}, entitlementData, {granted: true})
-      );
+      const anotherEntitlement = new Entitlement({
+        ...entitlementData,
+        granted: true,
+      });
       platformStore.saveGrantEntitlement_(anotherEntitlement);
       expect(platformStore.grantStatusEntitlement_.json()).to.deep.equal(
         anotherEntitlement.json()
@@ -819,16 +816,14 @@ describes.realWin('Platform store', {}, env => {
           granted: true,
         };
         const entitlement = new Entitlement(entitlementData);
-        const nextMeteredEntitlement = new Entitlement(
-          Object.assign({}, entitlementData, {
-            grantReason: GrantReason.METERING,
-          })
-        );
-        const subscribedMeteredEntitlement = new Entitlement(
-          Object.assign({}, entitlementData, {
-            grantReason: GrantReason.SUBSCRIBER,
-          })
-        );
+        const nextMeteredEntitlement = new Entitlement({
+          ...entitlementData,
+          grantReason: GrantReason.METERING,
+        });
+        const subscribedMeteredEntitlement = new Entitlement({
+          ...entitlementData,
+          grantReason: GrantReason.SUBSCRIBER,
+        });
         platformStore.saveGrantEntitlement_(entitlement);
         expect(platformStore.grantStatusEntitlement_.json()).to.deep.equal(
           entitlement.json()
@@ -857,22 +852,29 @@ describes.realWin('Platform store', {}, env => {
       'should return a promise resolving the requested platform ' +
         'if it is already registered',
       () => {
+        let serviceId;
+
         platformStore.resolvePlatform('local', localPlatform);
         platformStore.onPlatformResolves('local', platform => {
-          expect(platform.getServiceId()).to.be.equal('local');
+          serviceId = platform.getServiceId();
         });
+
+        expect(serviceId).to.be.equal('local');
       }
     );
 
     it(
       'should return a promise resolving when the requested platform ' +
         'gets registered',
-      done => {
+      () => {
+        let serviceId;
+
         platformStore.onPlatformResolves('local', platform => {
-          expect(platform.getServiceId()).to.be.equal('local');
-          done();
+          serviceId = platform.getServiceId();
         });
         platformStore.resolvePlatform('local', localPlatform);
+
+        expect(serviceId).to.be.equal('local');
       }
     );
   });
diff --git a/extensions/amp-subscriptions/0.1/test/test-renderer.js b/extensions/amp-subscriptions/0.1/test/test-renderer.js
index 6541ddc595246..2f06562205b3c 100644
--- a/extensions/amp-subscriptions/0.1/test/test-renderer.js
+++ b/extensions/amp-subscriptions/0.1/test/test-renderer.js
@@ -92,9 +92,9 @@ describes.realWin(
 
       installStylesForDoc(ampdoc, CSS, () => {}, false, 'amp-subscriptions');
 
-      const resources = Services.resourcesForDoc(ampdoc);
+      const mutator = Services.mutatorForDoc(ampdoc);
       env.sandbox
-        .stub(resources, 'mutateElement')
+        .stub(mutator, 'mutateElement')
         .callsFake((element, mutator) => {
           mutator();
         });
@@ -225,25 +225,24 @@ describes.realWin(
         );
       });
 
-      it("shouldn't add a progress bar if loading section is found", () => {
-        return renderer.addLoadingBar().then(() => {
-          expect(insertBeforeStub).to.not.be.called;
-        });
+      it("shouldn't add a progress bar if loading section is found", async () => {
+        await renderer.addLoadingBar();
+        expect(insertBeforeStub).to.not.be.called;
       });
 
-      it('should add a progress bar if no loading section is found', () => {
+      it('should add a progress bar if no loading section is found', async () => {
         loading1.remove();
         loading2.remove();
-        return renderer.addLoadingBar().then(() => {
-          expect(insertBeforeStub).to.be.called;
-          const element = insertBeforeStub.getCall(0).args[0];
-          expect(element.tagName).to.be.equal('DIV');
-          expect(element.className).to.be.equal('i-amphtml-subs-progress');
-          expect(insertBeforeStub.getCall(0).args[1]).to.be.null;
-        });
+
+        await renderer.addLoadingBar();
+        expect(insertBeforeStub).to.be.called;
+        const element = insertBeforeStub.getCall(0).args[0];
+        expect(element.tagName).to.be.equal('DIV');
+        expect(element.className).to.be.equal('i-amphtml-subs-progress');
+        expect(insertBeforeStub.getCall(0).args[1]).to.be.null;
       });
 
-      it('should add a progress bar before footer', () => {
+      it('should add a progress bar before footer', async () => {
         loading1.remove();
         loading2.remove();
         const fakeFooter = createElementWithAttributes(doc, 'footer', {});
@@ -252,13 +251,13 @@ describes.realWin(
         renderer.ampdoc_.getBody().appendChild(fakeFooterContainer);
         const footer = createElementWithAttributes(doc, 'footer', {});
         renderer.ampdoc_.getBody().appendChild(footer);
-        return renderer.addLoadingBar().then(() => {
-          expect(insertBeforeStub).to.be.called;
-          const element = insertBeforeStub.getCall(0).args[0];
-          expect(element.tagName).to.be.equal('DIV');
-          expect(element.className).to.be.equal('i-amphtml-subs-progress');
-          expect(insertBeforeStub.getCall(0).args[1]).to.equal(footer);
-        });
+
+        await renderer.addLoadingBar();
+        expect(insertBeforeStub).to.be.called;
+        const element = insertBeforeStub.getCall(0).args[0];
+        expect(element.tagName).to.be.equal('DIV');
+        expect(element.className).to.be.equal('i-amphtml-subs-progress');
+        expect(insertBeforeStub.getCall(0).args[1]).to.equal(footer);
       });
     });
   }
diff --git a/extensions/amp-subscriptions/0.1/test/test-url-builder.js b/extensions/amp-subscriptions/0.1/test/test-url-builder.js
index c4a0d9df70ae2..a993a95469446 100644
--- a/extensions/amp-subscriptions/0.1/test/test-url-builder.js
+++ b/extensions/amp-subscriptions/0.1/test/test-url-builder.js
@@ -27,84 +27,65 @@ describes.fakeWin('UrlBuilder', {amp: true}, env => {
     urlBuilder = new UrlBuilder(ampdoc, readerIdPromise);
   });
 
-  it('should resolve URL without auth response and no authdata vars', () => {
+  it('should resolve URL without auth response and no authdata vars', async () => {
     expectAsyncConsoleError(/Access or subsciptions service is not installed/);
-    return urlBuilder
-      .buildUrl(
-        '?rid=READER_ID&type=AUTHDATA(child.type)',
-        /* useAuthData */ false
-      )
-      .then(url => {
-        expect(url).to.equal('?rid=reader1&type=');
-      });
+    const url = await urlBuilder.buildUrl(
+      '?rid=READER_ID&type=AUTHDATA(child.type)',
+      /* useAuthData */ false
+    );
+    expect(url).to.equal('?rid=reader1&type=');
   });
 
-  it('should accept reader_id synonyms', () => {
-    return urlBuilder.buildUrl('?rid=ACCESS_READER_ID').then(url => {
-      expect(url).to.equal('?rid=reader1');
-    });
+  it('should accept reader_id synonyms', async () => {
+    const url = await urlBuilder.buildUrl('?rid=ACCESS_READER_ID');
+    expect(url).to.equal('?rid=reader1');
   });
 
-  it('should resolve URL without auth response and with authdata vars', () => {
-    return urlBuilder
-      .buildUrl(
-        '?rid=READER_ID&type=AUTHDATA(child.type)',
-        /* useAuthData */ true
-      )
-      .then(url => {
-        expect(url).to.equal('?rid=reader1&type=');
-      });
+  it('should resolve URL without auth response and with authdata vars', async () => {
+    const url = await urlBuilder.buildUrl(
+      '?rid=READER_ID&type=AUTHDATA(child.type)',
+      /* useAuthData */ true
+    );
+    expect(url).to.equal('?rid=reader1&type=');
   });
 
-  it('should resolve URL with auth response and no authdata vars', () => {
+  it('should resolve URL with auth response and no authdata vars', async () => {
     expectAsyncConsoleError(/Access or subsciptions service is not installed/);
     urlBuilder.setAuthResponse({child: {type: 'premium'}});
-    return urlBuilder
-      .buildUrl(
-        '?rid=READER_ID&type=AUTHDATA(child.type)',
-        /* useAuthData */ false
-      )
-      .then(url => {
-        expect(url).to.equal('?rid=reader1&type=');
-      });
+    const url = await urlBuilder.buildUrl(
+      '?rid=READER_ID&type=AUTHDATA(child.type)',
+      /* useAuthData */ false
+    );
+    expect(url).to.equal('?rid=reader1&type=');
   });
 
-  it('should resolve URL with auth response and with authdata vars', () => {
+  it('should resolve URL with auth response and with authdata vars', async () => {
     urlBuilder.setAuthResponse({child: {type: 'premium'}});
-    return urlBuilder
-      .buildUrl(
-        '?rid=READER_ID&type=AUTHDATA(child.type)',
-        /* useAuthData */ true
-      )
-      .then(url => {
-        expect(url).to.equal('?rid=reader1&type=premium');
-      });
+    const url = await urlBuilder.buildUrl(
+      '?rid=READER_ID&type=AUTHDATA(child.type)',
+      /* useAuthData */ true
+    );
+    expect(url).to.equal('?rid=reader1&type=premium');
   });
 
-  it('should resolve URL with unknown authdata var', () => {
+  it('should resolve URL with unknown authdata var', async () => {
     urlBuilder.setAuthResponse({child: {type: 'premium'}});
-    return urlBuilder
-      .buildUrl(
-        '?rid=READER_ID&type=AUTHDATA(child.type2)',
-        /* useAuthData */ true
-      )
-      .then(url => {
-        expect(url).to.equal('?rid=reader1&type=');
-      });
+    const url = await urlBuilder.buildUrl(
+      '?rid=READER_ID&type=AUTHDATA(child.type2)',
+      /* useAuthData */ true
+    );
+    expect(url).to.equal('?rid=reader1&type=');
   });
 
-  it('should colect URL vars with auth response and with authdata vars', () => {
+  it('should colect URL vars with auth response and with authdata vars', async () => {
     urlBuilder.setAuthResponse({child: {type: 'premium'}});
-    return urlBuilder
-      .collectUrlVars(
-        '?rid=READER_ID&type=AUTHDATA(child.type)',
-        /* useAuthData */ true
-      )
-      .then(vars => {
-        expect(vars).to.deep.equal({
-          'READER_ID': 'reader1',
-          'AUTHDATA(child.type)': 'premium',
-        });
-      });
+    const vars = await urlBuilder.collectUrlVars(
+      '?rid=READER_ID&type=AUTHDATA(child.type)',
+      /* useAuthData */ true
+    );
+    expect(vars).to.deep.equal({
+      'READER_ID': 'reader1',
+      'AUTHDATA(child.type)': 'premium',
+    });
   });
 });
diff --git a/extensions/amp-subscriptions/0.1/test/test-viewer-platform.js b/extensions/amp-subscriptions/0.1/test/test-viewer-platform.js
index f4f0376d73c24..a2d3fae5e2214 100644
--- a/extensions/amp-subscriptions/0.1/test/test-viewer-platform.js
+++ b/extensions/amp-subscriptions/0.1/test/test-viewer-platform.js
@@ -21,6 +21,7 @@ import {PageConfig} from '../../../../third_party/subscriptions-project/config';
 import {ServiceAdapter} from '../service-adapter';
 import {Services} from '../../../../src/services';
 import {ViewerSubscriptionPlatform} from '../viewer-subscription-platform';
+import {dict} from '../../../../src/utils/object';
 import {getWinOrigin} from '../../../../src/url';
 
 describes.fakeWin('ViewerSubscriptionPlatform', {amp: true}, env => {
@@ -37,6 +38,13 @@ describes.fakeWin('ViewerSubscriptionPlatform', {amp: true}, env => {
     products: [currentProductId],
     subscriptionToken: 'token',
   };
+  const nonGrantingEntitlementData = {
+    source: 'local',
+    raw: 'raw',
+    service: 'local',
+    products: ['example.org:registered_user'],
+    subscriptionToken: 'token',
+  };
   const fakeAuthToken = {
     'authorization': 'faketoken',
     'decryptedDocumentKey': 'decryptedDocumentKey',
@@ -94,27 +102,61 @@ describes.fakeWin('ViewerSubscriptionPlatform', {amp: true}, env => {
   });
 
   describe('getEntitlements', () => {
-    it('should call verify() with authorization and decryptedDocKey', () => {
+    it('should call verify() with authorization and decryptedDocKey', async () => {
       const entitlement = {};
       const verifyAuthTokenStub = env.sandbox
         .stub(viewerPlatform, 'verifyAuthToken_')
         .callsFake(() => Promise.resolve(entitlement));
-      return viewerPlatform.getEntitlements().then(() => {
-        expect(verifyAuthTokenStub).to.be.calledWith(
-          fakeAuthToken['authorization'],
-          fakeAuthToken['decryptedDocumentKey']
-        );
-      });
+
+      await viewerPlatform.getEntitlements();
+      expect(verifyAuthTokenStub).to.be.calledWith(
+        fakeAuthToken['authorization'],
+        fakeAuthToken['decryptedDocumentKey']
+      );
     });
 
-    it('should send auth rejection message for rejected verification', () => {
+    it('should send auth rejection message for rejected verification', async () => {
       const reason = 'Payload is expired';
       env.sandbox
         .stub(viewerPlatform, 'verifyAuthToken_')
         .callsFake(() => Promise.reject(new Error(reason)));
-      return viewerPlatform.getEntitlements().catch(() => {
+
+      try {
+        await viewerPlatform.getEntitlements();
+        throw new Error('must have failed');
+      } catch (e) {
         expect(sendAuthTokenStub).to.be.calledWith(reason);
-      });
+      }
+    });
+
+    it('should use domain in cryptokeys param to get encrypted doc key', async () => {
+      env.sandbox
+        .stub(viewerPlatform.viewer_, 'getParam')
+        .withArgs('cryptokeys')
+        .returns('test.com,hello.com');
+      serviceAdapter.getEncryptedDocumentKey.restore();
+      env.sandbox
+        .stub(serviceAdapter, 'getEncryptedDocumentKey')
+        .withArgs('hello.com')
+        .returns('encryptedDocKey');
+      viewerPlatform.viewer_.sendMessageAwaitResponse.restore();
+      const sendMessageStub = env.sandbox
+        .stub(viewerPlatform.viewer_, 'sendMessageAwaitResponse')
+        .callsFake(() => Promise.resolve(fakeAuthToken));
+      env.sandbox
+        .stub(viewerPlatform, 'verifyAuthToken_')
+        .callsFake(() => Promise.resolve({}));
+
+      await viewerPlatform.getEntitlements();
+      expect(sendMessageStub).to.be.calledWith(
+        'auth',
+        dict({
+          'publicationId': 'example.org',
+          'productId': 'example.org:basic',
+          'origin': 'origin',
+          'encryptedDocumentKey': 'encryptedDocKey',
+        })
+      );
     });
   });
 
@@ -133,106 +175,160 @@ describes.fakeWin('ViewerSubscriptionPlatform', {amp: true}, env => {
     const entitlement = Entitlement.parseFromJson(entitlementData);
     entitlement.service = 'local';
 
-    it('should reject promise for expired payload', () => {
-      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => {
-        return {
-          'aud': getWinOrigin(win),
-          'exp': Date.now() / 1000 - 10,
-          'entitlements': [entitlementData],
-        };
-      });
-      return viewerPlatform.verifyAuthToken_('faketoken').catch(reason => {
+    it('should reject promise for expired payload', async () => {
+      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => ({
+        'aud': getWinOrigin(win),
+        'exp': Date.now() / 1000 - 10,
+        'entitlements': [entitlementData],
+      }));
+
+      try {
+        await viewerPlatform.verifyAuthToken_('faketoken');
+        throw new Error('must have failed');
+      } catch (reason) {
         expect(reason.message).to.be.equal('Payload is expired​​​');
-      });
+      }
     });
 
-    it('should reject promise for audience mismatch', () => {
-      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => {
-        return {
-          'aud': 'random origin',
-          'exp': Math.floor(Date.now() / 1000) + 5 * 60,
-          'entitlements': [entitlementData],
-        };
-      });
-      return viewerPlatform.verifyAuthToken_('faketoken').catch(reason => {
+    it('should reject promise for audience mismatch', async () => {
+      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => ({
+        'aud': 'random origin',
+        'exp': Math.floor(Date.now() / 1000) + 5 * 60,
+        'entitlements': [entitlementData],
+      }));
+
+      try {
+        await viewerPlatform.verifyAuthToken_('faketoken');
+        throw new Error('must have failed');
+      } catch (reason) {
         expect(reason.message).to.be.equals(
           'The mismatching "aud" field: random origin​​​'
         );
-      });
+      }
     });
 
-    it('should resolve promise with entitlement', () => {
-      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => {
-        return {
-          'aud': getWinOrigin(win),
-          'exp': Math.floor(Date.now() / 1000) + 5 * 60,
-          'entitlements': [entitlementData],
-        };
-      });
-      return viewerPlatform
-        .verifyAuthToken_('faketoken')
-        .then(resolvedEntitlement => {
-          expect(resolvedEntitlement).to.be.not.undefined;
-          expect(resolvedEntitlement.service).to.equal(entitlementData.service);
-          expect(resolvedEntitlement.source).to.equal('viewer');
-          expect(resolvedEntitlement.granted).to.be.equal(
-            entitlementData.products.indexOf(currentProductId) !== -1
-          );
-          expect(resolvedEntitlement.grantReason).to.be.equal(
-            GrantReason.SUBSCRIBER
-          );
-          // raw should be the data which was resolved via
-          // sendMessageAwaitResponse.
-          expect(resolvedEntitlement.raw).to.equal('faketoken');
-          expect(resolvedEntitlement.decryptedDocumentKey).to.be.undefined;
-        });
+    it('should resolve promise with entitlement (single entitlement)', async () => {
+      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => ({
+        'aud': getWinOrigin(win),
+        'exp': Math.floor(Date.now() / 1000) + 5 * 60,
+        'entitlements': entitlementData,
+      }));
+
+      const resolvedEntitlement = await viewerPlatform.verifyAuthToken_(
+        'faketoken'
+      );
+      expect(resolvedEntitlement).to.be.not.undefined;
+      expect(resolvedEntitlement.service).to.equal(entitlementData.service);
+      expect(resolvedEntitlement.source).to.equal('viewer');
+      expect(resolvedEntitlement.granted).to.be.equal(
+        entitlementData.products.indexOf(currentProductId) !== -1
+      );
+      expect(resolvedEntitlement.grantReason).to.be.equal(
+        GrantReason.SUBSCRIBER
+      );
+      // raw should be the data which was resolved via
+      // sendMessageAwaitResponse.
+      expect(resolvedEntitlement.raw).to.equal('faketoken');
+      expect(resolvedEntitlement.decryptedDocumentKey).to.be.undefined;
     });
 
-    it('should resolve promise with entitlement and decryptedDocKey', () => {
-      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => {
-        return {
+    it('should resolve promise with entitlement (array of entitlements)', async () => {
+      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => ({
+        'aud': getWinOrigin(win),
+        'exp': Math.floor(Date.now() / 1000) + 5 * 60,
+        'entitlements': [entitlementData],
+      }));
+
+      const resolvedEntitlement = await viewerPlatform.verifyAuthToken_(
+        'faketoken'
+      );
+      expect(resolvedEntitlement).to.be.not.undefined;
+      expect(resolvedEntitlement.service).to.equal(entitlementData.service);
+      expect(resolvedEntitlement.source).to.equal('viewer');
+      expect(resolvedEntitlement.granted).to.be.equal(
+        entitlementData.products.indexOf(currentProductId) !== -1
+      );
+      expect(resolvedEntitlement.grantReason).to.be.equal(
+        GrantReason.SUBSCRIBER
+      );
+      // raw should be the data which was resolved via
+      // sendMessageAwaitResponse.
+      expect(resolvedEntitlement.raw).to.equal('faketoken');
+      expect(resolvedEntitlement.decryptedDocumentKey).to.be.undefined;
+    });
+
+    it('should resolve promise with entitlement and decryptedDocKey', async () => {
+      env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => ({
+        'aud': getWinOrigin(win),
+        'exp': Math.floor(Date.now() / 1000) + 5 * 60,
+        'entitlements': [entitlementData],
+      }));
+
+      const resolvedEntitlement = await viewerPlatform.verifyAuthToken_(
+        'faketoken',
+        'decryptedDocumentKey'
+      );
+      expect(resolvedEntitlement.decryptedDocumentKey).to.equal(
+        'decryptedDocumentKey'
+      );
+    });
+
+    it(
+      'should resolve granted entitlement, with metering in data if ' +
+        'viewer only sends metering',
+      async () => {
+        env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => ({
           'aud': getWinOrigin(win),
           'exp': Math.floor(Date.now() / 1000) + 5 * 60,
-          'entitlements': [entitlementData],
-        };
-      });
-      return viewerPlatform
-        .verifyAuthToken_('faketoken', 'decryptedDocumentKey')
-        .then(resolvedEntitlement => {
-          expect(resolvedEntitlement.decryptedDocumentKey).to.equal(
-            'decryptedDocumentKey'
-          );
+          'metering': {
+            left: 3,
+          },
+        }));
+
+        const resolvedEntitlement = await viewerPlatform.verifyAuthToken_(
+          'faketoken'
+        );
+        expect(resolvedEntitlement).to.be.not.undefined;
+        expect(resolvedEntitlement.service).to.equal('local');
+        expect(resolvedEntitlement.granted).to.be.equal(true);
+        expect(resolvedEntitlement.grantReason).to.be.equal(
+          GrantReason.METERING
+        );
+        // raw should be the data which was resolved via
+        // sendMessageAwaitResponse.
+        expect(resolvedEntitlement.data).to.deep.equal({
+          left: 3,
         });
-    });
+      }
+    );
 
     it(
       'should resolve granted entitlement, with metering in data if ' +
-        'viewer only sends metering',
-      () => {
-        env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => {
-          return {
-            'aud': getWinOrigin(win),
-            'exp': Math.floor(Date.now() / 1000) + 5 * 60,
-            'metering': {
-              left: 3,
-            },
-          };
+        'viewer non granting entitlement and metering',
+      async () => {
+        env.sandbox.stub(viewerPlatform.jwtHelper_, 'decode').callsFake(() => ({
+          'aud': getWinOrigin(win),
+          'exp': Math.floor(Date.now() / 1000) + 5 * 60,
+          'entitlements': [nonGrantingEntitlementData],
+          'metering': {
+            left: 3,
+          },
+        }));
+
+        const resolvedEntitlement = await viewerPlatform.verifyAuthToken_(
+          'faketoken'
+        );
+        expect(resolvedEntitlement).to.be.not.undefined;
+        expect(resolvedEntitlement.service).to.equal('local');
+        expect(resolvedEntitlement.granted).to.be.equal(true);
+        expect(resolvedEntitlement.grantReason).to.be.equal(
+          GrantReason.METERING
+        );
+        // raw should be the data which was resolved via
+        // sendMessageAwaitResponse.
+        expect(resolvedEntitlement.data).to.deep.equal({
+          left: 3,
         });
-        return viewerPlatform
-          .verifyAuthToken_('faketoken')
-          .then(resolvedEntitlement => {
-            expect(resolvedEntitlement).to.be.not.undefined;
-            expect(resolvedEntitlement.service).to.equal('local');
-            expect(resolvedEntitlement.granted).to.be.equal(true);
-            expect(resolvedEntitlement.grantReason).to.be.equal(
-              GrantReason.METERING
-            );
-            // raw should be the data which was resolved via
-            // sendMessageAwaitResponse.
-            expect(resolvedEntitlement.data).to.deep.equal({
-              left: 3,
-            });
-          });
       }
     );
   });
@@ -246,6 +342,7 @@ describes.fakeWin('ViewerSubscriptionPlatform', {amp: true}, env => {
       viewerPlatform.getServiceId();
       expect(proxyStub).to.be.called;
     });
+
     it('should delegate isPingbackEnabled', () => {
       const proxyStub = env.sandbox.stub(
         viewerPlatform.platform_,
@@ -254,11 +351,13 @@ describes.fakeWin('ViewerSubscriptionPlatform', {amp: true}, env => {
       viewerPlatform.isPingbackEnabled();
       expect(proxyStub).to.be.called;
     });
+
     it('should delegate pingback', () => {
       const proxyStub = env.sandbox.stub(viewerPlatform.platform_, 'pingback');
       viewerPlatform.pingback();
       expect(proxyStub).to.be.called;
     });
+
     it('should delegate getSupportedScoreFactor', () => {
       const proxyStub = env.sandbox.stub(
         viewerPlatform.platform_,
diff --git a/extensions/amp-subscriptions/0.1/test/test-viewer-tracker.js b/extensions/amp-subscriptions/0.1/test/test-viewer-tracker.js
index 851b19ae97188..701292c72c355 100644
--- a/extensions/amp-subscriptions/0.1/test/test-viewer-tracker.js
+++ b/extensions/amp-subscriptions/0.1/test/test-viewer-tracker.js
@@ -29,15 +29,15 @@ describes.realWin('ViewerTracker', {amp: true}, env => {
   });
 
   describe('scheduleView', () => {
-    it('should call `reportWhenViewed_`, if viewer is visible', () => {
+    it('should call `reportWhenViewed_`, if viewer is visible', async () => {
       const whenViewedStub = env.sandbox.stub(viewTracker, 'reportWhenViewed_');
       env.sandbox.stub(ampdoc, 'isVisible').returns(true);
-      return viewTracker.scheduleView(2000).then(() => {
-        expect(whenViewedStub).to.be.calledOnce;
-      });
+
+      await viewTracker.scheduleView(2000);
+      expect(whenViewedStub).to.be.calledOnce;
     });
 
-    it('should call `reportWhenViewed_`, when viewer gets visible', () => {
+    it('should call `reportWhenViewed_`, when viewer gets visible', async () => {
       let visibleState = false;
       const whenViewedStub = env.sandbox.stub(viewTracker, 'reportWhenViewed_');
       const visibilityChangedStub = env.sandbox.stub(
@@ -50,18 +50,17 @@ describes.realWin('ViewerTracker', {amp: true}, env => {
 
       const viewPromise = viewTracker.scheduleView(2000);
 
-      return ampdoc.whenReady().then(() => {
-        expect(visibilitySandbox).to.be.calledOnce;
-        expect(visibilityChangedStub).to.be.calledOnce;
-        expect(whenViewedStub).to.not.be.called;
-        const callback = visibilityChangedStub.getCall(0).args[0];
-        expect(callback).to.be.instanceOf(Function);
-        visibleState = true;
-        callback();
-        return viewPromise.then(() => {
-          expect(whenViewedStub).to.be.called;
-        });
-      });
+      await ampdoc.whenReady();
+      expect(visibilitySandbox).to.be.calledOnce;
+      expect(visibilityChangedStub).to.be.calledOnce;
+      expect(whenViewedStub).to.not.be.called;
+      const callback = visibilityChangedStub.getCall(0).args[0];
+      expect(callback).to.be.instanceOf(Function);
+      visibleState = true;
+      callback();
+
+      await viewPromise;
+      expect(whenViewedStub).to.be.called;
     });
   });
 
@@ -76,23 +75,23 @@ describes.realWin('ViewerTracker', {amp: true}, env => {
   });
 
   describe('whenViewed_', () => {
-    it('should register "viewed" signal after timeout', () => {
+    it('should register "viewed" signal after timeout', async () => {
       const viewPromise = viewTracker.whenViewed_(1000);
       clock.tick(1001);
-      return viewPromise;
+      await viewPromise;
     });
 
-    it('should register "viewed" signal after scroll', () => {
+    it('should register "viewed" signal after scroll', async () => {
       const scrolled = new Observable();
       viewTracker.viewport_ = {
         onScroll: callback => scrolled.add(callback),
       };
       const viewPromise = viewTracker.whenViewed_(2000);
       scrolled.fire();
-      return viewPromise;
+      await viewPromise;
     });
 
-    it('should register "viewed" signal after click', () => {
+    it('should register "viewed" signal after click', async () => {
       const viewPromise = viewTracker.whenViewed_(2000);
       let clickEvent;
       if (document.createEvent) {
@@ -104,7 +103,7 @@ describes.realWin('ViewerTracker', {amp: true}, env => {
       }
       const node = ampdoc.getRootNode();
       node.body.dispatchEvent(clickEvent);
-      return viewPromise;
+      await viewPromise;
     });
   });
 });
diff --git a/extensions/amp-subscriptions/0.1/viewer-subscription-platform.js b/extensions/amp-subscriptions/0.1/viewer-subscription-platform.js
index ccf659e438b0d..9ec6dc299c724 100644
--- a/extensions/amp-subscriptions/0.1/viewer-subscription-platform.js
+++ b/extensions/amp-subscriptions/0.1/viewer-subscription-platform.js
@@ -85,12 +85,22 @@ export class ViewerSubscriptionPlatform {
       'productId': this.currentProductId_,
       'origin': this.origin_,
     });
-    // TODO(chenshay): Viewer Matching: We don't know which viewer it actually
-    // is. Need to check the viewerUrl to know, or more specificlly iterate via
-    // configured platforms and check whether any of these support the viewer.
-    const encryptedDocumentKey = this.serviceAdapter_.getEncryptedDocumentKey(
-      'google.com'
-    );
+    // Defaulting to google.com for now.
+    // TODO(@elijahsoria): Remove google.com and only rely on what is returned
+    // in the cryptokeys param.
+    let encryptedDocumentKey;
+    const cryptokeysNames = this.viewer_.getParam('cryptokeys') || 'google.com';
+    if (cryptokeysNames) {
+      const keyNames = cryptokeysNames.split(',');
+      for (let i = 0; i != keyNames.length; i++) {
+        encryptedDocumentKey = this.serviceAdapter_.getEncryptedDocumentKey(
+          keyNames[i]
+        );
+        if (encryptedDocumentKey) {
+          break;
+        }
+      }
+    }
     if (encryptedDocumentKey) {
       messageData['encryptedDocumentKey'] = encryptedDocumentKey;
     }
@@ -139,26 +149,41 @@ export class ViewerSubscriptionPlatform {
       }
       const entitlements = decodedData['entitlements'];
       let entitlement = Entitlement.empty('local');
-      if (Array.isArray(entitlements)) {
-        for (let index = 0; index < entitlements.length; index++) {
-          if (
-            entitlements[index]['products'].indexOf(currentProductId) !== -1
-          ) {
-            const entitlementObject = entitlements[index];
-            entitlement = new Entitlement({
-              source: 'viewer',
-              raw: token,
-              granted: true,
-              grantReason: entitlementObject.subscriptionToken
-                ? GrantReason.SUBSCRIBER
-                : '',
-              dataObject: entitlementObject,
-              decryptedDocumentKey,
-            });
-            break;
+      let entitlementObject;
+
+      if (entitlements) {
+        // Not null
+        if (Array.isArray(entitlements)) {
+          // Multi entitlement case
+          for (let index = 0; index < entitlements.length; index++) {
+            if (
+              entitlements[index]['products'].indexOf(currentProductId) !== -1
+            ) {
+              entitlementObject = entitlements[index];
+              break;
+            }
           }
+        } else if (entitlements['products'].indexOf(currentProductId) !== -1) {
+          // Single entitlment case
+          entitlementObject = entitlements;
+        }
+
+        if (entitlementObject) {
+          // Found a match
+          entitlement = new Entitlement({
+            source: 'viewer',
+            raw: token,
+            granted: true,
+            grantReason: entitlementObject.subscriptionToken
+              ? GrantReason.SUBSCRIBER
+              : '',
+            dataObject: entitlementObject,
+            decryptedDocumentKey,
+          });
         }
-      } else if (decodedData['metering'] && !decodedData['entitlements']) {
+      }
+
+      if (decodedData['metering'] && !entitlement.granted) {
         // Special case where viewer gives metering but no entitlement
         entitlement = new Entitlement({
           source: decodedData['iss'] || '',
@@ -168,18 +193,6 @@ export class ViewerSubscriptionPlatform {
           dataObject: decodedData['metering'],
           decryptedDocumentKey,
         });
-      } else if (entitlements) {
-        // Not null
-        entitlement = new Entitlement({
-          source: 'viewer',
-          raw: token,
-          granted: entitlements.granted,
-          grantReason: entitlements.subscriptionToken
-            ? GrantReason.SUBSCRIBER
-            : '',
-          dataObject: entitlements,
-          decryptedDocumentKey,
-        });
       }
       entitlement.service = 'local';
       resolve(entitlement);
diff --git a/extensions/amp-subscriptions/validator-amp-subscriptions.protoascii b/extensions/amp-subscriptions/validator-amp-subscriptions.protoascii
index 0c49ab3c2df39..925a7796d8801 100644
--- a/extensions/amp-subscriptions/validator-amp-subscriptions.protoascii
+++ b/extensions/amp-subscriptions/validator-amp-subscriptions.protoascii
@@ -65,4 +65,85 @@ tags: {  # amp-subscriptions-google
   requires_extension: "amp-subscriptions"
   attr_lists: "common-extension-attrs"
 }
+tags: {  # <script cryptokeys sha-256-hash>
+  html_format: AMP
+  tag_name: "SCRIPT"
+  spec_name: "cryptokeys .json script"
+  unique: true
+  mandatory_parent: "HEAD"
+  requires_extension: "amp-subscriptions"
+  attrs: {
+    name: "cryptokeys"
+    mandatory: true
+    value: ""
+    dispatch_key: NAME_VALUE_DISPATCH
+  }
+  attrs: {
+    name: "sha-256-hash"
+    mandatory: true
+  }
+  attrs: {
+    name: "type"
+    mandatory: true
+    value_casei: "application/json"
+  }
+}
+tags: {  # <section subscriptions-section="content" swg_amp_cache_nonce="NONCE">
+  html_format: AMP
+  tag_name: "SECTION"
+  spec_name: "subscriptions-section content swg_amp_cache_nonce"
+  requires: "span swg_amp_cache_nonce"
+  satisfies: "subscriptions-section content swg_amp_cache_nonce"
+  mandatory_ancestor: "BODY"
+  attrs: {
+    name: "encrypted"
+    mandatory: true
+    dispatch_key: NAME_DISPATCH
+  }
+  attrs: {
+    name: "subscriptions-section"
+    value_casei: "content"
+  }
+  attrs: {
+    name: "swg_amp_cache_nonce"
+    mandatory: true
+  }
+}
+tags: {  # <script type="application/octet-stream" ciphertext>
+  html_format: AMP
+  tag_name: "SCRIPT"
+  spec_name: "subscriptions script ciphertext"
+  mandatory_parent: "subscriptions-section content swg_amp_cache_nonce"
+  mandatory_ancestor: "BODY"
+  attrs: {
+    name: "ciphertext"
+    dispatch_key: NAME_DISPATCH
+    mandatory: true
+  }
+  attrs: {
+    name: "type"
+    value_casei: "application/octet-stream"
+    mandatory: true
+  }
+  cdata: {
+    blacklisted_cdata_regex: {
+      regex: "<!--"
+      error_message: "html comments"
+    }
+  }
+}
+tags: {  # <span swg_amp_cache_nonce="NONCE">
+  html_format: AMP
+  tag_name: "SPAN"
+  spec_name: "span swg_amp_cache_nonce"
+  requires: "subscriptions-section content swg_amp_cache_nonce"
+  satisfies: "span swg_amp_cache_nonce"
+  mandatory_ancestor: "BODY"
+  requires_extension: "amp-subscriptions"
+  attrs: {
+    name: "swg_amp_cache_nonce"
+    mandatory: true
+    dispatch_key: NAME_DISPATCH
+  }
+}
 # related attributes are listed in validator-main.protoascii
diff --git a/extensions/amp-timeago/amp-timeago.md b/extensions/amp-timeago/amp-timeago.md
index c12353d53cc2c..481b1678aca25 100644
--- a/extensions/amp-timeago/amp-timeago.md
+++ b/extensions/amp-timeago/amp-timeago.md
@@ -25,9 +25,11 @@ limitations under the License.
 
 # amp-timeago
 
-Provides fuzzy timestamps by formatting dates as `*** time ago` (for example, 3 hours ago).
-
 <table>
+  <tr>
+    <td width="40%"><strong>Description</strong></td>
+    <td>Provides fuzzy timestamps that you can use on your AMP pages, based on <a href="https://github.com/hustcc/timeago.js">timeago.js</a>.</td>
+  </tr>
   <tr>
     <td width="40%"><strong>Required Script</strong></td>
     <td><code>&lt;script async custom-element="amp-timeago" src="https://cdn.ampproject.org/v0/amp-timeago-0.1.js">&lt;/script></code></td>
@@ -46,10 +48,15 @@ Provides fuzzy timestamps by formatting dates as `*** time ago` (for example, 3
 
 ## Behavior
 
-Provides fuzzy timestamps that you can use on your AMP pages. This component is based on <a href="https://github.com/hustcc/timeago.js">timeago.js</a>.
+Use the amp-timago component to count up to, or away from, a specified date and time.
+
+The component replaces the text node with a fuzzy timestamp, such as `in 30 years` or `3 hours ago`.
+If using the `cutoff` attribute, and time has past the cutoff, the text node will display the specified date in the `datetime` attribute.
 
 Example:
 
+[example preview="inline" playground="true" imports="amp-timeago"]
+
 ```html
 <amp-timeago
   layout="fixed"
@@ -61,6 +68,10 @@ Example:
 >
 ```
 
+The `amp-timeago` component requires a placeholder in the text node. The calculated timestamp replaces the placeholder once ready. Use the placeholder as a fallback to display to users if `amp-timeago` is unable to process the fuzzy timestamp.
+
+[/example]
+
 ## Attributes
 
 <table>
diff --git a/extensions/amp-twitter/0.1/amp-twitter.js b/extensions/amp-twitter/0.1/amp-twitter.js
index 4aad5a13d67ca..b25f59acbd9c7 100644
--- a/extensions/amp-twitter/0.1/amp-twitter.js
+++ b/extensions/amp-twitter/0.1/amp-twitter.js
@@ -15,6 +15,7 @@
  */
 
 import {MessageType} from '../../../src/3p-frame-messaging';
+import {Services} from '../../../src/services';
 import {getIframe, preloadBootstrap} from '../../../src/3p-frame';
 import {htmlFor} from '../../../src/static-template';
 import {isLayoutSizeDefined} from '../../../src/layout';
@@ -45,17 +46,20 @@ class AmpTwitter extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    preloadBootstrap(this.win, this.preconnect);
+    const preconnect = Services.preconnectFor(this.win);
+    const ampdoc = this.getAmpDoc();
+    preloadBootstrap(this.win, ampdoc, preconnect);
     // Hosts the script that renders tweets.
-    this.preconnect.preload(
+    preconnect.preload(
+      ampdoc,
       'https://platform.twitter.com/widgets.js',
       'script'
     );
     // This domain serves the actual tweets as JSONP.
-    this.preconnect.url('https://syndication.twitter.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://syndication.twitter.com', opt_onLayout);
     // All images
-    this.preconnect.url('https://pbs.twimg.com', opt_onLayout);
-    this.preconnect.url('https://cdn.syndication.twimg.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://pbs.twimg.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://cdn.syndication.twimg.com', opt_onLayout);
   }
 
   /** @override */
diff --git a/extensions/amp-user-notification/0.1/test/test-amp-user-notification.js b/extensions/amp-user-notification/0.1/test/test-amp-user-notification.js
index 6492c17915627..e2ab5e6f67118 100644
--- a/extensions/amp-user-notification/0.1/test/test-amp-user-notification.js
+++ b/extensions/amp-user-notification/0.1/test/test-amp-user-notification.js
@@ -786,8 +786,8 @@ describes.realWin(
       });
 
       it('should queue up multiple amp-user-notification elements', function*() {
-        const tag1 = Object.assign({}, tag);
-        const tag2 = Object.assign({}, tag);
+        const tag1 = {...tag};
+        const tag2 = {...tag};
         let resolve1;
         let resolve2;
 
diff --git a/extensions/amp-video-docking/0.1/amp-video-docking.css b/extensions/amp-video-docking/0.1/amp-video-docking.css
index 95b46175781eb..0c8068e5d17ea 100644
--- a/extensions/amp-video-docking/0.1/amp-video-docking.css
+++ b/extensions/amp-video-docking/0.1/amp-video-docking.css
@@ -15,6 +15,9 @@
  */
 
 .amp-video-docked-controls {
+  /* Override in case of RTL so that buttons match their DOM order visually. */
+  direction: ltr !important;
+
   opacity: 0;
   pointer-events: none !important;
   transition: 0.3s opacity ease;
@@ -41,6 +44,20 @@
   margin-right: 10px;
 }
 
+/* large/small breakpoints shouldn't affect this set, so we specify for both. */
+.amp-large > .amp-video-docked-control-set-scroll-back,
+.amp-small > .amp-video-docked-control-set-scroll-back {
+  /* Container is dynamically centered at corner. Offset by -50% in horizontal
+  axis to properly center (holds a single 64px wide button). */
+  margin-left: -32px;
+}
+
+.amp-large > .amp-video-docked-control-set-scroll-back >
+    .amp-video-docked-button-group {
+  /* Reset margin since this set only holds one button. */
+  margin-right: 0;
+}
+
 .amp-large > .amp-video-docked-button-dismiss-group {
   margin: 6px 0 0 -6px;
 }
@@ -60,7 +77,6 @@
   margin-left: 8px;
 }
 
-
 .amp-video-docked-controls-shown {
   opacity: 1;
   pointer-events: initial !important;
@@ -130,6 +146,25 @@
   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3C/svg%3E");
 }
 
+.amp-video-docked-scroll-back {
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M-4-4h48v48H-4z'/%3E%3Cpath d='M36 0c2.2 0 4 1.8 4 4v24c0 2.2-1.8 4-4 4H12c-2.2 0-4-1.8-4-4V4c0-2.2 1.8-4 4-4h24zM16 11.868l12.618 12.618 2.829-2.828L18.789 9H27V5H12v15h4v-8.132zM4 8H0v28c0 2.2 1.8 4 4 4h28v-4H4V8z' fill='%23000' fill-rule='nonzero'/%3E%3C/g%3E%3C/svg%3E");
+  background-size: 50%; /* 🤷🏻‍♂️ */
+}
+
+.amp-rtl .amp-video-docked-scroll-back {
+  /* opposite direction of icon arrow */
+  /* TODO(alanorozco): Might not be worth it to keep a horizontally asymmetrical 
+     icon for a simple drop shadow, consider removing drop shadow and use a
+     horizontal flip CSS transform instead of another SVG definition here. */
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='40' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M-4-4h48v48H-4z'/%3E%3Cpath d='M36 0c2.2 0 4 1.8 4 4v24c0 2.2-1.8 4-4 4H12c-2.2 0-4-1.8-4-4V4c0-2.2 1.8-4 4-4h24zM16 11.868l12.618 12.618 2.829-2.828L18.789 9H27V5H12v15h4v-8.132zM4 8H0v28c0 2.2 1.8 4 4 4h28v-4H4V8z' fill='%23000' fill-rule='nonzero'/%3E%3C/g%3E%3C/svg%3E");
+}
+
+.amp-video-docked-control-set-scroll-back > .amp-video-docked-button-group,
+.amp-video-docked-control-set-scroll-back > .amp-video-docked-button-group > div[role=button] {
+  min-width: 64px;
+  height: 64px;
+}
+
 .amp-video-docked-shadow,
 .i-amphtml-video-docked,
 .i-amphtml-video-docked-overlay {
diff --git a/extensions/amp-video-docking/0.1/amp-video-docking.js b/extensions/amp-video-docking/0.1/amp-video-docking.js
index 0fcbae755b8d6..eab560676fa69 100644
--- a/extensions/amp-video-docking/0.1/amp-video-docking.js
+++ b/extensions/amp-video-docking/0.1/amp-video-docking.js
@@ -226,7 +226,8 @@ function getIntersectionRect(element) {
  * @param {!../../../src/layout-rect.LayoutRectDef} rect
  * @return {boolean}
  */
-function isSizedLayoutRect({width, height}) {
+function isSizedLayoutRect(rect) {
+  const {width, height} = rect;
   return width > 0 && height > 0;
 }
 
@@ -536,6 +537,10 @@ export class VideoDocking {
       this.dismissOnTap_();
     });
 
+    listen(container, VideoDockingEvents.SCROLL_BACK, () => {
+      this.scrollBack_();
+    });
+
     this.addDragListeners_(container);
     this.addDragListeners_(overlay);
 
@@ -628,7 +633,9 @@ export class VideoDocking {
    * @private
    */
   getFixedSlotLayoutBox_() {
-    return this.getFixedLayoutBox_(dev().assertElement(this.getSlot_()));
+    return dev()
+      .assertElement(this.getSlot_())
+      .getPageLayoutBox();
   }
 
   /**
@@ -1116,6 +1123,7 @@ export class VideoDocking {
       );
 
       placeholderIcon.classList.toggle('amp-rtl', isPlacementRtl);
+      this.getControls_().container.classList.toggle('amp-rtl', isPlacementRtl);
     }
 
     // Setting explicit dimensions is needed to match the video's aspect
@@ -1954,6 +1962,19 @@ export class VideoDocking {
     }
     removeElement(el);
   }
+
+  /** @private */
+  scrollBack_() {
+    if (!this.currentlyDocked_) {
+      return;
+    }
+    // Don't set duration or curve.
+    // Rely on Viewport service to determine timing based on scroll Δ.
+    this.viewport_.animateScrollIntoView(
+      this.getDockedVideo_().element,
+      'center'
+    );
+  }
 }
 
 AMP.extension(TAG, 0.1, AMP => {
diff --git a/extensions/amp-video-docking/0.1/breakpoints.js b/extensions/amp-video-docking/0.1/breakpoints.js
index 10c79cc7571e5..fdaed095e264f 100644
--- a/extensions/amp-video-docking/0.1/breakpoints.js
+++ b/extensions/amp-video-docking/0.1/breakpoints.js
@@ -27,7 +27,8 @@ export function applyBreakpointClassname(element, width, breakpoints) {
   breakpoints = breakpoints.sort((a, b) => b.minWidth - a.minWidth);
 
   let maxBreakpoint = -1;
-  breakpoints.forEach(({className, minWidth}) => {
+  breakpoints.forEach(breakpoint => {
+    const {className, minWidth} = breakpoint;
     if (minWidth <= width && minWidth > maxBreakpoint) {
       element.classList.add(className);
       maxBreakpoint = minWidth;
diff --git a/extensions/amp-video-docking/0.1/controls.js b/extensions/amp-video-docking/0.1/controls.js
index 39619317ee419..232cf926aefdc 100644
--- a/extensions/amp-video-docking/0.1/controls.js
+++ b/extensions/amp-video-docking/0.1/controls.js
@@ -20,10 +20,14 @@ import {Services} from '../../../src/services';
 import {Timeout} from './timeout';
 import {VideoDockingEvents, pointerCoords} from './events';
 import {applyBreakpointClassname} from './breakpoints';
-import {closestAncestorElementBySelector} from '../../../src/dom';
+import {
+  closestAncestorElementBySelector,
+  iterateCursor,
+} from '../../../src/dom';
 import {createCustomEvent, listen} from '../../../src/event-helper';
 import {dev, devAssert} from '../../../src/log';
 import {htmlFor, htmlRefs} from '../../../src/static-template';
+import {layoutRectLtwh} from '../../../src/layout-rect';
 import {once} from '../../../src/utils/function';
 import {
   resetStyles,
@@ -32,7 +36,22 @@ import {
   translate,
 } from '../../../src/style';
 
-const TAG = 'amp-video-docking-controls';
+/**
+ * A single controls set can be displayed at a time on the controls layer.
+ *
+ * These map to their displayable classname portion in the format
+ * `amp-video-docked-control-set-${NAME}`
+ * e.g. `PLAYBACK: 'playback'` gets `amp-video-docked-control-set-playback`
+ * @enum {string}
+ */
+const ControlSet = {
+  // Playback buttons like play/pause, mute and fullscreen.
+  PLAYBACK: 'playback',
+
+  // Single button to scroll back to inline position of the component. Displayed
+  // during ad playback for CTA interaction.
+  SCROLL_BACK: 'scroll-back',
+};
 
 /** @private @const {!Array<!./breakpoints.SyntheticBreakpointDef>} */
 const BREAKPOINTS = [
@@ -77,7 +96,10 @@ const renderDockedOverlay = html =>
 const renderControls = html =>
   html`
     <div class="amp-video-docked-controls" hidden>
-      <div class="amp-video-docked-main-button-group">
+      <div
+        class="amp-video-docked-main-button-group
+               amp-video-docked-control-set-playback"
+      >
         <div class="amp-video-docked-button-group">
           <div
             role="button"
@@ -110,6 +132,19 @@ const renderControls = html =>
           ></div>
         </div>
       </div>
+      <div
+        class="amp-video-docked-main-button-group
+               amp-video-docked-control-set-scroll-back"
+        hidden
+      >
+        <div class="amp-video-docked-button-group">
+          <div
+            role="button"
+            ref="scrollBackButton"
+            class="amp-video-docked-scroll-back"
+          ></div>
+        </div>
+      </div>
       <div class="amp-video-docked-button-dismiss-group" ref="dismissContainer">
         <div
           role="button"
@@ -160,7 +195,15 @@ export class Controls {
     this.fullscreenButton_ = assertRef('fullscreenButton');
 
     /** @private @const {!Element} */
-    this.dismissContainer_ = assertRef('dismissContainer'); // eslint-disable-line
+    this.scrollBackButton_ = assertRef('scrollBackButton');
+
+    /** @private @const {!Element} */
+    this.dismissContainer_ = assertRef('dismissContainer');
+
+    /** @private @const {!NodeList} */
+    this.controlSets_ = this.container.querySelectorAll(
+      '.amp-video-docked-main-button-group'
+    );
 
     /** @private {boolean} */
     this.isDisabled_ = false;
@@ -197,13 +240,11 @@ export class Controls {
 
   /** @public */
   disable() {
-    dev().info(TAG, 'disable');
     this.isDisabled_ = true;
   }
 
   /** @public */
   enable() {
-    dev().info(TAG, 'enable');
     this.isDisabled_ = false;
   }
 
@@ -220,6 +261,19 @@ export class Controls {
     }
   }
 
+  /**
+   * Sets displayed controls set.
+   * @param {ControlSet} setName
+   * @private
+   */
+  useControlSet_(setName) {
+    const activeClassname = `amp-video-docked-control-set-${setName}`;
+
+    iterateCursor(this.controlSets_, controlSet => {
+      toggle(controlSet, controlSet.classList.contains(activeClassname));
+    });
+  }
+
   /**
    * @param {!../../../src/video-interface.VideoOrBaseElementDef} video
    * @private
@@ -233,13 +287,7 @@ export class Controls {
 
     this.videoUnlisteners_.push(
       this.listenWhenEnabled_(this.dismissButton_, click, () => {
-        this.container.dispatchEvent(
-          createCustomEvent(
-            this.ampdoc_.win,
-            VideoDockingEvents.DISMISS_ON_TAP,
-            /* detail */ undefined
-          )
-        );
+        this.dispatch_(VideoDockingEvents.DISMISS_ON_TAP);
       }),
 
       this.listenWhenEnabled_(this.playButton_, click, () => {
@@ -262,6 +310,10 @@ export class Controls {
         video.fullscreenEnter();
       }),
 
+      this.listenWhenEnabled_(this.scrollBackButton_, click, () => {
+        this.dispatch_(VideoDockingEvents.SCROLL_BACK);
+      }),
+
       listen(this.container, 'mouseup', () =>
         this.hideOnTimeout(TIMEOUT_AFTER_INTERACTION)
       ),
@@ -269,7 +321,25 @@ export class Controls {
       listen(element, VideoEvents.PLAYING, () => this.onPlay_()),
       listen(element, VideoEvents.PAUSE, () => this.onPause_()),
       listen(element, VideoEvents.MUTED, () => this.onMute_()),
-      listen(element, VideoEvents.UNMUTED, () => this.onUnmute_())
+      listen(element, VideoEvents.UNMUTED, () => this.onUnmute_()),
+
+      listen(element, VideoEvents.AD_START, () =>
+        this.useControlSet_(ControlSet.SCROLL_BACK)
+      ),
+
+      listen(element, VideoEvents.AD_END, () =>
+        this.useControlSet_(ControlSet.PLAYBACK)
+      )
+    );
+  }
+
+  /**
+   * @param {VideoDockingEvents} event
+   * @private
+   */
+  dispatch_(event) {
+    this.container.dispatchEvent(
+      createCustomEvent(this.ampdoc_.win, event, /* detail */ undefined)
     );
   }
 
@@ -357,33 +427,24 @@ export class Controls {
 
   /** @private */
   showOnNextAnimationFrame_() {
-    const {
-      container,
-      overlay,
-      playButton_: playButton,
-      pauseButton_: pauseButton,
-      muteButton_: muteButton,
-      unmuteButton_: unmuteButton,
-    } = this;
+    const {container, overlay} = this;
 
     toggle(container, true);
+
     container.classList.add('amp-video-docked-controls-shown');
     overlay.classList.add('amp-video-docked-controls-bg');
 
-    this.listenToMouseMove_();
+    const isPlaying = this.isPlaying_();
 
-    if (this.isPlaying_()) {
-      swap(playButton, pauseButton);
-    } else {
-      swap(pauseButton, playButton);
-    }
+    toggle(this.playButton_, !isPlaying);
+    toggle(this.pauseButton_, isPlaying);
 
-    if (this.manager_().isMuted(this.video_)) {
-      swap(muteButton, unmuteButton);
-    } else {
-      swap(unmuteButton, muteButton);
-    }
+    const isMuted = this.manager_().isMuted(this.video_);
+
+    toggle(this.muteButton_, !isMuted);
+    toggle(this.unmuteButton_, isMuted);
 
+    this.listenToMouseMove_();
     this.hideOnTimeout();
   }
 
@@ -395,7 +456,9 @@ export class Controls {
    * @param {number} height
    */
   positionOnVsync(scale, x, y, width, height) {
-    const {container, dismissContainer_: dismissContainer} = this;
+    this.area_ = layoutRectLtwh(x, y, width * scale, height * scale);
+
+    const {container} = this;
     const halfScale = scale / 2;
     const centerX = x + width * halfScale;
     const centerY = y + height * halfScale;
@@ -410,7 +473,7 @@ export class Controls {
     const dismissWidth = 40;
     const dismissX = width * halfScale - dismissMargin - dismissWidth;
     const dismissY = -(height * halfScale - dismissMargin - dismissWidth);
-    setImportantStyles(dismissContainer, {
+    setImportantStyles(this.dismissContainer_, {
       'transform': translate(dismissX, dismissY),
     });
   }
diff --git a/extensions/amp-video-docking/0.1/events.js b/extensions/amp-video-docking/0.1/events.js
index 8d508fe61487d..921b96492a2f6 100644
--- a/extensions/amp-video-docking/0.1/events.js
+++ b/extensions/amp-video-docking/0.1/events.js
@@ -19,12 +19,13 @@ import {dev} from '../../../src/log';
 /** @enum {string} */
 export const VideoDockingEvents = {
   DISMISS_ON_TAP: 'dock-dismiss-on-tap',
+  SCROLL_BACK: 'dock-scroll-back',
 };
 
 /**
  * @param {!MouseEvent|!TouchEvent} e
  * @return {{x: number, y: number}}
- * @private
+ * @package
  */
 export function pointerCoords(e) {
   const coords = e.touches ? e.touches[0] : e;
diff --git a/extensions/amp-video-docking/0.1/test/test-amp-video-docking.js b/extensions/amp-video-docking/0.1/test/test-amp-video-docking.js
index 5e7acd91f8599..6f0736d80c601 100644
--- a/extensions/amp-video-docking/0.1/test/test-amp-video-docking.js
+++ b/extensions/amp-video-docking/0.1/test/test-amp-video-docking.js
@@ -41,7 +41,7 @@ const noop = () => {};
 
 const slotId = 'my-slot-element';
 
-describes.realWin('↗ 🔲', {amp: true}, env => {
+describes.realWin('video docking', {amp: true}, env => {
   let ampdoc;
   let manager;
   let viewport;
@@ -93,7 +93,9 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
   function stubLayoutBox(impl, rect, ratio = 0) {
     impl.getLayoutBox = () => rect;
+    impl.getPageLayoutBox = impl.getLayoutBox;
     impl.element.getLayoutBox = impl.getLayoutBox;
+    impl.element.getPageLayoutBox = impl.getLayoutBox;
     impl.element.getIntersectionChangeEntry = () => ({
       intersectionRatio: ratio,
       intersectionRect: rect,
@@ -142,16 +144,14 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
   }
 
   function stubControls() {
-    const html = htmlFor(env.win.document);
     const controls = {
       positionOnVsync: env.sandbox.spy(),
       enable: env.sandbox.spy(),
       disable: env.sandbox.spy(),
       hide: env.sandbox.spy(),
       setVideo: env.sandbox.spy(),
-      overlay: html`
-        <div></div>
-      `,
+      overlay: env.win.document.createElement('div'),
+      container: env.win.document.createElement('div'),
     };
 
     env.sandbox.stub(docking, 'getControls_').returns(controls);
@@ -182,6 +182,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
     viewport = {
       getScrollTop: () => 0,
       getSize: () => viewportSize,
+      animateScrollIntoView: env.sandbox.spy(),
     };
 
     env.sandbox.stub(Services, 'viewportForDoc').returns(viewport);
@@ -233,7 +234,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       videoLayerElement = s => elementExists(video.element, s);
     });
 
-    it('delegates controls positioning', function*() {
+    it('delegates controls positioning', async () => {
       const {positionOnVsync} = stubControls();
 
       const x = 0;
@@ -242,12 +243,12 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       const step = 1;
       const transitionDurationMs = 0;
 
-      yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+      await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
       expect(positionOnVsync).to.have.been.calledOnce;
     });
 
-    it('reparents placeholder', function*() {
+    it('reparents placeholder', async () => {
       stubControls();
 
       const x = 30;
@@ -256,13 +257,13 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       const step = 1;
       const transitionDurationMs = 0;
 
-      yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+      await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
       expect(videoLayerElement('.amp-video-docked-placeholder-background')).to
         .be.ok;
     });
 
-    it('fills component area with placeholder elemenets', function*() {
+    it('fills component area with placeholder elemenets', async () => {
       stubControls();
 
       const x = 30;
@@ -271,7 +272,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       const step = 1;
       const transitionDurationMs = 0;
 
-      yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+      await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
       expect(
         video.applyFillContent.withArgs(
@@ -286,7 +287,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       ).to.have.been.calledOnce;
     });
 
-    it('styles and transforms elements into docked area', function*() {
+    it('styles and transforms elements into docked area', async () => {
       const {overlay} = stubControls();
 
       enableComputedStyle(video.element);
@@ -303,7 +304,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
       placeElementLtwh(video, 0, 0, width, height);
 
-      yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+      await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
       const shadow = bodyLayerElement('.amp-video-docked-shadow');
 
@@ -319,7 +320,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       });
     });
 
-    it('sets poster image', function*() {
+    it('sets poster image', async () => {
       const posterSrc = 'https://whatever.com/image.png';
 
       stubControls();
@@ -333,7 +334,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       const step = 1;
       const transitionDurationMs = 0;
 
-      yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+      await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
       const poster = videoLayerElement(
         '.amp-video-docked-placeholder-background-poster'
@@ -345,7 +346,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
     });
 
     for (let step = 0; step <= 1; step = Number((step + 0.1).toFixed(1))) {
-      it(`sets opacity = step @ step = ${step}`, function*() {
+      it(`sets opacity = step @ step = ${step}`, async () => {
         stubControls();
         enableComputedStyle(video.element);
 
@@ -354,7 +355,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
         const scale = 0.5;
         const transitionDurationMs = 0;
 
-        yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+        await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
         const shadow = bodyLayerElement('.amp-video-docked-shadow');
         const placeholder = videoLayerElement(
@@ -366,7 +367,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       });
     }
 
-    it('overrides overflow to render outside of component area', function*() {
+    it('overrides overflow to render outside of component area', async () => {
       stubControls();
       enableComputedStyle(video.element);
 
@@ -376,12 +377,12 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       const step = 1;
       const transitionDurationMs = 0;
 
-      yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+      await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
       expect(getComputedStyle(video.element)['overflow']).to.equal('visible');
     });
 
-    it('applies classname on internal element', function*() {
+    it('applies classname on internal element', async () => {
       stubControls();
 
       const x = 30;
@@ -390,7 +391,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       const step = 1;
       const transitionDurationMs = 0;
 
-      yield docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
+      await docking.placeAt_(video, x, y, scale, step, transitionDurationMs);
 
       expect(internalElement).to.have.class(BASE_CLASS_NAME);
     });
@@ -399,7 +400,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       {step: 0, fn: 'ease-in'},
       {step: 1, fn: 'ease-out'},
     ].forEach(({step, fn}) => {
-      it(`sets transition timing on elements for step = ${step}`, function*() {
+      it(`sets transition timing on elements for step = ${step}`, async () => {
         const {overlay} = stubControls();
 
         enableComputedStyle(video.element);
@@ -412,7 +413,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
         const durationMs = 260;
         const durationSecondsStr = '0.26s';
 
-        yield docking.placeAt_(video, x, y, scale, step, durationMs);
+        await docking.placeAt_(video, x, y, scale, step, durationMs);
 
         [
           internalElement,
@@ -444,7 +445,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
       const step = 1;
 
-      it(`sets ${className} on icon @ ${width}px wide`, function*() {
+      it(`sets ${className} on icon @ ${width}px wide`, async () => {
         stubControls();
 
         const x = 30;
@@ -454,7 +455,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
         placeElementLtwh(video, 0, 0, width, 200);
 
-        yield docking.placeAt_(
+        await docking.placeAt_(
           video,
           x,
           y,
@@ -483,7 +484,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
           expectedIconX: -width + iconWidth + iconMargin * 2,
         },
       ].forEach(({relativeX, relativeXTextual, expectedIconX}) => {
-        it(`translates placeholder icon horizontally for posX=${relativeXTextual} in threshold for .${className}`, function*() {
+        it(`translates placeholder icon horizontally for posX=${relativeXTextual} in threshold for .${className}`, async () => {
           stubControls();
           enableComputedStyle(video.element);
 
@@ -500,7 +501,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
           placeElementLtwh(video, 0, 0, width, 200);
 
-          yield docking.placeAt_(
+          await docking.placeAt_(
             video,
             x,
             y,
@@ -522,43 +523,64 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
     [
       {
         relativeX: RelativeX.RIGHT,
-        relativeXTextual: 'right',
-        placeholderIconHasAmpRtl: false,
+        directionTextual: 'left to right',
+        hasAmpRtl: false,
       },
       {
         relativeX: RelativeX.LEFT,
-        relativeXTextual: 'left',
-        placeholderIconHasAmpRtl: true,
+        directionTextual: 'right to left',
+        hasAmpRtl: true,
       },
-    ].forEach(({relativeX, relativeXTextual, placeholderIconHasAmpRtl}) => {
-      const setsOrUnsets = placeholderIconHasAmpRtl ? 'sets' : 'unsets';
+    ].forEach(({relativeX, directionTextual, hasAmpRtl}) => {
+      const setsOrUnsets = hasAmpRtl ? 'sets' : 'unsets';
 
-      it(`${setsOrUnsets} RTL classname on icon transitioning to ${relativeXTextual}`, function*() {
-        stubControls();
-        enableComputedStyle(video.element);
+      it(
+        `${setsOrUnsets} amp-rtl classname on icon when docking from ` +
+          directionTextual,
+        async () => {
+          stubControls();
+          enableComputedStyle(video.element);
 
-        const x = 30;
-        const y = 60;
-        const scale = 0.5;
-        const step = 1;
-        const transitionDurationMs = 0;
+          await docking.placeAt_(
+            video,
+            /* x, irrelevant */ 30,
+            /* y, irrelevant */ 60,
+            /* scale, irrelevant */ 0.5,
+            /* step, irrelevant */ 1,
+            /* transitionDurationMs, irrelevant */ 0,
+            relativeX
+          );
 
-        yield docking.placeAt_(
-          video,
-          x,
-          y,
-          scale,
-          step,
-          transitionDurationMs,
-          relativeX
-        );
+          expect(
+            videoLayerElement(
+              '.amp-video-docked-placeholder-icon'
+            ).classList.contains('amp-rtl')
+          ).to.equal(hasAmpRtl);
+        }
+      );
 
-        expect(
-          videoLayerElement(
-            '.amp-video-docked-placeholder-icon'
-          ).classList.contains('amp-rtl')
-        ).to.equal(placeholderIconHasAmpRtl);
-      });
+      it(
+        `${setsOrUnsets} amp-rtl classname on controls layer when docking ` +
+          `from ${directionTextual}`,
+        async () => {
+          const controls = stubControls();
+          enableComputedStyle(video.element);
+
+          await docking.placeAt_(
+            video,
+            /* x, irrelevant */ 30,
+            /* y, irrelevant */ 60,
+            /* scale, irrelevant */ 0.5,
+            /* step, irrelevant */ 1,
+            /* transitionDurationMs, irrelevant */ 0,
+            relativeX
+          );
+
+          expect(controls.container.classList.contains('amp-rtl')).to.equal(
+            hasAmpRtl
+          );
+        }
+      );
     });
   });
 
@@ -618,7 +640,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
   describe('dockInTransferLayerStep_', () => {
     // Something weird causing this to flake in certain leftover states.
     // TODO(alanorozco): Unskip.
-    it.skip('should not overflow', function*() {
+    it.skip('should not overflow', async () => {
       const video = {};
       const target = {};
 
@@ -626,7 +648,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
         .stub(docking, 'dock_')
         .returns(Promise.resolve());
 
-      yield docking.dockInTransferLayerStep_(video, target);
+      await docking.dockInTransferLayerStep_(video, target);
 
       expect(dock).to.have.been.called;
     });
@@ -953,19 +975,23 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
         targetX: 0,
       },
     ].forEach(({expectedRelativeX, placementTextual, videoX, targetX}) => {
-      it(`returns relativeX=${placementTextual.toUpperCase()} when target placed ${placementTextual} of component`, () => {
-        const step = 1;
+      it(
+        `returns relativeX=${placementTextual.toUpperCase()} when target ` +
+          `placed ${placementTextual} of component`,
+        () => {
+          const step = 1;
 
-        placeElementLtwh(video, videoX, videoY, videoWidth, videoHeight);
+          placeElementLtwh(video, videoX, videoY, videoWidth, videoHeight);
 
-        targetAreaStub.returns(
-          layoutRectLtwh(targetX, targetY, targetWidth, targetHeight)
-        );
+          targetAreaStub.returns(
+            layoutRectLtwh(targetX, targetY, targetWidth, targetHeight)
+          );
 
-        expect(docking.getDims_(video, target, step).relativeX).to.equal(
-          expectedRelativeX
-        );
-      });
+          expect(docking.getDims_(video, target, step).relativeX).to.equal(
+            expectedRelativeX
+          );
+        }
+      );
     });
   });
 
@@ -991,19 +1017,19 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       env.sandbox.stub(docking, 'getDims_').returns(targetDims);
     });
 
-    it('sets currently docked', function*() {
+    it('sets currently docked', async () => {
       stubControls();
 
-      yield docking.dock_(video, target, step);
+      await docking.dock_(video, target, step);
 
       expect(setCurrentlyDocked.withArgs(video, target, step)).to.have.been
         .calledOnce;
     });
 
-    it('places element at the result of getDims_', function*() {
+    it('places element at the result of getDims_', async () => {
       stubControls();
 
-      yield docking.dock_(video, target, step);
+      await docking.dock_(video, target, step);
 
       const {x, y, scale, relativeX} = targetDims;
 
@@ -1020,24 +1046,24 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
       ).to.have.been.calledOnce;
     });
 
-    it('hides component controls', function*() {
-      yield docking.dock_(video, target, step);
+    it('hides component controls', async () => {
+      await docking.dock_(video, target, step);
 
       expect(video.hideControls).to.have.been.calledOnce;
     });
 
-    it('enables docked controls', function*() {
+    it('enables docked controls', async () => {
       const {enable} = stubControls();
 
-      yield docking.dock_(video, target, step);
+      await docking.dock_(video, target, step);
 
       expect(enable).to.have.been.calledOnce;
     });
 
-    it('does not enable docked controls if transferring layer', function*() {
+    it('does not enable docked controls if transferring layer', async () => {
       const {enable} = stubControls();
 
-      yield docking.dock_(video, target, step, /* isTransferLayerStep */ true);
+      await docking.dock_(video, target, step, /* isTransferLayerStep */ true);
 
       expect(enable).to.not.have.been.called;
     });
@@ -1143,15 +1169,15 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
         .returns(targetDims);
     });
 
-    it('triggers action', function*() {
+    it('triggers action', async () => {
       stubControls();
 
-      yield docking.undock_(video);
+      await docking.undock_(video);
 
       expect(trigger.withArgs(Actions.UNDOCK)).to.have.been.calledOnce;
     });
 
-    it('updates stale Y after undock', function*() {
+    it('updates stale Y after undock', async () => {
       const {promise, resolve} = new Deferred();
 
       placeAt.returns(promise);
@@ -1163,13 +1189,13 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
       resolve();
 
-      yield done;
+      await done;
 
       expect(maybeUpdateStaleYAfterScroll.withArgs(video)).to.have.been
         .calledOnce;
     });
 
-    it('resets after undock', function*() {
+    it('resets after undock', async () => {
       const {promise, resolve} = new Deferred();
 
       placeAt.returns(promise);
@@ -1180,24 +1206,24 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
       resolve();
 
-      yield done;
+      await done;
 
       expect(resetOnUndock.withArgs(video)).to.have.been.calledOnce;
     });
 
-    it('hides and disables docked controls', function*() {
+    it('hides and disables docked controls', async () => {
       const {hide, disable} = stubControls();
 
-      yield docking.undock_(video);
+      await docking.undock_(video);
 
       expect(hide).to.have.been.calledOnce;
       expect(disable).to.have.been.calledOnce;
     });
 
-    it('places element at the result of getDims_', function*() {
+    it('places element at the result of getDims_', async () => {
       stubControls();
 
-      yield docking.undock_(video);
+      await docking.undock_(video);
 
       const {x, y, scale, relativeX} = targetDims;
 
@@ -1216,18 +1242,18 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
     const inlinePercVis = `${REVERT_TO_INLINE_RATIO * 100}% visible`;
 
-    it(`pauses video when < ${inlinePercVis}`, function*() {
+    it(`pauses video when < ${inlinePercVis}`, async () => {
       placeElementLtwh(video, 0, 0, 400, 400, REVERT_TO_INLINE_RATIO - 0.1);
 
-      yield docking.undock_(video);
+      await docking.undock_(video);
 
       expect(video.pause).to.have.been.calledOnce;
     });
 
-    it(`doesn't pause video when >= ${inlinePercVis}`, function*() {
+    it(`doesn't pause video when >= ${inlinePercVis}`, async () => {
       placeElementLtwh(video, 0, 0, 400, 400, REVERT_TO_INLINE_RATIO);
 
-      yield docking.undock_(video);
+      await docking.undock_(video);
 
       expect(video.pause).to.not.have.been.called;
     });
@@ -1267,12 +1293,12 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
         });
       });
 
-      it(`does not animate transition when < ${inlinePercVis}`, function*() {
+      it(`does not animate transition when < ${inlinePercVis}`, async () => {
         const expectedTransitionDurationMs = 0;
 
         placeElementLtwh(video, 0, 0, 400, 400, REVERT_TO_INLINE_RATIO - 0.1);
 
-        yield docking.undock_(video);
+        await docking.undock_(video);
 
         expect(
           placeAt.withArgs(
@@ -1286,7 +1312,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
         ).to.have.been.calledOnce;
       });
 
-      it(`animates transition when >= ${inlinePercVis}`, function*() {
+      it(`animates transition when >= ${inlinePercVis}`, async () => {
         const expectedTransitionDurationMs = 555;
 
         env.sandbox
@@ -1295,7 +1321,7 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
 
         placeElementLtwh(video, 0, 0, 400, 400, REVERT_TO_INLINE_RATIO);
 
-        yield docking.undock_(video);
+        await docking.undock_(video);
 
         expect(
           placeAt.withArgs(
@@ -1311,6 +1337,35 @@ describes.realWin('↗ 🔲', {amp: true}, env => {
     });
   });
 
+  describe('scrollBack_', () => {
+    beforeEach(() => {
+      // Requests ampdoc when calling `setCurrentlyDocked_`. Node is detached
+      // and we don't care about callee's side effects.
+      env.sandbox.stub(docking, 'trigger_');
+    });
+
+    it('does not scroll when undocked', () => {
+      docking.scrollBack_();
+
+      expect(viewport.animateScrollIntoView).to.not.have.been.called;
+    });
+
+    it("scrolls back to video component's inline box when docked", () => {
+      const video = createVideo();
+
+      docking.setCurrentlyDocked_(
+        video,
+        /* target, irrelevant */ {},
+        /* step, irrelevant */ 1
+      );
+
+      docking.scrollBack_();
+
+      expect(viewport.animateScrollIntoView.withArgs(video.element, 'center'))
+        .to.have.been.calledOnce;
+    });
+  });
+
   describes.repeated(
     '',
     {
diff --git a/extensions/amp-video-docking/amp-video-docking.md b/extensions/amp-video-docking/amp-video-docking.md
index 70fc3487e4d3f..2272db7bd49b1 100644
--- a/extensions/amp-video-docking/amp-video-docking.md
+++ b/extensions/amp-video-docking/amp-video-docking.md
@@ -158,6 +158,20 @@ References a layer that draws an overlay background over the video and under
 the controls. It's displayed only when the controls are displayed. Its
 background can be overridden or removed.
 
+#### `.amp-video-docked-main-button-group`
+
+A controls group that contains a set of buttons. Only one of these elements are
+displayed at a time depending on the state of the video:
+
+- The **playback** set is displayed on most scenarios and contains play/pause,
+  mute/unmute and fullscreen buttons.
+
+- The **scroll back** set only contains a button to scroll the document back
+  to the video's inline position. This is displayed during ad playback in order
+  to allow user interaction.
+
+The dismiss button is **not** part of a controls set and is always displayed.
+
 #### `.amp-docked-video-button-group`
 
 A button "group" that usually contains two buttons, with only one displayed at
@@ -190,6 +204,24 @@ Represents the `unmute` button.
 
 Represents the `fullscreen` button.
 
+#### `.amp-docked-video-scroll-back`
+
+Represents a button to scroll the document back to the video's inline position
+during ad playback to allow user interaction.
+
+This button is different from the other control buttons in that the
+`amp-small`/`amp-large` classnames on the `.amp-docked-video-controls` container
+do not affect it. Because it's the only button in its set, it's also larger than
+the others, at 64 by 64 pixels. Other control buttons are sized at 40 by 40
+pixels.
+
+The icon for this button (set through the `background-image` CSS property)
+changes depending on the relative direction of the docked area. When the video
+docks from left-to-right, the `.amp-docked-video-controls` container gets no
+additional classnames, but it will get the `amp-rtl` classname when the video
+docks in the opposite direction. This allows the button to be drawn with an
+arrow pointing in the correct direction.
+
 #### `.amp-video-docked-placeholder-background`
 
 Represents a container for placeholder elements placed on the empty component area.
diff --git a/extensions/amp-video-iframe/amp-video-iframe.md b/extensions/amp-video-iframe/amp-video-iframe.md
index 8647f14be7b63..d52db051cc714 100644
--- a/extensions/amp-video-iframe/amp-video-iframe.md
+++ b/extensions/amp-video-iframe/amp-video-iframe.md
@@ -52,6 +52,8 @@ supported by the AMP component library.
 3. If you've built a **custom player** or are using one provided by an **unsupported 3rd party**, **you should use `amp-video-iframe`**. This is different from using [`amp-iframe`](https://amp.dev/documentation/components/amp-iframe) in that it enables
    [Video Features on AMP](../../spec/amp-video-interface.md). See [behavior](#behavior) below for more details.
 
+4. If you're a **3rd party video vendor**, **you can use `amp-video-iframe`** to [provide a simple way for authors to embed video.](#vendors)
+
 ## Behavior
 
 `amp-video-iframe` has several important differences from vanilla iframes and `amp-iframe`.
@@ -129,14 +131,37 @@ Include an `amp-video-iframe` on your AMP document:
 <amp-video-iframe
   layout="responsive"
   width="16"
-  height="16"
+  height="9"
   src="/my-video-player.html"
   poster="/my-video-poster.jpg"
 >
 </amp-video-iframe>
 ```
 
-## Integration inside the frame
+`my-video-player.html` is the inner document loaded inside the frame that plays the video. This document must include and bootstrap [an integration script](#integration) so that the AMP document including the `<amp-video-iframe>` can coordinate the video's playback.
+
+### <a id="vendors"></a> For third-party video vendors
+
+If you're a vendor that does _not_ provide a [custom video player component](../../spec/amp-video-interface.md), you can use `amp-video-iframe` to allow AMP document authors to embed video provided through your service.
+
+By hosting a generic [integration document](#integration) that can reference videos with URL parameters, authors don't need to provide the inner player document themselves, but only include an `<amp-video-iframe>` tag in the AMP document:
+
+```html
+<amp-video-iframe
+  layout="responsive"
+  width="16"
+  height="9"
+  src="https://video-provider.example/amp-video-iframe.html?videoid=PROVIDED_VIDEO_ID"
+  poster="https://video-provider.example/amp-video-iframe-poster.jpg?videoid=PROVIDED_VIDEO_ID"
+>
+</amp-video-iframe>
+```
+
+The dynamic server-side document `amp-video-iframe.html` includes the video as necessary per the configurable `PROVIDED_VIDEO_ID` parameter. This document bootstraps the [iframe integration script](#integration) so that the AMP document can coordinate with the player.
+
+Note: For most video providers, `amp-video-iframe` provides enough tools for common playback actions (see possible [methods](#method) and [events](#postEvent)). Refer to the [vendor-specific video player spec](../../spec/amp-3p-video.md) for more details on whether you can use `amp-video-iframe` or you should build a third-party player component instead.
+
+## <a id="integration"></a> Integration inside the frame
 
 In order for the video integration to work, the embedded document (e.g. `my-video-player.html`) must include a small library:
 
diff --git a/extensions/amp-video/0.1/amp-video.js b/extensions/amp-video/0.1/amp-video.js
index 04a58430dbf06..9dcfd19750bb5 100644
--- a/extensions/amp-video/0.1/amp-video.js
+++ b/extensions/amp-video/0.1/amp-video.js
@@ -107,7 +107,11 @@ class AmpVideo extends AMP.BaseElement {
     const videoSrc = this.getVideoSourceForPreconnect_();
     if (videoSrc) {
       this.getUrlService_().assertHttpsUrl(videoSrc, this.element);
-      this.preconnect.url(videoSrc, opt_onLayout);
+      Services.preconnectFor(this.win).url(
+        this.getAmpDoc(),
+        videoSrc,
+        opt_onLayout
+      );
     }
   }
 
diff --git a/extensions/amp-video/0.1/test-e2e/test-amp-video.js b/extensions/amp-video/0.1/test-e2e/test-amp-video.js
new file mode 100644
index 0000000000000..a28d89f6668d1
--- /dev/null
+++ b/extensions/amp-video/0.1/test-e2e/test-amp-video.js
@@ -0,0 +1,48 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describes.endtoend(
+  'amp-video autoplay with control',
+  {
+    testUrl: 'http://localhost:8000/test/fixtures/e2e/amp-video/autoplay.html',
+    environments: 'amp4ads-preset',
+  },
+  env => {
+    let controller;
+
+    beforeEach(async () => {
+      controller = env.controller;
+    });
+
+    function isPaused(elem) {
+      return controller.getElementProperty(elem, 'paused');
+    }
+
+    it('control buttons should manipulate video box behavior', async () => {
+      const videoElem = await controller.findElement('#myVideo video');
+      // Wait until video starts to play
+      await expect(isPaused(videoElem)).to.be.false;
+
+      const pauseBtn = await controller.findElement('#pauseBtn');
+      await controller.click(pauseBtn);
+      await expect(isPaused(videoElem)).to.be.true;
+
+      const playBtn = await controller.findElement('#playBtn');
+      await controller.click(playBtn);
+      await expect(isPaused(videoElem)).to.be.false;
+    });
+  }
+);
diff --git a/extensions/amp-video/0.1/test/test-amp-video.js b/extensions/amp-video/0.1/test/test-amp-video.js
index d4b5273c10c22..f4a18e9d85329 100644
--- a/extensions/amp-video/0.1/test/test-amp-video.js
+++ b/extensions/amp-video/0.1/test/test-amp-video.js
@@ -19,7 +19,6 @@ import {Services} from '../../../../src/services';
 import {VideoEvents} from '../../../../src/video-interface';
 import {VisibilityState} from '../../../../src/visibility-state';
 import {listenOncePromise} from '../../../../src/event-helper';
-import {registerServiceBuilder} from '../../../../src/service';
 import {toggleExperiment} from '../../../../src/experiments';
 
 describes.realWin(
@@ -72,15 +71,28 @@ describes.realWin(
       }
     }
 
-    it('should load a video', async () => {
+    it('should preconnect', async () => {
       const v = await getVideo({
         src: 'video.mp4',
         width: 160,
         height: 90,
       });
-      const preloadSpy = env.sandbox.spy(v.implementation_.preconnect, 'url');
+      const preconnect = Services.preconnectFor(win);
+      env.sandbox.spy(preconnect, 'url');
       v.implementation_.preconnectCallback();
-      preloadSpy.should.have.been.calledWithExactly('video.mp4', undefined);
+      expect(preconnect.url).to.have.been.calledWithExactly(
+        env.sandbox.match.object, // AmpDoc
+        'video.mp4',
+        undefined
+      );
+    });
+
+    it('should load a video', async () => {
+      const v = await getVideo({
+        src: 'video.mp4',
+        width: 160,
+        height: 90,
+      });
       const video = v.querySelector('video');
       expect(video.tagName).to.equal('VIDEO');
       expect(video.getAttribute('src')).to.equal('video.mp4');
@@ -98,9 +110,6 @@ describes.realWin(
         'crossorigin': '',
         'disableremoteplayback': '',
       });
-      const preloadSpy = env.sandbox.spy(v.implementation_.preconnect, 'url');
-      v.implementation_.preconnectCallback();
-      preloadSpy.should.have.been.calledWithExactly('video.mp4', undefined);
       const video = v.querySelector('video');
       expect(video.tagName).to.equal('VIDEO');
       expect(video.hasAttribute('controls')).to.be.true;
@@ -135,9 +144,6 @@ describes.realWin(
         },
         sources
       );
-      const preloadSpy = env.sandbox.spy(v.implementation_.preconnect, 'url');
-      v.implementation_.preconnectCallback();
-      preloadSpy.should.have.been.calledWithExactly('video.mp4', undefined);
       const video = v.querySelector('video');
       // check that the source tags were propogated
       expect(video.children.length).to.equal(mediatypes.length);
@@ -175,9 +181,6 @@ describes.realWin(
         },
         tracks
       );
-      const preloadSpy = env.sandbox.spy(v.implementation_.preconnect, 'url');
-      v.implementation_.preconnectCallback();
-      preloadSpy.should.have.been.calledWithExactly('video.mp4', undefined);
       const video = v.querySelector('video');
       // check that the source tags were propogated
       expect(video.children.length).to.equal(tracktypes.length);
@@ -823,16 +826,14 @@ describes.realWin(
       });
 
       describe('should preconnect to the first cached source', () => {
-        let fakePreconnect;
+        let preconnect;
 
         beforeEach(() => {
-          fakePreconnect = {url: () => {}};
-          registerServiceBuilder(win, 'preconnect', () => fakePreconnect);
+          preconnect = {url: env.sandbox.stub()};
+          env.sandbox.stub(Services, 'preconnectFor').returns(preconnect);
         });
 
         it('no cached source', async () => {
-          const preloadStub = window.sandbox.stub(fakePreconnect, 'url');
-
           await getVideo({
             src: 'https://example.com/video.mp4',
             poster: 'https://example.com/poster.jpg',
@@ -840,12 +841,10 @@ describes.realWin(
             height: 90,
           });
 
-          expect(preloadStub).to.not.have.been.called;
+          expect(preconnect.url).to.not.have.been.called;
         });
 
         it('cached source', async () => {
-          const preloadStub = window.sandbox.stub(fakePreconnect, 'url');
-
           const cachedSource = doc.createElement('source');
           cachedSource.setAttribute(
             'src',
@@ -865,15 +864,14 @@ describes.realWin(
             [cachedSource]
           );
 
-          expect(preloadStub).to.have.been.calledOnce;
-          expect(preloadStub.getCall(0).args[1]).to.equal(
+          expect(preconnect.url).to.have.been.calledOnce;
+          expect(preconnect.url.getCall(0)).to.have.been.calledWith(
+            env.sandbox.match.object, // AmpDoc
             'https://example-com.cdn.ampproject.org/m/s/video.mp4'
           );
         });
 
         it('mixed sources', async () => {
-          const preloadStub = window.sandbox.stub(fakePreconnect, 'url');
-
           const source = doc.createElement('source');
           source.setAttribute('src', 'video.mp4');
 
@@ -894,8 +892,9 @@ describes.realWin(
             },
             [source, cachedSource]
           );
-          expect(preloadStub).to.have.been.calledOnce;
-          expect(preloadStub.getCall(0).args[1]).to.equal(
+          expect(preconnect.url).to.have.been.calledOnce;
+          expect(preconnect.url.getCall(0)).to.have.been.calledWith(
+            env.sandbox.match.object, // AmpDoc
             'https://example-com.cdn.ampproject.org/m/s/video.mp4'
           );
         });
diff --git a/extensions/amp-viewer-integration/0.1/amp-viewer-integration.js b/extensions/amp-viewer-integration/0.1/amp-viewer-integration.js
index b54ac56cc2c4f..0bfbdb50b384a 100644
--- a/extensions/amp-viewer-integration/0.1/amp-viewer-integration.js
+++ b/extensions/amp-viewer-integration/0.1/amp-viewer-integration.js
@@ -14,7 +14,6 @@
  * limitations under the License.
  */
 
-import {AmpViewerIntegrationVariableService} from './variable-service';
 import {FocusHandler} from './focus-handler';
 import {
   HighlightHandler,
@@ -31,7 +30,7 @@ import {Services} from '../../../src/services';
 import {TouchHandler} from './touch-handler';
 import {dev} from '../../../src/log';
 import {dict} from '../../../src/utils/object';
-import {getAmpdoc, registerServiceBuilder} from '../../../src/service';
+import {getAmpdoc} from '../../../src/service';
 import {getData, listen, listenOnce} from '../../../src/event-helper';
 import {getSourceUrl} from '../../../src/url';
 import {isIframed} from '../../../src/dom';
@@ -69,14 +68,6 @@ export class AmpViewerIntegration {
      * @private {?HighlightHandler}
      */
     this.highlightHandler_ = null;
-
-    /** @const @private {!AmpViewerIntegrationVariableService} */
-    this.variableService_ = new AmpViewerIntegrationVariableService(
-      getAmpdoc(this.win.document)
-    );
-    registerServiceBuilder(this.win, 'viewer-integration-variable', () =>
-      this.variableService_.get()
-    );
   }
 
   /**
diff --git a/extensions/amp-viewer-integration/0.1/test/test-keyboard-handler.js b/extensions/amp-viewer-integration/0.1/test/test-keyboard-handler.js
index de5f0f36d5904..c68b71544ccee 100644
--- a/extensions/amp-viewer-integration/0.1/test/test-keyboard-handler.js
+++ b/extensions/amp-viewer-integration/0.1/test/test-keyboard-handler.js
@@ -567,21 +567,19 @@ function createKeyboardEventInitWithKeyCode(key, keyCode) {
  * @return {!JsonObject}
  */
 function createKeyboardEventInit(overrideKeyboardEventInit) {
-  return Object.assign(
-    {
-      key: '',
-      code: '',
-      location: 0,
-      ctrlKey: false,
-      shiftKey: false,
-      altKey: false,
-      metaKey: false,
-      repeat: false,
-      isComposing: false,
-      charCode: 0,
-      keyCode: 0,
-      which: 0,
-    },
-    overrideKeyboardEventInit
-  );
+  return {
+    key: '',
+    code: '',
+    location: 0,
+    ctrlKey: false,
+    shiftKey: false,
+    altKey: false,
+    metaKey: false,
+    repeat: false,
+    isComposing: false,
+    charCode: 0,
+    keyCode: 0,
+    which: 0,
+    ...overrideKeyboardEventInit,
+  };
 }
diff --git a/extensions/amp-viewer-integration/0.1/test/test-variable-service.js b/extensions/amp-viewer-integration/0.1/test/test-variable-service.js
deleted file mode 100644
index 5352e4c5ff61d..0000000000000
--- a/extensions/amp-viewer-integration/0.1/test/test-variable-service.js
+++ /dev/null
@@ -1,38 +0,0 @@
-/**
- * Copyright 2018 The AMP HTML Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-import {AmpViewerIntegrationVariableService} from '../variable-service';
-
-describes.fakeWin('amp-viewer-integration variable service', {}, () => {
-  let variableService;
-
-  beforeEach(() => {
-    const ampdoc = {
-      win: {
-        location: {
-          originalHash: '#margarine=1&ice=2&cream=3',
-          ancestorOrigins: ['http://margarine-paradise.com'],
-        },
-      },
-    };
-    variableService = new AmpViewerIntegrationVariableService(ampdoc);
-  });
-
-  it('should return the first ancestorOrigin', () => {
-    expect(variableService.get()['ancestorOrigin']()).to.equal(
-      'http://margarine-paradise.com'
-    );
-  });
-});
diff --git a/extensions/amp-viewer-integration/0.1/variable-service.js b/extensions/amp-viewer-integration/0.1/variable-service.js
deleted file mode 100644
index 2fcb653b71696..0000000000000
--- a/extensions/amp-viewer-integration/0.1/variable-service.js
+++ /dev/null
@@ -1,61 +0,0 @@
-/**
- * Copyright 2018 The AMP HTML Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/**
- * @typedef {{ancestorOrigin: function(string, string):string}}
- */
-export let ViewerIntegrationVariableDef;
-
-/**
- * Variable service for amp-viewer-integration.
- * Used for URL replacement service. See usage in src/url-replacements-impl.
- */
-export class AmpViewerIntegrationVariableService {
-  /**
-   * @param {!../../../src/service/ampdoc-impl.AmpDoc} ampdoc
-   */
-  constructor(ampdoc) {
-    /** @private @const {!../../../src/service/ampdoc-impl.AmpDoc} */
-    this.ampdoc_ = ampdoc;
-
-    /** @private @const {!ViewerIntegrationVariableDef} */
-    this.variables_ = {
-      ancestorOrigin: (unusedParam, unusedDefaultValue) => {
-        return this.getAncestorOrigin_();
-      },
-    };
-  }
-
-  /**
-   * Return the ANCESTOR_ORIGIN from the location
-   * @return {string}
-   * @private
-   */
-  getAncestorOrigin_() {
-    const {ancestorOrigins} = this.ampdoc_.win.location;
-    if (!ancestorOrigins) {
-      return '';
-    }
-    return ancestorOrigins[0];
-  }
-
-  /**
-   * @return {!ViewerIntegrationVariableDef}
-   */
-  get() {
-    return this.variables_;
-  }
-}
diff --git a/extensions/amp-viewer-integration/TICKEVENTS.md b/extensions/amp-viewer-integration/TICKEVENTS.md
index c13e37375320d..b5a60a79597b7 100644
--- a/extensions/amp-viewer-integration/TICKEVENTS.md
+++ b/extensions/amp-viewer-integration/TICKEVENTS.md
@@ -24,19 +24,21 @@ Every start label has an assumed e\_`label` for its "end" counterpart label.
 As an example if we executed `perf.tick('label')` we assume we have a counterpart
 `perf.tick('e_label')`.
 
-| Name                                 | id             | Description                                                                                                                                                                                        |
-| ------------------------------------ | -------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| Install Styles                       | `is`           | Set when the styles are installed.                                                                                                                                                                 |
-| End Install Styles                   | `e_is`         | Set when the styles are done installing.                                                                                                                                                           |
-| Window load event                    | `ol`           | Window load event fired.                                                                                                                                                                           |
-| First viewport ready                 | `pc`           | Fires when non-ad resources above the fold fired their load event measured from the time the user clicks (So takes pre-rendering into account)                                                     |
-| Make Body Visible                    | `mbv`          | Make Body Visible Executes.                                                                                                                                                                        |
-| On First Visible                     | `ofv`          | The first time the page has been turned visible.                                                                                                                                                   |
-| First paint time                     | `fp`           | The time on the first non-blank paint of the page.                                                                                                                                                 |
-| First contentful paint time          | `fcp`          | First paint with content. See https://github.com/WICG/paint-timing                                                                                                                                 |
-| First input delay                    | `fid`          | Millisecond delay in handling the first user input on the page. See https://github.com/WICG/event-timing                                                                                           |
-| First input delay, polyfill value    | `fid-polyfill` | Millisecond delay in handling the first user input on the page, reported by [a polyfill](https://github.com/GoogleChromeLabs/first-input-delay)                                                    |
-| Layout Jank, first exit              | `lj`           | The aggregate jank score when the user leaves the page (navigation, tab switching, dismissing application) for the first time. See https://gist.github.com/skobes/2f296da1b0a88cc785a4bf10a42bca07 |
-| Layout Jank, second exit             | `lj-2`         | The aggregate jank score when the user leaves the page (navigation, tab switching, dismissing application) for the second time.                                                                    |
-| Cumulative Layout Shift, first exit  | `cls`          | The aggregate layout shift score when the user leaves the page (navigation, tab switching, dismissing application) for the first time. See https://web.dev/layout-instability-api                  |
-| Cumulative Layout Shift, second exit | `cls-2`        | The aggregate layout shift score when the user leaves the page (navigation, tab switching, dismissing application) for the second time.                                                            |
+| Name                                  | id             | Description                                                                                                                                                                                        |
+| ------------------------------------- | -------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Install Styles                        | `is`           | Set when the styles are installed.                                                                                                                                                                 |
+| End Install Styles                    | `e_is`         | Set when the styles are done installing.                                                                                                                                                           |
+| Window load event                     | `ol`           | Window load event fired.                                                                                                                                                                           |
+| First viewport ready                  | `pc`           | Fires when non-ad resources above the fold fired their load event measured from the time the user clicks (So takes pre-rendering into account)                                                     |
+| Make Body Visible                     | `mbv`          | Make Body Visible Executes.                                                                                                                                                                        |
+| On First Visible                      | `ofv`          | The first time the page has been turned visible.                                                                                                                                                   |
+| First paint time                      | `fp`           | The time on the first non-blank paint of the page.                                                                                                                                                 |
+| First contentful paint time           | `fcp`          | First paint with content. See https://github.com/WICG/paint-timing                                                                                                                                 |
+| First input delay                     | `fid`          | Millisecond delay in handling the first user input on the page. See https://github.com/WICG/event-timing                                                                                           |
+| First input delay, polyfill value     | `fid-polyfill` | Millisecond delay in handling the first user input on the page, reported by [a polyfill](https://github.com/GoogleChromeLabs/first-input-delay)                                                    |
+| Layout Jank, first exit               | `lj`           | The aggregate jank score when the user leaves the page (navigation, tab switching, dismissing application) for the first time. See https://gist.github.com/skobes/2f296da1b0a88cc785a4bf10a42bca07 |
+| Layout Jank, second exit              | `lj-2`         | The aggregate jank score when the user leaves the page (navigation, tab switching, dismissing application) for the second time.                                                                    |
+| Cumulative Layout Shift, first exit   | `cls`          | The aggregate layout shift score when the user leaves the page (navigation, tab switching, dismissing application) for the first time. See https://web.dev/layout-instability-api                  |
+| Cumulative Layout Shift, second exit  | `cls-2`        | The aggregate layout shift score when the user leaves the page (navigation, tab switching, dismissing application) for the second time.                                                            |
+| Largest Contentful Paint, load time   | `lcpl`         | The time in milliseconds for the first contentful element to display. This is the load time version of this metric. See https://github.com/WICG/largest-contentful-paint                           |
+| Largest Contentful Paint, render time | `lcpr`         | The time in milliseconds for the first contentful element to display. This is the render time version of this metric. https://github.com/WICG/largest-contentful-paint                             |
diff --git a/extensions/amp-vimeo/0.1/amp-vimeo.js b/extensions/amp-vimeo/0.1/amp-vimeo.js
index 7f47d952e062e..957cd016a6fe7 100644
--- a/extensions/amp-vimeo/0.1/amp-vimeo.js
+++ b/extensions/amp-vimeo/0.1/amp-vimeo.js
@@ -99,12 +99,13 @@ class AmpVimeo extends AMP.BaseElement {
 
   /** @override */
   preconnectCallback(onLayout = false) {
-    const {preconnect} = this;
-    preconnect.url('https://player.vimeo.com', onLayout);
+    const preconnect = Services.preconnectFor(this.win);
+    const ampdoc = this.getAmpDoc();
+    preconnect.url(ampdoc, 'https://player.vimeo.com', onLayout);
     // Host that Vimeo uses to serve poster frames needed by player.
-    preconnect.url('https://i.vimeocdn.com', onLayout);
+    preconnect.url(ampdoc, 'https://i.vimeocdn.com', onLayout);
     // Host that Vimeo uses to serve JS, CSS and other assets needed.
-    preconnect.url('https://f.vimeocdn.com', onLayout);
+    preconnect.url(ampdoc, 'https://f.vimeocdn.com', onLayout);
   }
 
   /** @override */
diff --git a/extensions/amp-vine/0.1/amp-vine.js b/extensions/amp-vine/0.1/amp-vine.js
index ea8c374d0ecab..4c11f727748a2 100644
--- a/extensions/amp-vine/0.1/amp-vine.js
+++ b/extensions/amp-vine/0.1/amp-vine.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {userAssert} from '../../../src/log';
 
@@ -31,9 +32,17 @@ class AmpVine extends AMP.BaseElement {
    */
   preconnectCallback(onLayout) {
     // the Vine iframe
-    this.preconnect.url('https://vine.co', onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://vine.co',
+      onLayout
+    );
     // Vine assets loaded in the iframe
-    this.preconnect.url('https://v.cdn.vine.co', onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://v.cdn.vine.co',
+      onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-viqeo-player/0.1/amp-viqeo-player.js b/extensions/amp-viqeo-player/0.1/amp-viqeo-player.js
index da7d429b6e290..81013d5ece8e9 100644
--- a/extensions/amp-viqeo-player/0.1/amp-viqeo-player.js
+++ b/extensions/amp-viqeo-player/0.1/amp-viqeo-player.js
@@ -19,6 +19,8 @@ import {Deferred} from '../../../src/utils/promise';
 import {Layout, isLayoutSizeDefined} from '../../../src/layout';
 import {Services} from '../../../src/services';
 import {VideoAttributes, VideoEvents} from '../../../src/video-interface';
+import {redispatch} from '../../../src/iframe-video';
+import {startsWith} from '../../../src/string';
 
 import {dev, userAssert} from '../../../src/log';
 import {
@@ -33,6 +35,17 @@ import {installVideoManagerForDoc} from '../../../src/service/video-manager-impl
 
 const TAG = 'amp-viqeo-player';
 
+const EVENTS = {
+  'ready': VideoEvents.LOAD,
+  'play': VideoEvents.PLAYING,
+  'pause': VideoEvents.PAUSE,
+  'mute': VideoEvents.MUTED,
+  'unmute': VideoEvents.UNMUTED,
+  'end': VideoEvents.ENDED,
+  'startAdvert': VideoEvents.AD_START,
+  'endAdvert': VideoEvents.AD_END,
+};
+
 /**
  * @implements {../../../src/video-interface.VideoInterface}
  */
@@ -50,20 +63,17 @@ class AmpViqeoPlayer extends AMP.BaseElement {
     /** @private {?Function} */
     this.playerReadyResolver_ = null;
 
-    /** @private {?number} */
-    this.volume_ = null;
-
     /** @private {?Function} */
     this.unlistenMessage_ = null;
 
-    /** @private {?Object} */
-    this.viqeoPlayer_ = null;
-
     /** @private {boolean} */
     this.hasAutoplay_ = false;
 
     /** @private {string} */
     this.videoId_ = '';
+
+    /** @private {Object<string, (number|Array)>} */
+    this.meta_ = {};
   }
 
   /**
@@ -71,8 +81,16 @@ class AmpViqeoPlayer extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://api.viqeo.tv', opt_onLayout);
-    this.preconnect.url('https://cdn.viqeo.tv', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://api.viqeo.tv',
+      opt_onLayout
+    );
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://cdn.viqeo.tv',
+      opt_onLayout
+    );
   }
 
   /**
@@ -106,6 +124,7 @@ class AmpViqeoPlayer extends AMP.BaseElement {
 
     installVideoManagerForDoc(this.element);
     Services.videoManagerForDoc(this.element).register(this);
+    this.playerReadyResolver_(this.iframe_);
   }
 
   /** @override */
@@ -154,26 +173,16 @@ class AmpViqeoPlayer extends AMP.BaseElement {
     ) {
       return;
     }
-
     const action = eventData['action'];
-    if (action === 'ready') {
-      this.element.dispatchCustomEvent(VideoEvents.LOAD);
-      this.playerReadyResolver_(this.iframe_);
-    } else if (action === 'play') {
-      this.element.dispatchCustomEvent(VideoEvents.PLAYING);
-    } else if (action === 'pause') {
-      this.element.dispatchCustomEvent(VideoEvents.PAUSE);
-    } else if (action === 'mute') {
-      this.element.dispatchCustomEvent(VideoEvents.MUTED);
-    } else if (action === 'unmute') {
-      this.element.dispatchCustomEvent(VideoEvents.UNMUTED);
-    } else if (action === 'volume') {
-      this.volume_ = parseFloat(eventData['value']);
-      if (this.volume_ === 0) {
-        this.element.dispatchCustomEvent(VideoEvents.MUTED);
-      } else {
-        this.element.dispatchCustomEvent(VideoEvents.UNMUTED);
-      }
+    if (redispatch(this.element, action, EVENTS)) {
+      return;
+    }
+    if (startsWith(action, 'update')) {
+      const key = action.replace(
+        /^update([A-Z])(.*)$/,
+        (_, c, rest) => c.toLowerCase() + rest
+      );
+      this.meta_[key] = eventData['value'];
     }
   }
 
@@ -301,24 +310,19 @@ class AmpViqeoPlayer extends AMP.BaseElement {
 
   /** @override */
   getCurrentTime() {
-    if (!this.viqeoPlayer_) {
-      return 0;
-    }
-    return this.viqeoPlayer_.getCurrentTime();
+    return /** @type {number} */ (this.meta_['currentTime'] || 0);
   }
 
   /** @override */
   getDuration() {
-    if (!this.viqeoPlayer_) {
-      return 1;
-    }
-    return this.viqeoPlayer_.getDuration();
+    return /** @type {number} */ (this.meta_['duration'] || 1);
   }
 
   /** @override */
   getPlayedRanges() {
-    // Not supported.
-    return [];
+    return (
+      /** @type {!Array<!Array<number>>} */ (this.meta_['playedRanges'] || [])
+    );
   }
 
   /**
diff --git a/extensions/amp-viqeo-player/0.1/test/test-amp-viqeo-player.js b/extensions/amp-viqeo-player/0.1/test/test-amp-viqeo-player.js
index f368800350fb0..999df8cfc4938 100644
--- a/extensions/amp-viqeo-player/0.1/test/test-amp-viqeo-player.js
+++ b/extensions/amp-viqeo-player/0.1/test/test-amp-viqeo-player.js
@@ -14,8 +14,9 @@
  * limitations under the License.
  */
 
-import {PlayingStates} from '../../../../src/video-interface';
+import {PlayingStates, VideoEvents} from '../../../../src/video-interface';
 import {Services} from '../../../../src/services';
+import {listenOncePromise} from '../../../../src/event-helper';
 import AmpViqeoPlayer from '../amp-viqeo-player';
 
 describes.realWin(
@@ -35,6 +36,13 @@ describes.realWin(
       doc = win.document;
     });
 
+    function fakePostMessage(viqeoElement, info) {
+      viqeoElement.implementation_.handleViqeoMessages_({
+        source: viqeoElement.querySelector('iframe').contentWindow,
+        data: {source: 'ViqeoPlayer', ...info},
+      });
+    }
+
     it.skip('test-get-data', () => {
       return getViqeo().then(p => {
         const {viqeoElement, entry, viqeo} = p;
@@ -120,25 +128,62 @@ describes.realWin(
       });
     });
 
+    it('should forward events', () => {
+      return getViqeo().then(({viqeoElement}) => {
+        return Promise.resolve()
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.LOAD);
+            fakePostMessage(viqeoElement, {action: 'ready'});
+            return p;
+          })
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.PLAYING);
+            fakePostMessage(viqeoElement, {action: 'play'});
+            return p;
+          })
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.PAUSE);
+            fakePostMessage(viqeoElement, {action: 'pause'});
+            return p;
+          })
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.MUTED);
+            fakePostMessage(viqeoElement, {action: 'mute'});
+            return p;
+          })
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.UNMUTED);
+            fakePostMessage(viqeoElement, {action: 'unmute'});
+            return p;
+          })
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.ENDED);
+            fakePostMessage(viqeoElement, {action: 'end'});
+            return p;
+          })
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.AD_START);
+            fakePostMessage(viqeoElement, {action: 'startAdvert'});
+            return p;
+          })
+          .then(() => {
+            const p = listenOncePromise(viqeoElement, VideoEvents.AD_END);
+            fakePostMessage(viqeoElement, {action: 'endAdvert'});
+            return p;
+          });
+      });
+    });
+
     function getViqeo(params) {
-      const {
-        id,
-        viqeoProfileId,
-        viqeoId,
-        width,
-        height,
-        opt_params,
-      } = Object.assign(
-        {
-          id: 'myVideo',
-          viqeoProfileId: 184,
-          viqeoId: '922d04f30b66f1a32eb2',
-          width: 320,
-          height: 180,
-          opt_params: {},
-        },
-        params
-      );
+      const {id, viqeoProfileId, viqeoId, width, height, opt_params} = {
+        id: 'myVideo',
+        viqeoProfileId: 184,
+        viqeoId: '922d04f30b66f1a32eb2',
+        width: 320,
+        height: 180,
+        opt_params: {},
+        ...params,
+      };
 
       const viqeoElement = doc.createElement('amp-viqeo-player');
 
@@ -159,9 +204,7 @@ describes.realWin(
       doc.body.appendChild(viqeoElement);
       return viqeoElement
         .build()
-        .then(() => {
-          viqeoElement.layoutCallback.bind(viqeoElement);
-        })
+        .then(() => viqeoElement.layoutCallback())
         .then(() => {
           const videoManager = Services.videoManagerForDoc(doc);
           const entry = videoManager.getEntryForElement_(viqeoElement);
diff --git a/extensions/amp-vk/0.1/amp-vk.js b/extensions/amp-vk/0.1/amp-vk.js
index 3d48e8eb54db8..99b0902353762 100644
--- a/extensions/amp-vk/0.1/amp-vk.js
+++ b/extensions/amp-vk/0.1/amp-vk.js
@@ -68,7 +68,11 @@ export class AmpVk extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://vk.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://vk.com',
+      opt_onLayout
+    );
   }
 
   /**
diff --git a/extensions/amp-vk/0.1/test/test-amp-vk.js b/extensions/amp-vk/0.1/test/test-amp-vk.js
index a2b1ff8d223f1..6ac73142dd6cb 100644
--- a/extensions/amp-vk/0.1/test/test-amp-vk.js
+++ b/extensions/amp-vk/0.1/test/test-amp-vk.js
@@ -70,7 +70,7 @@ describes.realWin(
     }
 
     it('requires data-embedtype', () => {
-      const params = Object.assign({}, POST_PARAMS);
+      const params = {...POST_PARAMS};
       delete params['embedtype'];
       return allowConsoleError(() => {
         return createAmpVkElement(params).should.eventually.be.rejectedWith(
@@ -93,7 +93,7 @@ describes.realWin(
     // Post tests
 
     it('post::requires data-hash', () => {
-      const params = Object.assign({}, POST_PARAMS);
+      const params = {...POST_PARAMS};
       delete params['hash'];
       return allowConsoleError(() => {
         return createAmpVkElement(params).should.eventually.be.rejectedWith(
@@ -103,7 +103,7 @@ describes.realWin(
     });
 
     it('post::requires data-owner-id', () => {
-      const params = Object.assign({}, POST_PARAMS);
+      const params = {...POST_PARAMS};
       delete params['owner-id'];
       return allowConsoleError(() => {
         return createAmpVkElement(params).should.eventually.be.rejectedWith(
@@ -113,7 +113,7 @@ describes.realWin(
     });
 
     it('post::requires data-post-id', () => {
-      const params = Object.assign({}, POST_PARAMS);
+      const params = {...POST_PARAMS};
       delete params['post-id'];
       return allowConsoleError(() => {
         return createAmpVkElement(params).should.eventually.be.rejectedWith(
@@ -144,7 +144,7 @@ describes.realWin(
         vkPost.ownerDocument.location.href.replace(/#.*$/, '')
       );
       impl.onLayoutMeasure();
-      const startWidth = impl.getLayoutWidth();
+      const startWidth = vkPost.getLayoutWidth();
       const correctIFrameSrc = `https://vk.com/widget_post.php?app=0&width=100%25&_ver=1&owner_id=1&post_id=45616&hash=Yc8_Z9pnpg8aKMZbVcD-jK45eAk&amp=1&startWidth=${startWidth}&url=${url}&referrer=${referrer}&title=AMP%20Post`;
       expect(iframe).to.not.be.null;
       const timeArgPosition = iframe.src.lastIndexOf('&');
@@ -155,7 +155,7 @@ describes.realWin(
     // Poll tests
 
     it('poll::requires data-api-id', () => {
-      const params = Object.assign({}, POLL_PARAMS);
+      const params = {...POLL_PARAMS};
       delete params['api-id'];
       return allowConsoleError(() => {
         return createAmpVkElement(params).should.eventually.be.rejectedWith(
@@ -165,7 +165,7 @@ describes.realWin(
     });
 
     it('poll::requires data-poll-id', () => {
-      const params = Object.assign({}, POLL_PARAMS);
+      const params = {...POLL_PARAMS};
       delete params['poll-id'];
       return allowConsoleError(() => {
         return createAmpVkElement(params).should.eventually.be.rejectedWith(
diff --git a/extensions/amp-wistia-player/0.1/amp-wistia-player.js b/extensions/amp-wistia-player/0.1/amp-wistia-player.js
index 2f0335aa0751b..c385f26612cad 100644
--- a/extensions/amp-wistia-player/0.1/amp-wistia-player.js
+++ b/extensions/amp-wistia-player/0.1/amp-wistia-player.js
@@ -64,7 +64,11 @@ class AmpWistiaPlayer extends AMP.BaseElement {
    */
   preconnectCallback(onLayout) {
     // video player and video metadata
-    this.preconnect.url('https://fast.wistia.net', onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://fast.wistia.net',
+      onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-yotpo/0.1/amp-yotpo.js b/extensions/amp-yotpo/0.1/amp-yotpo.js
index 4b434c28536f7..69b0bba26d8f9 100644
--- a/extensions/amp-yotpo/0.1/amp-yotpo.js
+++ b/extensions/amp-yotpo/0.1/amp-yotpo.js
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import {Services} from '../../../src/services';
 import {getIframe} from '../../../src/3p-frame';
 import {isLayoutSizeDefined} from '../../../src/layout';
 import {listenFor} from '../../../src/iframe-helper';
@@ -37,7 +38,11 @@ export class AmpYotpo extends AMP.BaseElement {
    * @override
    */
   preconnectCallback(opt_onLayout) {
-    this.preconnect.url('https://staticw2.yotpo.com', opt_onLayout);
+    Services.preconnectFor(this.win).url(
+      this.getAmpDoc(),
+      'https://staticw2.yotpo.com',
+      opt_onLayout
+    );
   }
 
   /** @override */
diff --git a/extensions/amp-youtube/0.1/amp-youtube.js b/extensions/amp-youtube/0.1/amp-youtube.js
index eec374c88a2b7..d5abc93a6c827 100644
--- a/extensions/amp-youtube/0.1/amp-youtube.js
+++ b/extensions/amp-youtube/0.1/amp-youtube.js
@@ -118,12 +118,13 @@ class AmpYoutube extends AMP.BaseElement {
     // we can switch to preloading the full source. For now this doesn't
     // work, because we preload with a different type and in that case
     // responses are only picked up if they are cacheable.
-    const {preconnect} = this;
-    preconnect.url(this.getVideoIframeSrc_());
+    const preconnect = Services.preconnectFor(this.win);
+    const ampdoc = this.getAmpDoc();
+    preconnect.url(ampdoc, this.getVideoIframeSrc_());
     // Host that YT uses to serve JS needed by player.
-    preconnect.url('https://s.ytimg.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://s.ytimg.com', opt_onLayout);
     // Load high resolution placeholder images for videos in prerender mode.
-    preconnect.url('https://i.ytimg.com', opt_onLayout);
+    preconnect.url(ampdoc, 'https://i.ytimg.com', opt_onLayout);
   }
 
   /** @override */
diff --git a/extensions/amp-youtube/0.1/test/test-amp-youtube.js b/extensions/amp-youtube/0.1/test/test-amp-youtube.js
index 36b3b54be28d4..37d46ecad1fc6 100644
--- a/extensions/amp-youtube/0.1/test/test-amp-youtube.js
+++ b/extensions/amp-youtube/0.1/test/test-amp-youtube.js
@@ -162,12 +162,14 @@ describes.realWin(
           'data-param-playsinline': '0',
         });
         const {src} = yt.querySelector('iframe');
-        const preloadSpy = env.sandbox.spy(
-          yt.implementation_.preconnect,
-          'url'
-        );
+
+        const preconnect = Services.preconnectFor(win);
+        env.sandbox.spy(preconnect, 'url');
         yt.implementation_.preconnectCallback();
-        preloadSpy.should.have.been.calledWithExactly(src);
+        expect(preconnect.url).to.have.been.calledWith(
+          env.sandbox.match.object, // AmpDoc
+          src
+        );
       });
 
       it('should forward certain events from youtube to the amp element', async () => {
diff --git a/gulpfile.js b/gulpfile.js
index b5a039c96e484..4180c799fdebf 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -55,6 +55,7 @@ const {integration} = require('./build-system/tasks/integration');
 const {lint} = require('./build-system/tasks/lint');
 const {makeExtension} = require('./build-system/tasks/extension-generator');
 const {nailgunStart, nailgunStop} = require('./build-system/tasks/nailgun');
+const {performance} = require('./build-system/tasks/performance');
 const {prCheck} = require('./build-system/tasks/pr-check');
 const {prependGlobal} = require('./build-system/tasks/prepend-global');
 const {presubmit} = require('./build-system/tasks/presubmit-checks');
@@ -101,6 +102,7 @@ gulp.task('lint', lint);
 gulp.task('make-extension', makeExtension);
 gulp.task('nailgun-start', nailgunStart);
 gulp.task('nailgun-stop', nailgunStop);
+gulp.task('performance', performance);
 gulp.task('pr-check', prCheck);
 gulp.task('prepend-global', prependGlobal);
 gulp.task('presubmit', presubmit);
diff --git a/package.json b/package.json
index aa663fea9a13e..efa4bb9aa2ffc 100644
--- a/package.json
+++ b/package.json
@@ -4,10 +4,6 @@
   "version": "0.1.0",
   "description": "Fastish HTML",
   "main": "index.js",
-  "engines": {
-    "node": "^12.0.0",
-    "yarn": "^1.10.1"
-  },
   "author": "The AMP HTML Authors",
   "license": "Apache-2.0",
   "repository": {
@@ -19,10 +15,10 @@
   },
   "dependencies": {
     "@ampproject/animations": "0.2.0",
-    "@ampproject/worker-dom": "0.21.0",
+    "@ampproject/worker-dom": "0.23.2",
     "dompurify": "2.0.7",
     "moment": "2.24.0",
-    "preact": "10.0.5",
+    "preact": "10.2.1",
     "promise-pjs": "1.1.4",
     "prop-types": "15.7.2",
     "react-dates": "15.5.3",
@@ -30,27 +26,26 @@
     "web-animations-js": "2.3.1"
   },
   "devDependencies": {
-    "@babel/core": "7.7.2",
-    "@babel/helper-plugin-test-runner": "7.1.0",
-    "@babel/plugin-proposal-class-properties": "7.7.0",
-    "@babel/preset-env": "7.7.1",
+    "@babel/core": "7.8.3",
+    "@babel/helper-plugin-test-runner": "7.8.3",
+    "@babel/plugin-proposal-class-properties": "7.8.3",
+    "@babel/preset-env": "7.8.3",
     "@jridgewell/resorcery": "0.0.3",
     "acorn-globals": "4.3.4",
     "amphtml-validator": "1.0.29",
     "ansi-colors": "4.1.1",
     "ast-replace": "1.1.3",
     "atob": "2.1.2",
-    "autoprefixer": "9.7.2",
+    "autoprefixer": "9.7.4",
     "babel-eslint": "10.0.3",
     "babel-plugin-filter-imports": "4.0.0",
-    "babel-plugin-istanbul": "5.2.0",
+    "babel-plugin-istanbul": "6.0.0",
     "babel-plugin-minify-replace": "0.5.0",
     "babel-plugin-transform-es2015-modules-commonjs": "6.26.2",
     "babel-preset-modules": "0.0.2",
     "babelify": "10.0.0",
     "baconipsum": "0.1.2",
     "base62": "2.0.1",
-    "bluebird": "3.7.1",
     "body-parser": "1.19.0",
     "brotli-size": "4.0.0",
     "browserify": "16.5.0",
@@ -58,7 +53,7 @@
     "chai-as-promised": "7.1.1",
     "cli-highlight": "2.1.4",
     "codecov": "3.6.1",
-    "commander": "4.0.1",
+    "commander": "4.1.0",
     "connect-header": "0.0.5",
     "cssnano": "4.1.10",
     "del": "5.1.0",
@@ -66,45 +61,46 @@
     "dev-null": "0.1.1",
     "doctrine": "3.0.0",
     "envify": "4.1.0",
-    "escodegen": "1.12.0",
-    "eslint": "6.6.0",
-    "eslint-config-prettier": "6.7.0",
-    "eslint-plugin-chai-expect": "2.0.1",
-    "eslint-plugin-eslint-plugin": "2.1.0",
+    "escodegen": "1.13.0",
+    "eslint": "6.8.0",
+    "eslint-config-prettier": "6.10.0",
+    "eslint-plugin-chai-expect": "2.1.0",
+    "eslint-plugin-eslint-plugin": "2.2.1",
     "eslint-plugin-google-camelcase": "0.0.2",
     "eslint-plugin-jasmine": "4.1.0",
-    "eslint-plugin-jsdoc": "18.1.4",
+    "eslint-plugin-jsdoc": "20.4.0",
     "eslint-plugin-local": "1.0.0",
     "eslint-plugin-notice": "0.8.9",
-    "eslint-plugin-prettier": "3.1.1",
+    "eslint-plugin-prettier": "3.1.2",
     "eslint-plugin-sort-imports-es6-autofix": "0.5.0",
     "eslint-plugin-sort-requires": "2.1.0",
     "event-stream": "4.0.1",
     "express": "4.17.1",
     "fancy-log": "1.3.3",
-    "fetch-mock": "7.7.3",
+    "fetch-mock": "8.3.2",
     "find-imports": "1.1.0",
     "formidable": "1.2.1",
     "fs-extra": "8.1.0",
     "fuse.js": "3.4.6",
-    "globby": "10.0.1",
-    "google-closure-compiler": "20191111.0.0",
+    "globby": "11.0.0",
+    "google-closure-compiler": "20200112.0.0",
     "gulp": "4.0.2",
     "gulp-ava": "3.0.0",
     "gulp-connect": "5.7.0",
     "gulp-eslint": "6.0.0",
     "gulp-eslint-if-fixed": "1.0.0",
     "gulp-file": "0.4.0",
-    "gulp-git": "2.9.0",
+    "gulp-git": "2.10.0",
     "gulp-help": "chmontgomery/gulp-help#gulp4",
     "gulp-if": "3.0.0",
+    "gulp-istanbul": "1.1.3",
     "gulp-jest": "4.0.3",
     "gulp-jsonlint": "1.3.1",
     "gulp-jsonminify": "1.1.0",
     "gulp-nop": "0.0.3",
     "gulp-prettier": "2.3.0",
     "gulp-regexp-sourcemaps": "1.0.1",
-    "gulp-rename": "1.4.0",
+    "gulp-rename": "2.0.0",
     "gulp-sourcemaps": "2.6.5",
     "gulp-watch": "5.0.1",
     "gzip-size": "5.1.1",
@@ -113,7 +109,7 @@
     "jest-dot-reporter": "1.0.12",
     "jest-silent-reporter": "0.1.2",
     "jison": "0.4.18",
-    "jsdom": "15.2.1",
+    "jsdom": "16.0.1",
     "json-stable-stringify": "1.0.1",
     "json5": "2.1.1",
     "karma": "4.4.1",
@@ -122,7 +118,7 @@
     "karma-chrome-launcher": "3.1.0",
     "karma-coverage-istanbul-reporter": "2.1.1",
     "karma-edge-launcher": "0.4.2",
-    "karma-firefox-launcher": "1.2.0",
+    "karma-firefox-launcher": "1.3.0",
     "karma-fixture": "0.2.6",
     "karma-html2js-preprocessor": "1.1.0",
     "karma-ie-launcher": "1.0.0",
@@ -135,20 +131,21 @@
     "karma-source-map-support": "1.4.0",
     "karma-super-dots-reporter": "0.2.0",
     "lazypipe": "1.0.2",
-    "lolex": "5.1.1",
-    "magic-string": "0.25.4",
+    "lolex": "5.1.2",
+    "magic-string": "0.25.6",
     "markdown-link-check": "3.8.0",
     "minimatch": "3.0.4",
     "minimist": "1.2.0",
-    "mocha": "6.2.2",
+    "mocha": "7.0.1",
     "mocha-silent-reporter": "1.0.0",
     "morgan": "1.9.1",
     "multer": "1.4.2",
     "npm-exact-versions": "0.0.5",
     "opn": "5.5.0",
     "path": "0.12.7",
+    "pkg-up": "3.1.0",
     "plugin-error": "1.0.1",
-    "postcss": "7.0.23",
+    "postcss": "7.0.26",
     "postcss-import": "12.0.1",
     "prettier": "1.19.1",
     "pretty-bytes": "5.3.0",
@@ -158,22 +155,22 @@
     "react-dom": "16.12.0",
     "react-externs": "0.13.6",
     "react-with-direction": "1.3.1",
-    "regexp.escape": "1.0.2",
+    "regexp.escape": "1.1.0",
     "request": "2.88.0",
     "request-promise": "4.2.5",
     "require-hijack": "1.2.1",
     "rocambole": "0.7.0",
-    "sinon": "7.5.0",
-    "sinon-chai": "3.3.0",
+    "sinon": "8.1.1",
+    "sinon-chai": "3.4.0",
     "sleep-promise": "8.0.1",
     "tempy": "0.3.0",
-    "terser": "4.4.0",
+    "terser": "4.6.3",
     "text-table": "0.2.0",
     "through2": "3.0.1",
     "topological-sort": "0.3.0",
     "traverse": "0.6.6",
-    "tsickle": "0.37.1",
-    "typescript": "3.7.2",
+    "tsickle": "0.38.0",
+    "typescript": "3.7.5",
     "uglifyify": "5.0.2",
     "vinyl-buffer": "1.0.1",
     "vinyl-source-stream": "2.0.0",
diff --git a/spec/amp-3p-video.md b/spec/amp-3p-video.md
new file mode 100644
index 0000000000000..411288a7f6d18
--- /dev/null
+++ b/spec/amp-3p-video.md
@@ -0,0 +1,83 @@
+# Vendor-specific (3p) video player components
+
+The generic [`amp-video`](https://go.amp.dev/c/amp-video) component plays videos directly on a page, much like a `<video>` tag.
+
+Unfortunately, not all videos can be embedded this way. For these specialized cases, AMP provides vendor-optimized components like [`amp-youtube`](https://go.amp.dev/c/amp-youtube), [`amp-ima-video`](https://go.amp.dev/c/amp-ima-video), and [others](./amp-video-interface.md).
+Internally these players load an iframe whose page communicates with the outer document to coordinate playback.
+
+We would prefer to not have additional custom video implementations. Instead we believe, [`amp-video-iframe`](https://go.amp.dev/c/amp-video-iframe) should be used instead, since it is a generic component that can load any video document to coordinate playback.
+
+## I want to contribute my vendor-specific player
+
+You probaby do **_not_** need to build your own player.
+
+The `amp-video-iframe` playback interface supports the following methods, which we believe cover the vast majority of cases AMP documents necessitate:
+
+- `play`
+- `pause`
+- `mute`
+- `unmute`
+- `showcontrols`
+- `hidecontrols`
+- `fullscreenenter`
+- `fullscreenexit`
+
+`amp-video-iframe` can also [send custom namespaced analytics signals](<https://amp.dev/documentation/components/amp-video-iframe/#postanalyticsevent(eventtype[,-vars])>).
+
+(If there is a feature missing from this list that a custom player requires, we are happy to work on extending it as necessary.)
+
+If this is enough for your use case, you'd only need to build a playback document hosted on your server that's able to communicate with `amp-video-iframe`.
+For guidance on accomplishing this, [refer to the component documentation.](https://go.amp.dev/c/amp-video-iframe)
+
+If you _cannot_ support these playback methods, it's likely that a simple [`amp-iframe`](https://go.amp.dev/c/amp-iframe)
+can embed a separate video document just fine.
+
+### When _should_ I build a vendor-specific player?
+
+If the API you require for communication includes methods that are **_not_** part of the `amp-video-iframe` playback interface, you might want to build your own player. (Please note that most custom analytics signals are not considered in this case,
+since `amp-video-iframe` [also has plumbing for that.](<https://amp.dev/documentation/components/amp-video-iframe/#postanalyticsevent(eventtype[,-vars])>))
+
+For example, these are some of the features that justify specific players:
+
+- **`amp-youtube`** loads initial-frame placeholder images based on a URL scheme for perceived performance.
+  Its underlying implementation also loads with lower-than-default priority, since it's rather large in binary size.
+
+- **`amp-ima-video`** embeds a generic host-less page that ships with the IMA SDK in order to transparently include standard IMA interface videos.
+
+(Please note that most other 3p players historically exist before `amp-video-iframe` could fulfill their use case.)
+
+## How can I build a player component?
+
+### Understand the contribution process
+
+You'll need to go through [the standard AMP contribution process](../CONTRIBUTING.md) when creating and submitting your component. For large features, such as a video player, you need to file an [I2I (intent-to-implement) issue](https://github.com/ampproject/amphtml/issues/new?assignees=&labels=INTENT+TO+IMPLEMENT&template=intent-to-implement--i2i-.md&title=I2I:%20%3Cyour%20change/update%3E) that describes the overall workings of your component.
+
+Your player component is also shipped as an extension, so you should [become familiar with the process of building one.](https://github.com/ampproject/amphtml/blob/master/contributing/building-an-amp-extension.md)
+
+### Write your implementation
+
+#### The `VideoManager`
+
+Every player component talks to a single [`VideoManager`](../src/service/video-manager-impl.js) via standard methods (`VideoInterface`) and events (`VideoEvents`) defined in the [AMP video interface](../src/video-interface.js).
+
+This manager performs standard responsibilities for all videos, regardless of type:
+
+- accessible, managed autoplay
+- analytics tracking for playback
+- coordination with [`amp-story`](https://go.amp.dev/c/amp-story)
+- [docked video](https://amp.dev/documentation/components/amp-video-docking/)
+- rotate-to-fullscreen
+
+#### Interface support
+
+Component classes should implement the [`VideoInterface`](../src/video-interface.js).
+You can implement this interface entirely or partially, depending on [the video integration features you'd like to support](./amp-video-interface.md).
+
+At the very least, you should implement `play()` and `pause()`. Likewise, playback
+[actions](https://amp.dev/documentation/guides-and-tutorials/learn/amp-actions-and-events/) (like `my-element.play`) will not work when unimplemented.
+
+Read through [the `VideoInterface` code to understand the individual effects of leaving each method unimplemented.](../src/video-interface.js)
+
+#### Reference
+
+Existing implementations for [`amp-youtube.js`](../extensions/amp-youtube/0.1/amp-youtube.js) and [`amp-video-iframe.js`](../extensions/amp-video-iframe/0.1/amp-video-iframe.js) are good starter examples for implementation details. They use several standard utilities for creating the video frame and communicating with the `VideoManager`.
diff --git a/spec/amp-actions-and-events.md b/spec/amp-actions-and-events.md
index f010a34d98756..402cd30d924fd 100644
--- a/spec/amp-actions-and-events.md
+++ b/spec/amp-actions-and-events.md
@@ -471,6 +471,19 @@ event.response</pre></td>
   </tr>
 </table>
 
+### amp-lightbox-gallery <a name="amp-lightbox-gallery"></a>
+
+<table>
+  <tr>
+    <th>Action</th>
+    <th>Description</th>
+  </tr>
+  <tr>
+    <td><code>open</code></td>
+    <td>Opens the lightbox-gallery. Can be triggered by tapping another element, if you specify the image id: `on="tap:amp-lightbox-gallery.open(id='image-id')"`.</td>
+  </tr>
+</table>
+
 ### amp-list
 
 <table>
diff --git a/spec/amp-cors-requests.md b/spec/amp-cors-requests.md
index 24894c7e16001..5b9e757aaaf19 100644
--- a/spec/amp-cors-requests.md
+++ b/spec/amp-cors-requests.md
@@ -402,7 +402,7 @@ As an example, if you wanted to load /some/font.ttf in `https://example.com/amp.
   </noscript>
 </amp-img>
 
-[tip type="note]
+[tip type="note"]
 If your font file is okay to be accessible from any origin, you can respond with a wild card `Access-Control-Allow-Origin`, AMP cache will also echo that value meaning it will be responding with `Access-Control-Allow-Origin: *`. If you already have this setting, there is no need in changing anything.
 [/tip]
 
diff --git a/spec/amp-html-format.md b/spec/amp-html-format.md
index b3e2a80c3f050..3471f0b808ddc 100644
--- a/spec/amp-html-format.md
+++ b/spec/amp-html-format.md
@@ -308,11 +308,11 @@ All other authored class names are allowed in AMP HTML markup.
 
 ### IDs
 
-Internal AMP IDs prefixed with `-amp-` and `i-amp-` are disallowed in AMP HTML.
+Certain ID names are disallowed in AMP HTML, such as IDs prefixed with `-amp-` and `i-amp-` that may conflict with internal AMP IDs.
 
-Consult AMP documentation for specific extensions before using `amp-` and `AMP` IDs to avoid conflict with the features provided by these extensions, such as `amp-access`.
+Consult the AMP documentation for specific extensions before using `amp-` and `AMP` IDs to avoid conflict with the features provided by these extensions, such as `amp-access`.
 
-All other authored IDs are allowed in AMP HTML markup.
+View the full list of disallowed ID names by searching for `mandatory-id-attr` [here](../validator/validator-main.protoascii).
 
 ### Links
 
diff --git a/spec/amp-versioning-policy.md b/spec/amp-versioning-policy.md
index eabbeb6e91c28..8fff261f2ea5b 100644
--- a/spec/amp-versioning-policy.md
+++ b/spec/amp-versioning-policy.md
@@ -64,6 +64,8 @@ The process for deprecations is similar to the [process for significant changes]
 - Give developers at least 6 weeks after your deprecation warning is in production to apply changes before removing the feature.
 - If you did not include removal in your I2D, file a separate Intent-to-Remove (I2R) when you are ready to remove the deprecated feature.
 
+If an underlying backend service has itself been turned down, then the given component or integration may be neutered immediately without breaking the validation.
+
 ### Version deprecations
 
 Old versions of the AMP JS library and extensions may eventually be declared invalid by the AMP Validator. Such changes are breaking and must follow the deprecations process above. Additional rules also constrain the timelines of version deprecations:
diff --git a/spec/email/amp-email-components.md b/spec/email/amp-email-components.md
index c0e026f11eb8f..efb796107dd5b 100644
--- a/spec/email/amp-email-components.md
+++ b/spec/email/amp-email-components.md
@@ -24,14 +24,14 @@ The following is the list of [AMP components](https://amp.dev/documentation/comp
 
 ## Dynamic Content
 
-| Element                                                                                                                                                                         | Description                                                                                                                                                                                                                                                                                                                        |
-| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| [`<amp-form>`](https://amp.dev/documentation/components/amp-form)                                                                                                               | Form element. The action-xhr attribute must be used in place of the regular action attribute. Can be used in conjunction with `<template type="amp-mustache">` to render a response.                                                                                                                                               |
-| [`<amp-selector>`](https://amp.dev/documentation/components/amp-selector)                                                                                                       | A multi-select widget for use within a form.                                                                                                                                                                                                                                                                                       |
-| [`amp-bind`](https://amp.dev/documentation/components/amp-bind) and [`<amp-bind-macro>`](https://amp.dev/documentation/components/amp-bind#defining-macros-with-amp-bind-macro) | Simple scripting language in AMP that allows the manipulation of a state machine for interactions between elements. Can also be used to add behavior on certain events.<br><br>**Note:** It is prohibited to bind to `[href]` or `[src]`. It is also prohibited to use the `AMP.print`, `AMP.navigateTo` and `AMP.goBack` actions. |
-| [`<amp-state>`](https://amp.dev/documentation/components/amp-bind#%3Camp-state%3E-specification)                                                                                | `<amp-state>` is used to define the initial state used by `amp-bind`.<br><br>**Note:** The `src` attribute is not currently supported.                                                                                                                                                                                             |
-| [`<amp-list>`](https://amp.dev/documentation/components/amp-list)                                                                                                               | Remotely fetches JSON data that will be rendered by an [`<amp-mustache>`](https://amp.dev/documentation/components/amp-mustache).<br><br>**Note:** Binding to the `[src]` attribute is not allowed. Including user credentials with `credentials="include"` is also prohibited.                                                    |
-| [`<template type="amp-mustache">`](https://amp.dev/documentation/components/amp-mustache)                                                                                       | A Mustache template markup to render the results of an `amp-list` call.                                                                                                                                                                                                                                                            |
+| Element                                                                                                                                                                         | Description                                                                                                                                                                                                                                                                                                                              |
+| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| [`<amp-form>`](https://amp.dev/documentation/components/amp-form)                                                                                                               | Form element. The action-xhr attribute must be used in place of the regular action attribute. Can be used in conjunction with `<template type="amp-mustache">` to render a response. <br><br>**Note:** [Redirecting after submission](https://amp.dev/documentation/components/amp-form/#redirecting-after-a-submission) is not allowed. |
+| [`<amp-selector>`](https://amp.dev/documentation/components/amp-selector)                                                                                                       | A multi-select widget for use within a form.                                                                                                                                                                                                                                                                                             |
+| [`amp-bind`](https://amp.dev/documentation/components/amp-bind) and [`<amp-bind-macro>`](https://amp.dev/documentation/components/amp-bind#defining-macros-with-amp-bind-macro) | Simple scripting language in AMP that allows the manipulation of a state machine for interactions between elements. Can also be used to add behavior on certain events.<br><br>**Note:** It is prohibited to bind to `[href]` or `[src]`. It is also prohibited to use the `AMP.print`, `AMP.navigateTo` and `AMP.goBack` actions.       |
+| [`<amp-state>`](https://amp.dev/documentation/components/amp-bind#%3Camp-state%3E-specification)                                                                                | `<amp-state>` is used to define the initial state used by `amp-bind`.<br><br>**Note:** The `src` attribute is not currently supported.                                                                                                                                                                                                   |
+| [`<amp-list>`](https://amp.dev/documentation/components/amp-list)                                                                                                               | Remotely fetches JSON data that will be rendered by an [`<amp-mustache>`](https://amp.dev/documentation/components/amp-mustache).<br><br>**Note:** Binding to the `[src]` attribute is not allowed. Including user credentials with `credentials="include"` is also prohibited.                                                          |
+| [`<template type="amp-mustache">`](https://amp.dev/documentation/components/amp-mustache)                                                                                       | A Mustache template markup to render the results of an `amp-list` call.                                                                                                                                                                                                                                                                  |
 
 ## Layout
 
diff --git a/spec/email/amp-email-format.md b/spec/email/amp-email-format.md
index d9780cfba81cb..84ad45387d24d 100644
--- a/spec/email/amp-email-format.md
+++ b/spec/email/amp-email-format.md
@@ -130,6 +130,8 @@ The following AMP-specific analytic techniques are not supported:
 Requests for images inside [`<amp-carousel>`](https://amp.dev/documentation/components/amp-carousel) or [`<amp-accordion>`](https://amp.dev/documentation/components/amp-accordion)
 can indicate to the sender that the user is interacting with the message.
 
+Redirects in [`<amp-form>`](https://amp.dev/documentation/components/amp-form) are disallowed at runtime.
+
 ## Feedback & Support
 
 For support and feedback on AMP for Email, please use the following channel: [ongoing-participation](https://github.com/ampproject/amphtml/blob/master/CONTRIBUTING.md#ongoing-participation)
diff --git a/spec/email/amp-email-structure.md b/spec/email/amp-email-structure.md
index e24d68eb9a5ea..36300d5806ec1 100644
--- a/spec/email/amp-email-structure.md
+++ b/spec/email/amp-email-structure.md
@@ -80,10 +80,10 @@ Content-Type: text/x-amp-html; charset="UTF-8"
 Hello World in AMP!
 </body>
 </html>
---001a114634ac3555ae05525685ae--
+--001a114634ac3555ae05525685ae
 Content-Type: text/html; charset="UTF-8"
 
 <span>Hello World in HTML!</span>
---001a114634ac3555ae05525685ae
+--001a114634ac3555ae05525685ae--
 ```
 <!-- prettier-ignore-end -->
diff --git a/src/3p-frame.js b/src/3p-frame.js
index 44916ebbd1d8e..0110022eacfa5 100644
--- a/src/3p-frame.js
+++ b/src/3p-frame.js
@@ -191,19 +191,20 @@ export function addDataAndJsonAttributes_(element, attributes) {
 /**
  * Preloads URLs related to the bootstrap iframe.
  * @param {!Window} win
- * @param {!./preconnect.Preconnect} preconnect
+ * @param {!./service/ampdoc-impl.AmpDoc} ampdoc
+ * @param {!./preconnect.PreconnectService} preconnect
  * @param {boolean=} opt_disallowCustom whether 3p url should not use meta tag.
  */
-export function preloadBootstrap(win, preconnect, opt_disallowCustom) {
+export function preloadBootstrap(win, ampdoc, preconnect, opt_disallowCustom) {
   const url = getBootstrapBaseUrl(win, undefined, opt_disallowCustom);
-  preconnect.preload(url, 'document');
+  preconnect.preload(ampdoc, url, 'document');
 
   // While the URL may point to a custom domain, this URL will always be
   // fetched by it.
   const scriptUrl = getMode().localDev
     ? getAdsLocalhost(win) + '/dist.3p/current/integration.js'
     : `${urls.thirdParty}/${internalRuntimeVersion()}/f.js`;
-  preconnect.preload(scriptUrl, 'script');
+  preconnect.preload(ampdoc, scriptUrl, 'script');
 }
 
 /**
diff --git a/src/OWNERS b/src/OWNERS
index 82e99434a7f64..17d1789ce7d71 100644
--- a/src/OWNERS
+++ b/src/OWNERS
@@ -10,5 +10,13 @@
       pattern: '{iframe-video,mediasession-helper,video-*}.js',
       owners: [{name: 'ampproject/wg-ui-and-a11y'}],
     },
+    {
+      pattern: '{cid-*,*-cid-*,*-cid}.js',
+      owners: [{name: 'ampproject/wg-analytics'}],
+    },
+    {
+      pattern: 'amp-story-embed.js',
+      owners: [{name: 'newmuis'}, {name: 'gmajoulet'}, {name: 'enriqe'}],
+    },
   ],
 }
diff --git a/src/amp-story-embed.js b/src/amp-story-embed.js
index b6a63359f4d32..96556596581e6 100644
--- a/src/amp-story-embed.js
+++ b/src/amp-story-embed.js
@@ -14,13 +14,14 @@
  * limitations under the License.
  */
 
-import {setStyle} from '../src/style';
+import {setStyle} from './style';
+import {toArray} from './types';
 
 /** @enum {string} */
 const LoadStateClass = {
-  LOADING: 'loading',
-  LOADED: 'loaded',
-  ERROR: 'error',
+  LOADING: 'i-amphtml-story-embed-loading',
+  LOADED: 'i-amphtml-story-embed-loaded',
+  ERROR: 'i-amphtml-story-embed-error',
 };
 
 /** @const {string} */
@@ -28,8 +29,7 @@ const CSS = `
   :host { all: initial; display: block; border-radius: 0 !important; width: 405px; height: 720px; overflow: auto; }
   .story { height: 100%; width: 100%; flex: 0 0 100%; border: 0; opacity: 0; transition: opacity 500ms ease; }
   main { display: flex; flex-direction: row; height: 100%; }
-  .loaded iframe { opacity: 1; }
-`;
+  .i-amphtml-story-embed-loaded iframe { opacity: 1; }`;
 
 /**
  * Note that this is a vanilla JavaScript class and should not depend on AMP
@@ -37,11 +37,11 @@ const CSS = `
  */
 export class AmpStoryEmbed {
   /**
-   * @param {!Document} doc
+   * @param {!Window} win
    * @param {!Element} element
    * @constructor
    */
-  constructor(doc, element) {
+  constructor(win, element) {
     console./*OK*/ assert(
       element.childElementCount > 0,
       'Missing configuration.'
@@ -51,20 +51,22 @@ export class AmpStoryEmbed {
     this.element_ = element;
 
     /** @private {!Document} */
-    this.doc_ = doc;
+    this.doc_ = win.document;
 
     /** @private {!Array<!HTMLAnchorElement>} */
-    this.stories_ = Array.prototype.slice.call(element.querySelectorAll('a'));
+    this.stories_ = [];
 
     /** @private {?Element} */
-    this.rootEl_;
+    this.rootEl_ = null;
 
     /** @private {?HTMLIframeElement} */
-    this.iframeEl_;
+    this.iframeEl_ = null;
   }
 
   /** @public */
-  build() {
+  buildCallback() {
+    this.stories_ = toArray(this.element_.querySelectorAll('a'));
+
     this.initializeShadowRoot_();
 
     // TODO: Build all child iframes.
@@ -73,6 +75,8 @@ export class AmpStoryEmbed {
 
   /** @private */
   initializeShadowRoot_() {
+    this.rootEl_ = this.doc_.createElement('main');
+
     // Create shadow root
     const shadowRoot = this.element_.attachShadow({mode: 'open'});
 
@@ -80,8 +84,6 @@ export class AmpStoryEmbed {
     const styleEl = this.doc_.createElement('style');
     styleEl.textContent = CSS;
     shadowRoot.appendChild(styleEl);
-
-    this.rootEl_ = this.doc_.createElement('main');
     shadowRoot.appendChild(this.rootEl_);
   }
 
@@ -92,7 +94,6 @@ export class AmpStoryEmbed {
   buildIframe_(index) {
     const story = this.stories_[index];
     this.iframeEl_ = this.doc_.createElement('iframe');
-    this.iframeEl_.setAttribute('src', story.href);
     setStyle(
       this.iframeEl_,
       'backgroundImage',
@@ -109,19 +110,47 @@ export class AmpStoryEmbed {
 
     this.iframeEl_.onload = () => {
       this.rootEl_.classList.remove(LoadStateClass.LOADING);
+      this.element_.classList.remove(LoadStateClass.LOADING);
       this.rootEl_.classList.add(LoadStateClass.LOADED);
+      this.element_.classList.add(LoadStateClass.LOADED);
     };
     this.iframeEl_.onerror = () => {
       this.rootEl_.classList.remove(LoadStateClass.LOADING);
+      this.element_.classList.remove(LoadStateClass.LOADING);
       this.rootEl_.classList.add(LoadStateClass.ERROR);
+      this.element_.classList.add(LoadStateClass.ERROR);
     };
   }
-}
 
-const doc = self.document;
-const embeds = doc.getElementsByTagName('amp-story-embed');
-for (let i = 0; i < embeds.length; i++) {
-  const embed = embeds[i];
-  const embedImpl = new AmpStoryEmbed(doc, embed);
-  embedImpl.build();
+  /**
+   * @return {!Promise}
+   * @public
+   */
+  layoutCallback() {
+    // TODO: Layout all child iframes.
+    return this.layoutIframe_(0);
+  }
+
+  /**
+   * @param {number} index
+   * @return {!Promise}
+   * @private
+   */
+  layoutIframe_(index) {
+    const story = this.stories_[index];
+    this.iframeEl_.setAttribute('src', story.href);
+    return Promise.resolve();
+  }
 }
+
+self.onload = () => {
+  const doc = self.document;
+  const embeds = doc.getElementsByTagName('amp-story-embed');
+  for (let i = 0; i < embeds.length; i++) {
+    const embed = embeds[i];
+    const embedImpl = new AmpStoryEmbed(self, embed);
+    embedImpl.buildCallback();
+    // TODO(Enriqe): add intersection observer that triggers layoutCallback().
+    embedImpl.layoutCallback();
+  }
+};
diff --git a/src/amp.js b/src/amp.js
index 5948453794beb..953eded460fbf 100644
--- a/src/amp.js
+++ b/src/amp.js
@@ -22,10 +22,11 @@
 import './polyfills'; // eslint-disable-line sort-imports-es6-autofix/sort-imports-es6
 
 import {Services} from './services';
-import {adopt} from './runtime';
+import {adoptWithMultidocDeps} from './runtime';
 import {cssText as ampDocCss} from '../build/ampdoc.css';
 import {cssText as ampSharedCss} from '../build/ampshared.css';
 import {fontStylesheetTimeout} from './font-stylesheet-timeout';
+import {getMode} from './mode';
 import {
   installAmpdocServices,
   installBuiltinElements,
@@ -91,6 +92,7 @@ if (shouldMainBootstrapRun) {
   startupChunk(self.document, function initial() {
     /** @const {!./service/ampdoc-impl.AmpDoc} */
     const ampdoc = ampdocService.getAmpDoc(self.document);
+    installPlatformService(self);
     installPerformanceService(self);
     /** @const {!./service/performance-impl.Performance} */
     const perf = Services.performanceFor(self);
@@ -99,7 +101,9 @@ if (shouldMainBootstrapRun) {
     ) {
       perf.addEnabledExperiment('no-boilerplate');
     }
-    installPlatformService(self);
+    if (getMode().esm) {
+      perf.addEnabledExperiment('esm');
+    }
     fontStylesheetTimeout(self);
     perf.tick('is');
     installStylesForDoc(
@@ -115,7 +119,7 @@ if (shouldMainBootstrapRun) {
           maybeTrackImpression(self);
         });
         startupChunk(self.document, function adoptWindow() {
-          adopt(self);
+          adoptWithMultidocDeps(self);
         });
         startupChunk(self.document, function builtins() {
           // Builtins.
diff --git a/src/auto-lightbox.js b/src/auto-lightbox.js
index e05f6c89a6182..7561e3b99368e 100644
--- a/src/auto-lightbox.js
+++ b/src/auto-lightbox.js
@@ -18,6 +18,7 @@ import {ChunkPriority, chunk} from './chunk';
 import {Services} from './services';
 import {dev} from './log';
 import {isAmphtml} from './format';
+import {isStoryDocument} from './utils/story';
 
 /** @const @enum {string} */
 export const AutoLightboxEvents = {
@@ -45,10 +46,16 @@ export function installAutoLightboxExtension(ampdoc) {
   chunk(
     ampdoc,
     () => {
-      Services.extensionsFor(win).installExtensionForDoc(
-        ampdoc,
-        'amp-auto-lightbox'
-      );
+      isStoryDocument(ampdoc).then(isStory => {
+        // Do not enable on amp-story documents.
+        if (isStory) {
+          return;
+        }
+        Services.extensionsFor(win).installExtensionForDoc(
+          ampdoc,
+          'amp-auto-lightbox'
+        );
+      });
     },
     ChunkPriority.LOW
   );
diff --git a/src/base-element.js b/src/base-element.js
index a82705338110e..54f5fbfa08741 100644
--- a/src/base-element.js
+++ b/src/base-element.js
@@ -21,7 +21,6 @@ import {devAssert, user, userAssert} from './log';
 import {getData, listen, loadPromise} from './event-helper';
 import {getMode} from './mode';
 import {isArray, toWin} from './types';
-import {preconnectForElement} from './preconnect';
 
 /**
  * Base class for all custom element implementations. Instead of inheriting
@@ -137,9 +136,6 @@ export class BaseElement {
     /** @package {!Layout} */
     this.layout_ = Layout.NODISPLAY;
 
-    /** @package {number} */
-    this.layoutWidth_ = -1;
-
     /** @package {boolean} */
     this.inViewport_ = false;
 
@@ -157,9 +153,6 @@ export class BaseElement {
 
     /** @private {?string} */
     this.defaultActionAlias_ = null;
-
-    /** @public {!./preconnect.Preconnect} */
-    this.preconnect = preconnectForElement(this.element);
   }
 
   /**
@@ -259,17 +252,6 @@ export class BaseElement {
     return Services.vsyncFor(this.win);
   }
 
-  /**
-   * Returns the layout width for this element. A `-1` value indicates that the
-   * layout is not yet known. A `0` value indicates that the element is not
-   * visible.
-   * @return {number}
-   * @public
-   */
-  getLayoutWidth() {
-    return this.layoutWidth_;
-  }
-
   /**
    * Returns the consent policy id that this element should wait for before
    * buildCallback.
@@ -663,6 +645,27 @@ export class BaseElement {
     }
   }
 
+  /**
+   * Utility method to propagate all data attributes from this element
+   * to the target element. (For use with arbitrary data attributes.)
+   * Removes any data attributes that are missing on this element from
+   * the target element.
+   * @param {!Element} targetElement
+   */
+  propagateDataset(targetElement) {
+    for (const key in targetElement.dataset) {
+      if (!(key in this.element.dataset)) {
+        delete targetElement.dataset[key];
+      }
+    }
+
+    for (const key in this.element.dataset) {
+      if (targetElement.dataset[key] !== this.element.dataset[key]) {
+        targetElement.dataset[key] = this.element.dataset[key];
+      }
+    }
+  }
+
   /**
    * Utility method that forwards the given list of non-bubbling events
    * from the given element to this element as custom events with the same name.
@@ -821,9 +824,11 @@ export class BaseElement {
    * @public
    */
   changeHeight(newHeight) {
-    this.element
-      .getResources()
-      ./*OK*/ changeSize(this.element, newHeight, /* newWidth */ undefined);
+    Services.mutatorForDoc(this.getAmpDoc())./*OK*/ changeSize(
+      this.element,
+      newHeight,
+      /* newWidth */ undefined
+    );
   }
 
   /**
@@ -832,7 +837,7 @@ export class BaseElement {
    * is no longer visible.
    */
   collapse() {
-    this.element.getResources().collapseElement(this.element);
+    Services.mutatorForDoc(this.getAmpDoc()).collapseElement(this.element);
   }
 
   /**
@@ -840,7 +845,9 @@ export class BaseElement {
    * @return {!Promise}
    */
   attemptCollapse() {
-    return this.element.getResources().attemptCollapse(this.element);
+    return Services.mutatorForDoc(this.getAmpDoc()).attemptCollapse(
+      this.element
+    );
   }
 
   /**
@@ -858,9 +865,11 @@ export class BaseElement {
    * @public
    */
   attemptChangeHeight(newHeight) {
-    return this.element
-      .getResources()
-      .attemptChangeSize(this.element, newHeight, /* newWidth */ undefined);
+    return Services.mutatorForDoc(this.getAmpDoc()).attemptChangeSize(
+      this.element,
+      newHeight,
+      /* newWidth */ undefined
+    );
   }
 
   /**
@@ -880,15 +889,13 @@ export class BaseElement {
    * @public
    */
   attemptChangeSize(newHeight, newWidth, opt_event) {
-    return this.element
-      .getResources()
-      .attemptChangeSize(
-        this.element,
-        newHeight,
-        newWidth,
-        /* newMargin */ undefined,
-        opt_event
-      );
+    return Services.mutatorForDoc(this.getAmpDoc()).attemptChangeSize(
+      this.element,
+      newHeight,
+      newWidth,
+      /* newMargin */ undefined,
+      opt_event
+    );
   }
 
   /**
@@ -899,7 +906,7 @@ export class BaseElement {
    * @return {!Promise}
    */
   measureElement(measurer) {
-    return this.element.getResources().measureElement(measurer);
+    return Services.mutatorForDoc(this.getAmpDoc()).measureElement(measurer);
   }
 
   /**
@@ -937,9 +944,11 @@ export class BaseElement {
    * @return {!Promise}
    */
   measureMutateElement(measurer, mutator, opt_element) {
-    return this.element
-      .getResources()
-      .measureMutateElement(opt_element || this.element, measurer, mutator);
+    return Services.mutatorForDoc(this.getAmpDoc()).measureMutateElement(
+      opt_element || this.element,
+      measurer,
+      mutator
+    );
   }
 
   /**
@@ -957,7 +966,7 @@ export class BaseElement {
    * is no longer visible.
    */
   expand() {
-    this.element.getResources().expandElement(this.element);
+    Services.mutatorForDoc(this.getAmpDoc()).expandElement(this.element);
   }
 
   /**
diff --git a/src/batched-json.js b/src/batched-json.js
index de7c17883761d..d501c4d8e6f13 100644
--- a/src/batched-json.js
+++ b/src/batched-json.js
@@ -42,6 +42,8 @@ export const UrlReplacementPolicy = {
  *     vars. If OPT_IN, replaces whitelisted URL vars. Otherwise, don't expand.
  * @param {boolean|undefined} options.refresh Forces refresh of browser cache.
  * @param {string|undefined} options.token Auth token that forces a POST request.
+ * @param {string|undefined} options.xssiPrefix Prefix to optionally
+ *     strip from the response before calling parseJson.
  * @return {!Promise<!JsonObject|!Array<JsonObject>>} Resolved with JSON
  *     result or rejected if response is invalid.
  */
@@ -53,6 +55,7 @@ export function batchFetchJsonFor(
     urlReplacement = UrlReplacementPolicy.NONE,
     refresh = false,
     token = undefined,
+    xssiPrefix = undefined,
   } = {}
 ) {
   assertHttpsUrl(element.getAttribute('src'), element);
@@ -70,7 +73,7 @@ export function batchFetchJsonFor(
       }
       return xhr.fetchJson(data.xhrUrl, data.fetchOpt);
     })
-    .then(res => res.json())
+    .then(res => Services.xhrFor(ampdoc.win).xssiJson(res, xssiPrefix))
     .then(data => {
       if (data == null) {
         throw new Error('Response is undefined.');
diff --git a/src/chunk.js b/src/chunk.js
index bdb2ec1139e2a..f7d424f0748cb 100644
--- a/src/chunk.js
+++ b/src/chunk.js
@@ -18,7 +18,6 @@ import {Services} from './services';
 import {dev} from './log';
 import {getData} from './event-helper';
 import {getServiceForDoc, registerServiceBuilderForDoc} from './service';
-import {isExperimentOn} from './experiments';
 import {makeBodyVisibleRecovery} from './style-installer';
 import PriorityQueue from './utils/priority-queue';
 
@@ -31,6 +30,7 @@ const TAG = 'CHUNK';
  * @type {boolean}
  */
 let deactivated = /nochunking=1/.test(self.location.hash);
+let allowLongTasks = false;
 
 /**
  * @const {!Promise}
@@ -115,6 +115,14 @@ export function deactivateChunking() {
   deactivated = true;
 }
 
+/**
+ * Allow continuing macro tasks after a long task (>5ms).
+ * In particular this is the case when AMP runs in the `amp-inabox` ads mode.
+ */
+export function allowLongTasksInChunking() {
+  allowLongTasks = true;
+}
+
 /**
  * @visibleForTesting
  */
@@ -300,11 +308,7 @@ class Chunks {
     this.boundExecute_ = this.execute_.bind(this);
     /** @private {number} */
     this.durationOfLastExecution_ = 0;
-    /** @private {boolean} */
-    this.macroAfterLongTask_ = isExperimentOn(
-      this.win_,
-      'macro-after-long-task'
-    );
+
     /**
      * Set to true if we scheduled a macro or micro task to execute the next
      * task. If true, we don't schedule another one.
@@ -449,7 +453,7 @@ class Chunks {
     // last instruction yeild back to the main thread.
     // 5 milliseconds is a magic number.
     if (
-      this.macroAfterLongTask_ &&
+      !allowLongTasks &&
       this.bodyIsVisible_ &&
       this.durationOfLastExecution_ > 5
     ) {
diff --git a/src/custom-element.js b/src/custom-element.js
index 6c3e8eeaa1fa1..54ac6009b63a2 100644
--- a/src/custom-element.js
+++ b/src/custom-element.js
@@ -85,10 +85,10 @@ function isTemplateTagSupported() {
  *
  * @param {!Window} win The window in which to register the custom element.
  * @param {string} name The name of the custom element.
- * @return {function(new:AmpElement)} The custom element class.
+ * @return {typeof AmpElement} The custom element class.
  */
 export function createCustomElementClass(win, name) {
-  const baseCustomElement = /** @type {function(new:HTMLElement)} */ (createBaseCustomElementClass(
+  const baseCustomElement = /** @type {typeof HTMLElement} */ (createBaseCustomElementClass(
     win
   ));
   class CustomAmpElement extends baseCustomElement {
@@ -108,21 +108,20 @@ export function createCustomElementClass(win, name) {
       return name;
     }
   }
-  return /** @type {function(new:AmpElement)} */ (CustomAmpElement);
+  return /** @type {typeof AmpElement} */ (CustomAmpElement);
 }
 
 /**
  * Creates a base custom element class.
  *
  * @param {!Window} win The window in which to register the custom element.
- * @return {function(new:HTMLElement)}
+ * @return {typeof HTMLElement}
  */
 function createBaseCustomElementClass(win) {
   if (win.__AMP_BASE_CE_CLASS) {
     return win.__AMP_BASE_CE_CLASS;
   }
-  const htmlElement =
-    /** @type {function(new:HTMLElement)} */ (win.HTMLElement);
+  const htmlElement = /** @type {typeof HTMLElement} */ (win.HTMLElement);
 
   /**
    * @abstract @extends {HTMLElement}
@@ -369,7 +368,7 @@ function createBaseCustomElementClass(win) {
      * Upgrades the element to the provided new implementation. If element
      * has already been attached, it's layout validation and attachment flows
      * are repeated for the new implementation.
-     * @param {function(new:./base-element.BaseElement, !Element)} newImplClass
+     * @param {typeof ./base-element.BaseElement} newImplClass
      * @final @package
      */
     upgrade(newImplClass) {
@@ -413,8 +412,8 @@ function createBaseCustomElementClass(win) {
       this.classList.remove('i-amphtml-unresolved');
       this.implementation_.createdCallback();
       this.assertLayout_();
+      // TODO(wg-runtime): Don't set BaseElement ivars externally.
       this.implementation_.layout_ = this.layout_;
-      this.implementation_.layoutWidth_ = this.layoutWidth_;
       this.implementation_.firstAttachedCallback();
       this.dispatchCustomEventForTesting(AmpEvents.ATTACHED);
       this.getResources().upgraded(this);
@@ -466,6 +465,15 @@ function createBaseCustomElementClass(win) {
       return this.implementation_.getLayoutPriority();
     }
 
+    /**
+     * TODO(wg-runtime, #25824): Make Resource.getLayoutBox() the source of truth.
+     * @return {number}
+     * @deprecated
+     */
+    getLayoutWidth() {
+      return this.layoutWidth_;
+    }
+
     /**
      * Get the default action alias.
      * @return {?string}
@@ -588,16 +596,12 @@ function createBaseCustomElementClass(win) {
 
     /**
      * Updates the layout box of the element.
-     * See {@link BaseElement.getLayoutWidth} for details.
      * @param {!./layout-rect.LayoutRectDef} layoutBox
      * @param {boolean=} opt_measurementsChanged
      */
     updateLayoutBox(layoutBox, opt_measurementsChanged) {
       this.layoutWidth_ = layoutBox.width;
       this.layoutHeight_ = layoutBox.height;
-      if (this.isUpgraded()) {
-        this.implementation_.layoutWidth_ = this.layoutWidth_;
-      }
       if (this.isBuilt()) {
         try {
           this.implementation_.onLayoutMeasure();
@@ -1830,9 +1834,9 @@ function createBaseCustomElementClass(win) {
 
         if (overflown) {
           this.overflowElement_.onclick = () => {
-            const resources = this.getResources();
-            resources./*OK*/ changeSize(this, requestedHeight, requestedWidth);
-            resources.mutateElement(this, () => {
+            const mutator = Services.mutatorForDoc(this.getAmpDoc());
+            mutator./*OK*/ changeSize(this, requestedHeight, requestedWidth);
+            mutator./*OK*/ mutateElement(this, () => {
               this.overflowCallback(
                 /* overflown */ false,
                 requestedHeight,
@@ -1853,15 +1857,18 @@ function createBaseCustomElementClass(win) {
      * @param {?Element=} opt_element
      */
     mutateOrInvoke_(mutator, opt_element) {
-      if (this.resources_) {
-        this.getResources().mutateElement(opt_element || this, mutator);
+      if (this.ampdoc_) {
+        Services.mutatorForDoc(this.getAmpDoc()).mutateElement(
+          opt_element || this,
+          mutator
+        );
       } else {
         mutator();
       }
     }
   }
   win.__AMP_BASE_CE_CLASS = BaseCustomElement;
-  return /** @type {function(new:HTMLElement)} */ (win.__AMP_BASE_CE_CLASS);
+  return /** @type {typeof HTMLElement} */ (win.__AMP_BASE_CE_CLASS);
 }
 
 /**
@@ -1911,7 +1918,7 @@ function isInternalOrServiceNode(node) {
  *
  * @param {!Window} win The window in which to register the custom element.
  * @param {string} name The name of the custom element.
- * @param {function(new:./base-element.BaseElement, !Element)=} opt_implementationClass For testing only.
+ * @param {(typeof ./base-element.BaseElement)=} opt_implementationClass For testing only.
  * @return {!Object} Prototype of element.
  */
 export function createAmpElementForTesting(win, name, opt_implementationClass) {
diff --git a/src/document-fetcher.js b/src/document-fetcher.js
index 6ff514fbbc321..7f019932210d3 100644
--- a/src/document-fetcher.js
+++ b/src/document-fetcher.js
@@ -49,7 +49,10 @@ export function fetchDocument(win, input, opt_init) {
           .text()
           .then(body => new DOMParser().parseFromString(body, 'text/html'));
       }
-      return xhrRequest(input, init).then(({xhr}) => xhr.responseXML);
+      return xhrRequest(input, init).then(resp => {
+        const {xhr} = resp;
+        return xhr.responseXML;
+      });
     }
   );
 }
diff --git a/src/friendly-iframe-embed.js b/src/friendly-iframe-embed.js
index 545b5737d9e4e..0e6a3071d8b0e 100644
--- a/src/friendly-iframe-embed.js
+++ b/src/friendly-iframe-embed.js
@@ -560,6 +560,14 @@ export class FriendlyIframeEmbed {
     return Services.resourcesForDoc(this.iframe);
   }
 
+  /**
+   * @return {!./service/mutator-interface.MutatorInterface}
+   * @private
+   */
+  getMutator_() {
+    return Services.mutatorForDoc(this.iframe);
+  }
+
   /**
    * Runs a measure/mutate cycle ensuring that the iframe change is propagated
    * to the resource manager.
@@ -568,7 +576,7 @@ export class FriendlyIframeEmbed {
    * @private
    */
   measureMutate_(task) {
-    return this.getResources_().measureMutateElement(
+    return this.getMutator_().measureMutateElement(
       this.iframe,
       task.measure || null,
       task.mutate
@@ -858,10 +866,7 @@ function installPolyfillsInChildWindow(parentWin, childWin) {
   installDOMTokenList(childWin);
   // The anonymous class parameter allows us to detect native classes vs
   // transpiled classes.
-  installCustomElements(
-    childWin,
-    NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined
-  );
+  installCustomElements(childWin, class {});
 }
 
 /**
diff --git a/src/iframe-helper.js b/src/iframe-helper.js
index 68548f59281a7..ff97465b81904 100644
--- a/src/iframe-helper.js
+++ b/src/iframe-helper.js
@@ -565,7 +565,6 @@ export function isAdLike(element) {
 /**
  * @param {!Element} iframe
  * @return {!Element}
- * @private
  */
 export function disableScrollingOnIframe(iframe) {
   addAttributesToElement(iframe, dict({'scrolling': 'no'}));
@@ -583,7 +582,6 @@ export function disableScrollingOnIframe(iframe) {
  * from the perspective of the current window.
  * @param {!Window} win
  * @return {boolean}
- * @private
  */
 export function canInspectWindow(win) {
   // TODO: this is not reliable.  The compiler assumes that property reads are
diff --git a/src/inabox/amp-inabox.js b/src/inabox/amp-inabox.js
index d3ea57d39c5da..140ba516da167 100644
--- a/src/inabox/amp-inabox.js
+++ b/src/inabox/amp-inabox.js
@@ -22,6 +22,7 @@ import '../polyfills';
 import {Navigation} from '../service/navigation';
 import {Services} from '../services';
 import {adopt} from '../runtime';
+import {allowLongTasksInChunking, startupChunk} from '../chunk';
 import {cssText as ampSharedCss} from '../../build/ampshared.css';
 import {doNotTrackImpression} from '../impression';
 import {fontStylesheetTimeout} from '../font-stylesheet-timeout';
@@ -35,6 +36,7 @@ import {
 import {installDocService} from '../service/ampdoc-impl';
 import {installErrorReporting} from '../error';
 import {installPerformanceService} from '../service/performance-impl';
+import {installPlatformService} from '../service/platform-impl';
 import {
   installStylesForDoc,
   makeBodyVisible,
@@ -42,7 +44,6 @@ import {
 } from '../style-installer';
 import {internalRuntimeVersion} from '../internal-version';
 import {maybeValidate} from '../validator-integration';
-import {startupChunk} from '../chunk';
 import {stubElementsForDoc} from '../service/custom-element-registry';
 
 getMode(self).runtime = 'inabox';
@@ -68,9 +69,11 @@ try {
   makeBodyVisibleRecovery(self.document);
   throw e;
 }
+allowLongTasksInChunking();
 startupChunk(self.document, function initial() {
   /** @const {!../service/ampdoc-impl.AmpDoc} */
   const ampdoc = ampdocService.getAmpDoc(self.document);
+  installPlatformService(self);
   installPerformanceService(self);
   /** @const {!../service/performance-impl.Performance} */
   const perf = Services.performanceFor(self);
diff --git a/src/inabox/inabox-iframe-messaging-client.js b/src/inabox/inabox-iframe-messaging-client.js
index f444249f3055f..6b96e47ab50e5 100644
--- a/src/inabox/inabox-iframe-messaging-client.js
+++ b/src/inabox/inabox-iframe-messaging-client.js
@@ -17,6 +17,7 @@
 import {IframeMessagingClient} from '../../3p/iframe-messaging-client';
 import {canInspectWindow} from '../iframe-helper';
 import {getExistingServiceOrNull, registerServiceBuilder} from '../service';
+import {isExperimentOn} from '../experiments';
 import {tryParseJson} from '../json';
 
 /**
@@ -34,7 +35,10 @@ export function iframeMessagingClientFor(win) {
  * @param {!Window} win
  */
 export function installIframeMessagingClient(win) {
-  if (!canInspectWindow(win.top)) {
+  if (
+    !isExperimentOn(win, 'inabox-viewport-friendly') ||
+    !canInspectWindow(win.top)
+  ) {
     registerServiceBuilder(
       win,
       'iframeMessagingClient',
diff --git a/src/inabox/inabox-viewport.js b/src/inabox/inabox-viewport.js
index bbefd6eaecf22..4d9fa54f042ee 100644
--- a/src/inabox/inabox-viewport.js
+++ b/src/inabox/inabox-viewport.js
@@ -24,6 +24,7 @@ import {dev, devAssert} from '../log';
 import {getFrameOverlayManager} from '../../ads/inabox/frame-overlay-manager.js';
 import {getPositionObserver} from '../../ads/inabox/position-observer';
 import {iframeMessagingClientFor} from './inabox-iframe-messaging-client';
+import {isExperimentOn} from '../experiments';
 import {isIframed} from '../dom';
 import {
   layoutRectFromDomRect,
@@ -449,7 +450,9 @@ export class ViewportBindingInabox {
     );
 
     /** @private @const {boolean} */
-    this.isFriendlyIframed_ = canInspectWindow(this.win.top);
+    this.isFriendlyIframed_ =
+      isExperimentOn(this.win, 'inabox-viewport-friendly') &&
+      canInspectWindow(this.win.top);
 
     /** @private {?../../ads/inabox/position-observer.PositionObserver} */
     this.topWindowPositionObserver_ = this.isFriendlyIframed_
diff --git a/src/layout.js b/src/layout.js
index ab4c3b2f2eb3b..2ab1991f1ae4d 100644
--- a/src/layout.js
+++ b/src/layout.js
@@ -375,15 +375,30 @@ export function applyStaticLayout(element) {
 
   // Input layout attributes.
   const inputLayout = layoutAttr ? parseLayout(layoutAttr) : null;
-  userAssert(inputLayout !== undefined, 'Unknown layout: %s', layoutAttr);
+  userAssert(
+    inputLayout !== undefined,
+    'Invalid "layout" value: %s, %s',
+    layoutAttr,
+    element
+  );
   /** @const {string|null|undefined} */
   const inputWidth =
     widthAttr && widthAttr != 'auto' ? parseLength(widthAttr) : widthAttr;
-  userAssert(inputWidth !== undefined, 'Invalid width value: %s', widthAttr);
+  userAssert(
+    inputWidth !== undefined,
+    'Invalid "width" value: %s, %s',
+    widthAttr,
+    element
+  );
   /** @const {string|null|undefined} */
   const inputHeight =
     heightAttr && heightAttr != 'fluid' ? parseLength(heightAttr) : heightAttr;
-  userAssert(inputHeight !== undefined, 'Invalid height value: %s', heightAttr);
+  userAssert(
+    inputHeight !== undefined,
+    'Invalid "height" value: %s, %s',
+    heightAttr,
+    element
+  );
 
   // Effective layout attributes. These are effectively constants.
   let width;
@@ -433,14 +448,13 @@ export function applyStaticLayout(element) {
     layout == Layout.RESPONSIVE ||
     layout == Layout.INTRINSIC
   ) {
-    userAssert(height, 'Expected height to be available: %s', heightAttr);
+    userAssert(height, 'The "height" attribute is missing: %s', element);
   }
   if (layout == Layout.FIXED_HEIGHT) {
     userAssert(
       !width || width == 'auto',
-      'Expected width to be either absent or equal "auto" ' +
-        'for fixed-height layout: %s',
-      widthAttr
+      'The "width" attribute must be missing or "auto": %s',
+      element
     );
   }
   if (
@@ -450,22 +464,24 @@ export function applyStaticLayout(element) {
   ) {
     userAssert(
       width && width != 'auto',
-      'Expected width to be available and not equal to "auto": %s',
-      widthAttr
+      'The "width" attribute must be present and not "auto": %s',
+      element
     );
   }
 
   if (layout == Layout.RESPONSIVE || layout == Layout.INTRINSIC) {
     userAssert(
       getLengthUnits(width) == getLengthUnits(height),
-      'Length units should be the same for width and height: %s, %s',
+      'Length units should be the same for "width" and "height": %s, %s, %s',
       widthAttr,
-      heightAttr
+      heightAttr,
+      element
     );
   } else {
     userAssert(
       heightsAttr === null,
-      'Unexpected "heights" attribute for none-responsive layout'
+      '"heights" attribute must be missing: %s',
+      element
     );
   }
 
diff --git a/src/log.js b/src/log.js
index 108ef385219c3..9fd6d4ba64b2c 100644
--- a/src/log.js
+++ b/src/log.js
@@ -49,6 +49,14 @@ export function isUserErrorMessage(message) {
   return message.indexOf(USER_ERROR_SENTINEL) >= 0;
 }
 
+/**
+ * @param {string} message
+ * @return {string} The new message without USER_ERROR_SENTINEL
+ */
+export function stripUserError(message) {
+  return message.replace(USER_ERROR_SENTINEL, '');
+}
+
 /**
  * @param {string} message
  * @return {boolean} Whether this message was a a user error from an iframe embed.
@@ -59,7 +67,6 @@ export function isUserErrorEmbed(message) {
 
 /**
  * @enum {number}
- * @private Visible for testing only.
  */
 export const LogLevel = {
   OFF: 0,
@@ -742,12 +749,12 @@ const logs = self.__AMP_LOG;
  * Eventually holds a constructor for Log objects. Lazily initialized, so we
  * can avoid ever referencing the real constructor except in JS binaries
  * that actually want to include the implementation.
- * @type {?Function}
+ * @type {?typeof Log}
  */
 let logConstructor = null;
 
 /**
- * Initializes log contructor.
+ * Initializes log constructor.
  */
 export function initLogConstructor() {
   logConstructor = Log;
@@ -764,7 +771,7 @@ export function initLogConstructor() {
 }
 
 /**
- * Resets log contructor for testing.
+ * Resets log constructor for testing.
  */
 export function resetLogConstructorForTesting() {
   logConstructor = null;
diff --git a/src/modal.js b/src/modal.js
index 6dc8116c3e6ad..22cb5f87c6027 100644
--- a/src/modal.js
+++ b/src/modal.js
@@ -234,7 +234,8 @@ export function setModalAsClosed(element) {
   devAssert(topModalElement === element);
 
   // Put aria-hidden back to how it was before the call.
-  hiddenElementInfos.forEach(({element, prevValue}) => {
+  hiddenElementInfos.forEach(hiddenElementInfo => {
+    const {element, prevValue} = hiddenElementInfo;
     restoreAttributeValue(element, 'aria-hidden', prevValue);
   });
   // Re-hide any internal elements that should be hidden.
diff --git a/src/mode-object.js b/src/mode-object.js
index 689cb6b199016..65a69c6e33c6b 100644
--- a/src/mode-object.js
+++ b/src/mode-object.js
@@ -26,6 +26,7 @@ export function getModeObject(opt_win) {
   return {
     localDev: getMode(opt_win).localDev,
     development: getMode(opt_win).development,
+    esm: getMode(opt_win).esm,
     filter: getMode(opt_win).filter,
     minified: getMode(opt_win).minified,
     lite: getMode(opt_win).lite,
diff --git a/src/mode.js b/src/mode.js
index 5fecf32124d39..2b3b90d574345 100644
--- a/src/mode.js
+++ b/src/mode.js
@@ -29,7 +29,8 @@ import {parseQueryString_} from './url-parse-query-string';
  *   rtvVersion: string,
  *   runtime: (null|string|undefined),
  *   a4aId: (null|string|undefined),
- *   singlePassType: (string|undefined)
+ *   singlePassType: (string|undefined),
+ *   esm: (boolean|undefined)
  * }}
  */
 export let ModeDef;
@@ -79,7 +80,7 @@ function getMode_(win) {
     // from the URL.
     win.location.originalHash || win.location.hash
   );
-  const singlePassType = AMP_CONFIG.spt;
+  const {spt: singlePassType, esm} = AMP_CONFIG;
 
   const searchQuery = parseQueryString_(win.location.search);
 
@@ -103,6 +104,7 @@ function getMode_(win) {
       ) >= 0 || win.AMP_DEV_MODE
     ),
     examiner: hashQuery['development'] == '2',
+    esm,
     // amp-geo override
     geoOverride: hashQuery['amp-geo'],
     minified: IS_MINIFIED,
diff --git a/src/multidoc-manager.js b/src/multidoc-manager.js
new file mode 100644
index 0000000000000..c00789bb4e2b8
--- /dev/null
+++ b/src/multidoc-manager.js
@@ -0,0 +1,569 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {CommonSignals} from './common-signals';
+import {Services} from './services';
+import {VisibilityState} from './visibility-state';
+import {childElementsByTag, isConnectedNode} from './dom';
+import {
+  createShadowDomWriter,
+  createShadowRoot,
+  importShadowBody,
+} from './shadow-embed';
+import {dev, user} from './log';
+import {disposeServicesForDoc, getServicePromiseOrNullForDoc} from './service';
+import {getMode} from './mode';
+import {installStylesForDoc} from './style-installer';
+import {isArray, isObject} from './types';
+import {parseUrlDeprecated} from './url';
+import {setStyle} from './style';
+
+/** @const @private {string} */
+const TAG = 'multidoc-manager';
+
+/**
+ * A manager for documents in the multi-doc environment.
+ */
+export class MultidocManager {
+  /**
+   * @param {!Window} win
+   * @param {!./service/ampdoc-impl.AmpDocService} ampdocService
+   * @param {!./service/extensions-impl.Extensions} extensions
+   * @param {!./service/timer-impl.Timer} timer
+   */
+  constructor(win, ampdocService, extensions, timer) {
+    /** @const */
+    this.win = win;
+    /** @private @const */
+    this.ampdocService_ = ampdocService;
+    /** @private @const */
+    this.extensions_ = extensions;
+    /** @private @const */
+    this.timer_ = timer;
+
+    /** @private @const {!Array<!ShadowRoot>} */
+    this.shadowRoots_ = [];
+  }
+
+  /**
+   * Attaches the shadow root and calls the supplied DOM builder.
+   * @param {!Element} hostElement
+   * @param {string} url
+   * @param {!Object<string, string>|undefined} params
+   * @param {function(!Object, !ShadowRoot,
+   * !./service/ampdoc-impl.AmpDocShadow):!Promise} builder
+   * @return {!./runtime.ShadowDoc}
+   * @private
+   */
+  attachShadowDoc_(hostElement, url, params, builder) {
+    params = params || Object.create(null);
+    this.purgeShadowRoots_();
+
+    setStyle(hostElement, 'visibility', 'hidden');
+    const shadowRoot = createShadowRoot(hostElement);
+
+    // TODO: closeShadowRoot_ is asynchronous. While this safety check is well
+    // intentioned, it leads to a race between unlayout and layout of custom
+    // elements.
+    if (shadowRoot.AMP) {
+      user().warn(TAG, "Shadow doc wasn't previously closed");
+      this.closeShadowRoot_(shadowRoot);
+    }
+
+    const amp = {};
+    shadowRoot.AMP = amp;
+    amp.url = url;
+    const {origin} = parseUrlDeprecated(url);
+
+    const ampdoc = this.ampdocService_.installShadowDoc(url, shadowRoot, {
+      params,
+    });
+    /** @const {!./service/ampdoc-impl.AmpDocShadow} */
+    amp.ampdoc = ampdoc;
+    dev().fine(TAG, 'Attach to shadow root:', shadowRoot, ampdoc);
+
+    // Install runtime CSS.
+    installStylesForDoc(
+      ampdoc,
+      AMP.combinedCss,
+      /* callback */ null,
+      /* opt_isRuntimeCss */ true
+    );
+    // Instal doc services.
+    AMP.installAmpdocServices(ampdoc);
+
+    const viewer = Services.viewerForDoc(ampdoc);
+
+    /**
+     * Sets the document's visibility state.
+     * @param {!VisibilityState} state
+     */
+    amp['setVisibilityState'] = function(state) {
+      ampdoc.overrideVisibilityState(state);
+    };
+
+    // Messaging pipe.
+    /**
+     * Posts message to the ampdoc.
+     * @param {string} eventType
+     * @param {!JsonObject} data
+     * @param {boolean} unusedAwaitResponse
+     * @return {(!Promise<*>|undefined)}
+     */
+    amp['postMessage'] = viewer.receiveMessage.bind(viewer);
+
+    /** @type {function(string, *, boolean):(!Promise<*>|undefined)} */
+    let onMessage;
+
+    /**
+     * Provides a message delivery mechanism by which AMP document can send
+     * messages to the viewer.
+     * @param {function(string, *, boolean):(!Promise<*>|undefined)} callback
+     */
+    amp['onMessage'] = function(callback) {
+      onMessage = callback;
+    };
+
+    viewer.setMessageDeliverer((eventType, data, awaitResponse) => {
+      // Special messages.
+      if (eventType == 'broadcast') {
+        this.broadcast_(data, shadowRoot);
+        return awaitResponse ? Promise.resolve() : undefined;
+      }
+
+      // All other messages.
+      if (onMessage) {
+        return onMessage(eventType, data, awaitResponse);
+      }
+    }, origin);
+
+    /**
+     * Closes the document, resolving when visibility changes and services have
+     * been cleand up. The document can no longer be activated again.
+     * @return {Promise}
+     */
+    amp['close'] = () => {
+      return this.closeShadowRoot_(shadowRoot);
+    };
+
+    if (getMode().development) {
+      amp.toggleRuntime = viewer.toggleRuntime.bind(viewer);
+      amp.resources = Services.resourcesForDoc(ampdoc);
+    }
+
+    /**
+     * Expose amp-bind getState
+     * @param {string} name - Name of state or deep state
+     * @return {Promise<*>} - Resolves to a copy of the value of a state
+     */
+    amp['getState'] = name => {
+      return Services.bindForDocOrNull(shadowRoot).then(bind => {
+        if (!bind) {
+          return Promise.reject('amp-bind is not available in this document');
+        }
+        return bind.getState(name);
+      });
+    };
+
+    /**
+     * Expose amp-bind setState
+     * @param {(!JsonObject|string)} state - State to be set
+     * @return {Promise} - Resolves after state and history have been updated
+     */
+    amp['setState'] = state => {
+      return Services.bindForDocOrNull(shadowRoot).then(bind => {
+        if (!bind) {
+          return Promise.reject('amp-bind is not available in this document');
+        }
+        if (typeof state === 'string') {
+          return bind.setStateWithExpression(
+            /** @type {string} */ (state),
+            /** @type {!JsonObject} */ ({})
+          );
+        } else if (isObject(state) || isArray(state)) {
+          return bind.setStateWithObject(/** @type {!JsonObject} */ (state));
+        }
+        return Promise.reject('Invalid state');
+      });
+    };
+
+    // Start building the shadow doc DOM.
+    builder(amp, shadowRoot, ampdoc).then(() => {
+      // Document is ready.
+      ampdoc.setReady();
+      ampdoc.signals().signal(CommonSignals.RENDER_START);
+      setStyle(hostElement, 'visibility', 'visible');
+    });
+
+    // Store reference.
+    if (!this.shadowRoots_.includes(shadowRoot)) {
+      this.shadowRoots_.push(shadowRoot);
+    }
+
+    dev().fine(TAG, 'Shadow root initialization is done:', shadowRoot, ampdoc);
+    return amp;
+  }
+
+  /**
+   * Implementation for `attachShadowDoc` function. Attaches the shadow doc and
+   * configures ampdoc for it.
+   * @param {!Element} hostElement
+   * @param {!Document} doc
+   * @param {string} url
+   * @param {!Object<string, string>=} opt_initParams
+   * @return {!./runtime.ShadowDoc}
+   */
+  attachShadowDoc(hostElement, doc, url, opt_initParams) {
+    user().assertString(url);
+    dev().fine(TAG, 'Attach shadow doc:', doc);
+    // TODO(dvoytenko, #9490): once stable, port full document case to emulated
+    // stream.
+    return this.attachShadowDoc_(
+      hostElement,
+      url,
+      opt_initParams,
+      (amp, shadowRoot, ampdoc) => {
+        // Install extensions.
+        const extensionIds = this.mergeShadowHead_(ampdoc, shadowRoot, doc);
+        this.extensions_.installExtensionsInDoc(ampdoc, extensionIds);
+
+        // Append body.
+        if (doc.body) {
+          const body = importShadowBody(shadowRoot, doc.body, /* deep */ true);
+          body.classList.add('amp-shadow');
+          ampdoc.setBody(body);
+        }
+
+        // TODO(dvoytenko): find a better and more stable way to make content
+        // visible. E.g. integrate with dynamic classes. In shadow case
+        // specifically, we have to wait for stubbing to complete, which may
+        // take awhile due to importNode.
+        setTimeout(() => {
+          ampdoc.signals().signal(CommonSignals.RENDER_START);
+          setStyle(hostElement, 'visibility', 'visible');
+        }, 50);
+
+        return Promise.resolve();
+      }
+    );
+  }
+
+  /**
+   * Implementation for `attachShadowDocAsStream` function. Attaches the shadow
+   * doc and configures ampdoc for it.
+   * @param {!Element} hostElement
+   * @param {string} url
+   * @param {!Object<string, string>=} opt_initParams
+   * @return {!Object}
+   */
+  attachShadowDocAsStream(hostElement, url, opt_initParams) {
+    user().assertString(url);
+    dev().fine(TAG, 'Attach shadow doc as stream');
+    return this.attachShadowDoc_(
+      hostElement,
+      url,
+      opt_initParams,
+      (amp, shadowRoot, ampdoc) => {
+        // Start streaming.
+        let renderStarted = false;
+        const writer = createShadowDomWriter(this.win);
+        amp['writer'] = writer;
+        writer.onBody(doc => {
+          // Install extensions.
+          const extensionIds = this.mergeShadowHead_(ampdoc, shadowRoot, doc);
+          // Apply all doc extensions.
+          this.extensions_.installExtensionsInDoc(ampdoc, extensionIds);
+
+          // Append shallow body.
+          const body = importShadowBody(
+            shadowRoot,
+            dev().assertElement(doc.body),
+            /* deep */ false
+          );
+          body.classList.add('amp-shadow');
+          ampdoc.setBody(body);
+          return body;
+        });
+        writer.onBodyChunk(() => {
+          // TODO(dvoytenko): find a better and more stable way to make
+          // content visible. E.g. integrate with dynamic classes. In shadow
+          // case specifically, we have to wait for stubbing to complete,
+          // which may take awhile due to node importing.
+          if (!renderStarted) {
+            renderStarted = true;
+            setTimeout(() => {
+              ampdoc.signals().signal(CommonSignals.RENDER_START);
+              setStyle(hostElement, 'visibility', 'visible');
+            }, 50);
+          }
+        });
+        return new Promise(resolve => {
+          writer.onEnd(() => {
+            resolve();
+            amp.writer = null;
+          });
+        });
+      }
+    );
+  }
+
+  /**
+   * Processes the contents of the shadow document's head.
+   * @param {!./service/ampdoc-impl.AmpDoc} ampdoc
+   * @param {!ShadowRoot} shadowRoot
+   * @param {!Document} doc
+   * @return {!Array<string>}
+   * @private
+   */
+  mergeShadowHead_(ampdoc, shadowRoot, doc) {
+    const extensionIds = [];
+    if (doc.head) {
+      shadowRoot.AMP.head = doc.head;
+      const parentLinks = {};
+      const links = childElementsByTag(
+        dev().assertElement(this.win.document.head),
+        'link'
+      );
+      for (let i = 0; i < links.length; i++) {
+        const href = links[i].getAttribute('href');
+        if (href) {
+          parentLinks[href] = true;
+        }
+      }
+
+      for (let n = doc.head.firstElementChild; n; n = n.nextElementSibling) {
+        const {tagName} = n;
+        const name = n.getAttribute('name');
+        const rel = n.getAttribute('rel');
+        switch (tagName) {
+          case 'TITLE':
+            shadowRoot.AMP.title = n.textContent;
+            dev().fine(TAG, '- set title: ', shadowRoot.AMP.title);
+            break;
+          case 'META':
+            if (n.hasAttribute('charset')) {
+              // Ignore.
+            } else if (name == 'viewport') {
+              // Ignore.
+            } else {
+              // TODO(dvoytenko): copy other meta tags.
+              dev().warn(TAG, 'meta ignored: ', n);
+            }
+            break;
+          case 'LINK':
+            /** @const {string} */
+            const href = n.getAttribute('href');
+            if (rel == 'canonical') {
+              shadowRoot.AMP.canonicalUrl = href;
+              dev().fine(TAG, '- set canonical: ', shadowRoot.AMP.canonicalUrl);
+            } else if (rel == 'stylesheet') {
+              // Must be a font definition: no other stylesheets are allowed.
+              if (parentLinks[href]) {
+                dev().fine(TAG, '- stylesheet already included: ', href);
+              } else {
+                parentLinks[href] = true;
+                const el = this.win.document.createElement('link');
+                el.setAttribute('rel', 'stylesheet');
+                el.setAttribute('type', 'text/css');
+                el.setAttribute('href', href);
+                this.win.document.head.appendChild(el);
+                dev().fine(TAG, '- import font to parent: ', href, el);
+              }
+            } else {
+              dev().fine(TAG, '- ignore link rel=', rel);
+            }
+            break;
+          case 'STYLE':
+            if (n.hasAttribute('amp-boilerplate')) {
+              // Ignore.
+              dev().fine(TAG, '- ignore boilerplate style: ', n);
+            } else if (n.hasAttribute('amp-custom')) {
+              installStylesForDoc(
+                ampdoc,
+                n.textContent,
+                /* callback */ null,
+                /* isRuntimeCss */ false,
+                'amp-custom'
+              );
+              dev().fine(TAG, '- import style: ', n);
+            } else if (n.hasAttribute('amp-keyframes')) {
+              installStylesForDoc(
+                ampdoc,
+                n.textContent,
+                /* callback */ null,
+                /* isRuntimeCss */ false,
+                'amp-keyframes'
+              );
+              dev().fine(TAG, '- import style: ', n);
+            }
+            break;
+          case 'SCRIPT':
+            if (n.hasAttribute('src')) {
+              dev().fine(TAG, '- src script: ', n);
+              const src = n.getAttribute('src');
+              const isRuntime =
+                src.indexOf('/amp.js') != -1 || src.indexOf('/v0.js') != -1;
+              // Note: Some extensions don't have [custom-element] or
+              // [custom-template] e.g. amp-viewer-integration.
+              const customElement = n.getAttribute('custom-element');
+              const customTemplate = n.getAttribute('custom-template');
+              const versionRe = /-(\d+.\d+)(.max)?\.js$/;
+              const match = versionRe.exec(src);
+              const version = match ? match[1] : '0.1';
+              if (isRuntime) {
+                dev().fine(TAG, '- ignore runtime script: ', src);
+              } else if (customElement || customTemplate) {
+                // This is an extension.
+                this.extensions_.installExtensionForDoc(
+                  ampdoc,
+                  customElement || customTemplate,
+                  version
+                );
+                dev().fine(
+                  TAG,
+                  '- load extension: ',
+                  customElement || customTemplate,
+                  ' ',
+                  version
+                );
+                if (customElement) {
+                  extensionIds.push(customElement);
+                }
+              } else if (!n.hasAttribute('data-amp-report-test')) {
+                user().error(TAG, '- unknown script: ', n, src);
+              }
+            } else {
+              // Non-src version of script.
+              const type = n.getAttribute('type') || 'application/javascript';
+              if (type.indexOf('javascript') == -1) {
+                shadowRoot.appendChild(this.win.document.importNode(n, true));
+                dev().fine(TAG, '- non-src script: ', n);
+              } else {
+                user().error(TAG, '- unallowed inline javascript: ', n);
+              }
+            }
+            break;
+          case 'NOSCRIPT':
+            // Ignore.
+            break;
+          default:
+            user().error(TAG, '- UNKNOWN head element:', n);
+            break;
+        }
+      }
+    }
+    return extensionIds;
+  }
+
+  /**
+   * @param {*} data
+   * @param {!ShadowRoot} sender
+   * @private
+   */
+  broadcast_(data, sender) {
+    this.purgeShadowRoots_();
+    this.shadowRoots_.forEach(shadowRoot => {
+      if (shadowRoot == sender) {
+        // Don't broadcast to the sender.
+        return;
+      }
+      // Broadcast message asynchronously.
+      const viewer = Services.viewerForDoc(shadowRoot.AMP.ampdoc);
+      this.timer_.delay(() => {
+        viewer.receiveMessage(
+          'broadcast',
+          /** @type {!JsonObject} */ (data),
+          /* awaitResponse */ false
+        );
+      }, 0);
+    });
+  }
+
+  /**
+   * @param {!ShadowRoot} shadowRoot
+   * @return {Promise}
+   * @private
+   */
+  closeShadowRoot_(shadowRoot) {
+    this.removeShadowRoot_(shadowRoot);
+    const amp = shadowRoot.AMP;
+    delete shadowRoot.AMP;
+    const {ampdoc} = amp;
+    ampdoc.overrideVisibilityState(VisibilityState.INACTIVE);
+    disposeServicesForDoc(ampdoc);
+
+    // There is a race between the visibility state change finishing and
+    // resources.onNextPass firing, but this is intentional. closeShadowRoot_
+    // was traditionally introduced as a synchronous method, so PWAs in the wild
+    // do not expect to have to wait for a promise to resolve before the shadow
+    // is deemed 'closed'. Moving .overrideVisibilityState() and
+    // disposeServicesForDoc inside a promise could adversely affect sites that
+    // depend on at least the synchronous portions of those methods completing
+    // before proceeding. The promise race is designed to be very quick so that
+    // even if the pass callback completes before resources.onNextPass is called
+    // below, we only delay promise resolution by a few ms.
+    return this.timer_
+      .timeoutPromise(
+        15, // Delay for queued pass after visibility change is 10ms
+        new this.win.Promise(resolve => {
+          getServicePromiseOrNullForDoc(ampdoc, 'resources').then(resources => {
+            if (resources) {
+              resources.onNextPass(resolve);
+            } else {
+              resolve();
+            }
+          });
+        }),
+        'Timeout reached waiting for visibility state change callback'
+      )
+      .catch(error => {
+        user().info(TAG, error);
+      });
+  }
+
+  /**
+   * @param {!ShadowRoot} shadowRoot
+   * @private
+   */
+  removeShadowRoot_(shadowRoot) {
+    const index = this.shadowRoots_.indexOf(shadowRoot);
+    if (index != -1) {
+      this.shadowRoots_.splice(index, 1);
+    }
+  }
+
+  /**
+   * @param {!ShadowRoot} shadowRoot
+   * @private
+   */
+  closeShadowRootAsync_(shadowRoot) {
+    this.timer_.delay(() => {
+      this.closeShadowRoot_(shadowRoot);
+    }, 0);
+  }
+
+  /** @private */
+  purgeShadowRoots_() {
+    this.shadowRoots_.forEach(shadowRoot => {
+      // The shadow root has been disconnected. Force it closed.
+      if (!shadowRoot.host || !isConnectedNode(shadowRoot.host)) {
+        user().warn(TAG, "Shadow doc wasn't previously closed");
+        this.removeShadowRoot_(shadowRoot);
+        this.closeShadowRootAsync_(shadowRoot);
+      }
+    });
+  }
+}
diff --git a/src/polyfills.js b/src/polyfills.js
index 33dcda59261ed..9aa164b8e1b0f 100644
--- a/src/polyfills.js
+++ b/src/polyfills.js
@@ -41,7 +41,7 @@ if (self.document) {
   installGetBoundingClientRect(self);
   // The anonymous class parameter allows us to detect native classes vs
   // transpiled classes.
-  installCustomElements(self, NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined);
+  installCustomElements(self, class {});
 }
 
 // TODO(#18268, erwinm): For whatever reason imports to modules that have no
diff --git a/src/polyfills/custom-elements.js b/src/polyfills/custom-elements.js
index 9b6e5263a1c48..599b9ac3d3149 100644
--- a/src/polyfills/custom-elements.js
+++ b/src/polyfills/custom-elements.js
@@ -23,7 +23,7 @@
 let DeferredDef;
 
 /**
- * @typedef {!Function}
+ * @typedef {!typeof HTMLElement}
  */
 let CustomElementConstructorDef;
 
@@ -63,7 +63,7 @@ const TRACK_SUBTREE = {
 /**
  * Asserts that the custom element name conforms to the spec.
  *
- * @param {!Function} SyntaxError
+ * @param {!typeof SyntaxError} SyntaxError
  * @param {string} name
  */
 function assertValidName(SyntaxError, name) {
@@ -136,7 +136,7 @@ class CustomElementRegistry {
      * @private
      * @const
      */
-    this.pendingDefines_ = win.Object.create(null);
+    this.pendingDefines_ = Object.create(null);
   }
 
   /**
@@ -233,7 +233,7 @@ class Registry {
      * @private
      * @const
      */
-    this.definitions_ = win.Object.create(null);
+    this.definitions_ = Object.create(null);
 
     /**
      * A up-to-date DOM selector for all custom elements.
@@ -583,7 +583,7 @@ class Registry {
  * @param {!Registry} registry
  */
 function installPatches(win, registry) {
-  const {Document, Element, Node, Object, document} = win;
+  const {Document, Element, Node, document} = win;
   const docProto = Document.prototype;
   const elProto = Element.prototype;
   const nodeProto = Node.prototype;
@@ -678,8 +678,7 @@ function installPatches(win, registry) {
   if (!innerHTMLDesc) {
     // Sigh... IE11 puts innerHTML desciptor on HTMLElement. But, we've
     // replaced HTMLElement with a polyfill wrapper, so have to get its proto.
-    innerHTMLProto =
-      /** @type {!Object} */ (win.HTMLElement.prototype.__proto__);
+    innerHTMLProto = Object.getPrototypeOf(win.HTMLElement.prototype);
     innerHTMLDesc = Object.getOwnPropertyDescriptor(
       innerHTMLProto,
       'innerHTML'
@@ -690,7 +689,11 @@ function installPatches(win, registry) {
     innerHTMLSetter.call(this, html);
     registry.upgrade(this);
   };
-  Object.defineProperty(innerHTMLProto, 'innerHTML', innerHTMLDesc);
+  Object.defineProperty(
+    /** @type {!Object} */ (innerHTMLProto),
+    'innerHTML',
+    innerHTMLDesc
+  );
 }
 
 /**
@@ -698,7 +701,7 @@ function installPatches(win, registry) {
  * @param {!Window} win
  */
 function polyfill(win) {
-  const {Element, HTMLElement, Object, document} = win;
+  const {Element, HTMLElement, document} = win;
   const {createElement} = document;
 
   const registry = new Registry(win);
@@ -786,10 +789,10 @@ function polyfill(win) {
     // prototype to the custom element prototype. And if it wasn't already
     // constructed, we created a new node via native createElement, and we need
     // to reset its prototype. Basically always reset the prototype.
-    el.__proto__ = constructor.prototype;
+    setPrototypeOf(el, constructor.prototype);
     return el;
   }
-  subClass(Object, HTMLElement, HTMLElementPolyfill);
+  subClass(HTMLElement, HTMLElementPolyfill);
 
   // Expose the polyfilled HTMLElement constructor for everyone to extend from.
   win.HTMLElement = HTMLElementPolyfill;
@@ -816,7 +819,7 @@ function polyfill(win) {
  * @suppress {globalThis}
  */
 function wrapHTMLElement(win) {
-  const {HTMLElement, Reflect, Object} = win;
+  const {HTMLElement, Reflect} = win;
   /**
    * @return {!Element}
    */
@@ -828,7 +831,7 @@ function wrapHTMLElement(win) {
     // constructor).
     return Reflect.construct(HTMLElement, [], ctor);
   }
-  subClass(Object, HTMLElement, HTMLElementWrapper);
+  subClass(HTMLElement, HTMLElementWrapper);
 
   // Expose the wrapped HTMLElement constructor for everyone to extend from.
   win.HTMLElement = HTMLElementWrapper;
@@ -837,11 +840,12 @@ function wrapHTMLElement(win) {
 /**
  * Setups up prototype inheritance
  *
- * @param {!Object} Object
- * @param {!Function} superClass
- * @param {!Function} subClass
+ * @param {!typeof SUPER} superClass
+ * @param {!typeof SUB} subClass
+ * @template SUPER
+ * @template SUB
  */
-function subClass(Object, superClass, subClass) {
+function subClass(superClass, subClass) {
   // Object.getOwnPropertyDescriptor(superClass.prototype, 'constructor')
   // {value: ƒ, writable: true, enumerable: false, configurable: true}
   subClass.prototype = Object.create(superClass.prototype, {
@@ -852,7 +856,71 @@ function subClass(Object, superClass, subClass) {
       value: subClass,
     },
   });
-  subClass.__proto__ = superClass;
+  setPrototypeOf(subClass, superClass);
+}
+
+/**
+ * Tests whether setting '__proto__' will change the prototype chain of an
+ * object. Only needed for old IE.
+ * @return {boolean}
+ */
+function supportsUnderProto() {
+  const proto = {'test': true};
+  const obj = {};
+  obj.__proto__ = proto;
+  return !!obj['test'];
+}
+
+/**
+ * Sets the prototype chain of an object, with various fallbacks to support
+ * old IE.
+ * @param {!Object} obj
+ * @param {!Object} prototype
+ */
+function setPrototypeOf(obj, prototype) {
+  if (Object.setPrototypeOf) {
+    // Every decent browser.
+    Object.setPrototypeOf(obj, prototype);
+  } else if (supportsUnderProto()) {
+    // IE11
+    obj.__proto__ = prototype;
+  } else {
+    // IE10 man. :sigh:
+    copyProperties(obj, prototype);
+  }
+}
+
+/**
+ * Copies the property descriptors from prototype to obj. This is only
+ * necessary for old IE, which can't properly set the prototype of an already
+ * created object.
+ * @param {!Object} obj
+ * @param {!Object} prototype
+ * @visibleForTesting
+ */
+export function copyProperties(obj, prototype) {
+  let current = prototype;
+  while (current !== null) {
+    if (Object.isPrototypeOf.call(current, obj)) {
+      break;
+    }
+
+    const props = Object.getOwnPropertyNames(current);
+    for (let i = 0; i < props.length; i++) {
+      const prop = props[i];
+      if (Object.hasOwnProperty.call(obj, prop)) {
+        continue;
+      }
+
+      const desc = /** @type {!ObjectPropertyDescriptor<Object>} */ (Object.getOwnPropertyDescriptor(
+        current,
+        prop
+      ));
+      Object.defineProperty(obj, prop, desc);
+    }
+
+    current = Object.getPrototypeOf(current);
+  }
 }
 
 /**
@@ -869,9 +937,9 @@ function subClass(Object, superClass, subClass) {
  * done.
  *
  * @param {!Window} win
- * @param {!Function=} opt_ctor
+ * @param {!Function} ctor
  */
-export function install(win, opt_ctor) {
+export function install(win, ctor) {
   // Don't install in no-DOM environments e.g. worker.
   const shouldInstall = win.document;
   const hasCE = hasCustomElements(win);
@@ -882,21 +950,24 @@ export function install(win, opt_ctor) {
   let install = true;
   let installWrapper = false;
 
-  if (opt_ctor && hasCE) {
+  if (ctor && hasCE) {
     // If ctor is constructable without new, it's a function. That means it was
     // compiled down, and we need to do the minimal polyfill because all you
     // cannot extend HTMLElement without native classes.
     try {
-      const {Object, Reflect, Function} = win;
+      const {Reflect} = win;
 
       // "Construct" ctor using ES5 idioms
-      const instance = Object.create(opt_ctor.prototype);
+      // I'm not sure why, but Closure will complain at the
+      // `Function.call.call()` below unless we cast to a Function instance
+      // here.
+      const instance = /** @type {!Function} */ (Object.create(ctor.prototype));
 
       // This will throw an error unless we're in a transpiled environemnt.
       // Native classes must be called as `new Ctor`, not `Ctor.call(instance)`.
       // We use `Function.call.call` because Closure is too smart for regular
       // `Ctor.call`.
-      Function.call.call(opt_ctor, instance);
+      Function.call.call(ctor, instance);
 
       // If that didn't throw, we're transpiled.
       // Let's find out if we can wrap HTMLElement and avoid a full patch.
diff --git a/src/polyfills/fetch.js b/src/polyfills/fetch.js
index 40ee44fe2cac8..4e333593b142b 100644
--- a/src/polyfills/fetch.js
+++ b/src/polyfills/fetch.js
@@ -263,24 +263,18 @@ export class Response extends FetchResponse {
    */
   constructor(body, init = {}) {
     const lowercasedHeaders = map();
-    const data = Object.assign(
-      {
-        status: 200,
-        statusText: 'OK',
-        responseText: body ? String(body) : '',
-        /**
-         * @param {string} name
-         * @return {string}
-         */
-        getResponseHeader(name) {
-          const headerName = String(name).toLowerCase();
-          return hasOwn(lowercasedHeaders, headerName)
-            ? lowercasedHeaders[headerName]
-            : null;
-        },
+    const data = {
+      status: 200,
+      statusText: 'OK',
+      responseText: body ? String(body) : '',
+      getResponseHeader(name) {
+        const headerName = String(name).toLowerCase();
+        return hasOwn(lowercasedHeaders, headerName)
+          ? lowercasedHeaders[headerName]
+          : null;
       },
-      init
-    );
+      ...init,
+    };
 
     data.status = init.status === undefined ? 200 : parseInt(init.status, 10);
 
diff --git a/src/polyfills/promise.js b/src/polyfills/promise.js
index bd4d752cdf267..8cb9e918db48d 100644
--- a/src/polyfills/promise.js
+++ b/src/polyfills/promise.js
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import Promise from 'promise-pjs/promise.mjs';
+import Promise from 'promise-pjs';
 
 /**
  * Sets the Promise polyfill if it does not exist.
diff --git a/src/preact/base-element.js b/src/preact/base-element.js
new file mode 100644
index 0000000000000..98a5ff9b0a897
--- /dev/null
+++ b/src/preact/base-element.js
@@ -0,0 +1,327 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {Deferred} from '../utils/promise';
+import {Fragment, createElement, render} from './index';
+import {Slot, createSlot} from './slot';
+import {devAssert} from '../log';
+import {matches} from '../dom';
+import {withAmpContext} from './context';
+
+/**
+ * @typedef {{
+ *   attr: string,
+ *   type: (string|undefined),
+ *   default: *,
+ * }}
+ */
+let AmpElementPropDef;
+
+/**
+ * @typedef {{
+ *   name: string,
+ *   selector: string,
+ *   single: (boolean|undefined),
+ *   props: (!JsonObject|undefined),
+ * }}
+ */
+let ChildDef;
+
+/**
+ * Wraps a Preact Component in a BaseElement class.
+ *
+ * Most functionality should be done in Preact. We don't expose the BaseElement
+ * subclass on purpose, you're not meant to do work in the subclass! There will
+ * be very few exceptions, which is why we allow options to configure the
+ * class.
+ */
+export class PreactBaseElement extends AMP.BaseElement {
+  /** @param {!AmpElement} element */
+  constructor(element) {
+    super(element);
+
+    /** @private {?Node} */
+    this.container_ = null;
+
+    /** @private {boolean} */
+    this.scheduledRender_ = false;
+
+    /** @private {!Object} */
+    this.context_ = {
+      renderable: false,
+      playable: false,
+      notify: () => this.mutateElement(() => {}),
+    };
+
+    this.boundRerender_ = () => {
+      this.scheduledRender_ = false;
+      this.rerender_();
+    };
+
+    /** @private {!Deferred|null} */
+    this.scheduledRenderDeferred_ = null;
+
+    /** @private {!JsonObject|null|undefined} */
+    this.defaultProps_ = null;
+
+    /** @private {boolean} */
+    this.mounted_ = true;
+  }
+
+  /**
+   * A chance to initialize default Preact props for the element.
+   *
+   * @return {!JsonObject|undefined}
+   */
+  init() {}
+
+  /** @override */
+  buildCallback() {
+    this.defaultProps_ = this.init() || null;
+
+    this.scheduleRender_();
+
+    // context-changed is fired on each child element to notify it that the
+    // parent has changed the wrapping context. This is equivalent to
+    // updating the Context.Provider with new data and having it propagate.
+    this.element.addEventListener('i-amphtml-context-changed', e => {
+      e.stopPropagation();
+      this.scheduleRender_();
+    });
+
+    // unmounted is fired on each child element to notify it that the parent
+    // has removed the element from the DOM tree. This is equivalent to React
+    // recursively calling componentWillUnmount.
+    this.element.addEventListener('i-amphtml-unmounted', e => {
+      e.stopPropagation();
+      this.unmount_();
+    });
+  }
+
+  /** @override */
+  layoutCallback() {
+    const deferred =
+      this.scheduledRenderDeferred_ ||
+      (this.scheduledRenderDeferred_ = new Deferred());
+    this.context_.renderable = true;
+    this.context_.playable = true;
+    this.scheduleRender_();
+    return deferred.promise;
+  }
+
+  /** @override */
+  mutatedAttributesCallback() {
+    if (this.container_) {
+      this.scheduleRender_();
+    }
+  }
+
+  /** @private */
+  scheduleRender_() {
+    if (!this.scheduledRender_) {
+      this.scheduledRender_ = true;
+      this.mutateElement(this.boundRerender_);
+    }
+  }
+
+  /** @private */
+  unmount_() {
+    this.mounted_ = false;
+    if (this.container_) {
+      render(createElement(Fragment), this.container_);
+    }
+  }
+
+  /** @private */
+  rerender_() {
+    // If the component unmounted before the scheduled render runs, exit
+    // early.
+    if (!this.mounted_) {
+      return;
+    }
+
+    const Ctor = this.constructor;
+
+    if (!this.container_) {
+      if (Ctor.children || Ctor.passthrough) {
+        this.container_ = this.element.attachShadow({mode: 'open'});
+      } else {
+        const container = this.win.document.createElement('i-amphtml-c');
+        this.container_ = container;
+        this.applyFillContent(container);
+        this.element.appendChild(container);
+      }
+    }
+
+    const props = collectProps(Ctor, this.element, this.defaultProps_);
+
+    // While this "creates" a new element, diffing will not create a second
+    // instance of Component. Instead, the existing one already rendered into
+    // this element will be reused.
+    const cv = createElement(Ctor.Component, props);
+
+    const v = createElement(withAmpContext, this.context_, cv);
+
+    render(v, this.container_);
+
+    const deferred = this.scheduledRenderDeferred_;
+    if (deferred) {
+      deferred.resolve();
+      this.scheduledRenderDeferred_ = null;
+    }
+  }
+}
+
+// Ideally, these would be Static Class Fields. But Closure can't even.
+
+/**
+ * Override to provide the Component definition.
+ *
+ * @protected {!Preact.FunctionalComponent}
+ */
+PreactBaseElement.Component = function() {
+  devAssert(false, 'Must provide Component');
+};
+
+/**
+ * An override to specify an exact className prop to Preact.
+ *
+ * @protected {string}
+ */
+PreactBaseElement.className = '';
+
+/**
+ * Enabling passthrough mode alters the children slotting to use a single
+ * `<slot>` element for all children. This is in contrast to children mode,
+ * which creates a new named `<slot>` for every child.
+ *
+ * @protected {boolean}
+ */
+PreactBaseElement.passthrough = false;
+
+/**
+ * Provides a mapping of Preact prop to AmpElement DOM attributes.
+ *
+ * @protected {!Object<string, !AmpElementPropDef>}
+ */
+PreactBaseElement.props = {};
+
+/**
+ * @protected {!Object<string, !ChildDef>|null}
+ */
+PreactBaseElement.children = null;
+
+/**
+ * @param {typeof PreactBaseElement} Ctor
+ * @param {!AmpElement} element
+ * @param {!JsonObject|null|undefined} defaultProps
+ * @return {!JsonObject}
+ */
+function collectProps(Ctor, element, defaultProps) {
+  const props = /** @type {!JsonObject} */ ({...defaultProps});
+
+  const {
+    className,
+    props: propDefs,
+    passthrough,
+    children: childrenDefs,
+  } = Ctor;
+
+  // Class.
+  if (className) {
+    props['className'] = className;
+  }
+
+  // Props.
+  for (const name in propDefs) {
+    const def = propDefs[name];
+    const value = element.getAttribute(def.attr);
+    if (value == null) {
+      props[name] = def.default;
+    } else {
+      const v =
+        def.type == 'number'
+          ? Number(value)
+          : def.type == 'Element'
+          ? // TBD: what's the best way for element referencing compat between
+            // React and AMP? Currently modeled as a Ref.
+            {current: element.getRootNode().getElementById(value)}
+          : value;
+      props[name] = v;
+    }
+  }
+
+  // Children.
+  // There are plain "children" and there're slotted children assigned
+  // as separate properties. Thus in a carousel the plain "children" are
+  // slides, and the "arrowNext" children are passed via a "arrowNext"
+  // property.
+  if (passthrough) {
+    devAssert(
+      !childrenDefs,
+      'only one of "passthrough" or "children" may be given'
+    );
+    props['children'] = [createElement(Slot)];
+  } else if (childrenDefs) {
+    const children = [];
+    props['children'] = children;
+
+    const nodes = element.getRealChildNodes();
+    for (let i = 0; i < nodes.length; i++) {
+      const childElement = nodes[i];
+      const def = matchChild(childElement, childrenDefs);
+      if (!def) {
+        continue;
+      }
+
+      const {single, name, props: slotProps = {}} = def;
+
+      // TBD: assign keys, reuse slots, etc.
+      if (single) {
+        props[name] = createSlot(childElement, `i-amphtml-${name}`, slotProps);
+      } else {
+        const list =
+          name == 'children' ? children : props[name] || (props[name] = []);
+        list.push(
+          createSlot(
+            childElement,
+            `i-amphtml-${name}-${list.length}`,
+            slotProps
+          )
+        );
+      }
+    }
+  }
+
+  return props;
+}
+
+/**
+ * @param {!Element} element
+ * @param {!Object} defs
+ * @return {?ChildDef}
+ */
+function matchChild(element, defs) {
+  // TODO: a little slow to do this repeatedly.
+  for (const match in defs) {
+    const def = defs[match];
+    const selector = typeof def == 'string' ? def : def.selector;
+    if (matches(element, selector)) {
+      return def;
+    }
+  }
+  return null;
+}
diff --git a/src/preact/context.js b/src/preact/context.js
new file mode 100644
index 0000000000000..ff6b85b8c715b
--- /dev/null
+++ b/src/preact/context.js
@@ -0,0 +1,62 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {createContext, createElement, useContext} from './index';
+
+/** @type {Preact.Context} */
+let context;
+
+/**
+ * The external context given to React components to control whether they can
+ * render/play/etc.
+ *
+ * - renderable: whether this vDOM area is renderable. Analogous to
+ *   `display-locking` CSS.
+ * - playable: whether the playback is allowed in this vDOM area. If playback
+ *   is not allow, the component must immediately stop the playback.
+ *
+ * @return {!Preact.Context}
+ */
+export function getAmpContext() {
+  return (
+    context ||
+    (context = createContext({
+      'renderable': true,
+      'playable': true,
+    }))
+  );
+}
+
+/**
+ * A wrapper-component that recalculates and propagates AmpContext properties.
+ *
+ * @param {!JsonObject} props
+ * @return {!Preact.VNode}
+ */
+export function withAmpContext(props) {
+  const parent = useContext(getAmpContext());
+  const current = {
+    ...props,
+    'renderable': parent['renderable'] && props['renderable'],
+    'playable': parent['playable'] && props['playable'],
+    'children': undefined,
+  };
+
+  return createElement(getAmpContext().Provider, {
+    children: props['children'],
+    value: current,
+  });
+}
diff --git a/src/preact/index.js b/src/preact/index.js
new file mode 100644
index 0000000000000..1cf4eb109abf5
--- /dev/null
+++ b/src/preact/index.js
@@ -0,0 +1,108 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import * as hooks from /*OK*/ 'preact/hooks';
+import * as preact from /*OK*/ 'preact';
+
+// Defines the type interfaces for the approved Preact APIs.
+// TODO: hydrate, isValidElement, Component, cloneElement, toChildArray
+
+/**
+ * @param {!Preact.FunctionalComponent|string} unusedType
+ * @param {(!Object|null)=} unusedProps
+ * @param {...*} var_args
+ * @return {!Preact.VNode}
+ */
+export function createElement(unusedType, unusedProps, var_args) {
+  return preact.createElement.apply(undefined, arguments);
+}
+
+/**
+ * @param {!Preact.VNode} vnode
+ * @param {Node} container
+ */
+export function render(vnode, container) {
+  preact.render(vnode, container, undefined);
+}
+
+/**
+ * @param {!JsonObject} props
+ * @return {Preact.Renderable}
+ */
+export function Fragment(props) {
+  return preact.Fragment(props);
+}
+
+/**
+ * @return {{current: (T|null)}}
+ * @template T
+ */
+export function createRef() {
+  return preact.createRef();
+}
+
+/**
+ * @param {!Object} value
+ * @return {!Preact.Context}
+ */
+export function createContext(value) {
+  return preact.createContext(value);
+}
+
+// Defines the type interfaces for the approved Preact Hooks APIs.
+// TODO: useReducer, useImperativeHandle, useMemo, useCallback, useDebugValue, useErrorBoundary
+
+/**
+ * @param {S|function():S} initial
+ * @return {{0: S, 1: function((S|function(S):S)):undefined}}
+ * @template S
+ */
+export function useState(initial) {
+  return hooks.useState(initial);
+}
+
+/**
+ * @param {T|null} initial
+ * @return {{current: (T|null)}}
+ * @template T
+ */
+export function useRef(initial) {
+  return hooks.useRef(initial);
+}
+
+/**
+ * @param {function():(function():undefined|undefined)} effect
+ * @param {!Array<*>=} opt_deps
+ */
+export function useEffect(effect, opt_deps) {
+  hooks.useEffect(effect, opt_deps);
+}
+
+/**
+ * @param {function():(function():undefined|undefined)} effect
+ * @param {!Array<*>=} opt_deps
+ */
+export function useLayoutEffect(effect, opt_deps) {
+  hooks.useLayoutEffect(effect, opt_deps);
+}
+
+/**
+ * @param {Preact.Context} context
+ * @return {!JsonObject}
+ */
+export function useContext(context) {
+  return hooks.useContext(context);
+}
diff --git a/src/preact/slot.js b/src/preact/slot.js
new file mode 100644
index 0000000000000..da39ecab64158
--- /dev/null
+++ b/src/preact/slot.js
@@ -0,0 +1,177 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {createElement, useContext, useEffect, useRef} from './index';
+import {dev} from '../log';
+import {getAmpContext} from './context';
+import {matches, toggleAttribute} from '../dom';
+import {objectsEqualShallow} from '../utils/object';
+import {toArray} from '../types';
+import {useMountEffect} from './utils';
+
+/**
+ * @param {!Element} element
+ * @param {string} name
+ * @param {!Object|undefined} props
+ * @return {!Preact.VNode}
+ */
+export function createSlot(element, name, props) {
+  element.setAttribute('slot', name);
+  const slotProps = {name, ...(props || {})};
+  return createElement(Slot, slotProps);
+}
+
+/**
+ * Slot component.
+ *
+ * @param {!JsonObject} props
+ * @return {!Preact.VNode}
+ */
+export function Slot(props) {
+  const context = useContext(getAmpContext());
+  const ref = useRef(null);
+  const slotProps = {...props, ref};
+  useEffect(() => {
+    const slot = dev().assertElement(ref.current);
+    const assignedElements = getAssignedElements(props, slot);
+    slot.__assignedElements = assignedElements;
+
+    // TBD: Just for debug for now. but maybe can also be used for hydration?
+    slot.setAttribute('i-amphtml-context', JSON.stringify(context));
+    // TODO: remove debug info.
+    assignedElements.forEach(node => {
+      node.__assignedSlot = slot;
+      node.setAttribute('i-amphtml-context', JSON.stringify(context));
+    });
+
+    // Retarget slots and content.
+    if (props['retarget']) {
+      // TBD: retargetting here is for:
+      // 1. `disabled` doesn't apply inside subtrees. This makes it more like
+      //    `hidden`. Similarly do other attributes.
+      // 2. Re-propagate click events to slots since React stops propagation.
+      //    See https://github.com/facebook/react/issues/9242.
+      assignedElements.forEach(node => {
+        // Basic attributes:
+        const {attributes} = slot;
+        for (let i = 0, l = attributes.length; i < l; i++) {
+          const {name, value} = attributes[i];
+          if (
+            name == 'name' ||
+            name == 'class' ||
+            name == 'style' ||
+            name == 'i-amphtml-context'
+          ) {
+            // This is the slot's name or other internal attributes.
+          } else {
+            // TBD: switch to explicit definition of "supported" attributes.
+            node.setAttribute(name, value);
+          }
+        }
+        // Boolean attributes:
+        node.disabled = slot.hasAttribute('disabled');
+        node.hidden = slot.hasAttribute('hidden');
+        toggleAttribute(node, 'selected', slot.hasAttribute('selected'));
+        toggleAttribute(node, 'expanded', slot.hasAttribute('expanded'));
+        if (!node['i-amphtml-event-distr']) {
+          node['i-amphtml-event-distr'] = true;
+          node.addEventListener('click', e => {
+            // Stop propagation on the original event to avoid deliving this
+            // event twice with frameworks that correctly work with composed
+            // boundaries.
+            e.stopPropagation();
+            e.preventDefault();
+            const event = new Event('click', {
+              bubbles: true,
+              cancelable: true,
+              composed: false,
+            });
+            slot.dispatchEvent(event);
+          });
+        }
+      });
+    }
+
+    const oldContext = slot['i-amphtml-context'];
+    if (!objectsEqualShallow(oldContext, context)) {
+      slot['i-amphtml-context'] = context;
+      // TODO: Switch to fast child-node discover. See Revamp for the algo.
+      const affectedNodes = [];
+      assignedElements.forEach(node => {
+        node['i-amphtml-context'] = context;
+        affectedNodes.push.apply(affectedNodes, getAmpElements(node));
+      });
+      affectedNodes.forEach(node => {
+        const event = new Event('i-amphtml-context-changed', {
+          bubbles: false,
+          cancelable: true,
+          composed: true,
+        });
+        event.data = context;
+        node.dispatchEvent(event);
+      });
+    }
+
+    // Post-rendering cleanup, if any.
+    if (props['postRender']) {
+      props['postRender']();
+    }
+  });
+
+  // Register an unmount listener. This can't be joined with the previous
+  // useEffect, because it must only be run once while the previous needs to
+  // run every render.
+  useMountEffect(() => {
+    return () => {
+      const slot = dev().assertElement(ref.current);
+      const affectedNodes = [];
+      getAssignedElements(props, slot).forEach(node => {
+        affectedNodes.push.apply(affectedNodes, getAmpElements(node));
+      });
+      affectedNodes.forEach(node => {
+        const event = new Event('i-amphtml-unmounted', {
+          bubbles: false,
+          cancelable: true,
+          composed: true,
+        });
+        node.dispatchEvent(event);
+      });
+    };
+  });
+
+  return createElement('slot', slotProps);
+}
+
+/**
+ * @param {!Element} root
+ * @return {!Array<!Node>}
+ */
+function getAmpElements(root) {
+  const elements = toArray(root.querySelectorAll('.i-amphtml-element'));
+  if (matches(root, '.i-amphtml-element')) {
+    elements.unshift(root);
+  }
+  return elements;
+}
+
+/**
+ * @param {!Object} props
+ * @param {!Element} slotElement
+ * @return {!Array<!Element>}
+ */
+function getAssignedElements(props, slotElement) {
+  return props.assignedElements || toArray(slotElement.assignedElements());
+}
diff --git a/src/preact/utils.js b/src/preact/utils.js
new file mode 100644
index 0000000000000..3ec6a3c9e6f54
--- /dev/null
+++ b/src/preact/utils.js
@@ -0,0 +1,49 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {getAmpContext} from './context';
+import {useContext, useEffect, useLayoutEffect} from './index';
+
+/**
+ * @param {function()} callback
+ */
+export function useMountEffect(callback) {
+  useEffect(callback, [
+    /* mount-only effect*/
+  ]);
+}
+
+/**
+ * @param {function()} callback
+ */
+export function useMountLayoutEffect(callback) {
+  useLayoutEffect(callback, [
+    /* mount-only effect*/
+  ]);
+}
+
+/**
+ * Notifies Resources (if present) of a rerender in the component.
+ * Every functional component **must** use this helper.
+ */
+export function useResourcesNotify() {
+  const {'notify': notify} = useContext(getAmpContext());
+  useLayoutEffect(() => {
+    if (notify) {
+      notify();
+    }
+  });
+}
diff --git a/src/preconnect.js b/src/preconnect.js
index bf476f6dcd7f1..5ad433dcc2858 100644
--- a/src/preconnect.js
+++ b/src/preconnect.js
@@ -21,11 +21,10 @@
 
 import {Services} from './services';
 import {dev} from './log';
-import {getService, registerServiceBuilder} from './service';
 import {htmlFor} from './static-template';
 import {parseUrlDeprecated} from './url';
+import {registerServiceBuilder} from './service';
 import {startsWith} from './string';
-import {toWin} from './types';
 import {whenDocumentComplete} from './document-ready';
 
 const ACTIVE_CONNECTION_TIMEOUT_MS = 180 * 1000;
@@ -72,7 +71,7 @@ export function setPreconnectFeaturesForTesting(features) {
   preconnectFeatures = features;
 }
 
-class PreconnectService {
+export class PreconnectService {
   /**
    * @param {!Window} win
    */
@@ -319,70 +318,11 @@ class PreconnectService {
   }
 }
 
-export class Preconnect {
-  /**
-   * @param {!PreconnectService} preconnectService
-   * @param {!Element} element
-   */
-  constructor(preconnectService, element) {
-    /** @const @private {!PreconnectService} */
-    this.preconnectService_ = preconnectService;
-
-    /** @const @private {!Element} */
-    this.element_ = element;
-
-    /** @private {?./service/ampdoc-impl.AmpDoc} */
-    this.ampdoc_ = null;
-  }
-
-  /**
-   * @return {!./service/ampdoc-impl.AmpDoc}
-   * @private
-   */
-  getAmpdoc_() {
-    if (!this.ampdoc_) {
-      this.ampdoc_ = Services.ampdoc(this.element_);
-    }
-    return this.ampdoc_;
-  }
-
-  /**
-   * Preconnects to a URL. Always also does a dns-prefetch because
-   * browser support for that is better.
-   * @param {string} url
-   * @param {boolean=} opt_alsoConnecting Set this flag if you also just
-   *    did or are about to connect to this host. This is for the case
-   *    where preconnect is issued immediate before or after actual connect
-   *    and preconnect is used to flatten a deep HTTP request chain.
-   *    E.g. when you preconnect to a host that an embed will connect to
-   *    when it is more fully rendered, you already know that the connection
-   *    will be used very soon.
-   */
-  url(url, opt_alsoConnecting) {
-    this.preconnectService_.url(this.getAmpdoc_(), url, opt_alsoConnecting);
-  }
-
-  /**
-   * Asks the browser to preload a URL. Always also does a preconnect
-   * because browser support for that is better.
-   *
-   * @param {string} url
-   * @param {string=} opt_preloadAs
-   */
-  preload(url, opt_preloadAs) {
-    this.preconnectService_.preload(this.getAmpdoc_(), url, opt_preloadAs);
-  }
-}
-
 /**
- * @param {!Element} element
- * @return {!Preconnect}
+ * @param {!Window} window
  */
-export function preconnectForElement(element) {
-  const serviceHolder = toWin(element.ownerDocument.defaultView);
-  registerServiceBuilder(serviceHolder, 'preconnect', PreconnectService);
-  const preconnectService = getService(serviceHolder, 'preconnect');
-  return new Preconnect(preconnectService, element);
+export function installPreconnectService(window) {
+  registerServiceBuilder(window, 'preconnect', PreconnectService);
 }
 
 /**
@@ -394,10 +334,13 @@ export function preconnectForElement(element) {
  */
 export function preconnectToOrigin(document) {
   return whenDocumentComplete(document).then(() => {
-    const element = document.documentElement;
-    const preconnect = preconnectForElement(element);
-    const info = Services.documentInfoForDoc(element);
-    preconnect.url(info.sourceUrl);
-    preconnect.url(info.canonicalUrl);
+    const win = document.defaultView;
+    if (win) {
+      const preconnect = Services.preconnectFor(win);
+      const info = Services.documentInfoForDoc(document.documentElement);
+      const ampdoc = Services.ampdoc(document);
+      preconnect.url(ampdoc, info.sourceUrl);
+      preconnect.url(ampdoc, info.canonicalUrl);
+    }
   });
 }
diff --git a/src/purifier.js b/src/purifier.js
deleted file mode 100644
index 6e4bbd9aaedfe..0000000000000
--- a/src/purifier.js
+++ /dev/null
@@ -1,481 +0,0 @@
-/**
- * Copyright 2018 The AMP HTML Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {
-  BIND_PREFIX,
-  BLACKLISTED_TAGS,
-  EMAIL_WHITELISTED_AMP_TAGS,
-  TRIPLE_MUSTACHE_WHITELISTED_TAGS,
-  WHITELISTED_ATTRS,
-  WHITELISTED_ATTRS_BY_TAGS,
-  WHITELISTED_TARGETS,
-  isValidAttr,
-  markElementForDiffing,
-} from './sanitation';
-import {dev, user} from './log';
-import {isAmp4Email} from './format';
-import {removeElement} from './dom';
-import {rewriteAttributeValue} from './url-rewrite';
-import {startsWith} from './string';
-import purify from 'dompurify/dist/purify.es';
-
-/**
- * @typedef {{addHook: !Function, removeAllHooks: !Function, sanitize: !Function}}
- */
-export let DomPurifyDef;
-
-// TODO(choumx): Convert this into a class to avoid import side effects.
-/** @private @const {!DomPurifyDef} */
-const DomPurify = purify(self);
-
-/** @private @const {string} */
-const TAG = 'purifier';
-
-/**
- * Tags that are only whitelisted for specific values of given attributes.
- * @private @const {!Object<string, {attribute: string, values: !Array<string>}>}
- */
-const WHITELISTED_TAGS_BY_ATTRS = {
-  'script': {
-    'attribute': 'type',
-    'values': ['application/json', 'application/ld+json'],
-  },
-};
-
-const PURIFY_PROFILES = /** @type {!DomPurifyConfig} */ ({
-  USE_PROFILES: {
-    html: true,
-    svg: true,
-    svgFilters: true,
-  },
-});
-
-/**
- * Monotonically increasing counter used for keying nodes.
- * @private {number}
- */
-let KEY_COUNTER = 1;
-
-/**
- * Returns a <body> element containing the sanitized `dirty` markup.
- * Uses the standard DOMPurify config.
- * @param {string} dirty
- * @param {!Document} doc
- * @return {!Node}
- */
-export function purifyHtml(dirty, doc) {
-  const config = standardPurifyConfig();
-  addPurifyHooks(DomPurify, doc);
-  const body = DomPurify.sanitize(dirty, config);
-  DomPurify.removeAllHooks();
-  return body;
-}
-
-/**
- * Creates a new DOMPurify instance with a custom DOMPurify configuration.
- * @param {!Document} doc
- * @param {!JsonObject=} opt_config
- * @return {!DomPurifyDef}
- */
-export function createPurifier(doc, opt_config) {
-  const domPurify = purify(self);
-  const config = Object.assign(opt_config || {}, standardPurifyConfig());
-  domPurify.setConfig(config);
-  addPurifyHooks(domPurify, doc);
-  return domPurify;
-}
-
-/**
- * Returns standard DOMPurify config for escaped templates.
- * Do not use for unescaped templates.
- *
- * NOTE: See that we use DomPurifyConfig found in
- * build-system/dompurify.extern.js as the exact type. This is to prevent
- * closure compiler from optimizing these fields here in this file and in the
- * 3rd party library file. See #19624 for further information.
- *
- * @return {!DomPurifyConfig}
- */
-function standardPurifyConfig() {
-  const config = Object.assign(
-    {},
-    PURIFY_PROFILES,
-    /** @type {!DomPurifyConfig} */ ({
-      ADD_ATTR: WHITELISTED_ATTRS,
-      // <use> is an SVG element that is not allowed by default in DOMPurify.
-      // See afterSanitizeAttributes() for special handling.
-      ADD_TAGS: ['use'],
-      FORBID_TAGS: Object.keys(BLACKLISTED_TAGS),
-      // Avoid reparenting of some elements to document head e.g. <script>.
-      FORCE_BODY: true,
-      // Avoid need for serializing to/from string by returning Node directly.
-      RETURN_DOM: true,
-      // Allows native app deeplinks. DOMPurify's remaining checks are
-      // sufficient to prevent code execution.
-      ALLOW_UNKNOWN_PROTOCOLS: true,
-    })
-  );
-  return /** @type {!DomPurifyConfig} */ (config);
-}
-
-/**
- * Gets a copy of the map of allowed tag names (standard DOMPurify config).
- * @return {!Object<string, boolean>}
- */
-export function getAllowedTags() {
-  const allowedTags = {};
-  // Use this hook to extract purifier's allowed tags.
-  DomPurify.addHook('uponSanitizeElement', function(node, data) {
-    Object.assign(allowedTags, data.allowedTags);
-  });
-  // Sanitize dummy markup so that the hook is invoked.
-  DomPurify.sanitize('<p></p>');
-  Object.keys(BLACKLISTED_TAGS).forEach(tag => {
-    allowedTags[tag] = false;
-  });
-  // Pops the last hook added.
-  DomPurify.removeHook('uponSanitizeElement');
-  return allowedTags;
-}
-
-/**
- * Adds AMP hooks to given DOMPurify object.
- * @param {!DomPurifyDef} purifier
- * @param {!Document} doc
- */
-function addPurifyHooks(purifier, doc) {
-  const isEmail = isAmp4Email(doc);
-
-  // Reference to DOMPurify's `allowedTags` whitelist.
-  let allowedTags;
-  const allowedTagsChanges = [];
-
-  // Reference to DOMPurify's `allowedAttributes` whitelist.
-  let allowedAttributes;
-  const allowedAttributesChanges = [];
-
-  /**
-   * @param {!Node} node
-   * @param {{tagName: string, allowedTags: !Object<string, boolean>}} data
-   */
-  const uponSanitizeElement = function(node, data) {
-    const {tagName} = data;
-    allowedTags = data.allowedTags;
-
-    // Allow all AMP elements.
-    if (startsWith(tagName, 'amp-')) {
-      // Enforce AMP4EMAIL tag whitelist at runtime.
-      allowedTags[tagName] = !isEmail || EMAIL_WHITELISTED_AMP_TAGS[tagName];
-    }
-    // Set `target` attribute for <a> tags if necessary.
-    if (tagName === 'a') {
-      const element = dev().assertElement(node);
-      if (element.hasAttribute('href') && !element.hasAttribute('target')) {
-        element.setAttribute('target', '_top');
-      }
-    }
-    // Allow certain tags if they have an attribute with a whitelisted value.
-    const whitelist = WHITELISTED_TAGS_BY_ATTRS[tagName];
-    if (whitelist) {
-      const {attribute, values} = whitelist;
-      const element = dev().assertElement(node);
-      if (
-        element.hasAttribute(attribute) &&
-        values.includes(element.getAttribute(attribute))
-      ) {
-        allowedTags[tagName] = true;
-        allowedTagsChanges.push(tagName);
-      }
-    }
-  };
-
-  /**
-   * @param {!Node} unusedNode
-   */
-  const afterSanitizeElements = function(unusedNode) {
-    // DOMPurify doesn't have a attribute-specific tag whitelist API and
-    // `allowedTags` has a per-invocation scope, so we need to undo
-    // changes after sanitizing elements.
-    allowedTagsChanges.forEach(tag => {
-      delete allowedTags[tag];
-    });
-    allowedTagsChanges.length = 0;
-  };
-
-  /**
-   * @param {!Element} element
-   * @param {{attrName: string, attrValue: string, allowedAttributes: !Object<string, boolean>}} data
-   */
-  const uponSanitizeAttribute = function(element, data) {
-    // Beware of DOM Clobbering when using properties or functions on `element`.
-    // DOMPurify checks a few of these for its internal usage (e.g. `nodeName`),
-    // but not others that may be used in custom hooks.
-    // See https://github.com/cure53/DOMPurify/wiki/Security-Goals-&-Threat-Model#security-goals
-    // and https://github.com/cure53/DOMPurify/blob/master/src/purify.js#L527.
-
-    const tagName = element.nodeName.toLowerCase();
-    const {attrName} = data;
-    let {attrValue} = data;
-    allowedAttributes = data.allowedAttributes;
-
-    const allowAttribute = () => {
-      // Only add new attributes to `allowedAttributesChanges` to avoid removing
-      // default-supported attributes later erroneously.
-      if (!allowedAttributes[attrName]) {
-        allowedAttributes[attrName] = true;
-        allowedAttributesChanges.push(attrName);
-      }
-    };
-
-    // Allow all attributes for AMP elements. This avoids the need to whitelist
-    // nonstandard attributes for every component e.g. amp-lightbox[scrollable].
-    const isAmpElement = startsWith(tagName, 'amp-');
-    if (isAmpElement) {
-      allowAttribute();
-    } else {
-      // `<A>` has special target rules:
-      // - Default target is "_top";
-      // - Allowed targets are "_blank", "_top";
-      // - All other targets are rewritted to "_top".
-      if (tagName == 'a' && attrName == 'target') {
-        const lowercaseValue = attrValue.toLowerCase();
-        if (!WHITELISTED_TARGETS.includes(lowercaseValue)) {
-          attrValue = '_top';
-        } else {
-          // Always use lowercase values for `target` attr.
-          attrValue = lowercaseValue;
-        }
-      }
-
-      // For non-AMP elements, allow attributes in tag-specific whitelist.
-      const attrsByTags = WHITELISTED_ATTRS_BY_TAGS[tagName];
-      if (attrsByTags && attrsByTags.includes(attrName)) {
-        allowAttribute();
-      }
-    }
-
-    const bindingType = bindingTypeForAttr(attrName);
-    // Rewrite classic bindings e.g. [foo]="bar" -> data-amp-bind-foo="bar".
-    // This is because DOMPurify eagerly removes attributes and re-adds them
-    // after sanitization, which fails because `[]` are not valid attr chars.
-    if (bindingType === BindingType.CLASSIC) {
-      const property = attrName.substring(1, attrName.length - 1);
-      element.setAttribute(`${BIND_PREFIX}${property}`, attrValue);
-    }
-    if (bindingType !== BindingType.NONE) {
-      // Set a custom attribute to mark this element as containing a binding.
-      // This is an optimization that obviates the need for DOM scan later.
-      element.setAttribute('i-amphtml-binding', '');
-    }
-
-    if (
-      isValidAttr(
-        tagName,
-        attrName,
-        attrValue,
-        /* doc */ doc,
-        /* opt_purify */ true
-      )
-    ) {
-      if (attrValue && !startsWith(attrName, 'data-amp-bind-')) {
-        attrValue = rewriteAttributeValue(tagName, attrName, attrValue);
-      }
-    } else {
-      data.keepAttr = false;
-      user().error(
-        TAG,
-        'Removed invalid attribute %s[%s="%s"].',
-        tagName,
-        attrName,
-        attrValue
-      );
-    }
-
-    // Update attribute value.
-    data.attrValue = attrValue;
-  };
-
-  /**
-   * @param {!Element} element
-   * @this {{removed: !Array}} Contains list of removed elements/attrs so far.
-   */
-  const afterSanitizeAttributes = function(element) {
-    markElementForDiffing(element, () => String(KEY_COUNTER++));
-
-    // DOMPurify doesn't have a tag-specific attribute whitelist API and
-    // `allowedAttributes` has a per-invocation scope, so we need to undo
-    // changes after sanitizing attributes.
-    allowedAttributesChanges.forEach(attr => {
-      delete allowedAttributes[attr];
-    });
-    allowedAttributesChanges.length = 0;
-
-    // Only allow relative references in <use>.
-    const tagName = element.nodeName.toLowerCase();
-    if (tagName === 'use') {
-      ['href', 'xlink:href'].forEach(attr => {
-        if (
-          element.hasAttribute(attr) &&
-          !startsWith(element.getAttribute(attr), '#')
-        ) {
-          removeElement(element);
-          user().error(
-            TAG,
-            'Removed invalid <use>. use[href] must start with "#".'
-          );
-        }
-      });
-    }
-  };
-
-  purifier.addHook('uponSanitizeElement', uponSanitizeElement);
-  purifier.addHook('afterSanitizeElements', afterSanitizeElements);
-  purifier.addHook('uponSanitizeAttribute', uponSanitizeAttribute);
-  purifier.addHook('afterSanitizeAttributes', afterSanitizeAttributes);
-}
-
-/**
- * @enum {number}
- */
-const BindingType = {
-  NONE: 0,
-  CLASSIC: 1,
-  ALTERNATIVE: 2,
-};
-
-/**
- * @param {string} attrName
- * @return {BindingType}
- */
-function bindingTypeForAttr(attrName) {
-  if (attrName[0] == '[' && attrName[attrName.length - 1] == ']') {
-    return BindingType.CLASSIC;
-  }
-  if (startsWith(attrName, BIND_PREFIX)) {
-    return BindingType.ALTERNATIVE;
-  }
-  return BindingType.NONE;
-}
-
-/**
- * Returns whether an attribute addition/modification/removal is valid.
- *
- * This function's behavior should match that of addPurifyHooks(), except
- * that it operates on attribute changes instead of rendering new HTML.
- *
- * @param {!DomPurifyDef} purifier
- * @param {!Node} node
- * @param {string} attr Lower-case attribute name.
- * @param {string|null} value
- * @return {boolean}
- */
-export function validateAttributeChange(purifier, node, attr, value) {
-  const tag = node.nodeName.toLowerCase();
-  // Disallow change of attributes that are required for certain tags,
-  // e.g. script[type].
-  const whitelist = WHITELISTED_TAGS_BY_ATTRS[tag];
-  if (whitelist) {
-    const {attribute, values} = whitelist;
-    if (attribute === attr) {
-      if (value == null || !values.includes(value)) {
-        return false;
-      }
-    }
-  }
-  // a[target] is required and only certain values are allowed.
-  if (tag === 'a' && attr === 'target') {
-    if (value == null || !WHITELISTED_TARGETS.includes(value)) {
-      return false;
-    }
-  }
-  // By now, the attribute is safe to remove.  DOMPurify.isValidAttribute()
-  // expects non-null values.
-  if (value == null) {
-    return true;
-  }
-  // Don't allow binding attributes for now.
-  if (bindingTypeForAttr(attr) !== BindingType.NONE) {
-    return false;
-  }
-  const pure = purifier.isValidAttribute(tag, attr, value);
-  if (!pure) {
-    // DOMPurify.isValidAttribute() by default rejects certain attributes that
-    // we should allow: (1) AMP element attributes, (2) tag-specific attributes.
-    // Reject if _not_ one of the above.
-    //
-    // TODO(choumx): This opts out of DOMPurify's attribute _value_ sanitization
-    // for the above, which assumes that the attributes don't have security
-    // implications beyond URLs etc. that are covered by isValidAttr().
-    // This is OK but we ought to contribute new hooks and remove this.
-    const attrsByTags = WHITELISTED_ATTRS_BY_TAGS[tag];
-    const whitelistedForTag = attrsByTags && attrsByTags.includes(attr);
-    if (!whitelistedForTag && !startsWith(tag, 'amp-')) {
-      return false;
-    }
-  }
-  const doc = node.ownerDocument
-    ? node.ownerDocument
-    : /** @type {!Document} */ (node);
-  // Perform AMP-specific attribute validation e.g. __amp_source_origin.
-  if (value && !isValidAttr(tag, attr, value, doc, /* opt_purify */ true)) {
-    return false;
-  }
-  return true;
-}
-
-/**
- * Uses DOMPurify to sanitize HTML with stricter policy for unescaped templates
- * e.g. triple mustache.
- *
- * @param {string} html
- * @param {!Document=} doc
- * @return {string}
- */
-export function purifyTagsForTripleMustache(html, doc = self.document) {
-  // Reference to DOMPurify's `allowedTags` whitelist.
-  let allowedTags;
-  DomPurify.addHook('uponSanitizeElement', (node, data) => {
-    const {tagName} = data;
-    allowedTags = data.allowedTags;
-    if (tagName === 'template') {
-      const type = node.getAttribute('type');
-      if (type && type.toLowerCase() === 'amp-mustache') {
-        allowedTags['template'] = true;
-      }
-    }
-  });
-  DomPurify.addHook('afterSanitizeElements', unusedNode => {
-    // DOMPurify doesn't have an required-attribute tag whitelist API and
-    // `allowedTags` has a per-invocation scope, so we need to remove
-    // required-attribute tags after sanitizing each element.
-    allowedTags['template'] = false;
-  });
-  // <template> elements are parsed by the browser as document fragments and
-  // reparented to the head. So to support nested templates, we need
-  // RETURN_DOM_FRAGMENT to keep the <template> and FORCE_BODY to prevent
-  // reparenting. See https://github.com/cure53/DOMPurify/issues/285#issuecomment-397810671
-  const fragment = DomPurify.sanitize(html, {
-    'ALLOWED_TAGS': TRIPLE_MUSTACHE_WHITELISTED_TAGS,
-    'FORCE_BODY': true,
-    'RETURN_DOM_FRAGMENT': true,
-  });
-  DomPurify.removeAllHooks();
-  // Serialize DocumentFragment to HTML. XMLSerializer would also work, but adds
-  // namespaces for all elements and attributes.
-  const div = doc.createElement('div');
-  div.appendChild(fragment);
-  return div./*OK*/ innerHTML;
-}
diff --git a/src/purifier/README.md b/src/purifier/README.md
new file mode 100644
index 0000000000000..0dc0bbe4ea81e
--- /dev/null
+++ b/src/purifier/README.md
@@ -0,0 +1,152 @@
+# AMP Purifier
+
+[![npm package](https://img.shields.io/npm/v/@ampproject/purifier)](https://www.npmjs.com/package/@ampproject/purifier)
+
+The AMP Purifier library contains an AMP-specific configuration for [DOMPurify](https://github.com/cure53/DOMPurify).
+
+This library is internally used by [`amp-mustache`](https://amp.dev/documentation/components/amp-mustache/)
+to sanitize rendered Mustache.js templates before displaying them.
+
+## Installation
+
+Install via:
+
+```sh
+npm i @ampproject/purifier
+```
+
+## Usage
+
+```js
+import {Purifier} from '@ampproject/purifier';
+
+const purifier = new Purifier(document);
+purifier.purifyHtml('a<script>b</script>c'); // "ac"
+```
+
+### Usage with Mustache.js
+
+```js
+import Mustache from 'mustache';
+import {Purifier} from '@ampproject/purifier';
+
+const purifier = new Purifier(document);
+const _unescapedValue = Mustache.Writer.prototype.unescapedValue;
+Mustache.Writer.prototype.unescapedValue = function(token, context) {
+  const result = _unescapedValue(token, context);
+  return purifier.purifyTagsForTripleMustache(result);
+};
+const html = Mustache.render(template, data);
+
+const body = purifier.purifyHtml(html);
+for (const child of body.children) {
+  targetElement.appendChild(child);
+}
+```
+
+## Reference
+
+The library has only a single export, the `Purifier` class.
+
+### `Purifier` constructor
+
+`new Purifier(doc, config, attrRewrite)`
+
+#### `doc`
+
+The base document to use. Usually `window.document`.
+
+#### `config`
+
+_Optional_
+
+[DOMPurify configuration](https://github.com/cure53/DOMPurify#can-i-configure-dompurify)
+to use in addition to the AMP default one.
+
+#### `attrRewrite`
+
+_Optional_
+
+A function that, if provided, will be called for every sanitized attribute in
+the output to change its value. It accepts the following attributes:
+
+- `tagName` - name of tag containing the attribute
+- `attrName` - name of attribute
+- `attrValue` - current attribute value
+
+The returned value of this function is used as the new attribute value.
+
+For example, this replaces the `href` of all `<a>` elements with example.com:
+
+```js
+new Purifier(window.document, {}, (tagName, attrName, attrValue) => {
+  if (tagName === 'a' && attrName === 'href') {
+    return 'https://google.com';
+  }
+  return attrValue;
+});
+```
+
+### `purifyHtml`
+
+`purifyHtml(html)`
+
+Uses DOMPurify to sanitize HTML in a way that ensures the fragment is valid AMP.
+
+#### `html`
+
+The HTML code to sanitize (purify).
+
+#### Return value
+
+A <body> element containing the sanitized `html` markup.
+
+### `purifyTagsForTripleMustache`
+
+`purifyTagsForTripleMustache(html)`
+
+Uses DOMPurify to sanitize HTML with stricter policy for unescaped templates
+e.g. triple mustache. See [`amp-mustache` documentation](https://amp.dev/documentation/components/amp-mustache/#validation)
+for more information.
+
+#### `html`
+
+The HTML code to sanitize (purify).
+
+#### Return value
+
+Sanitized HTML (as a string).
+
+### `getAllowedTags`
+
+`getAllowedTags()`
+
+Gets a copy of the map of allowed tag names (standard DOMPurify config).
+
+#### Return value
+
+An object containing the list of allowed tags according to AMP's DOMPurify
+config.
+
+### `validateAttributeChange`
+
+Returns whether an attribute addition/modification/removal is valid according to
+AMP's DOMPurify config.
+
+`validateAttributeChange(node, attr, value)`
+
+#### `node`
+
+DOM node to check.
+
+#### `attr`
+
+Attribute name.
+
+#### `value`
+
+Attribute value (can be null).
+
+#### Return value
+
+`true` if the given attribute change is valid, `false` otherwise.
diff --git a/src/purifier/noop.js b/src/purifier/noop.js
new file mode 100644
index 0000000000000..7f1bb9979c8da
--- /dev/null
+++ b/src/purifier/noop.js
@@ -0,0 +1,38 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export function dev() {
+  return {
+    assertElement: element => {
+      console.assert(element && element.nodeType == 1, 'Element expected');
+      return element;
+    },
+  };
+}
+
+export function user() {
+  return {
+    error: (unusedTag, var_args) => {
+      console.error.apply(null, Array.prototype.slice.call(arguments, 1));
+    },
+  };
+}
+
+export function devAssert() {}
+
+export function userAssert() {}
+
+export const urls = {};
diff --git a/src/purifier/package.json b/src/purifier/package.json
new file mode 100644
index 0000000000000..c79a44fc83fa9
--- /dev/null
+++ b/src/purifier/package.json
@@ -0,0 +1,31 @@
+{
+  "name": "@ampproject/purifier",
+  "version": "1.0.2",
+  "description": "AMP-specific sanitization library",
+  "author": "The AMP HTML Authors",
+  "license": "Apache-2.0",
+  "main": "dist/purifier.js",
+  "module": "dist/purifier.mjs",
+  "types": "purifier.d.ts",
+  "files": ["dist/*", "purifier.d.ts"],
+  "scripts": {
+    "build": "rollup -c rollup.config.js"
+  },
+  "keywords": ["amp", "sanitizer", "sanitize", "purify"],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ampproject/amphtml.git",
+    "directory": "src/purifier"
+  },
+  "homepage": "https://github.com/ampproject/amphtml/tree/master/src/purifier",
+  "devDependencies": {
+    "@rollup/plugin-alias": "3.0.0",
+    "rollup": "1.29.1"
+  },
+  "dependencies": {
+    "dompurify": "2.0.7"
+  },
+  "optionalDependencies": {
+    "@types/dompurify": "2.0.1"
+  }
+}
diff --git a/src/purifier/purifier.d.ts b/src/purifier/purifier.d.ts
new file mode 100644
index 0000000000000..b539bb0a0bfcb
--- /dev/null
+++ b/src/purifier/purifier.d.ts
@@ -0,0 +1,40 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/// <reference types="dompurify"/>
+
+export type AttributeRewriterDef = (
+  tagName: string,
+  attrName: string,
+  attrValue: string
+) => string;
+
+export class Purifier {
+  constructor(
+    doc: Document,
+    opt_config?: DOMPurify.Config,
+    opt_attrRewrite?: AttributeRewriterDef
+  );
+
+  purifyHtml(dirty: string): HTMLElement;
+  purifyTagsForTripleMustache(dirty: string): string;
+  getAllowedTags(): {[key: string]: boolean};
+  validateAttributeChange(
+    node: Node,
+    attr: string,
+    value: string | null
+  ): boolean;
+}
diff --git a/src/purifier/purifier.js b/src/purifier/purifier.js
new file mode 100644
index 0000000000000..0d28bb8da540e
--- /dev/null
+++ b/src/purifier/purifier.js
@@ -0,0 +1,490 @@
+/**
+ * Copyright 2018 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {
+  BIND_PREFIX,
+  BLACKLISTED_TAGS,
+  EMAIL_WHITELISTED_AMP_TAGS,
+  TRIPLE_MUSTACHE_WHITELISTED_TAGS,
+  WHITELISTED_ATTRS,
+  WHITELISTED_ATTRS_BY_TAGS,
+  WHITELISTED_TARGETS,
+  isValidAttr,
+  markElementForDiffing,
+} from './sanitation';
+import {dev, user} from '../log';
+import {isAmp4Email} from '../format';
+import {removeElement} from '../dom';
+import {startsWith} from '../string';
+import purify from 'dompurify';
+
+/** @private @const {string} */
+const TAG = 'purifier';
+
+/**
+ * Tags that are only whitelisted for specific values of given attributes.
+ * @private @const {!Object<string, {attribute: string, values: !Array<string>}>}
+ */
+const WHITELISTED_TAGS_BY_ATTRS = {
+  'script': {
+    'attribute': 'type',
+    'values': ['application/json', 'application/ld+json'],
+  },
+};
+
+const PURIFY_PROFILES = /** @type {!DomPurifyConfig} */ ({
+  USE_PROFILES: {
+    html: true,
+    svg: true,
+    svgFilters: true,
+  },
+});
+
+/**
+ * @typedef {{addHook: !Function, removeAllHooks: !Function, sanitize: !Function}}
+ */
+let DomPurifyDef;
+
+/**
+ * @typedef {function(string, string, string): string}
+ */
+export let AttributeRewriterDef;
+
+export class Purifier {
+  /**
+   * @param {!Document} doc
+   * @param {!JsonObject=} opt_config
+   * @param {!AttributeRewriterDef=} opt_attrRewrite
+   */
+  constructor(doc, opt_config, opt_attrRewrite) {
+    /** @private {!Document} */
+    this.doc_ = doc;
+
+    /**
+     * Monotonically increasing counter used for keying nodes.
+     * @private {number}
+     */
+    this.keyCounter_ = 1;
+
+    /** @private {!DomPurifyDef} */
+    this.domPurify_ = purify(self);
+
+    /** @private {!DomPurifyDef} */
+    this.domPurifyTriple_ = purify(self);
+
+    const config = Object.assign(opt_config || {}, standardPurifyConfig());
+    this.domPurify_.setConfig(config);
+    this.addPurifyHooks_(this.domPurify_, opt_attrRewrite);
+
+    this.addPurifyHooksTripleMustache_(this.domPurifyTriple_);
+  }
+
+  /**
+   * Returns a <body> element containing the sanitized `dirty` markup.
+   * Uses the standard DOMPurify config.
+   * @param {string} dirty
+   * @return {!Node}
+   */
+  purifyHtml(dirty) {
+    const body = this.domPurify_.sanitize(dirty);
+    return body;
+  }
+
+  /**
+   * Uses DOMPurify to sanitize HTML with stricter policy for unescaped templates
+   * e.g. triple mustache.
+   *
+   * @param {string} dirty
+   * @return {string}
+   */
+  purifyTagsForTripleMustache(dirty) {
+    // <template> elements are parsed by the browser as document fragments and
+    // reparented to the head. So to support nested templates, we need
+    // RETURN_DOM_FRAGMENT to keep the <template> and FORCE_BODY to prevent
+    // reparenting. See https://github.com/cure53/DOMPurify/issues/285#issuecomment-397810671
+    const fragment = this.domPurifyTriple_.sanitize(dirty, {
+      'ALLOWED_TAGS': TRIPLE_MUSTACHE_WHITELISTED_TAGS,
+      'FORCE_BODY': true,
+      'RETURN_DOM_FRAGMENT': true,
+    });
+    // Serialize DocumentFragment to HTML. XMLSerializer would also work, but adds
+    // namespaces for all elements and attributes.
+    const div = this.doc_.createElement('div');
+    div.appendChild(fragment);
+    return div./*OK*/ innerHTML;
+  }
+
+  /**
+   * Gets a copy of the map of allowed tag names (standard DOMPurify config).
+   * @return {!Object<string, boolean>}
+   */
+  getAllowedTags() {
+    const allowedTags = {};
+    // Use this hook to extract purifier's allowed tags.
+    this.domPurify_.addHook('uponSanitizeElement', (node, data) => {
+      Object.assign(allowedTags, data.allowedTags);
+    });
+    // Sanitize dummy markup so that the hook is invoked.
+    const p = this.doc_.createElement('p');
+    this.domPurify_.sanitize(p);
+    Object.keys(BLACKLISTED_TAGS).forEach(tag => {
+      allowedTags[tag] = false;
+    });
+    // Pops the last hook added.
+    this.domPurify_.removeHook('uponSanitizeElement');
+    return allowedTags;
+  }
+
+  /**
+   * Returns whether an attribute addition/modification/removal is valid.
+   *
+   * This function's behavior should match that of addPurifyHooks(), except
+   * that it operates on attribute changes instead of rendering new HTML.
+   *
+   * @param {!Node} node
+   * @param {string} attr Lower-case attribute name.
+   * @param {string|null} value
+   * @return {boolean}
+   */
+  validateAttributeChange(node, attr, value) {
+    const tag = node.nodeName.toLowerCase();
+    // Disallow change of attributes that are required for certain tags,
+    // e.g. script[type].
+    const whitelist = WHITELISTED_TAGS_BY_ATTRS[tag];
+    if (whitelist) {
+      const {attribute, values} = whitelist;
+      if (attribute === attr) {
+        if (value == null || !values.includes(value)) {
+          return false;
+        }
+      }
+    }
+    // a[target] is required and only certain values are allowed.
+    if (tag === 'a' && attr === 'target') {
+      if (value == null || !WHITELISTED_TARGETS.includes(value)) {
+        return false;
+      }
+    }
+    // By now, the attribute is safe to remove.  DOMPurify.isValidAttribute()
+    // expects non-null values.
+    if (value == null) {
+      return true;
+    }
+    // Don't allow binding attributes for now.
+    if (bindingTypeForAttr(attr) !== BindingType.NONE) {
+      return false;
+    }
+    const pure = this.domPurify_.isValidAttribute(tag, attr, value);
+    if (!pure) {
+      // DOMPurify.isValidAttribute() by default rejects certain attributes that
+      // we should allow: (1) AMP element attributes, (2) tag-specific attributes.
+      // Reject if _not_ one of the above.
+      //
+      // TODO(choumx): This opts out of DOMPurify's attribute _value_ sanitization
+      // for the above, which assumes that the attributes don't have security
+      // implications beyond URLs etc. that are covered by isValidAttr().
+      // This is OK but we ought to contribute new hooks and remove this.
+      const attrsByTags = WHITELISTED_ATTRS_BY_TAGS[tag];
+      const whitelistedForTag = attrsByTags && attrsByTags.includes(attr);
+      if (!whitelistedForTag && !startsWith(tag, 'amp-')) {
+        return false;
+      }
+    }
+    const doc = node.ownerDocument
+      ? node.ownerDocument
+      : /** @type {!Document} */ (node);
+    // Perform AMP-specific attribute validation e.g. __amp_source_origin.
+    if (value && !isValidAttr(tag, attr, value, doc, /* opt_purify */ true)) {
+      return false;
+    }
+    return true;
+  }
+
+  /**
+   * Adds AMP hooks to given DOMPurify object.
+   * @param {!DomPurifyDef} purifier
+   * @param {!AttributeRewriterDef|undefined} attrRewrite
+   * @private
+   */
+  addPurifyHooks_(purifier, attrRewrite) {
+    const isEmail = isAmp4Email(this.doc_);
+
+    // Reference to DOMPurify's `allowedTags` whitelist.
+    let allowedTags;
+    const allowedTagsChanges = [];
+
+    // Reference to DOMPurify's `allowedAttributes` whitelist.
+    let allowedAttributes;
+    const allowedAttributesChanges = [];
+
+    /**
+     * @param {!Node} node
+     * @param {{tagName: string, allowedTags: !Object<string, boolean>}} data
+     */
+    const uponSanitizeElement = (node, data) => {
+      const {tagName} = data;
+      allowedTags = data.allowedTags;
+
+      // Allow all AMP elements.
+      if (startsWith(tagName, 'amp-')) {
+        // Enforce AMP4EMAIL tag whitelist at runtime.
+        allowedTags[tagName] = !isEmail || EMAIL_WHITELISTED_AMP_TAGS[tagName];
+      }
+      // Set `target` attribute for <a> tags if necessary.
+      if (tagName === 'a') {
+        const element = dev().assertElement(node);
+        if (element.hasAttribute('href') && !element.hasAttribute('target')) {
+          element.setAttribute('target', '_top');
+        }
+      }
+      // Allow certain tags if they have an attribute with a whitelisted value.
+      const whitelist = WHITELISTED_TAGS_BY_ATTRS[tagName];
+      if (whitelist) {
+        const {attribute, values} = whitelist;
+        const element = dev().assertElement(node);
+        if (
+          element.hasAttribute(attribute) &&
+          values.includes(element.getAttribute(attribute))
+        ) {
+          allowedTags[tagName] = true;
+          allowedTagsChanges.push(tagName);
+        }
+      }
+    };
+
+    /**
+     * @param {!Node} unusedNode
+     */
+    const afterSanitizeElements = unusedNode => {
+      // DOMPurify doesn't have a attribute-specific tag whitelist API and
+      // `allowedTags` has a per-invocation scope, so we need to undo
+      // changes after sanitizing elements.
+      allowedTagsChanges.forEach(tag => {
+        delete allowedTags[tag];
+      });
+      allowedTagsChanges.length = 0;
+    };
+
+    /**
+     * @param {!Element} element
+     * @param {{attrName: string, attrValue: string, allowedAttributes: !Object<string, boolean>}} data
+     */
+    const uponSanitizeAttribute = (element, data) => {
+      // Beware of DOM Clobbering when using properties or functions on `element`.
+      // DOMPurify checks a few of these for its internal usage (e.g. `nodeName`),
+      // but not others that may be used in custom hooks.
+      // See https://github.com/cure53/DOMPurify/wiki/Security-Goals-&-Threat-Model#security-goals
+      // and https://github.com/cure53/DOMPurify/blob/master/src/purify.js#L527.
+
+      const tagName = element.nodeName.toLowerCase();
+      const {attrName} = data;
+      let {attrValue} = data;
+      allowedAttributes = data.allowedAttributes;
+
+      const allowAttribute = () => {
+        // Only add new attributes to `allowedAttributesChanges` to avoid removing
+        // default-supported attributes later erroneously.
+        if (!allowedAttributes[attrName]) {
+          allowedAttributes[attrName] = true;
+          allowedAttributesChanges.push(attrName);
+        }
+      };
+
+      // Allow all attributes for AMP elements. This avoids the need to whitelist
+      // nonstandard attributes for every component e.g. amp-lightbox[scrollable].
+      const isAmpElement = startsWith(tagName, 'amp-');
+      if (isAmpElement) {
+        allowAttribute();
+      } else {
+        // `<A>` has special target rules:
+        // - Default target is "_top";
+        // - Allowed targets are "_blank", "_top";
+        // - All other targets are rewritted to "_top".
+        if (tagName == 'a' && attrName == 'target') {
+          const lowercaseValue = attrValue.toLowerCase();
+          if (!WHITELISTED_TARGETS.includes(lowercaseValue)) {
+            attrValue = '_top';
+          } else {
+            // Always use lowercase values for `target` attr.
+            attrValue = lowercaseValue;
+          }
+        }
+
+        // For non-AMP elements, allow attributes in tag-specific whitelist.
+        const attrsByTags = WHITELISTED_ATTRS_BY_TAGS[tagName];
+        if (attrsByTags && attrsByTags.includes(attrName)) {
+          allowAttribute();
+        }
+      }
+
+      const bindingType = bindingTypeForAttr(attrName);
+      // Rewrite classic bindings e.g. [foo]="bar" -> data-amp-bind-foo="bar".
+      // This is because DOMPurify eagerly removes attributes and re-adds them
+      // after sanitization, which fails because `[]` are not valid attr chars.
+      if (bindingType === BindingType.CLASSIC) {
+        const property = attrName.substring(1, attrName.length - 1);
+        element.setAttribute(`${BIND_PREFIX}${property}`, attrValue);
+      }
+      if (bindingType !== BindingType.NONE) {
+        // Set a custom attribute to mark this element as containing a binding.
+        // This is an optimization that obviates the need for DOM scan later.
+        element.setAttribute('i-amphtml-binding', '');
+      }
+
+      if (
+        isValidAttr(
+          tagName,
+          attrName,
+          attrValue,
+          /* doc */ this.doc_,
+          /* opt_purify */ true
+        )
+      ) {
+        if (attrRewrite && attrValue && !startsWith(attrName, BIND_PREFIX)) {
+          attrValue = attrRewrite(tagName, attrName, attrValue);
+        }
+      } else {
+        data.keepAttr = false;
+        user().error(
+          TAG,
+          'Removed invalid attribute %s[%s="%s"].',
+          tagName,
+          attrName,
+          attrValue
+        );
+      }
+
+      // Update attribute value.
+      data.attrValue = attrValue;
+    };
+
+    /**
+     * @param {!Element} element
+     * @this {{removed: !Array}} Contains list of removed elements/attrs so far.
+     */
+    const afterSanitizeAttributes = element => {
+      markElementForDiffing(element, () => String(this.keyCounter_++));
+
+      // DOMPurify doesn't have a tag-specific attribute whitelist API and
+      // `allowedAttributes` has a per-invocation scope, so we need to undo
+      // changes after sanitizing attributes.
+      allowedAttributesChanges.forEach(attr => {
+        delete allowedAttributes[attr];
+      });
+      allowedAttributesChanges.length = 0;
+
+      // Only allow relative references in <use>.
+      const tagName = element.nodeName.toLowerCase();
+      if (tagName === 'use') {
+        ['href', 'xlink:href'].forEach(attr => {
+          if (
+            element.hasAttribute(attr) &&
+            !startsWith(element.getAttribute(attr), '#')
+          ) {
+            removeElement(element);
+            user().error(
+              TAG,
+              'Removed invalid <use>. use[href] must start with "#".'
+            );
+          }
+        });
+      }
+    };
+
+    purifier.addHook('uponSanitizeElement', uponSanitizeElement);
+    purifier.addHook('afterSanitizeElements', afterSanitizeElements);
+    purifier.addHook('uponSanitizeAttribute', uponSanitizeAttribute);
+    purifier.addHook('afterSanitizeAttributes', afterSanitizeAttributes);
+  }
+
+  /**
+   * Adds triple-mustache specific AMP hooks to given DOMPurify object.
+   * @param {!DomPurifyDef} purifier
+   * @private
+   */
+  addPurifyHooksTripleMustache_(purifier) {
+    // Reference to DOMPurify's `allowedTags` whitelist.
+    let allowedTags;
+
+    const uponSanitizeElement = (node, data) => {
+      const {tagName} = data;
+      allowedTags = data.allowedTags;
+      if (tagName === 'template') {
+        const type = node.getAttribute('type');
+        if (type && type.toLowerCase() === 'amp-mustache') {
+          allowedTags['template'] = true;
+        }
+      }
+    };
+
+    const afterSanitizeElements = unusedNode => {
+      // DOMPurify doesn't have an required-attribute tag whitelist API and
+      // `allowedTags` has a per-invocation scope, so we need to remove
+      // required-attribute tags after sanitizing each element.
+      allowedTags['template'] = false;
+    };
+
+    purifier.addHook('uponSanitizeElement', uponSanitizeElement);
+    purifier.addHook('afterSanitizeElements', afterSanitizeElements);
+  }
+}
+
+/**
+ * Returns standard DOMPurify config for escaped templates.
+ * Do not use for unescaped templates.
+ *
+ * NOTE: See that we use DomPurifyConfig found in
+ * build-system/dompurify.extern.js as the exact type. This is to prevent
+ * closure compiler from optimizing these fields here in this file and in the
+ * 3rd party library file. See #19624 for further information.
+ *
+ * @return {!DomPurifyConfig}
+ */
+function standardPurifyConfig() {
+  const config = {
+    ...PURIFY_PROFILES,
+    ADD_ATTR: WHITELISTED_ATTRS,
+    ADD_TAGS: ['use'],
+    FORBID_TAGS: Object.keys(BLACKLISTED_TAGS),
+    FORCE_BODY: true,
+    RETURN_DOM: true,
+    ALLOW_UNKNOWN_PROTOCOLS: true,
+  };
+  return /** @type {!DomPurifyConfig} */ (config);
+}
+
+/**
+ * @enum {number}
+ */
+const BindingType = {
+  NONE: 0,
+  CLASSIC: 1,
+  ALTERNATIVE: 2,
+};
+
+/**
+ * @param {string} attrName
+ * @return {BindingType}
+ */
+function bindingTypeForAttr(attrName) {
+  if (attrName[0] == '[' && attrName[attrName.length - 1] == ']') {
+    return BindingType.CLASSIC;
+  }
+  if (startsWith(attrName, BIND_PREFIX)) {
+    return BindingType.ALTERNATIVE;
+  }
+  return BindingType.NONE;
+}
diff --git a/src/purifier/rollup.config.js b/src/purifier/rollup.config.js
new file mode 100644
index 0000000000000..560944a661c96
--- /dev/null
+++ b/src/purifier/rollup.config.js
@@ -0,0 +1,59 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import * as path from 'path';
+import alias from '@rollup/plugin-alias';
+
+// eslint-disable-next-line no-undef
+const projectRootDir = path.resolve(__dirname);
+
+const ROLLUP_PLUGINS = [
+  alias({
+    entries: [
+      {
+        find: /.*\/log$/,
+        replacement: path.resolve(projectRootDir, './noop.js'),
+      },
+      {
+        find: /.*\/config$/,
+        replacement: path.resolve(projectRootDir, './noop.js'),
+      },
+    ],
+  }),
+];
+
+export default [
+  {
+    input: 'purifier.js',
+    output: {
+      file: 'dist/purifier.mjs',
+      format: 'es',
+      sourcemap: true,
+    },
+    external: ['dompurify'],
+    plugins: ROLLUP_PLUGINS,
+  },
+  {
+    input: 'purifier.js',
+    output: {
+      file: 'dist/purifier.js',
+      format: 'cjs',
+      sourcemap: true,
+    },
+    external: ['dompurify'],
+    plugins: ROLLUP_PLUGINS,
+  },
+];
diff --git a/src/sanitation.js b/src/purifier/sanitation.js
similarity index 95%
rename from src/sanitation.js
rename to src/purifier/sanitation.js
index fa64c25c39d54..491fd19831587 100644
--- a/src/sanitation.js
+++ b/src/purifier/sanitation.js
@@ -14,10 +14,10 @@
  * limitations under the License.
  */
 
-import {dict, map} from './utils/object';
-import {isAmp4Email} from './format';
-import {isUrlAttribute} from './url-rewrite';
-import {startsWith} from './string';
+import {dict, map} from '../utils/object';
+import {isAmp4Email} from '../format';
+import {isUrlAttribute} from '../url-rewrite';
+import {startsWith} from '../string';
 
 /** @const {string} */
 export const BIND_PREFIX = 'data-amp-bind-';
@@ -52,6 +52,11 @@ export function markElementForDiffing(element, generateKey) {
   // Don't DOM diff nodes with bindings because amp-bind scans newly rendered
   // elements and discards _all_ old elements _before_ diffing, so preserving
   // old elements would cause loss of functionality.
+  //
+  // Alternatively, we could do diffing _before_ bindings are updated and
+  // more precisely add/remove bindings from nodes that set-dom diffs, but...
+  // 1. Would result in content flashing unless we clone the old DOM tree.
+  // 2. Need to change set-dom e.g. handle changed bind attribute values.
   const hasBinding = element.hasAttribute('i-amphtml-binding');
 
   if (!hasBinding && DIFFABLE_AMP_ELEMENTS[element.tagName]) {
@@ -117,6 +122,7 @@ export const TRIPLE_MUSTACHE_WHITELISTED_TAGS = [
   'b',
   'br',
   'caption',
+  'col',
   'colgroup',
   'code',
   'del',
diff --git a/src/runtime.js b/src/runtime.js
index 8b43617c2b76c..5ec4fef6b69e4 100644
--- a/src/runtime.js
+++ b/src/runtime.js
@@ -16,31 +16,18 @@
 
 import {BaseElement} from './base-element';
 import {BaseTemplate, registerExtendedTemplate} from './service/template-impl';
-import {CommonSignals} from './common-signals';
 import {
   LogLevel, // eslint-disable-line no-unused-vars
   dev,
   initLogConstructor,
   overrideLogLevel,
   setReportError,
-  user,
 } from './log';
+import {MultidocManager} from './multidoc-manager';
 import {Services} from './services';
-import {VisibilityState} from './visibility-state';
 import {cssText as ampDocCss} from '../build/ampdoc.css';
 import {cssText as ampSharedCss} from '../build/ampshared.css';
-import {
-  childElementsByTag,
-  isConnectedNode,
-  waitForBodyOpenPromise,
-} from './dom';
 import {config} from './config';
-import {
-  createShadowDomWriter,
-  createShadowRoot,
-  importShadowBody,
-} from './shadow-embed';
-import {disposeServicesForDoc, getServicePromiseOrNullForDoc} from './service';
 import {getMode} from './mode';
 import {hasRenderDelayingServices} from './render-delaying-services';
 import {
@@ -51,15 +38,13 @@ import {
   installExtensionsService,
   stubLegacyElements,
 } from './service/extensions-impl';
-import {installStylesForDoc} from './style-installer';
 import {internalRuntimeVersion} from './internal-version';
-import {isArray, isObject} from './types';
 import {isExperimentOn, toggleExperiment} from './experiments';
-import {parseUrlDeprecated} from './url';
 import {reportErrorForWin} from './error';
 import {setStyle} from './style';
 import {startupChunk} from './chunk';
 import {stubElementsForDoc} from './service/custom-element-registry';
+import {waitForBodyOpenPromise} from './dom';
 
 initLogConstructor();
 setReportError(reportErrorForWin.bind(null, self));
@@ -141,7 +126,7 @@ function adoptShared(global, callback) {
   /**
    * Registers an extended element and installs its styles.
    * @param {string} name
-   * @param {function(new:BaseElement, !Element)} implementationClass
+   * @param {typeof BaseElement} implementationClass
    * @param {?string|undefined} css
    */
   global.AMP.registerElement = extensions.addElement.bind(extensions);
@@ -149,7 +134,7 @@ function adoptShared(global, callback) {
   /**
    * Registers an extended template.
    * @param {string} name
-   * @param {function(new:BaseTemplate)} implementationClass
+   * @param {typeof BaseTemplate} implementationClass
    */
   global.AMP.registerTemplate = function(name, implementationClass) {
     registerExtendedTemplate(global, name, implementationClass);
@@ -342,33 +327,72 @@ function startRegisterOrChunk(global, fnOrStruct, register) {
  */
 export function adopt(global) {
   return adoptShared(global, global => {
-    const {documentElement} = global.document;
-
-    const ampdocService = Services.ampdocServiceFor(global);
-    const ampdoc = ampdocService.getSingleDoc();
-    global.AMP.ampdoc = ampdoc;
+    // Shared runtimes variables between both multi-doc and single-doc pages
+    adoptServicesAndResources(global);
 
-    const viewer = Services.viewerForDoc(documentElement);
-    global.AMP.viewer = viewer;
+    return waitForBodyOpenPromise(global.document).then(() => {
+      // Ensure that all declared extensions are marked and stubbed.
+      stubElementsForDoc(global.AMP.ampdoc);
+    });
+  });
+}
 
-    if (getMode().development) {
-      global.AMP.toggleRuntime = viewer.toggleRuntime.bind(viewer);
-      global.AMP.resources = Services.resourcesForDoc(documentElement);
-    }
+/**
+ * Applies the runtime to a given global scope for a single-doc mode.
+ * Multi frame support is currently incomplete.
+ * @param {!Window} global Global scope to adopt.
+ * @return {!Promise}
+ */
+export function adoptWithMultidocDeps(global) {
+  return adoptShared(global, global => {
+    // Shared runtimes variables between both multi-doc and single-doc pages
+    adoptServicesAndResources(global);
 
-    const viewport = Services.viewportForDoc(documentElement);
-    global.AMP.viewport = {};
-    global.AMP.viewport.getScrollLeft = viewport.getScrollLeft.bind(viewport);
-    global.AMP.viewport.getScrollWidth = viewport.getScrollWidth.bind(viewport);
-    global.AMP.viewport.getWidth = viewport.getWidth.bind(viewport);
+    // Dependencies to the MultiDocManager
+    adoptMultiDocDeps(global);
 
     return waitForBodyOpenPromise(global.document).then(() => {
       // Ensure that all declared extensions are marked and stubbed.
-      stubElementsForDoc(ampdoc);
+      stubElementsForDoc(global.AMP.ampdoc);
     });
   });
 }
 
+/**
+ * Adopt shared runtimes variables between both multi-doc and single-doc pages
+ * @param {!Window} global Global scope to adopt.
+ */
+function adoptServicesAndResources(global) {
+  const {documentElement} = global.document;
+
+  const ampdocService = Services.ampdocServiceFor(global);
+  const ampdoc = ampdocService.getSingleDoc();
+  global.AMP.ampdoc = ampdoc;
+
+  const viewer = Services.viewerForDoc(documentElement);
+  global.AMP.viewer = viewer;
+
+  if (getMode().development) {
+    global.AMP.toggleRuntime = viewer.toggleRuntime.bind(viewer);
+    global.AMP.resources = Services.resourcesForDoc(documentElement);
+  }
+
+  const viewport = Services.viewportForDoc(documentElement);
+  global.AMP.viewport = {};
+  global.AMP.viewport.getScrollLeft = viewport.getScrollLeft.bind(viewport);
+  global.AMP.viewport.getScrollWidth = viewport.getScrollWidth.bind(viewport);
+  global.AMP.viewport.getWidth = viewport.getWidth.bind(viewport);
+}
+
+/**
+ * Adopt MultiDocManager dependencies
+ * @param {!Window} global Global scope to adopt.
+ */
+function adoptMultiDocDeps(global) {
+  global.AMP.installAmpdocServices = installAmpdocServices.bind(null);
+  global.AMP.combinedCss = ampDocCss + ampSharedCss;
+}
+
 /**
  * Applies the runtime to a given global scope for shadow mode.
  * @param {!Window} global Global scope to adopt.
@@ -376,6 +400,14 @@ export function adopt(global) {
  */
 export function adoptShadowMode(global) {
   return adoptShared(global, (global, extensions) => {
+    // shadow mode already adopted
+    if (global.AMP.attachShadowDoc) {
+      return Promise.resolve();
+    }
+
+    // Dependencies to the MultiDocManager
+    adoptMultiDocDeps(global);
+
     const manager = new MultidocManager(
       global,
       Services.ampdocServiceFor(global),
@@ -408,538 +440,6 @@ export function adoptShadowMode(global) {
   });
 }
 
-/**
- * A manager for documents in the multi-doc environment.
- */
-export class MultidocManager {
-  /**
-   * @param {!Window} win
-   * @param {!./service/ampdoc-impl.AmpDocService} ampdocService
-   * @param {!./service/extensions-impl.Extensions} extensions
-   * @param {!./service/timer-impl.Timer} timer
-   */
-  constructor(win, ampdocService, extensions, timer) {
-    /** @const */
-    this.win = win;
-    /** @private @const */
-    this.ampdocService_ = ampdocService;
-    /** @private @const */
-    this.extensions_ = extensions;
-    /** @private @const */
-    this.timer_ = timer;
-
-    /** @private @const {!Array<!ShadowRoot>} */
-    this.shadowRoots_ = [];
-  }
-
-  /**
-   * Attaches the shadow root and calls the supplied DOM builder.
-   * @param {!Element} hostElement
-   * @param {string} url
-   * @param {!Object<string, string>|undefined} params
-   * @param {function(!Object, !ShadowRoot,
-   * !./service/ampdoc-impl.AmpDocShadow):!Promise} builder
-   * @return {!ShadowDoc}
-   * @private
-   */
-  attachShadowDoc_(hostElement, url, params, builder) {
-    params = params || Object.create(null);
-    this.purgeShadowRoots_();
-
-    setStyle(hostElement, 'visibility', 'hidden');
-    const shadowRoot = createShadowRoot(hostElement);
-
-    // TODO: closeShadowRoot_ is asynchronous. While this safety check is well
-    // intentioned, it leads to a race between unlayout and layout of custom
-    // elements.
-    if (shadowRoot.AMP) {
-      user().warn(TAG, "Shadow doc wasn't previously closed");
-      this.closeShadowRoot_(shadowRoot);
-    }
-
-    const amp = {};
-    shadowRoot.AMP = amp;
-    amp.url = url;
-    const {origin} = parseUrlDeprecated(url);
-
-    const ampdoc = this.ampdocService_.installShadowDoc(url, shadowRoot, {
-      params,
-    });
-    /** @const {!./service/ampdoc-impl.AmpDocShadow} */
-    amp.ampdoc = ampdoc;
-    dev().fine(TAG, 'Attach to shadow root:', shadowRoot, ampdoc);
-
-    // Install runtime CSS.
-    installStylesForDoc(
-      ampdoc,
-      ampDocCss + ampSharedCss,
-      /* callback */ null,
-      /* opt_isRuntimeCss */ true
-    );
-    // Instal doc services.
-    installAmpdocServices(ampdoc);
-
-    const viewer = Services.viewerForDoc(ampdoc);
-
-    /**
-     * Sets the document's visibility state.
-     * @param {!VisibilityState} state
-     */
-    amp['setVisibilityState'] = function(state) {
-      ampdoc.overrideVisibilityState(state);
-    };
-
-    // Messaging pipe.
-    /**
-     * Posts message to the ampdoc.
-     * @param {string} eventType
-     * @param {!JsonObject} data
-     * @param {boolean} unusedAwaitResponse
-     * @return {(!Promise<*>|undefined)}
-     */
-    amp['postMessage'] = viewer.receiveMessage.bind(viewer);
-
-    /** @type {function(string, *, boolean):(!Promise<*>|undefined)} */
-    let onMessage;
-
-    /**
-     * Provides a message delivery mechanism by which AMP document can send
-     * messages to the viewer.
-     * @param {function(string, *, boolean):(!Promise<*>|undefined)} callback
-     */
-    amp['onMessage'] = function(callback) {
-      onMessage = callback;
-    };
-
-    viewer.setMessageDeliverer((eventType, data, awaitResponse) => {
-      // Special messages.
-      if (eventType == 'broadcast') {
-        this.broadcast_(data, shadowRoot);
-        return awaitResponse ? Promise.resolve() : undefined;
-      }
-
-      // All other messages.
-      if (onMessage) {
-        return onMessage(eventType, data, awaitResponse);
-      }
-    }, origin);
-
-    /**
-     * Closes the document, resolving when visibility changes and services have
-     * been cleand up. The document can no longer be activated again.
-     * @return {Promise}
-     */
-    amp['close'] = () => {
-      return this.closeShadowRoot_(shadowRoot);
-    };
-
-    if (getMode().development) {
-      amp.toggleRuntime = viewer.toggleRuntime.bind(viewer);
-      amp.resources = Services.resourcesForDoc(ampdoc);
-    }
-
-    /**
-     * Expose amp-bind getState
-     * @param {string} name - Name of state or deep state
-     * @return {Promise<*>} - Resolves to a copy of the value of a state
-     */
-    amp['getState'] = name => {
-      return Services.bindForDocOrNull(shadowRoot).then(bind => {
-        if (!bind) {
-          return Promise.reject('amp-bind is not available in this document');
-        }
-        return bind.getState(name);
-      });
-    };
-
-    /**
-     * Expose amp-bind setState
-     * @param {(!JsonObject|string)} state - State to be set
-     * @return {Promise} - Resolves after state and history have been updated
-     */
-    amp['setState'] = state => {
-      return Services.bindForDocOrNull(shadowRoot).then(bind => {
-        if (!bind) {
-          return Promise.reject('amp-bind is not available in this document');
-        }
-        if (typeof state === 'string') {
-          return bind.setStateWithExpression(
-            /** @type {string} */ (state),
-            /** @type {!JsonObject} */ ({})
-          );
-        } else if (isObject(state) || isArray(state)) {
-          return bind.setStateWithObject(/** @type {!JsonObject} */ (state));
-        }
-        return Promise.reject('Invalid state');
-      });
-    };
-
-    // Start building the shadow doc DOM.
-    builder(amp, shadowRoot, ampdoc).then(() => {
-      // Document is ready.
-      ampdoc.setReady();
-      ampdoc.signals().signal(CommonSignals.RENDER_START);
-      setStyle(hostElement, 'visibility', 'visible');
-    });
-
-    // Store reference.
-    if (!this.shadowRoots_.includes(shadowRoot)) {
-      this.shadowRoots_.push(shadowRoot);
-    }
-
-    dev().fine(TAG, 'Shadow root initialization is done:', shadowRoot, ampdoc);
-    return amp;
-  }
-
-  /**
-   * Implementation for `attachShadowDoc` function. Attaches the shadow doc and
-   * configures ampdoc for it.
-   * @param {!Element} hostElement
-   * @param {!Document} doc
-   * @param {string} url
-   * @param {!Object<string, string>=} opt_initParams
-   * @return {!ShadowDoc}
-   */
-  attachShadowDoc(hostElement, doc, url, opt_initParams) {
-    dev().fine(TAG, 'Attach shadow doc:', doc);
-    // TODO(dvoytenko, #9490): once stable, port full document case to emulated
-    // stream.
-    return this.attachShadowDoc_(
-      hostElement,
-      url,
-      opt_initParams,
-      (amp, shadowRoot, ampdoc) => {
-        // Install extensions.
-        const extensionIds = this.mergeShadowHead_(ampdoc, shadowRoot, doc);
-        this.extensions_.installExtensionsInDoc(ampdoc, extensionIds);
-
-        // Append body.
-        if (doc.body) {
-          const body = importShadowBody(shadowRoot, doc.body, /* deep */ true);
-          body.classList.add('amp-shadow');
-          ampdoc.setBody(body);
-        }
-
-        // TODO(dvoytenko): find a better and more stable way to make content
-        // visible. E.g. integrate with dynamic classes. In shadow case
-        // specifically, we have to wait for stubbing to complete, which may
-        // take awhile due to importNode.
-        setTimeout(() => {
-          ampdoc.signals().signal(CommonSignals.RENDER_START);
-          setStyle(hostElement, 'visibility', 'visible');
-        }, 50);
-
-        return Promise.resolve();
-      }
-    );
-  }
-
-  /**
-   * Implementation for `attachShadowDocAsStream` function. Attaches the shadow
-   * doc and configures ampdoc for it.
-   * @param {!Element} hostElement
-   * @param {string} url
-   * @param {!Object<string, string>=} opt_initParams
-   * @return {!Object}
-   */
-  attachShadowDocAsStream(hostElement, url, opt_initParams) {
-    dev().fine(TAG, 'Attach shadow doc as stream');
-    return this.attachShadowDoc_(
-      hostElement,
-      url,
-      opt_initParams,
-      (amp, shadowRoot, ampdoc) => {
-        // Start streaming.
-        let renderStarted = false;
-        const writer = createShadowDomWriter(this.win);
-        amp['writer'] = writer;
-        writer.onBody(doc => {
-          // Install extensions.
-          const extensionIds = this.mergeShadowHead_(ampdoc, shadowRoot, doc);
-          // Apply all doc extensions.
-          this.extensions_.installExtensionsInDoc(ampdoc, extensionIds);
-
-          // Append shallow body.
-          const body = importShadowBody(
-            shadowRoot,
-            dev().assertElement(doc.body),
-            /* deep */ false
-          );
-          body.classList.add('amp-shadow');
-          ampdoc.setBody(body);
-          return body;
-        });
-        writer.onBodyChunk(() => {
-          // TODO(dvoytenko): find a better and more stable way to make
-          // content visible. E.g. integrate with dynamic classes. In shadow
-          // case specifically, we have to wait for stubbing to complete,
-          // which may take awhile due to node importing.
-          if (!renderStarted) {
-            renderStarted = true;
-            setTimeout(() => {
-              ampdoc.signals().signal(CommonSignals.RENDER_START);
-              setStyle(hostElement, 'visibility', 'visible');
-            }, 50);
-          }
-        });
-        return new Promise(resolve => {
-          writer.onEnd(() => {
-            resolve();
-            amp.writer = null;
-          });
-        });
-      }
-    );
-  }
-
-  /**
-   * Processes the contents of the shadow document's head.
-   * @param {!./service/ampdoc-impl.AmpDoc} ampdoc
-   * @param {!ShadowRoot} shadowRoot
-   * @param {!Document} doc
-   * @return {!Array<string>}
-   * @private
-   */
-  mergeShadowHead_(ampdoc, shadowRoot, doc) {
-    const extensionIds = [];
-    if (doc.head) {
-      shadowRoot.AMP.head = doc.head;
-      const parentLinks = {};
-      const links = childElementsByTag(
-        dev().assertElement(this.win.document.head),
-        'link'
-      );
-      for (let i = 0; i < links.length; i++) {
-        const href = links[i].getAttribute('href');
-        if (href) {
-          parentLinks[href] = true;
-        }
-      }
-
-      for (let n = doc.head.firstElementChild; n; n = n.nextElementSibling) {
-        const {tagName} = n;
-        const name = n.getAttribute('name');
-        const rel = n.getAttribute('rel');
-        switch (tagName) {
-          case 'TITLE':
-            shadowRoot.AMP.title = n.textContent;
-            dev().fine(TAG, '- set title: ', shadowRoot.AMP.title);
-            break;
-          case 'META':
-            if (n.hasAttribute('charset')) {
-              // Ignore.
-            } else if (name == 'viewport') {
-              // Ignore.
-            } else {
-              // TODO(dvoytenko): copy other meta tags.
-              dev().warn(TAG, 'meta ignored: ', n);
-            }
-            break;
-          case 'LINK':
-            /** @const {string} */
-            const href = n.getAttribute('href');
-            if (rel == 'canonical') {
-              shadowRoot.AMP.canonicalUrl = href;
-              dev().fine(TAG, '- set canonical: ', shadowRoot.AMP.canonicalUrl);
-            } else if (rel == 'stylesheet') {
-              // Must be a font definition: no other stylesheets are allowed.
-              if (parentLinks[href]) {
-                dev().fine(TAG, '- stylesheet already included: ', href);
-              } else {
-                parentLinks[href] = true;
-                const el = this.win.document.createElement('link');
-                el.setAttribute('rel', 'stylesheet');
-                el.setAttribute('type', 'text/css');
-                el.setAttribute('href', href);
-                this.win.document.head.appendChild(el);
-                dev().fine(TAG, '- import font to parent: ', href, el);
-              }
-            } else {
-              dev().fine(TAG, '- ignore link rel=', rel);
-            }
-            break;
-          case 'STYLE':
-            if (n.hasAttribute('amp-boilerplate')) {
-              // Ignore.
-              dev().fine(TAG, '- ignore boilerplate style: ', n);
-            } else if (n.hasAttribute('amp-custom')) {
-              installStylesForDoc(
-                ampdoc,
-                n.textContent,
-                /* callback */ null,
-                /* isRuntimeCss */ false,
-                'amp-custom'
-              );
-              dev().fine(TAG, '- import style: ', n);
-            } else if (n.hasAttribute('amp-keyframes')) {
-              installStylesForDoc(
-                ampdoc,
-                n.textContent,
-                /* callback */ null,
-                /* isRuntimeCss */ false,
-                'amp-keyframes'
-              );
-              dev().fine(TAG, '- import style: ', n);
-            }
-            break;
-          case 'SCRIPT':
-            if (n.hasAttribute('src')) {
-              dev().fine(TAG, '- src script: ', n);
-              const src = n.getAttribute('src');
-              const isRuntime =
-                src.indexOf('/amp.js') != -1 || src.indexOf('/v0.js') != -1;
-              // Note: Some extensions don't have [custom-element] or
-              // [custom-template] e.g. amp-viewer-integration.
-              const customElement = n.getAttribute('custom-element');
-              const customTemplate = n.getAttribute('custom-template');
-              const versionRe = /-(\d+.\d+)(.max)?\.js$/;
-              const match = versionRe.exec(src);
-              const version = match ? match[1] : '0.1';
-              if (isRuntime) {
-                dev().fine(TAG, '- ignore runtime script: ', src);
-              } else if (customElement || customTemplate) {
-                // This is an extension.
-                this.extensions_.installExtensionForDoc(
-                  ampdoc,
-                  customElement || customTemplate,
-                  version
-                );
-                dev().fine(
-                  TAG,
-                  '- load extension: ',
-                  customElement || customTemplate,
-                  ' ',
-                  version
-                );
-                if (customElement) {
-                  extensionIds.push(customElement);
-                }
-              } else if (!n.hasAttribute('data-amp-report-test')) {
-                user().error(TAG, '- unknown script: ', n, src);
-              }
-            } else {
-              // Non-src version of script.
-              const type = n.getAttribute('type') || 'application/javascript';
-              if (type.indexOf('javascript') == -1) {
-                shadowRoot.appendChild(this.win.document.importNode(n, true));
-                dev().fine(TAG, '- non-src script: ', n);
-              } else {
-                user().error(TAG, '- unallowed inline javascript: ', n);
-              }
-            }
-            break;
-          case 'NOSCRIPT':
-            // Ignore.
-            break;
-          default:
-            user().error(TAG, '- UNKNOWN head element:', n);
-            break;
-        }
-      }
-    }
-    return extensionIds;
-  }
-
-  /**
-   * @param {*} data
-   * @param {!ShadowRoot} sender
-   * @private
-   */
-  broadcast_(data, sender) {
-    this.purgeShadowRoots_();
-    this.shadowRoots_.forEach(shadowRoot => {
-      if (shadowRoot == sender) {
-        // Don't broadcast to the sender.
-        return;
-      }
-      // Broadcast message asynchronously.
-      const viewer = Services.viewerForDoc(shadowRoot.AMP.ampdoc);
-      this.timer_.delay(() => {
-        viewer.receiveMessage(
-          'broadcast',
-          /** @type {!JsonObject} */ (data),
-          /* awaitResponse */ false
-        );
-      }, 0);
-    });
-  }
-
-  /**
-   * @param {!ShadowRoot} shadowRoot
-   * @return {Promise}
-   * @private
-   */
-  closeShadowRoot_(shadowRoot) {
-    this.removeShadowRoot_(shadowRoot);
-    const amp = shadowRoot.AMP;
-    delete shadowRoot.AMP;
-    const {ampdoc} = amp;
-    ampdoc.overrideVisibilityState(VisibilityState.INACTIVE);
-    disposeServicesForDoc(ampdoc);
-
-    // There is a race between the visibility state change finishing and
-    // resources.onNextPass firing, but this is intentional. closeShadowRoot_
-    // was traditionally introduced as a synchronous method, so PWAs in the wild
-    // do not expect to have to wait for a promise to resolve before the shadow
-    // is deemed 'closed'. Moving .overrideVisibilityState() and
-    // disposeServicesForDoc inside a promise could adversely affect sites that
-    // depend on at least the synchronous portions of those methods completing
-    // before proceeding. The promise race is designed to be very quick so that
-    // even if the pass callback completes before resources.onNextPass is called
-    // below, we only delay promise resolution by a few ms.
-    return this.timer_
-      .timeoutPromise(
-        15, // Delay for queued pass after visibility change is 10ms
-        new this.win.Promise(resolve => {
-          getServicePromiseOrNullForDoc(ampdoc, 'resources').then(resources => {
-            if (resources) {
-              resources.onNextPass(resolve);
-            } else {
-              resolve();
-            }
-          });
-        }),
-        'Timeout reached waiting for visibility state change callback'
-      )
-      .catch(error => {
-        user().info(TAG, error);
-      });
-  }
-
-  /**
-   * @param {!ShadowRoot} shadowRoot
-   * @private
-   */
-  removeShadowRoot_(shadowRoot) {
-    const index = this.shadowRoots_.indexOf(shadowRoot);
-    if (index != -1) {
-      this.shadowRoots_.splice(index, 1);
-    }
-  }
-
-  /**
-   * @param {!ShadowRoot} shadowRoot
-   * @private
-   */
-  closeShadowRootAsync_(shadowRoot) {
-    this.timer_.delay(() => {
-      this.closeShadowRoot_(shadowRoot);
-    }, 0);
-  }
-
-  /** @private */
-  purgeShadowRoots_() {
-    this.shadowRoots_.forEach(shadowRoot => {
-      // The shadow root has been disconnected. Force it closed.
-      if (!shadowRoot.host || !isConnectedNode(shadowRoot.host)) {
-        user().warn(TAG, "Shadow doc wasn't previously closed");
-        this.removeShadowRoot_(shadowRoot);
-        this.closeShadowRootAsync_(shadowRoot);
-      }
-    });
-  }
-}
-
 /**
  * For a given extension, checks that its version is the same
  * as the version of the main AMP binary.
diff --git a/src/sanitizer.js b/src/sanitizer.js
index 62f7726dc5281..36473a6d4d5c7 100644
--- a/src/sanitizer.js
+++ b/src/sanitizer.js
@@ -23,7 +23,7 @@ import {
   WHITELISTED_ATTRS_BY_TAGS,
   WHITELISTED_TARGETS,
   isValidAttr,
-} from './sanitation';
+} from './purifier/sanitation';
 import {dict} from './utils/object';
 import {htmlSanitizer} from '../third_party/caja/html-sanitizer';
 import {isAmp4Email} from './format';
@@ -91,10 +91,11 @@ export function sanitizeHtml(html, doc) {
   };
 
   // No Caja support for <script> or <svg>.
-  const cajaBlacklistedTags = Object.assign(
-    {'script': true, 'svg': true},
-    BLACKLISTED_TAGS
-  );
+  const cajaBlacklistedTags = {
+    'script': true,
+    'svg': true,
+    ...BLACKLISTED_TAGS,
+  };
 
   const parser = htmlSanitizer.makeSaxParser({
     'startTag': function(tagName, attribs) {
diff --git a/src/service/OWNERS b/src/service/OWNERS
index 36f6a5efb4aa3..07b1ae52cfcee 100644
--- a/src/service/OWNERS
+++ b/src/service/OWNERS
@@ -7,5 +7,9 @@
       pattern: 'video-*.js',
       owners: [{name: 'ampproject/wg-ui-and-a11y'}],
     },
+    {
+      pattern: '{cid-*,*-cid-*,*-cid,url-replacements-impl}.js',
+      owners: [{name: 'ampproject/wg-analytics'}],
+    },
   ],
 }
diff --git a/src/service/action-impl.js b/src/service/action-impl.js
index 50a994219e6d2..d48fd9b39a20e 100644
--- a/src/service/action-impl.js
+++ b/src/service/action-impl.js
@@ -517,7 +517,10 @@ export class ActionService {
     if (!action) {
       return false;
     }
-    return action.actionInfos.some(({target}) => !!this.getActionNode_(target));
+    return action.actionInfos.some(action => {
+      const {target} = action;
+      return !!this.getActionNode_(target);
+    });
   }
 
   /**
@@ -539,7 +542,8 @@ export class ActionService {
     if (!action) {
       return false;
     }
-    return action.actionInfos.some(({target}) => {
+    return action.actionInfos.some(actionInfo => {
+      const {target} = actionInfo;
       return this.getActionNode_(target) == targetElement;
     });
   }
@@ -599,7 +603,8 @@ export class ActionService {
     // to complete. `currentPromise` is the i'th promise in the chain.
     /** @type {?Promise} */
     let currentPromise = null;
-    action.actionInfos.forEach(({target, args, method, str}) => {
+    action.actionInfos.forEach(actionInfo => {
+      const {target, args, method, str} = actionInfo;
       const dereferencedArgs = dereferenceArgsVariables(args, event, opt_args);
       const invokeAction = () => {
         const node = this.getActionNode_(target);
diff --git a/src/service/cid-impl.js b/src/service/cid-impl.js
index 88d37d8f775d0..1edaf7e3d3a57 100644
--- a/src/service/cid-impl.js
+++ b/src/service/cid-impl.js
@@ -404,10 +404,6 @@ function getOrCreateCookie(cid, getCidStruct, persistenceConsent) {
     return /** @type {!Promise<?string>} */ (Promise.resolve(null));
   }
 
-  if (cid.externalCidCache_[scope]) {
-    return /** @type {!Promise<?string>} */ (cid.externalCidCache_[scope]);
-  }
-
   if (existingCookie) {
     // If we created the cookie, update it's expiration time.
     if (/^amp-/.test(existingCookie)) {
@@ -416,6 +412,10 @@ function getOrCreateCookie(cid, getCidStruct, persistenceConsent) {
     return /** @type {!Promise<?string>} */ (Promise.resolve(existingCookie));
   }
 
+  if (cid.externalCidCache_[scope]) {
+    return /** @type {!Promise<?string>} */ (cid.externalCidCache_[scope]);
+  }
+
   const newCookiePromise = getRandomString64(win)
     // Create new cookie, always prefixed with "amp-", so that we can see from
     // the value whether we created it.
diff --git a/src/service/core-services.js b/src/service/core-services.js
index 669b6ad3c5fe5..b83ec346cd538 100644
--- a/src/service/core-services.js
+++ b/src/service/core-services.js
@@ -30,6 +30,7 @@ import {installLayout} from '../../builtins/amp-layout';
 import {installOwnersServiceForDoc} from './owners-impl';
 import {installPixel} from '../../builtins/amp-pixel';
 import {installPlatformService} from './platform-impl';
+import {installPreconnectService} from '../preconnect';
 import {installResourcesServiceForDoc} from './resources-impl';
 import {installStandardActionsForDoc} from './standard-actions-impl';
 import {installStorageServiceForDoc} from './storage-impl';
@@ -67,6 +68,7 @@ export function installRuntimeServices(global) {
   installVsyncService(global);
   installXhrService(global);
   installInputService(global);
+  installPreconnectService(global);
 }
 
 /**
diff --git a/src/service/custom-element-registry.js b/src/service/custom-element-registry.js
index e6d28e735fe8e..69c7ef6cec154 100644
--- a/src/service/custom-element-registry.js
+++ b/src/service/custom-element-registry.js
@@ -22,7 +22,7 @@ import {userAssert} from '../log';
 
 /**
  * @param {!Window} win
- * @return {!Object<string, function(new:../base-element.BaseElement, !Element)>}
+ * @return {!Object<string, typeof ../base-element.BaseElement>}
  */
 function getExtendedElements(win) {
   if (!win.__AMP_EXTENDED_ELEMENTS) {
@@ -35,12 +35,12 @@ function getExtendedElements(win) {
  * Registers an element. Upgrades it if has previously been stubbed.
  * @param {!Window} win
  * @param {string} name
- * @param {function(new:../base-element.BaseElement, !Element)} toClass
+ * @param {typeof ../base-element.BaseElement} toClass
  */
 export function upgradeOrRegisterElement(win, name, toClass) {
   const knownElements = getExtendedElements(win);
   if (!knownElements[name]) {
-    registerElement(win, name, /** @type {!Function} */ (toClass));
+    registerElement(win, name, toClass);
     return;
   }
   if (knownElements[name] == toClass) {
@@ -80,7 +80,7 @@ export function upgradeOrRegisterElement(win, name, toClass) {
 /**
  * This method should not be inlined to prevent TryCatch deoptimization.
  * @param {Element} element
- * @param {function(new:../base-element.BaseElement, !Element)} toClass
+ * @param {typeof ../base-element.BaseElement} toClass
  * @private
  * @noinline
  */
@@ -135,7 +135,7 @@ export function copyElementToChildWindow(parentWin, childWin, name) {
  * Registers a new custom element with its implementation class.
  * @param {!Window} win The window in which to register the elements.
  * @param {string} name Name of the custom element
- * @param {function(new:../base-element.BaseElement, !Element)} implementationClass
+ * @param {typeof ../base-element.BaseElement} implementationClass
  */
 export function registerElement(win, name, implementationClass) {
   const knownElements = getExtendedElements(win);
diff --git a/src/service/extension-location.js b/src/service/extension-location.js
index 712ccd39f9dc6..0dcd76f3c8edd 100644
--- a/src/service/extension-location.js
+++ b/src/service/extension-location.js
@@ -98,9 +98,8 @@ export function calculateEntryPointScriptUrl(
  * @return {!ExtensionInfoDef}
  */
 export function parseExtensionUrl(scriptUrl) {
-  const regex = /^(.*)\/(.*)-([0-9.]+)\.js$/i;
-  const matches = scriptUrl.match(regex);
-
+  // Note that the "(\.max)?" group only applies to local dev.
+  const matches = scriptUrl.match(/^(.*)\/(.*)-([0-9.]+|latest)(\.max)?\.js$/i);
   return {
     extensionId: matches ? matches[2] : undefined,
     extensionVersion: matches ? matches[3] : undefined,
diff --git a/src/service/extensions-impl.js b/src/service/extensions-impl.js
index f6fec78003dbf..14f916b1d4dab 100644
--- a/src/service/extensions-impl.js
+++ b/src/service/extensions-impl.js
@@ -49,7 +49,7 @@ const LOAD_TIMEOUT = 16000;
  *
  * @typedef {{
  *   implementationClass:
- *       function(new:../base-element.BaseElement, !Element),
+ *       typeof ../base-element.BaseElement,
  *   css: (?string|undefined),
  * }}
  */
@@ -271,18 +271,18 @@ export class Extensions {
    */
   getExtensionScript_(extensionId, includeInserted = true) {
     // Always ignore <script> elements that have a mismatched RTV.
-    // We have to match against "src" because a few extensions, such as
-    // "amp-viewer-integration", do not have "custom-element" attribute.
     const modifier =
       ':not([i-amphtml-loaded-new-version])' +
       (includeInserted ? '' : ':not([i-amphtml-inserted])');
+    // We have to match against "src" because a few extensions, such as
+    // "amp-viewer-integration", do not have "custom-element" attribute.
     const matches = this.win.document.head./*OK*/ querySelectorAll(
       `script[src*="/${extensionId}-"]` + modifier
     );
-    const matcher = new RegExp(`${extensionId}-\\d`);
     for (let i = 0; i < matches.length; i++) {
       const match = matches[i];
-      if (matcher.test(match.src)) {
+      const urlParts = parseExtensionUrl(match.src);
+      if (urlParts.extensionId === extensionId) {
         return match;
       }
     }
@@ -294,7 +294,7 @@ export class Extensions {
    * class when the extension has been loaded. If necessary, adds the extension
    * script to the page.
    * @param {string} elementName
-   * @return {!Promise<function(new:../base-element.BaseElement, !Element)>}
+   * @return {!Promise<typeof ../base-element.BaseElement>}
    */
   loadElementClass(elementName) {
     return this.preloadExtension(elementName).then(extension => {
@@ -312,7 +312,7 @@ export class Extensions {
    * restricted method and it's allowed to be called only during the overall
    * extension registration.
    * @param {string} name
-   * @param {function(new:../base-element.BaseElement, !Element)} implementationClass
+   * @param {typeof ../base-element.BaseElement} implementationClass
    * @param {?string|undefined} css
    * @restricted
    */
@@ -328,7 +328,7 @@ export class Extensions {
    * Installs the specified element implementation in the ampdoc.
    * @param {!./ampdoc-impl.AmpDoc} ampdoc
    * @param {string} name
-   * @param {!Function} implementationClass
+   * @param {typeof ../base-element.BaseElement} implementationClass
    * @param {?string|undefined} css
    * @private
    */
@@ -351,7 +351,7 @@ export class Extensions {
   /**
    * @param {!Window} win
    * @param {string} name
-   * @param {!Function} implementationClass
+   * @param {typeof ../base-element.BaseElement} implementationClass
    * @private
    */
   registerElementInWindow_(win, name, implementationClass) {
@@ -572,6 +572,12 @@ export class Extensions {
     scriptElement.setAttribute('data-script', extensionId);
     scriptElement.setAttribute('i-amphtml-inserted', '');
 
+    // Propagate nonce to all generated script tags.
+    const currentScript = this.win.document.head.querySelector('script[nonce]');
+    if (currentScript) {
+      scriptElement.setAttribute('nonce', currentScript.getAttribute('nonce'));
+    }
+
     // Allow error information to be collected
     // https://github.com/ampproject/amphtml/issues/7353
     scriptElement.setAttribute('crossorigin', 'anonymous');
diff --git a/src/service/fixed-layer.js b/src/service/fixed-layer.js
index 468ec533c064a..335267e96aa03 100644
--- a/src/service/fixed-layer.js
+++ b/src/service/fixed-layer.js
@@ -30,6 +30,7 @@ import {
 import {closest, domOrderComparator, matches} from '../dom';
 import {dev, user} from '../log';
 import {endsWith} from '../string';
+import {getMode} from '../mode';
 import {isExperimentOn} from '../experiments';
 import {remove} from '../utils/array';
 
@@ -97,9 +98,7 @@ export class FixedLayer {
     this.elements_ = [];
 
     /** @const @private {!Pass} */
-    this.updatePass_ = new Pass(ampdoc.win, () => {
-      this.update();
-    });
+    this.updatePass_ = new Pass(ampdoc.win, () => this.update());
 
     /** @private {?function()} */
     this.hiddenObserverUnlistener_ = null;
@@ -131,12 +130,12 @@ export class FixedLayer {
     }
 
     if (opt_lightbox && opt_onComplete) {
-      opt_onComplete.then(() => {
+      opt_onComplete.then(() =>
         this.scanNode_(
           dev().assertElement(opt_lightbox),
           /* lightboxMode */ true
-        );
-      });
+        )
+      );
     }
   }
 
@@ -158,12 +157,19 @@ export class FixedLayer {
 
   /**
    * Must be always called after DOMReady.
+   * @return {boolean}
    */
   setup() {
+    const viewer = Services.viewerForDoc(this.ampdoc);
+    if (!getMode().localDev && !viewer.isEmbedded()) {
+      // FixedLayer is not needed for standalone documents.
+      return false;
+    }
+
     const root = this.ampdoc.getRootNode();
     const stylesheets = root.styleSheets;
     if (!stylesheets) {
-      return;
+      return true;
     }
 
     this.fixedSelectors_.length = 0;
@@ -174,7 +180,7 @@ export class FixedLayer {
       // Rare but may happen if the document is being concurrently disposed.
       if (!stylesheet) {
         dev().error(TAG, 'Aborting setup due to null stylesheet.');
-        return;
+        return true;
       }
       const {disabled, ownerNode} = stylesheet;
       if (
@@ -207,6 +213,8 @@ export class FixedLayer {
           ' slightly different layout.'
       );
     }
+
+    return true;
   }
 
   /**
diff --git a/src/service/history-impl.js b/src/service/history-impl.js
index 0949cff1771c3..dca12a2ccc8d3 100644
--- a/src/service/history-impl.js
+++ b/src/service/history-impl.js
@@ -829,17 +829,15 @@ export class HistoryBindingNatural_ {
    * @return {!HistoryStateDef}
    */
   mergeStateUpdate_(state, update) {
-    const mergedData = /** @type {!JsonObject} */ (Object.assign(
-      {},
-      (state && state.data) || {},
-      update.data || {}
-    ));
-    return /** @type {!HistoryStateDef} */ (Object.assign(
-      {},
-      state || {},
-      update,
-      {data: mergedData}
-    ));
+    const mergedData = /** @type {!JsonObject} */ ({
+      ...((state && state.data) || {}),
+      ...(update.data || {}),
+    });
+    return /** @type {!HistoryStateDef} */ ({
+      ...(state || {}),
+      ...update,
+      data: mergedData,
+    });
   }
 }
 
@@ -934,10 +932,10 @@ export class HistoryBindingVirtual_ {
    * @override
    */
   push(opt_stateUpdate) {
-    const message = /** @type {!JsonObject} */ (Object.assign(
-      {'stackIndex': this.stackIndex_ + 1},
-      opt_stateUpdate || {}
-    ));
+    const message = /** @type {!JsonObject} */ ({
+      'stackIndex': this.stackIndex_ + 1,
+      ...(opt_stateUpdate || {}),
+    });
     const push = 'pushHistory';
     return this.viewer_
       .sendMessageAwaitResponse(push, message)
@@ -999,10 +997,10 @@ export class HistoryBindingVirtual_ {
       opt_stateUpdate.url = url;
     }
 
-    const message = /** @type {!JsonObject} */ (Object.assign(
-      {'stackIndex': this.stackIndex_},
-      opt_stateUpdate || {}
-    ));
+    const message = /** @type {!JsonObject} */ ({
+      'stackIndex': this.stackIndex_,
+      ...(opt_stateUpdate || {}),
+    });
     const replace = 'replaceHistory';
     return this.viewer_
       .sendMessageAwaitResponse(replace, message, /* cancelUnsent */ true)
diff --git a/src/service/navigation.js b/src/service/navigation.js
index 6d554474405ae..5247f7d3a024c 100644
--- a/src/service/navigation.js
+++ b/src/service/navigation.js
@@ -30,15 +30,17 @@ import {
   installServiceInEmbedScope,
   registerServiceBuilderForDoc,
 } from '../service';
-import {isExperimentOn} from '../experiments';
 import {toWin} from '../types';
 import PriorityQueue from '../utils/priority-queue';
 
 const TAG = 'navigation';
+
 /** @private @const {string} */
 const EVENT_TYPE_CLICK = 'click';
+
 /** @private @const {string} */
 const EVENT_TYPE_CONTEXT_MENU = 'contextmenu';
+
 const VALID_TARGETS = ['_top', '_blank'];
 
 /** @private @const {string} */
@@ -361,7 +363,6 @@ export class Navigation {
     if (!target || !target.href) {
       return;
     }
-
     if (e.type == EVENT_TYPE_CLICK) {
       this.handleClick_(target, e);
     } else if (e.type == EVENT_TYPE_CONTEXT_MENU) {
@@ -410,7 +411,7 @@ export class Navigation {
    * @private
    */
   handleContextMenuClick_(element, e) {
-    // TODO(wg-runtime): Handle A2A and custom link protocols.
+    // TODO(wg-runtime): Handle A2A, custom link protocols, and ITP 2.3 mitigation.
     this.expandVarsForAnchor_(element);
     this.applyAnchorMutators_(element, e);
   }
@@ -553,61 +554,62 @@ export class Navigation {
         }
       }
 
-      // Safari 13: Temporarily remove viewer query params from iframe
-      // (e.g. amp_js_v, usqp) to prevent document.referrer from being reduced
-      // to eTLD+1 (e.g. ampproject.org).
+      // ITP 2.3 mitigation. See https://github.com/ampproject/amphtml/issues/25179.
       const {win} = this.ampdoc;
       const platform = Services.platformFor(win);
       const viewer = Services.viewerForDoc(element);
       if (
-        isExperimentOn(
-          this.ampdoc.win,
-          'remove-viewer-query-params-on-navigate'
-        ) &&
         fromLocation.search &&
         platform.isSafari() &&
         platform.getMajorVersion() >= 13 &&
         viewer.isProxyOrigin() &&
         viewer.isEmbedded()
       ) {
-        dev().info(
-          TAG,
-          'Removing iframe query string before navigation:',
-          fromLocation.search
-        );
-        const original = fromLocation.href;
-        const noQuery = `${fromLocation.origin}${fromLocation.pathname}${fromLocation.hash}`;
-        win.history.replaceState(null, '', noQuery);
-
-        const restoreQuery = () => {
-          const currentHref = win.location.href;
-          if (currentHref == noQuery) {
-            dev().info(TAG, 'Restored iframe URL with query string:', original);
-            win.history.replaceState(null, '', original);
-          } else {
-            dev().error(
-              TAG,
-              'Unexpected iframe URL change:',
-              currentHref,
-              noQuery
-            );
-          }
-        };
-
-        // For blank_, restore query params after the new page opens.
-        if (target === '_blank') {
-          win.setTimeout(restoreQuery, 0);
-        } else {
-          // For _top etc., wait until page is restored from page cache (bfcache).
-          // https://webkit.org/blog/516/webkit-page-cache-ii-the-unload-event/
-          win.addEventListener('pageshow', function onPageShow(e) {
-            if (e.persisted) {
-              restoreQuery();
-              win.removeEventListener('pageshow', onPageShow);
-            }
-          });
-        }
+        this.removeViewerQueryBeforeNavigation_(win, fromLocation, target);
+      }
+    }
+  }
+
+  /**
+   * Temporarily remove viewer query params from iframe (e.g. amp_js_v, usqp)
+   * to prevent document.referrer from being reduced to eTLD+1 (e.g. ampproject.org).
+   * @param {!Window} win
+   * @param {!Location} fromLocation
+   * @param {string} target
+   * @private
+   */
+  removeViewerQueryBeforeNavigation_(win, fromLocation, target) {
+    dev().info(
+      TAG,
+      'Removing iframe query string before navigation:',
+      fromLocation.search
+    );
+    const original = fromLocation.href;
+    const noQuery = `${fromLocation.origin}${fromLocation.pathname}${fromLocation.hash}`;
+    win.history.replaceState(null, '', noQuery);
+
+    const restoreQuery = () => {
+      const currentHref = win.location.href;
+      if (currentHref == noQuery) {
+        dev().info(TAG, 'Restored iframe URL with query string:', original);
+        win.history.replaceState(null, '', original);
+      } else {
+        dev().error(TAG, 'Unexpected iframe URL change:', currentHref, noQuery);
       }
+    };
+
+    // For blank_, restore query params after the new page opens.
+    if (target === '_blank') {
+      win.setTimeout(restoreQuery, 0);
+    } else {
+      // For _top etc., wait until page is restored from page cache (bfcache).
+      // https://webkit.org/blog/516/webkit-page-cache-ii-the-unload-event/
+      win.addEventListener('pageshow', function onPageShow(e) {
+        if (e.persisted) {
+          restoreQuery();
+          win.removeEventListener('pageshow', onPageShow);
+        }
+      });
     }
   }
 
diff --git a/src/service/origin-experiments-impl.js b/src/service/origin-experiments-impl.js
index e1c49841110b7..a113896c59a19 100644
--- a/src/service/origin-experiments-impl.js
+++ b/src/service/origin-experiments-impl.js
@@ -114,7 +114,7 @@ export class OriginExperiments {
 
 /**
  * Handles key generation and token signing/verifying.
- * @protected
+ * @package
  */
 export class TokenMaster {
   /**
@@ -135,13 +135,11 @@ export class TokenMaster {
    * @protected
    */
   generateKeys() {
-    const generationAlgo = Object.assign(
-      {
-        modulusLength: 2048,
-        publicExponent: Uint8Array.of(1, 0, 1),
-      },
-      this.crypto_.pkcsAlgo
-    );
+    const generationAlgo = {
+      modulusLength: 2048,
+      publicExponent: Uint8Array.of(1, 0, 1),
+      ...this.crypto_.pkcsAlgo,
+    };
     return this.crypto_.subtle.generateKey(
       /** @type {{name: string}} */ (generationAlgo),
       /* extractable */ true,
diff --git a/src/service/owners-interface.js b/src/service/owners-interface.js
index 62182d97a5822..b870ceb1e38e1 100644
--- a/src/service/owners-interface.js
+++ b/src/service/owners-interface.js
@@ -24,7 +24,6 @@ export class OwnersInterface {
    * within this element will be managed by the owner and not Resources manager.
    * @param {!Element} element
    * @param {!AmpElement} owner
-   * @package
    */
   setOwner(element, owner) {}
 
diff --git a/src/service/performance-impl.js b/src/service/performance-impl.js
index ac03d37ae2b48..ea04a7310b9ae 100644
--- a/src/service/performance-impl.js
+++ b/src/service/performance-impl.js
@@ -14,13 +14,13 @@
  * limitations under the License.
  */
 
+import {Deferred} from '../utils/promise';
 import {Services} from '../services';
 import {VisibilityState} from '../visibility-state';
 import {dev} from '../log';
 import {dict, map} from '../utils/object';
 import {getMode} from '../mode';
 import {getService, registerServiceBuilder} from '../service';
-import {isCanary} from '../experiments';
 import {isStoryDocument} from '../utils/story';
 import {layoutRectLtwh} from '../layout-rect';
 import {throttle} from '../utils/rate-limit';
@@ -104,12 +104,19 @@ export class Performance {
     /** @private {string} */
     this.ampexp_ = '';
 
-    /** @private {number|null} */
-    this.makeBodyVisible_ = null;
-    /** @private {number|null} */
-    this.firstContentfulPaint_ = null;
-    /** @private {number|null} */
-    this.firstViewportReady_ = null;
+    this.fcpDeferred_ = new Deferred();
+    this.fvrDeferred_ = new Deferred();
+    this.mbvDeferred_ = new Deferred();
+
+    // Platform service must be installed before performance serivce is
+    this.platform_ = Services.platformFor(this.win);
+
+    // TODO (micajuineho) change this once all platforms
+    // support PerformancePaintTiming
+    // https://developer.mozilla.org/en-US/docs/Web/API/PerformancePaintTiming
+    if (!this.platform_.isChrome() && !this.platform_.isOpera()) {
+      this.fcpDeferred_.resolve(null);
+    }
 
     /**
      * How many times a layout jank metric has been ticked.
@@ -164,6 +171,7 @@ export class Performance {
      * @private {boolean}
      */
     this.supportsEventTimingAPIv76_ = false;
+
     /**
      * Whether the user agent supports the Event Timing API that shipped
      * with Chrome 77.
@@ -172,6 +180,13 @@ export class Performance {
      */
     this.supportsEventTimingAPIv77_ = false;
 
+    /**
+     * Whether the user agent supports the Largest Contentful Paint metric.
+     *
+     * @private {boolean}
+     */
+    this.supportsLargestContentfulPaint_ = false;
+
     const {PerformanceObserver} = this.win;
     if (PerformanceObserver) {
       const {supportedEntryTypes} = PerformanceObserver;
@@ -188,17 +203,34 @@ export class Performance {
         this.supportsEventTimingAPIv77_ = this.win.PerformanceObserver.supportedEntryTypes.includes(
           'first-input'
         );
+        this.supportsLargestContentfulPaint_ = this.win.PerformanceObserver.supportedEntryTypes.includes(
+          'largest-contentful-paint'
+        );
       }
     }
 
+    /**
+     * The latest reported largest contentful paint time, where the loadTime
+     * is specified.
+     *
+     * @private {number|null}
+     */
+    this.largestContentfulPaintLoadTime_ = null;
+
+    /**
+     * The latest reported largest contentful paint time, where the renderTime
+     * is specified.
+     *
+     * @private {number|null}
+     */
+    this.largestContentfulPaintRenderTime_ = null;
+
     this.boundOnVisibilityChange_ = this.onVisibilityChange_.bind(this);
     this.onAmpDocVisibilityChange_ = this.onAmpDocVisibilityChange_.bind(this);
 
     // Add RTV version as experiment ID, so we can slice the data by version.
     this.addEnabledExperiment('rtv-' + getMode(this.win).rtvVersion);
-    if (isCanary(this.win)) {
-      this.addEnabledExperiment('canary');
-    }
+
     // Tick document ready event.
     whenDocumentReady(win.document).then(() => {
       this.tick('dr');
@@ -240,24 +272,14 @@ export class Performance {
       this.flush();
     });
 
-    if (this.win.PerformanceLayoutJank) {
-      // Register a handler to record the layout jank metric when the page
-      // enters the hidden lifecycle state.
-      this.win.addEventListener(
-        VISIBILITY_CHANGE_EVENT,
-        this.boundOnVisibilityChange_,
-        {capture: true}
-      );
-
-      this.ampdoc_.onVisibilityChanged(this.onAmpDocVisibilityChange_);
-    }
-
-    if (
+    const registerVisibilityChangeListener =
+      this.win.PerformanceLayoutJank ||
+      this.supportsLargestContentfulPaint_ ||
       this.supportsLayoutInstabilityAPIv76_ ||
-      this.supportsLayoutInstabilityAPIv77_
-    ) {
-      // Register a handler to record the layout shift metric when the page
-      // enters the hidden lifecycle state.
+      this.supportsLayoutInstabilityAPIv77_;
+    // Register a handler to record metrics when the page enters the hidden
+    // lifecycle state.
+    if (registerVisibilityChangeListener) {
       this.win.addEventListener(
         VISIBILITY_CHANGE_EVENT,
         this.boundOnVisibilityChange_,
@@ -280,6 +302,13 @@ export class Performance {
         // Tick the "messaging ready" signal.
         this.tickDelta('msr', this.win.Date.now() - this.initTime_);
 
+        // Tick timeOrigin so that epoch time can be calculated by consumers.
+        this.tickDelta(
+          'timeOrigin',
+          this.win.performance.timeOrigin ||
+            this.win.performance.timing.navigationStart
+        );
+
         return this.maybeAddStoryExperimentId_();
       })
       .then(() => {
@@ -358,6 +387,13 @@ export class Performance {
         if (!entry.hadRecentInput) {
           this.aggregateShiftScore_ += entry.value;
         }
+      } else if (entry.entryType === 'largest-contentful-paint') {
+        if (entry.loadTime) {
+          this.largestContentfulPaintLoadTime_ = entry.loadTime;
+        }
+        if (entry.renderTime) {
+          this.largestContentfulPaintRenderTime_ = entry.renderTime;
+        }
       }
     };
 
@@ -379,13 +415,7 @@ export class Performance {
     }
 
     if (this.supportsEventTimingAPIv77_) {
-      // It's preferred to read first input delay entries that already occurred
-      // through the `buffered: true` flag, so create a separate
-      // PerformanceObserver to read this metric.
-      const firstInputObserver = new this.win.PerformanceObserver(list => {
-        list.getEntries().forEach(processEntry);
-        this.flush();
-      });
+      const firstInputObserver = this.createPerformanceObserver_(processEntry);
       firstInputObserver.observe({type: 'first-input', buffered: true});
     }
 
@@ -408,26 +438,22 @@ export class Performance {
     }
 
     if (this.supportsLayoutInstabilityAPIv77_) {
-      // Layout shift entries are not available from the Performance Timeline
-      // through `getEntriesByType`, so a separate PerformanceObserver is
-      // required for this metric.
-      const layoutInstabilityObserver = new this.win.PerformanceObserver(
-        list => {
-          list.getEntries().forEach(processEntry);
-          this.flush();
-        }
+      const layoutInstabilityObserver = this.createPerformanceObserver_(
+        processEntry
       );
       layoutInstabilityObserver.observe({type: 'layout-shift', buffered: true});
     }
 
+    if (this.supportsLargestContentfulPaint_) {
+      const lcpObserver = this.createPerformanceObserver_(processEntry);
+      lcpObserver.observe({type: 'largest-contentful-paint', buffered: true});
+    }
+
     if (entryTypesToObserve.length === 0) {
       return;
     }
 
-    const observer = new this.win.PerformanceObserver(list => {
-      list.getEntries().forEach(processEntry);
-      this.flush();
-    });
+    const observer = this.createPerformanceObserver_(processEntry);
 
     // Wrap observer.observe() in a try statement for testing, because
     // Webkit throws an error if the entry types to observe are not natively
@@ -440,6 +466,18 @@ export class Performance {
     }
   }
 
+  /**
+   * @param {function(!PerformanceEntry)} processEntry
+   * @return {!PerformanceObserver}
+   * @private
+   */
+  createPerformanceObserver_(processEntry) {
+    return new this.win.PerformanceObserver(list => {
+      list.getEntries().forEach(processEntry);
+      this.flush();
+    });
+  }
+
   /**
    * Reports the first input delay value calculated by a polyfill, if present.
    * @see https://github.com/GoogleChromeLabs/first-input-delay
@@ -470,6 +508,9 @@ export class Performance {
       ) {
         this.tickLayoutShiftScore_();
       }
+      if (this.supportsLargestContentfulPaint_) {
+        this.tickLargestContentfulPaint_();
+      }
     }
   }
 
@@ -489,6 +530,9 @@ export class Performance {
       ) {
         this.tickLayoutShiftScore_();
       }
+      if (this.supportsLargestContentfulPaint_) {
+        this.tickLargestContentfulPaint_();
+      }
     }
   }
 
@@ -581,6 +625,19 @@ export class Performance {
     }
   }
 
+  /**
+   * Tick the largest contentful paint metrics.
+   */
+  tickLargestContentfulPaint_() {
+    if (this.largestContentfulPaintLoadTime_ !== null) {
+      this.tickDelta('lcpl', this.largestContentfulPaintLoadTime_);
+    }
+    if (this.largestContentfulPaintRenderTime_ !== null) {
+      this.tickDelta('lcpr', this.largestContentfulPaintRenderTime_);
+    }
+    this.flush();
+  }
+
   /**
    * Measure the delay the user perceives of how long it takes
    * to load the initial viewport.
@@ -684,13 +741,13 @@ export class Performance {
     );
     switch (label) {
       case 'fcp':
-        this.firstContentfulPaint_ = storedVal;
+        this.fcpDeferred_.resolve(storedVal);
         break;
       case 'pc':
-        this.firstViewportReady_ = storedVal;
+        this.fvrDeferred_.resolve(storedVal);
         break;
       case 'mbv':
-        this.makeBodyVisible_ = storedVal;
+        this.mbvDeferred_.resolve(storedVal);
         break;
     }
   }
@@ -828,24 +885,24 @@ export class Performance {
   }
 
   /**
-   * @return {number|null}
+   * @return {!Promise<number>}
    */
   getFirstContentfulPaint() {
-    return this.firstContentfulPaint_;
+    return this.fcpDeferred_.promise;
   }
 
   /**
-   * @return {number|null}
+   * @return {!Promise<number>}
    */
   getMakeBodyVisible() {
-    return this.makeBodyVisible_;
+    return this.mbvDeferred_.promise;
   }
 
   /**
-   * @return {number|null}
+   * @return {!Promise<number>}
    */
   getFirstViewportReady() {
-    return this.firstViewportReady_;
+    return this.fvrDeferred_.promise;
   }
 }
 
diff --git a/src/service/platform-impl.js b/src/service/platform-impl.js
index ec414b8632224..18042c5e0d3a6 100644
--- a/src/service/platform-impl.js
+++ b/src/service/platform-impl.js
@@ -230,8 +230,7 @@ export class Platform {
 
 /**
  * @param {!Window} window
- * @return {*} TODO(#23582): Specify return type
  */
 export function installPlatformService(window) {
-  return registerServiceBuilder(window, 'platform', Platform);
+  registerServiceBuilder(window, 'platform', Platform);
 }
diff --git a/src/service/position-observer/position-observer-worker.js b/src/service/position-observer/position-observer-worker.js
index 2aca4ee260c75..052fbe54e71aa 100644
--- a/src/service/position-observer/position-observer-worker.js
+++ b/src/service/position-observer/position-observer-worker.js
@@ -40,7 +40,7 @@ const LOW_FIDELITY_FRAME_COUNT = 4;
  * @typedef {{
  *  positionRect: ?../../layout-rect.LayoutRectDef,
  *  viewportRect: !../../layout-rect.LayoutRectDef,
- *  relativePos: string,
+ *  relativePos: ?../../layout-rect.RelativePositions,
  * }}
  */
 export let PositionInViewportEntryDef;
@@ -146,7 +146,7 @@ export class PositionObserverWorker {
         /** @type {./position-observer-worker.PositionInViewportEntryDef}*/ ({
           positionRect: elementBox,
           viewportRect: viewportBox,
-          relativePos: '',
+          relativePos: null,
         })
       );
     });
diff --git a/src/service/resource.js b/src/service/resource.js
index 8619aefb09191..0900c9dbc99ad 100644
--- a/src/service/resource.js
+++ b/src/service/resource.js
@@ -81,7 +81,6 @@ let ViewportRatioDef;
 
 /**
  * A Resource binding for an AmpElement.
- * @package
  */
 export class Resource {
   /**
@@ -821,7 +820,6 @@ export class Resource {
    * once layout is complete. Only allowed to be called on a upgraded, built
    * and displayed element.
    * @return {!Promise}
-   * @package
    */
   startLayout() {
     if (this.layoutPromise_) {
diff --git a/src/service/resources-impl.js b/src/service/resources-impl.js
index e1b2fe4a63341..fa4320274678b 100644
--- a/src/service/resources-impl.js
+++ b/src/service/resources-impl.js
@@ -1009,16 +1009,51 @@ export class ResourcesImpl {
         ) {
           // 7. The new height (or one of the margins) is smaller than the
           // current one.
-        } else if (
-          request.newHeight == box.height &&
-          this.isWidthOnlyReflowFreeExpansion_(
-            resource.element,
-            request.newWidth || 0
-          )
-        ) {
-          // 8. Element is in viewport, but this is a width-only expansion that
-          // should not cause reflow.
-          resize = true;
+        } else if (request.newHeight == box.height) {
+          // 8. Element is in viewport, but this is a width-only expansion.
+          // Check whether this should be reflow-free, in which case,
+          // schedule a size change.
+          this.vsync_.run(
+            {
+              measure: state => {
+                state.resize = false;
+                const parent = resource.element.parentElement;
+                if (!parent) {
+                  return;
+                }
+
+                // If the element has siblings, it's possible that a width-expansion will
+                // cause some of them to be pushed down.
+                const parentWidth =
+                  (parent.getLayoutWidth && parent.getLayoutWidth()) ||
+                  parent./*OK*/ offsetWidth;
+                let cumulativeWidth = widthDiff;
+                for (let i = 0; i < parent.childElementCount; i++) {
+                  cumulativeWidth += parent.children[i]./*OK*/ offsetWidth;
+                  if (cumulativeWidth > parentWidth) {
+                    return;
+                  }
+                }
+                state.resize = true;
+              },
+              mutate: state => {
+                if (state.resize) {
+                  request.resource./*OK*/ changeSize(
+                    request.newHeight,
+                    request.newWidth,
+                    newMargins
+                  );
+                }
+                request.resource.overflowCallback(
+                  /* overflown */ !state.resize,
+                  request.newHeight,
+                  request.newWidth,
+                  newMargins
+                );
+              },
+            },
+            {}
+          );
         } else {
           // 9. Element is in viewport don't resize and try overflow callback
           // instead.
@@ -1101,27 +1136,6 @@ export class ResourcesImpl {
     }
   }
 
-  /**
-   * Returns true if reflow will not be caused by expanding the given element's
-   * width to the given amount.
-   * @param {!Element} element
-   * @param {number} width
-   * @return {boolean}
-   */
-  isWidthOnlyReflowFreeExpansion_(element, width) {
-    const parent = element.parentElement;
-    // If the element has siblings, it's possible that a width-expansion will
-    // cause some of them to be pushed down.
-    if (!parent || parent.childElementCount > 1) {
-      return false;
-    }
-    const parentWidth =
-      (parent.getImpl && parent.getImpl().getLayoutWidth()) || -1;
-    // Reflow will not happen if the parent element is at least as wide as the
-    // new width.
-    return parentWidth >= width;
-  }
-
   /**
    * Returns true if element is within 15% and 1000px of document bottom.
    * Caller can provide current/initial layout boxes as an optimization.
@@ -1202,7 +1216,7 @@ export class ResourcesImpl {
     this.relayoutAll_ = false;
     const relayoutTop = this.relayoutTop_;
     this.relayoutTop_ = -1;
-    const elementsThatScrolled = this.elementsThatScrolled_.splice(0, Infinity);
+    const elementsThatScrolled = this.elementsThatScrolled_;
 
     // Phase 1: Build and relayout as needed. All mutations happen here.
     let relayoutCount = 0;
@@ -1273,6 +1287,7 @@ export class ResourcesImpl {
         }
       }
     }
+    elementsThatScrolled.length = 0;
 
     // Unload all in one cycle.
     if (toUnload) {
diff --git a/src/service/standard-actions-impl.js b/src/service/standard-actions-impl.js
index 6ebf1e3386639..c310d24565520 100644
--- a/src/service/standard-actions-impl.js
+++ b/src/service/standard-actions-impl.js
@@ -78,8 +78,8 @@ export class StandardActions {
       ? opt_win.document.documentElement
       : ampdoc.getHeadNode();
 
-    /** @const @private {!./resources-interface.ResourcesInterface} */
-    this.resources_ = Services.resourcesForDoc(ampdoc);
+    /** @const @private {!./mutator-interface.MutatorInterface} */
+    this.mutator_ = Services.mutatorForDoc(ampdoc);
 
     /** @const @private {!./viewport/viewport-interface.ViewportInterface} */
     this.viewport_ = Services.viewportForDoc(ampdoc);
@@ -319,7 +319,7 @@ export class StandardActions {
   handleHide_(invocation) {
     const target = dev().assertElement(invocation.node);
 
-    this.resources_.mutateElement(target, () => {
+    this.mutator_.mutateElement(target, () => {
       if (target.classList.contains('i-amphtml-element')) {
         target./*OK*/ collapse();
       } else {
@@ -337,7 +337,8 @@ export class StandardActions {
    * @return {?Promise}
    * @private Visible to tests only.
    */
-  handleShow_({node}) {
+  handleShow_(invocation) {
+    const {node} = invocation;
     const target = dev().assertElement(node);
     const ownerWindow = toWin(target.ownerDocument.defaultView);
 
@@ -350,7 +351,7 @@ export class StandardActions {
       return null;
     }
 
-    this.resources_.measureElement(() => {
+    this.mutator_.measureElement(() => {
       if (
         computedStyle(ownerWindow, target).display == 'none' &&
         !isShowable(target)
@@ -370,7 +371,7 @@ export class StandardActions {
     if (autofocusElOrNull && Services.platformFor(ownerWindow).isIos()) {
       this.handleShowSync_(target, autofocusElOrNull);
     } else {
-      this.resources_.mutateElement(target, () => {
+      this.mutator_.mutateElement(target, () => {
         this.handleShowSync_(target, autofocusElOrNull);
       });
     }
@@ -425,7 +426,7 @@ export class StandardActions {
       return null;
     }
 
-    this.resources_.mutateElement(target, () => {
+    this.mutator_.mutateElement(target, () => {
       if (args['force'] !== undefined) {
         // must be boolean, won't do type conversion
         const shouldForce = user().assertBoolean(
diff --git a/src/service/template-impl.js b/src/service/template-impl.js
index d0d3e792bc2d3..c99977326d9fd 100644
--- a/src/service/template-impl.js
+++ b/src/service/template-impl.js
@@ -27,7 +27,7 @@ import {rootNodeFor, scopedQuerySelector} from '../dom';
  */
 
 /**
- * @typedef {function(new:BaseTemplate, !Element, !Window)}
+ * @typedef {typeof BaseTemplate}
  */
 let TemplateClassDef;
 
@@ -292,7 +292,7 @@ export class Templates {
     } else if (opt_querySelector) {
       return scopedQuerySelector(parent, opt_querySelector);
     } else {
-      return parent.querySelector('template, script');
+      return parent.querySelector('template, script[type="text/plain"]');
     }
   }
 
diff --git a/src/service/url-expander/OWNERS b/src/service/url-expander/OWNERS
new file mode 100644
index 0000000000000..f3fc2a2f602ff
--- /dev/null
+++ b/src/service/url-expander/OWNERS
@@ -0,0 +1,10 @@
+// For an explanation of the OWNERS rules and syntax, see:
+// https://github.com/ampproject/amp-github-apps/blob/master/owners/OWNERS.example
+
+{
+  rules: [
+    {
+      owners: [{name: 'ampproject/wg-analytics'}],
+    },
+  ],
+}
diff --git a/src/service/url-expander/expander.js b/src/service/url-expander/expander.js
index a8c3498d7be19..b78808eedc4b1 100644
--- a/src/service/url-expander/expander.js
+++ b/src/service/url-expander/expander.js
@@ -15,7 +15,7 @@
  */
 
 import {hasOwn} from '../../utils/object';
-import {rethrowAsync, user, userAssert} from '../../log';
+import {rethrowAsync, user} from '../../log';
 import {trimStart} from '../../string';
 import {tryResolve} from '../../utils/promise';
 
@@ -25,10 +25,6 @@ const PARSER_IGNORE_FLAG = '`';
 /** @private @const {string} */
 const TAG = 'Expander';
 
-/** A whitelist for replacements whose values should not be %-encoded. */
-/** @const {Object<string, boolean>} */
-export const NOENCODE_WHITELIST = {'ANCESTOR_ORIGIN': true};
-
 /** Rudamentary parser to handle nested Url replacement. */
 export class Expander {
   /**
@@ -139,7 +135,6 @@ export class Expander {
     let match = matches[matchIndex];
     let numOfPendingCalls = 0;
     let ignoringChars = false;
-    let nextArgShouldBeRaw = false;
 
     const evaluateNextLevel = encode => {
       let builder = '';
@@ -147,10 +142,11 @@ export class Expander {
       const args = [];
 
       while (urlIndex < url.length && matchIndex <= matches.length) {
+        const trimmedBuilder = builder.trim();
         if (match && urlIndex === match.start) {
           // Collect any chars that may be prefixing the macro, if we are in
           // a nested context trim the args.
-          if (builder.trim().length) {
+          if (trimmedBuilder) {
             results.push(numOfPendingCalls ? trimStart(builder) : builder);
           }
 
@@ -170,10 +166,11 @@ export class Expander {
             };
           } else {
             // Macro is from the global source.
-            binding = Object.assign({}, this.variableSource_.get(match.name), {
+            binding = {
+              ...this.variableSource_.get(match.name),
               name: match.name,
               encode,
-            });
+            };
           }
 
           urlIndex = match.stop + 1;
@@ -197,16 +194,18 @@ export class Expander {
         } else if (url[urlIndex] === PARSER_IGNORE_FLAG) {
           if (!ignoringChars) {
             ignoringChars = true;
-            nextArgShouldBeRaw = true;
-            userAssert(
-              builder.trim() === '',
-              `The substring "${builder}" was lost during url-replacement. ` +
-                'Please ensure the url syntax is correct'
-            );
-            builder = '';
+            // Collect any chars that may exist before backticks, eg FOO(a`b`)
+            if (trimmedBuilder) {
+              results.push(trimmedBuilder);
+            }
           } else {
             ignoringChars = false;
+            // Collect any chars inside backticks without trimming whitespace.
+            if (builder.length) {
+              results.push(builder);
+            }
           }
+          builder = '';
           urlIndex++;
         } else if (
           numOfPendingCalls &&
@@ -214,13 +213,10 @@ export class Expander {
           !ignoringChars
         ) {
           // Commas tell us to create a new argument when in nested context and
-          // not ignoring them due to backticks. We push any string built so far,
-          // create a new array for the next argument, and reset our string
-          // builder.
-          if (builder.length) {
-            const nextArg = nextArgShouldBeRaw ? builder : builder.trim();
-            results.push(nextArg);
-            nextArgShouldBeRaw = false;
+          // we push any string built so far, create a new array for the next
+          // argument, and reset our string builder.
+          if (trimmedBuilder) {
+            results.push(trimmedBuilder);
           }
           args.push(results);
           results = [];
@@ -243,12 +239,10 @@ export class Expander {
           urlIndex++;
           numOfPendingCalls--;
           const binding = stack.pop();
-          const nextArg = nextArgShouldBeRaw ? builder : builder.trim();
-          if (nextArg) {
-            results.push(nextArg);
+          if (trimmedBuilder) {
+            results.push(trimmedBuilder);
           }
           args.push(results);
-          nextArgShouldBeRaw = false;
           const value = this.evaluateBinding_(binding, /* opt_args */ args);
           return value;
         } else {
@@ -315,14 +309,12 @@ export class Expander {
       binding = bindingInfo.async || bindingInfo.sync;
     }
 
-    // We should only ever encode the top level resolution, or not at all.
-    const shouldEncode = encode && !NOENCODE_WHITELIST[name];
     if (this.sync_) {
       const result = this.evaluateBindingSync_(binding, name, opt_args);
-      return shouldEncode ? encodeURIComponent(result) : result;
+      return encode ? encodeURIComponent(result) : result;
     } else {
       return this.evaluateBindingAsync_(binding, name, opt_args).then(result =>
-        shouldEncode ? encodeURIComponent(result) : result
+        encode ? encodeURIComponent(result) : result
       );
     }
   }
diff --git a/src/service/url-replacements-impl.js b/src/service/url-replacements-impl.js
index ff23ac41a45d8..e3879806c8803 100644
--- a/src/service/url-replacements-impl.js
+++ b/src/service/url-replacements-impl.js
@@ -45,7 +45,6 @@ import {WindowInterface} from '../window-interface';
 import {getTrackImpressionPromise} from '../impression.js';
 import {hasOwn} from '../utils/object';
 import {internalRuntimeVersion} from '../internal-version';
-import {tryResolve} from '../utils/promise';
 
 /** @private @const {string} */
 const TAG = 'UrlReplacements';
@@ -262,12 +261,6 @@ export class GlobalVariableSource extends VariableSource {
       return this.getFragmentParamData_(param, defaultValue);
     });
 
-    // Returns the first item in the ancestorOrigins array, if available.
-    this.setAsync(
-      'ANCESTOR_ORIGIN',
-      this.getViewerIntegrationValue_('ancestorOrigin', 'ANCESTOR_ORIGIN')
-    );
-
     /**
      * Stores client ids that were generated during this page view
      * indexed by scope.
@@ -349,7 +342,7 @@ export class GlobalVariableSource extends VariableSource {
           const variant = variants[/** @type {string} */ (experiment)];
           userAssert(
             variant !== undefined,
-            'The value passed to VARIANT() is not a valid experiment name:' +
+            'The value passed to VARIANT() is not a valid experiment in <amp-experiment>:' +
               experiment
           );
           // When no variant assigned, use reserved keyword 'none'.
@@ -643,36 +636,21 @@ export class GlobalVariableSource extends VariableSource {
         .then(details => (details ? details[property] : ''));
     });
 
-    this.setAsync(
-      'STORY_PAGE_INDEX',
-      this.getStoryValue_('pageIndex', 'STORY_PAGE_INDEX')
-    );
-
-    this.setAsync(
-      'STORY_PAGE_ID',
-      this.getStoryValue_('pageId', 'STORY_PAGE_ID')
-    );
-
     this.setAsync('FIRST_CONTENTFUL_PAINT', () => {
-      return tryResolve(() =>
-        Services.performanceFor(win).getFirstContentfulPaint()
-      );
+      return Services.performanceFor(win).getFirstContentfulPaint();
     });
 
     this.setAsync('FIRST_VIEWPORT_READY', () => {
-      return tryResolve(() =>
-        Services.performanceFor(win).getFirstViewportReady()
-      );
+      return Services.performanceFor(win).getFirstViewportReady();
     });
 
     this.setAsync('MAKE_BODY_VISIBLE', () => {
-      return tryResolve(() =>
-        Services.performanceFor(win).getMakeBodyVisible()
-      );
+      return Services.performanceFor(win).getMakeBodyVisible();
     });
 
     this.setAsync('AMP_STATE', key => {
       // This is safe since AMP_STATE is not an A4A whitelisted variable.
+      dev().expectedError(TAG, 'AMP_STATE will be moved to amp-analytics');
       const root = this.ampdoc.getRootNode();
       const element =
         /** @type {!Element|!ShadowRoot} */ (root.documentElement || root);
@@ -845,50 +823,6 @@ export class GlobalVariableSource extends VariableSource {
       return getter(/** @type {!ShareTrackingFragmentsDef} */ (fragments));
     });
   }
-
-  /**
-   * Resolves the value via amp-story's service.
-   * @param {string} property
-   * @param {string} name
-   * @return {!AsyncResolverDef}
-   * @private
-   */
-  getStoryValue_(property, name) {
-    return () => {
-      const service = Services.storyVariableServiceForOrNull(this.ampdoc.win);
-      return service.then(storyVariables => {
-        userAssert(
-          storyVariables,
-          'To use variable %s amp-story should be configured',
-          name
-        );
-        return storyVariables[property];
-      });
-    };
-  }
-
-  /**
-   * Resolves the value via amp-viewer-integration's service.
-   * @param {string} property
-   * @param {string} name
-   * @return {!AsyncResolverDef}
-   * @private
-   */
-  getViewerIntegrationValue_(property, name) {
-    return /** @type {!AsyncResolverDef} */ ((param, defaultValue = '') => {
-      const service = Services.viewerIntegrationVariableServiceForOrNull(
-        this.ampdoc.win
-      );
-      return service.then(viewerIntegrationVariables => {
-        userAssert(
-          viewerIntegrationVariables,
-          'To use variable %s amp-viewer-integration must be installed',
-          name
-        );
-        return viewerIntegrationVariables[property](param, defaultValue);
-      });
-    });
-  }
 }
 
 /**
diff --git a/src/service/variable-source.js b/src/service/variable-source.js
index 0b689849752c2..29a636c63ce4d 100644
--- a/src/service/variable-source.js
+++ b/src/service/variable-source.js
@@ -154,7 +154,6 @@ export function getTimingDataSync(win, startEvent, endEvent) {
  * @param {!Window} win
  * @param {string} attribute
  * @return {ResolverReturnDef}
- * @private
  */
 export function getNavigationData(win, attribute) {
   const navigationInfo = win['performance'] && win['performance']['navigation'];
@@ -279,7 +278,7 @@ export class VariableSource {
     if (!this.initialized_) {
       this.initialize_();
     }
-    const all = Object.assign({}, this.replacements_, opt_bindings);
+    const all = {...this.replacements_, ...opt_bindings};
     return this.buildExpr_(Object.keys(all), opt_whiteList);
   }
 
diff --git a/src/service/video-manager-impl.js b/src/service/video-manager-impl.js
index d12a5f7dc90bd..e31aa5177293f 100644
--- a/src/service/video-manager-impl.js
+++ b/src/service/video-manager-impl.js
@@ -1321,8 +1321,8 @@ function isLandscape(win) {
 /** @visibleForTesting */
 export const PERCENTAGE_INTERVAL = 5;
 
-/** @private */
-const PERCENTAGE_FREQUENCY_WHEN_PAUSED_MS = 500;
+/** @visibleForTesting */
+export const PERCENTAGE_FREQUENCY_WHEN_PAUSED_MS = 500;
 
 /** @private */
 const PERCENTAGE_FREQUENCY_MIN_MS = 250;
@@ -1354,6 +1354,15 @@ function calculateActualPercentageFrequencyMs(durationSeconds) {
   );
 }
 
+/**
+ * Handle cases such as livestreams or videos with no duration information is
+ * available, where 1 second is the default duration for some video players.
+ * @param {?number=} duration
+ * @return {boolean}
+ */
+const isDurationFiniteNonZero = duration =>
+  !!duration && !isNaN(duration) && duration > 1;
+
 /** @visibleForTesting */
 export class AnalyticsPercentageTracker {
   /**
@@ -1433,9 +1442,7 @@ export class AnalyticsPercentageTracker {
     const {video} = this.entry_;
     const duration = video.getDuration();
 
-    // Livestreams or videos with no duration information available,
-    // where 1 second is the default duration for some video players
-    if (!duration || isNaN(duration) || duration <= 1) {
+    if (!isDurationFiniteNonZero(duration)) {
       return false;
     }
 
@@ -1487,6 +1494,12 @@ export class AnalyticsPercentageTracker {
     }
 
     const duration = video.getDuration();
+    // TODO(#25954): Further investigate root cause and remove this protection
+    // if appropriate.
+    if (!isDurationFiniteNonZero(duration)) {
+      timer.delay(calculateAgain, PERCENTAGE_FREQUENCY_WHEN_PAUSED_MS);
+      return;
+    }
 
     const frequencyMs = calculateActualPercentageFrequencyMs(duration);
 
diff --git a/src/service/viewer-impl.js b/src/service/viewer-impl.js
index 2411e28a9c262..06c48fac82fea 100644
--- a/src/service/viewer-impl.js
+++ b/src/service/viewer-impl.js
@@ -19,7 +19,12 @@ import {Observable} from '../observable';
 import {Services} from '../services';
 import {ViewerInterface} from './viewer-interface';
 import {VisibilityState} from '../visibility-state';
-import {dev, devAssert, duplicateErrorIfNecessary} from '../log';
+import {
+  dev,
+  devAssert,
+  duplicateErrorIfNecessary,
+  stripUserError,
+} from '../log';
 import {findIndex} from '../utils/array';
 import {
   getSourceOrigin,
@@ -856,17 +861,22 @@ export class ViewerImpl {
 }
 
 /**
- * Creates an error for the case where a channel cannot be established.
+ * Creates a dev error for the case where a channel cannot be established.
  * @param {*=} opt_reason
  * @return {!Error}
  */
 function getChannelError(opt_reason) {
+  let channelError;
   if (opt_reason instanceof Error) {
     opt_reason = duplicateErrorIfNecessary(opt_reason);
     opt_reason.message = 'No messaging channel: ' + opt_reason.message;
-    return opt_reason;
+    channelError = opt_reason;
+  } else {
+    channelError = new Error('No messaging channel: ' + opt_reason);
   }
-  return new Error('No messaging channel: ' + opt_reason);
+  // Force convert user error to dev error
+  channelError.message = stripUserError(channelError.message);
+  return channelError;
 }
 
 /**
diff --git a/src/service/xhr-impl.js b/src/service/xhr-impl.js
index 087e9d4bb7269..0228a20179195 100644
--- a/src/service/xhr-impl.js
+++ b/src/service/xhr-impl.js
@@ -23,10 +23,12 @@ import {
   setupInput,
   setupJsonFetchInit,
 } from '../utils/xhr-utils';
+import {dev, user} from '../log';
 import {getCorsUrl, parseUrlDeprecated} from '../url';
 import {getService, registerServiceBuilder} from '../service';
 import {isFormDataWrapper} from '../form-data-wrapper';
-import {user} from '../log';
+import {parseJson} from '../json';
+import {startsWith} from '../string';
 
 /**
  * A service that polyfills Fetch API for use within AMP.
@@ -147,6 +149,30 @@ export class Xhr {
     return this.fetch(input, setupInit(opt_init, 'text/plain'));
   }
 
+  /**
+   * A subsitute for the standard response.json(), which may optionally strip a prefix before calling JSON.parse().
+   *
+   * @param {!Response} res fetch response to convert to json.
+   * @param {string|undefined} prefix to strip away.
+   * @return {Promise<*>}
+   */
+  xssiJson(res, prefix) {
+    if (!prefix) {
+      return res.json();
+    }
+
+    return res.text().then(txt => {
+      if (!startsWith(txt, dev().assertString(prefix))) {
+        user().warn(
+          'XHR',
+          `Failed to strip missing prefix "${prefix}" in fetch response.`
+        );
+        return parseJson(txt);
+      }
+      return parseJson(txt.slice(prefix.length));
+    });
+  }
+
   /**
    * @param {string} input URL
    * @param {?FetchInitDef=} opt_init Fetch options object.
diff --git a/src/services.js b/src/services.js
index 601a139f41476..8aebcd4d2374f 100644
--- a/src/services.js
+++ b/src/services.js
@@ -341,6 +341,28 @@ export class Services {
     ));
   }
 
+  /**
+   * @param {!Element|!./service/ampdoc-impl.AmpDoc} elementOrAmpDoc
+   * @return {!../extensions/amp-next-page/1.0/service.NextPageService}
+   */
+  static nextPageServiceForDoc(elementOrAmpDoc) {
+    return /** @type {!../extensions/amp-next-page/1.0/service.NextPageService} */ (getServiceForDoc(
+      elementOrAmpDoc,
+      'next-page'
+    ));
+  }
+
+  /**
+   * @param {!Element|!./service/ampdoc-impl.AmpDoc} elementOrAmpDoc
+   * @return {!./service/mutator-interface.MutatorInterface}
+   */
+  static mutatorForDoc(elementOrAmpDoc) {
+    return /** @type {!./service/mutator-interface.MutatorInterface} */ (getServiceForDoc(
+      elementOrAmpDoc,
+      'resources'
+    ));
+  }
+
   /**
    * @param {!Element|!./service/ampdoc-impl.AmpDoc} elementOrAmpDoc
    * @return {!./service/owners-interface.OwnersInterface}
@@ -398,6 +420,14 @@ export class Services {
     ));
   }
 
+  /**
+   * @param {!Window} window
+   * @return {!./preconnect.PreconnectService}
+   */
+  static preconnectFor(window) {
+    return getService(window, 'preconnect');
+  }
+
   /**
    * @param {!Element|!./service/ampdoc-impl.AmpDoc} elementOrAmpDoc
    * @return {!./service/resources-interface.ResourcesInterface}
@@ -594,22 +624,6 @@ export class Services {
     return getService(win, 'localization-v01');
   }
 
-  /**
-   * @param {!Window} win
-   * @return {?Promise<?../extensions/amp-viewer-integration/0.1/variable-service.ViewerIntegrationVariableDef>}
-   */
-  static viewerIntegrationVariableServiceForOrNull(win) {
-    return (
-      /** @type {!Promise<?../extensions/amp-viewer-integration/0.1/variable-service.ViewerIntegrationVariableDef>} */
-      (getElementServiceIfAvailable(
-        win,
-        'viewer-integration-variable',
-        'amp-viewer-integration',
-        true
-      ))
-    );
-  }
-
   /**
    * @param {!Element|!ShadowRoot} element
    * @return {!Promise<!../extensions/amp-animation/0.1/web-animation-service.WebAnimationService>}
diff --git a/src/ssr-template-helper.js b/src/ssr-template-helper.js
index 8128a2672f62e..bdaf88b4d3f37 100644
--- a/src/ssr-template-helper.js
+++ b/src/ssr-template-helper.js
@@ -48,12 +48,12 @@ export class SsrTemplateHelper {
   }
 
   /**
-   * Whether the viewer can render templates. A doc-level opt in as
+   * Whether the viewer should render templates. A doc-level opt in as
    * trusted viewers must set this capability explicitly, as a security
    * measure for potential abuse of feature.
    * @return {boolean}
    */
-  isSupported() {
+  isEnabled() {
     const ampdoc = this.viewer_.getAmpDoc();
     if (ampdoc.isSingleDoc()) {
       const htmlElement = ampdoc.getRootNode().documentElement;
@@ -64,6 +64,22 @@ export class SsrTemplateHelper {
     return false;
   }
 
+  /**
+   * Asserts that the viewer is from a trusted origin.
+   *
+   * @param {!Element} element
+   * @return {!Promise}
+   */
+  assertTrustedViewer(element) {
+    return this.viewer_.isTrustedViewer().then(trusted => {
+      userAssert(
+        trusted,
+        'Refused to attempt SSR in untrusted viewer: ',
+        element
+      );
+    });
+  }
+
   /**
    * Proxies xhr and template rendering to the viewer.
    * Returns the renderable response, for use with applySsrOrCsrTemplate.
@@ -80,15 +96,17 @@ export class SsrTemplateHelper {
     if (!opt_templates) {
       mustacheTemplate = this.templates_.maybeFindTemplate(element);
     }
-    return this.viewer_.sendMessageAwaitResponse(
-      'viewerRenderTemplate',
-      this.buildPayload_(
-        request,
-        mustacheTemplate,
-        opt_templates,
-        opt_attributes
-      )
-    );
+    return this.assertTrustedViewer(element).then(() => {
+      return this.viewer_.sendMessageAwaitResponse(
+        'viewerRenderTemplate',
+        this.buildPayload_(
+          request,
+          mustacheTemplate,
+          opt_templates,
+          opt_attributes
+        )
+      );
+    });
   }
 
   /**
@@ -96,19 +114,21 @@ export class SsrTemplateHelper {
    * If SSR is supported, data is assumed to be from ssr() above.
    * @param {!Element} element
    * @param {(?JsonObject|string|undefined|!Array)} data
-   * @return {!Promise}
+   * @return {!Promise<!Element>}
    */
   applySsrOrCsrTemplate(element, data) {
     let renderTemplatePromise;
-    if (this.isSupported()) {
+    if (this.isEnabled()) {
       userAssert(
         typeof data['html'] === 'string',
         'Server side html response must be defined'
       );
-      renderTemplatePromise = this.templates_.findAndSetHtmlForTemplate(
-        element,
-        /** @type {string} */ (data['html'])
-      );
+      renderTemplatePromise = this.assertTrustedViewer(element).then(() => {
+        return this.templates_.findAndSetHtmlForTemplate(
+          element,
+          /** @type {string} */ (data['html'])
+        );
+      });
     } else if (isArray(data)) {
       renderTemplatePromise = this.templates_.findAndRenderTemplateArray(
         element,
diff --git a/src/url-rewrite.js b/src/url-rewrite.js
index 88d14634b7290..6e6045ef1e077 100644
--- a/src/url-rewrite.js
+++ b/src/url-rewrite.js
@@ -88,7 +88,6 @@ export function rewriteAttributesForElement(
  * @param {string} attrName Lowercase attribute name.
  * @param {string} attrValue
  * @return {string}
- * @private
  * @visibleForTesting
  */
 export function rewriteAttributeValue(tagName, attrName, attrValue) {
diff --git a/src/utils/object.js b/src/utils/object.js
index 9e7452106f78a..28372a63a7bbb 100644
--- a/src/utils/object.js
+++ b/src/utils/object.js
@@ -143,3 +143,28 @@ export function omit(o, props) {
     return acc;
   }, {});
 }
+
+/**
+ * @param {!Object|null|undefined} o1
+ * @param {!Object|null|undefined} o2
+ * @return {boolean}
+ */
+export function objectsEqualShallow(o1, o2) {
+  if (o1 == null || o2 == null) {
+    // Null is only equal to null, and undefined to undefined.
+    return o1 === o2;
+  }
+
+  for (const k in o1) {
+    if (o1[k] !== o2[k]) {
+      return false;
+    }
+  }
+  for (const k in o2) {
+    if (o2[k] !== o1[k]) {
+      return false;
+    }
+  }
+
+  return true;
+}
diff --git a/src/utils/story.js b/src/utils/story.js
index 850d2842af5f9..6db2f12d8ffaf 100644
--- a/src/utils/story.js
+++ b/src/utils/story.js
@@ -14,7 +14,8 @@
  * limitations under the License.
  */
 
-import {closestAncestorElementBySelector, waitForChild} from '../dom';
+import {Services} from '../services';
+import {closestAncestorElementBySelector, waitForChildPromise} from '../dom';
 
 /**
  * Checks if an element descends from `amp-story` in order to configure
@@ -30,20 +31,24 @@ export function descendsFromStory(element) {
 
 /**
  * Returns true if the document is an amp-story.
+ * Times out after `timeout` ms (default is 2000).
+ *
  * @param {!../service/ampdoc-impl.AmpDoc} ampdoc
  * @return {!Promise<boolean>}
  */
 export function isStoryDocument(ampdoc) {
-  return new Promise(resolve => {
-    ampdoc.waitForBodyOpen().then(() => {
-      const body = ampdoc.getBody();
-      waitForChild(
-        body,
-        () => !!body.firstElementChild,
-        () => {
-          resolve(body.firstElementChild.tagName === 'AMP-STORY');
-        }
+  return ampdoc.waitForBodyOpen().then(() => {
+    const body = ampdoc.getBody();
+    const childPromise = waitForChildPromise(
+      body,
+      () => !!body.firstElementChild
+    );
+    // 2s timeout for edge case where body has no element children.
+    return Services.timerFor(ampdoc.win)
+      .timeoutPromise(2000, childPromise)
+      .then(
+        () => body.firstElementChild.tagName === 'AMP-STORY',
+        () => false
       );
-    });
   });
 }
diff --git a/src/utils/xhr-utils.js b/src/utils/xhr-utils.js
index a7c0b77a54f07..2a112e52b0559 100644
--- a/src/utils/xhr-utils.js
+++ b/src/utils/xhr-utils.js
@@ -77,10 +77,9 @@ const allowedJsonBodyTypes_ = [isArray, isObject];
  *     cloneable.
  * @return {{input: string, init: !FetchInitDef}} The serialized structurally-
  *     cloneable request.
- * @private
  */
 export function toStructuredCloneable(input, init) {
-  const newInit = Object.assign({}, init);
+  const newInit = {...init};
   if (isFormDataWrapper(init.body)) {
     const wrapper = /** @type {!FormDataWrapperInterface} */ (init.body);
     newInit.headers['Content-Type'] = 'multipart/form-data;charset=utf-8';
@@ -193,7 +192,6 @@ export function fromStructuredCloneable(response, responseType) {
  * @return {!Promise<!Response|undefined>}
  *     A response returned by the interceptor if XHR is intercepted or
  *     `Promise<undefined>` otherwise.
- * @private
  */
 export function getViewerInterceptResponse(win, ampdocSingle, input, init) {
   if (!ampdocSingle) {
@@ -373,7 +371,6 @@ function isRetriable(status) {
  * Returns the response if successful or otherwise throws an error.
  * @param {!Response} response
  * @return {!Promise<!Response>}
- * @private Visible for testing
  */
 export function assertSuccess(response) {
   return new Promise(resolve => {
diff --git a/src/validator-integration.js b/src/validator-integration.js
index a41ee26eea829..8525988d50b19 100644
--- a/src/validator-integration.js
+++ b/src/validator-integration.js
@@ -58,9 +58,16 @@ export function maybeValidate(win) {
  * @param {string} url
  * @return {!Promise}
  */
-function loadScript(doc, url) {
+export function loadScript(doc, url) {
   const script = doc.createElement('script');
   script.src = url;
+
+  // Propagate nonce to all generated script tags.
+  const currentScript = doc.head.querySelector('script[nonce]');
+  if (currentScript) {
+    script.setAttribute('nonce', currentScript.getAttribute('nonce'));
+  }
+
   const promise = loadPromise(script).then(
     () => {
       doc.head.removeChild(script);
diff --git a/src/video-iframe-integration.js b/src/video-iframe-integration.js
index 5a0812dbe982c..f5cca72198e36 100644
--- a/src/video-iframe-integration.js
+++ b/src/video-iframe-integration.js
@@ -72,16 +72,6 @@ const validMethods = [
   'hidecontrols',
 ];
 
-const validEvents = [
-  'canplay',
-  'load',
-  'playing',
-  'pause',
-  'ended',
-  'muted',
-  'unmuted',
-];
-
 /**
  * @param {function()} win
  * @param {*} opt_initializer
@@ -346,11 +336,6 @@ export class AmpVideoIntegration {
    * @param {string} event
    */
   postEvent(event) {
-    userAssert(
-      validEvents.indexOf(event) > -1,
-      `%s Invalid event [${event}]`,
-      TAG
-    );
     this.postToParent_(dict({'event': event}));
   }
 
@@ -379,7 +364,7 @@ export class AmpVideoIntegration {
    */
   postToParent_(data, opt_callback) {
     const id = this.callCounter_++;
-    const completeData = Object.assign({id}, data);
+    const completeData = {id, ...data};
 
     if (!getMode(this.win_).test && this.win_.parent) {
       this.win_.parent./*OK*/ postMessage(completeData, '*');
diff --git a/src/video-interface.js b/src/video-interface.js
index 9d386908d7e66..a04244ec90135 100644
--- a/src/video-interface.js
+++ b/src/video-interface.js
@@ -51,25 +51,32 @@ export class VideoInterface {
   isInteractive() {}
 
   /**
-   * Current playback time in seconds at time of trigger
+   * Current playback time in seconds at time of trigger.
+   *
+   * This is used for analytics metadata.
+   *
    * @return {number}
    */
   getCurrentTime() {}
 
   /**
    * Total duration of the video in seconds
+   *
+   * This is used for analytics metadata.
+   *
    * @return {number}
    */
   getDuration() {}
 
   /**
    * Get a 2d array of start and stop times that the user has watched.
+   * This is used for analytics metadata.
    * @return {!Array<Array<number>>}
    */
   getPlayedRanges() {}
 
   /**
-   * Plays the video..
+   * Plays the video.
    *
    * @param {boolean} unusedIsAutoplay Whether the call to the `play` method is
    * triggered by the autoplay functionality. Video players can use this hint
@@ -84,11 +91,15 @@ export class VideoInterface {
 
   /**
    * Mutes the video.
+   * Implementation is required for autoplay and mute/unmute controls on docked
+   * video.
    */
   mute() {}
 
   /**
    * Unmutes the video.
+   * Implementation is required for autoplay and mute/unmute controls on docked
+   * video.
    */
   unmute() {}
 
@@ -96,6 +107,8 @@ export class VideoInterface {
    * Makes the video UI controls visible.
    *
    * AMP will not call this method if `controls` attribute is not set.
+   *
+   * Implementation is required for docked video.
    */
   showControls() {}
 
@@ -103,36 +116,41 @@ export class VideoInterface {
    * Hides the video UI controls.
    *
    * AMP will not call this method if `controls` attribute is not set.
+   *
+   * Implementation is required for docked video.
    */
   hideControls() {}
 
   /**
    * Returns video's meta data (artwork, title, artist, album, etc.) for use
    * with the Media Session API
-   * artwork (Array): URL to the poster image (preferably a 512x512 PNG)
-   * title (string): Name of the video
-   * artist (string): Name of the video's author/artist
-   * album (string): Name of the video's album if it exists
    * @return {!./mediasession-helper.MetadataDef|undefined} metadata
+   *   - artwork (Array): URL to the poster image (preferably a 512x512 PNG)
+   *   - title (string): Name of the video
+   *   - artist (string): Name of the video's author/artist
+   *   - album (string): Name of the video's album if it exists
    */
   getMetadata() {}
 
   /**
-   * If this returns true then it will be assumed that the player implements
-   * a feature to enter fullscreen on device rotation internally, so that the
-   * video manager does not override it. If not, the video manager will
-   * implement this feature automatically for videos with the attribute
-   * `rotate-to-fullscreen`.
+   * If returning true, it's assumed that the embedded video document internally
+   * implements a feature to enter fullscreen on device rotation, so that the
+   * VideoManager does not override it.
+   *
+   * Otherwise, the feature is implemented automatically when using the
+   * `rotate-to-fullscreen` attribute.
    *
    * @return {boolean}
    */
   preimplementsAutoFullscreen() {}
 
   /**
-   * If this returns true then it will be assumed that the player implements
-   * the MediaSession API internally so that the video manager does not override
-   * it. If not, the video manager will use the metadata variable as well as
-   * inferred meta-data to update the video's Media Session notification.
+   * If returning true, it's assumed that the embedded video document internally
+   * implements the MediaSession API internally so that the VideoManager won't
+   * replace it.
+   *
+   * Otherwise provided and inferred metadata are used to update the video's
+   * Media Session.
    *
    * @return {boolean}
    */
@@ -155,7 +173,7 @@ export class VideoInterface {
   fullscreenExit() {}
 
   /**
-   * Returns whether the video is currently in fullscreen mode or not
+   * Returns whether the video is currently in fullscreen mode or not.
    * @return {boolean}
    */
   isFullscreen() {}
diff --git a/src/web-components.js b/src/web-components.js
index b2ee041ad6127..6bc0a62b058f4 100644
--- a/src/web-components.js
+++ b/src/web-components.js
@@ -88,7 +88,7 @@ function isNative(func) {
 
 /**
  * Returns the supported version of Shadow DOM spec.
- * @param {?function(new:Element)=} opt_elementClass optional for testing
+ * @param {?typeof Element=} opt_elementClass optional for testing
  * @return {ShadowDomVersion}
  */
 export function getShadowDomSupportedVersion(opt_elementClass) {
@@ -103,7 +103,7 @@ export function getShadowDomSupportedVersion(opt_elementClass) {
 /**
  * Returns shadow dom version.
  *
- * @param {?function(new:Element)=} element
+ * @param {?typeof Element=} element
  * @return {ShadowDomVersion}
  */
 function getShadowDomVersion(element) {
diff --git a/src/window-interface.js b/src/window-interface.js
index 8c5497756ef6a..9684aade8ff83 100644
--- a/src/window-interface.js
+++ b/src/window-interface.js
@@ -89,7 +89,7 @@ export class WindowInterface {
   /**
    * @static
    * @param {!Window} win
-   * @return {function(new:XMLHttpRequest)}
+   * @return {typeof XMLHttpRequest}
    */
   static getXMLHttpRequest(win) {
     return win.XMLHttpRequest;
@@ -98,7 +98,7 @@ export class WindowInterface {
   /**
    * @static
    * @param {!Window} win
-   * @return {function(new:Image)}
+   * @return {typeof Image}
    */
   static getImage(win) {
     return win.Image;
diff --git a/test/_init_tests.js b/test/_init_tests.js
index d85c1e46e53c5..765e58e9ab46a 100644
--- a/test/_init_tests.js
+++ b/test/_init_tests.js
@@ -20,7 +20,7 @@ import * as describes from '../testing/describes';
 import * as log from '../src/log';
 import {Services} from '../src/services';
 import {activateChunkingForTesting} from '../src/chunk';
-import {adopt} from '../src/runtime';
+import {adoptWithMultidocDeps} from '../src/runtime';
 import {cancelTimersForTesting} from '../src/service/timer-impl';
 import {
   installAmpdocServices,
@@ -37,7 +37,7 @@ import {resetEvtListenerOptsSupportForTesting} from '../src/event-helper-listen'
 import {resetExperimentTogglesForTesting} from '../src/experiments';
 import {setDefaultBootstrapBaseUrlForTesting} from '../src/3p-frame';
 import {setReportError} from '../src/log';
-import sinon from 'sinon'; // eslint-disable-line local/no-import
+import sinon from /*OK*/ 'sinon';
 import stringify from 'json-stable-stringify';
 
 // Used to print warnings for unexpected console errors.
@@ -62,7 +62,7 @@ const BEFORE_AFTER_TIMEOUT = 5000;
 
 // Needs to be called before the custom elements are first made.
 beforeTest();
-adopt(window);
+adoptWithMultidocDeps(window);
 
 // Override AMP.extension to buffer extension installers.
 /**
diff --git a/test/e2e/test-amp-bind-state.js b/test/e2e/test-amp-bind-state.js
index 97f3e4870e8ec..9084e9a8c8e16 100644
--- a/test/e2e/test-amp-bind-state.js
+++ b/test/e2e/test-amp-bind-state.js
@@ -28,6 +28,14 @@ describes.endtoend(
     });
 
     describe('+ amp-state', () => {
+      it('should update text', async () => {
+        const text = await controller.findElement('#textDisplay');
+        await expect(controller.getElementText(text)).to.equal('hello');
+        const button = await controller.findElement('#changeTextButton');
+        await controller.click(button);
+        await expect(controller.getElementText(text)).to.equal('world');
+      });
+
       // TODO(cvializ, choumx): Update server to have an endpoint that
       // would test the infinite-loop blocking behavior
       it.skip('should not loop infinitely if updates change its src binding', async () => {
diff --git a/test/e2e/test-controller-promise.js b/test/e2e/test-controller-promise.js
index 8aa1c4e00d35a..a858fe73c2f30 100644
--- a/test/e2e/test-controller-promise.js
+++ b/test/e2e/test-controller-promise.js
@@ -15,7 +15,7 @@
  */
 
 import {ControllerPromise} from '../../build-system/tasks/e2e/controller-promise';
-/*OK*/ import sinon from 'sinon';
+import sinon from /*OK*/ 'sinon';
 
 /**
  * This is a unit test that is located with the E2E tests because it
diff --git a/test/fixtures/e2e/amp-bind/bind-basic.html b/test/fixtures/e2e/amp-bind/bind-basic.html
index 7caff6903caeb..42e5c5e2836c4 100644
--- a/test/fixtures/e2e/amp-bind/bind-basic.html
+++ b/test/fixtures/e2e/amp-bind/bind-basic.html
@@ -16,5 +16,8 @@
   </amp-state>
 
   <button id="setState" on="tap:AMP.setState({})"></button>
+
+  <p id="textDisplay" [text]="foo">hello</p>
+  <button id="changeTextButton" on="tap:AMP.setState({foo: 'world'})">Update Text</button>
 </body>
 </html>
diff --git a/test/fixtures/e2e/amp-fit-text/amp-fit-text.html b/test/fixtures/e2e/amp-fit-text/amp-fit-text.html
new file mode 100644
index 0000000000000..d888dece740df
--- /dev/null
+++ b/test/fixtures/e2e/amp-fit-text/amp-fit-text.html
@@ -0,0 +1,66 @@
+<!doctype html>
+<html ⚡>
+<head>
+ <meta charset="utf-8">
+ <title>AMP #0</title>
+ <link rel="canonical" href="amps.html" >
+ <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+ <link href='https://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
+ <script async custom-element="amp-fit-text" src="https://cdn.ampproject.org/v0/amp-fit-text-0.1.js"></script>
+ <style amp-custom>
+  body {
+   font-family: 'Questrial', Arial;
+  }
+  article {
+   display: block;
+   margin: 8px;
+  }
+  .ft {
+   border: 1px solid black;
+   margin: 8px auto;
+   display: block;
+  }
+ </style>
+ <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+ <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<article>
+ <h1>FitText</h1>
+
+ <h3>Scale up to cover</h3>
+ <amp-fit-text id="test1" width="300" height="200" class="ft">
+  Lorem <i>ips</i>um dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.
+ </amp-fit-text>
+
+ <h3>Scale up + overflow + ellipsis</h3>
+ <amp-fit-text id="test2" width="300" height="200" class="ft" min-font-size=42>
+  Lorem <i>ips</i>um dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.
+ </amp-fit-text>
+
+ <h3>Scale down</h3>
+ <amp-fit-text id="test3" width="300" height="200" class="ft">
+  Lorem <i>ips</i>um dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt. Propriae tincidunt id nec, elit nusquam te mea, ius noster platonem in. Mea an idque minim, sit sale deleniti apeirian et. Omnium legendos tractatos cu mea. Vix in stet dolorem accusamus. Iisque rationibus consetetur in cum, quo unum nulla legere ut. Simul numquam saperet no sit.
+ </amp-fit-text>
+
+ <h3>Scale down</h3>
+ <amp-fit-text id="test4" width="108" height="78" class="ft">
+  Specialcase test
+ </amp-fit-text>
+
+ <p>
+  Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.
+ </p>
+
+ <p>
+  Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt. Propriae tincidunt id nec, elit nusquam te mea, ius noster platonem in. Mea an idque minim, sit sale deleniti apeirian et. Omnium legendos tractatos cu mea. Vix in stet dolorem accusamus. Iisque rationibus consetetur in cum, quo unum nulla legere ut. Simul numquam saperet no sit.
+ </p>
+
+ <p>
+  Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt. Propriae tincidunt id nec, elit nusquam te mea, ius noster platonem in. Mea an idque minim, sit sale deleniti apeirian et. Omnium legendos tractatos cu mea. Vix in stet dolorem accusamus. Iisque rationibus consetetur in cum, quo unum nulla legere ut. Simul numquam saperet no sit.
+ </p>
+
+</article>
+</body>
+</html>
+
diff --git a/test/fixtures/e2e/amp-position-observer/target-id.html b/test/fixtures/e2e/amp-position-observer/target-id.html
new file mode 100644
index 0000000000000..5353ce50ecad6
--- /dev/null
+++ b/test/fixtures/e2e/amp-position-observer/target-id.html
@@ -0,0 +1,75 @@
+<!doctype html>
+<html ⚡>
+
+<head>
+  <meta charset="utf-8">
+  <title>amp-position-observer</title>
+  <link rel="canonical" href="amps.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-animation" src="https://cdn.ampproject.org/v0/amp-animation-0.1.js"></script>
+  <script async custom-element="amp-position-observer" src="https://cdn.ampproject.org/v0/amp-position-observer-0.1.js"></script>
+  <style amp-custom>
+    body {
+      margin: 0;
+    }
+
+    amp-img img {
+      object-fit: cover;
+    }
+
+    .clock-hand {
+      position: absolute;
+      width: 2vw;
+      height: 20vw;
+      max-height: 90px;
+      max-width: 10px;
+      top: 50%;
+      left: 50%;
+      z-index: 2;
+      background: #FAFAFA;
+      transform-origin: 50% 0%;
+      border-radius: 10px;
+      transform: rotate(-180deg)
+    }
+  </style>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+
+<body>
+  <amp-animation id="clockAnim1" layout="nodisplay">
+    <script type="application/json">
+      {
+      "duration": "3s",
+      "fill": "both",
+      "direction": "alternate",
+      "animations": [
+        {
+          "selector": "#clock-scene-1 .clock-hand",
+          "keyframes": [
+            { "transform": "rotate(-180deg)" },
+            { "transform": "rotate(0deg)" }
+          ]
+        }
+      ]
+    }
+    </script>
+  </amp-animation>
+  <main>
+    <div id="clock-scene-1" class="clock-scene">
+      <h1 id="title">Position observer</h1>
+      <amp-position-observer
+        intersection-ratios="1"
+        viewport-margins="0vh"
+        target="title"
+        on="scroll:clockAnim1.seekTo(percent=event.percent)"
+        layout="nodisplay">
+      </amp-position-observer>
+
+      <amp-img layout="responsive" width=2 height=1.5 src="/examples/img/clock.jpg">
+        <div class="clock-hand"></div>
+      </amp-img>
+    </div>
+  </main>
+</body>
+</html>
diff --git a/test/manual/amp-script/test1.amp.html b/test/fixtures/e2e/amp-script/basic.amp.html
similarity index 88%
rename from test/manual/amp-script/test1.amp.html
rename to test/fixtures/e2e/amp-script/basic.amp.html
index 2f68ceb083b03..457f340231fac 100644
--- a/test/manual/amp-script/test1.amp.html
+++ b/test/fixtures/e2e/amp-script/basic.amp.html
@@ -16,7 +16,7 @@
   <script async custom-template="amp-script" src="https://cdn.ampproject.org/v0/amp-script-0.1.js"></script>
 </head>
 <body>
-  <amp-script id=remote layout=container src="./test1.js">
+  <amp-script id=remote layout=container src="./basic.js">
     <div class="root">
       <button id="simple">Simple</button>
       <button id="tail">Tail</button>
@@ -28,5 +28,9 @@
   <script type=text/plain target=amp-script id="foo">
     document.body.textContent = 'Hello World!';
   </script>
+
+  <amp-script id=responsive script=foo layout=responsive width=300 height=50>
+    <p style="height: 1000px">Some very long content</p>
+  </amp-script>
 </body>
 </html>
diff --git a/test/manual/amp-script/test1.js b/test/fixtures/e2e/amp-script/basic.js
similarity index 100%
rename from test/manual/amp-script/test1.js
rename to test/fixtures/e2e/amp-script/basic.js
diff --git a/test/fixtures/e2e/amp-story-auto-ads/basic.html b/test/fixtures/e2e/amp-story-auto-ads/basic.html
index dd05ac1bfa3c3..21d5d029d8362 100644
--- a/test/fixtures/e2e/amp-story-auto-ads/basic.html
+++ b/test/fixtures/e2e/amp-story-auto-ads/basic.html
@@ -50,7 +50,7 @@ <h1>page two</h1>
         </amp-story-grid-layer>
       </amp-story-page>
 
-      <<amp-story-page id="three">
+      <amp-story-page id="three">
         <amp-story-grid-layer template="vertical">
           <h1>page three</h1>
         </amp-story-grid-layer>
diff --git a/test/fixtures/e2e/amp-story-auto-ads/fullbleed.html b/test/fixtures/e2e/amp-story-auto-ads/fullbleed.html
new file mode 100644
index 0000000000000..234e19372cb58
--- /dev/null
+++ b/test/fixtures/e2e/amp-story-auto-ads/fullbleed.html
@@ -0,0 +1,111 @@
+<!doctype html>
+<html amp lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-story" src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
+  <script async custom-element="amp-story-auto-ads" src="https://cdn.ampproject.org/v0/amp-story-auto-ads-0.1.js"></script>
+  <title>AMP Story</title>
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <link rel="canonical" href="amp-story.amp.html">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <link href="https://fonts.googleapis.com/css?family=Lilita+One&display=swap" rel="stylesheet">
+  <style amp-custom>
+    amp-story-page {
+      background: slateblue;
+    }
+
+    .container {
+      justify-content: center;
+      align-content: center;
+    }
+
+    .num {
+      text-align: center;
+      color: white;
+      font-size: 300px;
+      font-family: 'Lilita One', cursive;
+    }
+  </style>
+</head>
+
+<body>
+  <amp-story standalone supports-landscape>
+    <amp-story-auto-ads id="i-amphtml-demo-1">
+      <script type="application/json">
+        {
+          "ad-attributes": {
+            "type": "fake",
+            "src": "/examples/amp-story/ads/app-install.html",
+            "a4a-conversion": true
+          }
+        }
+      </script>
+    </amp-story-auto-ads>
+
+    <amp-story-page id="page-1">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">1</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-2">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">2</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-3">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">3</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-4">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">4</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-5">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">5</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-6">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">6</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+
+    <amp-story-page id="page-7">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">7</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-8">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">8</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-9">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">9</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+    <amp-story-page id="page-10">
+      <amp-story-grid-layer class="container" template="vertical">
+        <p class="num">10</p>
+      </amp-story-grid-layer>
+    </amp-story-page>
+
+  </amp-story>
+</body>
+
+</html>
diff --git a/test/fixtures/e2e/amp-video/autoplay.html b/test/fixtures/e2e/amp-video/autoplay.html
new file mode 100644
index 0000000000000..92fab385258e3
--- /dev/null
+++ b/test/fixtures/e2e/amp-video/autoplay.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <title>amp-video</title>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.js"></script>
+</head>
+<body>
+  <amp-video
+    id="myVideo"
+    src="/examples/av/ForBiggerJoyrides-short.mp4"
+    width="358"
+    height="204"
+    layout="responsive"
+    controls
+    autoplay
+    loop>
+    <div placeholder>This is a placeholder</div>
+    <div fallback>This is a fallback</div>
+  </amp-video>
+  <button id="pauseBtn" on="tap:myVideo.pause">Pause</button>
+  <button id="playBtn" on="tap:myVideo.play">Play</button>
+</body>
+</html>
diff --git a/test/fixtures/e2e/amphtml-ads/amp-ad-exit.amp.html b/test/fixtures/e2e/amphtml-ads/amp-ad-exit.amp.html
index 3434ff6b4d4df..bb7f2798a9af7 100644
--- a/test/fixtures/e2e/amphtml-ads/amp-ad-exit.amp.html
+++ b/test/fixtures/e2e/amphtml-ads/amp-ad-exit.amp.html
@@ -47,7 +47,7 @@
         "target2": {
           "finalUrl": "http://localhost:8000/?product2&r=RANDOM",
           "trackingUrls": [
-            "http://localhost:8000/?tracking-url&clicked=_elem"
+            "http://localhost:8000/amp4test/request-bank/e2e/deposit/tracking"
           ],
           "vars": {
             "_elem": {"defaultValue": "headline"}
diff --git a/test/fixtures/e2e/amphtml-ads/botguard.a4a.html b/test/fixtures/e2e/amphtml-ads/botguard.a4a.html
new file mode 100644
index 0000000000000..c29d5f3dfbabe
--- /dev/null
+++ b/test/fixtures/e2e/amphtml-ads/botguard.a4a.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<html ⚡4ads>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp4ads-boilerplate>body{visibility:hidden}</style>
+  <meta name="amp4ads-id" content="vendor=doubleclick,type=impression-id,value=12345">
+  <script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+</head>
+<body>
+
+<amp-img  src="/examples/img/sample.jpg" width=150 height=100 layout=responsive noloading></amp-img>
+
+<amp-analytics type="bg">
+  <script type="application/json">
+ {"requests": {"pageview": "https://pagead2.googlesyndication.com/bg/R5ZafKr0PlZ7OmGMCk95d__fihE5gBkhkjuiGGCKDDU.js&eLCRKrX94DmNwjIN2ooJFzi9XwzxNP2VrwGi4c/5Tv6VA7682oqyNFz6cIVQTUab+CQ7B0G93qEysZNpy5HTuvKgadvpef0s7tkSdHdxpMXwINX+/2UN2slmjsoAjoLa8d89+esmI+KxnI85Yrtf1PHV+j/A8csWNh01KzYRWYv4zMm6fKmYNB4lB5voCHw5FYG+4+UBbfTo2p/QZ3xp+N2cKNIgo+5MINTAInmVav49Y/utukCjJI4RF/WMo8dXdccJrh4V+9unQsBqo9dJydvd1LgT52PIy2YbdaIFIop1mpM41gA/hCI5G55+MZPQf7MRcYbQr9ECtLtINt1Lz/M05gCw119uz8OGdemXinrXZMLVNCEeg+LOiIURtiFTXkpEFb03XftS9BEpOkReH1EEBMVypj5rN24d9a6Go5fT3kCf5ojsNqxhw8/38DloaQRisPGGtZPnW31VTiXaDO4F1qxoOmJlOt4mLE37YrlQuWAbhy/gqhsBiz0aktDTHgeJfV0WuZfibdLJUPkmKvLV/pI4FxOf7RlNiBkiACFLMtg3SpcKLkgAHQGfV3Qy6zBsbXPLrMmzT/tMRn62sYXrc8HHFkyizZaSNMS2A8Pv2wfSazMYyn9mfBOo+hBJxN7hJV5BZcLQw0JZ4WWly8/tzi2R9jqLRYRXMKifg9wErdSTAWlU2r5lKGs1ZEjvskk81SkHDKTcGrR2gMvgedihyukCpw5m/rXXYTR74XFUGaT5Y4WCo4b56GqbHGOoOZaNasTNwwXkOQfd7OLbeqHC+j5U52ZXDqrNaf0TeH9Sh3x1wRigWSaTOKfzzmz5KPOlbMh//y4FH1O70to2aHLhK+JE15Zifww9huZrqatk8rNMssrR0EtNaGnsKH73r38cyBK9hlhwmElZqtxnfEckpGpLwj/+rc6NDjw3W7+/rKFV+zsFnTOfGkLJ1USMKmGOqF4CdgO6JDBItLCkCZ7zjrsdAAiL4d2l7pMuhKZcNda3XZXmYWCOXyCup0rpiu6XqcXOfpRPquZ9yaPL6jx3rH2/C2R24f0qZsbdjLKUnFpQaz8fJ2wnzlw0hM3QQ4T+vt+Mmqwt6hWar+uTfukYuTZROyXKhOHIshNZYl37vqm6VHXzJAFVAvLc+xIVdvA3xJI5y77VNp626/7qEVnpbFq5q2jsW0pmepmqpaSaRkqa6S2t0/mSmbwGbpHrE4LOrfv0o8zg0S3FVvF1SWvTCze1/1Cxs3ZJHE3iXCxv/TV8ELynGYPQmFMxPKBCO1ELpVhwb6CUBD9NN8akshaepGNKkAwtVikoLeJSJlfWVuitPaQu3qi06mnc2ofzeQ54ruFdR9zNtXeN8Pvmqp5wRqQrALnSLIRjgrKoOZKO62+WETdoTzG5TnHqv/gzN5Mvp7P82eEEGc7un3YS1BgP/L/Ei4h7JtJSCnx9eanxkjxoyYZnBlpDPhuu4XzwLBknMO83VJheeErjuq+sVkM/hAItOui3CVqoa24CVK30gYi/R6BYsuqiCxfN9CNDX903sSYH3weNJKnVbvzmBfXd63W2wO7D7t1Q47uE5XXUJgzU6l2+XBWq+S3WYoXUlXboh46+Q1ALMquUMZ/+PKJ6JS1JoXnXWVRmTQrFMUTctcYct/f1rDYXXEpA3bNVJtq8nuOoqsM+CdixEeUELSDxZ5xr0kX4xoWMpRGCcrk6BlQtR6X9GzISGbcPKOB+KFVT7S7vKqHCegFozoURDQni+UTeHbzk0YAjIncwD15xQftWdk7Hhh2s2W7Bv0JcljCIHgxTRfwbN89BYTVDipj2H6y6ZwgHFFC8yqqhqz+TnTflouf4akMdm3hvQfheuUTrfjs589PKI4q+vJrQ3GTgGqt9H/Wy7yRf1yDMtze8gyy+hRsAaqTsWH4o3GINKb3/szIvFcAFwLEDzRVNBQH2CLJ/LT3dRpxPqOiaKjUM1UZRBiWA9Npvr/gFp/JLFoyobR2q6ifYXOuNYLVOcXncCoaPCj1opfhocL4o8/nQfPON2+kEnIolBOOgPtFuhtdE8Vn3qVvYwi53CyK60rFa6b+b3s2Zv4M2FAibRqN4omuhu7euQT8YyLDBZhfgW1Ogcq42r4fH1PoR1LnalshBsz2kTktnI80BC4veBcaPCtBF9907H39X7IipTYa9OKgzYBYvt+RHDrxHYleSE0H3Iz6kfzw84AMjXJEqPpqRjT+xPaA5aDs20Sp35Vp9FzlCS+xQ6CNMRD1nH5FkMpjXjTg9obUE+yFNrbOsK5qle7dCGDaf2fGDv93QTbbHduLJIufK8E0jsGDW3p4tFkrEua66e96qq5i/X+8O20qK672bizLeBb1j5pYBTuN/xzox8XXKHeuWTq+Bk9dysCFK0j6zOiUpI2GpSGQV4c+JKWE1WQoevv+6DINLbZ0dP/Rc0Jt8zEP+UJcaoSDv/jZI26KFAH5qTPghbbiJQOmM5ERW2CV+h6AM9NpDWVvkw6cf/bspZBIe8BTiCc0iQsEgIqJC1CMwHq3pjGLVULqwpAT2FBtH9sQe4HnAtBlK4lboyVpq+bkdiocy/wJ/3GSTfpIb7BbRZOFD/66owKe3oUt08/r4EY54BgNnt7ZiSdjlU/ZrOq1WiIcrhm3b346oAwpQcZTWGvUcs4A4WNXKyntzRTLbIkJuEA8Qr2lXkoQKpkvFi3D93qnRSwxSKpI61hkvc50SBE/DeuxarFsg2FOzqxcXCAijAlEmjd50AHOyV2uChgNxOXI23hVyVBHhorUWGw+LC0p0Xel0N8/BqKE+wQc+rBr14t/S1jZmdwgM90+CacVjKGygJer0ZByTgZks1xviKvzCYKvzNDTkv7z/7scqqGPBsNIrvCH/5nCyw+LoOSoU/icFjE0rFM+RxJUhqz+fabQ6CR6Bznlv7RaExD0/ITlsCW9BXMG2HaU+rBvs1A0YqkqIjE5hQ7jzB55T9pGbWLb3a5kgg/HGTKBxvvKOk0Ul9+OkXABh8FBi8YaX8hTO9OtPmrDiVZwSjz5J1IEOnFQpA6EV4q4AJcfGyjkxGDpJpkQaq5yoB5PpmLv+m8TMgDqUxAVS331WGp30HWyWE/mBWSVekaOPsWIX9liFf7rd9KTDVfEg/u77yjoSq8zXv90ruqFAxKBJIxfgCfM1j9fvSrnVnCT69DPmuEUH9mFmjQ2PP4UK20VGi3k5Tvn2xeCRC6jJIkteSIr/+rWk2cTnnMV6qcY0EkHrBJ9qPVopX2vJMhl+XoocUTmCejlArirDIg4Bw+lGUxDVZCW4WpjUJl7V8MGAZi9nu6yHxa7Efpk4OxUCC+cn2c8S/hL6sFQjr4xqWHZ2m6LPIfMYUJcFWAKhdVrvfkXvZgbkFjxZeP/O1oqeyS6Bnk2tMZsRyTLNX+tVZvKTfLnLSwUHZyMz5XnlAaJNIRqUYuRglHzbkfwQJNpa/utKJ/ISTw+YDozuHvhKCEkluenLfmM2FJsHvLK+SDkKISNTBuKR6rsclE3SKF7vcesHcV17i/d6dd4UqfJxuLkKXBYJIIJp6u2PEINl7kyQd6go99ibLUmud+Ta5disWQAj3ukaL+oPtcCtaxV59EfdTtpzEPw+CMsizAz6Gz4OGcbZk+jI4/iagSaErUl0b4EAawG8l/iZgcsiQHGv/cvfj1dk7sbpTbWJBbXJLBlEVoJSHXIzoqD2Oc4TcpOrqqb/3G/57KSq1XouXKwIdjZ/SZXD/EHTVxWhOgr1I60jzp3xnBBEPWcflv0BQhKe8JpP+KMwmR3hkFQnacYj1dHErFXXm0aEQZHFmux5Xm9G7Jjwvz3RH2nqNFVMMD9e6C2BvwqdAsVbV9GQCYOzz8uv4zyWL8HbpHP65I+T0MCzCSQFrgmmIuzEPXsYEpfS6kBbAgc3EdXx7JFGZrDDer1LMOqHvBAF4K7W2yKwKANZ4D+/thONzEMz44ywELSyMyZ7/fVoW5ffsDvB/XoQcELXVrwY2FvxEqZHYdWuuZKNjecNbq8r6Xsr58mDfNRMkVFub8nmfKIXXczwThNNukF0dRl2R/+/7gBGOQUVqYJ5meHsbc8symDWqrwLMxGlSHk3JZgGpZZjMmXFTVZ8tA7D5TvxTXqYIcNeBoRmfg7RFgQ106M+D7CnKNoN8B+n/E+fQJHI6FCaIraEyWRXgShz0Hzm7ocqJPkh2Ikd+rcdYcF7Dwde2Dtc6LMdXWey22uNLeRTpiddyQYIP28EHqB/fsPi2hFqer4sO5KVmWBJQ0UwwZAWwEgB3sCSITCN7DzKf5XRtMAPTjdD+4a8SBK2kk0hWpuf9I5BgdHETbOAd7Vw5v4EbO+FQqbcPlmtddoB19tLPhSHgFpga/xoQDodnVAeMyvxotklg17lnLMuAEewo6ZB1J5q21McVE8Twy/guhU2BVOv00BvsoFQBiP29l2QOudebJmy4bjJrKAb7EZ98NPUiMC93qFgFedupk6ROGY/v2U70WYtWdtpTuHmGBAmDs="},"triggers": {"defaultPageview": {"on": "visible","request": "pageview"}}}
+  </script>
+</amp-analytics>
+</body>
+</html>
diff --git a/test/integration/test-amp-ad-fake.js b/test/integration/test-amp-ad-fake.js
deleted file mode 100644
index 2429c88dc95cb..0000000000000
--- a/test/integration/test-amp-ad-fake.js
+++ /dev/null
@@ -1,72 +0,0 @@
-/**
- * Copyright 2018 The AMP HTML Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {addParamsToUrl} from '../../src/url';
-import {poll} from '../../testing/iframe';
-
-describe('A4A', function() {
-  const src = addParamsToUrl('/amp4test/compose-doc', {
-    body: `
-      <p [text]="foo">123</p>
-      <button on="tap:AMP.setState({foo: 456})"></button>
-      `,
-    extensions: 'amp-bind',
-    spec: 'amp4ads',
-  });
-  describes.integration(
-    'amp-bind in A4A',
-    {
-      body: `
-      <amp-ad width="300" height="400"
-          id="i-amphtml-demo-id"
-          type="fake"
-          src="${src}">
-        <div placeholder>Loading...</div>
-        <div fallback>Could not display the fake ad :(</div>
-      </amp-ad>
-      `,
-    },
-    env => {
-      it('p[text]', function*() {
-        // Wait for the amp-ad to construct its child iframe.
-        const ad = env.win.document.getElementById('i-amphtml-demo-id');
-        yield poll('amp-ad > iframe', () => ad.querySelector('iframe'));
-
-        // Wait for the iframe contents to load.
-        const fie = ad.querySelector('iframe').contentWindow;
-        yield poll('iframe > button', () =>
-          fie.document.querySelector('button')
-        );
-
-        const text = fie.document.querySelector('p');
-        expect(text.textContent).to.equal('123');
-
-        const button = fie.document.querySelector('button');
-        return poll(
-          '[text]',
-          () => {
-            // We click this too many times but there's no good way to tell whether
-            // amp-bind is initialized yet.
-            button.click();
-            return text.textContent === '456';
-          },
-          /* onError */ undefined,
-          5000
-        );
-      });
-    }
-  );
-});
diff --git a/test/integration/test-amp-analytics.js b/test/integration/test-amp-analytics.js
index 39b6b5f08ea8a..8e63fedcc7e5f 100644
--- a/test/integration/test-amp-analytics.js
+++ b/test/integration/test-amp-analytics.js
@@ -15,7 +15,6 @@
  */
 
 import {BrowserController, RequestBank} from '../../testing/test-helper';
-
 import {parseQueryString} from '../../src/url';
 
 describe('amp-analytics', function() {
@@ -28,7 +27,9 @@ describe('amp-analytics', function() {
         document.cookie='_cid=amp-12345';
       </script>
       <!-- put amp-analytics > 3 viewports away from viewport -->
-      <div style="height: 400vh"></div>
+      <div style="height: 400vh">
+        viewport
+      </div>
       <amp-analytics>
         <script type="application/json">
         {
@@ -50,6 +51,9 @@ describe('amp-analytics', function() {
             "cid": "\${clientId(_cid)}",
             "loadend": "\${navTiming(loadEventEnd)}",
             "default": "\$DEFAULT( , test)",
+            "fcp": "FIRST_CONTENTFUL_PAINT",
+            "fvr": "FIRST_VIEWPORT_READY",
+            "mbv": "MAKE_BODY_VISIBLE",
             "cookie": "\${cookie(test-cookie)}"
           }
         }
@@ -74,6 +78,11 @@ describe('amp-analytics', function() {
           // cookie set via http response header when requesting
           // localhost:9876/amp4test/compose-doc
           expect(q['cookie']).to.equal('test');
+
+          // FCP only resolves for Chrome and Opera
+          expect(q['fcp']).to.not.be.null;
+          expect(q['fvr']).to.not.be.null;
+          expect(q['mbv']).to.not.be.null;
           expect(
             req.headers.referer,
             'should keep referrer if no referrerpolicy specified'
diff --git a/test/integration/test-amphtml-ads.js b/test/integration/test-amphtml-ads.js
index dc249eb0dfdb3..0d53a6383e7ef 100644
--- a/test/integration/test-amphtml-ads.js
+++ b/test/integration/test-amphtml-ads.js
@@ -17,6 +17,7 @@
 import {RequestBank} from '../../testing/test-helper';
 import {maybeSwitchToCompiledJs} from '../../testing/iframe';
 import {parseQueryString} from '../../src/url';
+import {toggleExperiment} from '../../src/experiments';
 import {xhrServiceForTesting} from '../../src/service/xhr-impl';
 
 describe('AMPHTML ad on AMP Page', () => {
@@ -350,6 +351,7 @@ describe('A more real AMPHTML image ad', () => {
       });
 
       it('should properly render ad in a friendly iframe with viewability pings', () => {
+        toggleExperiment(env.win, 'inabox-viewport-friendly', true);
         writeFriendlyFrame(doc, iframe, adBody);
         return testVisibilityPings(0, 1000);
       });
diff --git a/test/manual/amp-analytics-cookie-writer.html b/test/manual/amp-analytics-cookie-writer.html
index b60d36217d75e..0bf912708a7e6 100644
--- a/test/manual/amp-analytics-cookie-writer.html
+++ b/test/manual/amp-analytics-cookie-writer.html
@@ -131,9 +131,9 @@ <h4>Click the red box to check if 3 request have been sent out</h4>
       }
     },
     "transport": {
-      "beacon": "false",
-      "xhrpost": "false",
-      "image": "true"
+      "beacon": false,
+      "xhrpost": false,
+      "image": true
     },
     "cookies": {
       "cookie1": {
@@ -160,9 +160,9 @@ <h4>Click the red box to check if 3 request have been sent out</h4>
       }
     },
     "transport": {
-      "beacon": "false",
-      "xhrpost": "false",
-      "image": "true"
+      "beacon": false,
+      "xhrpost": false,
+      "image": true
     },
     "cookies": {
       "cookie3": {
@@ -186,9 +186,9 @@ <h4>Click the red box to check if 3 request have been sent out</h4>
       }
     },
     "transport": {
-      "beacon": "false",
-      "xhrpost": "false",
-      "image": "true"
+      "beacon": false,
+      "xhrpost": false,
+      "image": true
     },
     "cookies": {
       "cookie4": {
diff --git a/test/manual/amp-analytics/analytics-fcp.html b/test/manual/amp-analytics/analytics-fcp.html
new file mode 100644
index 0000000000000..9b24998eaf023
--- /dev/null
+++ b/test/manual/amp-analytics/analytics-fcp.html
@@ -0,0 +1,172 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Analytics</title>
+  <link rel="canonical" href="analytics.amp.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-custom>
+    .box {
+      background: #ccc;
+      border: 1px solid #aaa;
+      padding: 10px;
+      margin: 10px;
+    }
+    #container {
+      position: absolute;
+      top: 10000px;
+      height: 10px;
+    }
+  </style>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-anim" src="https://cdn.ampproject.org/v0/amp-anim-0.1.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  <script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.js"></script>
+</head>
+<body>
+<p>Scroll down to see content</p>
+<div id="container">
+Container for analytics tags. Positioned far away from top to make sure that doesn't matter.
+
+<amp-analytics>
+  <script type="application/json">
+    {
+        "requests": {
+          "endpoint": "https://fake.com/analytics?timer"
+        },
+        "triggers": {
+            "pageview": {
+                "on": "visible",
+                "request": "endpoint",
+                "extraUrlParams": {
+                "a": 2
+                }
+            }
+        },
+        "extraUrlParams": {
+            "fcp": "FIRST_CONTENTFUL_PAINT",
+            "fvr": "FIRST_VIEWPORT_READY",
+            "mbv": "MAKE_BODY_VISIBLE"
+        },
+        "transport": {
+          "beacon": false,
+          "xhrpost": false,
+          "image": true
+        }
+      }
+  </script>
+</amp-analytics>
+
+<div class="logo"></div>
+<h1 id="top">AMP Analytics</h1>
+<span id="test1" class="box" data-vars-title="Example request with element level overrides">
+  Click here to generate an event
+</span>
+<p>
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam pellentesque augue quis elementum tempus. Pellentesque sit amet neque bibendum, sagittis purus vitae, pellentesque magna. Vestibulum non viverra metus, eget feugiat lacus. Nulla in maximus orci. Maecenas id turpis vel ipsum vestibulum bibendum ut sit amet magna. Nullam hendrerit ex at est eleifend, nec dignissim nibh rutrum. Aliquam quis tellus et nibh faucibus laoreet in eget turpis. Nam quam nisl, porttitor vel ex eget, dapibus placerat dui. Mauris commodo pellentesque leo, eu tempus quam. In hac habitasse platea dictumst. Suspendisse non ante finibus, luctus augue non, luctus orci. Vestibulum ornare lacinia aliquam. In sollicitudin vehicula vulputate. Sed mi elit, commodo nec sapien nec, pretium bibendum leo. Donec id justo tortor. Ut in mauris dapibus, laoreet metus vitae, dictum nisi.
+</p>
+<p>
+Integer dapibus egestas arcu. Nunc vitae velit congue, placerat augue quis, suscipit nisi. Donec suscipit imperdiet turpis pharetra feugiat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus aliquam eleifend dolor, at lacinia orci semper vel. Nunc semper sem vel tincidunt posuere. Nunc lobortis velit vitae condimentum mollis. Morbi eu ullamcorper mauris. Pellentesque ac eros maximus, pulvinar sapien vitae, semper nisi. Curabitur imperdiet non mauris vitae sollicitudin.
+</p>
+<p>
+Nam posuere velit euismod risus pulvinar, in sollicitudin sapien consectetur. Vestibulum nec ex odio. Quisque at elit nec nunc ultricies lacinia nec non lorem. Maecenas porttitor consequat mauris, vitae porttitor ligula pellentesque ut. Pellentesque rhoncus diam vel lacus lobortis imperdiet. Sed maximus dictum hendrerit. Vivamus ornare, purus in laoreet sagittis, est ante pretium mauris, vel vulputate arcu erat eget mauris. Suspendisse eu lorem metus. Aliquam tempus aliquet urna, vitae mollis lacus pretium vitae. Etiam semper gravida commodo. Maecenas at pulvinar quam. Nullam dolor ipsum, ornare a sollicitudin et, sodales porttitor neque.
+</p>
+<p>
+Integer in felis at lacus mattis facilisis. Curabitur tincidunt, felis porttitor mollis finibus, tortor elit elementum dolor, vel vulputate lorem dui id ante. Vivamus in velit at lectus blandit gravida vitae quis arcu. Nam et magna magna. Fusce condimentum diam lacus, ac ullamcorper purus malesuada eu. Mauris ullamcorper elit et venenatis faucibus. Nullam lobortis molestie purus quis pellentesque. Sed at libero id nisi rhoncus tincidunt. Praesent vestibulum vehicula tristique. Etiam rutrum, nunc id porta interdum, nulla nisi molestie leo, at fermentum justo dolor at lorem. Duis in egestas sapien.
+</p>
+<amp-video
+    id="myVideo"
+    src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4"
+    width="358"
+    height="204"
+    layout="responsive"
+    controls
+    autoplay
+  >
+  <div placeholder>
+    This is a placeholder
+  </div>
+  <div fallback>
+    This is a fallback
+  </div>
+</amp-video>
+<button on="tap:myVideo.pause">Pause</button>
+<p>
+Donec pharetra molestie sollicitudin. Duis mattis eleifend rutrum. Quisque luctus tincidunt lacus, vitae lobortis nisi malesuada ac. Aliquam mattis leo vel elit rutrum, nec consequat massa vestibulum. Maecenas bibendum metus nec ante feugiat, eu faucibus orci mattis. Cras tristique sem non elit congue malesuada. Proin ornare, lacus et porttitor consequat, sapien urna rutrum diam, ac pellentesque ligula est eget nisi. Interdum et malesuada fames ac ante ipsum primis in faucibus. Donec ultrices sollicitudin eros a placerat. Proin eget pulvinar est. Donec posuere ultrices odio at ultrices. Suspendisse potenti. Phasellus id orci id purus porttitor consectetur a at erat. Nullam volutpat ultricies nisl id maximus. Morbi porta ex ante, et egestas odio ultricies consequat.
+</p>
+<p>
+<ul>
+<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
+<li>Aliquam in ex porta, imperdiet elit sit amet, condimentum diam.</li>
+<li>Etiam fermentum nisi at porta pulvinar.</li>
+</ul>
+</p>
+<p>
+<ul>
+<li>Proin mattis neque vel elit posuere molestie.</li>
+<li>Integer tincidunt sem sed nunc auctor elementum.</li>
+<li>Integer a felis in ipsum aliquet auctor sit amet a neque.</li>
+</ul>
+</p>
+<p>
+<ul>
+<li>Sed suscipit dolor molestie, rhoncus quam ac, lacinia ex.</li>
+<li>Curabitur et tellus vel justo ultrices aliquet sed id turpis.</li>
+<li>Nam finibus risus at justo elementum bibendum.</li>
+<li>In non lacus non urna congue feugiat at vel diam.</li>
+</ul>
+</p>
+<p>
+<ul>
+<li>Integer hendrerit augue interdum dui venenatis, sit amet tristique mauris cursus.</li>
+<li>Etiam quis eros viverra, tincidunt justo in, facilisis nunc.</li>
+<li>Aliquam at lacus faucibus, congue lorem interdum, semper mauris.</li>
+<li>Ut vulputate erat vel feugiat pharetra.</li>
+<li>Morbi id augue id orci sagittis tempus.</li>
+<li>Vestibulum varius libero ac dignissim sodales.</li>
+</ul>
+</p>
+<p>
+<ul>
+<li>Aenean ac sem eget libero varius viverra sit amet vitae nunc.</li>
+</ul>
+</p>
+<amp-anim src="https://www.google.com/logos/doodles/2016/2016-doodle-fruit-games-day-14-5645577527230464-hp.gif" id="anim-id" width="665" height="220" layout="responsive">
+  <amp-img placeholder src="https://www.google.com/logos/doodles/2016/2016-doodle-fruit-games-day-14-5645577527230464.2-scta.png" width="665" height="220" layout="responsive"></amp-img>
+  <amp-analytics id="nestedAnalytics">
+    <script type="application/json">
+    {
+      "transport": {"beacon": true, "xhrpost": false},
+      "requests": {
+        "visibility": "/analytics/${type}?RANDOM"
+      },
+      "triggers": {
+        "visibilityScope": {
+          "on": "visible",
+          "request": "visibility",
+          "visibilitySpec": {
+            "selector": "amp-img",
+            "selectionMethod": "scope",
+            "visiblePercentageMin": 10
+          },
+          "vars": { "type": "visible-scope" }
+        },
+        "visibilityClosest": {
+          "on": "visible",
+          "request": "visibility",
+          "visibilitySpec": {
+            "selector": "amp-anim",
+            "selectionMethod": "closest",
+            "visiblePercentageMin": 20
+          },
+          "vars": { "type": "visible-closest" }
+        }
+      }
+    }
+    </script>
+  </amp-analytics>
+</amp-anim>
+</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/test/manual/amp-analytics/analytics-nav-timing.html b/test/manual/amp-analytics/analytics-nav-timing.html
index 432424c71a8c9..7b4290af97d97 100644
--- a/test/manual/amp-analytics/analytics-nav-timing.html
+++ b/test/manual/amp-analytics/analytics-nav-timing.html
@@ -68,9 +68,9 @@
       }
     },
     "transport": {
-      "beacon": "false",
-      "xhrpost": "false",
-      "image": "true"
+      "beacon": false,
+      "xhrpost": false,
+      "image": true
     }
   }
   </script>
diff --git a/test/manual/amp-autocomplete/amp-autocomplete-inline.amp.html b/test/manual/amp-autocomplete/amp-autocomplete-inline.amp.html
new file mode 100644
index 0000000000000..82b90b83250ca
--- /dev/null
+++ b/test/manual/amp-autocomplete/amp-autocomplete-inline.amp.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html ⚡>
+  <head>
+    <meta charset="utf-8" />
+    <title>amp-autocomplete examples</title>
+    <link rel="canonical" href="amps.html" />
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1" />
+    <link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet" type="text/css" />
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
+    <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-latest.js"></script>
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-latest.js"></script>
+  </head>
+  <body>
+    <div height="1000">
+      <button id="focusButton" on="tap:input.focus">Focus</button>
+      <form
+        method="post"
+        action-xhr="/form/echo-json/post"
+        target="_blank"
+        on="submit-success:AMP.setState({result: event.response})"
+      >
+        <amp-autocomplete
+          id="autocomplete"
+          inline="@"
+          filter="substring"
+          min-characters="0"
+        >
+          <input type="text" id="input" />
+          <script type="application/json" id="script">
+            {"items": ["apple", "banana", "orange"]}
+          </script>
+        </amp-autocomplete>
+      </form>
+    </div>
+  </body>
+</html>
diff --git a/test/manual/amp-autocomplete/amp-autocomplete.amp.html b/test/manual/amp-autocomplete/amp-autocomplete.amp.html
index 5bb23597d1b74..10828c8f7aa7d 100644
--- a/test/manual/amp-autocomplete/amp-autocomplete.amp.html
+++ b/test/manual/amp-autocomplete/amp-autocomplete.amp.html
@@ -1,28 +1,36 @@
-<!doctype html>
+<!DOCTYPE html>
 <html ⚡>
-<head>
-  <meta charset="utf-8">
-  <title>amp-autocomplete examples</title>
-  <link rel="canonical" href="amps.html" >
-  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-  <link href='https://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
-  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-  <script async src="https://cdn.ampproject.org/v0.js"></script>
-  <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
-  <script async custom-template="amp-form" src="https://cdn.ampproject.org/v0/amp-form-latest.js"></script>
-</head>
-<body>
-  <div height="1000">
-    <button id="focusButton" on="tap:input.focus">Focus</button>
-    <form method="post" action-xhr="/form/echo-json/post" target="_blank"
-      on="submit-success:AMP.setState({result: event.response})">
-      <amp-autocomplete id="autocomplete" filter="substring" min-characters="0">
-        <input type="text" id="input">
-        <script type="application/json" id="script">
-          { "items" : ["apple", "banana", "orange"] }
-        </script>
-      </amp-autocomplete>
-    </form>
-  </div>
-</body>
+  <head>
+    <meta charset="utf-8">
+    <title>amp-autocomplete examples</title>
+    <link rel="canonical" href="amps.html" >
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <link href='https://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-autocomplete" src="https://cdn.ampproject.org/v0/amp-autocomplete-0.1.js"></script>
+    <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-latest.js"></script>
+  </head>
+  <body>
+    <div height="1000">
+      <button id="focusButton" on="tap:input.focus">Focus</button>
+      <form
+        method="post"
+        action-xhr="/form/echo-json/post"
+        target="_blank"
+        on="submit-success:AMP.setState({result: event.response})"
+      >
+        <amp-autocomplete
+          id="autocomplete"
+          filter="substring"
+          min-characters="0"
+        >
+          <input type="text" id="input" />
+          <script type="application/json" id="script">
+            {"items": ["apple", "banana", "orange"]}
+          </script>
+        </amp-autocomplete>
+      </form>
+    </div>
+  </body>
 </html>
diff --git a/test/manual/amp-base-carousel/basic.amp.html b/test/manual/amp-base-carousel/basic.amp.html
index 1cab250e0705a..d73bef2e8cd84 100644
--- a/test/manual/amp-base-carousel/basic.amp.html
+++ b/test/manual/amp-base-carousel/basic.amp.html
@@ -18,7 +18,7 @@
 </head>
 <body>
   <h1>A Basic carousel, with looping</h1>
-  <amp-base-carousel  id="carousel-1" width="300" height="200" layout="responsive" loop="true" lightbox>
+  <amp-base-carousel id="carousel-1" width="300" height="200" layout="responsive" loop="true" lightbox>
     <amp-img src="./img/redgradient.png" layout="flex-item"></amp-img>
     <amp-img src="./img/greengradient.png" layout="flex-item"></amp-img>
     <amp-img src="./img/bluegradient.png" layout="flex-item"></amp-img>
diff --git a/test/manual/amp-base-carousel/hidden-controls.amp.html b/test/manual/amp-base-carousel/hidden-controls.amp.html
new file mode 100644
index 0000000000000..b9a1bd8e46824
--- /dev/null
+++ b/test/manual/amp-base-carousel/hidden-controls.amp.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>Basic Carousel</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <link href='https://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-lightbox-gallery" src="https://cdn.ampproject.org/v0/amp-lightbox-gallery-0.1.js"></script>
+  <style amp-custom>
+    amp-base-carousel img {
+      object-fit: cover;
+    }
+  </style>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+  <h1>Hidden controls</h1>
+  <amp-base-carousel  width="300" height="200" layout="responsive" controls="never" loop="true">
+    <amp-img src="./img/redgradient.png" layout="flex-item"></amp-img>
+    <amp-img src="./img/greengradient.png" layout="flex-item"></amp-img>
+    <amp-img src="./img/bluegradient.png" layout="flex-item"></amp-img>
+    <amp-img src="./img/orangegradient.png" layout="flex-item"></amp-img>
+    <amp-img src="./img/tealgradient.png" layout="flex-item"></amp-img>
+    <amp-img src="./img/lemonyellowgradient.png" layout="flex-item"></amp-img>
+    <amp-img src="./img/lilacgradient.png" layout="flex-item"></amp-img>
+  </amp-base-carousel>
+</body>
+</html>
diff --git a/test/manual/amp-carousel/0.1/hidden-controls.amp.html b/test/manual/amp-carousel/0.1/hidden-controls.amp.html
new file mode 100644
index 0000000000000..5e1890690df10
--- /dev/null
+++ b/test/manual/amp-carousel/0.1/hidden-controls.amp.html
@@ -0,0 +1,52 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>Carousel 0.1</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <link href='https://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
+  <script async custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    rect.red {
+      fill: red;
+    }
+    rect.blue {
+      fill: blue;
+    }
+    rect.green {
+      fill: green;
+    }
+  </style>
+</head>
+<body>
+  <h1>Hidden controls</h1>
+  <amp-carousel
+  id="scrollable-carousel"
+  width="400"
+  height="225"
+  layout="fixed"
+  type="slides">
+  <amp-layout layout="responsive" width="440" height="225">
+    <svg viewBox="0 0 440 225">
+      <rect class="red" width="440" height="225" />
+      Sorry, your browser does not support inline SVG.
+    </svg>
+  </amp-layout>
+  <amp-layout layout="responsive" width="440" height="225">
+    <svg viewBox="0 0 440 225">
+      <rect class="blue" width="440" height="225" />
+      Sorry, your browser does not support inline SVG.
+    </svg>
+  </amp-layout>
+  <amp-layout layout="responsive" width="440" height="225">
+    <svg viewBox="0 0 440 225">
+      <rect class="green" width="440" height="225"/>
+      Sorry, your browser does not support inline SVG.
+    </svg>
+  </amp-layout>
+</amp-carousel>
+</body>
+</html>
diff --git a/test/manual/amp-consent/amp-consent-basic-uses.amp.html b/test/manual/amp-consent/amp-consent-basic-uses.amp.html
new file mode 100644
index 0000000000000..ec41e6b9deb0a
--- /dev/null
+++ b/test/manual/amp-consent/amp-consent-basic-uses.amp.html
@@ -0,0 +1,301 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Consent GEO Test</title>
+  <link rel="canonical" href="amp-consent.amp.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <meta name="amp-consent-blocking" content="amp-twitter">
+
+  <link href='https://fonts.googleapis.com/css?family=Georgia|Open+Sans|Roboto' rel='stylesheet' type='text/css'>
+
+  <style amp-custom>
+    body {
+      margin: 0;
+      font-family: 'Georgia', Serif;
+    }
+    .brand-logo {
+      font-family: 'Open Sans';
+    }
+    .content-container p {
+      line-height: 24px;
+    }
+    header,
+    .article-body {
+      padding: 15px;
+    }
+    figure {
+      margin: 0;
+    }
+    figcaption {
+      color: #6f757a;
+      padding: 15px 0;
+      font-size: .9em;
+    }
+    .author {
+      display: flex;
+      align-items: center;
+      background: #f4f4f4;
+      padding: 0 15px;
+      font-size: .8em;
+      border: solid #dcdcdc;
+      border-width: 1px 0;
+    }
+    .header-time {
+      color: #a8a3ae;
+      font-family: 'Roboto';
+      font-size: 12px;
+    }
+    .author p {
+      margin: 5px;
+    }
+    .byline {
+      font-family: 'Roboto';
+      display: inline-block;
+    }
+    .byline p {
+      line-height: normal;
+    }
+    .byline .brand {
+      color: #6f757a;
+    }
+    .standfirst {
+      color: #6f757a;
+    }
+    .mailto {
+      text-decoration: none;
+    }
+    /* defaults */
+    .unknown:after {
+    content: 'in unknown geo group';
+    }
+    /* override */
+    .amp-geo-group-na .unknown:after {
+    content: 'in na geogroup';
+    }
+    h1 {
+      margin: 5px 0;
+      font-weight: normal;
+    }
+    footer {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 226px;
+      background: #f4f4f4;
+    }
+    amp-consent {
+      min-height: 30px;
+      font-family: 'Roboto';
+      font-weight: 500;
+      line-height: 30px;
+      padding: 8px;
+      background: #46b6ac;
+    }
+    amp-consent button {
+      border: none;
+      border-radius: 2px;
+      color: #fafafa;
+      height: 26px;
+      min-width: 32px;
+      padding: 0 16px;
+      margin: 0 16px;
+      text-transform: uppercase;
+      letter-spacing: 0;
+      cursor: pointer;
+      vertical-align: middle;
+      line-height: 26px;
+      text-align: center;
+      background: #3f51b5;
+    }
+    hr {
+      margin: 0;
+    }
+  </style>
+  <script async custom-element="amp-twitter" src="https://cdn.ampproject.org/v0/amp-twitter-0.1.js"></script>
+  <script async custom-element="amp-geo" src="https://cdn.ampproject.org/v0/amp-geo-0.1.js"></script>
+  <script async custom-element="amp-consent" src="https://cdn.ampproject.org/v0/amp-consent-0.1.js"></script>
+  <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<header>
+  <div class="brand-logo">
+    PublisherLogo
+  </div>
+</header>
+<main role="main">
+
+
+  <h3>Image that is blocked by '_till_responded' consent</h3>
+
+  <amp-img
+    data-block-on-consent='_till_responded'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_till_accepted' consent</h3>
+  <amp-img
+    data-block-on-consent='_till_accepted'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by '_auto_reject' consent</h3>
+  <amp-img
+    data-block-on-consent='_auto_reject'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is blocked by 'default' consent</h3>
+  <amp-img
+    data-block-on-consent='default'
+    src="/examples/img/bigbuckbunny.jpg" width=300 height=200></amp-img>
+
+  <h3>Image that is NOT blocked by consent</h3>
+  <amp-img
+    src="/examples/img/ima-poster.png" width=300 height=200></amp-img>
+    
+    <amp-analytics>
+      <script type="application/json">
+      {
+        "requests": {
+          "endpoint": "http://localhost:8000/amp4test/request-bank/e2e/deposit/tracking"
+        },
+        "triggers": {
+          "pageview": {
+            "on": "visible",
+            "request": "endpoint",
+            "extraUrlParams": {
+              "consentState": "CONSENT_STATE"
+            }
+          }
+        },
+        "transport": {"beacon": false, "xhrpost": false, "image": true}
+      }
+      </script>
+    </amp-analytics>
+    <amp-geo layout=nodisplay>
+        <script type="application/json">
+            {
+                "ISOCountryGroups": {
+                    "na": ["us"],
+                    "eu": ["preset-eea"],
+                    "expireCache1": ["mx"],
+                    "expireCache2": ["ca"],
+                    "unknown": ["unknown"]
+                }
+            }
+        </script>
+    </amp-geo>
+
+  <amp-consent id='ABC' layout='nodisplay'>
+    <script type="application/json">{
+      "consentInstanceId": "consent-clinet",
+      "consentRequired": false,
+      "postPromptUI": "postPromptUI",
+      "geoOverride": {
+        "eu": {
+          "consentRequired": true,
+          "promptUI": "ui2"
+        },
+        "na": {
+          "consentRequired": "remote",
+          "checkConsentHref": "/check-consent?consentRequired=true&consentStateValue=rejected",
+          "promptUI": "ui1"
+        },
+        "expireCache1": {
+          "consentRequired": "remote",
+          "checkConsentHref": "/check-consent?consentRequired=true&expireCache=true&consentStateValue=rejected",
+          "promptUI": "ui1"
+        },
+        "expireCache2": {
+          "consentRequired": "remote",
+          "checkConsentHref": "/check-consent?consentRequired=true&expireCache=true&consentStateValue=accepted",
+          "promptUI": "ui1"
+        }
+      }
+    }</script>
+    
+    <div id="ui1">
+        NA: Can I load the image??
+        <button on="tap:ABC.accept" role="button">Accept</button>
+        <button on="tap:ABC.reject" role="button">Reject</button>
+        <button on="tap:ABC.dismiss" role="button">Dismiss</button>
+      </div>
+    <div id="ui2">
+        EU: Can I load the image??
+        <button id="accept" on="tap:ABC.accept" role="button">Accept</button>
+        <button id="reject" on="tap:ABC.reject" role="button">Reject</button>
+        <button id="dismiss" on="tap:ABC.dismiss" role="button">Dismiss</button>
+      </div>
+      <div id="postPromptUI">
+        Post Prompt UI
+        <button on="tap:ABC.prompt" role="button">Manage</button>
+      </div>
+  </amp-consent>
+  
+  <article>
+    <div class="content-container">
+      <header>
+        <h1 itemprop="headline">Lorem Ipsum</h1>
+        <time class="header-time" itemprop="datePublished"
+              datetime="2015-09-14 13:00">September 14, 2015</time>
+        <p class="standfirst">
+          Fusce pretium tempor justo, vitae consequat dolor maximus eget.
+        </p>
+      </header>
+
+      <div>
+        Revoke consent
+        <button class="button" on="tap:ABC.prompt" role="button">Manage</button>
+      </div>
+
+      <div class="author">
+        <div class="byline">
+          <p>
+            by <span itemscope itemtype="http://schema.org/Person"
+                     itemprop="author"><b>Lorem Ipsum</b>
+              <a class="mailto" href="mailto:lorem.ipsum@">
+              lorem.ipsum@</a></span>
+          </p>
+          <p class="brand">PublisherName News Reporter<p>
+        </div>
+      </div>
+      <div class="article-body" itemprop="articleBody">
+        <p>
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+          Curabitur ullamcorper turpis vel commodo scelerisque. Phasellus
+          luctus nunc ut elit cursus, et imperdiet diam vehicula.
+          Duis et nisi sed urna blandit bibendum et sit amet erat.
+          Suspendisse potenti. Curabitur consequat volutpat arcu nec
+          elementum. Etiam a turpis ac libero varius condimentum.
+          Maecenas sollicitudin felis aliquam tortor vulputate,
+          ac posuere velit semper.
+        </p>
+      </div>
+    </div>
+    <button on="tap:ABC.prompt" role="button">Manage Consent</button>
+  </article>
+
+  <amp-twitter
+    width="375"
+    height="472"
+    layout="responsive"
+    data-tweetid="885634330868850689"
+  >
+  <blockquote placeholder>
+    <p>
+      I only needed to change some CSS.
+      <a href="http://t.co/LvjLbjgY9F">pic.twitter.com/LvjLbjgY9F</a>
+    </p>
+    &mdash; Malte Ubl (@cramforce)
+    <a href="https://twitter.com/cramforce/status/638793490521001985"
+      >September 1, 2015</a
+    >
+  </blockquote>
+  </amp-twitter>
+</main>
+
+<footer>
+  <div class="brand-logo">PublisherLogo</div>
+</footer>
+</body>
+</html>
diff --git a/test/manual/amp-consent-cmp-overlay.html b/test/manual/amp-consent/amp-consent-cmp-overlay.html
similarity index 100%
rename from test/manual/amp-consent-cmp-overlay.html
rename to test/manual/amp-consent/amp-consent-cmp-overlay.html
diff --git a/test/manual/amp-consent/legacy_config_support/amp-consent-cmp.html b/test/manual/amp-consent/legacy_config_support/amp-consent-cmp.html
new file mode 100644
index 0000000000000..392d99724beb0
--- /dev/null
+++ b/test/manual/amp-consent/legacy_config_support/amp-consent-cmp.html
@@ -0,0 +1,383 @@
+<!doctype html>
+<html ⚡>
+
+<head>
+  <meta charset="utf-8">
+  <title>AMP Consent Test</title>
+  <link rel="canonical" href="amps.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <meta name="amp-consent-blocking" content="amp-ad">
+  <link href='https://fonts.googleapis.com/css?family=Georgia|Open+Sans|Roboto' rel='stylesheet' type='text/css'>
+
+  <style amp-custom>
+    body {
+      margin: 0;
+      font-family: 'Georgia', Serif;
+    }
+
+    .brand-logo {
+      font-family: 'Open Sans';
+    }
+
+    .ad-container {
+      display: flex;
+      justify-content: center;
+    }
+
+    .content-container p {
+      line-height: 24px;
+    }
+
+    header,
+    .article-body {
+      padding: 15px;
+    }
+
+    .full-bleed {
+      margin: 0 -15px;
+    }
+
+    figure {
+      margin: 0;
+    }
+
+    figcaption {
+      color: #6f757a;
+      padding: 15px 0;
+      font-size: .9em;
+    }
+
+    .author {
+      display: flex;
+      align-items: center;
+
+      background: #f4f4f4;
+      padding: 0 15px;
+
+      font-size: .8em;
+
+      border: solid #dcdcdc;
+      border-width: 1px 0;
+    }
+
+    .header-time {
+      color: #a8a3ae;
+      font-family: 'Roboto';
+      font-size: 12px;
+    }
+
+    .author p {
+      margin: 5px;
+    }
+
+    .byline {
+      font-family: 'Roboto';
+      display: inline-block;
+    }
+
+    .byline p {
+      line-height: normal;
+    }
+
+    .byline .brand {
+      color: #6f757a;
+    }
+
+    .standfirst {
+      color: #6f757a;
+    }
+
+    .mailto {
+      text-decoration: none;
+    }
+
+    #author-avatar {
+      margin: 10px;
+      border: 5px solid #fff;
+      width: 50px;
+      height: 50px;
+      border-radius: 50%;
+    }
+
+    h1 {
+      margin: 5px 0;
+      font-weight: normal;
+    }
+
+    footer {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 226px;
+      background: #f4f4f4;
+    }
+
+    amp-consent {
+      min-height: 30px;
+      font-family: 'Roboto';
+      font-weight: 500;
+      line-height: 30px;
+      padding: 8px;
+      background: #46b6ac;
+    }
+
+    amp-consent button {
+      border: none;
+      border-radius: 2px;
+
+      color: #fafafa;
+      height: 26px;
+      min-width: 32px;
+      padding: 0 16px;
+      margin: 0 16px;
+      text-transform: uppercase;
+      letter-spacing: 0;
+      cursor: pointer;
+      vertical-align: middle;
+      line-height: 26px;
+      text-align: center;
+      background: #3f51b5;
+    }
+
+    #ui1 {
+      height: 100vh;
+    }
+
+    hr {
+      margin: 0;
+    }
+  </style>
+  <script async custom-element="amp-consent" src="https://cdn.ampproject.org/v0/amp-consent-0.1.js"></script>
+  <script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
+  <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
+  <script async src="https://cdn.ampproject.org/v0/amp-viewer-integration-0.1.js"></script>
+
+  <style amp-boilerplate>
+    body {
+      -webkit-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+      -moz-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+      -ms-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
+      animation: -amp-start 8s steps(1, end) 0s 1 normal both
+    }
+
+    @-webkit-keyframes -amp-start {
+      from {
+        visibility: hidden
+      }
+      to {
+        visibility: visible
+      }
+    }
+
+    @-moz-keyframes -amp-start {
+      from {
+        visibility: hidden
+      }
+      to {
+        visibility: visible
+      }
+    }
+
+    @-ms-keyframes -amp-start {
+      from {
+        visibility: hidden
+      }
+      to {
+        visibility: visible
+      }
+    }
+
+    @-o-keyframes -amp-start {
+      from {
+        visibility: hidden
+      }
+      to {
+        visibility: visible
+      }
+    }
+
+    @keyframes -amp-start {
+      from {
+        visibility: hidden
+      }
+      to {
+        visibility: visible
+      }
+    }
+  </style>
+  <noscript>
+    <style amp-boilerplate>
+      body {
+        -webkit-animation: none;
+        -moz-animation: none;
+        -ms-animation: none;
+        animation: none
+      }
+    </style>
+  </noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+
+<body>
+  <header>
+    <div class="brand-logo">
+      PublisherLogo
+    </div>
+  </header>
+
+  <p>Set server forcePromptOnNext value to</p>
+
+
+  <form method="get" action-xhr="../../get-consent-v1-set" target="_top">
+    <input type="radio" id="t" name="forcePromptOnNext" value="false" checked>
+    <label for="false">False</label>
+    <input type="radio" id="f" name="forcePromptOnNext" value="true">
+    <label for="true">True</label>
+    <input type="submit" value="OK">
+    <div submit-success>
+      Success!
+    </div>
+    <div submit-error>
+      Error!
+    </div>
+  </form>
+
+  <main role="main">
+    <amp-ad width=300 height=250
+        data-block-on-consent
+        type="_ping_"
+        data-url='https://lh3.googleusercontent.com/pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w400-h300-no-n'
+        data-valid='true'
+        data-enable-io='true'>
+    </amp-ad>
+
+    <h3>Image that is blocked by both consent</h3>
+    <amp-img data-block-on-consent src="https://lh3.googleusercontent.com/pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w300-h200-no-n"
+      width=300 height=200></amp-img>
+
+    <h3>Image that is NOT blocked by consent</h3>
+    <amp-img src="https://lh3.googleusercontent.com/pSECrJ82R7-AqeBCOEPGPM9iG9OEIQ_QXcbubWIOdkY=w300-h200-no-n" width=300 height=200></amp-img>
+
+    <amp-consent id='ABC' layout='nodisplay' type='_ping_'>
+      <script type="application/json">
+      {
+        "postPromptUI": "postPromptUI",
+        "clientConfig": {
+          "CMP_id": "test_id",
+          "other_info": "test_info"
+        }
+      }
+      </script>
+      <div id="postPromptUI">
+        Post Prompt UI
+        <button on="tap:ABC.prompt(consent=_ping_)" role="button">Manage</button>
+      </div>
+    </amp-consent>
+    <article>
+
+      <div class="content-container">
+        <header>
+          <h1 itemprop="headline">Lorem Ipsum</h1>
+          <time class="header-time" itemprop="datePublished" datetime="2015-09-14 13:00">September 14, 2015</time>
+          <p class="standfirst">
+            Fusce pretium tempor justo, vitae consequat dolor maximus eget.
+          </p>
+        </header>
+
+        <div>
+          Revoke consent ABC and DEF
+          <button class="button" on="tap:ABC.prompt(consent=ABC),ABC.prompt(consent=DEF)" role="button">Manage</button>
+        </div>
+        <div>
+          Revoke error consent doesn't exsit
+          <button class="button" on="tap:ABC.prompt(consent=ABCd)" role="button">Manage</button>
+        </div>
+        <div>
+          Only revoke DEF
+          <button class="button" on="tap:ABC.prompt(consent=DEF)" role="button">Manage</button>
+        </div>
+
+        <div class="author">
+          <div class="byline">
+            <p>
+              by <span itemscope itemtype="http://schema.org/Person" itemprop="author"><b>Lorem Ipsum</b>
+          <a class="mailto" href="mailto:lorem.ipsum@">
+          lorem.ipsum@</a></span>
+            </p>
+            <p class="brand">PublisherName News Reporter
+              <p>
+          </div>
+        </div>
+        <div class="article-body" itemprop="articleBody">
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ullamcorper turpis vel commodo scelerisque. Phasellus
+            luctus nunc ut elit cursus, et imperdiet diam vehicula. Duis et nisi sed urna blandit bibendum et sit amet erat.
+            Suspendisse potenti. Curabitur consequat volutpat arcu nec elementum. Etiam a turpis ac libero varius condimentum.
+            Maecenas sollicitudin felis aliquam tortor vulputate, ac posuere velit semper.
+          </p>
+          <p>
+            Fusce pretium tempor justo, vitae consequat dolor maximus eget. Aliquam iaculis tincidunt quam sed maximus. Suspendisse faucibus
+            ornare sodales. Nullam id dolor vitae arcu consequat ornare a et lectus. Sed tempus eget enim eget lobortis.
+            Mauris sem est, accumsan sed tincidunt ut, sagittis vel arcu. Nullam in libero nisi.
+          </p>
+
+          <p>
+            Sed pharetra semper fringilla. Nulla fringilla, neque eget varius suscipit, mi turpis congue odio, quis dignissim nisi nulla
+            at erat. Duis non nibh vel erat vehicula hendrerit eget vel velit. Donec congue augue magna, nec eleifend dui
+            porttitor sed. Cras orci quam, dignissim nec elementum ac, bibendum et purus. Ut elementum mi eget felis ultrices
+            tempus. Maecenas nec sodales ex. Phasellus ultrices, purus non egestas ullamcorper, felis lorem ultrices nibh,
+            in tristique mauris justo sed ante. Nunc commodo purus feugiat metus bibendum consequat. Duis finibus urna ut
+            ligula auctor, sed vehicula ex aliquam. Sed sed augue auctor, porta turpis ultrices, cursus diam. In venenatis
+            aliquet porta. Sed volutpat fermentum quam, ac molestie nulla porttitor ac. Donec porta risus ut enim pellentesque,
+            id placerat elit ornare.
+          </p>
+          <p>
+            Curabitur convallis, urna quis pulvinar feugiat, purus diam posuere turpis, sit amet tincidunt purus justo et mi. Donec sapien
+            urna, aliquam ut lacinia quis, varius vitae ex. Maecenas efficitur iaculis lorem, at imperdiet orci viverra in.
+            Nullam eu erat eu metus ultrices viverra a sit amet leo. Pellentesque est felis, pulvinar mollis sollicitudin
+            et, suscipit eget massa. Nunc bibendum non nunc et consequat. Quisque auctor est vel leo faucibus, non faucibus
+            magna ultricies. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum
+            tortor lacus, bibendum et enim eu, vehicula placerat erat. Nullam gravida rhoncus accumsan. Integer suscipit
+            iaculis elit nec mollis. Vestibulum eget arcu nec lectus finibus rutrum vel sed orci.
+          </p>
+
+          <figure>
+            <figcaption>
+              Fusce pretium tempor justo, vitae consequat dolor maximus eget.
+            </figcaption>
+          </figure>
+          <hr>
+
+          <p>
+            Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla et viverra turpis. Fusce viverra
+            enim eget elit blandit, in finibus enim blandit. Integer fermentum eleifend felis non posuere. In vulputate et
+            metus at aliquam. Praesent a varius est. Quisque et tincidunt nisi. Nam porta urna at turpis lacinia, sit amet
+            mattis eros elementum. Etiam vel mauris mattis, dignissim tortor in, pulvinar arcu. In molestie sem elit, tincidunt
+            venenatis tortor aliquet sodales. Ut elementum velit fermentum felis volutpat sodales in non libero. Aliquam
+            erat volutpat.
+          </p>
+
+          <p>
+            Morbi at velit vitae eros congue congue venenatis non dui. Sed lacus sem, feugiat sed elementum sed, maximus sed lacus. Integer
+            accumsan magna in sagittis pharetra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
+            inceptos himenaeos. Suspendisse ac nisl efficitur ligula aliquam lacinia eu in magna. Vestibulum non felis odio.
+            Ut consectetur venenatis felis aliquet maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra,
+            per inceptos himenaeos.
+          </p>
+        </div>
+      </div>
+    </article>
+  </main>
+
+  <footer>
+    <div class="brand-logo">PublisherLogo</div>
+  </footer>
+
+  <script>
+    setTimeout(() => {
+      AMP.toggleExperiment('amp-consent-restrict-fullscreen', true);
+    }, 500);
+  </script>
+</body>
+
+</html>
diff --git a/test/manual/amp-consent-geo.html b/test/manual/amp-consent/legacy_config_support/amp-consent-geo.html
similarity index 100%
rename from test/manual/amp-consent-geo.html
rename to test/manual/amp-consent/legacy_config_support/amp-consent-geo.html
diff --git a/examples/amp-consent/amp-consent-iframe.amp.html b/test/manual/amp-consent/legacy_config_support/amp-consent-iframe.amp.html
similarity index 95%
rename from examples/amp-consent/amp-consent-iframe.amp.html
rename to test/manual/amp-consent/legacy_config_support/amp-consent-iframe.amp.html
index f88741639af26..963472eb4eeec 100644
--- a/examples/amp-consent/amp-consent-iframe.amp.html
+++ b/test/manual/amp-consent/legacy_config_support/amp-consent-iframe.amp.html
@@ -153,6 +153,18 @@
       PublisherLogo
     </div>
   </header>
+  <p>
+    This is an example to show that one can use "amp-iframe" as the UI,
+    and "amp-consent" handles the layout of the iframe correctly.
+    You should be able to see an interact with an iframe prompt that looks like the one below
+  </p>
+  <amp-iframe id='1234' width=300 height=50
+    sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox"
+    layout="responsive"
+    frameborder="0"
+    src="http://ads.localhost:8000/examples/amp-consent/diy-consent.html">
+    <amp-img layout="fill" src="https://foo.com/foo.png" placeholder></amp-img>
+  </amp-iframe>
   <main role="main">
      <h3>Image that is blocked by '_till_responded' consent</h3>
     <amp-img
@@ -322,15 +334,6 @@ <h1 itemprop="headline">Lorem Ipsum</h1>
         </div>
       </div>
 
-      <amp-iframe id='1234' width=300 height=50
-          on:"message:myConsentId.accept"
-          sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox"
-          layout="responsive"
-          frameborder="0"
-          src="http://ads.localhost:8000/test/manual/diy-consent.html">
-          <placeholder></placeholder>
-      </amp-iframe>
-
       <amp-consent id='ABC' layout='nodisplay'>
       <script type="application/json">{
         "consents": {
@@ -344,11 +347,10 @@ <h1 itemprop="headline">Lorem Ipsum</h1>
       <div id="ui1">
         Can I load the image??
         <amp-iframe id='5678' width=300 height=50
-          on:"message:myConsentId.accept"
           sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox"
           layout="responsive"
           frameborder="0"
-          src="http://ads.localhost:8000/test/manual/diy-consent.html">
+          src="http://ads.localhost:8000/examples/amp-consent/diy-consent.html">
           <placeholder></placeholder>
         </amp-iframe>
       </div>
diff --git a/examples/amp-consent/amp-consent.amp.html b/test/manual/amp-consent/legacy_config_support/amp-consent.amp.html
similarity index 99%
rename from examples/amp-consent/amp-consent.amp.html
rename to test/manual/amp-consent/legacy_config_support/amp-consent.amp.html
index 80239c2f7d90d..d16a87896f786 100644
--- a/examples/amp-consent/amp-consent.amp.html
+++ b/test/manual/amp-consent/legacy_config_support/amp-consent.amp.html
@@ -174,9 +174,9 @@ <h3>Image that is blocked by '_till_responded' consent</h3>
           }
         },
         "transport": {
-          "beacon": "false",
-          "xhrpost": "false",
-          "image": "true"
+          "beacon": false,
+          "xhrpost": false,
+          "image": true
         }
       }
       </script>
diff --git a/test/manual/amp-fit-text.amp.html b/test/manual/amp-fit-text.amp.html
deleted file mode 100644
index 9adc8514c7474..0000000000000
--- a/test/manual/amp-fit-text.amp.html
+++ /dev/null
@@ -1,66 +0,0 @@
-<!doctype html>
-<html ⚡>
-<head>
-  <meta charset="utf-8">
-  <title>AMP #0</title>
-  <link rel="canonical" href="amps.html" >
-  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
-  <link href='https://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
-  <script async custom-element="amp-fit-text" src="https://cdn.ampproject.org/v0/amp-fit-text-0.1.js"></script>
-  <style amp-custom>
-    body {
-      font-family: 'Questrial', Arial;
-    }
-    article {
-      display: block;
-      margin: 8px;
-    }
-    .ft {
-      border: 1px solid black;
-      margin: 8px auto;
-      display: block;
-    }
-  </style>
-  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
-  <script async src="https://cdn.ampproject.org/v0.js"></script>
-</head>
-<body>
-<article>
-  <h1>FitText</h1>
-
-  <h3>Scale up to cover</h3>
-  <amp-fit-text width="300" height="200" class="ft">
-    Lorem <i>ips</i>um dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.
-  </amp-fit-text>
-
-  <h3>Scale up + overflow + ellipsis</h3>
-  <amp-fit-text width="300" height="200" class="ft" min-font-size=42>
-    Lorem <i>ips</i>um dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.
-  </amp-fit-text>
-
-  <h3>Scale down</h3>
-  <amp-fit-text width="300" height="200" class="ft">
-    Lorem <i>ips</i>um dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt. Propriae tincidunt id nec, elit nusquam te mea, ius noster platonem in. Mea an idque minim, sit sale deleniti apeirian et. Omnium legendos tractatos cu mea. Vix in stet dolorem accusamus. Iisque rationibus consetetur in cum, quo unum nulla legere ut. Simul numquam saperet no sit.
-  </amp-fit-text>
-
-  <h3>Scale down</h3>
-  <amp-fit-text width="108" height="78" class="ft">
-    Specialcase test
-  </amp-fit-text>
-
-  <p>
-    Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt.
-  </p>
-
-  <p>
-    Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt. Propriae tincidunt id nec, elit nusquam te mea, ius noster platonem in. Mea an idque minim, sit sale deleniti apeirian et. Omnium legendos tractatos cu mea. Vix in stet dolorem accusamus. Iisque rationibus consetetur in cum, quo unum nulla legere ut. Simul numquam saperet no sit.
-  </p>
-
-  <p>
-    Lorem ipsum dolor sit amet, has nisl nihil convenire et, vim at aeque inermis reprehendunt. Propriae tincidunt id nec, elit nusquam te mea, ius noster platonem in. Mea an idque minim, sit sale deleniti apeirian et. Omnium legendos tractatos cu mea. Vix in stet dolorem accusamus. Iisque rationibus consetetur in cum, quo unum nulla legere ut. Simul numquam saperet no sit.
-  </p>
-
-</article>
-</body>
-</html>
-
diff --git a/test/manual/amp-ima-video.html b/test/manual/amp-ima-video.html
index b99a2a8f44274..ecca876b03e60 100644
--- a/test/manual/amp-ima-video.html
+++ b/test/manual/amp-ima-video.html
@@ -45,10 +45,10 @@
                 }
             },
             "transport": {
-                "beacon": "false",
-                "xhrpost": "false",
-                "image": "true"
-            }
+                "beacon": false,
+                "xhrpost": false,
+                "image": true
+              }
         }
         </script>
     </amp-analytics>
diff --git a/test/manual/amp-inline-gallery/fixed-height.amp.html b/test/manual/amp-inline-gallery/fixed-height.amp.html
new file mode 100644
index 0000000000000..748b8a6dad345
--- /dev/null
+++ b/test/manual/amp-inline-gallery/fixed-height.amp.html
@@ -0,0 +1,99 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <script async custom-element="amp-lightbox-gallery" src="https://cdn.ampproject.org/v0/amp-lightbox-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .gallery {
+      max-width: 900px;
+      margin: auto;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body>
+  <h1>A fixed-height inline gallery</h1>
+  <amp-inline-gallery class="gallery" layout="container">
+    <amp-base-carousel
+        layout="fixed-height" height="200"
+        snap-align="center"
+        loop="true"
+        mixed-length="true"
+        lightbox>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=0" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/400/400?foo=1" layout="fixed" width="200" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=2" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=3" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/1200/400?foo=4" layout="fixed" width="600" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/400/400?foo=5" layout="fixed" width="200" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/400/400?foo=6" layout="fixed" width="200" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=7" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/400/400?foo=8" layout="fixed" width="200" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/300/400?foo=9" layout="fixed" width="150" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/300/400?foo=10" layout="fixed" width="150" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/300/400?foo=11" layout="fixed" width="150" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=12" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/1200/400?foo=13" layout="fixed" width="600" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/800/400?foo=14" layout="fixed" width="400" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=15" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/800/400?foo=16" layout="fixed" width="400" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=17" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/400/400?foo=18" layout="fixed" width="200" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=19" layout="fixed" width="300" height="200"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=20" layout="fixed" width="300" height="200"></amp-img>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination layout="fixed-height" height="24">
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Looping
+    </li>
+    <li>
+      Fixed height
+    </li>
+    <li>
+      Mixed slide widths
+    </li>
+    <li>
+      Outset pagination dots
+    </li>
+    <li>
+      Random, remote images from picsum (some images may fail to load)
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/img/alan-jones-OQsxdghBKrU-unsplash-small.jpg b/test/manual/amp-inline-gallery/img/alan-jones-OQsxdghBKrU-unsplash-small.jpg
new file mode 100644
index 0000000000000..807f590599b8c
Binary files /dev/null and b/test/manual/amp-inline-gallery/img/alan-jones-OQsxdghBKrU-unsplash-small.jpg differ
diff --git a/test/manual/amp-inline-gallery/img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg b/test/manual/amp-inline-gallery/img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg
new file mode 100644
index 0000000000000..b2afe181f86ac
Binary files /dev/null and b/test/manual/amp-inline-gallery/img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg differ
diff --git a/test/manual/amp-inline-gallery/img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg b/test/manual/amp-inline-gallery/img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg
new file mode 100644
index 0000000000000..516a8aea87617
Binary files /dev/null and b/test/manual/amp-inline-gallery/img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg differ
diff --git a/test/manual/amp-inline-gallery/img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg b/test/manual/amp-inline-gallery/img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg
new file mode 100644
index 0000000000000..e11ea8fc9e2e9
Binary files /dev/null and b/test/manual/amp-inline-gallery/img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg differ
diff --git a/test/manual/amp-inline-gallery/pagination-and-thumbnails.amp.html b/test/manual/amp-inline-gallery/pagination-and-thumbnails.amp.html
new file mode 100644
index 0000000000000..624b9ffe558d2
--- /dev/null
+++ b/test/manual/amp-inline-gallery/pagination-and-thumbnails.amp.html
@@ -0,0 +1,167 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    amp-inline-gallery {
+      max-width: 900px;
+      --thumbnail-margin: 4px;
+    }
+
+    .gallery.gallery img {
+      object-fit: cover;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body>
+  <h1>Gallery with pagination count and thumbnails</h1>
+  <amp-inline-gallery layout="container">
+    <div layout="container">
+      <!--
+          Note: the thumbnails may use the larger size if that network request
+          is already in flight.
+      -->
+      <amp-base-carousel
+          class="gallery"
+          layout="responsive"
+          width="3" height="2"
+          snap-align="center"
+          loop="true">
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/1/150/100 300w,
+                    https://picsum.photos/id/1/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/2/150/100 300w,
+                    https://picsum.photos/id/2/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/3/150/100 300w,
+                    https://picsum.photos/id/3/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/4/150/100 300w,
+                    https://picsum.photos/id/4/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/5/150/100 300w,
+                    https://picsum.photos/id/5/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/6/150/100 300w,
+                    https://picsum.photos/id/6/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/7/150/100 300w,
+                    https://picsum.photos/id/7/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/8/150/100 300w,
+                    https://picsum.photos/id/8/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/9/150/100 300w,
+                    https://picsum.photos/id/9/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/10/150/100 300w,
+                    https://picsum.photos/id/10/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/11/150/100 300w,
+                    https://picsum.photos/id/11/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/12/150/100 300w,
+                    https://picsum.photos/id/12/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/13/150/100 300w,
+                    https://picsum.photos/id/13/600/400 600w">
+        </amp-img>
+        <amp-img
+            class="slide"
+            layout="flex-item"
+            srcset="https://picsum.photos/id/14/150/100 300w,
+                    https://picsum.photos/id/14/600/400 600w">
+        </amp-img>
+      </amp-base-carousel>
+      <amp-inline-gallery-pagination layout="nodisplay" inset>
+      </amp-inline-gallery-pagination>
+    </div>
+    <amp-inline-gallery-thumbnails class="gallery" responsive="fixed-height" height="96">
+    </amp-inline-gallery-thumbnails>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Looping
+    </li>
+    <li>
+      Inset pagination dots
+    </li>
+    <li>
+      Thumbnails
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/pagination-only-autoplay.amp.html b/test/manual/amp-inline-gallery/pagination-only-autoplay.amp.html
new file mode 100644
index 0000000000000..10be0625888c9
--- /dev/null
+++ b/test/manual/amp-inline-gallery/pagination-only-autoplay.amp.html
@@ -0,0 +1,86 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .gallery .slide img {
+      object-fit: cover;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body>
+  <h1>A pagination-only inline gallery</h1>
+  <amp-inline-gallery layout="container">
+    <amp-base-carousel
+        class="gallery"
+        layout="responsive"
+        width="3" height="2"
+        snap-align="center"
+        loop="true"
+        auto-advance="true"
+        auto-advance-interval="5000"
+        controls="always">
+      <amp-img class="slide" alt="A moon in a cloudy sky" src="./img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A desert with a single tree and a mountain backdrop" class="slide" src="./img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="Blossoming flowers" src="./img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A sunset"src="./img/alan-jones-OQsxdghBKrU-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <div class="flex">
+        <div class="white" style="flex: 3;"></div>
+        <div class="grey" style="flex: 1;"></div>
+        <div class="black" style="flex: 3;"></div>
+      </div>
+      <div class="checkered"></div>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination layout="nodisplay" inset>
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Looping
+    </li>
+    <li>
+      Auto advancing slides
+    </li>
+    <li>
+      Inset pagination dots
+    </li>
+    <li>
+      Always show arrows (even after touch)
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/pagination-only-many-slides.amp.html b/test/manual/amp-inline-gallery/pagination-only-many-slides.amp.html
new file mode 100644
index 0000000000000..e44831ca0b094
--- /dev/null
+++ b/test/manual/amp-inline-gallery/pagination-only-many-slides.amp.html
@@ -0,0 +1,106 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <script async custom-element="amp-lightbox-gallery" src="https://cdn.ampproject.org/v0/amp-lightbox-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .outset-pagination {
+      font-size: 1.1em;
+    }
+
+    .gallery .slide img {
+      object-fit: cover;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body>
+  <h1>A pagination-only inline gallery</h1>
+  <amp-inline-gallery layout="container">
+    <amp-base-carousel
+        class="gallery"
+        layout="responsive" width="3.6" height="2"
+        snap-align="center"
+        loop="true"
+        visible-count="1.2"
+        lightbox>
+      <amp-img class="slide" alt="A moon in a cloudy sky" src="./img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A desert with a single tree and a mountain backdrop" class="slide" src="./img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="Blossoming flowers" src="./img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A sunset"src="./img/alan-jones-OQsxdghBKrU-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/redgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/greengradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/bluegradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/orangegradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/tealgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/lemonyellowgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/lilacgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/redgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/greengradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/bluegradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/orangegradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/tealgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/lemonyellowgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/lilacgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/redgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/greengradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/bluegradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/orangegradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/tealgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/lemonyellowgradient.png" layout="flex-item"></amp-img>
+      <amp-img src="../amp-base-carousel/img/lilacgradient.png" layout="flex-item"></amp-img>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination media="(max-width: 600px)" layout="nodisplay" inset>
+    </amp-inline-gallery-pagination>
+    <amp-inline-gallery-pagination class="outset-pagination" media="(min-width: 601px)" layout="fixed-height" height="26px">
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Looping
+    </li>
+    <li>
+      10% peek on each slide
+    </li>
+    <li>
+      Many slides (pagination shows count instead of dots).
+    </li>
+    <li>
+      Pagination dots inset when width <= 600px
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/pagination-only-outset.amp.html b/test/manual/amp-inline-gallery/pagination-only-outset.amp.html
new file mode 100644
index 0000000000000..4fb3316d05a6a
--- /dev/null
+++ b/test/manual/amp-inline-gallery/pagination-only-outset.amp.html
@@ -0,0 +1,76 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <script async custom-element="amp-lightbox-gallery" src="https://cdn.ampproject.org/v0/amp-lightbox-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .gallery .slide img {
+      object-fit: cover;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body>
+  <h1>A pagination-only inline gallery</h1>
+  <amp-inline-gallery layout="container">
+    <amp-base-carousel class="gallery" layout="responsive" width="3.6" height="2" snap-align="center" loop="true" visible-count="1.2">
+      <amp-img class="slide" alt="A moon in a cloudy sky" src="./img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A desert with a single tree and a mountain backdrop" class="slide" src="./img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="Blossoming flowers" src="./img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A sunset"src="./img/alan-jones-OQsxdghBKrU-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <div class="flex">
+        <div class="white" style="flex: 3;"></div>
+        <div class="grey" style="flex: 1;"></div>
+        <div class="black" style="flex: 3;"></div>
+      </div>
+      <div class="checkered"></div>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination layout="fixed-height" height="24">
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Looping
+    </li>
+    <li>
+      10% peek on each slide
+    </li>
+    <li>
+      Outset pagination dots
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/pagination-only-remote-images.amp.html b/test/manual/amp-inline-gallery/pagination-only-remote-images.amp.html
new file mode 100644
index 0000000000000..eb76c696d01b9
--- /dev/null
+++ b/test/manual/amp-inline-gallery/pagination-only-remote-images.amp.html
@@ -0,0 +1,90 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <script async custom-element="amp-lightbox-gallery" src="https://cdn.ampproject.org/v0/amp-lightbox-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .gallery .slide img {
+      object-fit: cover;
+    }
+  </style>
+</head>
+<body>
+  <h1>A pagination-only inline gallery</h1>
+  <amp-inline-gallery layout="container">
+    <amp-base-carousel
+        class="gallery"
+        layout="responsive"
+        width="3" height="2"
+        snap-align="center"
+        loop="true"
+        controls="always"
+        lightbox>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=0" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=1" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=2" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=3" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=4" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=5" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=6" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=7" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=8" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=9" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=10" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=11" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=12" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=13" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=14" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=15" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=16" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=17" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=18" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=19" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=20" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=21" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=22" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=23" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=24" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=25" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=26" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=27" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=28" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=29" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=30" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=31" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=32" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=33" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=34" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=35" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=36" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=37" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=38" layout="flex-item"></amp-img>
+      <amp-img class="slide" src="https://picsum.photos/600/400?foo=39" layout="flex-item"></amp-img>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination layout="nodisplay" inset>
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Looping
+    </li>
+    <li>
+      Inset pagination dots / count
+    </li>
+    <li>
+      Always show arrows (even after touch)
+    </li>
+    <li>
+      Random, remote images from picsum (some images may fail to load)
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/pagination-only-responsive.amp.html b/test/manual/amp-inline-gallery/pagination-only-responsive.amp.html
new file mode 100644
index 0000000000000..46d82d560cab6
--- /dev/null
+++ b/test/manual/amp-inline-gallery/pagination-only-responsive.amp.html
@@ -0,0 +1,90 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .gallery .slide img {
+      object-fit: cover;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body>
+  <h1>A pagination-only inline gallery</h1>
+  <amp-inline-gallery layout="container">
+    <amp-base-carousel
+        class="gallery"
+        layout="responsive"
+        width="3.6" height="2"
+        snap-align="center"
+        loop="true"
+        visible-count="1.2"
+        controls="(pointer: fine) auto, never">\
+      <amp-img class="slide" alt="A moon in a cloudy sky" src="./img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A desert with a single tree and a mountain backdrop" class="slide" src="./img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="Blossoming flowers" src="./img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A sunset"src="./img/alan-jones-OQsxdghBKrU-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <div class="flex">
+        <div class="white" style="flex: 3;"></div>
+        <div class="grey" style="flex: 1;"></div>
+        <div class="black" style="flex: 3;"></div>
+      </div>
+      <div class="checkered"></div>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination media="(max-width: 600px)" layout="nodisplay" inset>
+    </amp-inline-gallery-pagination>
+    <amp-inline-gallery-pagination media="(min-width: 601px)" layout="fixed-height" height="24px">
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Looping
+    </li>
+    <li>
+      10% peek on each slide
+    </li>
+    <li>
+      Pagination dots inset when width <= 600px
+    </li>
+    <li>
+      Arrows hidden when primarily using touch: <code>(pointer: coarse)</code>
+    </li>
+    <li>
+      Arrows hidden on touch when primarily using mouse: <code>(pointer: fine)</code>
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/pagination-only.amp.html b/test/manual/amp-inline-gallery/pagination-only.amp.html
new file mode 100644
index 0000000000000..7ab9768b38af4
--- /dev/null
+++ b/test/manual/amp-inline-gallery/pagination-only.amp.html
@@ -0,0 +1,81 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .gallery .slide img {
+      object-fit: cover;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body>
+  <h1>A pagination-only inline gallery</h1>
+  <amp-inline-gallery layout="container">
+    <amp-base-carousel
+        class="gallery"
+        layout="responsive"
+        width="3" height="2"
+        snap-align="center"
+        loop="false"
+        controls="always">
+      <amp-img class="slide" alt="A moon in a cloudy sky" src="./img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A desert with a single tree and a mountain backdrop" class="slide" src="./img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="Blossoming flowers" src="./img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A sunset"src="./img/alan-jones-OQsxdghBKrU-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <div class="flex">
+        <div class="white" style="flex: 3;"></div>
+        <div class="grey" style="flex: 1;"></div>
+        <div class="black" style="flex: 3;"></div>
+      </div>
+      <div class="checkered"></div>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination layout="nodisplay" inset>
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      Non-looping
+    </li>
+    <li>
+      Inset pagination dots
+    </li>
+    <li>
+      Always show arrows (even after touch)
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-inline-gallery/rtl.amp.html b/test/manual/amp-inline-gallery/rtl.amp.html
new file mode 100644
index 0000000000000..09ea3bb2c7fd9
--- /dev/null
+++ b/test/manual/amp-inline-gallery/rtl.amp.html
@@ -0,0 +1,85 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>A Basic inline gallery</title>
+  <link rel="canonical" href="amps.html" >
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <script async custom-element="amp-base-carousel" src="https://cdn.ampproject.org/v0/amp-base-carousel-0.1.js"></script>
+  <script async custom-element="amp-inline-gallery" src="https://cdn.ampproject.org/v0/amp-inline-gallery-0.1.js"></script>
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <style amp-custom>
+    .gallery .slide img {
+      object-fit: cover;
+    }
+
+    .flex {
+      display: flex;
+    }
+
+    .white {
+      background-color: white;
+    }
+
+    .grey {
+      background-color: hsla(0, 0%, 33%);
+    }
+
+    .black {
+      background-color: black;
+    }
+
+    .checkered {
+      background-image:
+          linear-gradient(45deg, #666 25%, transparent 25%),
+          linear-gradient(-45deg, #666 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #666 75%),
+          linear-gradient(-45deg, transparent 75%, #666 75%);
+      background-size: 20px 20px;
+      background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
+    }
+  </style>
+</head>
+<body dir="rtl">
+  <h1>A pagination-only inline gallery</h1>
+  <amp-inline-gallery layout="container">
+    <amp-base-carousel
+        class="gallery"
+        layout="responsive"
+        width="3" height="2"
+        snap-align="center"
+        loop="false"
+        controls="always"
+        dir="rtl">
+      <amp-img class="slide" alt="A moon in a cloudy sky" src="./img/sander-dewerte--jcP3xbN88w-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A desert with a single tree and a mountain backdrop" class="slide" src="./img/ivars-krutainis-jTJ9-4ESzU4-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="Blossoming flowers" src="./img/ola-gronlund--MuvLw5G6x8-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <amp-img class="slide" alt="A sunset"src="./img/alan-jones-OQsxdghBKrU-unsplash-small.jpg" layout="flex-item"></amp-img>
+      <div class="flex">
+        <div class="white" style="flex: 3;"></div>
+        <div class="grey" style="flex: 1;"></div>
+        <div class="black" style="flex: 3;"></div>
+      </div>
+      <div class="checkered"></div>
+    </amp-base-carousel>
+    <amp-inline-gallery-pagination layout="nodisplay" inset>
+    </amp-inline-gallery-pagination>
+  </amp-inline-gallery>
+  <h2>Config</h2>
+  <ul>
+    <li>
+      RTL
+    </li>
+    <li>
+      Non-looping
+    </li>
+    <li>
+      Inset pagination dots
+    </li>
+    <li>
+      Always show arrows (even after touch)
+    </li>
+  </ul>
+</body>
+</html>
diff --git a/test/manual/amp-nested-menu/amp-nested-menu.amp.html b/test/manual/amp-nested-menu/amp-nested-menu.amp.html
index 908320dd54278..2e300b562cc6e 100644
--- a/test/manual/amp-nested-menu/amp-nested-menu.amp.html
+++ b/test/manual/amp-nested-menu/amp-nested-menu.amp.html
@@ -12,11 +12,6 @@
   <script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
   <script async custom-element="amp-accordion" src="https://cdn.ampproject.org/v0/amp-accordion-0.1.js"></script>
   <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
-  <script>
-    (self.AMP=self.AMP||[]).push(function(AMP){
-        AMP.toggleExperiment('amp-nested-menu', true);
-    });
-  </script>
   <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
   <style amp-custom>
     amp-sidebar {
diff --git a/test/manual/amp-next-page/1.0/amp-next-page-v1.element-visibility.html b/test/manual/amp-next-page/1.0/amp-next-page-v1.element-visibility.html
new file mode 100644
index 0000000000000..46da3553f2b42
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/amp-next-page-v1.element-visibility.html
@@ -0,0 +1,317 @@
+<!DOCTYPE html>
+<html ⚡>
+  <head>
+    <meta charset="utf-8" />
+    <title>AMP next page element visibility examples</title>
+    <link rel="canonical" href="amps.html">
+    <meta name="amp-experiments-opt-in" content="amp-next-page">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet" type="text/css">
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-next-page" src="https://cdn.ampproject.org/v0/amp-next-page-0.1.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+    <script>
+      (self.AMP=self.AMP||[]).push(function(AMP){
+          AMP.toggleExperiment('amp-next-page', true);
+      });
+    </script>    
+    <style amp-custom>
+      .content {
+        padding: 20px;
+      }
+      .hidden, .fixed, .sticky {
+        background-color: #34495e;
+        color: white;
+        font-size: 16px;
+        font-family: Roboto, 'Open Sans', 'Helvetica Neue', sans-serif;
+        padding: 16px;
+        border-radius: 4px;
+        z-index: 1;
+      }
+      .fixed {
+        background-color: #e74c3c;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        box-sizing: border-box;
+      }
+      .sticky {
+        position: sticky;
+        top: 0;
+        left: 0;
+        background-color: #27ae60;
+      }
+    </style>
+</head>
+  <body>
+    <div class="content">
+      <h2>Content discovery</h2>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <div class="hidden" next-page-hide>I should be visible when loaded as a host page but hidden if loaded as a next-page</div>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <div class="sticky" next-page-replace="my-sticky-element">I should get replaced by my sibling from each loaded page (page 0)</div>
+      <div class="fixed" next-page-hide>I am fixed and should be visible when loaded as a host page but hidden if loaded as a next-page (page 0)</div>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+    </div>
+    <amp-next-page>
+      <script type="application/json">
+        {
+            "pages": [
+                {
+                    "image": "/examples/img/hero@1x.jpg",
+                    "title": "Page 1",
+                    "ampUrl": "./articles/element-visibility-1.html"
+                },
+                {
+                    "image": "/examples/img/hero@1x.jpg",
+                    "title": "Page 2",
+                    "ampUrl": "./articles/element-visibility-2.html"
+                }
+            ],
+            "hideSelectors": [
+                ".hidden"
+            ]
+        }
+      </script>
+      <div separator>
+          Read more
+      </div>
+      <div more-box>
+          Here are a few more articles ...
+      </div>  
+    </amp-next-page>
+  </body>
+</html>
diff --git a/test/manual/amp-next-page/1.0/amp-next-page.amp.html b/test/manual/amp-next-page/1.0/amp-next-page.amp.html
new file mode 100644
index 0000000000000..c8d698595508b
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/amp-next-page.amp.html
@@ -0,0 +1,296 @@
+<!DOCTYPE html>
+<html ⚡>
+  <head>
+    <meta charset="utf-8" />
+    <title>AMP next page examples</title>
+    <link rel="canonical" href="amps.html">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet" type="text/css">
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-next-page" src="https://cdn.ampproject.org/v0/amp-next-page-1.0.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+    <script>
+      (self.AMP=self.AMP||[]).push(function(AMP){
+          AMP.toggleExperiment('amp-next-page-v2', true);
+      });
+    </script>    
+    <style amp-custom>
+      .content {
+        padding: 20px;
+      }
+    </style>
+</head>
+  <body>
+    <div class="content">
+      <h2>Host page</h2>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+    </div>    
+    <!-- amp-next-page configuration -->
+    <amp-next-page>
+      <script type="application/json">
+        [
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Page 1",
+            "url": "./articles/article-short.html"
+          },
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Page 2",
+            "url": "./articles/article-with-fixed.html"
+          },
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Page 3",
+            "url": "./articles/article-long.html"
+          },
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Page 4",
+            "url": "./amp-next-page.amp.html"
+          }
+        ]
+      </script>
+      <div amp-next-page-separator>
+        Read more
+      </div>
+      <div more-box>
+          Here are a few more articles ...
+      </div>  
+    </amp-next-page>
+  </body>
+</html>
diff --git a/test/manual/amp-next-page/1.0/amp-next-page.element-visibility.html b/test/manual/amp-next-page/1.0/amp-next-page.element-visibility.html
new file mode 100644
index 0000000000000..88367f4ec1ecd
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/amp-next-page.element-visibility.html
@@ -0,0 +1,311 @@
+<!DOCTYPE html>
+<html ⚡>
+  <head>
+    <meta charset="utf-8" />
+    <title>AMP next page element visibility examples</title>
+    <link rel="canonical" href="amps.html">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet" type="text/css">
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-next-page" src="https://cdn.ampproject.org/v0/amp-next-page-1.0.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+    <script>
+      (self.AMP=self.AMP||[]).push(function(AMP){
+          AMP.toggleExperiment('amp-next-page-v2', true);
+      });
+    </script>    
+    <style amp-custom>
+      .content {
+        padding: 20px;
+      }
+      .hidden, .fixed, .sticky {
+        background-color: #34495e;
+        color: white;
+        font-size: 16px;
+        font-family: Roboto, 'Open Sans', 'Helvetica Neue', sans-serif;
+        padding: 16px;
+        border-radius: 4px;
+        z-index: 1;
+      }
+      .fixed {
+        background-color: #e74c3c;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        box-sizing: border-box;
+      }
+      .sticky {
+        position: sticky;
+        top: 0;
+        left: 0;
+        background-color: #27ae60;
+      }
+    </style>
+</head>
+  <body>
+    <div class="content">
+      <h2>Content discovery</h2>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <div class="hidden" next-page-hide>I should be visible when loaded as a host page but hidden if loaded as a next-page</div>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <div class="sticky" next-page-replace="my-sticky-element">I should get replaced by my sibling from each loaded page (page 0)</div>
+      <div class="fixed" next-page-hide>I am fixed and should be visible when loaded as a host page but hidden if loaded as a next-page (page 0)</div>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+    </div>
+    <amp-next-page>
+      <script type="application/json">
+        [
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Page 1",
+            "url": "./articles/element-visibility-1.html"
+          },
+          {
+            "image": "/examples/img/hero@1x.jpg",
+            "title": "Page 2",
+            "url": "./articles/element-visibility-2.html"
+          }
+        ]
+      </script>
+      <div separator>
+          Read more
+      </div>
+      <div more-box>
+          Here are a few more articles ...
+      </div>  
+    </amp-next-page>
+  </body>
+</html>
diff --git a/test/manual/amp-next-page/1.0/articles/article-long.html b/test/manual/amp-next-page/1.0/articles/article-long.html
new file mode 100644
index 0000000000000..3e8dd8e017eaf
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/articles/article-long.html
@@ -0,0 +1,134 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Article with parallax title</title>
+  <link rel="canonical" href="amps.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-fx-collection" src="https://cdn.ampproject.org/v0/amp-fx-collection-0.1.js"></script>
+  <style amp-custom>
+    .spacer {
+      margin-top: 10px;
+      height: 70vh;
+      width: 100%;
+      background-image: -webkit-linear-gradient(#EEE 50%, white 50%);
+      background-image: linear-gradient(#EEE 50%, white 50%);
+      background-size: 100% 3em;
+    }
+
+    header {
+      position: relative;
+    }
+
+    h1 {
+      margin: 0px 10px;
+    }
+
+    header h1 {
+      position: absolute;
+      top: 20vh;
+      padding: 5px;
+      z-index: 1;
+    }
+
+    header h1 span, .title {
+      background-color: black;
+      color: white;
+      line-height: 1.2em;
+    }
+
+    amp-img img {
+      object-fit: cover;
+    }
+
+    .overlay-top {
+      position: absolute;
+      top: 0;
+    }
+
+    .overlay-container {
+      position: relative;
+      overflow: hidden;
+    }
+
+    main {
+      font-family: Helvetica, sans-serif;
+      padding: 10px;
+      max-width: 412px;
+      margin: auto;
+    }
+
+    a, a:visited, a:active {
+      color: #2196F3;
+      text-decoration: none;
+      display: block;
+      padding: 5px;
+    }
+
+    .overflow-window {
+      overflow: hidden;
+    }
+
+    .overflow-window amp-img {
+      margin-bottom: -80%;
+    }
+  </style>
+</head>
+<body>
+  <main>
+    <h2>Long Article</h2>
+
+    <article>
+        <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+            libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+            varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+            dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+            turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+            tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+            quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+            non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+            condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+            cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+            varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+            at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+        </p>
+
+        <amp-img layout=responsive width=1600 height=900 src="https://picsum.photos/1600/900?image=981"></amp-img>
+
+        <p>
+            Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+            nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+            Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+            ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+            pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+            malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+            felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+            Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+            litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+            pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+            enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+            consectetur enim.
+        </p>
+
+        <amp-img layout=responsive width=1600 height=900 src="https://picsum.photos/1600/900?image=981"></amp-img>
+
+        <p>
+            Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+            ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+            tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+            felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+            in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+            et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+            pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+            Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+            imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+            vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+        </p>
+    </article>
+  </main>
+</body>
+
+</html>
diff --git a/test/manual/amp-next-page/1.0/articles/article-short.html b/test/manual/amp-next-page/1.0/articles/article-short.html
new file mode 100644
index 0000000000000..f0ad01b4ef834
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/articles/article-short.html
@@ -0,0 +1,61 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Article with parallax title</title>
+  <link rel="canonical" href="amps.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-fx-collection" src="https://cdn.ampproject.org/v0/amp-fx-collection-0.1.js"></script>
+  <style amp-custom>
+    header {
+      position: relative;
+    }
+
+    h1 {
+      margin: 0px 10px;
+    }
+
+    header h1 {
+      position: absolute;
+      top: 20vh;
+      padding: 5px;
+      z-index: 1;
+    }
+
+    header h1 span, .title {
+      background-color: black;
+      color: white;
+      line-height: 1.2em;
+    }
+
+    amp-img img {
+      object-fit: cover;
+    }
+  </style>
+</head>
+<body>
+  <main>
+    <h2>Short Article</h2>
+
+    <article>
+        <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+            libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+            varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+            dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+            turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+            tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+            quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+            non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+            condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+            cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+            varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+            at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+        </p>
+    </article>
+  </main>
+</body>
+
+</html>
diff --git a/test/manual/amp-next-page/1.0/articles/article-with-fixed.html b/test/manual/amp-next-page/1.0/articles/article-with-fixed.html
new file mode 100644
index 0000000000000..49c7b89a69148
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/articles/article-with-fixed.html
@@ -0,0 +1,158 @@
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <title>AMP Article with parallax title</title>
+  <link rel="canonical" href="amps.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <script async custom-element="amp-fx-collection" src="https://cdn.ampproject.org/v0/amp-fx-collection-0.1.js"></script>
+  <style amp-custom>
+    .spacer {
+      margin-top: 10px;
+      height: 70vh;
+      width: 100%;
+      background-image: -webkit-linear-gradient(#EEE 50%, white 50%);
+      background-image: linear-gradient(#EEE 50%, white 50%);
+      background-size: 100% 3em;
+    }
+
+    header {
+      position: relative;
+    }
+
+    h1 {
+      margin: 0px 10px;
+    }
+
+    header h1 {
+      position: absolute;
+      top: 20vh;
+      padding: 5px;
+      z-index: 1;
+    }
+
+    header h1 span, .title {
+      background-color: black;
+      color: white;
+      line-height: 1.2em;
+    }
+
+    amp-img img {
+      object-fit: cover;
+    }
+
+    .overlay-top {
+      position: absolute;
+      top: 0;
+    }
+
+    .overlay-container {
+      position: relative;
+      overflow: hidden;
+    }
+
+    main {
+      font-family: Helvetica, sans-serif;
+      padding: 10px;
+      max-width: 412px;
+      margin: auto;
+    }
+
+    a, a:visited, a:active {
+      color: #2196F3;
+      text-decoration: none;
+      display: block;
+      padding: 5px;
+    }
+
+    .overflow-window {
+      overflow: hidden;
+    }
+
+    .overflow-window amp-img {
+      margin-bottom: -80%;
+    }
+
+    .fixed {
+      background-color: rgba(255,0,0, 0.5);
+      color: white;
+      position: fixed;
+      top: 0;
+      left:0;
+    }
+    .sticky {
+      background-color: rgba(0,255,0, 0.5);
+      color: white;
+      position: sticky;
+      top: 0;
+      left:0;
+    }
+    .absolute {
+      background-color: rgba(255,255,0, 0.5);
+      color: white;
+      position: absolute;
+      top: 0;
+      left:0;
+    }
+  </style>
+</head>
+<body>
+  <main>
+    <h2>Long Article</h2>
+
+    <article>
+        <div class="fixed">I am a position fixed element</div>
+        <div class="absolute">I am a position absolute element</div>
+        <div class="sticky">I am a position sticky element</div>
+        <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+            libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+            varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+            dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+            turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+            tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+            quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+            non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+            condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+            cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+            varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+            at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+        </p>
+
+        <amp-img layout=responsive width=1600 height=900 src="https://picsum.photos/1600/900?image=981"></amp-img>
+
+        <p>
+            Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+            nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+            Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+            ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+            pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+            malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+            felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+            Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+            litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+            pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+            enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+            consectetur enim.
+        </p>
+
+        <amp-img layout=responsive width=1600 height=900 src="https://picsum.photos/1600/900?image=981"></amp-img>
+
+        <p>
+            Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+            ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+            tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+            felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+            in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+            et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+            pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+            Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+            imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+            vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+        </p>
+    </article>
+  </main>
+</body>
+</html>
diff --git a/test/manual/amp-next-page/1.0/articles/element-visibility-1.html b/test/manual/amp-next-page/1.0/articles/element-visibility-1.html
new file mode 100644
index 0000000000000..e1bc7ea29a7e1
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/articles/element-visibility-1.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html ⚡>
+  <head>
+    <meta charset="utf-8" />
+    <title>AMP next page element visibility examples</title>
+    <link rel="canonical" href="amps.html">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet" type="text/css">
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+    <style amp-custom>
+        .content {
+            padding: 20px;
+        }
+        .hidden, .fixed, .sticky {
+            background-color: #34495e;
+            color: white;
+            font-size: 16px;
+            font-family: Roboto, 'Open Sans', 'Helvetica Neue', sans-serif;
+            padding: 16px;
+            border-radius: 4px;
+            z-index: 1;
+        }
+        .fixed {
+            background-color: #e74c3c;
+            position: fixed;
+            bottom: 0;
+            left: 0;
+            width: 100%;
+            box-sizing: border-box;
+        }
+        .sticky {
+            position: sticky;
+            top: 0;
+            left: 0;
+            background-color: #27ae60;
+        }
+    </style>  
+</head>
+  <body>
+    <div class="content">
+      <h2>Content discovery</h2>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <div class="hidden" next-page-hide>I should be visible when loaded as a host page but hidden if loaded as a next-page</div>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <div class="sticky" next-page-replace="my-sticky-element">I got replaced by my sibling from page 1</div>
+      <div class="fixed" next-page-hide>I am fixed and should be visible when loaded as a host page but hidden if loaded as a next-page (page 1)</div>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+    </div>
+  </body>
+</html>
diff --git a/test/manual/amp-next-page/1.0/articles/element-visibility-2.html b/test/manual/amp-next-page/1.0/articles/element-visibility-2.html
new file mode 100644
index 0000000000000..e9180fa9b83d1
--- /dev/null
+++ b/test/manual/amp-next-page/1.0/articles/element-visibility-2.html
@@ -0,0 +1,283 @@
+<!DOCTYPE html>
+<html ⚡>
+  <head>
+    <meta charset="utf-8" />
+    <title>AMP next page element visibility examples</title>
+    <link rel="canonical" href="amps.html">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
+    <link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet" type="text/css">
+    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
+    <style amp-custom>
+        .content {
+            padding: 20px;
+        }
+        .hidden, .fixed, .sticky {
+            background-color: #34495e;
+            color: white;
+            font-size: 16px;
+            font-family: Roboto, 'Open Sans', 'Helvetica Neue', sans-serif;
+            padding: 16px;
+            border-radius: 4px;
+            z-index: 1;
+        }
+        .fixed {
+            background-color: #e74c3c;
+            position: fixed;
+            bottom: 0;
+            left: 0;
+            width: 100%;
+            box-sizing: border-box;
+        }
+        .sticky {
+            position: sticky;
+            top: 0;
+            left: 0;
+            background-color: #27ae60;
+        }
+    </style>
+</head>
+  <body>
+    <div class="content">
+      <h2>Content discovery</h2>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <div class="hidden" next-page-hide>I should be visible when loaded as a host page but hidden if loaded as a next-page</div>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <div class="sticky" next-page-replace="my-sticky-element">I got replaced by my sibling from page 2</div>
+      <div class="fixed" next-page-hide>I am fixed and should be visible when loaded as a host page but hidden if loaded as a next-page (page 2)</div>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Vestibulum a nisi est. Fusce consequat iaculis vehicula. Aliquam luctus
+        nunc risus, ut congue augue tristique nec. In venenatis aliquam tristique.
+        Integer eleifend diam vel nunc porttitor sollicitudin. Aliquam quis
+        ullamcorper tortor. Morbi et dui vitae elit finibus sodales. Donec
+        pharetra tincidunt neque, eget sagittis nisi sodales vel. Duis elit massa,
+        malesuada a rhoncus sed, bibendum nec velit. Duis iaculis magna suscipit
+        felis fermentum accumsan. Nunc venenatis pellentesque magna at tincidunt.
+        Mauris nec placerat augue, eu auctor elit. Class aptent taciti sociosqu ad
+        litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum
+        pretium ligula diam, a eleifend lectus porttitor non. Integer vitae tempus
+        enim, non pellentesque sem. Nam non sem lacinia, lacinia nisi non,
+        consectetur enim.
+      </p>
+      <p>
+        Maecenas sed quam nec dolor rhoncus rutrum ut non mauris. Pellentesque
+        ante dolor, pretium quis enim eu, condimentum volutpat augue. Donec nulla
+        nisl, ullamcorper et hendrerit vel, sagittis sit amet ex. Mauris a enim in
+        sem feugiat mollis in eu lorem. Quisque finibus a diam ut facilisis. Sed
+        ultricies massa ut urna dapibus semper. Integer id nunc dictum, luctus
+        ligula eu, bibendum ex. Etiam tincidunt sapien ut lorem pharetra feugiat.
+        Aliquam erat volutpat. Sed vehicula tincidunt mauris, vitae cursus nisl.
+        Nulla imperdiet ex at venenatis dignissim.
+      </p>
+      <p>
+        Sed pretium sed ex eu varius. Praesent sapien purus, tincidunt at dolor
+        ac, porttitor fermentum enim. Morbi rhoncus quam eu lorem ultrices, vitae
+        tempor felis volutpat. Suspendisse auctor, quam quis suscipit dictum,
+        felis lectus imperdiet velit, a faucibus quam diam et risus. Etiam varius
+        in arcu sed cursus. Praesent pulvinar enim nibh, eu euismod ante pretium
+        et. Pellentesque nec vestibulum eros. Praesent nec venenatis ipsum. Duis
+        pharetra suscipit mauris quis dictum. Pellentesque sed porttitor tellus.
+        Aenean rutrum blandit est in tincidunt. Nulla ante orci, pellentesque id
+        imperdiet at, posuere quis dui. Cras fringilla lobortis lectus. Mauris
+        vitae convallis orci. Mauris sodales faucibus nulla vitae posuere.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean vitae
+        libero porta nulla iaculis viverra. Vestibulum consectetur scelerisque
+        varius. Nam pulvinar dui a tortor hendrerit, id iaculis elit auctor. Nam
+        dapibus felis in gravida ornare. Nulla varius id mauris sed venenatis. Sed
+        turpis ex, aliquet nec fermentum eget, sollicitudin non est. Suspendisse
+        tincidunt ornare tortor, at vehicula orci aliquam a. Aliquam eleifend odio
+        quis quam dignissim posuere. Proin ac dolor rhoncus, consectetur ipsum
+        non, dictum est. Nam sollicitudin est eu est aliquet eleifend. Duis
+        condimentum, nisl eu finibus auctor, lectus odio fringilla nisi, quis
+        cursus libero magna imperdiet purus. In condimentum vehicula est, nec
+        varius est suscipit vitae. Maecenas ut sapien diam. Vivamus viverra nisl
+        at quam pellentesque posuere. Cras ut nibh non arcu dignissim elementum.
+      </p>
+      <p>
+        Donec vehicula nisi eget metus blandit, at semper nunc porttitor.
+        Vestibulum sit amet posuere risus, at mattis nibh. Maecenas ultricies
+        scelerisque nibh et feugiat. Praesent mattis, nibh viverra consequat
+        rhoncus, turpis leo venenatis orci, vitae mollis libero magna eget massa.
+        In dapibus, metus sit amet venenatis finibus, lacus metus rhoncus massa,
+        sit amet mattis tortor massa vitae nunc. Mauris a enim sagittis,
+        condimentum tortor vitae, egestas nulla. Ut dictum laoreet sapien non
+        blandit. Etiam fermentum, magna et tincidunt maximus, ex orci sollicitudin
+        felis, ut dapibus orci ipsum quis leo. Nam accumsan tortor sit amet orci
+        gravida, eget dapibus metus dapibus. Fusce congue ultrices dignissim. Duis
+        quis metus in mi pharetra tempus. Etiam dapibus tellus vitae blandit
+        rhoncus. Fusce commodo risus id sapien ultrices vehicula.
+      </p>
+    </div>
+  </body>
+</html>
diff --git a/test/manual/analytics-batching.amp.html b/test/manual/analytics-batching.amp.html
index 9d2f86572b01c..6ff10e846e0e6 100644
--- a/test/manual/analytics-batching.amp.html
+++ b/test/manual/analytics-batching.amp.html
@@ -78,9 +78,9 @@
       }
     },
     "transport": {
-      "beacon": "false",
-      "xhrpost": "false",
-      "image": "true"
+      "beacon": false,
+      "xhrpost": false,
+      "image": true
     }
   }
   </script>
diff --git a/test/unit/3p/test-3p-frame.js b/test/unit/3p/test-3p-frame.js
index 926d149ba3fc8..27615c0644da8 100644
--- a/test/unit/3p/test-3p-frame.js
+++ b/test/unit/3p/test-3p-frame.js
@@ -32,7 +32,6 @@ import {
   serializeMessage,
 } from '../../../src/3p-frame-messaging';
 import {dev} from '../../../src/log';
-import {preconnectForElement} from '../../../src/preconnect';
 import {toggleExperiment} from '../../../src/experiments';
 
 describe
@@ -47,7 +46,7 @@ describe
       clock = window.sandbox.useFakeTimers();
       container = document.createElement('div');
       document.body.appendChild(container);
-      preconnect = preconnectForElement(container);
+      preconnect = Services.preconnectFor(window);
     });
 
     afterEach(() => {
@@ -410,39 +409,37 @@ describe
 
     it('should prefetch bootstrap frame and JS', () => {
       window.__AMP_MODE = {localDev: true};
-      preloadBootstrap(window, preconnect);
+      const ampdoc = Services.ampdoc(window.document);
+      preloadBootstrap(window, ampdoc, preconnect);
       // Wait for visible promise.
-      return Services.ampdoc(window.document)
-        .whenFirstVisible()
-        .then(() => {
-          const fetches = document.querySelectorAll('link[rel=preload]');
-          expect(fetches).to.have.length(2);
-          expect(fetches[0]).to.have.property(
-            'href',
-            'http://ads.localhost:9876/dist.3p/current/frame.max.html'
-          );
-          expect(fetches[1]).to.have.property(
-            'href',
-            'http://ads.localhost:9876/dist.3p/current/integration.js'
-          );
-        });
+      return ampdoc.whenFirstVisible().then(() => {
+        const fetches = document.querySelectorAll('link[rel=preload]');
+        expect(fetches).to.have.length(2);
+        expect(fetches[0]).to.have.property(
+          'href',
+          'http://ads.localhost:9876/dist.3p/current/frame.max.html'
+        );
+        expect(fetches[1]).to.have.property(
+          'href',
+          'http://ads.localhost:9876/dist.3p/current/integration.js'
+        );
+      });
     });
 
     it('should prefetch default bootstrap frame if custom disabled', () => {
       window.__AMP_MODE = {localDev: true};
       addCustomBootstrap('http://localhost:9876/boot/remote.html');
-      preloadBootstrap(window, preconnect, true);
+      const ampdoc = Services.ampdoc(window.document);
+      preloadBootstrap(window, ampdoc, preconnect, true);
       // Wait for visible promise.
-      return Services.ampdoc(window.document)
-        .whenFirstVisible()
-        .then(() => {
-          expect(
-            document.querySelectorAll(
-              'link[rel=preload]' +
-                '[href="http://ads.localhost:9876/dist.3p/current/frame.max.html"]'
-            )
-          ).to.be.ok;
-        });
+      return ampdoc.whenFirstVisible().then(() => {
+        expect(
+          document.querySelectorAll(
+            'link[rel=preload]' +
+              '[href="http://ads.localhost:9876/dist.3p/current/frame.max.html"]'
+          )
+        ).to.be.ok;
+      });
     });
 
     it('should make sub domains (unique)', () => {
diff --git a/test/unit/ads/test-ssp.js b/test/unit/ads/test-ssp.js
new file mode 100644
index 0000000000000..45ce343c7cfb5
--- /dev/null
+++ b/test/unit/ads/test-ssp.js
@@ -0,0 +1,202 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import * as _3p from '../../../3p/3p';
+import {createIframePromise} from '../../../testing/iframe';
+import {ssp} from '../../../ads/ssp';
+
+describes.fakeWin('amp-ad-ssp', {}, () => {
+  let sandbox;
+  let win;
+  let commonData;
+  const noop = () => {};
+
+  /**
+   * Set up our test environment.
+   */
+  beforeEach(() => {
+    sandbox = window.sandbox;
+
+    commonData = {
+      width: '200',
+      height: '200',
+      zoneid: '1',
+      id: 'test-1',
+    };
+
+    // 3p library stubs
+    sandbox.stub(_3p, 'validateData').callsFake(noop);
+    sandbox.stub(_3p, 'computeInMasterFrame').callsFake(noop);
+    sandbox.stub(_3p, 'loadScript').callsFake(noop);
+
+    return createIframePromise(true).then(iframe => {
+      // Simulate the iframe that ssp will be called inside.
+      win = iframe.win;
+      win.context = {
+        renderStart: sandbox.spy(),
+        noContentAvailable: sandbox.spy(),
+        canonicalUrl: 'https://test.com',
+      };
+      const div = win.document.createElement('div');
+      div.id = 'c';
+      win.document.body.appendChild(div);
+    });
+  });
+
+  /**
+   * Tear down the test enviroment.
+   */
+  afterEach(() => {
+    // Reset window properties.
+    win.context = {};
+    sandbox.restore();
+  });
+
+  it('should add root div', () => {
+    ssp(win, commonData);
+
+    const rootElement = win.document.getElementById('test-1');
+
+    expect(rootElement).to.not.be.null;
+  });
+
+  it('should call validateData()', () => {
+    ssp(win, commonData);
+
+    expect(_3p.validateData).to.have.been.calledOnce;
+    expect(_3p.validateData).to.have.been.calledWith(
+      {height: '200', id: 'test-1', width: '200', zoneid: '1'},
+      ['id', 'width', 'height', 'zoneid'],
+      ['site']
+    );
+  });
+
+  it('should call computeInMasterFrame()', () => {
+    ssp(win, commonData);
+
+    expect(_3p.computeInMasterFrame).to.have.been.calledOnce;
+    expect(_3p.computeInMasterFrame).to.have.been.calledWith(win, 'ssp-load');
+  });
+
+  it('should call loadScript()', () => {
+    _3p.computeInMasterFrame.restore();
+
+    sandbox
+      .stub(_3p, 'computeInMasterFrame')
+      .callsFake((global, id, work) => work());
+
+    ssp(win, commonData);
+
+    expect(_3p.loadScript).to.have.been.calledOnce;
+    expect(_3p.loadScript).to.have.been.calledWith(
+      win,
+      'https://ssp.imedia.cz/static/js/ssp.js'
+    );
+  });
+
+  it('should call finish work with null', () => {
+    _3p.computeInMasterFrame.restore();
+    _3p.loadScript.restore();
+
+    const callbackSpy = sandbox.spy();
+
+    sandbox.stub(_3p, 'loadScript').callsFake((window, url, cb) => cb());
+    sandbox
+      .stub(_3p, 'computeInMasterFrame')
+      .callsFake((global, id, work) => work(callbackSpy));
+
+    ssp(win, commonData);
+
+    expect(callbackSpy).to.have.been.calledOnce;
+    expect(callbackSpy).to.have.been.calledWith(null);
+  });
+
+  it('should call ssp.config()', () => {
+    _3p.computeInMasterFrame.restore();
+    _3p.loadScript.restore();
+
+    const callbackSpy = sandbox.spy();
+
+    const sssp = {
+      config: sandbox.spy(),
+      getAds: sandbox.spy(),
+    };
+
+    sandbox.stub(_3p, 'loadScript').callsFake((window, url, cb) => {
+      // Mock script adding global object
+      window.sssp = sssp;
+
+      cb();
+    });
+    sandbox
+      .stub(_3p, 'computeInMasterFrame')
+      .callsFake((global, id, work) => work(callbackSpy));
+
+    ssp(win, commonData);
+
+    expect(callbackSpy).to.have.not.been.called;
+    expect(sssp.config).to.have.been.calledOnce;
+    expect(sssp.config).to.have.been.calledWith({site: 'https://test.com'});
+    expect(sssp.getAds).to.have.been.calledOnce;
+    expect(sssp.getAds).to.have.been.calledWith({
+      height: '200',
+      id: 'test-1',
+      width: '200',
+      zoneId: '1',
+    });
+  });
+
+  it('should call context.noContentAvailable()', () => {
+    _3p.computeInMasterFrame.restore();
+
+    sandbox
+      .stub(_3p, 'computeInMasterFrame')
+      .callsFake((global, id, work, cb) => cb(null));
+
+    ssp(win, commonData);
+
+    expect(win.context.renderStart).to.not.have.been.called;
+    expect(win.context.noContentAvailable).to.have.been.calledOnce;
+    expect(win.context.noContentAvailable).to.have.been.calledWith();
+  });
+
+  it('should call context.noContentAvailable() in case of invalid zone', () => {
+    _3p.computeInMasterFrame.restore();
+
+    sandbox
+      .stub(_3p, 'computeInMasterFrame')
+      .callsFake((global, id, work, cb) => cb([{type: 'error'}]));
+
+    ssp(win, commonData);
+
+    expect(win.context.renderStart).to.not.have.been.called;
+    expect(win.context.noContentAvailable).to.have.been.calledOnce;
+    expect(win.context.noContentAvailable).to.have.been.calledWith();
+  });
+
+  it('should call context.renderStart()', () => {
+    _3p.computeInMasterFrame.restore();
+
+    sandbox
+      .stub(_3p, 'computeInMasterFrame')
+      .callsFake((global, id, work, cb) => cb([{type: 'iframe'}]));
+
+    ssp(win, commonData);
+
+    expect(win.context.renderStart).to.have.been.calledOnce;
+    expect(win.context.renderStart).to.have.been.calledWith();
+  });
+});
diff --git a/test/unit/inabox/test-inabox-viewport.js b/test/unit/inabox/test-inabox-viewport.js
index a6f501c4ebf34..53bbb6d85238a 100644
--- a/test/unit/inabox/test-inabox-viewport.js
+++ b/test/unit/inabox/test-inabox-viewport.js
@@ -27,6 +27,7 @@ import {
 import {installIframeMessagingClient} from '../../../src/inabox/inabox-iframe-messaging-client';
 import {installPlatformService} from '../../../src/service/platform-impl';
 import {layoutRectLtwh} from '../../../src/layout-rect';
+import {toggleExperiment} from '../../../src/experiments';
 
 const NOOP = () => {};
 
@@ -91,10 +92,12 @@ describes.fakeWin('inabox-viewport', {amp: {}}, env => {
     };
     win.frameElement = iframeElement;
 
+    toggleExperiment(win, 'inabox-viewport-friendly', false);
     installIframeMessagingClient(win);
     installPlatformService(win);
     binding = new ViewportBindingInabox(win);
     env.sandbox./*OK*/ stub(iframeHelper, 'canInspectWindow').returns(true);
+    toggleExperiment(win, 'inabox-viewport-friendly', true);
     bindingFriendly = new ViewportBindingInabox(win);
     measureSpy = env.sandbox.spy();
     element = {
diff --git a/test/unit/test-3p.js b/test/unit/test-3p.js
index e4fd3f56c1158..f2a6f69cd1cd4 100644
--- a/test/unit/test-3p.js
+++ b/test/unit/test-3p.js
@@ -126,6 +126,17 @@ describe('3p', () => {
       });
     });
 
+    it('should allow mandatory fields to have 0 as a value', () => {
+      validateData(
+        {
+          width: 0,
+          height: 0,
+          type: 'cats',
+        },
+        ['height', 'width']
+      );
+    });
+
     it('should check mandatory fields with alternative options', () => {
       validateData(
         {
diff --git a/test/unit/test-activity.js b/test/unit/test-activity.js
index 1018ecec68778..50a9aee5687ed 100644
--- a/test/unit/test-activity.js
+++ b/test/unit/test-activity.js
@@ -35,6 +35,7 @@ describe('Activity getTotalEngagedTime', () => {
   let whenFirstVisibleResolve;
   let visibilityObservable;
   let mousedownObservable;
+  let mouseleaveObservable;
   let scrollObservable;
 
   beforeEach(() => {
@@ -45,6 +46,7 @@ describe('Activity getTotalEngagedTime', () => {
 
     visibilityObservable = new Observable();
     mousedownObservable = new Observable();
+    mouseleaveObservable = new Observable();
     scrollObservable = new Observable();
 
     fakeDoc = {
@@ -52,6 +54,8 @@ describe('Activity getTotalEngagedTime', () => {
       addEventListener(eventName, callback) {
         if (eventName === 'mousedown') {
           mousedownObservable.add(callback);
+        } else if (eventName === 'mouseleave') {
+          mouseleaveObservable.add(callback);
         }
       },
       documentElement: {
@@ -176,15 +180,23 @@ describe('Activity getTotalEngagedTime', () => {
       .stub(ampdoc, 'isVisible')
       .returns(true);
     whenFirstVisibleResolve();
-    return ampdoc.whenFirstVisible().then(() => {
-      clock.tick(3000);
-      mousedownObservable.fire();
-      clock.tick(1000);
-      isVisibleStub.returns(false);
-      visibilityObservable.fire();
-      clock.tick(10000);
-      return expect(activity.getTotalEngagedTime()).to.equal(4);
-    });
+    return ampdoc
+      .whenFirstVisible()
+      .then(() => {
+        clock.tick(3000);
+        mousedownObservable.fire();
+        clock.tick(1000);
+        isVisibleStub.returns(false);
+        visibilityObservable.fire();
+        clock.tick(10000);
+        return expect(activity.getTotalEngagedTime()).to.equal(4);
+      })
+      .then(() => {
+        mousedownObservable.fire();
+        mouseleaveObservable.fire();
+        clock.tick(2000);
+        return expect(activity.getTotalEngagedTime()).to.equal(4);
+      });
   });
 
   it('should accumulate engaged time over multiple activities', () => {
@@ -203,7 +215,7 @@ describe('Activity getTotalEngagedTime', () => {
 
   it(
     'should set event listeners on the document for' +
-      ' "mousedown", "mouseup", "mousemove", "keyup", "keydown"',
+      ' "mousedown", "mouseup", "mousemove", "keyup", "keydown", "mouseleave"',
     () => {
       const addEventListenerSpy = window.sandbox.spy(
         fakeDoc,
@@ -229,6 +241,10 @@ describe('Activity getTotalEngagedTime', () => {
         'keyup',
         activity.boundHandleActivity_
       );
+      expect(addEventListenerSpy).to.not.have.been.calledWith(
+        'mouseleave',
+        activity.boundHandleActivity_
+      );
       whenFirstVisibleResolve();
       return ampdoc.whenFirstVisible().then(() => {
         expect(addEventListenerSpy.getCall(0).args[0]).to.equal('mousedown');
@@ -236,6 +252,7 @@ describe('Activity getTotalEngagedTime', () => {
         expect(addEventListenerSpy.getCall(2).args[0]).to.equal('mousemove');
         expect(addEventListenerSpy.getCall(3).args[0]).to.equal('keydown');
         expect(addEventListenerSpy.getCall(4).args[0]).to.equal('keyup');
+        expect(addEventListenerSpy.getCall(5).args[0]).to.equal('mouseleave');
       });
     }
   );
diff --git a/test/unit/test-amp-img.js b/test/unit/test-amp-img.js
index a66fb7b0dd2b2..b89fd87f66979 100644
--- a/test/unit/test-amp-img.js
+++ b/test/unit/test-amp-img.js
@@ -23,7 +23,8 @@ import {createCustomEvent} from '../../src/event-helper';
 import {createIframePromise} from '../../testing/iframe';
 import {toggleExperiment} from '../../src/experiments';
 
-describe('amp-img', () => {
+describes.sandboxed('amp-img', {}, env => {
+  let sandbox;
   let screenWidth;
   let windowWidth;
   let fixture;
@@ -32,10 +33,12 @@ describe('amp-img', () => {
                         /examples/img/hero@2x.jpg 1282w`;
 
   beforeEach(() => {
+    sandbox = env.sandbox;
+
     screenWidth = 320;
     windowWidth = 320;
-    window.sandbox.stub(BaseElement.prototype, 'isInViewport').returns(true);
-    window.sandbox.stub(BaseElement.prototype, 'getViewport').callsFake(() => {
+    sandbox.stub(BaseElement.prototype, 'isInViewport').returns(true);
+    sandbox.stub(BaseElement.prototype, 'getViewport').callsFake(() => {
       return {
         getWidth: () => windowWidth,
       };
@@ -103,17 +106,21 @@ describe('amp-img', () => {
   });
 
   it('should preconnect the src url', () => {
+    const preconnect = {url: sandbox.stub()};
+    sandbox.stub(Services, 'preconnectFor').returns(preconnect);
+
     return getImg({
       src: '/examples/img/sample.jpg',
       width: 300,
       height: 200,
     }).then(ampImg => {
       const impl = ampImg.implementation_;
-      window.sandbox.stub(impl.preconnect, 'url');
       impl.preconnectCallback(true);
-      const preconnecturl = impl.preconnect.url;
-      expect(preconnecturl.called).to.be.true;
-      expect(preconnecturl).to.have.been.calledWith('/examples/img/sample.jpg');
+      expect(preconnect.url).to.be.called;
+      expect(preconnect.url).to.have.been.calledWith(
+        sandbox.match.object,
+        '/examples/img/sample.jpg'
+      );
     });
   });
 
@@ -133,16 +140,19 @@ describe('amp-img', () => {
   });
 
   it('should preconnect to the the first srcset url if src is not set', () => {
+    const preconnect = {url: sandbox.stub()};
+    sandbox.stub(Services, 'preconnectFor').returns(preconnect);
+
     return getImg({
       srcset: SRCSET_STRING,
       width: 300,
       height: 200,
     }).then(ampImg => {
       const impl = ampImg.implementation_;
-      window.sandbox.stub(impl.preconnect, 'url');
       impl.preconnectCallback(true);
-      expect(impl.preconnect.url.called).to.be.true;
-      expect(impl.preconnect.url).to.have.been.calledWith(
+      expect(preconnect.url).to.be.called;
+      expect(preconnect.url).to.have.been.calledWith(
+        sandbox.match.object,
         '/examples/img/hero@1x.jpg'
       );
     });
@@ -183,6 +193,18 @@ describe('amp-img', () => {
     });
   });
 
+  it('should propagate data attributes', () => {
+    return getImg({
+      src: '/examples/img/sample.jpg',
+      width: 320,
+      height: 240,
+      'data-foo': 'abc',
+    }).then(ampImg => {
+      const img = ampImg.querySelector('img');
+      expect(img.getAttribute('data-foo')).to.equal('abc');
+    });
+  });
+
   describe('#fallback on initial load', () => {
     let el;
     let impl;
@@ -197,16 +219,16 @@ describe('amp-img', () => {
       el.setAttribute('width', 100);
       el.setAttribute('height', 100);
       el.getResources = () => Services.resourcesForDoc(document);
-      el.getPlaceholder = window.sandbox.stub();
+      el.getPlaceholder = sandbox.stub();
+      el.getLayoutWidth = () => 100;
       impl = new AmpImg(el);
       impl.createdCallback();
-      window.sandbox.stub(impl, 'getLayoutWidth').returns(100);
       el.toggleFallback = function() {};
       el.togglePlaceholder = function() {};
-      toggleFallbackSpy = window.sandbox.spy(el, 'toggleFallback');
-      togglePlaceholderSpy = window.sandbox.spy(el, 'togglePlaceholder');
-      errorSpy = window.sandbox.spy(impl, 'onImgLoadingError_');
-      toggleSpy = window.sandbox.spy(impl, 'toggleFallback');
+      toggleFallbackSpy = sandbox.spy(el, 'toggleFallback');
+      togglePlaceholderSpy = sandbox.spy(el, 'togglePlaceholder');
+      errorSpy = sandbox.spy(impl, 'onImgLoadingError_');
+      toggleSpy = sandbox.spy(impl, 'toggleFallback');
 
       impl.getVsync = function() {
         return {
@@ -354,8 +376,9 @@ describe('amp-img', () => {
     el.setAttribute('aria-label', 'Hello');
     el.setAttribute('aria-labelledby', 'id2');
     el.setAttribute('aria-describedby', 'id3');
+    el.getLayoutWidth = () => -1;
 
-    el.getPlaceholder = window.sandbox.stub();
+    el.getPlaceholder = sandbox.stub();
     const impl = new AmpImg(el);
     impl.getAmpDoc = function() {
       return window.AMP.ampdoc;
@@ -449,16 +472,16 @@ describe('amp-img', () => {
         img.setAttribute('placeholder', '');
         el.getPlaceholder = () => img;
       } else {
-        el.getPlaceholder = window.sandbox.stub();
+        el.getPlaceholder = sandbox.stub();
       }
       if (addBlurClass) {
         img.classList.add('i-amphtml-blurry-placeholder');
       }
+      el.getLayoutWidth = () => 200;
       el.appendChild(img);
       el.getResources = () => Services.resourcesForDoc(document);
       const impl = new AmpImg(el);
-      window.sandbox.stub(impl, 'getLayoutWidth').returns(200);
-      impl.togglePlaceholder = window.sandbox.stub();
+      impl.togglePlaceholder = sandbox.stub();
       return impl;
     }
 
@@ -507,11 +530,11 @@ describe('amp-img', () => {
         el.setAttribute(key, attributes[key]);
       }
       el.getResources = () => Services.resourcesForDoc(document);
-      el.getPlaceholder = window.sandbox.stub();
+      el.getPlaceholder = sandbox.stub();
+      el.getLayoutWidth = () => layoutWidth;
       const impl = new AmpImg(el);
       impl.createdCallback();
-      window.sandbox.stub(impl, 'getLayoutWidth').returns(layoutWidth);
-      window.sandbox.stub(impl, 'getLayout').returns(attributes['layout']);
+      sandbox.stub(impl, 'getLayout').returns(attributes['layout']);
       el.toggleFallback = function() {};
       el.togglePlaceholder = function() {};
 
diff --git a/test/unit/test-base-element.js b/test/unit/test-base-element.js
index b7500a194d533..7f44e08d61b4c 100644
--- a/test/unit/test-base-element.js
+++ b/test/unit/test-base-element.js
@@ -81,6 +81,18 @@ describes.realWin('BaseElement', {amp: true}, env => {
     expect(target.getAttribute('data-test3')).to.equal('123');
   });
 
+  it('propagateDataset', () => {
+    const target = doc.createElement('div');
+    target.dataset.foo = 'abc';
+
+    element.propagateDataset(target);
+    expect(target.hasAttribute('data-foo')).to.be.false;
+
+    customElement.dataset.bar = '123';
+    element.propagateDataset(target);
+    expect(target.hasAttribute('data-bar', '123')).to.be.true;
+  });
+
   it('should register action', () => {
     const handler = () => {};
     element.registerAction('method1', handler);
diff --git a/test/unit/test-batched-json.js b/test/unit/test-batched-json.js
index 58dd9ecc6bab7..948cb42ef61b9 100644
--- a/test/unit/test-batched-json.js
+++ b/test/unit/test-batched-json.js
@@ -24,6 +24,7 @@ describe('batchFetchJsonFor', () => {
   // Service fakes.
   let urlReplacements;
   let batchedXhr;
+  let xhr;
   // Function stubs.
   let fetchJson;
   // Mutable return variables.
@@ -54,6 +55,10 @@ describe('batchFetchJsonFor', () => {
         json: () => Promise.resolve(data),
       })
     );
+
+    xhr = {xssiJson: () => Promise.resolve(data)};
+    window.sandbox.stub(Services, 'xhrFor').returns(xhr);
+
     batchedXhr = {fetchJson};
     window.sandbox.stub(Services, 'batchedXhrFor').returns(batchedXhr);
   });
diff --git a/test/unit/test-chunk.js b/test/unit/test-chunk.js
index 19ab5fb61191e..777f77d8484ed 100644
--- a/test/unit/test-chunk.js
+++ b/test/unit/test-chunk.js
@@ -23,7 +23,6 @@ import {
   startupChunk,
 } from '../../src/chunk';
 import {installDocService} from '../../src/service/ampdoc-impl';
-import {toggleExperiment} from '../../src/experiments';
 
 describe('chunk2', () => {
   beforeEach(() => {
@@ -394,7 +393,6 @@ describe('long tasks', () => {
         subscriptions = {};
         clock = env.sandbox.useFakeTimers();
         installDocService(env.win, /* isSingleDoc */ true);
-        toggleExperiment(env.win, 'macro-after-long-task', true);
 
         env.win.addEventListener = function(type, handler) {
           if (subscriptions[type] && !subscriptions[type].includes(handler)) {
diff --git a/test/unit/test-custom-element.js b/test/unit/test-custom-element.js
index 5ada454a0f0e3..93751d93a1c62 100644
--- a/test/unit/test-custom-element.js
+++ b/test/unit/test-custom-element.js
@@ -329,12 +329,10 @@ describes.realWin('CustomElement', {amp: true}, env => {
       it('Element - updateLayoutBox', () => {
         const element = new ElementClass();
         container.appendChild(element);
-        expect(element.layoutWidth_).to.equal(-1);
-        expect(element.implementation_.layoutWidth_).to.equal(-1);
+        expect(element.getLayoutWidth()).to.equal(-1);
 
         element.updateLayoutBox({top: 0, left: 0, width: 111, height: 51});
-        expect(element.layoutWidth_).to.equal(111);
-        expect(element.implementation_.layoutWidth_).to.equal(111);
+        expect(element.getLayoutWidth()).to.equal(111);
       });
 
       it('should tolerate errors in onLayoutMeasure', () => {
@@ -352,8 +350,7 @@ describes.realWin('CustomElement', {amp: true}, env => {
         return element.buildingPromise_.then(() => {
           allowConsoleError(() => {
             element.updateLayoutBox({top: 0, left: 0, width: 111, height: 51});
-            expect(element.layoutWidth_).to.equal(111);
-            expect(element.implementation_.layoutWidth_).to.equal(111);
+            expect(element.getLayoutWidth()).to.equal(111);
             expect(errorStub).to.be.calledWith(AmpEvents.ERROR, 'intentional');
           });
         });
@@ -374,8 +371,7 @@ describes.realWin('CustomElement', {amp: true}, env => {
               {top: 0, left: 0, width: 111, height: 51},
               /* opt_hasMeasurementsChanged */ false
             );
-            expect(element.layoutWidth_).to.equal(111);
-            expect(element.implementation_.layoutWidth_).to.equal(111);
+            expect(element.getLayoutWidth()).to.equal(111);
             expect(onMeasureChangeStub).to.have.not.been.called;
           });
         }
@@ -396,8 +392,7 @@ describes.realWin('CustomElement', {amp: true}, env => {
               {top: 0, left: 0, width: 111, height: 51},
               /* opt_hasMeasurementsChanged */ true
             );
-            expect(element.layoutWidth_).to.equal(111);
-            expect(element.implementation_.layoutWidth_).to.equal(111);
+            expect(element.getLayoutWidth()).to.equal(111);
             expect(onMeasureChangeStub).to.have.been.called;
           });
         }
@@ -421,7 +416,6 @@ describes.realWin('CustomElement', {amp: true}, env => {
         expect(element.isUpgraded()).to.equal(true);
         expect(element.implementation_).to.be.instanceOf(TestElement);
         expect(element.implementation_.layout_).to.equal(Layout.FILL);
-        expect(element.implementation_.layoutWidth_).to.equal(111);
         expect(testElementCreatedCallback).to.be.calledOnce;
         expect(testElementFirstAttachedCallback).to.be.calledOnce;
         expect(element.isBuilt()).to.equal(false);
@@ -2189,8 +2183,8 @@ describes.realWin('CustomElement Overflow Element', {amp: true}, env => {
   let element;
   let overflowElement;
   let vsync;
-  let resources;
-  let resourcesMock;
+  let mutator;
+  let mutatorMock;
 
   class TestElement extends BaseElement {
     isLayoutSupported(unusedLayout) {
@@ -2207,12 +2201,13 @@ describes.realWin('CustomElement Overflow Element', {amp: true}, env => {
       TestElement
     );
     win.customElements.define('amp-test-overflow', ElementClass);
-    resources = Services.resourcesForDoc(doc);
-    resourcesMock = env.sandbox.mock(resources);
+    mutator = Services.mutatorForDoc(doc);
+    mutatorMock = env.sandbox.mock(mutator);
     element = new ElementClass();
+    element.ampdoc_ = doc;
     element.layoutWidth_ = 300;
     element.layout_ = Layout.FIXED;
-    element.resources_ = resources;
+    element.mutator_ = mutator;
     overflowElement = doc.createElement('div');
     overflowElement.setAttribute('overflow', '');
     element.appendChild(overflowElement);
@@ -2228,7 +2223,7 @@ describes.realWin('CustomElement Overflow Element', {amp: true}, env => {
   });
 
   afterEach(() => {
-    resourcesMock.verify();
+    mutatorMock.verify();
   });
 
   it('should NOT be initialized by default', () => {
@@ -2284,7 +2279,7 @@ describes.realWin('CustomElement Overflow Element', {amp: true}, env => {
   it('should force change size when clicked', () => {
     element.overflowCallback(true, 117, 113);
     expect(overflowElement).to.have.class('amp-visible');
-    resourcesMock
+    mutatorMock
       .expects('changeSize')
       .withExactArgs(element, 117, 113)
       .once();
diff --git a/test/unit/test-error.js b/test/unit/test-error.js
index c66c05def162c..fd929f5ba0004 100644
--- a/test/unit/test-error.js
+++ b/test/unit/test-error.js
@@ -460,7 +460,7 @@ describe('getErrorReportData', () => {
 
   it('reportError marks binary type', () => {
     window.AMP_CONFIG = {
-      type: 'canary',
+      type: 'experimental',
     };
     const e = new Error('XYZ');
     const data = getErrorReportData(
@@ -471,7 +471,7 @@ describe('getErrorReportData', () => {
       e
     );
     expect(data.m).to.equal('XYZ');
-    expect(data['bt']).to.equal('canary');
+    expect(data['bt']).to.equal('experimental');
 
     window.AMP_CONFIG = {
       type: 'control',
diff --git a/test/unit/test-experiments.js b/test/unit/test-experiments.js
index a759bb6eea43a..5217e7bd1f329 100644
--- a/test/unit/test-experiments.js
+++ b/test/unit/test-experiments.js
@@ -29,7 +29,7 @@ import {
 import {createElementWithAttributes} from '../../src/dom';
 
 function fakeLocalStorage(initial = {}) {
-  const state = Object.assign({}, initial);
+  const state = {...initial};
   return {
     getItem: key => (key in state ? state[key] : null),
     setItem: (key, value) => (state[key] = value),
@@ -121,6 +121,7 @@ describe('isExperimentOn', () => {
   function expectExperiment(storedString, experimentId) {
     resetExperimentTogglesForTesting(win);
     win.localStorage.setItem('amp-experiment-toggles', storedString);
+    // eslint-disable-next-line chai-expect/missing-assertion
     return expect(isExperimentOn(win, /*OK*/ experimentId));
   }
 
@@ -233,6 +234,7 @@ describe('toggleExperiment', () => {
     };
     const on = toggleExperiment(win, experimentId, opt_on);
     const newString = win.localStorage.getItem('amp-experiment-toggles');
+    // eslint-disable-next-line chai-expect/missing-assertion
     return expect(`${on}; ${newString}`);
   }
 
@@ -548,8 +550,8 @@ describe('getBinaryType', () => {
       },
     };
     expect(getBinaryType(win)).to.equal('production');
-    win.AMP_CONFIG.type = 'canary';
-    expect(getBinaryType(win)).to.equal('canary');
+    win.AMP_CONFIG.type = 'experimental';
+    expect(getBinaryType(win)).to.equal('experimental');
     win.AMP_CONFIG.type = 'control';
     expect(getBinaryType(win)).to.equal('control');
     win.AMP_CONFIG.type = 'rc';
diff --git a/test/unit/test-extension-location.js b/test/unit/test-extension-location.js
index 850999588d1c9..c34cb53e5e401 100644
--- a/test/unit/test-extension-location.js
+++ b/test/unit/test-extension-location.js
@@ -170,7 +170,7 @@ describes.sandboxed('Extension Location', {}, () => {
   });
 
   describe('get correct URL parts', () => {
-    it('unversioned urls', () => {
+    it('non-RTV urls', () => {
       const urlParts = parseExtensionUrl(
         'https://cdn.ampproject.org/v0/amp-ad-1.0.js'
       );
@@ -178,12 +178,28 @@ describes.sandboxed('Extension Location', {}, () => {
       expect(urlParts.extensionVersion).to.equal('1.0');
     });
 
-    it('versioned urls', () => {
+    it('RTV urls', () => {
       const urlParts = parseExtensionUrl(
         'https://cdn.ampproject.org/rtv/123/v0/amp-ad-0.1.js'
       );
       expect(urlParts.extensionId).to.equal('amp-ad');
       expect(urlParts.extensionVersion).to.equal('0.1');
     });
+
+    it('extensions with "latest" version', () => {
+      const urlParts = parseExtensionUrl(
+        'https://cdn.ampproject.org/v0/amp-ad-latest.js'
+      );
+      expect(urlParts.extensionId).to.equal('amp-ad');
+      expect(urlParts.extensionVersion).to.equal('latest');
+    });
+
+    it('extensions with .max suffix', () => {
+      const urlParts = parseExtensionUrl(
+        'https://cdn.ampproject.org/v0/amp-ad-latest.max.js'
+      );
+      expect(urlParts.extensionId).to.equal('amp-ad');
+      expect(urlParts.extensionVersion).to.equal('latest');
+    });
   });
 });
diff --git a/test/unit/test-extensions.js b/test/unit/test-extensions.js
index 7f961c044f6e4..91c535316c780 100644
--- a/test/unit/test-extensions.js
+++ b/test/unit/test-extensions.js
@@ -682,6 +682,26 @@ describes.sandboxed('Extensions', {}, () => {
       expect(extensions.preloadExtension).to.be.calledWith('amp-list', '0.1');
     });
 
+    it('should support "latest" version scripts', () => {
+      const list = document.createElement('script');
+      list.setAttribute('custom-element', 'amp-list');
+      list.setAttribute(
+        'src',
+        'https://cdn.ampproject.org/v0/amp-list-latest.js'
+      );
+      win.document.head.appendChild(list);
+
+      extensions.reloadExtension('amp-list');
+
+      expect(list.getAttribute('i-amphtml-loaded-new-version')).to.equal(
+        'amp-list'
+      );
+      expect(extensions.preloadExtension).to.be.calledWith(
+        'amp-list',
+        'latest'
+      );
+    });
+
     it('should support [custom-template] scripts', () => {
       const mustache = document.createElement('script');
       mustache.setAttribute('custom-template', 'amp-mustache');
@@ -763,7 +783,7 @@ describes.sandboxed('Extensions', {}, () => {
         expect(win.customElements.elements['amp-mustache']).to.be.undefined;
       });
 
-      it('should insert extension script and not colide with prefixes', () => {
+      it('should insert extension script and not collide with prefixes', () => {
         // First add an extension with the same suffix.
         extensions.preloadExtension('amp-test-suffix');
         expect(
diff --git a/test/unit/test-fixed-layer.js b/test/unit/test-fixed-layer.js
index f1627e5ff450b..57ff2b4c6389c 100644
--- a/test/unit/test-fixed-layer.js
+++ b/test/unit/test-fixed-layer.js
@@ -22,13 +22,16 @@ import {endsWith} from '../../src/string';
 import {installHiddenObserverForDoc} from '../../src/service/hidden-observer-impl';
 import {installPlatformService} from '../../src/service/platform-impl';
 import {installTimerService} from '../../src/service/timer-impl';
+import {installViewerServiceForDoc} from '../../src/service/viewer-impl';
 import {toggle} from '../../src/style';
 import {toggleExperiment} from '../../src/experiments';
 import {user} from '../../src/log';
 
 describes.sandboxed('FixedLayer', {}, () => {
+  let parentApi;
   let documentApi;
   let ampdoc;
+  let viewer;
   let vsyncApi;
   let vsyncTasks;
   let docBody, docElem;
@@ -42,6 +45,7 @@ describes.sandboxed('FixedLayer', {}, () => {
   let timer;
 
   beforeEach(() => {
+    parentApi = {};
     documentApi = {};
     allRules = {};
 
@@ -165,6 +169,7 @@ describes.sandboxed('FixedLayer', {}, () => {
       },
       documentElement: docElem,
       body: docBody,
+      parent: parentApi,
     });
     documentApi.defaultView.document = documentApi;
     installDocService(documentApi.defaultView, /* isSingleDoc */ true);
@@ -172,7 +177,10 @@ describes.sandboxed('FixedLayer', {}, () => {
     installHiddenObserverForDoc(ampdoc);
     installPlatformService(documentApi.defaultView);
     installTimerService(documentApi.defaultView);
+    installViewerServiceForDoc(ampdoc);
     timer = Services.timerFor(documentApi.defaultView);
+    viewer = Services.viewerForDoc(ampdoc);
+    viewer.isEmbedded = () => true;
 
     vsyncTasks = [];
     vsyncApi = {
@@ -1255,6 +1263,10 @@ describes.sandboxed('FixedLayer', {}, () => {
     const transfer = true;
 
     beforeEach(() => {
+      installViewerServiceForDoc(ampdoc);
+      viewer = Services.viewerForDoc(ampdoc);
+      viewer.isEmbedded = () => true;
+
       fixedLayer = new FixedLayer(
         ampdoc,
         vsyncApi,
@@ -1270,6 +1282,9 @@ describes.sandboxed('FixedLayer', {}, () => {
       const ampdoc = new AmpDocSingle(win);
       installPlatformService(win);
       installTimerService(win);
+      installViewerServiceForDoc(ampdoc);
+      viewer = Services.viewerForDoc(ampdoc);
+      viewer.isEmbedded = () => true;
 
       const fixedLayer = new FixedLayer(
         ampdoc,
@@ -1691,9 +1706,148 @@ describes.sandboxed('FixedLayer', {}, () => {
   });
 });
 
+describes.sandboxed('FixedLayer Setup Execution Bailouts', {}, () => {
+  let win;
+  let ampdoc;
+  let viewer;
+  let vsyncApi;
+
+  beforeEach(() => {
+    win = new FakeWindow();
+    window.__AMP_MODE = {
+      localDev: false,
+      development: false,
+      minified: false,
+      test: false,
+      version: '$internalRuntimeVersion$',
+    };
+
+    const vsyncTasks = [];
+    vsyncApi = {
+      runPromise: task => {
+        vsyncTasks.push(task);
+        return Promise.resolve();
+      },
+      mutate: mutator => {
+        vsyncTasks.push({mutate: mutator});
+      },
+    };
+  });
+
+  it('should not perform setup when served canonically', () => {
+    ampdoc = new AmpDocSingle(win);
+    installPlatformService(win);
+    installTimerService(win);
+    installViewerServiceForDoc(ampdoc);
+    viewer = Services.viewerForDoc(ampdoc);
+    viewer.isEmbedded = () => false;
+
+    const fixedLayer = new FixedLayer(
+      ampdoc,
+      vsyncApi,
+      /* borderTop */ 0,
+      /* paddingTop */ 11,
+      /* transfer */ false
+    );
+    const executed = fixedLayer.setup();
+    expect(executed).to.be.false;
+  });
+
+  it('should perform setup when served within a viewer', () => {
+    ampdoc = new AmpDocSingle(win);
+    installPlatformService(win);
+    installTimerService(win);
+    installViewerServiceForDoc(ampdoc);
+    viewer = Services.viewerForDoc(ampdoc);
+    viewer.isEmbedded = () => true;
+
+    const fixedLayer = new FixedLayer(
+      ampdoc,
+      vsyncApi,
+      /* borderTop */ 0,
+      /* paddingTop */ 11,
+      /* transfer */ false
+    );
+    const executed = fixedLayer.setup();
+    expect(executed).to.be.true;
+  });
+});
+
+describes.sandboxed(
+  'FixedLayer Setup Execution Bailouts with Local Development',
+  {},
+  () => {
+    let win;
+    let ampdoc;
+    let viewer;
+    let vsyncApi;
+
+    beforeEach(() => {
+      win = new FakeWindow();
+      window.__AMP_MODE = {
+        localDev: true,
+        development: false,
+        minified: false,
+        test: false,
+        version: '$internalRuntimeVersion$',
+      };
+
+      const vsyncTasks = [];
+      vsyncApi = {
+        runPromise: task => {
+          vsyncTasks.push(task);
+          return Promise.resolve();
+        },
+        mutate: mutator => {
+          vsyncTasks.push({mutate: mutator});
+        },
+      };
+    });
+
+    it('should perform setup when served canonically', () => {
+      ampdoc = new AmpDocSingle(win);
+      installPlatformService(win);
+      installTimerService(win);
+      installViewerServiceForDoc(ampdoc);
+      viewer = Services.viewerForDoc(ampdoc);
+      viewer.isEmbedded = () => false;
+
+      const fixedLayer = new FixedLayer(
+        ampdoc,
+        vsyncApi,
+        /* borderTop */ 0,
+        /* paddingTop */ 11,
+        /* transfer */ false
+      );
+      const executed = fixedLayer.setup();
+      expect(executed).to.be.true;
+    });
+
+    it('should perform setup when served within a viewer', () => {
+      ampdoc = new AmpDocSingle(win);
+      installPlatformService(win);
+      installTimerService(win);
+      installViewerServiceForDoc(ampdoc);
+      viewer = Services.viewerForDoc(ampdoc);
+      viewer.isEmbedded = () => true;
+
+      const fixedLayer = new FixedLayer(
+        ampdoc,
+        vsyncApi,
+        /* borderTop */ 0,
+        /* paddingTop */ 11,
+        /* transfer */ false
+      );
+      const executed = fixedLayer.setup();
+      expect(executed).to.be.true;
+    });
+  }
+);
+
 describes.realWin('FixedLayer', {}, env => {
   let win, doc;
   let ampdoc;
+  let viewer;
   let fixedLayer;
   let transferLayer;
   let root;
@@ -1723,6 +1877,9 @@ describes.realWin('FixedLayer', {}, env => {
         installPlatformService(win);
         installTimerService(win);
         ampdoc = new AmpDocSingle(win);
+        installViewerServiceForDoc(ampdoc);
+        viewer = Services.viewerForDoc(ampdoc);
+        viewer.isEmbedded = () => true;
         shadowRoot = win.document.body.attachShadow({mode: 'open'});
         fixedLayer = new FixedLayer(
           ampdoc,
diff --git a/test/unit/test-friendly-iframe-embed.js b/test/unit/test-friendly-iframe-embed.js
index ca0932a6a6886..edd6bd8fbcd69 100644
--- a/test/unit/test-friendly-iframe-embed.js
+++ b/test/unit/test-friendly-iframe-embed.js
@@ -902,7 +902,7 @@ describes.realWin('friendly-iframe-embed', {amp: true}, env => {
     const winW = 600;
     const winH = 800;
 
-    const resourcesMock = {
+    const mutatorMock = {
       measureMutateElement: (unusedEl, measure, mutate) => {
         if (measure) {
           measure();
@@ -935,7 +935,7 @@ describes.realWin('friendly-iframe-embed', {amp: true}, env => {
         Promise.resolve()
       );
 
-      env.sandbox.stub(fie, 'getResources_').returns(resourcesMock);
+      env.sandbox.stub(fie, 'getMutator_').returns(mutatorMock);
       env.sandbox.stub(fie, 'getBodyElement').returns(bodyElementMock);
 
       fie.win = win;
diff --git a/test/unit/test-history.js b/test/unit/test-history.js
index 08a87951500ba..276484b084054 100644
--- a/test/unit/test-history.js
+++ b/test/unit/test-history.js
@@ -197,11 +197,11 @@ describes.fakeWin(
       bindingMock
         .expects('push')
         .withExactArgs(state)
-        .returns(Promise.resolve(Object.assign({}, state, {stackIndex: 11})))
+        .returns(Promise.resolve({...state, stackIndex: 11}))
         .once();
       bindingMock
         .expects('get')
-        .returns(Promise.resolve(Object.assign({}, state, {stackIndex: 11})))
+        .returns(Promise.resolve({...state, stackIndex: 11}))
         .once();
       return history.push(onPop, state).then(historyId => {
         expect(historyId).to.equal(11);
@@ -245,7 +245,7 @@ describes.fakeWin(
       bindingMock
         .expects('pop')
         .withExactArgs(11)
-        .returns(Promise.resolve(Object.assign({}, popState, {stackIndex: 10})))
+        .returns(Promise.resolve({...popState, stackIndex: 10}))
         .once();
       return history.push(onPop).then(historyId => {
         expect(historyId).to.equal(11);
@@ -257,9 +257,7 @@ describes.fakeWin(
           expect(history.stackOnPop_.length).to.equal(11);
           clock.tick(1);
           expect(onPop).to.be.calledOnce;
-          expect(onPop).to.be.calledWith(
-            Object.assign({}, popState, {stackIndex: 10})
-          );
+          expect(onPop).to.be.calledWith({...popState, stackIndex: 10});
         });
       });
     });
diff --git a/test/unit/test-layout-delay-meter.js b/test/unit/test-layout-delay-meter.js
index 6823adf9b60a2..aa325b149e88a 100644
--- a/test/unit/test-layout-delay-meter.js
+++ b/test/unit/test-layout-delay-meter.js
@@ -18,6 +18,7 @@ import * as lolex from 'lolex';
 import {LayoutDelayMeter} from '../../src/layout-delay-meter';
 import {Services} from '../../src/services';
 import {installPerformanceService} from '../../src/service/performance-impl';
+import {installPlatformService} from '../../src/service/platform-impl';
 
 describes.realWin(
   'layout-delay-meter',
@@ -34,6 +35,7 @@ describes.realWin(
 
     beforeEach(() => {
       win = env.win;
+      installPlatformService(win);
       installPerformanceService(win);
       const perf = Services.performanceFor(win);
       env.sandbox.stub(perf, 'isPerformanceTrackingOn').callsFake(() => true);
diff --git a/test/unit/test-layout.js b/test/unit/test-layout.js
index 3867719d3fa55..fded856789985 100644
--- a/test/unit/test-layout.js
+++ b/test/unit/test-layout.js
@@ -283,7 +283,7 @@ describe('Layout', () => {
     div.setAttribute('layout', 'fixed');
     allowConsoleError(() => {
       expect(() => applyStaticLayout(div)).to.throw(
-        /Expected height to be available/
+        /The "height" attribute is missing/
       );
     });
   });
@@ -318,7 +318,7 @@ describe('Layout', () => {
     allowConsoleError(() => {
       expect(function() {
         applyStaticLayout(div);
-      }).to.throw(/Expected width to be either absent or equal "auto"/);
+      }).to.throw(/The "width" attribute must be missing or "auto"/);
     });
   });
 
@@ -341,7 +341,7 @@ describe('Layout', () => {
     div.setAttribute('layout', 'fixed-height');
     allowConsoleError(() => {
       expect(() => applyStaticLayout(div)).to.throw(
-        /Expected height to be available/
+        /The "height" attribute is missing/
       );
     });
   });
@@ -466,7 +466,7 @@ describe('Layout', () => {
     allowConsoleError(() => {
       expect(function() {
         applyStaticLayout(div);
-      }).to.throw(/Unknown layout: foo/);
+      }).to.throw(/Invalid "layout" value: foo/);
     });
   });
 
@@ -535,7 +535,7 @@ describe('Layout', () => {
     allowConsoleError(() => {
       expect(() => {
         applyStaticLayout(pixel);
-      }).to.throw(/Invalid width value/);
+      }).to.throw(/Invalid "width" value: X/);
     });
   });
 
@@ -547,7 +547,7 @@ describe('Layout', () => {
     allowConsoleError(() => {
       expect(() => {
         applyStaticLayout(pixel);
-      }).to.throw(/Invalid height value/);
+      }).to.throw(/Invalid "height" value: X/);
     });
   });
 
diff --git a/test/unit/test-performance.js b/test/unit/test-performance.js
index 65bd822ff730e..7258cb5a19610 100644
--- a/test/unit/test-performance.js
+++ b/test/unit/test-performance.js
@@ -20,6 +20,7 @@ import {Services} from '../../src/services';
 import {VisibilityState} from '../../src/visibility-state';
 import {getMode} from '../../src/mode';
 import {installPerformanceService} from '../../src/service/performance-impl';
+import {installPlatformService} from '../../src/service/platform-impl';
 import {installRuntimeServices} from '../../src/service/core-services';
 
 describes.realWin('performance', {amp: true}, env => {
@@ -35,6 +36,7 @@ describes.realWin('performance', {amp: true}, env => {
       target: win,
       toFake: ['Date', 'setTimeout', 'clearTimeout'],
     });
+    installPlatformService(env.win);
     installPerformanceService(env.win);
     perf = Services.performanceFor(env.win);
   });
@@ -249,13 +251,24 @@ describes.realWin('performance', {amp: true}, env => {
             expect(perf.isMessagingReady_).to.be.true;
             const msrCalls = viewerSendMessageStub.withArgs(
               'tick',
-              env.sandbox.match(arg => arg.label == 'msr')
+              env.sandbox.match(arg => arg.label === 'msr')
             );
             expect(msrCalls).to.be.calledOnce;
             expect(msrCalls.args[0][1]).to.be.jsonEqual({
               label: 'msr',
               delta: 1,
             });
+
+            const timeOriginCall = viewerSendMessageStub.withArgs(
+              'tick',
+              env.sandbox.match(arg => arg.label === 'timeOrigin')
+            );
+            expect(timeOriginCall).to.be.calledOnce;
+            expect(timeOriginCall).calledWithMatch('tick', {
+              label: 'timeOrigin',
+              delta: env.sandbox.match.number,
+            });
+
             expect(flushSpy).to.have.callCount(5);
             expect(perf.events_.length).to.equal(0);
           });
@@ -648,16 +661,16 @@ describes.realWin('performance', {amp: true}, env => {
         () => {
           clock.tick(100);
           whenFirstVisibleResolve();
-          expect(tickSpy).to.have.callCount(3);
+          expect(tickSpy).to.have.callCount(4);
           return ampdoc.whenFirstVisible().then(() => {
             clock.tick(400);
-            expect(tickSpy).to.have.callCount(4);
+            expect(tickSpy).to.have.callCount(5);
             whenViewportLayoutCompleteResolve();
             return perf.whenViewportLayoutComplete_().then(() => {
-              expect(tickSpy).to.have.callCount(4);
+              expect(tickSpy).to.have.callCount(5);
               expect(tickSpy.withArgs('ofv')).to.be.calledOnce;
               return whenFirstVisiblePromise.then(() => {
-                expect(tickSpy).to.have.callCount(5);
+                expect(tickSpy).to.have.callCount(6);
                 expect(tickSpy.withArgs('pc')).to.be.calledOnce;
                 expect(Number(tickSpy.withArgs('pc').args[0][1])).to.equal(400);
               });
@@ -748,6 +761,7 @@ describes.realWin('performance with experiment', {amp: true}, env => {
       .withArgs('csi')
       .returns('1');
     env.sandbox.stub(viewer, 'isEmbedded').returns(true);
+    installPlatformService(win);
     installPerformanceService(win);
     perf = Services.performanceFor(win);
   });
@@ -814,6 +828,92 @@ describes.realWin('PeformanceObserver metrics', {amp: true}, env => {
     }
   }
 
+  let fakeWin;
+  let windowEventListeners;
+  let performanceObserver;
+  let viewerVisibilityState;
+
+  function setupFakesForVisibilityStateManipulation() {
+    // Fake window to fake `document.visibilityState`.
+    // TODO: Consider how we can replace this with the fake window object
+    // offered in fake-dom.js. We can't immediately because
+    // document.visibilityState is a read-only property in that object.
+    fakeWin = {
+      Date: env.win.Date,
+      PerformanceObserver: env.sandbox.stub(),
+      addEventListener: env.sandbox.stub(),
+      removeEventListener: env.win.removeEventListener,
+      dispatchEvent: env.win.dispatchEvent,
+      document: {
+        addEventListener: env.sandbox.stub(),
+        hidden: false,
+        readyState: 'complete',
+        removeEventListener: env.sandbox.stub(),
+        visibilityState: 'visible',
+      },
+      location: env.win.location,
+      navigator: env.win.navigator,
+      performance: {
+        getEntriesByType: env.sandbox.stub(),
+      },
+    };
+
+    // Fake window.addEventListener to fake `visibilitychange` and
+    // `beforeunload` events.
+    windowEventListeners = {};
+    fakeWin.addEventListener.callsFake((eventType, handler) => {
+      if (!windowEventListeners[eventType]) {
+        windowEventListeners[eventType] = [];
+      }
+      windowEventListeners[eventType].push(handler);
+    });
+
+    // Fake the PerformanceObserver implementation so we can send
+    // fake PerformanceEntry objects to listeners.
+    fakeWin.PerformanceObserver.callsFake(callback => {
+      performanceObserver = new PerformanceObserverImpl(callback);
+      return performanceObserver;
+    });
+
+    // Install services on fakeWin so some behaviors can be stubbed.
+    installRuntimeServices(fakeWin);
+
+    const unresolvedPromise = new Promise(() => {});
+    const viewportSize = {width: 0, height: 0};
+    env.sandbox.stub(Services, 'ampdoc').returns({
+      hasBeenVisible: () => {},
+      onVisibilityChanged: () => {},
+      whenFirstVisible: () => unresolvedPromise,
+      getVisibilityState: () => viewerVisibilityState,
+    });
+    env.sandbox.stub(Services, 'viewerForDoc').returns({
+      isEmbedded: () => {},
+      whenMessagingReady: () => {},
+    });
+    env.sandbox.stub(Services, 'resourcesForDoc').returns({
+      getResourcesInRect: () => unresolvedPromise,
+      whenFirstPass: () => Promise.resolve(),
+    });
+    env.sandbox.stub(Services, 'viewportForDoc').returns({
+      getSize: () => viewportSize,
+    });
+  }
+
+  function getPerformance() {
+    installPerformanceService(fakeWin);
+    return Services.performanceFor(fakeWin);
+  }
+
+  function toggleVisibility(win, on) {
+    win.document.visibilityState = on ? 'visible' : 'hidden';
+    fireEvent('visibilitychange');
+  }
+
+  function fireEvent(eventName) {
+    const event = new Event(eventName);
+    (windowEventListeners[eventName] || []).forEach(cb => cb(event));
+  }
+
   describe('should forward paint metrics for performance entries', () => {
     it('created before performance service registered', () => {
       // Pretend that the PaintTiming API exists.
@@ -914,6 +1014,67 @@ describes.realWin('PeformanceObserver metrics', {amp: true}, env => {
     });
   });
 
+  describe('should forward largest-contentful-paint metric for performance entries', () => {
+    beforeEach(() => {
+      setupFakesForVisibilityStateManipulation();
+    });
+    it('after performance service registered', () => {
+      // Fake the Performance API.
+      fakeWin.PerformanceObserver.supportedEntryTypes = [
+        'largest-contentful-paint',
+      ];
+
+      installPerformanceService(fakeWin);
+      const perf = Services.performanceFor(fakeWin);
+      perf.coreServicesAvailable();
+      viewerVisibilityState = VisibilityState.INACTIVE;
+
+      expect(perf.events_.length).to.equal(0);
+
+      // Fake a largest-contentful-paint entry specifying a loadTime,
+      // simulating an image on a different origin without a proper
+      // Timing-Allow-Origin header.
+      performanceObserver.triggerCallback({
+        getEntries() {
+          return [
+            {
+              entryType: 'largest-contentful-paint',
+              loadTime: 10,
+            },
+          ];
+        },
+      });
+
+      // Fake a largest-contentful-paint entry specifying a renderTime,
+      // simulating an image on the same origin or with a proper
+      // Timing-Allow-Origin header.
+      performanceObserver.triggerCallback({
+        getEntries() {
+          return [
+            {
+              entryType: 'largest-contentful-paint',
+              renderTime: 23,
+            },
+          ];
+        },
+      });
+
+      // The document has become hidden, e.g. via the user switching tabs.
+      toggleVisibility(fakeWin, false);
+
+      expect(perf.events_.length).to.equal(2);
+      expect(perf.events_[0]).to.be.jsonEqual({
+        label: 'lcpl',
+        delta: 10,
+      });
+
+      expect(perf.events_[1]).to.be.jsonEqual({
+        label: 'lcpr',
+        delta: 23,
+      });
+    });
+  });
+
   describe('should forward first input metrics for performance entries', () => {
     let PerformanceObserverConstructorStub, performanceObserver;
     beforeEach(() => {
@@ -1064,89 +1225,10 @@ describes.realWin('PeformanceObserver metrics', {amp: true}, env => {
   });
 
   describe('forwards layout jank metric', () => {
-    let fakeWin;
-    let windowEventListeners;
-    let performanceObserver;
-    let viewerVisibilityState;
-
     beforeEach(() => {
-      // Fake window to fake `document.visibilityState`.
-      fakeWin = {
-        Date: env.win.Date,
-        PerformanceLayoutJank: true,
-        PerformanceObserver: env.sandbox.stub(),
-        addEventListener: env.sandbox.stub(),
-        removeEventListener: env.win.removeEventListener,
-        dispatchEvent: env.win.dispatchEvent,
-        document: {
-          addEventListener: env.sandbox.stub(),
-          hidden: false,
-          readyState: 'complete',
-          removeEventListener: env.sandbox.stub(),
-          visibilityState: 'visible',
-        },
-        location: env.win.location,
-        performance: {
-          getEntriesByType: env.sandbox.stub(),
-        },
-      };
-
-      // Fake window.addEventListener to fake `visibilitychange` and
-      // `beforeunload` events.
-      windowEventListeners = {};
-      fakeWin.addEventListener.callsFake((eventType, handler) => {
-        if (!windowEventListeners[eventType]) {
-          windowEventListeners[eventType] = [];
-        }
-        windowEventListeners[eventType].push(handler);
-      });
-
-      // Fake the PerformanceObserver implementation so we can send
-      // fake PerformanceEntry objects to listeners.
-      fakeWin.PerformanceObserver.callsFake(callback => {
-        performanceObserver = new PerformanceObserverImpl(callback);
-        return performanceObserver;
-      });
-
-      // Install services on fakeWin so some behaviors can be stubbed.
-      installRuntimeServices(fakeWin);
-
-      const unresolvedPromise = new Promise(() => {});
-      const viewportSize = {width: 0, height: 0};
-      env.sandbox.stub(Services, 'ampdoc').returns({
-        hasBeenVisible: () => {},
-        onVisibilityChanged: () => {},
-        whenFirstVisible: () => unresolvedPromise,
-        getVisibilityState: () => viewerVisibilityState,
-      });
-      env.sandbox.stub(Services, 'viewerForDoc').returns({
-        isEmbedded: () => {},
-        whenMessagingReady: () => {},
-      });
-      env.sandbox.stub(Services, 'resourcesForDoc').returns({
-        getResourcesInRect: () => unresolvedPromise,
-        whenFirstPass: () => Promise.resolve(),
-      });
-      env.sandbox.stub(Services, 'viewportForDoc').returns({
-        getSize: () => viewportSize,
-      });
+      setupFakesForVisibilityStateManipulation();
+      fakeWin.PerformanceLayoutJank = true;
     });
-
-    function getPerformance() {
-      installPerformanceService(fakeWin);
-      return Services.performanceFor(fakeWin);
-    }
-
-    function toggleVisibility(win, on) {
-      win.document.visibilityState = on ? 'visible' : 'hidden';
-      fireEvent('visibilitychange');
-    }
-
-    function fireEvent(eventName) {
-      const event = new Event(eventName);
-      (windowEventListeners[eventName] || []).forEach(cb => cb(event));
-    }
-
     it('for browsers that support the visibilitychange event', () => {
       // Specify an Android Chrome user agent, which supports the
       // visibilitychange event.
@@ -1235,72 +1317,8 @@ describes.realWin('PeformanceObserver metrics', {amp: true}, env => {
   });
 
   describe('forwards cumulative layout shift metric', () => {
-    let fakeWin;
-    let windowEventListeners;
-    let performanceObserver;
-    let viewerVisibilityState;
-
     beforeEach(() => {
-      // Fake window to fake `document.visibilityState` and the
-      // `PeformanceObserver` implementation.
-      fakeWin = {
-        Date: env.win.Date,
-        PerformanceObserver: env.sandbox.stub(),
-        addEventListener: env.sandbox.stub(),
-        removeEventListener: env.win.removeEventListener,
-        dispatchEvent: env.win.dispatchEvent,
-        document: {
-          addEventListener: env.sandbox.stub(),
-          hidden: false,
-          readyState: 'complete',
-          removeEventListener: env.sandbox.stub(),
-          visibilityState: 'visible',
-        },
-        location: env.win.location,
-        performance: {
-          getEntriesByType: env.sandbox.stub(),
-        },
-      };
-
-      // Fake window.addEventListener to fake `visibilitychange` and
-      // `beforeunload` events.
-      windowEventListeners = {};
-      fakeWin.addEventListener.callsFake((eventType, handler) => {
-        if (!windowEventListeners[eventType]) {
-          windowEventListeners[eventType] = [];
-        }
-        windowEventListeners[eventType].push(handler);
-      });
-
-      // Fake the PerformanceObserver implementation so we can send
-      // fake PerformanceEntry objects to listeners.
-      fakeWin.PerformanceObserver.callsFake(callback => {
-        performanceObserver = new PerformanceObserverImpl(callback);
-        return performanceObserver;
-      });
-
-      // Install services on fakeWin so some behaviors can be stubbed.
-      installRuntimeServices(fakeWin);
-
-      const unresolvedPromise = new Promise(() => {});
-      const viewportSize = {width: 0, height: 0};
-      env.sandbox.stub(Services, 'ampdoc').returns({
-        hasBeenVisible: () => {},
-        onVisibilityChanged: () => {},
-        whenFirstVisible: () => unresolvedPromise,
-        getVisibilityState: () => viewerVisibilityState,
-      });
-      env.sandbox.stub(Services, 'viewerForDoc').returns({
-        isEmbedded: () => {},
-        whenMessagingReady: () => {},
-      });
-      env.sandbox.stub(Services, 'resourcesForDoc').returns({
-        getResourcesInRect: () => unresolvedPromise,
-        whenFirstPass: () => Promise.resolve(),
-      });
-      env.sandbox.stub(Services, 'viewportForDoc').returns({
-        getSize: () => viewportSize,
-      });
+      setupFakesForVisibilityStateManipulation();
     });
 
     function getPerformance() {
diff --git a/test/unit/test-polyfill-custom-elements.js b/test/unit/test-polyfill-custom-elements.js
new file mode 100644
index 0000000000000..c7d1e5126f780
--- /dev/null
+++ b/test/unit/test-polyfill-custom-elements.js
@@ -0,0 +1,162 @@
+/**
+ * Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {copyProperties} from '../../src/polyfills/custom-elements';
+
+describes.fakeWin('copyProperties', {}, () => {
+  it('copies own properties from proto object', () => {
+    const obj = {};
+    const proto = {test: 1};
+
+    copyProperties(obj, proto);
+
+    expect(obj).to.have.ownPropertyDescriptor('test', {
+      value: 1,
+      configurable: true,
+      enumerable: true,
+      writable: true,
+    });
+  });
+
+  it('copies own descriptor from proto object', () => {
+    const obj = {};
+    const proto = {};
+    Object.defineProperty(proto, 'test', {value: 1});
+
+    copyProperties(obj, proto);
+
+    expect(obj).to.have.ownPropertyDescriptor('test', {
+      value: 1,
+      configurable: false,
+      enumerable: false,
+      writable: false,
+    });
+  });
+
+  it('copies own getter/setter from proto object', () => {
+    const obj = {};
+    const proto = {};
+
+    let value = 1;
+    Object.defineProperty(proto, 'test', {
+      get() {
+        return value;
+      },
+      set(v) {
+        value = v;
+      },
+    });
+
+    copyProperties(obj, proto);
+
+    expect(obj).to.have.ownPropertyDescriptor('test');
+    expect(obj.test).to.equal(1);
+    obj.test = 2;
+    expect(obj.test).to.equal(2);
+    expect(value).to.equal(2);
+  });
+
+  it('does not override already defined property', () => {
+    const obj = {test: 1};
+    const proto = {test: 2};
+
+    copyProperties(obj, proto);
+
+    expect(obj.test).to.equal(1);
+  });
+
+  it('copies own properties from proto.__proto__ object', () => {
+    const obj = {};
+    const proto = Object.create({test: 1});
+
+    copyProperties(obj, proto);
+
+    expect(obj).to.have.ownPropertyDescriptor('test', {
+      value: 1,
+      configurable: true,
+      enumerable: true,
+      writable: true,
+    });
+  });
+
+  it('copies own descriptor from proto object', () => {
+    const obj = {};
+    const proto = Object.create(
+      {},
+      {
+        test: {value: 1},
+      }
+    );
+
+    copyProperties(obj, proto);
+
+    expect(obj).to.have.ownPropertyDescriptor('test', {
+      value: 1,
+      configurable: false,
+      enumerable: false,
+      writable: false,
+    });
+  });
+
+  it('copies own getter/setter from proto object', () => {
+    let value = 1;
+    const obj = {};
+    const proto = Object.create(
+      {},
+      {
+        test: {
+          get() {
+            return value;
+          },
+          set(v) {
+            value = v;
+          },
+        },
+      }
+    );
+
+    copyProperties(obj, proto);
+
+    expect(obj).to.have.ownPropertyDescriptor('test');
+    expect(obj.test).to.equal(1);
+    obj.test = 2;
+    expect(obj.test).to.equal(2);
+    expect(value).to.equal(2);
+  });
+
+  it('does not override already defined property', () => {
+    const obj = {test: 1};
+    const proto = Object.create({test: 2});
+
+    copyProperties(obj, proto);
+
+    expect(obj.test).to.equal(1);
+  });
+
+  it('does not override closer property with __proto__ property', () => {
+    const obj = {};
+    const proto = Object.create(
+      {test: 2},
+      {
+        test: {value: 1},
+      }
+    );
+
+    copyProperties(obj, proto);
+
+    expect(obj.test).to.equal(1);
+  });
+});
diff --git a/test/unit/test-preconnect.js b/test/unit/test-preconnect.js
index 6eb2b0d8f3c9c..f0dabb644e21a 100644
--- a/test/unit/test-preconnect.js
+++ b/test/unit/test-preconnect.js
@@ -18,18 +18,20 @@ import * as lolex from 'lolex';
 import {Services} from '../../src/services';
 import {createIframePromise} from '../../testing/iframe';
 import {
-  preconnectForElement,
+  installPreconnectService,
   preconnectToOrigin,
   setPreconnectFeaturesForTesting,
 } from '../../src/preconnect';
 
-describe('preconnect', () => {
+describes.sandboxed('preconnect', {}, env => {
+  let ampdoc;
   let iframeClock;
   let clock;
   let preconnect;
   let preloadSupported;
   let preconnectSupported;
   let isSafari;
+  let sandbox;
   let visiblePromise;
 
   // Factored out to make our linter happy since we don't allow
@@ -52,25 +54,27 @@ describe('preconnect', () => {
         isSafari: () => !!isSafari,
       };
       iframe.win.__AMP_SERVICES['platform'] = {obj: platform};
+      sandbox.stub(Services, 'platformFor').returns(platform);
 
-      const element = document.createElement('div');
-      iframe.win.document.body.appendChild(element);
-      preconnect = preconnectForElement(element);
-      window.sandbox.stub(preconnect, 'getAmpdoc_').returns({
+      installPreconnectService(iframe.win);
+      preconnect = Services.preconnectFor(iframe.win);
+
+      ampdoc = {
         whenFirstVisible: () => visiblePromise,
-      });
+      };
       return iframe;
     });
   }
 
   beforeEach(() => {
+    sandbox = env.sandbox;
     visiblePromise = Promise.resolve();
     isSafari = undefined;
     // Default mock to not support preload/preconnect - override in cases
     // to test for preload/preconnect support.
     preloadSupported = false;
     preconnectSupported = false;
-    clock = window.sandbox.useFakeTimers();
+    clock = sandbox.useFakeTimers();
   });
 
   afterEach(() => {
@@ -81,10 +85,10 @@ describe('preconnect', () => {
   it('should preconnect', () => {
     isSafari = false;
     return getPreconnectIframe().then(iframe => {
-      const open = window.sandbox.spy(XMLHttpRequest.prototype, 'open');
-      preconnect.url('https://a.preconnect.com/foo/bar');
-      preconnect.url('https://a.preconnect.com/other');
-      preconnect.url(javascriptUrlPrefix + ':alert()');
+      const open = sandbox.spy(XMLHttpRequest.prototype, 'open');
+      preconnect.url(ampdoc, 'https://a.preconnect.com/foo/bar');
+      preconnect.url(ampdoc, 'https://a.preconnect.com/other');
+      preconnect.url(ampdoc, javascriptUrlPrefix + ':alert()');
       expect(
         iframe.doc.querySelectorAll('link[rel=dns-prefetch]')
       ).to.have.length(0);
@@ -117,7 +121,7 @@ describe('preconnect', () => {
   it('should preconnect to origins', async function() {
     isSafari = false;
     const iframe = await getPreconnectIframe();
-    window.sandbox.stub(Services, 'documentInfoForDoc').returns({
+    sandbox.stub(Services, 'documentInfoForDoc').returns({
       sourceUrl: 'https://sourceurl.com/',
       canonicalUrl: 'https://canonicalurl.com/',
     });
@@ -133,10 +137,10 @@ describe('preconnect', () => {
     isSafari = false;
     preconnectSupported = true;
     return getPreconnectIframe().then(iframe => {
-      const open = window.sandbox.spy(XMLHttpRequest.prototype, 'open');
-      preconnect.url('https://a.preconnect.com/foo/bar');
-      preconnect.url('https://a.preconnect.com/other');
-      preconnect.url(javascriptUrlPrefix + ':alert()');
+      const open = sandbox.spy(XMLHttpRequest.prototype, 'open');
+      preconnect.url(ampdoc, 'https://a.preconnect.com/foo/bar');
+      preconnect.url(ampdoc, 'https://a.preconnect.com/other');
+      preconnect.url(ampdoc, javascriptUrlPrefix + ':alert()');
       expect(
         iframe.doc.querySelectorAll('link[rel=preconnect]')
       ).to.have.length(0);
@@ -167,11 +171,11 @@ describe('preconnect', () => {
     isSafari = true;
     return getPreconnectIframe().then(iframe => {
       clock.tick(1485531293690);
-      const open = window.sandbox.spy(XMLHttpRequest.prototype, 'open');
-      const send = window.sandbox.spy(XMLHttpRequest.prototype, 'send');
-      preconnect.url('https://s.preconnect.com/foo/bar');
-      preconnect.url('https://s.preconnect.com/other');
-      preconnect.url(javascriptUrlPrefix + ':alert()');
+      const open = sandbox.spy(XMLHttpRequest.prototype, 'open');
+      const send = sandbox.spy(XMLHttpRequest.prototype, 'send');
+      preconnect.url(ampdoc, 'https://s.preconnect.com/foo/bar');
+      preconnect.url(ampdoc, 'https://s.preconnect.com/other');
+      preconnect.url(ampdoc, javascriptUrlPrefix + ':alert()');
       expect(
         iframe.doc.querySelectorAll('link[rel=dns-prefetch]')
       ).to.have.length(0);
@@ -204,7 +208,7 @@ describe('preconnect', () => {
 
   it('should cleanup', () => {
     return getPreconnectIframe().then(iframe => {
-      preconnect.url('https://c.preconnect.com/foo/bar');
+      preconnect.url(ampdoc, 'https://c.preconnect.com/foo/bar');
       return visiblePromise.then(() => {
         expect(
           iframe.doc.querySelectorAll('link[rel=dns-prefetch]')
@@ -232,9 +236,9 @@ describe('preconnect', () => {
 
   it('should preconnect to 2 different origins', () => {
     return getPreconnectIframe().then(iframe => {
-      preconnect.url('https://d.preconnect.com/foo/bar');
+      preconnect.url(ampdoc, 'https://d.preconnect.com/foo/bar');
       // Different origin
-      preconnect.url('https://e.preconnect.com/other');
+      preconnect.url(ampdoc, 'https://e.preconnect.com/other');
       return visiblePromise.then(() => {
         expect(
           iframe.doc.querySelectorAll('link[rel=dns-prefetch]')
@@ -254,13 +258,13 @@ describe('preconnect', () => {
 
   it('should timeout preconnects', () => {
     return getPreconnectIframe().then(iframe => {
-      preconnect.url('https://x.preconnect.com/foo/bar');
+      preconnect.url(ampdoc, 'https://x.preconnect.com/foo/bar');
       return visiblePromise.then(() => {
         expect(
           iframe.doc.querySelectorAll('link[rel=preconnect]')
         ).to.have.length(1);
         iframeClock.tick(9000);
-        preconnect.url('https://x.preconnect.com/foo/bar');
+        preconnect.url(ampdoc, 'https://x.preconnect.com/foo/bar');
         return visiblePromise.then(() => {
           expect(
             iframe.doc.querySelectorAll('link[rel=preconnect]')
@@ -271,7 +275,7 @@ describe('preconnect', () => {
           ).to.have.length(0);
           // After timeout preconnect creates a new tag.
           clock.tick(10000);
-          preconnect.url('https://x.preconnect.com/foo/bar');
+          preconnect.url(ampdoc, 'https://x.preconnect.com/foo/bar');
           return visiblePromise.then(() => {
             expect(
               iframe.doc.querySelectorAll('link[rel=preconnect]')
@@ -285,6 +289,7 @@ describe('preconnect', () => {
   it('should timeout preconnects longer with active connect', () => {
     return getPreconnectIframe().then(iframe => {
       preconnect.url(
+        ampdoc,
         'https://y.preconnect.com/foo/bar',
         /* opt_alsoConnecting */ true
       );
@@ -298,13 +303,13 @@ describe('preconnect', () => {
         ).to.have.length(0);
         clock.tick(10000);
         return visiblePromise.then(() => {
-          preconnect.url('https://y.preconnect.com/foo/bar');
+          preconnect.url(ampdoc, 'https://y.preconnect.com/foo/bar');
           expect(
             iframe.doc.querySelectorAll('link[rel=preconnect]')
           ).to.have.length(0);
           clock.tick(180 * 1000);
           return visiblePromise.then(() => {
-            preconnect.url('https://y.preconnect.com/foo/bar');
+            preconnect.url(ampdoc, 'https://y.preconnect.com/foo/bar');
             expect(
               iframe.doc.querySelectorAll('link[rel=preconnect]')
             ).to.have.length(1);
@@ -322,10 +327,10 @@ describe('preconnect', () => {
       // Don't stub preload support allow the test to run through the browser
       // default regardless of support or not.
       return getPreconnectIframe(/* detectFeatures */ true).then(iframe => {
-        preconnect.preload('https://a.prefetch.com/foo/bar', 'script');
-        preconnect.preload('https://a.prefetch.com/foo/bar');
-        preconnect.preload('https://a.prefetch.com/other', 'style');
-        preconnect.preload(javascriptUrlPrefix + ':alert()');
+        preconnect.preload(ampdoc, 'https://a.prefetch.com/foo/bar', 'script');
+        preconnect.preload(ampdoc, 'https://a.prefetch.com/foo/bar');
+        preconnect.preload(ampdoc, 'https://a.prefetch.com/other', 'style');
+        preconnect.preload(ampdoc, javascriptUrlPrefix + ':alert()');
         const fetches = iframe.doc.querySelectorAll('link[rel=preload]');
         expect(fetches).to.have.length(0);
         return visiblePromise.then(() => {
@@ -347,10 +352,10 @@ describe('preconnect', () => {
   it('should preload', () => {
     preloadSupported = true;
     return getPreconnectIframe().then(iframe => {
-      preconnect.preload('https://a.prefetch.com/foo/bar', 'script');
-      preconnect.preload('https://a.prefetch.com/foo/bar');
-      preconnect.preload('https://a.prefetch.com/other', 'style');
-      preconnect.preload(javascriptUrlPrefix + ':alert()');
+      preconnect.preload(ampdoc, 'https://a.prefetch.com/foo/bar', 'script');
+      preconnect.preload(ampdoc, 'https://a.prefetch.com/foo/bar');
+      preconnect.preload(ampdoc, 'https://a.prefetch.com/other', 'style');
+      preconnect.preload(ampdoc, javascriptUrlPrefix + ':alert()');
       return visiblePromise.then(() => {
         // Also preconnects.
         expect(
diff --git a/test/unit/test-purifier.js b/test/unit/test-purifier.js
index 577a34fb031b8..0241c00b4953a 100644
--- a/test/unit/test-purifier.js
+++ b/test/unit/test-purifier.js
@@ -14,33 +14,42 @@
  * limitations under the License.
  */
 
-import {
-  getAllowedTags,
-  purifyHtml,
-  purifyTagsForTripleMustache,
-  validateAttributeChange,
-} from '../../src/purifier';
+import * as urlRewrite from '../../src/url-rewrite';
+import {Purifier} from '../../src/purifier/purifier';
 
 describe
   .configure()
   .skipFirefox()
   .run('DOMPurify-based', () => {
-    let html;
     let purify;
+    let purifyTripleMustache;
+    let rewriteAttributeValueSpy;
 
     beforeEach(() => {
-      html = document.createElement('html');
-      const doc = {documentElement: html};
+      rewriteAttributeValueSpy = window.sandbox.spy(
+        urlRewrite,
+        'rewriteAttributeValue'
+      );
+
+      const purifier = new Purifier(
+        document,
+        {},
+        urlRewrite.rewriteAttributeValue
+      );
 
       /**
        * Helper that serializes output of purifyHtml() to string.
        * @param {string} html
        * @return {string}
        */
-      purify = html => {
-        const body = purifyHtml(html, doc);
-        return body.innerHTML;
-      };
+      purify = html => purifier.purifyHtml(html).innerHTML;
+
+      /**
+       * Helper that calls purifyTagsForTripleMustache().
+       * @param {string} html
+       * @return {string}
+       */
+      purifyTripleMustache = html => purifier.purifyTagsForTripleMustache(html);
     });
 
     describe('sanitizer tests', () => {
@@ -86,6 +95,11 @@ describe
           '<h1>a<i>b</i>c' +
             '<amp-img src="http://example.com/1.png" i-amphtml-ignore=""></amp-img></h1>'
         );
+        expect(rewriteAttributeValueSpy).to.be.calledWith(
+          'amp-img',
+          'src',
+          'http://example.com/1.png'
+        );
       });
 
       it('should NOT output security-sensitive markup', () => {
@@ -116,6 +130,7 @@ describe
         expect(purify('a<a on="tap:AMP.print">b</a>')).to.be.equal(
           'a<a on="tap:AMP.print">b</a>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should output "data-, aria-, and role" attributes', () => {
@@ -127,6 +142,7 @@ describe
           '<a aria-label="bar" data-foo="bar" role="button">b</a>'
         );
         expectEqualNodeLists(actual, expected);
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(3);
       });
 
       it('should output "href" attribute', () => {
@@ -136,12 +152,14 @@ describe
           'a<a target="_top" href="http://acme.com/">b</a>'
         );
         expectEqualNodeLists(actual, expected);
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should allow arbitrary protocols', () => {
         expect(purify('<a href="foo://bar">link</a>')).to.be.equal(
           '<a target="_top" href="foo://bar">link</a>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should output "rel" attribute', () => {
@@ -153,12 +171,14 @@ describe
           'a<a href="http://acme.com/" rel="amphtml" target="_top">b</a>'
         );
         expectEqualNodeLists(actual, expected);
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(3);
       });
 
       it('should output "layout" attribute', () => {
         expect(purify('<amp-img layout="responsive"></amp-img>')).to.equal(
           '<amp-img layout="responsive" i-amphtml-ignore=""></amp-img>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should output "media" attribute', () => {
@@ -167,6 +187,7 @@ describe
         ).to.equal(
           '<amp-img media="(min-width: 650px)" i-amphtml-ignore=""></amp-img>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should output "sizes" attribute', () => {
@@ -175,6 +196,7 @@ describe
         ).to.equal(
           '<amp-img sizes="(min-width: 650px) 50vw, 100vw" i-amphtml-ignore=""></amp-img>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should output "heights" attribute', () => {
@@ -183,6 +205,7 @@ describe
         ).to.equal(
           '<amp-img heights="(min-width:500px) 200px, 80%" i-amphtml-ignore=""></amp-img>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should default target to _top with href', () => {
@@ -200,18 +223,21 @@ describe
         expect(purify('<a>b</a><a target="">d</a>')).to.equal(
           '<a>b</a><a target="_top">d</a>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should output a valid target', () => {
         expect(
           purify('<a target="_top">a</a><a target="_blank">b</a>')
         ).to.equal('<a target="_top">a</a><a target="_blank">b</a>');
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should output a valid target in different case', () => {
         expect(
           purify('<a target="_TOP">a</a><a target="_BLANK">b</a>')
         ).to.equal('<a target="_top">a</a><a target="_blank">b</a>');
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should override a unallowed target', () => {
@@ -230,37 +256,40 @@ describe
             '<a target="_top">_OTHER</a>' +
             '<a target="_top">other</a>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(5);
       });
 
       it('should NOT output security-sensitive attributes', () => {
-        expect(purify('a<a onclick="alert">b</a>')).to.be.equal('a<a>b</a>');
-        expect(purify('a<a href="javascript:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href=" JAVASCRIPT:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href="vbscript:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href=" VBSCRIPT:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href="data:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href=" DATA:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href="blob:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href=" BLOB:alert">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
-        expect(purify('a<a href="?__amp_source_origin=foo">b</a>')).to.be.equal(
-          'a<a target="_top">b</a>'
-        );
+        allowConsoleError(() => {
+          expect(purify('a<a onclick="alert">b</a>')).to.be.equal('a<a>b</a>');
+          expect(purify('a<a href="javascript:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(purify('a<a href=" JAVASCRIPT:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(purify('a<a href="vbscript:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(purify('a<a href=" VBSCRIPT:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(purify('a<a href="data:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(purify('a<a href=" DATA:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(purify('a<a href="blob:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(purify('a<a href=" BLOB:alert">b</a>')).to.be.equal(
+            'a<a target="_top">b</a>'
+          );
+          expect(
+            purify('a<a href="?__amp_source_origin=foo">b</a>')
+          ).to.be.equal('a<a target="_top">b</a>');
+        });
       });
 
       it('should NOT output blacklisted values for class attributes', () => {
@@ -274,6 +303,7 @@ describe
           expect(purify('<p class="foo-i-amphtml-bar">hello</p>')).to.be.equal(
             '<p>hello</p>'
           );
+          expect(rewriteAttributeValueSpy.callCount).to.be.equal(0);
         });
       });
 
@@ -293,12 +323,14 @@ describe
         expect(purify('<div subscriptions-dialog="">link</div>')).to.equal(
           '<div subscriptions-dialog="">link</div>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should allow source::src with valid protocol', () => {
         expect(purify('<source src="https://www.foo.com/">')).to.equal(
           '<source src="https://www.foo.com/">'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       // TODO(choumx): HTTPS-only URI attributes are not enforced consistently
@@ -311,24 +343,28 @@ describe
         expect(purify('<source src="<script>bad()</script>">')).to.equal(
           '<source src="">'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should allow div::template', () => {
         expect(purify('<div template="my-template-id"></div>')).to.equal(
           '<div template="my-template-id"></div>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should allow form::action-xhr', () => {
         expect(purify('<form action-xhr="https://foo.com"></form>')).to.equal(
           '<form action-xhr="https://foo.com"></form>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       it('should allow input::mask-output', () => {
         expect(purify('<input mask-output="alphanumeric">')).to.equal(
           '<input mask-output="alphanumeric">'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(1);
       });
 
       // Need to test this since DOMPurify doesn't offer a API for tag-specific
@@ -340,6 +376,7 @@ describe
         expect(purify(html)).to.equal(
           '<form action-xhr="https://foo.com"></form><p></p>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should allow <amp-form>-related attributes', () => {
@@ -361,6 +398,7 @@ describe
         expect(purify('<span validation-for="form1"></span>')).to.equal(
           '<span validation-for="form1"></span>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should avoid disallowing default-supported attributes', () => {
@@ -373,6 +411,7 @@ describe
         ).to.equal(
           '<amp-img style="color: red" i-amphtml-ignore=""></amp-img><p style="color: blue"></p>'
         );
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should allow <amp-lightbox> attributes', () => {
@@ -400,6 +439,7 @@ describe
         );
         // Other elements should NOT have [i-amphtml-key].
         expect(purify('<p></p>')).to.equal('<p></p>');
+        expect(rewriteAttributeValueSpy.callCount).to.be.equal(2);
       });
 
       it('should resolve URLs', () => {
@@ -409,142 +449,57 @@ describe
       });
     });
 
-    describe('AMP formats', () => {
-      it('should blacklist input[type="image"] and input[type="button"] in AMP', () => {
-        // Given the AMP format type.
-        html.setAttribute('amp', '');
-        allowConsoleError(() => {
-          expect(purify('<input type="image">')).to.equal('<input>');
-          expect(purify('<input type="button">')).to.equal('<input>');
-        });
-      });
-
-      it('should allow input[type="file"] and input[type="password"]', () => {
-        // Given that the AMP format does not blacklist input types file and
-        // password.
-        html.setAttribute('amp', '');
-        allowConsoleError(() => {
-          expect(purify('<input type="file">')).to.equal('<input type="file">');
-          expect(purify('<input type="password">')).to.equal(
-            '<input type="password">'
-          );
-        });
-      });
-
-      it('should sanitize certain tag attributes for AMP4Email', () => {
-        html.setAttribute('amp4email', '');
-        allowConsoleError(() => {
-          expect(purify('<input type="password">')).to.equal('<input>');
-          expect(purify('<input type="file">')).to.equal('<input>');
-          expect(purify('<form name="form-name"></form>')).to.equal(
-            '<form></form>'
-          );
-          expect(purify('<amp-anim controls></amp-anim>')).to.match(
-            /<amp-anim i-amphtml-key="(\d+)"><\/amp-anim>/
-          );
-        });
-      });
-
-      it('should only allow whitelisted AMP elements in AMP4EMAIL', () => {
-        html.setAttribute('amp4email', '');
-        allowConsoleError(() => {
-          expect(purify('<amp-analytics>')).to.equal('');
-          expect(purify('<amp-iframe>')).to.equal('');
-          expect(purify('<amp-list>')).to.equal('');
-          expect(purify('<amp-pixel>')).to.equal('');
-          expect(purify('<amp-twitter>')).to.equal('');
-          expect(purify('<amp-video>')).to.equal('');
-          expect(purify('<amp-youtube>')).to.equal('');
-        });
-
-        expect(purify('<amp-img>')).to.equal(
-          '<amp-img i-amphtml-ignore=""></amp-img>'
-        );
-        expect(purify('<amp-accordion>')).to.match(
-          /<amp-accordion i-amphtml-key="(\d+)"><\/amp-accordion>/
-        );
-        expect(purify('<amp-anim>')).to.match(
-          /<amp-anim i-amphtml-key="(\d+)"><\/amp-anim>/
-        );
-        expect(purify('<amp-bind-macro>')).to.match(
-          /<amp-bind-macro i-amphtml-key="(\d+)"><\/amp-bind-macro>/
-        );
-        expect(purify('<amp-carousel>')).to.match(
-          /<amp-carousel i-amphtml-key="(\d+)"><\/amp-carousel>/
-        );
-        expect(purify('<amp-fit-text>')).to.match(
-          /<amp-fit-text i-amphtml-key="(\d+)"><\/amp-fit-text>/
-        );
-        expect(purify('<amp-layout>')).to.match(
-          /<amp-layout i-amphtml-key="(\d+)"><\/amp-layout>/
-        );
-        expect(purify('<amp-selector>')).to.match(
-          /<amp-selector i-amphtml-key="(\d+)"><\/amp-selector>/
-        );
-        expect(purify('<amp-sidebar>')).to.match(
-          /<amp-sidebar i-amphtml-key="(\d+)"><\/amp-sidebar>/
-        );
-        expect(purify('<amp-timeago>')).to.match(
-          /<amp-timeago i-amphtml-key="(\d+)"><\/amp-timeago>/
-        );
-      });
-    });
-
     describe('purifyTagsForTripleMustache()', () => {
       it('should output basic text', () => {
-        expect(purifyTagsForTripleMustache('abc')).to.be.equal('abc');
+        expect(purifyTripleMustache('abc')).to.be.equal('abc');
       });
 
       it('should output HTML entities', () => {
         const entity = '&lt;tag&gt;';
-        expect(purifyTagsForTripleMustache(entity)).to.be.equal(entity);
+        expect(purifyTripleMustache(entity)).to.be.equal(entity);
         // DOMPurify short-circuits when there are no '<' characters.
-        expect(purifyTagsForTripleMustache(`<p>${entity}</p>`)).to.be.equal(
+        expect(purifyTripleMustache(`<p>${entity}</p>`)).to.be.equal(
           `<p>${entity}</p>`
         );
       });
 
       it('should output valid markup', () => {
-        expect(purifyTagsForTripleMustache('<b>abc</b>')).to.be.equal(
-          '<b>abc</b>'
-        );
-        expect(purifyTagsForTripleMustache('<b>ab<br>c</b>')).to.be.equal(
+        expect(purifyTripleMustache('<b>abc</b>')).to.be.equal('<b>abc</b>');
+        expect(purifyTripleMustache('<b>ab<br>c</b>')).to.be.equal(
           '<b>ab<br>c</b>'
         );
-        expect(purifyTagsForTripleMustache('<b>a<i>b</i>c</b>')).to.be.equal(
+        expect(purifyTripleMustache('<b>a<i>b</i>c</b>')).to.be.equal(
           '<b>a<i>b</i>c</b>'
         );
         const markupWithClassAttribute = '<p class="some-class">heading</p>';
-        expect(
-          purifyTagsForTripleMustache(markupWithClassAttribute)
-        ).to.be.equal(markupWithClassAttribute);
+        expect(purifyTripleMustache(markupWithClassAttribute)).to.be.equal(
+          markupWithClassAttribute
+        );
         const markupWithClassesAttribute =
           '<div class="some-class another"><span>heading</span></div>';
-        expect(
-          purifyTagsForTripleMustache(markupWithClassesAttribute)
-        ).to.be.equal(markupWithClassesAttribute);
+        expect(purifyTripleMustache(markupWithClassesAttribute)).to.be.equal(
+          markupWithClassesAttribute
+        );
         const markupParagraph = '<p class="valid-class">paragraph</p>';
-        expect(purifyTagsForTripleMustache(markupParagraph)).to.be.equal(
+        expect(purifyTripleMustache(markupParagraph)).to.be.equal(
           markupParagraph
         );
       });
 
       it('should NOT output non-whitelisted markup', () => {
-        expect(purifyTagsForTripleMustache('a<style>b</style>c')).to.be.equal(
-          'ac'
-        );
-        expect(purifyTagsForTripleMustache('a<img>c')).to.be.equal('ac');
+        expect(purifyTripleMustache('a<style>b</style>c')).to.be.equal('ac');
+        expect(purifyTripleMustache('a<img>c')).to.be.equal('ac');
       });
 
       it('should compensate for broken markup', () => {
-        expect(purifyTagsForTripleMustache('<b>a<i>b')).to.be.equal(
+        expect(purifyTripleMustache('<b>a<i>b')).to.be.equal(
           '<b>a<i>b</i></b>'
         );
       });
 
       it('should support list tags', () => {
         const html = '<ol><li></li></ol><ul></ul>';
-        expect(purifyTagsForTripleMustache(html)).to.be.equal(html);
+        expect(purifyTripleMustache(html)).to.be.equal(html);
       });
 
       it('should whitelist formatting related elements', () => {
@@ -558,7 +513,7 @@ describe
         const html = `${whiteListedFormattingTags}${nonWhiteListedTag}`;
         // Expect the purifier to unescape the whitelisted tags and to sanitize
         // and remove the img tag.
-        expect(purifyTagsForTripleMustache(html)).to.be.equal(
+        expect(purifyTripleMustache(html)).to.be.equal(
           whiteListedFormattingTags
         );
       });
@@ -566,6 +521,7 @@ describe
       it('should whitelist table related elements and anchor tags', () => {
         const html =
           '<table class="valid-class">' +
+          '<colgroup><col><col></colgroup>' +
           '<caption>caption</caption>' +
           '<thead><tr><th colspan="2">header</th></tr></thead>' +
           '<tbody><tr><td>' +
@@ -575,14 +531,14 @@ describe
           '<td colspan="2"><span>footer</span></td>' +
           '</tr></tfoot>' +
           '</table>';
-        expect(purifyTagsForTripleMustache(html)).to.be.equal(html);
+        expect(purifyTripleMustache(html)).to.be.equal(html);
       });
 
       it('should sanitize tags, removing unsafe attributes', () => {
         const html =
           '<a href="javascript:alert(\'XSS\')">test</a>' +
           '<img src="x" onerror="alert(\'XSS\')" />';
-        expect(purifyTagsForTripleMustache(html)).to.be.equal('<a>test</a>');
+        expect(purifyTripleMustache(html)).to.be.equal('<a>test</a>');
       });
 
       describe('should sanitize `style` attribute', () => {
@@ -758,24 +714,128 @@ describe
       });
 
       it('should output <use> only if href is relative', () => {
-        const href =
-          '<svg xmlns="http://www.w3.org/2000/svg"><use href="#foo"></use></svg>';
-        expect(purify(href)).to.equal(href);
+        allowConsoleError(() => {
+          const href =
+            '<svg xmlns="http://www.w3.org/2000/svg"><use href="#foo"></use></svg>';
+          expect(purify(href)).to.equal(href);
+
+          const xlink =
+            '<svg xmlns="http://www.w3.org/2000/svg"><use xlink:href="#foo"></use></svg>';
+          expect(purify(xlink)).to.equal(xlink);
+
+          expect(
+            purify(
+              '<svg xmlns="http://www.w3.org/2000/svg"><use href="//evil"></svg>'
+            )
+          ).to.equal('<svg xmlns="http://www.w3.org/2000/svg"></svg>');
+          expect(
+            purify(
+              '<svg xmlns="http://www.w3.org/2000/svg"><use xlink:href="//evil"></svg>'
+            )
+          ).to.equal('<svg xmlns="http://www.w3.org/2000/svg"></svg>');
+        });
+      });
+    });
+  });
 
-        const xlink =
-          '<svg xmlns="http://www.w3.org/2000/svg"><use xlink:href="#foo"></use></svg>';
-        expect(purify(xlink)).to.equal(xlink);
+describe
+  .configure()
+  .skipFirefox()
+  .run('DOMPurify-based, custom html', () => {
+    let html;
+    let purify;
 
-        expect(
-          purify(
-            '<svg xmlns="http://www.w3.org/2000/svg"><use href="//evil"></svg>'
-          )
-        ).to.equal('<svg xmlns="http://www.w3.org/2000/svg"></svg>');
-        expect(
-          purify(
-            '<svg xmlns="http://www.w3.org/2000/svg"><use xlink:href="//evil"></svg>'
-          )
-        ).to.equal('<svg xmlns="http://www.w3.org/2000/svg"></svg>');
+    before(() => {
+      html = document.createElement('html');
+      const doc = {
+        documentElement: html,
+        createElement: tagName => document.createElement(tagName),
+      };
+
+      const purifier = () => new Purifier(doc);
+
+      /**
+       * Helper that serializes output of purifyHtml() to string.
+       * @param {string} html
+       * @return {string}
+       */
+      purify = html => purifier().purifyHtml(html).innerHTML;
+    });
+
+    describe('AMP formats', () => {
+      it('should blacklist input[type="image"] and input[type="button"] in AMP', () => {
+        // Given the AMP format type.
+        html.setAttribute('amp', '');
+        allowConsoleError(() => {
+          expect(purify('<input type="image">')).to.equal('<input>');
+          expect(purify('<input type="button">')).to.equal('<input>');
+        });
+      });
+
+      it('should allow input[type="file"] and input[type="password"]', () => {
+        // Given that the AMP format does not blacklist input types file and
+        // password.
+        html.setAttribute('amp', '');
+        expect(purify('<input type="file">')).to.equal('<input type="file">');
+        expect(purify('<input type="password">')).to.equal(
+          '<input type="password">'
+        );
+      });
+
+      it('should sanitize certain tag attributes for AMP4Email', () => {
+        html.setAttribute('amp4email', '');
+        allowConsoleError(() => {
+          expect(purify('<input type="password">')).to.equal('<input>');
+          expect(purify('<input type="file">')).to.equal('<input>');
+          expect(purify('<form name="form-name"></form>')).to.equal(
+            '<form></form>'
+          );
+          expect(purify('<amp-anim controls></amp-anim>')).to.match(
+            /<amp-anim i-amphtml-key="(\d+)"><\/amp-anim>/
+          );
+        });
+      });
+
+      it('should only allow whitelisted AMP elements in AMP4EMAIL', () => {
+        html.setAttribute('amp4email', '');
+        expect(purify('<amp-analytics>')).to.equal('');
+        expect(purify('<amp-iframe>')).to.equal('');
+        expect(purify('<amp-list>')).to.equal('');
+        expect(purify('<amp-pixel>')).to.equal('');
+        expect(purify('<amp-twitter>')).to.equal('');
+        expect(purify('<amp-video>')).to.equal('');
+        expect(purify('<amp-youtube>')).to.equal('');
+
+        expect(purify('<amp-img>')).to.equal(
+          '<amp-img i-amphtml-ignore=""></amp-img>'
+        );
+        expect(purify('<amp-accordion>')).to.match(
+          /<amp-accordion i-amphtml-key="(\d+)"><\/amp-accordion>/
+        );
+        expect(purify('<amp-anim>')).to.match(
+          /<amp-anim i-amphtml-key="(\d+)"><\/amp-anim>/
+        );
+        expect(purify('<amp-bind-macro>')).to.match(
+          /<amp-bind-macro i-amphtml-key="(\d+)"><\/amp-bind-macro>/
+        );
+        expect(purify('<amp-carousel>')).to.match(
+          /<amp-carousel i-amphtml-key="(\d+)"><\/amp-carousel>/
+        );
+        expect(purify('<amp-fit-text>')).to.match(
+          /<amp-fit-text i-amphtml-key="(\d+)"><\/amp-fit-text>/
+        );
+        expect(purify('<amp-layout>')).to.match(
+          /<amp-layout i-amphtml-key="(\d+)"><\/amp-layout>/
+        );
+        expect(purify('<amp-selector>')).to.match(
+          /<amp-selector i-amphtml-key="(\d+)"><\/amp-selector>/
+        );
+        expect(purify('<amp-sidebar>')).to.match(
+          /<amp-sidebar i-amphtml-key="(\d+)"><\/amp-sidebar>/
+        );
+        expect(purify('<amp-timeago>')).to.match(
+          /<amp-timeago i-amphtml-key="(\d+)"><\/amp-timeago>/
+        );
       });
     });
   });
@@ -785,17 +845,12 @@ describe('validateAttributeChange', () => {
   let vac;
 
   beforeEach(() => {
-    purifier = {
-      isValidAttribute: () => true,
-    };
+    const purify = new Purifier(document);
+    purifier = purify.domPurify_;
+    purifier.isValidAttribute = () => true;
 
     vac = (type, attr, value) =>
-      validateAttributeChange(
-        purifier,
-        document.createElement(type),
-        attr,
-        value
-      );
+      purify.validateAttributeChange(document.createElement(type), attr, value);
   });
 
   it('should validate script[type]', () => {
@@ -854,7 +909,7 @@ describe('getAllowedTags', () => {
   let allowedTags;
 
   beforeEach(() => {
-    allowedTags = getAllowedTags();
+    allowedTags = new Purifier(document).getAllowedTags();
   });
 
   it('should contain html tags', () => {
diff --git a/test/unit/test-resources.js b/test/unit/test-resources.js
index 3bf4115fd3012..69862a4d4068f 100644
--- a/test/unit/test-resources.js
+++ b/test/unit/test-resources.js
@@ -2453,12 +2453,12 @@ describe('Resources changeSize', () => {
       });
     });
 
-    it(
+    it.skip(
       'should change size if in viewport, but only modifying width and ' +
         'reflow is impossible',
       () => {
         const parent = document.createElement('div');
-        parent.getImpl = () => ({getLayoutWidth: () => 222});
+        parent.getLayoutWidth = () => 222;
         const element = document.createElement('div');
         element.overflowCallback = () => {};
         parent.appendChild(element);
diff --git a/test/unit/test-runtime.js b/test/unit/test-runtime.js
index 385c37623ee0c..2ea9acc575db7 100644
--- a/test/unit/test-runtime.js
+++ b/test/unit/test-runtime.js
@@ -1625,7 +1625,7 @@ describes.realWin(
 
         it('should ignore unknown script', () => {
           expectAsyncConsoleError(
-            '[runtime] - unknown script:  [object HTMLScriptElement] ' +
+            '[multidoc-manager] - unknown script:  [object HTMLScriptElement] ' +
               'https://cdn.ampproject.org/other.js'
           );
 
@@ -1711,7 +1711,7 @@ describes.realWin(
 
         it('should ignore inline script if javascript', () => {
           expectAsyncConsoleError(
-            '[runtime] - unallowed inline javascript:  ' +
+            '[multidoc-manager] - unallowed inline javascript:  ' +
               '[object HTMLScriptElement]',
             2
           );
diff --git a/test/unit/test-ssr-template-helper.js b/test/unit/test-ssr-template-helper.js
index 6b1fe5383b415..9babe9b7e4d72 100644
--- a/test/unit/test-ssr-template-helper.js
+++ b/test/unit/test-ssr-template-helper.js
@@ -37,6 +37,7 @@ describes.fakeWin(
       win = env.win;
       templates = Services.templatesFor(win);
       viewer = Services.viewerForDoc(ampdoc);
+      viewer.isTrustedViewer = () => Promise.resolve(true);
       hasCapabilityStub = env.sandbox.stub(viewer, 'hasCapability');
       maybeFindTemplateStub = env.sandbox.stub(templates, 'maybeFindTemplate');
       ssrTemplateHelper = new SsrTemplateHelper(
@@ -52,19 +53,19 @@ describes.fakeWin(
       );
     });
 
-    describe('isSupported', () => {
+    describe('isEnabled', () => {
       it('should return true if doc level opt-in', () => {
         win.document.documentElement.setAttribute(
           'allow-viewer-render-template',
           true
         );
         hasCapabilityStub.withArgs('viewerRenderTemplate').returns(true);
-        expect(ssrTemplateHelper.isSupported()).to.be.true;
+        expect(ssrTemplateHelper.isEnabled()).to.be.true;
       });
 
       it('should return false if not doc level opt-in', () => {
         hasCapabilityStub.withArgs('viewerRenderTemplate').returns(true);
-        expect(ssrTemplateHelper.isSupported()).to.be.false;
+        expect(ssrTemplateHelper.isEnabled()).to.be.false;
       });
 
       it(
@@ -76,13 +77,26 @@ describes.fakeWin(
             true
           );
           hasCapabilityStub.withArgs('viewerRenderTemplate').returns(false);
-          expect(ssrTemplateHelper.isSupported()).to.be.false;
+          expect(ssrTemplateHelper.isEnabled()).to.be.false;
         }
       );
     });
 
     describe('ssr', () => {
-      it('should build payload', () => {
+      it('Should refuse to SSR with an untrusted viewer', async () => {
+        viewer.isTrustedViewer = () => Promise.resolve(false);
+        const errorMsg = /Refused to attempt SSR in untrusted viewer: /;
+        expectAsyncConsoleError(errorMsg);
+
+        return ssrTemplateHelper.ssr({}, {}, {}).then(
+          () => Promise.reject(),
+          err => {
+            expect(err).match(errorMsg);
+          }
+        );
+      });
+
+      it('should build payload', async () => {
         const request = {
           'xhrUrl': 'https://www.abracadabra.org/some-json',
           'fetchOpt': {
@@ -93,15 +107,16 @@ describes.fakeWin(
             'ampCors': true,
           },
         };
-        const sendMessage = env.sandbox.spy(viewer, 'sendMessageAwaitResponse');
+        const sendMessage = env.sandbox
+          .stub(viewer, 'sendMessageAwaitResponse')
+          .returns(Promise.resolve({}));
         maybeFindTemplateStub.returns(null);
         const templates = {
           successTemplate: {'innerHTML': '<div>much success</div>'},
           errorTemplate: {'innerHTML': '<div>try again</div>'},
         };
-        ssrTemplateHelper.ssr({}, request, templates, {
-          attr: 'test',
-        });
+        await ssrTemplateHelper.ssr({}, request, templates, {attr: 'test'});
+
         expect(sendMessage).calledWith('viewerRenderTemplate', {
           'ampComponent': {
             'type': 'amp-list',
@@ -155,14 +170,21 @@ describes.fakeWin(
 
       describe('applySsrOrCsrTemplate', () => {
         it('should set html template', () => {
-          ssrTemplateHelper.applySsrOrCsrTemplate(
-            {},
-            {html: '<div>some template</div>'}
-          );
-          expect(findAndSetHtmlForTemplate).to.have.been.calledWith(
-            {},
-            '<div>some template</div>'
-          );
+          // Not a real document element. This variable is used to ensure the
+          // value returned by findAndSetHtmlForTemplate is returned by
+          // applySsrOrCsrTemplate.
+          const element = {};
+          findAndSetHtmlForTemplate.returns(element);
+
+          return ssrTemplateHelper
+            .applySsrOrCsrTemplate({}, {html: '<div>some template</div>'})
+            .then(renderedHTML => {
+              expect(findAndSetHtmlForTemplate).to.have.been.calledWith(
+                {},
+                '<div>some template</div>'
+              );
+              expect(renderedHTML).to.equal(element);
+            });
         });
 
         it('should throw error if html template is not defined', () => {
@@ -173,6 +195,19 @@ describes.fakeWin(
           });
         });
 
+        it('should throw if trying to ssr from an untrusted viewer', () => {
+          viewer.isTrustedViewer = () => Promise.resolve(false);
+          const errorMsg = /Refused to attempt SSR in untrusted viewer: /;
+          expectAsyncConsoleError(errorMsg);
+
+          ssrTemplateHelper
+            .applySsrOrCsrTemplate({}, {html: '<div>some templates</div>'})
+            .then(
+              () => Promise.reject(),
+              error => expect(error).to.match(errorMsg)
+            );
+        });
+
         it('should render template ', () => {
           hasCapabilityStub.withArgs('viewerRenderTemplate').returns(false);
           ssrTemplateHelper.applySsrOrCsrTemplate(
diff --git a/test/unit/test-standard-actions.js b/test/unit/test-standard-actions.js
index 888bfb5a12279..2e284d9a109ae 100644
--- a/test/unit/test-standard-actions.js
+++ b/test/unit/test-standard-actions.js
@@ -49,7 +49,7 @@ describes.sandboxed('StandardActions', {}, env => {
 
   function stubMutate(methodName) {
     return env.sandbox
-      .stub(standardActions.resources_, methodName)
+      .stub(standardActions.mutator_, methodName)
       .callsFake((unusedElement, mutator) => mutator());
   }
 
@@ -103,7 +103,7 @@ describes.sandboxed('StandardActions', {}, env => {
   }
 
   function trustedInvocation(obj) {
-    return Object.assign({satisfiesTrust: () => true}, obj);
+    return {satisfiesTrust: () => true, ...obj};
   }
 
   function stubPlatformIsIos(isIos = true) {
diff --git a/test/unit/test-style-installer.js b/test/unit/test-style-installer.js
index c566793adabb8..dd73397762ada 100644
--- a/test/unit/test-style-installer.js
+++ b/test/unit/test-style-installer.js
@@ -21,6 +21,7 @@ import {Services} from '../../src/services';
 import {createShadowRoot} from '../../src/shadow-embed';
 import {getStyle} from '../../src/style';
 import {installPerformanceService} from '../../src/service/performance-impl';
+import {installPlatformService} from '../../src/service/platform-impl';
 import {isAnimationNone} from '../../testing/test-helper';
 import {setShadowDomSupportedVersionForTesting} from '../../src/web-components';
 
@@ -36,6 +37,7 @@ describe('Styles', () => {
       win = env.win;
       doc = win.document;
       ampdoc = env.ampdoc;
+      installPlatformService(win);
       installPerformanceService(win);
       const perf = Services.performanceFor(win);
       tickSpy = env.sandbox.spy(perf, 'tick');
diff --git a/test/unit/test-url-replacements.js b/test/unit/test-url-replacements.js
index 8d572fca5765b..9282dc9006eff 100644
--- a/test/unit/test-url-replacements.js
+++ b/test/unit/test-url-replacements.js
@@ -104,15 +104,6 @@ describes.sandboxed('UrlReplacements', {}, env => {
                 });
               });
             }
-            if (opt_options.withStoryVariableService) {
-              markElementScheduledForTesting(iframe.win, 'amp-story');
-              registerServiceBuilder(iframe.win, 'story-variable', function() {
-                return Promise.resolve({
-                  pageIndex: 546,
-                  pageId: 'id-123',
-                });
-              });
-            }
             if (opt_options.withViewerIntegrationVariableService) {
               markElementScheduledForTesting(
                 iframe.win,
@@ -237,7 +228,7 @@ describes.sandboxed('UrlReplacements', {}, env => {
           // Restrict the number of replacement params to globalVariableSource
           // Please consider adding the logic to amp-analytics instead.
           // Please contact @lannka or @zhouyx if the test fail.
-          expect(variables.length).to.equal(70);
+          expect(variables.length).to.equal(67);
         });
       });
 
@@ -794,27 +785,6 @@ describes.sandboxed('UrlReplacements', {}, env => {
         }
       );
 
-      it('should replace STORY_PAGE_INDEX and STORY_PAGE_ID', () => {
-        return expect(
-          expandUrlAsync(
-            '?index=STORY_PAGE_INDEX&id=STORY_PAGE_ID',
-            /*opt_bindings*/ undefined,
-            {withStoryVariableService: true}
-          )
-        ).to.eventually.equal('?index=546&id=id-123');
-      });
-
-      // TODO(#16916): Make this test work with synchronous throws.
-      it.skip(
-        'should replace STORY_PAGE_INDEX and STORY_PAGE_ID' +
-          ' with empty string if amp-story is not configured',
-        () => {
-          return expect(
-            expandUrlAsync('?index=STORY_PAGE_INDEX&id=STORY_PAGE_ID')
-          ).to.eventually.equal('?index=&id=');
-        }
-      );
-
       it('should replace TIMESTAMP', () => {
         return expandUrlAsync('?ts=TIMESTAMP').then(res => {
           expect(res).to.match(/ts=\d+/);
@@ -1188,25 +1158,6 @@ describes.sandboxed('UrlReplacements', {}, env => {
         });
       });
 
-      it('should replace ANCESTOR_ORIGIN', () => {
-        return expect(
-          expandUrlAsync(
-            'ANCESTOR_ORIGIN/recipes',
-            /*opt_bindings*/ undefined,
-            {
-              withViewerIntegrationVariableService: {
-                ancestorOrigin: () => {
-                  return 'http://margarine-paradise.com';
-                },
-                fragmentParam: (param, defaultValue) => {
-                  return param == 'ice_cream' ? '2' : defaultValue;
-                },
-              },
-            }
-          )
-        ).to.eventually.equal('http://margarine-paradise.com/recipes');
-      });
-
       it('should replace FRAGMENT_PARAM with 2', () => {
         const win = getFakeWindow();
         win.location = {originalHash: '#margarine=1&ice=2&cream=3'};
@@ -1217,6 +1168,23 @@ describes.sandboxed('UrlReplacements', {}, env => {
           });
       });
 
+      it('should replace AMP_GEO(ISOCountry) and AMP_GEO', () => {
+        env.sandbox.stub(Services, 'geoForDocOrNull').returns(
+          Promise.resolve({
+            'ISOCountry': 'unknown',
+            'ISOCountryGroups': ['nafta', 'waldo'],
+            'nafta': true,
+            'waldo': true,
+            'matchedISOCountryGroups': ['nafta', 'waldo'],
+          })
+        );
+        return expandUrlAsync('?geo=AMP_GEO,country=AMP_GEO(ISOCountry)').then(
+          res => {
+            expect(res).to.equal('?geo=nafta%2Cwaldo,country=unknown');
+          }
+        );
+      });
+
       it.configure()
         .skipFirefox()
         .run('should accept $expressions', () => {
diff --git a/test/unit/test-validator-integration.js b/test/unit/test-validator-integration.js
index f70810ed18257..0fe24d72f92fd 100644
--- a/test/unit/test-validator-integration.js
+++ b/test/unit/test-validator-integration.js
@@ -19,7 +19,7 @@
 
 import * as eventHelper from '../../src/event-helper';
 import * as mode from '../../src/mode';
-import {maybeValidate} from '../../src/validator-integration';
+import {loadScript, maybeValidate} from '../../src/validator-integration';
 
 describes.fakeWin('validator-integration', {}, env => {
   let loadScriptStub;
@@ -52,4 +52,21 @@ describes.fakeWin('validator-integration', {}, env => {
       expect(loadScriptStub).to.have.been.called;
     });
   });
+
+  describe('loadScript', () => {
+    it('should propagate pre-existing nonces', () => {
+      const scriptEl = env.win.document.createElement('script');
+      scriptEl.setAttribute('nonce', '123');
+      win.document.head.append(scriptEl);
+      loadScriptStub = env.sandbox
+        .stub(eventHelper, 'loadPromise')
+        .returns(Promise.resolve());
+
+      loadScript(win.document, 'http://example.com');
+
+      expect(loadScriptStub).calledWith(
+        env.sandbox.match(el => el.getAttribute('nonce') === '123')
+      );
+    });
+  });
 });
diff --git a/test/unit/test-video-analytics-percentage-tracker.js b/test/unit/test-video-analytics-percentage-tracker.js
index 48428d17b3c28..523e139f94794 100644
--- a/test/unit/test-video-analytics-percentage-tracker.js
+++ b/test/unit/test-video-analytics-percentage-tracker.js
@@ -16,6 +16,7 @@
 
 import {
   AnalyticsPercentageTracker,
+  PERCENTAGE_FREQUENCY_WHEN_PAUSED_MS,
   PERCENTAGE_INTERVAL,
 } from '../../src/service/video-manager-impl';
 import {PlayingStates, VideoEvents} from '../../src/video-interface';
@@ -148,6 +149,30 @@ describes.fakeWin(
         });
       });
 
+      // TODO(#25954): This test is a bit specific and odd, but replicates
+      // what we see in prod. Possibly remove when root cause for video with
+      // duration => no duration is found.
+      [0, NaN, -1, undefined, null].forEach(invalidDuration => {
+        it(`aborts if duration is ${invalidDuration} after initially valid`, () => {
+          const {video} = mockEntry;
+          const durationStub = env.sandbox.stub(video, 'getDuration');
+          durationStub.onFirstCall().returns(1000 /* valid duration */);
+          durationStub.returns(invalidDuration);
+
+          const {element} = video;
+
+          setPlayingState(mockEntry, PlayingStates.PLAYING_MANUAL);
+          tracker.start();
+
+          dispatchLoadedMetadata(element);
+
+          expect(mockTimer.delay).to.always.have.been.calledWith(
+            env.sandbox.match.func,
+            PERCENTAGE_FREQUENCY_WHEN_PAUSED_MS
+          );
+        });
+      });
+
       it('does not trigger if the video is paused', () => {
         const {video} = mockEntry;
         const {element} = video;
diff --git a/test/unit/test-video-iframe-integration.js b/test/unit/test-video-iframe-integration.js
index bded472b25812..3b96e2115ed4e 100644
--- a/test/unit/test-video-iframe-integration.js
+++ b/test/unit/test-video-iframe-integration.js
@@ -119,21 +119,12 @@ describes.realWin('video-iframe-integration', {amp: false}, env => {
     });
 
     describe('#postEvent', () => {
-      it('should reject invalid events', () => {
-        const integration = new AmpVideoIntegration();
-        const invalidEvents = 'tacos al pastor'.split(' ');
-        for (let i = 0; i < invalidEvents.length; i++) {
-          const event = invalidEvents[i];
-          expect(() => integration.postEvent(event)).to.throw(/Invalid event/);
-        }
-      });
-
-      it('should post valid events', () => {
+      it('should post any event', () => {
         const integration = new AmpVideoIntegration();
 
         const postToParent = env.sandbox.stub(integration, 'postToParent_');
 
-        const validEvents = [
+        const events = [
           'canplay',
           'load',
           'playing',
@@ -141,10 +132,13 @@ describes.realWin('video-iframe-integration', {amp: false}, env => {
           'ended',
           'muted',
           'unmuted',
+          'tacos',
+          'al',
+          'pastor',
         ];
 
-        for (let i = 0; i < validEvents.length; i++) {
-          const event = validEvents[i];
+        for (let i = 0; i < events.length; i++) {
+          const event = events[i];
           integration.postEvent(event);
           expect(postToParent.withArgs(env.sandbox.match({event}))).to.have.been
             .calledOnce;
diff --git a/test/unit/test-xhr.js b/test/unit/test-xhr.js
index 2b18c9b98c112..0894a87a3e14e 100644
--- a/test/unit/test-xhr.js
+++ b/test/unit/test-xhr.js
@@ -1142,4 +1142,45 @@ describe
         });
       });
     });
+
+    describe('#xssiJson', () => {
+      let xhr;
+      beforeEach(() => {
+        xhr = xhrServiceForTesting(polyfillWin);
+        setupMockXhr();
+      });
+
+      it('should call response.json() if prefix is either missing or the empty string', () => {
+        xhrCreated.then(mock => mock.respond(200, [], '{a: 1}'));
+        const response = {
+          json: () => Promise.resolve(),
+          text: () => Promise.reject(new Error('should not be called')),
+        };
+
+        return Promise.all([
+          xhr.xssiJson(response),
+          xhr.xssiJson(response, ''),
+        ]);
+      });
+
+      it('should not strip characters if the prefix is not present', () => {
+        xhrCreated.then(mock => mock.respond(200, [], '{"a": 1}'));
+        return xhr
+          .fetchJson('/abc')
+          .then(res => xhr.xssiJson(res, 'while(1)'))
+          .then(json => {
+            expect(json).to.be.deep.equal({a: 1});
+          });
+      });
+
+      it('should strip prefix from the response text if prefix is present', () => {
+        xhrCreated.then(mock => mock.respond(200, [], 'while(1){"a": 1}'));
+        return xhr
+          .fetchJson('/abc')
+          .then(res => xhr.xssiJson(res, 'while(1)'))
+          .then(json => {
+            expect(json).to.be.deep.equal({a: 1});
+          });
+      });
+    });
   });
diff --git a/test/unit/url-expander/test-expander.js b/test/unit/url-expander/test-expander.js
index 3f0c23ffbe0e8..a57526f5298ae 100644
--- a/test/unit/url-expander/test-expander.js
+++ b/test/unit/url-expander/test-expander.js
@@ -160,7 +160,6 @@ describes.realWin(
         ASYNC: Promise.resolve('hello'),
         ASYNCFN: arg => Promise.resolve(arg),
         BROKEN: () => undefined,
-        ANCESTOR_ORIGIN: () => Promise.resolve('https://www.google.com@foo'),
         TITLE: 'hello world ',
       };
 
@@ -255,6 +254,16 @@ describes.realWin(
           input: 'title=TRIM(TITLE)',
           output: 'title=hello%20world',
         },
+        {
+          description: 'should handle backticks inside args',
+          input: 'CONCAT(he`llo`, world)',
+          output: 'hello-world',
+        },
+        {
+          description: 'should handle backticks inside args w/ macros',
+          input: 'TRIM(CANONICAL_URL` `CANONICAL_URL)',
+          output: 'www.google.com%20www.google.com',
+        },
       ];
 
       describe('called asyncronously', () => {
@@ -278,15 +287,6 @@ describes.realWin(
             ).to.eventually.equal(expected);
           });
 
-          it('throws on bad input with back ticks', () => {
-            const url = 'CONCAT(bad`hello`, world)';
-            allowConsoleError(() => {
-              expect(() => {
-                new Expander(variableSource, mockBindings).expand(url);
-              }).to.throw(/bad/);
-            });
-          });
-
           it('should handle tokens with parenthesis next to each other', () => {
             const url =
               'http://www.google.com/?test=RANDOMCLIENT_ID(__ga)UPPERCASE(foo)';
@@ -295,14 +295,6 @@ describes.realWin(
               new Expander(variableSource, mockBindings).expand(url)
             ).to.eventually.equal(expected);
           });
-
-          it('should not encode NOENCODE_WHITELIST', () => {
-            const url = 'ANCESTOR_ORIGIN';
-            const expected = 'https://www.google.com@foo';
-            return expect(
-              new Expander(variableSource, mockBindings).expand(url)
-            ).to.eventually.equal(expected);
-          });
         });
       });
 
@@ -322,20 +314,6 @@ describes.realWin(
         });
 
         describe('unique cases', () => {
-          it('throws on bad input with back ticks', () => {
-            const url = 'CONCAT(bad`hello`, world)';
-            allowConsoleError(() => {
-              expect(() => {
-                new Expander(
-                  variableSource,
-                  mockBindings,
-                  /* opt_collectVars */ undefined,
-                  /* opt_sync */ true
-                ).expand(url);
-              }).to.throw(/bad/);
-            });
-          });
-
           // Console errors allowed for these tests because anytime an async
           // function is called with the sync flag we user.error()
           it('should resolve promise to empty string', () => {
diff --git a/test/visual-diff/visual-tests b/test/visual-diff/visual-tests
index bd6b5d080c6ef..25b9e9e7c3f92 100644
--- a/test/visual-diff/visual-tests
+++ b/test/visual-diff/visual-tests
@@ -685,6 +685,14 @@
         ".i-amphtml-story-loaded",
       ],
     },
+    {
+      "url": "examples/visual-tests/amp-story/amp-story-quiz-sizing-positioning.html",
+      "name": "amp-story-quiz: sizing and positioning",
+      "viewport": {"width": 320, "height": 480},
+      "loading_complete_selectors": [
+        ".i-amphtml-story-loaded",
+      ],
+    },
     {
       "flaky": true,
       // See https://percy.io/ampproject/amphtml/builds/1434487/view/95137509/375?browser=firefox&mode=diff
@@ -733,6 +741,12 @@
       "interactive_tests": "examples/visual-tests/amphtml-ads/adchoices.js",
       "no_base_test": true
     },
+    {
+      "url": "examples/visual-tests/amphtml-ads/amp-fie-static.html",
+      "name": "amphtml-ads: friendly iframe static",
+      "interactive_tests": "examples/visual-tests/amphtml-ads/static.js",
+      "no_base_test": true
+    },
     {
       "url": "examples/visual-tests/amphtml-ads/amp-inabox-adchoices.html",
       "name": "amphtml-ads: inabox adchoices",
@@ -760,5 +774,26 @@
       "loading_complete_selectors": [".i-amphtml-mega-menu-heading"],
       "interactive_tests": "examples/visual-tests/amp-mega-menu/amp-mega-menu.js"
     },
+    {
+      "url": "examples/visual-tests/amp-video-docking/ltr.html",
+      "name": "amp-video-docking (left-to-right)",
+      "viewport": {"width": 800, "height": 600},
+      "interactive_tests": "examples/visual-tests/amp-video-docking/amp-video-docking.js",
+      "loading_complete_selectors": [".i-amphtml-video-component"],
+    },
+    {
+      "url": "examples/visual-tests/amp-video-docking/rtl.html",
+      "name": "amp-video-docking (right-to-left)",
+      "viewport": {"width": 800, "height": 600},
+      "interactive_tests": "examples/visual-tests/amp-video-docking/amp-video-docking.js",
+      "loading_complete_selectors": [".i-amphtml-video-component"],
+    },
+    {
+      "url": "examples/visual-tests/amp-video-docking/slot.html",
+      "name": "amp-video-docking (slot)",
+      "viewport": {"width": 800, "height": 600},
+      "interactive_tests": "examples/visual-tests/amp-video-docking/amp-video-docking.js",
+      "loading_complete_selectors": [".i-amphtml-video-component"],
+    },
   ]
 }
diff --git a/testing/amp-performance-extension/128x128.png b/testing/amp-performance-extension/128x128.png
new file mode 100644
index 0000000000000..1e767c6a516d8
Binary files /dev/null and b/testing/amp-performance-extension/128x128.png differ
diff --git a/testing/amp-performance-extension/16x16.png b/testing/amp-performance-extension/16x16.png
new file mode 100644
index 0000000000000..a94fbd1ebe04e
Binary files /dev/null and b/testing/amp-performance-extension/16x16.png differ
diff --git a/testing/amp-performance-extension/48x48.png b/testing/amp-performance-extension/48x48.png
new file mode 100644
index 0000000000000..bb088beea7341
Binary files /dev/null and b/testing/amp-performance-extension/48x48.png differ
diff --git a/testing/amp-performance-extension/OWNERS b/testing/amp-performance-extension/OWNERS
new file mode 100644
index 0000000000000..cc7bf6cb45708
--- /dev/null
+++ b/testing/amp-performance-extension/OWNERS
@@ -0,0 +1,13 @@
+// For an explanation of the OWNERS rules and syntax, see:
+// https://github.com/ampproject/amp-github-apps/blob/master/owners/OWNERS.example
+
+{
+  rules: [
+    {
+      owners: [
+        {name: 'wassgha', notify: true},
+        {name: 'ampproject/wg-performance'},
+      ],
+    },
+  ],
+}
diff --git a/testing/amp-performance-extension/README.md b/testing/amp-performance-extension/README.md
new file mode 100644
index 0000000000000..d1b8cfcfb1d32
--- /dev/null
+++ b/testing/amp-performance-extension/README.md
@@ -0,0 +1,19 @@
+<!---
+Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# Chrome Extension for Measuring AMP page performance
+
+Install this extension to test existing public AMP docs for performance.
diff --git a/testing/amp-performance-extension/background.js b/testing/amp-performance-extension/background.js
new file mode 100644
index 0000000000000..705a368e9ccd9
--- /dev/null
+++ b/testing/amp-performance-extension/background.js
@@ -0,0 +1,24 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/* eslint-disable no-undef */
+chrome.browserAction.setBadgeText({
+  text: 'ON',
+});
+chrome.browserAction.setBadgeBackgroundColor({
+  color: '#15a341',
+});
+/* eslint-enable no-undef */
diff --git a/testing/amp-performance-extension/manifest.json b/testing/amp-performance-extension/manifest.json
new file mode 100644
index 0000000000000..9f2a6409d9c2e
--- /dev/null
+++ b/testing/amp-performance-extension/manifest.json
@@ -0,0 +1,32 @@
+{
+  "name": "AMP Performance Measurement",
+  "version": "0.0.1",
+  "manifest_version": 2,
+  "description": "Measure the performance of AMP pages.",
+  "homepage_url": "https://www.ampproject.org",
+  "icons": {
+    "16": "16x16.png",
+    "48": "48x48.png",
+    "128": "128x128.png"
+  },
+  "browser_action": {
+    "default_icon": {
+      "16": "16x16.png",
+      "48": "48x48.png",
+      "128": "128x128.png"
+    },
+    "default_title": "AMP Performance"
+  },
+  "background": {
+    "scripts": ["background.js"],
+    "persistent": false
+  },
+  "content_scripts": [
+    {
+      "matches": ["<all_urls>"],
+      "run_at": "document_start",
+      "js": ["measure.js"]
+    }
+  ],
+  "permissions": ["activeTab", "*://*/*"]
+}
diff --git a/testing/amp-performance-extension/measure.js b/testing/amp-performance-extension/measure.js
new file mode 100644
index 0000000000000..e461719e13a31
--- /dev/null
+++ b/testing/amp-performance-extension/measure.js
@@ -0,0 +1,209 @@
+/**
+ * Copyright 2020 The AMP HTML Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// eslint-disable-next-line no-unused-vars
+let cumulativeLayoutShift, largestContentfulPaint, longTasks, measureStarted;
+
+function renderMeasurement(container, label, count) {
+  container./*OK*/ innerHTML += `<div class='i-amphtml-performance-line'>
+    <div class="i-amphtml-performance-label">${label}</div>
+    <div class="i-amphtml-performance-count">${count.toFixed(4)}</div>
+  </div>`;
+  return container.lastElementChild.lastElementChild;
+}
+
+function addStyleString(root, str) {
+  const node = document.createElement('style');
+  node./*OK*/ textContent = str;
+  root.appendChild(node);
+}
+
+function measureCLS() {
+  const supported = PerformanceObserver.supportedEntryTypes;
+  if (!supported || supported.indexOf('layout-shift') === -1) {
+    return;
+  }
+  cumulativeLayoutShift = 0;
+  const layoutShiftObserver = new PerformanceObserver(list =>
+    list
+      .getEntries()
+      .filter(entry => !entry.hadRecentInput)
+      .forEach(entry => (cumulativeLayoutShift += entry.value))
+  );
+  layoutShiftObserver.observe({type: 'layout-shift', buffered: true});
+}
+
+function measureLargestContentfulPaint() {
+  const supported = PerformanceObserver.supportedEntryTypes;
+  if (!supported || supported.indexOf('largest-contentful-paint') === -1) {
+    return;
+  }
+  largestContentfulPaint = 0;
+  const largestContentfulPaintObserver = new PerformanceObserver(list => {
+    const entries = list.getEntries();
+    const entry = entries[entries.length - 1];
+    largestContentfulPaint = entry.renderTime || entry.loadTime;
+  });
+  largestContentfulPaintObserver.observe({
+    type: 'largest-contentful-paint',
+    buffered: true,
+  });
+}
+
+function measureLongTasks() {
+  const supported = PerformanceObserver.supportedEntryTypes;
+  if (!supported || supported.indexOf('longtask') === -1) {
+    return;
+  }
+  longTasks = [];
+  const longTaskObserver = new PerformanceObserver(list =>
+    list.getEntries().forEach(entry => longTasks.push(entry))
+  );
+  longTaskObserver.observe({entryTypes: ['longtask']});
+}
+
+function measureTimeToInteractive() {
+  measureStarted = Date.now();
+}
+
+function getMaxFirstInputDelay(firstContentfulPaint) {
+  let longest = 0;
+
+  longTasks.forEach(longTask => {
+    if (
+      longTask.startTime > firstContentfulPaint &&
+      longTask.duration > longest
+    ) {
+      longest = longTask.duration;
+    }
+  });
+
+  return longest;
+}
+
+function getMetric(name) {
+  const entries = performance.getEntries();
+  const entry = entries.find(entry => entry.name === name);
+  return entry ? entry.startTime : 0;
+}
+
+// function getTimeToInteractive() {
+//   return Date.now() - measureStarted;
+// }
+
+measureLongTasks();
+measureCLS();
+measureTimeToInteractive();
+measureLargestContentfulPaint();
+
+document.addEventListener('DOMContentLoaded', function() {
+  // Create a container for the metrics that is CSS-isolated from the host page
+  const resultContainer = document.createElement('div');
+  const shadow = resultContainer.attachShadow({mode: 'open'});
+  const result = document.createElement('div');
+  result.setAttribute('id', 'i-amphtml-performance-result');
+  shadow.appendChild(result);
+  addStyleString(
+    result,
+    `
+        #i-amphtml-performance-result {
+            position: fixed;
+            top: 10px;
+            left: 10px;
+            background-color: #000000aa;
+            padding: 10px;
+            color: white;
+            z-index: 99999;
+            pointer-events: none;
+            width: 200px;
+            overflow: hidden;
+        }
+        
+        .i-amphtml-performance-line {
+            display: flex;
+            flex-direction: row;
+            flex-wrap: nowrap;
+            justify-content: space-between;
+            font-size: 12px;
+        }
+        
+        .i-amphtml-performance-count {
+            margin-left: 8px;
+            font-weight: bold;
+        }
+  `
+  );
+
+  // TODO(wassgha): Implement an expanded view where these metrics are shown
+
+  // Visible
+  // const visible = getMetric('visible');
+  // const vis = renderMeasurement(result, 'visible', visible);
+
+  // First paint
+  // const firstPaint = getMetric('first-paint');
+  // const fp = renderMeasurement(result, 'firstPaint', firstPaint);
+
+  // First contentful paint
+  const firstContentfulPaint = getMetric('first-contentful-paint');
+  // const fcp = renderMeasurement(
+  //   result,
+  //   'firstContentfulPaint',
+  //   firstContentfulPaint
+  // );
+
+  // Time to interactive
+  // renderMeasurement(result, 'timeToInteractive', getTimeToInteractive());
+
+  // Largest contentful paint
+  const lcp = renderMeasurement(
+    result,
+    'largestContentfulPaint',
+    largestContentfulPaint
+  );
+
+  // Max first input delay
+  const mfid = renderMeasurement(
+    result,
+    'maxFirstInputDelay',
+    getMaxFirstInputDelay(firstContentfulPaint)
+  );
+
+  // Load CLS
+  renderMeasurement(result, 'loadCLS', cumulativeLayoutShift * 100);
+
+  // Instantaneous CLS
+  const instCLS = renderMeasurement(
+    result,
+    'instantaneousCLS',
+    cumulativeLayoutShift * 100
+  );
+
+  // Insert result
+  document.body.insertBefore(resultContainer, document.body.firstChild);
+
+  // Instaneous measurement updates
+  setInterval(() => {
+    instCLS./*OK*/ innerText = (cumulativeLayoutShift * 100).toFixed(4);
+    // vis.innerText = getMetric('visible').toFixed(4);
+    // fp.innerText = getMetric('first-paint').toFixed(4);
+    // fcp.innerText = getMetric('first-contentful-paint').toFixed(4);
+    lcp./*OK*/ innerText = largestContentfulPaint.toFixed(4);
+    mfid./*OK*/ innerText = getMaxFirstInputDelay(
+      getMetric('first-contentful-paint')
+    ).toFixed(4);
+  }, 250);
+});
diff --git a/testing/describes.js b/testing/describes.js
index 934c4d5cd8f78..67fd66f206e7d 100644
--- a/testing/describes.js
+++ b/testing/describes.js
@@ -109,8 +109,8 @@ import {installFriendlyIframeEmbed} from '../src/friendly-iframe-embed';
 import {maybeTrackImpression} from '../src/impression';
 import {resetScheduledElementForTesting} from '../src/service/custom-element-registry';
 import {setStyles} from '../src/style';
-import fetchMock from 'fetch-mock';
-import sinon from 'sinon'; // eslint-disable-line local/no-import
+import fetchMock from 'fetch-mock/es5/client-bundle';
+import sinon from /*OK*/ 'sinon';
 
 /** Should have something in the name, otherwise nothing is shown. */
 const SUB = ' ';
@@ -648,10 +648,7 @@ class RealWinFixture {
         } else {
           // The anonymous class parameter allows us to detect native classes
           // vs transpiled classes.
-          installCustomElements(
-            win,
-            NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined
-          );
+          installCustomElements(win, class {});
         }
 
         // Intercept event listeners
@@ -795,7 +792,7 @@ class AmpFixture {
     /**
      * Creates a custom element without registration.
      * @param {string=} opt_name
-     * @param {function(new:./base-element.BaseElement, !Element)} opt_implementationClass
+     * @param {typeof ./base-element.BaseElement} opt_implementationClass
      * @return {!AmpElement}
      */
     env.createAmpElement = createAmpElement.bind(null, win);
@@ -926,7 +923,7 @@ function installAmpAdStylesPromise(win) {
  * Creates a custom element without registration.
  * @param {!Window} win
  * @param {string=} opt_name
- * @param {function(new:./base-element.BaseElement, !Element)} opt_implementationClass
+ * @param {typeof ./base-element.BaseElement} opt_implementationClass
  * @return {!AmpElement}
  */
 function createAmpElement(win, opt_name, opt_implementationClass) {
diff --git a/testing/fake-dom.js b/testing/fake-dom.js
index b9c1ce5f0a164..258f885edce7d 100644
--- a/testing/fake-dom.js
+++ b/testing/fake-dom.js
@@ -253,6 +253,11 @@ export class FakeWindow {
      * @const
      */
     this.requestAnimationFrame = raf;
+
+    // Styles.
+    this.getComputedStyle = function() {
+      return window.getComputedStyle.apply(window, arguments);
+    };
   }
 
   /** polyfill addEventListener. */
@@ -459,7 +464,7 @@ export class FakeLocation {
    */
   change_(args) {
     const change = parseUrlDeprecated(this.url_.href);
-    Object.assign({}, change, args);
+    ({...change, ...args});
     this.changes.push(change);
   }
 
diff --git a/testing/iframe.js b/testing/iframe.js
index 6e4f5c31b849d..5aa6a38173f39 100644
--- a/testing/iframe.js
+++ b/testing/iframe.js
@@ -245,10 +245,7 @@ export function createIframePromise(opt_runtimeOff, opt_beforeLayoutCallback) {
       installRuntimeServices(iframe.contentWindow);
       // The anonymous class parameter allows us to detect native classes vs
       // transpiled classes.
-      installCustomElements(
-        iframe.contentWindow,
-        NATIVE_CUSTOM_ELEMENTS_V1 ? class {} : undefined
-      );
+      installCustomElements(iframe.contentWindow, class {});
       installAmpdocServices(ampdoc);
       Services.resourcesForDoc(ampdoc).ampInitComplete();
       // Act like no other elements were loaded by default.
diff --git a/third_party/aog-payjs/LICENSE b/third_party/aog-payjs/LICENSE
new file mode 100644
index 0000000000000..ff9ad4530f571
--- /dev/null
+++ b/third_party/aog-payjs/LICENSE
@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       https://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
diff --git a/third_party/aog-payjs/README.amp b/third_party/aog-payjs/README.amp
new file mode 100644
index 0000000000000..d6060cbe80838
--- /dev/null
+++ b/third_party/aog-payjs/README.amp
@@ -0,0 +1,15 @@
+URL: https://github.com/google/payjs
+License: Apache 2.0
+License File: https://github.com/google/payjs/blob/master/LICENSE
+
+Description:
+Copy of Google Pay integration library
+
+Local Modifications:
+Removed bazel build files
+
+Creating bundled payjs.js file:
+1) Install rollup : yarn global add rollup
+2) Include all third party files/libraries in this directory
+3) Run rollup : rollup payjs.js --file FINAL_FILE_NAME --format esm
+4) Remove all files/directories other than generated file
diff --git a/third_party/aog-payjs/payjs.js b/third_party/aog-payjs/payjs.js
new file mode 100644
index 0000000000000..a699b0c7c4007
--- /dev/null
+++ b/third_party/aog-payjs/payjs.js
@@ -0,0 +1,3348 @@
+/** @license
+Math.uuid.js (v1.4)
+http://www.broofa.com
+mailto:robert@broofa.com
+Copyright (c) 2010 Robert Kieffer
+Dual licensed under the MIT and GPL licenses.
+*/
+
+/*
+ * Generate a random uuid.
+ *
+ * USAGE: Math.uuid(length, radix)
+ *   length - the desired number of characters
+ *   radix  - the number of allowable values for each character.
+ *
+ * EXAMPLES:
+ *   // No arguments  - returns RFC4122, version 4 ID
+ *   >>> Math.uuid()
+ *   "92329D39-6F5C-4520-ABFC-AAB64544E172"
+ *
+ *   // One argument - returns ID of the specified length
+ *   >>> Math.uuid(15)     // 15 character ID (default base=62)
+ *   "VcydxgltxrVZSTV"
+ *
+ *   // Two arguments - returns ID of the specified length, and radix. (Radix must be <= 62)
+ *   >>> Math.uuid(8, 2)  // 8 character ID (base=2)
+ *   "01001010"
+ *   >>> Math.uuid(8, 10) // 8 character ID (base=10)
+ *   "47473046"
+ *   >>> Math.uuid(8, 16) // 8 character ID (base=16)
+ *   "098F4D35"
+ */
+
+
+class Random_uuid {}
+// Private array of chars to use
+var CHARS = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
+
+Random_uuid.uuid = function (len, radix) {
+  var chars = CHARS, uuid = [], i;
+  radix = radix || chars.length;
+
+  if (len) {
+    // Compact form
+    for (i = 0; i < len; i++) uuid[i] = chars[0 | Math.random()*radix];
+  } else {
+    // rfc4122, version 4 form
+    var r;
+
+    // rfc4122 requires these characters
+    uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-';
+    uuid[14] = '4';
+
+    // Fill in random data.  At i==19 set the high bits of clock sequence as
+    // per rfc4122, sec. 4.1.5
+    for (i = 0; i < 36; i++) {
+      if (!uuid[i]) {
+        r = 0 | Math.random()*16;
+        uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
+      }
+    }
+  }
+
+  return uuid.join('');
+};
+
+// A more performant, but slightly bulkier, RFC4122v4 solution.  We boost performance
+// by minimizing calls to random()
+Random_uuid.uuidFast = function() {
+  var chars = CHARS, uuid = new Array(36), rnd=0, r;
+  for (var i = 0; i < 36; i++) {
+    if (i==8 || i==13 ||  i==18 || i==23) {
+      uuid[i] = '-';
+    } else if (i==14) {
+      uuid[i] = '4';
+    } else {
+      if (rnd <= 0x02) rnd = 0x2000000 + (Math.random()*0x1000000)|0;
+      r = rnd & 0xf;
+      rnd = rnd >> 4;
+      uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
+    }
+  }
+  return uuid.join('');
+};
+
+// A more compact, but less performant, RFC4122v4 solution:
+Random_uuid.uuidCompact = function() {
+  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
+    var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
+    return v.toString(16);
+  });
+};
+
+/**
+ * @fileoverview Import from Web Activities project
+ * (https://github.com/google/web-activities).
+ */
+
+/**
+ * @license
+ * Copyright 2017 The Web Activities Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /** Version: 1.12 */
+
+
+/**
+ * @enum {string}
+ */
+const ActivityMode = {
+  IFRAME: 'iframe',
+  POPUP: 'popup',
+  REDIRECT: 'redirect',
+};
+
+
+/**
+ * The result code used for `ActivityResult`.
+ * @enum {string}
+ */
+const ActivityResultCode = {
+  OK: 'ok',
+  CANCELED: 'canceled',
+  FAILED: 'failed',
+};
+
+/**
+ * The result of an activity. The activity implementation returns this object
+ * for a successful result, a cancelation or a failure.
+ * @struct
+ */
+class ActivityResult {
+  /**
+   * @param {!ActivityResultCode} code
+   * @param {*} data
+   * @param {!ActivityMode} mode
+   * @param {string} origin
+   * @param {boolean} originVerified
+   * @param {boolean} secureChannel
+   */
+  constructor(code, data, mode, origin, originVerified, secureChannel) {
+    /** @const {!ActivityResultCode} */
+    this.code = code;
+    /** @const {*} */
+    this.data = code == ActivityResultCode.OK ? data : null;
+    /** @const {!ActivityMode} */
+    this.mode = mode;
+    /** @const {string} */
+    this.origin = origin;
+    /** @const {boolean} */
+    this.originVerified = originVerified;
+    /** @const {boolean} */
+    this.secureChannel = secureChannel;
+    /** @const {boolean} */
+    this.ok = code == ActivityResultCode.OK;
+    /** @const {?Error} */
+    this.error = code == ActivityResultCode.FAILED ?
+        new Error(String(data) || '') :
+        null;
+  }
+}
+
+
+const SENTINEL = '__ACTIVITIES__';
+
+/**
+ * The messenger helper for activity's port and host.
+ */
+class Messenger {
+
+  /**
+   * @param {!Window} win
+   * @param {!Window|function():?Window} targetOrCallback
+   * @param {?string} targetOrigin
+   */
+  constructor(win, targetOrCallback, targetOrigin) {
+    /** @private @const {!Window} */
+    this.win_ = win;
+    /** @private @const {!Window|function():?Window} */
+    this.targetOrCallback_ = targetOrCallback;
+
+    /**
+     * May start as unknown (`null`) until received in the first message.
+     * @private {?string}
+     */
+    this.targetOrigin_ = targetOrigin;
+
+    /** @private {?Window} */
+    this.target_ = null;
+
+    /** @private {boolean} */
+    this.acceptsChannel_ = false;
+
+    /** @private {?MessagePort} */
+    this.port_ = null;
+
+    /** @private {?function(string, ?Object)} */
+    this.onCommand_ = null;
+
+    /** @private {?function(!Object)} */
+    this.onCustomMessage_ = null;
+
+    /**
+     * @private {?Object<string, !ChannelHolder>}
+     */
+    this.channels_ = null;
+
+    /** @private @const */
+    this.boundHandleEvent_ = this.handleEvent_.bind(this);
+  }
+
+  /**
+   * Connect the port to the host or vice versa.
+   * @param {function(string, ?Object)} onCommand
+   */
+  connect(onCommand) {
+    if (this.onCommand_) {
+      throw new Error('already connected');
+    }
+    this.onCommand_ = onCommand;
+    this.win_.addEventListener('message', this.boundHandleEvent_);
+  }
+
+  /**
+   * Disconnect messenger.
+   */
+  disconnect() {
+    if (this.onCommand_) {
+      this.onCommand_ = null;
+      if (this.port_) {
+        closePort(this.port_);
+        this.port_ = null;
+      }
+      this.win_.removeEventListener('message', this.boundHandleEvent_);
+      if (this.channels_) {
+        for (const k in this.channels_) {
+          const channelObj = this.channels_[k];
+          if (channelObj.port1) {
+            closePort(channelObj.port1);
+          }
+          if (channelObj.port2) {
+            closePort(channelObj.port2);
+          }
+        }
+        this.channels_ = null;
+      }
+    }
+  }
+
+  /**
+   * Returns whether the messenger has been connected already.
+   * @return {boolean}
+   */
+  isConnected() {
+    return this.targetOrigin_ != null;
+  }
+
+  /**
+   * Returns the messaging target. Only available when connection has been
+   * establihsed.
+   * @return {!Window}
+   */
+  getTarget() {
+    const target = this.getOptionalTarget_();
+    if (!target) {
+      throw new Error('not connected');
+    }
+    return target;
+  }
+
+  /**
+   * @return {?Window}
+   * @private
+   */
+  getOptionalTarget_() {
+    if (this.onCommand_ && !this.target_) {
+      if (typeof this.targetOrCallback_ == 'function') {
+        this.target_ = this.targetOrCallback_();
+      } else {
+        this.target_ = /** @type {!Window} */ (this.targetOrCallback_);
+      }
+    }
+    return this.target_;
+  }
+
+  /**
+   * Returns the messaging origin. Only available when connection has been
+   * establihsed.
+   * @return {string}
+   */
+  getTargetOrigin() {
+    if (this.targetOrigin_ == null) {
+      throw new Error('not connected');
+    }
+    return this.targetOrigin_;
+  }
+
+  /**
+   * The host sends this message to the client to indicate that it's ready to
+   * start communicating. The client is expected to respond back with the
+   * "start" command. See `sendStartCommand` method.
+   */
+  sendConnectCommand() {
+    this.sendCommand('connect', {'acceptsChannel': true});
+  }
+
+  /**
+   * The client sends this message to the host upon receiving the "connect"
+   * message to start the main communication channel. As a payload, the message
+   * will contain the provided start arguments.
+   * @param {?Object} args
+   */
+  sendStartCommand(args) {
+    let channel = null;
+    if (this.acceptsChannel_ && typeof this.win_.MessageChannel == 'function') {
+      channel = new this.win_.MessageChannel();
+    }
+    if (channel) {
+      this.sendCommand('start', args, [channel.port2]);
+      // It's critical to switch to port messaging only after "start" has been
+      // sent. Otherwise, it won't be delivered.
+      this.switchToChannel_(channel.port1);
+    } else {
+      this.sendCommand('start', args);
+    }
+  }
+
+  /**
+   * Sends the specified command from the port to the host or vice versa.
+   * @param {string} cmd
+   * @param {?Object=} opt_payload
+   * @param {?Array=} opt_transfer
+   */
+  sendCommand(cmd, opt_payload, opt_transfer) {
+    const data = {
+      'sentinel': SENTINEL,
+      'cmd': cmd,
+      'payload': opt_payload || null,
+    };
+    if (this.port_) {
+      this.port_.postMessage(data, opt_transfer || undefined);
+    } else {
+      const target = this.getTarget();
+      // Only "connect" command is allowed to use `targetOrigin == '*'`
+      const targetOrigin =
+          cmd == 'connect' ?
+          (this.targetOrigin_ != null ? this.targetOrigin_ : '*') :
+          this.getTargetOrigin();
+      target.postMessage(data, targetOrigin, opt_transfer || undefined);
+    }
+  }
+
+  /**
+   * Sends a message to the client.
+   * @param {!Object} payload
+   */
+  customMessage(payload) {
+    this.sendCommand('msg', payload);
+  }
+
+  /**
+   * Registers a callback to receive messages from the client.
+   * @param {function(!Object)} callback
+   */
+  onCustomMessage(callback) {
+    this.onCustomMessage_ = callback;
+  }
+
+  /**
+   * @param {string=} opt_name
+   * @return {!Promise<!MessagePort>}
+   */
+  startChannel(opt_name) {
+    const name = opt_name || '';
+    const channelObj = this.getChannelObj_(name);
+    if (!channelObj.port1) {
+      const channel = new this.win_.MessageChannel();
+      channelObj.port1 = channel.port1;
+      channelObj.port2 = channel.port2;
+      channelObj.resolver(channelObj.port1);
+    }
+    if (channelObj.port2) {
+      // Not yet sent.
+      this.sendCommand('cnset', {'name': name}, [channelObj.port2]);
+      channelObj.port2 = null;
+    }
+    return channelObj.promise;
+  }
+
+  /**
+   * @param {string=} opt_name
+   * @return {!Promise<!MessagePort>}
+   */
+  askChannel(opt_name) {
+    const name = opt_name || '';
+    const channelObj = this.getChannelObj_(name);
+    if (!channelObj.port1) {
+      this.sendCommand('cnget', {'name': name});
+    }
+    return channelObj.promise;
+  }
+
+  /**
+   * @param {string} name
+   * @param {!MessagePort} port
+   * @private
+   */
+  receiveChannel_(name, port) {
+    const channelObj = this.getChannelObj_(name);
+    channelObj.port1 = port;
+    channelObj.resolver(port);
+  }
+
+  /**
+   * @param {string} name
+   * @return {!ChannelHolder}
+   */
+  getChannelObj_(name) {
+    if (!this.channels_) {
+      this.channels_ = {};
+    }
+    let channelObj = this.channels_[name];
+    if (!channelObj) {
+      let resolver;
+      const promise = new Promise(resolve => {
+        resolver = resolve;
+      });
+      channelObj = {
+        port1: null,
+        port2: null,
+        resolver,
+        promise,
+      };
+      this.channels_[name] = channelObj;
+    }
+    return channelObj;
+  }
+
+  /**
+   * @param {!MessagePort} port
+   * @private
+   */
+  switchToChannel_(port) {
+    if (this.port_) {
+      closePort(this.port_);
+    }
+    this.port_ = port;
+    this.port_.onmessage = event => {
+      const data = event.data;
+      const cmd = data && data['cmd'];
+      const payload = data && data['payload'] || null;
+      if (cmd) {
+        this.handleCommand_(cmd, payload, event);
+      }
+    };
+    // Even though all messaging will switch to ports, the window-based message
+    // listener will be preserved just in case the host is refreshed and needs
+    // another connection.
+  }
+
+  /**
+   * @param {!Event} event
+   * @private
+   */
+  handleEvent_(event) {
+    const data = event.data;
+    if (!data || data['sentinel'] != SENTINEL) {
+      return;
+    }
+    const cmd = data['cmd'];
+    if (this.port_ && cmd != 'connect' && cmd != 'start') {
+      // Messaging channel has already taken over. However, the "connect" and
+      // "start" commands are allowed to proceed in case re-connection is
+      // requested.
+      return;
+    }
+    const origin = /** @type {string} */ (event.origin);
+    const payload = data['payload'] || null;
+    if (this.targetOrigin_ == null && cmd == 'start') {
+      this.targetOrigin_ = origin;
+    }
+    if (this.targetOrigin_ == null && event.source) {
+      if (this.getOptionalTarget_() == event.source) {
+        this.targetOrigin_ = origin;
+      }
+    }
+    // Notice that event.source may differ from the target because of
+    // friendly-iframe intermediaries.
+    if (origin != this.targetOrigin_) {
+      return;
+    }
+    this.handleCommand_(cmd, payload, event);
+  }
+
+  /**
+   * @param {string} cmd
+   * @param {?Object} payload
+   * @param {!Event} event
+   * @private
+   */
+  handleCommand_(cmd, payload, event) {
+    if (cmd == 'connect') {
+      if (this.port_) {
+        // In case the port has already been open - close it to reopen it
+        // again later.
+        closePort(this.port_);
+        this.port_ = null;
+      }
+      this.acceptsChannel_ = payload && payload['acceptsChannel'] || false;
+      this.onCommand_(cmd, payload);
+    } else if (cmd == 'start') {
+      const port = event.ports && event.ports[0];
+      if (port) {
+        this.switchToChannel_(port);
+      }
+      this.onCommand_(cmd, payload);
+    } else if (cmd == 'msg') {
+      if (this.onCustomMessage_ != null && payload != null) {
+        this.onCustomMessage_(payload);
+      }
+    } else if (cmd == 'cnget') {
+      const name = payload['name'];
+      this.startChannel(name);
+    } else if (cmd == 'cnset') {
+      const name = payload['name'];
+      const port = event.ports[0];
+      this.receiveChannel_(name, /** @type {!MessagePort} */ (port));
+    } else {
+      this.onCommand_(cmd, payload);
+    }
+  }
+}
+
+
+/**
+ * @param {!MessagePort} port
+ */
+function closePort(port) {
+  try {
+    port.close();
+  } catch (e) {
+    // Ignore.
+  }
+}
+
+
+
+/** DOMException.ABORT_ERR name */
+const ABORT_ERR_NAME = 'AbortError';
+
+/** DOMException.ABORT_ERR = 20 */
+const ABORT_ERR_CODE = 20;
+
+/** @type {?HTMLAnchorElement} */
+let aResolver;
+
+
+/**
+ * @param {string} urlString
+ * @return {!HTMLAnchorElement}
+ */
+function parseUrl(urlString) {
+  if (!aResolver) {
+    aResolver = /** @type {!HTMLAnchorElement} */ (document.createElement('a'));
+  }
+  aResolver.href = urlString;
+  return /** @type {!HTMLAnchorElement} */ (aResolver);
+}
+
+
+/**
+ * @param {!Location|!URL|!HTMLAnchorElement} loc
+ * @return {string}
+ */
+function getOrigin(loc) {
+  return loc.origin || loc.protocol + '//' + loc.host;
+}
+
+
+/**
+ * @param {string} urlString
+ * @return {string}
+ */
+function getOriginFromUrl(urlString) {
+  return getOrigin(parseUrl(urlString));
+}
+
+
+/**
+ * @param {string} urlString
+ * @return {string}
+ */
+function removeFragment(urlString) {
+  const index = urlString.indexOf('#');
+  if (index == -1) {
+    return urlString;
+  }
+  return urlString.substring(0, index);
+}
+
+
+/**
+ * Parses and builds Object of URL query string.
+ * @param {string} query The URL query string.
+ * @return {!Object<string, string>}
+ */
+function parseQueryString(query) {
+  if (!query) {
+    return {};
+  }
+  return (/^[?#]/.test(query) ? query.slice(1) : query)
+      .split('&')
+      .reduce((params, param) => {
+        const item = param.split('=');
+        const key = decodeURIComponent(item[0] || '');
+        const value = decodeURIComponent(item[1] || '');
+        if (key) {
+          params[key] = value;
+        }
+        return params;
+      }, {});
+}
+
+
+/**
+ * @param {string} queryString  A query string in the form of "a=b&c=d". Could
+ *   be optionally prefixed with "?" or "#".
+ * @param {string} param The param to get from the query string.
+ * @return {?string}
+ */
+function getQueryParam(queryString, param) {
+  return parseQueryString(queryString)[param];
+}
+
+
+/**
+ * Add a query-like parameter to the fragment string.
+ * @param {string} url
+ * @param {string} param
+ * @param {string} value
+ * @return {string}
+ */
+function addFragmentParam(url, param, value) {
+  return url +
+      (url.indexOf('#') == -1 ? '#' : '&') +
+      encodeURIComponent(param) + '=' + encodeURIComponent(value);
+}
+
+
+/**
+ * @param {string} queryString  A query string in the form of "a=b&c=d". Could
+ *   be optionally prefixed with "?" or "#".
+ * @param {string} param The param to remove from the query string.
+ * @return {?string}
+ */
+function removeQueryParam(queryString, param) {
+  if (!queryString) {
+    return queryString;
+  }
+  const search = encodeURIComponent(param) + '=';
+  let index = -1;
+  do {
+    index = queryString.indexOf(search, index);
+    if (index != -1) {
+      const prev = index > 0 ? queryString.substring(index - 1, index) : '';
+      if (prev == '' || prev == '?' || prev == '#' || prev == '&') {
+        let end = queryString.indexOf('&', index + 1);
+        if (end == -1) {
+          end = queryString.length;
+        }
+        queryString =
+            queryString.substring(0, index) +
+            queryString.substring(end + 1);
+      } else {
+        index++;
+      }
+    }
+  } while (index != -1 && index < queryString.length);
+  return queryString;
+}
+
+
+/**
+ * @param {!ActivityRequest} request
+ * @return {string}
+ */
+function serializeRequest(request) {
+  const map = {
+    'requestId': request.requestId,
+    'returnUrl': request.returnUrl,
+    'args': request.args,
+  };
+  if (request.origin !== undefined) {
+    map['origin'] = request.origin;
+  }
+  if (request.originVerified !== undefined) {
+    map['originVerified'] = request.originVerified;
+  }
+  return JSON.stringify(map);
+}
+
+
+/**
+ * Creates or emulates a DOMException of AbortError type.
+ * See https://heycam.github.io/webidl/#aborterror.
+ * @param {!Window} win
+ * @param {string=} opt_message
+ * @return {!DOMException}
+ */
+function createAbortError(win, opt_message) {
+  const message = 'AbortError' + (opt_message ? ': ' + opt_message : '');
+  let error = null;
+  if (typeof win['DOMException'] == 'function') {
+    // TODO(dvoytenko): remove typecast once externs are fixed.
+    const constr = /** @type {function(new:DOMException, string, string)} */ (
+        win['DOMException']);
+    try {
+      error = new constr(message, ABORT_ERR_NAME);
+    } catch (e) {
+      // Ignore. In particular, `new DOMException()` fails in Edge.
+    }
+  }
+  if (!error) {
+    // TODO(dvoytenko): remove typecast once externs are fixed.
+    const constr = /** @type {function(new:DOMException, string)} */ (
+        Error);
+    error = new constr(message);
+    error.name = ABORT_ERR_NAME;
+    error.code = ABORT_ERR_CODE;
+  }
+  return error;
+}
+
+
+/**
+ * Resolves the activity result as a promise:
+ *  - `OK` result is yielded as the promise's payload;
+ *  - `CANCEL` result is rejected with the `AbortError`;
+ *  - `FAILED` result is rejected with the embedded error.
+ *
+ * @param {!Window} win
+ * @param {!ActivityResult} result
+ * @param {function((!ActivityResult|!Promise))} resolver
+ */
+function resolveResult(win, result, resolver) {
+  if (result.ok) {
+    resolver(result);
+  } else {
+    const error = result.error || createAbortError(win);
+    error.activityResult = result;
+    resolver(Promise.reject(error));
+  }
+}
+
+
+
+/**
+ * The `ActivityPort` implementation for the iframe case. Unlike other types
+ * of activities, iframe-based activities are always connected and can react
+ * to size requests.
+ *
+ * @implements {ActivityPort}
+ */
+class ActivityIframePort {
+
+  /**
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} url
+   * @param {?Object=} opt_args
+   */
+  constructor(iframe, url, opt_args) {
+    /** @private @const {!HTMLIFrameElement} */
+    this.iframe_ = iframe;
+    /** @private @const {string} */
+    this.url_ = url;
+    /** @private @const {?Object} */
+    this.args_ = opt_args || null;
+
+    /** @private @const {!Window} */
+    this.win_ = /** @type {!Window} */ (this.iframe_.ownerDocument.defaultView);
+
+    /** @private @const {string} */
+    this.targetOrigin_ = getOriginFromUrl(url);
+
+    /** @private {boolean} */
+    this.connected_ = false;
+
+    /** @private {?function()} */
+    this.connectedResolver_ = null;
+
+    /** @private @const {!Promise} */
+    this.connectedPromise_ = new Promise(resolve => {
+      this.connectedResolver_ = resolve;
+    });
+
+    /** @private {?function()} */
+    this.readyResolver_ = null;
+
+    /** @private @const {!Promise} */
+    this.readyPromise_ = new Promise(resolve => {
+      this.readyResolver_ = resolve;
+    });
+
+    /** @private {?function((!ActivityResult|!Promise))} */
+    this.resultResolver_ = null;
+
+    /** @private @const {!Promise<!ActivityResult>} */
+    this.resultPromise_ = new Promise(resolve => {
+      this.resultResolver_ = resolve;
+    });
+
+    /** @private {?function(number)} */
+    this.onResizeRequest_ = null;
+
+    /** @private {?number} */
+    this.requestedHeight_ = null;
+
+    /** @private @const {!Messenger} */
+    this.messenger_ = new Messenger(
+        this.win_,
+        () => this.iframe_.contentWindow,
+        this.targetOrigin_);
+  }
+
+  /** @override */
+  getMode() {
+    return ActivityMode.IFRAME;
+  }
+
+  /**
+   * Waits until the activity port is connected to the host.
+   * @return {!Promise}
+   */
+  connect() {
+    if (!this.win_.document.documentElement.contains(this.iframe_)) {
+      throw new Error('iframe must be in DOM');
+    }
+    this.messenger_.connect(this.handleCommand_.bind(this));
+    this.iframe_.src = this.url_;
+    return this.connectedPromise_;
+  }
+
+  /**
+   * Disconnect the activity binding and cleanup listeners.
+   */
+  disconnect() {
+    this.connected_ = false;
+    this.messenger_.disconnect();
+  }
+
+  /** @override */
+  acceptResult() {
+    return this.resultPromise_;
+  }
+
+  /**
+   * Sends a message to the host.
+   * @param {!Object} payload
+   */
+  message(payload) {
+    this.messenger_.customMessage(payload);
+  }
+
+  /**
+   * Registers a callback to receive messages from the host.
+   * @param {function(!Object)} callback
+   */
+  onMessage(callback) {
+    this.messenger_.onCustomMessage(callback);
+  }
+
+  /**
+   * Creates a new communication channel or returns an existing one.
+   * @param {string=} opt_name
+   * @return {!Promise<!MessagePort>}
+   */
+  messageChannel(opt_name) {
+    return this.messenger_.askChannel(opt_name);
+  }
+
+  /**
+   * Returns a promise that yields when the iframe is ready to be interacted
+   * with.
+   * @return {!Promise}
+   */
+  whenReady() {
+    return this.readyPromise_;
+  }
+
+  /**
+   * Register a callback to handle resize requests. Once successfully resized,
+   * ensure to call `resized()` method.
+   * @param {function(number)} callback
+   */
+  onResizeRequest(callback) {
+    this.onResizeRequest_ = callback;
+    Promise.resolve().then(() => {
+      if (this.requestedHeight_ != null) {
+        callback(this.requestedHeight_);
+      }
+    });
+  }
+
+  /**
+   * Signals back to the activity implementation that the client has updated
+   * the activity's size.
+   */
+  resized() {
+    if (!this.connected_) {
+      return;
+    }
+    const height = this.iframe_.offsetHeight;
+    this.messenger_.sendCommand('resized', {'height': height});
+  }
+
+  /**
+   * @param {string} cmd
+   * @param {?Object} payload
+   * @private
+   */
+  handleCommand_(cmd, payload) {
+    if (cmd == 'connect') {
+      // First ever message. Indicates that the receiver is listening.
+      this.connected_ = true;
+      this.messenger_.sendStartCommand(this.args_);
+      this.connectedResolver_();
+    } else if (cmd == 'result') {
+      // The last message. Indicates that the result has been received.
+      if (this.resultResolver_) {
+        const code = /** @type {!ActivityResultCode} */ (payload['code']);
+        const data =
+            code == ActivityResultCode.FAILED ?
+            new Error(payload['data'] || '') :
+            payload['data'];
+        const result = new ActivityResult(
+            code,
+            data,
+            ActivityMode.IFRAME,
+            this.messenger_.getTargetOrigin(),
+            /* originVerified */ true,
+            /* secureChannel */ true);
+        resolveResult(this.win_, result, this.resultResolver_);
+        this.resultResolver_ = null;
+        this.messenger_.sendCommand('close');
+        this.disconnect();
+      }
+    } else if (cmd == 'ready') {
+      if (this.readyResolver_) {
+        this.readyResolver_();
+        this.readyResolver_ = null;
+      }
+    } else if (cmd == 'resize') {
+      this.requestedHeight_ = /** @type {number} */ (payload['height']);
+      if (this.onResizeRequest_) {
+        this.onResizeRequest_(this.requestedHeight_);
+      }
+    }
+  }
+}
+
+
+
+/**
+ * The `ActivityPort` implementation for the standalone window activity
+ * client executed as a popup.
+ *
+ * @implements {ActivityPort}
+ */
+class ActivityWindowPort {
+
+  /**
+   * @param {!Window} win
+   * @param {string} requestId
+   * @param {string} url
+   * @param {string} target
+   * @param {?Object=} opt_args
+   * @param {?ActivityOpenOptions=} opt_options
+   */
+  constructor(win, requestId, url, target, opt_args, opt_options) {
+    const isValidTarget =
+        target &&
+        (target == '_blank' || target == '_top' || target[0] != '_');
+    if (!isValidTarget) {
+      throw new Error('The only allowed targets are "_blank", "_top"' +
+          ' and name targets');
+    }
+
+    /** @private @const {!Window} */
+    this.win_ = win;
+    /** @private @const {string} */
+    this.requestId_ = requestId;
+    /** @private @const {string} */
+    this.url_ = url;
+    /** @private @const {string} */
+    this.openTarget_ = target;
+    /** @private @const {?Object} */
+    this.args_ = opt_args || null;
+    /** @private @const {?ActivityOpenOptions} */
+    this.options_ = opt_options || null;
+
+    /** @private {?function((!ActivityResult|!Promise))} */
+    this.resultResolver_ = null;
+
+    /** @private @const {!Promise<!ActivityResult>} */
+    this.resultPromise_ = new Promise(resolve => {
+      this.resultResolver_ = resolve;
+    });
+
+    /** @private {?Window} */
+    this.targetWin_ = null;
+
+    /** @private {?number} */
+    this.heartbeatInterval_ = null;
+
+    /** @private {?Messenger} */
+    this.messenger_ = null;
+  }
+
+  /** @override */
+  getMode() {
+    return this.openTarget_ == '_top' ?
+        ActivityMode.REDIRECT :
+        ActivityMode.POPUP;
+  }
+
+  /**
+   * Opens the activity in a window, either as a popup or via redirect.
+   *
+   * Returns the promise that will yield when the window returns or closed.
+   * Notice, that this promise may never complete if "redirect" mode was used.
+   *
+   * @return {!Promise}
+   */
+  open() {
+    return this.openInternal_();
+  }
+
+  /**
+   * @return {?Window}
+   */
+  getTargetWin() {
+    return this.targetWin_;
+  }
+
+  /**
+   * Disconnect the activity binding and cleanup listeners.
+   */
+  disconnect() {
+    if (this.heartbeatInterval_) {
+      this.win_.clearInterval(this.heartbeatInterval_);
+      this.heartbeatInterval_ = null;
+    }
+    if (this.messenger_) {
+      this.messenger_.disconnect();
+      this.messenger_ = null;
+    }
+    if (this.targetWin_) {
+      // Try to close the popup window. The host will also try to do the same.
+      try {
+        this.targetWin_.close();
+      } catch (e) {
+        // Ignore.
+      }
+      this.targetWin_ = null;
+    }
+    this.resultResolver_ = null;
+  }
+
+  /** @override */
+  acceptResult() {
+    return this.resultPromise_;
+  }
+
+  /**
+   * This method wraps around window's open method. It first tries to execute
+   * `open` call with the provided target and if it fails, it retries the call
+   * with the `_top` target. This is necessary given that in some embedding
+   * scenarios, such as iOS' WKWebView, navigation to `_blank` and other targets
+   * is blocked by default.
+   * @return {!Promise}
+   * @private
+   */
+  openInternal_() {
+    const featuresStr = this.buildFeatures_();
+
+    // Protectively, the URL will contain the request payload, unless explicitly
+    // directed not to via `skipRequestInUrl` option.
+    let url = this.url_;
+    if (!(this.options_ && this.options_.skipRequestInUrl)) {
+      const returnUrl =
+          this.options_ && this.options_.returnUrl ||
+          removeFragment(this.win_.location.href);
+      const requestString = serializeRequest({
+        requestId: this.requestId_,
+        returnUrl,
+        args: this.args_,
+      });
+      url = addFragmentParam(url, '__WA__', requestString);
+    }
+
+    // Open the window.
+    let targetWin;
+    let openTarget = this.openTarget_;
+    // IE does not support CORS popups - the popup has to fallback to redirect
+    // mode.
+    if (openTarget != '_top') {
+      // MSIE and Trident are typical user agents for IE browsers.
+      const nav = this.win_.navigator;
+      if (/Trident|MSIE|IEMobile/i.test(nav && nav.userAgent)) {
+        openTarget = '_top';
+      }
+    }
+    // Try first with the specified target. If we're inside the WKWebView or
+    // a similar environments, this method is expected to fail by default for
+    // all targets except `_top`.
+    try {
+      targetWin = this.win_.open(url, openTarget, featuresStr);
+    } catch (e) {
+      // Ignore.
+    }
+    // Then try with `_top` target.
+    if (!targetWin && openTarget != '_top') {
+      openTarget = '_top';
+      try {
+        targetWin = this.win_.open(url, openTarget);
+      } catch (e) {
+        // Ignore.
+      }
+    }
+
+    // Setup the target window.
+    if (targetWin) {
+      this.targetWin_ = targetWin;
+      if (openTarget != '_top') {
+        this.setupPopup_();
+      }
+    } else {
+      this.disconnectWithError_(new Error('failed to open window'));
+    }
+
+    // Return result promise, even though it may never complete.
+    return this.resultPromise_.catch(() => {
+      // Ignore. Call to the `acceptResult()` should fail if needed.
+    });
+  }
+
+  /**
+   * @return {string}
+   * @private
+   */
+  buildFeatures_() {
+    // The max width and heights are calculated as following:
+    // MaxSize = AvailSize - ControlsSize
+    // ControlsSize = OuterSize - InnerSize
+    const screen = this.win_.screen;
+    const availWidth = screen.availWidth || screen.width;
+    const availHeight = screen.availHeight || screen.height;
+    const isTop = this.isTopWindow_();
+    const nav = this.win_.navigator;
+    const isEdge = /Edge/i.test(nav && nav.userAgent);
+    // Limit controls to 100px width and height. Notice that it's only
+    // possible to calculate controls size in the top window, not in iframes.
+    // Notice that the Edge behavior is somewhat unique. If we can't find the
+    // right width/height, it will launch in the full-screen. Other browsers
+    // deal with such cases more gracefully.
+    const controlsWidth =
+        isTop && this.win_.outerWidth > this.win_.innerWidth ?
+        Math.min(100, this.win_.outerWidth - this.win_.innerWidth) :
+        (isEdge ? 100 : 0);
+    const controlsHeight =
+        isTop && this.win_.outerHeight > this.win_.innerHeight ?
+        Math.min(100, this.win_.outerHeight - this.win_.innerHeight) :
+        (isEdge ? 100 : 0);
+    // With all the adjustments, at least 50% of the available width/height
+    // should be made available to a popup.
+    const maxWidth = Math.max(availWidth - controlsWidth, availWidth * 0.5);
+    const maxHeight = Math.max(availHeight - controlsHeight, availHeight * 0.5);
+    let w = Math.floor(Math.min(600, maxWidth * 0.9));
+    let h = Math.floor(Math.min(600, maxHeight * 0.9));
+    if (this.options_) {
+      if (this.options_.width) {
+        w = Math.min(this.options_.width, maxWidth);
+      }
+      if (this.options_.height) {
+        h = Math.min(this.options_.height, maxHeight);
+      }
+    }
+    const x = Math.floor((screen.width - w) / 2);
+    const y = Math.floor((screen.height - h) / 2);
+    const features = {
+      'height': h,
+      'width': w,
+      'resizable': 'yes',
+      'scrollbars': 'yes',
+    };
+    // Do not set left/top in Edge: it fails.
+    if (!isEdge) {
+      features['left'] = x;
+      features['top'] = y;
+    }
+    let featuresStr = '';
+    for (const f in features) {
+      if (featuresStr) {
+        featuresStr += ',';
+      }
+      featuresStr += `${f}=${features[f]}`;
+    }
+    return featuresStr;
+  }
+
+  /**
+   * This method only exists to make iframe/top emulation possible in tests.
+   * Otherwise `window.top` cannot be overridden.
+   * @return {boolean}
+   * @private
+   */
+  isTopWindow_() {
+    return this.win_ == this.win_.top;
+  }
+
+  /** @private */
+  setupPopup_() {
+    // Keep alive to catch the window closing, which would indicate
+    // "cancel" signal.
+    this.heartbeatInterval_ = this.win_.setInterval(() => {
+      this.check_(/* delayCancel */ true);
+    }, 500);
+
+    // Start up messaging. The messaging is explicitly allowed to proceed
+    // without origin check b/c all arguments have already been passed in
+    // the URL and special handling is enforced when result is delivered.
+    this.messenger_ = new Messenger(
+        this.win_,
+        /** @type {!Window} */ (this.targetWin_),
+        /* targetOrigin */ null);
+    this.messenger_.connect(this.handleCommand_.bind(this));
+  }
+
+  /**
+   * @param {boolean=} opt_delayCancel
+   * @private
+   */
+  check_(opt_delayCancel) {
+    if (!this.targetWin_ || this.targetWin_.closed) {
+      this.win_.clearInterval(this.heartbeatInterval_);
+      this.heartbeatInterval_ = null;
+      // Give a chance for the result to arrive, but otherwise consider the
+      // responce to be empty.
+      this.win_.setTimeout(() => {
+        try {
+          this.result_(ActivityResultCode.CANCELED, /* data */ null);
+        } catch (e) {
+          this.disconnectWithError_(e);
+        }
+      }, opt_delayCancel ? 3000 : 0);
+    }
+  }
+
+  /**
+   * @param {!Error} reason
+   * @private
+   */
+  disconnectWithError_(reason) {
+    if (this.resultResolver_) {
+      this.resultResolver_(Promise.reject(reason));
+    }
+    this.disconnect();
+  }
+
+  /**
+   * @param {!ActivityResultCode} code
+   * @param {*} data
+   * @private
+   */
+  result_(code, data) {
+    if (this.resultResolver_) {
+      const isConnected = this.messenger_.isConnected();
+      const result = new ActivityResult(
+          code,
+          data,
+          ActivityMode.POPUP,
+          isConnected ?
+              this.messenger_.getTargetOrigin() :
+              getOriginFromUrl(this.url_),
+          /* originVerified */ isConnected,
+          /* secureChannel */ isConnected);
+      resolveResult(this.win_, result, this.resultResolver_);
+      this.resultResolver_ = null;
+    }
+    if (this.messenger_) {
+      this.messenger_.sendCommand('close');
+    }
+    this.disconnect();
+  }
+
+  /**
+   * @param {string} cmd
+   * @param {?Object} payload
+   * @private
+   */
+  handleCommand_(cmd, payload) {
+    if (cmd == 'connect') {
+      // First ever message. Indicates that the receiver is listening.
+      this.messenger_.sendStartCommand(this.args_);
+    } else if (cmd == 'result') {
+      // The last message. Indicates that the result has been received.
+      const code = /** @type {!ActivityResultCode} */ (payload['code']);
+      const data =
+          code == ActivityResultCode.FAILED ?
+          new Error(payload['data'] || '') :
+          payload['data'];
+      this.result_(code, data);
+    } else if (cmd == 'check') {
+      this.win_.setTimeout(() => this.check_(), 200);
+    }
+  }
+}
+
+
+/**
+ * @param {!Window} win
+ * @param {string} fragment
+ * @param {string} requestId
+ * @return {?ActivityPort}
+ */
+function discoverRedirectPort(win, fragment, requestId) {
+  // Try to find the result in the fragment.
+  const paramName = '__WA_RES__';
+  const fragmentParam = getQueryParam(fragment, paramName);
+  if (!fragmentParam) {
+    return null;
+  }
+  const response = /** @type {?Object} */ (JSON.parse(
+      decodeURIComponent(fragmentParam)));
+  if (!response || response['requestId'] != requestId) {
+    return null;
+  }
+
+  // Remove the found param from the fragment.
+  const cleanFragment = removeQueryParam(win.location.hash, paramName) || '';
+  if (cleanFragment != win.location.hash) {
+    if (win.history && win.history.replaceState) {
+      try {
+        win.history.replaceState(win.history.state, '', cleanFragment);
+      } catch (e) {
+        // Ignore.
+      }
+    }
+  }
+
+  const code = response['code'];
+  const data = response['data'];
+  const origin = response['origin'];
+  const referrerOrigin = win.document.referrer &&
+      getOriginFromUrl(win.document.referrer);
+  const originVerified = origin == referrerOrigin;
+  return new ActivityWindowRedirectPort(
+      win,
+      code,
+      data,
+      origin,
+      originVerified);
+}
+
+
+/**
+ * The `ActivityPort` implementation for the standalone window activity
+ * client executed as a popup.
+ *
+ * @implements {ActivityPort}
+ */
+class ActivityWindowRedirectPort {
+
+  /**
+   * @param {!Window} win
+   * @param {!ActivityResultCode} code
+   * @param {*} data
+   * @param {string} targetOrigin
+   * @param {boolean} targetOriginVerified
+   */
+  constructor(win, code, data, targetOrigin, targetOriginVerified) {
+    /** @private @const {!Window} */
+    this.win_ = win;
+    /** @private @const {!ActivityResultCode} */
+    this.code_ = code;
+    /** @private @const {*} */
+    this.data_ = data;
+    /** @private {string} */
+    this.targetOrigin_ = targetOrigin;
+    /** @private {boolean} */
+    this.targetOriginVerified_ = targetOriginVerified;
+  }
+
+  /** @override */
+  getMode() {
+    return ActivityMode.REDIRECT;
+  }
+
+  /** @override */
+  acceptResult() {
+    const result = new ActivityResult(
+        this.code_,
+        this.data_,
+        ActivityMode.REDIRECT,
+        this.targetOrigin_,
+        this.targetOriginVerified_,
+        /* secureChannel */ false);
+    return new Promise(resolve => {
+      resolveResult(this.win_, result, resolve);
+    });
+  }
+}
+
+
+
+/**
+ * The page-level activities manager ports. This class is intended to be used
+ * as a singleton. It can start activities of all modes: iframe, popup, and
+ * redirect.
+ */
+class ActivityPorts {
+
+  /**
+   * @param {!Window} win
+   */
+  constructor(win) {
+    /** @const {string} */
+    this.version = '1.12';
+
+    /** @private @const {!Window} */
+    this.win_ = win;
+
+    /** @private @const {string} */
+    this.fragment_ = win.location.hash;
+
+    /**
+     * @private @const {!Object<string, !Array<function(!ActivityPort)>>}
+     */
+    this.requestHandlers_ = {};
+
+    /**
+     * The result buffer is indexed by `requestId`.
+     * @private @const {!Object<string, !ActivityPort>}
+     */
+    this.resultBuffer_ = {};
+  }
+
+  /**
+   * Start an activity within the specified iframe.
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} url
+   * @param {?Object=} opt_args
+   * @return {!Promise<!ActivityIframePort>}
+   */
+  openIframe(iframe, url, opt_args) {
+    const port = new ActivityIframePort(iframe, url, opt_args);
+    return port.connect().then(() => port);
+  }
+
+  /**
+   * Start an activity in a separate window. The result will be delivered
+   * to the `onResult` callback.
+   *
+   * The activity can be opened in two modes: "popup" and "redirect". This
+   * depends on the `target` value, but also on the browser/environment.
+   *
+   * The allowed `target` values are `_blank`, `_top` and name targets. The
+   * `_self`, `_parent` and similar targets are not allowed.
+   *
+   * The `_top` target indicates that the activity should be opened as a
+   * "redirect", while other targets indicate that the activity should be
+   * opened as a popup. The activity client will try to honor the requested
+   * target. However, it's not always possible. Some environments do not
+   * allow popups and they either force redirect or fail the window open
+   * request. In this case, the activity will try to fallback to the "redirect"
+   * mode.
+   *
+   * @param {string} requestId
+   * @param {string} url
+   * @param {string} target
+   * @param {?Object=} opt_args
+   * @param {?ActivityOpenOptions=} opt_options
+   * @return {{targetWin: ?Window}}
+   */
+  open(requestId, url, target, opt_args, opt_options) {
+    const port = new ActivityWindowPort(
+        this.win_, requestId, url, target, opt_args, opt_options);
+    port.open().then(() => {
+      // Await result if possible. Notice that when falling back to "redirect",
+      // the result will never arrive through this port.
+      this.consumeResultAll_(requestId, port);
+    });
+    return {targetWin: port.getTargetWin()};
+  }
+
+  /**
+   * Registers the callback for the result of the activity opened with the
+   * specified `requestId` (see the `open()` method). The callback is a
+   * function that takes a single `ActivityPort` argument. The client
+   * can use this object to verify the port using it's origin, verified and
+   * secure channel flags. Then the client can call
+   * `ActivityPort.acceptResult()` method to accept the result.
+   *
+   * The activity result is handled via a separate callback because of a
+   * possible redirect. So use of direct callbacks and/or promises is not
+   * possible in that case.
+   *
+   * A typical implementation would look like:
+   * ```
+   * ports.onResult('request1', function(port) {
+   *   port.acceptResult().then(function(result) {
+   *     // Only verified origins are allowed.
+   *     if (result.origin == expectedOrigin &&
+   *         result.originVerified &&
+   *         result.secureChannel) {
+   *       handleResultForRequest1(result);
+   *     }
+   *   });
+   * })
+   *
+   * ports.open('request1', request1Url, '_blank');
+   * ```
+   *
+   * @param {string} requestId
+   * @param {function(!ActivityPort)} callback
+   */
+  onResult(requestId, callback) {
+    let handlers = this.requestHandlers_[requestId];
+    if (!handlers) {
+      handlers = [];
+      this.requestHandlers_[requestId] = handlers;
+    }
+    handlers.push(callback);
+
+    // Consume available result.
+    const availableResult = this.discoverResult_(requestId);
+    if (availableResult) {
+      this.consumeResult_(availableResult, callback);
+    }
+  }
+
+  /**
+   * @param {string} requestId
+   * @return {?ActivityPort}
+   * @private
+   */
+  discoverResult_(requestId) {
+    let port = this.resultBuffer_[requestId];
+    if (!port && this.fragment_) {
+      port = discoverRedirectPort(
+          this.win_, this.fragment_, requestId);
+      if (port) {
+        this.resultBuffer_[requestId] = port;
+      }
+    }
+    return port;
+  }
+
+  /**
+   * @param {!ActivityPort} port
+   * @param {function(!ActivityPort)} callback
+   * @private
+   */
+  consumeResult_(port, callback) {
+    Promise.resolve().then(() => {
+      callback(port);
+    });
+  }
+
+  /**
+   * @param {string} requestId
+   * @param {!ActivityPort} port
+   * @private
+   */
+  consumeResultAll_(requestId, port) {
+    // Find and execute handlers.
+    const handlers = this.requestHandlers_[requestId];
+    if (handlers) {
+      handlers.forEach(handler => {
+        this.consumeResult_(port, handler);
+      });
+    }
+    // Buffer the result for callbacks that may arrive in the future.
+    this.resultBuffer_[requestId] = port;
+  }
+}
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const Constants = {
+
+/**
+ * Supported environments.
+ *
+ * @enum {string}
+ */
+Environment : {
+  PRODUCTION: 'PRODUCTION',
+  TEST: 'TEST',
+  SANDBOX: 'SANDBOX',
+},
+
+/**
+ * Supported payment methods.
+ *
+ * @enum {string}
+ */
+PaymentMethod : {
+  CARD: 'CARD',
+  TOKENIZED_CARD: 'TOKENIZED_CARD',
+},
+
+/**
+ * Returned result status.
+ *
+ * @enum {string}
+ */
+ResponseStatus : {
+  CANCELED: 'CANCELED',
+  DEVELOPER_ERROR: 'DEVELOPER_ERROR',
+},
+
+/**
+ * Supported total price status.
+ *
+ * @enum {string}
+ */
+TotalPriceStatus : {
+  ESTIMATED: 'ESTIMATED',
+  FINAL: 'FINAL',
+  NOT_CURRENTLY_KNOWN: 'NOT_CURRENTLY_KNOWN',
+},
+
+/**
+ * Supported Google Pay payment button type.
+ *
+ * @enum {string}
+ */
+ButtonType : {
+  SHORT: 'short',
+  LONG: 'long',
+},
+
+/**
+ * Supported button colors.
+ *
+ * @enum {string}
+ */
+ButtonColor : {
+  DEFAULT: 'default',  // Currently defaults to black.
+  BLACK: 'black',
+  WHITE: 'white',
+},
+
+/**
+ * Id attributes.
+ *
+ * @enum {string}
+ */
+Id : {
+  POPUP_WINDOW_CONTAINER: 'popup-window-container',
+},
+
+/** @const {string} */
+IS_READY_TO_PAY_RESULT_KEY :
+    'google.payments.api.storage.isreadytopay.result',
+
+
+IFRAME_STYLE_CLASS : 'dialog',
+
+IFRAME_STYLE : `
+.dialog {
+    animation: none 0s ease 0s 1 normal none running;
+    background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255);
+    background-blend-mode: normal;
+    border: 0px none rgb(51, 51, 51);
+    border-radius: 8px 8px 0px 0px;
+    border-collapse: separate;
+    bottom: 0px;
+    box-shadow: rgb(128, 128, 128) 0px 3px 0px 0px, rgb(128, 128, 128) 0px 0px 22px 0px;
+    box-sizing: border-box;
+    left: -240px;
+    letter-spacing: normal;
+    max-height: 100%;
+    overflow: visible;
+    position: fixed;
+    width: 100%;
+    z-index: 2147483647;
+    -webkit-appearance: none;
+    left: 0px;
+}
+@media (min-width: 480px) {
+  .dialog{
+    width: 480px !important;
+    left: -240px !important;
+    margin-left: calc(100vw - 100vw / 2) !important;
+  }
+}
+.dialogContainer {
+  background-color: rgba(0,0,0,0.85);
+  bottom: 0;
+  height: 100%;
+  left: 0;
+  position: absolute;
+  right: 0;
+}
+.iframeContainer {
+  -webkit-overflow-scrolling: touch;
+}
+`,
+
+BUTTON_LOCALE_TO_MIN_WIDTH : {
+  'en': 152,
+  'bg': 163,
+  'cs': 192,
+  'de': 168,
+  'es': 183,
+  'fr': 183,
+  'hr': 157,
+  'id': 186,
+  'ja': 148,
+  'ko': 137,
+  'ms': 186,
+  'nl': 167,
+  'pl': 182,
+  'pt': 193,
+  'ru': 206,
+  'sk': 157,
+  'sl': 211,
+  'sr': 146,
+  'tr': 161,
+  'uk': 207,
+  'zh': 156,
+},
+
+BUTTON_STYLE : `
+.gpay-button {
+    background-origin: content-box;
+    background-position: center center;
+    background-repeat: no-repeat;
+    background-size: contain;
+    border: 0px;
+    border-radius: 4px;
+    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 1px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
+    cursor: pointer;
+    height: 40px;
+    min-height: 40px;
+    outline: 0px;
+    padding: 11px 24px;
+}
+
+.black {
+    background-color: #000;
+}
+
+.white {
+    background-color: #fff;
+}
+
+.short {
+    min-width: 90px;
+    width: 160px;
+}
+
+.black.short {
+    background-image: url(https://www.gstatic.com/instantbuy/svg/dark_gpay.svg);
+}
+
+.white.short {
+    background-image: url(https://www.gstatic.com/instantbuy/svg/light_gpay.svg);
+}
+`,
+
+/**
+ * Trusted domain for secure context validation
+ *
+ * @const {string}
+ */
+TRUSTED_DOMAIN : '.google.com'
+};
+
+
+/** @private */
+let hasStylesheetBeenInjected_ = false;
+
+/**
+ * Return a <div> element containing a Google Pay payment button.
+ *
+ * @param {ButtonOptions=} options
+ * @return {!Element}
+ */
+function createButtonHelper(options = {}) {
+  if (!hasStylesheetBeenInjected_) {
+    injectStyleSheet(Constants.BUTTON_STYLE);
+    injectStyleSheet(getLongGPayButtonCss_());
+    hasStylesheetBeenInjected_ = true;
+  }
+  const button = document.createElement('button');
+  if (!Object.values(Constants.ButtonType).includes(options.buttonType)) {
+    options.buttonType = Constants.ButtonType.LONG;
+  }
+  if (!Object.values(Constants.ButtonColor).includes(options.buttonColor)) {
+    options.buttonColor = Constants.ButtonColor.DEFAULT;
+  }
+  if (options.buttonColor == Constants.ButtonColor.DEFAULT) {
+    options.buttonColor = Constants.ButtonColor.BLACK;
+  }
+  const classForGpayButton = getClassForGpayButton_(options);
+  button.setAttribute('class', `gpay-button ${classForGpayButton}`);
+
+  const hoverBackgroundColor = isWhiteColor_(options) ? '#f8f8f8' : '#3c4043';
+  button.addEventListener('mouseover', /** @this {!Element}*/ function() {
+    this.style.backgroundColor = hoverBackgroundColor;
+  });
+  button.addEventListener('mouseout', /** @this {!Element}*/ function() {
+    this.style.backgroundColor = '';
+  });
+  const mouseDownBackgroundColor = isWhiteColor_(options) ? '#e8e8e8' : '#202124';
+  button.addEventListener('mousedown', /** @this {!Element}*/ function() {
+    this.style.backgroundColor = mouseDownBackgroundColor;
+  });
+  button.addEventListener('mouseup', /** @this {!Element}*/ function() {
+    this.style.backgroundColor = '';
+  });
+
+  if (options.onClick) {
+    button.addEventListener('click', options.onClick);
+  } else {
+    throw new Error('Parameter \'onClick\' must be set.');
+  }
+  const div = document.createElement('div');
+  div.appendChild(button);
+  return div;
+}
+
+/**
+ * Gets the class for the Google Pay button.
+ *
+ * @param {!ButtonOptions} options
+ * @return {string}
+ * @private
+ */
+function getClassForGpayButton_(options) {
+  if (options.buttonType == Constants.ButtonType.LONG) {
+    if (options.buttonColor == Constants.ButtonColor.WHITE) {
+      return 'white long';
+    } else {
+      return 'black long';
+    }
+  } else if (options.buttonType == Constants.ButtonType.SHORT) {
+    if (options.buttonColor == Constants.ButtonColor.WHITE) {
+      return 'white short';
+    } else {
+      return 'black short';
+    }
+  }
+  return 'black long';
+}
+
+/**
+ * Gets the CSS for the long gpay button depending on the locale.
+ *
+ * @return {string}
+ * @private
+ */
+function getLongGPayButtonCss_() {
+  // navigator.userLanguage is used for IE
+  const defaultLocale = 'en';
+  let locale = navigator.language || navigator.userLanguage || defaultLocale;
+  if (locale != defaultLocale) {
+    // Get language part of locale (e.g: fr-FR is fr) and check if it is
+    // supported, otherwise default to en
+    locale = locale.substring(0, 2);
+    if (!Constants.BUTTON_LOCALE_TO_MIN_WIDTH[locale]) {
+      locale = defaultLocale;
+    }
+  }
+  const minWidth = Constants.BUTTON_LOCALE_TO_MIN_WIDTH[locale];
+
+  return `
+    .long {
+      min-width: ${minWidth}px;
+      width: 240px;
+    }
+
+    .white.long {
+      background-image: url(https://www.gstatic.com/instantbuy/svg/light/${
+      locale}.svg);
+    }
+
+    .black.long {
+      background-image: url(https://www.gstatic.com/instantbuy/svg/dark/${
+      locale}.svg);
+    }`;
+}
+
+/**
+ * Returns true if the white color is selected.
+ *
+ * @param {!ButtonOptions} options
+ * @return {boolean} True if the white color is selected.
+ * @private
+ */
+function isWhiteColor_(options) {
+  return options.buttonColor == Constants.ButtonColor.WHITE;
+}
+
+/** Visible for testing. */
+function resetButtonStylesheet() {
+  hasStylesheetBeenInjected_ = false;
+}
+
+/**
+ * The client for interacting with the Google Pay APIs.
+ * @final
+ */
+class PaymentsClient {
+  /**
+   * @param {PaymentOptions=} paymentOptions
+   * @param {boolean=} opt_useIframe
+   */
+  constructor(paymentOptions = {}, opt_useIframe) {
+    /** @private @const {!PaymentsAsyncClient} */
+    this.asyncClient_ = new PaymentsAsyncClient(
+        paymentOptions, this.payComplete_.bind(this), opt_useIframe);
+
+    /** @private {?function(!Promise<!PaymentData>)} */
+    this.pending_ = null;
+  }
+
+  /**
+   * @param {!Promise<!PaymentData>} response
+   * @private
+   */
+  payComplete_(response) {
+    this.pending_(response);
+  }
+
+  /**
+   * Check whether the user can make payments using the Pay API.
+   *
+   * @param {!IsReadyToPayRequest} isReadyToPayRequest
+   * @return {!Promise} The promise will contain the boolean result and error
+   *     message when possible.
+   * @export
+   */
+  isReadyToPay(isReadyToPayRequest) {
+    return this.asyncClient_.isReadyToPay(isReadyToPayRequest);
+  }
+
+  /**
+   * Prefetch paymentData to speed up loadPaymentData call. Note the provided
+   * paymentDataRequest should exactly be the same as provided in
+   * loadPaymentData to make the loadPaymentData call fast.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @export
+   */
+  prefetchPaymentData(paymentDataRequest) {
+    this.asyncClient_.prefetchPaymentData(paymentDataRequest);
+  }
+
+  /**
+   * Request PaymentData, which contains necessary infomartion to complete a
+   * payment.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @return {!Promise<!PaymentData>}
+   * @export
+   */
+  loadPaymentData(paymentDataRequest) {
+    /** @type {!Promise<!PaymentData>} */
+    const promise = new Promise(resolve => {
+      if (this.pending_) {
+        throw new Error('This method can only be called one at a time.');
+      }
+      this.pending_ = resolve;
+      this.asyncClient_.loadPaymentData(paymentDataRequest);
+    });
+
+    return promise.then(
+        (result) => {
+          this.pending_ = null;
+          return result;
+        },
+        error => {
+          this.pending_ = null;
+          throw error;
+        });
+  }
+
+  /**
+   * Return a <div> element containing Google Pay payment button.
+   *
+   * @param {ButtonOptions=} options
+   * @return {!Element}
+   * @export
+   */
+  createButton(options={}) {
+    return this.asyncClient_.createButton(options);
+  }
+}
+
+
+/**
+ * Injects the provided style sheet to the document head.
+ * @param {string} styleText The stylesheet to be injected.
+ * @return {!Element}
+ */
+function injectStyleSheet(styleText) {
+  const styleElement = document.createElement('style');
+  styleElement.type = 'text/css';
+  styleElement.textContent = styleText;
+  document.head.appendChild(styleElement);
+  return styleElement;
+}
+
+/**
+ * Injects the pay with google iframe.
+ * @return {!{container: !Element, iframe:!HTMLIFrameElement}}
+ */
+function injectIframe() {
+  const container = document.createElement('div');
+  container.classList.add('dialogContainer');
+  const iframeContainer = document.createElement('div');
+  iframeContainer.classList.add('iframeContainer');
+  /** @private @const {!HTMLIFrameElement} */
+  const iframe =
+      /** @type {!HTMLIFrameElement} */ (document.createElement('iframe'));
+  iframe.classList.add('dialog');
+  iframe.setAttribute('frameborder', '0');
+  iframe.setAttribute('scrolling', 'no');
+  iframeContainer.appendChild(iframe);
+  container.appendChild(iframeContainer);
+  document.body.appendChild(container);
+  return {'container': container, 'iframe': iframe};
+}
+
+/**
+ * PaymentRequest.
+ *
+ * @constructor
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/PaymentRequest
+ */
+function PaymentRequest(methodData, details) {}
+/**
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/canMakePayment
+ * @return {Promise<Boolean>}
+ */
+PaymentRequest.prototype.canMakePayment = function() {};
+
+/**
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/PaymentRequest/show
+ * @return {Promise<!PaymentResponse>}
+ */
+PaymentRequest.prototype.show = function() {};
+
+/**
+ * Supported interactions between iframe and merchant page.
+ *
+ * @enum {number}
+ */
+// Next Id: 7
+const PostMessageEventType = {
+  IS_READY_TO_PAY: 6,
+  LOG_BUTTON_CLICK: 5,
+  LOG_IS_READY_TO_PAY_API: 0,
+  LOG_LOAD_PAYMENT_DATA_API: 1,
+  LOG_RENDER_BUTTON: 2,
+  LOG_INLINE_PAYMENT_WIDGET_INITIALIZE: 4,
+  LOG_INLINE_PAYMENT_WIDGET_SUBMIT: 3,
+};
+
+/**
+ * Types of buy flow activity modes.
+ *
+ * @enum {number}
+ */
+const BuyFlowActivityMode = {
+  UNKNOWN_MODE: 0,
+  IFRAME: 1,
+  POPUP: 2,
+  REDIRECT: 3,
+};
+
+/**
+ * Types of buy flow activity modes.
+ *
+ * @enum {number}
+ */
+const PublicErrorCode = {
+  UNKNOWN_ERROR_TYPE: 0,
+  INTERNAL_ERROR: 1,
+  DEVELOPER_ERROR: 2,
+  BUYER_ACCOUNT_ERROR: 3,
+  MERCHANT_ACCOUNT_ERROR: 4,
+  UNSUPPORTED_API_VERSION: 5,
+  BUYER_CANCEL: 6,
+};
+
+/**
+ * Iframe used for logging and prefetching.
+ *
+ * @type {?Element}
+ */
+let iframe = null;
+
+/** @type {?PostMessageService} */
+let postMessageService = null;
+
+/** @type {?string} */
+let environment = null;
+
+/** @type {?BuyFlowActivityMode} */
+let buyFlowActivityMode = null;
+
+/** @type {?string} */
+let googleTransactionId = null;
+
+/** @type {boolean} */
+let iframeLoaded = false;
+
+/** @type {!Array<!Object>} */
+let buffer = [];
+
+class PayFrameHelper {
+  /**
+   * Creates a hidden iframe for logging and appends it to the top level
+   * document.
+   *
+   * @param {string} env
+   */
+  static load(env) {
+    if (iframe) {
+      return;
+    }
+    environment = env;
+    iframe = document.createElement('iframe');
+    // Pass in origin because document.referrer inside iframe is empty in
+    // certain cases
+    iframe.src = PayFrameHelper.getIframeUrl_(window.location.origin);
+    iframe.height = '0';
+    iframe.width = '0';
+    iframe.style.display = 'none';
+    iframe.style.visibility = 'hidden';
+    iframe.onload = function() {
+      PayFrameHelper.iframeLoaded();
+    };
+    document.body.appendChild(iframe);
+    postMessageService = new PostMessageService(iframe.contentWindow);
+  }
+
+  /**
+   * Posts a message to the iframe with the given data.
+   *
+   * @param {!Object} data
+   */
+  static postMessage(data) {
+    if (!iframeLoaded) {
+      buffer.push(data);
+      return;
+    }
+    const postMessageData = Object.assign(
+        {
+          'buyFlowActivityMode': buyFlowActivityMode,
+          'googleTransactionId': googleTransactionId,
+        },
+        data);
+    postMessageService.postMessage(
+        postMessageData, PayFrameHelper.getIframeOrigin_());
+  }
+
+  /**
+   *
+   * Sets the google transaction id.
+   *
+   * @param {string} id
+   */
+  static setGoogleTransactionId(id) {
+    googleTransactionId = id;
+  }
+
+  /**
+   *
+   * Sets the activity mode.
+   *
+   * @param {!BuyFlowActivityMode} mode
+   */
+  static setBuyFlowActivityMode(mode) {
+    buyFlowActivityMode = mode;
+  }
+
+  /**
+   * Override postMessageService for testing.
+   *
+   * @param {!PostMessageService} messageService
+   */
+  static setPostMessageService(messageService) {
+    postMessageService = messageService;
+  }
+
+  /**
+   * Clears the singleton variables.
+   */
+  static reset() {
+    iframe = null;
+    buffer.length = 0;
+    iframeLoaded = false;
+  }
+
+  /**
+   * Sets whether the iframe has been loaded or not.
+   *
+   * @param {boolean} loaded
+   */
+  static setIframeLoaded(loaded) {
+    iframeLoaded = loaded;
+  }
+
+  /**
+   * Called whenever the iframe is loaded.
+   */
+  static iframeLoaded() {
+    iframeLoaded = true;
+    buffer.forEach(function(data) {
+      PayFrameHelper.postMessage(data);
+    });
+  }
+
+  /**
+   * Returns the events that have been buffered.
+   *
+   * @return {!Array<!Object>}
+   */
+  static getBuffer() {
+    return buffer;
+  }
+
+  /**
+   * Mocks the iframe as an arbitrary html element instead of actually injecting
+   * it for testing.
+   */
+  static injectIframeForTesting() {
+    PayFrameHelper.reset();
+    iframe = document.createElement('p');
+    PayFrameHelper.iframeLoaded();
+  }
+
+  /**
+   * Returns the payframe origin based on the environment.
+   *
+   * @return {string}
+   * @private
+   */
+  static getIframeOrigin_() {
+    return 'https://pay.' +
+        (environment === Constants.Environment.SANDBOX ? 'sandbox.' : '') +
+        'google.com';
+  }
+
+  /**
+   * Returns the payframe URL based on the environment.
+   *
+   * @param {string} origin The origin that is opening the payframe.
+   * @return {string}
+   * @private
+   */
+  static getIframeUrl_(origin) {
+    return PayFrameHelper.getIframeOrigin_() + '/gp/p/ui/payframe?origin=' +
+        encodeURIComponent(window.location.origin);
+  }
+}
+
+const TRUSTED_DOMAINS = [
+  'actions.google.com',
+  'amp-actions.sandbox.google.com',
+  'amp-actions-staging.sandbox.google.com',
+  'amp-actions-autopush.sandbox.google.com',
+  'payments.developers.google.com',
+  'payments.google.com',
+];
+
+/**
+ * The client for interacting with the Google Payment APIs.
+ * <p>
+ * The async refers to the fact that this client supports redirects
+ * when using webactivties.
+ * <p>
+ * If you are using this be sure that this is what you want.
+ * <p>
+ * In almost all cases PaymentsClient is the better client to use because
+ * it exposes a promises based api which is easier to deal with.
+ * @final
+ */
+class PaymentsAsyncClient {
+  /**
+   * @param {PaymentOptions} paymentOptions
+   * @param {function(!Promise<!PaymentData>)} onPaymentResponse
+   * @param {boolean=} opt_useIframe
+   */
+  constructor(paymentOptions, onPaymentResponse, opt_useIframe) {
+    this.onPaymentResponse_ = onPaymentResponse;
+
+    validatePaymentOptions(paymentOptions);
+
+    /** @private {?number} */
+    this.loadPaymentDataApiStartTimeMs_ = null;
+
+    /** @private @const {string} */
+    this.environment_ =
+        paymentOptions.environment || Constants.Environment.TEST;
+
+    /** @const @private {string} */
+    this.googleTransactionId_ =
+        this.createGoogleTransactionId_(this.environment_);
+
+    /** @private @const {?PaymentsClientDelegateInterface} */
+    this.webActivityDelegate_ = new PaymentsWebActivityDelegate(
+        this.environment_, this.googleTransactionId_, opt_useIframe);
+
+    // TODO: Remove the temporary hack that disable payments
+    // request for inline flow.
+    /** @private @const {?PaymentsClientDelegateInterface} */
+    this.delegate_ = chromeSupportsPaymentRequest() && !opt_useIframe ?
+        new PaymentsRequestDelegate(this.environment_) :
+        this.webActivityDelegate_;
+
+    this.webActivityDelegate_.onResult(this.onResult_.bind(this));
+    this.delegate_.onResult(this.onResult_.bind(this));
+
+    PayFrameHelper.load(this.environment_);
+    PayFrameHelper.setGoogleTransactionId(this.googleTransactionId_);
+
+    window.addEventListener(
+        'message', event => this.handleMessageEvent_(event));
+  }
+
+  /**
+   * Check whether the user can make payments using the Payment API.
+   *
+   * @param {!IsReadyToPayRequest} isReadyToPayRequest
+   * @return {!Promise} The promise will contain the boolean result and error
+   *     message when possible.
+   * @export
+   */
+  isReadyToPay(isReadyToPayRequest) {
+    /** @type {?string} */
+    const errorMessage = validateSecureContext() ||
+        validateIsReadyToPayRequest(isReadyToPayRequest);
+    if (errorMessage) {
+      return new Promise((resolve, reject) => {
+        PaymentsAsyncClient.logDevErrorToConsole_('isReadyToPay', errorMessage);
+        PayFrameHelper.postMessage({
+          'eventType': PostMessageEventType.LOG_IS_READY_TO_PAY_API,
+          'error': PublicErrorCode.DEVELOPER_ERROR,
+        });
+        reject({
+          'statusCode': Constants.ResponseStatus.DEVELOPER_ERROR,
+          'statusMessage': errorMessage
+        });
+      });
+    }
+    const startTimeMs = Date.now();
+    const webPromise =
+        this.webActivityDelegate_.isReadyToPay(isReadyToPayRequest)
+            .then(response => {
+              PayFrameHelper.postMessage({
+                'eventType': PostMessageEventType.LOG_IS_READY_TO_PAY_API,
+                'clientLatencyStartMs': startTimeMs,
+                'isReadyToPayApiResult': response['result'],
+              });
+              return response;
+            });
+
+    if (chromeSupportsPaymentRequest()) {
+      // If the merchant supports only Tokenized cards then just rely on
+      // delegate to give us the result.
+      // This will need to change once b/78519188 is fixed.
+      const nativePromise = this.delegate_.isReadyToPay(
+          isReadyToPayRequest);
+      if (doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest)) {
+        return nativePromise;
+      }
+      // Return webIsReadyToPay only if delegateIsReadyToPay has been executed.
+      return nativePromise.then(() => webPromise);
+    }
+    return webPromise;
+  }
+
+  /**
+   * Prefetch paymentData to speed up loadPaymentData call. Note the provided
+   * paymentDataRequest should exactly be the same as provided in
+   * loadPaymentData to make the loadPaymentData call fast since current
+   * web flow prefetching is based on the full request parameters.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @export
+   */
+  prefetchPaymentData(paymentDataRequest) {
+    /** @type {?string} */
+    const errorMessage = validateSecureContext() ||
+        validatePaymentDataRequest(paymentDataRequest);
+    if (errorMessage) {
+      PaymentsAsyncClient.logDevErrorToConsole_(
+          'prefetchPaymentData', errorMessage);
+      return;
+    }
+    if (chromeSupportsPaymentRequest()) {
+      this.delegate_.prefetchPaymentData(paymentDataRequest);
+    } else {
+      // For non chrome supports always use the hosting page.
+      this.webActivityDelegate_.prefetchPaymentData(paymentDataRequest);
+    }
+  }
+
+  /**
+   * Request PaymentData, which contains necessary infomartion to complete a
+   * payment.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @export
+   */
+  loadPaymentData(paymentDataRequest) {
+    PayFrameHelper.postMessage({
+      'eventType': PostMessageEventType.LOG_BUTTON_CLICK,
+    });
+    const errorMessage = validateSecureContext() ||
+        validatePaymentDataRequest(paymentDataRequest);
+    if (errorMessage) {
+      this.onPaymentResponse_(new Promise((resolve, reject) => {
+        PayFrameHelper.postMessage({
+          'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+          'error': PublicErrorCode.DEVELOPER_ERROR,
+        });
+        PaymentsAsyncClient.logDevErrorToConsole_(
+            'loadPaymentData', errorMessage);
+        reject({
+          'statusCode': Constants.ResponseStatus.DEVELOPER_ERROR,
+          'statusMessage': errorMessage
+        });
+      }));
+      return;
+    }
+
+    const paymentRequestUnavailable = window.sessionStorage.getItem(
+        Constants.IS_READY_TO_PAY_RESULT_KEY) === 'false';
+    this.loadPaymentDataApiStartTimeMs_ = Date.now();
+    if (paymentDataRequest.swg || paymentRequestUnavailable) {
+      // For SWG and clients where canMakePayment returns false, always use
+      // hosting page.
+      this.webActivityDelegate_.loadPaymentData(paymentDataRequest);
+    } else {
+      this.delegate_.loadPaymentData(paymentDataRequest);
+    }
+  }
+
+  /**
+   * Log developer error to console.
+   *
+   * @param {string} apiName
+   * @param {?string} errorMessage
+   * @private
+   */
+  static logDevErrorToConsole_(apiName, errorMessage) {
+    console.error('DEVELOPER_ERROR in ' + apiName + ' : ' + errorMessage);
+  }
+
+  /**
+   * Return a <div> element containing a Google Pay payment button.
+   *
+   * @param {ButtonOptions=} options
+   * @return {!Element}
+   * @export
+   */
+  createButton(options = {}) {
+    let button = createButtonHelper(options);
+    // Only log if button was created successfully
+    PayFrameHelper.postMessage({
+      'eventType': PostMessageEventType.LOG_RENDER_BUTTON,
+    });
+    return button;
+  }
+
+  /**
+   * @param {!Event} e postMessage event from the AMP page.
+   * @private
+   */
+  handleMessageEvent_(e) {
+    if (this.isInTrustedDomain_()) {
+      // Only handles the event right now if loaded in trusted domain.
+      if (e.data['name'] === 'logPaymentData') {
+        PayFrameHelper.postMessage(e.data['data']);
+      }
+    }
+  }
+
+  /**
+   * @private
+   * @return {boolean}
+   */
+  isInTrustedDomain_() {
+    return TRUSTED_DOMAINS.indexOf(window.location.hostname) != -1;
+  }
+
+  /**
+   * Called when load payment data result is returned. This triggers the payment
+   * response callback passed to the client.
+   *
+   * @private
+   */
+  onResult_(response) {
+    response
+        .then(result => {
+          PayFrameHelper.postMessage({
+            'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+            'clientLatencyStartMs': this.loadPaymentDataApiStartTimeMs_,
+          });
+        })
+        .catch(result => {
+          if (result['errorCode']) {
+            PayFrameHelper.postMessage({
+              'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+              'error': /** @type {!PublicErrorCode} */ (result['errorCode']),
+            });
+          } else {
+            // If user closes window we don't get a error code
+            PayFrameHelper.postMessage({
+              'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+              'error': PublicErrorCode.BUYER_CANCEL,
+            });
+          }
+        });
+    this.onPaymentResponse_(response);
+  }
+
+  /**
+   * Returns a google transaction id.
+   *
+   * @param {string} environment
+   * @return {string}
+   * @private
+   */
+  createGoogleTransactionId_(environment) {
+    return Random_uuid.uuidFast() + '.' + environment;
+  }
+}
+
+
+/**
+ * An implementation of PaymentsClientDelegateInterface that leverages payment
+ * request.
+ * @implements {PaymentsClientDelegateInterface}
+ */
+class PaymentsRequestDelegate {
+  /**
+   * @param {string} environment
+   */
+  constructor(environment) {
+    this.environment_ = environment;
+
+    /** @private {?function(!Promise<!PaymentData>)} */
+    this.callback_ = null;
+  }
+
+  /** @override */
+  onResult(callback) {
+    this.callback_ = callback;
+  }
+
+  /** @override */
+  isReadyToPay(isReadyToPayRequest) {
+    /** @type{!PaymentRequest} */
+    const paymentRequest = this.createPaymentRequest_(isReadyToPayRequest);
+    return new Promise((resolve, reject) => {
+      paymentRequest.canMakePayment()
+          .then((/** @type {boolean} */ result) => {
+            window.sessionStorage.setItem(
+                Constants.IS_READY_TO_PAY_RESULT_KEY, result.toString());
+            resolve({'result': result});
+          })
+          .catch(function(err) {
+            if (window.sessionStorage.getItem(
+                    Constants.IS_READY_TO_PAY_RESULT_KEY)) {
+              resolve({
+                'result': window.sessionStorage.getItem(
+                              Constants.IS_READY_TO_PAY_RESULT_KEY) == 'true'
+              });
+            } else {
+              resolve({'result': false});
+            }
+          });
+    });
+  }
+
+  /** @override */
+  prefetchPaymentData(paymentDataRequest) {
+    // Creating PaymentRequest instance will call
+    // Gcore isReadyToPay internally which will prefetch tempaltes.
+    this.createPaymentRequest_(
+        paymentDataRequest, this.environment_,
+        paymentDataRequest.transactionInfo.currencyCode,
+        paymentDataRequest.transactionInfo.totalPrice);
+  }
+
+  /** @override */
+  loadPaymentData(paymentDataRequest) {
+    this.loadPaymentDataThroughPaymentRequest_(paymentDataRequest);
+  }
+
+  /**
+   * Create PaymentRequest instance.
+   *
+   * @param {!IsReadyToPayRequest|!PaymentDataRequest} request The necessary information to check if user is
+   *     ready to pay or to support a payment from merchants.
+   * @param {?string=} environment (optional)
+   * @param {?string=} currencyCode (optional)
+   * @param {?string=} totalPrice (optional)
+   * @return {!PaymentRequest} PaymentRequest instance.
+   * @private
+   */
+  createPaymentRequest_(request, environment, currencyCode, totalPrice) {
+    let data = {};
+    if (request) {
+      data = Object.assign({}, request);
+    }
+    // If its a payment data request delete transaction info otherwise we don't
+    // care.
+    delete data['transactionInfo'];
+
+    // Only set the apiVersion if the merchant doesn't set it.
+    if (!data['apiVersion']) {
+      data['apiVersion'] = 1;
+    }
+    if (environment && environment == Constants.Environment.TEST) {
+      data['environment'] = environment;
+    }
+
+    const supportedInstruments = [{
+      'supportedMethods': ['https://google.com/pay'],
+      'data': data,
+    }];
+
+    const details = {
+      'total': {
+        'label': 'Estimated Total Price',
+        'amount': {
+          // currency and value are required fields in PaymentRequest, but these
+          // fields will never be used since PaymentRequest UI is skipped when
+          // we're the only payment method, so default to some value to by pass
+          // this requirement.
+          'currency': currencyCode || 'USD',
+          'value': totalPrice || '0',
+        }
+      }
+    };
+
+    return new PaymentRequest(supportedInstruments, details);
+  }
+
+  /**
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @private
+   */
+  loadPaymentDataThroughPaymentRequest_(paymentDataRequest) {
+    const paymentRequest = this.createPaymentRequest_(
+        paymentDataRequest, this.environment_,
+        paymentDataRequest.transactionInfo.currencyCode,
+        paymentDataRequest.transactionInfo.totalPrice);
+    this.callback_(
+        /** @type{!Promise<!PaymentData>} */
+        (paymentRequest.show()
+             .then(
+                 /**
+                  * @param {!PaymentResponse} paymentResponse
+                  * @return {!PaymentData}
+                  */
+                 (paymentResponse) => {
+                   // Should be called to dismiss any remaining UI
+                   paymentResponse.complete('success');
+                   return paymentResponse.details;
+                 })
+             .catch(function(err) {
+               err['statusCode'] = Constants.ResponseStatus.CANCELED;
+               throw err;
+             })));
+  }
+}
+
+const IFRAME_CLOSE_DURATION_IN_MS = 300;
+const IFRAME_SHOW_UP_DURATION_IN_MS = 300;
+const ERROR_PREFIX = 'Error: ';
+
+/**
+ * Supported browser user agent keys.
+ *
+ * @enum {string}
+ */
+const BrowserUserAgent = {
+  CHROME: 'Chrome',
+  FIREFOX: 'Firefox',
+  SAFARI: 'Safari',
+};
+
+
+/**
+ * An implementation of PaymentsClientDelegateInterface that uses the custom
+ * hosting page along with web activities to actually get to the hosting page.
+ * @implements {PaymentsClientDelegateInterface}
+ */
+class PaymentsWebActivityDelegate {
+  /**
+   * @param {string} environment
+   * @param {string} googleTransactionId
+   * @param {boolean=} opt_useIframe
+   */
+  constructor(environment, googleTransactionId, opt_useIframe) {
+    this.environment_ = environment;
+    /** @private @const {boolean} */
+    this.useIframe_ = opt_useIframe || false;
+    this.activities = new ActivityPorts(window);
+    /** @private {?function(!Promise<!PaymentData>)} */
+    this.callback_ = null;
+    /**
+     * @private {?{
+     *             container: !Element,
+     *             iframe:!HTMLIFrameElement,
+     *             request:!PaymentDataRequest,
+     *             dataPromise:?Promise<!PaymentData>}}
+     */
+    this.prefetchedObjects_ = null;
+    /** @private {boolean} */
+    this.shouldHandleResizing_ = false;
+    /** @private {?ActivityIframePort} */
+    this.port_ = null;
+    /** @private {?function(!Promise<void>)} */
+    this.dismissPromiseResolver_ = null;
+    /** @const @private {string} */
+    this.googleTransactionId_ = googleTransactionId;
+
+    /**
+     * @private {?ResizePayload}
+     */
+    this.savedResizePayload_ = null;
+
+    PayFrameHelper.setGoogleTransactionId(this.googleTransactionId_);
+
+    injectStyleSheet(Constants.IFRAME_STYLE);
+  }
+
+  /** @override */
+  onResult(callback) {
+    if (this.callback_) {
+      return;
+    }
+    this.callback_ = callback;
+    this.activities.onResult('request1', (port) => {
+      // Only verified origins are allowed.
+      callback(port.acceptResult().then(
+          (result) => {
+            const data = /** @type {!PaymentData} */ (result.data);
+            if (data['redirectEncryptedCallbackData']) {
+              PayFrameHelper.setBuyFlowActivityMode(
+                  BuyFlowActivityMode.REDIRECT);
+              return fetch(this.getDecryptionUrl_(), {
+                       method: 'post',
+                       credentials: 'include',
+                       mode: 'cors',
+                       body: data['redirectEncryptedCallbackData'],
+                     })
+                  .then((response) => {
+                    return response.json();
+                  });
+            }
+            return data;
+          },
+          (error) => {
+            // TODO: Log the original and the inferred error to eye3.
+            let originalError = error['message'];
+            let inferredError = error['message'];
+            try {
+              // Try to parse the error message to a structured error, if it's
+              // not possible, fallback to use the error message string.
+              inferredError =
+                  JSON.parse(originalError.substring(ERROR_PREFIX.length));
+            } catch (e) {
+            }
+            if (inferredError['statusCode'] && [
+                  'DEVELOPER_ERROR', 'MERCHANT_ACCOUNT_ERROR'
+                ].indexOf(inferredError['statusCode']) == -1) {
+              inferredError = {
+                'statusCode': 'CANCELED',
+              };
+            }
+            if (inferredError == 'AbortError') {
+              inferredError = {
+                'statusCode': 'CANCELED',
+              };
+            }
+            console.log(
+                'Google Pay request failed, error:\n' +
+                JSON.stringify(inferredError));
+            return Promise.reject(inferredError);
+          }));
+    });
+  }
+
+  /** @override */
+  isReadyToPay(isReadyToPayRequest) {
+    return new Promise((resolve, reject) => {
+      if (doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest)) {
+        resolve({'result': false});
+        return;
+      }
+      const userAgent = window.navigator.userAgent;
+      const isIosGsa = userAgent.indexOf('GSA/') > 0 &&
+          userAgent.indexOf(BrowserUserAgent.SAFARI) > 0;
+      if (isIosGsa) {
+        resolve({'result': false});
+        return;
+      }
+      const isFirefoxIos = userAgent.indexOf('FxiOS') > 0;
+      if (isFirefoxIos) {
+        resolve({'result': false});
+        return;
+      }
+      const isEdge = userAgent.indexOf('Edge/') > 0;
+      if (isEdge) {
+        resolve({'result': false});
+        return;
+      }
+      const isSupported = userAgent.indexOf(BrowserUserAgent.CHROME) > 0 ||
+          userAgent.indexOf(BrowserUserAgent.FIREFOX) > 0 ||
+          userAgent.indexOf(BrowserUserAgent.SAFARI) > 0;
+      resolve({'result': isSupported});
+    });
+  }
+
+  /** @override */
+  prefetchPaymentData(paymentDataRequest) {
+    // Only handles prefetch for iframe for now.
+    if (!this.useIframe_) {
+      return;
+    }
+    const containerAndFrame = this.injectIframe_();
+    const paymentDataPromise = this.openIframe_(
+        containerAndFrame['container'], containerAndFrame['iframe'],
+        paymentDataRequest);
+    this.prefetchedObjects_ = {
+      'container': containerAndFrame['container'],
+      'iframe': containerAndFrame['iframe'],
+      'request': paymentDataRequest,
+      'dataPromise': paymentDataPromise,
+    };
+  }
+
+  /** @override */
+  loadPaymentData(paymentDataRequest) {
+    const internalParam = {
+      'startTimeMs': Date.now(),
+      'googleTransactionId': this.googleTransactionId_,
+    };
+    paymentDataRequest['i'] = paymentDataRequest['i'] ?
+        Object.assign(internalParam, paymentDataRequest['i']) :
+        internalParam;
+    if (!paymentDataRequest.swg) {
+      // Only set the apiVersion if the merchant is not setting it.
+      if (!paymentDataRequest.apiVersion) {
+        paymentDataRequest.apiVersion = 1;
+      }
+    }
+    paymentDataRequest.environment = this.environment_;
+    if (this.useIframe_) {
+      PayFrameHelper.setBuyFlowActivityMode(BuyFlowActivityMode.IFRAME);
+      // TODO: Compare the request with prefetched request.
+      // goog.object.equals won't work as it doesn't do deep comparison.
+      let containerAndFrame;
+      let paymentDataPromise;
+      if (this.prefetchedObjects_) {
+        // Rendering prefetched frame and container.
+        containerAndFrame = this.prefetchedObjects_;
+        paymentDataPromise = this.prefetchedObjects_['dataPromise'];
+        this.prefetchedObjects_ = null;
+      } else {
+        containerAndFrame = this.injectIframe_();
+        paymentDataPromise = this.openIframe_(
+            containerAndFrame['container'], containerAndFrame['iframe'],
+            paymentDataRequest);
+      }
+      this.showContainerAndIframeWithAnimation_(
+          containerAndFrame['container'], containerAndFrame['iframe']);
+      const dismissPromise = new Promise(resolve => {
+        this.dismissPromiseResolver_ = resolve;
+      });
+      this.callback_(Promise.race([paymentDataPromise, dismissPromise]));
+      return;
+    }
+    PayFrameHelper.setBuyFlowActivityMode(
+        paymentDataRequest['forceRedirect'] ? BuyFlowActivityMode.REDIRECT :
+                                              BuyFlowActivityMode.POPUP);
+    this.activities.open(
+        'request1', this.getHostingPageUrl_(),
+        this.getRenderMode_(paymentDataRequest), paymentDataRequest,
+        {'width': 600, 'height': 600});
+  }
+
+
+  /**
+   * Returns the render mode whether need to force redirect.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @return {string}
+   * @private
+   */
+  getRenderMode_(paymentDataRequest) {
+    return paymentDataRequest['forceRedirect'] ? '_top' : 'gp-js-popup';
+  }
+
+  /**
+   * Returns the base path based on the environment.
+   *
+   * @private
+   * @return {string} The base path
+   */
+  getBasePath_() {
+    var baseDomain;
+    if (this.environment_ == Constants.Environment.SANDBOX) {
+      baseDomain = 'https://pay.sandbox.google.com';
+    } else {
+      baseDomain = 'https://pay.google.com';
+    }
+    return baseDomain + "/gp/p";
+  }
+
+  /**
+   * Returns the decryption url to be used to decrypt the encrypted payload.
+   *
+   * @private
+   * @return {string} The decryption url
+   */
+  getDecryptionUrl_() {
+    return this.getBasePath_() + '/apis/buyflow/process';
+  }
+
+  /**
+   * Returns the hosting page url.
+   *
+   * @private
+   * @return {string} The hosting page url
+   */
+  getHostingPageUrl_() {
+    return this.getBasePath_() + '/ui/pay';
+  }
+
+  /**
+   * Returns the iframe pwg url to be used to be used for amp.
+   *
+   * @param {string} environment
+   * @param {string} origin
+   * @return {string} The iframe url
+   */
+  getIframeUrl(environment, origin) {
+    // TODO: These should be compile time constants and not dependent
+    // on the environment.
+    let iframeUrl = `https://pay.google.com/gp/p/ui/pay?origin=${origin}`;
+    if (environment == Constants.Environment.SANDBOX) {
+      iframeUrl = `https://pay.sandbox.google.com/gp/p/ui/pay?origin=${origin}`;
+    }
+    return iframeUrl;
+  }
+
+  /**
+   * Close iframe with animation.
+   *
+   * @param {!Element} container
+   * @param {!HTMLIFrameElement} iframe
+   * @private
+   */
+  removeIframeAndContainer_(container, iframe) {
+    const transitionStyle = 'all ' + IFRAME_CLOSE_DURATION_IN_MS + 'ms ease 0s';
+    this.setTransition_(iframe, transitionStyle);
+    iframe.height = '0px';
+    // TODO: This should be replaced by listening to TransitionEnd event
+    setTimeout(() => {
+      container.parentNode.removeChild(container);
+    }, IFRAME_CLOSE_DURATION_IN_MS);
+  }
+
+  /**
+   * @return {{container: !Element, iframe:!HTMLIFrameElement}}
+   * @private
+   */
+  injectIframe_() {
+    const containerAndFrame = injectIframe();
+    const iframe = containerAndFrame['iframe'];
+    const container = containerAndFrame['container'];
+    container.addEventListener(
+        'click', this.dismissIframe_.bind(this, containerAndFrame));
+    // Hide iframe and disable resize at initialize.
+    container.style.display = 'none';
+    iframe.style.display = 'none';
+    iframe.height = '0px';
+    const transitionStyle =
+        'all ' + IFRAME_SHOW_UP_DURATION_IN_MS + 'ms ease 0s';
+    this.setTransition_(iframe, transitionStyle);
+    this.shouldHandleResizing_ = false;
+    return containerAndFrame;
+  }
+
+  /**
+   * @param {{container: !Element, iframe:!HTMLIFrameElement}} containerAndFrame
+   * @private
+   */
+  dismissIframe_(containerAndFrame) {
+    // TODO: Think about whether this could be just hide instead of
+    // disconnect and remove, the tricky part is how to handle the case where
+    // payment data request is not the same.
+    this.dismissPromiseResolver_(
+        Promise.reject({'errorCode': 'CANCELED'}));
+    this.removeIframeAndContainer_(
+        containerAndFrame['container'], containerAndFrame['iframe']);
+    this.port_.disconnect();
+  }
+
+  /**
+   * @param {!Element} container
+   * @param {!HTMLIFrameElement} iframe
+   * @private
+   */
+  showContainerAndIframeWithAnimation_(container, iframe) {
+    container.style.display = 'block';
+    iframe.style.display = 'block';
+    setTimeout(() => {
+      // Hard code the apprx height here, it will be resize to expected height
+      // later.
+      iframe.height = '260px';
+      // TODO: This should be handles properly by listening to
+      // TransitionEnd event.
+      setTimeout(() => {
+        this.shouldHandleResizing_ = true;
+        // TODO: Add browser test that catches this.
+        if (this.savedResizePayload_) {
+          this.setTransition_(iframe, this.savedResizePayload_['transition']);
+          iframe.height = this.savedResizePayload_['height'];
+          this.savedResizePayload_ = null;
+        }
+      }, IFRAME_SHOW_UP_DURATION_IN_MS);
+    }, 1);
+  }
+
+  /**
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} transitionStyle
+   * @private
+   */
+  setTransition_(iframe, transitionStyle) {
+    iframe.style.setProperty('transition', transitionStyle);
+    // For safari.
+    iframe.style.setProperty('-webkit-transition', transitionStyle);
+  }
+
+  /**
+   * Use WebActivitiy to open iframe that's in given container.
+   *
+   * @param {!Element} container
+   * @param {!HTMLIFrameElement} iframe
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @return {!Promise<!PaymentData>}
+   * @private
+   */
+  openIframe_(container, iframe, paymentDataRequest) {
+    if (!paymentDataRequest.swg) {
+      if (!paymentDataRequest.apiVersion) {
+        paymentDataRequest.apiVersion = 1;
+      }
+      paymentDataRequest.allowedPaymentMethods = [Constants.PaymentMethod.CARD];
+    }
+    paymentDataRequest.environment = this.environment_;
+    const trustedUrl =
+        this.getIframeUrl(this.environment_, window.location.origin);
+    return this.activities.openIframe(iframe, trustedUrl, paymentDataRequest)
+        .then(port => {
+          // Handle custom resize message.
+          this.port_ = port;
+          port.onMessage(payload => {
+            if (payload['type'] !== 'resize' || !this.shouldHandleResizing_) {
+              // Save the resize event later after initial animation is finished
+              this.savedResizePayload_ = {
+                'height': payload['height'],
+                'transition': payload['transition']
+              };
+              return;
+            }
+            this.setTransition_(iframe, payload['transition']);
+            iframe.height = payload['height'];
+          });
+          return /** @type {!Promise<!Object>} */ (port.acceptResult());
+        })
+        .then(
+            /**
+             * @param {!Object} result
+             * @return {!PaymentData}
+             */
+            result => {
+              this.removeIframeAndContainer_(container, iframe);
+              const data = /** @type {!PaymentData} */ (result['data']);
+              return data;
+            },
+            error => {
+              this.removeIframeAndContainer_(container, iframe);
+              return Promise.reject(error);
+            });
+  }
+}
+
+
+
+
+/**
+ * An object-literal namespace
+ */
+google.payments = {};
+google.payments.api = {};
+
+/**
+ * The client for interacting with the Google Pay APIs.
+ * @constructor
+ * @see https://developers.google.com/pay/api/web/client-reference.
+ */
+google.payments.api.PaymentsClient = function(paymentOptions, opt_useIframe) {};
+
+/**
+ * @see https://developers.google.com/pay/api/web/client-reference#isReadyToPay
+ */
+google.payments.api.PaymentsClient.prototype.isReadyToPay = function() {};
+
+/**
+ * @see https://developers.google.com/pay/api/web/client-reference#loadPaymentData
+ */
+google.payments.api.PaymentsClient.prototype.loadPaymentData = function() {};
+
+/**
+ * @see https://developers.google.com/pay/api/web/client-reference#prefetchPaymentData
+ */
+google.payments.api.PaymentsClient.prototype.prefetchPaymentData =
+    function() {};
+
+
+/**
+ * Service wrapping window.parent.postMessage. This enables
+ * window.postMessage to be swapped out in unit tests.
+ */
+class PostMessageService {
+  constructor(window) {
+    /** @private @const {!Window} */
+    this.window_ = window;
+  }
+
+  /**
+   * Passthrough to Window#postMessage. See Window#postMessage DOM API
+   * documentation for more information about arguments.
+   *
+   * @param {!Object} message
+   * @param {string} targetOrigin
+   */
+  postMessage(message, targetOrigin) {
+    this.window_.postMessage(message, targetOrigin);
+  }
+}
+
+/**
+ * @return {boolean} true if this version of Chrome supports PaymentRequest.
+ */
+function chromeSupportsPaymentRequest() {
+  // Opera uses chrome as rendering engine and sends almost the exact same
+  // user agent as chrome thereby fooling us on android.
+  const isOpera = window.navigator.userAgent.indexOf('OPR/') != -1;
+  if (isOpera) {
+    return false;
+  }
+  const androidPlatform = window.navigator.userAgent.match(/Android/i);
+  const chromeVersion = window.navigator.userAgent.match(/Chrome\/([0-9]+)\./i);
+  return androidPlatform != null && 'PaymentRequest' in window &&
+      // Make sure skipping PaymentRequest UI when only one PaymentMethod is
+      // supported (starts on Google Chrome 59).
+      window.navigator.vendor == 'Google Inc.' && chromeVersion != null &&
+      Number(chromeVersion[1]) >= 59;
+}
+
+/**
+ * @param {!IsReadyToPayRequest} isReadyToPayRequest
+ *
+ * @return {boolean} true if the merchant only supports tokenized cards.
+ */
+function doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest) {
+  return isReadyToPayRequest.allowedPaymentMethods.length == 1 &&
+      isReadyToPayRequest.allowedPaymentMethods[0] ==
+      Constants.PaymentMethod.TOKENIZED_CARD;
+}
+
+/**
+ * Validate if is secure context. Returns null if context is secure, otherwise
+ * return error message.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts
+ *
+ * @return {?string} null if current context is secure, otherwise return error
+ * message.
+ */
+function validateSecureContext() {
+  if (window.location.hostname.endsWith(Constants.TRUSTED_DOMAIN)) {
+    // This is for local development.
+    return null;
+  }
+  if (window.isSecureContext === undefined) {
+    // Browser not support isSecureContext, figure out a way to validate this
+    // for the unsupported browser.
+    return null;
+  }
+  return window.isSecureContext ?
+      null :
+      'Google Pay APIs should be called in secure context!';
+}
+
+/**
+ * Validate PaymentOptions.
+ *
+ * @param {!PaymentOptions} paymentOptions
+ */
+function validatePaymentOptions(paymentOptions) {
+  if (paymentOptions.environment &&
+      !Object.values(Constants.Environment)
+           .includes(paymentOptions.environment)) {
+    throw new Error(
+        'Parameter environment in PaymentOptions can optionally be set to ' +
+        'PRODUCTION, otherwise it defaults to TEST.');
+  }
+}
+
+/**
+ * Validate IsReadyToPayRequest.
+ *
+ * @param {!IsReadyToPayRequest} isReadyToPayRequest
+ * @return {?string} errorMessage if the request is invalid.
+ */
+function validateIsReadyToPayRequest(isReadyToPayRequest) {
+  if (!isReadyToPayRequest) {
+    return 'isReadyToPayRequest must be set!';
+  } else if (
+      !isReadyToPayRequest.allowedPaymentMethods ||
+      !Array.isArray(isReadyToPayRequest.allowedPaymentMethods) ||
+      isReadyToPayRequest.allowedPaymentMethods.length == 0 ||
+      !isReadyToPayRequest.allowedPaymentMethods.every(isPaymentMethodValid)) {
+    return 'allowedPaymentMethods must be set to an array containing \'CARD\' ' +
+        'and/or \'TOKENIZED_CARD\'!';
+  }
+  return null;
+}
+
+/**
+ * Validate the payment method.
+ *
+ * @param {string} paymentMethod
+ * @return {boolean} if the current payment method is valid.
+ */
+function isPaymentMethodValid(paymentMethod) {
+  return Object.values(Constants.PaymentMethod).includes(paymentMethod);
+}
+
+/**
+ * Validate PaymentDataRequest.
+ *
+ * @param {!PaymentDataRequest} paymentDataRequest
+ * @return {?string} errorMessage if the request is invalid.
+ */
+function validatePaymentDataRequest(paymentDataRequest) {
+  if (!paymentDataRequest) {
+    return 'paymentDataRequest must be set!';
+  }
+  if (paymentDataRequest.swg) {
+    return validatePaymentDataRequestForSwg(paymentDataRequest.swg);
+  } else if (!paymentDataRequest.transactionInfo) {
+    return 'transactionInfo must be set!';
+  } else if (!paymentDataRequest.transactionInfo.currencyCode) {
+    return 'currencyCode in transactionInfo must be set!';
+  } else if (
+      !paymentDataRequest.transactionInfo.totalPriceStatus ||
+      !Object.values(Constants.TotalPriceStatus)
+           .includes(paymentDataRequest.transactionInfo.totalPriceStatus)) {
+    return 'totalPriceStatus in transactionInfo must be set to one of' +
+        ' NOT_CURRENTLY_KNOWN, ESTIMATED or FINAL!';
+  } else if (
+      paymentDataRequest.transactionInfo.totalPriceStatus !==
+          'NOT_CURRENTLY_KNOWN' &&
+      !paymentDataRequest.transactionInfo.totalPrice) {
+    return 'totalPrice in transactionInfo must be set when' +
+        ' totalPriceStatus is ESTIMATED or FINAL!';
+  }
+  return null;
+}
+
+/**
+ * Validate parameters for swg.
+ *
+ * @param {?SwgParameters} swgParameters
+ * @return {?string} errorMessage if the request is invalid.
+ */
+function validatePaymentDataRequestForSwg(swgParameters) {
+  if (!swgParameters) {
+    return 'Swg parameters must be provided';
+  }
+  if (!swgParameters.skuId || !swgParameters.publicationId) {
+    return 'Both skuId and publicationId must be provided';
+  }
+  return null;
+}
+
+export { PaymentsClient, createButtonHelper, resetButtonStylesheet };
diff --git a/third_party/moment/moment.extern.js b/third_party/moment/moment.extern.js
index a96ea7527befb..0be769e9782bd 100644
--- a/third_party/moment/moment.extern.js
+++ b/third_party/moment/moment.extern.js
@@ -100,10 +100,10 @@ moment.Locale = function() {};
  * @param {string} format
  * @return {string}
  */
-moment.Locale.longDateFormat = function (format) {};
+moment.Locale.longDateFormat = function(format) {};
 
 /** @return {moment.Locale} */
-moment.prototype.localeData = function () {};
+moment.prototype.localeData = function() {};
 
 /** @return {!moment} */
-moment.prototype.duration = function () {};
+moment.prototype.duration = function() {};
diff --git a/third_party/subscriptions-project/config.js b/third_party/subscriptions-project/config.js
index 60d5645b3079b..d7eb64cd4e4de 100644
--- a/third_party/subscriptions-project/config.js
+++ b/third_party/subscriptions-project/config.js
@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-/** Version: 0.1.22.84 */
+/** Version: 0.1.22.91 */
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
@@ -58,27 +58,28 @@ function onDocumentReady(doc, callback) {
 }
 
 /**
- * Calls the callback when document's state satisfies the stateFn.
+ * Calls the callback once when document's state satisfies the condition.
  * @param {!Document} doc
- * @param {function(!Document):boolean} stateFn
+ * @param {function(!Document):boolean} condition
  * @param {function(!Document)} callback
  */
-function onDocumentState(doc, stateFn, callback) {
-  let ready = stateFn(doc);
-  if (ready) {
+function onDocumentState(doc, condition, callback) {
+  if (condition(doc)) {
+    // Execute callback right now.
     callback(doc);
-  } else {
-    const readyListener = () => {
-      if (stateFn(doc)) {
-        if (!ready) {
-          ready = true;
-          callback(doc);
-        }
-        doc.removeEventListener('readystatechange', readyListener);
-      }
-    };
-    doc.addEventListener('readystatechange', readyListener);
+    return;
   }
+
+  // Execute callback (once!) after condition is satisfied.
+  let callbackHasExecuted = false;
+  const readyListener = () => {
+    if (condition(doc) && !callbackHasExecuted) {
+      callback(doc);
+      callbackHasExecuted = true;
+      doc.removeEventListener('readystatechange', readyListener);
+    }
+  };
+  doc.addEventListener('readystatechange', readyListener);
 }
 
 /**
@@ -493,28 +494,8 @@ function hasNextNodeInDocumentOrder(element, stopNode) {
  */
 
 /**
- * Determines if value is actually an Array.
- * @param {*} value
- * @return {boolean}
- */
-function isArray(value) {
-  return Array.isArray(value);
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @fileoverview This module declares JSON types as defined in the
+ * {@link http://json.org/}.
  */
 
 /**
@@ -700,7 +681,7 @@ class TypeChecker {
    * @private
    */
   toArray_(value) {
-    return isArray(value) ? value : [value];
+    return Array.isArray(value) ? value : [value];
   }
 }
 
@@ -876,7 +857,7 @@ class JsonLdParser {
     if (value == null || value === '') {
       return null;
     }
-    return isArray(value) ? value : [value];
+    return Array.isArray(value) ? value : [value];
   }
 
   /**
diff --git a/third_party/subscriptions-project/swg.js b/third_party/subscriptions-project/swg.js
index 6f24314c4ca0f..20326086dc1ad 100644
--- a/third_party/subscriptions-project/swg.js
+++ b/third_party/subscriptions-project/swg.js
@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-/** Version: 0.1.22.84 */
+/** Version: 0.1.22.91 */
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
@@ -47,6 +47,12 @@ const AnalyticsEvent = {
   IMPRESSION_LINK: 12,
   IMPRESSION_SAVE_SUBSCR_TO_GOOGLE: 13,
   IMPRESSION_GOOGLE_UPDATED: 14,
+  IMPRESSION_SHOW_OFFERS_SMARTBOX: 15,
+  IMPRESSION_SHOW_OFFERS_SWG_BUTTON: 16,
+  IMPRESSION_SELECT_OFFER_SMARTBOX: 17,
+  IMPRESSION_SELECT_OFFER_SWG_BUTTON: 18,
+  IMPRESSION_SHOW_CONTRIBUTIONS_SWG_BUTTON: 19,
+  IMPRESSION_SELECT_CONTRIBUTION_SWG_BUTTON: 20,
   ACTION_SUBSCRIBE: 1000,
   ACTION_PAYMENT_COMPLETE: 1001,
   ACTION_ACCOUNT_CREATED: 1002,
@@ -64,6 +70,10 @@ const AnalyticsEvent = {
   ACTION_USER_CANCELED_PAYFLOW: 1014,
   ACTION_SAVE_SUBSCR_TO_GOOGLE_CONTINUE: 1015,
   ACTION_SAVE_SUBSCR_TO_GOOGLE_CANCEL: 1016,
+  ACTION_SWG_BUTTON_SHOW_OFFERS_CLICK: 1017,
+  ACTION_SWG_BUTTON_SELECT_OFFER_CLICK: 1018,
+  ACTION_SWG_BUTTON_SHOW_CONTRIBUTIONS_CLICK: 1019,
+  ACTION_SWG_BUTTON_SELECT_CONTRIBUTION_CLICK: 1020,
   EVENT_PAYMENT_FAILED: 2000,
   EVENT_CUSTOM: 3000,
   EVENT_CONFIRM_TX_ID: 3001,
@@ -230,6 +240,12 @@ class AnalyticsContext {
 
     /** @private {!Array<string>} */
     this.label_ = data[9] || [];
+
+    /** @private {?string} */
+    this.clientVersion_ = (data[10] == null) ? null : data[10];
+
+    /** @private {?string} */
+    this.url_ = (data[11] == null) ? null : data[11];
   }
 
   /**
@@ -358,6 +374,34 @@ class AnalyticsContext {
     this.label_ = value;
   }
 
+  /**
+   * @return {?string}
+   */
+  getClientVersion() {
+    return this.clientVersion_;
+  }
+
+  /**
+   * @param {string} value
+   */
+  setClientVersion(value) {
+    this.clientVersion_ = value;
+  }
+
+  /**
+   * @return {?string}
+   */
+  getUrl() {
+    return this.url_;
+  }
+
+  /**
+   * @param {string} value
+   */
+  setUrl(value) {
+    this.url_ = value;
+  }
+
   /**
    * @return {!Array}
    * @override
@@ -374,6 +418,8 @@ class AnalyticsContext {
       this.sku_,  // field 7 - sku
       this.readyToPay_,  // field 8 - ready_to_pay
       this.label_,  // field 9 - label
+      this.clientVersion_,  // field 10 - client_version
+      this.url_,  // field 11 - url
     ];
   }
 
@@ -703,6 +749,71 @@ class EventParams {
   }
 }
 
+/**
+ * @implements {Message}
+ */
+class FinishedLoggingResponse {
+ /**
+  * @param {!Array=} data
+  */
+  constructor(data = []) {
+
+    /** @private {?boolean} */
+    this.complete_ = (data[1] == null) ? null : data[1];
+
+    /** @private {?string} */
+    this.error_ = (data[2] == null) ? null : data[2];
+  }
+
+  /**
+   * @return {?boolean}
+   */
+  getComplete() {
+    return this.complete_;
+  }
+
+  /**
+   * @param {boolean} value
+   */
+  setComplete(value) {
+    this.complete_ = value;
+  }
+
+  /**
+   * @return {?string}
+   */
+  getError() {
+    return this.error_;
+  }
+
+  /**
+   * @param {string} value
+   */
+  setError(value) {
+    this.error_ = value;
+  }
+
+  /**
+   * @return {!Array}
+   * @override
+   */
+  toArray() {
+    return [
+      this.label(),  // message label
+      this.complete_,  // field 1 - complete
+      this.error_,  // field 2 - error
+    ];
+  }
+
+  /**
+   * @return {string}
+   * @override
+   */
+  label() {
+    return 'FinishedLoggingResponse';
+  }
+}
+
 /**
  * @implements {Message}
  */
@@ -829,6 +940,15 @@ class SkuSelectedResponse {
 
     /** @private {?string} */
     this.oldSku_ = (data[2] == null) ? null : data[2];
+
+    /** @private {?boolean} */
+    this.oneTime_ = (data[3] == null) ? null : data[3];
+
+    /** @private {?string} */
+    this.playOffer_ = (data[4] == null) ? null : data[4];
+
+    /** @private {?string} */
+    this.oldPlayOffer_ = (data[5] == null) ? null : data[5];
   }
 
   /**
@@ -859,6 +979,48 @@ class SkuSelectedResponse {
     this.oldSku_ = value;
   }
 
+  /**
+   * @return {?boolean}
+   */
+  getOneTime() {
+    return this.oneTime_;
+  }
+
+  /**
+   * @param {boolean} value
+   */
+  setOneTime(value) {
+    this.oneTime_ = value;
+  }
+
+  /**
+   * @return {?string}
+   */
+  getPlayOffer() {
+    return this.playOffer_;
+  }
+
+  /**
+   * @param {string} value
+   */
+  setPlayOffer(value) {
+    this.playOffer_ = value;
+  }
+
+  /**
+   * @return {?string}
+   */
+  getOldPlayOffer() {
+    return this.oldPlayOffer_;
+  }
+
+  /**
+   * @param {string} value
+   */
+  setOldPlayOffer(value) {
+    this.oldPlayOffer_ = value;
+  }
+
   /**
    * @return {!Array}
    * @override
@@ -868,6 +1030,9 @@ class SkuSelectedResponse {
       this.label(),  // message label
       this.sku_,  // field 1 - sku
       this.oldSku_,  // field 2 - old_sku
+      this.oneTime_,  // field 3 - one_time
+      this.playOffer_,  // field 4 - play_offer
+      this.oldPlayOffer_,  // field 5 - old_play_offer
     ];
   }
 
@@ -1029,6 +1194,7 @@ const PROTO_MAP = {
   'AnalyticsRequest': AnalyticsRequest,
   'EntitlementsResponse': EntitlementsResponse,
   'EventParams': EventParams,
+  'FinishedLoggingResponse': FinishedLoggingResponse,
   'LinkSaveTokenRequest': LinkSaveTokenRequest,
   'LinkingInfoResponse': LinkingInfoResponse,
   'SkuSelectedResponse': SkuSelectedResponse,
@@ -1065,8 +1231,7 @@ function getLabel(messageType) {
 }
 
 /**
- * @license
- * Copyright 2017 The Web Activities Authors. All Rights Reserved.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -1081,3181 +1246,2675 @@ function getLabel(messageType) {
  * limitations under the License.
  */
 
-/*eslint no-unused-vars: 0*/
-
-
 /**
- * @enum {string}
+ * abstract View Class. Used to render the content within the Dialog. The
+ * extended class has actual content.
+ * @abstract
  */
-const ActivityMode = {
-  IFRAME: 'iframe',
-  POPUP: 'popup',
-  REDIRECT: 'redirect',
-};
-
+class View {
+  /**
+   * Empty constructor.
+   */
+  constructor() {}
 
-/**
- * The result code used for `ActivityResult`.
- * @enum {string}
- */
-const ActivityResultCode = {
-  OK: 'ok',
-  CANCELED: 'canceled',
-  FAILED: 'failed',
-};
+  /**
+   * Gets the iframe element.
+   * @return {!Element}
+   * @abstract
+   */
+  getElement() {}
 
+  /**
+   * @param {!./dialog.Dialog} unusedDialog
+   * @return {!Promise}
+   * @abstract
+   */
+  init(unusedDialog) {}
 
-/**
- * The result of an activity. The activity implementation returns this object
- * for a successful result, a cancelation or a failure.
- * @struct
- */
-class ActivityResult {
   /**
-   * @param {!ActivityResultCode} code
-   * @param {*} data
-   * @param {!ActivityMode} mode
-   * @param {string} origin
-   * @param {boolean} originVerified
-   * @param {boolean} secureChannel
+   * Resizes the content.
    */
-  constructor(code, data, mode, origin, originVerified, secureChannel) {
-    /** @const {!ActivityResultCode} */
-    this.code = code;
-    /** @const {*} */
-    this.data = code == ActivityResultCode.OK ? data : null;
-    /** @const {!ActivityMode} */
-    this.mode = mode;
-    /** @const {string} */
-    this.origin = origin;
-    /** @const {boolean} */
-    this.originVerified = originVerified;
-    /** @const {boolean} */
-    this.secureChannel = secureChannel;
-    /** @const {boolean} */
-    this.ok = code == ActivityResultCode.OK;
-    /** @const {?Error} */
-    this.error = code == ActivityResultCode.FAILED ?
-        new Error(String(data) || '') :
-        null;
+  resized() {
+    // Do nothing by default. Override if needed.
   }
-}
 
+  /**
+   * Accept the result.
+   * @return {!Promise}
+   * @abstract
+   */
+  whenComplete() {}
 
-/**
- * The activity request that different types of hosts can be started with.
- * @typedef {{
- *   requestId: string,
- *   returnUrl: string,
- *   args: ?Object,
- *   origin: (string|undefined),
- *   originVerified: (boolean|undefined),
- * }}
- */
-let ActivityRequest;
+  /**
+   * @return {boolean}
+   * @abstract
+   */
+  shouldFadeBody() {}
 
+  /**
+   * @return {boolean}
+   * @abstract
+   */
+  hasLoadingIndicator() {}
+}
 
 /**
- * The activity "open" options used for popups and redirects.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
- * - returnUrl: override the return URL. By default, the current URL will be
- *   used.
- * - skipRequestInUrl: removes the activity request from the URL, in case
- *   redirect is used. By default, the activity request is appended to the
- *   activity URL. This option can be used if the activity request is passed
- *   to the activity by some alternative means.
- * - disableRedirectFallback: disallows popup fallback to redirect. By default
- *   the redirect fallback is allowed. This option has to be used very carefully
- *   because there are many user agents that may fail to open a popup and it
- *   won't be always possible for the opener window to even be aware of such
- *   failures.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
  *
- * @typedef {{
- *   returnUrl: (string|undefined),
- *   skipRequestInUrl: (boolean|undefined),
- *   disableRedirectFallback: (boolean|undefined),
- *   width: (number|undefined),
- *   height: (number|undefined),
- * }}
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-let ActivityOpenOptions;
-
 
 /**
- * Activity client-side binding. The port provides limited ways to communicate
- * with the activity and receive signals and results from it. Not every type
- * of activity exposes a port.
- *
- * @interface
+ * @param {!../components/activities.ActivityPortDef} port
+ * @param {string} requireOrigin
+ * @param {boolean} requireOriginVerified
+ * @param {boolean} requireSecureChannel
+ * @return {!Promise<!Object>}
  */
-class ActivityPort {
-
-  /**
-   * Returns the mode of the activity: iframe, popup or redirect.
-   * @return {!ActivityMode}
-   */
-  getMode() {}
-
-  /**
-   * Accepts the result when ready. The client should verify the activity's
-   * mode, origin, verification and secure channel flags before deciding
-   * whether or not to trust the result.
-   *
-   * Returns the promise that yields when the activity has been completed and
-   * either a result, a cancelation or a failure has been returned.
-   *
-   * @return {!Promise<!ActivityResult>}
-   */
-  acceptResult() {}
+function acceptPortResultData(
+  port,
+  requireOrigin,
+  requireOriginVerified,
+  requireSecureChannel
+) {
+  return port.acceptResult().then(result => {
+    if (
+      result.origin != requireOrigin ||
+      (requireOriginVerified && !result.originVerified) ||
+      (requireSecureChannel && !result.secureChannel)
+    ) {
+      throw new Error('channel mismatch');
+    }
+    return result.data;
+  });
 }
 
-
 /**
- * Activity client-side binding for messaging.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
- * Whether the host can or cannot receive a message depends on the type of
- * host and its state. Ensure that the code has an alternative path if
- * messaging is not available.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
  *
- * @interface
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-class ActivityMessagingPort {
-
-  /**
-   * Returns the target window where host is loaded. May be unavailable.
-   * @return {?Window}
-   */
-  getTargetWin() {}
 
-  /**
-   * Sends a message to the host.
-   * @param {!Object} payload
-   */
-  message(payload) {}
+/**
+ * Debug logger, only log message if #swg.log=1
+ * @param {...*} var_args [decription]
+ */
 
-  /**
-   * Registers a callback to receive messages from the host.
-   * @param {function(!Object)} callback
-   */
-  onMessage(callback) {}
+/* eslint-disable */
 
-  /**
-   * Creates a new communication channel or returns an existing one.
-   * @param {string=} opt_name
-   * @return {!Promise<!MessagePort>}
-   */
-  messageChannel(opt_name) {}
+function debugLog(var_args) {
+  if (/swg.debug=1/.test(self.location.hash)) {
+    const logArgs = Array.prototype.slice.call(arguments, 0);
+    logArgs.unshift('[Subscriptions]');
+    log.apply(log, logArgs);
+  }
 }
 
-
-
-/** DOMException.ABORT_ERR name */
-const ABORT_ERR_NAME = 'AbortError';
-
-/** DOMException.ABORT_ERR = 20 */
-const ABORT_ERR_CODE = 20;
-
-/** @type {?HTMLAnchorElement} */
-let aResolver;
-
-
 /**
- * @param {string} urlString
- * @return {!HTMLAnchorElement}
+ * @param  {...*} var_args [description]
  */
-function parseUrl(urlString) {
-  if (!aResolver) {
-    aResolver = /** @type {!HTMLAnchorElement} */ (document.createElement('a'));
-  }
-  aResolver.href = urlString;
-  return /** @type {!HTMLAnchorElement} */ (aResolver);
+function log(var_args) {
+  console.log.apply(console, arguments);
 }
 
-
 /**
- * @param {!Location|!URL|!HTMLAnchorElement} loc
- * @return {string}
+ * @param  {...*} var_args [description]
  */
-function getOrigin(loc) {
-  if (loc.origin) {
-    return loc.origin;
-  }
-  // Make sure that the origin is normalized. Specifically on IE, host sometimes
-  // includes the default port, which is not per standard.
-  const protocol = loc.protocol;
-  let host = loc.host;
-  if (protocol == 'https:' && host.indexOf(':443') == host.length - 4) {
-    host = host.replace(':443', '');
-  } else if (protocol == 'http:' && host.indexOf(':80') == host.length - 3) {
-    host = host.replace(':80', '');
-  }
-  return protocol + '//' + host;
+function warn(var_args) {
+  console.warn.apply(console, arguments);
 }
 
-
 /**
- * @param {string} urlString
- * @return {string}
+ * Throws an error if the first argument isn't trueish.
+ *
+ * Supports argument substitution into the message via %s placeholders.
+ *
+ * Throws an error object that has two extra properties:
+ * - associatedElement: This is the first element provided in the var args.
+ *   It can be used for improved display of error messages.
+ * - messageArray: The elements of the substituted message as non-stringified
+ *   elements in an array. When e.g. passed to console.error this yields
+ *   native displays of things like HTML elements.
+ *
+ * @param {T} shouldBeTrueish The value to assert. The assert fails if it does
+ *     not evaluate to true.
+ * @param {string=} message The assertion message
+ * @param {...*} var_args Arguments substituted into %s in the message.
+ * @return {T} The value of shouldBeTrueish.
+ * @template T
  */
-function getOriginFromUrl(urlString) {
-  return getOrigin(parseUrl(urlString));
+function assert(shouldBeTrueish, message, var_args) {
+  let firstElement;
+  if (!shouldBeTrueish) {
+    message = message || 'Assertion failed';
+    const splitMessage = message.split('%s');
+    const first = splitMessage.shift();
+    let formatted = first;
+    const messageArray = [];
+    pushIfNonEmpty(messageArray, first);
+    for (let i = 2; i < arguments.length; i++) {
+      const val = arguments[i];
+      if (val && val.tagName) {
+        firstElement = val;
+      }
+      const nextConstant = splitMessage.shift();
+      messageArray.push(val);
+      pushIfNonEmpty(messageArray, nextConstant.trim());
+      formatted += toString(val) + nextConstant;
+    }
+    const e = new Error(formatted);
+    e.fromAssert = true;
+    e.associatedElement = firstElement;
+    e.messageArray = messageArray;
+    throw e;
+  }
+  return shouldBeTrueish;
 }
 
-
 /**
- * @param {string} urlString
- * @return {string}
+ * @param {!Array} array
+ * @param {*} val
  */
-function removeFragment(urlString) {
-  const index = urlString.indexOf('#');
-  if (index == -1) {
-    return urlString;
+function pushIfNonEmpty(array, val) {
+  if (val != '') {
+    array.push(val);
   }
-  return urlString.substring(0, index);
 }
 
-
-/**
- * Parses and builds Object of URL query string.
- * @param {string} query The URL query string.
- * @return {!Object<string, string>}
- */
-function parseQueryString(query) {
-  if (!query) {
-    return {};
+function toString(val) {
+  // Do check equivalent to `val instanceof Element` without cross-window bug
+  if (val && val.nodeType == 1) {
+    return val.tagName.toLowerCase() + (val.id ? '#' + val.id : '');
   }
-  return (/^[?#]/.test(query) ? query.slice(1) : query)
-      .split('&')
-      .reduce((params, param) => {
-        const item = param.split('=');
-        const key = decodeURIComponent(item[0] || '');
-        const value = decodeURIComponent(item[1] || '');
-        if (key) {
-          params[key] = value;
-        }
-        return params;
-      }, {});
+  return /** @type {string} */ (val);
 }
 
+var log_1 = {
+  assert,
+  debugLog,
+  warn,
+  log
+};
+var log_2 = log_1.assert;
+var log_4 = log_1.warn;
+var log_5 = log_1.log;
 
 /**
- * @param {string} queryString  A query string in the form of "a=b&c=d". Could
- *   be optionally prefixed with "?" or "#".
- * @param {string} param The param to get from the query string.
- * @return {?string}
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function getQueryParam(queryString, param) {
-  return parseQueryString(queryString)[param];
-}
-
 
 /**
- * Add a query-like parameter to the fragment string.
- * @param {string} url
- * @param {string} param
- * @param {string} value
- * @return {string}
+ * Returns a map-like object.
+ * If initial is provided, copies its own properties into the
+ * newly created object.
+ * @param {Object=} initial This should typically be an object literal.
+ * @return {!Object}
+ * @template T
  */
-function addFragmentParam(url, param, value) {
-  return url +
-      (url.indexOf('#') == -1 ? '#' : '&') +
-      encodeURIComponent(param) + '=' + encodeURIComponent(value);
+function map(initial) {
+  const obj = Object.create(null);
+  if (initial) {
+    Object.assign(obj, initial);
+  }
+  return obj;
 }
 
+/**
+ * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
 /**
- * @param {string} queryString  A query string in the form of "a=b&c=d". Could
- *   be optionally prefixed with "?" or "#".
- * @param {string} param The param to remove from the query string.
- * @return {?string}
+ * Returns an array of random values.  The length of the array is numInts.  Each
+ * int will be >= 0 and < maxVal.
+ * @param {!number} numInts
+ * @param {!number} maxVal
  */
-function removeQueryParam(queryString, param) {
-  if (!queryString) {
-    return queryString;
-  }
-  const search = encodeURIComponent(param) + '=';
-  let index = -1;
-  do {
-    index = queryString.indexOf(search, index);
-    if (index != -1) {
-      const prev = index > 0 ? queryString.substring(index - 1, index) : '';
-      if (prev == '' || prev == '?' || prev == '#' || prev == '&') {
-        let end = queryString.indexOf('&', index + 1);
-        if (end == -1) {
-          end = queryString.length;
-        }
-        queryString =
-            queryString.substring(0, index) +
-            queryString.substring(end + 1);
-      } else {
-        index++;
-      }
+function getRandomInts(numInts, maxVal) {
+  // Ensure array type is appropriate for the max value (performance)
+  const arr =
+    maxVal < 256
+      ? new Uint8Array(numInts)
+      : maxVal < 32768
+      ? new Uint16Array(numInts)
+      : new Uint32Array(numInts);
+
+  if (crypto && crypto.getRandomValues) {
+    crypto.getRandomValues(arr);
+    for (let i = arr.length - 1; i > -1; i--) {
+      arr[i] = arr[i] % maxVal;
     }
-  } while (index != -1 && index < queryString.length);
-  return queryString;
-}
+  } else {
+    // For older browsers
+    for (let i = arr.length - 1; i > -1; i--) {
+      arr[i] = Math.floor(Math.random() * maxVal);
+    }
+  }
 
+  return arr;
+}
 
 /**
- * @param {!ActivityRequest} request
- * @return {string}
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function serializeRequest(request) {
-  const map = {
-    'requestId': request.requestId,
-    'returnUrl': request.returnUrl,
-    'args': request.args,
-  };
-  if (request.origin !== undefined) {
-    map['origin'] = request.origin;
-  }
-  if (request.originVerified !== undefined) {
-    map['originVerified'] = request.originVerified;
-  }
-  return JSON.stringify(map);
-}
 
+const CHARS = '0123456789ABCDEF';
 
 /**
- * @param {*} error
+ * Polyfill for String.prototype.startsWith.
+ * @param {string} string
+ * @param {string} prefix
  * @return {boolean}
  */
-function isAbortError(error) {
-  if (!error || typeof error != 'object') {
+function startsWith(string, prefix) {
+  if (prefix.length > string.length) {
     return false;
   }
-  return (error['name'] === ABORT_ERR_NAME);
+  return string.lastIndexOf(prefix, 0) == 0;
 }
 
-
 /**
- * Creates or emulates a DOMException of AbortError type.
- * See https://heycam.github.io/webidl/#aborterror.
- * @param {!Window} win
- * @param {string=} opt_message
- * @return {!DOMException}
+ * Ensures the passed value is safe to use for character 19 per rfc4122,
+ * sec. 4.1.5.  "Sets the high bits of clock sequence".
+ * @param {!number} v
  */
-function createAbortError(win, opt_message) {
-  const message = 'AbortError' + (opt_message ? ': ' + opt_message : '');
-  let error = null;
-  if (typeof win['DOMException'] == 'function') {
-    // TODO(dvoytenko): remove typecast once externs are fixed.
-    const constr = /** @type {function(new:DOMException, string, string)} */ (
-        win['DOMException']);
-    try {
-      error = new constr(message, ABORT_ERR_NAME);
-    } catch (e) {
-      // Ignore. In particular, `new DOMException()` fails in Edge.
-    }
-  }
-  if (!error) {
-    // TODO(dvoytenko): remove typecast once externs are fixed.
-    const constr = /** @type {function(new:DOMException, string)} */ (
-        Error);
-    error = new constr(message);
-    error.name = ABORT_ERR_NAME;
-    error.code = ABORT_ERR_CODE;
-  }
-  return error;
+function getChar19(v) {
+  return CHARS[(v & 0x3) | 0x8];
 }
 
-
 /**
- * Resolves the activity result as a promise:
- *  - `OK` result is yielded as the promise's payload;
- *  - `CANCEL` result is rejected with the `AbortError`;
- *  - `FAILED` result is rejected with the embedded error.
- *
- * @param {!Window} win
- * @param {!ActivityResult} result
- * @param {function((!ActivityResult|!Promise))} resolver
+ * The returned identifier will always be an 8 digit valid hexidecimal number
+ * and will be unique for each MS within a given month.
+ * @return {string}
  */
-function resolveResult(win, result, resolver) {
-  if (result.ok) {
-    resolver(result);
-  } else {
-    const error = result.error || createAbortError(win);
-    error.activityResult = result;
-    resolver(Promise.reject(error));
-  }
+function getMonthlyTimeIdentifier() {
+  const hexTime = Date.now().toString(16);
+  return hexTime.substring(hexTime.length - 8).toUpperCase();
 }
 
-
 /**
- * @param {!Window} win
- * @return {boolean}
+ * Generates a RFC 4122 V4 UUID. Ex: "92329D39-6F5C-4520-ABFC-AAB64544E172"
+ * The first 8 digits are unique for the millisecond of the month.  The rest
+ * are randomly generated.
  */
-function isIeBrowser(win) {
-  // MSIE and Trident are typical user agents for IE browsers.
-  const nav = win.navigator;
-  return /Trident|MSIE|IEMobile/i.test(nav && nav.userAgent);
+function getUuid() {
+  let uuid = getMonthlyTimeIdentifier() + '-';
+  let rIndex = 0;
+  const rands = getRandomInts(23, 16);
+  for (let i = 9; i < 36; i++) {
+    switch (i) {
+      case 13:
+      case 18:
+      case 23:
+        uuid += '-';
+        break;
+      case 14:
+        uuid += '4';
+        break;
+      case 19:
+        uuid += getChar19(rands[rIndex++]);
+        break;
+      default:
+        uuid += CHARS[rands[rIndex++]];
+        break;
+    }
+  }
+  return uuid;
 }
 
-
 /**
- * @param {!Window} win
- * @return {boolean}
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function isEdgeBrowser(win) {
-  const nav = win.navigator;
-  return /Edge/i.test(nav && nav.userAgent);
-}
-
 
-/**
- * @param {!Error} e
- */
-function throwAsync(e) {
-  setTimeout(() => {throw e;});
-}
+/** @type {Object<string, string>} */
+let propertyNameCache;
 
+/** @const {!Array<string>} */
+const vendorPrefixes = ['Webkit', 'webkit', 'Moz', 'moz', 'ms', 'O', 'o'];
 
 /**
- * Polyfill of the `Node.isConnected` API. See
- * https://developer.mozilla.org/en-US/docs/Web/API/Node/isConnected.
- * @param {!Node} node
- * @return {boolean}
+ * Default styles to be set for top level friendly iframe.
+ * Some attributes are not included such as height, left, margin-left; since
+ * these attributes are updated by @media queries and having these values
+ * defined here as !important does not work on IE/edge browsers.
+ * @const {!Object<string, string|number>}
  */
-function isNodeConnected(node) {
-  // Ensure that node is attached if specified. This check uses a new and
-  // fast `isConnected` API and thus only checked on platforms that have it.
-  // See https://www.chromestatus.com/feature/5676110549352448.
-  if ('isConnected' in node) {
-    return node['isConnected'];
-  }
-  // Polyfill.
-  const root = node.ownerDocument && node.ownerDocument.documentElement;
-  return (root && root.contains(node)) || false;
-}
-
-
-
-const SENTINEL = '__ACTIVITIES__';
-
+const defaultStyles = {
+  'align-content': 'normal',
+  'animation': 'none',
+  'align-items': 'normal',
+  'align-self': 'auto',
+  'alignment-baseline': 'auto',
+  'backface-visibility': 'hidden',
+  'background-clip': 'border-box',
+  'background-image': 'none',
+  'baseline-shift': '0',
+  'block-size': 'auto',
+  'border': 'none',
+  'border-collapse': 'separate',
+  'bottom': '0',
+  'box-sizing': 'border-box',
+  'break-after': 'auto',
+  'break-before': 'auto',
+  'break-inside': 'auto',
+  'buffered-rendering': 'auto',
+  'caption-side': 'top',
+  'caret-color': 'rgb(51, 51, 51)',
+  'clear': 'none',
+  'color': 'rgb(51, 51, 51)',
+  'color-rendering': 'auto',
+  'column-count': 'auto',
+  'column-fill': 'balance',
+  'column-gap': 'normal',
+  'column-rule-color': 'rgb(51, 51, 51)',
+  'column-rule-style': 'none',
+  'column-rule-width': '0',
+  'column-span': 'none',
+  'column-width': 'auto',
+  'contain': 'none',
+  'counter-increment': 'none',
+  'counter-reset': 'none',
+  'cursor': 'auto',
+  'direction': 'inherit',
+  'display': 'block',
+  'empty-cells': 'show',
+  'filter': 'none',
+  'flex': 'none', // flex-grow, flex-shrink, and flex-basis.
+  'flex-flow': 'row nowrap', // flex-direction, flex-wrap.
+  'float': 'none',
+  'flood-color': 'rgb(0, 0, 0)',
+  'flood-opacity': '1',
+  'font': 'none',
+  'font-size': 'medium',
+  'font-family': '',
+  'height': 'auto',
+  'hyphens': 'manual',
+  'image-rendering': 'auto',
+  'inline-size': '', // Setting to 'auto' will not allow override.
+  'isolation': 'auto',
+  'justify-content': 'normal',
+  'justify-items': 'normal',
+  'justify-self': 'auto',
+  'letter-spacing': 'normal',
+  'lighting-color': 'rgb(255, 255, 255)',
+  'line-break': 'auto',
+  'line-height': 'normal',
+  'mask': 'none',
+  'max-block-size': 'none',
+  'max-height': 'none',
+  'max-inline-size': 'none',
+  'max-width': 'none',
+  'min-block-size': 'none',
+  'min-height': '0',
+  'min-inline-size': '0',
+  'min-width': '0',
+  'mix-blend-mode': 'normal',
+  'object-fit': 'fill', // Important for Safari browser.
+  'offset-distance': 'none', // Chrome only (Experimental).
+  'offset-path': 'none', // Chrome only (Experimental).
+  'offset-rotate': 'auto 0deg', // Chrome only (Experimental).
+  'opacity': '1',
+  'order': '0',
+  'orphans': '2',
+  'outline': 'none',
+  'overflow-anchor': 'auto',
+  'overflow-wrap': 'normal',
+  'overflow': 'visible',
+  'padding': '0',
+  'page': '',
+  'perspective': 'none',
+  'pointer-events': 'auto',
+  'position': 'static',
+  'quotes': '',
+  'resize': 'none',
+  'right': '0',
+  'scroll-behavior': 'auto',
+  'tab-size': '8', // Only Chrome, Safari (Experimental).
+  'table-layout': 'auto',
+  'text-align': 'start',
+  'text-align-last': 'auto',
+  'text-anchor': 'start',
+  'text-combine-upright': 'none',
+  'text-decoration': 'none',
+  'text-indent': '0',
+  'text-orientation': 'mixed',
+  'text-overflow': 'clip',
+  'text-rendering': 'auto',
+  'text-shadow': 'none',
+  'text-size-adjust': 'auto',
+  'text-transform': 'none',
+  'text-underline-position': 'auto',
+  'top': 'auto',
+  'touch-action': 'auto',
+  'transform': 'none',
+  'transition': 'none 0s ease 0s',
+  'unicode-bidi': 'normal',
+  'user-select': 'auto',
+  'vector-effect': 'none',
+  'vertical-align': 'baseline',
+  'visibility': 'visible',
+  'white-space': 'normal',
+  'widows': '2',
+  'word-break': 'normal',
+  'word-spacing': '0',
+  'word-wrap': 'normal',
+  'writing-mode': 'horizontal-tb',
+  'zoom': '1',
+  'z-index': 'auto',
+};
 
 /**
- * The messenger helper for activity's port and host.
+ * @export
+ * @param {string} camelCase camel cased string
+ * @return {string} title cased string
  */
-class Messenger {
-
-  /**
-   * @param {!Window} win
-   * @param {!Window|function():?Window} targetOrCallback
-   * @param {?string} targetOrigin
-   * @param {boolean} requireTarget
-   */
-  constructor(win, targetOrCallback, targetOrigin, requireTarget) {
-    /** @private @const {!Window} */
-    this.win_ = win;
-
-    /** @private @const {!Window|function():?Window} */
-    this.targetOrCallback_ = targetOrCallback;
-
-    /**
-     * May start as unknown (`null`) until received in the first message.
-     * @private {?string}
-     */
-    this.targetOrigin_ = targetOrigin;
-
-    /** @private @const {boolean} */
-    this.requireTarget_ = requireTarget;
-
-    /** @private {?Window} */
-    this.target_ = null;
-
-    /** @private {boolean} */
-    this.acceptsChannel_ = false;
-
-    /** @private {?MessagePort} */
-    this.port_ = null;
-
-    /** @private {?function(string, ?Object)} */
-    this.onCommand_ = null;
-
-    /** @private {?function(!Object)} */
-    this.onCustomMessage_ = null;
+function camelCaseToTitleCase(camelCase) {
+  return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
+}
 
-    /**
-     * @private {?Object<string, !ChannelHolder>}
-     */
-    this.channels_ = null;
+/**
+ * Checks the style if a prefixed version of a property exists and returns
+ * it or returns an empty string.
+ * @private
+ * @param {!Object} style
+ * @param {string} titleCase the title case version of a css property name
+ * @return {string} the prefixed property name or null.
+ */
+function getVendorJsPropertyName_(style, titleCase) {
+  for (let i = 0; i < vendorPrefixes.length; i++) {
+    const propertyName = vendorPrefixes[i] + titleCase;
+    if (style[propertyName] !== undefined) {
+      return propertyName;
+    }
+  }
+  return '';
+}
 
-    /** @private @const */
-    this.boundHandleEvent_ = this.handleEvent_.bind(this);
+/**
+ * Returns the possibly prefixed JavaScript property name of a style property
+ * (ex. WebkitTransitionDuration) given a camelCase'd version of the property
+ * (ex. transitionDuration).
+ * @export
+ * @param {!Object} style
+ * @param {string} camelCase the camel cased version of a css property name
+ * @param {boolean=} bypassCache bypass the memoized cache of property
+ *   mapping
+ * @return {string}
+ */
+function getVendorJsPropertyName(style, camelCase, bypassCache) {
+  if (startsWith(camelCase, '--')) {
+    // CSS vars are returned as is.
+    return camelCase;
+  }
+  if (!propertyNameCache) {
+    propertyNameCache = map();
   }
+  let propertyName = propertyNameCache[camelCase];
+  if (!propertyName || bypassCache) {
+    propertyName = camelCase;
+    if (style[camelCase] === undefined) {
+      const titleCase = camelCaseToTitleCase(camelCase);
+      const prefixedPropertyName = getVendorJsPropertyName_(style, titleCase);
 
-  /**
-   * Connect the port to the host or vice versa.
-   * @param {function(string, ?Object)} onCommand
-   */
-  connect(onCommand) {
-    if (this.onCommand_) {
-      throw new Error('already connected');
+      if (style[prefixedPropertyName] !== undefined) {
+        propertyName = prefixedPropertyName;
+      }
+    }
+    if (!bypassCache) {
+      propertyNameCache[camelCase] = propertyName;
     }
-    this.onCommand_ = onCommand;
-    this.win_.addEventListener('message', this.boundHandleEvent_);
   }
+  return propertyName;
+}
 
-  /**
-   * Disconnect messenger.
-   */
-  disconnect() {
-    if (this.onCommand_) {
-      this.onCommand_ = null;
-      if (this.port_) {
-        closePort(this.port_);
-        this.port_ = null;
-      }
-      this.win_.removeEventListener('message', this.boundHandleEvent_);
-      if (this.channels_) {
-        for (const k in this.channels_) {
-          const channelObj = this.channels_[k];
-          if (channelObj.port1) {
-            closePort(channelObj.port1);
-          }
-          if (channelObj.port2) {
-            closePort(channelObj.port2);
-          }
-        }
-        this.channels_ = null;
-      }
-    }
+/**
+ * Sets the CSS styles of the specified element with !important. The styles
+ * are specified as a map from CSS property names to their values.
+ * @param {!Element} element
+ * @param {!Object<string, string|number>} styles
+ */
+function setImportantStyles(element, styles) {
+  for (const k in styles) {
+    element.style.setProperty(
+      getVendorJsPropertyName(styles, k),
+      styles[k].toString(),
+      'important'
+    );
   }
+}
 
-  /**
-   * Returns whether the messenger has been connected already.
-   * @return {boolean}
-   */
-  isConnected() {
-    return this.targetOrigin_ != null;
+/**
+ * Sets the CSS style of the specified element with optional units, e.g. "px".
+ * @param {Element} element
+ * @param {string} property
+ * @param {?string|number|boolean} value
+ * @param {string=} units
+ * @param {boolean=} bypassCache
+ */
+function setStyle(element, property, value, units, bypassCache) {
+  const propertyName = getVendorJsPropertyName(
+    element.style,
+    property,
+    bypassCache
+  );
+  if (propertyName) {
+    element.style[propertyName] = /** @type {string} */ (units
+      ? value + units
+      : value);
   }
+}
 
-  /**
-   * Returns the messaging target. Only available when connection has been
-   * establihsed.
-   * @return {!Window}
-   */
-  getTarget() {
-    const target = this.getOptionalTarget_();
-    if (!target) {
-      throw new Error('not connected');
-    }
-    return target;
+/**
+ * Sets the CSS styles of the specified element. The styles
+ * a specified as a map from CSS property names to their values.
+ * @param {!Element} element
+ * @param {!Object<string, ?string|number|boolean>} styles
+ */
+function setStyles(element, styles) {
+  for (const k in styles) {
+    setStyle(element, k, styles[k]);
   }
+}
 
-  /**
-   * @return {?Window}
-   * @private
-   */
-  getOptionalTarget_() {
-    if (this.onCommand_ && !this.target_) {
-      if (typeof this.targetOrCallback_ == 'function') {
-        this.target_ = this.targetOrCallback_();
-      } else {
-        this.target_ = /** @type {!Window} */ (this.targetOrCallback_);
-      }
-    }
-    return this.target_;
-  }
+/**
+ * Resets styles that were set dynamically (i.e. inline)
+ * @param {!Element} element
+ * @param {!Array<string>} properties
+ */
+function resetStyles(element, properties) {
+  const styleObj = {};
+  properties.forEach(prop => {
+    styleObj[prop] = null;
+  });
+  setStyles(element, styleObj);
+}
 
-  /**
-   * Returns the messaging origin. Only available when connection has been
-   * establihsed.
-   * @return {string}
-   */
-  getTargetOrigin() {
-    if (this.targetOrigin_ == null) {
-      throw new Error('not connected');
-    }
-    return this.targetOrigin_;
-  }
+/**
+ * Resets all the styles of an element to a given value. Defaults to null.
+ * The valid values are 'inherit', 'initial', 'unset' or null.
+ * @param {!Element} element
+ */
+function resetAllStyles(element) {
+  setImportantStyles(element, defaultStyles);
+}
 
-  /**
-   * The host sends this message to the client to indicate that it's ready to
-   * start communicating. The client is expected to respond back with the
-   * "start" command. See `sendStartCommand` method.
-   */
-  sendConnectCommand() {
-    // TODO(dvoytenko): MessageChannel is critically necessary for IE/Edge,
-    // since window messaging doesn't always work. It's also preferred as an API
-    // for other browsers: it's newer, cleaner and arguably more secure.
-    // Unfortunately, browsers currently do not propagate user gestures via
-    // MessageChannel, only via window messaging. This should be re-enabled
-    // once browsers fix user gesture propagation.
-    // See:
-    // Safari: https://bugs.webkit.org/show_bug.cgi?id=186593
-    // Chrome: https://bugs.chromium.org/p/chromium/issues/detail?id=851493
-    // Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=1469422
-    const acceptsChannel = isIeBrowser(this.win_) || isEdgeBrowser(this.win_);
-    this.sendCommand('connect', {'acceptsChannel': acceptsChannel});
-  }
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-  /**
-   * The client sends this message to the host upon receiving the "connect"
-   * message to start the main communication channel. As a payload, the message
-   * will contain the provided start arguments.
-   * @param {?Object} args
-   */
-  sendStartCommand(args) {
-    let channel = null;
-    if (this.acceptsChannel_ && typeof this.win_.MessageChannel == 'function') {
-      channel = new this.win_.MessageChannel();
-    }
-    if (channel) {
-      this.sendCommand('start', args, [channel.port2]);
-      // It's critical to switch to port messaging only after "start" has been
-      // sent. Otherwise, it won't be delivered.
-      this.switchToChannel_(channel.port1);
+/** @const {string} */
+const styleType = 'text/css';
+
+/**
+ * Add attributes to an element.
+ * @param {!Element} element
+ * @param {!Object<string, string|number|boolean|!Object<string, string|number|boolean>>} attributes
+ * @return {!Element} updated element.
+ */
+function addAttributesToElement(element, attributes) {
+  for (const attr in attributes) {
+    if (attr == 'style') {
+      setStyles(
+        element,
+        /** @type {!Object<string, string|boolean|number>} */
+        (attributes[attr])
+      );
     } else {
-      this.sendCommand('start', args);
+      element.setAttribute(
+        attr,
+        /** @type {string|boolean|number} */ (attributes[attr])
+      );
     }
   }
+  return element;
+}
 
-  /**
-   * Sends the specified command from the port to the host or vice versa.
-   * @param {string} cmd
-   * @param {?Object=} opt_payload
-   * @param {?Array=} opt_transfer
-   */
-  sendCommand(cmd, opt_payload, opt_transfer) {
-    const data = {
-      'sentinel': SENTINEL,
-      'cmd': cmd,
-      'payload': opt_payload || null,
-    };
-    if (this.port_) {
-      this.port_.postMessage(data, opt_transfer || undefined);
+/**
+ * Create a new element on document with specified tagName and attributes.
+ * @param {!Document} doc
+ * @param {string} tagName
+ * @param {!Object<string, string>} attributes
+ * @param {?(string|!Node|!ArrayLike<!Node>|!Array<!Node>)=} content
+ * @return {!Element} created element.
+ */
+function createElement(doc, tagName, attributes, content) {
+  const element = doc.createElement(tagName);
+  addAttributesToElement(element, attributes);
+  if (content != null) {
+    if (typeof content == 'string') {
+      element.textContent = content;
+    } else if (content.nodeType) {
+      element.appendChild(content);
+    } else if ('length' in content) {
+      for (let i = 0; i < content.length; i++) {
+        element.appendChild(content[i]);
+      }
     } else {
-      const target = this.getTarget();
-      // Only "connect" command is allowed to use `targetOrigin == '*'`
-      const targetOrigin =
-          cmd == 'connect' ?
-          (this.targetOrigin_ != null ? this.targetOrigin_ : '*') :
-          this.getTargetOrigin();
-      target.postMessage(data, targetOrigin, opt_transfer || undefined);
+      log_2(false, 'Unsupported content: %s', content);
     }
   }
+  return element;
+}
 
-  /**
-   * Sends a message to the client.
-   * @param {!Object} payload
-   */
-  customMessage(payload) {
-    this.sendCommand('msg', payload);
+/**
+ * Removes the element.
+ * @param {!Element} element
+ */
+function removeElement(element) {
+  if (element.parentElement) {
+    element.parentElement.removeChild(element);
   }
+}
 
-  /**
-   * Registers a callback to receive messages from the client.
-   * @param {function(!Object)} callback
-   */
-  onCustomMessage(callback) {
-    this.onCustomMessage_ = callback;
-  }
-
-  /**
-   * @param {string=} opt_name
-   * @return {!Promise<!MessagePort>}
-   */
-  startChannel(opt_name) {
-    const name = opt_name || '';
-    const channelObj = this.getChannelObj_(name);
-    if (!channelObj.port1) {
-      const channel = new this.win_.MessageChannel();
-      channelObj.port1 = channel.port1;
-      channelObj.port2 = channel.port2;
-      channelObj.resolver(channelObj.port1);
-    }
-    if (channelObj.port2) {
-      // Not yet sent.
-      this.sendCommand('cnset', {'name': name}, [channelObj.port2]);
-      channelObj.port2 = null;
-    }
-    return channelObj.promise;
-  }
-
-  /**
-   * @param {string=} opt_name
-   * @return {!Promise<!MessagePort>}
-   */
-  askChannel(opt_name) {
-    const name = opt_name || '';
-    const channelObj = this.getChannelObj_(name);
-    if (!channelObj.port1) {
-      this.sendCommand('cnget', {'name': name});
-    }
-    return channelObj.promise;
-  }
-
-  /**
-   * @param {string} name
-   * @param {!MessagePort} port
-   * @private
-   */
-  receiveChannel_(name, port) {
-    const channelObj = this.getChannelObj_(name);
-    channelObj.port1 = port;
-    channelObj.resolver(port);
-  }
-
-  /**
-   * @param {string} name
-   * @return {!ChannelHolder}
-   */
-  getChannelObj_(name) {
-    if (!this.channels_) {
-      this.channels_ = {};
-    }
-    let channelObj = this.channels_[name];
-    if (!channelObj) {
-      let resolver;
-      const promise = new Promise(resolve => {
-        resolver = resolve;
-      });
-      channelObj = {
-        port1: null,
-        port2: null,
-        resolver,
-        promise,
-      };
-      this.channels_[name] = channelObj;
-    }
-    return channelObj;
-  }
-
-  /**
-   * @param {!MessagePort} port
-   * @private
-   */
-  switchToChannel_(port) {
-    if (this.port_) {
-      closePort(this.port_);
-    }
-    this.port_ = port;
-    this.port_.onmessage = event => {
-      const data = event.data;
-      const cmd = data && data['cmd'];
-      const payload = data && data['payload'] || null;
-      if (cmd) {
-        this.handleCommand_(cmd, payload, event);
-      }
-    };
-    // Even though all messaging will switch to ports, the window-based message
-    // listener will be preserved just in case the host is refreshed and needs
-    // another connection.
-  }
+/**
+ * Removes all children from the parent element.
+ * @param {!Element} parent
+ */
+function removeChildren(parent) {
+  parent.textContent = '';
+}
 
-  /**
-   * @param {!MessageEvent} event
-   * @private
-   */
-  handleEvent_(event) {
-    if (this.requireTarget_ && this.getOptionalTarget_() != event.source) {
-      // When target is required, confirm it against the event.source. This
-      // is normally only needed for ports where a single window can include
-      // multiple iframes to match the event to a specific iframe. Otherwise,
-      // the origin checks below are sufficient.
-      return;
-    }
-    const data = event.data;
-    if (!data || data['sentinel'] != SENTINEL) {
-      return;
-    }
-    const cmd = data['cmd'];
-    if (this.port_ && cmd != 'connect' && cmd != 'start') {
-      // Messaging channel has already taken over. However, the "connect" and
-      // "start" commands are allowed to proceed in case re-connection is
-      // requested.
-      return;
-    }
-    const origin = /** @type {string} */ (event.origin);
-    const payload = data['payload'] || null;
-    if (this.targetOrigin_ == null && cmd == 'start') {
-      this.targetOrigin_ = origin;
-    }
-    if (this.targetOrigin_ == null && event.source) {
-      if (this.getOptionalTarget_() == event.source) {
-        this.targetOrigin_ = origin;
-      }
-    }
-    // Notice that event.source may differ from the target because of
-    // friendly-iframe intermediaries.
-    if (origin != this.targetOrigin_) {
-      return;
-    }
-    this.handleCommand_(cmd, payload, event);
-  }
+/**
+ * Injects the provided styles in the HEAD section of the document.
+ * @param {!../model/doc.Doc} doc The document object.
+ * @param {string} styleText The style string.
+ * @return {!Element}
+ */
+function injectStyleSheet(doc, styleText) {
+  const styleElement = createElement(doc.getWin().document, 'style', {
+    'type': styleType,
+  });
+  styleElement.textContent = styleText;
+  doc.getHead().appendChild(styleElement);
+  return styleElement;
+}
 
-  /**
-   * @param {string} cmd
-   * @param {?Object} payload
-   * @param {!MessageEvent} event
-   * @private
-   */
-  handleCommand_(cmd, payload, event) {
-    if (cmd == 'connect') {
-      if (this.port_) {
-        // In case the port has already been open - close it to reopen it
-        // again later.
-        closePort(this.port_);
-        this.port_ = null;
-      }
-      this.acceptsChannel_ = payload && payload['acceptsChannel'] || false;
-      this.onCommand_(cmd, payload);
-    } else if (cmd == 'start') {
-      const port = event.ports && event.ports[0];
-      if (port) {
-        this.switchToChannel_(port);
-      }
-      this.onCommand_(cmd, payload);
-    } else if (cmd == 'msg') {
-      if (this.onCustomMessage_ != null && payload != null) {
-        this.onCustomMessage_(payload);
-      }
-    } else if (cmd == 'cnget') {
-      const name = payload['name'];
-      this.startChannel(name);
-    } else if (cmd == 'cnset') {
-      const name = payload['name'];
-      const port = event.ports[0];
-      this.receiveChannel_(name, /** @type {!MessagePort} */ (port));
-    } else {
-      this.onCommand_(cmd, payload);
-    }
+/**
+ * Polyfill of the `Node.isConnected` API. See
+ * https://developer.mozilla.org/en-US/docs/Web/API/Node/isConnected.
+ * @param {!Node} node
+ * @return {boolean}
+ */
+function isConnected(node) {
+  // Ensure that node is attached if specified. This check uses a new and
+  // fast `isConnected` API and thus only checked on platforms that have it.
+  // See https://www.chromestatus.com/feature/5676110549352448.
+  if ('isConnected' in node) {
+    return node['isConnected'];
   }
+  // Polyfill.
+  const root = node.ownerDocument && node.ownerDocument.documentElement;
+  return (root && root.contains(node)) || false;
 }
 
-
 /**
- * @param {!MessagePort} port
+ * Returns true if current browser is a legacy version of Edge.
+ *
+ * Starting in January 2020, new versions of Edge will use the Chromium engine.
+ * These versions won't include the word "Edge" in their useragent.
+ * Instead, they'll include the word "Edg".
+ * So far, it seems safe to avoid detecting these new versions of Edge.
+ * @param {!Window} win
+ * @return {boolean}
  */
-function closePort(port) {
-  try {
-    port.close();
-  } catch (e) {
-    // Ignore.
-  }
+function isLegacyEdgeBrowser(win) {
+  const nav = win.navigator;
+  return /Edge/i.test(nav && nav.userAgent);
 }
 
+/**
+ * @license
+ * Copyright 2017 The Web Activities Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
+/*eslint no-unused-vars: 0*/
 
 
 /**
- * The `ActivityPort` implementation for the iframe case. Unlike other types
- * of activities, iframe-based activities are always connected and can react
- * to size requests.
- *
- * @implements {ActivityPort}
- * @implements {ActivityMessagingPort}
+ * @enum {string}
  */
-class ActivityIframePort {
+const ActivityMode = {
+  IFRAME: 'iframe',
+  POPUP: 'popup',
+  REDIRECT: 'redirect',
+};
 
-  /**
-   * @param {!HTMLIFrameElement} iframe
-   * @param {string} url
-   * @param {?Object=} opt_args
-   */
-  constructor(iframe, url, opt_args) {
-    /** @private @const {!HTMLIFrameElement} */
-    this.iframe_ = iframe;
-    /** @private @const {string} */
-    this.url_ = url;
-    /** @private @const {?Object} */
-    this.args_ = opt_args || null;
-
-    /** @private @const {!Window} */
-    this.win_ = /** @type {!Window} */ (this.iframe_.ownerDocument.defaultView);
-
-    /** @private @const {string} */
-    this.targetOrigin_ = getOriginFromUrl(url);
-
-    /** @private {boolean} */
-    this.connected_ = false;
-
-    /** @private {?function()} */
-    this.connectedResolver_ = null;
 
-    /** @private @const {!Promise} */
-    this.connectedPromise_ = new Promise(resolve => {
-      this.connectedResolver_ = resolve;
-    });
+/**
+ * The result code used for `ActivityResult`.
+ * @enum {string}
+ */
+const ActivityResultCode = {
+  OK: 'ok',
+  CANCELED: 'canceled',
+  FAILED: 'failed',
+};
 
-    /** @private {?function()} */
-    this.readyResolver_ = null;
 
-    /** @private @const {!Promise} */
-    this.readyPromise_ = new Promise(resolve => {
-      this.readyResolver_ = resolve;
-    });
+/**
+ * The result of an activity. The activity implementation returns this object
+ * for a successful result, a cancelation or a failure.
+ * @struct
+ */
+class ActivityResult {
+  /**
+   * @param {!ActivityResultCode} code
+   * @param {*} data
+   * @param {!ActivityMode} mode
+   * @param {string} origin
+   * @param {boolean} originVerified
+   * @param {boolean} secureChannel
+   */
+  constructor(code, data, mode, origin, originVerified, secureChannel) {
+    /** @const {!ActivityResultCode} */
+    this.code = code;
+    /** @const {*} */
+    this.data = code == ActivityResultCode.OK ? data : null;
+    /** @const {!ActivityMode} */
+    this.mode = mode;
+    /** @const {string} */
+    this.origin = origin;
+    /** @const {boolean} */
+    this.originVerified = originVerified;
+    /** @const {boolean} */
+    this.secureChannel = secureChannel;
+    /** @const {boolean} */
+    this.ok = code == ActivityResultCode.OK;
+    /** @const {?Error} */
+    this.error = code == ActivityResultCode.FAILED ?
+        new Error(String(data) || '') :
+        null;
+  }
+}
 
-    /** @private {?function((!ActivityResult|!Promise))} */
-    this.resultResolver_ = null;
 
-    /** @private @const {!Promise<!ActivityResult>} */
-    this.resultPromise_ = new Promise(resolve => {
-      this.resultResolver_ = resolve;
-    });
+/**
+ * The activity request that different types of hosts can be started with.
+ * @typedef {{
+ *   requestId: string,
+ *   returnUrl: string,
+ *   args: ?Object,
+ *   origin: (string|undefined),
+ *   originVerified: (boolean|undefined),
+ * }}
+ */
+let ActivityRequest;
 
-    /** @private {?function(number)} */
-    this.onResizeRequest_ = null;
 
-    /** @private {?number} */
-    this.requestedHeight_ = null;
+/**
+ * The activity "open" options used for popups and redirects.
+ *
+ * - returnUrl: override the return URL. By default, the current URL will be
+ *   used.
+ * - skipRequestInUrl: removes the activity request from the URL, in case
+ *   redirect is used. By default, the activity request is appended to the
+ *   activity URL. This option can be used if the activity request is passed
+ *   to the activity by some alternative means.
+ * - disableRedirectFallback: disallows popup fallback to redirect. By default
+ *   the redirect fallback is allowed. This option has to be used very carefully
+ *   because there are many user agents that may fail to open a popup and it
+ *   won't be always possible for the opener window to even be aware of such
+ *   failures.
+ *
+ * @typedef {{
+ *   returnUrl: (string|undefined),
+ *   skipRequestInUrl: (boolean|undefined),
+ *   disableRedirectFallback: (boolean|undefined),
+ *   width: (number|undefined),
+ *   height: (number|undefined),
+ * }}
+ */
+let ActivityOpenOptions;
 
-    /** @private @const {!Messenger} */
-    this.messenger_ = new Messenger(
-        this.win_,
-        () => this.iframe_.contentWindow,
-        this.targetOrigin_,
-        /* requireTarget */ true);
-  }
 
-  /** @override */
-  getMode() {
-    return ActivityMode.IFRAME;
-  }
+/**
+ * Activity client-side binding. The port provides limited ways to communicate
+ * with the activity and receive signals and results from it. Not every type
+ * of activity exposes a port.
+ *
+ * @interface
+ */
+class ActivityPort {
 
   /**
-   * Waits until the activity port is connected to the host.
-   * @return {!Promise}
+   * Returns the mode of the activity: iframe, popup or redirect.
+   * @return {!ActivityMode}
    */
-  connect() {
-    if (!isNodeConnected(this.iframe_)) {
-      throw new Error('iframe must be in DOM');
-    }
-    this.messenger_.connect(this.handleCommand_.bind(this));
-    this.iframe_.src = this.url_;
-    return this.connectedPromise_;
-  }
+  getMode() {}
 
   /**
-   * Disconnect the activity binding and cleanup listeners.
+   * Accepts the result when ready. The client should verify the activity's
+   * mode, origin, verification and secure channel flags before deciding
+   * whether or not to trust the result.
+   *
+   * Returns the promise that yields when the activity has been completed and
+   * either a result, a cancelation or a failure has been returned.
+   *
+   * @return {!Promise<!ActivityResult>}
    */
-  disconnect() {
-    this.connected_ = false;
-    this.messenger_.disconnect();
-  }
-
-  /** @override */
-  acceptResult() {
-    return this.resultPromise_;
-  }
-
-  /** @override */
-  getTargetWin() {
-    return this.iframe_.contentWindow || null;
-  }
-
-  /** @override */
-  message(payload) {
-    this.messenger_.customMessage(payload);
-  }
+  acceptResult() {}
+}
 
-  /** @override */
-  onMessage(callback) {
-    this.messenger_.onCustomMessage(callback);
-  }
 
-  /** @override */
-  messageChannel(opt_name) {
-    return this.messenger_.askChannel(opt_name);
-  }
+/**
+ * Activity client-side binding for messaging.
+ *
+ * Whether the host can or cannot receive a message depends on the type of
+ * host and its state. Ensure that the code has an alternative path if
+ * messaging is not available.
+ *
+ * @interface
+ */
+class ActivityMessagingPort {
 
   /**
-   * Returns a promise that yields when the iframe is ready to be interacted
-   * with.
-   * @return {!Promise}
+   * Returns the target window where host is loaded. May be unavailable.
+   * @return {?Window}
    */
-  whenReady() {
-    return this.readyPromise_;
-  }
+  getTargetWin() {}
 
   /**
-   * Register a callback to handle resize requests. Once successfully resized,
-   * ensure to call `resized()` method.
-   * @param {function(number)} callback
+   * Sends a message to the host.
+   * @param {!Object} payload
    */
-  onResizeRequest(callback) {
-    this.onResizeRequest_ = callback;
-    Promise.resolve().then(() => {
-      if (this.requestedHeight_ != null) {
-        callback(this.requestedHeight_);
-      }
-    });
-  }
+  message(payload) {}
 
   /**
-   * Signals back to the activity implementation that the client has updated
-   * the activity's size.
+   * Registers a callback to receive messages from the host.
+   * @param {function(!Object)} callback
    */
-  resized() {
-    if (!this.connected_) {
-      return;
-    }
-    const height = this.iframe_.offsetHeight;
-    this.messenger_.sendCommand('resized', {'height': height});
-  }
+  onMessage(callback) {}
 
   /**
-   * @param {string} cmd
-   * @param {?Object} payload
-   * @private
+   * Creates a new communication channel or returns an existing one.
+   * @param {string=} opt_name
+   * @return {!Promise<!MessagePort>}
    */
-  handleCommand_(cmd, payload) {
-    if (cmd == 'connect') {
-      // First ever message. Indicates that the receiver is listening.
-      this.connected_ = true;
-      this.messenger_.sendStartCommand(this.args_);
-      this.connectedResolver_();
-    } else if (cmd == 'result') {
-      // The last message. Indicates that the result has been received.
-      if (this.resultResolver_) {
-        const code = /** @type {!ActivityResultCode} */ (payload['code']);
-        const data =
-            code == ActivityResultCode.FAILED ?
-            new Error(payload['data'] || '') :
-            payload['data'];
-        const result = new ActivityResult(
-            code,
-            data,
-            ActivityMode.IFRAME,
-            this.messenger_.getTargetOrigin(),
-            /* originVerified */ true,
-            /* secureChannel */ true);
-        resolveResult(this.win_, result, this.resultResolver_);
-        this.resultResolver_ = null;
-        this.messenger_.sendCommand('close');
-        this.disconnect();
-      }
-    } else if (cmd == 'ready') {
-      if (this.readyResolver_) {
-        this.readyResolver_();
-        this.readyResolver_ = null;
-      }
-    } else if (cmd == 'resize') {
-      this.requestedHeight_ = /** @type {number} */ (payload['height']);
-      if (this.onResizeRequest_) {
-        this.onResizeRequest_(this.requestedHeight_);
-      }
-    }
-  }
+  messageChannel(opt_name) {}
 }
 
 
 
+/** DOMException.ABORT_ERR name */
+const ABORT_ERR_NAME = 'AbortError';
 
-/**
- * The `ActivityPort` implementation for the standalone window activity
- * client executed as a popup.
- *
- * @implements {ActivityPort}
- * @implements {ActivityMessagingPort}
- */
-class ActivityWindowPort {
+/** DOMException.ABORT_ERR = 20 */
+const ABORT_ERR_CODE = 20;
 
-  /**
-   * @param {!Window} win
-   * @param {string} requestId
-   * @param {string} url
-   * @param {string} target
-   * @param {?Object=} opt_args
-   * @param {?ActivityOpenOptions=} opt_options
-   */
-  constructor(win, requestId, url, target, opt_args, opt_options) {
-    const isValidTarget =
-        target &&
-        (target == '_blank' || target == '_top' || target[0] != '_');
-    if (!isValidTarget) {
-      throw new Error('The only allowed targets are "_blank", "_top"' +
-          ' and name targets');
-    }
+/** @type {?HTMLAnchorElement} */
+let aResolver;
 
-    /** @private @const {!Window} */
-    this.win_ = win;
-    /** @private @const {string} */
-    this.requestId_ = requestId;
-    /** @private @const {string} */
-    this.url_ = url;
-    /** @private @const {string} */
-    this.openTarget_ = target;
-    /** @private @const {?Object} */
-    this.args_ = opt_args || null;
-    /** @private @const {!ActivityOpenOptions} */
-    this.options_ = opt_options || {};
 
-    /** @private {?function()} */
-    this.connectedResolver_ = null;
+/**
+ * @param {string} urlString
+ * @return {!HTMLAnchorElement}
+ */
+function parseUrl(urlString) {
+  if (!aResolver) {
+    aResolver = /** @type {!HTMLAnchorElement} */ (document.createElement('a'));
+  }
+  aResolver.href = urlString;
+  return /** @type {!HTMLAnchorElement} */ (aResolver);
+}
 
-    /** @private @const {!Promise} */
-    this.connectedPromise_ = new Promise(resolve => {
-      this.connectedResolver_ = resolve;
-    });
 
-    /** @private {?function((!ActivityResult|!Promise))} */
-    this.resultResolver_ = null;
+/**
+ * @param {!Location|!URL|!HTMLAnchorElement} loc
+ * @return {string}
+ */
+function getOrigin(loc) {
+  if (loc.origin) {
+    return loc.origin;
+  }
+  // Make sure that the origin is normalized. Specifically on IE, host sometimes
+  // includes the default port, which is not per standard.
+  const protocol = loc.protocol;
+  let host = loc.host;
+  if (protocol == 'https:' && host.indexOf(':443') == host.length - 4) {
+    host = host.replace(':443', '');
+  } else if (protocol == 'http:' && host.indexOf(':80') == host.length - 3) {
+    host = host.replace(':80', '');
+  }
+  return protocol + '//' + host;
+}
 
-    /** @private @const {!Promise<!ActivityResult>} */
-    this.resultPromise_ = new Promise(resolve => {
-      this.resultResolver_ = resolve;
-    });
 
-    /** @private {?Window} */
-    this.targetWin_ = null;
+/**
+ * @param {string} urlString
+ * @return {string}
+ */
+function getOriginFromUrl(urlString) {
+  return getOrigin(parseUrl(urlString));
+}
 
-    /** @private {?number} */
-    this.heartbeatInterval_ = null;
 
-    /** @private {?Messenger} */
-    this.messenger_ = null;
+/**
+ * @param {string} urlString
+ * @return {string}
+ */
+function removeFragment(urlString) {
+  const index = urlString.indexOf('#');
+  if (index == -1) {
+    return urlString;
   }
+  return urlString.substring(0, index);
+}
 
-  /** @override */
-  getMode() {
-    return this.openTarget_ == '_top' ?
-        ActivityMode.REDIRECT :
-        ActivityMode.POPUP;
-  }
 
-  /**
-   * Opens the activity in a window, either as a popup or via redirect.
-   *
-   * Returns the promise that will yield when the window returns or closed.
-   * Notice, that this promise may never complete if "redirect" mode was used.
-   *
-   * @return {!Promise}
-   */
-  open() {
-    return this.openInternal_();
+/**
+ * Parses and builds Object of URL query string.
+ * @param {string} query The URL query string.
+ * @return {!Object<string, string>}
+ */
+function parseQueryString(query) {
+  if (!query) {
+    return {};
   }
+  return (/^[?#]/.test(query) ? query.slice(1) : query)
+      .split('&')
+      .reduce((params, param) => {
+        const item = param.split('=');
+        const key = decodeURIComponent(item[0] || '');
+        const value = decodeURIComponent(item[1] || '');
+        if (key) {
+          params[key] = value;
+        }
+        return params;
+      }, {});
+}
 
-  /**
-   * Waits until the activity port is connected to the host.
-   * @return {!Promise}
-   */
-  whenConnected() {
-    return this.connectedPromise_;
-  }
 
-  /**
-   * Disconnect the activity binding and cleanup listeners.
-   */
-  disconnect() {
-    if (this.heartbeatInterval_) {
-      this.win_.clearInterval(this.heartbeatInterval_);
-      this.heartbeatInterval_ = null;
-    }
-    if (this.messenger_) {
-      this.messenger_.disconnect();
-      this.messenger_ = null;
-    }
-    if (this.targetWin_) {
-      // Try to close the popup window. The host will also try to do the same.
-      try {
-        this.targetWin_.close();
-      } catch (e) {
-        // Ignore.
-      }
-      this.targetWin_ = null;
-    }
-    this.resultResolver_ = null;
-  }
+/**
+ * @param {string} queryString  A query string in the form of "a=b&c=d". Could
+ *   be optionally prefixed with "?" or "#".
+ * @param {string} param The param to get from the query string.
+ * @return {?string}
+ */
+function getQueryParam(queryString, param) {
+  return parseQueryString(queryString)[param];
+}
 
-  /** @override */
-  getTargetWin() {
-    return this.targetWin_;
-  }
 
-  /** @override */
-  acceptResult() {
-    return this.resultPromise_;
-  }
+/**
+ * Add a query-like parameter to the fragment string.
+ * @param {string} url
+ * @param {string} param
+ * @param {string} value
+ * @return {string}
+ */
+function addFragmentParam(url, param, value) {
+  return url +
+      (url.indexOf('#') == -1 ? '#' : '&') +
+      encodeURIComponent(param) + '=' + encodeURIComponent(value);
+}
 
-  /**
-   * Sends a message to the host.
-   * Whether the host can or cannot receive a message depends on the type of
-   * host and its state. Ensure that the code has an alternative path if
-   * messaging is not available.
-   * @override
-   */
-  message(payload) {
-    this.messenger_.customMessage(payload);
-  }
 
-  /**
-   * Registers a callback to receive messages from the host.
-   * Whether the host can or cannot receive a message depends on the type of
-   * host and its state. Ensure that the code has an alternative path if
-   * messaging is not available.
-   * @override
-   */
-  onMessage(callback) {
-    this.messenger_.onCustomMessage(callback);
+/**
+ * @param {string} queryString  A query string in the form of "a=b&c=d". Could
+ *   be optionally prefixed with "?" or "#".
+ * @param {string} param The param to remove from the query string.
+ * @return {?string}
+ */
+function removeQueryParam(queryString, param) {
+  if (!queryString) {
+    return queryString;
   }
-
-  /**
-   * Creates a new communication channel or returns an existing one.
-   * Whether the host can or cannot receive a message depends on the type of
-   * host and its state. Ensure that the code has an alternative path if
-   * messaging is not available.
-   * @override
-   */
-  messageChannel(opt_name) {
-    return this.messenger_.askChannel(opt_name);
+  const search = encodeURIComponent(param) + '=';
+  let index = -1;
+  do {
+    index = queryString.indexOf(search, index);
+    if (index != -1) {
+      const prev = index > 0 ? queryString.substring(index - 1, index) : '';
+      if (prev == '' || prev == '?' || prev == '#' || prev == '&') {
+        let end = queryString.indexOf('&', index + 1);
+        if (end == -1) {
+          end = queryString.length;
+        }
+        queryString =
+            queryString.substring(0, index) +
+            queryString.substring(end + 1);
+      } else {
+        index++;
+      }
+    }
+  } while (index != -1 && index < queryString.length);
+  return queryString;
+}
+
+
+/**
+ * @param {!ActivityRequest} request
+ * @return {string}
+ */
+function serializeRequest(request) {
+  const map = {
+    'requestId': request.requestId,
+    'returnUrl': request.returnUrl,
+    'args': request.args,
+  };
+  if (request.origin !== undefined) {
+    map['origin'] = request.origin;
   }
+  if (request.originVerified !== undefined) {
+    map['originVerified'] = request.originVerified;
+  }
+  return JSON.stringify(map);
+}
 
-  /**
-   * This method wraps around window's open method. It first tries to execute
-   * `open` call with the provided target and if it fails, it retries the call
-   * with the `_top` target. This is necessary given that in some embedding
-   * scenarios, such as iOS' WKWebView, navigation to `_blank` and other targets
-   * is blocked by default.
-   * @return {!Promise}
-   * @private
-   */
-  openInternal_() {
-    const featuresStr = this.buildFeatures_();
 
-    // Protectively, the URL will contain the request payload, unless explicitly
-    // directed not to via `skipRequestInUrl` option.
-    let url = this.url_;
-    if (!this.options_.skipRequestInUrl) {
-      const returnUrl =
-          this.options_.returnUrl ||
-          removeFragment(this.win_.location.href);
-      const requestString = serializeRequest({
-        requestId: this.requestId_,
-        returnUrl,
-        args: this.args_,
-      });
-      url = addFragmentParam(url, '__WA__', requestString);
-    }
+/**
+ * @param {*} error
+ * @return {boolean}
+ */
+function isAbortError(error) {
+  if (!error || typeof error != 'object') {
+    return false;
+  }
+  return (error['name'] === ABORT_ERR_NAME);
+}
 
-    // Open the window.
-    let targetWin;
-    let openTarget = this.openTarget_;
-    // IE does not support CORS popups - the popup has to fallback to redirect
-    // mode.
-    if (openTarget != '_top') {
-      if (isIeBrowser(this.win_)) {
-        openTarget = '_top';
-      }
-    }
-    // Try first with the specified target. If we're inside the WKWebView or
-    // a similar environments, this method is expected to fail by default for
-    // all targets except `_top`.
+
+/**
+ * Creates or emulates a DOMException of AbortError type.
+ * See https://heycam.github.io/webidl/#aborterror.
+ * @param {!Window} win
+ * @param {string=} opt_message
+ * @return {!DOMException}
+ */
+function createAbortError(win, opt_message) {
+  const message = 'AbortError' + (opt_message ? ': ' + opt_message : '');
+  let error = null;
+  if (typeof win['DOMException'] == 'function') {
+    // TODO(dvoytenko): remove typecast once externs are fixed.
+    const constr = /** @type {function(new:DOMException, string, string)} */ (
+        win['DOMException']);
     try {
-      targetWin = this.win_.open(url, openTarget, featuresStr);
+      error = new constr(message, ABORT_ERR_NAME);
     } catch (e) {
-      // Ignore.
-    }
-    // Then try with `_top` target.
-    if (!targetWin &&
-        openTarget != '_top' &&
-        !this.options_.disableRedirectFallback) {
-      openTarget = '_top';
-      try {
-        targetWin = this.win_.open(url, openTarget);
-      } catch (e) {
-        // Ignore.
-      }
+      // Ignore. In particular, `new DOMException()` fails in Edge.
     }
+  }
+  if (!error) {
+    // TODO(dvoytenko): remove typecast once externs are fixed.
+    const constr = /** @type {function(new:DOMException, string)} */ (
+        Error);
+    error = new constr(message);
+    error.name = ABORT_ERR_NAME;
+    error.code = ABORT_ERR_CODE;
+  }
+  return error;
+}
 
-    // Setup the target window.
-    if (targetWin) {
-      this.targetWin_ = targetWin;
-      if (openTarget != '_top') {
-        this.setupPopup_();
-      }
-    } else {
-      this.disconnectWithError_(new Error('failed to open window'));
-    }
 
-    // Return result promise, even though it may never complete.
-    return this.resultPromise_.catch(() => {
-      // Ignore. Call to the `acceptResult()` should fail if needed.
-    });
+/**
+ * Resolves the activity result as a promise:
+ *  - `OK` result is yielded as the promise's payload;
+ *  - `CANCEL` result is rejected with the `AbortError`;
+ *  - `FAILED` result is rejected with the embedded error.
+ *
+ * @param {!Window} win
+ * @param {!ActivityResult} result
+ * @param {function((!ActivityResult|!Promise))} resolver
+ */
+function resolveResult(win, result, resolver) {
+  if (result.ok) {
+    resolver(result);
+  } else {
+    const error = result.error || createAbortError(win);
+    error.activityResult = result;
+    resolver(Promise.reject(error));
   }
+}
 
-  /**
-   * @return {string}
-   * @private
-   */
-  buildFeatures_() {
-    // The max width and heights are calculated as following:
-    // MaxSize = AvailSize - ControlsSize
-    // ControlsSize = OuterSize - InnerSize
-    const screen = this.win_.screen;
-    const availWidth = screen.availWidth || screen.width;
-    const availHeight = screen.availHeight || screen.height;
-    const isTop = this.isTopWindow_();
-    const isEdge = isEdgeBrowser(this.win_);
-    // Limit controls to 100px width and height. Notice that it's only
-    // possible to calculate controls size in the top window, not in iframes.
-    // Notice that the Edge behavior is somewhat unique. If we can't find the
-    // right width/height, it will launch in the full-screen. Other browsers
-    // deal with such cases more gracefully.
-    const controlsWidth =
-        isTop && this.win_.outerWidth > this.win_.innerWidth ?
-        Math.min(100, this.win_.outerWidth - this.win_.innerWidth) :
-        (isEdge ? 100 : 0);
-    const controlsHeight =
-        isTop && this.win_.outerHeight > this.win_.innerHeight ?
-        Math.min(100, this.win_.outerHeight - this.win_.innerHeight) :
-        (isEdge ? 100 : 0);
-    // With all the adjustments, at least 50% of the available width/height
-    // should be made available to a popup.
-    const maxWidth = Math.max(availWidth - controlsWidth, availWidth * 0.5);
-    const maxHeight = Math.max(availHeight - controlsHeight, availHeight * 0.5);
-    let w = Math.floor(Math.min(600, maxWidth * 0.9));
-    let h = Math.floor(Math.min(600, maxHeight * 0.9));
-    if (this.options_.width) {
-      w = Math.min(this.options_.width, maxWidth);
-    }
-    if (this.options_.height) {
-      h = Math.min(this.options_.height, maxHeight);
-    }
-    const x = Math.floor((screen.width - w) / 2);
-    const y = Math.floor((screen.height - h) / 2);
-    const features = {
-      'height': h,
-      'width': w,
-      'resizable': 'yes',
-      'scrollbars': 'yes',
-    };
-    // Do not set left/top in Edge: it fails.
-    if (!isEdge) {
-      features['left'] = x;
-      features['top'] = y;
-    }
-    let featuresStr = '';
-    for (const f in features) {
-      if (featuresStr) {
-        featuresStr += ',';
-      }
-      featuresStr += `${f}=${features[f]}`;
-    }
-    return featuresStr;
-  }
 
-  /**
-   * This method only exists to make iframe/top emulation possible in tests.
-   * Otherwise `window.top` cannot be overridden.
-   * @return {boolean}
-   * @private
-   */
-  isTopWindow_() {
-    return this.win_ == this.win_.top;
-  }
-
-  /** @private */
-  setupPopup_() {
-    // Keep alive to catch the window closing, which would indicate
-    // "cancel" signal.
-    this.heartbeatInterval_ = this.win_.setInterval(() => {
-      this.check_(/* delayCancel */ true);
-    }, 500);
-
-    // Start up messaging. The messaging is explicitly allowed to proceed
-    // without origin check b/c all arguments have already been passed in
-    // the URL and special handling is enforced when result is delivered.
-    this.messenger_ = new Messenger(
-        this.win_,
-        /** @type {!Window} */ (this.targetWin_),
-        /* targetOrigin */ null,
-        /* requireTarget */ true);
-    this.messenger_.connect(this.handleCommand_.bind(this));
-  }
-
-  /**
-   * @param {boolean=} opt_delayCancel
-   * @private
-   */
-  check_(opt_delayCancel) {
-    if (!this.targetWin_ || this.targetWin_.closed) {
-      if (this.heartbeatInterval_) {
-        this.win_.clearInterval(this.heartbeatInterval_);
-        this.heartbeatInterval_ = null;
-      }
-      // Give a chance for the result to arrive, but otherwise consider the
-      // responce to be empty.
-      this.win_.setTimeout(() => {
-        try {
-          this.result_(ActivityResultCode.CANCELED, /* data */ null);
-        } catch (e) {
-          this.disconnectWithError_(e);
-        }
-      }, opt_delayCancel ? 3000 : 0);
-    }
-  }
-
-  /**
-   * @param {!Error} reason
-   * @private
-   */
-  disconnectWithError_(reason) {
-    if (this.resultResolver_) {
-      this.resultResolver_(Promise.reject(reason));
-    }
-    this.disconnect();
-  }
-
-  /**
-   * @param {!ActivityResultCode} code
-   * @param {*} data
-   * @private
-   */
-  result_(code, data) {
-    if (this.resultResolver_) {
-      const isConnected = this.messenger_.isConnected();
-      const result = new ActivityResult(
-          code,
-          data,
-          ActivityMode.POPUP,
-          isConnected ?
-              this.messenger_.getTargetOrigin() :
-              getOriginFromUrl(this.url_),
-          /* originVerified */ isConnected,
-          /* secureChannel */ isConnected);
-      resolveResult(this.win_, result, this.resultResolver_);
-      this.resultResolver_ = null;
-    }
-    if (this.messenger_) {
-      this.messenger_.sendCommand('close');
-    }
-    this.disconnect();
-  }
-
-  /**
-   * @param {string} cmd
-   * @param {?Object} payload
-   * @private
-   */
-  handleCommand_(cmd, payload) {
-    if (cmd == 'connect') {
-      // First ever message. Indicates that the receiver is listening.
-      this.messenger_.sendStartCommand(this.args_);
-      this.connectedResolver_();
-    } else if (cmd == 'result') {
-      // The last message. Indicates that the result has been received.
-      const code = /** @type {!ActivityResultCode} */ (payload['code']);
-      const data =
-          code == ActivityResultCode.FAILED ?
-          new Error(payload['data'] || '') :
-          payload['data'];
-      this.result_(code, data);
-    } else if (cmd == 'check') {
-      this.win_.setTimeout(() => this.check_(), 200);
-    }
-  }
-}
+/**
+ * @param {!Window} win
+ * @return {boolean}
+ */
+function isIeBrowser(win) {
+  // MSIE and Trident are typical user agents for IE browsers.
+  const nav = win.navigator;
+  return /Trident|MSIE|IEMobile/i.test(nav && nav.userAgent);
+}
 
 
 /**
  * @param {!Window} win
- * @param {string} fragment
- * @param {string} requestId
- * @return {?ActivityPort}
+ * @return {boolean}
  */
-function discoverRedirectPort(win, fragment, requestId) {
-  // Try to find the result in the fragment.
-  const paramName = '__WA_RES__';
-  const fragmentParam = getQueryParam(fragment, paramName);
-  if (!fragmentParam) {
-    return null;
-  }
-  const response = /** @type {?Object} */ (JSON.parse(fragmentParam));
-  if (!response || response['requestId'] != requestId) {
-    return null;
-  }
-
-  // Remove the found param from the fragment.
-  const cleanFragment = removeQueryParam(win.location.hash, paramName) || '';
-  if (cleanFragment != win.location.hash) {
-    if (win.history && win.history.replaceState) {
-      try {
-        win.history.replaceState(win.history.state, '', cleanFragment);
-      } catch (e) {
-        // Ignore.
-      }
-    }
-  }
-
-  const code = response['code'];
-  const data = response['data'];
-  const origin = response['origin'];
-  const referrerOrigin = win.document.referrer &&
-      getOriginFromUrl(win.document.referrer);
-  const originVerified = origin == referrerOrigin;
-  return new ActivityWindowRedirectPort(
-      win,
-      code,
-      data,
-      origin,
-      originVerified);
+function isEdgeBrowser(win) {
+  const nav = win.navigator;
+  return /Edge/i.test(nav && nav.userAgent);
 }
 
 
 /**
- * The `ActivityPort` implementation for the standalone window activity
- * client executed as a popup.
- *
- * @implements {ActivityPort}
+ * @param {!Error} e
  */
-class ActivityWindowRedirectPort {
-
-  /**
-   * @param {!Window} win
-   * @param {!ActivityResultCode} code
-   * @param {*} data
-   * @param {string} targetOrigin
-   * @param {boolean} targetOriginVerified
-   */
-  constructor(win, code, data, targetOrigin, targetOriginVerified) {
-    /** @private @const {!Window} */
-    this.win_ = win;
-    /** @private @const {!ActivityResultCode} */
-    this.code_ = code;
-    /** @private @const {*} */
-    this.data_ = data;
-    /** @private {string} */
-    this.targetOrigin_ = targetOrigin;
-    /** @private {boolean} */
-    this.targetOriginVerified_ = targetOriginVerified;
-  }
+function throwAsync(e) {
+  setTimeout(() => {throw e;});
+}
 
-  /** @override */
-  getMode() {
-    return ActivityMode.REDIRECT;
-  }
 
-  /** @override */
-  acceptResult() {
-    const result = new ActivityResult(
-        this.code_,
-        this.data_,
-        ActivityMode.REDIRECT,
-        this.targetOrigin_,
-        this.targetOriginVerified_,
-        /* secureChannel */ false);
-    return new Promise(resolve => {
-      resolveResult(this.win_, result, resolve);
-    });
+/**
+ * Polyfill of the `Node.isConnected` API. See
+ * https://developer.mozilla.org/en-US/docs/Web/API/Node/isConnected.
+ * @param {!Node} node
+ * @return {boolean}
+ */
+function isNodeConnected(node) {
+  // Ensure that node is attached if specified. This check uses a new and
+  // fast `isConnected` API and thus only checked on platforms that have it.
+  // See https://www.chromestatus.com/feature/5676110549352448.
+  if ('isConnected' in node) {
+    return node['isConnected'];
   }
+  // Polyfill.
+  const root = node.ownerDocument && node.ownerDocument.documentElement;
+  return (root && root.contains(node)) || false;
 }
 
 
 
+const SENTINEL = '__ACTIVITIES__';
+
 
 /**
- * The page-level activities manager ports. This class is intended to be used
- * as a singleton. It can start activities of all modes: iframe, popup, and
- * redirect.
+ * The messenger helper for activity's port and host.
  */
-class ActivityPorts {
+class Messenger {
 
   /**
    * @param {!Window} win
+   * @param {!Window|function():?Window} targetOrCallback
+   * @param {?string} targetOrigin
+   * @param {boolean} requireTarget
    */
-  constructor(win) {
-    /** @const {string} */
-    this.version = '1.24';
-
+  constructor(win, targetOrCallback, targetOrigin, requireTarget) {
     /** @private @const {!Window} */
     this.win_ = win;
 
-    /** @private @const {string} */
-    this.fragment_ = win.location.hash;
+    /** @private @const {!Window|function():?Window} */
+    this.targetOrCallback_ = targetOrCallback;
 
     /**
-     * @private @const {!Object<string, !Array<function(!ActivityPort)>>}
+     * May start as unknown (`null`) until received in the first message.
+     * @private {?string}
      */
-    this.requestHandlers_ = {};
+    this.targetOrigin_ = targetOrigin;
+
+    /** @private @const {boolean} */
+    this.requireTarget_ = requireTarget;
+
+    /** @private {?Window} */
+    this.target_ = null;
+
+    /** @private {boolean} */
+    this.acceptsChannel_ = false;
+
+    /** @private {?MessagePort} */
+    this.port_ = null;
+
+    /** @private {?function(string, ?Object)} */
+    this.onCommand_ = null;
+
+    /** @private {?function(!Object)} */
+    this.onCustomMessage_ = null;
 
     /**
-     * The result buffer is indexed by `requestId`.
-     * @private @const {!Object<string, !ActivityPort>}
+     * @private {?Object<string, !ChannelHolder>}
      */
-    this.resultBuffer_ = {};
-
-    /** @private {?function(!Error)} */
-    this.redirectErrorResolver_ = null;
+    this.channels_ = null;
 
-    /** @private {!Promise<!Error>} */
-    this.redirectErrorPromise_ = new Promise(resolve => {
-      this.redirectErrorResolver_ = resolve;
-    });
+    /** @private @const */
+    this.boundHandleEvent_ = this.handleEvent_.bind(this);
   }
 
   /**
-   * Start an activity within the specified iframe.
-   * @param {!HTMLIFrameElement} iframe
-   * @param {string} url
-   * @param {?Object=} opt_args
-   * @return {!Promise<!ActivityIframePort>}
+   * Connect the port to the host or vice versa.
+   * @param {function(string, ?Object)} onCommand
    */
-  openIframe(iframe, url, opt_args) {
-    const port = new ActivityIframePort(iframe, url, opt_args);
-    return port.connect().then(() => port);
+  connect(onCommand) {
+    if (this.onCommand_) {
+      throw new Error('already connected');
+    }
+    this.onCommand_ = onCommand;
+    this.win_.addEventListener('message', this.boundHandleEvent_);
   }
 
   /**
-   * Start an activity in a separate window. The result will be delivered
-   * to the `onResult` callback.
-   *
-   * The activity can be opened in two modes: "popup" and "redirect". This
-   * depends on the `target` value, but also on the browser/environment.
-   *
-   * The allowed `target` values are `_blank`, `_top` and name targets. The
-   * `_self`, `_parent` and similar targets are not allowed.
-   *
-   * The `_top` target indicates that the activity should be opened as a
-   * "redirect", while other targets indicate that the activity should be
-   * opened as a popup. The activity client will try to honor the requested
-   * target. However, it's not always possible. Some environments do not
-   * allow popups and they either force redirect or fail the window open
-   * request. In this case, the activity will try to fallback to the "redirect"
-   * mode.
-   *
-   * @param {string} requestId
-   * @param {string} url
-   * @param {string} target
-   * @param {?Object=} opt_args
-   * @param {?ActivityOpenOptions=} opt_options
-   * @return {{targetWin: ?Window}}
+   * Disconnect messenger.
    */
-  open(requestId, url, target, opt_args, opt_options) {
-    const port = this.openWin_(requestId, url, target, opt_args, opt_options);
-    return {targetWin: port.getTargetWin()};
+  disconnect() {
+    if (this.onCommand_) {
+      this.onCommand_ = null;
+      if (this.port_) {
+        closePort(this.port_);
+        this.port_ = null;
+      }
+      this.win_.removeEventListener('message', this.boundHandleEvent_);
+      if (this.channels_) {
+        for (const k in this.channels_) {
+          const channelObj = this.channels_[k];
+          if (channelObj.port1) {
+            closePort(channelObj.port1);
+          }
+          if (channelObj.port2) {
+            closePort(channelObj.port2);
+          }
+        }
+        this.channels_ = null;
+      }
+    }
   }
 
   /**
-   * Start an activity in a separate window and tries to setup messaging with
-   * this window.
-   *
-   * See `open()` method for more details, including `onResult` callback.
-   *
-   * @param {string} requestId
-   * @param {string} url
-   * @param {string} target
-   * @param {?Object=} opt_args
-   * @param {?ActivityOpenOptions=} opt_options
-   * @return {!Promise<!ActivityMessagingPort>}
+   * Returns whether the messenger has been connected already.
+   * @return {boolean}
    */
-  openWithMessaging(requestId, url, target, opt_args, opt_options) {
-    const port = this.openWin_(requestId, url, target, opt_args, opt_options);
-    return port.whenConnected().then(() => port);
+  isConnected() {
+    return this.targetOrigin_ != null;
   }
 
   /**
-   * Registers the callback for the result of the activity opened with the
-   * specified `requestId` (see the `open()` method). The callback is a
-   * function that takes a single `ActivityPort` argument. The client
-   * can use this object to verify the port using it's origin, verified and
-   * secure channel flags. Then the client can call
-   * `ActivityPort.acceptResult()` method to accept the result.
-   *
-   * The activity result is handled via a separate callback because of a
-   * possible redirect. So use of direct callbacks and/or promises is not
-   * possible in that case.
-   *
-   * A typical implementation would look like:
-   * ```
-   * ports.onResult('request1', function(port) {
-   *   port.acceptResult().then(function(result) {
-   *     // Only verified origins are allowed.
-   *     if (result.origin == expectedOrigin &&
-   *         result.originVerified &&
-   *         result.secureChannel) {
-   *       handleResultForRequest1(result);
-   *     }
-   *   });
-   * })
-   *
-   * ports.open('request1', request1Url, '_blank');
-   * ```
-   *
-   * @param {string} requestId
-   * @param {function(!ActivityPort)} callback
+   * Returns the messaging target. Only available when connection has been
+   * establihsed.
+   * @return {!Window}
    */
-  onResult(requestId, callback) {
-    let handlers = this.requestHandlers_[requestId];
-    if (!handlers) {
-      handlers = [];
-      this.requestHandlers_[requestId] = handlers;
+  getTarget() {
+    const target = this.getOptionalTarget_();
+    if (!target) {
+      throw new Error('not connected');
     }
-    handlers.push(callback);
+    return target;
+  }
 
-    // Consume available result.
-    const availableResult = this.discoverResult_(requestId);
-    if (availableResult) {
-      this.consumeResult_(availableResult, callback);
+  /**
+   * @return {?Window}
+   * @private
+   */
+  getOptionalTarget_() {
+    if (this.onCommand_ && !this.target_) {
+      if (typeof this.targetOrCallback_ == 'function') {
+        this.target_ = this.targetOrCallback_();
+      } else {
+        this.target_ = /** @type {!Window} */ (this.targetOrCallback_);
+      }
     }
+    return this.target_;
   }
 
   /**
-   * @param {function(!Error)} handler
+   * Returns the messaging origin. Only available when connection has been
+   * establihsed.
+   * @return {string}
    */
-  onRedirectError(handler) {
-    this.redirectErrorPromise_.then(handler);
+  getTargetOrigin() {
+    if (this.targetOrigin_ == null) {
+      throw new Error('not connected');
+    }
+    return this.targetOrigin_;
   }
 
   /**
-   * @param {string} requestId
-   * @param {string} url
-   * @param {string} target
-   * @param {?Object=} opt_args
-   * @param {?ActivityOpenOptions=} opt_options
-   * @return {!ActivityWindowPort}
+   * The host sends this message to the client to indicate that it's ready to
+   * start communicating. The client is expected to respond back with the
+   * "start" command. See `sendStartCommand` method.
    */
-  openWin_(requestId, url, target, opt_args, opt_options) {
-    const port = new ActivityWindowPort(
-        this.win_, requestId, url, target, opt_args, opt_options);
-    port.open().then(() => {
-      // Await result if possible. Notice that when falling back to "redirect",
-      // the result will never arrive through this port.
-      this.consumeResultAll_(requestId, port);
-    });
-    return port;
+  sendConnectCommand() {
+    // TODO(dvoytenko): MessageChannel is critically necessary for IE/Edge,
+    // since window messaging doesn't always work. It's also preferred as an API
+    // for other browsers: it's newer, cleaner and arguably more secure.
+    // Unfortunately, browsers currently do not propagate user gestures via
+    // MessageChannel, only via window messaging. This should be re-enabled
+    // once browsers fix user gesture propagation.
+    // See:
+    // Safari: https://bugs.webkit.org/show_bug.cgi?id=186593
+    // Chrome: https://bugs.chromium.org/p/chromium/issues/detail?id=851493
+    // Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=1469422
+    const acceptsChannel = isIeBrowser(this.win_) || isEdgeBrowser(this.win_);
+    this.sendCommand('connect', {'acceptsChannel': acceptsChannel});
   }
 
   /**
-   * @param {string} requestId
-   * @return {?ActivityPort}
-   * @private
+   * The client sends this message to the host upon receiving the "connect"
+   * message to start the main communication channel. As a payload, the message
+   * will contain the provided start arguments.
+   * @param {?Object} args
    */
-  discoverResult_(requestId) {
-    let port = this.resultBuffer_[requestId];
-    if (!port && this.fragment_) {
-      try {
-        port = discoverRedirectPort(
-            this.win_, this.fragment_, requestId);
-      } catch (e) {
-        throwAsync(e);
-        this.redirectErrorResolver_(e);
-      }
-      if (port) {
-        this.resultBuffer_[requestId] = port;
-      }
+  sendStartCommand(args) {
+    let channel = null;
+    if (this.acceptsChannel_ && typeof this.win_.MessageChannel == 'function') {
+      channel = new this.win_.MessageChannel();
+    }
+    if (channel) {
+      this.sendCommand('start', args, [channel.port2]);
+      // It's critical to switch to port messaging only after "start" has been
+      // sent. Otherwise, it won't be delivered.
+      this.switchToChannel_(channel.port1);
+    } else {
+      this.sendCommand('start', args);
     }
-    return port;
   }
 
   /**
-   * @param {!ActivityPort} port
-   * @param {function(!ActivityPort)} callback
-   * @private
+   * Sends the specified command from the port to the host or vice versa.
+   * @param {string} cmd
+   * @param {?Object=} opt_payload
+   * @param {?Array=} opt_transfer
    */
-  consumeResult_(port, callback) {
-    Promise.resolve().then(() => {
-      callback(port);
-    });
+  sendCommand(cmd, opt_payload, opt_transfer) {
+    const data = {
+      'sentinel': SENTINEL,
+      'cmd': cmd,
+      'payload': opt_payload || null,
+    };
+    if (this.port_) {
+      this.port_.postMessage(data, opt_transfer || undefined);
+    } else {
+      const target = this.getTarget();
+      // Only "connect" command is allowed to use `targetOrigin == '*'`
+      const targetOrigin =
+          cmd == 'connect' ?
+          (this.targetOrigin_ != null ? this.targetOrigin_ : '*') :
+          this.getTargetOrigin();
+      target.postMessage(data, targetOrigin, opt_transfer || undefined);
+    }
   }
 
   /**
-   * @param {string} requestId
-   * @param {!ActivityPort} port
-   * @private
+   * Sends a message to the client.
+   * @param {!Object} payload
    */
-  consumeResultAll_(requestId, port) {
-    // Find and execute handlers.
-    const handlers = this.requestHandlers_[requestId];
-    if (handlers) {
-      handlers.forEach(handler => {
-        this.consumeResult_(port, handler);
-      });
-    }
-    // Buffer the result for callbacks that may arrive in the future.
-    this.resultBuffer_[requestId] = port;
+  customMessage(payload) {
+    this.sendCommand('msg', payload);
   }
-}
 
-
-
-var activityPorts = {
-  ActivityPorts,
-  ActivityIframePort,
-  ActivityMessagingPort,
-  ActivityMode,
-  ActivityOpenOptions,
-  ActivityPort,
-  ActivityRequest,
-  ActivityResult,
-  ActivityResultCode,
-  ActivityWindowPort,
-  createAbortError,
-  isAbortError,
-};
-var activityPorts_1 = activityPorts.ActivityPorts;
-var activityPorts_2 = activityPorts.ActivityIframePort;
-var activityPorts_11 = activityPorts.createAbortError;
-var activityPorts_12 = activityPorts.isAbortError;
-
-/**
- * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/**
- * @implements {ActivityPortDef}
- */
-class ActivityPortDeprecated {
   /**
-   * @param {!web-activities/activity-ports.ActivityPort} port
+   * Registers a callback to receive messages from the client.
+   * @param {function(!Object)} callback
    */
-  constructor(port) {
-    /** @private @const {!web-activities/activity-ports.ActivityPort} */
-    this.port_ = port;
+  onCustomMessage(callback) {
+    this.onCustomMessage_ = callback;
   }
 
   /**
-   * @return {!Promise<!web-activities/activity-ports.ActivityResult>}
+   * @param {string=} opt_name
+   * @return {!Promise<!MessagePort>}
    */
-  acceptResult() {
-    return this.port_.acceptResult();
+  startChannel(opt_name) {
+    const name = opt_name || '';
+    const channelObj = this.getChannelObj_(name);
+    if (!channelObj.port1) {
+      const channel = new this.win_.MessageChannel();
+      channelObj.port1 = channel.port1;
+      channelObj.port2 = channel.port2;
+      channelObj.resolver(channelObj.port1);
+    }
+    if (channelObj.port2) {
+      // Not yet sent.
+      this.sendCommand('cnset', {'name': name}, [channelObj.port2]);
+      channelObj.port2 = null;
+    }
+    return channelObj.promise;
   }
-}
 
-/**
- * @implements {ActivityPortDef}
- */
-class ActivityIframePort$1 {
   /**
-   * @param {!HTMLIFrameElement} iframe
-   * @param {string} url
-   * @param {?Object=} args
+   * @param {string=} opt_name
+   * @return {!Promise<!MessagePort>}
    */
-  constructor(iframe, url, args) {
-    /** @private @const {!web-activities/activity-ports.ActivityIframePort} */
-    this.iframePort_ = new activityPorts_2(iframe, url, args);
-    /** @private @const {!Object<string, function(!Object)>} */
-    this.callbackMap_ = {};
-    /** @private {?function(!../proto/api_messages.Message)} */
-    this.callbackOriginal_ = null;
+  askChannel(opt_name) {
+    const name = opt_name || '';
+    const channelObj = this.getChannelObj_(name);
+    if (!channelObj.port1) {
+      this.sendCommand('cnget', {'name': name});
+    }
+    return channelObj.promise;
   }
 
   /**
-   * Returns a promise that yields when the iframe is ready to be interacted
-   * with.
-   * @return {!Promise}
+   * @param {string} name
+   * @param {!MessagePort} port
+   * @private
    */
-  whenReady() {
-    return this.iframePort_.whenReady();
+  receiveChannel_(name, port) {
+    const channelObj = this.getChannelObj_(name);
+    channelObj.port1 = port;
+    channelObj.resolver(port);
   }
 
   /**
-   * Waits until the activity port is connected to the host.
-   * @return {!Promise}
+   * @param {string} name
+   * @return {!ChannelHolder}
    */
-  connect() {
-    return this.iframePort_.connect().then(() => {
-      // Attach a callback to receive messages after connection complete
-      this.iframePort_.onMessage(data => {
-        if (this.callbackOriginal_) {
-          this.callbackOriginal_(data);
-        }
-        const response = data && data['RESPONSE'];
-        if (!response) {
-          return;
-        }
-        const cb = this.callbackMap_[response[0]];
-        if (cb) {
-          cb(deserialize(response));
-        }
+  getChannelObj_(name) {
+    if (!this.channels_) {
+      this.channels_ = {};
+    }
+    let channelObj = this.channels_[name];
+    if (!channelObj) {
+      let resolver;
+      const promise = new Promise(resolve => {
+        resolver = resolve;
       });
-    });
+      channelObj = {
+        port1: null,
+        port2: null,
+        resolver,
+        promise,
+      };
+      this.channels_[name] = channelObj;
+    }
+    return channelObj;
   }
 
   /**
-   * Disconnect the activity binding and cleanup listeners.
+   * @param {!MessagePort} port
+   * @private
    */
-  disconnect() {
-    this.iframePort_.disconnect();
+  switchToChannel_(port) {
+    if (this.port_) {
+      closePort(this.port_);
+    }
+    this.port_ = port;
+    this.port_.onmessage = event => {
+      const data = event.data;
+      const cmd = data && data['cmd'];
+      const payload = data && data['payload'] || null;
+      if (cmd) {
+        this.handleCommand_(cmd, payload, event);
+      }
+    };
+    // Even though all messaging will switch to ports, the window-based message
+    // listener will be preserved just in case the host is refreshed and needs
+    // another connection.
   }
 
   /**
-   * Returns the mode of the activity: iframe, popup or redirect.
-   * @return {!web-activities/activity-ports.ActivityMode}
+   * @param {!MessageEvent} event
+   * @private
    */
-  getMode() {
-    return this.iframePort_.getMode();
+  handleEvent_(event) {
+    if (this.requireTarget_ && this.getOptionalTarget_() != event.source) {
+      // When target is required, confirm it against the event.source. This
+      // is normally only needed for ports where a single window can include
+      // multiple iframes to match the event to a specific iframe. Otherwise,
+      // the origin checks below are sufficient.
+      return;
+    }
+    const data = event.data;
+    if (!data || data['sentinel'] != SENTINEL) {
+      return;
+    }
+    const cmd = data['cmd'];
+    if (this.port_ && cmd != 'connect' && cmd != 'start') {
+      // Messaging channel has already taken over. However, the "connect" and
+      // "start" commands are allowed to proceed in case re-connection is
+      // requested.
+      return;
+    }
+    const origin = /** @type {string} */ (event.origin);
+    const payload = data['payload'] || null;
+    if (this.targetOrigin_ == null && cmd == 'start') {
+      this.targetOrigin_ = origin;
+    }
+    if (this.targetOrigin_ == null && event.source) {
+      if (this.getOptionalTarget_() == event.source) {
+        this.targetOrigin_ = origin;
+      }
+    }
+    // Notice that event.source may differ from the target because of
+    // friendly-iframe intermediaries.
+    if (origin != this.targetOrigin_) {
+      return;
+    }
+    this.handleCommand_(cmd, payload, event);
   }
 
   /**
-   * Accepts the result when ready. The client should verify the activity's
-   * mode, origin, verification and secure channel flags before deciding
-   * whether or not to trust the result.
-   *
-   * Returns the promise that yields when the activity has been completed and
-   * either a result, a cancelation or a failure has been returned.
-   *
-   * @return {!Promise<!web-activities/activity-ports.ActivityResult>}
-   * @override
+   * @param {string} cmd
+   * @param {?Object} payload
+   * @param {!MessageEvent} event
+   * @private
    */
-  acceptResult() {
-    return this.iframePort_.acceptResult();
+  handleCommand_(cmd, payload, event) {
+    if (cmd == 'connect') {
+      if (this.port_) {
+        // In case the port has already been open - close it to reopen it
+        // again later.
+        closePort(this.port_);
+        this.port_ = null;
+      }
+      this.acceptsChannel_ = payload && payload['acceptsChannel'] || false;
+      this.onCommand_(cmd, payload);
+    } else if (cmd == 'start') {
+      const port = event.ports && event.ports[0];
+      if (port) {
+        this.switchToChannel_(port);
+      }
+      this.onCommand_(cmd, payload);
+    } else if (cmd == 'msg') {
+      if (this.onCustomMessage_ != null && payload != null) {
+        this.onCustomMessage_(payload);
+      }
+    } else if (cmd == 'cnget') {
+      const name = payload['name'];
+      this.startChannel(name);
+    } else if (cmd == 'cnset') {
+      const name = payload['name'];
+      const port = event.ports[0];
+      this.receiveChannel_(name, /** @type {!MessagePort} */ (port));
+    } else {
+      this.onCommand_(cmd, payload);
+    }
   }
+}
 
-  /**
-   * Register a callback to handle resize requests. Once successfully resized,
-   * ensure to call `resized()` method.
-   * @param {function(number)} callback
-   */
-  onResizeRequest(callback) {
-    return this.iframePort_.onResizeRequest(callback);
-  }
 
-  /**
-   * @param {!../proto/api_messages.Message} request
-   */
-  execute(request) {
-    this.iframePort_.message({'REQUEST': request.toArray()});
+/**
+ * @param {!MessagePort} port
+ */
+function closePort(port) {
+  try {
+    port.close();
+  } catch (e) {
+    // Ignore.
   }
+}
+
+
+
+
+/**
+ * The `ActivityPort` implementation for the iframe case. Unlike other types
+ * of activities, iframe-based activities are always connected and can react
+ * to size requests.
+ *
+ * @implements {ActivityPort}
+ * @implements {ActivityMessagingPort}
+ */
+class ActivityIframePort {
 
   /**
-   * @param {!function(new: T)} message
-   * @param {function(!../proto/api_messages.Message)} callback
-   * @template T
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} url
+   * @param {?Object=} opt_args
    */
-  on(message, callback) {
-    const label = getLabel(message);
-    if (!label) {
-      throw new Error('Invalid data type');
-    } else if (this.callbackMap_[label]) {
-      throw new Error('Invalid type or duplicate callback for ', label);
-    }
-    this.callbackMap_[label] = callback;
+  constructor(iframe, url, opt_args) {
+    /** @private @const {!HTMLIFrameElement} */
+    this.iframe_ = iframe;
+    /** @private @const {string} */
+    this.url_ = url;
+    /** @private @const {?Object} */
+    this.args_ = opt_args || null;
+
+    /** @private @const {!Window} */
+    this.win_ = /** @type {!Window} */ (this.iframe_.ownerDocument.defaultView);
+
+    /** @private @const {string} */
+    this.targetOrigin_ = getOriginFromUrl(url);
+
+    /** @private {boolean} */
+    this.connected_ = false;
+
+    /** @private {?function()} */
+    this.connectedResolver_ = null;
+
+    /** @private @const {!Promise} */
+    this.connectedPromise_ = new Promise(resolve => {
+      this.connectedResolver_ = resolve;
+    });
+
+    /** @private {?function()} */
+    this.readyResolver_ = null;
+
+    /** @private @const {!Promise} */
+    this.readyPromise_ = new Promise(resolve => {
+      this.readyResolver_ = resolve;
+    });
+
+    /** @private {?function((!ActivityResult|!Promise))} */
+    this.resultResolver_ = null;
+
+    /** @private @const {!Promise<!ActivityResult>} */
+    this.resultPromise_ = new Promise(resolve => {
+      this.resultResolver_ = resolve;
+    });
+
+    /** @private {?function(number)} */
+    this.onResizeRequest_ = null;
+
+    /** @private {?number} */
+    this.requestedHeight_ = null;
+
+    /** @private @const {!Messenger} */
+    this.messenger_ = new Messenger(
+        this.win_,
+        () => this.iframe_.contentWindow,
+        this.targetOrigin_,
+        /* requireTarget */ true);
+  }
+
+  /** @override */
+  getMode() {
+    return ActivityMode.IFRAME;
   }
 
   /**
-   * Signals back to the activity implementation that the client has updated
-   * the activity's size.
+   * Waits until the activity port is connected to the host.
+   * @return {!Promise}
    */
-  resized() {
-    this.iframePort_.resized();
+  connect() {
+    if (!isNodeConnected(this.iframe_)) {
+      throw new Error('iframe must be in DOM');
+    }
+    this.messenger_.connect(this.handleCommand_.bind(this));
+    this.iframe_.src = this.url_;
+    return this.connectedPromise_;
   }
-}
 
-class ActivityPorts$1 {
   /**
-   * @param {!../runtime/deps.DepsDef} deps
+   * Disconnect the activity binding and cleanup listeners.
    */
-  constructor(deps) {
-    /** @private @const {!../runtime/deps.DepsDef} */
-    this.deps_ = deps;
+  disconnect() {
+    this.connected_ = false;
+    this.messenger_.disconnect();
+  }
 
-    /** @private @const {!web-activities/activity-ports.ActivityPorts} */
-    this.activityPorts_ = new activityPorts_1(deps.win());
+  /** @override */
+  acceptResult() {
+    return this.resultPromise_;
   }
 
-  /**
-   * Adds client version, publication, product and logging context information.
-   * @param {?Object=} args
-   * @return {!Object}
-   */
-  addDefaultArguments(args) {
-    const deps = this.deps_;
-    const pageConfig = deps.pageConfig();
-    const context = deps.analytics().getContext();
-    return Object.assign(
-      {
-        'analyticsContext': context.toArray(),
-        'publicationId': pageConfig.getPublicationId(),
-        'productId': pageConfig.getProductId(),
-        '_client': 'SwG 0.1.22.84',
-      },
-      args || {}
-    );
+  /** @override */
+  getTargetWin() {
+    return this.iframe_.contentWindow || null;
   }
 
-  /*
-   * Start an activity within the specified iframe.
-   * @param {!HTMLIFrameElement} iframe
-   * @param {string} url
-   * @param {?Object=} args
-   * @return {!Promise<!ActivityIframePort>}
-   */
-  openActivityIframePort_(iframe, url, args) {
-    const activityPort = new ActivityIframePort$1(iframe, url, args);
-    return activityPort.connect().then(() => activityPort);
+  /** @override */
+  message(payload) {
+    this.messenger_.customMessage(payload);
   }
 
-  /**
-   * Start an activity within the specified iframe.
-   * @param {!HTMLIFrameElement} iframe
-   * @param {string} url
-   * @param {?Object=} args
-   * @param {boolean=} addDefaultArguments
-   * @return {!Promise<!ActivityIframePort>}
-   */
-  openIframe(iframe, url, args, addDefaultArguments = false) {
-    if (addDefaultArguments) {
-      args = this.addDefaultArguments(args);
-    }
-    return this.openActivityIframePort_(iframe, url, args);
+  /** @override */
+  onMessage(callback) {
+    this.messenger_.onCustomMessage(callback);
+  }
+
+  /** @override */
+  messageChannel(opt_name) {
+    return this.messenger_.askChannel(opt_name);
   }
 
   /**
-   * Start an activity in a separate window. The result will be delivered
-   * to the `onResult` callback.
-   *
-   * The activity can be opened in two modes: "popup" and "redirect". This
-   * depends on the `target` value, but also on the browser/environment.
-   *
-   * The allowed `target` values are `_blank`, `_top` and name targets. The
-   * `_self`, `_parent` and similar targets are not allowed.
-   *
-   * The `_top` target indicates that the activity should be opened as a
-   * "redirect", while other targets indicate that the activity should be
-   * opened as a popup. The activity client will try to honor the requested
-   * target. However, it's not always possible. Some environments do not
-   * allow popups and they either force redirect or fail the window open
-   * request. In this case, the activity will try to fallback to the "redirect"
-   * mode.
-   *
-   * @param {string} requestId
-   * @param {string} url
-   * @param {string} target
-   * @param {?Object=} args
-   * @param {?web-activities/activity-ports.ActivityOpenOptions=} options
-   * @param {boolean=} addDefaultArguments
-   * @return {{targetWin: ?Window}}
+   * Returns a promise that yields when the iframe is ready to be interacted
+   * with.
+   * @return {!Promise}
    */
-  open(requestId, url, target, args, options, addDefaultArguments = false) {
-    if (addDefaultArguments) {
-      args = this.addDefaultArguments(args);
-    }
-    return this.activityPorts_.open(requestId, url, target, args, options);
+  whenReady() {
+    return this.readyPromise_;
   }
 
   /**
-   * Registers the callback for the result of the activity opened with the
-   * specified `requestId` (see the `open()` method). The callback is a
-   * function that takes a single `ActivityPort` argument. The client
-   * can use this object to verify the port using it's origin, verified and
-   * secure channel flags. Then the client can call
-   * `ActivityPort.acceptResult()` method to accept the result.
-   *
-   * The activity result is handled via a separate callback because of a
-   * possible redirect. So use of direct callbacks and/or promises is not
-   * possible in that case.
-   *
-   * A typical implementation would look like:
-   * ```
-   * ports.onResult('request1', function(port) {
-   *   port.acceptResult().then(function(result) {
-   *     // Only verified origins are allowed.
-   *     if (result.origin == expectedOrigin &&
-   *         result.originVerified &&
-   *         result.secureChannel) {
-   *       handleResultForRequest1(result);
-   *     }
-   *   });
-   * })
-   *
-   * ports.open('request1', request1Url, '_blank');
-   * ```
-   *
-   * @param {string} requestId
-   * @param {function(!ActivityPortDef)} callback
+   * Register a callback to handle resize requests. Once successfully resized,
+   * ensure to call `resized()` method.
+   * @param {function(number)} callback
    */
-  onResult(requestId, callback) {
-    this.activityPorts_.onResult(requestId, port => {
-      callback(new ActivityPortDeprecated(port));
+  onResizeRequest(callback) {
+    this.onResizeRequest_ = callback;
+    Promise.resolve().then(() => {
+      if (this.requestedHeight_ != null) {
+        callback(this.requestedHeight_);
+      }
     });
   }
 
   /**
-   * @param {function(!Error)} handler
+   * Signals back to the activity implementation that the client has updated
+   * the activity's size.
    */
-  onRedirectError(handler) {
-    this.activityPorts_.onRedirectError(handler);
+  resized() {
+    if (!this.connected_) {
+      return;
+    }
+    const height = this.iframe_.offsetHeight;
+    this.messenger_.sendCommand('resized', {'height': height});
   }
 
   /**
-   * @return {!web-activities/activity-ports.ActivityPorts}
+   * @param {string} cmd
+   * @param {?Object} payload
+   * @private
    */
-  getOriginalWebActivityPorts() {
-    return this.activityPorts_;
+  handleCommand_(cmd, payload) {
+    if (cmd == 'connect') {
+      // First ever message. Indicates that the receiver is listening.
+      this.connected_ = true;
+      this.messenger_.sendStartCommand(this.args_);
+      this.connectedResolver_();
+    } else if (cmd == 'result') {
+      // The last message. Indicates that the result has been received.
+      if (this.resultResolver_) {
+        const code = /** @type {!ActivityResultCode} */ (payload['code']);
+        const data =
+            code == ActivityResultCode.FAILED ?
+            new Error(payload['data'] || '') :
+            payload['data'];
+        const result = new ActivityResult(
+            code,
+            data,
+            ActivityMode.IFRAME,
+            this.messenger_.getTargetOrigin(),
+            /* originVerified */ true,
+            /* secureChannel */ true);
+        resolveResult(this.win_, result, this.resultResolver_);
+        this.resultResolver_ = null;
+        this.messenger_.sendCommand('close');
+        this.disconnect();
+      }
+    } else if (cmd == 'ready') {
+      if (this.readyResolver_) {
+        this.readyResolver_();
+        this.readyResolver_ = null;
+      }
+    } else if (cmd == 'resize') {
+      this.requestedHeight_ = /** @type {number} */ (payload['height']);
+      if (this.onResizeRequest_) {
+        this.onResizeRequest_(this.requestedHeight_);
+      }
+    }
   }
 }
 
+
+
+
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
+ * The `ActivityPort` implementation for the standalone window activity
+ * client executed as a popup.
  *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @implements {ActivityPort}
+ * @implements {ActivityMessagingPort}
  */
+class ActivityWindowPort {
 
-/**
- * Debug logger, only log message if #swg.log=1
- * @param {...*} var_args [decription]
- */
+  /**
+   * @param {!Window} win
+   * @param {string} requestId
+   * @param {string} url
+   * @param {string} target
+   * @param {?Object=} opt_args
+   * @param {?ActivityOpenOptions=} opt_options
+   */
+  constructor(win, requestId, url, target, opt_args, opt_options) {
+    const isValidTarget =
+        target &&
+        (target == '_blank' || target == '_top' || target[0] != '_');
+    if (!isValidTarget) {
+      throw new Error('The only allowed targets are "_blank", "_top"' +
+          ' and name targets');
+    }
 
-/* eslint-disable */
+    /** @private @const {!Window} */
+    this.win_ = win;
+    /** @private @const {string} */
+    this.requestId_ = requestId;
+    /** @private @const {string} */
+    this.url_ = url;
+    /** @private @const {string} */
+    this.openTarget_ = target;
+    /** @private @const {?Object} */
+    this.args_ = opt_args || null;
+    /** @private @const {!ActivityOpenOptions} */
+    this.options_ = opt_options || {};
 
-function debugLog(var_args) {
-  if (/swg.debug=1/.test(self.location.hash)) {
-    const logArgs = Array.prototype.slice.call(arguments, 0);
-    logArgs.unshift('[Subscriptions]');
-    log.apply(log, logArgs);
+    /** @private {?function()} */
+    this.connectedResolver_ = null;
+
+    /** @private @const {!Promise} */
+    this.connectedPromise_ = new Promise(resolve => {
+      this.connectedResolver_ = resolve;
+    });
+
+    /** @private {?function((!ActivityResult|!Promise))} */
+    this.resultResolver_ = null;
+
+    /** @private @const {!Promise<!ActivityResult>} */
+    this.resultPromise_ = new Promise(resolve => {
+      this.resultResolver_ = resolve;
+    });
+
+    /** @private {?Window} */
+    this.targetWin_ = null;
+
+    /** @private {?number} */
+    this.heartbeatInterval_ = null;
+
+    /** @private {?Messenger} */
+    this.messenger_ = null;
   }
-}
 
-/**
- * @param  {...*} var_args [description]
- */
-function log(var_args) {
-  console.log.apply(console, arguments);
-}
+  /** @override */
+  getMode() {
+    return this.openTarget_ == '_top' ?
+        ActivityMode.REDIRECT :
+        ActivityMode.POPUP;
+  }
 
-/**
- * @param  {...*} var_args [description]
- */
-function warn(var_args) {
-  console.warn.apply(console, arguments);
-}
+  /**
+   * Opens the activity in a window, either as a popup or via redirect.
+   *
+   * Returns the promise that will yield when the window returns or closed.
+   * Notice, that this promise may never complete if "redirect" mode was used.
+   *
+   * @return {!Promise}
+   */
+  open() {
+    return this.openInternal_();
+  }
 
-/**
- * Throws an error if the first argument isn't trueish.
- *
- * Supports argument substitution into the message via %s placeholders.
- *
- * Throws an error object that has two extra properties:
- * - associatedElement: This is the first element provided in the var args.
- *   It can be used for improved display of error messages.
- * - messageArray: The elements of the substituted message as non-stringified
- *   elements in an array. When e.g. passed to console.error this yields
- *   native displays of things like HTML elements.
- *
- * @param {T} shouldBeTrueish The value to assert. The assert fails if it does
- *     not evaluate to true.
- * @param {string=} message The assertion message
- * @param {...*} var_args Arguments substituted into %s in the message.
- * @return {T} The value of shouldBeTrueish.
- * @template T
- */
-function assert(shouldBeTrueish, message, var_args) {
-  let firstElement;
-  if (!shouldBeTrueish) {
-    message = message || 'Assertion failed';
-    const splitMessage = message.split('%s');
-    const first = splitMessage.shift();
-    let formatted = first;
-    const messageArray = [];
-    pushIfNonEmpty(messageArray, first);
-    for (let i = 2; i < arguments.length; i++) {
-      const val = arguments[i];
-      if (val && val.tagName) {
-        firstElement = val;
+  /**
+   * Waits until the activity port is connected to the host.
+   * @return {!Promise}
+   */
+  whenConnected() {
+    return this.connectedPromise_;
+  }
+
+  /**
+   * Disconnect the activity binding and cleanup listeners.
+   */
+  disconnect() {
+    if (this.heartbeatInterval_) {
+      this.win_.clearInterval(this.heartbeatInterval_);
+      this.heartbeatInterval_ = null;
+    }
+    if (this.messenger_) {
+      this.messenger_.disconnect();
+      this.messenger_ = null;
+    }
+    if (this.targetWin_) {
+      // Try to close the popup window. The host will also try to do the same.
+      try {
+        this.targetWin_.close();
+      } catch (e) {
+        // Ignore.
       }
-      const nextConstant = splitMessage.shift();
-      messageArray.push(val);
-      pushIfNonEmpty(messageArray, nextConstant.trim());
-      formatted += toString(val) + nextConstant;
+      this.targetWin_ = null;
     }
-    const e = new Error(formatted);
-    e.fromAssert = true;
-    e.associatedElement = firstElement;
-    e.messageArray = messageArray;
-    throw e;
+    this.resultResolver_ = null;
   }
-  return shouldBeTrueish;
-}
 
-/**
- * @param {!Array} array
- * @param {*} val
- */
-function pushIfNonEmpty(array, val) {
-  if (val != '') {
-    array.push(val);
+  /** @override */
+  getTargetWin() {
+    return this.targetWin_;
   }
-}
 
-function toString(val) {
-  // Do check equivalent to `val instanceof Element` without cross-window bug
-  if (val && val.nodeType == 1) {
-    return val.tagName.toLowerCase() + (val.id ? '#' + val.id : '');
+  /** @override */
+  acceptResult() {
+    return this.resultPromise_;
   }
-  return /** @type {string} */ (val);
-}
 
-var log_1 = {
-  assert,
-  debugLog,
-  warn,
-  log
-};
-var log_2 = log_1.assert;
-var log_4 = log_1.warn;
-var log_5 = log_1.log;
+  /**
+   * Sends a message to the host.
+   * Whether the host can or cannot receive a message depends on the type of
+   * host and its state. Ensure that the code has an alternative path if
+   * messaging is not available.
+   * @override
+   */
+  message(payload) {
+    this.messenger_.customMessage(payload);
+  }
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+  /**
+   * Registers a callback to receive messages from the host.
+   * Whether the host can or cannot receive a message depends on the type of
+   * host and its state. Ensure that the code has an alternative path if
+   * messaging is not available.
+   * @override
+   */
+  onMessage(callback) {
+    this.messenger_.onCustomMessage(callback);
+  }
 
-/**
- * Returns a map-like object.
- * If initial is provided, copies its own properties into the
- * newly created object.
- * @param {Object=} initial This should typically be an object literal.
- * @return {!Object}
- * @template T
- */
-function map(initial) {
-  const obj = Object.create(null);
-  if (initial) {
-    Object.assign(obj, initial);
+  /**
+   * Creates a new communication channel or returns an existing one.
+   * Whether the host can or cannot receive a message depends on the type of
+   * host and its state. Ensure that the code has an alternative path if
+   * messaging is not available.
+   * @override
+   */
+  messageChannel(opt_name) {
+    return this.messenger_.askChannel(opt_name);
   }
-  return obj;
-}
 
-/**
- * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+  /**
+   * This method wraps around window's open method. It first tries to execute
+   * `open` call with the provided target and if it fails, it retries the call
+   * with the `_top` target. This is necessary given that in some embedding
+   * scenarios, such as iOS' WKWebView, navigation to `_blank` and other targets
+   * is blocked by default.
+   * @return {!Promise}
+   * @private
+   */
+  openInternal_() {
+    const featuresStr = this.buildFeatures_();
 
-/**
- * Returns an array of random values.  The length of the array is numInts.  Each
- * int will be >= 0 and < maxVal.
- * @param {!number} numInts
- * @param {!number} maxVal
- */
-function getRandomInts(numInts, maxVal) {
-  // Ensure array type is appropriate for the max value (performance)
-  const arr =
-    maxVal < 256
-      ? new Uint8Array(numInts)
-      : maxVal < 32768
-      ? new Uint16Array(numInts)
-      : new Uint32Array(numInts);
+    // Protectively, the URL will contain the request payload, unless explicitly
+    // directed not to via `skipRequestInUrl` option.
+    let url = this.url_;
+    if (!this.options_.skipRequestInUrl) {
+      const returnUrl =
+          this.options_.returnUrl ||
+          removeFragment(this.win_.location.href);
+      const requestString = serializeRequest({
+        requestId: this.requestId_,
+        returnUrl,
+        args: this.args_,
+      });
+      url = addFragmentParam(url, '__WA__', requestString);
+    }
 
-  if (crypto && crypto.getRandomValues) {
-    crypto.getRandomValues(arr);
-    for (let i = arr.length - 1; i > -1; i--) {
-      arr[i] = arr[i] % maxVal;
+    // Open the window.
+    let targetWin;
+    let openTarget = this.openTarget_;
+    // IE does not support CORS popups - the popup has to fallback to redirect
+    // mode.
+    if (openTarget != '_top') {
+      if (isIeBrowser(this.win_)) {
+        openTarget = '_top';
+      }
     }
-  } else {
-    // For older browsers
-    for (let i = arr.length - 1; i > -1; i--) {
-      arr[i] = Math.floor(Math.random() * maxVal);
+    // Try first with the specified target. If we're inside the WKWebView or
+    // a similar environments, this method is expected to fail by default for
+    // all targets except `_top`.
+    try {
+      targetWin = this.win_.open(url, openTarget, featuresStr);
+    } catch (e) {
+      // Ignore.
+    }
+    // Then try with `_top` target.
+    if (!targetWin &&
+        openTarget != '_top' &&
+        !this.options_.disableRedirectFallback) {
+      openTarget = '_top';
+      try {
+        targetWin = this.win_.open(url, openTarget);
+      } catch (e) {
+        // Ignore.
+      }
     }
-  }
-
-  return arr;
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-const CHARS = '0123456789ABCDEF';
-
-/**
- * Polyfill for String.prototype.startsWith.
- * @param {string} string
- * @param {string} prefix
- * @return {boolean}
- */
-function startsWith(string, prefix) {
-  if (prefix.length > string.length) {
-    return false;
-  }
-  return string.lastIndexOf(prefix, 0) == 0;
-}
-
-/**
- * Ensures the passed value is safe to use for character 19 per rfc4122,
- * sec. 4.1.5.  "Sets the high bits of clock sequence".
- * @param {!number} v
- */
-function getChar19(v) {
-  return CHARS[(v & 0x3) | 0x8];
-}
-
-/**
- * The returned identifier will always be an 8 digit valid hexidecimal number
- * and will be unique for each MS within a given month.
- * @return {string}
- */
-function getMonthlyTimeIdentifier() {
-  const hexTime = Date.now().toString(16);
-  return hexTime.substring(hexTime.length - 8).toUpperCase();
-}
 
-/**
- * Generates a RFC 4122 V4 UUID. Ex: "92329D39-6F5C-4520-ABFC-AAB64544E172"
- * The first 8 digits are unique for the millisecond of the month.  The rest
- * are randomly generated.
- */
-function getUuid() {
-  let uuid = getMonthlyTimeIdentifier() + '-';
-  let rIndex = 0;
-  const rands = getRandomInts(23, 16);
-  for (let i = 9; i < 36; i++) {
-    switch (i) {
-      case 13:
-      case 18:
-      case 23:
-        uuid += '-';
-        break;
-      case 14:
-        uuid += '4';
-        break;
-      case 19:
-        uuid += getChar19(rands[rIndex++]);
-        break;
-      default:
-        uuid += CHARS[rands[rIndex++]];
-        break;
+    // Setup the target window.
+    if (targetWin) {
+      this.targetWin_ = targetWin;
+      if (openTarget != '_top') {
+        this.setupPopup_();
+      }
+    } else {
+      this.disconnectWithError_(new Error('failed to open window'));
     }
+
+    // Return result promise, even though it may never complete.
+    return this.resultPromise_.catch(() => {
+      // Ignore. Call to the `acceptResult()` should fail if needed.
+    });
   }
-  return uuid;
-}
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/** @type {Object<string, string>} */
-let propertyNameCache;
-
-/** @const {!Array<string>} */
-const vendorPrefixes = ['Webkit', 'webkit', 'Moz', 'moz', 'ms', 'O', 'o'];
-
-/**
- * Default styles to be set for top level friendly iframe.
- * Some attributes are not included such as height, left, margin-left; since
- * these attributes are updated by @media queries and having these values
- * defined here as !important does not work on IE/edge browsers.
- * @const {!Object<string, string|number>}
- */
-const defaultStyles = {
-  'align-content': 'normal',
-  'animation': 'none',
-  'align-items': 'normal',
-  'align-self': 'auto',
-  'alignment-baseline': 'auto',
-  'backface-visibility': 'hidden',
-  'background-clip': 'border-box',
-  'background-image': 'none',
-  'baseline-shift': '0',
-  'block-size': 'auto',
-  'border': 'none',
-  'border-collapse': 'separate',
-  'bottom': '0',
-  'box-sizing': 'border-box',
-  'break-after': 'auto',
-  'break-before': 'auto',
-  'break-inside': 'auto',
-  'buffered-rendering': 'auto',
-  'caption-side': 'top',
-  'caret-color': 'rgb(51, 51, 51)',
-  'clear': 'none',
-  'color': 'rgb(51, 51, 51)',
-  'color-rendering': 'auto',
-  'column-count': 'auto',
-  'column-fill': 'balance',
-  'column-gap': 'normal',
-  'column-rule-color': 'rgb(51, 51, 51)',
-  'column-rule-style': 'none',
-  'column-rule-width': '0',
-  'column-span': 'none',
-  'column-width': 'auto',
-  'contain': 'none',
-  'counter-increment': 'none',
-  'counter-reset': 'none',
-  'cursor': 'auto',
-  'direction': 'inherit',
-  'display': 'block',
-  'empty-cells': 'show',
-  'filter': 'none',
-  'flex': 'none', // flex-grow, flex-shrink, and flex-basis.
-  'flex-flow': 'row nowrap', // flex-direction, flex-wrap.
-  'float': 'none',
-  'flood-color': 'rgb(0, 0, 0)',
-  'flood-opacity': '1',
-  'font': 'none',
-  'font-size': 'medium',
-  'font-family': '',
-  'height': 'auto',
-  'hyphens': 'manual',
-  'image-rendering': 'auto',
-  'inline-size': '', // Setting to 'auto' will not allow override.
-  'isolation': 'auto',
-  'justify-content': 'normal',
-  'justify-items': 'normal',
-  'justify-self': 'auto',
-  'letter-spacing': 'normal',
-  'lighting-color': 'rgb(255, 255, 255)',
-  'line-break': 'auto',
-  'line-height': 'normal',
-  'mask': 'none',
-  'max-block-size': 'none',
-  'max-height': 'none',
-  'max-inline-size': 'none',
-  'max-width': 'none',
-  'min-block-size': 'none',
-  'min-height': '0',
-  'min-inline-size': '0',
-  'min-width': '0',
-  'mix-blend-mode': 'normal',
-  'object-fit': 'fill', // Important for Safari browser.
-  'offset-distance': 'none', // Chrome only (Experimental).
-  'offset-path': 'none', // Chrome only (Experimental).
-  'offset-rotate': 'auto 0deg', // Chrome only (Experimental).
-  'opacity': '1',
-  'order': '0',
-  'orphans': '2',
-  'outline': 'none',
-  'overflow-anchor': 'auto',
-  'overflow-wrap': 'normal',
-  'overflow': 'visible',
-  'padding': '0',
-  'page': '',
-  'perspective': 'none',
-  'pointer-events': 'auto',
-  'position': 'static',
-  'quotes': '',
-  'resize': 'none',
-  'right': '0',
-  'scroll-behavior': 'auto',
-  'tab-size': '8', // Only Chrome, Safari (Experimental).
-  'table-layout': 'auto',
-  'text-align': 'start',
-  'text-align-last': 'auto',
-  'text-anchor': 'start',
-  'text-combine-upright': 'none',
-  'text-decoration': 'none',
-  'text-indent': '0',
-  'text-orientation': 'mixed',
-  'text-overflow': 'clip',
-  'text-rendering': 'auto',
-  'text-shadow': 'none',
-  'text-size-adjust': 'auto',
-  'text-transform': 'none',
-  'text-underline-position': 'auto',
-  'top': 'auto',
-  'touch-action': 'auto',
-  'transform': 'none',
-  'transition': 'none 0s ease 0s',
-  'unicode-bidi': 'normal',
-  'user-select': 'auto',
-  'vector-effect': 'none',
-  'vertical-align': 'baseline',
-  'visibility': 'visible',
-  'white-space': 'normal',
-  'widows': '2',
-  'word-break': 'normal',
-  'word-spacing': '0',
-  'word-wrap': 'normal',
-  'writing-mode': 'horizontal-tb',
-  'zoom': '1',
-  'z-index': 'auto',
-};
-
-/**
- * @export
- * @param {string} camelCase camel cased string
- * @return {string} title cased string
- */
-function camelCaseToTitleCase(camelCase) {
-  return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
-}
-
-/**
- * Checks the style if a prefixed version of a property exists and returns
- * it or returns an empty string.
- * @private
- * @param {!Object} style
- * @param {string} titleCase the title case version of a css property name
- * @return {string} the prefixed property name or null.
- */
-function getVendorJsPropertyName_(style, titleCase) {
-  for (let i = 0; i < vendorPrefixes.length; i++) {
-    const propertyName = vendorPrefixes[i] + titleCase;
-    if (style[propertyName] !== undefined) {
-      return propertyName;
+  /**
+   * @return {string}
+   * @private
+   */
+  buildFeatures_() {
+    // The max width and heights are calculated as following:
+    // MaxSize = AvailSize - ControlsSize
+    // ControlsSize = OuterSize - InnerSize
+    const screen = this.win_.screen;
+    const availWidth = screen.availWidth || screen.width;
+    const availHeight = screen.availHeight || screen.height;
+    const isTop = this.isTopWindow_();
+    const isEdge = isEdgeBrowser(this.win_);
+    // Limit controls to 100px width and height. Notice that it's only
+    // possible to calculate controls size in the top window, not in iframes.
+    // Notice that the Edge behavior is somewhat unique. If we can't find the
+    // right width/height, it will launch in the full-screen. Other browsers
+    // deal with such cases more gracefully.
+    const controlsWidth =
+        isTop && this.win_.outerWidth > this.win_.innerWidth ?
+        Math.min(100, this.win_.outerWidth - this.win_.innerWidth) :
+        (isEdge ? 100 : 0);
+    const controlsHeight =
+        isTop && this.win_.outerHeight > this.win_.innerHeight ?
+        Math.min(100, this.win_.outerHeight - this.win_.innerHeight) :
+        (isEdge ? 100 : 0);
+    // With all the adjustments, at least 50% of the available width/height
+    // should be made available to a popup.
+    const maxWidth = Math.max(availWidth - controlsWidth, availWidth * 0.5);
+    const maxHeight = Math.max(availHeight - controlsHeight, availHeight * 0.5);
+    let w = Math.floor(Math.min(600, maxWidth * 0.9));
+    let h = Math.floor(Math.min(600, maxHeight * 0.9));
+    if (this.options_.width) {
+      w = Math.min(this.options_.width, maxWidth);
     }
-  }
-  return '';
-}
-
-/**
- * Returns the possibly prefixed JavaScript property name of a style property
- * (ex. WebkitTransitionDuration) given a camelCase'd version of the property
- * (ex. transitionDuration).
- * @export
- * @param {!Object} style
- * @param {string} camelCase the camel cased version of a css property name
- * @param {boolean=} bypassCache bypass the memoized cache of property
- *   mapping
- * @return {string}
- */
-function getVendorJsPropertyName(style, camelCase, bypassCache) {
-  if (startsWith(camelCase, '--')) {
-    // CSS vars are returned as is.
-    return camelCase;
-  }
-  if (!propertyNameCache) {
-    propertyNameCache = map();
-  }
-  let propertyName = propertyNameCache[camelCase];
-  if (!propertyName || bypassCache) {
-    propertyName = camelCase;
-    if (style[camelCase] === undefined) {
-      const titleCase = camelCaseToTitleCase(camelCase);
-      const prefixedPropertyName = getVendorJsPropertyName_(style, titleCase);
-
-      if (style[prefixedPropertyName] !== undefined) {
-        propertyName = prefixedPropertyName;
-      }
+    if (this.options_.height) {
+      h = Math.min(this.options_.height, maxHeight);
     }
-    if (!bypassCache) {
-      propertyNameCache[camelCase] = propertyName;
+    const x = Math.floor((screen.width - w) / 2);
+    const y = Math.floor((screen.height - h) / 2);
+    const features = {
+      'height': h,
+      'width': w,
+      'resizable': 'yes',
+      'scrollbars': 'yes',
+    };
+    // Do not set left/top in Edge: it fails.
+    if (!isEdge) {
+      features['left'] = x;
+      features['top'] = y;
     }
-  }
-  return propertyName;
-}
-
-/**
- * Sets the CSS styles of the specified element with !important. The styles
- * are specified as a map from CSS property names to their values.
- * @param {!Element} element
- * @param {!Object<string, string|number>} styles
- */
-function setImportantStyles(element, styles) {
-  for (const k in styles) {
-    element.style.setProperty(
-      getVendorJsPropertyName(styles, k),
-      styles[k].toString(),
-      'important'
-    );
-  }
-}
-
-/**
- * Sets the CSS style of the specified element with optional units, e.g. "px".
- * @param {Element} element
- * @param {string} property
- * @param {?string|number|boolean} value
- * @param {string=} units
- * @param {boolean=} bypassCache
- */
-function setStyle(element, property, value, units, bypassCache) {
-  const propertyName = getVendorJsPropertyName(
-    element.style,
-    property,
-    bypassCache
-  );
-  if (propertyName) {
-    element.style[propertyName] = /** @type {string} */ (units
-      ? value + units
-      : value);
-  }
-}
-
-/**
- * Sets the CSS styles of the specified element. The styles
- * a specified as a map from CSS property names to their values.
- * @param {!Element} element
- * @param {!Object<string, ?string|number|boolean>} styles
- */
-function setStyles(element, styles) {
-  for (const k in styles) {
-    setStyle(element, k, styles[k]);
-  }
-}
-
-/**
- * Resets styles that were set dynamically (i.e. inline)
- * @param {!Element} element
- * @param {!Array<string>} properties
- */
-function resetStyles(element, properties) {
-  const styleObj = {};
-  properties.forEach(prop => {
-    styleObj[prop] = null;
-  });
-  setStyles(element, styleObj);
-}
-
-/**
- * Resets all the styles of an element to a given value. Defaults to null.
- * The valid values are 'inherit', 'initial', 'unset' or null.
- * @param {!Element} element
- */
-function resetAllStyles(element) {
-  setImportantStyles(element, defaultStyles);
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+    let featuresStr = '';
+    for (const f in features) {
+      if (featuresStr) {
+        featuresStr += ',';
+      }
+      featuresStr += `${f}=${features[f]}`;
+    }
+    return featuresStr;
+  }
 
-/** @const {string} */
-const styleType = 'text/css';
+  /**
+   * This method only exists to make iframe/top emulation possible in tests.
+   * Otherwise `window.top` cannot be overridden.
+   * @return {boolean}
+   * @private
+   */
+  isTopWindow_() {
+    return this.win_ == this.win_.top;
+  }
 
-/**
- * Add attributes to an element.
- * @param {!Element} element
- * @param {!Object<string, string|number|boolean|!Object<string, string|number|boolean>>} attributes
- * @return {!Element} updated element.
- */
-function addAttributesToElement(element, attributes) {
-  for (const attr in attributes) {
-    if (attr == 'style') {
-      setStyles(
-        element,
-        /** @type {!Object<string, string|boolean|number>} */
-        (attributes[attr])
-      );
-    } else {
-      element.setAttribute(
-        attr,
-        /** @type {string|boolean|number} */ (attributes[attr])
-      );
-    }
+  /** @private */
+  setupPopup_() {
+    // Keep alive to catch the window closing, which would indicate
+    // "cancel" signal.
+    this.heartbeatInterval_ = this.win_.setInterval(() => {
+      this.check_(/* delayCancel */ true);
+    }, 500);
+
+    // Start up messaging. The messaging is explicitly allowed to proceed
+    // without origin check b/c all arguments have already been passed in
+    // the URL and special handling is enforced when result is delivered.
+    this.messenger_ = new Messenger(
+        this.win_,
+        /** @type {!Window} */ (this.targetWin_),
+        /* targetOrigin */ null,
+        /* requireTarget */ true);
+    this.messenger_.connect(this.handleCommand_.bind(this));
   }
-  return element;
-}
 
-/**
- * Create a new element on document with specified tagName and attributes.
- * @param {!Document} doc
- * @param {string} tagName
- * @param {!Object<string, string>} attributes
- * @param {?(string|!Node|!ArrayLike<!Node>|!Array<!Node>)=} content
- * @return {!Element} created element.
- */
-function createElement(doc, tagName, attributes, content) {
-  const element = doc.createElement(tagName);
-  addAttributesToElement(element, attributes);
-  if (content != null) {
-    if (typeof content == 'string') {
-      element.textContent = content;
-    } else if (content.nodeType) {
-      element.appendChild(content);
-    } else if ('length' in content) {
-      for (let i = 0; i < content.length; i++) {
-        element.appendChild(content[i]);
+  /**
+   * @param {boolean=} opt_delayCancel
+   * @private
+   */
+  check_(opt_delayCancel) {
+    if (!this.targetWin_ || this.targetWin_.closed) {
+      if (this.heartbeatInterval_) {
+        this.win_.clearInterval(this.heartbeatInterval_);
+        this.heartbeatInterval_ = null;
       }
-    } else {
-      log_2(false, 'Unsupported content: %s', content);
+      // Give a chance for the result to arrive, but otherwise consider the
+      // responce to be empty.
+      this.win_.setTimeout(() => {
+        try {
+          this.result_(ActivityResultCode.CANCELED, /* data */ null);
+        } catch (e) {
+          this.disconnectWithError_(e);
+        }
+      }, opt_delayCancel ? 3000 : 0);
     }
   }
-  return element;
-}
 
-/**
- * Removes the element.
- * @param {!Element} element
- */
-function removeElement(element) {
-  if (element.parentElement) {
-    element.parentElement.removeChild(element);
+  /**
+   * @param {!Error} reason
+   * @private
+   */
+  disconnectWithError_(reason) {
+    if (this.resultResolver_) {
+      this.resultResolver_(Promise.reject(reason));
+    }
+    this.disconnect();
   }
-}
 
-/**
- * Removes all children from the parent element.
- * @param {!Element} parent
- */
-function removeChildren(parent) {
-  parent.textContent = '';
-}
-
-/**
- * Injects the provided styles in the HEAD section of the document.
- * @param {!../model/doc.Doc} doc The document object.
- * @param {string} styleText The style string.
- * @return {!Element}
- */
-function injectStyleSheet(doc, styleText) {
-  const styleElement = createElement(doc.getWin().document, 'style', {
-    'type': styleType,
-  });
-  styleElement.textContent = styleText;
-  doc.getHead().appendChild(styleElement);
-  return styleElement;
-}
+  /**
+   * @param {!ActivityResultCode} code
+   * @param {*} data
+   * @private
+   */
+  result_(code, data) {
+    if (this.resultResolver_) {
+      const isConnected = this.messenger_.isConnected();
+      const result = new ActivityResult(
+          code,
+          data,
+          ActivityMode.POPUP,
+          isConnected ?
+              this.messenger_.getTargetOrigin() :
+              getOriginFromUrl(this.url_),
+          /* originVerified */ isConnected,
+          /* secureChannel */ isConnected);
+      resolveResult(this.win_, result, this.resultResolver_);
+      this.resultResolver_ = null;
+    }
+    if (this.messenger_) {
+      this.messenger_.sendCommand('close');
+    }
+    this.disconnect();
+  }
 
-/**
- * Polyfill of the `Node.isConnected` API. See
- * https://developer.mozilla.org/en-US/docs/Web/API/Node/isConnected.
- * @param {!Node} node
- * @return {boolean}
- */
-function isConnected(node) {
-  // Ensure that node is attached if specified. This check uses a new and
-  // fast `isConnected` API and thus only checked on platforms that have it.
-  // See https://www.chromestatus.com/feature/5676110549352448.
-  if ('isConnected' in node) {
-    return node['isConnected'];
+  /**
+   * @param {string} cmd
+   * @param {?Object} payload
+   * @private
+   */
+  handleCommand_(cmd, payload) {
+    if (cmd == 'connect') {
+      // First ever message. Indicates that the receiver is listening.
+      this.messenger_.sendStartCommand(this.args_);
+      this.connectedResolver_();
+    } else if (cmd == 'result') {
+      // The last message. Indicates that the result has been received.
+      const code = /** @type {!ActivityResultCode} */ (payload['code']);
+      const data =
+          code == ActivityResultCode.FAILED ?
+          new Error(payload['data'] || '') :
+          payload['data'];
+      this.result_(code, data);
+    } else if (cmd == 'check') {
+      this.win_.setTimeout(() => this.check_(), 200);
+    }
   }
-  // Polyfill.
-  const root = node.ownerDocument && node.ownerDocument.documentElement;
-  return (root && root.contains(node)) || false;
 }
 
-/**
- * @param {!Window} win
- * @return {boolean}
- */
-function isEdgeBrowser$1(win) {
-  const nav = win.navigator;
-  return /Edge/i.test(nav && nav.userAgent);
-}
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @param {!Window} win
+ * @param {string} fragment
+ * @param {string} requestId
+ * @return {?ActivityPort}
  */
+function discoverRedirectPort(win, fragment, requestId) {
+  // Try to find the result in the fragment.
+  const paramName = '__WA_RES__';
+  const fragmentParam = getQueryParam(fragment, paramName);
+  if (!fragmentParam) {
+    return null;
+  }
+  const response = /** @type {?Object} */ (JSON.parse(fragmentParam));
+  if (!response || response['requestId'] != requestId) {
+    return null;
+  }
 
-/**
- * @param {!Object<string, string>} map
- * @param {?string|?Element} langOrElement
- * @return {?string}
- */
-function msg(map, langOrElement) {
-  const lang = !langOrElement
-    ? ''
-    : typeof langOrElement == 'string'
-    ? langOrElement
-    : langOrElement.lang ||
-      (langOrElement.ownerDocument &&
-        langOrElement.ownerDocument.documentElement.lang);
-  let search = ((lang && lang.toLowerCase()) || 'en').replace(/_/g, '-');
-  while (search) {
-    if (search in map) {
-      return map[search];
+  // Remove the found param from the fragment.
+  const cleanFragment = removeQueryParam(win.location.hash, paramName) || '';
+  if (cleanFragment != win.location.hash) {
+    if (win.history && win.history.replaceState) {
+      try {
+        win.history.replaceState(win.history.state, '', cleanFragment);
+      } catch (e) {
+        // Ignore.
+      }
     }
-    const dash = search.lastIndexOf('-');
-    search = dash != -1 ? search.substring(0, dash) : '';
   }
-  // "en" is always default.
-  return map['en'];
+
+  const code = response['code'];
+  const data = response['data'];
+  const origin = response['origin'];
+  const referrerOrigin = win.document.referrer &&
+      getOriginFromUrl(win.document.referrer);
+  const originVerified = origin == referrerOrigin;
+  return new ActivityWindowRedirectPort(
+      win,
+      code,
+      data,
+      origin,
+      originVerified);
 }
 
+
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
+ * The `ActivityPort` implementation for the standalone window activity
+ * client executed as a popup.
  *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @implements {ActivityPort}
  */
+class ActivityWindowRedirectPort {
 
-/* @const */
-const toString_ = Object.prototype.toString;
-
-/**
- * Returns the ECMA [[Class]] of a value
- * @param {*} value
- * @return {string}
- */
-function toString$1(value) {
-  return toString_.call(value);
-}
+  /**
+   * @param {!Window} win
+   * @param {!ActivityResultCode} code
+   * @param {*} data
+   * @param {string} targetOrigin
+   * @param {boolean} targetOriginVerified
+   */
+  constructor(win, code, data, targetOrigin, targetOriginVerified) {
+    /** @private @const {!Window} */
+    this.win_ = win;
+    /** @private @const {!ActivityResultCode} */
+    this.code_ = code;
+    /** @private @const {*} */
+    this.data_ = data;
+    /** @private {string} */
+    this.targetOrigin_ = targetOrigin;
+    /** @private {boolean} */
+    this.targetOriginVerified_ = targetOriginVerified;
+  }
 
-/**
- * Determines if value is actually an Object.
- * @param {*} value
- * @return {boolean}
- */
-function isObject(value) {
-  return toString$1(value) === '[object Object]';
-}
+  /** @override */
+  getMode() {
+    return ActivityMode.REDIRECT;
+  }
 
-/**
- * Checks whether `s` is a valid value of `enumObj`.
- *
- * @param {!Object<T>} enumObj
- * @param {T} s
- * @return {boolean}
- * @template T
- */
-function isEnumValue(enumObj, s) {
-  for (const k in enumObj) {
-    if (enumObj[k] === s) {
-      return true;
-    }
+  /** @override */
+  acceptResult() {
+    const result = new ActivityResult(
+        this.code_,
+        this.data_,
+        ActivityMode.REDIRECT,
+        this.targetOrigin_,
+        this.targetOriginVerified_,
+        /* secureChannel */ false);
+    return new Promise(resolve => {
+      resolveResult(this.win_, result, resolve);
+    });
   }
-  return false;
 }
 
-/**
- * True if the value is a function.
- * @param {*} value
- */
-function isFunction(value) {
-  return value !== null && typeof value === 'function';
-}
 
-/**
- * True if the value is either true or false.
- * @param {?*} value
- */
-function isBoolean(value) {
-  return value === true || value === false;
-}
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
 
 /**
- * Cached a-tag to avoid memory allocation during URL parsing.
- * @type {HTMLAnchorElement}
+ * The page-level activities manager ports. This class is intended to be used
+ * as a singleton. It can start activities of all modes: iframe, popup, and
+ * redirect.
  */
-let a;
+class ActivityPorts {
 
-/**
- * We cached all parsed URLs. As of now there are no use cases
- * of AMP docs that would ever parse an actual large number of URLs,
- * but we often parse the same one over and over again.
- * @type {Object<string, !LocationDef>}
- */
-let cache;
+  /**
+   * @param {!Window} win
+   */
+  constructor(win) {
+    /** @const {string} */
+    this.version = '1.24';
 
-/**
- * Returns a Location-like object for the given URL. If it is relative,
- * the URL gets resolved.
- * Consider the returned object immutable. This is enforced during
- * testing by freezing the object.
- * @param {string} url
- * @return {!LocationDef}
- */
-function parseUrl$1(url) {
-  if (!a) {
-    a = /** @type {!HTMLAnchorElement} */ (self.document.createElement('a'));
-    cache = self.UrlCache || (self.UrlCache = Object.create(null));
+    /** @private @const {!Window} */
+    this.win_ = win;
+
+    /** @private @const {string} */
+    this.fragment_ = win.location.hash;
+
+    /**
+     * @private @const {!Object<string, !Array<function(!ActivityPort)>>}
+     */
+    this.requestHandlers_ = {};
+
+    /**
+     * The result buffer is indexed by `requestId`.
+     * @private @const {!Object<string, !ActivityPort>}
+     */
+    this.resultBuffer_ = {};
+
+    /** @private {?function(!Error)} */
+    this.redirectErrorResolver_ = null;
+
+    /** @private {!Promise<!Error>} */
+    this.redirectErrorPromise_ = new Promise(resolve => {
+      this.redirectErrorResolver_ = resolve;
+    });
+  }
+
+  /**
+   * Start an activity within the specified iframe.
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} url
+   * @param {?Object=} opt_args
+   * @return {!Promise<!ActivityIframePort>}
+   */
+  openIframe(iframe, url, opt_args) {
+    const port = new ActivityIframePort(iframe, url, opt_args);
+    return port.connect().then(() => port);
+  }
+
+  /**
+   * Start an activity in a separate window. The result will be delivered
+   * to the `onResult` callback.
+   *
+   * The activity can be opened in two modes: "popup" and "redirect". This
+   * depends on the `target` value, but also on the browser/environment.
+   *
+   * The allowed `target` values are `_blank`, `_top` and name targets. The
+   * `_self`, `_parent` and similar targets are not allowed.
+   *
+   * The `_top` target indicates that the activity should be opened as a
+   * "redirect", while other targets indicate that the activity should be
+   * opened as a popup. The activity client will try to honor the requested
+   * target. However, it's not always possible. Some environments do not
+   * allow popups and they either force redirect or fail the window open
+   * request. In this case, the activity will try to fallback to the "redirect"
+   * mode.
+   *
+   * @param {string} requestId
+   * @param {string} url
+   * @param {string} target
+   * @param {?Object=} opt_args
+   * @param {?ActivityOpenOptions=} opt_options
+   * @return {{targetWin: ?Window}}
+   */
+  open(requestId, url, target, opt_args, opt_options) {
+    const port = this.openWin_(requestId, url, target, opt_args, opt_options);
+    return {targetWin: port.getTargetWin()};
+  }
+
+  /**
+   * Start an activity in a separate window and tries to setup messaging with
+   * this window.
+   *
+   * See `open()` method for more details, including `onResult` callback.
+   *
+   * @param {string} requestId
+   * @param {string} url
+   * @param {string} target
+   * @param {?Object=} opt_args
+   * @param {?ActivityOpenOptions=} opt_options
+   * @return {!Promise<!ActivityMessagingPort>}
+   */
+  openWithMessaging(requestId, url, target, opt_args, opt_options) {
+    const port = this.openWin_(requestId, url, target, opt_args, opt_options);
+    return port.whenConnected().then(() => port);
   }
 
-  const fromCache = cache[url];
-  if (fromCache) {
-    return fromCache;
+  /**
+   * Registers the callback for the result of the activity opened with the
+   * specified `requestId` (see the `open()` method). The callback is a
+   * function that takes a single `ActivityPort` argument. The client
+   * can use this object to verify the port using it's origin, verified and
+   * secure channel flags. Then the client can call
+   * `ActivityPort.acceptResult()` method to accept the result.
+   *
+   * The activity result is handled via a separate callback because of a
+   * possible redirect. So use of direct callbacks and/or promises is not
+   * possible in that case.
+   *
+   * A typical implementation would look like:
+   * ```
+   * ports.onResult('request1', function(port) {
+   *   port.acceptResult().then(function(result) {
+   *     // Only verified origins are allowed.
+   *     if (result.origin == expectedOrigin &&
+   *         result.originVerified &&
+   *         result.secureChannel) {
+   *       handleResultForRequest1(result);
+   *     }
+   *   });
+   * })
+   *
+   * ports.open('request1', request1Url, '_blank');
+   * ```
+   *
+   * @param {string} requestId
+   * @param {function(!ActivityPort)} callback
+   */
+  onResult(requestId, callback) {
+    let handlers = this.requestHandlers_[requestId];
+    if (!handlers) {
+      handlers = [];
+      this.requestHandlers_[requestId] = handlers;
+    }
+    handlers.push(callback);
+
+    // Consume available result.
+    const availableResult = this.discoverResult_(requestId);
+    if (availableResult) {
+      this.consumeResult_(availableResult, callback);
+    }
   }
 
-  const info = parseUrlWithA(a, url);
-
-  return (cache[url] = info);
-}
-
-/**
- * Returns a Location-like object for the given URL. If it is relative,
- * the URL gets resolved.
- * @param {!HTMLAnchorElement} a
- * @param {string} url
- * @return {!LocationDef}
- */
-function parseUrlWithA(a, url) {
-  a.href = url;
-
-  // IE11 doesn't provide full URL components when parsing relative URLs.
-  // Assigning to itself again does the trick.
-  if (!a.protocol) {
-    a.href = a.href;
+  /**
+   * @param {function(!Error)} handler
+   */
+  onRedirectError(handler) {
+    this.redirectErrorPromise_.then(handler);
   }
 
-  /** @type {!LocationDef} */
-  const info = {
-    href: a.href,
-    protocol: a.protocol,
-    host: a.host,
-    hostname: a.hostname,
-    port: a.port == '0' ? '' : a.port,
-    pathname: a.pathname,
-    search: a.search,
-    hash: a.hash,
-    origin: '', // Set below.
-  };
-
-  // Some IE11 specific polyfills.
-  // 1) IE11 strips out the leading '/' in the pathname.
-  if (info.pathname[0] !== '/') {
-    info.pathname = '/' + info.pathname;
+  /**
+   * @param {string} requestId
+   * @param {string} url
+   * @param {string} target
+   * @param {?Object=} opt_args
+   * @param {?ActivityOpenOptions=} opt_options
+   * @return {!ActivityWindowPort}
+   */
+  openWin_(requestId, url, target, opt_args, opt_options) {
+    const port = new ActivityWindowPort(
+        this.win_, requestId, url, target, opt_args, opt_options);
+    port.open().then(() => {
+      // Await result if possible. Notice that when falling back to "redirect",
+      // the result will never arrive through this port.
+      this.consumeResultAll_(requestId, port);
+    });
+    return port;
   }
 
-  // 2) For URLs with implicit ports, IE11 parses to default ports while
-  // other browsers leave the port field empty.
-  if (
-    (info.protocol == 'http:' && info.port == 80) ||
-    (info.protocol == 'https:' && info.port == 443)
-  ) {
-    info.port = '';
-    info.host = info.hostname;
+  /**
+   * @param {string} requestId
+   * @return {?ActivityPort}
+   * @private
+   */
+  discoverResult_(requestId) {
+    let port = this.resultBuffer_[requestId];
+    if (!port && this.fragment_) {
+      try {
+        port = discoverRedirectPort(
+            this.win_, this.fragment_, requestId);
+      } catch (e) {
+        throwAsync(e);
+        this.redirectErrorResolver_(e);
+      }
+      if (port) {
+        this.resultBuffer_[requestId] = port;
+      }
+    }
+    return port;
   }
 
-  // For data URI a.origin is equal to the string 'null' which is not useful.
-  // We instead return the actual origin which is the full URL.
-  if (a.origin && a.origin != 'null') {
-    info.origin = a.origin;
-  } else if (info.protocol == 'data:' || !info.host) {
-    info.origin = info.href;
-  } else {
-    info.origin = info.protocol + '//' + info.host;
+  /**
+   * @param {!ActivityPort} port
+   * @param {function(!ActivityPort)} callback
+   * @private
+   */
+  consumeResult_(port, callback) {
+    Promise.resolve().then(() => {
+      callback(port);
+    });
   }
-  return info;
-}
 
-/**
- * Parses and builds Object of URL query string.
- * @param {string} query The URL query string.
- * @return {!Object<string, string>}
- */
-function parseQueryString$1(query) {
-  if (!query) {
-    return {};
+  /**
+   * @param {string} requestId
+   * @param {!ActivityPort} port
+   * @private
+   */
+  consumeResultAll_(requestId, port) {
+    // Find and execute handlers.
+    const handlers = this.requestHandlers_[requestId];
+    if (handlers) {
+      handlers.forEach(handler => {
+        this.consumeResult_(port, handler);
+      });
+    }
+    // Buffer the result for callbacks that may arrive in the future.
+    this.resultBuffer_[requestId] = port;
   }
-  return (/^[?#]/.test(query) ? query.slice(1) : query)
-    .split('&')
-    .reduce((params, param) => {
-      const item = param.split('=');
-      const key = decodeURIComponent(item[0] || '');
-      const value = decodeURIComponent(item[1] || '');
-      if (key) {
-        params[key] = value;
-      }
-      return params;
-    }, {});
 }
 
-/**
- * Adds a parameter to a query string.
- * @param {string} url
- * @param {string} param
- * @param {string} value
- * @return {string}
- */
-function addQueryParam(url, param, value) {
-  const queryIndex = url.indexOf('?');
-  const fragmentIndex = url.indexOf('#');
-  let fragment = '';
-  if (fragmentIndex != -1) {
-    fragment = url.substring(fragmentIndex);
-    url = url.substring(0, fragmentIndex);
-  }
-  if (queryIndex == -1) {
-    url += '?';
-  } else if (queryIndex < url.length - 1) {
-    url += '&';
-  }
-  url += encodeURIComponent(param) + '=' + encodeURIComponent(value);
-  return url + fragment;
-}
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
 
-/**
- * Have to put these in the map to avoid compiler optimization. Due to
- * optimization issues, this map only allows property-style keys. E.g. "hr1",
- * as opposed to "1hr".
- * @type {!Object<string, number>}
- * @package Visible for testing only.
- */
-const CACHE_KEYS = {
-  'nocache': 1,
-  'hr1': 3600000, // 1hr = 1000 * 60 * 60
-  'hr12': 43200000, // 12hr = 1000 * 60 * 60 * 12
+var activityPorts = {
+  ActivityPorts,
+  ActivityIframePort,
+  ActivityMessagingPort,
+  ActivityMode,
+  ActivityOpenOptions,
+  ActivityPort,
+  ActivityRequest,
+  ActivityResult,
+  ActivityResultCode,
+  ActivityWindowPort,
+  createAbortError,
+  isAbortError,
 };
+var activityPorts_1 = activityPorts.ActivityPorts;
+var activityPorts_2 = activityPorts.ActivityIframePort;
+var activityPorts_11 = activityPorts.createAbortError;
+var activityPorts_12 = activityPorts.isAbortError;
 
-/**
- * @return {string}
- */
-function feOrigin() {
-  return parseUrl$1('https://news.google.com').origin;
-}
-
-/**
- * @param {string} url Relative URL, e.g. "/service1".
- * @return {string} The complete URL.
- */
-function serviceUrl(url) {
-  return 'https://news.google.com/swg/_/api/v1' + url;
-}
-
-/**
- * @param {string} url  Relative URL, e.g. "/service1".
- * @return {string} The complete URL.
- */
-function adsUrl(url) {
-  return 'https://pubads.g.doubleclick.net' + url;
-}
-
-/**
- * @param {string} url Relative URL, e.g. "/offersiframe".
- * @param {string=} prefix
- * @return {string} The complete URL.
- */
-function feUrl(url, prefix = '') {
-  // Add cache param.
-  url = feCached('https://news.google.com' + prefix + '/swg/_/ui/v1' + url);
-
-  // Optionally add jsmode param. This allows us to test against "aggressively" compiled Boq JS.
-  const query = parseQueryString$1(self.location.hash);
-  const boqJsMode = query['swg.boqjsmode'];
-  if (boqJsMode !== undefined) {
-    url = addQueryParam(url, 'jsmode', boqJsMode);
-  }
-
-  return url;
-}
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
 /**
- * @param {string} url FE URL.
- * @return {string} The complete URL including cache param.
+ * Whether the specified error is an AbortError type.
+ * See https://heycam.github.io/webidl/#aborterror.
+ * @param {*} error
+ * @return {boolean}
  */
-function feCached(url) {
-  return addQueryParam(url, '_', cacheParam('hr1'));
+function isCancelError(error) {
+  return activityPorts_12(error);
 }
 
 /**
- * @param {!Object<string, ?>} args
- * @return {!Object<string, ?>}
+ * Creates or emulates a DOMException of AbortError type.
+ * See https://heycam.github.io/webidl/#aborterror.
+ * @param {!Window} win
+ * @param {string=} message
+ * @return {!DOMException}
  */
-function feArgs(args) {
-  return Object.assign(args, {
-    '_client': 'SwG 0.1.22.84',
-  });
+function createCancelError(win, message) {
+  return activityPorts_11(win, message);
 }
 
 /**
- * @param {string} cacheKey
- * @return {string}
- * @package Visible for testing only.
+ * A set of error utilities combined in a class to allow easy stubbing in tests.
  */
-function cacheParam(cacheKey) {
-  let period = CACHE_KEYS[cacheKey];
-  if (period == null) {
-    period = 1;
-  }
-  if (period === 0) {
-    return '_';
+class ErrorUtils {
+  /**
+   * @param {!Error} error
+   */
+  static throwAsync(error) {
+    setTimeout(() => {
+      throw error;
+    });
   }
-  const now = Date.now();
-  return String(period <= 1 ? now : Math.floor(now / period));
 }
 
 /**
@@ -4281,36 +3940,33 @@ const iframeAttributes = {
 };
 
 /**
- * @enum {string}
- */
-const Theme = {
-  LIGHT: 'light',
-  DARK: 'dark',
-};
-
-/**
- * The class for Smart button Api.
+ * Class to build and render Activity iframe view.
  */
-class SmartSubscriptionButtonApi {
+class ActivityIframeView extends View {
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!Element} button
-   * @param {!../api/subscriptions.SmartButtonOptions} options
-   * @param {function()=} callback
+   * @param {!Window} win
+   * @param {!../components/activities.ActivityPorts} activityPorts
+   * @param {string} src
+   * @param {!Object<string, ?>=} args
+   * @param {boolean=} shouldFadeBody
+   * @param {boolean=} hasLoadingIndicator
    */
-  constructor(deps, button, options, callback) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
+  constructor(
+    win,
+    activityPorts,
+    src,
+    args,
+    shouldFadeBody = false,
+    hasLoadingIndicator = false
+  ) {
+    super();
 
     /** @private @const {!Window} */
-    this.win_ = deps.win();
+    this.win_ = win;
 
     /** @private @const {!Document} */
     this.doc_ = this.win_.document;
 
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
     /** @private @const {!HTMLIFrameElement} */
     this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
       this.doc_,
@@ -4318,81 +3974,166 @@ class SmartSubscriptionButtonApi {
       iframeAttributes
     ));
 
-    /** @private @const {!Element} */
-    this.button_ = button;
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = activityPorts;
 
-    /** @private {!../api/subscriptions.SmartButtonOptions} */
-    this.options_ = options;
+    /** @private @const {string} */
+    this.src_ = src;
 
-    /** @private const {function()=} */
-    this.callback_ = callback;
+    /** @private @const {!Object<string, ?>} */
+    this.args_ = args || {};
 
-    /** @private @const {string} */
-    this.src_ = feUrl('/smartboxiframe');
+    /** @private @const {boolean} */
+    this.shouldFadeBody_ = shouldFadeBody;
 
-    const frontendArguments = {
-      'productId': this.deps_.pageConfig().getProductId(),
-      'publicationId': this.deps_.pageConfig().getPublicationId(),
-      'theme': (this.options_ && this.options_.theme) || 'light',
-      'lang': (this.options_ && this.options_.lang) || 'en',
-    };
-    const messageTextColor = this.options_ && this.options_.messageTextColor;
-    if (messageTextColor) {
-      frontendArguments['messageTextColor'] = messageTextColor;
-    }
+    /** @private @const {boolean} */
+    this.hasLoadingIndicator_ = hasLoadingIndicator;
 
-    /** @private @const {!Object} */
-    this.args_ = feArgs(frontendArguments);
+    /** @private {?../components/activities.ActivityIframePort} */
+    this.port_ = null;
+
+    /**
+     * @private
+     * {?function<!web-activities/activity-ports.ActivityIframePort|!Promise>}
+     */
+    this.portResolver_ = null;
+
+    /**
+     * @private @const
+     * {!Promise<!web-activities/activity-ports.ActivityIframePort>}
+     */
+    this.portPromise_ = new Promise(resolve => {
+      this.portResolver_ = resolve;
+    });
+  }
+
+  /** @override */
+  getElement() {
+    return this.iframe_;
+  }
+
+  /** @override */
+  init(dialog) {
+    return this.activityPorts_
+      .openIframe(this.iframe_, this.src_, this.args_)
+      .then(port => this.onOpenIframeResponse_(port, dialog));
   }
 
   /**
-   * @param {SmartBoxMessage} smartBoxMessage
+   * Returns if document should fade for this view.
+   * @return {boolean}
    */
-  handleSmartBoxClick_(smartBoxMessage) {
-    if (smartBoxMessage && smartBoxMessage.getIsClicked()) {
-      if (!this.callback_) {
-        throw new Error('No callback!');
-      }
-      this.callback_();
-      return;
-    }
+  shouldFadeBody() {
+    return this.shouldFadeBody_;
+  }
+
+  /**
+   * Returns if the view shows loading indicator.
+   * @return {boolean}
+   */
+  hasLoadingIndicator() {
+    return this.hasLoadingIndicator_;
+  }
+
+  /**
+   * @param {!../components/activities.ActivityIframePort} port
+   * @param {!../components/dialog.Dialog} dialog
+   * @return {!Promise}
+   */
+  onOpenIframeResponse_(port, dialog) {
+    this.port_ = port;
+    this.portResolver_(port);
+
+    this.port_.onResizeRequest(height => {
+      dialog.resizeView(this, height);
+    });
+
+    return this.port_.whenReady();
+  }
+
+  /**
+   * @return {!Promise<!../components/activities.ActivityIframePort>}
+   * @private
+   */
+  getPortPromise_() {
+    return this.portPromise_;
+  }
+
+  /**
+   * @param {!function(new: T)}  message
+   * @param {function(../proto/api_messages.Message)} callback
+   * @template T
+   */
+  on(message, callback) {
+    this.getPortPromise_().then(port => {
+      port.on(message, callback);
+    });
+  }
+
+  /**
+   * @param {!../proto/api_messages.Message} request
+   */
+  execute(request) {
+    this.getPortPromise_().then(port => {
+      port.execute(request);
+    });
+  }
+
+  /**
+   * Accepts results from the caller.
+   * @return {!Promise<!web-activities/activity-ports.ActivityResult>}
+   */
+  acceptResult() {
+    return this.getPortPromise_().then(port => port.acceptResult());
+  }
+
+  /**
+   * Accepts results from the caller and verifies origin.
+   * @param {string} requireOrigin
+   * @param {boolean} requireOriginVerified
+   * @param {boolean} requireSecureChannel
+   * @return {!Promise<!Object>}
+   */
+  acceptResultAndVerify(
+    requireOrigin,
+    requireOriginVerified,
+    requireSecureChannel
+  ) {
+    return this.getPortPromise_().then(port => {
+      return acceptPortResultData(
+        port,
+        requireOrigin,
+        requireOriginVerified,
+        requireSecureChannel
+      );
+    });
+  }
+
+  /**
+   * Completes the flow.
+   * @return {!Promise}
+   */
+  whenComplete() {
+    return this.acceptResult();
   }
 
   /**
-   * Make a call to build button content and listens for the 'click' message.
-   * @return {!Element}
+   * @param {function()} callback
    */
-  start() {
-    /**
-     * Add a callback to the button itself to fire the iframe's button click
-     * action when user tabs to the container button and hits enter.
-     */
-    this.button_.addEventListener('click', () => {
-      this.callback_();
+  onCancel(callback) {
+    this.acceptResult().catch(reason => {
+      if (isCancelError(reason)) {
+        callback();
+      }
+      throw reason;
     });
+  }
 
-    setImportantStyles(this.iframe_, {
-      'opacity': 1,
-      'position': 'absolute',
-      'top': 0,
-      'bottom': 0,
-      'left': 0,
-      'height': '100%',
-      'right': 0,
-      'width': '100%',
-    });
-    this.button_.appendChild(this.iframe_);
-    const analyticsContext = this.deps_
-      .analytics()
-      .getContext()
-      .toArray();
-    this.args_['analyticsContext'] = analyticsContext;
-    this.activityPorts_
-      .openIframe(this.iframe_, this.src_, this.args_)
-      .then(port => {
-        port.on(SmartBoxMessage, this.handleSmartBoxClick_.bind(this));
-      });
-    return this.iframe_;
+  /** @override */
+  resized() {
+    if (this.port_) {
+      this.port_.resized();
+    }
   }
 }
 
@@ -4413,204 +4154,206 @@ class SmartSubscriptionButtonApi {
  */
 
 /**
- * The button title should match that of button's SVG.
+ * Character mapping from base64url to base64.
+ * @const {!Object<string, string>}
  */
-/** @type {!Object<string, string>} */
-const TITLE_LANG_MAP = {
-  'en': 'Subscribe with Google',
-  'ar': 'Google اشترك مع',
-  'de': 'Abonnieren mit Google',
-  'es': 'Suscríbete con Google',
-  'es-latam': 'Suscríbete con Google',
-  'es-latn': 'Suscríbete con Google',
-  'fr': "S'abonner avec Google",
-  'hi': 'Google के ज़रिये सदस्यता',
-  'id': 'Berlangganan dengan Google',
-  'it': 'Abbonati con Google',
-  'jp': 'Google で購読',
-  'ko': 'Google 을 통한구독',
-  'ms': 'Langgan dengan Google',
-  'nl': 'Abonneren via Google',
-  'no': 'Abonner med Google',
-  'pl': 'Subskrybuj z Google',
-  'pt': 'Subscrever com o Google',
-  'pt-br': 'Assine com o Google',
-  'ru': 'Подпиcka через Google',
-  'se': 'Prenumerera med Google',
-  'th': 'สมัครฟาน Google',
-  'tr': 'Google ile Abone Ol',
-  'uk': 'Підписатися через Google',
-  'zh-tw': '透過 Google 訂閱',
-};
+const base64UrlDecodeSubs = {'-': '+', '_': '/', '.': '='};
 
 /**
- * The button stylesheet can be found in the `/assets/swg-button.css`.
- * It's produced by the `gulp assets` task and deployed to
- * `https://news.google.com/swg/js/v1/swg-button.css`.
+ * Converts a string which holds 8-bit code points, such as the result of atob,
+ * into a Uint8Array with the corresponding bytes.
+ * If you have a string of characters, you probably want to be using utf8Encode.
+ * @param {string} str
+ * @return {!Uint8Array}
  */
-class ButtonApi {
-  /**
-   * @param {!../model/doc.Doc} doc
-   * @param {!Promise<!./runtime.ConfiguredRuntime>} configuredRuntimePromise
-   */
-  constructor(doc, configuredRuntimePromise) {
-    /** @private @const {!../model/doc.Doc} */
-    this.doc_ = doc;
-
-    /** @private @const {!Promise<!./runtime.ConfiguredRuntime>} */
-    this.configuredRuntimePromise_ = configuredRuntimePromise;
+function stringToBytes(str) {
+  const bytes = new Uint8Array(str.length);
+  for (let i = 0; i < str.length; i++) {
+    const charCode = str.charCodeAt(i);
+    log_2(charCode <= 255, 'Characters must be in range [0,255]');
+    bytes[i] = charCode;
   }
+  return bytes;
+}
 
-  /**
-   */
-  init() {
-    const head = this.doc_.getHead();
-    if (!head) {
-      return;
-    }
-
-    const url = 'https://news.google.com/swg/js/v1/swg-button.css';
-    const existing = head.querySelector(`link[href="${url}"]`);
-    if (existing) {
-      return;
-    }
+/**
+ * Converts a 8-bit bytes array into a string
+ * @param {!Uint8Array} bytes
+ * @return {string}
+ */
+function bytesToString(bytes) {
+  // Intentionally avoids String.fromCharCode.apply so we don't suffer a
+  // stack overflow. #10495, https://jsperf.com/bytesToString-2
+  const array = new Array(bytes.length);
+  for (let i = 0; i < bytes.length; i++) {
+    array[i] = String.fromCharCode(bytes[i]);
+  }
+  return array.join('');
+}
 
-    // <link rel="stylesheet" href="..." type="text/css">
-    head.appendChild(
-      createElement(this.doc_.getWin().document, 'link', {
-        'rel': 'stylesheet',
-        'type': 'text/css',
-        'href': url,
-      })
-    );
+/**
+ * Interpret a byte array as a UTF-8 string.
+ * @param {!Uint8Array} bytes
+ * @return {string}
+ */
+function utf8DecodeSync(bytes) {
+  if (typeof TextDecoder !== 'undefined') {
+    return new TextDecoder('utf-8').decode(bytes);
   }
+  const asciiString = bytesToString(new Uint8Array(bytes));
+  return decodeURIComponent(escape(asciiString));
+}
 
-  /**
-   * @param {!../api/subscriptions.ButtonOptions|function()} optionsOrCallback
-   * @param {function()=} callback
-   * @return {!Element}
-   */
-  create(optionsOrCallback, callback) {
-    const button = createElement(this.doc_.getWin().document, 'button', {});
-    return this.attach(button, optionsOrCallback, callback);
+/**
+ * Turn a string into UTF-8 bytes.
+ * @param {string} string
+ * @return {!Uint8Array}
+ */
+function utf8EncodeSync(string) {
+  if (typeof TextEncoder !== 'undefined') {
+    return new TextEncoder('utf-8').encode(string);
   }
+  return stringToBytes(unescape(encodeURIComponent(string)));
+}
 
-  /**
-   * @param {!Element} button
-   * @param {../api/subscriptions.ButtonOptions|function()} optionsOrCallback
-   * @param {function()=} callback
-   * @return {!Element}
-   */
-  attach(button, optionsOrCallback, callback) {
-    const options = /** @type {!../api/subscriptions.ButtonOptions} */ (this.getOptions_(
-      optionsOrCallback
-    ));
+/**
+ * Converts a string which is in base64url encoding into a Uint8Array
+ * containing the decoded value.
+ * @param {string} str
+ * @return {!Uint8Array}
+ */
+function base64UrlDecodeToBytes(str) {
+  const encoded = atob(str.replace(/[-_.]/g, ch => base64UrlDecodeSubs[ch]));
+  return stringToBytes(encoded);
+}
 
-    const theme = options['theme'];
-    button.classList.add(`swg-button-${theme}`);
-    button.setAttribute('role', 'button');
-    if (options['lang']) {
-      button.setAttribute('lang', options['lang']);
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @fileoverview This module declares JSON types as defined in the
+ * {@link http://json.org/}.
+ */
+
+/**
+ * Simple wrapper around JSON.parse that casts the return value
+ * to JsonObject.
+ * Create a new wrapper if an array return value is desired.
+ * @param {*} json JSON string to parse
+ * @return {?JsonObject|undefined} May be extend to parse arrays.
+ */
+function parseJson(json) {
+  return /** @type {?JsonObject} */ (JSON.parse(/** @type {string} */ (json)));
+}
+
+/**
+ * Parses the given `json` string without throwing an exception if not valid.
+ * Returns `undefined` if parsing fails.
+ * Returns the `Object` corresponding to the JSON string when parsing succeeds.
+ * @param {*} json JSON string to parse
+ * @param {function(!Error)=} onFailed Optional function that will be called
+ *     with the error if parsing fails.
+ * @return {?JsonObject|undefined} May be extend to parse arrays.
+ */
+function tryParseJson(json, onFailed) {
+  try {
+    return parseJson(json);
+  } catch (e) {
+    if (onFailed) {
+      onFailed(e);
     }
-    button.setAttribute('title', msg(TITLE_LANG_MAP, button) || '');
-    button.addEventListener(
-      'click',
-      this.getCallback_(optionsOrCallback, callback)
-    );
-    button.addEventListener('click', () => {
-      this.configuredRuntimePromise_.then(configuredRuntime => {
-        configuredRuntime
-          .eventManager()
-          .logSwgEvent(
-            AnalyticsEvent.ACTION_SWG_BUTTON_CLICK,
-            /* isFromUserAction */ true
-          );
-      });
-    });
-    this.configuredRuntimePromise_.then(configuredRuntime => {
-      configuredRuntime
-        .eventManager()
-        .logSwgEvent(AnalyticsEvent.IMPRESSION_SWG_BUTTON);
-    });
-    return button;
+    return undefined;
   }
+}
 
-  /**
-   *
-   * @param {../api/subscriptions.ButtonOptions|../api/subscriptions.SmartButtonOptions|function()} optionsOrCallback
-   * @return {!../api/subscriptions.ButtonOptions|!../api/subscriptions.SmartButtonOptions}
-   * @private
-   */
-  getOptions_(optionsOrCallback) {
-    const options =
-      /** @type {!../api/subscriptions.ButtonOptions|!../api/subscriptions.SmartButtonOptions} */ (optionsOrCallback &&
-      typeof optionsOrCallback != 'function'
-        ? optionsOrCallback
-        : {'theme': Theme.LIGHT});
+/**
+ * Converts the passed string into a JSON object (if possible) and returns the
+ * value of the propertyName on that object.
+ * @param {string} jsonString
+ * @param {string} propertyName
+ * @return {*}
+ */
+function getPropertyFromJsonString(jsonString, propertyName) {
+  const json = tryParseJson(jsonString);
+  return (json && json[propertyName]) || null;
+}
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-    const theme = options['theme'];
-    if (theme !== Theme.LIGHT && theme !== Theme.DARK) {
-      options['theme'] = Theme.LIGHT;
-    }
-    return options;
-  }
+/**
+ * Provides helper methods to decode and verify JWT tokens.
+ */
+class JwtHelper {
+  constructor() {}
 
   /**
-   *
-   * @param {?../api/subscriptions.ButtonOptions|?../api/subscriptions.SmartButtonOptions|function()} optionsOrCallback
-   * @param {function()=} callback
-   * @return {function()|function(Event):boolean}
-   * @private
+   * Decodes JWT token and returns its payload.
+   * @param {string} encodedToken
+   * @return {?JsonObject|undefined}
    */
-  getCallback_(optionsOrCallback, callback) {
-    return (
-      /** @type {function()|function(Event):boolean} */ ((typeof optionsOrCallback ==
-      'function'
-        ? optionsOrCallback
-        : null) || callback)
-    );
+  decode(encodedToken) {
+    return this.decodeInternal_(encodedToken).payload;
   }
 
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!Element} button
-   * @param {../api/subscriptions.SmartButtonOptions|function()} optionsOrCallback
-   * @param {function()=} callback
-   * @return {!Element}
+   * @param {string} encodedToken
+   * @return {!JwtTokenInternalDef}
+   * @private
    */
-  attachSmartButton(deps, button, optionsOrCallback, callback) {
-    const options = /** @type {!../api/subscriptions.SmartButtonOptions} */ (this.getOptions_(
-      optionsOrCallback
-    ));
-    const castedCallback = /** @type {function()} */ (this.getCallback_(
-      optionsOrCallback,
-      callback
-    ));
-
-    // Add required CSS class, if missing.
-    button.classList.add('swg-smart-button');
-    button.addEventListener('click', () =>
-      this.configuredRuntimePromise_.then(configuredRuntime =>
-        configuredRuntime
-          .eventManager()
-          .logSwgEvent(
-            AnalyticsEvent.ACTION_SWG_BUTTON_CLICK,
-            /* isFromUserAction */ true
-          )
-      )
-    );
+  decodeInternal_(encodedToken) {
+    // See https://jwt.io/introduction/
+    /**
+     * Throws error about invalid token.
+     */
+    function invalidToken() {
+      throw new Error(`Invalid token: "${encodedToken}"`);
+    }
 
-    return new SmartSubscriptionButtonApi(
-      deps,
-      button,
-      options,
-      castedCallback
-    ).start();
+    // Encoded token has three parts: header.payload.sig
+    // Note! The padding is not allowed by JWT spec:
+    // http://self-issued.info/docs/draft-goland-json-web-token-00.html#rfc.section.5
+    const parts = encodedToken.split('.');
+    if (parts.length != 3) {
+      invalidToken();
+    }
+    const headerUtf8Bytes = base64UrlDecodeToBytes(parts[0]);
+    const payloadUtf8Bytes = base64UrlDecodeToBytes(parts[1]);
+    return {
+      header: tryParseJson(utf8DecodeSync(headerUtf8Bytes), invalidToken),
+      payload: tryParseJson(utf8DecodeSync(payloadUtf8Bytes), invalidToken),
+      verifiable: `${parts[0]}.${parts[1]}`,
+      sig: parts[2],
+    };
   }
 }
 
-const CSS = ".swg-dialog,.swg-toast{box-sizing:border-box;background-color:#fff!important}.swg-toast{position:fixed!important;bottom:0!important;max-height:46px!important;z-index:2147483647!important;border:none!important}@media (max-height:640px), (max-width:640px){.swg-dialog,.swg-toast{width:480px!important;left:-240px!important;margin-left:50vw!important;border-top-left-radius:8px!important;border-top-right-radius:8px!important;box-shadow:0 1px 1px rgba(60,64,67,.3),0 1px 4px 1px rgba(60,64,67,.15)!important}}@media (min-width:640px) and (min-height:640px){.swg-dialog{width:630px!important;left:-315px!important;margin-left:50vw!important;background-color:transparent!important;border:none!important}.swg-toast{left:0!important}}@media (max-width:480px){.swg-dialog,.swg-toast{width:100%!important;left:0!important;right:0!important;margin-left:0!important}}\n/*# sourceURL=/./src/components/dialog.css*/";
-
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
@@ -4627,274 +4370,562 @@ const CSS = ".swg-dialog,.swg-toast{box-sizing:border-box;background-color:#fff!
  * limitations under the License.
  */
 
-/** @enum {number} */
-const CallbackId = {
-  ENTITLEMENTS: 1,
-  SUBSCRIBE_REQUEST: 2,
-  PAYMENT_RESPONSE: 3,
-  LOGIN_REQUEST: 4,
-  LINK_PROGRESS: 5,
-  LINK_COMPLETE: 6,
-  FLOW_STARTED: 7,
-  FLOW_CANCELED: 8,
-};
-
 /**
+ * The holder of the entitlements for a service.
  */
-class Callbacks {
+class Entitlements {
   /**
+   * @param {string} service
+   * @param {string} raw
+   * @param {!Array<!Entitlement>} entitlements
+   * @param {?string} currentProduct
+   * @param {function(!Entitlements)} ackHandler
+   * @param {?boolean|undefined} isReadyToPay
+   * @param {?string|undefined} decryptedDocumentKey
    */
-  constructor() {
-    /** @private @const {!Object<CallbackId, function(*)>} */
-    this.callbacks_ = {};
-    /** @private @const {!Object<CallbackId, *>} */
-    this.resultBuffer_ = {};
+  constructor(
+    service,
+    raw,
+    entitlements,
+    currentProduct,
+    ackHandler,
+    isReadyToPay,
+    decryptedDocumentKey
+  ) {
+    /** @const {string} */
+    this.service = service;
+    /** @const {string} */
+    this.raw = raw;
+    /** @const {!Array<!Entitlement>} */
+    this.entitlements = entitlements;
+    /** @const {boolean} */
+    this.isReadyToPay = isReadyToPay || false;
+    /** @const {?string} */
+    this.decryptedDocumentKey = decryptedDocumentKey || null;
+
+    /** @private @const {?string} */
+    this.product_ = currentProduct;
+    /** @private @const {function(!Entitlements)} */
+    this.ackHandler_ = ackHandler;
   }
 
   /**
-   * @param {function(!Promise<!../api/entitlements.Entitlements>)} callback
+   * @return {!Entitlements}
    */
-  setOnEntitlementsResponse(callback) {
-    this.setCallback_(CallbackId.ENTITLEMENTS, callback);
+  clone() {
+    return new Entitlements(
+      this.service,
+      this.raw,
+      this.entitlements.map(ent => ent.clone()),
+      this.product_,
+      this.ackHandler_,
+      this.isReadyToPay,
+      this.decryptedDocumentKey
+    );
   }
 
   /**
-   * @param {!Promise<!../api/entitlements.Entitlements>} promise
+   * @return {!Object}
    */
-  triggerEntitlementsResponse(promise) {
-    return this.trigger_(
-      CallbackId.ENTITLEMENTS,
-      promise.then(res => res.clone())
-    );
+  json() {
+    return {
+      'service': this.service,
+      'entitlements': this.entitlements.map(item => item.json()),
+      'isReadyToPay': this.isReadyToPay,
+    };
   }
 
   /**
+   * @param {string=} source
    * @return {boolean}
    */
-  hasEntitlementsResponsePending() {
-    return !!this.resultBuffer_[CallbackId.ENTITLEMENTS];
+  enablesThis(source) {
+    return this.enables(this.product_, source);
   }
 
   /**
-   * @param {function(!../api/subscriptions.LoginRequest)} callback
+   * @param {string=} source
+   * @return {boolean}
    */
-  setOnLoginRequest(callback) {
-    this.setCallback_(CallbackId.LOGIN_REQUEST, callback);
+  enablesAny(source) {
+    for (let i = 0; i < this.entitlements.length; i++) {
+      if (
+        this.entitlements[i].products.length > 0 &&
+        (!source || source == this.entitlements[i].source)
+      ) {
+        return true;
+      }
+    }
+    return false;
   }
 
   /**
-   * @param {!../api/subscriptions.LoginRequest} request
-   * @return {boolean} Whether the callback has been found.
+   * Whether these entitlements enable the specified product, optionally also
+   * restricting the source.
+   * @param {?string} product
+   * @param {string=} source
+   * @return {boolean}
    */
-  triggerLoginRequest(request) {
-    return this.trigger_(CallbackId.LOGIN_REQUEST, request);
+  enables(product, source) {
+    if (!product) {
+      return false;
+    }
+    return !!this.getEntitlementFor(product, source);
   }
 
   /**
-   * @param {function()} callback
+   * Returns the first matching entitlement for the current product,
+   * optionally also matching the specified source.
+   * @param {string=} source
+   * @return {?Entitlement}
    */
-  setOnLinkProgress(callback) {
-    this.setCallback_(CallbackId.LINK_PROGRESS, callback);
+  getEntitlementForThis(source) {
+    return this.getEntitlementFor(this.product_, source);
+  }
+
+  /**
+   * Returns the first matching entitlement for the specified product,
+   * optionally also matching the specified source.
+   * @param {?string} product
+   * @param {string=} source
+   * @return {?Entitlement}
+   */
+  getEntitlementFor(product, source) {
+    if (product && this.entitlements.length > 0) {
+      for (let i = 0; i < this.entitlements.length; i++) {
+        if (
+          this.entitlements[i].enables(product) &&
+          (!source || source == this.entitlements[i].source)
+        ) {
+          return this.entitlements[i];
+        }
+      }
+    }
+    return null;
+  }
+
+  /**
+   * Returns the first matching entitlement for the specified source w/o
+   * matching any specific products.
+   * @param {string} source
+   * @return {?Entitlement}
+   */
+  getEntitlementForSource(source) {
+    if (this.entitlements.length > 0) {
+      for (let i = 0; i < this.entitlements.length; i++) {
+        if (
+          this.entitlements[i].subscriptionToken &&
+          source == this.entitlements[i].source
+        ) {
+          return this.entitlements[i];
+        }
+      }
+    }
+    return null;
+  }
+
+  /**
+   * A 3p site should call this method to acknowledge that it "saw" and
+   * "understood" entitlements.
+   */
+  ack() {
+    this.ackHandler_(this);
   }
+}
 
+/**
+ * The single entitlement object.
+ */
+class Entitlement {
   /**
-   * @return {boolean} Whether the callback has been found.
+   * @param {string} source
+   * @param {!Array<string>} products
+   * @param {string} subscriptionToken
    */
-  triggerLinkProgress() {
-    return this.trigger_(CallbackId.LINK_PROGRESS, true);
+  constructor(source, products, subscriptionToken) {
+    /** @const {string} */
+    this.source = source;
+    /** @const {!Array<string>} */
+    this.products = products;
+    /** @const {string} */
+    this.subscriptionToken = subscriptionToken;
   }
 
   /**
+   * @return {!Entitlement}
    */
-  resetLinkProgress() {
-    this.resetCallback_(CallbackId.LINK_PROGRESS);
+  clone() {
+    return new Entitlement(
+      this.source,
+      this.products.slice(0),
+      this.subscriptionToken
+    );
   }
 
   /**
-   * @param {function()} callback
+   * @return {!Object}
    */
-  setOnLinkComplete(callback) {
-    this.setCallback_(CallbackId.LINK_COMPLETE, callback);
+  json() {
+    return {
+      'source': this.source,
+      'products': this.products,
+      'subscriptionToken': this.subscriptionToken,
+    };
   }
 
   /**
-   * @return {boolean} Whether the callback has been found.
+   * @param {?string} product
+   * @return {boolean}
    */
-  triggerLinkComplete() {
-    return this.trigger_(CallbackId.LINK_COMPLETE, true);
+  enables(product) {
+    if (!product) {
+      return false;
+    }
+    // Wildcard allows this product.
+    const eq = product.indexOf(':');
+    if (
+      eq != -1 &&
+      this.products.includes(product.substring(0, eq + 1) + '*')
+    ) {
+      return true;
+    }
+    return this.products.includes(product);
   }
 
   /**
-   * @return {boolean}
+   * @param {?Object} json
+   * @return {!Entitlement}
    */
-  hasLinkCompletePending() {
-    return !!this.resultBuffer_[CallbackId.LINK_COMPLETE];
+  static parseFromJson(json) {
+    if (!json) {
+      json = {};
+    }
+    const source = json['source'] || '';
+    const products = json['products'] || [];
+    const subscriptionToken = json['subscriptionToken'];
+    return new Entitlement(source, products, subscriptionToken);
   }
 
   /**
-   * @param {function()} callback
+   * The JSON is expected in one of the forms:
+   * - Single entitlement: `{products: [], ...}`.
+   * - A list of entitlements: `[{products: [], ...}, {...}]`.
+   * @param {!Object|!Array<!Object>} json
+   * @return {!Array<!Entitlement>}
    */
-  setOnSubscribeRequest(callback) {
-    this.setCallback_(CallbackId.SUBSCRIBE_REQUEST, callback);
+  static parseListFromJson(json) {
+    const jsonList = Array.isArray(json)
+      ? /** @type {!Array<Object>} */ (json)
+      : [json];
+    return jsonList.map(json => Entitlement.parseFromJson(json));
   }
 
   /**
-   * @return {boolean} Whether the callback has been found.
+   * Returns the SKU associated with this entitlement.
+   * @return {?string}
    */
-  triggerSubscribeRequest() {
-    return this.trigger_(CallbackId.SUBSCRIBE_REQUEST, true);
+  getSku() {
+    if (this.source !== 'google') {
+      return null;
+    }
+    const sku = (
+        /** @type {?string} */ (getPropertyFromJsonString(
+            this.subscriptionToken,
+            'productId'
+        ) || null)
+    );
+    if (!sku) {
+      log_4('Unable to retrieve SKU from SwG subscription token');
+    }
+    return sku;
   }
+}
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/**
+ */
+class UserData {
 
   /**
-   * @return {boolean}
+   * @param {string} idToken
+   * @param {!Object} data
    */
-  hasSubscribeRequestCallback() {
-    return !!this.callbacks_[CallbackId.SUBSCRIBE_REQUEST];
+  constructor(idToken, data) {
+    /** @const {string} */
+    this.idToken = idToken;
+    /** @const {!Object} */
+    this.data = data;
+
+    /** @const {string} */
+    this.id = data['sub'];
+    /** @const {string} */
+    this.email = data['email'];
+    /** @const {boolean} */
+    this.emailVerified = data['email_verified'];
+    /** @const {string} */
+    this.name = data['name'];
+    /** @const {string} */
+    this.givenName = data['given_name'];
+    /** @const {string} */
+    this.familyName = data['family_name'];
+    /** @const {string} */
+    this.pictureUrl = data['picture'];
   }
 
   /**
-   * @param {function(!Promise<!../api/subscribe-response.SubscribeResponse>)} callback
+   * @return {!UserData}
    */
-  setOnSubscribeResponse(callback) {
-    log_4(
-      `[swg.js:setOnSubscribeResponse]: This method has been deprecated, please switch usages to 'setOnPaymentResponse'`
-    );
-    this.setCallback_(CallbackId.PAYMENT_RESPONSE, callback);
+  clone() {
+    return new UserData(this.idToken, this.data);
   }
 
   /**
-   * @param {function(!Promise<!../api/subscribe-response.SubscribeResponse>)} callback
+   * @return {!Object}
    */
-  setOnContributionResponse(callback) {
-    log_4(
-      `[swg.js:setOnContributionResponse]: This method has been deprecated, please switch usages to 'setOnPaymentResponse'`
-    );
-    this.setCallback_(CallbackId.PAYMENT_RESPONSE, callback);
+  json() {
+    return {
+      'id': this.id,
+      'email': this.email,
+      'emailVerified': this.emailVerified,
+      'name': this.name,
+      'givenName': this.givenName,
+      'familyName': this.familyName,
+      'pictureUrl': this.pictureUrl,
+    };
   }
+}
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/**
+ */
+class SubscribeResponse$1 {
 
   /**
-   * @param {function(!Promise<!../api/subscribe-response.SubscribeResponse>)} callback
+   * @param {string} raw
+   * @param {!PurchaseData} purchaseData
+   * @param {?UserData} userData
+   * @param {?Entitlements} entitlements
+   * @param {!string} productType
+   * @param {function():!Promise} completeHandler
+   * @param {?string=} oldSku
    */
-  setOnPaymentResponse(callback) {
-    this.setCallback_(CallbackId.PAYMENT_RESPONSE, callback);
+  constructor(raw, purchaseData, userData, entitlements, productType,
+      completeHandler, oldSku = null) {
+    /** @const {string} */
+    this.raw = raw;
+    /** @const {!PurchaseData} */
+    this.purchaseData = purchaseData;
+    /** @const {?UserData} */
+    this.userData = userData;
+    /** @const {?Entitlements} */
+    this.entitlements = entitlements;
+    /** @const {string} */
+    this.productType = productType;
+    /** @private @const {function():!Promise} */
+    this.completeHandler_ = completeHandler;
+    /** @const {?string} */
+    this.oldSku = oldSku;
   }
 
   /**
-   * @param {!Promise<!../api/subscribe-response.SubscribeResponse>} responsePromise
-   * @return {boolean} Whether the callback has been found.
+   * @return {!SubscribeResponse}
    */
-  triggerPaymentResponse(responsePromise) {
-    return this.trigger_(
-      CallbackId.PAYMENT_RESPONSE,
-      responsePromise.then(res => res.clone())
+  clone() {
+    return new SubscribeResponse$1(
+        this.raw,
+        this.purchaseData,
+        this.userData,
+        this.entitlements,
+        this.productType,
+        this.completeHandler_,
+        this.oldSku
     );
   }
 
   /**
-   * @return {boolean}
+   * @return {!Object}
    */
-  hasPaymentResponsePending() {
-    return !!this.resultBuffer_[CallbackId.PAYMENT_RESPONSE];
+  json() {
+    return {
+      'purchaseData': this.purchaseData.json(),
+      'userData': this.userData ? this.userData.json() : null,
+      'entitlements': this.entitlements ? this.entitlements.json() : null,
+      'oldSku' : this.oldSku,
+      'productType': this.productType,
+    };
   }
 
   /**
-   * @param {function({flow: string, data: !Object})} callback
+   * Allows the receiving site to complete/acknowledge that it registered
+   * the subscription purchase. The typical action would be to create an
+   * account (or match an existing one) and associated the purchase with
+   * that account.
+   *
+   * SwG will display progress indicator until this method is called and
+   * upon receiving this call will show the confirmation to the user.
+   * The promise returned by this method will yield once the user closes
+   * the confirmation.
+   *
+   * @return {!Promise}
    */
-  setOnFlowStarted(callback) {
-    this.setCallback_(CallbackId.FLOW_STARTED, callback);
+  complete() {
+    return this.completeHandler_();
   }
+}
+
+
+/**
+ */
+class PurchaseData {
 
   /**
-   * @param {string} flow
-   * @param {!Object=} data
-   * @return {boolean} Whether the callback has been found.
+   * @param {string} raw
+   * @param {string} signature
    */
-  triggerFlowStarted(flow, data = {}) {
-    return this.trigger_(CallbackId.FLOW_STARTED, {
-      flow,
-      data,
-    });
+  constructor(raw, signature) {
+    /** @const {string} */
+    this.raw = raw;
+    /** @const {string} */
+    this.data = raw;
+    /** @const {string} */
+    this.signature = signature;
   }
 
   /**
-   * @param {function({flow: string, data: !Object})} callback
+   * @return {!PurchaseData}
    */
-  setOnFlowCanceled(callback) {
-    this.setCallback_(CallbackId.FLOW_CANCELED, callback);
+  clone() {
+    return new PurchaseData(this.raw, this.signature);
   }
 
   /**
-   * @param {string} flow
-   * @param {!Object=} data
-   * @return {boolean} Whether the callback has been found.
+   * @return {!Object}
    */
-  triggerFlowCanceled(flow, data = {}) {
-    return this.trigger_(CallbackId.FLOW_CANCELED, {
-      flow,
-      data,
-    });
+  json() {
+    return {
+      'data': this.raw,
+      'signature': this.signature,
+    };
   }
+}
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+
+/**
+ */
+class DeferredAccountCreationResponse {
 
   /**
-   * @param {!CallbackId} id
-   * @param {function(?)} callback
-   * @private
+   * @param {!Entitlements} entitlements
+   * @param {!UserData} userData
+   * @param {!Array<!PurchaseData>} purchaseDataList
+   * @param {function():!Promise} completeHandler
    */
-  setCallback_(id, callback) {
-    if (this.callbacks_[id]) {
-      log_4(
-        `[swg.js]: You have registered multiple callbacks for the same response.`
-      );
-    }
-    this.callbacks_[id] = callback;
-    // If result already exist, execute the callback right away.
-    if (id in this.resultBuffer_) {
-      this.executeCallback_(id, callback, this.resultBuffer_[id]);
-    }
+  constructor(entitlements, userData, purchaseDataList, completeHandler) {
+    /** @const {!Entitlements} */
+    this.entitlements = entitlements;
+    /** @const {!UserData} */
+    this.userData = userData;
+    /** @const {!Array<!PurchaseData>} */
+    this.purchaseDataList = purchaseDataList;
+    // TODO(dvoytenko): deprecate.
+    /** @const {!PurchaseData} */
+    this.purchaseData = purchaseDataList[0];
+    /** @private @const {function():!Promise} */
+    this.completeHandler_ = completeHandler;
   }
 
   /**
-   * @param {!CallbackId} id
-   * @param {*} data
-   * @return {boolean}
-   * @private
+   * @return {!DeferredAccountCreationResponse}
    */
-  trigger_(id, data) {
-    this.resultBuffer_[id] = data;
-    const callback = this.callbacks_[id];
-    if (callback) {
-      this.executeCallback_(id, callback, data);
-    }
-    return !!callback;
+  clone() {
+    return new DeferredAccountCreationResponse(
+        this.entitlements,
+        this.userData,
+        this.purchaseDataList,
+        this.completeHandler_);
   }
 
   /**
-   * @param {!CallbackId} id
-   * @private
+   * @return {!Object}
    */
-  resetCallback_(id) {
-    if (id in this.resultBuffer_) {
-      delete this.resultBuffer_[id];
-    }
+  json() {
+    return {
+      'entitlements': this.entitlements.json(),
+      'userData': this.userData.json(),
+      'purchaseDataList': this.purchaseDataList.map(pd => pd.json()),
+      // TODO(dvoytenko): deprecate.
+      'purchaseData': this.purchaseData.json(),
+    };
   }
 
   /**
-   * @param {!CallbackId} id
-   * @param {function(*)} callback
-   * @param {*} data
-   * @private
+   * Allows the receiving site to complete/acknowledge that it registered
+   * the subscription info. The typical action would be to create an
+   * account (or match an existing one) and associated the subscription with
+   * that account.
+   *
+   * SwG will display progress indicator until this method is called and
+   * upon receiving this call will show the confirmation to the user.
+   * The promise returned by this method will yield once the user closes
+   * the confirmation.
+   *
+   * @return {!Promise}
    */
-  executeCallback_(id, callback, data) {
-    // Always execute callbacks in a microtask.
-    Promise.resolve().then(() => {
-      callback(data);
-      this.resetCallback_(id);
-    });
+  complete() {
+    return this.completeHandler_();
   }
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -4910,56 +4941,185 @@ class Callbacks {
  */
 
 /**
- * abstract View Class. Used to render the content within the Dialog. The
- * extended class has actual content.
- * @abstract
+ * @enum {string}
  */
-class View {
+const SubscriptionState = {
+  // user's subscription state not known.
+  UNKNOWN: 'unknown',
+  // user is not a subscriber.
+  NON_SUBSCRIBER: 'non_subscriber',
+  // user is a subscriber.
+  SUBSCRIBER: 'subscriber',
+  // user's subscription has expired.
+  PAST_SUBSCRIBER: 'past_subscriber',
+};
+
+/**
+ * Subscription related events. Listed below are enum strings that
+ * represent events related to Subscription flow. Event parameters
+ * that provide more context about the event are sent as a JSON
+ * block of depth 1 in the sendEvent() API call.
+ * @enum {string}
+ */
+const Event = {
   /**
-   * Empty constructor.
+   * IMPRESSION_PAYWALL event.
+   * User hits a paywall.
+   * Every impression should be qualified as active or passive.
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true or false to indicate this.
+   * If the user has run out of metering, and that’s why was shown
+   * a paywall, that would be a passive impression of the paywall.
+   * For example:
+   * const propensityEvent = {
+   *  name: 'paywall',
+   *  active: false,
+   * }
    */
-  constructor() {}
-
+  IMPRESSION_PAYWALL: 'paywall',
   /**
-   * Gets the iframe element.
-   * @return {!Element}
-   * @abstract
+   * IMPRESSION_AD event.
+   * User has been shown a subscription ad.
+   * Every impression should be qualified as active or passive.
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true or false to indicate this.
+   * The JSON block can provide the name of the subscription ad
+   * creative or campaign. Ad impressions are usually passive.
+   * const propensityEvent = {
+   *   name: 'ad_shown',
+   *   active: false,
+   *   data: {'ad_name': 'fall_ad'}
+   * }
    */
-  getElement() {}
-
+  IMPRESSION_AD: 'ad_shown',
   /**
-   * @param {!./dialog.Dialog} unusedDialog
-   * @return {!Promise}
-   * @abstract
+   * IMPRESSION_OFFERS event.
+   * User has been shown a list of available offers for subscription.
+   * Every impression should be qualified as active or passive.
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true or false to indicate this.
+   * The JSON block can provide a list of products displayed,
+   * and the source to indicate why the user was shown the offer.
+   * Note: source is not the same as referrer.
+   * In the cases below, the user took action before seeing the offers,
+   * and therefore considered active impression.
+   * For example:
+   * const propensityEvent = {
+   *   name: 'offers_shown',
+   *   active: true,
+   *   data: {'offers': ['basic-monthly', 'premium-weekly'],
+   *           'source': 'ad-click'}
+   * }
+   * For example:
+   * const propensityEvent = {
+   *   name: 'offers_shown',
+   *   active: true,
+   *   data: {'offers': ['basic-monthly', 'premium-weekly'],
+   *           'source': ‘navigate-to-offers-page’}
+   * }
+   * If the user was shown the offers as a result of paywall metering
+   * expiration, it is considered a passive impression.
+   * For example:
+   * const propensityEvent = {
+   *   name: 'offers_shown',
+   *   active: false,
+   *   data: {'offers': ['basic-monthly', 'premium-weekly'],
+   *           'source': ‘paywall-metering-expired’}
+   * }
+   */
+  IMPRESSION_OFFERS: 'offers_shown',
+  /**
+   * ACTION_SUBSCRIPTIONS_LANDING_PAGE event.
+   * User has taken the action to arrive at a landing page of the
+   * subscription workflow. The landing page should satisfy one of
+   * the following conditions and hence be a part of the funnel to
+   * get the user to subscribe:
+   * - have a button to navigate the user to an offers page, (in
+   *   this case, the next event will be IMPRESSION_OFFERS, with
+   *   parameter 'source' as subscriptions-landing-page and
+   *   'is_active' set to true),
+   * - show offers the user can select, (in this case, the next
+   *   event will be IMPRESSION_OFFERS, with a parameter 'source'
+   *   as navigate-to-offers-page and 'is_active' set to true),
+   * - provide a way to start the payment flow for a specific offer.
+   *   (in this case, the next event will be ACTION_OFFER_SELECTED
+   *   or ACTION_PAYMENT_FLOW_STARTED depending on if that button
+   *   took the user to a checkout page on the publishers site or
+   *   directly started the payment flow).
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true since this is a user action.
+   * The JSON block with this event can provide additional information
+   * such as the source, indicating what caused the user to navigate
+   * to this page.
+   * For example:
+   * const propensityEvent = {
+   *   name: 'subscriptions_landing_page',
+   *   active: true,
+   *   data: {'source': 'marketing_via_email'}
+   * }
    */
-  init(unusedDialog) {}
-
+  ACTION_SUBSCRIPTIONS_LANDING_PAGE: 'subscriptions_landing_page',
   /**
-   * Resizes the content.
+   * ACTION_OFFER_SELECTED event.
+   * User has selected an offer.
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true since this is a user action.
+   * The JSON block can provide the product selected.
+   * For example: {
+   *   name: 'offer_selected',
+   *   active: true,
+   *   data: {product': 'basic-monthly'}
+   * }
+   * When offer selection starts the payment flow directly,
+   * use the next event ACTION_PAYMENT_FLOW_STARTED instead.
    */
-  resized() {
-    // Do nothing by default. Override if needed.
-  }
-
+  ACTION_OFFER_SELECTED: 'offer_selected',
   /**
-   * Accept the result.
-   * @return {!Promise}
-   * @abstract
+   * ACTION_PAYMENT_FLOW_STARTED event.
+   * User has started payment flow.
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true since this is a user action.
+   * The JSON block can provide the product selected.
+   * For example:
+   * const propensityEvent = {
+   *   name: 'payment_flow_started',
+   *   active: true,
+   *   data: {product': 'basic-monthly'}
+   * }
    */
-  whenComplete() {}
-
+  ACTION_PAYMENT_FLOW_STARTED: 'payment_flow_start',
   /**
-   * @return {boolean}
-   * @abstract
+   * ACTION_PAYMENT_COMPLETED.
+   * User has made the payment for a subscription.
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true since this is a user action.
+   * The JSON block can provide the product user paid for.
+   * For example:
+   * const propensityEvent = {
+   *   name: 'payment_complete',
+   *   active: true,
+   *   data: {product': 'basic-monthly'}
+   * }
    */
-  shouldFadeBody() {}
-
+  ACTION_PAYMENT_COMPLETED: 'payment_complete',
   /**
-   * @return {boolean}
-   * @abstract
+   * EVENT_CUSTOM: custom publisher event.
+   * The field 'active' of PropensityEvent, which carries this
+   * event, must be set to true or false depending on if the event
+   * was generated as a result of a user action.
+   * The JSON block can provide the event name for the custom event.
+   * For example:
+   * const propensityEvent = {
+   *   name: 'custom',
+   *   active: true,
+   *   data: {
+   *     'event_name': 'social_share',
+   *     'platform_used': 'whatsapp'
+   *   }
+   *  }
    */
-  hasLoadingIndicator() {}
-}
+  EVENT_CUSTOM: 'custom',
+};
 
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
@@ -4978,39 +5138,14 @@ class View {
  */
 
 /**
- * Whether the specified error is an AbortError type.
- * See https://heycam.github.io/webidl/#aborterror.
- * @param {*} error
- * @return {boolean}
- */
-function isCancelError(error) {
-  return activityPorts_12(error);
-}
-
-/**
- * Creates or emulates a DOMException of AbortError type.
- * See https://heycam.github.io/webidl/#aborterror.
- * @param {!Window} win
- * @param {string=} message
- * @return {!DOMException}
- */
-function createCancelError(win, message) {
-  return activityPorts_11(win, message);
-}
-
-/**
- * A set of error utilities combined in a class to allow easy stubbing in tests.
+ * @enum {string}
  */
-class ErrorUtils {
-  /**
-   * @param {!Error} error
-   */
-  static throwAsync(error) {
-    setTimeout(() => {
-      throw error;
-    });
-  }
-}
+const PropensityType = {
+  // Propensity score for a user to subscribe to a publication.
+  GENERAL: 'general',
+  // Propensity score when blocked access to content by paywall.
+  PAYWALL: 'paywall',
+};
 
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
@@ -5028,249 +5163,215 @@ class ErrorUtils {
  * limitations under the License.
  */
 
+/** @enum {string} */
+const SubscriptionFlows = {
+  SHOW_OFFERS: 'showOffers',
+  SHOW_SUBSCRIBE_OPTION: 'showSubscribeOption',
+  SHOW_ABBRV_OFFER: 'showAbbrvOffer',
+  SHOW_CONTRIBUTION_OPTIONS: 'showContributionOptions',
+  SUBSCRIBE: 'subscribe',
+  CONTRIBUTE: 'contribute',
+  COMPLETE_DEFERRED_ACCOUNT_CREATION: 'completeDeferredAccountCreation',
+  LINK_ACCOUNT: 'linkAccount',
+  SHOW_LOGIN_PROMPT: 'showLoginPrompt',
+  SHOW_LOGIN_NOTIFICATION: 'showLoginNotification',
+};
+
 /**
- * @param {!../components/activities.ActivityPortDef} port
- * @param {string} requireOrigin
- * @param {boolean} requireOriginVerified
- * @param {boolean} requireSecureChannel
- * @return {!Promise<!Object>}
+ * @enum {number}
  */
-function acceptPortResultData(
-  port,
-  requireOrigin,
-  requireOriginVerified,
-  requireSecureChannel
-) {
-  return port.acceptResult().then(result => {
-    if (
-      result.origin != requireOrigin ||
-      (requireOriginVerified && !result.originVerified) ||
-      (requireSecureChannel && !result.secureChannel)
-    ) {
-      throw new Error('channel mismatch');
-    }
-    return result.data;
-  });
-}
+const AnalyticsMode = {
+  DEFAULT: 0,
+  IMPRESSIONS: 1,
+};
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @enum {string}
  */
-
-/** @const {!Object<string, string>} */
-const iframeAttributes$1 = {
-  'frameborder': '0',
-  'scrolling': 'no',
+const WindowOpenMode = {
+  AUTO: 'auto',
+  REDIRECT: 'redirect',
 };
 
 /**
- * Class to build and render Activity iframe view.
+ * The Offers/Contributions UI is rendered differently based on the
+ * ProductType. The ProductType parameter is passed to the Payments flow, and
+ * then passed back to the Payments confirmation page to render messages/text
+ * based on the ProductType.
+ * @enum {string}
  */
-class ActivityIframeView extends View {
-  /**
-   * @param {!Window} win
-   * @param {!../components/activities.ActivityPorts} activityPorts
-   * @param {string} src
-   * @param {!Object<string, ?>=} args
-   * @param {boolean=} shouldFadeBody
-   * @param {boolean=} hasLoadingIndicator
-   */
-  constructor(
-    win,
-    activityPorts,
-    src,
-    args,
-    shouldFadeBody = false,
-    hasLoadingIndicator = false
-  ) {
-    super();
-
-    /** @private @const {!Window} */
-    this.win_ = win;
-
-    /** @private @const {!Document} */
-    this.doc_ = this.win_.document;
-
-    /** @private @const {!HTMLIFrameElement} */
-    this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
-      this.doc_,
-      'iframe',
-      iframeAttributes$1
-    ));
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = activityPorts;
-
-    /** @private @const {string} */
-    this.src_ = src;
-
-    /** @private @const {!Object<string, ?>} */
-    this.args_ = args || {};
-
-    /** @private @const {boolean} */
-    this.shouldFadeBody_ = shouldFadeBody;
-
-    /** @private @const {boolean} */
-    this.hasLoadingIndicator_ = hasLoadingIndicator;
-
-    /** @private {?../components/activities.ActivityIframePort} */
-    this.port_ = null;
-
-    /**
-     * @private
-     * {?function<!web-activities/activity-ports.ActivityIframePort|!Promise>}
-     */
-    this.portResolver_ = null;
+const ProductType = {
+  SUBSCRIPTION: 'SUBSCRIPTION',
+  UI_CONTRIBUTION: 'UI_CONTRIBUTION',
+};
 
-    /**
-     * @private @const
-     * {!Promise<!web-activities/activity-ports.ActivityIframePort>}
-     */
-    this.portPromise_ = new Promise(resolve => {
-      this.portResolver_ = resolve;
-    });
-  }
+/**
+ * @return {!Config}
+ */
+function defaultConfig() {
+  return {
+    windowOpenMode: WindowOpenMode.AUTO,
+    analyticsMode: AnalyticsMode.DEFAULT,
+    enableSwgAnalytics: false,
+    enablePropensity: false,
+  };
+}
 
-  /** @override */
-  getElement() {
-    return this.iframe_;
-  }
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-  /** @override */
-  init(dialog) {
-    return this.activityPorts_
-      .openIframe(this.iframe_, this.src_, this.args_)
-      .then(port => this.onOpenIframeResponse_(port, dialog));
-  }
+/**
+ * Cached a-tag to avoid memory allocation during URL parsing.
+ * @type {HTMLAnchorElement}
+ */
+let a;
 
-  /**
-   * Returns if document should fade for this view.
-   * @return {boolean}
-   */
-  shouldFadeBody() {
-    return this.shouldFadeBody_;
-  }
+/**
+ * We cached all parsed URLs. As of now there are no use cases
+ * of AMP docs that would ever parse an actual large number of URLs,
+ * but we often parse the same one over and over again.
+ * @type {Object<string, !LocationDef>}
+ */
+let cache;
 
-  /**
-   * Returns if the view shows loading indicator.
-   * @return {boolean}
-   */
-  hasLoadingIndicator() {
-    return this.hasLoadingIndicator_;
+/**
+ * Returns a Location-like object for the given URL. If it is relative,
+ * the URL gets resolved.
+ * Consider the returned object immutable. This is enforced during
+ * testing by freezing the object.
+ * @param {string} url
+ * @return {!LocationDef}
+ */
+function parseUrl$1(url) {
+  if (!a) {
+    a = /** @type {!HTMLAnchorElement} */ (self.document.createElement('a'));
+    cache = self.UrlCache || (self.UrlCache = Object.create(null));
   }
 
-  /**
-   * @param {!../components/activities.ActivityIframePort} port
-   * @param {!../components/dialog.Dialog} dialog
-   * @return {!Promise}
-   */
-  onOpenIframeResponse_(port, dialog) {
-    this.port_ = port;
-    this.portResolver_(port);
+  const fromCache = cache[url];
+  if (fromCache) {
+    return fromCache;
+  }
 
-    this.port_.onResizeRequest(height => {
-      dialog.resizeView(this, height);
-    });
+  const info = parseUrlWithA(a, url);
 
-    return this.port_.whenReady();
-  }
+  return (cache[url] = info);
+}
 
-  /**
-   * @return {!Promise<!../components/activities.ActivityIframePort>}
-   * @private
-   */
-  getPortPromise_() {
-    return this.portPromise_;
-  }
+/**
+ * Returns a Location-like object for the given URL. If it is relative,
+ * the URL gets resolved.
+ * @param {!HTMLAnchorElement} a
+ * @param {string} url
+ * @return {!LocationDef}
+ */
+function parseUrlWithA(a, url) {
+  a.href = url;
 
-  /**
-   * @param {!function(new: T)}  message
-   * @param {function(../proto/api_messages.Message)} callback
-   * @template T
-   */
-  on(message, callback) {
-    this.getPortPromise_().then(port => {
-      port.on(message, callback);
-    });
+  // IE11 doesn't provide full URL components when parsing relative URLs.
+  // Assigning to itself again does the trick.
+  if (!a.protocol) {
+    a.href = a.href;
   }
 
-  /**
-   * @param {!../proto/api_messages.Message} request
-   */
-  execute(request) {
-    this.getPortPromise_().then(port => {
-      port.execute(request);
-    });
-  }
+  /** @type {!LocationDef} */
+  const info = {
+    href: a.href,
+    protocol: a.protocol,
+    host: a.host,
+    hostname: a.hostname,
+    port: a.port == '0' ? '' : a.port,
+    pathname: a.pathname,
+    search: a.search,
+    hash: a.hash,
+    origin: '', // Set below.
+  };
 
-  /**
-   * Accepts results from the caller.
-   * @return {!Promise<!web-activities/activity-ports.ActivityResult>}
-   */
-  acceptResult() {
-    return this.getPortPromise_().then(port => port.acceptResult());
+  // Some IE11 specific polyfills.
+  // 1) IE11 strips out the leading '/' in the pathname.
+  if (info.pathname[0] !== '/') {
+    info.pathname = '/' + info.pathname;
   }
 
-  /**
-   * Accepts results from the caller and verifies origin.
-   * @param {string} requireOrigin
-   * @param {boolean} requireOriginVerified
-   * @param {boolean} requireSecureChannel
-   * @return {!Promise<!Object>}
-   */
-  acceptResultAndVerify(
-    requireOrigin,
-    requireOriginVerified,
-    requireSecureChannel
+  // 2) For URLs with implicit ports, IE11 parses to default ports while
+  // other browsers leave the port field empty.
+  if (
+    (info.protocol == 'http:' && info.port == 80) ||
+    (info.protocol == 'https:' && info.port == 443)
   ) {
-    return this.getPortPromise_().then(port => {
-      return acceptPortResultData(
-        port,
-        requireOrigin,
-        requireOriginVerified,
-        requireSecureChannel
-      );
-    });
+    info.port = '';
+    info.host = info.hostname;
   }
 
-  /**
-   * Completes the flow.
-   * @return {!Promise}
-   */
-  whenComplete() {
-    return this.acceptResult();
+  // For data URI a.origin is equal to the string 'null' which is not useful.
+  // We instead return the actual origin which is the full URL.
+  if (a.origin && a.origin != 'null') {
+    info.origin = a.origin;
+  } else if (info.protocol == 'data:' || !info.host) {
+    info.origin = info.href;
+  } else {
+    info.origin = info.protocol + '//' + info.host;
   }
+  return info;
+}
 
-  /**
-   * @param {function()} callback
-   */
-  onCancel(callback) {
-    this.acceptResult().catch(reason => {
-      if (isCancelError(reason)) {
-        callback();
-      }
-      throw reason;
-    });
+/**
+ * Parses and builds Object of URL query string.
+ * @param {string} query The URL query string.
+ * @return {!Object<string, string>}
+ */
+function parseQueryString$1(query) {
+  if (!query) {
+    return {};
   }
+  return (/^[?#]/.test(query) ? query.slice(1) : query)
+    .split('&')
+    .reduce((params, param) => {
+      const item = param.split('=');
+      const key = decodeURIComponent(item[0] || '');
+      const value = decodeURIComponent(item[1] || '');
+      if (key) {
+        params[key] = value;
+      }
+      return params;
+    }, {});
+}
 
-  /** @override */
-  resized() {
-    if (this.port_) {
-      this.port_.resized();
-    }
+/**
+ * Adds a parameter to a query string.
+ * @param {string} url
+ * @param {string} param
+ * @param {string} value
+ * @return {string}
+ */
+function addQueryParam(url, param, value) {
+  const queryIndex = url.indexOf('?');
+  const fragmentIndex = url.indexOf('#');
+  let fragment = '';
+  if (fragmentIndex != -1) {
+    fragment = url.substring(fragmentIndex);
+    url = url.substring(0, fragmentIndex);
+  }
+  if (queryIndex == -1) {
+    url += '?';
+  } else if (queryIndex < url.length - 1) {
+    url += '&';
   }
+  url += encodeURIComponent(param) + '=' + encodeURIComponent(value);
+  return url + fragment;
 }
 
 /**
@@ -5290,187 +5391,93 @@ class ActivityIframeView extends View {
  */
 
 /**
- * Character mapping from base64url to base64.
- * @const {!Object<string, string>}
- */
-const base64UrlDecodeSubs = {'-': '+', '_': '/', '.': '='};
-
-/**
- * Converts a string which holds 8-bit code points, such as the result of atob,
- * into a Uint8Array with the corresponding bytes.
- * If you have a string of characters, you probably want to be using utf8Encode.
- * @param {string} str
- * @return {!Uint8Array}
+ * Have to put these in the map to avoid compiler optimization. Due to
+ * optimization issues, this map only allows property-style keys. E.g. "hr1",
+ * as opposed to "1hr".
+ * @type {!Object<string, number>}
+ * @package Visible for testing only.
  */
-function stringToBytes(str) {
-  const bytes = new Uint8Array(str.length);
-  for (let i = 0; i < str.length; i++) {
-    const charCode = str.charCodeAt(i);
-    log_2(charCode <= 255, 'Characters must be in range [0,255]');
-    bytes[i] = charCode;
-  }
-  return bytes;
-}
+const CACHE_KEYS = {
+  'nocache': 1,
+  'hr1': 3600000, // 1hr = 1000 * 60 * 60
+  'hr12': 43200000, // 12hr = 1000 * 60 * 60 * 12
+};
 
 /**
- * Converts a 8-bit bytes array into a string
- * @param {!Uint8Array} bytes
  * @return {string}
  */
-function bytesToString(bytes) {
-  // Intentionally avoids String.fromCharCode.apply so we don't suffer a
-  // stack overflow. #10495, https://jsperf.com/bytesToString-2
-  const array = new Array(bytes.length);
-  for (let i = 0; i < bytes.length; i++) {
-    array[i] = String.fromCharCode(bytes[i]);
-  }
-  return array.join('');
+function feOrigin() {
+  return parseUrl$1('https://news.google.com').origin;
 }
 
 /**
- * Interpret a byte array as a UTF-8 string.
- * @param {!BufferSource} bytes
- * @return {string}
+ * @param {string} url Relative URL, e.g. "/service1".
+ * @return {string} The complete URL.
  */
-function utf8DecodeSync(bytes) {
-  if (typeof TextDecoder !== 'undefined') {
-    return new TextDecoder('utf-8').decode(bytes);
-  }
-  const asciiString = bytesToString(new Uint8Array(bytes.buffer || bytes));
-  return decodeURIComponent(escape(asciiString));
+function serviceUrl(url) {
+  return 'https://news.google.com/swg/_/api/v1' + url;
 }
 
 /**
- * Turn a string into UTF-8 bytes.
- * @param {string} string
- * @return {!Uint8Array}
+ * @param {string} url  Relative URL, e.g. "/service1".
+ * @return {string} The complete URL.
  */
-function utf8EncodeSync(string) {
-  if (typeof TextEncoder !== 'undefined') {
-    return new TextEncoder('utf-8').encode(string);
-  }
-  return stringToBytes(unescape(encodeURIComponent(string)));
+function adsUrl(url) {
+  return 'https://pubads.g.doubleclick.net' + url;
 }
 
 /**
- * Converts a string which is in base64url encoding into a Uint8Array
- * containing the decoded value.
- * @param {string} str
- * @return {!Uint8Array}
+ * @param {string} url Relative URL, e.g. "/offersiframe".
+ * @param {string=} prefix
+ * @return {string} The complete URL.
  */
-function base64UrlDecodeToBytes(str) {
-  const encoded = atob(str.replace(/[-_.]/g, ch => base64UrlDecodeSubs[ch]));
-  return stringToBytes(encoded);
-}
+function feUrl(url, prefix = '') {
+  // Add cache param.
+  url = feCached('https://news.google.com' + prefix + '/swg/_/ui/v1' + url);
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+  // Optionally add jsmode param. This allows us to test against "aggressively" compiled Boq JS.
+  const query = parseQueryString$1(self.location.hash);
+  const boqJsMode = query['swg.boqjsmode'];
+  if (boqJsMode !== undefined) {
+    url = addQueryParam(url, 'jsmode', boqJsMode);
+  }
 
-/**
- * Simple wrapper around JSON.parse that casts the return value
- * to JsonObject.
- * Create a new wrapper if an array return value is desired.
- * @param {*} json JSON string to parse
- * @return {?JsonObject|undefined} May be extend to parse arrays.
- */
-function parseJson(json) {
-  return /** @type {?JsonObject} */ (JSON.parse(/** @type {string} */ (json)));
+  return url;
 }
 
 /**
- * Parses the given `json` string without throwing an exception if not valid.
- * Returns `undefined` if parsing fails.
- * Returns the `Object` corresponding to the JSON string when parsing succeeds.
- * @param {*} json JSON string to parse
- * @param {function(!Error)=} onFailed Optional function that will be called
- *     with the error if parsing fails.
- * @return {?JsonObject|undefined} May be extend to parse arrays.
+ * @param {string} url FE URL.
+ * @return {string} The complete URL including cache param.
  */
-function tryParseJson(json, onFailed) {
-  try {
-    return parseJson(json);
-  } catch (e) {
-    if (onFailed) {
-      onFailed(e);
-    }
-    return undefined;
-  }
+function feCached(url) {
+  return addQueryParam(url, '_', cacheParam('hr1'));
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @param {!Object<string, ?>} args
+ * @return {!Object<string, ?>}
  */
+function feArgs(args) {
+  return Object.assign(args, {
+    '_client': 'SwG 0.1.22.91',
+  });
+}
 
 /**
- * Provides helper methods to decode and verify JWT tokens.
+ * @param {string} cacheKey
+ * @return {string}
+ * @package Visible for testing only.
  */
-class JwtHelper {
-  constructor() {}
-
-  /**
-   * Decodes JWT token and returns its payload.
-   * @param {string} encodedToken
-   * @return {?JsonObject|undefined}
-   */
-  decode(encodedToken) {
-    return this.decodeInternal_(encodedToken).payload;
+function cacheParam(cacheKey) {
+  let period = CACHE_KEYS[cacheKey];
+  if (period == null) {
+    period = 1;
   }
-
-  /**
-   * @param {string} encodedToken
-   * @return {!JwtTokenInternalDef}
-   * @private
-   */
-  decodeInternal_(encodedToken) {
-    // See https://jwt.io/introduction/
-    /**
-     * Throws error about invalid token.
-     */
-    function invalidToken() {
-      throw new Error(`Invalid token: "${encodedToken}"`);
-    }
-
-    // Encoded token has three parts: header.payload.sig
-    // Note! The padding is not allowed by JWT spec:
-    // http://self-issued.info/docs/draft-goland-json-web-token-00.html#rfc.section.5
-    const parts = encodedToken.split('.');
-    if (parts.length != 3) {
-      invalidToken();
-    }
-    const headerUtf8Bytes = base64UrlDecodeToBytes(parts[0]);
-    const payloadUtf8Bytes = base64UrlDecodeToBytes(parts[1]);
-    return {
-      header: tryParseJson(utf8DecodeSync(headerUtf8Bytes), invalidToken),
-      payload: tryParseJson(utf8DecodeSync(payloadUtf8Bytes), invalidToken),
-      verifiable: `${parts[0]}.${parts[1]}`,
-      sig: parts[2],
-    };
+  if (period === 0) {
+    return '_';
   }
+  const now = Date.now();
+  return String(period <= 1 ? now : Math.floor(now / period));
 }
 
 /**
@@ -5487,327 +5494,480 @@ class JwtHelper {
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
+ *
+ * The Flow goes like this:
+ * a. Start Payments
+ * b. Complete Payments
+ * c. Create Account
+ * d. Acknowledge Account
+ *
+ * In other words, Flow = Payments + Account Creation.
  */
 
 /**
- * The holder of the entitlements for a service.
+ * String values input by the publisher are mapped to the number values.
+ * @type {!Object<string, number>}
  */
-class Entitlements {
-  /**
-   * @param {string} service
-   * @param {string} raw
-   * @param {!Array<!Entitlement>} entitlements
-   * @param {?string} currentProduct
-   * @param {function(!Entitlements)} ackHandler
-   * @param {?boolean|undefined} isReadyToPay
-   * @param {?string|undefined} decryptedDocumentKey
-   */
-  constructor(
-    service,
-    raw,
-    entitlements,
-    currentProduct,
-    ackHandler,
-    isReadyToPay,
-    decryptedDocumentKey
-  ) {
-    /** @const {string} */
-    this.service = service;
-    /** @const {string} */
-    this.raw = raw;
-    /** @const {!Array<!Entitlement>} */
-    this.entitlements = entitlements;
-    /** @const {boolean} */
-    this.isReadyToPay = isReadyToPay || false;
-    /** @const {?string} */
-    this.decryptedDocumentKey = decryptedDocumentKey || null;
-
-    /** @private @const {?string} */
-    this.product_ = currentProduct;
-    /** @private @const {function(!Entitlements)} */
-    this.ackHandler_ = ackHandler;
-  }
+const ReplaceSkuProrationModeMapping = {
+  // The replacement takes effect immediately, and the remaining time will
+  // be prorated and credited to the user. This is the current default
+  // behavior.
+  'IMMEDIATE_WITH_TIME_PRORATION': 1,
+};
 
-  /**
-   * @return {!Entitlements}
-   */
-  clone() {
-    return new Entitlements(
-      this.service,
-      this.raw,
-      this.entitlements.map(ent => ent.clone()),
-      this.product_,
-      this.ackHandler_,
-      this.isReadyToPay,
-      this.decryptedDocumentKey
-    );
-  }
+const RecurrenceMapping = {
+  'AUTO': 1,
+  'ONE_TIME': 2,
+};
 
-  /**
-   * @return {!Object}
-   */
-  json() {
-    return {
-      'service': this.service,
-      'entitlements': this.entitlements.map(item => item.json()),
-      'isReadyToPay': this.isReadyToPay,
-    };
-  }
+/**
+ * @param {string} sku
+ * @return {!EventParams}
+ */
+function getEventParams(sku) {
+  return new EventParams([, , , , sku]);
+}
 
+/**
+ * The flow to initiate payment process.
+ */
+class PayStartFlow {
   /**
-   * @param {string=} source
-   * @return {boolean}
+   * @param {!./deps.DepsDef} deps
+   * @param {!../api/subscriptions.SubscriptionRequest} subscriptionRequest
+   * @param {!../api/subscriptions.ProductType} productType
    */
-  enablesThis(source) {
-    return this.enables(this.product_, source);
-  }
+  constructor(
+    deps,
+    subscriptionRequest,
+    productType = ProductType.SUBSCRIPTION
+  ) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
 
-  /**
-   * @param {string=} source
-   * @return {boolean}
-   */
-  enablesAny(source) {
-    for (let i = 0; i < this.entitlements.length; i++) {
-      if (
-        this.entitlements[i].products.length > 0 &&
-        (!source || source == this.entitlements[i].source)
-      ) {
-        return true;
-      }
-    }
-    return false;
+    /** @private @const {!./pay-client.PayClient} */
+    this.payClient_ = deps.payClient();
+
+    /** @private @const {!../model/page-config.PageConfig} */
+    this.pageConfig_ = deps.pageConfig();
+
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
+
+    /** @private @const {!../api/subscriptions.SubscriptionRequest} */
+    this.subscriptionRequest_ = subscriptionRequest;
+
+    /**@private @const {!ProductType} */
+    this.productType_ = productType;
+
+    /** @private @const {!../runtime/analytics-service.AnalyticsService} */
+    this.analyticsService_ = deps.analytics();
+
+    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
+    this.eventManager_ = deps.eventManager();
   }
 
   /**
-   * Whether these entitlements enable the specified product, optionally also
-   * restricting the source.
-   * @param {?string} product
-   * @param {string=} source
-   * @return {boolean}
+   * Starts the payments flow.
+   * @return {!Promise}
    */
-  enables(product, source) {
-    if (!product) {
-      return false;
+  start() {
+    // Add the 'publicationId' key to the subscriptionRequest_ object.
+    const swgPaymentRequest = Object.assign({}, this.subscriptionRequest_, {
+      'publicationId': this.pageConfig_.getPublicationId(),
+    });
+
+    // Map the proration mode to the enum value (if proration exists).
+    const prorationMode = swgPaymentRequest['replaceSkuProrationMode'];
+    if (prorationMode) {
+      swgPaymentRequest['replaceSkuProrationMode'] =
+        ReplaceSkuProrationModeMapping[prorationMode];
+    } else if (swgPaymentRequest['oldSku']) {
+      swgPaymentRequest['replaceSkuProrationMode'] =
+        ReplaceSkuProrationModeMapping['IMMEDIATE_WITH_TIME_PRORATION'];
+    }
+    // Assign one-time recurrence enum if applicable
+    if (swgPaymentRequest['oneTime']) {
+      swgPaymentRequest['paymentRecurrence'] = RecurrenceMapping['ONE_TIME'];
+      delete swgPaymentRequest['oneTime'];
     }
-    return !!this.getEntitlementFor(product, source);
-  }
 
-  /**
-   * Returns the first matching entitlement for the current product,
-   * optionally also matching the specified source.
-   * @param {string=} source
-   * @return {?Entitlement}
-   */
-  getEntitlementForThis(source) {
-    return this.getEntitlementFor(this.product_, source);
-  }
+    // Start/cancel events.
+    const flow =
+      this.productType_ == ProductType.UI_CONTRIBUTION
+        ? SubscriptionFlows.CONTRIBUTE
+        : SubscriptionFlows.SUBSCRIBE;
 
-  /**
-   * Returns the first matching entitlement for the specified product,
-   * optionally also matching the specified source.
-   * @param {?string} product
-   * @param {string=} source
-   * @return {?Entitlement}
-   */
-  getEntitlementFor(product, source) {
-    if (product && this.entitlements.length > 0) {
-      for (let i = 0; i < this.entitlements.length; i++) {
-        if (
-          this.entitlements[i].enables(product) &&
-          (!source || source == this.entitlements[i].source)
-        ) {
-          return this.entitlements[i];
-        }
-      }
+    this.deps_.callbacks().triggerFlowStarted(flow, this.subscriptionRequest_);
+    if (swgPaymentRequest['oldSku']) {
+      this.analyticsService_.setSku(swgPaymentRequest['oldSku']);
     }
-    return null;
+    this.eventManager_.logSwgEvent(
+      AnalyticsEvent.ACTION_PAYMENT_FLOW_STARTED,
+      true,
+      getEventParams(swgPaymentRequest['skuId'])
+    );
+    PayCompleteFlow.waitingForPayClient_ = true;
+    this.payClient_.start(
+      /** @type {!PaymentDataRequest} */
+      ({
+        'apiVersion': 1,
+        'allowedPaymentMethods': ['CARD'],
+        'environment': 'PRODUCTION',
+        'playEnvironment': 'PROD',
+        'swg': swgPaymentRequest,
+        'i': {
+          'startTimeMs': Date.now(),
+          'productType': this.productType_,
+        },
+      }),
+      {
+        forceRedirect:
+          this.deps_.config().windowOpenMode == WindowOpenMode.REDIRECT,
+      }
+    );
+    return Promise.resolve();
   }
+}
 
+/**
+ * The flow for successful payments completion.
+ */
+class PayCompleteFlow {
   /**
-   * Returns the first matching entitlement for the specified source w/o
-   * matching any specific products.
-   * @param {string} source
-   * @return {?Entitlement}
+   * @param {!./deps.DepsDef} deps
    */
-  getEntitlementForSource(source) {
-    if (this.entitlements.length > 0) {
-      for (let i = 0; i < this.entitlements.length; i++) {
-        if (
-          this.entitlements[i].subscriptionToken &&
-          source == this.entitlements[i].source
-        ) {
-          return this.entitlements[i];
+  static configurePending(deps) {
+    /** @const @type {./client-event-manager.ClientEventManager} */
+    const eventManager = deps.eventManager();
+
+    deps.payClient().onResponse(payPromise => {
+      deps.entitlementsManager().blockNextNotification();
+      const flow = new PayCompleteFlow(deps);
+      const promise = validatePayResponse(
+        deps,
+        payPromise,
+        flow.complete.bind(flow)
+      );
+      deps.callbacks().triggerPaymentResponse(promise);
+      return promise.then(
+        response => {
+          const sku = parseSkuFromPurchaseDataSafe(response.purchaseData);
+          deps.analytics().setSku(sku || '');
+          eventManager.logSwgEvent(
+            AnalyticsEvent.ACTION_PAYMENT_COMPLETE,
+            true,
+            getEventParams(sku || '')
+          );
+          flow.start(response);
+        },
+        reason => {
+          if (isCancelError(reason)) {
+            const productType = /** @type {!Object} */ (reason)['productType'];
+            const flow =
+              productType == ProductType.UI_CONTRIBUTION
+                ? SubscriptionFlows.CONTRIBUTE
+                : SubscriptionFlows.SUBSCRIBE;
+            deps.callbacks().triggerFlowCanceled(flow);
+            deps
+              .eventManager()
+              .logSwgEvent(AnalyticsEvent.ACTION_USER_CANCELED_PAYFLOW, true);
+          } else {
+            deps
+              .eventManager()
+              .logSwgEvent(AnalyticsEvent.EVENT_PAYMENT_FAILED, false);
+            deps.jserror().error('Pay failed', reason);
+            throw reason;
+          }
         }
-      }
-    }
-    return null;
+      );
+    });
   }
 
   /**
-   * A 3p site should call this method to acknowledge that it "saw" and
-   * "understood" entitlements.
+   * @param {!./deps.DepsDef} deps
    */
-  ack() {
-    this.ackHandler_(this);
-  }
-}
+  constructor(deps) {
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
 
-/**
- * The single entitlement object.
- */
-class Entitlement {
-  /**
-   * @param {string} source
-   * @param {!Array<string>} products
-   * @param {string} subscriptionToken
-   */
-  constructor(source, products, subscriptionToken) {
-    /** @const {string} */
-    this.source = source;
-    /** @const {!Array<string>} */
-    this.products = products;
-    /** @const {string} */
-    this.subscriptionToken = subscriptionToken;
-  }
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
+
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
+
+    /** @private {?ActivityIframeView} */
+    this.activityIframeView_ = null;
+
+    /** @private {?SubscribeResponse} */
+    this.response_ = null;
+
+    /** @private {?Promise} */
+    this.readyPromise_ = null;
+
+    /** @private @const {!../runtime/analytics-service.AnalyticsService} */
+    this.analyticsService_ = deps.analytics();
 
-  /**
-   * @return {!Entitlement}
-   */
-  clone() {
-    return new Entitlement(
-      this.source,
-      this.products.slice(0),
-      this.subscriptionToken
-    );
-  }
+    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
+    this.eventManager_ = deps.eventManager();
 
-  /**
-   * @return {!Object}
-   */
-  json() {
-    return {
-      'source': this.source,
-      'products': this.products,
-      'subscriptionToken': this.subscriptionToken,
-    };
+    /** @private {?string} */
+    this.sku_ = null;
   }
 
   /**
-   * @param {?string} product
-   * @return {boolean}
+   * Starts the payments completion flow.
+   * @param {!SubscribeResponse} response
+   * @return {!Promise}
    */
-  enables(product) {
-    if (!product) {
-      return false;
-    }
-    // Wildcard allows this product.
-    const eq = product.indexOf(':');
-    if (
-      eq != -1 &&
-      this.products.includes(product.substring(0, eq + 1) + '*')
-    ) {
-      return true;
+  start(response) {
+    this.sku_ = parseSkuFromPurchaseDataSafe(response.purchaseData);
+    this.eventManager_.logSwgEvent(
+      AnalyticsEvent.IMPRESSION_ACCOUNT_CHANGED,
+      true,
+      getEventParams(this.sku_ || '')
+    );
+    this.deps_.entitlementsManager().reset(true);
+    this.response_ = response;
+    const args = {
+      'publicationId': this.deps_.pageConfig().getPublicationId(),
+      'productType': this.response_['productType'],
+      'isSubscriptionUpdate': !!this.response_['oldSku'],
+    };
+    // TODO(dvoytenko, #400): cleanup once entitlements is launched everywhere.
+    if (response.userData && response.entitlements) {
+      args['idToken'] = response.userData.idToken;
+      this.deps_
+        .entitlementsManager()
+        .pushNextEntitlements(response.entitlements.raw);
+    } else {
+      args['loginHint'] = response.userData && response.userData.email;
     }
-    return this.products.includes(product);
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/payconfirmiframe'),
+      feArgs(args),
+      /* shouldFadeBody */ true
+    );
+
+    this.activityIframeView_.on(
+      EntitlementsResponse,
+      this.handleEntitlementsResponse_.bind(this)
+    );
+
+    this.activityIframeView_.acceptResult().then(() => {
+      // The flow is complete.
+      this.dialogManager_.completeView(this.activityIframeView_);
+    });
+    this.readyPromise_ = this.dialogManager_.openView(this.activityIframeView_);
+    return this.readyPromise_;
   }
 
   /**
-   * @param {?Object} json
-   * @return {!Entitlement}
+   * @param {!EntitlementsResponse} response
+   * @private
    */
-  static parseFromJson(json) {
-    if (!json) {
-      json = {};
+  handleEntitlementsResponse_(response) {
+    const jwt = response.getJwt();
+    if (jwt) {
+      this.deps_.entitlementsManager().pushNextEntitlements(jwt);
     }
-    const source = json['source'] || '';
-    const products = json['products'] || [];
-    const subscriptionToken = json['subscriptionToken'];
-    return new Entitlement(source, products, subscriptionToken);
   }
 
   /**
-   * The JSON is expected in one of the forms:
-   * - Single entitlement: `{products: [], ...}`.
-   * - A list of entitlements: `[{products: [], ...}, {...}]`.
-   * @param {!Object|!Array<!Object>} json
-   * @return {!Array<!Entitlement>}
+   * @return {!Promise}
    */
-  static parseListFromJson(json) {
-    const jsonList = Array.isArray(json)
-      ? /** @type {!Array<Object>} */ (json)
-      : [json];
-    return jsonList.map(json => Entitlement.parseFromJson(json));
+  complete() {
+    this.eventManager_.logSwgEvent(
+      AnalyticsEvent.ACTION_ACCOUNT_CREATED,
+      true,
+      getEventParams(this.sku_ || '')
+    );
+    this.deps_.entitlementsManager().unblockNextNotification();
+    this.readyPromise_.then(() => {
+      const accountCompletionRequest = new AccountCreationRequest();
+      accountCompletionRequest.setComplete(true);
+      this.activityIframeView_.execute(accountCompletionRequest);
+    });
+    return this.activityIframeView_
+      .acceptResult()
+      .catch(() => {
+        // Ignore errors.
+      })
+      .then(() => {
+        this.eventManager_.logSwgEvent(
+          AnalyticsEvent.ACTION_ACCOUNT_ACKNOWLEDGED,
+          true,
+          getEventParams(this.sku_ || '')
+        );
+        this.deps_.entitlementsManager().setToastShown(true);
+      });
   }
 }
 
+/** @private {boolean} */
+PayCompleteFlow.waitingForPayClient_ = false;
+
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @param {!./deps.DepsDef} deps
+ * @param {!Promise<!Object>} payPromise
+ * @param {function():!Promise} completeHandler
+ * @return {!Promise<!SubscribeResponse>}
  */
+function validatePayResponse(deps, payPromise, completeHandler) {
+  const wasRedirect = !PayCompleteFlow.waitingForPayClient_;
+  PayCompleteFlow.waitingForPayClient_ = false;
+  return payPromise.then(data => {
+    // 1) We log against a random TX ID which is how we track a specific user
+    //    anonymously.
+    // 2) If there was a redirect to gPay, we may have lost our stored TX ID.
+    // 3) Pay service is supposed to give us the TX ID it logged against.
+    let eventType = AnalyticsEvent.UNKNOWN;
+    let eventParams = undefined;
+    if (typeof data !== 'object' || !data['googleTransactionId']) {
+      // If gPay doesn't give us a TX ID it means that something may
+      // be wrong.  If we previously logged then we are at least continuing to
+      // log against the same TX ID.  If we didn't previously log then we have
+      // lost all connection to the events that preceded the payment event and
+      // we at least want to know why that data was lost.
+      eventParams = new EventParams();
+      eventParams.setHadLogged(!wasRedirect);
+      eventType = AnalyticsEvent.EVENT_GPAY_NO_TX_ID;
+    } else {
+      const oldTxId = deps.analytics().getTransactionId();
+      const newTxId = data['googleTransactionId'];
 
+      if (wasRedirect) {
+        // This is the expected case for full redirects.  It may be happening
+        // unexpectedly at other times too though and we want to be aware of
+        // it if it does.
+        deps.analytics().setTransactionId(newTxId);
+        eventType = AnalyticsEvent.EVENT_GPAY_CANNOT_CONFIRM_TX_ID;
+      } else {
+        if (oldTxId === newTxId) {
+          // This is the expected case for non-redirect pay events
+          eventType = AnalyticsEvent.EVENT_CONFIRM_TX_ID;
+        } else {
+          // This is an unexpected case: gPay rejected our TX ID and created
+          // its own.  Log the gPay TX ID but keep our logging consistent.
+          eventParams = new EventParams();
+          eventParams.setGpayTransactionId(newTxId);
+          eventType = AnalyticsEvent.EVENT_CHANGED_TX_ID;
+        }
+      }
+    }
+    deps.eventManager().logSwgEvent(eventType, true, eventParams);
+    return parseSubscriptionResponse(deps, data, completeHandler);
+  });
+}
 
 /**
+ * @param {!./deps.DepsDef} deps
+ * @param {*} data
+ * @param {function():!Promise} completeHandler
+ * @return {!SubscribeResponse}
  */
-class UserData {
-
-  /**
-   * @param {string} idToken
-   * @param {!Object} data
-   */
-  constructor(idToken, data) {
-    /** @const {string} */
-    this.idToken = idToken;
-    /** @const {!Object} */
-    this.data = data;
+function parseSubscriptionResponse(deps, data, completeHandler) {
+  let swgData = null;
+  let raw = null;
+  let productType = ProductType.SUBSCRIPTION;
+  let oldSku = null;
 
-    /** @const {string} */
-    this.id = data['sub'];
-    /** @const {string} */
-    this.email = data['email'];
-    /** @const {boolean} */
-    this.emailVerified = data['email_verified'];
-    /** @const {string} */
-    this.name = data['name'];
-    /** @const {string} */
-    this.givenName = data['given_name'];
-    /** @const {string} */
-    this.familyName = data['family_name'];
-    /** @const {string} */
-    this.pictureUrl = data['picture'];
+  if (data) {
+    if (typeof data == 'string') {
+      raw = /** @type {string} */ (data);
+    } else {
+      // Assume it's a json object in the format:
+      // `{integratorClientCallbackData: "..."}` or `{swgCallbackData: "..."}`.
+      const json = /** @type {!Object} */ (data);
+      if ('swgCallbackData' in json) {
+        swgData = /** @type {!Object} */ (json['swgCallbackData']);
+      } else if ('integratorClientCallbackData' in json) {
+        raw = json['integratorClientCallbackData'];
+      }
+      if ('paymentRequest' in data) {
+        oldSku = (data['paymentRequest']['swg'] || {})['oldSku'];
+        productType =
+          (data['paymentRequest']['i'] || {})['productType'] ||
+          ProductType.SUBSCRIPTION;
+      }
+    }
+  }
+  if (raw && !swgData) {
+    raw = atob(raw);
+    if (raw) {
+      const parsed = parseJson(raw);
+      swgData = parsed['swgCallbackData'];
+    }
+  }
+  if (!swgData) {
+    throw new Error('unexpected payment response');
   }
+  raw = JSON.stringify(/** @type {!JsonObject} */ (swgData));
+  return new SubscribeResponse$1(
+    raw,
+    parsePurchaseData(swgData),
+    parseUserData(swgData),
+    parseEntitlements(deps, swgData),
+    productType,
+    completeHandler,
+    oldSku
+  );
+}
+
+/**
+ * @param {!Object} swgData
+ * @return {!PurchaseData}
+ */
+function parsePurchaseData(swgData) {
+  const raw = swgData['purchaseData'];
+  const signature = swgData['purchaseDataSignature'];
+  return new PurchaseData(raw, signature);
+}
 
-  /**
-   * @return {!UserData}
-   */
-  clone() {
-    return new UserData(this.idToken, this.data);
+/**
+ * @param {!Object} swgData
+ * @return {?UserData}
+ * @package Visible for testing.
+ */
+function parseUserData(swgData) {
+  const idToken = swgData['idToken'];
+  if (!idToken) {
+    return null;
   }
+  const jwt = /** @type {!Object} */ (new JwtHelper().decode(idToken));
+  return new UserData(idToken, jwt);
+}
 
-  /**
-   * @return {!Object}
-   */
-  json() {
-    return {
-      'id': this.id,
-      'email': this.email,
-      'emailVerified': this.emailVerified,
-      'name': this.name,
-      'givenName': this.givenName,
-      'familyName': this.familyName,
-      'pictureUrl': this.pictureUrl,
-    };
+/**
+ * @param {!./deps.DepsDef} deps
+ * @param {!Object} swgData
+ * @return {?../api/entitlements.Entitlements}
+ * @package Visible for testing.
+ */
+function parseEntitlements(deps, swgData) {
+  if (swgData['signedEntitlements']) {
+    return deps.entitlementsManager().parseEntitlements(swgData);
   }
+  return null;
+}
+
+/**
+ * @param {!PurchaseData} purchaseData
+ * @return {?string}
+ */
+function parseSkuFromPurchaseDataSafe(purchaseData) {
+  return (
+    /** @type {?string} */ (getPropertyFromJsonString(
+      purchaseData.raw,
+      'productId'
+    ) || null)
+  );
 }
 
 /**
@@ -5826,492 +5986,398 @@ class UserData {
  * limitations under the License.
  */
 
+/**
+ * @param {string} sku
+ * @return {!EventParams}
+ */
+function getEventParams$1(sku) {
+  return new EventParams([, , , , sku]);
+}
 
 /**
+ * Offers view is closable when request was originated from 'AbbrvOfferFlow'
+ * or from 'SubscribeOptionFlow'.
  */
-class SubscribeResponse$1 {
+const OFFERS_VIEW_CLOSABLE = true;
 
-  /**
-   * @param {string} raw
-   * @param {!PurchaseData} purchaseData
-   * @param {?UserData} userData
-   * @param {?Entitlements} entitlements
-   * @param {!string} productType
-   * @param {function():!Promise} completeHandler
-   */
-  constructor(raw, purchaseData, userData, entitlements, productType,
-      completeHandler) {
-    /** @const {string} */
-    this.raw = raw;
-    /** @const {!PurchaseData} */
-    this.purchaseData = purchaseData;
-    /** @const {?UserData} */
-    this.userData = userData;
-    /** @const {?Entitlements} */
-    this.entitlements = entitlements;
-    /** @const {string} */
-    this.productType = productType;
-    /** @private @const {function():!Promise} */
-    this.completeHandler_ = completeHandler;
-  }
+// The value logged when the offers screen shows all available SKUs.
+const ALL_SKUS = '*';
 
+/**
+ * The class for Offers flow.
+ */
+class OffersFlow {
   /**
-   * @return {!SubscribeResponse}
+   * @param {!./deps.DepsDef} deps
+   * @param {!../api/subscriptions.OffersRequest|undefined} options
    */
-  clone() {
-    return new SubscribeResponse$1(
-        this.raw,
-        this.purchaseData,
-        this.userData,
-        this.entitlements,
-        this.productType,
-        this.completeHandler_);
-  }
+  constructor(deps, options) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
 
-  /**
-   * @return {!Object}
-   */
-  json() {
-    return {
-      'purchaseData': this.purchaseData.json(),
-      'userData': this.userData ? this.userData.json() : null,
-      'entitlements': this.entitlements ? this.entitlements.json() : null,
-      'productType': this.productType,
-    };
-  }
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
 
-  /**
-   * Allows the receiving site to complete/acknowledge that it registered
-   * the subscription purchase. The typical action would be to create an
-   * account (or match an existing one) and associated the purchase with
-   * that account.
-   *
-   * SwG will display progress indicator until this method is called and
-   * upon receiving this call will show the confirmation to the user.
-   * The promise returned by this method will yield once the user closes
-   * the confirmation.
-   *
-   * @return {!Promise}
-   */
-  complete() {
-    return this.completeHandler_();
-  }
-}
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
 
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
 
-/**
- */
-class PurchaseData {
+    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
+    this.eventManager_ = deps.eventManager();
 
-  /**
-   * @param {string} raw
-   * @param {string} signature
-   */
-  constructor(raw, signature) {
-    /** @const {string} */
-    this.raw = raw;
-    /** @const {string} */
-    this.data = raw;
-    /** @const {string} */
-    this.signature = signature;
-  }
+    let isClosable = options && options.isClosable;
+    if (isClosable == undefined) {
+      isClosable = false; // Default is to hide Close button.
+    }
 
-  /**
-   * @return {!PurchaseData}
-   */
-  clone() {
-    return new PurchaseData(this.raw, this.signature);
-  }
+    const feArgsObj = deps.activities().addDefaultArguments({
+      'showNative': deps.callbacks().hasSubscribeRequestCallback(),
+      'productType': ProductType.SUBSCRIPTION,
+      'list': (options && options.list) || 'default',
+      'skus': (options && options.skus) || null,
+      'isClosable': isClosable,
+    });
 
-  /**
-   * @return {!Object}
-   */
-  json() {
-    return {
-      'data': this.raw,
-      'signature': this.signature,
-    };
-  }
-}
+    if (options && options.oldSku) {
+      feArgsObj['oldSku'] = options.oldSku;
+      log_2(feArgsObj['skus'], 'Need a sku list if old sku is provided!');
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+      // Remove old sku from offers if in list.
+      let skuList = feArgsObj['skus'];
+      const /** @type {string} */ oldSku = feArgsObj['oldSku'];
+      skuList = skuList.filter(sku => sku !== oldSku);
 
+      log_2(
+        skuList.length > 0,
+        'Sku list only contained offer user already has'
+      );
+      feArgsObj['skus'] = skuList;
+    }
 
-/**
- */
-class DeferredAccountCreationResponse {
+    // Redirect to payments if only one upgrade option is passed.
+    if (feArgsObj['skus'] && feArgsObj['skus'].length === 1) {
+      const sku = feArgsObj['skus'][0];
+      const /** @type {string|undefined} */ oldSku = feArgsObj['oldSku'];
+      // Update subscription triggers experimental flag if oldSku is passed,
+      // so we need to check for oldSku to decide if it needs to be sent.
+      // Otherwise we might accidentally block a regular subscription request.
+      if (oldSku) {
+        const skuSelectedResponse = new SkuSelectedResponse();
+        skuSelectedResponse.setSku(sku);
+        skuSelectedResponse.setOldSku(oldSku);
+        this.startPayFlow_(skuSelectedResponse);
+        return;
+      }
+    }
+
+    /** @private  @const {!Array<!string>} */
+    this.skus_ = feArgsObj['skus'] || [ALL_SKUS];
+
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/offersiframe'),
+      feArgsObj,
+      /* shouldFadeBody */ true
+    );
+  }
 
   /**
-   * @param {!Entitlements} entitlements
-   * @param {!UserData} userData
-   * @param {!Array<!PurchaseData>} purchaseDataList
-   * @param {function():!Promise} completeHandler
+   * @param {SkuSelectedResponse} response
+   * @private
    */
-  constructor(entitlements, userData, purchaseDataList, completeHandler) {
-    /** @const {!Entitlements} */
-    this.entitlements = entitlements;
-    /** @const {!UserData} */
-    this.userData = userData;
-    /** @const {!Array<!PurchaseData>} */
-    this.purchaseDataList = purchaseDataList;
-    // TODO(dvoytenko): deprecate.
-    /** @const {!PurchaseData} */
-    this.purchaseData = purchaseDataList[0];
-    /** @private @const {function():!Promise} */
-    this.completeHandler_ = completeHandler;
+  startPayFlow_(response) {
+    const sku = response.getSku();
+    if (sku) {
+      const /** @type {../api/subscriptions.SubscriptionRequest} */ subscriptionRequest = {
+          'skuId': sku,
+        };
+      const oldSku = response.getOldSku();
+      if (oldSku) {
+        subscriptionRequest['oldSku'] = oldSku;
+        this.deps_.analytics().setSku(oldSku);
+      }
+      this.eventManager_.logSwgEvent(
+        AnalyticsEvent.ACTION_OFFER_SELECTED,
+        true,
+        getEventParams$1(sku)
+      );
+      new PayStartFlow(this.deps_, subscriptionRequest).start();
+    }
   }
 
   /**
-   * @return {!DeferredAccountCreationResponse}
+   * @param {AlreadySubscribedResponse} response
+   * @private
    */
-  clone() {
-    return new DeferredAccountCreationResponse(
-        this.entitlements,
-        this.userData,
-        this.purchaseDataList,
-        this.completeHandler_);
+  handleLinkRequest_(response) {
+    if (response.getSubscriberOrMember()) {
+      this.eventManager_.logSwgEvent(
+        AnalyticsEvent.ACTION_ALREADY_SUBSCRIBED,
+        true
+      );
+      this.deps_.callbacks().triggerLoginRequest({
+        linkRequested: !!response.getLinkRequested(),
+      });
+    }
   }
 
   /**
-   * @return {!Object}
+   * @param {ViewSubscriptionsResponse} response
+   * @private
    */
-  json() {
-    return {
-      'entitlements': this.entitlements.json(),
-      'userData': this.userData.json(),
-      'purchaseDataList': this.purchaseDataList.map(pd => pd.json()),
-      // TODO(dvoytenko): deprecate.
-      'purchaseData': this.purchaseData.json(),
-    };
+  startNativeFlow_(response) {
+    if (response.getNative()) {
+      this.deps_.callbacks().triggerSubscribeRequest();
+    }
   }
 
   /**
-   * Allows the receiving site to complete/acknowledge that it registered
-   * the subscription info. The typical action would be to create an
-   * account (or match an existing one) and associated the subscription with
-   * that account.
-   *
-   * SwG will display progress indicator until this method is called and
-   * upon receiving this call will show the confirmation to the user.
-   * The promise returned by this method will yield once the user closes
-   * the confirmation.
-   *
+   * Starts the offers flow or alreadySubscribed flow.
    * @return {!Promise}
    */
-  complete() {
-    return this.completeHandler_();
+  start() {
+    if (this.activityIframeView_) {
+      // So no error if skipped to payment screen.
+      // Start/cancel events.
+      // The second parameter is required by Propensity in AMP.
+      this.deps_.callbacks().triggerFlowStarted(SubscriptionFlows.SHOW_OFFERS, {
+        skus: this.skus_,
+        source: 'SwG',
+      });
+      this.activityIframeView_.onCancel(() => {
+        this.deps_
+          .callbacks()
+          .triggerFlowCanceled(SubscriptionFlows.SHOW_OFFERS);
+      });
+      this.activityIframeView_.on(
+        SkuSelectedResponse,
+        this.startPayFlow_.bind(this)
+      );
+      this.activityIframeView_.on(
+        AlreadySubscribedResponse,
+        this.handleLinkRequest_.bind(this)
+      );
+      this.activityIframeView_.on(
+        ViewSubscriptionsResponse,
+        this.startNativeFlow_.bind(this)
+      );
+
+      return this.dialogManager_.openView(this.activityIframeView_);
+    }
+    return Promise.resolve();
   }
 }
 
 /**
- * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/**
- * @enum {string}
- */
-const SubscriptionState = {
-  // user's subscription state not known.
-  UNKNOWN: 'unknown',
-  // user is not a subscriber.
-  NON_SUBSCRIBER: 'non_subscriber',
-  // user is a subscriber.
-  SUBSCRIBER: 'subscriber',
-  // user's subscription has expired.
-  PAST_SUBSCRIBER: 'past_subscriber',
-};
-
-/**
- * Subscription related events. Listed below are enum strings that
- * represent events related to Subscription flow. Event parameters
- * that provide more context about the event are sent as a JSON
- * block of depth 1 in the sendEvent() API call.
- * @enum {string}
+ * The class for subscribe option flow.
  */
-const Event = {
-  /**
-   * IMPRESSION_PAYWALL event.
-   * User hits a paywall.
-   * Every impression should be qualified as active or passive.
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true or false to indicate this.
-   * If the user has run out of metering, and that’s why was shown
-   * a paywall, that would be a passive impression of the paywall.
-   * For example:
-   * const propensityEvent = {
-   *  name: 'paywall',
-   *  active: false,
-   * }
-   */
-  IMPRESSION_PAYWALL: 'paywall',
-  /**
-   * IMPRESSION_AD event.
-   * User has been shown a subscription ad.
-   * Every impression should be qualified as active or passive.
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true or false to indicate this.
-   * The JSON block can provide the name of the subscription ad
-   * creative or campaign. Ad impressions are usually passive.
-   * const propensityEvent = {
-   *   name: 'ad_shown',
-   *   active: false,
-   *   data: {'ad_name': 'fall_ad'}
-   * }
-   */
-  IMPRESSION_AD: 'ad_shown',
-  /**
-   * IMPRESSION_OFFERS event.
-   * User has been shown a list of available offers for subscription.
-   * Every impression should be qualified as active or passive.
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true or false to indicate this.
-   * The JSON block can provide a list of products displayed,
-   * and the source to indicate why the user was shown the offer.
-   * Note: source is not the same as referrer.
-   * In the cases below, the user took action before seeing the offers,
-   * and therefore considered active impression.
-   * For example:
-   * const propensityEvent = {
-   *   name: 'offers_shown',
-   *   active: true,
-   *   data: {'offers': ['basic-monthly', 'premium-weekly'],
-   *           'source': 'ad-click'}
-   * }
-   * For example:
-   * const propensityEvent = {
-   *   name: 'offers_shown',
-   *   active: true,
-   *   data: {'offers': ['basic-monthly', 'premium-weekly'],
-   *           'source': ‘navigate-to-offers-page’}
-   * }
-   * If the user was shown the offers as a result of paywall metering
-   * expiration, it is considered a passive impression.
-   * For example:
-   * const propensityEvent = {
-   *   name: 'offers_shown',
-   *   active: false,
-   *   data: {'offers': ['basic-monthly', 'premium-weekly'],
-   *           'source': ‘paywall-metering-expired’}
-   * }
-   */
-  IMPRESSION_OFFERS: 'offers_shown',
-  /**
-   * ACTION_SUBSCRIPTIONS_LANDING_PAGE event.
-   * User has taken the action to arrive at a landing page of the
-   * subscription workflow. The landing page should satisfy one of
-   * the following conditions and hence be a part of the funnel to
-   * get the user to subscribe:
-   * - have a button to navigate the user to an offers page, (in
-   *   this case, the next event will be IMPRESSION_OFFERS, with
-   *   parameter 'source' as subscriptions-landing-page and
-   *   'is_active' set to true),
-   * - show offers the user can select, (in this case, the next
-   *   event will be IMPRESSION_OFFERS, with a parameter 'source'
-   *   as navigate-to-offers-page and 'is_active' set to true),
-   * - provide a way to start the payment flow for a specific offer.
-   *   (in this case, the next event will be ACTION_OFFER_SELECTED
-   *   or ACTION_PAYMENT_FLOW_STARTED depending on if that button
-   *   took the user to a checkout page on the publishers site or
-   *   directly started the payment flow).
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true since this is a user action.
-   * The JSON block with this event can provide additional information
-   * such as the source, indicating what caused the user to navigate
-   * to this page.
-   * For example:
-   * const propensityEvent = {
-   *   name: 'subscriptions_landing_page',
-   *   active: true,
-   *   data: {'source': 'marketing_via_email'}
-   * }
-   */
-  ACTION_SUBSCRIPTIONS_LANDING_PAGE: 'subscriptions_landing_page',
-  /**
-   * ACTION_OFFER_SELECTED event.
-   * User has selected an offer.
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true since this is a user action.
-   * The JSON block can provide the product selected.
-   * For example: {
-   *   name: 'offer_selected',
-   *   active: true,
-   *   data: {product': 'basic-monthly'}
-   * }
-   * When offer selection starts the payment flow directly,
-   * use the next event ACTION_PAYMENT_FLOW_STARTED instead.
-   */
-  ACTION_OFFER_SELECTED: 'offer_selected',
+class SubscribeOptionFlow {
   /**
-   * ACTION_PAYMENT_FLOW_STARTED event.
-   * User has started payment flow.
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true since this is a user action.
-   * The JSON block can provide the product selected.
-   * For example:
-   * const propensityEvent = {
-   *   name: 'payment_flow_started',
-   *   active: true,
-   *   data: {product': 'basic-monthly'}
-   * }
+   * @param {!./deps.DepsDef} deps
+   * @param {!../api/subscriptions.OffersRequest|undefined} options
    */
-  ACTION_PAYMENT_FLOW_STARTED: 'payment_flow_start',
+  constructor(deps, options) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!../api/subscriptions.OffersRequest|undefined} */
+    this.options_ = options;
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
+
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
+
+    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
+    this.eventManager_ = deps.eventManager();
+
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      deps.win(),
+      this.activityPorts_,
+      feUrl('/optionsiframe'),
+      feArgs({
+        'publicationId': deps.pageConfig().getPublicationId(),
+        'productId': deps.pageConfig().getProductId(),
+        'list': (options && options.list) || 'default',
+        'skus': (options && options.skus) || null,
+        'isClosable': true,
+      }),
+      /* shouldFadeBody */ false
+    );
+  }
+
   /**
-   * ACTION_PAYMENT_COMPLETED.
-   * User has made the payment for a subscription.
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true since this is a user action.
-   * The JSON block can provide the product user paid for.
-   * For example:
-   * const propensityEvent = {
-   *   name: 'payment_complete',
-   *   active: true,
-   *   data: {product': 'basic-monthly'}
-   * }
+   * Starts the offers flow or alreadySubscribed flow.
+   * @return {!Promise}
    */
-  ACTION_PAYMENT_COMPLETED: 'payment_complete',
+  start() {
+    // Start/cancel events.
+    this.deps_
+      .callbacks()
+      .triggerFlowStarted(SubscriptionFlows.SHOW_SUBSCRIBE_OPTION);
+    this.activityIframeView_.onCancel(() => {
+      this.deps_
+        .callbacks()
+        .triggerFlowCanceled(SubscriptionFlows.SHOW_SUBSCRIBE_OPTION);
+    });
+    this.activityIframeView_.on(
+      SubscribeResponse,
+      this.maybeOpenOffersFlow_.bind(this)
+    );
+
+    this.activityIframeView_.acceptResult().then(
+      result => {
+        const data = result.data;
+        const response = new SubscribeResponse();
+        if (data['subscribe']) {
+          response.setSubscribe(true);
+        }
+        this.maybeOpenOffersFlow_(response);
+      },
+      reason => {
+        this.dialogManager_.completeView(this.activityIframeView_);
+        throw reason;
+      }
+    );
+    this.eventManager_.logSwgEvent(
+      AnalyticsEvent.IMPRESSION_CLICK_TO_SHOW_OFFERS
+    );
+    return this.dialogManager_.openView(this.activityIframeView_);
+  }
+
   /**
-   * EVENT_CUSTOM: custom publisher event.
-   * The field 'active' of PropensityEvent, which carries this
-   * event, must be set to true or false depending on if the event
-   * was generated as a result of a user action.
-   * The JSON block can provide the event name for the custom event.
-   * For example:
-   * const propensityEvent = {
-   *   name: 'custom',
-   *   active: true,
-   *   data: {
-   *     'event_name': 'social_share',
-   *     'platform_used': 'whatsapp'
-   *   }
-   *  }
+   * @param {SubscribeResponse} response
+   * @private
    */
-  EVENT_CUSTOM: 'custom',
-};
+  maybeOpenOffersFlow_(response) {
+    if (response.getSubscribe()) {
+      const options = this.options_ || {};
+      if (options.isClosable == undefined) {
+        options.isClosable = OFFERS_VIEW_CLOSABLE;
+      }
+      this.eventManager_.logSwgEvent(AnalyticsEvent.ACTION_VIEW_OFFERS, true);
+      new OffersFlow(this.deps_, options).start();
+    }
+  }
+}
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
+ * The class for Abbreviated Offer flow.
  *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
  */
+class AbbrvOfferFlow {
+  /**
+   * @param {!./deps.DepsDef} deps
+   * @param {!../api/subscriptions.OffersRequest=} options
+   */
+  constructor(deps, options = {}) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
 
-/**
- * @enum {string}
- */
-const PropensityType = {
-  // Propensity score for a user to subscribe to a publication.
-  GENERAL: 'general',
-  // Propensity score when blocked access to content by paywall.
-  PAYWALL: 'paywall',
-};
+    /** @private @const {!../api/subscriptions.OffersRequest|undefined} */
+    this.options_ = options;
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
 
-/** @enum {string} */
-const SubscriptionFlows = {
-  SHOW_OFFERS: 'showOffers',
-  SHOW_SUBSCRIBE_OPTION: 'showSubscribeOption',
-  SHOW_ABBRV_OFFER: 'showAbbrvOffer',
-  SHOW_CONTRIBUTION_OPTIONS: 'showContributionOptions',
-  SUBSCRIBE: 'subscribe',
-  CONTRIBUTE: 'contribute',
-  COMPLETE_DEFERRED_ACCOUNT_CREATION: 'completeDeferredAccountCreation',
-  LINK_ACCOUNT: 'linkAccount',
-  SHOW_LOGIN_PROMPT: 'showLoginPrompt',
-  SHOW_LOGIN_NOTIFICATION: 'showLoginNotification',
-};
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
 
-/**
- * @enum {number}
- */
-const AnalyticsMode = {
-  DEFAULT: 0,
-  IMPRESSIONS: 1,
-};
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
 
-/**
- * @enum {string}
- */
-const WindowOpenMode = {
-  AUTO: 'auto',
-  REDIRECT: 'redirect',
-};
+    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
+    this.eventManager_ = deps.eventManager();
+
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/abbrvofferiframe'),
+      feArgs({
+        'publicationId': deps.pageConfig().getPublicationId(),
+        'productId': deps.pageConfig().getProductId(),
+        'showNative': deps.callbacks().hasSubscribeRequestCallback(),
+        'list': (options && options.list) || 'default',
+        'skus': (options && options.skus) || null,
+        'isClosable': true,
+      }),
+      /* shouldFadeBody */ false
+    );
+  }
+
+  /**
+   * @param {AlreadySubscribedResponse} response
+   * @private
+   */
+  handleLinkRequest_(response) {
+    if (response.getSubscriberOrMember()) {
+      this.eventManager_.logSwgEvent(
+        AnalyticsEvent.ACTION_ALREADY_SUBSCRIBED,
+        true
+      );
+      this.deps_.callbacks().triggerLoginRequest({
+        linkRequested: !!response.getLinkRequested(),
+      });
+    }
+  }
+
+  /**
+   * Starts the offers flow
+   * @return {!Promise}
+   */
+  start() {
+    // Start/cancel events.
+    this.deps_
+      .callbacks()
+      .triggerFlowStarted(SubscriptionFlows.SHOW_ABBRV_OFFER);
+    this.activityIframeView_.onCancel(() => {
+      this.deps_
+        .callbacks()
+        .triggerFlowCanceled(SubscriptionFlows.SHOW_ABBRV_OFFER);
+    });
+
+    // If the user is already subscribed, trigger login flow
+    this.activityIframeView_.on(
+      AlreadySubscribedResponse,
+      this.handleLinkRequest_.bind(this)
+    );
+
+    // If result is due to requesting offers, redirect to offers flow
+    this.activityIframeView_.acceptResult().then(result => {
+      if (result.data['viewOffers']) {
+        const options = this.options_ || {};
+        if (options.isClosable == undefined) {
+          options.isClosable = OFFERS_VIEW_CLOSABLE;
+        }
+        this.eventManager_.logSwgEvent(AnalyticsEvent.ACTION_VIEW_OFFERS, true);
+        new OffersFlow(this.deps_, options).start();
+        return;
+      }
+      if (result.data['native']) {
+        this.deps_.callbacks().triggerSubscribeRequest();
+        // The flow is complete.
+        this.dialogManager_.completeView(this.activityIframeView_);
+        return;
+      }
+    });
 
-/**
- * The Offers/Contributions UI is rendered differently based on the
- * ProductType. The ProductType parameter is passed to the Payments flow, and
- * then passed back to the Payments confirmation page to render messages/text
- * based on the ProductType.
- * @enum {string}
- */
-const ProductType = {
-  SUBSCRIPTION: 'SUBSCRIPTION',
-  UI_CONTRIBUTION: 'UI_CONTRIBUTION',
-};
+    this.eventManager_.logSwgEvent(
+      AnalyticsEvent.IMPRESSION_CLICK_TO_SHOW_OFFERS_OR_ALREADY_SUBSCRIBED
+    );
 
-/**
- * @return {!Config}
- */
-function defaultConfig() {
-  return {
-    windowOpenMode: WindowOpenMode.AUTO,
-    analyticsMode: AnalyticsMode.DEFAULT,
-    enableSwgAnalytics: false,
-    enablePropensity: false,
-  };
+    return this.dialogManager_.openView(this.activityIframeView_);
+  }
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -6324,456 +6390,378 @@ function defaultConfig() {
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- *
- * The Flow goes like this:
- * a. Start Payments
- * b. Complete Payments
- * c. Create Account
- * d. Acknowledge Account
- *
- * In other words, Flow = Payments + Account Creation.
  */
 /**
- * String values input by the publisher are mapped to the number values.
- * @type {!Object<string, number>}
+ * @implements {ActivityPortDef}
  */
-const ReplaceSkuProrationModeMapping = {
-  // The replacement takes effect immediately, and the remaining time will
-  // be prorated and credited to the user. This is the current default
-  // behavior.
-  'IMMEDIATE_WITH_TIME_PRORATION': 1,
-};
+class ActivityPortDeprecated {
+  /**
+   * @param {!web-activities/activity-ports.ActivityPort} port
+   */
+  constructor(port) {
+    /** @private @const {!web-activities/activity-ports.ActivityPort} */
+    this.port_ = port;
+  }
 
-/**
- * @param {string} sku
- * @return {!EventParams}
- */
-function getEventParams(sku) {
-  return new EventParams([, , , , sku]);
+  /**
+   * @return {!Promise<!web-activities/activity-ports.ActivityResult>}
+   */
+  acceptResult() {
+    return this.port_.acceptResult();
+  }
 }
 
 /**
- * The flow to initiate payment process.
+ * @implements {ActivityPortDef}
  */
-class PayStartFlow {
+class ActivityIframePort$1 {
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!../api/subscriptions.SubscriptionRequest|string} skuOrSubscriptionRequest
-   * @param {!../api/subscriptions.ProductType} productType
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} url
+   * @param {!../runtime/deps.DepsDef} deps
+   * @param {?Object=} args
    */
-  constructor(
-    deps,
-    skuOrSubscriptionRequest,
-    productType = ProductType.SUBSCRIPTION
-  ) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!./pay-client.PayClient} */
-    this.payClient_ = deps.payClient();
-
-    /** @private @const {!../model/page-config.PageConfig} */
-    this.pageConfig_ = deps.pageConfig();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
-
-    /** @private @const {!../api/subscriptions.SubscriptionRequest} */
-    this.subscriptionRequest_ =
-      typeof skuOrSubscriptionRequest == 'string'
-        ? {'skuId': skuOrSubscriptionRequest}
-        : skuOrSubscriptionRequest;
-
-    /**@private @const {!ProductType} */
-    this.productType_ = productType;
-
-    /** @private @const {!../runtime/analytics-service.AnalyticsService} */
-    this.analyticsService_ = deps.analytics();
-
-    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
-    this.eventManager_ = deps.eventManager();
+  constructor(iframe, url, deps, args) {
+    /** @private @const {!web-activities/activity-ports.ActivityIframePort} */
+    this.iframePort_ = new activityPorts_2(iframe, url, args);
+    /** @private @const {!Object<string, function(!Object)>} */
+    this.callbackMap_ = {};
 
-    // Map the proration mode to the enum value (if proration exists).
-    this.prorationMode = this.subscriptionRequest_.replaceSkuProrationMode;
-    this.prorationEnum = 0;
-    if (this.prorationMode) {
-      this.prorationEnum = ReplaceSkuProrationModeMapping[this.prorationMode];
-    } else if (this.subscriptionRequest_.oldSku) {
-      this.prorationEnum =
-        ReplaceSkuProrationModeMapping['IMMEDIATE_WITH_TIME_PRORATION'];
-    }
+    /** @private @const {../runtime/deps.DepsDef} */
+    this.deps_ = deps;
   }
 
   /**
-   * Starts the payments flow.
+   * Returns a promise that yields when the iframe is ready to be interacted
+   * with.
    * @return {!Promise}
    */
-  start() {
-    const req = this.subscriptionRequest_;
-    // Add the 'publicationId' key to the subscriptionRequest_ object.
-    const swgPaymentRequest = Object.assign({}, req, {
-      'publicationId': this.pageConfig_.getPublicationId(),
-    });
-
-    if (this.prorationEnum) {
-      swgPaymentRequest.replaceSkuProrationMode = this.prorationEnum;
-    }
-
-    // Start/cancel events.
-    this.deps_.callbacks().triggerFlowStarted(SubscriptionFlows.SUBSCRIBE, req);
-    if (req.oldSku) {
-      this.analyticsService_.setSku(req.oldSku);
-    }
-    this.eventManager_.logSwgEvent(
-      AnalyticsEvent.ACTION_PAYMENT_FLOW_STARTED,
-      true,
-      getEventParams(req.skuId)
-    );
-    this.payClient_.start(
-      {
-        'apiVersion': 1,
-        'allowedPaymentMethods': ['CARD'],
-        'environment': 'PRODUCTION',
-        'playEnvironment': 'PROD',
-        'swg': swgPaymentRequest,
-        'i': {
-          'startTimeMs': Date.now(),
-          'productType': this.productType_,
-        },
-      },
-      {
-        forceRedirect:
-          this.deps_.config().windowOpenMode == WindowOpenMode.REDIRECT,
-      }
-    );
-    return Promise.resolve();
+  whenReady() {
+    return this.iframePort_.whenReady();
   }
-}
 
-/**
- * The flow for successful payments completion.
- */
-class PayCompleteFlow {
   /**
-   * @param {!./deps.DepsDef} deps
+   * Waits until the activity port is connected to the host.
+   * @return {!Promise}
    */
-  static configurePending(deps) {
-    /** @const @type {./client-event-manager.ClientEventManager} */
-    const eventManager = deps.eventManager();
-
-    deps.payClient().onResponse(payPromise => {
-      deps.entitlementsManager().blockNextNotification();
-      const flow = new PayCompleteFlow(deps);
-      const promise = validatePayResponse(
-        deps,
-        payPromise,
-        flow.complete.bind(flow)
-      );
-      deps.callbacks().triggerPaymentResponse(promise);
-      return promise.then(
-        response => {
-          const sku = parseSkuFromPurchaseDataSafe(response.purchaseData);
-          deps.analytics().setSku(sku || '');
-          eventManager.logSwgEvent(
-            AnalyticsEvent.ACTION_PAYMENT_COMPLETE,
-            true,
-            getEventParams(sku || '')
-          );
-          flow.start(response);
-        },
-        reason => {
-          if (isCancelError(reason)) {
-            deps.callbacks().triggerFlowCanceled(SubscriptionFlows.SUBSCRIBE);
-            deps
-              .eventManager()
-              .logSwgEvent(AnalyticsEvent.ACTION_USER_CANCELED_PAYFLOW, true);
-          } else {
-            deps
-              .eventManager()
-              .logSwgEvent(AnalyticsEvent.EVENT_PAYMENT_FAILED, false);
-            deps.jserror().error('Pay failed', reason);
-          }
-          throw reason;
+  connect() {
+    return this.iframePort_.connect().then(() => {
+      // Attach a callback to receive messages after connection complete
+      this.iframePort_.onMessage(data => {
+        const response = data && data['RESPONSE'];
+        if (!response) {
+          return;
         }
-      );
+        const cb = this.callbackMap_[response[0]];
+        if (cb) {
+          cb(deserialize(response));
+        }
+      });
+
+      if (this.deps_ && this.deps_.eventManager()) {
+        this.on(AnalyticsRequest, request => {
+          this.deps_.eventManager().logEvent({
+            eventType: request.getEvent(),
+            eventOriginator: EventOriginator.SWG_SERVER,
+            isFromUserAction: request.getMeta().getIsFromUserAction(),
+            additionalParameters: request.getParams(),
+          });
+        });
+      }
     });
   }
 
   /**
-   * @param {!./deps.DepsDef} deps
+   * Disconnect the activity binding and cleanup listeners.
    */
-  constructor(deps) {
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
-
-    /** @private {?ActivityIframeView} */
-    this.activityIframeView_ = null;
-
-    /** @private {?SubscribeResponse} */
-    this.response_ = null;
+  disconnect() {
+    this.iframePort_.disconnect();
+  }
 
-    /** @private {?Promise} */
-    this.readyPromise_ = null;
+  /**
+   * Returns the mode of the activity: iframe, popup or redirect.
+   * @return {!web-activities/activity-ports.ActivityMode}
+   */
+  getMode() {
+    return this.iframePort_.getMode();
+  }
 
-    /** @private @const {!../runtime/analytics-service.AnalyticsService} */
-    this.analyticsService_ = deps.analytics();
+  /**
+   * Accepts the result when ready. The client should verify the activity's
+   * mode, origin, verification and secure channel flags before deciding
+   * whether or not to trust the result.
+   *
+   * Returns the promise that yields when the activity has been completed and
+   * either a result, a cancelation or a failure has been returned.
+   *
+   * @return {!Promise<!web-activities/activity-ports.ActivityResult>}
+   * @override
+   */
+  acceptResult() {
+    return this.iframePort_.acceptResult();
+  }
 
-    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
-    this.eventManager_ = deps.eventManager();
+  /**
+   * Register a callback to handle resize requests. Once successfully resized,
+   * ensure to call `resized()` method.
+   * @param {function(number)} callback
+   */
+  onResizeRequest(callback) {
+    return this.iframePort_.onResizeRequest(callback);
+  }
 
-    /** @private {?string} */
-    this.sku_ = null;
+  /**
+   * @param {!../proto/api_messages.Message} request
+   */
+  execute(request) {
+    this.iframePort_.message({'REQUEST': request.toArray()});
   }
 
   /**
-   * Starts the payments completion flow.
-   * @param {!SubscribeResponse} response
-   * @return {!Promise}
+   * @param {!function(new: T)} message
+   * @param {function(!../proto/api_messages.Message)} callback
+   * @template T
    */
-  start(response) {
-    this.sku_ = parseSkuFromPurchaseDataSafe(response.purchaseData);
-    this.eventManager_.logSwgEvent(
-      AnalyticsEvent.IMPRESSION_ACCOUNT_CHANGED,
-      true,
-      getEventParams(this.sku_ || '')
-    );
-    this.deps_.entitlementsManager().reset(true);
-    this.response_ = response;
-    // TODO(dianajing): find a way to specify whether response is a subscription update
-    const args = {
-      'publicationId': this.deps_.pageConfig().getPublicationId(),
-      'productType': this.response_['productType'],
-      // 'isSubscriptionUpdate': !!response.oldSku,
-    };
-    // TODO(dvoytenko, #400): cleanup once entitlements is launched everywhere.
-    if (response.userData && response.entitlements) {
-      args['idToken'] = response.userData.idToken;
-      this.deps_
-        .entitlementsManager()
-        .pushNextEntitlements(response.entitlements.raw);
-    } else {
-      args['loginHint'] = response.userData && response.userData.email;
+  on(message, callback) {
+    let label = null;
+    try {
+      label = getLabel(message);
+    } catch (ex) {
+      // Thrown if message is not a proto object and has no label
+      label = null;
     }
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/payconfirmiframe'),
-      feArgs(args),
-      /* shouldFadeBody */ true
-    );
-
-    this.activityIframeView_.on(
-      EntitlementsResponse,
-      this.handleEntitlementsResponse_.bind(this)
-    );
+    if (!label) {
+      throw new Error('Invalid data type');
+    } else if (this.callbackMap_[label]) {
+      throw new Error('Invalid type or duplicate callback for ', label);
+    }
+    this.callbackMap_[label] = callback;
+  }
 
-    this.activityIframeView_.acceptResult().then(() => {
-      // The flow is complete.
-      this.dialogManager_.completeView(this.activityIframeView_);
-    });
-    this.readyPromise_ = this.dialogManager_.openView(this.activityIframeView_);
-    return this.readyPromise_;
+  /**
+   * Signals back to the activity implementation that the client has updated
+   * the activity's size.
+   */
+  resized() {
+    this.iframePort_.resized();
   }
+}
 
+class ActivityPorts$1 {
   /**
-   * @param {!EntitlementsResponse} response
-   * @private
+   * @param {!../runtime/deps.DepsDef} deps
    */
-  handleEntitlementsResponse_(response) {
-    const jwt = response.getJwt();
-    if (jwt) {
-      this.deps_.entitlementsManager().pushNextEntitlements(jwt);
-    }
+  constructor(deps) {
+    /** @private @const {!../runtime/deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!web-activities/activity-ports.ActivityPorts} */
+    this.activityPorts_ = new activityPorts_1(deps.win());
   }
 
   /**
-   * @return {!Promise}
+   * Adds client version, publication, product and logging context information.
+   * @param {?Object=} args
+   * @return {!Object}
    */
-  complete() {
-    this.eventManager_.logSwgEvent(
-      AnalyticsEvent.ACTION_ACCOUNT_CREATED,
-      true,
-      getEventParams(this.sku_ || '')
+  addDefaultArguments(args) {
+    const deps = this.deps_;
+    const pageConfig = deps.pageConfig();
+    const context = deps.analytics().getContext();
+    return Object.assign(
+      {
+        'analyticsContext': context.toArray(),
+        'publicationId': pageConfig.getPublicationId(),
+        'productId': pageConfig.getProductId(),
+        '_client': 'SwG 0.1.22.91',
+        'supportsEventManager': true,
+      },
+      args || {}
     );
-    this.deps_.entitlementsManager().unblockNextNotification();
-    this.readyPromise_.then(() => {
-      const accountCompletionRequest = new AccountCreationRequest();
-      accountCompletionRequest.setComplete(true);
-      this.activityIframeView_.execute(accountCompletionRequest);
-    });
-    return this.activityIframeView_
-      .acceptResult()
-      .catch(() => {
-        // Ignore errors.
-      })
-      .then(() => {
-        this.eventManager_.logSwgEvent(
-          AnalyticsEvent.ACTION_ACCOUNT_ACKNOWLEDGED,
-          true,
-          getEventParams(this.sku_ || '')
-        );
-        this.deps_.entitlementsManager().setToastShown(true);
-      });
   }
-}
-
-/**
- * @param {!./deps.DepsDef} deps
- * @param {!Promise<!Object>} payPromise
- * @param {function():!Promise} completeHandler
- * @return {!Promise<!SubscribeResponse>}
- */
-function validatePayResponse(deps, payPromise, completeHandler) {
-  return payPromise.then(data => {
-    // 1) We log against a random TX ID which is how we track a specific user
-    //    anonymously.
-    // 2) If there was a redirect to gPay, we may have lost our stored TX ID.
-    // 3) Pay service is supposed to give us the TX ID it logged against.
 
-    const hasLogged = deps.analytics().getHasLogged();
-    let eventType = AnalyticsEvent.UNKNOWN;
-    let eventParams = undefined;
-    if (typeof data !== 'object' || !data['googleTransactionId']) {
-      // If gPay doesn't give us a TX ID it means that something may
-      // be wrong.  If we previously logged then we are at least continuing to
-      // log against the same TX ID.  If we didn't previously log then we have
-      // lost all connection to the events that preceded the payment event and
-      // we at least want to know why that data was lost.
-      eventParams = new EventParams();
-      eventParams.setHadLogged(hasLogged);
-      eventType = AnalyticsEvent.EVENT_GPAY_NO_TX_ID;
-    } else {
-      const oldTxId = deps.analytics().getTransactionId();
-      const newTxId = data['googleTransactionId'];
+  /*
+   * Start an activity within the specified iframe.
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} url
+   * @param {?Object=} args
+   * @return {!Promise<!ActivityIframePort>}
+   */
+  openActivityIframePort_(iframe, url, args) {
+    const activityPort = new ActivityIframePort$1(iframe, url, this.deps_, args);
+    return activityPort.connect().then(() => activityPort);
+  }
 
-      if (!hasLogged) {
-        // This is the expected case for full redirects.  It may be happening
-        // unexpectedly at other times too though and we want to be aware of it
-        // if it does.
-        deps.analytics().setTransactionId(newTxId);
-        eventType = AnalyticsEvent.EVENT_GPAY_CANNOT_CONFIRM_TX_ID;
-      } else {
-        if (oldTxId === newTxId) {
-          // This is the expected case for non-redirect pay events
-          eventType = AnalyticsEvent.EVENT_CONFIRM_TX_ID;
-        } else {
-          // This is an unexpected case: gPay rejected our TX ID and created
-          // its own.  Log the gPay TX ID but keep our logging consistent.
-          eventParams = new EventParams();
-          eventParams.setGpayTransactionId(newTxId);
-          eventType = AnalyticsEvent.EVENT_CHANGED_TX_ID;
-        }
-      }
+  /**
+   * Start an activity within the specified iframe.
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} url
+   * @param {?Object=} args
+   * @param {boolean=} addDefaultArguments
+   * @return {!Promise<!ActivityIframePort>}
+   */
+  openIframe(iframe, url, args, addDefaultArguments = false) {
+    if (addDefaultArguments) {
+      args = this.addDefaultArguments(args);
     }
-    deps.eventManager().logSwgEvent(eventType, true, eventParams);
-    return parseSubscriptionResponse(deps, data, completeHandler);
-  });
-}
+    return this.openActivityIframePort_(iframe, url, args);
+  }
 
-/**
- * @param {!./deps.DepsDef} deps
- * @param {*} data
- * @param {function():!Promise} completeHandler
- * @return {!SubscribeResponse}
- */
-function parseSubscriptionResponse(deps, data, completeHandler) {
-  let swgData = null;
-  let raw = null;
-  let productType = null;
-  if (data) {
-    if (typeof data == 'string') {
-      raw = /** @type {string} */ (data);
-    } else {
-      // Assume it's a json object in the format:
-      // `{integratorClientCallbackData: "..."}` or `{swgCallbackData: "..."}`.
-      const json = /** @type {!Object} */ (data);
-      if ('productType' in data) {
-        productType = data['productType'];
-      }
-      if ('swgCallbackData' in json) {
-        swgData = /** @type {!Object} */ (json['swgCallbackData']);
-      } else if ('integratorClientCallbackData' in json) {
-        raw = json['integratorClientCallbackData'];
-      }
+  /**
+   * Start an activity in a separate window. The result will be delivered
+   * to the `onResult` callback.
+   *
+   * The activity can be opened in two modes: "popup" and "redirect". This
+   * depends on the `target` value, but also on the browser/environment.
+   *
+   * The allowed `target` values are `_blank`, `_top` and name targets. The
+   * `_self`, `_parent` and similar targets are not allowed.
+   *
+   * The `_top` target indicates that the activity should be opened as a
+   * "redirect", while other targets indicate that the activity should be
+   * opened as a popup. The activity client will try to honor the requested
+   * target. However, it's not always possible. Some environments do not
+   * allow popups and they either force redirect or fail the window open
+   * request. In this case, the activity will try to fallback to the "redirect"
+   * mode.
+   *
+   * @param {string} requestId
+   * @param {string} url
+   * @param {string} target
+   * @param {?Object=} args
+   * @param {?web-activities/activity-ports.ActivityOpenOptions=} options
+   * @param {boolean=} addDefaultArguments
+   * @return {{targetWin: ?Window}}
+   */
+  open(requestId, url, target, args, options, addDefaultArguments = false) {
+    if (addDefaultArguments) {
+      args = this.addDefaultArguments(args);
     }
+    return this.activityPorts_.open(requestId, url, target, args, options);
   }
-  if (!productType) {
-    productType = ProductType.SUBSCRIPTION;
+
+  /**
+   * Registers the callback for the result of the activity opened with the
+   * specified `requestId` (see the `open()` method). The callback is a
+   * function that takes a single `ActivityPort` argument. The client
+   * can use this object to verify the port using it's origin, verified and
+   * secure channel flags. Then the client can call
+   * `ActivityPort.acceptResult()` method to accept the result.
+   *
+   * The activity result is handled via a separate callback because of a
+   * possible redirect. So use of direct callbacks and/or promises is not
+   * possible in that case.
+   *
+   * A typical implementation would look like:
+   * ```
+   * ports.onResult('request1', function(port) {
+   *   port.acceptResult().then(function(result) {
+   *     // Only verified origins are allowed.
+   *     if (result.origin == expectedOrigin &&
+   *         result.originVerified &&
+   *         result.secureChannel) {
+   *       handleResultForRequest1(result);
+   *     }
+   *   });
+   * })
+   *
+   * ports.open('request1', request1Url, '_blank');
+   * ```
+   *
+   * @param {string} requestId
+   * @param {function(!ActivityPortDef)} callback
+   */
+  onResult(requestId, callback) {
+    this.activityPorts_.onResult(requestId, port => {
+      callback(new ActivityPortDeprecated(port));
+    });
   }
-  if (raw && !swgData) {
-    raw = atob(raw);
-    if (raw) {
-      const parsed = parseJson(raw);
-      swgData = parsed['swgCallbackData'];
-    }
+
+  /**
+   * @param {function(!Error)} handler
+   */
+  onRedirectError(handler) {
+    this.activityPorts_.onRedirectError(handler);
   }
-  if (!swgData) {
-    throw new Error('unexpected payment response');
+
+  /**
+   * @return {!web-activities/activity-ports.ActivityPorts}
+   */
+  getOriginalWebActivityPorts() {
+    return this.activityPorts_;
   }
-  raw = JSON.stringify(/** @type {!JsonObject} */ (swgData));
-  return new SubscribeResponse$1(
-    raw,
-    parsePurchaseData(swgData),
-    parseUserData(swgData),
-    parseEntitlements(deps, swgData),
-    productType,
-    completeHandler
-  );
 }
 
 /**
- * @param {!Object} swgData
- * @return {!PurchaseData}
+ * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function parsePurchaseData(swgData) {
-  const raw = swgData['purchaseData'];
-  const signature = swgData['purchaseDataSignature'];
-  return new PurchaseData(raw, signature);
-}
 
-/**
- * @param {!Object} swgData
- * @return {?UserData}
- * @package Visible for testing.
- */
-function parseUserData(swgData) {
-  const idToken = swgData['idToken'];
-  if (!idToken) {
-    return null;
-  }
-  const jwt = /** @type {!Object} */ (new JwtHelper().decode(idToken));
-  return new UserData(idToken, jwt);
-}
+/** @enum {number}  */
+const FilterResult = {
+  /** The event is allowed to proceed to the listeners. */
+  PROCESS_EVENT: 0,
+  /** The event is canceled and the listeners are not informed about it. */
+  CANCEL_EVENT: 1,
+};
 
 /**
- * @param {!./deps.DepsDef} deps
- * @param {!Object} swgData
- * @return {?../api/entitlements.Entitlements}
- * @package Visible for testing.
+ * Defines a client event in SwG
+ * Properties:
+ * - eventType: Required. The AnalyticsEvent type that occurred.
+ * - eventOriginator: Required.  The codebase that initiated the event.
+ * - isFromUserAction: Optional.  True if the user took an action to generate
+ *   the event.
+ * - additionalParameters: Optional.  A JSON object to store generic data.
+ *
+ *  @typedef {{
+ *    eventType: !AnalyticsEvent,
+ *    eventOriginator: !EventOriginator,
+ *    isFromUserAction: ?boolean,
+ *    additionalParameters: ?Object,
+ * }}
  */
-function parseEntitlements(deps, swgData) {
-  if (swgData['signedEntitlements']) {
-    return deps.entitlementsManager().parseEntitlements(swgData);
-  }
-  return null;
-}
+let ClientEvent;
 
 /**
- * @param {!PurchaseData} purchaseData
- * @return {?string}
+ * @interface
  */
-function parseSkuFromPurchaseDataSafe(purchaseData) {
-  const json = tryParseJson(purchaseData.raw);
-  return (json && json['productId']) || null;
+class ClientEventManagerApi {
+  /**
+   * Call this function to log an event. The registered listeners will be
+   * invoked unless the event is filtered.
+   * @param {!function(!ClientEvent)} listener
+   */
+  registerEventListener(listener) { }
+
+  /**
+   * Register a filterer for events if you need to potentially prevent the
+   * listeners from hearing about it.  A filterer should return
+   * FilterResult.CANCEL_EVENT to prevent listeners from hearing about the
+   * event.
+   * @param {!function(!ClientEvent):FilterResult} filterer
+   */
+  registerEventFilterer(filterer) { }
+
+  /**
+   * Call this function to log an event.  It will immediately throw an error if
+   * the event is invalid.  It will then asynchronously call the filterers and
+   * stop the event if a filterer cancels it.  After that, it will call each
+   * listener asynchronously.
+   * @param {!ClientEvent} event
+   */
+  logEvent(event) { }
 }
 
 /**
@@ -6793,98 +6781,52 @@ function parseSkuFromPurchaseDataSafe(purchaseData) {
  */
 
 /**
- * The class for Contributions flow.
+ * Determines if value is actually an Object.
+ * @param {*} value
+ * @return {boolean}
  */
-class ContributionsFlow {
-  /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!../api/subscriptions.OffersRequest|undefined} options
-   */
-  constructor(deps, options) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!../api/subscriptions.OffersRequest|undefined} */
-    this.options_ = options;
-
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
-
-    const isClosable = (options && options.isClosable) || true;
-
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/contributionsiframe'),
-      feArgs({
-        'productId': deps.pageConfig().getProductId(),
-        'publicationId': deps.pageConfig().getPublicationId(),
-        'productType': ProductType.UI_CONTRIBUTION,
-        'list': (options && options.list) || 'default',
-        'skus': (options && options.skus) || null,
-        'isClosable': isClosable,
-      }),
-      /* shouldFadeBody */ true
-    );
-  }
-
-  /**
-   * @param {AlreadySubscribedResponse} response
-   */
-  handleLinkRequest_(response) {
-    if (response.getSubscriberOrMember()) {
-      this.deps_.callbacks().triggerLoginRequest({
-        linkRequested: !!response.getLinkRequested(),
-      });
-    }
-  }
-
-  /**
-   * @param {SkuSelectedResponse} response
-   */
-  startPayFlow_(response) {
-    const sku = response.getSku();
-    if (sku) {
-      new PayStartFlow(this.deps_, sku, ProductType.UI_CONTRIBUTION).start();
-    }
-  }
-
-  /**
-   * Starts the contributions flow or alreadyMember flow.
-   * @return {!Promise}
-   */
-  start() {
-    // Start/cancel events.
-    this.deps_
-      .callbacks()
-      .triggerFlowStarted(SubscriptionFlows.SHOW_CONTRIBUTION_OPTIONS);
-    this.activityIframeView_.onCancel(() => {
-      this.deps_
-        .callbacks()
-        .triggerFlowCanceled(SubscriptionFlows.SHOW_CONTRIBUTION_OPTIONS);
-    });
-    this.activityIframeView_.on(
-      AlreadySubscribedResponse,
-      this.handleLinkRequest_.bind(this)
-    );
-    this.activityIframeView_.on(
-      SkuSelectedResponse,
-      this.startPayFlow_.bind(this)
-    );
+function isObject(value) {
+  const str = Object.prototype.toString.call(value);
+  return str === '[object Object]';
+}
 
-    return this.dialogManager_.openView(this.activityIframeView_);
+/**
+ * Checks whether `s` is a valid value of `enumObj`.
+ *
+ * @param {!Object<T>} enumObj
+ * @param {T} s
+ * @return {boolean}
+ * @template T
+ */
+function isEnumValue(enumObj, s) {
+  for (const k in enumObj) {
+    if (enumObj[k] === s) {
+      return true;
+    }
   }
+  return false;
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ * True if the value is a function.
+ * @param {*} value
+ * @return {boolean}
+ */
+function isFunction(value) {
+  return typeof value === 'function';
+}
+
+/**
+ * True if the value is either true or false.
+ * @param {?*} value
+ * @return {boolean}
+ */
+function isBoolean(value) {
+  return typeof value === 'boolean';
+}
+
+/**
+ * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -6900,161 +6842,152 @@ class ContributionsFlow {
  */
 
 /**
- * The flow to initiate deferred account process.
- * See `Subscriptions.completeDeferredAccountCreation` API.
+ * Helper function to describe an issue with an event object
+ * @param {!string} valueName
+ * @param {?*} value
+ * @returns {!string}
  */
-class DeferredAccountFlow {
-  /**
-   * @param {!./deps.DepsDef} deps
-   * @param {?../api/deferred-account-creation.DeferredAccountCreationRequest} options
-   */
-  constructor(deps, options) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
+function createEventErrorMessage(valueName, value) {
+  return 'Event has an invalid ' + valueName + '(' + value + ')';
+}
 
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
+/**
+ * Throws an error if the event is invalid.
+ * @param {!../api/client-event-manager-api.ClientEvent} event
+ */
+function validateEvent(event) {
+  if (!isObject(event)) {
+    throw new Error('Event must be a valid object');
+  }
 
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
+  if (!isEnumValue(AnalyticsEvent, event.eventType)) {
+    throw new Error(createEventErrorMessage('eventType', event.eventType));
+  }
 
-    /** @private {?ActivityIframeView} */
-    this.activityIframeView_ = null;
+  if (!isEnumValue(EventOriginator, event.eventOriginator)) {
+    throw new Error(
+      createEventErrorMessage('eventOriginator', event.eventOriginator)
+    );
+  }
 
-    /** @private {?Promise} */
-    this.openPromise_ = null;
+  if (
+    !isObject(event.additionalParameters) &&
+    event.additionalParameters != null
+  ) {
+    throw new Error(
+      createEventErrorMessage(
+        'additionalParameters',
+        event.additionalParameters
+      )
+    );
+  }
 
-    /** @type {!../api/deferred-account-creation.DeferredAccountCreationRequest} */
-    const defaultOptions = {
-      entitlements: null,
-      consent: true,
-    };
-    /** @private @const {!../api/deferred-account-creation.DeferredAccountCreationRequest} */
-    this.options_ = Object.assign(defaultOptions, options || {});
+  if (event.isFromUserAction != null && !isBoolean(event.isFromUserAction)) {
+    throw new Error(
+      createEventErrorMessage('isFromUserAction', event.isFromUserAction)
+    );
   }
+}
 
+/** @implements {../api/client-event-manager-api.ClientEventManagerApi} */
+class ClientEventManager {
   /**
-   * Starts the deferred account flow.
-   * @return {!Promise<!DeferredAccountCreationResponse>}
+   * @param {!../api/client-event-manager-api.ClientEvent} event
+   * @return {boolean}
    */
-  start() {
-    const entitlements = this.options_.entitlements;
+  static isPublisherEvent(event) {
+    return (
+      event.eventOriginator === EventOriginator.PROPENSITY_CLIENT ||
+      event.eventOriginator === EventOriginator.PUBLISHER_CLIENT ||
+      event.eventOriginator === EventOriginator.AMP_CLIENT
+    );
+  }
 
-    // For now, entitlements are required to be present and have the Google
-    // token. This is strictly not required for the implementation. But it's
-    // preferrable API-wise at this time.
-    if (!entitlements || !entitlements.getEntitlementForSource('google')) {
-      throw new Error('No entitlements with "google" source');
-    }
+  /**
+   *
+   * @param {!Promise} configuredPromise
+   */
+  constructor(configuredPromise) {
+    /** @private {!Array<function(!../api/client-event-manager-api.ClientEvent)>} */
+    this.listeners_ = [];
 
-    // Start/cancel events.
-    this.deps_
-      .callbacks()
-      .triggerFlowStarted(SubscriptionFlows.COMPLETE_DEFERRED_ACCOUNT_CREATION);
+    /** @private {!Array<function(!../api/client-event-manager-api.ClientEvent):!FilterResult>} */
+    this.filterers_ = [];
 
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/recoveriframe'),
-      feArgs({
-        'publicationId': this.deps_.pageConfig().getPublicationId(),
-        'productId': this.deps_.pageConfig().getProductId(),
-        'entitlements': (entitlements && entitlements.raw) || null,
-        'consent': this.options_.consent,
-      }),
-      /* shouldFadeBody */ true
-    );
+    /** @private {?Promise} */
+    this.lastAction_ = null;
 
-    this.openPromise_ = this.dialogManager_.openView(this.activityIframeView_);
-    return this.activityIframeView_.acceptResult().then(
-      result => {
-        // The consent part is complete.
-        return this.handleConsentResponse_(
-          /** @type {!Object} */ (result.data)
-        );
-      },
-      reason => {
-        if (isCancelError(reason)) {
-          this.deps_
-            .callbacks()
-            .triggerFlowCanceled(
-              SubscriptionFlows.COMPLETE_DEFERRED_ACCOUNT_CREATION
-            );
-        } else {
-          this.dialogManager_.completeView(this.activityIframeView_);
-        }
-        throw reason;
-      }
-    );
+    /** @private @const {!Promise} */
+    this.isReadyPromise_ = configuredPromise;
   }
 
   /**
-   * @param {!Object} data
-   * @return {!DeferredAccountCreationResponse}
-   * @private
+   * @overrides
    */
-  handleConsentResponse_(data) {
-    this.deps_.entitlementsManager().blockNextNotification();
-
-    // Parse the response.
-    const entitlementsJwt = data['entitlements'];
-    const idToken = data['idToken'];
-    const productType = data['productType'];
-    const entitlements = this.deps_
-      .entitlementsManager()
-      .parseEntitlements({'signedEntitlements': entitlementsJwt});
-    const userData = new UserData(
-      idToken,
-      /** @type {!Object} */ (new JwtHelper().decode(idToken))
-    );
-    const purchaseDataList = data['purchaseDataList']
-      ? data['purchaseDataList'].map(
-          pd => new PurchaseData(pd['data'], pd['signature'])
-        )
-      : [
-          // TODO(dvoytenko): cleanup/deprecate.
-          new PurchaseData(
-            data['purchaseData']['data'],
-            data['purchaseData']['signature']
-          ),
-        ];
+  registerEventListener(listener) {
+    if (!isFunction(listener)) {
+      throw new Error('Event manager listeners must be a function');
+    }
+    this.listeners_.push(listener);
+  }
 
-    // For now, we'll use the `PayCompleteFlow` as a "creating account" flow.
-    // But this can be eventually implemented by the same iframe.
-    const creatingFlow = new PayCompleteFlow(this.deps_);
-    const completeHandler = creatingFlow.complete.bind(creatingFlow);
+  /**
+   * @overrides
+   */
+  registerEventFilterer(filterer) {
+    if (!isFunction(filterer)) {
+      throw new Error('Event manager filterers must be a function');
+    }
+    this.filterers_.push(filterer);
+  }
 
-    const response = new DeferredAccountCreationResponse(
-      entitlements,
-      userData,
-      purchaseDataList,
-      completeHandler
-    );
+  /**
+   * @overrides
+   */
+  logEvent(event) {
+    validateEvent(event);
+    this.lastAction_ = this.isReadyPromise_.then(() => {
+      for (let filterer = 0; filterer < this.filterers_.length; filterer++) {
+        try {
+          if (this.filterers_[filterer](event) === FilterResult.CANCEL_EVENT) {
+            return Promise.resolve();
+          }
+        } catch (e) {
+          log_5(e);
+        }
+      }
+      for (let listener = 0; listener < this.listeners_.length; listener++) {
+        try {
+          this.listeners_[listener](event);
+        } catch (e) {
+          log_5(e);
+        }
+      }
+      return Promise.resolve();
+    });
+  }
 
-    this.deps_
-      .eventManager()
-      .logSwgEvent(AnalyticsEvent.ACTION_NEW_DEFERRED_ACCOUNT, true);
+  /**
+   * Creates an event with the arguments provided and calls logEvent.
+   * @param {!AnalyticsEvent} eventType
+   * @param {?boolean=} isFromUserAction
+   * @param {../proto/api_messages.EventParams=} eventParams
+   */
+  logSwgEvent(eventType, isFromUserAction = false, eventParams = null) {
+    this.logEvent({
+      eventType,
+      eventOriginator: EventOriginator.SWG_CLIENT,
+      isFromUserAction,
+      additionalParameters: eventParams,
+    });
+  }
 
-    // Start the "sync" flow.
-    creatingFlow.start(
-      new SubscribeResponse$1(
-        '', // raw field doesn't matter in this case
-        purchaseDataList[0],
-        userData,
-        entitlements,
-        productType,
-        () => Promise.resolve() // completeHandler doesn't matter in this case
-      )
-    );
-    return response;
+  /** @return {!Promise<null>} */
+  getReadyPromise() {
+    return this.isReadyPromise_;
   }
 }
 
-const CSS$1 = "body{padding:0;margin:0}swg-container,swg-loading,swg-loading-animate,swg-loading-image{display:block}swg-loading-container{width:100%!important;display:-ms-flexbox!important;display:flex!important;-ms-flex-align:center!important;align-items:center!important;-ms-flex-pack:center!important;justify-content:center!important;min-height:148px!important;height:100%!important;bottom:0!important;margin-top:5px!important;z-index:2147483647!important}@media (min-height:630px), (min-width:630px){swg-loading-container{width:560px!important;margin-left:35px!important;border-top-left-radius:8px!important;border-top-right-radius:8px!important;background-color:#fff!important;box-shadow:0 1px 1px rgba(60,64,67,.3),0 1px 4px 1px rgba(60,64,67,.15)!important}}swg-loading{z-index:2147483647!important;width:36px;height:36px;overflow:hidden;animation:mspin-rotate 1568.63ms linear infinite}swg-loading-animate{animation:mspin-revrot 5332ms steps(4) infinite}swg-loading-image{background-image:url(https://news.google.com/swg/js/v1/loader.svg);background-size:100%;width:11664px;height:36px;animation:swg-loading-film 5332ms steps(324) infinite}@keyframes swg-loading-film{0%{transform:translateX(0)}to{transform:translateX(-11664px)}}@keyframes mspin-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes mspin-revrot{0%{transform:rotate(0deg)}to{transform:rotate(-1turn)}}\n/*# sourceURL=/./src/ui/ui.css*/";
-
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
@@ -7072,204 +7005,211 @@ const CSS$1 = "body{padding:0;margin:0}swg-container,swg-loading,swg-loading-ani
  */
 
 /**
- * @param {!Document} doc
- * @return {string}
+ * @fileoverview
+ *
+ * Client-side experiments in SwG.
+ *
+ * The experiments can be set in a few different ways:
+ *  1. By gulp build rules using `--experiments=${experimentsString}` argument.
+ *  2. By `#swg.experiments=${experimentsString}` parameter in the URL's
+ *     fragment.
+ *  3. By `swg.configure({experiments: [array]})` call.
+ *
+ * The `${experimentsString}` is defined as following:
+ *  - experimentString = (experimentSpec,)*
+ *  - experimentSpec = experimentId | experimentId '=' num100 ('c')?
+ *
+ * Some examples:
+ *  - `A,B` - defines two experiments "A" and "B" that will be turned on.
+ *  - `A:100,B:100` - the same: "A" and "B" will be turned on.
+ *  - `A:0` - the experiment "A" will be disabled.
+ *  - `A:1` - enable the experiment "A" in 1% of impressions.
+ *  - `A:10c` - enable the experiment "A" in 10% of impressions with 10%
+ *    control. In this case, 20% of the impressions will be split into two
+ *    categories: experiment and control. Notice, a control can be requested
+ *    only for the fraction under 20%.
  */
-function getReadyState(doc) {
-  return /** @type {string} */ (doc['readyState']);
-}
 
 /**
- * Whether the document is ready.
- * @param {!Document} doc
- * @return {boolean}
+ * @enum {string}
  */
-function isDocumentReady(doc) {
-  const readyState = getReadyState(doc);
-  return readyState != 'loading' && readyState != 'uninitialized';
-}
+const Selection = {
+  EXPERIMENT: 'e',
+  CONTROL: 'c',
+};
 
 /**
- * Calls the callback when document is ready.
- * @param {!Document} doc
- * @param {function(!Document)} callback
+ * A comma-separated set of experiments.
+ * @type {string}
  */
-function onDocumentReady(doc, callback) {
-  onDocumentState(doc, isDocumentReady, callback);
-}
+let experimentsString = '';
 
 /**
- * Calls the callback when document's state satisfies the stateFn.
- * @param {!Document} doc
- * @param {function(!Document):boolean} stateFn
- * @param {function(!Document)} callback
+ * A parsed map of experiments.
+ * @type {?Object<string, boolean>}
  */
-function onDocumentState(doc, stateFn, callback) {
-  let ready = stateFn(doc);
-  if (ready) {
-    callback(doc);
-  } else {
-    const readyListener = () => {
-      if (stateFn(doc)) {
-        if (!ready) {
-          ready = true;
-          callback(doc);
-        }
-        doc.removeEventListener('readystatechange', readyListener);
-      }
-    };
-    doc.addEventListener('readystatechange', readyListener);
-  }
-}
+let experimentMap = null;
 
 /**
- * Returns a promise that is resolved when document is ready.
- * @param {!Document} doc
- * @return {!Promise<!Document>}
+ * Ensures that the experiments have been initialized and returns them.
+ * @param {!Window} win
+ * @return {!Object<string, boolean>}
  */
-function whenDocumentReady(doc) {
-  return new Promise(resolve => {
-    onDocumentReady(doc, resolve);
-  });
+function getExperiments(win) {
+  if (!experimentMap) {
+    experimentMap = {};
+    let combinedExperimentString = experimentsString;
+    try {
+      const query = parseQueryString$1(win.location.hash);
+      const experimentStringFromHash = query['swg.experiments'];
+      if (experimentStringFromHash) {
+        combinedExperimentString += ',' + experimentStringFromHash;
+      }
+    } catch (e) {
+      // Ignore: experiment parsing cannot block runtime.
+      ErrorUtils.throwAsync(e);
+    }
+
+    // Format:
+    // - experimentString = (experimentSpec,)*
+    combinedExperimentString.split(',').forEach(s => {
+      s = s.trim();
+      if (!s) {
+        return;
+      }
+      try {
+        parseSetExperiment(win, experimentMap, s);
+      } catch (e) {
+        // Ignore: experiment parsing cannot block runtime.
+        ErrorUtils.throwAsync(e);
+      }
+    });
+  }
+  return experimentMap;
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @param {!Window} win
+ * @param {?Object<string, boolean>} experimentMap
+ * @param {string} spec
  */
-
-/** @implements {Doc} */
-class GlobalDoc {
-  /**
-   * @param {!Window|!Document} winOrDoc
-   */
-  constructor(winOrDoc) {
-    const isWin = !!winOrDoc.document;
-    /** @private @const {!Window} */
-    this.win_ = /** @type {!Window} */ (isWin
-      ? /** @type {!Window} */ (winOrDoc)
-      : /** @type {!Document} */ (winOrDoc).defaultView);
-    /** @private @const {!Document} */
-    this.doc_ = isWin
-      ? /** @type {!Window} */ (winOrDoc).document
-      : /** @type {!Document} */ (winOrDoc);
-  }
-
-  /** @override */
-  getWin() {
-    return this.win_;
-  }
-
-  /** @override */
-  getRootNode() {
-    return this.doc_;
-  }
-
-  /** @override */
-  getRootElement() {
-    return this.doc_.documentElement;
-  }
-
-  /** @override */
-  getHead() {
-    // `document.head` always has a chance to be parsed, at least partially.
-    return /** @type {!Element} */ (this.doc_.head);
+function parseSetExperiment(win, experimentMap, spec) {
+  // Format:
+  // - experimentSpec = experimentId | experimentId '=' num100 ('c')?
+  let experimentId;
+  let fraction;
+  let control = false;
+  const eq = spec.indexOf(':');
+  if (eq == -1) {
+    experimentId = spec;
+    fraction = 100;
+    control = false;
+  } else {
+    experimentId = spec.substring(0, eq).trim();
+    spec = spec.substring(eq + 1);
+    if (spec.substring(spec.length - 1) == Selection.CONTROL) {
+      control = true;
+      spec = spec.substring(0, spec.length - 1);
+    }
+    fraction = parseInt(spec, 10);
   }
-
-  /** @override */
-  getBody() {
-    return this.doc_.body;
+  if (isNaN(fraction)) {
+    throw new Error('invalid fraction');
   }
 
-  /** @override */
-  isReady() {
-    return isDocumentReady(this.doc_);
+  // Calculate "on"/"off".
+  let on;
+  if (fraction > 99) {
+    // Explicitly "on".
+    on = true;
+  } else if (fraction < 1) {
+    // Explicitly "off".
+    on = false;
+  } else if (win.sessionStorage) {
+    // Fractional and possibly with the control.
+    // Note that:
+    // a. We can't do persistent experiments if storage is not available.
+    // b. We can't run control on more than 20%.
+    control = control && fraction <= 20;
+    try {
+      // Set fraction in the experiment to make it unlaunchable.
+      const storageKey =
+        'subscribe.google.com:e:' +
+        experimentId +
+        ':' +
+        fraction +
+        (control ? 'c' : '');
+      let selection = parseSelection(win.sessionStorage.getItem(storageKey));
+      if (!selection) {
+        // Is experiment/control range?
+        if (win.Math.random() * 100 <= fraction * (control ? 2 : 1)) {
+          const inExperiment = control ? win.Math.random() <= 0.5 : true;
+          selection = inExperiment ? Selection.EXPERIMENT : Selection.CONTROL;
+          win.sessionStorage.setItem(storageKey, selection);
+        }
+      }
+      on = !!selection;
+      if (selection == Selection.CONTROL) {
+        experimentId = 'c-' + experimentId;
+      }
+    } catch (e) {
+      // Ignore: experiment parsing cannot block runtime.
+      on = false;
+      ErrorUtils.throwAsync(e);
+    }
+  } else {
+    on = false;
   }
 
-  /** @override */
-  whenReady() {
-    return whenDocumentReady(this.doc_);
-  }
+  experimentMap[experimentId] = on;
+}
 
-  /** @override */
-  addToFixedLayer(unusedElement) {
-    return Promise.resolve();
-  }
+/**
+ * @param {?string} s
+ * @return {?Selection}
+ */
+function parseSelection(s) {
+  // Do a simple if-then to inline the whole Selection enum.
+  return s == Selection.EXPERIMENT
+    ? Selection.EXPERIMENT
+    : s == Selection.CONTROL
+    ? Selection.CONTROL
+    : null;
 }
 
 /**
- * @param {!Document|!Window|!Doc} input
- * @return {!Doc}
+ * Whether the specified experiment is on or off.
+ * @param {!Window} win
+ * @param {string} experimentId
+ * @return {boolean}
  */
-function resolveDoc(input) {
-  // Is it a `Document`
-  if (/** @type {!Document} */ (input).nodeType === /* DOCUMENT */ 9) {
-    return new GlobalDoc(/** @type {!Document} */ (input));
-  }
-  // Is it a `Window`?
-  if (/** @type {!Window} */ (input).document) {
-    return new GlobalDoc(/** @type {!Window} */ (input));
-  }
-  return /** @type {!Doc} */ (input);
+function isExperimentOn(win, experimentId) {
+  return getExperiments(win)[experimentId] || false;
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * Toggles the experiment on or off. Returns the actual value of the experiment
+ * after toggling is done.
+ * @param {!Window} win
+ * @param {string} experimentId
+ * @param {boolean} on
  */
+function setExperiment(win, experimentId, on) {
+  getExperiments(win)[experimentId] = on;
+}
 
 /**
- * Returns a promise which is resolved after the given duration of animation
- * @param {!Element} el - Element to be observed.
- * @param {!Object<string, string|number>} props - properties to be animated.
- * @param {number} durationMillis - duration of animation.
- * @param {string} curve - transition function for the animation.
- * @return {!Promise} Promise which resolves once the animation is done playing.
+ * @return {!Array<string>}
  */
-function transition(el, props, durationMillis, curve) {
-  const win = el.ownerDocument.defaultView;
-  const previousTransitionValue = el.style.transition || '';
-  return new Promise(resolve => {
-    win.setTimeout(() => {
-      win.setTimeout(resolve, durationMillis);
-      const tr = `${durationMillis}ms ${curve}`;
-      setImportantStyles(
-        el,
-        Object.assign(
-          {
-            'transition': `transform ${tr}, opacity ${tr}`,
-          },
-          props
-        )
-      );
-    });
-  }).then(() => {
-    setImportantStyles(el, {
-      'transition': previousTransitionValue,
-    });
-  });
+function getOnExperiments(win) {
+  const experimentMap = getExperiments(win);
+  const experiments = [];
+  for (const experiment in experimentMap) {
+    if (experimentMap[experiment]) {
+      experiments.push(experiment);
+    }
+  }
+  return experiments;
 }
 
 /**
@@ -7288,192 +7228,393 @@ function transition(el, props, durationMillis, curve) {
  * limitations under the License.
  */
 
-class Graypane {
+/** @const {!Object<string, string>} */
+const iframeStyles = {
+  opacity: '0',
+  position: 'absolute',
+  top: '-10px',
+  left: '-10px',
+  height: '1px',
+  width: '1px',
+};
+
+// The initial iframe load takes ~500 ms.  We will wait at least that long
+// before a page redirect.  Subsequent logs are much faster.  We will wait at
+// most 100 ms.
+const MAX_FIRST_WAIT = 500;
+const MAX_WAIT = 200;
+// If we logged and rapidly redirected, we will add a short delay in case
+// a message hasn't been transmitted yet.
+const TIMEOUT_ERROR = 'AnalyticsService timed out waiting for a response';
+
+/**
+ *
+ * @param {!string} error
+ */
+function createErrorResponse(error) {
+  const response = new FinishedLoggingResponse();
+  response.setComplete(false);
+  response.setError(error);
+  return response;
+}
+
+class AnalyticsService {
   /**
-   * @param {!../model/doc.Doc} doc
-   * @param {number} zIndex
+   * @param {!./deps.DepsDef} deps
    */
-  constructor(doc, zIndex) {
+  constructor(deps) {
     /** @private @const {!../model/doc.Doc} */
-    this.doc_ = doc;
+    this.doc_ = deps.doc();
 
-    /** @private @const {!Element} */
-    this.fadeBackground_ = this.doc_
-      .getWin()
-      .document.createElement('swg-popup-background');
-    setImportantStyles(this.fadeBackground_, {
-      'z-index': zIndex,
-      'display': 'none',
-      'position': 'fixed',
-      'top': 0,
-      'right': 0,
-      'bottom': 0,
-      'left': 0,
-      'background-color': 'rgba(32, 33, 36, .6)',
-    });
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
+
+    /** @private @const {!HTMLIFrameElement} */
+    this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
+      this.doc_.getWin().document,
+      'iframe',
+      {}
+    ));
+    setImportantStyles(this.iframe_, iframeStyles);
+    this.doc_.getBody().appendChild(this.getElement());
+
+    /** @private @type {!boolean} */
+    this.everFinishedLog_ = false;
+
+    /**
+     * @private @const {!AnalyticsContext}
+     */
+    this.context_ = new AnalyticsContext();
+    this.setStaticContext_();
+
+    /** @private {?Promise<!web-activities/activity-ports.ActivityIframePort>} */
+    this.serviceReady_ = null;
+
+    /** @private {?Promise} */
+    this.lastAction_ = null;
+
+    /** @private @const {!ClientEventManager} */
+    this.eventManager_ = deps.eventManager();
+    this.eventManager_.registerEventListener(
+      this.handleClientEvent_.bind(this)
+    );
+
+    // This code creates a 'promise to log' that we can use to ensure all
+    // logging is finished prior to redirecting the page.
+    /** @private {!number} */
+    this.unfinishedLogs_ = 0;
+
+    /** @private {?function(boolean)} */
+    this.loggingResolver_ = null;
+
+    /** @private {?Promise} */
+    this.promiseToLog_ = null;
+
+    // If logging doesn't work don't force the user to wait
+    /** @private {!boolean} */
+    this.loggingBroken_ = false;
+
+    // If logging exceeds the timeouts (see const comments above) don't make
+    // the user wait too long.
+    /** @private {?number} */
+    this.timeout_ = null;
   }
 
   /**
-   * @return {!Element}
+   * @param {string} transactionId
    */
-  getElement() {
-    return this.fadeBackground_;
+  setTransactionId(transactionId) {
+    this.context_.setTransactionId(transactionId);
   }
 
   /**
-   * @return {boolean}
+   * @return {string}
    */
-  isAttached() {
-    return !!this.fadeBackground_.parentNode;
+  getTransactionId() {
+    return /** @type {string} */ (this.context_.getTransactionId());
   }
 
   /**
-   * Attaches the graypane to the document.
+   * @return {?string}
    */
-  attach() {
-    this.doc_.getBody().appendChild(this.fadeBackground_);
+  getSku() {
+    return this.context_.getSku();
   }
 
   /**
-   * Detaches the graypane to the document.
+   * @param {string} sku
    */
-  destroy() {
-    this.doc_.getBody().removeChild(this.fadeBackground_);
+  setSku(sku) {
+    this.context_.setSku(sku);
   }
 
   /**
-   * Shows the graypane.
-   * @param {boolean=} animated
-   * @return {!Promise|undefined}
+   * @param {string} url
    */
-  show(animated = true) {
-    setImportantStyles(this.fadeBackground_, {
-      'display': 'block',
-      'opacity': animated ? 0 : 1,
-    });
-    if (animated) {
-      return transition(
-        this.fadeBackground_,
-        {
-          'opacity': 1,
-        },
-        300,
-        'ease-out'
-      );
+  setUrl(url) {
+    this.context_.setUrl(url);
+  }
+
+  /**
+   * @param {!Array<string>} labels
+   */
+  addLabels(labels) {
+    if (labels && labels.length > 0) {
+      const newLabels = [].concat(this.context_.getLabelList());
+      labels.forEach(label => {
+        if (newLabels.indexOf(label) == -1) {
+          newLabels.push(label);
+        }
+      });
+      this.context_.setLabelList(newLabels);
+    }
+  }
+
+  /**
+   * @return {!HTMLIFrameElement}
+   */
+  getElement() {
+    return this.iframe_;
+  }
+
+  /**
+   * @return {string}
+   * @private
+   */
+  getQueryString_() {
+    return this.doc_.getWin().location.search;
+  }
+
+  /**
+   * @return {string}
+   * @private
+   */
+  getReferrer_() {
+    return this.doc_.getWin().document.referrer;
+  }
+
+  /**
+   * @private
+   */
+  setStaticContext_() {
+    const context = this.context_;
+    // These values should all be available during page load.
+    context.setTransactionId(getUuid());
+    context.setReferringOrigin(parseUrl$1(this.getReferrer_()).origin);
+    context.setClientVersion('SwG 0.1.22.91');
+
+    const utmParams = parseQueryString$1(this.getQueryString_());
+    const campaign = utmParams['utm_campaign'];
+    const medium = utmParams['utm_medium'];
+    const source = utmParams['utm_source'];
+    if (campaign) {
+      context.setUtmCampaign(campaign);
+    }
+    if (medium) {
+      context.setUtmMedium(medium);
+    }
+    if (source) {
+      context.setUtmSource(source);
+    }
+
+    const urlNode = this.doc_
+      .getRootNode()
+      .querySelector("link[rel='canonical']");
+    if (urlNode && urlNode.href) {
+      context.setUrl(urlNode.href);
+    }
+  }
+
+  /**
+   * @return {!Promise<!../components/activities.ActivityIframePort>}
+   */
+  start() {
+    if (!this.serviceReady_) {
+      // Please note that currently openIframe reads the current analytics
+      // context and that it may not contain experiments activated late during
+      // the publishers code lifecycle.
+      this.addLabels(getOnExperiments(this.doc_.getWin()));
+      this.serviceReady_ = this.activityPorts_
+        .openIframe(this.iframe_, feUrl('/serviceiframe'), null, true)
+        .then(
+          port => {
+            // Register a listener for the logging to code indicate it is
+            // finished logging.
+            port.on(FinishedLoggingResponse, this.afterLogging_.bind(this));
+            return port.whenReady().then(() => {
+              // The publisher should be done setting experiments but runtime
+              // will forward them here if they aren't.
+              this.addLabels(getOnExperiments(this.doc_.getWin()));
+              return port;
+            });
+          },
+          message => {
+            // If the port doesn't open register that logging is broken so
+            // nothing is just waiting.
+            this.loggingBroken_ = true;
+            this.afterLogging_(
+              createErrorResponse('Could not connect [' + message + ']')
+            );
+          }
+        );
     }
+    return this.serviceReady_;
   }
 
   /**
-   * Hides the graypane.
-   * @param {boolean=} animated
-   * @return {!Promise|undefined}
+   * @param {boolean} isReadyToPay
    */
-  hide(animated = true) {
-    if (animated) {
-      return transition(
-        this.fadeBackground_,
-        {
-          'opacity': 0,
-        },
-        300,
-        'ease-out'
-      ).then(() => {
-        setImportantStyles(this.fadeBackground_, {'display': 'none'});
-      });
-    }
-    setImportantStyles(this.fadeBackground_, {'display': 'none'});
+  setReadyToPay(isReadyToPay) {
+    this.context_.setReadyToPay(isReadyToPay);
   }
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
 
-/**
- * Loading indicator class. Builds the loading indicator view to be injected in
- * parent element <iframe class="swg-dialog"> element. Provides methods to
- * show/hide loading indicator.
- */
-class LoadingView {
   /**
-   * @param {!Document} doc
    */
-  constructor(doc) {
-    /** @private @const {!Document} */
-    this.doc_ = doc;
+  close() {
+    this.doc_.getBody().removeChild(this.getElement());
+  }
 
-    /** @private @const {!Element} */
-    this.loadingContainer_ = createElement(
-      this.doc_,
-      'swg-loading-container',
-      {}
-    );
+  /**
+   * @return {!AnalyticsContext}
+   */
+  getContext() {
+    return this.context_;
+  }
 
-    /** @private @const {!Element} */
-    this.loading_ = createElement(this.doc_, 'swg-loading', {});
-    this.loadingContainer_.appendChild(this.loading_);
+  /**
+   * @param {!../api/client-event-manager-api.ClientEvent} event
+   * @return {!AnalyticsRequest}
+   */
+  createLogRequest_(event) {
+    const meta = new AnalyticsEventMeta();
+    meta.setEventOriginator(event.eventOriginator);
+    meta.setIsFromUserAction(event.isFromUserAction);
 
-    this.loadingContainer_.style.setProperty('display', 'none', 'important');
+    const request = new AnalyticsRequest();
+    request.setEvent(event.eventType);
+    request.setContext(this.context_);
+    request.setMeta(meta);
+    if (event.additionalParameters instanceof EventParams) {
+      request.setParams(event.additionalParameters);
+    } // Ignore event.additionalParameters.  It may have data we shouldn't log.
+    return request;
+  }
 
-    // Build the animated loading indicator.
-    this.buildLoadingIndicator_();
+  /**
+   * @return {boolean}
+   */
+  shouldLogPublisherEvents_() {
+    return this.deps_.config().enableSwgAnalytics === true;
   }
 
   /**
-   * Gets the populated loading container.
-   * @return {!Element}
+   * @param {!../api/client-event-manager-api.ClientEvent} event
+   * @return {boolean}
    */
-  getElement() {
-    return this.loadingContainer_;
+  shouldAlwaysLogEvent_(event) {
+    /* AMP_CLIENT events are considered publisher events and we generally only
+     * log those if the publisher decided to enable publisher event logging for
+     * privacy purposes.  The page load event is not private and is necessary
+     * just so we know the user is in AMP, so we will log it regardless of
+     * configuration.
+     */
+    return (
+      event.eventType === AnalyticsEvent.IMPRESSION_PAGE_LOAD &&
+      event.eventOriginator === EventOriginator.AMP_CLIENT
+    );
   }
 
   /**
-   * Shows the loading indicator within the container element.
+   *  Listens for new events from the events manager and handles logging
+   * @param {!../api/client-event-manager-api.ClientEvent} event
    */
-  show() {
-    this.loadingContainer_.style.removeProperty('display');
+  handleClientEvent_(event) {
+    //this event is just used to communicate information internally.  It should
+    //not be reported to the SwG analytics service.
+    if (event.eventType === AnalyticsEvent.EVENT_SUBSCRIPTION_STATE) {
+      return;
+    }
+
+    if (
+      ClientEventManager.isPublisherEvent(event) &&
+      !this.shouldLogPublisherEvents_() &&
+      !this.shouldAlwaysLogEvent_(event)
+    ) {
+      return;
+    }
+    // Register we sent a log, the port will call this.afterLogging_ when done.
+    this.unfinishedLogs_++;
+    this.lastAction_ = this.start().then(port =>
+      port.execute(this.createLogRequest_(event))
+    );
   }
 
   /**
-   * Hides the loading indicator within the container element.
+   * This function is called by the iframe after it sends the log to the server.
+   * @param {FinishedLoggingResponse=} response
    */
-  hide() {
-    this.loadingContainer_.style.setProperty('display', 'none', 'important');
+  afterLogging_(response) {
+    const success = (response && response.getComplete()) || false;
+    const error = (response && response.getError()) || 'Unknown logging Error';
+    const isTimeout = error === TIMEOUT_ERROR;
+
+    if (!success) {
+      log_5('Error when logging: ' + error);
+    }
+
+    this.unfinishedLogs_--;
+    if (!isTimeout) {
+      this.everFinishedLog_ = true;
+    }
+
+    // Nothing is waiting
+    if (this.loggingResolver_ === null) {
+      return;
+    }
+
+    if (this.unfinishedLogs_ === 0 || this.loggingBroken_ || isTimeout) {
+      if (this.timeout_ !== null) {
+        clearTimeout(this.timeout_);
+        this.timeout_ = null;
+      }
+      this.loggingResolver_(success);
+      this.promiseToLog_ = null;
+      this.loggingResolver_ = null;
+    }
   }
 
   /**
-   * Populates the loading indivicator. The populated element
-   * can be added in any view, when required.
-   * @private
+   * Please note that logs sent after getLoggingPromise is called are not
+   * guaranteed to be finished when the promise is resolved.  You should call
+   * this function just prior to redirecting the page after SwG is finished
+   * logging.
+   * @return {!Promise}
    */
-  buildLoadingIndicator_() {
-    const loadingContainer = this.loading_;
+  getLoggingPromise() {
+    if (this.unfinishedLogs_ === 0 || this.loggingBroken_) {
+      return Promise.resolve(true);
+    }
+    if (this.promiseToLog_ === null) {
+      this.promiseToLog_ = new Promise(resolve => {
+        this.loggingResolver_ = resolve;
+      });
 
-    const loadingIndicatorTopContainer = createElement(
-      this.doc_,
-      'swg-loading-animate',
-      {}
-    );
-    loadingContainer.appendChild(loadingIndicatorTopContainer);
+      // The promise above should not wait forever if things go wrong.  Let
+      // the user proceed!
+      const whenDone = this.afterLogging_.bind(this);
+      this.timeout_ = setTimeout(
+        () => {
+          this.timeout_ = null;
+          whenDone(createErrorResponse(TIMEOUT_ERROR));
+        },
+        this.everFinishedLog_ ? MAX_WAIT : MAX_FIRST_WAIT
+      );
+    }
 
-    const loadingIndicatorChildContainer = createElement(
-      this.doc_,
-      'swg-loading-image',
-      {}
-    );
-    loadingIndicatorTopContainer.appendChild(loadingIndicatorChildContainer);
+    return this.promiseToLog_;
   }
 }
 
@@ -7493,86 +7634,111 @@ class LoadingView {
  * limitations under the License.
  */
 
-/** @const {!Object<string|number>} */
-const friendlyIframeAttributes = {
-  'frameborder': 0,
+/** @const {!Object<string, string>} */
+const iframeAttributes$1 = {
+  'frameborder': '0',
   'scrolling': 'no',
-  'src': 'about:blank',
 };
 
 /**
- * The class for building friendly iframe.
+ * @enum {string}
  */
-class FriendlyIframe {
+const Theme = {
+  LIGHT: 'light',
+  DARK: 'dark',
+};
+
+/**
+ * The class for Smart button Api.
+ */
+class SmartSubscriptionButtonApi {
   /**
-   * @param {!Document} doc
-   * @param {!Object<string, string|number>=} attrs
+   * @param {!./deps.DepsDef} deps
+   * @param {!Element} button
+   * @param {!../api/subscriptions.SmartButtonOptions} options
+   * @param {function()=} callback
    */
-  constructor(doc, attrs = {}) {
-    const mergedAttrs = Object.assign({}, friendlyIframeAttributes, attrs);
+  constructor(deps, button, options, callback) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
+
+    /** @private @const {!Document} */
+    this.doc_ = this.win_.document;
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
 
     /** @private @const {!HTMLIFrameElement} */
     this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
-      doc,
+      this.doc_,
       'iframe',
-      mergedAttrs
+      iframeAttributes$1
     ));
 
-    // Ensure that the new iframe does not inherit any CSS styles.
-    resetAllStyles(this.iframe_);
-
-    /** @private @const {!Promise} */
-    this.ready_ = new Promise(resolve => {
-      this.iframe_.onload = resolve;
-    });
-  }
+    /** @private @const {!Element} */
+    this.button_ = button;
 
-  /**
-   * When promise is resolved.
-   * @return {!Promise}
-   */
-  whenReady() {
-    return this.ready_;
-  }
+    /** @private {!../api/subscriptions.SmartButtonOptions} */
+    this.options_ = options;
 
-  /**
-   * Gets the iframe element.
-   * @return {!HTMLIFrameElement}
-   */
-  getElement() {
-    return this.iframe_;
-  }
+    /** @private const {function()=} */
+    this.callback_ = callback;
 
-  /**
-   * Gets the document object of the iframe element.
-   * @return {!Document}
-   */
-  getDocument() {
-    const doc =
-      this.getElement().contentDocument ||
-      (this.getElement().contentWindow &&
-        this.getElement().contentWindow.document);
+    /** @private @const {string} */
+    this.src_ = feUrl('/smartboxiframe');
 
-    if (!doc) {
-      throw new Error('not loaded');
+    const frontendArguments = {
+      'productId': this.deps_.pageConfig().getProductId(),
+      'publicationId': this.deps_.pageConfig().getPublicationId(),
+      'theme': (this.options_ && this.options_.theme) || 'light',
+      'lang': (this.options_ && this.options_.lang) || 'en',
+    };
+    const messageTextColor = this.options_ && this.options_.messageTextColor;
+    if (messageTextColor) {
+      frontendArguments['messageTextColor'] = messageTextColor;
     }
-    return doc;
+
+    /** @private @const {!Object} */
+    this.args_ = feArgs(frontendArguments);
   }
 
   /**
-   * Gets the body of the iframe.
-   * @return {!Element}
+   * @param {SmartBoxMessage} smartBoxMessage
    */
-  getBody() {
-    return /** @type {!Element} */ (this.getDocument().body);
+  handleSmartBoxClick_(smartBoxMessage) {
+    if (smartBoxMessage && smartBoxMessage.getIsClicked()) {
+      if (!this.callback_) {
+        throw new Error('No callback!');
+      }
+      this.callback_();
+      return;
+    }
   }
 
   /**
-   * Whether the iframe is connected.
-   * @return {boolean}
+   * Make a call to build button content and listens for the 'click' message.
+   * @return {!Element}
    */
-  isConnected() {
-    return isConnected(this.getElement());
+  start() {
+    setImportantStyles(this.iframe_, {
+      'opacity': 1,
+      'position': 'absolute',
+      'top': 0,
+      'bottom': 0,
+      'left': 0,
+      'height': '100%',
+      'right': 0,
+      'width': '100%',
+    });
+    this.button_.appendChild(this.iframe_);
+    const args = this.activityPorts_.addDefaultArguments(this.args_);
+    this.activityPorts_.openIframe(this.iframe_, this.src_, args).then(port => {
+      port.on(SmartBoxMessage, this.handleSmartBoxClick_.bind(this));
+    });
+    return this.iframe_;
   }
 }
 
@@ -7592,631 +7758,576 @@ class FriendlyIframe {
  * limitations under the License.
  */
 
-const Z_INDEX = 2147483647;
-
-/**
- * Default iframe important styles.
- * Note: The iframe responsiveness media query style is injected in the
- * publisher's page since style attribute can not include media query.
- * @const {!Object<string, string|number>}
- */
-const rootElementImportantStyles = {
-  'min-height': '50px',
-  'border': 'none',
-  'display': 'block',
-  'position': 'fixed',
-  'z-index': Z_INDEX,
-  'box-sizing': 'border-box',
-};
-
-/**
- * Reset view styles.
- * @const {!Object<string, string|number>}
- */
-const resetViewStyles = {
-  'position': 'absolute',
-  'top': '0',
-  'left': '0',
-  'right': '0',
-  'bottom': '0',
-  'opacity': 0,
-  /* These lines are a work around to this issue in iOS:     */
-  /* https://bugs.webkit.org/show_bug.cgi?id=155198          */
-  'height': 0,
-  'max-height': '100%',
-  'max-width': '100%',
-  'min-height': '100%',
-  'min-width': '100%',
-  'width': 0,
-};
-
-/**
- * Position of the dialog.
- * @const @enum {string}
- */
-const PositionAt = {
-  BOTTOM: 'BOTTOM',
-  TOP: 'TOP',
-  FLOAT: 'FLOAT',
-  FULL: 'FULL',
-};
+/** English is the default language. */
+const DEFAULT_LANGUAGE_CODE = 'en';
 
 /**
- * The class for the top level dialog.
- * @final
+ * Gets a message for a given language code, from a map of messages.
+ * @param {!Object<string, string>} map
+ * @param {?string|?Element} languageCodeOrElement
+ * @return {?string}
  */
-class Dialog {
-  /**
-   * Create a dialog for the provided doc.
-   * @param {!../model/doc.Doc} doc
-   * @param {!Object<string, string|number>=} importantStyles
-   * @param {!Object<string, string|number>=} styles
-   */
-  constructor(doc, importantStyles = {}, styles = {}) {
-    /** @private @const {!../model/doc.Doc} */
-    this.doc_ = doc;
-
-    /** @private @const {!FriendlyIframe} */
-    this.iframe_ = new FriendlyIframe(doc.getWin().document, {
-      'class': 'swg-dialog',
-    });
-
-    /** @private @const {!Graypane} */
-    this.graypane_ = new Graypane(doc, Z_INDEX - 1);
-
-    const modifiedImportantStyles = Object.assign(
-      {},
-      rootElementImportantStyles,
-      importantStyles
-    );
-    setImportantStyles(this.iframe_.getElement(), modifiedImportantStyles);
-
-    setStyles(this.iframe_.getElement(), styles);
+function msg(map, languageCodeOrElement) {
+  const defaultMsg = map[DEFAULT_LANGUAGE_CODE];
 
-    /** @private {LoadingView} */
-    this.loadingView_ = null;
+  // Verify params.
+  if (typeof map !== 'object' || !languageCodeOrElement) {
+    return defaultMsg;
+  }
 
-    /** @private {?Element} */
-    this.container_ = null; // Depends on constructed document inside iframe.
+  // Get language code.
+  let languageCode =
+    typeof languageCodeOrElement === 'string'
+      ? languageCodeOrElement
+      : getLanguageCodeFromElement(languageCodeOrElement);
 
-    /** @private {?./view.View} */
-    this.view_ = null;
+  // Normalize language code.
+  languageCode = languageCode.toLowerCase();
+  languageCode = languageCode.replace(/_/g, '-');
 
-    /** @private {?Promise} */
-    this.animating_ = null;
+  // Search for a message matching the language code.
+  // If a message can't be found, try again with a less specific language code.
+  const languageCodeSegments = languageCode.split('-');
+  while (languageCodeSegments.length) {
+    const key = languageCodeSegments.join('-');
+    if (key in map) {
+      return map[key];
+    }
 
-    /** @private {boolean} */
-    this.hidden_ = false;
+    // Simplify language code.
+    // Ex: "en-US-SF" => "en-US"
+    languageCodeSegments.pop();
+  }
 
-    /** @private {?./view.View} */
-    this.previousProgressView_ = null;
+  // There was an attempt.
+  return defaultMsg;
+}
 
-    /** @private {boolean} */
-    this.useFixedLayer_ = false;
+/**
+ * Gets a language code (ex: "en-US") from a given Element.
+ * @param {!Element} element
+ * @return {string}
+ */
+function getLanguageCodeFromElement(element) {
+  if (element.lang) {
+    // Get language from element itself.
+    return element.lang;
   }
 
-  /**
-   * Opens the dialog and builds the iframe container.
-   * @param {boolean=} hidden
-   * @return {!Promise<!Dialog>}
-   */
-  open(hidden = false) {
-    const iframe = this.iframe_;
-    if (iframe.isConnected()) {
-      throw new Error('already opened');
-    }
-
-    // Attach.
-    this.doc_.getBody().appendChild(iframe.getElement()); // Fires onload.
+  if (element.ownerDocument && element.ownerDocument.documentElement.lang) {
+    // Get language from element's document.
+    return element.ownerDocument.documentElement.lang;
+  }
 
-    this.graypane_.attach();
+  // There was an attempt.
+  return DEFAULT_LANGUAGE_CODE;
+}
 
-    if (hidden) {
-      setImportantStyles(iframe.getElement(), {
-        'visibility': 'hidden',
-        'opacity': 0,
-      });
-      this.hidden_ = hidden;
-    } else {
-      this.show_();
-    }
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-    if (this.useFixedLayer_) {
-      return this.doc_
-        .addToFixedLayer(iframe.getElement())
-        .then(() => iframe.whenReady())
-        .then(() => {
-          this.buildIframe_();
-          return this;
-        });
-    } else {
-      return iframe.whenReady().then(() => {
-        this.buildIframe_();
-        return this;
-      });
-    }
-  }
+/**
+ * The button title should match that of button's SVG.
+ */
+/** @type {!Object<string, string>} */
+const TITLE_LANG_MAP = {
+  'en': 'Subscribe with Google',
+  'ar': 'Google اشترك مع',
+  'de': 'Abonnieren mit Google',
+  'es': 'Suscríbete con Google',
+  'es-latam': 'Suscríbete con Google',
+  'es-latn': 'Suscríbete con Google',
+  'fr': "S'abonner avec Google",
+  'hi': 'Google के ज़रिये सदस्यता',
+  'id': 'Berlangganan dengan Google',
+  'it': 'Abbonati con Google',
+  'jp': 'Google で購読',
+  'ko': 'Google 을 통한구독',
+  'ms': 'Langgan dengan Google',
+  'nl': 'Abonneren via Google',
+  'no': 'Abonner med Google',
+  'pl': 'Subskrybuj z Google',
+  'pt': 'Subscrever com o Google',
+  'pt-br': 'Assine com o Google',
+  'ru': 'Подпиcka через Google',
+  'se': 'Prenumerera med Google',
+  'th': 'สมัครฟาน Google',
+  'tr': 'Google ile Abone Ol',
+  'uk': 'Підписатися через Google',
+  'zh-tw': '透過 Google 訂閱',
+};
 
+/**
+ * The button stylesheet can be found in the `/assets/swg-button.css`.
+ * It's produced by the `gulp assets` task and deployed to
+ * `https://news.google.com/swg/js/v1/swg-button.css`.
+ */
+class ButtonApi {
   /**
-   * Build the iframe with the styling after iframe is loaded.
-   * @private
-   */
-  buildIframe_() {
-    const iframe = this.iframe_;
-    const iframeBody = iframe.getBody();
-    const iframeDoc = /** @type {!HTMLDocument} */ (this.iframe_.getDocument());
-
-    // Inject Google fonts in <HEAD> section of the iframe.
-    injectStyleSheet(resolveDoc(iframeDoc), CSS$1);
-
-    // Add Loading indicator.
-    this.loadingView_ = new LoadingView(iframeDoc);
-    iframeBody.appendChild(this.loadingView_.getElement());
+   * @param {!../model/doc.Doc} doc
+   * @param {!Promise<!./runtime.ConfiguredRuntime>} configuredRuntimePromise
+   */
+  constructor(doc, configuredRuntimePromise) {
+    /** @private @const {!../model/doc.Doc} */
+    this.doc_ = doc;
 
-    // Container for all dynamic content, including 3P iframe.
-    this.container_ = createElement(iframeDoc, 'swg-container', {});
-    iframeBody.appendChild(this.container_);
-    this.setPosition_();
+    /** @private @const {!Promise<!./runtime.ConfiguredRuntime>} */
+    this.configuredRuntimePromise_ = configuredRuntimePromise;
   }
 
   /**
-   * Closes the dialog.
-   * @param {boolean=} animated
-   * @return {!Promise}
    */
-  close(animated = true) {
-    let animating;
-    if (animated) {
-      animating = this.animate_(() => {
-        this.graypane_.hide(/* animate */ true);
-        return transition(
-          this.getElement(),
-          {
-            'transform': 'translateY(100%)',
-          },
-          300,
-          'ease-out'
-        );
-      });
-    } else {
-      animating = Promise.resolve();
+  init() {
+    const head = this.doc_.getHead();
+    if (!head) {
+      return;
     }
-    return animating.then(() => {
-      const iframeEl = this.iframe_.getElement();
-      iframeEl.parentNode.removeChild(iframeEl);
 
-      this.removePaddingToHtml_();
-      this.graypane_.destroy();
-    });
+    const url = 'https://news.google.com/swg/js/v1/swg-button.css';
+    const existing = head.querySelector(`link[href="${url}"]`);
+    if (existing) {
+      return;
+    }
+
+    // <link rel="stylesheet" href="..." type="text/css">
+    head.appendChild(
+      createElement(this.doc_.getWin().document, 'link', {
+        'rel': 'stylesheet',
+        'type': 'text/css',
+        'href': url,
+      })
+    );
   }
 
   /**
-   * Gets the container within the dialog.
+   * @param {!../api/subscriptions.ButtonOptions|function()} optionsOrCallback
+   * @param {function()=} callback
    * @return {!Element}
    */
-  getContainer() {
-    if (!this.container_) {
-      throw new Error('not opened yet');
-    }
-    return this.container_;
+  create(optionsOrCallback, callback) {
+    const button = createElement(this.doc_.getWin().document, 'button', {});
+    return this.attach(button, optionsOrCallback, callback);
   }
 
   /**
-   * Gets the attached iframe instance.
-   * @return {!FriendlyIframe}
+   * @param {!Element} button
+   * @param {../api/subscriptions.ButtonOptions|function()} optionsOrCallback
+   * @param {function()=} callback
+   * @return {!Element}
    */
-  getIframe() {
-    return this.iframe_;
+  attach(button, optionsOrCallback, callback) {
+    const options = this.setupButtonAndGetParams_(
+      button,
+      optionsOrCallback,
+      callback
+    ).options;
+
+    const theme = options['theme'];
+    button.classList.add(`swg-button-${theme}`);
+    button.setAttribute('role', 'button');
+    if (options['lang']) {
+      button.setAttribute('lang', options['lang']);
+    }
+    button.setAttribute('title', msg(TITLE_LANG_MAP, button) || '');
+    this.logSwgEvent_(AnalyticsEvent.IMPRESSION_SWG_BUTTON);
+
+    return button;
   }
 
   /**
-   * Gets the Iframe element.
-   * @return {!HTMLIFrameElement}
+   * @param {!AnalyticsEvent} eventType
+   * @param {boolean=} isFromUserAction
    */
-  getElement() {
-    return this.iframe_.getElement();
+  logSwgEvent_(eventType, isFromUserAction) {
+    this.configuredRuntimePromise_.then(configuredRuntime => {
+      configuredRuntime.eventManager().logSwgEvent(eventType, isFromUserAction);
+    });
   }
 
   /**
-   * Transitions to the next view.
+   *
+   * @param {../api/subscriptions.ButtonOptions|../api/subscriptions.SmartButtonOptions|function()} optionsOrCallback
+   * @return {!../api/subscriptions.ButtonOptions|!../api/subscriptions.SmartButtonOptions}
    * @private
    */
-  entryTransitionToNextView_() {
-    if (this.view_ && this.view_.hasLoadingIndicator()) {
-      // Temporarily cache the old view.
-      this.previousProgressView_ = this.view_;
-    } else {
-      // Since loading indicator will be shown, remove contents of old view.
-      removeChildren(this.getContainer());
-      // When loading indicator was not displayed in the previous view,
-      // loading indicator must be displayed while transitioning to new view.
-      this.loadingView_.show();
+  getOptions_(optionsOrCallback) {
+    const options =
+      /** @type {!../api/subscriptions.ButtonOptions|!../api/subscriptions.SmartButtonOptions} */ (optionsOrCallback &&
+      typeof optionsOrCallback != 'function'
+        ? optionsOrCallback
+        : {'theme': Theme.LIGHT});
+
+    const theme = options['theme'];
+    if (theme !== Theme.LIGHT && theme !== Theme.DARK) {
+      options['theme'] = Theme.LIGHT;
     }
+    return options;
   }
 
   /**
-   * Transition out of an old view.
+   *
+   * @param {?../api/subscriptions.ButtonOptions|?../api/subscriptions.SmartButtonOptions|function()} optionsOrCallback
+   * @param {function()=} callback
+   * @return {function()|function(Event):boolean}
    * @private
    */
-  exitTransitionFromOldView_() {
-    // If previous view is still around, remove it.
-    if (this.previousProgressView_) {
-      removeElement(this.previousProgressView_.getElement());
-      this.previousProgressView_ = null;
-    } else {
-      this.loadingView_.hide();
-    }
+  getCallback_(optionsOrCallback, callback) {
+    return (
+      /** @type {function()|function(Event):boolean} */ ((typeof optionsOrCallback ==
+      'function'
+        ? optionsOrCallback
+        : null) || callback)
+    );
   }
 
-  /** @return {?./view.View} */
-  getCurrentView() {
-    return this.view_;
+  /**
+   * @param {!Element} button
+   * @param {../api/subscriptions.SmartButtonOptions|function()|../api/subscriptions.ButtonOptions} optionsOrCallback
+   * @param {function()=} callbackFun
+   * @return {ButtonParams}
+   */
+  setupButtonAndGetParams_(button, optionsOrCallback, callbackFun) {
+    const options = this.getOptions_(optionsOrCallback);
+    const callback = this.getCallback_(optionsOrCallback, callbackFun);
+    const clickFun = event => {
+      this.logSwgEvent_(AnalyticsEvent.ACTION_SWG_BUTTON_CLICK, true);
+      if (typeof callback === 'function') {
+        callback(event);
+      }
+    };
+    button.addEventListener('click', clickFun);
+    return {options, clickFun};
   }
 
   /**
-   * Opens the given view and removes existing view from the DOM if any.
-   * @param {!./view.View} view
-   * @return {!Promise}
+   * @param {!./deps.DepsDef} deps
+   * @param {!Element} button
+   * @param {../api/subscriptions.SmartButtonOptions|function()} optionsOrCallback
+   * @param {function()=} callback
+   * @return {!Element}
    */
-  openView(view) {
-    setImportantStyles(view.getElement(), resetViewStyles);
-    this.entryTransitionToNextView_();
+  attachSmartButton(deps, button, optionsOrCallback, callback) {
+    const params = this.setupButtonAndGetParams_(
+      button,
+      optionsOrCallback,
+      callback
+    );
+    // Add required CSS class, if missing.
+    button.classList.add('swg-smart-button');
+    return new SmartSubscriptionButtonApi(
+      deps,
+      button,
+      params.options,
+      params.clickFun
+    ).start();
+  }
+}
 
-    this.view_ = view;
-    this.getContainer().appendChild(view.getElement());
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-    // If the current view should fade the parent document.
-    if (view.shouldFadeBody() && !this.hidden_) {
-      this.graypane_.show(/* animate */ true);
-    }
+/** @enum {number} */
+const CallbackId = {
+  ENTITLEMENTS: 1,
+  SUBSCRIBE_REQUEST: 2,
+  PAYMENT_RESPONSE: 3,
+  LOGIN_REQUEST: 4,
+  LINK_PROGRESS: 5,
+  LINK_COMPLETE: 6,
+  FLOW_STARTED: 7,
+  FLOW_CANCELED: 8,
+};
 
-    return view.init(this).then(() => {
-      setImportantStyles(view.getElement(), {
-        'opacity': 1,
-      });
-      if (this.hidden_) {
-        if (view.shouldFadeBody()) {
-          this.graypane_.show(/* animated */ true);
-        }
-        this.show_();
-      }
-      this.exitTransitionFromOldView_();
-    });
+/**
+ */
+class Callbacks {
+  /**
+   */
+  constructor() {
+    /** @private @const {!Object<CallbackId, function(*)>} */
+    this.callbacks_ = {};
+    /** @private @const {!Object<CallbackId, *>} */
+    this.resultBuffer_ = {};
+    /** @private {?Promise} */
+    this.paymentResponsePromise_ = null;
   }
 
   /**
-   * Show the iframe.
-   * @private
+   * @param {function(!Promise<!../api/entitlements.Entitlements>)} callback
    */
-  show_() {
-    this.animate_(() => {
-      setImportantStyles(this.getElement(), {
-        'transform': 'translateY(100%)',
-        'opactiy': 1,
-        'visibility': 'visible',
-      });
-      return transition(
-        this.getElement(),
-        {
-          'transform': 'translateY(0)',
-          'opacity': 1,
-          'visibility': 'visible',
-        },
-        300,
-        'ease-out'
-      );
-    });
-    this.hidden_ = false;
+  setOnEntitlementsResponse(callback) {
+    this.setCallback_(CallbackId.ENTITLEMENTS, callback);
+  }
+
+  /**
+   * @param {!Promise<!../api/entitlements.Entitlements>} promise
+   */
+  triggerEntitlementsResponse(promise) {
+    return this.trigger_(
+      CallbackId.ENTITLEMENTS,
+      promise.then(res => res.clone())
+    );
   }
 
   /**
-   * Resizes the dialog container.
-   * @param {!./view.View} view
-   * @param {number} height
-   * @param {boolean=} animated
-   * @return {?Promise}
+   * @return {boolean}
    */
-  resizeView(view, height, animated = true) {
-    if (this.view_ != view) {
-      return null;
-    }
-    const newHeight = this.getMaxAllowedHeight_(height);
-
-    let animating;
-    if (animated) {
-      const oldHeight = this.getElement().offsetHeight;
-      if (newHeight >= oldHeight) {
-        // Expand.
-        animating = this.animate_(() => {
-          setImportantStyles(this.getElement(), {
-            'height': `${newHeight}px`,
-            'transform': `translateY(${newHeight - oldHeight}px)`,
-          });
-          return transition(
-            this.getElement(),
-            {
-              'transform': 'translateY(0)',
-            },
-            300,
-            'ease-out'
-          );
-        });
-      } else {
-        // Collapse.
-        animating = this.animate_(() => {
-          return transition(
-            this.getElement(),
-            {
-              'transform': `translateY(${oldHeight - newHeight}px)`,
-            },
-            300,
-            'ease-out'
-          ).then(() => {
-            setImportantStyles(this.getElement(), {
-              'height': `${newHeight}px`,
-              'transform': 'translateY(0)',
-            });
-          });
-        });
-      }
-    } else {
-      setImportantStyles(this.getElement(), {
-        'height': `${newHeight}px`,
-      });
-      animating = Promise.resolve();
-    }
-    return animating.then(() => {
-      this.updatePaddingToHtml_(height);
-      view.resized();
-    });
+  hasEntitlementsResponsePending() {
+    return !!this.resultBuffer_[CallbackId.ENTITLEMENTS];
   }
 
   /**
-   * @param {function():!Promise} callback
-   * @return {!Promise}
-   * @private
+   * @param {function(!../api/subscriptions.LoginRequest)} callback
    */
-  animate_(callback) {
-    const wait = this.animating_ || Promise.resolve();
-    return (this.animating_ = wait
-      .then(
-        () => {
-          return callback();
-        },
-        () => {
-          // Ignore errors to make sure animations don't get stuck.
-        }
-      )
-      .then(() => {
-        this.animating_ = null;
-      }));
+  setOnLoginRequest(callback) {
+    this.setCallback_(CallbackId.LOGIN_REQUEST, callback);
   }
 
   /**
-   * Returns maximum allowed height for current viewport.
-   * @param {number} height
-   * @return {number}
-   * @private
+   * @param {!../api/subscriptions.LoginRequest} request
+   * @return {boolean} Whether the callback has been found.
    */
-  getMaxAllowedHeight_(height) {
-    return Math.min(height, this.doc_.getWin()./*OK*/ innerHeight * 0.9);
+  triggerLoginRequest(request) {
+    return this.trigger_(CallbackId.LOGIN_REQUEST, request);
   }
 
   /**
-   * Gets the element's height.
-   * @return {number}
-   * @private
+   * @param {function()} callback
    */
-  getHeight_() {
-    return this.getElement().offsetHeight;
+  setOnLinkProgress(callback) {
+    this.setCallback_(CallbackId.LINK_PROGRESS, callback);
   }
 
   /**
-   * Sets the position of the dialog. Currently 'BOTTOM' is set by default.
+   * @return {boolean} Whether the callback has been found.
    */
-  setPosition_() {
-    setImportantStyles(this.getElement(), this.getPositionStyle_());
+  triggerLinkProgress() {
+    return this.trigger_(CallbackId.LINK_PROGRESS, true);
   }
 
   /**
-   * Add the padding to the containing page so as to not hide the content
-   * behind the popup, if rendered at the bottom.
-   * @param {number} newHeight
-   * @private
    */
-  updatePaddingToHtml_(newHeight) {
-    if (this.inferPosition_() == PositionAt.BOTTOM) {
-      const bottomPadding = newHeight + 20; // Add some extra padding.
-      const htmlElement = this.doc_.getRootElement();
-      setImportantStyles(htmlElement, {
-        'padding-bottom': `${bottomPadding}px`,
-      });
-    }
+  resetLinkProgress() {
+    this.resetCallback_(CallbackId.LINK_PROGRESS);
   }
 
   /**
-   * Removes previouly added bottom padding from the document.
-   * @private
+   * @param {function()} callback
    */
-  removePaddingToHtml_() {
-    this.doc_.getRootElement().style.removeProperty('padding-bottom');
+  setOnLinkComplete(callback) {
+    this.setCallback_(CallbackId.LINK_COMPLETE, callback);
   }
 
   /**
-   * Calculates the position of the dialog. Currently dialog is positioned at
-   * the bottom only. This could change in future to adjust the dialog position
-   * based on the screen size.
-   * @return {string}
-   * @private
+   * @return {boolean} Whether the callback has been found.
    */
-  inferPosition_() {
-    return PositionAt.BOTTOM;
+  triggerLinkComplete() {
+    return this.trigger_(CallbackId.LINK_COMPLETE, true);
   }
 
   /**
-   * Returns the styles required to postion the dialog.
-   * @return {!Object<string, string|number>}
-   * @private
+   * @return {boolean}
    */
-  getPositionStyle_() {
-    const dialogPosition = this.inferPosition_();
-    switch (dialogPosition) {
-      case PositionAt.BOTTOM:
-        return {'bottom': 0};
-      case PositionAt.TOP:
-        return {'top': 0};
-      case PositionAt.FLOAT:
-        return {
-          'position': 'fixed',
-          'top': '50%',
-          'left': '50%',
-          'transform': 'translate(-50%, -50%)',
-        };
-      case PositionAt.FULL:
-        return {
-          'position': 'fixed',
-          'height': '100%',
-          'top': 0,
-          'bottom': 0,
-        };
-      default:
-        return {'bottom': 0};
-    }
+  hasLinkCompletePending() {
+    return !!this.resultBuffer_[CallbackId.LINK_COMPLETE];
   }
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
 
-const POPUP_Z_INDEX = 2147483647;
+  /**
+   * @param {function()} callback
+   */
+  setOnSubscribeRequest(callback) {
+    this.setCallback_(CallbackId.SUBSCRIBE_REQUEST, callback);
+  }
 
-/**
- * The class for the top level dialog.
- * @final
- */
-class DialogManager {
   /**
-   * @param {!../model/doc.Doc} doc
+   * @return {boolean} Whether the callback has been found.
    */
-  constructor(doc) {
-    /** @private @const {!../model/doc.Doc} */
-    this.doc_ = doc;
+  triggerSubscribeRequest() {
+    return this.trigger_(CallbackId.SUBSCRIBE_REQUEST, true);
+  }
 
-    /** @private {?Dialog} */
-    this.dialog_ = null;
+  /**
+   * @return {boolean}
+   */
+  hasSubscribeRequestCallback() {
+    return !!this.callbacks_[CallbackId.SUBSCRIBE_REQUEST];
+  }
 
-    /** @private {?Promise<!Dialog>} */
-    this.openPromise_ = null;
+  /**
+   * @param {function(!Promise<!../api/subscribe-response.SubscribeResponse>)} callback
+   */
+  setOnSubscribeResponse(callback) {
+    log_4(
+      `[swg.js:setOnSubscribeResponse]: This method has been deprecated, please switch usages to 'setOnPaymentResponse'`
+    );
+    this.setCallback_(CallbackId.PAYMENT_RESPONSE, callback);
+  }
 
-    /** @private @const {!Graypane} */
-    this.popupGraypane_ = new Graypane(doc, POPUP_Z_INDEX);
+  /**
+   * @param {function(!Promise<!../api/subscribe-response.SubscribeResponse>)} callback
+   */
+  setOnContributionResponse(callback) {
+    log_4(
+      `[swg.js:setOnContributionResponse]: This method has been deprecated, please switch usages to 'setOnPaymentResponse'`
+    );
+    this.setCallback_(CallbackId.PAYMENT_RESPONSE, callback);
+  }
 
-    /** @private {?Window} */
-    this.popupWin_ = null;
+  /**
+   * @param {function(!Promise<!../api/subscribe-response.SubscribeResponse>)} callback
+   */
+  setOnPaymentResponse(callback) {
+    this.setCallback_(CallbackId.PAYMENT_RESPONSE, callback);
+  }
 
-    this.popupGraypane_.getElement().addEventListener('click', () => {
-      if (this.popupWin_) {
-        try {
-          this.popupWin_.focus();
-        } catch (e) {
-          // Ignore error.
+  /**
+   * @param {!Promise<!../api/subscribe-response.SubscribeResponse>} responsePromise
+   * @return {boolean} Whether the callback has been found.
+   */
+  triggerPaymentResponse(responsePromise) {
+    this.paymentResponsePromise_ = responsePromise.then(
+      res => {
+        this.trigger_(
+          CallbackId.PAYMENT_RESPONSE,
+          Promise.resolve(res.clone())
+        );
+      },
+      reason => {
+        if (isCancelError(reason)) {
+          return;
         }
+        throw reason;
       }
-    });
+    );
+    return !!this.callbacks_[CallbackId.PAYMENT_RESPONSE];
   }
 
   /**
-   * @param {boolean=} hidden
-   * @return {!Promise<!Dialog>}
+   * @return {boolean}
    */
-  openDialog(hidden = false) {
-    if (!this.openPromise_) {
-      this.dialog_ = new Dialog(this.doc_);
-      this.openPromise_ = this.dialog_.open(hidden);
-    }
-    return this.openPromise_;
+  hasPaymentResponsePending() {
+    return !!this.resultBuffer_[CallbackId.PAYMENT_RESPONSE];
   }
 
   /**
-   * @param {!./view.View} view
-   * @param {boolean=} hidden
-   * @return {!Promise}
+   * @param {function({flow: string, data: !Object})} callback
    */
-  openView(view, hidden = false) {
-    view.whenComplete().catch(reason => {
-      if (isCancelError(reason)) {
-        this.completeView(view);
-      }
-      throw reason;
-    });
-    return this.openDialog(hidden).then(dialog => {
-      return dialog.openView(view);
+  setOnFlowStarted(callback) {
+    this.setCallback_(CallbackId.FLOW_STARTED, callback);
+  }
+
+  /**
+   * @param {string} flow
+   * @param {!Object=} data
+   * @return {boolean} Whether the callback has been found.
+   */
+  triggerFlowStarted(flow, data = {}) {
+    return this.trigger_(CallbackId.FLOW_STARTED, {
+      flow,
+      data,
     });
   }
 
   /**
-   * @param {?./view.View} view
+   * @param {function({flow: string, data: !Object})} callback
    */
-  completeView(view) {
-    // Give a small amount of time for another view to take over the dialog.
-    setTimeout(() => {
-      if (this.dialog_ && this.dialog_.getCurrentView() == view) {
-        this.close_();
-      }
-    }, 100);
+  setOnFlowCanceled(callback) {
+    this.setCallback_(CallbackId.FLOW_CANCELED, callback);
   }
 
   /**
+   * @param {string} flow
+   * @param {!Object=} data
+   * @return {boolean} Whether the callback has been found.
    */
-  completeAll() {
-    if (this.dialog_) {
-      this.close_();
+  triggerFlowCanceled(flow, data = {}) {
+    return this.trigger_(CallbackId.FLOW_CANCELED, {
+      flow,
+      data,
+    });
+  }
+
+  /**
+   * @param {!CallbackId} id
+   * @param {function(?)} callback
+   * @private
+   */
+  setCallback_(id, callback) {
+    if (this.callbacks_[id]) {
+      log_4(
+        `[swg.js]: You have registered multiple callbacks for the same response.`
+      );
     }
-    if (this.popupGraypane_.isAttached()) {
-      this.popupGraypane_.destroy();
+    this.callbacks_[id] = callback;
+    // If result already exist, execute the callback right away.
+    if (id in this.resultBuffer_) {
+      this.executeCallback_(id, callback, this.resultBuffer_[id]);
     }
   }
 
-  /** @private */
-  close_() {
-    this.dialog_.close();
-    this.dialog_ = null;
-    this.openPromise_ = null;
+  /**
+   * @param {!CallbackId} id
+   * @param {*} data
+   * @return {boolean}
+   * @private
+   */
+  trigger_(id, data) {
+    this.resultBuffer_[id] = data;
+    const callback = this.callbacks_[id];
+    if (callback) {
+      this.executeCallback_(id, callback, data);
+    }
+    return !!callback;
   }
 
   /**
-   * @param {?Window|undefined} targetWin
+   * @param {!CallbackId} id
+   * @private
    */
-  popupOpened(targetWin) {
-    this.popupWin_ = targetWin || null;
-    if (!this.popupGraypane_.isAttached()) {
-      this.popupGraypane_.attach();
+  resetCallback_(id) {
+    if (id in this.resultBuffer_) {
+      delete this.resultBuffer_[id];
     }
-    this.popupGraypane_.show();
   }
 
   /**
+   * @param {!CallbackId} id
+   * @param {function(*)} callback
+   * @param {*} data
+   * @private
    */
-  popupClosed() {
-    this.popupWin_ = null;
-    try {
-      this.popupGraypane_.hide();
-    } catch (e) {
-      // Ignore.
-    }
+  executeCallback_(id, callback, data) {
+    // Always execute callbacks in a microtask.
+    Promise.resolve().then(() => {
+      callback(data);
+      this.resetCallback_(id);
+    });
   }
 }
 
@@ -8236,157 +8347,105 @@ class DialogManager {
  * limitations under the License.
  */
 
-/** @const {!Object<string, string|number>} */
-const toastImportantStyles = {
-  'height': 0,
-};
-
-/** @const {!Object<string, string>} */
-const iframeAttributes$2 = {
-  'frameborder': '0',
-  'scrolling': 'no',
-  'class': 'swg-toast',
-};
-
 /**
- * The class Notification toast.
+ * The class for Contributions flow.
  */
-class Toast {
+class ContributionsFlow {
   /**
-   * @param {!../runtime/deps.DepsDef} deps
-   * @param {string} src
-   * @param {!Object<string, ?>} args
+   * @param {!./deps.DepsDef} deps
+   * @param {!../api/subscriptions.OffersRequest|undefined} options
    */
-  constructor(deps, src, args) {
-    /** @private @const {!../model/doc.Doc} */
-    this.doc_ = deps.doc();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {string} */
-    this.src_ = src;
-
-    /** @private @const {!Object<string, ?>} */
-    this.args_ = args;
+  constructor(deps, options) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
 
-    /** @private {?Promise} */
-    this.animating_ = null;
+    /** @private @const {!../api/subscriptions.OffersRequest|undefined} */
+    this.options_ = options;
 
-    /** @private @const {!HTMLIFrameElement} */
-    this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
-      this.doc_.getWin().document,
-      'iframe',
-      iframeAttributes$2
-    ));
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
 
-    setImportantStyles(this.iframe_, toastImportantStyles);
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
 
-    /** @private @const {!Promise} */
-    this.ready_ = new Promise(resolve => {
-      this.iframe_.onload = resolve;
-    });
-  }
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
 
-  /**
-   * Returns the iframe element.
-   * @return {!HTMLIFrameElement}
-   */
-  getElement() {
-    return this.iframe_;
-  }
+    const isClosable = (options && options.isClosable) || true;
 
-  /**
-   * Opens the notification toast.
-   * @return {!Promise}
-   */
-  open() {
-    this.doc_.getBody().appendChild(this.iframe_); // Fires onload.
-    return this.buildToast_();
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/contributionsiframe'),
+      feArgs({
+        'productId': deps.pageConfig().getProductId(),
+        'publicationId': deps.pageConfig().getPublicationId(),
+        'productType': ProductType.UI_CONTRIBUTION,
+        'list': (options && options.list) || 'default',
+        'skus': (options && options.skus) || null,
+        'isClosable': isClosable,
+      }),
+      /* shouldFadeBody */ true
+    );
   }
 
   /**
-   * Builds the content of the iframe. On load, animates the toast.
+   * @param {AlreadySubscribedResponse} response
    */
-  buildToast_() {
-    const toastDurationSeconds = 7;
-    return this.activityPorts_
-      .openIframe(this.iframe_, this.src_, this.args_)
-      .then(port => {
-        return port.whenReady();
-      })
-      .then(() => {
-        resetStyles(this.iframe_, ['height']);
-
-        this.animate_(() => {
-          setImportantStyles(this.iframe_, {
-            'transform': 'translateY(100%)',
-            'opactiy': 1,
-            'visibility': 'visible',
-          });
-          return transition(
-            this.iframe_,
-            {
-              'transform': 'translateY(0)',
-              'opacity': 1,
-              'visibility': 'visible',
-            },
-            400,
-            'ease-out'
-          );
-        });
-
-        // Close the Toast after the specified duration.
-        this.doc_.getWin().setTimeout(() => {
-          this.close();
-        }, (toastDurationSeconds + 1) * 1000);
+  handleLinkRequest_(response) {
+    if (response.getSubscriberOrMember()) {
+      this.deps_.callbacks().triggerLoginRequest({
+        linkRequested: !!response.getLinkRequested(),
       });
+    }
   }
 
   /**
-   * @param {function():!Promise} callback
-   * @return {!Promise}
-   * @private
+   * @param {SkuSelectedResponse} response
    */
-  animate_(callback) {
-    const wait = this.animating_ || Promise.resolve();
-    return (this.animating_ = wait
-      .then(
-        () => {
-          return callback();
-        },
-        () => {
-          // Ignore errors to make sure animations don't get stuck.
-        }
-      )
-      .then(() => {
-        this.animating_ = null;
-      }));
+  startPayFlow_(response) {
+    const sku = response.getSku();
+    const isOneTime = response.getOneTime();
+    if (sku) {
+      const /** @type {../api/subscriptions.SubscriptionRequest} */ contributionRequest = {
+          'skuId': sku,
+        };
+      if (isOneTime) {
+        contributionRequest['oneTime'] = isOneTime;
+      }
+      new PayStartFlow(
+        this.deps_,
+        contributionRequest,
+        ProductType.UI_CONTRIBUTION
+      ).start();
+    }
   }
 
   /**
-   * Closes the toast.
+   * Starts the contributions flow or alreadyMember flow.
    * @return {!Promise}
    */
-  close() {
-    return this.animate_(() => {
-      // Remove the toast from the DOM after animation is complete.
-      this.doc_.getWin().setTimeout(() => {
-        this.doc_.getBody().removeChild(this.iframe_);
-        return Promise.resolve();
-      }, 500);
-
-      return transition(
-        this.iframe_,
-        {
-          'transform': 'translateY(100%)',
-          'opacity': 1,
-          'visibility': 'visible',
-        },
-        400,
-        'ease-out'
-      );
+  start() {
+    // Start/cancel events.
+    this.deps_
+      .callbacks()
+      .triggerFlowStarted(SubscriptionFlows.SHOW_CONTRIBUTION_OPTIONS);
+    this.activityIframeView_.onCancel(() => {
+      this.deps_
+        .callbacks()
+        .triggerFlowCanceled(SubscriptionFlows.SHOW_CONTRIBUTION_OPTIONS);
     });
+    this.activityIframeView_.on(
+      AlreadySubscribedResponse,
+      this.handleLinkRequest_.bind(this)
+    );
+    this.activityIframeView_.on(
+      SkuSelectedResponse,
+      this.startPayFlow_.bind(this)
+    );
+
+    return this.dialogManager_.openView(this.activityIframeView_);
   }
 }
 
@@ -8406,423 +8465,419 @@ class Toast {
  * limitations under the License.
  */
 
-const SERVICE_ID = 'subscribe.google.com';
-const TOAST_STORAGE_KEY = 'toast';
-const ENTS_STORAGE_KEY = 'ents';
-const IS_READY_TO_PAY_STORAGE_KEY = 'isreadytopay';
-
 /**
+ * The flow to initiate deferred account process.
+ * See `Subscriptions.completeDeferredAccountCreation` API.
  */
-class EntitlementsManager {
+class DeferredAccountFlow {
   /**
-   * @param {!Window} win
-   * @param {!../model/page-config.PageConfig} pageConfig
-   * @param {!./fetcher.Fetcher} fetcher
    * @param {!./deps.DepsDef} deps
+   * @param {?../api/deferred-account-creation.DeferredAccountCreationRequest} options
    */
-  constructor(win, pageConfig, fetcher, deps) {
+  constructor(deps, options) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
     /** @private @const {!Window} */
-    this.win_ = win;
+    this.win_ = deps.win();
 
-    /** @private @const {!../model/page-config.PageConfig} */
-    this.pageConfig_ = pageConfig;
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
 
-    /** @private @const {string} */
-    this.publicationId_ = this.pageConfig_.getPublicationId();
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
 
-    /** @private @const {!./fetcher.Fetcher} */
-    this.fetcher_ = fetcher;
+    /** @private {?ActivityIframeView} */
+    this.activityIframeView_ = null;
 
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
+    /** @private {?Promise} */
+    this.openPromise_ = null;
 
-    /** @private @const {!JwtHelper} */
-    this.jwtHelper_ = new JwtHelper();
+    /** @type {!../api/deferred-account-creation.DeferredAccountCreationRequest} */
+    const defaultOptions = {
+      entitlements: null,
+      consent: true,
+    };
+    /** @private @const {!../api/deferred-account-creation.DeferredAccountCreationRequest} */
+    this.options_ = Object.assign(defaultOptions, options || {});
+  }
 
-    /** @private {?Promise<!Entitlements>} */
-    this.responsePromise_ = null;
+  /**
+   * Starts the deferred account flow.
+   * @return {!Promise<!DeferredAccountCreationResponse>}
+   */
+  start() {
+    const entitlements = this.options_.entitlements;
 
-    /** @private {number} */
-    this.positiveRetries_ = 0;
+    // For now, entitlements are required to be present and have the Google
+    // token. This is strictly not required for the implementation. But it's
+    // preferrable API-wise at this time.
+    if (!entitlements || !entitlements.getEntitlementForSource('google')) {
+      throw new Error('No entitlements with "google" source');
+    }
 
-    /** @private {boolean} */
-    this.blockNextNotification_ = false;
+    // Start/cancel events.
+    this.deps_
+      .callbacks()
+      .triggerFlowStarted(SubscriptionFlows.COMPLETE_DEFERRED_ACCOUNT_CREATION);
 
-    /** @private @const {!./storage.Storage} */
-    this.storage_ = deps.storage();
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/recoveriframe'),
+      feArgs({
+        'publicationId': this.deps_.pageConfig().getPublicationId(),
+        'productId': this.deps_.pageConfig().getProductId(),
+        'entitlements': (entitlements && entitlements.raw) || null,
+        'consent': this.options_.consent,
+      }),
+      /* shouldFadeBody */ true
+    );
 
-    /** @private @const {!../runtime/analytics-service.AnalyticsService} */
-    this.analyticsService_ = deps.analytics();
+    this.openPromise_ = this.dialogManager_.openView(this.activityIframeView_);
+    return this.activityIframeView_.acceptResult().then(
+      result => {
+        // The consent part is complete.
+        return this.handleConsentResponse_(
+          /** @type {!Object} */ (result.data)
+        );
+      },
+      reason => {
+        if (isCancelError(reason)) {
+          this.deps_
+            .callbacks()
+            .triggerFlowCanceled(
+              SubscriptionFlows.COMPLETE_DEFERRED_ACCOUNT_CREATION
+            );
+        } else {
+          this.dialogManager_.completeView(this.activityIframeView_);
+        }
+        throw reason;
+      }
+    );
+  }
 
-    /** @private @const {!../api/subscriptions.Config} */
-    this.config_ = deps.config();
+  /**
+   * @param {!Object} data
+   * @return {!DeferredAccountCreationResponse}
+   * @private
+   */
+  handleConsentResponse_(data) {
+    this.deps_.entitlementsManager().blockNextNotification();
+
+    // Parse the response.
+    const entitlementsJwt = data['entitlements'];
+    const idToken = data['idToken'];
+    const productType = data['productType'];
+    const entitlements = this.deps_
+      .entitlementsManager()
+      .parseEntitlements({'signedEntitlements': entitlementsJwt});
+    const userData = new UserData(
+      idToken,
+      /** @type {!Object} */ (new JwtHelper().decode(idToken))
+    );
+    const purchaseDataList = data['purchaseDataList']
+      ? data['purchaseDataList'].map(
+          pd => new PurchaseData(pd['data'], pd['signature'])
+        )
+      : [
+          // TODO(dvoytenko): cleanup/deprecate.
+          new PurchaseData(
+            data['purchaseData']['data'],
+            data['purchaseData']['signature']
+          ),
+        ];
+
+    // For now, we'll use the `PayCompleteFlow` as a "creating account" flow.
+    // But this can be eventually implemented by the same iframe.
+    const creatingFlow = new PayCompleteFlow(this.deps_);
+    const completeHandler = creatingFlow.complete.bind(creatingFlow);
+
+    const response = new DeferredAccountCreationResponse(
+      entitlements,
+      userData,
+      purchaseDataList,
+      completeHandler
+    );
+
+    this.deps_
+      .eventManager()
+      .logSwgEvent(AnalyticsEvent.ACTION_NEW_DEFERRED_ACCOUNT, true);
+
+    // Start the "sync" flow.
+    creatingFlow.start(
+      new SubscribeResponse$1(
+        '', // raw field doesn't matter in this case
+        purchaseDataList[0],
+        userData,
+        entitlements,
+        productType,
+        () => Promise.resolve() // completeHandler doesn't matter in this case
+      )
+    );
+    return response;
   }
+}
+
+const CSS = "body{padding:0;margin:0}swg-container,swg-loading,swg-loading-animate,swg-loading-image{display:block}swg-loading-container{width:100%!important;display:-ms-flexbox!important;display:flex!important;-ms-flex-align:center!important;align-items:center!important;-ms-flex-pack:center!important;justify-content:center!important;min-height:148px!important;height:100%!important;bottom:0!important;margin-top:5px!important;z-index:2147483647!important}@media (min-height:630px), (min-width:630px){swg-loading-container{width:560px!important;margin-left:35px!important;border-top-left-radius:8px!important;border-top-right-radius:8px!important;background-color:#fff!important;box-shadow:0 1px 1px rgba(60,64,67,.3),0 1px 4px 1px rgba(60,64,67,.15)!important}}swg-loading{z-index:2147483647!important;width:36px;height:36px;overflow:hidden;animation:mspin-rotate 1568.63ms linear infinite}swg-loading-animate{animation:mspin-revrot 5332ms steps(4) infinite}swg-loading-image{background-image:url(https://news.google.com/swg/js/v1/loader.svg);background-size:100%;width:11664px;height:36px;animation:swg-loading-film 5332ms steps(324) infinite}@keyframes swg-loading-film{0%{transform:translateX(0)}to{transform:translateX(-11664px)}}@keyframes mspin-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes mspin-revrot{0%{transform:rotate(0deg)}to{transform:rotate(-1turn)}}\n/*# sourceURL=/./src/ui/ui.css*/";
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/** @const {!Object<string|number>} */
+const friendlyIframeAttributes = {
+  'frameborder': 0,
+  'scrolling': 'no',
+  'src': 'about:blank',
+};
 
+/**
+ * The class for building friendly iframe.
+ */
+class FriendlyIframe {
   /**
-   * @param {boolean=} expectPositive
+   * @param {!Document} doc
+   * @param {!Object<string, string|number>=} attrs
    */
-  reset(expectPositive) {
-    this.responsePromise_ = null;
-    this.positiveRetries_ = Math.max(
-      this.positiveRetries_,
-      expectPositive ? 3 : 0
-    );
-    if (expectPositive) {
-      this.storage_.remove(ENTS_STORAGE_KEY);
-      this.storage_.remove(IS_READY_TO_PAY_STORAGE_KEY);
-    }
-  }
+  constructor(doc, attrs = {}) {
+    const mergedAttrs = Object.assign({}, friendlyIframeAttributes, attrs);
 
-  /**
-   * Clears all of the entitlements state and cache.
-   */
-  clear() {
-    this.responsePromise_ = null;
-    this.positiveRetries_ = 0;
-    this.unblockNextNotification();
-    this.storage_.remove(ENTS_STORAGE_KEY);
-    this.storage_.remove(TOAST_STORAGE_KEY);
-    this.storage_.remove(IS_READY_TO_PAY_STORAGE_KEY);
-  }
+    /** @private @const {!HTMLIFrameElement} */
+    this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
+      doc,
+      'iframe',
+      mergedAttrs
+    ));
 
-  /**
-   * @return {string}
-   * @private
-   */
-  getQueryString_() {
-    return this.win_.location.search;
-  }
+    // Ensure that the new iframe does not inherit any CSS styles.
+    resetAllStyles(this.iframe_);
 
-  /**
-   * @param {?string=} encryptedDocumentKey
-   * @return {!Promise<!Entitlements>}
-   */
-  getEntitlements(encryptedDocumentKey) {
-    if (!this.responsePromise_) {
-      this.responsePromise_ = this.getEntitlementsFlow_(encryptedDocumentKey);
-    }
-    return this.responsePromise_.then(response => {
-      if (response.isReadyToPay != null) {
-        this.analyticsService_.setReadyToPay(response.isReadyToPay);
-      }
-      return response;
+    /** @private @const {!Promise} */
+    this.ready_ = new Promise(resolve => {
+      this.iframe_.onload = resolve;
     });
   }
 
   /**
-   * @param {string} raw
-   * @param {boolean=} isReadyToPay
-   * @return {boolean}
+   * When promise is resolved.
+   * @return {!Promise}
    */
-  pushNextEntitlements(raw, isReadyToPay) {
-    const entitlements = this.getValidJwtEntitlements_(
-      raw,
-      /* requireNonExpired */ true,
-      isReadyToPay
-    );
-    if (entitlements && entitlements.enablesThis()) {
-      this.storage_.set(ENTS_STORAGE_KEY, raw);
-      return true;
-    }
-    return false;
+  whenReady() {
+    return this.ready_;
   }
 
   /**
-   * @param {?string=} encryptedDocumentKey
-   * @return {!Promise<!Entitlements>}
-   * @private
+   * Gets the iframe element.
+   * @return {!HTMLIFrameElement}
    */
-  getEntitlementsFlow_(encryptedDocumentKey) {
-    return this.fetchEntitlementsWithCaching_(encryptedDocumentKey).then(
-      entitlements => {
-        this.onEntitlementsFetched_(entitlements);
-        return entitlements;
-      }
-    );
+  getElement() {
+    return this.iframe_;
   }
 
   /**
-   * @param {?string=} encryptedDocumentKey
-   * @return {!Promise<!Entitlements>}
-   * @private
+   * Gets the document object of the iframe element.
+   * @return {!Document}
    */
-  fetchEntitlementsWithCaching_(encryptedDocumentKey) {
-    return Promise.all([
-      this.storage_.get(ENTS_STORAGE_KEY),
-      this.storage_.get(IS_READY_TO_PAY_STORAGE_KEY),
-    ]).then(cachedValues => {
-      const raw = cachedValues[0];
-      const irtp = cachedValues[1];
-      // Try cache first.
-      if (raw && !encryptedDocumentKey) {
-        const cached = this.getValidJwtEntitlements_(
-          raw,
-          /* requireNonExpired */ true,
-          irtpStringToBoolean(irtp)
-        );
-        if (cached && cached.enablesThis()) {
-          // Already have a positive response.
-          this.positiveRetries_ = 0;
-          return cached;
-        }
-      }
-      // If cache didn't match, perform fetch.
-      return this.fetchEntitlements_(encryptedDocumentKey).then(ents => {
-        // If entitlements match the product, store them in cache.
-        if (ents && ents.enablesThis() && ents.raw) {
-          this.storage_.set(ENTS_STORAGE_KEY, ents.raw);
-        }
-        return ents;
-      });
-    });
-  }
+  getDocument() {
+    const doc =
+      this.getElement().contentDocument ||
+      (this.getElement().contentWindow &&
+        this.getElement().contentWindow.document);
 
-  /**
-   * @param {?string=} encryptedDocumentKey
-   * @return {!Promise<!Entitlements>}
-   * @private
-   */
-  fetchEntitlements_(encryptedDocumentKey) {
-    // TODO(dvoytenko): Replace retries with consistent fetch.
-    let positiveRetries = this.positiveRetries_;
-    this.positiveRetries_ = 0;
-    const attempt = () => {
-      positiveRetries--;
-      return this.fetch_(encryptedDocumentKey).then(entitlements => {
-        if (entitlements.enablesThis() || positiveRetries <= 0) {
-          return entitlements;
-        }
-        return new Promise(resolve => {
-          this.win_.setTimeout(() => {
-            resolve(attempt());
-          }, 550);
-        });
-      });
-    };
-    return attempt();
+    if (!doc) {
+      throw new Error('not loaded');
+    }
+    return doc;
   }
 
   /**
-   * @param {boolean} value
+   * Gets the body of the iframe.
+   * @return {!Element}
    */
-  setToastShown(value) {
-    this.storage_.set(TOAST_STORAGE_KEY, value ? '1' : '0');
+  getBody() {
+    return /** @type {!Element} */ (this.getDocument().body);
   }
 
   /**
+   * Whether the iframe is connected.
+   * @return {boolean}
    */
-  blockNextNotification() {
-    this.blockNextNotification_ = true;
+  isConnected() {
+    return isConnected(this.getElement());
   }
+}
 
-  /**
-   */
-  unblockNextNotification() {
-    this.blockNextNotification_ = false;
-  }
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-  /**
-   * The JSON must either contain a "signedEntitlements" with JWT, or
-   * "entitlements" field with plain JSON object.
-   * @param {!Object} json
-   * @return {!Entitlements}
-   */
-  parseEntitlements(json) {
-    const isReadyToPay = json['isReadyToPay'];
-    if (isReadyToPay == null) {
-      this.storage_.remove(IS_READY_TO_PAY_STORAGE_KEY);
-    } else {
-      this.storage_.set(IS_READY_TO_PAY_STORAGE_KEY, String(isReadyToPay));
-    }
-    const signedData = json['signedEntitlements'];
-    if (signedData) {
-      const entitlements = this.getValidJwtEntitlements_(
-        signedData,
-        /* requireNonExpired */ false,
-        isReadyToPay
+/**
+ * Returns a promise which is resolved after the given duration of animation
+ * @param {!Element} el - Element to be observed.
+ * @param {!Object<string, string|number>} props - properties to be animated.
+ * @param {number} durationMillis - duration of animation.
+ * @param {string} curve - transition function for the animation.
+ * @return {!Promise} Promise which resolves once the animation is done playing.
+ */
+function transition(el, props, durationMillis, curve) {
+  const win = el.ownerDocument.defaultView;
+  const previousTransitionValue = el.style.transition || '';
+  return new Promise(resolve => {
+    win.setTimeout(() => {
+      win.setTimeout(resolve, durationMillis);
+      const tr = `${durationMillis}ms ${curve}`;
+      setImportantStyles(
+        el,
+        Object.assign(
+          {
+            'transition': `transform ${tr}, opacity ${tr}`,
+          },
+          props
+        )
       );
-      if (entitlements) {
-        return entitlements;
-      }
-    } else {
-      const plainEntitlements = json['entitlements'];
-      if (plainEntitlements) {
-        return this.createEntitlements_('', plainEntitlements, isReadyToPay);
-      }
-    }
-    // Empty response.
-    return this.createEntitlements_('', [], isReadyToPay);
-  }
+    });
+  }).then(() => {
+    setImportantStyles(el, {
+      'transition': previousTransitionValue,
+    });
+  });
+}
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
+class Graypane {
   /**
-   * @param {string} raw
-   * @param {boolean} requireNonExpired
-   * @param {boolean=} isReadyToPay
-   * @param {?string=} decryptedDocumentKey
-   * @return {?Entitlements}
-   * @private
+   * @param {!../model/doc.Doc} doc
+   * @param {number} zIndex
    */
-  getValidJwtEntitlements_(
-    raw,
-    requireNonExpired,
-    isReadyToPay,
-    decryptedDocumentKey
-  ) {
-    try {
-      const jwt = this.jwtHelper_.decode(raw);
-      if (requireNonExpired) {
-        const now = Date.now();
-        const exp = jwt['exp'];
-        if (parseFloat(exp) * 1000 < now) {
-          return null;
-        }
-      }
-      const entitlementsClaim = jwt['entitlements'];
-      return (
-        (entitlementsClaim &&
-          this.createEntitlements_(
-            raw,
-            entitlementsClaim,
-            isReadyToPay,
-            decryptedDocumentKey
-          )) ||
-        null
-      );
-    } catch (e) {
-      // Ignore the error.
-      this.win_.setTimeout(() => {
-        throw e;
-      });
-    }
-    return null;
+  constructor(doc, zIndex) {
+    /** @private @const {!../model/doc.Doc} */
+    this.doc_ = doc;
+
+    /** @private @const {!Element} */
+    this.fadeBackground_ = this.doc_
+      .getWin()
+      .document.createElement('swg-popup-background');
+    setImportantStyles(this.fadeBackground_, {
+      'z-index': zIndex,
+      'display': 'none',
+      'position': 'fixed',
+      'top': 0,
+      'right': 0,
+      'bottom': 0,
+      'left': 0,
+      'background-color': 'rgba(32, 33, 36, .6)',
+    });
   }
 
   /**
-   * @param {string} raw
-   * @param {!Object|!Array<!Object>} json
-   * @param {boolean=} isReadyToPay
-   * @param {?string=} decryptedDocumentKey
-   * @return {!Entitlements}
-   * @private
+   * @return {!Element}
    */
-  createEntitlements_(raw, json, isReadyToPay, decryptedDocumentKey) {
-    return new Entitlements(
-      SERVICE_ID,
-      raw,
-      Entitlement.parseListFromJson(json),
-      this.pageConfig_.getProductId(),
-      this.ack_.bind(this),
-      isReadyToPay,
-      decryptedDocumentKey
-    );
+  getElement() {
+    return this.fadeBackground_;
   }
 
   /**
-   * @param {!Entitlements} entitlements
-   * @private
+   * @return {boolean}
    */
-  onEntitlementsFetched_(entitlements) {
-    // Skip any notifications and toast if other flows are ongoing.
-    // TODO(dvoytenko): what's the right action when pay flow was canceled?
-    const blockNotification = this.blockNextNotification_;
-    this.blockNextNotification_ = false;
-    if (blockNotification) {
-      return;
-    }
-
-    // Notify on the received entitlements.
-    this.deps_
-      .callbacks()
-      .triggerEntitlementsResponse(Promise.resolve(entitlements));
-
-    // Show a toast if needed.
-    this.maybeShowToast_(entitlements);
+  isAttached() {
+    return !!this.fadeBackground_.parentNode;
   }
 
   /**
-   * @param {!Entitlements} entitlements
-   * @return {!Promise}
-   * @private
+   * Attaches the graypane to the document.
    */
-  maybeShowToast_(entitlements) {
-    const entitlement = entitlements.getEntitlementForThis();
-    if (!entitlement) {
-      return Promise.resolve();
-    }
-    // Check if storage bit is set. It's only set by the `Entitlements.ack`
-    // method.
-    return this.storage_.get(TOAST_STORAGE_KEY).then(value => {
-      if (value == '1') {
-        // Already shown;
-        return;
-      }
-      if (entitlement) {
-        this.showToast_(entitlement);
-      }
-    });
+  attach() {
+    this.doc_.getBody().appendChild(this.fadeBackground_);
   }
 
   /**
-   * @param {!Entitlement} entitlement
-   * @private
+   * Detaches the graypane to the document.
    */
-  showToast_(entitlement) {
-    const source = entitlement.source || 'google';
-    return new Toast(
-      this.deps_,
-      feUrl('/toastiframe'),
-      feArgs({
-        'publicationId': this.publicationId_,
-        'source': source,
-      })
-    ).open();
+  destroy() {
+    this.doc_.getBody().removeChild(this.fadeBackground_);
   }
 
   /**
-   * @param {!Entitlements} entitlements
-   * @private
+   * Shows the graypane.
+   * @param {boolean=} animated
+   * @return {!Promise|undefined}
    */
-  ack_(entitlements) {
-    if (entitlements.getEntitlementForThis()) {
-      this.setToastShown(true);
+  show(animated = true) {
+    setImportantStyles(this.fadeBackground_, {
+      'display': 'block',
+      'opacity': animated ? 0 : 1,
+    });
+    if (animated) {
+      return transition(
+        this.fadeBackground_,
+        {
+          'opacity': 1,
+        },
+        300,
+        'ease-out'
+      );
     }
   }
 
   /**
-   * @param {?string=} encryptedDocumentKey
-   * @return {!Promise<!Entitlements>}
-   * @private
+   * Hides the graypane.
+   * @param {boolean=} animated
+   * @return {!Promise|undefined}
    */
-  fetch_(encryptedDocumentKey) {
-    let url =
-      '/publication/' +
-      encodeURIComponent(this.publicationId_) +
-      '/entitlements';
-    if (encryptedDocumentKey) {
-      //TODO(chenshay): Make this a 'Post'.
-      url += '?crypt=' + encodeURIComponent(encryptedDocumentKey);
+  hide(animated = true) {
+    if (animated) {
+      return transition(
+        this.fadeBackground_,
+        {
+          'opacity': 0,
+        },
+        300,
+        'ease-out'
+      ).then(() => {
+        setImportantStyles(this.fadeBackground_, {'display': 'none'});
+      });
     }
-    return this.fetcher_
-      .fetchCredentialedJson(serviceUrl(url))
-      .then(json => this.parseEntitlements(json));
-  }
-}
-
-/**
- * Convert String value of isReadyToPay
- * (from JSON or Cache) to a boolean value.
- * @param {string} value
- * @return {boolean|undefined}
- * @private
- */
-function irtpStringToBoolean(value) {
-  switch (value) {
-    case 'true':
-      return true;
-    case 'false':
-      return false;
-    default:
-      return undefined;
+    setImportantStyles(this.fadeBackground_, {'display': 'none'});
   }
 }
 
@@ -8843,47 +8898,80 @@ function irtpStringToBoolean(value) {
  */
 
 /**
- * @enum {string}
+ * Loading indicator class. Builds the loading indicator view to be injected in
+ * parent element <iframe class="swg-dialog"> element. Provides methods to
+ * show/hide loading indicator.
  */
-const ExperimentFlags = {
+class LoadingView {
   /**
-   * Enables GPay API in SwG.
-   * Cleanup issue: #406.
+   * @param {!Document} doc
    */
-  GPAY_API: 'gpay-api',
+  constructor(doc) {
+    /** @private @const {!Document} */
+    this.doc_ = doc;
 
-  /**
-   * Enables GPay native support.
-   * Cleanup issue: #441.
-   */
-  GPAY_NATIVE: 'gpay-native',
+    /** @private @const {!Element} */
+    this.loadingContainer_ = createElement(
+      this.doc_,
+      'swg-loading-container',
+      {}
+    );
 
-  /**
-   * Enables the feature that allows you to replace one subscription
-   * for another in the subscribe() API.
-   */
-  REPLACE_SUBSCRIPTION: 'replace-subscription',
+    /** @private @const {!Element} */
+    this.loading_ = createElement(this.doc_, 'swg-loading', {});
+    this.loadingContainer_.appendChild(this.loading_);
+
+    this.loadingContainer_.style.setProperty('display', 'none', 'important');
+
+    // Build the animated loading indicator.
+    this.buildLoadingIndicator_();
+  }
 
   /**
-   * Enables the contributions feature.
+   * Gets the populated loading container.
+   * @return {!Element}
    */
-  CONTRIBUTIONS: 'contributions',
+  getElement() {
+    return this.loadingContainer_;
+  }
 
   /**
-   * Enables the Propensity feature
+   * Shows the loading indicator within the container element.
    */
-  PROPENSITY: 'propensity',
+  show() {
+    this.loadingContainer_.style.removeProperty('display');
+  }
 
   /**
-   * Enables the Smartbox feature.
+   * Hides the loading indicator within the container element.
    */
-  SMARTBOX: 'smartbox',
+  hide() {
+    this.loadingContainer_.style.setProperty('display', 'none', 'important');
+  }
 
   /**
-   * Enables using new Activities APIs
+   * Populates the loading indivicator. The populated element
+   * can be added in any view, when required.
+   * @private
    */
-  HEJIRA: 'hejira',
-};
+  buildLoadingIndicator_() {
+    const loadingContainer = this.loading_;
+
+    const loadingIndicatorTopContainer = createElement(
+      this.doc_,
+      'swg-loading-animate',
+      {}
+    );
+    loadingContainer.appendChild(loadingIndicatorTopContainer);
+
+    const loadingIndicatorChildContainer = createElement(
+      this.doc_,
+      'swg-loading-image',
+      {}
+    );
+    loadingIndicatorTopContainer.appendChild(loadingIndicatorChildContainer);
+  }
+}
 
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
@@ -8901,911 +8989,801 @@ const ExperimentFlags = {
  * limitations under the License.
  */
 
-/** @private @const {!Array<string>} */
-const allowedMethods_ = ['GET', 'POST'];
-
-/** @private @enum {number} Allowed fetch responses. */
-const allowedFetchTypes_ = {
-  document: 1,
-  text: 2,
-};
-
 /**
- * A class that polyfills Fetch API.
+ * @param {!Document} doc
+ * @return {string}
  */
-class Xhr {
-  /**
-   * @param {!Window} win
-   */
-  constructor(win) {
-    /** @const {!Window} */
-    this.win = win;
-  }
+function getReadyState(doc) {
+  return /** @type {string} */ (doc['readyState']);
+}
 
-  /**
-   * We want to call `fetch_` unbound from any context since it could
-   * be either the native fetch or our polyfill.
-   *
-   * @param {string} input
-   * @param {!FetchInitDef} init
-   * @return {!Promise<!FetchResponse>|!Promise<!Response>}
-   * @private
-   */
-  fetch_(input, init) {
-    // TODO(avimehta): Should the requests go through when page is not visible?
-    log_2(typeof input == 'string', 'Only URL supported: %s', input);
-    // In particular, Firefox does not tolerate `null` values for
-    // `credentials`.
-    const creds = init.credentials;
-    log_2(
-      creds === undefined || creds == 'include' || creds == 'omit',
-      'Only credentials=include|omit support: %s',
-      creds
-    );
-    // Fallback to xhr polyfill since `fetch` api does not support
-    // responseType = 'document'. We do this so we don't have to do any parsing
-    // and document construction on the UI thread which would be expensive.
-    if (init.responseType == 'document') {
-      return fetchPolyfill(input, init);
-    }
-    return (this.win.fetch || fetchPolyfill).apply(null, arguments);
-  }
+/**
+ * Whether the document is ready.
+ * @param {!Document} doc
+ * @return {boolean}
+ */
+function isDocumentReady(doc) {
+  const readyState = getReadyState(doc);
+  return readyState != 'loading' && readyState != 'uninitialized';
+}
 
-  /**
-   * @param {string} input URL
-   * @param {?FetchInitDef} init Fetch options object.
-   * @return {!Promise<!FetchResponse>}
-   */
-  fetch(input, init) {
-    // TODO (avimehta): Figure out if CORS needs be handled the way AMP does it.
-    init = setupInit(init);
-    return this.fetch_(input, init)
-      .then(
-        response => response,
-        reason => {
-          const targetOrigin = parseUrl$1(input).origin;
-          throw new Error(
-            `XHR Failed fetching (${targetOrigin}/...):`,
-            reason && reason.message
-          );
-        }
-      )
-      .then(response => assertSuccess(response));
-  }
+/**
+ * Calls the callback when document is ready.
+ * @param {!Document} doc
+ * @param {function(!Document)} callback
+ */
+function onDocumentReady(doc, callback) {
+  onDocumentState(doc, isDocumentReady, callback);
 }
 
 /**
- * Normalized method name by uppercasing.
- * @param {string|undefined} method
- * @return {string}
- * @private
+ * Calls the callback once when document's state satisfies the condition.
+ * @param {!Document} doc
+ * @param {function(!Document):boolean} condition
+ * @param {function(!Document)} callback
  */
-function normalizeMethod_(method) {
-  if (method === undefined) {
-    return 'GET';
+function onDocumentState(doc, condition, callback) {
+  if (condition(doc)) {
+    // Execute callback right now.
+    callback(doc);
+    return;
   }
-  method = method.toUpperCase();
-
-  log_2(
-    allowedMethods_.includes(method),
-    'Only one of %s is currently allowed. Got %s',
-    allowedMethods_.join(', '),
-    method
-  );
 
-  return method;
+  // Execute callback (once!) after condition is satisfied.
+  let callbackHasExecuted = false;
+  const readyListener = () => {
+    if (condition(doc) && !callbackHasExecuted) {
+      callback(doc);
+      callbackHasExecuted = true;
+      doc.removeEventListener('readystatechange', readyListener);
+    }
+  };
+  doc.addEventListener('readystatechange', readyListener);
 }
 
 /**
- * Sets up and normalizes the FetchInitDef
- *
- * @param {?FetchInitDef=} init Fetch options object.
- * @param {string=} accept The HTTP Accept header value.
- * @return {!FetchInitDef}
+ * Returns a promise that is resolved when document is ready.
+ * @param {!Document} doc
+ * @return {!Promise<!Document>}
  */
-function setupInit(init, accept) {
-  init = init || /** @type {FetchInitDef} */ ({});
-  init.method = normalizeMethod_(init.method);
-  init.headers = init.headers || {};
-  if (accept) {
-    init.headers['Accept'] = accept;
-  }
-  return init;
+function whenDocumentReady(doc) {
+  return new Promise(resolve => {
+    onDocumentReady(doc, resolve);
+  });
 }
 
 /**
- * A minimal polyfill of Fetch API. It only polyfills what we currently use.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
- * See https://developer.mozilla.org/en-US/docs/Web/API/GlobalFetch/fetch
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
  *
- * Notice that the "fetch" method itself is not exported as that would require
- * us to immediately support a much wide API.
+ *      http://www.apache.org/licenses/LICENSE-2.0
  *
- * @param {string} input
- * @param {!FetchInitDef} init
- * @return {!Promise<!FetchResponse>}
- * @private Visible for testing
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function fetchPolyfill(input, init) {
-  return new Promise(function(resolve, reject) {
-    const xhr = createXhrRequest(init.method || 'GET', input);
 
-    if (init.credentials == 'include') {
-      xhr.withCredentials = true;
-    }
+/** @implements {Doc} */
+class GlobalDoc {
+  /**
+   * @param {!Window|!Document} winOrDoc
+   */
+  constructor(winOrDoc) {
+    const isWin = !!winOrDoc.document;
+    /** @private @const {!Window} */
+    this.win_ = /** @type {!Window} */ (isWin
+      ? /** @type {!Window} */ (winOrDoc)
+      : /** @type {!Document} */ (winOrDoc).defaultView);
+    /** @private @const {!Document} */
+    this.doc_ = isWin
+      ? /** @type {!Window} */ (winOrDoc).document
+      : /** @type {!Document} */ (winOrDoc);
+  }
 
-    if (init.responseType in allowedFetchTypes_) {
-      xhr.responseType = init.responseType;
-    }
+  /** @override */
+  getWin() {
+    return this.win_;
+  }
 
-    if (init.headers) {
-      Object.keys(init.headers).forEach(function(header) {
-        xhr.setRequestHeader(header, init.headers[header]);
-      });
-    }
+  /** @override */
+  getRootNode() {
+    return this.doc_;
+  }
 
-    xhr.onreadystatechange = () => {
-      if (xhr.readyState < /* STATUS_RECEIVED */ 2) {
-        return;
-      }
-      if (xhr.status < 100 || xhr.status > 599) {
-        xhr.onreadystatechange = null;
-        reject(new Error(`Unknown HTTP status ${xhr.status}`));
-        return;
-      }
+  /** @override */
+  getRootElement() {
+    return this.doc_.documentElement;
+  }
 
-      // TODO(dvoytenko): This is currently simplified: we will wait for the
-      // whole document loading to complete. This is fine for the use cases
-      // we have now, but may need to be reimplemented later.
-      if (xhr.readyState == /* COMPLETE */ 4) {
-        resolve(new FetchResponse(xhr));
-      }
-    };
-    xhr.onerror = () => {
-      reject(new Error('Network failure'));
-    };
-    xhr.onabort = () => {
-      reject(new Error('Request aborted'));
-    };
+  /** @override */
+  getHead() {
+    // `document.head` always has a chance to be parsed, at least partially.
+    return /** @type {!Element} */ (this.doc_.head);
+  }
 
-    if (init.method == 'POST') {
-      xhr.send(init.body);
-    } else {
-      xhr.send();
-    }
-  });
+  /** @override */
+  getBody() {
+    return this.doc_.body;
+  }
+
+  /** @override */
+  isReady() {
+    return isDocumentReady(this.doc_);
+  }
+
+  /** @override */
+  whenReady() {
+    return whenDocumentReady(this.doc_);
+  }
+
+  /** @override */
+  addToFixedLayer(unusedElement) {
+    return Promise.resolve();
+  }
 }
 
 /**
- * @param {string} method
- * @param {string} url
- * @return {!XMLHttpRequest}
- * @private
+ * @param {!Document|!Window|!Doc} input
+ * @return {!Doc}
  */
-function createXhrRequest(method, url) {
-  const xhr = new XMLHttpRequest();
-  if ('withCredentials' in xhr) {
-    xhr.open(method, url, true);
-  } else {
-    throw new Error('CORS is not supported');
+function resolveDoc(input) {
+  // Is it a `Document`
+  if (/** @type {!Document} */ (input).nodeType === /* DOCUMENT */ 9) {
+    return new GlobalDoc(/** @type {!Document} */ (input));
   }
-  return xhr;
+  // Is it a `Window`?
+  if (/** @type {!Window} */ (input).document) {
+    return new GlobalDoc(/** @type {!Window} */ (input));
+  }
+  return /** @type {!Doc} */ (input);
 }
 
 /**
- * If 415 or in the 5xx range.
- * @param {number} status
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function isRetriable(status) {
-  return status == 415 || (status >= 500 && status < 600);
-}
+
+const Z_INDEX = 2147483647;
 
 /**
- * Returns the response if successful or otherwise throws an error.
- * @param {!FetchResponse} response
- * @return {!Promise<!FetchResponse>}
- * @private Visible for testing
+ * Default iframe important styles.
+ * Note: The iframe responsiveness media query style is injected in the
+ * publisher's page since style attribute can not include media query.
+ * @const {!Object<string, string|number>}
  */
-function assertSuccess(response) {
-  return new Promise(resolve => {
-    if (response.ok) {
-      return resolve(response);
-    }
+const rootElementImportantStyles = {
+  'min-height': '50px',
+  'border': 'none',
+  'display': 'block',
+  'position': 'fixed',
+  'z-index': Z_INDEX,
+  'box-sizing': 'border-box',
+};
 
-    const {status} = response;
-    const err = new Error(`HTTP error ${status}`);
-    err.retriable = isRetriable(status);
-    // TODO(@jridgewell, #9448): Callers who need the response should
-    // skip processing.
-    err.response = response;
-    throw err;
-  });
-}
+/**
+ * Reset view styles.
+ * @const {!Object<string, string|number>}
+ */
+const resetViewStyles = {
+  'position': 'absolute',
+  'top': '0',
+  'left': '0',
+  'right': '0',
+  'bottom': '0',
+  'opacity': 0,
+  /* These lines are a work around to this issue in iOS:     */
+  /* https://bugs.webkit.org/show_bug.cgi?id=155198          */
+  'height': 0,
+  'max-height': '100%',
+  'max-width': '100%',
+  'min-height': '100%',
+  'min-width': '100%',
+  'width': 0,
+};
 
 /**
- * Response object in the Fetch API.
- *
- * See https://developer.mozilla.org/en-US/docs/Web/API/GlobalFetch/fetch
+ * Position of the dialog.
+ * @const @enum {string}
  */
-class FetchResponse {
+const PositionAt = {
+  BOTTOM: 'BOTTOM',
+  TOP: 'TOP',
+  FLOAT: 'FLOAT',
+  FULL: 'FULL',
+};
+
+/**
+ * The class for the top level dialog.
+ * @final
+ */
+class Dialog {
   /**
-   * @param {!XMLHttpRequest} xhr
+   * Create a dialog for the provided doc.
+   * @param {!../model/doc.Doc} doc
+   * @param {!Object<string, string|number>=} importantStyles
+   * @param {!Object<string, string|number>=} styles
    */
-  constructor(xhr) {
-    /** @private @const {!XMLHttpRequest} */
-    this.xhr_ = xhr;
+  constructor(doc, importantStyles = {}, styles = {}) {
+    /** @private @const {!../model/doc.Doc} */
+    this.doc_ = doc;
 
-    /** @const {number} */
-    this.status = this.xhr_.status;
+    /** @private @const {!FriendlyIframe} */
+    this.iframe_ = new FriendlyIframe(doc.getWin().document, {
+      'class': 'swg-dialog',
+    });
 
-    /** @const {boolean} */
-    this.ok = this.status >= 200 && this.status < 300;
+    /** @private @const {!Graypane} */
+    this.graypane_ = new Graypane(doc, Z_INDEX - 1);
 
-    /** @const {!FetchResponseHeaders} */
-    this.headers = new FetchResponseHeaders(xhr);
+    const modifiedImportantStyles = Object.assign(
+      {},
+      rootElementImportantStyles,
+      importantStyles
+    );
+    setImportantStyles(this.iframe_.getElement(), modifiedImportantStyles);
 
-    /** @type {boolean} */
-    this.bodyUsed = false;
+    setStyles(this.iframe_.getElement(), styles);
 
-    /** @type {?ReadableStream} */
-    this.body = null;
-  }
+    /** @private {LoadingView} */
+    this.loadingView_ = null;
 
-  /**
-   * Create a copy of the response and return it.
-   * @return {!FetchResponse}
-   */
-  clone() {
-    log_2(!this.bodyUsed, 'Body already used');
-    return new FetchResponse(this.xhr_);
-  }
+    /** @private {?Element} */
+    this.container_ = null; // Depends on constructed document inside iframe.
 
-  /**
-   * Drains the response and returns the text.
-   * @return {!Promise<string>}
-   * @private
-   */
-  drainText_() {
-    log_2(!this.bodyUsed, 'Body already used');
-    this.bodyUsed = true;
-    return Promise.resolve(this.xhr_.responseText);
-  }
+    /** @private {?./view.View} */
+    this.view_ = null;
 
-  /**
-   * Drains the response and returns a promise that resolves with the response
-   * text.
-   * @return {!Promise<string>}
-   */
-  text() {
-    return this.drainText_();
+    /** @private {?Promise} */
+    this.animating_ = null;
+
+    /** @private {boolean} */
+    this.hidden_ = false;
+
+    /** @private {?./view.View} */
+    this.previousProgressView_ = null;
+
+    /** @private {boolean} */
+    this.useFixedLayer_ = false;
   }
 
   /**
-   * Drains the response and returns the JSON object.
-   * @return {!Promise<!JsonObject>}
+   * Opens the dialog and builds the iframe container.
+   * @param {boolean=} hidden
+   * @return {!Promise<!Dialog>}
    */
-  json() {
-    return /** @type {!Promise<!JsonObject>} */ (this.drainText_().then(
-      parseJson
-    ));
+  open(hidden = false) {
+    const iframe = this.iframe_;
+    if (iframe.isConnected()) {
+      throw new Error('already opened');
+    }
+
+    // Attach.
+    this.doc_.getBody().appendChild(iframe.getElement()); // Fires onload.
+
+    this.graypane_.attach();
+
+    if (hidden) {
+      setImportantStyles(iframe.getElement(), {
+        'visibility': 'hidden',
+        'opacity': 0,
+      });
+      this.hidden_ = hidden;
+    } else {
+      this.show_();
+    }
+
+    if (this.useFixedLayer_) {
+      return this.doc_
+        .addToFixedLayer(iframe.getElement())
+        .then(() => iframe.whenReady())
+        .then(() => {
+          this.buildIframe_();
+          return this;
+        });
+    } else {
+      return iframe.whenReady().then(() => {
+        this.buildIframe_();
+        return this;
+      });
+    }
   }
 
   /**
-   * Reads the xhr responseXML.
-   * @return {!Promise<!Document>}
+   * Build the iframe with the styling after iframe is loaded.
    * @private
    */
-  document_() {
-    log_2(!this.bodyUsed, 'Body already used');
-    this.bodyUsed = true;
-    log_2(
-      this.xhr_.responseXML,
-      'responseXML should exist. Make sure to return ' +
-        'Content-Type: text/html header.'
-    );
-    return /** @type {!Promise<!Document>} */ (Promise.resolve(
-      log_2(this.xhr_.responseXML)
-    ));
-  }
+  buildIframe_() {
+    const iframe = this.iframe_;
+    const iframeBody = iframe.getBody();
+    const iframeDoc = /** @type {!HTMLDocument} */ (this.iframe_.getDocument());
 
-  /**
-   * Drains the response and returns a promise that resolves with the response
-   * ArrayBuffer.
-   * @return {!Promise<!ArrayBuffer>}
-   */
-  arrayBuffer() {
-    return /** @type {!Promise<!ArrayBuffer>} */ (this.drainText_().then(
-      utf8EncodeSync
-    ));
+    // Inject Google fonts in <HEAD> section of the iframe.
+    injectStyleSheet(resolveDoc(iframeDoc), CSS);
+
+    // Add Loading indicator.
+    this.loadingView_ = new LoadingView(iframeDoc);
+    iframeBody.appendChild(this.loadingView_.getElement());
+
+    // Container for all dynamic content, including 3P iframe.
+    this.container_ = createElement(iframeDoc, 'swg-container', {});
+    iframeBody.appendChild(this.container_);
+    this.setPosition_();
   }
-}
 
-/**
- * Provides access to the response headers as defined in the Fetch API.
- * @private Visible for testing.
- */
-class FetchResponseHeaders {
   /**
-   * @param {!XMLHttpRequest} xhr
+   * Closes the dialog.
+   * @param {boolean=} animated
+   * @return {!Promise}
    */
-  constructor(xhr) {
-    /** @private @const {!XMLHttpRequest} */
-    this.xhr_ = xhr;
+  close(animated = true) {
+    let animating;
+    if (animated) {
+      animating = this.animate_(() => {
+        this.graypane_.hide(/* animate */ true);
+        return transition(
+          this.getElement(),
+          {
+            'transform': 'translateY(100%)',
+          },
+          300,
+          'ease-out'
+        );
+      });
+    } else {
+      animating = Promise.resolve();
+    }
+    return animating.then(() => {
+      const iframeEl = this.iframe_.getElement();
+      iframeEl.parentNode.removeChild(iframeEl);
+
+      this.removePaddingToHtml_();
+      this.graypane_.destroy();
+    });
   }
 
   /**
-   * @param {string} name
-   * @return {string}
+   * Gets the container within the dialog.
+   * @return {!Element}
    */
-  get(name) {
-    return this.xhr_.getResponseHeader(name);
+  getContainer() {
+    if (!this.container_) {
+      throw new Error('not opened yet');
+    }
+    return this.container_;
   }
 
   /**
-   * @param {string} name
-   * @return {boolean}
+   * Gets the attached iframe instance.
+   * @return {!FriendlyIframe}
    */
-  has(name) {
-    return this.xhr_.getResponseHeader(name) != null;
+  getIframe() {
+    return this.iframe_;
   }
-}
 
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/**
- * @interface
- */
-class Fetcher {
   /**
-   * @param {string} unusedUrl
-   * @return {!Promise<!Object>}
+   * Gets the Iframe element.
+   * @return {!HTMLIFrameElement}
    */
-  fetchCredentialedJson(unusedUrl) {}
+  getElement() {
+    return this.iframe_.getElement();
+  }
 
   /**
-   * @param {string} unusedUrl
-   * @param {!../utils/xhr.FetchInitDef} unusedInit
-   * @return {!Promise<!../utils/xhr.FetchResponse>}
+   * Transitions to the next view.
+   * @private
    */
-  fetch(unusedUrl, unusedInit) {}
-}
+  entryTransitionToNextView_() {
+    if (this.view_ && this.view_.hasLoadingIndicator()) {
+      // Temporarily cache the old view.
+      this.previousProgressView_ = this.view_;
+    } else {
+      // Since loading indicator will be shown, remove contents of old view.
+      removeChildren(this.getContainer());
+      // When loading indicator was not displayed in the previous view,
+      // loading indicator must be displayed while transitioning to new view.
+      this.loadingView_.show();
+    }
+  }
 
-/**
- * @implements {Fetcher}
- */
-class XhrFetcher {
   /**
-   * @param {!Window} win
+   * Transition out of an old view.
+   * @private
    */
-  constructor(win) {
-    /** @const {!Xhr} */
-    this.xhr_ = new Xhr(win);
-  }
-
-  /** @override */
-  fetchCredentialedJson(url) {
-    const init = /** @type {!../utils/xhr.FetchInitDef} */ ({
-      method: 'GET',
-      headers: {'Accept': 'text/plain, application/json'},
-      credentials: 'include',
-    });
-    return this.xhr_.fetch(url, init).then(response => response.json());
+  exitTransitionFromOldView_() {
+    // If previous view is still around, remove it.
+    if (this.previousProgressView_) {
+      removeElement(this.previousProgressView_.getElement());
+      this.previousProgressView_ = null;
+    } else {
+      this.loadingView_.hide();
+    }
   }
 
-  /** @override */
-  fetch(url, init) {
-    return this.xhr_.fetch(url, init);
+  /** @return {?./view.View} */
+  getCurrentView() {
+    return this.view_;
   }
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
 
-/**
- */
-class JsError {
   /**
-   * @param {!../model/doc.Doc} doc
+   * Opens the given view and removes existing view from the DOM if any.
+   * @param {!./view.View} view
+   * @return {!Promise}
    */
-  constructor(doc) {
-    /** @private @const {!../model/doc.Doc} */
-    this.doc_ = doc;
+  openView(view) {
+    setImportantStyles(view.getElement(), resetViewStyles);
+    this.entryTransitionToNextView_();
 
-    /** @private @const {!Promise} */
-    this.microTask_ = Promise.resolve();
+    this.view_ = view;
+    this.getContainer().appendChild(view.getElement());
+
+    // If the current view should fade the parent document.
+    if (view.shouldFadeBody() && !this.hidden_) {
+      this.graypane_.show(/* animate */ true);
+    }
+
+    return view.init(this).then(() => {
+      setImportantStyles(view.getElement(), {
+        'opacity': 1,
+      });
+      if (this.hidden_) {
+        if (view.shouldFadeBody()) {
+          this.graypane_.show(/* animated */ true);
+        }
+        this.show_();
+      }
+      this.exitTransitionFromOldView_();
+    });
   }
 
   /**
-   * @param {...*} var_args
-   * @return {!Promise}
+   * Show the iframe.
+   * @private
    */
-  error(var_args) {
-    const args = Array.prototype.slice.call(arguments, 0);
-    return this.microTask_.then(() => {
-      const error = createErrorVargs.apply(null, args);
-      if (error.reported) {
-        return;
-      }
-      const img = this.doc_.getWin().document.createElement('img');
-      img.src =
-        'https://news.google.com/_/SubscribewithgoogleClientUi/jserror' +
-        '?error=' +
-        encodeURIComponent(String(error)) +
-        '&script=' +
-        encodeURIComponent('https://news.google.com/swg/js/v1/swg.js') +
-        '&line=' +
-        (error.lineNumber || 1) +
-        '&trace=' +
-        encodeURIComponent(error.stack);
-      // Appending this image to DOM is not necessary.
-      error.reported = true;
+  show_() {
+    this.animate_(() => {
+      setImportantStyles(this.getElement(), {
+        'transform': 'translateY(100%)',
+        'opactiy': 1,
+        'visibility': 'visible',
+      });
+      return transition(
+        this.getElement(),
+        {
+          'transform': 'translateY(0)',
+          'opacity': 1,
+          'visibility': 'visible',
+        },
+        300,
+        'ease-out'
+      );
     });
+    this.hidden_ = false;
   }
-}
 
-/**
- * @param {...*} var_args
- * @return {!Error}
- */
-function createErrorVargs(var_args) {
-  let error = null;
-  let message = '';
-  for (let i = 0; i < arguments.length; i++) {
-    const arg = arguments[i];
-    if (arg instanceof Error && !error) {
-      error = duplicateErrorIfNecessary(arg);
-    } else {
-      if (message) {
-        message += ' ';
-      }
-      message += arg;
+  /**
+   * Resizes the dialog container.
+   * @param {!./view.View} view
+   * @param {number} height
+   * @param {boolean=} animated
+   * @return {?Promise}
+   */
+  resizeView(view, height, animated = true) {
+    if (this.view_ != view) {
+      return null;
     }
-  }
+    const newHeight = this.getMaxAllowedHeight_(height);
 
-  if (!error) {
-    error = new Error(message);
-  } else if (message) {
-    error.message = message + ': ' + error.message;
+    let animating;
+    if (animated) {
+      const oldHeight = this.getElement().offsetHeight;
+      if (newHeight >= oldHeight) {
+        // Expand.
+        animating = this.animate_(() => {
+          setImportantStyles(this.getElement(), {
+            'height': `${newHeight}px`,
+            'transform': `translateY(${newHeight - oldHeight}px)`,
+          });
+          return transition(
+            this.getElement(),
+            {
+              'transform': 'translateY(0)',
+            },
+            300,
+            'ease-out'
+          );
+        });
+      } else {
+        // Collapse.
+        animating = this.animate_(() => {
+          return transition(
+            this.getElement(),
+            {
+              'transform': `translateY(${oldHeight - newHeight}px)`,
+            },
+            300,
+            'ease-out'
+          ).then(() => {
+            setImportantStyles(this.getElement(), {
+              'height': `${newHeight}px`,
+              'transform': 'translateY(0)',
+            });
+          });
+        });
+      }
+    } else {
+      setImportantStyles(this.getElement(), {
+        'height': `${newHeight}px`,
+      });
+      animating = Promise.resolve();
+    }
+    return animating.then(() => {
+      this.updatePaddingToHtml_(height);
+      view.resized();
+    });
   }
-  return error;
-}
 
-/**
- * Some exceptions (DOMException, namely) have read-only message.
- * @param {!Error} error
- * @return {!Error}
- */
-function duplicateErrorIfNecessary(error) {
-  const messageProperty = Object.getOwnPropertyDescriptor(error, 'message');
-  if (messageProperty && messageProperty.writable) {
-    return error;
+  /**
+   * @param {function():!Promise} callback
+   * @return {!Promise}
+   * @private
+   */
+  animate_(callback) {
+    const wait = this.animating_ || Promise.resolve();
+    return (this.animating_ = wait
+      .then(
+        () => {
+          return callback();
+        },
+        () => {
+          // Ignore errors to make sure animations don't get stuck.
+        }
+      )
+      .then(() => {
+        this.animating_ = null;
+      }));
   }
 
-  const {message, stack} = error;
-  const e = new Error(message);
-  // Copy all the extraneous things we attach.
-  for (const prop in error) {
-    e[prop] = error[prop];
+  /**
+   * Returns maximum allowed height for current viewport.
+   * @param {number} height
+   * @return {number}
+   * @private
+   */
+  getMaxAllowedHeight_(height) {
+    return Math.min(height, this.doc_.getWin()./*OK*/ innerHeight * 0.9);
   }
-  // Ensure these are copied.
-  e.stack = stack;
-  return e;
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-const LINK_REQUEST_ID = 'swg-link';
 
-/**
- * The flow to link an existing publisher account to an existing google account.
- */
-class LinkbackFlow {
   /**
-   * @param {!./deps.DepsDef} deps
+   * Gets the element's height.
+   * @return {number}
+   * @private
    */
-  constructor(deps) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../model/page-config.PageConfig} */
-    this.pageConfig_ = deps.pageConfig();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
+  getHeight_() {
+    return this.getElement().offsetHeight;
   }
 
   /**
-   * Starts the Link account flow.
-   * @param {{ampReaderId: (string|undefined)}=} params
-   * @return {!Promise}
+   * Sets the position of the dialog. Currently 'BOTTOM' is set by default.
    */
-  start(params = {}) {
-    this.deps_.callbacks().triggerFlowStarted(SubscriptionFlows.LINK_ACCOUNT);
-    const forceRedirect =
-      this.deps_.config().windowOpenMode == WindowOpenMode.REDIRECT;
-    const args = params.ampReaderId
-      ? feArgs({
-          'publicationId': this.pageConfig_.getPublicationId(),
-          'ampReaderId': params.ampReaderId,
-        })
-      : feArgs({
-          'publicationId': this.pageConfig_.getPublicationId(),
-        });
-    const opener = this.activityPorts_.open(
-      LINK_REQUEST_ID,
-      feUrl('/linkbackstart'),
-      forceRedirect ? '_top' : '_blank',
-      args,
-      {}
-    );
-    this.deps_.eventManager().logSwgEvent(AnalyticsEvent.IMPRESSION_LINK);
-    this.dialogManager_.popupOpened(opener && opener.targetWin);
-    return Promise.resolve();
+  setPosition_() {
+    setImportantStyles(this.getElement(), this.getPositionStyle_());
   }
-}
 
-/**
- * The class for Link accounts flow.
- */
-class LinkCompleteFlow {
   /**
-   * @param {!./deps.DepsDef} deps
+   * Add the padding to the containing page so as to not hide the content
+   * behind the popup, if rendered at the bottom.
+   * @param {number} newHeight
+   * @private
    */
-  static configurePending(deps) {
-    /**
-     * Handler function.
-     * @param {!../components/activities.ActivityPortDef} port
-     */
-    function handler(port) {
-      deps.entitlementsManager().blockNextNotification();
-      deps.callbacks().triggerLinkProgress();
-      deps.dialogManager().popupClosed();
-      const promise = acceptPortResultData(
-        port,
-        feOrigin(),
-        /* requireOriginVerified */ false,
-        /* requireSecureChannel */ false
-      );
-      return promise.then(
-        response => {
-          const flow = new LinkCompleteFlow(deps, response);
-          flow.start();
-        },
-        reason => {
-          if (isCancelError(reason)) {
-            deps
-              .eventManager()
-              .logSwgEvent(AnalyticsEvent.ACTION_LINK_CANCEL, true);
-            deps
-              .callbacks()
-              .triggerFlowCanceled(SubscriptionFlows.LINK_ACCOUNT);
-          }
-        }
-      );
+  updatePaddingToHtml_(newHeight) {
+    if (this.inferPosition_() == PositionAt.BOTTOM) {
+      const bottomPadding = newHeight + 20; // Add some extra padding.
+      const htmlElement = this.doc_.getRootElement();
+      setImportantStyles(htmlElement, {
+        'padding-bottom': `${bottomPadding}px`,
+      });
     }
-    deps.activities().onResult(LINK_REQUEST_ID, handler);
   }
 
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {?Object} response
+   * Removes previouly added bottom padding from the document.
+   * @private
    */
-  constructor(deps, response) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
-
-    /** @private @const {!./entitlements-manager.EntitlementsManager} */
-    this.entitlementsManager_ = deps.entitlementsManager();
-
-    /** @private @const {!./callbacks.Callbacks} */
-    this.callbacks_ = deps.callbacks();
-
-    const index = (response && response['index']) || '0';
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/linkconfirmiframe', '/u/' + index),
-      feArgs({
-        'productId': deps.pageConfig().getProductId(),
-        'publicationId': deps.pageConfig().getPublicationId(),
-      }),
-      /* shouldFadeBody */ true
-    );
-
-    /** @private {?function()} */
-    this.completeResolver_ = null;
-
-    /** @private @const {!Promise} */
-    this.completePromise_ = new Promise(resolve => {
-      this.completeResolver_ = resolve;
-    });
+  removePaddingToHtml_() {
+    this.doc_.getRootElement().style.removeProperty('padding-bottom');
   }
 
   /**
-   * Starts the Link account flow.
-   * @return {!Promise}
+   * Calculates the position of the dialog. Currently dialog is positioned at
+   * the bottom only. This could change in future to adjust the dialog position
+   * based on the screen size.
+   * @return {string}
+   * @private
    */
-  start() {
-    const promise = this.activityIframeView_.acceptResultAndVerify(
-      feOrigin(),
-      /* requireOriginVerified */ true,
-      /* requireSecureChannel */ true
-    );
-    promise
-      .then(response => {
-        this.complete_(response);
-      })
-      .catch(reason => {
-        // Rethrow async.
-        setTimeout(() => {
-          throw reason;
-        });
-      })
-      .then(() => {
-        // The flow is complete.
-        this.dialogManager_.completeView(this.activityIframeView_);
-      });
-    this.deps_
-      .eventManager()
-      .logSwgEvent(AnalyticsEvent.EVENT_GOOGLE_UPDATED, true);
-    this.deps_
-      .eventManager()
-      .logSwgEvent(AnalyticsEvent.IMPRESSION_GOOGLE_UPDATED, true);
-    return this.dialogManager_.openView(this.activityIframeView_);
+  inferPosition_() {
+    return PositionAt.BOTTOM;
   }
 
   /**
-   * @param {?Object} response
+   * Returns the styles required to postion the dialog.
+   * @return {!Object<string, string|number>}
    * @private
    */
-  complete_(response) {
-    this.deps_
-      .eventManager()
-      .logSwgEvent(AnalyticsEvent.ACTION_GOOGLE_UPDATED_CLOSE, true);
-    this.callbacks_.triggerLinkComplete();
-    this.callbacks_.resetLinkProgress();
-    this.entitlementsManager_.setToastShown(true);
-    this.entitlementsManager_.unblockNextNotification();
-    this.entitlementsManager_.reset((response && response['success']) || false);
-    if (response && response['entitlements']) {
-      this.entitlementsManager_.pushNextEntitlements(response['entitlements']);
+  getPositionStyle_() {
+    const dialogPosition = this.inferPosition_();
+    switch (dialogPosition) {
+      case PositionAt.BOTTOM:
+        return {'bottom': 0};
+      case PositionAt.TOP:
+        return {'top': 0};
+      case PositionAt.FLOAT:
+        return {
+          'position': 'fixed',
+          'top': '50%',
+          'left': '50%',
+          'transform': 'translate(-50%, -50%)',
+        };
+      case PositionAt.FULL:
+        return {
+          'position': 'fixed',
+          'height': '100%',
+          'top': 0,
+          'bottom': 0,
+        };
+      default:
+        return {'bottom': 0};
     }
-    this.completeResolver_();
-  }
-
-  /** @return {!Promise} */
-  whenComplete() {
-    return this.completePromise_;
   }
 }
 
 /**
- * The flow to save subscription information from an existing publisher account
- * to an existing google account.  The accounts may or may not already be
- * linked.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-class LinkSaveFlow {
+
+const POPUP_Z_INDEX = 2147483647;
+
+/**
+ * The class for the top level dialog.
+ * @final
+ */
+class DialogManager {
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!../api/subscriptions.SaveSubscriptionRequestCallback} callback
+   * @param {!../model/doc.Doc} doc
    */
-  constructor(deps, callback) {
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
+  constructor(doc) {
+    /** @private @const {!../model/doc.Doc} */
+    this.doc_ = doc;
 
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
+    /** @private {?Dialog} */
+    this.dialog_ = null;
 
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
+    /** @private {?Promise<!Dialog>} */
+    this.openPromise_ = null;
 
-    /** @private {!../api/subscriptions.SaveSubscriptionRequestCallback} */
-    this.callback_ = callback;
+    /** @private @const {!Graypane} */
+    this.popupGraypane_ = new Graypane(doc, POPUP_Z_INDEX);
 
-    /** @private {?Promise<!../api/subscriptions.SaveSubscriptionRequest>} */
-    this.requestPromise_ = null;
+    /** @private {?Window} */
+    this.popupWin_ = null;
 
-    /** @private {?Promise} */
-    this.openPromise_ = null;
+    this.popupGraypane_.getElement().addEventListener('click', () => {
+      if (this.popupWin_) {
+        try {
+          this.popupWin_.focus();
+        } catch (e) {
+          // Ignore error.
+        }
+      }
+    });
+  }
 
-    /** @private {?ActivityIframeView} */
-    this.activityIframeView_ = null;
+  /**
+   * @param {boolean=} hidden
+   * @return {!Promise<!Dialog>}
+   */
+  openDialog(hidden = false) {
+    if (!this.openPromise_) {
+      this.dialog_ = new Dialog(this.doc_);
+      this.openPromise_ = this.dialog_.open(hidden);
+    }
+    return this.openPromise_;
   }
 
   /**
-   * @return {?Promise<!../api/subscriptions.SaveSubscriptionRequest>}
-   * @package Visible for testing.
+   * @param {!./view.View} view
+   * @param {boolean=} hidden
+   * @return {!Promise}
    */
-  getRequestPromise() {
-    return this.requestPromise_;
+  openView(view, hidden = false) {
+    view.whenComplete().catch(reason => {
+      if (isCancelError(reason)) {
+        this.completeView(view);
+      }
+      throw reason;
+    });
+    return this.openDialog(hidden).then(dialog => {
+      return dialog.openView(view);
+    });
   }
 
   /**
-   * @private
+   * @param {?./view.View} view
    */
-  complete_() {
-    this.dialogManager_.completeView(this.activityIframeView_);
+  completeView(view) {
+    // Give a small amount of time for another view to take over the dialog.
+    setTimeout(() => {
+      if (this.dialog_ && this.dialog_.getCurrentView() == view) {
+        this.close_();
+      }
+    }, 100);
   }
 
   /**
-   * @param {!Object} result
-   * @return {!Promise<boolean>}
-   * @private
    */
-  handleLinkSaveResponse_(result) {
-    // This flow is complete
-    this.complete_();
-    let startPromise;
-    let linkConfirm = null;
-    if (result['linked']) {
-      // When linking succeeds, start link confirmation flow
-      this.dialogManager_.popupClosed();
-      this.deps_.callbacks().triggerFlowStarted(SubscriptionFlows.LINK_ACCOUNT);
-      linkConfirm = new LinkCompleteFlow(this.deps_, result);
-      startPromise = linkConfirm.start();
-    } else {
-      startPromise = Promise.reject(createCancelError(this.win_, 'not linked'));
+  completeAll() {
+    if (this.dialog_) {
+      this.close_();
     }
-    const completePromise = startPromise.then(() => {
-      this.deps_.callbacks().triggerLinkProgress();
-      return linkConfirm.whenComplete();
-    });
+    if (this.popupGraypane_.isAttached()) {
+      this.popupGraypane_.destroy();
+    }
+  }
 
-    return completePromise.then(() => {
-      return true;
-    });
+  /** @private */
+  close_() {
+    this.dialog_.close();
+    this.dialog_ = null;
+    this.openPromise_ = null;
   }
 
   /**
-   * @param {LinkingInfoResponse} response
-   * @private
+   * @param {?Window|undefined} targetWin
    */
-  sendLinkSaveToken_(response) {
-    if (!response || !response.getRequested()) {
-      return;
+  popupOpened(targetWin) {
+    this.popupWin_ = targetWin || null;
+    if (!this.popupGraypane_.isAttached()) {
+      this.popupGraypane_.attach();
     }
-    this.requestPromise_ = new Promise(resolve => {
-      resolve(this.callback_());
-    })
-      .then(request => {
-        const saveRequest = new LinkSaveTokenRequest();
-        if (request && request.token) {
-          if (request.authCode) {
-            throw new Error('Both authCode and token are available');
-          } else {
-            saveRequest.setToken(request.token);
-          }
-        } else if (request && request.authCode) {
-          saveRequest.setAuthCode(request.authCode);
-        } else {
-          throw new Error('Neither token or authCode is available');
-        }
-        this.activityIframeView_.execute(saveRequest);
-      })
-      .catch(reason => {
-        // The flow is complete.
-        this.complete_();
-        throw reason;
-      });
+    this.popupGraypane_.show();
   }
 
   /**
-   * @return {?Promise}
-   */
-  /**
-   * Starts the save subscription
-   * @return {!Promise}
    */
-  start() {
-    const iframeArgs = {
-      'publicationId': this.deps_.pageConfig().getPublicationId(),
-      'isClosable': true,
-    };
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/linksaveiframe'),
-      feArgs(iframeArgs),
-      /* shouldFadeBody */ false,
-      /* hasLoadingIndicator */ true
-    );
-    this.activityIframeView_.on(
-      LinkingInfoResponse,
-      this.sendLinkSaveToken_.bind(this)
-    );
-
-    this.openPromise_ = this.dialogManager_.openView(
-      this.activityIframeView_,
-      /* hidden */ true
-    );
-    this.deps_
-      .eventManager()
-      .logSwgEvent(AnalyticsEvent.IMPRESSION_SAVE_SUBSCR_TO_GOOGLE);
-    /** {!Promise<boolean>} */
-    return this.activityIframeView_
-      .acceptResultAndVerify(
-        feOrigin(),
-        /* requireOriginVerified */ true,
-        /* requireSecureChannel */ true
-      )
-      .then(result => {
-        return this.handleLinkSaveResponse_(result);
-      })
-      .catch(reason => {
-        // In case this flow wasn't complete, complete it here
-        this.complete_();
-        // Handle cancellation from user, link confirm start or completion here
-        if (isCancelError(reason)) {
-          this.deps_
-            .eventManager()
-            .logSwgEvent(
-              AnalyticsEvent.ACTION_SAVE_SUBSCR_TO_GOOGLE_CANCEL,
-              true
-            );
-          this.deps_
-            .callbacks()
-            .triggerFlowCanceled(SubscriptionFlows.LINK_ACCOUNT);
-          return false;
-        }
-        throw reason;
-      });
+  popupClosed() {
+    this.popupWin_ = null;
+    try {
+      this.popupGraypane_.hide();
+    } catch (e) {
+      // Ignore.
+    }
   }
 }
 
@@ -9825,71 +9803,157 @@ class LinkSaveFlow {
  * limitations under the License.
  */
 
-class LoginPromptApi {
+/** @const {!Object<string, string|number>} */
+const toastImportantStyles = {
+  'height': 0,
+};
+
+/** @const {!Object<string, string>} */
+const iframeAttributes$2 = {
+  'frameborder': '0',
+  'scrolling': 'no',
+  'class': 'swg-toast',
+};
+
+/**
+ * The class Notification toast.
+ */
+class Toast {
   /**
-   * @param {!./deps.DepsDef} deps
+   * @param {!../runtime/deps.DepsDef} deps
+   * @param {string} src
+   * @param {!Object<string, ?>} args
    */
-  constructor(deps) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
+  constructor(deps, src, args) {
+    /** @private @const {!../model/doc.Doc} */
+    this.doc_ = deps.doc();
 
     /** @private @const {!../components/activities.ActivityPorts} */
     this.activityPorts_ = deps.activities();
 
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
+    /** @private @const {string} */
+    this.src_ = src;
+
+    /** @private @const {!Object<string, ?>} */
+    this.args_ = args;
 
     /** @private {?Promise} */
-    this.openViewPromise_ = null;
+    this.animating_ = null;
 
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/loginiframe'),
-      feArgs({
-        publicationId: deps.pageConfig().getPublicationId(),
-        productId: deps.pageConfig().getProductId(),
-        // First ask the user if they want us to log them in.
-        userConsent: true,
-        // TODO(chenshay): Pass entitlements value here.
-      }),
-      /* shouldFadeBody */ true
-    );
+    /** @private @const {!HTMLIFrameElement} */
+    this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
+      this.doc_.getWin().document,
+      'iframe',
+      iframeAttributes$2
+    ));
+
+    setImportantStyles(this.iframe_, toastImportantStyles);
+
+    /** @private @const {!Promise} */
+    this.ready_ = new Promise(resolve => {
+      this.iframe_.onload = resolve;
+    });
   }
 
   /**
-   * Prompts the user to login.
+   * Returns the iframe element.
+   * @return {!HTMLIFrameElement}
+   */
+  getElement() {
+    return this.iframe_;
+  }
+
+  /**
+   * Opens the notification toast.
    * @return {!Promise}
    */
-  start() {
-    this.deps_
-      .callbacks()
-      .triggerFlowStarted(SubscriptionFlows.SHOW_LOGIN_PROMPT);
+  open() {
+    this.doc_.getBody().appendChild(this.iframe_); // Fires onload.
+    return this.buildToast_();
+  }
 
-    this.openViewPromise_ = this.dialogManager_.openView(
-      this.activityIframeView_
-    );
+  /**
+   * Builds the content of the iframe. On load, animates the toast.
+   */
+  buildToast_() {
+    const toastDurationSeconds = 7;
+    return this.activityPorts_
+      .openIframe(this.iframe_, this.src_, this.args_)
+      .then(port => {
+        return port.whenReady();
+      })
+      .then(() => {
+        resetStyles(this.iframe_, ['height']);
 
-    return this.activityIframeView_.acceptResult().then(
-      () => {
-        // The consent part is complete.
-        this.dialogManager_.completeView(this.activityIframeView_);
-      },
-      reason => {
-        if (isCancelError(reason)) {
-          this.deps_
-            .callbacks()
-            .triggerFlowCanceled(SubscriptionFlows.SHOW_LOGIN_PROMPT);
-        } else {
-          this.dialogManager_.completeView(this.activityIframeView_);
+        this.animate_(() => {
+          setImportantStyles(this.iframe_, {
+            'transform': 'translateY(100%)',
+            'opactiy': 1,
+            'visibility': 'visible',
+          });
+          return transition(
+            this.iframe_,
+            {
+              'transform': 'translateY(0)',
+              'opacity': 1,
+              'visibility': 'visible',
+            },
+            400,
+            'ease-out'
+          );
+        });
+
+        // Close the Toast after the specified duration.
+        this.doc_.getWin().setTimeout(() => {
+          this.close();
+        }, (toastDurationSeconds + 1) * 1000);
+      });
+  }
+
+  /**
+   * @param {function():!Promise} callback
+   * @return {!Promise}
+   * @private
+   */
+  animate_(callback) {
+    const wait = this.animating_ || Promise.resolve();
+    return (this.animating_ = wait
+      .then(
+        () => {
+          return callback();
+        },
+        () => {
+          // Ignore errors to make sure animations don't get stuck.
         }
-        throw reason;
-      }
-    );
+      )
+      .then(() => {
+        this.animating_ = null;
+      }));
+  }
+
+  /**
+   * Closes the toast.
+   * @return {!Promise}
+   */
+  close() {
+    return this.animate_(() => {
+      // Remove the toast from the DOM after animation is complete.
+      this.doc_.getWin().setTimeout(() => {
+        this.doc_.getBody().removeChild(this.iframe_);
+        return Promise.resolve();
+      }, 500);
+
+      return transition(
+        this.iframe_,
+        {
+          'transform': 'translateY(100%)',
+          'opacity': 1,
+          'visibility': 'visible',
+        },
+        400,
+        'ease-out'
+      );
+    });
   }
 }
 
@@ -9909,676 +9973,848 @@ class LoginPromptApi {
  * limitations under the License.
  */
 
-class LoginNotificationApi {
+const SERVICE_ID = 'subscribe.google.com';
+const TOAST_STORAGE_KEY = 'toast';
+const ENTS_STORAGE_KEY = 'ents';
+const IS_READY_TO_PAY_STORAGE_KEY = 'isreadytopay';
+
+/**
+ */
+class EntitlementsManager {
   /**
+   * @param {!Window} win
+   * @param {!../model/page-config.PageConfig} pageConfig
+   * @param {!./fetcher.Fetcher} fetcher
    * @param {!./deps.DepsDef} deps
    */
-  constructor(deps) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
+  constructor(win, pageConfig, fetcher, deps) {
     /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
+    this.win_ = win;
 
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
+    /** @private @const {!../model/page-config.PageConfig} */
+    this.pageConfig_ = pageConfig;
 
-    /** @private {?Promise} */
-    this.openViewPromise_ = null;
+    /** @private @const {string} */
+    this.publicationId_ = this.pageConfig_.getPublicationId();
 
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/loginiframe'),
-      feArgs({
-        publicationId: deps.pageConfig().getPublicationId(),
-        productId: deps.pageConfig().getProductId(),
-        // No need to ask the user. Just tell them you're logging them in.
-        userConsent: false,
-        // TODO(chenshay): Pass entitlements value here.
-      }),
-      /* shouldFadeBody */ true
-    );
-  }
+    /** @private @const {!./fetcher.Fetcher} */
+    this.fetcher_ = fetcher;
 
-  /**
-   * Continues the Login flow (after waiting).
-   * @return {!Promise}
-   */
-  start() {
-    this.deps_
-      .callbacks()
-      .triggerFlowStarted(SubscriptionFlows.SHOW_LOGIN_NOTIFICATION);
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
 
-    this.openViewPromise_ = this.dialogManager_.openView(
-      this.activityIframeView_
-    );
+    /** @private @const {!JwtHelper} */
+    this.jwtHelper_ = new JwtHelper();
 
-    return this.activityIframeView_.acceptResult().then(
-      () => {
-        // The consent part is complete.
-        this.dialogManager_.completeView(this.activityIframeView_);
-      },
-      reason => {
-        this.dialogManager_.completeView(this.activityIframeView_);
-        throw reason;
-      }
-    );
-  }
-}
+    /** @private {?Promise<!Entitlements>} */
+    this.responsePromise_ = null;
 
-/**
- * @license
- * Copyright 2018 Google Inc. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+    /** @private {number} */
+    this.positiveRetries_ = 0;
 
-const MAX_Z_INDEX = 2147483647;
+    /** @private {boolean} */
+    this.blockNextNotification_ = false;
 
-const Constants = {};
+    /** @private @const {!./storage.Storage} */
+    this.storage_ = deps.storage();
 
-/**
- * Supported environments.
- *
- * @enum {string}
- */
-Constants.Environment = {
-  LOCAL: 'LOCAL',
-  PREPROD: 'PREPROD',
-  PRODUCTION: 'PRODUCTION',
-  SANDBOX: 'SANDBOX',
-  TEST: 'TEST',
-  TIN: 'TIN',
-};
+    /** @private @const {!../runtime/analytics-service.AnalyticsService} */
+    this.analyticsService_ = deps.analytics();
 
-/**
- * Supported payment methods.
- *
- * @enum {string}
- */
-Constants.PaymentMethod = {
-  CARD: 'CARD',
-  TOKENIZED_CARD: 'TOKENIZED_CARD',
-  UPI: 'UPI',
-};
+    /** @private @const {!../api/subscriptions.Config} */
+    this.config_ = deps.config();
+  }
 
-/**
- * Auth methods.
- *
- * @enum {string}
- */
-Constants.AuthMethod = {
-  CRYPTOGRAM_3DS: 'CRYPTOGRAM_3DS',
-  PAN_ONLY: 'PAN_ONLY',
-};
+  /**
+   * @param {boolean=} expectPositive
+   */
+  reset(expectPositive) {
+    this.responsePromise_ = null;
+    this.positiveRetries_ = Math.max(
+      this.positiveRetries_,
+      expectPositive ? 3 : 0
+    );
+    if (expectPositive) {
+      this.storage_.remove(ENTS_STORAGE_KEY);
+      this.storage_.remove(IS_READY_TO_PAY_STORAGE_KEY);
+    }
+  }
 
-/**
- * Returned result status.
- *
- * @enum {string}
- */
-Constants.ResponseStatus = {
-  CANCELED: 'CANCELED',
-  DEVELOPER_ERROR: 'DEVELOPER_ERROR',
-};
+  /**
+   * Clears all of the entitlements state and cache.
+   */
+  clear() {
+    this.responsePromise_ = null;
+    this.positiveRetries_ = 0;
+    this.unblockNextNotification();
+    this.storage_.remove(ENTS_STORAGE_KEY);
+    this.storage_.remove(TOAST_STORAGE_KEY);
+    this.storage_.remove(IS_READY_TO_PAY_STORAGE_KEY);
+  }
 
-/**
- * Supported total price status.
- *
- * @enum {string}
- */
-Constants.TotalPriceStatus = {
-  ESTIMATED: 'ESTIMATED',
-  FINAL: 'FINAL',
-  NOT_CURRENTLY_KNOWN: 'NOT_CURRENTLY_KNOWN',
-};
+  /**
+   * @return {string}
+   * @private
+   */
+  getQueryString_() {
+    return this.win_.location.search;
+  }
 
-/**
- * Supported Google Pay payment button type.
- *
- * @enum {string}
- */
-Constants.ButtonType = {
-  SHORT: 'short',
-  LONG: 'long',
-};
+  /**
+   * @param {?string=} encryptedDocumentKey
+   * @return {!Promise<!Entitlements>}
+   */
+  getEntitlements(encryptedDocumentKey) {
+    if (!this.responsePromise_) {
+      this.responsePromise_ = this.getEntitlementsFlow_(encryptedDocumentKey);
+    }
+    return this.responsePromise_.then(response => {
+      if (response.isReadyToPay != null) {
+        this.analyticsService_.setReadyToPay(response.isReadyToPay);
+      }
+      return response;
+    });
+  }
 
-/**
- * Supported button colors.
- *
- * @enum {string}
- */
-Constants.ButtonColor = {
-  DEFAULT: 'default',  // Currently defaults to black.
-  BLACK: 'black',
-  WHITE: 'white',
-};
+  /**
+   * @param {string} raw
+   * @param {boolean=} isReadyToPay
+   * @return {boolean}
+   */
+  pushNextEntitlements(raw, isReadyToPay) {
+    const entitlements = this.getValidJwtEntitlements_(
+      raw,
+      /* requireNonExpired */ true,
+      isReadyToPay
+    );
+    if (entitlements && entitlements.enablesThis()) {
+      this.storage_.set(ENTS_STORAGE_KEY, raw);
+      return true;
+    }
+    return false;
+  }
 
-/**
- * Id attributes.
- *
- * @enum {string}
- */
-Constants.Id = {
-  POPUP_WINDOW_CONTAINER: 'popup-window-container',
-};
+  /**
+   * @param {?string=} encryptedDocumentKey
+   * @return {!Promise<!Entitlements>}
+   * @private
+   */
+  getEntitlementsFlow_(encryptedDocumentKey) {
+    return this.fetchEntitlementsWithCaching_(encryptedDocumentKey).then(
+      entitlements => {
+        this.onEntitlementsFetched_(entitlements);
+        return entitlements;
+      }
+    );
+  }
 
-/** @const {string} */
-Constants.STORAGE_KEY_PREFIX = 'google.payments.api.storage';
+  /**
+   * @param {?string=} encryptedDocumentKey
+   * @return {!Promise<!Entitlements>}
+   * @private
+   */
+  fetchEntitlementsWithCaching_(encryptedDocumentKey) {
+    return Promise.all([
+      this.storage_.get(ENTS_STORAGE_KEY),
+      this.storage_.get(IS_READY_TO_PAY_STORAGE_KEY),
+    ]).then(cachedValues => {
+      const raw = cachedValues[0];
+      const irtp = cachedValues[1];
+      // Try cache first.
+      if (raw && !encryptedDocumentKey) {
+        const cached = this.getValidJwtEntitlements_(
+          raw,
+          /* requireNonExpired */ true,
+          irtpStringToBoolean(irtp)
+        );
+        if (cached && cached.enablesThis()) {
+          // Already have a positive response.
+          this.positiveRetries_ = 0;
+          return cached;
+        }
+      }
+      // If cache didn't match, perform fetch.
+      return this.fetchEntitlements_(encryptedDocumentKey).then(ents => {
+        // If entitlements match the product, store them in cache.
+        if (ents && ents.enablesThis() && ents.raw) {
+          this.storage_.set(ENTS_STORAGE_KEY, ents.raw);
+        }
+        return ents;
+      });
+    });
+  }
 
-/** @const {string} */
-Constants.IS_READY_TO_PAY_RESULT_KEY =
-    Constants.STORAGE_KEY_PREFIX + '.isreadytopay.result';
+  /**
+   * @param {?string=} encryptedDocumentKey
+   * @return {!Promise<!Entitlements>}
+   * @private
+   */
+  fetchEntitlements_(encryptedDocumentKey) {
+    // TODO(dvoytenko): Replace retries with consistent fetch.
+    let positiveRetries = this.positiveRetries_;
+    this.positiveRetries_ = 0;
+    const attempt = () => {
+      positiveRetries--;
+      return this.fetch_(encryptedDocumentKey).then(entitlements => {
+        if (entitlements.enablesThis() || positiveRetries <= 0) {
+          return entitlements;
+        }
+        return new Promise(resolve => {
+          this.win_.setTimeout(() => {
+            resolve(attempt());
+          }, 550);
+        });
+      });
+    };
+    return attempt();
+  }
 
-/** @const {string} */
-Constants.UPI_CAN_MAKE_PAYMENT_CACHE_KEY =
-    Constants.STORAGE_KEY_PREFIX + '.upi.canMakePaymentCache';
+  /**
+   * @param {boolean} value
+   */
+  setToastShown(value) {
+    this.storage_.set(TOAST_STORAGE_KEY, value ? '1' : '0');
+  }
 
+  /**
+   */
+  blockNextNotification() {
+    this.blockNextNotification_ = true;
+  }
 
-Constants.CLASS_PREFIX = 'google-payments-';
-Constants.IFRAME_ACTIVE_CONTAINER_CLASS =
-    `${Constants.CLASS_PREFIX}activeContainer`;
-Constants.IFRAME_CONTAINER_CLASS = `${Constants.CLASS_PREFIX}dialogContainer`;
-Constants.IFRAME_STYLE_CENTER_CLASS = `${Constants.CLASS_PREFIX}dialogCenter`;
-Constants.IFRAME_STYLE_CLASS = `${Constants.CLASS_PREFIX}dialog`;
+  /**
+   */
+  unblockNextNotification() {
+    this.blockNextNotification_ = false;
+  }
 
-Constants.IFRAME_STYLE = `
-.${Constants.IFRAME_STYLE_CLASS} {
-    animation: none 0s ease 0s 1 normal none running;
-    background: none 0 0 / auto repeat scroll padding-box border-box #fff;
-    background-blend-mode: normal;
-    border: 0 none #333;
-    border-radius: 8px 8px 0 0;
-    border-collapse: separate;
-    bottom: 0;
-    box-shadow: #808080 0 3px 0 0, #808080 0 0 22px;
-    box-sizing: border-box;
-    letter-spacing: normal;
-    max-height: 100%;
-    overflow: visible;
-    position: fixed;
-    width: 100%;
-    z-index: ${MAX_Z_INDEX};
-    -webkit-appearance: none;
-    left: 0;
-}
-@media (min-width: 480px) {
-  .${Constants.IFRAME_STYLE_CLASS} {
-    width: 480px !important;
-    left: -240px !important;
-    margin-left: calc(100vw - 100vw / 2) !important;
+  /**
+   * The JSON must either contain a "signedEntitlements" with JWT, or
+   * "entitlements" field with plain JSON object.
+   * @param {!Object} json
+   * @return {!Entitlements}
+   */
+  parseEntitlements(json) {
+    const isReadyToPay = json['isReadyToPay'];
+    if (isReadyToPay == null) {
+      this.storage_.remove(IS_READY_TO_PAY_STORAGE_KEY);
+    } else {
+      this.storage_.set(IS_READY_TO_PAY_STORAGE_KEY, String(isReadyToPay));
+    }
+    const signedData = json['signedEntitlements'];
+    const decryptedDocumentKey = json['decryptedDocumentKey'];
+    if (signedData) {
+      const entitlements = this.getValidJwtEntitlements_(
+        signedData,
+        /* requireNonExpired */ false,
+        isReadyToPay,
+        decryptedDocumentKey
+      );
+      if (entitlements) {
+        return entitlements;
+      }
+    } else {
+      const plainEntitlements = json['entitlements'];
+      if (plainEntitlements) {
+        return this.createEntitlements_(
+          '',
+          plainEntitlements,
+          isReadyToPay,
+          decryptedDocumentKey
+        );
+      }
+    }
+    // Empty response.
+    return this.createEntitlements_('', [], isReadyToPay);
   }
-}
-.${Constants.IFRAME_CONTAINER_CLASS} {
-  background-color: rgba(0,0,0,0.26);
-  bottom: 0;
-  height: 100%;
-  left: 0;
-  position: absolute;
-  right: 0;
-}
-.iframeContainer {
-  -webkit-overflow-scrolling: touch;
-}
-`;
 
-Constants.IFRAME_STYLE_CENTER = `
-.${Constants.IFRAME_STYLE_CENTER_CLASS} {
-  animation: none 0s ease 0s 1 normal none running;
-  background-blend-mode: normal;
-  background: none 0 0 / auto repeat scroll padding-box border-box #fff;
-  border-collapse: separate;
-  border-radius: 8px;
-  border: 0px none #333;
-  bottom: auto;
-  box-shadow: #808080 0 0 22px;
-  box-sizing: border-box;
-  left: -240px;
-  letter-spacing: normal;
-  margin-left: calc(100vw - 100vw / 2) !important;
-  max-height: 90%;
-  overflow: visible;
-  position: absolute;
-  top: 100%;
-  transform: scale(0.8);
-  width: 480px;
-  z-index: ${MAX_Z_INDEX};
-  -webkit-appearance: none;
-}
-@media (min-height: 667px) {
-  .${Constants.IFRAME_STYLE_CENTER_CLASS} {
-    max-height: 600px;
+  /**
+   * @param {string} raw
+   * @param {boolean} requireNonExpired
+   * @param {boolean=} isReadyToPay
+   * @param {?string=} decryptedDocumentKey
+   * @return {?Entitlements}
+   * @private
+   */
+  getValidJwtEntitlements_(
+    raw,
+    requireNonExpired,
+    isReadyToPay,
+    decryptedDocumentKey
+  ) {
+    try {
+      const jwt = this.jwtHelper_.decode(raw);
+      if (requireNonExpired) {
+        const now = Date.now();
+        const exp = jwt['exp'];
+        if (parseFloat(exp) * 1000 < now) {
+          return null;
+        }
+      }
+      const entitlementsClaim = jwt['entitlements'];
+      return (
+        (entitlementsClaim &&
+          this.createEntitlements_(
+            raw,
+            entitlementsClaim,
+            isReadyToPay,
+            decryptedDocumentKey
+          )) ||
+        null
+      );
+    } catch (e) {
+      // Ignore the error.
+      this.win_.setTimeout(() => {
+        throw e;
+      });
+    }
+    return null;
   }
-}
-.${Constants.IFRAME_ACTIVE_CONTAINER_CLASS} {
-  top: 50%;
-  transform: scale(1.0) translateY(-50%);
-}
-`;
 
-Constants.GPAY_BUTTON_WITH_CARD_INFO_IMAGE =
-    'background-image: url(https://pay.google.com/gp/p/generate_gpay_btn_img);';
-
-Constants.BUTTON_LOCALE_TO_MIN_WIDTH = {
-  'en': 152,
-  'bg': 163,
-  'cs': 192,
-  'de': 183,
-  'es': 183,
-  'fr': 183,
-  'hr': 157,
-  'id': 186,
-  'ja': 148,
-  'ko': 137,
-  'ms': 186,
-  'nl': 167,
-  'pl': 182,
-  'pt': 193,
-  'ru': 206,
-  'sk': 157,
-  'sl': 211,
-  'sr': 146,
-  'tr': 161,
-  'uk': 207,
-  'zh': 156,
-};
+  /**
+   * @param {string} raw
+   * @param {!Object|!Array<!Object>} json
+   * @param {boolean=} isReadyToPay
+   * @param {?string=} decryptedDocumentKey
+   * @return {!Entitlements}
+   * @private
+   */
+  createEntitlements_(raw, json, isReadyToPay, decryptedDocumentKey) {
+    return new Entitlements(
+      SERVICE_ID,
+      raw,
+      Entitlement.parseListFromJson(json),
+      this.pageConfig_.getProductId(),
+      this.ack_.bind(this),
+      isReadyToPay,
+      decryptedDocumentKey
+    );
+  }
 
-/**
- * Name of the graypane.
- *
- * @const {string}
- */
-Constants.GPAY_GRAYPANE = 'gpay-graypane';
+  /**
+   * @param {!Entitlements} entitlements
+   * @private
+   */
+  onEntitlementsFetched_(entitlements) {
+    // Skip any notifications and toast if other flows are ongoing.
+    // TODO(dvoytenko): what's the right action when pay flow was canceled?
+    const blockNotification = this.blockNextNotification_;
+    this.blockNextNotification_ = false;
+    if (blockNotification) {
+      return;
+    }
 
-/**
- * Class used for the gpay button.
- *
- * @const {string}
- */
-Constants.GPAY_BUTTON_CLASS = 'gpay-button';
+    // Notify on the received entitlements.
+    this.deps_
+      .callbacks()
+      .triggerEntitlementsResponse(Promise.resolve(entitlements));
 
-Constants.BUTTON_STYLE = `
-.${Constants.GPAY_BUTTON_CLASS} {
-  background-origin: content-box;
-  background-position: center center;
-  background-repeat: no-repeat;
-  background-size: contain;
-  border: 0px;
-  border-radius: 4px;
-  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 1px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
-  cursor: pointer;
-  height: 40px;
-  min-height: 40px;
-  padding: 11px 24px;
-}
+    // Show a toast if needed.
+    this.maybeShowToast_(entitlements);
+  }
 
-.${Constants.GPAY_BUTTON_CLASS}.black {
-  background-color: #000;
-  box-shadow: none;
-  padding: 12px 24px 10px;
-}
+  /**
+   * @param {!Entitlements} entitlements
+   * @return {!Promise}
+   * @private
+   */
+  maybeShowToast_(entitlements) {
+    const entitlement = entitlements.getEntitlementForThis();
+    if (!entitlement) {
+      return Promise.resolve();
+    }
+    // Check if storage bit is set. It's only set by the `Entitlements.ack`
+    // method.
+    return this.storage_.get(TOAST_STORAGE_KEY).then(value => {
+      if (value == '1') {
+        // Already shown;
+        return;
+      }
+      if (entitlement) {
+        this.showToast_(entitlement);
+      }
+    });
+  }
 
-.${Constants.GPAY_BUTTON_CLASS}.white {
-  background-color: #fff;
-}
+  /**
+   * @param {!Entitlement} entitlement
+   * @private
+   */
+  showToast_(entitlement) {
+    const source = entitlement.source || 'google';
+    return new Toast(
+      this.deps_,
+      feUrl('/toastiframe'),
+      feArgs({
+        'publicationId': this.publicationId_,
+        'source': source,
+      })
+    ).open();
+  }
 
-.${Constants.GPAY_BUTTON_CLASS}.short {
-  min-width: 90px;
-  width: 160px;
-}
+  /**
+   * @param {!Entitlements} entitlements
+   * @private
+   */
+  ack_(entitlements) {
+    if (entitlements.getEntitlementForThis()) {
+      this.setToastShown(true);
+    }
+  }
 
-.${Constants.GPAY_BUTTON_CLASS}.black.short {
-  background-image: url(https://www.gstatic.com/instantbuy/svg/dark_gpay.svg);
+  /**
+   * @param {?string=} encryptedDocumentKey
+   * @return {!Promise<!Entitlements>}
+   * @private
+   */
+  fetch_(encryptedDocumentKey) {
+    let url =
+      '/publication/' +
+      encodeURIComponent(this.publicationId_) +
+      '/entitlements';
+    if (encryptedDocumentKey) {
+      //TODO(chenshay): Make this a 'Post'.
+      url += '?crypt=' + encodeURIComponent(encryptedDocumentKey);
+    }
+    return this.fetcher_
+      .fetchCredentialedJson(serviceUrl(url))
+      .then(json => this.parseEntitlements(json));
+  }
 }
 
-.${Constants.GPAY_BUTTON_CLASS}.white.short {
-  background-image: url(https://www.gstatic.com/instantbuy/svg/light_gpay.svg);
+/**
+ * Convert String value of isReadyToPay
+ * (from JSON or Cache) to a boolean value.
+ * @param {string} value
+ * @return {boolean|undefined}
+ * @private
+ */
+function irtpStringToBoolean(value) {
+  switch (value) {
+    case 'true':
+      return true;
+    case 'false':
+      return false;
+    default:
+      return undefined;
+  }
 }
 
-.${Constants.GPAY_BUTTON_CLASS}.black.active {
-  background-color: #5f6368;
-}
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-.${Constants.GPAY_BUTTON_CLASS}.black.hover {
-  background-color: #3c4043;
-}
+/**
+ * @enum {string}
+ */
+const ExperimentFlags = {
+  /**
+   * Enables the feature that allows you to replace one subscription
+   * for another in the subscribe() API.
+   */
+  REPLACE_SUBSCRIPTION: 'replace-subscription',
 
-.${Constants.GPAY_BUTTON_CLASS}.white.active {
-  background-color: #fff;
-}
+  /**
+   * Enables the contributions feature.
+   * DEPRECATED. This flag can be removed once not used by anyone.
+   */
+  CONTRIBUTIONS: 'contributions',
 
-.${Constants.GPAY_BUTTON_CLASS}.white.focus {
-  box-shadow: #e8e8e8 0 1px 1px 0, #e8e8e8 0 1px 3px;
-}
+  /**
+   * Enables the Propensity feature
+   */
+  PROPENSITY: 'propensity',
 
-.${Constants.GPAY_BUTTON_CLASS}.white.hover {
-  background-color: #f8f8f8;
-}
-`;
+  /**
+   * Enables the Smartbox feature.
+   */
+  SMARTBOX: 'smartbox',
 
-Constants.GPAY_BUTTON_WITH_OFFER_ICON_ADDITIONAL_STYLE = 'position: relative;';
+  /**
+   * Enables using new Activities APIs
+   */
+  HEJIRA: 'hejira',
+};
 
-Constants.GPAY_OFFER_ICON_CLASS = 'gpay-offer-icon';
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-Constants.GPAY_OFFER_ICON_SVG =
-    "<svg width=\"20px\" height=\"20px\" viewBox=\"0 0 20 20\" " +
-    "version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=" +
-    "\"http://www.w3.org/1999/xlink\" class=\"gpay-offer-icon\"><defs><path d=\"M19.41,9.58 L10.41,0.58 " +
-    "C10.05,0.22 9.55,0 9,0 L2,0 C0.9,0 0,0.9 0,2 L0,9 C0,9.55 0.22,10.05 " +
-    "0.59,10.42 L9.59,19.42 C9.95,19.78 10.45,20 11,20 C11.55,20 12.05,19.78 " +
-    "12.41,19.41 L19.41,12.41 C19.78,12.05 20,11.55 20,11 C20,10.45 19.77," +
-    "9.94 19.41,9.58 Z\" id=\"path-1\"></path></defs><g id=\"buttons_10.05\"" +
-    " stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">" +
-    "<g id=\"Artboard\" transform=\"translate(-40.000000, -43.000000)\">" +
-    "<g id=\"Group-3\" transform=\"translate(40.000000, 43.000000)\">" +
-    "<g id=\"Group-2-Copy-2\"><g id=\"Group-Copy\"><g id=\"ic_loyalty_24px\">" +
-    "<mask id=\"mask-2\" fill=\"white\"><use xlink:href=\"#path-1\"></use>" +
-    "</mask><use id=\"gpay-Shape\" fill=\"#FF6100\" fill-rule=\"nonzero\" " +
-    "xlink:href=\"#path-1\"></use><path d=\"M3.5,5 C2.67,5 2,4.33 2,3.5 C2," +
-    "2.67 2.67,2 3.5,2 C4.33,2 5,2.67 5,3.5 C5,4.33 4.33,5 3.5,5 Z\" " +
-    "id=\"Path\" fill=\"#FFFFFF\" fill-rule=\"nonzero\" mask=\"url(#mask-2)\">" +
-    "</path></g></g></g><g id=\"Group-13-Copy-7\" transform=\"translate" +
-    "(6.000000, 6.000000)\" fill=\"#FFFFFF\" fill-rule=\"nonzero\">" +
-    "<g id=\"Group-13-Copy-2\"><path d=\"M2.15217391,4.55172414 C0.963561082," +
-    "4.55172414 1.99840144e-14,3.53278598 1.99840144e-14,2.27586207 " +
-    "C1.99840144e-14,1.01893816 0.963561082,6.30606678e-14 2.15217391,6." +
-    "30606678e-14 C3.34078674,6.30606678e-14 4.30434783,1.01893816 4.30434783," +
-    "2.27586207 C4.30434783,3.53278598 3.34078674,4.55172414 2.15217391," +
-    "4.55172414 Z M2.15217391,3.31034483 C2.69245247,3.31034483 3.13043478,2." +
-    "84719112 3.13043478,2.27586207 C3.13043478,1.70453302 2.69245247," +
-    "1.24137931 2.15217391,1.24137931 C1.61189535,1.24137931 1.17391304,1" +
-    ".70453302 1.17391304,2.27586207 C1.17391304,2.84719112 1.61189535,3." +
-    "31034483 2.15217391,3.31034483 Z\" id=\"Combined-Shape\"></path>" +
-    "<path d=\"M6.84782609,9 C5.65921326,9 4.69565217,7.98106184 4.69565217," +
-    "6.72413793 C4.69565217,5.46721402 5.65921326,4.44827586 6.84782609," +
-    "4.44827586 C8.03643892,4.44827586 9,5.46721402 9,6.72413793 C9,7.98106184" +
-    " 8.03643892,9 6.84782609,9 Z M6.84782609,7.75862069 C7.38810465," +
-    "7.75862069 7.82608696,7.29546698 7.82608696,6.72413793 C7.82608696" +
-    ",6.15280888 7.38810465,5.68965517 6.84782609,5.68965517 C6.30754753," +
-    "5.68965517 5.86956522,6.15280888 5.86956522,6.72413793 C5.86956522," +
-    "7.29546698 6.30754753,7.75862069 6.84782609,7.75862069 Z\" " +
-    "id=\"Combined-Shape\"></path><polygon id=\"Rectangle\" " +
-    "transform=\"translate(4.497720, 4.541938) rotate(34.000000) " +
-    "translate(-4.497720, -4.541938) \" points=\"3.77901778 -0.202295978 " +
-    "4.9740273 -0.171019161 5.21642263 9.28617278 4.02141311 9.25489596\">" +
-    "</polygon></g></g></g></g></g></svg>";
+/** @private @const {!Array<string>} */
+const allowedMethods_ = ['GET', 'POST'];
 
-Constants.GPAY_OFFER_ICON_STYLE = `
-.${Constants.GPAY_OFFER_ICON_CLASS} {
-  position: absolute;
-  right: -5px;
-  top: -5px;
-}
+/** @private @enum {number} Allowed fetch responses. */
+const allowedFetchTypes_ = {
+  document: 1,
+  text: 2,
+};
 
-#ic_loyalty_24px use.hover {
-  fill: #FC853B;
-}
-`;
+/**
+ * A class that polyfills Fetch API.
+ */
+class Xhr {
+  /**
+   * @param {!Window} win
+   */
+  constructor(win) {
+    /** @const {!Window} */
+    this.win = win;
+  }
 
-Constants.GPAY_OFFER_DESCRIPTION_CLASS = 'gpay-offer-description';
+  /**
+   * We want to call `fetch_` unbound from any context since it could
+   * be either the native fetch or our polyfill.
+   *
+   * @param {string} input
+   * @param {!FetchInitDef} init
+   * @return {!Promise<!FetchResponse>|!Promise<!Response>}
+   * @private
+   */
+  fetch_(input, init) {
+    // TODO(avimehta): Should the requests go through when page is not visible?
+    log_2(typeof input == 'string', 'Only URL supported: %s', input);
+    // In particular, Firefox does not tolerate `null` values for
+    // `credentials`.
+    const creds = init.credentials;
+    log_2(
+      creds === undefined || creds == 'include' || creds == 'omit',
+      'Only credentials=include|omit support: %s',
+      creds
+    );
+    // Fallback to xhr polyfill since `fetch` api does not support
+    // responseType = 'document'. We do this so we don't have to do any parsing
+    // and document construction on the UI thread which would be expensive.
+    if (init.responseType == 'document') {
+      return fetchPolyfill(input, init);
+    }
+    return (this.win.fetch || fetchPolyfill).apply(null, arguments);
+  }
 
-Constants.GPAY_OFFER_DESCRIPTION_STYLE = `
-@import url(//fonts.googleapis.com/css?family=Google+Sans:500);
-.${Constants.GPAY_OFFER_DESCRIPTION_CLASS} {
-  text-align: center;
-  font: 10px 'Google Sans';
-  margin-top: 2px;
-  margin-bottom: 0px;
+  /**
+   * @param {string} input URL
+   * @param {?FetchInitDef} init Fetch options object.
+   * @return {!Promise<!FetchResponse>}
+   */
+  fetch(input, init) {
+    // TODO (avimehta): Figure out if CORS needs be handled the way AMP does it.
+    init = setupInit(init);
+    return this.fetch_(input, init)
+      .then(
+        response => response,
+        reason => {
+          const targetOrigin = parseUrl$1(input).origin;
+          throw new Error(
+            `XHR Failed fetching (${targetOrigin}/...):`,
+            reason && reason.message
+          );
+        }
+      )
+      .then(response => assertSuccess(response));
+  }
 }
 
-.${Constants.GPAY_OFFER_DESCRIPTION_CLASS}.gpay-btn-clicked {
-  color: #3C4043;
-}
+/**
+ * Normalized method name by uppercasing.
+ * @param {string|undefined} method
+ * @return {string}
+ * @private
+ */
+function normalizeMethod_(method) {
+  if (method === undefined) {
+    return 'GET';
+  }
+  method = method.toUpperCase();
 
-.${Constants.GPAY_OFFER_DESCRIPTION_CLASS}.short {
-  min-width: 90px;
-  width: 160px;
+  log_2(
+    allowedMethods_.includes(method),
+    'Only one of %s is currently allowed. Got %s',
+    allowedMethods_.join(', '),
+    method
+  );
+
+  return method;
 }
 
-.${Constants.GPAY_OFFER_DESCRIPTION_CLASS}.long {
-  min-width: 152px;
-  width: 240px;
+/**
+ * Sets up and normalizes the FetchInitDef
+ *
+ * @param {?FetchInitDef=} init Fetch options object.
+ * @param {string=} accept The HTTP Accept header value.
+ * @return {!FetchInitDef}
+ */
+function setupInit(init, accept) {
+  init = init || /** @type {FetchInitDef} */ ({});
+  init.method = normalizeMethod_(init.method);
+  init.headers = init.headers || {};
+  if (accept) {
+    init.headers['Accept'] = accept;
+  }
+  return init;
 }
-`;
 
 /**
- * Class used for the new gpay button with card info (last 4 digits, card net).
+ * A minimal polyfill of Fetch API. It only polyfills what we currently use.
  *
- * @const {string}
+ * See https://developer.mozilla.org/en-US/docs/Web/API/GlobalFetch/fetch
+ *
+ * Notice that the "fetch" method itself is not exported as that would require
+ * us to immediately support a much wide API.
+ *
+ * @param {string} input
+ * @param {!FetchInitDef} init
+ * @return {!Promise<!FetchResponse>}
+ * @private Visible for testing
  */
-Constants.GPAY_BUTTON_CARD_INFO_CLASS = 'gpay-card-info-btn';
+function fetchPolyfill(input, init) {
+  return new Promise(function(resolve, reject) {
+    const xhr = createXhrRequest(init.method || 'GET', input);
 
-Constants.GPAY_BUTTON_CARD_INFO_BUTTON_STYLE = `
-  .${Constants.GPAY_BUTTON_CARD_INFO_CLASS} {
-    background-origin: content-box;
-    background-position: center center;
-    background-repeat: no-repeat;
-    background-size: contain;
-    border: 0px;
-    border-radius: 4px;
-    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 1px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
-    cursor: pointer;
-    height: 40px;
-    min-height: 40px;
-    padding: 11px 24px;
-    background-color: #000;
-    box-shadow: none;
-    padding: 9px 24px 10px;
-    min-width: 190px;
-    width: 240px;
-  }
+    if (init.credentials == 'include') {
+      xhr.withCredentials = true;
+    }
+
+    if (init.responseType in allowedFetchTypes_) {
+      xhr.responseType = init.responseType;
+    }
+
+    if (init.headers) {
+      Object.keys(init.headers).forEach(function(header) {
+        xhr.setRequestHeader(header, init.headers[header]);
+      });
+    }
+
+    xhr.onreadystatechange = () => {
+      if (xhr.readyState < /* STATUS_RECEIVED */ 2) {
+        return;
+      }
+      if (xhr.status < 100 || xhr.status > 599) {
+        xhr.onreadystatechange = null;
+        reject(new Error(`Unknown HTTP status ${xhr.status}`));
+        return;
+      }
+
+      // TODO(dvoytenko): This is currently simplified: we will wait for the
+      // whole document loading to complete. This is fine for the use cases
+      // we have now, but may need to be reimplemented later.
+      if (xhr.readyState == /* COMPLETE */ 4) {
+        resolve(new FetchResponse(xhr));
+      }
+    };
+    xhr.onerror = () => {
+      reject(new Error('Network failure'));
+    };
+    xhr.onabort = () => {
+      reject(new Error('Request aborted'));
+    };
 
-  .${Constants.GPAY_BUTTON_CARD_INFO_CLASS}.active {
-    background-color: #5f6368;
-  }
+    if (init.method == 'POST') {
+      xhr.send(init.body);
+    } else {
+      xhr.send();
+    }
+  });
+}
 
-  .${Constants.GPAY_BUTTON_CARD_INFO_CLASS}.hover {
-    background-color: #3c4043;
+/**
+ * @param {string} method
+ * @param {string} url
+ * @return {!XMLHttpRequest}
+ * @private
+ */
+function createXhrRequest(method, url) {
+  const xhr = new XMLHttpRequest();
+  if ('withCredentials' in xhr) {
+    xhr.open(method, url, true);
+  } else {
+    throw new Error('CORS is not supported');
   }
-  `;
-
+  return xhr;
+}
 
 /**
- * Trusted domain for secure context validation
- *
- * @const {string}
+ * If 415 or in the 5xx range.
+ * @param {number} status
  */
-Constants.TRUSTED_DOMAIN = '.google.com';
+function isRetriable(status) {
+  return status == 415 || (status >= 500 && status < 600);
+}
 
 /**
- * @license
- * Copyright 2018 Google Inc. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * Returns the response if successful or otherwise throws an error.
+ * @param {!FetchResponse} response
+ * @return {!Promise<!FetchResponse>}
+ * @private Visible for testing
  */
+function assertSuccess(response) {
+  return new Promise(resolve => {
+    if (response.ok) {
+      return resolve(response);
+    }
+
+    const {status} = response;
+    const err = new Error(`HTTP error ${status}`);
+    err.retriable = isRetriable(status);
+    // TODO(@jridgewell, #9448): Callers who need the response should
+    // skip processing.
+    err.response = response;
+    throw err;
+  });
+}
 
 /**
- * An implementation of PaymentsClientDelegateInterface that leverages payment
- * request.
- * @implements {PaymentsClientDelegateInterface}
+ * Response object in the Fetch API.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/API/GlobalFetch/fetch
  */
-class PaymentsRequestDelegate {
+class FetchResponse {
   /**
-   * @param {string} environment
+   * @param {!XMLHttpRequest} xhr
    */
-  constructor(environment) {
-    this.environment_ = environment;
+  constructor(xhr) {
+    /** @private @const {!XMLHttpRequest} */
+    this.xhr_ = xhr;
 
-    /** @private {?function(!Promise<!PaymentData>)} */
-    this.callback_ = null;
-  }
+    /** @const {number} */
+    this.status = this.xhr_.status;
 
-  /** @override */
-  onResult(callback) {
-    this.callback_ = callback;
-  }
+    /** @const {boolean} */
+    this.ok = this.status >= 200 && this.status < 300;
 
-  /** @override */
-  isReadyToPay(isReadyToPayRequest) {
-    /** @type{!PaymentRequest} */
-    const paymentRequest = this.createPaymentRequest_(isReadyToPayRequest);
-    return new Promise((resolve, reject) => {
-      paymentRequest.canMakePayment()
-          .then(result => {
-            window.sessionStorage.setItem(
-                Constants.IS_READY_TO_PAY_RESULT_KEY, result.toString());
-            const response = {'result': result};
-            if (isReadyToPayRequest.apiVersion >= 2 &&
-                isReadyToPayRequest.existingPaymentMethodRequired) {
-              // For apiVersion 2, we always use native to only check for
-              // tokenized cards.
-              // For tokenized cards native always does a presence check so
-              // we can say that if canMakePayment is true for native for
-              // tokenizedCards then the user has a payment method which is
-              // present.
-              response['paymentMethodPresent'] = result;
-            }
-            resolve(response);
-          })
-          .catch(function(err) {
-            if (window.sessionStorage.getItem(
-                    Constants.IS_READY_TO_PAY_RESULT_KEY)) {
-              resolve({
-                'result': window.sessionStorage.getItem(
-                              Constants.IS_READY_TO_PAY_RESULT_KEY) == 'true'
-              });
-            } else {
-              resolve({'result': false});
-            }
-          });
-    });
-  }
+    /** @const {!FetchResponseHeaders} */
+    this.headers = new FetchResponseHeaders(xhr);
 
-  /** @override */
-  prefetchPaymentData(paymentDataRequest) {
-    // Creating PaymentRequest instance will call
-    // Gcore isReadyToPay internally which will prefetch tempaltes.
-    this.createPaymentRequest_(
-        paymentDataRequest, this.environment_,
-        paymentDataRequest.transactionInfo.currencyCode,
-        paymentDataRequest.transactionInfo.totalPrice);
+    /** @type {boolean} */
+    this.bodyUsed = false;
+
+    /** @type {?ReadableStream} */
+    this.body = null;
   }
 
-  /** @override */
-  loadPaymentData(paymentDataRequest) {
-    this.loadPaymentDataThroughPaymentRequest_(paymentDataRequest);
+  /**
+   * Create a copy of the response and return it.
+   * @return {!FetchResponse}
+   */
+  clone() {
+    log_2(!this.bodyUsed, 'Body already used');
+    return new FetchResponse(this.xhr_);
   }
 
   /**
-   * Create PaymentRequest instance.
-   *
-   * @param {!IsReadyToPayRequest|!PaymentDataRequest} request The necessary information to check if user is
-   *     ready to pay or to support a payment from merchants.
-   * @param {?string=} environment (optional)
-   * @param {?string=} currencyCode (optional)
-   * @param {?string=} totalPrice (optional)
-   * @return {!PaymentRequest} PaymentRequest instance.
+   * Drains the response and returns the text.
+   * @return {!Promise<string>}
    * @private
    */
-  createPaymentRequest_(request, environment, currencyCode, totalPrice) {
-    let data = {};
-    if (request) {
-      data = JSON.parse(JSON.stringify(request));
-    }
+  drainText_() {
+    log_2(!this.bodyUsed, 'Body already used');
+    this.bodyUsed = true;
+    return Promise.resolve(this.xhr_.responseText);
+  }
 
-    // Only set the apiVersion if the merchant doesn't set it.
-    if (!data['apiVersion']) {
-      data['apiVersion'] = 1;
-    }
+  /**
+   * Drains the response and returns a promise that resolves with the response
+   * text.
+   * @return {!Promise<string>}
+   */
+  text() {
+    return this.drainText_();
+  }
 
-    // Add allowedPaymentMethods for swg to get through gms core validation.
-    if (data['swg']) {
-      data['allowedPaymentMethods'] = [Constants.PaymentMethod.CARD];
-    }
+  /**
+   * Drains the response and returns the JSON object.
+   * @return {!Promise<!JsonObject>}
+   */
+  json() {
+    return /** @type {!Promise<!JsonObject>} */ (this.drainText_().then(
+      parseJson
+    ));
+  }
 
-    if (environment && environment == Constants.Environment.TEST) {
-      data['environment'] = environment;
-    }
+  /**
+   * Reads the xhr responseXML.
+   * @return {!Promise<!Document>}
+   * @private
+   */
+  document_() {
+    log_2(!this.bodyUsed, 'Body already used');
+    this.bodyUsed = true;
+    log_2(
+      this.xhr_.responseXML,
+      'responseXML should exist. Make sure to return ' +
+        'Content-Type: text/html header.'
+    );
+    return /** @type {!Promise<!Document>} */ (Promise.resolve(
+      log_2(this.xhr_.responseXML)
+    ));
+  }
 
-    const supportedInstruments = [{
-      'supportedMethods': ['https://google.com/pay'],
-      'data': data,
-    }];
+  /**
+   * Drains the response and returns a promise that resolves with the response
+   * ArrayBuffer.
+   * @return {!Promise<!ArrayBuffer>}
+   */
+  arrayBuffer() {
+    return /** @type {!Promise<!ArrayBuffer>} */ (this.drainText_().then(
+      utf8EncodeSync
+    ));
+  }
+}
 
-    const details = {
-      'total': {
-        'label': 'Estimated Total Price',
-        'amount': {
-          // currency and value are required fields in PaymentRequest, but these
-          // fields will never be used since PaymentRequest UI is skipped when
-          // we're the only payment method, so default to some value to by pass
-          // this requirement.
-          'currency': currencyCode || 'USD',
-          'value': totalPrice || '0',
-        }
-      }
-    };
+/**
+ * Provides access to the response headers as defined in the Fetch API.
+ * @private Visible for testing.
+ */
+class FetchResponseHeaders {
+  /**
+   * @param {!XMLHttpRequest} xhr
+   */
+  constructor(xhr) {
+    /** @private @const {!XMLHttpRequest} */
+    this.xhr_ = xhr;
+  }
 
-    return new PaymentRequest(supportedInstruments, details);
+  /**
+   * @param {string} name
+   * @return {string}
+   */
+  get(name) {
+    return this.xhr_.getResponseHeader(name);
   }
 
   /**
-   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
-   *     information to support a payment.
-   * @private
+   * @param {string} name
+   * @return {boolean}
    */
-  loadPaymentDataThroughPaymentRequest_(paymentDataRequest) {
-    const currencyCode = (paymentDataRequest.transactionInfo &&
-                          paymentDataRequest.transactionInfo.currencyCode) ||
-        undefined;
-    const totalPrice = (paymentDataRequest.transactionInfo &&
-                        paymentDataRequest.transactionInfo.totalPrice) ||
-        undefined;
-    const paymentRequest = this.createPaymentRequest_(
-        paymentDataRequest, this.environment_, currencyCode, totalPrice);
-    this.callback_(
-        /** @type{!Promise<!PaymentData>} */
-        (paymentRequest.show()
-             .then(
-                 /**
-                  * @param {!PaymentResponse} paymentResponse
-                  * @return {!PaymentData}
-                  */
-                 (paymentResponse) => {
-                   // Should be called to dismiss any remaining UI
-                   paymentResponse.complete('success');
-                   return paymentResponse.details;
-                 })
-             .catch(function(err) {
-               err['statusCode'] = Constants.ResponseStatus.CANCELED;
-               throw err;
-             })));
+  has(name) {
+    return this.xhr_.getResponseHeader(name) != null;
   }
 }
 
 /**
- * @license
- * Copyright 2018 Google Inc. All Rights Reserved.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -10593,130 +10829,54 @@ class PaymentsRequestDelegate {
  * limitations under the License.
  */
 
-const MAX_Z_INDEX$1 = 2147483647;
-
-
-class Graypane$1 {
-
-  /**
-   * @param {!Document} doc
-   */
-  constructor(doc) {
-    /** @private @const {!Document} */
-    this.doc_ = doc;
-
-    /** @private @const {!Element} */
-    this.element_ = doc.createElement(Constants.GPAY_GRAYPANE);
-    setImportantStyles$1(this.element_, {
-      'z-index': MAX_Z_INDEX$1,
-      'display': 'none',
-      'position': 'fixed',
-      'top': 0,
-      'right': 0,
-      'bottom': 0,
-      'left': 0,
-      'background-color': 'rgba(32, 33, 36, .6)',
-    });
-
-    /** @private {?Window} */
-    this.popupWindow_ = null;
-
-    this.element_.addEventListener('click', () => {
-      if (this.popupWindow_) {
-        try {
-          this.popupWindow_.focus();
-        } catch (e) {
-          // Ignore error.
-        }
-      }
-    });
-  }
-
+/**
+ * @interface
+ */
+class Fetcher {
   /**
-   * Shows the graypane.
-   * @param {?Window|undefined} popupWindow
-   * @return {!Promise}
+   * @param {string} unusedUrl
+   * @return {!Promise<!Object>}
    */
-  show(popupWindow) {
-    this.popupWindow_ = popupWindow || null;
-    this.doc_.body.appendChild(this.element_);
-    setImportantStyles$1(this.element_, {
-      'display': 'block',
-      'opacity': 0,
-    });
-    return transition$1(this.element_, {
-      'opacity': 1,
-    }, 300, 'ease-out');
-  }
+  fetchCredentialedJson(unusedUrl) {}
 
   /**
-   * Hides the graypane.
-   * @return {!Promise|undefined}
+   * @param {string} unusedUrl
+   * @param {!../utils/xhr.FetchInitDef} unusedInit
+   * @return {!Promise<!../utils/xhr.FetchResponse>}
    */
-  hide() {
-    this.popupWindow_ = null;
-    if (!this.element_.parentElement) {
-      // Has already been removed or haven't been even added to DOM.
-      // This could be possible after redirect.
-      return;
-    }
-    return transition$1(this.element_, {
-      'opacity': 0,
-    }, 300, 'ease-out').then(() => {
-      setImportantStyles$1(this.element_, {'display': 'none'});
-      this.doc_.body.removeChild(this.element_);
-    });
-  }
+  fetch(unusedUrl, unusedInit) {}
 }
 
-
 /**
- * Sets the CSS styles of the specified element with !important. The styles
- * are specified as a map from CSS property names to their values.
- *
- * The `!important` styles are used to avoid accidental specificity overrides
- * from the 3p page's stylesheet.
- *
- * @param {!Element} element
- * @param {!Object<string, string|number>} styles
+ * @implements {Fetcher}
  */
-function setImportantStyles$1(element, styles) {
-  for (const k in styles) {
-    element.style.setProperty(k, styles[k].toString(), 'important');
+class XhrFetcher {
+  /**
+   * @param {!Window} win
+   */
+  constructor(win) {
+    /** @const {!Xhr} */
+    this.xhr_ = new Xhr(win);
   }
-}
 
-
-/**
- * Returns a promise which is resolved after the given duration of animation
- * @param {!Element} el - Element to be observed.
- * @param {!Object<string, string|number>} props - properties to be animated.
- * @param {number} durationMillis - duration of animation.
- * @param {string} curve - transition function for the animation.
- * @return {!Promise} Promise which resolves once the animation is done playing.
- */
-function transition$1(el, props, durationMillis, curve) {
-  const win = el.ownerDocument.defaultView;
-  const previousTransitionValue = el.style.transition || '';
-  return new Promise(resolve => {
-    win.setTimeout(() => {
-      win.setTimeout(resolve, durationMillis);
-      const tr = `${durationMillis}ms ${curve}`;
-      setImportantStyles$1(el, Object.assign({
-        'transition': `transform ${tr}, opacity ${tr}`,
-      }, props));
+  /** @override */
+  fetchCredentialedJson(url) {
+    const init = /** @type {!../utils/xhr.FetchInitDef} */ ({
+      method: 'GET',
+      headers: {'Accept': 'text/plain, application/json'},
+      credentials: 'include',
     });
-  }).then(() => {
-    // Stop transition and make sure that the final properties get set.
-    setImportantStyles$1(el, Object.assign({
-      'transition': previousTransitionValue,
-    }, props));
-  });
+    return this.xhr_.fetch(url, init).then(response => response.json());
+  }
+
+  /** @override */
+  fetch(url, init) {
+    return this.xhr_.fetch(url, init);
+  }
 }
 
 /**
- * @license
- * Copyright 2018 Google Inc. All Rights Reserved.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -10732,30 +10892,98 @@ function transition$1(el, props, durationMillis, curve) {
  */
 
 /**
- * Service wrapping window.parent.postMessage. This enables
- * window.postMessage to be swapped out in unit tests.
  */
-class PostMessageService {
-  constructor(window) {
-    /** @private @const {!Window} */
-    this.window_ = window;
+class JsError {
+  /**
+   * @param {!../model/doc.Doc} doc
+   */
+  constructor(doc) {
+    /** @private @const {!../model/doc.Doc} */
+    this.doc_ = doc;
+
+    /** @private @const {!Promise} */
+    this.microTask_ = Promise.resolve();
+  }
+
+  /**
+   * @param {...*} var_args
+   * @return {!Promise}
+   */
+  error(var_args) {
+    const args = Array.prototype.slice.call(arguments, 0);
+    return this.microTask_.then(() => {
+      const error = createErrorVargs.apply(null, args);
+      if (error.reported) {
+        return;
+      }
+      const img = this.doc_.getWin().document.createElement('img');
+      img.src =
+        'https://news.google.com/_/SubscribewithgoogleClientUi/jserror' +
+        '?error=' +
+        encodeURIComponent(String(error)) +
+        '&script=' +
+        encodeURIComponent('https://news.google.com/swg/js/v1/swg.js') +
+        '&line=' +
+        (error.lineNumber || 1) +
+        '&trace=' +
+        encodeURIComponent(error.stack);
+      // Appending this image to DOM is not necessary.
+      error.reported = true;
+    });
+  }
+}
+
+/**
+ * @param {...*} var_args
+ * @return {!Error}
+ */
+function createErrorVargs(var_args) {
+  let error = null;
+  let message = '';
+  for (let i = 0; i < arguments.length; i++) {
+    const arg = arguments[i];
+    if (arg instanceof Error && !error) {
+      error = duplicateErrorIfNecessary(arg);
+    } else {
+      if (message) {
+        message += ' ';
+      }
+      message += arg;
+    }
+  }
+
+  if (!error) {
+    error = new Error(message);
+  } else if (message) {
+    error.message = message + ': ' + error.message;
+  }
+  return error;
+}
+
+/**
+ * Some exceptions (DOMException, namely) have read-only message.
+ * @param {!Error} error
+ * @return {!Error}
+ */
+function duplicateErrorIfNecessary(error) {
+  const messageProperty = Object.getOwnPropertyDescriptor(error, 'message');
+  if (messageProperty && messageProperty.writable) {
+    return error;
   }
 
-  /**
-   * Passthrough to Window#postMessage. See Window#postMessage DOM API
-   * documentation for more information about arguments.
-   *
-   * @param {!Object} message
-   * @param {string} targetOrigin
-   */
-  postMessage(message, targetOrigin) {
-    this.window_.postMessage(message, targetOrigin);
+  const {message, stack} = error;
+  const e = new Error(message);
+  // Copy all the extraneous things we attach.
+  for (const prop in error) {
+    e[prop] = error[prop];
   }
+  // Ensure these are copied.
+  e.stack = stack;
+  return e;
 }
 
 /**
- * @license
- * Copyright 2018 Google Inc. All Rights Reserved.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -10770,340 +10998,389 @@ class PostMessageService {
  * limitations under the License.
  */
 
-/**
- * Supported interactions between iframe and merchant page.
- *
- * @enum {number}
- */
-// Next Id: 10
-const PostMessageEventType = {
-  IS_READY_TO_PAY: 6,
-  LOG_BUTTON_CLICK: 5,
-  LOG_IS_READY_TO_PAY_API: 0,
-  LOG_LOAD_PAYMENT_DATA_API: 1,
-  LOG_RENDER_BUTTON: 2,
-  LOG_INITIALIZE_PAYMENTS_CLIENT: 9,
-  LOG_PAY_FRAME_REQUESTED: 15,
-  LOG_PAY_FRAME_LOADED: 16,
-  LOG_PAY_FRAME_LOADED_WITH_ALL_JS: 17,
-  LOG_INLINE_PAYMENT_WIDGET_INITIALIZE: 4,
-  LOG_INLINE_PAYMENT_WIDGET_SUBMIT: 3,
-  LOG_INLINE_PAYMENT_WIDGET_DISPLAYED: 7,
-  LOG_INLINE_PAYMENT_WIDGET_HIDDEN: 8,
-};
-
-/**
- * Types of buy flow activity modes.
- *
- * @enum {number}
- */
-const BuyFlowActivityMode = {
-  UNKNOWN_MODE: 0,
-  IFRAME: 1,
-  POPUP: 2,
-  REDIRECT: 3,
-  ANDROID_NATIVE: 4,
-  PAYMENT_HANDLER: 5,
-};
-
-/**
- * Types of buy flow activity modes.
- *
- * @enum {number}
- */
-const PublicErrorCode = {
-  UNKNOWN_ERROR_TYPE: 0,
-  INTERNAL_ERROR: 1,
-  DEVELOPER_ERROR: 2,
-  BUYER_ACCOUNT_ERROR: 3,
-  MERCHANT_ACCOUNT_ERROR: 4,
-  UNSUPPORTED_API_VERSION: 5,
-  BUYER_CANCEL: 6,
-};
-
-/**
- * The presentation mode of the buy flow
- *
- * @enum {number}
- */
-const BuyFlowMode = {
-  PAY_WITH_GOOGLE: 5,
-  SUBSCRIBE_WITH_GOOGLE: 6,
-};
+const LINK_REQUEST_ID = 'swg-link';
 
 /**
- * Iframe used for logging and prefetching.
- *
- * @type {?Element}
+ * The flow to link an existing publisher account to an existing google account.
  */
-let iframe = null;
-
-/** @type {?PostMessageService} */
-let postMessageService = null;
-
-/** @type {?string} */
-let environment = null;
-
-/** @type {?string} */
-let googleTransactionId = null;
-
-/** @type {number} */
-let originTimeMs = Date.now();
-
-/** @type {?BuyFlowActivityMode} */
-let buyFlowActivityMode = null;
+class LinkbackFlow {
+  /**
+   * @param {!./deps.DepsDef} deps
+   */
+  constructor(deps) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
 
-/** @type {boolean} */
-let iframeLoaded = false;
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
 
-/** @type {!Array<!Object>} */
-let buffer = [];
+    /** @private @const {!../model/page-config.PageConfig} */
+    this.pageConfig_ = deps.pageConfig();
 
-class PayFrameHelper {
-  /**
-   * Creates a hidden iframe for logging and appends it to the top level
-   * document.
-   */
-  static load() {
-    if (iframe) {
-      return;
-    }
-    const initOptions =
-        /** @type {!PaymentOptions} */ (window['gpayInitParams']) || {};
-    environment = initOptions.environment || Constants.Environment.PRODUCTION;
-    iframe = document.createElement('iframe');
-    // Pass in origin because document.referrer inside iframe is empty in
-    // certain cases
-    // Can be replaced by iframe.src=... in non Google context.
-    iframe.src = PayFrameHelper.getIframeUrl_(
-            window.location.origin,
-            initOptions.merchantInfo && initOptions.merchantInfo.merchantId);
-    PayFrameHelper.postMessage({
-      'eventType': PostMessageEventType.LOG_PAY_FRAME_REQUESTED,
-      'clientLatencyStartMs': Date.now(),
-    });
-    iframe.height = '0';
-    iframe.width = '0';
-    iframe.style.display = 'none';
-    iframe.style.visibility = 'hidden';
-    iframe.onload = function() {
-      PayFrameHelper.postMessage({
-        'eventType': PostMessageEventType.LOG_PAY_FRAME_LOADED_WITH_ALL_JS,
-        'clientLatencyStartMs': Date.now(),
-      });
-      PayFrameHelper.iframeLoaded();
-    };
-    // If the body is already loaded, just append the iframe. Otherwise, we wait
-    // until the DOM has loaded to append the iframe, otherwise document.body is
-    // null.
-    if (document.body) {
-      PayFrameHelper.initialize_();
-    } else {
-      document.addEventListener(
-          'DOMContentLoaded', () => PayFrameHelper.initialize_());
-    }
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
   }
 
   /**
-   * Appends the iframe to the DOM and updates the post message service.
-   * @private
+   * Starts the Link account flow.
+   * @param {{ampReaderId: (string|undefined)}=} params
+   * @return {!Promise}
    */
-  static initialize_() {
-    document.body.appendChild(iframe);
-    postMessageService = new PostMessageService(iframe.contentWindow);
+  start(params = {}) {
+    this.deps_.callbacks().triggerFlowStarted(SubscriptionFlows.LINK_ACCOUNT);
+    const forceRedirect =
+      this.deps_.config().windowOpenMode == WindowOpenMode.REDIRECT;
+    const args = params.ampReaderId
+      ? feArgs({
+          'publicationId': this.pageConfig_.getPublicationId(),
+          'ampReaderId': params.ampReaderId,
+        })
+      : feArgs({
+          'publicationId': this.pageConfig_.getPublicationId(),
+        });
+    const opener = this.activityPorts_.open(
+      LINK_REQUEST_ID,
+      feUrl('/linkbackstart'),
+      forceRedirect ? '_top' : '_blank',
+      args,
+      {}
+    );
+    this.deps_.eventManager().logSwgEvent(AnalyticsEvent.IMPRESSION_LINK);
+    this.dialogManager_.popupOpened(opener && opener.targetWin);
+    return Promise.resolve();
   }
+}
 
+/**
+ * The class for Link accounts flow.
+ */
+class LinkCompleteFlow {
   /**
-   * Sends a message to the iframe and wait for a response.
-   * Uses the responseHandler specified only if the responseType is a match.
-   *
-   * @param {!Object} data
-   * @param {!PostMessageEventType} eventType
-   * @param {string} responseType
-   * @param {function(!Event)} responseHandler
+   * @param {!./deps.DepsDef} deps
    */
-  static sendAndWaitForResponse(
-      data, eventType, responseType, responseHandler) {
-    function callback(event) {
-      if (event.data[responseType]) {
-        responseHandler(event);
-        // We only want to process the response from the payframe once.
-        // so stop listening to the event once processed.
-        PayFrameHelper.removeMessageEventListener_(callback);
-      }
+  static configurePending(deps) {
+    /**
+     * Handler function.
+     * @param {!../components/activities.ActivityPortDef} port
+     */
+    function handler(port) {
+      deps.entitlementsManager().blockNextNotification();
+      deps.callbacks().triggerLinkProgress();
+      deps.dialogManager().popupClosed();
+      const promise = acceptPortResultData(
+        port,
+        feOrigin(),
+        /* requireOriginVerified */ false,
+        /* requireSecureChannel */ false
+      );
+      return promise.then(
+        response => {
+          deps
+            .eventManager()
+            .logSwgEvent(AnalyticsEvent.ACTION_LINK_CONTINUE, true);
+          const flow = new LinkCompleteFlow(deps, response);
+          flow.start();
+        },
+        reason => {
+          if (isCancelError(reason)) {
+            deps
+              .eventManager()
+              .logSwgEvent(AnalyticsEvent.ACTION_LINK_CANCEL, true);
+            deps
+              .callbacks()
+              .triggerFlowCanceled(SubscriptionFlows.LINK_ACCOUNT);
+          } else {
+            // The user chose to continue but there was an error.
+            deps
+              .eventManager()
+              .logSwgEvent(AnalyticsEvent.ACTION_LINK_CONTINUE, true);
+          }
+        }
+      );
     }
-
-    PayFrameHelper.addMessageEventListener_(callback);
-
-    const postMessageData = Object.assign({'eventType': eventType}, data);
-    PayFrameHelper.postMessage(postMessageData);
+    deps.activities().onResult(LINK_REQUEST_ID, handler);
   }
 
   /**
-   * Add an event listener for listening to messages received.
-   *
-   * @param {function(!Event)} callback
-   * @private
+   * @param {!./deps.DepsDef} deps
+   * @param {?Object} response
    */
-  static addMessageEventListener_(callback) {
-    window.addEventListener('message', callback);
+  constructor(deps, response) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
+
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
+
+    /** @private @const {!./entitlements-manager.EntitlementsManager} */
+    this.entitlementsManager_ = deps.entitlementsManager();
+
+    /** @private @const {!./callbacks.Callbacks} */
+    this.callbacks_ = deps.callbacks();
+
+    const index = (response && response['index']) || '0';
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/linkconfirmiframe', '/u/' + index),
+      feArgs({
+        'productId': deps.pageConfig().getProductId(),
+        'publicationId': deps.pageConfig().getPublicationId(),
+      }),
+      /* shouldFadeBody */ true
+    );
+
+    /** @private {?function()} */
+    this.completeResolver_ = null;
+
+    /** @private @const {!Promise} */
+    this.completePromise_ = new Promise(resolve => {
+      this.completeResolver_ = resolve;
+    });
   }
 
   /**
-   * Remove the event listener for listening to messages.
-   *
-   * @param {function(!Event)} callback
-   * @private
+   * Starts the Link account flow.
+   * @return {!Promise}
    */
-  static removeMessageEventListener_(callback) {
-    window.removeEventListener('message', callback);
+  start() {
+    const promise = this.activityIframeView_.acceptResultAndVerify(
+      feOrigin(),
+      /* requireOriginVerified */ true,
+      /* requireSecureChannel */ true
+    );
+    promise
+      .then(response => {
+        this.complete_(response);
+      })
+      .catch(reason => {
+        // Rethrow async.
+        setTimeout(() => {
+          throw reason;
+        });
+      })
+      .then(() => {
+        // The flow is complete.
+        this.dialogManager_.completeView(this.activityIframeView_);
+      });
+    this.deps_
+      .eventManager()
+      .logSwgEvent(AnalyticsEvent.EVENT_GOOGLE_UPDATED, true);
+    this.deps_
+      .eventManager()
+      .logSwgEvent(AnalyticsEvent.IMPRESSION_GOOGLE_UPDATED, true);
+    return this.dialogManager_.openView(this.activityIframeView_);
   }
 
   /**
-   * Posts a message to the iframe with the given data.
-   *
-   * @param {!Object} data
+   * @param {?Object} response
+   * @private
    */
-  static postMessage(data) {
-    if (!iframeLoaded) {
-      buffer.push(data);
-      return;
+  complete_(response) {
+    this.deps_
+      .eventManager()
+      .logSwgEvent(AnalyticsEvent.ACTION_GOOGLE_UPDATED_CLOSE, true);
+    this.callbacks_.triggerLinkComplete();
+    this.callbacks_.resetLinkProgress();
+    this.entitlementsManager_.setToastShown(true);
+    this.entitlementsManager_.unblockNextNotification();
+    this.entitlementsManager_.reset((response && response['success']) || false);
+    if (response && response['entitlements']) {
+      this.entitlementsManager_.pushNextEntitlements(response['entitlements']);
     }
-    const postMessageData = Object.assign(
-        {
-          'buyFlowActivityMode': buyFlowActivityMode,
-          'googleTransactionId': googleTransactionId,
-          'originTimeMs': originTimeMs,
-        },
-        data);
-    postMessageService.postMessage(
-        postMessageData, PayFrameHelper.getIframeOrigin_());
+    this.completeResolver_();
   }
 
-  /**
-   * Sets the activity mode.
-   *
-   * @param {!BuyFlowActivityMode} mode
-   */
-  static setBuyFlowActivityMode(mode) {
-    buyFlowActivityMode = mode;
+  /** @return {!Promise} */
+  whenComplete() {
+    return this.completePromise_;
   }
+}
 
+/**
+ * The flow to save subscription information from an existing publisher account
+ * to an existing google account.  The accounts may or may not already be
+ * linked.
+ */
+class LinkSaveFlow {
   /**
-   * Sets the google transaction id.
-   *
-   * @param {string} txnId
+   * @param {!./deps.DepsDef} deps
+   * @param {!../api/subscriptions.SaveSubscriptionRequestCallback} callback
    */
-  static setGoogleTransactionId(txnId) {
-    googleTransactionId = txnId;
-  }
+  constructor(deps, callback) {
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
 
-  /**
-   * Sets the originTimeMs. To be used only for tests.
-   *
-   * @param {number} originTimeMsTemp
-   */
-  static setOriginTimeMs(originTimeMsTemp) {
-    originTimeMs = originTimeMsTemp;
-  }
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
 
-  /**
-   * Override postMessageService for testing.
-   *
-   * @param {!PostMessageService} messageService
-   */
-  static setPostMessageService(messageService) {
-    postMessageService = messageService;
-  }
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
 
-  /**
-   * Clears the singleton variables.
-   */
-  static reset() {
-    iframe = null;
-    buffer.length = 0;
-    iframeLoaded = false;
-    buyFlowActivityMode = null;
-  }
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
 
-  /**
-   * Sets whether the iframe has been loaded or not.
-   *
-   * @param {boolean} loaded
-   */
-  static setIframeLoaded(loaded) {
-    iframeLoaded = loaded;
+    /** @private {!../api/subscriptions.SaveSubscriptionRequestCallback} */
+    this.callback_ = callback;
+
+    /** @private {?Promise<!../api/subscriptions.SaveSubscriptionRequest>} */
+    this.requestPromise_ = null;
+
+    /** @private {?Promise} */
+    this.openPromise_ = null;
+
+    /** @private {?ActivityIframeView} */
+    this.activityIframeView_ = null;
   }
 
   /**
-   * Called whenever the iframe is loaded.
+   * @return {?Promise<!../api/subscriptions.SaveSubscriptionRequest>}
+   * @package Visible for testing.
    */
-  static iframeLoaded() {
-    iframeLoaded = true;
-    buffer.forEach(function(data) {
-      PayFrameHelper.postMessage(data);
-    });
-    buffer.length = 0;
+  getRequestPromise() {
+    return this.requestPromise_;
   }
 
   /**
-   * Returns the events that have been buffered.
-   *
-   * @return {!Array<!Object>}
+   * @private
    */
-  static getBuffer() {
-    return buffer;
+  complete_() {
+    this.dialogManager_.completeView(this.activityIframeView_);
   }
 
   /**
-   * Mocks the iframe as an arbitrary html element instead of actually injecting
-   * it for testing.
+   * @param {!Object} result
+   * @return {!Promise<boolean>}
+   * @private
    */
-  static injectIframeForTesting() {
-    PayFrameHelper.reset();
-    iframe = document.createElement('p');
-    PayFrameHelper.iframeLoaded();
+  handleLinkSaveResponse_(result) {
+    // This flow is complete
+    this.complete_();
+    let startPromise;
+    let linkConfirm = null;
+    if (result['linked']) {
+      // When linking succeeds, start link confirmation flow
+      this.dialogManager_.popupClosed();
+      this.deps_.callbacks().triggerFlowStarted(SubscriptionFlows.LINK_ACCOUNT);
+      linkConfirm = new LinkCompleteFlow(this.deps_, result);
+      startPromise = linkConfirm.start();
+    } else {
+      startPromise = Promise.reject(createCancelError(this.win_, 'not linked'));
+    }
+    const completePromise = startPromise.then(() => {
+      this.deps_.callbacks().triggerLinkProgress();
+      return linkConfirm.whenComplete();
+    });
+
+    return completePromise.then(() => {
+      return true;
+    });
   }
 
   /**
-   * Returns the payframe origin based on the environment.
-   *
-   * @return {string}
+   * @param {LinkingInfoResponse} response
    * @private
    */
-  static getIframeOrigin_() {
-    let iframeUrl = 'https://pay';
-    if (environment == Constants.Environment.SANDBOX) {
-      iframeUrl += '.sandbox';
-    } else if (environment == Constants.Environment.PREPROD) {
-      iframeUrl += '-preprod.sandbox';
+  sendLinkSaveToken_(response) {
+    if (!response || !response.getRequested()) {
+      return;
     }
-    return iframeUrl + '.google.com';
+    this.requestPromise_ = new Promise(resolve => {
+      resolve(this.callback_());
+    })
+      .then(request => {
+        const saveRequest = new LinkSaveTokenRequest();
+        if (request && request.token) {
+          if (request.authCode) {
+            throw new Error('Both authCode and token are available');
+          } else {
+            saveRequest.setToken(request.token);
+          }
+        } else if (request && request.authCode) {
+          saveRequest.setAuthCode(request.authCode);
+        } else {
+          throw new Error('Neither token or authCode is available');
+        }
+        this.activityIframeView_.execute(saveRequest);
+      })
+      .catch(reason => {
+        // The flow is complete.
+        this.complete_();
+        throw reason;
+      });
   }
 
   /**
-   * Returns the payframe URL based on the environment.
-   *
-   * @param {string} origin The origin that is opening the payframe.
-   * @param {string|null=} merchantId The merchant id.
-   * @return {string}
-   * @private
+   * @return {?Promise}
    */
-  static getIframeUrl_(origin, merchantId) {
-    // TrustedResourceUrl header needs to start with https or '//'.
-    const iframeUrl = `https://pay${environment == Constants.Environment.PREPROD ?
-             '-preprod.sandbox' :
-             environment == Constants.Environment.SANDBOX ? '.sandbox' : ''}.google.com/gp/p/ui/payframe?origin=${origin}&mid=%{merchantId}`;
-    return iframeUrl;
+  /**
+   * Starts the save subscription
+   * @return {!Promise}
+   */
+  start() {
+    const iframeArgs = this.activityPorts_.addDefaultArguments({
+      'isClosable': true,
+    });
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/linksaveiframe'),
+      iframeArgs,
+      /* shouldFadeBody */ false,
+      /* hasLoadingIndicator */ true
+    );
+    this.activityIframeView_.on(
+      LinkingInfoResponse,
+      this.sendLinkSaveToken_.bind(this)
+    );
+
+    this.openPromise_ = this.dialogManager_.openView(
+      this.activityIframeView_,
+      /* hidden */ true
+    );
+    this.deps_
+      .eventManager()
+      .logSwgEvent(AnalyticsEvent.IMPRESSION_SAVE_SUBSCR_TO_GOOGLE);
+    /** {!Promise<boolean>} */
+    return this.activityIframeView_
+      .acceptResultAndVerify(
+        feOrigin(),
+        /* requireOriginVerified */ true,
+        /* requireSecureChannel */ true
+      )
+      .then(result => {
+        return this.handleLinkSaveResponse_(result);
+      })
+      .catch(reason => {
+        // In case this flow wasn't complete, complete it here
+        this.complete_();
+        // Handle cancellation from user, link confirm start or completion here
+        if (isCancelError(reason)) {
+          this.deps_
+            .eventManager()
+            .logSwgEvent(
+              AnalyticsEvent.ACTION_SAVE_SUBSCR_TO_GOOGLE_CANCEL,
+              true
+            );
+          this.deps_
+            .callbacks()
+            .triggerFlowCanceled(SubscriptionFlows.LINK_ACCOUNT);
+          return false;
+        }
+        throw reason;
+      });
   }
 }
 
-// Start loading pay frame early
-PayFrameHelper.load();
-
 /**
- * @license
- * Copyright 2018 Google Inc. All Rights Reserved.
+ * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -11118,329 +11395,376 @@ PayFrameHelper.load();
  * limitations under the License.
  */
 
-/**
- * @return {boolean} true if this version of Chrome supports PaymentHandler.
- */
-function chromeSupportsPaymentHandler() {
-  // Check if feature is enabled for user
-  if (typeof google == 'undefined' ||
-      !null) {
-    return false;
-  }
-
-  // Payment handler isn't supported on mobile
-  const mobilePlatform = window.navigator.userAgent.match(
-      /Android|iPhone|iPad|iPod|BlackBerry|IEMobile/i);
-  if (mobilePlatform != null) {
-    return false;
-  }
+/** @const {!Object<string,AnalyticsEvent>} */
+const PublisherEventToAnalyticsEvent = {
+  [Event.IMPRESSION_PAYWALL]: AnalyticsEvent.IMPRESSION_PAYWALL,
+  [Event.IMPRESSION_AD]: AnalyticsEvent.IMPRESSION_AD,
+  [Event.IMPRESSION_OFFERS]: AnalyticsEvent.IMPRESSION_OFFERS,
+  [Event.ACTION_SUBSCRIPTIONS_LANDING_PAGE]:
+    AnalyticsEvent.ACTION_SUBSCRIPTIONS_LANDING_PAGE,
+  [Event.ACTION_OFFER_SELECTED]: AnalyticsEvent.ACTION_OFFER_SELECTED,
+  [Event.ACTION_PAYMENT_FLOW_STARTED]:
+    AnalyticsEvent.ACTION_PAYMENT_FLOW_STARTED,
+  [Event.ACTION_PAYMENT_COMPLETED]: AnalyticsEvent.ACTION_PAYMENT_COMPLETE,
+  [Event.EVENT_CUSTOM]: AnalyticsEvent.EVENT_CUSTOM,
+};
 
-  const chromeVersion = window.navigator.userAgent.match(/Chrome\/([0-9]+)\./i);
-  return 'PaymentRequest' in window && chromeVersion != null &&
-      Number(chromeVersion[1]) >= 68 &&
-      window.navigator.vendor == 'Google Inc.';
-}
+/** @const {!Object<number,?Event>} */
+const AnalyticsEventToPublisherEvent = {
+  [AnalyticsEvent.UNKNOWN]: null,
+  [AnalyticsEvent.IMPRESSION_PAYWALL]: Event.IMPRESSION_PAYWALL,
+  [AnalyticsEvent.IMPRESSION_AD]: Event.IMPRESSION_AD,
+  [AnalyticsEvent.IMPRESSION_OFFERS]: Event.IMPRESSION_OFFERS,
+  [AnalyticsEvent.IMPRESSION_SUBSCRIBE_BUTTON]: null,
+  [AnalyticsEvent.IMPRESSION_SMARTBOX]: null,
+  [AnalyticsEvent.ACTION_SUBSCRIBE]: null,
+  [AnalyticsEvent.ACTION_PAYMENT_COMPLETE]: Event.ACTION_PAYMENT_COMPLETED,
+  [AnalyticsEvent.ACTION_ACCOUNT_CREATED]: null,
+  [AnalyticsEvent.ACTION_ACCOUNT_ACKNOWLEDGED]: null,
+  [AnalyticsEvent.ACTION_SUBSCRIPTIONS_LANDING_PAGE]:
+    Event.ACTION_SUBSCRIPTIONS_LANDING_PAGE,
+  [AnalyticsEvent.ACTION_PAYMENT_FLOW_STARTED]:
+    Event.ACTION_PAYMENT_FLOW_STARTED,
+  [AnalyticsEvent.ACTION_OFFER_SELECTED]: Event.ACTION_OFFER_SELECTED,
+  [AnalyticsEvent.EVENT_PAYMENT_FAILED]: null,
+  [AnalyticsEvent.EVENT_CUSTOM]: Event.EVENT_CUSTOM,
+};
 
 /**
- * @return {boolean} true if this version of Chrome supports PaymentRequest.
+ * Converts a propensity event enum into an analytics event enum.
+ * @param {!Event|string} propensityEvent
+ * @returns {!AnalyticsEvent}
  */
-function chromeSupportsPaymentRequest() {
-  // Opera uses chrome as rendering engine and sends almost the exact same
-  // user agent as chrome thereby fooling us on android.
-  const isOpera = window.navigator.userAgent.indexOf('OPR/') != -1;
-  if (isOpera) {
-    return false;
-  }
-  if (chromeSupportsPaymentHandler()) {
-    return true;
-  }
-
-  const androidPlatform = window.navigator.userAgent.match(/Android/i);
-  const chromeVersion = window.navigator.userAgent.match(/Chrome\/([0-9]+)\./i);
-  return androidPlatform != null && 'PaymentRequest' in window &&
-      // Make sure skipping PaymentRequest UI when only one PaymentMethod is
-      // supported (starts on Google Chrome 59).
-      window.navigator.vendor == 'Google Inc.' && chromeVersion != null &&
-      Number(chromeVersion[1]) >= 59;
+function publisherEventToAnalyticsEvent(propensityEvent) {
+  return PublisherEventToAnalyticsEvent[propensityEvent];
 }
 
 /**
- * @param {!IsReadyToPayRequest} isReadyToPayRequest
- *
- * @return {boolean} true if the merchant only supports tokenized cards.
+ * Converts an analytics event enum into a propensity event enum.
+ * @param {!AnalyticsEvent} analyticsEvent
+ * @returns {?Event}
  */
-function doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest) {
-  if (isReadyToPayRequest.apiVersion >= 2) {
-    const allowedAuthMethods =
-        extractAllowedAuthMethodsForCards_(isReadyToPayRequest);
-    if (allowedAuthMethods && allowedAuthMethods.length == 1 &&
-        allowedAuthMethods[0] == Constants.AuthMethod.CRYPTOGRAM_3DS) {
-      return true;
-    }
-  }
-  return isReadyToPayRequest.allowedPaymentMethods.length == 1 &&
-      isReadyToPayRequest.allowedPaymentMethods[0] ==
-      Constants.PaymentMethod.TOKENIZED_CARD;
+function analyticsEventToPublisherEvent(analyticsEvent) {
+  return AnalyticsEventToPublisherEvent[analyticsEvent];
 }
 
 /**
- * @param {!IsReadyToPayRequest} isReadyToPayRequest
- * @param {Constants.AuthMethod} apiV2AuthMethod
+ * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
  *
- * @return {boolean} true if the merchant supports pan cards.
- */
-function apiV2DoesMerchantSupportSpecifiedCardType(
-    isReadyToPayRequest, apiV2AuthMethod) {
-  if (isReadyToPayRequest.apiVersion >= 2) {
-    const allowedAuthMethods =
-        extractAllowedAuthMethodsForCards_(isReadyToPayRequest);
-    if (allowedAuthMethods && allowedAuthMethods.includes(apiV2AuthMethod)) {
-      return true;
-    }
-    return false;
-  }
-  return false;
-}
-
-/**
- * Validate if is secure context. Returns null if context is secure, otherwise
- * return error message.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
  *
- * See https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts
+ *      http://www.apache.org/licenses/LICENSE-2.0
  *
- * @return {?string} null if current context is secure, otherwise return error
- * message.
- */
-function validateSecureContext() {
-  if (window.location.hostname.endsWith(Constants.TRUSTED_DOMAIN)) {
-    // This is for local development.
-    return null;
-  }
-  if (window.isSecureContext === undefined) {
-    // Browser not support isSecureContext, figure out a way to validate this
-    // for the unsupported browser.
-    return null;
-  }
-  return window.isSecureContext ?
-      null :
-      'Google Pay APIs should be called in secure context!';
-}
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
 /**
- * Validate PaymentOptions.
- *
- * @param {!PaymentOptions} paymentOptions
+ * @implements {../api/logger-api.LoggerApi}
  */
-function validatePaymentOptions(paymentOptions) {
-  if (paymentOptions.environment &&
-      !Object.values(Constants.Environment)
-           .includes(paymentOptions.environment)) {
-    throw new Error(
-        'Parameter environment in PaymentOptions can optionally be set to ' +
-        'PRODUCTION, otherwise it defaults to TEST.');
+class Logger {
+  /**
+   * @param {!./deps.DepsDef} deps
+   */
+  constructor(deps) {
+    /** @private @const {!../api/client-event-manager-api.ClientEventManagerApi} */
+    this.eventManager_ = deps.eventManager();
   }
-}
 
-/**
- * Validate IsReadyToPayRequest.
- *
- * @param {!IsReadyToPayRequest} isReadyToPayRequest
- * @return {?string} errorMessage if the request is invalid.
- */
-function validateIsReadyToPayRequest(isReadyToPayRequest) {
-  if (!isReadyToPayRequest) {
-    return 'isReadyToPayRequest must be set!';
-  } else if (isReadyToPayRequest.apiVersion >= 2) {
-    if (!('apiVersionMinor' in isReadyToPayRequest)) {
-      return 'apiVersionMinor must be set!';
+  /** @override */
+  sendSubscriptionState(state, jsonProducts) {
+    if (!isEnumValue(SubscriptionState, state)) {
+      throw new Error('Invalid subscription state provided');
     }
-    if (!isReadyToPayRequest.allowedPaymentMethods ||
-        !Array.isArray(isReadyToPayRequest.allowedPaymentMethods) ||
-        isReadyToPayRequest.allowedPaymentMethods.length == 0) {
-      return 'for v2 allowedPaymentMethods must be set to an array containing a list of accepted payment methods';
+    if (
+      (SubscriptionState.SUBSCRIBER == state ||
+        SubscriptionState.PAST_SUBSCRIBER == state) &&
+      !jsonProducts
+    ) {
+      throw new Error(
+        'Entitlements must be provided for users with' +
+          ' active or expired subscriptions'
+      );
     }
-    for (var i = 0; i < isReadyToPayRequest.allowedPaymentMethods.length; i++) {
-      let allowedPaymentMethod = isReadyToPayRequest.allowedPaymentMethods[i];
-      if (allowedPaymentMethod['type'] == Constants.PaymentMethod.CARD) {
-        if (!allowedPaymentMethod['parameters']) {
-          return 'Field parameters must be setup in each allowedPaymentMethod';
-        }
-        var allowedCardNetworks =
-            allowedPaymentMethod['parameters']['allowedCardNetworks'];
-        if (!allowedCardNetworks || !Array.isArray(allowedCardNetworks) ||
-            allowedCardNetworks.length == 0) {
-          return 'allowedCardNetworks must be setup in parameters for type CARD';
-        }
-        var allowedAuthMethods =
-            allowedPaymentMethod['parameters']['allowedAuthMethods'];
-        if (!allowedAuthMethods || !Array.isArray(allowedAuthMethods) ||
-            allowedAuthMethods.length == 0 ||
-            !allowedAuthMethods.every(isAuthMethodValid)) {
-          return 'allowedAuthMethods must be setup in parameters for type \'CARD\' ' +
-              ' and must contain \'CRYPTOGRAM_3DS\' and/or \'PAN_ONLY\'';
-        }
+    if (jsonProducts && !isObject(jsonProducts)) {
+      throw new Error('Entitlements must be an Object');
+    }
+    let productsOrSkus = null;
+    if (jsonProducts) {
+      productsOrSkus = JSON.stringify(jsonProducts);
+    }
+    this.eventManager_.logEvent({
+      eventType: AnalyticsEvent.EVENT_SUBSCRIPTION_STATE,
+      eventOriginator: EventOriginator.PUBLISHER_CLIENT,
+      isFromUserAction: null,
+      additionalParameters: {
+        state,
+        productsOrSkus,
+      },
+    });
+  }
+
+  /** @override */
+  sendEvent(userEvent) {
+    let data = null;
+    if (
+      !isEnumValue(Event, userEvent.name) ||
+      !publisherEventToAnalyticsEvent(userEvent.name)
+    ) {
+      throw new Error('Invalid user event provided(' + userEvent.name + ')');
+    }
+
+    if (userEvent.data) {
+      if (!isObject(userEvent.data)) {
+        throw new Error('Event data must be an Object(' + userEvent.data + ')');
+      } else {
+        data = {};
+        Object.assign(data, userEvent.data);
       }
     }
-    return null;
-  } else if (
-      !isReadyToPayRequest.allowedPaymentMethods ||
-      !Array.isArray(isReadyToPayRequest.allowedPaymentMethods) ||
-      isReadyToPayRequest.allowedPaymentMethods.length == 0 ||
-      !isReadyToPayRequest.allowedPaymentMethods.every(isPaymentMethodValid)) {
-    return 'allowedPaymentMethods must be set to an array containing \'CARD\' ' +
-        'and/or \'TOKENIZED_CARD\'!';
+
+    if (isBoolean(userEvent.active)) {
+      if (!data) {
+        data = {};
+      }
+      Object.assign(data, {'is_active': userEvent.active});
+    } else if (userEvent.active != null) {
+      throw new Error('Event active must be a boolean');
+    }
+    this.eventManager_.logEvent({
+      eventType: publisherEventToAnalyticsEvent(userEvent.name),
+      eventOriginator: EventOriginator.PUBLISHER_CLIENT,
+      isFromUserAction: userEvent.active,
+      additionalParameters: data,
+    });
   }
-  return null;
 }
 
 /**
- * Validate the payment method.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
- * @param {string} paymentMethod
- * @return {boolean} if the current payment method is valid.
- */
-function isPaymentMethodValid(paymentMethod) {
-  return Object.values(Constants.PaymentMethod).includes(paymentMethod);
-}
-
-/**
- * Validate the auth method.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
  *
- * @param {string} authMethod
- * @return {boolean} if the current auth method is valid.
- */
-function isAuthMethodValid(authMethod) {
-  return Object.values(Constants.AuthMethod).includes(authMethod);
-}
-
-/**
- * Validate PaymentDataRequest.
+ *      http://www.apache.org/licenses/LICENSE-2.0
  *
- * @param {!PaymentDataRequest} paymentDataRequest
- * @return {?string} errorMessage if the request is invalid.
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function validatePaymentDataRequest(paymentDataRequest) {
-  if (!paymentDataRequest) {
-    return 'paymentDataRequest must be set!';
-  }
-  if (paymentDataRequest.swg) {
-    return validatePaymentDataRequestForSwg(paymentDataRequest.swg);
-  } else if (!paymentDataRequest.transactionInfo) {
-    return 'transactionInfo must be set!';
-  } else if (!paymentDataRequest.transactionInfo.currencyCode) {
-    return 'currencyCode in transactionInfo must be set!';
-  } else if (
-      !paymentDataRequest.transactionInfo.totalPriceStatus ||
-      !Object.values(Constants.TotalPriceStatus)
-           .includes(paymentDataRequest.transactionInfo.totalPriceStatus)) {
-    return 'totalPriceStatus in transactionInfo must be set to one of' +
-        ' NOT_CURRENTLY_KNOWN, ESTIMATED or FINAL!';
-  } else if (
-      paymentDataRequest.transactionInfo.totalPriceStatus !==
-          'NOT_CURRENTLY_KNOWN' &&
-      !paymentDataRequest.transactionInfo.totalPrice) {
-    return 'totalPrice in transactionInfo must be set when' +
-        ' totalPriceStatus is ESTIMATED or FINAL!';
+
+class LoginNotificationApi {
+  /**
+   * @param {!./deps.DepsDef} deps
+   */
+  constructor(deps) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
+
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
+
+    /** @private {?Promise} */
+    this.openViewPromise_ = null;
+
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/loginiframe'),
+      feArgs({
+        publicationId: deps.pageConfig().getPublicationId(),
+        productId: deps.pageConfig().getProductId(),
+        // No need to ask the user. Just tell them you're logging them in.
+        userConsent: false,
+        // TODO(chenshay): Pass entitlements value here.
+      }),
+      /* shouldFadeBody */ true
+    );
   }
 
-  // Validate payment data request for UPI payment method
-  const allowedPaymentMethod = getUpiPaymentMethod(paymentDataRequest);
-  if (allowedPaymentMethod) {
-    if (!allowedPaymentMethod['parameters']) {
-      return 'parameters must be set in allowedPaymentMethod!';
-    }
+  /**
+   * Continues the Login flow (after waiting).
+   * @return {!Promise}
+   */
+  start() {
+    this.deps_
+      .callbacks()
+      .triggerFlowStarted(SubscriptionFlows.SHOW_LOGIN_NOTIFICATION);
 
-    var parameters = allowedPaymentMethod['parameters'];
-    if (!parameters['payeeVpa']) {
-      return 'payeeVpa in allowedPaymentMethod parameters must be set!';
-    } else if (!parameters['payeeName']) {
-      return 'payeeName in allowedPaymentMethod parameters must be set!';
-    } else if (!parameters['referenceUrl']) {
-      return 'referenceUrl in allowedPaymentMethod parameters must be set!';
-    } else if (!parameters['mcc']) {
-      return 'mcc in allowedPaymentMethod parameters must be set!';
-    } else if (!parameters['transactionReferenceId']) {
-      return 'transactionReferenceId in allowedPaymentMethod parameters' +
-          ' must be set!';
-    }
+    this.openViewPromise_ = this.dialogManager_.openView(
+      this.activityIframeView_
+    );
 
-    if (paymentDataRequest['transactionInfo']['currencyCode'] !== 'INR') {
-      return 'currencyCode in transactionInfo must be set to INR!';
-    } else if (
-        paymentDataRequest['transactionInfo']['totalPriceStatus'] !== 'FINAL') {
-      return 'totalPriceStatus in transactionInfo must be set to FINAL!';
-    } else if (!paymentDataRequest['transactionInfo']['transactionNote']) {
-      return 'transactionNote in transactionInfo must be set!';
-    }
+    return this.activityIframeView_.acceptResult().then(
+      () => {
+        // The consent part is complete.
+        this.dialogManager_.completeView(this.activityIframeView_);
+      },
+      reason => {
+        this.dialogManager_.completeView(this.activityIframeView_);
+        throw reason;
+      }
+    );
   }
-  return null;
 }
 
 /**
- * Returns upi payment method object if it exists in allowed payment methods
- * or null if it doesn't
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
- * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
- * @return {?Object}
- */
-function getUpiPaymentMethod(request) {
-  if (!chromeSupportsPaymentRequest() || request.apiVersion < 2 ||
-      !request.allowedPaymentMethods) {
-    return null;
-  }
-  return getAllowedPaymentMethodForType_(request, Constants.PaymentMethod.UPI);
-}
-
-/**
- * Validate parameters for swg.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
  *
- * @param {?SwgParameters} swgParameters
- * @return {?string} errorMessage if the request is invalid.
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function validatePaymentDataRequestForSwg(swgParameters) {
-  if (!swgParameters) {
-    return 'Swg parameters must be provided';
+
+class LoginPromptApi {
+  /**
+   * @param {!./deps.DepsDef} deps
+   */
+  constructor(deps) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
+
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
+
+    /** @private {?Promise} */
+    this.openViewPromise_ = null;
+
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/loginiframe'),
+      feArgs({
+        publicationId: deps.pageConfig().getPublicationId(),
+        productId: deps.pageConfig().getProductId(),
+        // First ask the user if they want us to log them in.
+        userConsent: true,
+        // TODO(chenshay): Pass entitlements value here.
+      }),
+      /* shouldFadeBody */ true
+    );
   }
-  if (!swgParameters.skuId || !swgParameters.publicationId) {
-    return 'Both skuId and publicationId must be provided';
+
+  /**
+   * Prompts the user to login.
+   * @return {!Promise}
+   */
+  start() {
+    this.deps_
+      .callbacks()
+      .triggerFlowStarted(SubscriptionFlows.SHOW_LOGIN_PROMPT);
+
+    this.openViewPromise_ = this.dialogManager_.openView(
+      this.activityIframeView_
+    );
+
+    return this.activityIframeView_.acceptResult().then(
+      () => {
+        // The consent part is complete.
+        this.dialogManager_.completeView(this.activityIframeView_);
+      },
+      reason => {
+        if (isCancelError(reason)) {
+          this.deps_
+            .callbacks()
+            .triggerFlowCanceled(SubscriptionFlows.SHOW_LOGIN_PROMPT);
+        } else {
+          this.dialogManager_.completeView(this.activityIframeView_);
+        }
+        throw reason;
+      }
+    );
   }
-  return null;
 }
 
 /**
- * Returns the allowedAuthMethods for a card from the request.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
- * @param {!IsReadyToPayRequest} isReadyToPayRequest
- * @return {?Array<string>}
- * @private
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-function extractAllowedAuthMethodsForCards_(isReadyToPayRequest) {
-  if (isReadyToPayRequest.allowedPaymentMethods) {
-    const allowedPaymentMethod = getAllowedPaymentMethodForType_(
-        isReadyToPayRequest, Constants.PaymentMethod.CARD);
-    if (allowedPaymentMethod && allowedPaymentMethod.parameters) {
-      return allowedPaymentMethod.parameters['allowedAuthMethods'];
-    }
+
+class OffersApi {
+  /**
+   * @param {!../model/page-config.PageConfig} config
+   * @param {!./fetcher.Fetcher} fetcher
+   */
+  constructor(config, fetcher) {
+    /** @private @const {!../model/page-config.PageConfig} */
+    this.config_ = config;
+
+    /** @private @const {!./fetcher.Fetcher} */
+    this.fetcher_ = fetcher;
   }
-  return null;
-}
 
-/**
- * @param {!IsReadyToPayRequest} isReadyToPayRequest
- * @param {string} paymentMethodType
- * @return {?PaymentMethod} Return first payment method for the given type,
- *     return null if not found.
- * @private
- */
-function getAllowedPaymentMethodForType_(
-    isReadyToPayRequest, paymentMethodType) {
-  for (var i = 0; i < isReadyToPayRequest.allowedPaymentMethods.length; i++) {
-    const allowedPaymentMethod = isReadyToPayRequest.allowedPaymentMethods[i];
-    if (allowedPaymentMethod.type == paymentMethodType) {
-      return allowedPaymentMethod;
+  /**
+   * @param {?string=} productId
+   * @return {!Promise<!Array<!../api/offer.Offer>>}
+   */
+  getOffers(productId = this.config_.getProductId()) {
+    if (!productId) {
+      throw new Error('getOffers requires productId in config or arguments');
     }
+    return this.fetch_(productId);
+  }
+
+  /**
+   * @param {string} productId
+   * @return {!Promise<!Array<!../api/offer.Offer>>}
+   * @private
+   */
+  fetch_(productId) {
+    const url = serviceUrl(
+      '/publication/' +
+        encodeURIComponent(this.config_.getPublicationId()) +
+        '/offers' +
+        '?label=' +
+        encodeURIComponent(productId)
+    );
+    // TODO(dvoytenko): switch to a non-credentialed request after launch.
+    return this.fetcher_.fetchCredentialedJson(url).then(json => {
+      return json['offers'] || [];
+    });
   }
-  return null;
 }
 
 /**
@@ -11460,638 +11784,417 @@ function getAllowedPaymentMethodForType_(
  * limitations under the License.
  */
 
+const MAX_Z_INDEX = 2147483647;
+
+const Constants = {};
+
 /**
- * Injects the pay with google iframe.
- * @param {string} iframeClassName The classname of the iFrame wrapper.
- * @return {!{container: !Element, iframe:!HTMLIFrameElement}}
+ * Supported environments.
+ *
+ * @enum {string}
  */
-function injectIframe(iframeClassName) {
-  const container = document.createElement('div');
-  container.classList.add(Constants.IFRAME_CONTAINER_CLASS);
-  const iframeContainer = document.createElement('div');
-  iframeContainer.classList.add('iframeContainer');
-  /** @private @const {!HTMLIFrameElement} */
-  const iframe =
-      /** @type {!HTMLIFrameElement} */ (document.createElement('iframe'));
-  iframe.classList.add(iframeClassName);
-  iframe.setAttribute('frameborder', '0');
-  iframe.setAttribute('scrolling', 'no');
-  iframeContainer.appendChild(iframe);
-  container.appendChild(iframeContainer);
-  document.body.appendChild(container);
-  return {'container': container, 'iframe': iframe};
-}
+Constants.Environment = {
+  LOCAL: 'LOCAL',
+  PREPROD: 'PREPROD',
+  PRODUCTION: 'PRODUCTION',
+  SANDBOX: 'SANDBOX',
+  TEST: 'TEST',
+  TIN: 'TIN',
+};
+
+/**
+ * Supported payment methods.
+ *
+ * @enum {string}
+ */
+Constants.PaymentMethod = {
+  CARD: 'CARD',
+  TOKENIZED_CARD: 'TOKENIZED_CARD',
+  UPI: 'UPI',
+};
+
+/**
+ * Auth methods.
+ *
+ * @enum {string}
+ */
+Constants.AuthMethod = {
+  CRYPTOGRAM_3DS: 'CRYPTOGRAM_3DS',
+  PAN_ONLY: 'PAN_ONLY',
+};
+
+/**
+ * Returned result status.
+ *
+ * @enum {string}
+ */
+Constants.ResponseStatus = {
+  CANCELED: 'CANCELED',
+  DEVELOPER_ERROR: 'DEVELOPER_ERROR',
+};
+
+/**
+ * Supported total price status.
+ *
+ * @enum {string}
+ */
+Constants.TotalPriceStatus = {
+  ESTIMATED: 'ESTIMATED',
+  FINAL: 'FINAL',
+  NOT_CURRENTLY_KNOWN: 'NOT_CURRENTLY_KNOWN',
+};
 
 /**
- * @license
- * Copyright 2018 Google Inc. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
+ * Supported Google Pay payment button type.
  *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * @enum {string}
  */
-
-const GPAY_ACTIVITY_REQUEST = 'GPAY';
-const IFRAME_CLOSE_DURATION_IN_MS = 250;
-const IFRAME_SHOW_UP_DURATION_IN_MS = 250;
-const IFRAME_SMOOTH_HEIGHT_TRANSITION = `height ${IFRAME_SHOW_UP_DURATION_IN_MS}ms`;
-const ERROR_PREFIX = 'Error: ';
+Constants.ButtonType = {
+  SHORT: 'short',
+  LONG: 'long',
+};
 
 /**
- * Supported browser user agent keys.
+ * Supported button colors.
  *
  * @enum {string}
  */
-const BrowserUserAgent = {
-  CHROME: 'Chrome',
-  FIREFOX: 'Firefox',
-  SAFARI: 'Safari',
+Constants.ButtonColor = {
+  DEFAULT: 'default',  // Currently defaults to black.
+  BLACK: 'black',
+  WHITE: 'white',
 };
 
 /**
- * An implementation of PaymentsClientDelegateInterface that uses the custom
- * hosting page along with web activities to actually get to the hosting page.
- * @implements {PaymentsClientDelegateInterface}
+ * Id attributes.
+ *
+ * @enum {string}
  */
-class PaymentsWebActivityDelegate {
-  /**
-   * @param {string} environment
-   * @param {string} googleTransactionId
-   * @param {boolean=} useIframe
-   * @param {!ActivityPorts=} activities Can be used to provide a shared
-   *   activities manager. By default, the new manager is created.
-   * @param {?string=} redirectKey The redirect key used for redirect mode.
-   */
-  constructor(
-    environment,
-    googleTransactionId,
-    useIframe,
-    activities,
-    redirectKey
-  ) {
-    this.environment_ = environment;
-    /** @private @const {boolean} */
+Constants.Id = {
+  POPUP_WINDOW_CONTAINER: 'popup-window-container',
+};
 
-    /** @const {!ActivityPorts} */
-    this.activities = activities || new activityPorts_1(window);
-    /** @const @private {!Graypane} */
-    this.graypane_ = new Graypane$1(window.document);
-    /** @private {?function(!Promise<!PaymentData>)} */
-    this.callback_ = null;
-    /**
-     * @private {?{
-     *             container: !Element,
-     *             iframe:!HTMLIFrameElement,
-     *             request:!PaymentDataRequest,
-     *             dataPromise:?Promise<!PaymentData>}}
-     */
-    this.prefetchedObjects_ = null;
-    /** @private {boolean} */
-    this.shouldHandleResizing_ = false;
-    /** @private {?ActivityIframePort} */
-    this.port_ = null;
-    /** @private {?function(!Promise<void>)} */
-    this.dismissPromiseResolver_ = null;
-    /** @const @private {string} */
-    this.googleTransactionId_ = googleTransactionId;
-    /** @const @private {?string} */
-    this.redirectKey_ = redirectKey || null;
+/** @const {string} */
+Constants.STORAGE_KEY_PREFIX = 'google.payments.api.storage';
 
-    /**
-     * @private {?ResizePayload}
-     */
-    this.savedResizePayload_ = null;
-  }
+/** @const {string} */
+Constants.IS_READY_TO_PAY_RESULT_KEY =
+    Constants.STORAGE_KEY_PREFIX + '.isreadytopay.result';
 
-  /** @override */
-  onResult(callback) {
-    if (this.callback_) {
-      return;
-    }
-    this.callback_ = callback;
-    this.activities.onResult(
-      GPAY_ACTIVITY_REQUEST,
-      this.onActivityResult_.bind(this)
-    );
+/** @const {string} */
+Constants.UPI_CAN_MAKE_PAYMENT_CACHE_KEY =
+    Constants.STORAGE_KEY_PREFIX + '.upi.canMakePaymentCache';
+
+
+Constants.CLASS_PREFIX = 'google-payments-';
+Constants.IFRAME_ACTIVE_CONTAINER_CLASS =
+    `${Constants.CLASS_PREFIX}activeContainer`;
+Constants.IFRAME_CONTAINER_CLASS = `${Constants.CLASS_PREFIX}dialogContainer`;
+Constants.IFRAME_STYLE_CENTER_CLASS = `${Constants.CLASS_PREFIX}dialogCenter`;
+Constants.IFRAME_STYLE_CLASS = `${Constants.CLASS_PREFIX}dialog`;
+
+Constants.IFRAME_STYLE = `
+.${Constants.IFRAME_STYLE_CLASS} {
+    animation: none 0s ease 0s 1 normal none running;
+    background: none 0 0 / auto repeat scroll padding-box border-box #fff;
+    background-blend-mode: normal;
+    border: 0 none #333;
+    border-radius: 8px 8px 0 0;
+    border-collapse: separate;
+    bottom: 0;
+    box-shadow: #808080 0 3px 0 0, #808080 0 0 22px;
+    box-sizing: border-box;
+    letter-spacing: normal;
+    max-height: 100%;
+    overflow: visible;
+    position: fixed;
+    width: 100%;
+    z-index: ${MAX_Z_INDEX};
+    -webkit-appearance: none;
+    left: 0;
+}
+@media (min-width: 480px) {
+  .${Constants.IFRAME_STYLE_CLASS} {
+    width: 480px !important;
+    left: -240px !important;
+    margin-left: calc(100vw - 100vw / 2) !important;
   }
+}
+.${Constants.IFRAME_CONTAINER_CLASS} {
+  background-color: rgba(0,0,0,0.26);
+  bottom: 0;
+  height: 100%;
+  left: 0;
+  position: absolute;
+  right: 0;
+}
+.iframeContainer {
+  -webkit-overflow-scrolling: touch;
+}
+`;
 
-  /**
-   * @param {!ActivityPort} port
-   * @private
-   */
-  onActivityResult_(port) {
-    // Hide the graypane.
-    this.graypane_.hide();
-    // Only verified origins are allowed.
-    this.callback_(
-      port.acceptResult().then(
-        result => {
-          // Origin must always match: popup, iframe or redirect.
-          if (result.origin != this.getOrigin_()) {
-            throw new Error('channel mismatch');
-          }
-          const data = /** @type {!PaymentData} */ (result.data);
-          if (data['redirectEncryptedCallbackData']) {
-            PayFrameHelper.setBuyFlowActivityMode(BuyFlowActivityMode.REDIRECT);
-            return this.fetchRedirectResponse_(
-              data['redirectEncryptedCallbackData']
-            ).then(decrypedJson => {
-              // Merge other non-encrypted fields into the final response.
-              const clone = Object.assign({}, data);
-              delete clone['redirectEncryptedCallbackData'];
-              return Object.assign(clone, decrypedJson);
-            });
-          }
-          // Unencrypted data supplied: must be a verified and secure channel.
-          if (!result.originVerified || !result.secureChannel) {
-            throw new Error('channel mismatch');
-          }
-          return data;
-        },
-        error => {
-          // TODO: Log the original and the inferred error to eye3.
-          const originalError = error['message'];
-          let inferredError = error['message'];
-          try {
-            // Try to parse the error message to a structured error, if it's
-            // not possible, fallback to use the error message string.
-            inferredError = JSON.parse(
-              originalError.substring(ERROR_PREFIX.length)
-            );
-          } catch (e) {}
-          if (
-            inferredError['statusCode'] &&
-            ['DEVELOPER_ERROR', 'MERCHANT_ACCOUNT_ERROR'].indexOf(
-              inferredError['statusCode']
-            ) == -1
-          ) {
-            inferredError = {
-              'statusCode': 'CANCELED',
-            };
-          }
-          if (inferredError == 'AbortError') {
-            inferredError = {
-              'statusCode': 'CANCELED',
-            };
-          }
-          return Promise.reject(inferredError);
-        }
-      )
-    );
+Constants.IFRAME_STYLE_CENTER = `
+.${Constants.IFRAME_STYLE_CENTER_CLASS} {
+  animation: none 0s ease 0s 1 normal none running;
+  background-blend-mode: normal;
+  background: none 0 0 / auto repeat scroll padding-box border-box #fff;
+  border-collapse: separate;
+  border-radius: 8px;
+  border: 0px none #333;
+  bottom: auto;
+  box-shadow: #808080 0 0 22px;
+  box-sizing: border-box;
+  left: -240px;
+  letter-spacing: normal;
+  margin-left: calc(100vw - 100vw / 2) !important;
+  max-height: 90%;
+  overflow: visible;
+  position: absolute;
+  top: 100%;
+  transform: scale(0.8);
+  width: 480px;
+  z-index: ${MAX_Z_INDEX};
+  -webkit-appearance: none;
+}
+@media (min-height: 667px) {
+  .${Constants.IFRAME_STYLE_CENTER_CLASS} {
+    max-height: 600px;
   }
+}
+.${Constants.IFRAME_ACTIVE_CONTAINER_CLASS} {
+  top: 50%;
+  transform: scale(1.0) translateY(-50%);
+}
+`;
+
+Constants.GPAY_BUTTON_WITH_CARD_INFO_IMAGE =
+    'background-image: url(https://pay.google.com/gp/p/generate_gpay_btn_img);';
 
-  /**
-   * @param {string} redirectEncryptedCallbackData
-   * @return {!PaymentData}
-   * @private
-   */
-  fetchRedirectResponse_(redirectEncryptedCallbackData) {
-    // This method has to rely on the legacy XHR API because the redirect
-    // functionality is, in part, aimed at older browsers.
-    return new Promise((resolve, reject) => {
-      const url = this.getDecryptionUrl_();
-      const xhr = new XMLHttpRequest();
-      xhr.open('POST', url, true);
-      if ('withCredentials' in xhr) {
-        // It's fine to proceed in a non-redirect mode because redirectVerifier
-        // plays the part of CORS propagation.
-        xhr.withCredentials = true;
-      }
+Constants.BUTTON_LOCALE_TO_MIN_WIDTH = {
+  'en': 152,
+  'bg': 163,
+  'cs': 192,
+  'de': 183,
+  'es': 183,
+  'fr': 183,
+  'hr': 157,
+  'id': 186,
+  'ja': 148,
+  'ko': 137,
+  'ms': 186,
+  'nl': 167,
+  'pl': 182,
+  'pt': 193,
+  'ru': 206,
+  'sk': 157,
+  'sl': 211,
+  'sr': 146,
+  'tr': 161,
+  'uk': 207,
+  'zh': 156,
+};
 
-      xhr.onreadystatechange = () => {
-        if (xhr.readyState < /* STATUS_RECEIVED */ 2) {
-          return;
-        }
-        if (xhr.status < 100 || xhr.status > 599) {
-          xhr.onreadystatechange = null;
-          reject(new Error(`Unknown HTTP status ${xhr.status}`));
-          return;
-        }
-        if (xhr.readyState == /* COMPLETE */ 4) {
-          try {
-            resolve(JSON.parse(xhr.responseText));
-          } catch (e) {
-            // JSON parsing error is expected here.
-            reject(e);
-          }
-        }
-      };
-      xhr.onerror = () => {
-        reject(new Error('Network failure'));
-      };
-      xhr.onabort = () => {
-        reject(new Error('Request aborted'));
-      };
+/**
+ * Name of the graypane.
+ *
+ * @const {string}
+ */
+Constants.GPAY_GRAYPANE = 'gpay-graypane';
 
-      // Send POST.
-      xhr.send(redirectEncryptedCallbackData);
-    });
-  }
+/**
+ * Class used for the gpay button.
+ *
+ * @const {string}
+ */
+Constants.GPAY_BUTTON_CLASS = 'gpay-button';
 
-  /** @override */
-  isReadyToPay(isReadyToPayRequest) {
-    return new Promise((resolve, reject) => {
-      if (doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest)) {
-        resolve({'result': false});
-        return;
-      }
-      const userAgent = window.navigator.userAgent;
-      const isIosGsa =
-        userAgent.indexOf('GSA/') > 0 &&
-        userAgent.indexOf(BrowserUserAgent.SAFARI) > 0;
-      // pop up in IGSA doesn't work.
-      if (isIosGsa && !null) {
-        resolve({'result': false});
-        return;
-      }
-      const isFirefoxIos = userAgent.indexOf('FxiOS') > 0;
-      if (isFirefoxIos) {
-        resolve({'result': false});
-        return;
-      }
-      const isSupported =
-        userAgent.indexOf(BrowserUserAgent.CHROME) > 0 ||
-        userAgent.indexOf(BrowserUserAgent.FIREFOX) > 0 ||
-        userAgent.indexOf(BrowserUserAgent.SAFARI) > 0;
-      if (
-        isSupported &&
-        isReadyToPayRequest.apiVersion >= 2 &&
-        isReadyToPayRequest.existingPaymentMethodRequired
-      ) {
-        isReadyToPayRequest.environment = this.environment_;
-        PayFrameHelper.sendAndWaitForResponse(
-          isReadyToPayRequest,
-          PostMessageEventType.IS_READY_TO_PAY,
-          'isReadyToPayResponse',
-          function(event) {
-            const response = {
-              'result': isSupported,
-            };
-            if (isReadyToPayRequest.existingPaymentMethodRequired) {
-              response['paymentMethodPresent'] =
-                event.data['isReadyToPayResponse'] == 'READY_TO_PAY';
-            }
-            resolve(response);
-          }
-        );
-      } else {
-        resolve({'result': isSupported});
-      }
-    });
-  }
+Constants.BUTTON_STYLE = `
+.${Constants.GPAY_BUTTON_CLASS} {
+  background-origin: content-box;
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-size: contain;
+  border: 0px;
+  border-radius: 4px;
+  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 1px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
+  cursor: pointer;
+  height: 40px;
+  min-height: 40px;
+  padding: 11px 24px;
+}
 
-  /** @override */
-  prefetchPaymentData(paymentDataRequest) {
-    // Only handles prefetch for iframe for now.
-    {
-      return;
-    }
-  }
+.${Constants.GPAY_BUTTON_CLASS}.black {
+  background-color: #000;
+  box-shadow: none;
+  padding: 12px 24px 10px;
+}
 
-  /** @override */
-  loadPaymentData(paymentDataRequest) {
-    if (!paymentDataRequest.swg) {
-      // Only set the apiVersion if the merchant is not setting it.
-      if (!paymentDataRequest.apiVersion) {
-        paymentDataRequest.apiVersion = 1;
-      }
-    }
-    paymentDataRequest.environment = this.environment_;
-    PayFrameHelper.setBuyFlowActivityMode(
-      paymentDataRequest['forceRedirect']
-        ? BuyFlowActivityMode.REDIRECT
-        : BuyFlowActivityMode.POPUP
-    );
-    const opener = this.activities.open(
-      GPAY_ACTIVITY_REQUEST,
-      this.getHostingPageUrl_(),
-      this.getRenderMode_(paymentDataRequest),
-      paymentDataRequest,
-      {'width': 600, 'height': 600}
-    );
-    this.graypane_.show(opener && opener.targetWin);
-  }
+.${Constants.GPAY_BUTTON_CLASS}.white {
+  background-color: #fff;
+}
 
-  /**
-   * Returns the render mode whether need to force redirect.
-   *
-   * @param {!PaymentDataRequest} paymentDataRequest
-   * @return {string}
-   * @private
-   */
-  getRenderMode_(paymentDataRequest) {
-    return paymentDataRequest['forceRedirect'] ? '_top' : 'gp-js-popup';
-  }
+.${Constants.GPAY_BUTTON_CLASS}.short {
+  min-width: 90px;
+  width: 160px;
+}
 
-  /**
-   * Returns the server origin based on the environment.
-   *
-   * @private
-   * @return {string}
-   */
-  getOrigin_() {
-    if (this.environment_ == Constants.Environment.LOCAL) {
-      return '';
-    }
+.${Constants.GPAY_BUTTON_CLASS}.black.short {
+  background-image: url(https://www.gstatic.com/instantbuy/svg/dark_gpay.svg);
+}
 
-    let baseDomain;
-    if (this.environment_ == Constants.Environment.PREPROD) {
-      baseDomain = 'pay-preprod.sandbox';
-    } else if (this.environment_ == Constants.Environment.SANDBOX) {
-      baseDomain = 'pay.sandbox';
-    } else {
-      baseDomain = 'pay';
-    }
-    return 'https://' + baseDomain + '.google.com';
-  }
+.${Constants.GPAY_BUTTON_CLASS}.white.short {
+  background-image: url(https://www.gstatic.com/instantbuy/svg/light_gpay.svg);
+}
 
-  /**
-   * Returns the base path based on the environment.
-   *
-   * @private
-   * @return {string} The base path
-   */
-  getBasePath_() {
-    return this.getOrigin_() + '/gp/p';
-  }
+.${Constants.GPAY_BUTTON_CLASS}.black.active {
+  background-color: #5f6368;
+}
+
+.${Constants.GPAY_BUTTON_CLASS}.black.hover {
+  background-color: #3c4043;
+}
+
+.${Constants.GPAY_BUTTON_CLASS}.white.active {
+  background-color: #fff;
+}
+
+.${Constants.GPAY_BUTTON_CLASS}.white.focus {
+  box-shadow: #e8e8e8 0 1px 1px 0, #e8e8e8 0 1px 3px;
+}
+
+.${Constants.GPAY_BUTTON_CLASS}.white.hover {
+  background-color: #f8f8f8;
+}
+`;
+
+Constants.GPAY_BUTTON_WITH_OFFER_ICON_ADDITIONAL_STYLE = 'position: relative;';
 
-  /**
-   * Returns the decryption url to be used to decrypt the encrypted payload.
-   *
-   * @private
-   * @return {string} The decryption url
-   */
-  getDecryptionUrl_() {
-    let url = this.getBasePath_() + '/apis/buyflow/process';
-    if (this.redirectKey_) {
-      url += '?rk=' + encodeURIComponent(this.redirectKey_);
-    }
-    return url;
-  }
+Constants.GPAY_OFFER_ICON_CLASS = 'gpay-offer-icon';
 
-  /**
-   * Returns the hosting page url.
-   *
-   * @private
-   * @return {string} The hosting page url
-   */
-  getHostingPageUrl_() {
-    // In Tin tests, the hosting page is requested from
-    // /testing/buyflow/merchantdemo.html and is accessed relatively since the
-    // base path is unknown ahead of time.
-    if (this.environment_ == Constants.Environment.TIN) {
-      // There is no /gp/p prefix since multilogin prefixes is broken in Tin:
-      // http://yaqs/4912322941550592
-      return '/ui/pay';
-    }
-    return this.getBasePath_() + '/ui/pay';
-  }
+Constants.GPAY_OFFER_ICON_SVG =
+    "<svg width=\"20px\" height=\"20px\" viewBox=\"0 0 20 20\" " +
+    "version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=" +
+    "\"http://www.w3.org/1999/xlink\" class=\"gpay-offer-icon\"><defs><path d=\"M19.41,9.58 L10.41,0.58 " +
+    "C10.05,0.22 9.55,0 9,0 L2,0 C0.9,0 0,0.9 0,2 L0,9 C0,9.55 0.22,10.05 " +
+    "0.59,10.42 L9.59,19.42 C9.95,19.78 10.45,20 11,20 C11.55,20 12.05,19.78 " +
+    "12.41,19.41 L19.41,12.41 C19.78,12.05 20,11.55 20,11 C20,10.45 19.77," +
+    "9.94 19.41,9.58 Z\" id=\"path-1\"></path></defs><g id=\"buttons_10.05\"" +
+    " stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">" +
+    "<g id=\"Artboard\" transform=\"translate(-40.000000, -43.000000)\">" +
+    "<g id=\"Group-3\" transform=\"translate(40.000000, 43.000000)\">" +
+    "<g id=\"Group-2-Copy-2\"><g id=\"Group-Copy\"><g id=\"ic_loyalty_24px\">" +
+    "<mask id=\"mask-2\" fill=\"white\"><use xlink:href=\"#path-1\"></use>" +
+    "</mask><use id=\"gpay-Shape\" fill=\"#FF6100\" fill-rule=\"nonzero\" " +
+    "xlink:href=\"#path-1\"></use><path d=\"M3.5,5 C2.67,5 2,4.33 2,3.5 C2," +
+    "2.67 2.67,2 3.5,2 C4.33,2 5,2.67 5,3.5 C5,4.33 4.33,5 3.5,5 Z\" " +
+    "id=\"Path\" fill=\"#FFFFFF\" fill-rule=\"nonzero\" mask=\"url(#mask-2)\">" +
+    "</path></g></g></g><g id=\"Group-13-Copy-7\" transform=\"translate" +
+    "(6.000000, 6.000000)\" fill=\"#FFFFFF\" fill-rule=\"nonzero\">" +
+    "<g id=\"Group-13-Copy-2\"><path d=\"M2.15217391,4.55172414 C0.963561082," +
+    "4.55172414 1.99840144e-14,3.53278598 1.99840144e-14,2.27586207 " +
+    "C1.99840144e-14,1.01893816 0.963561082,6.30606678e-14 2.15217391,6." +
+    "30606678e-14 C3.34078674,6.30606678e-14 4.30434783,1.01893816 4.30434783," +
+    "2.27586207 C4.30434783,3.53278598 3.34078674,4.55172414 2.15217391," +
+    "4.55172414 Z M2.15217391,3.31034483 C2.69245247,3.31034483 3.13043478,2." +
+    "84719112 3.13043478,2.27586207 C3.13043478,1.70453302 2.69245247," +
+    "1.24137931 2.15217391,1.24137931 C1.61189535,1.24137931 1.17391304,1" +
+    ".70453302 1.17391304,2.27586207 C1.17391304,2.84719112 1.61189535,3." +
+    "31034483 2.15217391,3.31034483 Z\" id=\"Combined-Shape\"></path>" +
+    "<path d=\"M6.84782609,9 C5.65921326,9 4.69565217,7.98106184 4.69565217," +
+    "6.72413793 C4.69565217,5.46721402 5.65921326,4.44827586 6.84782609," +
+    "4.44827586 C8.03643892,4.44827586 9,5.46721402 9,6.72413793 C9,7.98106184" +
+    " 8.03643892,9 6.84782609,9 Z M6.84782609,7.75862069 C7.38810465," +
+    "7.75862069 7.82608696,7.29546698 7.82608696,6.72413793 C7.82608696" +
+    ",6.15280888 7.38810465,5.68965517 6.84782609,5.68965517 C6.30754753," +
+    "5.68965517 5.86956522,6.15280888 5.86956522,6.72413793 C5.86956522," +
+    "7.29546698 6.30754753,7.75862069 6.84782609,7.75862069 Z\" " +
+    "id=\"Combined-Shape\"></path><polygon id=\"Rectangle\" " +
+    "transform=\"translate(4.497720, 4.541938) rotate(34.000000) " +
+    "translate(-4.497720, -4.541938) \" points=\"3.77901778 -0.202295978 " +
+    "4.9740273 -0.171019161 5.21642263 9.28617278 4.02141311 9.25489596\">" +
+    "</polygon></g></g></g></g></g></svg>";
 
-  /**
-   * Returns the iframe pwg url to be used to be used for amp.
-   *
-   * @param {string} environment
-   * @param {string} origin
-   * @return {string} The iframe url
-   */
-  getIframeUrl(environment, origin) {
-    // TODO: These should be compile time constants and not dependent
-    // on the environment.
-    let iframeUrl = `https://pay.google.com/gp/p/ui/pay?origin=${origin}`;
-    if (
-      environment == Constants.Environment.SANDBOX ||
-      environment == Constants.Environment.PREPROD
-    ) {
-      iframeUrl = `https://pay'+  (environment == Constants.Environment.PREPROD ? '-preprod' : '')+  '.sandbox.google.com/gp/p/ui/pay?origin=${origin}`;
-    }
-    return iframeUrl;
-  }
+Constants.GPAY_OFFER_ICON_STYLE = `
+.${Constants.GPAY_OFFER_ICON_CLASS} {
+  position: absolute;
+  right: -5px;
+  top: -5px;
+}
 
-  /**
-   * Close iframe with animation.
-   *
-   * @param {!Element} container
-   * @param {!HTMLIFrameElement} iframe
-   * @private
-   */
-  removeIframeAndContainer_(container, iframe) {
-    const transitionStyle = 'all ' + IFRAME_CLOSE_DURATION_IN_MS + 'ms ease 0s';
-    this.setTransition_(iframe, transitionStyle);
-    iframe.height = '0px';
-    // TODO: This should be replaced by listening to TransitionEnd event
-    setTimeout(() => {
-      if (container.parentNode) {
-        container.parentNode.removeChild(container);
-      }
-    }, IFRAME_CLOSE_DURATION_IN_MS);
-  }
+#ic_loyalty_24px use.hover {
+  fill: #FC853B;
+}
+`;
 
-  /**
-   * @param {!PaymentDataRequest} paymentDataRequest
-   * @return {{container: !Element, iframe:!HTMLIFrameElement}}
-   * @private
-   */
-  injectIframe_(paymentDataRequest) {
-    const containerAndFrame = injectIframe(
-      this.isVerticalCenterExperimentEnabled_(paymentDataRequest)
-        ? Constants.IFRAME_STYLE_CENTER_CLASS
-        : Constants.IFRAME_STYLE_CLASS
-    );
-    const iframe = containerAndFrame['iframe'];
-    const container = containerAndFrame['container'];
-    container.addEventListener(
-      'click',
-      this.closeActionHandler_.bind(this, containerAndFrame)
-    );
-    // Hide iframe and disable resize at initialize.
-    container.style.display = 'none';
-    iframe.style.display = 'none';
-    iframe.height = '0px';
-    const transitionStyle =
-      'all ' + IFRAME_SHOW_UP_DURATION_IN_MS + 'ms ease 0s';
-    this.setTransition_(iframe, transitionStyle);
-    this.shouldHandleResizing_ = false;
-    return containerAndFrame;
-  }
+Constants.GPAY_OFFER_DESCRIPTION_CLASS = 'gpay-offer-description';
 
-  /**
-   * Handler when back button is triggered, should dismiss iframe if present.
-   * @param {{container: !Element, iframe:!HTMLIFrameElement}} containerAndFrame
-   * @private
-   */
-  backButtonHandler_(containerAndFrame) {
-    this.dismissIframe_(containerAndFrame);
-  }
+Constants.GPAY_OFFER_DESCRIPTION_STYLE = `
+@import url(//fonts.googleapis.com/css?family=Google+Sans:500);
+.${Constants.GPAY_OFFER_DESCRIPTION_CLASS} {
+  text-align: center;
+  font: 10px 'Google Sans';
+  margin-top: 2px;
+  margin-bottom: 0px;
+}
 
-  /**
-   * Handler when close action is triggered, will pop history state to close
-   * the iframe.
-   * @param {{container: !Element, iframe:!HTMLIFrameElement}} containerAndFrame
-   * @private
-   */
-  closeActionHandler_(containerAndFrame) {
-    if (containerAndFrame['container'].parentNode) {
-      // Close action only when container is still attached to the page.
-      history.back();
-    }
-  }
+.${Constants.GPAY_OFFER_DESCRIPTION_CLASS}.gpay-btn-clicked {
+  color: #3C4043;
+}
 
-  /**
-   * @param {{container: !Element, iframe:!HTMLIFrameElement}} containerAndFrame
-   * @private
-   */
-  dismissIframe_(containerAndFrame) {
-    // Dismiss iframe only when container is still attached in the page.
-    if (containerAndFrame['container'].parentNode) {
-      // TODO: Think about whether this could be just hide instead of
-      // disconnect and remove, the tricky part is how to handle the case where
-      // payment data request is not the same.
-      this.dismissPromiseResolver_(Promise.reject({'errorCode': 'CANCELED'}));
-      this.removeIframeAndContainer_(
-        containerAndFrame['container'],
-        containerAndFrame['iframe']
-      );
-      this.port_ && this.port_.disconnect();
-    }
-  }
+.${Constants.GPAY_OFFER_DESCRIPTION_CLASS}.short {
+  min-width: 90px;
+  width: 160px;
+}
 
-  /**
-   * @param {!PaymentDataRequest} paymentDataRequest
-   * @return {boolean}
-   * @private
-   */
-  isVerticalCenterExperimentEnabled_(paymentDataRequest) {
-    return (
-      null &&
-      paymentDataRequest['i'] &&
-      paymentDataRequest['i'].renderContainerCenter
-    );
-  }
+.${Constants.GPAY_OFFER_DESCRIPTION_CLASS}.long {
+  min-width: 152px;
+  width: 240px;
+}
+`;
 
-  /**
-   * @param {!Element} container
-   * @param {!HTMLIFrameElement} iframe
-   * @param {!PaymentDataRequest} paymentDataRequest
-   * @private
-   */
-  showContainerAndIframeWithAnimation_(container, iframe, paymentDataRequest) {
-    container.style.display = 'block';
-    iframe.style.display = 'block';
-    setTimeout(() => {
-      // Hard code the apprx height here, it will be resize to expected height
-      // later.
-      iframe.height = '280px';
-      if (this.isVerticalCenterExperimentEnabled_(paymentDataRequest)) {
-        iframe.classList.add(Constants.IFRAME_ACTIVE_CONTAINER_CLASS);
-      }
-      // TODO: This should be handles properly by listening to
-      // TransitionEnd event.
-      setTimeout(() => {
-        this.shouldHandleResizing_ = true;
-        // TODO: Add browser test that catches this.
-        if (this.savedResizePayload_) {
-          this.setTransition_(iframe, this.savedResizePayload_['transition']);
-          iframe.height = this.savedResizePayload_['height'];
-          this.savedResizePayload_ = null;
-        }
-      }, IFRAME_SHOW_UP_DURATION_IN_MS);
-    }, 1);
+/**
+ * Class used for the new gpay button with card info (last 4 digits, card net).
+ *
+ * @const {string}
+ */
+Constants.GPAY_BUTTON_CARD_INFO_CLASS = 'gpay-card-info-btn';
+
+Constants.GPAY_BUTTON_CARD_INFO_BUTTON_STYLE = `
+  .${Constants.GPAY_BUTTON_CARD_INFO_CLASS} {
+    background-origin: content-box;
+    background-position: center center;
+    background-repeat: no-repeat;
+    background-size: contain;
+    border: 0px;
+    border-radius: 4px;
+    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 1px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
+    cursor: pointer;
+    height: 40px;
+    min-height: 40px;
+    padding: 11px 24px;
+    background-color: #000;
+    box-shadow: none;
+    padding: 9px 24px 10px;
+    min-width: 190px;
+    width: 240px;
   }
 
-  /**
-   * @param {!HTMLIFrameElement} iframe
-   * @param {string} transitionStyle
-   * @private
-   */
-  setTransition_(iframe, transitionStyle) {
-    iframe.style.setProperty('transition', transitionStyle);
-    // For safari.
-    iframe.style.setProperty('-webkit-transition', transitionStyle);
+  .${Constants.GPAY_BUTTON_CARD_INFO_CLASS}.active {
+    background-color: #5f6368;
   }
 
-  /**
-   * Use WebActivitiy to open iframe that's in given container.
-   *
-   * @param {!Element} container
-   * @param {!HTMLIFrameElement} iframe
-   * @param {!PaymentDataRequest} paymentDataRequest
-   * @return {!Promise<!PaymentData>}
-   * @private
-   */
-  openIframe_(container, iframe, paymentDataRequest) {
-    if (!paymentDataRequest.swg) {
-      if (!paymentDataRequest.apiVersion) {
-        paymentDataRequest.apiVersion = 1;
-      }
-    }
-    paymentDataRequest.environment = this.environment_;
-    let iframeLoadStartTime;
-    const trustedUrl = this.getIframeUrl(
-      this.environment_,
-      window.location.origin
-    );
-    return this.activities
-      .openIframe(iframe, trustedUrl, paymentDataRequest)
-      .then(port => {
-        // Handle custom resize message.
-        this.port_ = port;
-        port.onMessage(payload => {
-          if (payload['type'] !== 'resize' || !this.shouldHandleResizing_) {
-            // Save the resize event later after initial animation is finished
-            this.savedResizePayload_ = {
-              'height': payload['height'],
-              'transition': payload['transition'],
-            };
-            return;
-          }
-          // b/111310899: Smooth out initial iFrame loading
-          if (!iframeLoadStartTime) {
-            iframeLoadStartTime = Date.now();
-          }
-          if (
-            Date.now() <
-            iframeLoadStartTime + IFRAME_SHOW_UP_DURATION_IN_MS
-          ) {
-            this.setTransition_(
-              iframe,
-              payload['transition'] + ', ' + IFRAME_SMOOTH_HEIGHT_TRANSITION
-            );
-          } else {
-            this.setTransition_(iframe, payload['transition']);
-          }
-          iframe.height = payload['height'];
-        });
-        return /** @type {!Promise<!Object>} */ (port.acceptResult());
-      })
-      .then(
-        /**
-         * @param {!Object} result
-         * @return {!PaymentData}
-         */
-        result => {
-          this.removeIframeAndContainer_(container, iframe);
-          // This is only for popping the state we pushed earlier.
-          history.back();
-          const data = /** @type {!PaymentData} */ (result['data']);
-          return data;
-        },
-        error => {
-          this.removeIframeAndContainer_(container, iframe);
-          // This is only for popping the state we pushed earlier.
-          history.back();
-          return Promise.reject(error);
-        }
-      );
+  .${Constants.GPAY_BUTTON_CARD_INFO_CLASS}.hover {
+    background-color: #3c4043;
   }
-}
+  `;
+
+
+/**
+ * Trusted domain for secure context validation
+ *
+ * @const {string}
+ */
+Constants.TRUSTED_DOMAIN = '.google.com';
 
 /**
  * @license
@@ -12110,343 +12213,302 @@ class PaymentsWebActivityDelegate {
  * limitations under the License.
  */
 
-class UpiHandler {
-  constructor() {}
-
+/**
+ * An implementation of PaymentsClientDelegateInterface that leverages payment
+ * request.
+ * @implements {PaymentsClientDelegateInterface}
+ */
+class PaymentsRequestDelegate {
   /**
-   * Returns upi payment method object if it exists in allowed payment methods
-   * or null if it doesn't
-   *
-   * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
-   * @return {boolean}
+   * @param {string} environment
    */
-  isUpiRequest(request) {
-    return !!getUpiPaymentMethod(request);
+  constructor(environment) {
+    this.environment_ = environment;
+
+    /** @private {?function(!Promise<!PaymentData>)} */
+    this.callback_ = null;
   }
 
-  /**
-   * Returns upi payment method object if it exists in allowed payment methods
-   * or null if it doesn't
-   *
-   * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
-   * @return {!Promise} The promise will contain the boolean result and error
-   *     message when possible.
-   */
-  isReadyToPay(request) {
-    // Always return true for UPI if api version is 2 and chrome supports
-    // payment request
-    if (getUpiPaymentMethod(request)) {
-      if (request.existingPaymentMethodRequired) {
-        return Promise.resolve({'result': true, 'paymentMethodPresent': true});
-      } else {
-        return Promise.resolve({'result': true});
-      }
-    }
-    throw new Error('No Upi payment method found in handler');
+  /** @override */
+  onResult(callback) {
+    this.callback_ = callback;
+  }
+
+  /** @override */
+  isReadyToPay(isReadyToPayRequest) {
+    /** @type{!PaymentRequest} */
+    const paymentRequest = this.createPaymentRequest_(isReadyToPayRequest);
+    return new Promise((resolve, reject) => {
+      paymentRequest.canMakePayment()
+          .then(result => {
+            window.sessionStorage.setItem(
+                Constants.IS_READY_TO_PAY_RESULT_KEY, result.toString());
+            const response = {'result': result};
+            if (isReadyToPayRequest.apiVersion >= 2 &&
+                isReadyToPayRequest.existingPaymentMethodRequired) {
+              // For apiVersion 2, we always use native to only check for
+              // tokenized cards.
+              // For tokenized cards native always does a presence check so
+              // we can say that if canMakePayment is true for native for
+              // tokenizedCards then the user has a payment method which is
+              // present.
+              response['paymentMethodPresent'] = result;
+            }
+            resolve(response);
+          })
+          .catch(function(err) {
+            if (window.sessionStorage.getItem(
+                    Constants.IS_READY_TO_PAY_RESULT_KEY)) {
+              resolve({
+                'result': window.sessionStorage.getItem(
+                              Constants.IS_READY_TO_PAY_RESULT_KEY) == 'true'
+              });
+            } else {
+              resolve({'result': false});
+            }
+          });
+    });
+  }
+
+  /** @override */
+  prefetchPaymentData(paymentDataRequest) {
+    // Creating PaymentRequest instance will call
+    // Gcore isReadyToPay internally which will prefetch tempaltes.
+    this.createPaymentRequest_(
+        paymentDataRequest, this.environment_,
+        paymentDataRequest.transactionInfo.currencyCode,
+        paymentDataRequest.transactionInfo.totalPrice);
+  }
+
+  /** @override */
+  loadPaymentData(paymentDataRequest) {
+    this.loadPaymentDataThroughPaymentRequest_(paymentDataRequest);
   }
 
   /**
-   * Request payment data when payment method is UPI
+   * Create PaymentRequest instance.
    *
-   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
-   *     information to support a payment.
-   * @param {!Object} upiPaymentMethod UPI paymentmethod in
-   *     allowedPaymentMethods array.
-   * @param {!Function} onResultCallback Function to call when everything is
-   *     done.
+   * @param {!IsReadyToPayRequest|!PaymentDataRequest} request The necessary information to check if user is
+   *     ready to pay or to support a payment from merchants.
+   * @param {?string=} environment (optional)
+   * @param {?string=} currencyCode (optional)
+   * @param {?string=} totalPrice (optional)
+   * @return {!PaymentRequest} PaymentRequest instance.
+   * @private
    */
-  loadPaymentData(paymentDataRequest, upiPaymentMethod, onResultCallback) {
-    const parameters = upiPaymentMethod['parameters'];
-    const transactionInfo = paymentDataRequest['transactionInfo'];
-    const supportedInstruments = 
-        [{
-          'supportedMethods': ['https://tez.google.com/pay'],
-          'data': {
-            'pa': parameters['payeeVpa'],
-            'pn': parameters['payeeName'],
-            'tr': parameters['transactionReferenceId'],
-            'url': parameters['referenceUrl'],
-            'mc': parameters['mcc'],
-            'tn': transactionInfo['transactionNote'],
-          },
-        }];
+  createPaymentRequest_(request, environment, currencyCode, totalPrice) {
+    let data = {};
+    if (request) {
+      data = JSON.parse(JSON.stringify(request));
+    }
 
-    if (parameters['transactionId']) {
-      supportedInstruments[0]['data']['tid'] = parameters['transactionId'];
+    // Only set the apiVersion if the merchant doesn't set it.
+    if (!data['apiVersion']) {
+      data['apiVersion'] = 1;
+    }
+
+    // Add allowedPaymentMethods for swg to get through gms core validation.
+    if (data['swg']) {
+      data['allowedPaymentMethods'] = [Constants.PaymentMethod.CARD];
     }
 
+    if (environment && environment == Constants.Environment.TEST) {
+      data['environment'] = environment;
+    }
+
+    const supportedInstruments = [{
+      'supportedMethods': ['https://google.com/pay'],
+      'data': data,
+    }];
+
     const details = {
       'total': {
-        'label': 'Total',
-        'amount': {
-          'currency': transactionInfo['currencyCode'],
-          'value': transactionInfo['totalPrice'],
-        },
-      },
-      'displayItems': [{
-        'label': 'Original Amount',
+        'label': 'Estimated Total Price',
         'amount': {
-          'currency': transactionInfo['currencyCode'],
-          'value': transactionInfo['totalPrice'],
-        },
-      }],
+          // currency and value are required fields in PaymentRequest, but these
+          // fields will never be used since PaymentRequest UI is skipped when
+          // we're the only payment method, so default to some value to by pass
+          // this requirement.
+          'currency': currencyCode || 'USD',
+          'value': totalPrice || '0',
+        }
+      }
     };
 
-    let request = new PaymentRequest(supportedInstruments, details);
-
-    onResultCallback(
-        this.checkCanMakePayment_(request)
-            .then(result => {
-              if (result) {
-                return this.showUi_(request);
-              } else {
-                return this.redirectToGooglePlay_();
-              }
-            })
-            .then(paymentData => {
-              return this.processData_(
-                  paymentData, paymentDataRequest, upiPaymentMethod);
-            })
-            .catch(error => {
-              error['statusCode'] = Constants.ResponseStatus.CANCELED;
-              return Promise.reject(error);
-            }));
+    return new PaymentRequest(supportedInstruments, details);
   }
 
   /**
-   * Show the Tez payment request UI.
-   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
    * @private
-   * @param {!PaymentRequest} request The payment request object.
-   * @return {!Promise<!PaymentData>} A promise containing payment response.
    */
-  showUi_(request) {
-    return request.show().then(paymentResponse => {
-      paymentResponse.complete('success');
-      return paymentResponse.details;
-    });
+  loadPaymentDataThroughPaymentRequest_(paymentDataRequest) {
+    const currencyCode = (paymentDataRequest.transactionInfo &&
+                          paymentDataRequest.transactionInfo.currencyCode) ||
+        undefined;
+    const totalPrice = (paymentDataRequest.transactionInfo &&
+                        paymentDataRequest.transactionInfo.totalPrice) ||
+        undefined;
+    const paymentRequest = this.createPaymentRequest_(
+        paymentDataRequest, this.environment_, currencyCode, totalPrice);
+    this.callback_(
+        /** @type{!Promise<!PaymentData>} */
+        (paymentRequest.show()
+             .then(
+                 /**
+                  * @param {!PaymentResponse} paymentResponse
+                  * @return {!PaymentData}
+                  */
+                 (paymentResponse) => {
+                   // Should be called to dismiss any remaining UI
+                   paymentResponse.complete('success');
+                   return paymentResponse.details;
+                 })
+             .catch(function(err) {
+               err['statusCode'] = Constants.ResponseStatus.CANCELED;
+               throw err;
+             })));
   }
+}
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const MAX_Z_INDEX$1 = 2147483647;
+
+
+class Graypane$1 {
 
   /**
-   * Checks whether can make a payment with Tez on this device.
-   *
-   * @private
-   * @param {!PaymentRequest} request The payment request object.
-   * @return {!Promise<boolean>} a promise containing the result of whether can
-   *     make payment.
+   * @param {!Document} doc
    */
-  checkCanMakePayment_(request) {
-    // Checks canMakePayment cache, and use the cache result if it exists.
-    const cacheResult =
-        window.sessionStorage.getItem(Constants.UPI_CAN_MAKE_PAYMENT_CACHE_KEY);
-    if (cacheResult) {
-      return Promise.resolve(cacheResult === 'true');
-    }
+  constructor(doc) {
+    /** @private @const {!Document} */
+    this.doc_ = doc;
 
-    // Feature detect canMakePayment().
-    if (!request.canMakePayment) {
-      return Promise.resolve(true);
-    }
+    /** @private @const {!Element} */
+    this.element_ = doc.createElement(Constants.GPAY_GRAYPANE);
+    setImportantStyles$1(this.element_, {
+      'z-index': MAX_Z_INDEX$1,
+      'display': 'none',
+      'position': 'fixed',
+      'top': 0,
+      'right': 0,
+      'bottom': 0,
+      'left': 0,
+      'background-color': 'rgba(32, 33, 36, .6)',
+    });
 
-    let canMakePaymentPromise = request.canMakePayment();
+    /** @private {?Window} */
+    this.popupWindow_ = null;
 
-    return canMakePaymentPromise.then(result => {
-      // Store the result in cache if the result is true to avoid quota error
-      // caused by querying multiple times with different data.
-      // Doesn't store false because if we do so, user will be redirected to
-      // Google Play again after installing Google Pay if Chrome is not closed.
-      if (result) {
-        window.sessionStorage.setItem(
-            Constants.UPI_CAN_MAKE_PAYMENT_CACHE_KEY, result.toString());
+    this.element_.addEventListener('click', () => {
+      if (this.popupWindow_) {
+        try {
+          this.popupWindow_.focus();
+        } catch (e) {
+          // Ignore error.
+        }
       }
-      return result;
     });
   }
 
   /**
-   * Redirect user to Google Pay app in Google Play store
-   *
-   * @private
-   * @returns {!Promise<!Object>} Rejected promise with error message
+   * Shows the graypane.
+   * @param {?Window|undefined} popupWindow
+   * @return {!Promise}
    */
-  redirectToGooglePlay_() {
-    window.location.replace(
-          // NOLINT
-            'https://play.google.com/store/apps/details?id=com.google.android.apps.nbu.paisa.user');  // NOLINT
-    return Promise.reject(
-        {'errorMessage': 'Cannot redirect to Tez page in Google Play.'});
+  show(popupWindow) {
+    this.popupWindow_ = popupWindow || null;
+    this.doc_.body.appendChild(this.element_);
+    setImportantStyles$1(this.element_, {
+      'display': 'block',
+      'opacity': 0,
+    });
+    return transition$1(this.element_, {
+      'opacity': 1,
+    }, 300, 'ease-out');
   }
 
   /**
-   * Convert Tez payment data to GPay payment data if payment succeeded, or
-   * reject if payment failed
-   *
-   * @private
-   * @param {!PaymentData} tezPaymentData The payment data object from Tez.
-   * @param {!PaymentDataRequest} paymentDataRequest The payment data request.
-   * @param {!Object} upiPaymentMethod UPI paymentmethod in
-   * allowedPaymentMethods array
-   * @returns {!Promise<PaymentData>} A promise containing payment data or
-   *     error message.
+   * Hides the graypane.
+   * @return {!Promise|undefined}
    */
-  processData_(tezPaymentData, paymentDataRequest, upiPaymentMethod) {
-    const tezResponse = JSON.parse(tezPaymentData['tezResponse']);
-    if (tezResponse['Status'] === 'FAILURE') {
-      let error;
-      switch (tezResponse['responseCode']) {
-        case 'ZM':
-          // payment failure due to invalid MPIN
-          error = {
-            'errorCode': PublicErrorCode.BUYER_ACCOUNT_ERROR,
-            'errorMessage': 'Payment failure due to invalid MPIN.'
-          };
-          break;
-        case 'Z9':
-          // payment failure due to insufficient funds
-          error = {
-            'errorCode': PublicErrorCode.BUYER_ACCOUNT_ERROR,
-            'errorMessage': 'Payment failure due to insufficient funds.'
-          };
-          break;
-        case '91':
-          // payment failure due to transaction timeout or connection issue
-          error = {
-            'errorCode': PublicErrorCode.INTERNAL_ERROR,
-            'errorMessage':
-                'Payment failure due to transaction timeout or connection' +
-                ' issue.'
-          };
-          break;
-        default:
-          // payment failure due to user cancel or other issues
-          error = {'errorMessage': 'Payment cancelled.'};
-      }
-      return Promise.reject(error);
-    }
-
-    const signedMessage = {
-      'paymentMethodType': 'UPI',
-      'payeeVpa': upiPaymentMethod['parameters']['payeeVpa'],
-      'status': tezResponse['Status'],
-      'transactionReferenceId':
-          upiPaymentMethod['parameters']['transactionReferenceId'],
-      'transactionId': upiPaymentMethod['parameters']['transactionId'] ?
-          upiPaymentMethod['parameters']['transactionId'] :
-          tezResponse['txnId'],
-      'transactionInfo': paymentDataRequest['transactionInfo'],
-    };
-
-    let paymentData = {
-      'apiVersion': paymentDataRequest['apiVersion'],
-      'apiVersionMinor': paymentDataRequest['apiVersionMinor'],
-      'paymentMethodData': {
-        'type': upiPaymentMethod['type'],
-        'tokenizationData': {
-          'type': 'DIRECT',
-          'token': {
-            'protocolVersion': 'ECv1',
-            // TODO: Verify that response comes from tez and
-            // add signature and encrypt signed message here
-            'signature': '',
-            'signedMessage': signedMessage
-          }
-        }
-      }
-    };
-    return Promise.resolve(paymentData);
+  hide() {
+    this.popupWindow_ = null;
+    if (!this.element_.parentElement) {
+      // Has already been removed or haven't been even added to DOM.
+      // This could be possible after redirect.
+      return;
+    }
+    return transition$1(this.element_, {
+      'opacity': 0,
+    }, 300, 'ease-out').then(() => {
+      setImportantStyles$1(this.element_, {'display': 'none'});
+      this.doc_.body.removeChild(this.element_);
+    });
   }
 }
 
-/** @license
-Math.uuid.js (v1.4)
-http://www.broofa.com
-mailto:robert@broofa.com
-Copyright (c) 2010 Robert Kieffer
-Dual licensed under the MIT and GPL licenses.
-*/
 
-/*
- * Generate a random uuid.
- *
- * USAGE: Math.uuid(length, radix)
- *   length - the desired number of characters
- *   radix  - the number of allowable values for each character.
- *
- * EXAMPLES:
- *   // No arguments  - returns RFC4122, version 4 ID
- *   >>> Math.uuid()
- *   "92329D39-6F5C-4520-ABFC-AAB64544E172"
+/**
+ * Sets the CSS styles of the specified element with !important. The styles
+ * are specified as a map from CSS property names to their values.
  *
- *   // One argument - returns ID of the specified length
- *   >>> Math.uuid(15)     // 15 character ID (default base=62)
- *   "VcydxgltxrVZSTV"
+ * The `!important` styles are used to avoid accidental specificity overrides
+ * from the 3p page's stylesheet.
  *
- *   // Two arguments - returns ID of the specified length, and radix. (Radix must be <= 62)
- *   >>> Math.uuid(8, 2)  // 8 character ID (base=2)
- *   "01001010"
- *   >>> Math.uuid(8, 10) // 8 character ID (base=10)
- *   "47473046"
- *   >>> Math.uuid(8, 16) // 8 character ID (base=16)
- *   "098F4D35"
+ * @param {!Element} element
+ * @param {!Object<string, string|number>} styles
  */
+function setImportantStyles$1(element, styles) {
+  for (const k in styles) {
+    element.style.setProperty(k, styles[k].toString(), 'important');
+  }
+}
 
-class Random_uuid {}  // Private array of chars to use
-  var CHARS$1 = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
-
-  Random_uuid.uuid = function (len, radix) {
-    var chars = CHARS$1, uuid = [], i;
-    radix = radix || chars.length;
-
-    if (len) {
-      // Compact form
-      for (i = 0; i < len; i++) uuid[i] = chars[0 | Math.random()*radix];
-    } else {
-      // rfc4122, version 4 form
-      var r;
-
-      // rfc4122 requires these characters
-      uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-';
-      uuid[14] = '4';
-
-      // Fill in random data.  At i==19 set the high bits of clock sequence as
-      // per rfc4122, sec. 4.1.5
-      for (i = 0; i < 36; i++) {
-        if (!uuid[i]) {
-          r = 0 | Math.random()*16;
-          uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
-        }
-      }
-    }
-
-    return uuid.join('');
-  };
-
-  // A more performant, but slightly bulkier, RFC4122v4 solution.  We boost performance
-  // by minimizing calls to random()
-  Random_uuid.uuidFast = function() {
-    var chars = CHARS$1, uuid = new Array(36), rnd=0, r;
-    for (var i = 0; i < 36; i++) {
-      if (i==8 || i==13 ||  i==18 || i==23) {
-        uuid[i] = '-';
-      } else if (i==14) {
-        uuid[i] = '4';
-      } else {
-        if (rnd <= 0x02) rnd = 0x2000000 + (Math.random()*0x1000000)|0;
-        r = rnd & 0xf;
-        rnd = rnd >> 4;
-        uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
-      }
-    }
-    return uuid.join('');
-  };
 
-  // A more compact, but less performant, RFC4122v4 solution:
-  Random_uuid.uuidCompact = function() {
-    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
-      var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
-      return v.toString(16);
+/**
+ * Returns a promise which is resolved after the given duration of animation
+ * @param {!Element} el - Element to be observed.
+ * @param {!Object<string, string|number>} props - properties to be animated.
+ * @param {number} durationMillis - duration of animation.
+ * @param {string} curve - transition function for the animation.
+ * @return {!Promise} Promise which resolves once the animation is done playing.
+ */
+function transition$1(el, props, durationMillis, curve) {
+  const win = el.ownerDocument.defaultView;
+  const previousTransitionValue = el.style.transition || '';
+  return new Promise(resolve => {
+    win.setTimeout(() => {
+      win.setTimeout(resolve, durationMillis);
+      const tr = `${durationMillis}ms ${curve}`;
+      setImportantStyles$1(el, Object.assign({
+        'transition': `transform ${tr}, opacity ${tr}`,
+      }, props));
     });
-  };
+  }).then(() => {
+    // Stop transition and make sure that the final properties get set.
+    setImportantStyles$1(el, Object.assign({
+      'transition': previousTransitionValue,
+    }, props));
+  });
+}
 
 /**
  * @license
@@ -12466,13 +12528,25 @@ class Random_uuid {}  // Private array of chars to use
  */
 
 /**
- * Returns a google transaction id.
- *
- * @param {string} environment
- * @return {string}
+ * Service wrapping window.parent.postMessage. This enables
+ * window.postMessage to be swapped out in unit tests.
  */
-function createGoogleTransactionId(environment) {
-  return Random_uuid.uuidFast() + '.' + environment;
+class PostMessageService {
+  constructor(window) {
+    /** @private @const {!Window} */
+    this.window_ = window;
+  }
+
+  /**
+   * Passthrough to Window#postMessage. See Window#postMessage DOM API
+   * documentation for more information about arguments.
+   *
+   * @param {!Object} message
+   * @param {string} targetOrigin
+   */
+  postMessage(message, targetOrigin) {
+    this.window_.postMessage(message, targetOrigin);
+  }
 }
 
 /**
@@ -12492,489 +12566,340 @@ function createGoogleTransactionId(environment) {
  * limitations under the License.
  */
 
-const TRUSTED_DOMAINS = [
-  'actions.google.com',
-  'amp-actions.sandbox.google.com',
-  'amp-actions-staging.sandbox.google.com',
-  'amp-actions-autopush.sandbox.google.com',
-  'payments.developers.google.com',
-  'payments.google.com',
-];
-
 /**
- * The client for interacting with the Google Payment APIs.
- * <p>
- * The async refers to the fact that this client supports redirects
- * when using webactivties.
- * <p>
- * If you are using this be sure that this is what you want.
- * <p>
- * In almost all cases PaymentsClient is the better client to use because
- * it exposes a promises based api which is easier to deal with.
- * @final
+ * Supported interactions between iframe and merchant page.
+ *
+ * @enum {number}
  */
-class PaymentsAsyncClient {
-  /**
-   * @param {!PaymentOptions} paymentOptions
-   * @param {function(!Promise<!PaymentData>)} onPaymentResponse
-   * @param {boolean=} useIframe
-   * @param {!ActivityPorts=} activities Can be used to provide a shared
-   *   activities manager. By default, the new manager is created.
-   */
-  constructor(paymentOptions, onPaymentResponse, useIframe, activities) {
-    this.onPaymentResponse_ = onPaymentResponse;
-
-    validatePaymentOptions(paymentOptions);
+// Next Id: 10
+const PostMessageEventType = {
+  IS_READY_TO_PAY: 6,
+  LOG_BUTTON_CLICK: 5,
+  LOG_IS_READY_TO_PAY_API: 0,
+  LOG_LOAD_PAYMENT_DATA_API: 1,
+  LOG_RENDER_BUTTON: 2,
+  LOG_INITIALIZE_PAYMENTS_CLIENT: 9,
+  LOG_PAY_FRAME_REQUESTED: 15,
+  LOG_PAY_FRAME_LOADED: 16,
+  LOG_PAY_FRAME_LOADED_WITH_ALL_JS: 17,
+  LOG_INLINE_PAYMENT_WIDGET_INITIALIZE: 4,
+  LOG_INLINE_PAYMENT_WIDGET_SUBMIT: 3,
+  LOG_INLINE_PAYMENT_WIDGET_DISPLAYED: 7,
+  LOG_INLINE_PAYMENT_WIDGET_HIDDEN: 8,
+};
 
-    /** @private {?number} */
-    this.loadPaymentDataApiStartTimeMs_ = null;
+/**
+ * Types of buy flow activity modes.
+ *
+ * @enum {number}
+ */
+const BuyFlowActivityMode = {
+  UNKNOWN_MODE: 0,
+  IFRAME: 1,
+  POPUP: 2,
+  REDIRECT: 3,
+  ANDROID_NATIVE: 4,
+  PAYMENT_HANDLER: 5,
+};
 
-    /** @private @const {string} */
-    this.environment_ =
-      paymentOptions.environment || Constants.Environment.TEST;
-    if (!PaymentsAsyncClient.googleTransactionId_) {
-      PaymentsAsyncClient.googleTransactionId_ =
-        /** @type {string} */ (this.isInTrustedDomain_() &&
-        paymentOptions['i'] &&
-        paymentOptions['i']['googleTransactionId']
-          ? paymentOptions['i']['googleTransactionId']
-          : createGoogleTransactionId(this.environment_));
-    }
+/**
+ * Types of buy flow activity modes.
+ *
+ * @enum {number}
+ */
+const PublicErrorCode = {
+  UNKNOWN_ERROR_TYPE: 0,
+  INTERNAL_ERROR: 1,
+  DEVELOPER_ERROR: 2,
+  BUYER_ACCOUNT_ERROR: 3,
+  MERCHANT_ACCOUNT_ERROR: 4,
+  UNSUPPORTED_API_VERSION: 5,
+  BUYER_CANCEL: 6,
+};
 
-    /** @private @const {!PaymentOptions} */
-    this.paymentOptions_ = paymentOptions;
+/**
+ * The presentation mode of the buy flow
+ *
+ * @enum {number}
+ */
+const BuyFlowMode = {
+  PAY_WITH_GOOGLE: 5,
+  SUBSCRIBE_WITH_GOOGLE: 6,
+};
 
-    /** @private @const {!PaymentsClientDelegateInterface} */
-    this.webActivityDelegate_ = new PaymentsWebActivityDelegate(
-      this.environment_,
-      PaymentsAsyncClient.googleTransactionId_,
-      useIframe,
-      activities,
-      paymentOptions['i'] && paymentOptions['i']['redirectKey']
-    );
+/**
+ * Iframe used for logging and prefetching.
+ *
+ * @type {?Element}
+ */
+let iframe = null;
 
-    /** @private {number} */
-    this.buyFlowMode_ = BuyFlowMode.PAY_WITH_GOOGLE;
+/** @type {?PostMessageService} */
+let postMessageService = null;
 
-    const paymentRequestSupported = chromeSupportsPaymentRequest();
-    // TODO: Remove the temporary hack that disable payments
-    // request for inline flow.
-    /** @private @const {?PaymentsClientDelegateInterface} */
-    this.delegate_ =
-      paymentRequestSupported && !useIframe
-        ? new PaymentsRequestDelegate(this.environment_)
-        : this.webActivityDelegate_;
+/** @type {?string} */
+let environment = null;
 
-    this.upiHandler_ = new UpiHandler();
+/** @type {?string} */
+let googleTransactionId = null;
 
-    this.webActivityDelegate_.onResult(this.onResult_.bind(this));
-    this.delegate_.onResult(this.onResult_.bind(this));
+/** @type {number} */
+let originTimeMs = Date.now();
 
-    // If web delegate is used anyway then this is overridden in the web
-    // activity delegate when load payment data is called.
-    if (chromeSupportsPaymentHandler()) {
-      PayFrameHelper.setBuyFlowActivityMode(
-        BuyFlowActivityMode.PAYMENT_HANDLER
-      );
-    } else if (paymentRequestSupported) {
-      PayFrameHelper.setBuyFlowActivityMode(BuyFlowActivityMode.ANDROID_NATIVE);
-    }
+/** @type {?BuyFlowActivityMode} */
+let buyFlowActivityMode = null;
 
-    PayFrameHelper.setGoogleTransactionId(
-      PaymentsAsyncClient.googleTransactionId_
-    );
-    PayFrameHelper.postMessage({
-      'eventType': PostMessageEventType.LOG_INITIALIZE_PAYMENTS_CLIENT,
-      'clientLatencyStartMs': Date.now(),
-    });
+/** @type {boolean} */
+let iframeLoaded = false;
 
-    window.addEventListener('message', event =>
-      this.handleMessageEvent_(event)
-    );
-  }
+/** @type {!Array<!Object>} */
+let buffer = [];
 
+class PayFrameHelper {
   /**
-   * Check whether the user can make payments using the Payment API.
-   *
-   * @param {!IsReadyToPayRequest} isReadyToPayRequest
-   * @return {!Promise} The promise will contain the boolean result and error
-   *     message when possible.
-   * @export
+   * Creates a hidden iframe for logging and appends it to the top level
+   * document.
    */
-  isReadyToPay(isReadyToPayRequest) {
-    // Merge with paymentOptions, preferring values from isReadyToPayRequest
-    if (isReadyToPayRequest) {
-      isReadyToPayRequest = Object.assign(
-        {},
-        this.paymentOptions_,
-        isReadyToPayRequest
-      );
-    }
-    const startTimeMs = Date.now();
-    /** @type {?string} */
-    const errorMessage =
-      validateSecureContext() ||
-      validateIsReadyToPayRequest(isReadyToPayRequest);
-    if (errorMessage) {
-      return new Promise((resolve, reject) => {
-        PaymentsAsyncClient.logDevErrorToConsole_('isReadyToPay', errorMessage);
-        PayFrameHelper.postMessage({
-          'eventType': PostMessageEventType.LOG_IS_READY_TO_PAY_API,
-          'error': PublicErrorCode.DEVELOPER_ERROR,
-        });
-        reject({
-          'statusCode': Constants.ResponseStatus.DEVELOPER_ERROR,
-          'statusMessage': errorMessage,
-        });
-      });
+  static load() {
+    if (iframe) {
+      return;
     }
-
-    const isReadyToPayPromise = this.isReadyToPay_(isReadyToPayRequest);
-
-    isReadyToPayPromise.then(response => {
+    const initOptions =
+        /** @type {!PaymentOptions} */ (window['gpayInitParams']) || {};
+    environment = initOptions.environment || Constants.Environment.PRODUCTION;
+    iframe = document.createElement('iframe');
+    // Pass in origin because document.referrer inside iframe is empty in
+    // certain cases
+    // Can be replaced by iframe.src=... in non Google context.
+    iframe.src = PayFrameHelper.getIframeUrl_(
+            window.location.origin,
+            initOptions.merchantInfo && initOptions.merchantInfo.merchantId);
+    PayFrameHelper.postMessage({
+      'eventType': PostMessageEventType.LOG_PAY_FRAME_REQUESTED,
+      'clientLatencyStartMs': Date.now(),
+    });
+    iframe.height = '0';
+    iframe.width = '0';
+    iframe.style.display = 'none';
+    iframe.style.visibility = 'hidden';
+    iframe.onload = function() {
       PayFrameHelper.postMessage({
-        'eventType': PostMessageEventType.LOG_IS_READY_TO_PAY_API,
-        'clientLatencyStartMs': startTimeMs,
-        'isReadyToPayApiResponse': response,
+        'eventType': PostMessageEventType.LOG_PAY_FRAME_LOADED_WITH_ALL_JS,
+        'clientLatencyStartMs': Date.now(),
       });
-      return response;
-    });
-    return isReadyToPayPromise;
+      PayFrameHelper.iframeLoaded();
+    };
+    // If the body is already loaded, just append the iframe. Otherwise, we wait
+    // until the DOM has loaded to append the iframe, otherwise document.body is
+    // null.
+    if (document.body) {
+      PayFrameHelper.initialize_();
+    } else {
+      document.addEventListener(
+          'DOMContentLoaded', () => PayFrameHelper.initialize_());
+    }
   }
 
   /**
-   * Actual implementation of isReadyToPay in a private method so that
-   * we can add callbacks to the promise to measure latencies.
-   *
-   * @param {!IsReadyToPayRequest} isReadyToPayRequest
-   * @return {!Promise} The promise will contain the boolean result and error
-   *     message when possible.
+   * Appends the iframe to the DOM and updates the post message service.
    * @private
    */
-  isReadyToPay_(isReadyToPayRequest) {
-    if (this.upiHandler_.isUpiRequest(isReadyToPayRequest)) {
-      return this.upiHandler_.isReadyToPay(isReadyToPayRequest);
-    }
-    if (
-      chromeSupportsPaymentRequest() &&
-      !isNativeDisabledInRequest(isReadyToPayRequest)
-    ) {
-      if (isReadyToPayRequest.apiVersion >= 2) {
-        return this.isReadyToPayApiV2ForChromePaymentRequest_(
-          isReadyToPayRequest
-        );
-      } else {
-        // This is the apiVersion 1 branch.
-        // If the merchant supports only Tokenized cards then just rely on
-        // delegate to give us the result.
-        // This will need to change once b/78519188 is fixed.
-        const webPromise = this.webActivityDelegate_.isReadyToPay(
-          isReadyToPayRequest
-        );
-        const nativePromise = this.delegate_.isReadyToPay(isReadyToPayRequest);
-        if (
-          doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest) &&
-          !chromeSupportsPaymentHandler()
-        ) {
-          return nativePromise;
-        }
-        // Return webIsReadyToPay only if delegateIsReadyToPay has been
-        // executed.
-        return nativePromise.then(() => webPromise);
-      }
-    }
-    const webPromise = this.webActivityDelegate_.isReadyToPay(
-      isReadyToPayRequest
-    );
-    return webPromise;
+  static initialize_() {
+    document.body.appendChild(iframe);
+    postMessageService = new PostMessageService(iframe.contentWindow);
   }
 
   /**
-   * Handle is ready to pay for api v2.
+   * Sends a message to the iframe and wait for a response.
+   * Uses the responseHandler specified only if the responseType is a match.
    *
-   * @param {!IsReadyToPayRequest} isReadyToPayRequest
-   * @return {!Promise} The promise will contain the boolean result and error
-   *     message when possible.
-   * @private
+   * @param {!Object} data
+   * @param {!PostMessageEventType} eventType
+   * @param {string} responseType
+   * @param {function(!Event)} responseHandler
    */
-  isReadyToPayApiV2ForChromePaymentRequest_(isReadyToPayRequest) {
-    let defaultPromise = Promise.resolve({'result': false});
-    if (isReadyToPayRequest.existingPaymentMethodRequired) {
-      defaultPromise = Promise.resolve({
-        'result': false,
-        'paymentMethodPresent': false,
-      });
-    }
-
-    let nativePromise = defaultPromise;
-    if (
-      apiV2DoesMerchantSupportSpecifiedCardType(
-        isReadyToPayRequest,
-        Constants.AuthMethod.CRYPTOGRAM_3DS
-      )
-    ) {
-      // If the merchant supports tokenized cards.
-      // Make a separate call to gms core to check if the user isReadyToPay
-      // with just tokenized cards. We can't pass in PAN_ONLY here
-      // because gms core always returns true for PAN_ONLY.
-      // Leave other payment methods as is.
-      const nativeRtpRequest /** @type {!IsReadyToPayRequest} */ = JSON.parse(
-        JSON.stringify(isReadyToPayRequest)
-      );
-      for (let i = 0; i < nativeRtpRequest.allowedPaymentMethods.length; i++) {
-        if (
-          nativeRtpRequest.allowedPaymentMethods[i].type ==
-          Constants.PaymentMethod.CARD
-        ) {
-          nativeRtpRequest.allowedPaymentMethods[i].parameters[
-            'allowedAuthMethods'
-          ] = [Constants.AuthMethod.CRYPTOGRAM_3DS];
-        }
-      }
-
-      nativePromise = this.delegate_.isReadyToPay(nativeRtpRequest);
-    }
-
-    let webPromise = defaultPromise;
-    if (
-      apiV2DoesMerchantSupportSpecifiedCardType(
-        isReadyToPayRequest,
-        Constants.AuthMethod.PAN_ONLY
-      )
-    ) {
-      webPromise = this.webActivityDelegate_.isReadyToPay(isReadyToPayRequest);
-    }
-
-    // Update session storage with payment handler canMakePayment result but
-    // rely on web delegate for actual response
-    if (chromeSupportsPaymentHandler()) {
-      return nativePromise.then(() => webPromise);
+  static sendAndWaitForResponse(
+      data, eventType, responseType, responseHandler) {
+    function callback(event) {
+      if (event.data[responseType]) {
+        responseHandler(event);
+        // We only want to process the response from the payframe once.
+        // so stop listening to the event once processed.
+        PayFrameHelper.removeMessageEventListener_(callback);
+      }
     }
 
-    return nativePromise.then(nativeResult => {
-      if ((nativeResult && nativeResult['result']) == true) {
-        return nativeResult;
-      }
-      return webPromise;
-    });
+    PayFrameHelper.addMessageEventListener_(callback);
+
+    const postMessageData = Object.assign({'eventType': eventType}, data);
+    PayFrameHelper.postMessage(postMessageData);
   }
 
   /**
-   * Prefetch paymentData to speed up loadPaymentData call. Note the provided
-   * paymentDataRequest should exactly be the same as provided in
-   * loadPaymentData to make the loadPaymentData call fast since current
-   * web flow prefetching is based on the full request parameters.
+   * Add an event listener for listening to messages received.
    *
-   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
-   *     information to support a payment.
-   * @export
+   * @param {function(!Event)} callback
+   * @private
    */
-  prefetchPaymentData(paymentDataRequest) {
-    /** @type {?string} */
-    const errorMessage =
-      validateSecureContext() || validatePaymentDataRequest(paymentDataRequest);
-    if (errorMessage) {
-      PaymentsAsyncClient.logDevErrorToConsole_(
-        'prefetchPaymentData',
-        errorMessage
-      );
-      return;
-    }
-    this.assignInternalParams_(paymentDataRequest);
-    if (
-      chromeSupportsPaymentRequest() &&
-      !isNativeDisabledInRequest(paymentDataRequest)
-    ) {
-      this.delegate_.prefetchPaymentData(paymentDataRequest);
-    } else {
-      // For non chrome supports always use the hosting page.
-      this.webActivityDelegate_.prefetchPaymentData(paymentDataRequest);
-    }
+  static addMessageEventListener_(callback) {
+    window.addEventListener('message', callback);
   }
 
   /**
-   * Request PaymentData, which contains necessary infomartion to complete a
-   * payment.
+   * Remove the event listener for listening to messages.
    *
-   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
-   *     information to support a payment.
-   * @export
+   * @param {function(!Event)} callback
+   * @private
    */
-  loadPaymentData(paymentDataRequest) {
-    PayFrameHelper.postMessage({
-      'eventType': PostMessageEventType.LOG_BUTTON_CLICK,
-    });
-    const errorMessage =
-      validateSecureContext() || validatePaymentDataRequest(paymentDataRequest);
-    this.buyFlowMode_ =
-      paymentDataRequest && paymentDataRequest.swg
-        ? BuyFlowMode.SUBSCRIBE_WITH_GOOGLE
-        : BuyFlowMode.PAY_WITH_GOOGLE;
-    if (errorMessage) {
-      this.onPaymentResponse_(
-        new Promise((resolve, reject) => {
-          PayFrameHelper.postMessage({
-            'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
-            'error': PublicErrorCode.DEVELOPER_ERROR,
-            'buyFlowMode': this.buyFlowMode_,
-          });
-          PaymentsAsyncClient.logDevErrorToConsole_(
-            'loadPaymentData',
-            errorMessage
-          );
-          reject({
-            'statusCode': Constants.ResponseStatus.DEVELOPER_ERROR,
-            'statusMessage': errorMessage,
-          });
-        })
-      );
-      return;
-    }
+  static removeMessageEventListener_(callback) {
+    window.removeEventListener('message', callback);
+  }
 
-    // Handler for UPI PaymentMethod
-    // Currently we don't support UPI along with other payment methods, if
-    // UPI is in payment methods then we assume it is UPI only.
-    const upiPaymentMethod = getUpiPaymentMethod(paymentDataRequest);
-    if (upiPaymentMethod) {
-      this.upiHandler_.loadPaymentData(
-        paymentDataRequest,
-        upiPaymentMethod,
-        this.onResult_.bind(this)
-      );
+  /**
+   * Posts a message to the iframe with the given data.
+   *
+   * @param {!Object} data
+   */
+  static postMessage(data) {
+    if (!iframeLoaded) {
+      buffer.push(data);
       return;
     }
+    const postMessageData = Object.assign(
+        {
+          'buyFlowActivityMode': buyFlowActivityMode,
+          'googleTransactionId': googleTransactionId,
+          'originTimeMs': originTimeMs,
+        },
+        data);
+    postMessageService.postMessage(
+        postMessageData, PayFrameHelper.getIframeOrigin_());
+  }
 
-    const isReadyToPayResult = window.sessionStorage.getItem(
-      Constants.IS_READY_TO_PAY_RESULT_KEY
-    );
-    this.loadPaymentDataApiStartTimeMs_ = Date.now();
-    this.assignInternalParams_(paymentDataRequest);
-    // We want to fall back to the web delegate if payment handler is supported
-    // and isReadyToPay bit is not explicitly set to true (fallback to web if
-    // isReadyToPay wasn't called for PH)
-    if (
-      (chromeSupportsPaymentHandler() && isReadyToPayResult !== 'true') ||
-      isNativeDisabledInRequest(paymentDataRequest)
-    ) {
-      this.webActivityDelegate_.loadPaymentData(paymentDataRequest);
-    } else {
-      this.delegate_.loadPaymentData(paymentDataRequest);
-    }
+  /**
+   * Sets the activity mode.
+   *
+   * @param {!BuyFlowActivityMode} mode
+   */
+  static setBuyFlowActivityMode(mode) {
+    buyFlowActivityMode = mode;
   }
 
   /**
-   * Log developer error to console.
+   * Sets the google transaction id.
    *
-   * @param {string} apiName
-   * @param {?string} errorMessage
-   * @private
+   * @param {string} txnId
    */
-  static logDevErrorToConsole_(apiName, errorMessage) {
-    console.error('DEVELOPER_ERROR in ' + apiName + ' : ' + errorMessage);
+  static setGoogleTransactionId(txnId) {
+    googleTransactionId = txnId;
   }
 
   /**
-   * Return a <div> element containing a Google Pay payment button.
+   * Sets the originTimeMs. To be used only for tests.
    *
-   * @param {!ButtonOptions=} options
-   * @return {!Element}
-   * @export
+   * @param {number} originTimeMsTemp
    */
-  createButton(options = {}) {
-    const button = null;
-    // Only log if button was created successfully
-    const startTimeMs = Date.now();
-    PayFrameHelper.postMessage({
-      'eventType': PostMessageEventType.LOG_RENDER_BUTTON,
-      'clientLatencyStartMs': startTimeMs,
+  static setOriginTimeMs(originTimeMsTemp) {
+    originTimeMs = originTimeMsTemp;
+  }
+
+  /**
+   * Override postMessageService for testing.
+   *
+   * @param {!PostMessageService} messageService
+   */
+  static setPostMessageService(messageService) {
+    postMessageService = messageService;
+  }
+
+  /**
+   * Clears the singleton variables.
+   */
+  static reset() {
+    iframe = null;
+    buffer.length = 0;
+    iframeLoaded = false;
+    buyFlowActivityMode = null;
+  }
+
+  /**
+   * Sets whether the iframe has been loaded or not.
+   *
+   * @param {boolean} loaded
+   */
+  static setIframeLoaded(loaded) {
+    iframeLoaded = loaded;
+  }
+
+  /**
+   * Called whenever the iframe is loaded.
+   */
+  static iframeLoaded() {
+    iframeLoaded = true;
+    buffer.forEach(function(data) {
+      PayFrameHelper.postMessage(data);
     });
-    return button;
+    buffer.length = 0;
   }
 
   /**
-   * @param {!Event} e postMessage event from the AMP page.
-   * @private
+   * Returns the events that have been buffered.
+   *
+   * @return {!Array<!Object>}
    */
-  handleMessageEvent_(e) {
-    if (this.isInTrustedDomain_()) {
-      // Only handles the event right now if loaded in trusted domain.
-      if (e.data['name'] === 'logPaymentData') {
-        PayFrameHelper.postMessage(e.data['data']);
-      }
-    }
+  static getBuffer() {
+    return buffer;
   }
 
   /**
-   * @private
-   * @return {boolean}
+   * Mocks the iframe as an arbitrary html element instead of actually injecting
+   * it for testing.
    */
-  isInTrustedDomain_() {
-    return TRUSTED_DOMAINS.indexOf(window.location.hostname) != -1;
+  static injectIframeForTesting() {
+    PayFrameHelper.reset();
+    iframe = document.createElement('p');
+    PayFrameHelper.iframeLoaded();
   }
 
   /**
-   * Called when load payment data result is returned. This triggers the payment
-   * response callback passed to the client.
+   * Returns the payframe origin based on the environment.
    *
+   * @return {string}
    * @private
    */
-  onResult_(response) {
-    response
-      .then(result => {
-        PayFrameHelper.postMessage({
-          'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
-          'clientLatencyStartMs': this.loadPaymentDataApiStartTimeMs_,
-          'buyFlowMode': this.buyFlowMode_,
-        });
-      })
-      .catch(result => {
-        if (result['errorCode']) {
-          PayFrameHelper.postMessage({
-            'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
-            'error': /** @type {!PublicErrorCode} */ (result['errorCode']),
-            'buyFlowMode': this.buyFlowMode_,
-          });
-        } else {
-          // If user closes window we don't get a error code
-          PayFrameHelper.postMessage({
-            'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
-            'error': PublicErrorCode.BUYER_CANCEL,
-            'buyFlowMode': this.buyFlowMode_,
-          });
-        }
-      });
-    this.onPaymentResponse_(response);
+  static getIframeOrigin_() {
+    let iframeUrl = 'https://pay';
+    if (environment == Constants.Environment.SANDBOX) {
+      iframeUrl += '.sandbox';
+    } else if (environment == Constants.Environment.PREPROD) {
+      iframeUrl += '-preprod.sandbox';
+    }
+    return iframeUrl + '.google.com';
   }
 
   /**
-   * @param {!PaymentDataRequest} paymentDataRequest
-   * @return {!PaymentDataRequest}
+   * Returns the payframe URL based on the environment.
+   *
+   * @param {string} origin The origin that is opening the payframe.
+   * @param {string|null=} merchantId The merchant id.
+   * @return {string}
    * @private
    */
-  assignInternalParams_(paymentDataRequest) {
-    const internalParam = {
-      'startTimeMs': Date.now(),
-      'googleTransactionId': PaymentsAsyncClient.googleTransactionId_,
-    };
-    paymentDataRequest['i'] = paymentDataRequest['i']
-      ? Object.assign(internalParam, paymentDataRequest['i'])
-      : internalParam;
-    return paymentDataRequest;
+  static getIframeUrl_(origin, merchantId) {
+    // TrustedResourceUrl header needs to start with https or '//'.
+    const iframeUrl = `https://pay${environment == Constants.Environment.PREPROD ?
+             '-preprod.sandbox' :
+             environment == Constants.Environment.SANDBOX ? '.sandbox' : ''}.google.com/gp/p/ui/payframe?origin=${origin}&mid=%{merchantId}`;
+    return iframeUrl;
   }
 }
 
-/**
- * Whether the request specifies that the native support has to be disabled.
- *
- * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
- * @return {boolean}
- */
-function isNativeDisabledInRequest(request) {
-  return (request['i'] && request['i']['disableNative']) === true;
-}
+// Start loading pay frame early
+PayFrameHelper.load();
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -12990,215 +12915,372 @@ function isNativeDisabledInRequest(request) {
  */
 
 /**
- * @fileoverview
- *
- * Client-side experiments in SwG.
- *
- * The experiments can be set in a few different ways:
- *  1. By gulp build rules using `--experiments=${experimentsString}` argument.
- *  2. By `#swg.experiments=${experimentsString}` parameter in the URL's
- *     fragment.
- *  3. By `swg.configure({experiments: [array]})` call.
- *
- * The `${experimentsString}` is defined as following:
- *  - experimentString = (experimentSpec,)*
- *  - experimentSpec = experimentId | experimentId '=' num100 ('c')?
+ * @return {boolean} true if this version of Chrome supports PaymentHandler.
+ */
+function chromeSupportsPaymentHandler() {
+  // Check if feature is enabled for user
+  if (typeof google == 'undefined' ||
+      !null) {
+    return false;
+  }
+
+  // Payment handler isn't supported on mobile
+  const mobilePlatform = window.navigator.userAgent.match(
+      /Android|iPhone|iPad|iPod|BlackBerry|IEMobile/i);
+  if (mobilePlatform != null) {
+    return false;
+  }
+
+  const chromeVersion = window.navigator.userAgent.match(/Chrome\/([0-9]+)\./i);
+  return 'PaymentRequest' in window && chromeVersion != null &&
+      Number(chromeVersion[1]) >= 68 &&
+      window.navigator.vendor == 'Google Inc.';
+}
+
+/**
+ * @return {boolean} true if this version of Chrome supports PaymentRequest.
+ */
+function chromeSupportsPaymentRequest() {
+  // Opera uses chrome as rendering engine and sends almost the exact same
+  // user agent as chrome thereby fooling us on android.
+  const isOpera = window.navigator.userAgent.indexOf('OPR/') != -1;
+  if (isOpera) {
+    return false;
+  }
+  if (chromeSupportsPaymentHandler()) {
+    return true;
+  }
+
+  const androidPlatform = window.navigator.userAgent.match(/Android/i);
+  const chromeVersion = window.navigator.userAgent.match(/Chrome\/([0-9]+)\./i);
+  return androidPlatform != null && 'PaymentRequest' in window &&
+      // Make sure skipping PaymentRequest UI when only one PaymentMethod is
+      // supported (starts on Google Chrome 59).
+      window.navigator.vendor == 'Google Inc.' && chromeVersion != null &&
+      Number(chromeVersion[1]) >= 59;
+}
+
+/**
+ * @param {!IsReadyToPayRequest} isReadyToPayRequest
  *
- * Some examples:
- *  - `A,B` - defines two experiments "A" and "B" that will be turned on.
- *  - `A:100,B:100` - the same: "A" and "B" will be turned on.
- *  - `A:0` - the experiment "A" will be disabled.
- *  - `A:1` - enable the experiment "A" in 1% of impressions.
- *  - `A:10c` - enable the experiment "A" in 10% of impressions with 10%
- *    control. In this case, 20% of the impressions will be split into two
- *    categories: experiment and control. Notice, a control can be requested
- *    only for the fraction under 20%.
+ * @return {boolean} true if the merchant only supports tokenized cards.
  */
+function doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest) {
+  if (isReadyToPayRequest.apiVersion >= 2) {
+    const allowedAuthMethods =
+        extractAllowedAuthMethodsForCards_(isReadyToPayRequest);
+    if (allowedAuthMethods && allowedAuthMethods.length == 1 &&
+        allowedAuthMethods[0] == Constants.AuthMethod.CRYPTOGRAM_3DS) {
+      return true;
+    }
+  }
+  return isReadyToPayRequest.allowedPaymentMethods.length == 1 &&
+      isReadyToPayRequest.allowedPaymentMethods[0] ==
+      Constants.PaymentMethod.TOKENIZED_CARD;
+}
 
 /**
- * @enum {string}
+ * @param {!IsReadyToPayRequest} isReadyToPayRequest
+ * @param {Constants.AuthMethod} apiV2AuthMethod
+ *
+ * @return {boolean} true if the merchant supports pan cards.
  */
-const Selection = {
-  EXPERIMENT: 'e',
-  CONTROL: 'c',
-};
+function apiV2DoesMerchantSupportSpecifiedCardType(
+    isReadyToPayRequest, apiV2AuthMethod) {
+  if (isReadyToPayRequest.apiVersion >= 2) {
+    const allowedAuthMethods =
+        extractAllowedAuthMethodsForCards_(isReadyToPayRequest);
+    if (allowedAuthMethods && allowedAuthMethods.includes(apiV2AuthMethod)) {
+      return true;
+    }
+    return false;
+  }
+  return false;
+}
 
 /**
- * A comma-separated set of experiments.
- * @type {string}
+ * Validate if is secure context. Returns null if context is secure, otherwise
+ * return error message.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts
+ *
+ * @return {?string} null if current context is secure, otherwise return error
+ * message.
  */
-let experimentsString = '';
+function validateSecureContext() {
+  if (window.location.hostname.endsWith(Constants.TRUSTED_DOMAIN)) {
+    // This is for local development.
+    return null;
+  }
+  if (window.isSecureContext === undefined) {
+    // Browser not support isSecureContext, figure out a way to validate this
+    // for the unsupported browser.
+    return null;
+  }
+  return window.isSecureContext ?
+      null :
+      'Google Pay APIs should be called in secure context!';
+}
 
 /**
- * A parsed map of experiments.
- * @type {?Object<string, boolean>}
+ * Validate PaymentOptions.
+ *
+ * @param {!PaymentOptions} paymentOptions
  */
-let experimentMap = null;
+function validatePaymentOptions(paymentOptions) {
+  if (paymentOptions.environment &&
+      !Object.values(Constants.Environment)
+           .includes(paymentOptions.environment)) {
+    throw new Error(
+        'Parameter environment in PaymentOptions can optionally be set to ' +
+        'PRODUCTION, otherwise it defaults to TEST. ' + paymentOptions.environment);
+  }
+}
 
 /**
- * Ensures that the experiments have been initialized and returns them.
- * @param {!Window} win
- * @return {!Object<string, boolean>}
+ * Validate IsReadyToPayRequest.
+ *
+ * @param {!IsReadyToPayRequest} isReadyToPayRequest
+ * @return {?string} errorMessage if the request is invalid.
  */
-function getExperiments(win) {
-  if (!experimentMap) {
-    experimentMap = {};
-    let combinedExperimentString = experimentsString;
-    try {
-      const query = parseQueryString$1(win.location.hash);
-      const experimentStringFromHash = query['swg.experiments'];
-      if (experimentStringFromHash) {
-        combinedExperimentString += ',' + experimentStringFromHash;
-      }
-    } catch (e) {
-      // Ignore: experiment parsing cannot block runtime.
-      ErrorUtils.throwAsync(e);
+function validateIsReadyToPayRequest(isReadyToPayRequest) {
+  if (!isReadyToPayRequest) {
+    return 'isReadyToPayRequest must be set!';
+  } else if (isReadyToPayRequest.apiVersion >= 2) {
+    if (!('apiVersionMinor' in isReadyToPayRequest)) {
+      return 'apiVersionMinor must be set!';
     }
-
-    // Format:
-    // - experimentString = (experimentSpec,)*
-    combinedExperimentString.split(',').forEach(s => {
-      s = s.trim();
-      if (!s) {
-        return;
-      }
-      try {
-        parseSetExperiment(win, experimentMap, s);
-      } catch (e) {
-        // Ignore: experiment parsing cannot block runtime.
-        ErrorUtils.throwAsync(e);
+    if (!isReadyToPayRequest.allowedPaymentMethods ||
+        !Array.isArray(isReadyToPayRequest.allowedPaymentMethods) ||
+        isReadyToPayRequest.allowedPaymentMethods.length == 0) {
+      return 'for v2 allowedPaymentMethods must be set to an array containing a list of accepted payment methods';
+    }
+    for (var i = 0; i < isReadyToPayRequest.allowedPaymentMethods.length; i++) {
+      let allowedPaymentMethod = isReadyToPayRequest.allowedPaymentMethods[i];
+      if (allowedPaymentMethod['type'] == Constants.PaymentMethod.CARD) {
+        if (!allowedPaymentMethod['parameters']) {
+          return 'Field parameters must be setup in each allowedPaymentMethod';
+        }
+        var allowedCardNetworks =
+            allowedPaymentMethod['parameters']['allowedCardNetworks'];
+        if (!allowedCardNetworks || !Array.isArray(allowedCardNetworks) ||
+            allowedCardNetworks.length == 0) {
+          return 'allowedCardNetworks must be setup in parameters for type CARD';
+        }
+        var allowedAuthMethods =
+            allowedPaymentMethod['parameters']['allowedAuthMethods'];
+        if (!allowedAuthMethods || !Array.isArray(allowedAuthMethods) ||
+            allowedAuthMethods.length == 0 ||
+            !allowedAuthMethods.every(isAuthMethodValid)) {
+          return 'allowedAuthMethods must be setup in parameters for type \'CARD\' ' +
+              ' and must contain \'CRYPTOGRAM_3DS\' and/or \'PAN_ONLY\'';
+        }
       }
-    });
+    }
+    return null;
+  } else if (
+      !isReadyToPayRequest.allowedPaymentMethods ||
+      !Array.isArray(isReadyToPayRequest.allowedPaymentMethods) ||
+      isReadyToPayRequest.allowedPaymentMethods.length == 0 ||
+      !isReadyToPayRequest.allowedPaymentMethods.every(isPaymentMethodValid)) {
+    return 'allowedPaymentMethods must be set to an array containing \'CARD\' ' +
+        'and/or \'TOKENIZED_CARD\'!';
   }
-  return experimentMap;
+  return null;
 }
 
 /**
- * @param {!Window} win
- * @param {?Object<string, boolean>} experimentMap
- * @param {string} spec
+ * Validate the payment method.
+ *
+ * @param {string} paymentMethod
+ * @return {boolean} if the current payment method is valid.
  */
-function parseSetExperiment(win, experimentMap, spec) {
-  // Format:
-  // - experimentSpec = experimentId | experimentId '=' num100 ('c')?
-  let experimentId;
-  let fraction;
-  let control = false;
-  const eq = spec.indexOf(':');
-  if (eq == -1) {
-    experimentId = spec;
-    fraction = 100;
-    control = false;
-  } else {
-    experimentId = spec.substring(0, eq).trim();
-    spec = spec.substring(eq + 1);
-    if (spec.substring(spec.length - 1) == Selection.CONTROL) {
-      control = true;
-      spec = spec.substring(0, spec.length - 1);
-    }
-    fraction = parseInt(spec, 10);
+function isPaymentMethodValid(paymentMethod) {
+  return Object.values(Constants.PaymentMethod).includes(paymentMethod);
+}
+
+/**
+ * Validate the auth method.
+ *
+ * @param {string} authMethod
+ * @return {boolean} if the current auth method is valid.
+ */
+function isAuthMethodValid(authMethod) {
+  return Object.values(Constants.AuthMethod).includes(authMethod);
+}
+
+/**
+ * Validate PaymentDataRequest.
+ *
+ * @param {!PaymentDataRequest} paymentDataRequest
+ * @return {?string} errorMessage if the request is invalid.
+ */
+function validatePaymentDataRequest(paymentDataRequest) {
+  if (!paymentDataRequest) {
+    return 'paymentDataRequest must be set!';
   }
-  if (isNaN(fraction)) {
-    throw new Error('invalid fraction');
+  if (paymentDataRequest.swg) {
+    return validatePaymentDataRequestForSwg(paymentDataRequest.swg);
+  } else if (!paymentDataRequest.transactionInfo) {
+    return 'transactionInfo must be set!';
+  } else if (!paymentDataRequest.transactionInfo.currencyCode) {
+    return 'currencyCode in transactionInfo must be set!';
+  } else if (
+      !paymentDataRequest.transactionInfo.totalPriceStatus ||
+      !Object.values(Constants.TotalPriceStatus)
+           .includes(paymentDataRequest.transactionInfo.totalPriceStatus)) {
+    return 'totalPriceStatus in transactionInfo must be set to one of' +
+        ' NOT_CURRENTLY_KNOWN, ESTIMATED or FINAL!';
+  } else if (
+      paymentDataRequest.transactionInfo.totalPriceStatus !==
+          'NOT_CURRENTLY_KNOWN' &&
+      !paymentDataRequest.transactionInfo.totalPrice) {
+    return 'totalPrice in transactionInfo must be set when' +
+        ' totalPriceStatus is ESTIMATED or FINAL!';
   }
 
-  // Calculate "on"/"off".
-  let on;
-  if (fraction > 99) {
-    // Explicitly "on".
-    on = true;
-  } else if (fraction < 1) {
-    // Explicitly "off".
-    on = false;
-  } else if (win.sessionStorage) {
-    // Fractional and possibly with the control.
-    // Note that:
-    // a. We can't do persistent experiments if storage is not available.
-    // b. We can't run control on more than 20%.
-    control = control && fraction <= 20;
-    try {
-      // Set fraction in the experiment to make it unlaunchable.
-      const storageKey =
-        'subscribe.google.com:e:' +
-        experimentId +
-        ':' +
-        fraction +
-        (control ? 'c' : '');
-      let selection = parseSelection(win.sessionStorage.getItem(storageKey));
-      if (!selection) {
-        // Is experiment/control range?
-        if (win.Math.random() * 100 <= fraction * (control ? 2 : 1)) {
-          const inExperiment = control ? win.Math.random() <= 0.5 : true;
-          selection = inExperiment ? Selection.EXPERIMENT : Selection.CONTROL;
-          win.sessionStorage.setItem(storageKey, selection);
-        }
-      }
-      on = !!selection;
-      if (selection == Selection.CONTROL) {
-        experimentId = 'c-' + experimentId;
-      }
-    } catch (e) {
-      // Ignore: experiment parsing cannot block runtime.
-      on = false;
-      ErrorUtils.throwAsync(e);
+  // Validate payment data request for UPI payment method
+  const allowedPaymentMethod = getUpiPaymentMethod(paymentDataRequest);
+  if (allowedPaymentMethod) {
+    if (!allowedPaymentMethod['parameters']) {
+      return 'parameters must be set in allowedPaymentMethod!';
     }
-  } else {
-    on = false;
-  }
 
-  experimentMap[experimentId] = on;
+    var parameters = allowedPaymentMethod['parameters'];
+    if (!parameters['payeeVpa']) {
+      return 'payeeVpa in allowedPaymentMethod parameters must be set!';
+    } else if (!parameters['payeeName']) {
+      return 'payeeName in allowedPaymentMethod parameters must be set!';
+    } else if (!parameters['referenceUrl']) {
+      return 'referenceUrl in allowedPaymentMethod parameters must be set!';
+    } else if (!parameters['mcc']) {
+      return 'mcc in allowedPaymentMethod parameters must be set!';
+    } else if (!parameters['transactionReferenceId']) {
+      return 'transactionReferenceId in allowedPaymentMethod parameters' +
+          ' must be set!';
+    }
+
+    if (paymentDataRequest['transactionInfo']['currencyCode'] !== 'INR') {
+      return 'currencyCode in transactionInfo must be set to INR!';
+    } else if (
+        paymentDataRequest['transactionInfo']['totalPriceStatus'] !== 'FINAL') {
+      return 'totalPriceStatus in transactionInfo must be set to FINAL!';
+    } else if (!paymentDataRequest['transactionInfo']['transactionNote']) {
+      return 'transactionNote in transactionInfo must be set!';
+    }
+  }
+  return null;
 }
 
 /**
- * @param {?string} s
- * @return {?Selection}
+ * Returns upi payment method object if it exists in allowed payment methods
+ * or null if it doesn't
+ *
+ * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
+ * @return {?Object}
  */
-function parseSelection(s) {
-  // Do a simple if-then to inline the whole Selection enum.
-  return s == Selection.EXPERIMENT
-    ? Selection.EXPERIMENT
-    : s == Selection.CONTROL
-    ? Selection.CONTROL
-    : null;
+function getUpiPaymentMethod(request) {
+  if (!chromeSupportsPaymentRequest() || request.apiVersion < 2 ||
+      !request.allowedPaymentMethods) {
+    return null;
+  }
+  return getAllowedPaymentMethodForType_(request, Constants.PaymentMethod.UPI);
 }
 
 /**
- * Whether the specified experiment is on or off.
- * @param {!Window} win
- * @param {string} experimentId
- * @return {boolean}
+ * Validate parameters for swg.
+ *
+ * @param {?SwgParameters} swgParameters
+ * @return {?string} errorMessage if the request is invalid.
  */
-function isExperimentOn(win, experimentId) {
-  return getExperiments(win)[experimentId] || false;
+function validatePaymentDataRequestForSwg(swgParameters) {
+  if (!swgParameters) {
+    return 'Swg parameters must be provided';
+  }
+  if (!swgParameters.skuId || !swgParameters.publicationId) {
+    return 'Both skuId and publicationId must be provided';
+  }
+  return null;
 }
 
 /**
- * Toggles the experiment on or off. Returns the actual value of the experiment
- * after toggling is done.
- * @param {!Window} win
- * @param {string} experimentId
- * @param {boolean} on
+ * Returns the allowedAuthMethods for a card from the request.
+ *
+ * @param {!IsReadyToPayRequest} isReadyToPayRequest
+ * @return {?Array<string>}
+ * @private
  */
-function setExperiment(win, experimentId, on) {
-  getExperiments(win)[experimentId] = on;
+function extractAllowedAuthMethodsForCards_(isReadyToPayRequest) {
+  if (isReadyToPayRequest.allowedPaymentMethods) {
+    const allowedPaymentMethod = getAllowedPaymentMethodForType_(
+        isReadyToPayRequest, Constants.PaymentMethod.CARD);
+    if (allowedPaymentMethod && allowedPaymentMethod.parameters) {
+      return allowedPaymentMethod.parameters['allowedAuthMethods'];
+    }
+  }
+  return null;
 }
 
 /**
- * @return {!Array<string>}
+ * @param {!IsReadyToPayRequest} isReadyToPayRequest
+ * @param {string} paymentMethodType
+ * @return {?PaymentMethod} Return first payment method for the given type,
+ *     return null if not found.
+ * @private
  */
-function getOnExperiments(win) {
-  const experimentMap = getExperiments(win);
-  const experiments = [];
-  for (const experiment in experimentMap) {
-    if (experimentMap[experiment]) {
-      experiments.push(experiment);
+function getAllowedPaymentMethodForType_(
+    isReadyToPayRequest, paymentMethodType) {
+  for (var i = 0; i < isReadyToPayRequest.allowedPaymentMethods.length; i++) {
+    const allowedPaymentMethod = isReadyToPayRequest.allowedPaymentMethods[i];
+    if (allowedPaymentMethod.type == paymentMethodType) {
+      return allowedPaymentMethod;
     }
   }
-  return experiments;
+  return null;
+}
+
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * Injects the pay with google iframe.
+ * @param {string} iframeClassName The classname of the iFrame wrapper.
+ * @return {!{container: !Element, iframe:!HTMLIFrameElement}}
+ */
+function injectIframe(iframeClassName) {
+  const container = document.createElement('div');
+  container.classList.add(Constants.IFRAME_CONTAINER_CLASS);
+  const iframeContainer = document.createElement('div');
+  iframeContainer.classList.add('iframeContainer');
+  /** @private @const {!HTMLIFrameElement} */
+  const iframe =
+      /** @type {!HTMLIFrameElement} */ (document.createElement('iframe'));
+  iframe.classList.add(iframeClassName);
+  iframe.setAttribute('frameborder', '0');
+  iframe.setAttribute('scrolling', 'no');
+  iframeContainer.appendChild(iframe);
+  container.appendChild(iframeContainer);
+  document.body.appendChild(container);
+  return {'container': container, 'iframe': iframe};
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -13213,1073 +13295,956 @@ function getOnExperiments(win) {
  * limitations under the License.
  */
 
-const PAY_REQUEST_ID = 'swg-pay';
-const GPAY_ACTIVITY_REQUEST$1 = 'GPAY';
-
-const REDIRECT_STORAGE_KEY = 'subscribe.google.com:rk';
+const GPAY_ACTIVITY_REQUEST = 'GPAY';
+const IFRAME_CLOSE_DURATION_IN_MS = 250;
+const IFRAME_SHOW_UP_DURATION_IN_MS = 250;
+const IFRAME_SMOOTH_HEIGHT_TRANSITION = `height ${IFRAME_SHOW_UP_DURATION_IN_MS}ms`;
+const ERROR_PREFIX = 'Error: ';
 
 /**
- * @const {!Object<string, string>}
- * @package Visible for testing only.
+ * Supported browser user agent keys.
+ *
+ * @enum {string}
  */
-const PAY_ORIGIN = {
-  'PRODUCTION': 'https://pay.google.com',
-  'SANDBOX': 'https://pay.sandbox.google.com',
+const BrowserUserAgent = {
+  CHROME: 'Chrome',
+  FIREFOX: 'Firefox',
+  SAFARI: 'Safari',
 };
 
-/** @return {string} */
-function payOrigin() {
-  return PAY_ORIGIN['PRODUCTION'];
-}
-
-/** @return {string} */
-function payUrl() {
-  return feCached(PAY_ORIGIN['PRODUCTION'] + '/gp/p/ui/pay');
-}
-
-/** @return {string} */
-function payDecryptUrl() {
-  return PAY_ORIGIN['PRODUCTION'] + '/gp/p/apis/buyflow/process';
-}
-
 /**
+ * An implementation of PaymentsClientDelegateInterface that uses the custom
+ * hosting page along with web activities to actually get to the hosting page.
+ * @implements {PaymentsClientDelegateInterface}
  */
-class PayClient {
-  /**
-   * @param {!./deps.DepsDef} deps
-   */
-  constructor(deps) {
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
-
-    /** @const @private {!PayClientBindingDef} */
-    this.binding_ = isExperimentOn(this.win_, ExperimentFlags.GPAY_API)
-      ? new PayClientBindingPayjs(
-          this.win_,
-          this.activityPorts_,
-          // Generates a new Google Transaction ID.
-          deps.analytics().getTransactionId()
-        )
-      : new PayClientBindingSwg(
-          this.win_,
-          this.activityPorts_,
-          this.dialogManager_
-        );
-  }
-
-  /**
-   * @param {!../utils/preconnect.Preconnect} pre
-   */
-  preconnect(pre) {
-    pre.prefetch(payUrl());
-    pre.prefetch(
-      'https://payments.google.com/payments/v4/js/integrator.js?ss=md'
-    );
-    pre.prefetch('https://clients2.google.com/gr/gr_full_2.0.6.js');
-    pre.preconnect('https://www.gstatic.com/');
-    pre.preconnect('https://fonts.googleapis.com/');
-    pre.preconnect('https://www.google.com/');
-  }
-
-  /**
-   * @return {string}
-   */
-  getType() {
-    // TODO(dvoytenko, #406): remove once GPay API is launched.
-    return this.binding_.getType();
-  }
-
-  /**
-   * @param {!Object} paymentRequest
-   * @param {!PayOptionsDef=} options
-   */
-  start(paymentRequest, options = {}) {
-    this.binding_.start(paymentRequest, options);
-  }
-
+class PaymentsWebActivityDelegate {
   /**
-   * @param {function(!Promise<!Object>)} callback
+   * @param {string} environment
+   * @param {string} googleTransactionId
+   * @param {boolean=} useIframe
+   * @param {!ActivityPorts=} activities Can be used to provide a shared
+   *   activities manager. By default, the new manager is created.
+   * @param {?string=} redirectKey The redirect key used for redirect mode.
    */
-  onResponse(callback) {
-    this.binding_.onResponse(callback);
-  }
-}
+  constructor(
+    environment,
+    googleTransactionId,
+    useIframe,
+    activities,
+    redirectKey
+  ) {
+    this.environment_ = environment;
+    /** @private @const {boolean} */
 
-/**
- * @implements {PayClientBindingDef}
- */
-class PayClientBindingSwg {
-  /**
-   * @param {!Window} win
-   * @param {!../components/activities.ActivityPorts} activityPorts
-   * @param {!../components/dialog-manager.DialogManager} dialogManager
-   */
-  constructor(win, activityPorts, dialogManager) {
-    /** @private @const {!Window} */
-    this.win_ = win;
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = activityPorts;
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = dialogManager;
-  }
+    /** @const {!ActivityPorts} */
+    this.activities = activities || new activityPorts_1(window);
+    /** @const @private {!Graypane} */
+    this.graypane_ = new Graypane$1(window.document);
+    /** @private {?function(!Promise<!PaymentData>)} */
+    this.callback_ = null;
+    /**
+     * @private {?{
+     *             container: !Element,
+     *             iframe:!HTMLIFrameElement,
+     *             request:!PaymentDataRequest,
+     *             dataPromise:?Promise<!PaymentData>}}
+     */
+    this.prefetchedObjects_ = null;
+    /** @private {boolean} */
+    this.shouldHandleResizing_ = false;
+    /** @private {?ActivityIframePort} */
+    this.port_ = null;
+    /** @private {?function(!Promise<void>)} */
+    this.dismissPromiseResolver_ = null;
+    /** @const @private {string} */
+    this.googleTransactionId_ = googleTransactionId;
+    /** @const @private {?string} */
+    this.redirectKey_ = redirectKey || null;
 
-  /** @override */
-  getType() {
-    return 'SWG';
+    /**
+     * @private {?ResizePayload}
+     */
+    this.savedResizePayload_ = null;
   }
 
   /** @override */
-  start(paymentRequest, options) {
-    const opener = this.activityPorts_.open(
-      GPAY_ACTIVITY_REQUEST$1,
-      payUrl(),
-      options.forceRedirect ? '_top' : '_blank',
-      feArgs(paymentRequest),
-      {}
+  onResult(callback) {
+    if (this.callback_) {
+      return;
+    }
+    this.callback_ = callback;
+    this.activities.onResult(
+      GPAY_ACTIVITY_REQUEST,
+      this.onActivityResult_.bind(this)
     );
-    this.dialogManager_.popupOpened((opener && opener.targetWin) || null);
-  }
-
-  /** @override */
-  onResponse(callback) {
-    const responseCallback = port => {
-      this.dialogManager_.popupClosed();
-      callback(this.validatePayResponse_(port));
-    };
-    this.activityPorts_.onResult(GPAY_ACTIVITY_REQUEST$1, responseCallback);
-    this.activityPorts_.onResult(PAY_REQUEST_ID, responseCallback);
   }
 
   /**
-   * @param {!../components/activities.ActivityPortDef} port
-   * @return {!Promise<!Object>}
+   * @param {!ActivityPort} port
    * @private
    */
-  validatePayResponse_(port) {
-    // Do not require security immediately: it will be checked below.
-    return port.acceptResult().then(result => {
-      if (result.origin != payOrigin()) {
-        throw new Error('channel mismatch');
-      }
-      const data = /** @type {!Object} */ (result.data);
-      if (data['redirectEncryptedCallbackData']) {
-        // Data is supplied as an encrypted blob.
-        const xhr = new Xhr(this.win_);
-        const url = payDecryptUrl();
-        const init = /** @type {!../utils/xhr.FetchInitDef} */ ({
-          method: 'post',
-          headers: {'Accept': 'text/plain, application/json'},
-          credentials: 'include',
-          body: data['redirectEncryptedCallbackData'],
-          mode: 'cors',
-        });
-        return xhr
-          .fetch(url, init)
-          .then(response => response.json())
-          .then(response => {
-            const dataClone = Object.assign({}, data);
-            delete dataClone['redirectEncryptedCallbackData'];
-            return Object.assign(dataClone, response);
-          });
-      }
-      // Data is supplied directly: must be a verified and secure channel.
-      if (result.originVerified && result.secureChannel) {
-        return data;
-      }
-      throw new Error('channel mismatch');
-    });
-  }
-}
-
-/**
- * Binding based on the https://github.com/google/payjs.
- * @implements {PayClientBindingDef}
- * @package Visible for testing only.
- */
-class PayClientBindingPayjs {
-  /**
-   * @param {!Window} win
-   * @param {!../components/activities.ActivityPorts} activityPorts
-   * @param {!string} googleTransactionId
-   */
-  constructor(win, activityPorts, googleTransactionId) {
-    /** @private @const {!Window} */
-    this.win_ = win;
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = activityPorts;
-
-    /** @private {?function(!Promise<!Object>)} */
-    this.responseCallback_ = null;
-
-    /** @private {?Promise<!Object>} */
-    this.response_ = null;
-
-    /** @private @const {!RedirectVerifierHelper} */
-    this.redirectVerifierHelper_ = new RedirectVerifierHelper(this.win_);
-
-    /** @private @const {!PaymentsAsyncClient} */
-    this.client_ = this.createClient_(
-      {
-        environment: 'PRODUCTION',
-        'i': {
-          'redirectKey': this.redirectVerifierHelper_.restoreKey(),
+  onActivityResult_(port) {
+    // Hide the graypane.
+    this.graypane_.hide();
+    // Only verified origins are allowed.
+    this.callback_(
+      port.acceptResult().then(
+        result => {
+          // Origin must always match: popup, iframe or redirect.
+          if (result.origin != this.getOrigin_()) {
+            throw new Error('channel mismatch');
+          }
+          const data = /** @type {!PaymentData} */ (result.data);
+          if (data['redirectEncryptedCallbackData']) {
+            PayFrameHelper.setBuyFlowActivityMode(BuyFlowActivityMode.REDIRECT);
+            return this.fetchRedirectResponse_(
+              data['redirectEncryptedCallbackData']
+            ).then(decrypedJson => {
+              // Merge other non-encrypted fields into the final response.
+              const clone = Object.assign({}, data);
+              delete clone['redirectEncryptedCallbackData'];
+              return Object.assign(clone, decrypedJson);
+            });
+          }
+          // Unencrypted data supplied: must be a verified and secure channel.
+          if (!result.originVerified || !result.secureChannel) {
+            throw new Error('channel mismatch');
+          }
+          return data;
         },
-      },
-      googleTransactionId,
-      this.handleResponse_.bind(this)
+        error => {
+          // TODO: Log the original and the inferred error to eye3.
+          const originalError = error['message'];
+          let inferredError = error['message'];
+          try {
+            // Try to parse the error message to a structured error, if it's
+            // not possible, fallback to use the error message string.
+            inferredError = JSON.parse(
+              originalError.substring(ERROR_PREFIX.length)
+            );
+          } catch (e) {}
+          if (
+            inferredError['statusCode'] &&
+            ['DEVELOPER_ERROR', 'MERCHANT_ACCOUNT_ERROR'].indexOf(
+              inferredError['statusCode']
+            ) == -1
+          ) {
+            inferredError = {
+              'statusCode': 'CANCELED',
+            };
+          }
+          if (inferredError == 'AbortError') {
+            inferredError = {
+              'statusCode': 'CANCELED',
+            };
+          }
+          return Promise.reject(inferredError);
+        }
+      )
     );
-
-    // Prepare new verifier pair.
-    this.redirectVerifierHelper_.prepare();
   }
 
   /**
-   * @param {!Object} options
-   * @param {string} googleTransactionId
-   * @param {function(!Promise<!Object>)} handler
-   * @return {!PaymentsAsyncClient}
+   * @param {string} redirectEncryptedCallbackData
+   * @return {!PaymentData}
    * @private
    */
-  createClient_(options, googleTransactionId, handler) {
-    // Assign Google Transaction ID to PaymentsAsyncClient.googleTransactionId_
-    // so it can be passed to gpay_async.js and stored in payment clearcut log.
-    PaymentsAsyncClient.googleTransactionId_ = googleTransactionId;
-    return new PaymentsAsyncClient(
-      options,
-      handler,
-      /* useIframe */ false,
-      this.activityPorts_.getOriginalWebActivityPorts()
-    );
-  }
+  fetchRedirectResponse_(redirectEncryptedCallbackData) {
+    // This method has to rely on the legacy XHR API because the redirect
+    // functionality is, in part, aimed at older browsers.
+    return new Promise((resolve, reject) => {
+      const url = this.getDecryptionUrl_();
+      const xhr = new XMLHttpRequest();
+      xhr.open('POST', url, true);
+      if ('withCredentials' in xhr) {
+        // It's fine to proceed in a non-redirect mode because redirectVerifier
+        // plays the part of CORS propagation.
+        xhr.withCredentials = true;
+      }
 
-  /** @override */
-  getType() {
-    return 'PAYJS';
+      xhr.onreadystatechange = () => {
+        if (xhr.readyState < /* STATUS_RECEIVED */ 2) {
+          return;
+        }
+        if (xhr.status < 100 || xhr.status > 599) {
+          xhr.onreadystatechange = null;
+          reject(new Error(`Unknown HTTP status ${xhr.status}`));
+          return;
+        }
+        if (xhr.readyState == /* COMPLETE */ 4) {
+          try {
+            resolve(JSON.parse(xhr.responseText));
+          } catch (e) {
+            // JSON parsing error is expected here.
+            reject(e);
+          }
+        }
+      };
+      xhr.onerror = () => {
+        reject(new Error('Network failure'));
+      };
+      xhr.onabort = () => {
+        reject(new Error('Request aborted'));
+      };
+
+      // Send POST.
+      xhr.send(redirectEncryptedCallbackData);
+    });
   }
 
   /** @override */
-  start(paymentRequest, options) {
-    if (options.forceRedirect) {
-      paymentRequest = Object.assign(paymentRequest, {
-        'forceRedirect': options.forceRedirect || false,
-      });
-    }
-    setInternalParam(
-      paymentRequest,
-      'disableNative',
-      // The page cannot be iframed at this time. May be relaxed later
-      // for AMP and similar contexts.
-      this.win_ != this.top_() ||
-        // Experiment must be enabled.
-        !isExperimentOn(this.win_, ExperimentFlags.GPAY_NATIVE)
-    );
-    // Notice that the callback for verifier may execute asynchronously.
-    this.redirectVerifierHelper_.useVerifier(verifier => {
-      if (verifier) {
-        setInternalParam(paymentRequest, 'redirectVerifier', verifier);
+  isReadyToPay(isReadyToPayRequest) {
+    return new Promise((resolve, reject) => {
+      if (doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest)) {
+        resolve({'result': false});
+        return;
+      }
+      const userAgent = window.navigator.userAgent;
+      const isIosGsa =
+        userAgent.indexOf('GSA/') > 0 &&
+        userAgent.indexOf(BrowserUserAgent.SAFARI) > 0;
+      // pop up in IGSA doesn't work.
+      if (isIosGsa && !null) {
+        resolve({'result': false});
+        return;
+      }
+      const isFirefoxIos = userAgent.indexOf('FxiOS') > 0;
+      if (isFirefoxIos) {
+        resolve({'result': false});
+        return;
+      }
+      const isSupported =
+        userAgent.indexOf(BrowserUserAgent.CHROME) > 0 ||
+        userAgent.indexOf(BrowserUserAgent.FIREFOX) > 0 ||
+        userAgent.indexOf(BrowserUserAgent.SAFARI) > 0;
+      if (
+        isSupported &&
+        isReadyToPayRequest.apiVersion >= 2 &&
+        isReadyToPayRequest.existingPaymentMethodRequired
+      ) {
+        isReadyToPayRequest.environment = this.environment_;
+        PayFrameHelper.sendAndWaitForResponse(
+          isReadyToPayRequest,
+          PostMessageEventType.IS_READY_TO_PAY,
+          'isReadyToPayResponse',
+          function(event) {
+            const response = {
+              'result': isSupported,
+            };
+            if (isReadyToPayRequest.existingPaymentMethodRequired) {
+              response['paymentMethodPresent'] =
+                event.data['isReadyToPayResponse'] == 'READY_TO_PAY';
+            }
+            resolve(response);
+          }
+        );
+      } else {
+        resolve({'result': isSupported});
       }
-      this.client_.loadPaymentData(paymentRequest);
     });
   }
 
   /** @override */
-  onResponse(callback) {
-    this.responseCallback_ = callback;
-    const response = this.response_;
-    if (response) {
-      Promise.resolve().then(() => {
-        if (response) {
-          callback(this.convertResponse_(response));
-        }
-      });
-    }
-  }
-
-  /**
-   * @param {!Promise<!Object>} responsePromise
-   * @private
-   */
-  handleResponse_(responsePromise) {
-    this.response_ = responsePromise;
-    if (this.responseCallback_) {
-      this.responseCallback_(this.convertResponse_(this.response_));
+  prefetchPaymentData(paymentDataRequest) {
+    // Only handles prefetch for iframe for now.
+    {
+      return;
     }
   }
 
-  /**
-   * @param {!Promise<!Object>} response
-   * @return {!Promise<!Object>}
-   * @private
-   */
-  convertResponse_(response) {
-    return response.catch(reason => {
-      if (typeof reason == 'object' && reason['statusCode'] == 'CANCELED') {
-        return Promise.reject(createCancelError(this.win_));
+  /** @override */
+  loadPaymentData(paymentDataRequest) {
+    if (!paymentDataRequest.swg) {
+      // Only set the apiVersion if the merchant is not setting it.
+      if (!paymentDataRequest.apiVersion) {
+        paymentDataRequest.apiVersion = 1;
       }
-      return Promise.reject(reason);
-    });
+    }
+    paymentDataRequest.environment = this.environment_;
+    PayFrameHelper.setBuyFlowActivityMode(
+      paymentDataRequest['forceRedirect']
+        ? BuyFlowActivityMode.REDIRECT
+        : BuyFlowActivityMode.POPUP
+    );
+    const opener = this.activities.open(
+      GPAY_ACTIVITY_REQUEST,
+      this.getHostingPageUrl_(),
+      this.getRenderMode_(paymentDataRequest),
+      paymentDataRequest,
+      {'width': 600, 'height': 600}
+    );
+    this.graypane_.show(opener && opener.targetWin);
   }
 
   /**
-   * @return {!Window}
+   * Returns the render mode whether need to force redirect.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @return {string}
    * @private
    */
-  top_() {
-    // Only exists for testing since it's not possible to override `window.top`.
-    return this.win_.top;
-  }
-}
-
-/**
- * This helper generates key/verifier pair for the redirect mode. When the
- * redirect mode is used, the encrypted payload is returned via nivigation URL.
- * This payload need to be decrypted and to avoid session fixation attacks, a
- * verifier has to be used. This redirect verifier is not the only session
- * verifier in use: we also use GAIA. However, we have to fallback to this
- * verifier when GAIA is not available.
- *
- * @package Visible for testing only.
- */
-class RedirectVerifierHelper {
-  /**
-   * @param {!Window} win
-   */
-  constructor(win) {
-    /** @private @const {!Window} */
-    this.win_ = win;
-
-    /** @private {boolean} */
-    this.pairCreated_ = false;
-
-    /** @private {?RedirectVerifierPairDef} */
-    this.pair_ = null;
-
-    /** @private {?Promise<?RedirectVerifierPairDef>} */
-    this.pairPromise_ = null;
-  }
-
-  /**
-   * To avoid popup blockers, the key/verifier pair is created as soon as
-   * possible.
-   * @return {?Promise}
-   */
-  prepare() {
-    return this.getOrCreatePair_(() => {});
+  getRenderMode_(paymentDataRequest) {
+    return paymentDataRequest['forceRedirect'] ? '_top' : 'gp-js-popup';
   }
 
   /**
-   * Calls the provided callback with the generated redirect verifier. This
-   * API is sync/async, which is a big anti-pattern. However, it's necessary
-   * to reduce the risk of popup blockers. If the verifier is already available
-   * (see `prepare` method), the callback will be called immediately and thus
-   * in the same event loop as the user action.
-   *
-   * The return verifier could be `null`. This could mean either that its
-   * generation failed, or if the platform doesn't support necessary APIs, such
-   * as Web Crypto. The redirect can still proceed and try to fallback on GAIA
-   * as a redirect verifier. The set of platforms where GAIA is not available
-   * and the redirect verifier cannot be created is negligible.
-   *
-   * The key corresponding to the returned verifier is stored in the session
-   * storage and can be later restored using `restoreKey` method.
+   * Returns the server origin based on the environment.
    *
-   * @param {function(?string)} callback
+   * @private
+   * @return {string}
    */
-  useVerifier(callback) {
-    this.getOrCreatePair_(pair => {
-      if (pair) {
-        try {
-          this.win_.localStorage.setItem(REDIRECT_STORAGE_KEY, pair.key);
-        } catch (e) {
-          // If storage has failed, there's no point in using the verifer.
-          // However, there are other ways to recover the redirect, so it's
-          // not necessarily a fatal condition.
-          pair = null;
-        }
-      }
-      callback((pair && pair.verifier) || null);
-    });
+  getOrigin_() {
+    if (this.environment_ == Constants.Environment.LOCAL) {
+      return '';
+    }
+
+    let baseDomain;
+    if (this.environment_ == Constants.Environment.PREPROD) {
+      baseDomain = 'pay-preprod.sandbox';
+    } else if (this.environment_ == Constants.Environment.SANDBOX) {
+      baseDomain = 'pay.sandbox';
+    } else {
+      baseDomain = 'pay';
+    }
+    return 'https://' + baseDomain + '.google.com';
   }
 
   /**
-   * Restores the redirect key from the session storage. The key may be null.
-   * @return {?string}
+   * Returns the base path based on the environment.
+   *
+   * @private
+   * @return {string} The base path
    */
-  restoreKey() {
-    try {
-      return (
-        (this.win_.localStorage &&
-          this.win_.localStorage.getItem(REDIRECT_STORAGE_KEY)) ||
-        null
-      );
-    } catch (e) {
-      return null;
-    }
+  getBasePath_() {
+    return this.getOrigin_() + '/gp/p';
   }
 
   /**
-   * @param {function(?RedirectVerifierPairDef)} callback
-   * @return {?Promise}
+   * Returns the decryption url to be used to decrypt the encrypted payload.
+   *
    * @private
+   * @return {string} The decryption url
    */
-  getOrCreatePair_(callback) {
-    this.createPair_();
-    if (this.pairCreated_) {
-      // Already created.
-      callback(this.pair_);
-    } else if (this.pairPromise_) {
-      // Otherwise wait for it to be created.
-      this.pairPromise_.then(pair => callback(pair));
+  getDecryptionUrl_() {
+    let url = this.getBasePath_() + '/apis/buyflow/process';
+    if (this.redirectKey_) {
+      url += '?rk=' + encodeURIComponent(this.redirectKey_);
     }
-    return this.pairPromise_;
+    return url;
   }
 
   /**
+   * Returns the hosting page url.
+   *
    * @private
+   * @return {string} The hosting page url
    */
-  createPair_() {
-    // Either already created or already started.
-    if (this.pairCreated_ || this.pairPromise_) {
-      return;
+  getHostingPageUrl_() {
+    // In Tin tests, the hosting page is requested from
+    // /testing/buyflow/merchantdemo.html and is accessed relatively since the
+    // base path is unknown ahead of time.
+    if (this.environment_ == Constants.Environment.TIN) {
+      // There is no /gp/p prefix since multilogin prefixes is broken in Tin:
+      // http://yaqs/4912322941550592
+      return '/ui/pay';
     }
+    return this.getBasePath_() + '/ui/pay';
+  }
 
-    // Check that the platform can fully support verification. That means
-    // that it's expected to implement the following APIs:
-    // a. Local storage (localStorage);
-    // b. WebCrypto (crypto.subtle);
-    // c. Crypto random (crypto.getRandomValues);
-    // d. SHA284 (crypto.subtle.digest).
-    const crypto = this.win_.crypto;
+  /**
+   * Returns the iframe pwg url to be used to be used for amp.
+   *
+   * @param {string} environment
+   * @param {string} origin
+   * @return {string} The iframe url
+   */
+  getIframeUrl(environment, origin) {
+    // TODO: These should be compile time constants and not dependent
+    // on the environment.
+    let iframeUrl = `https://pay.google.com/gp/p/ui/pay?origin=${origin}`;
     if (
-      this.win_.localStorage &&
-      crypto &&
-      crypto.getRandomValues &&
-      crypto.subtle &&
-      crypto.subtle.digest
+      environment == Constants.Environment.SANDBOX ||
+      environment == Constants.Environment.PREPROD
     ) {
-      this.pairPromise_ = new Promise((resolve, reject) => {
-        // 1. Use crypto random to create a 128-bit (16 byte) redirect key.
-        const keyBytes = new Uint8Array(16);
-        crypto.getRandomValues(keyBytes);
-
-        // 2. Encode key as base64.
-        const key = btoa(bytesToString(keyBytes));
-
-        // 3. Create a hash.
-        crypto.subtle.digest({name: 'SHA-384'}, stringToBytes(key)).then(
-          buffer => {
-            const verifier = btoa(
-              bytesToString(
-                new Uint8Array(/** @type {!ArrayBuffer} */ (buffer))
-              )
-            );
-            resolve({key, verifier});
-          },
-          reason => {
-            reject(reason);
-          }
-        );
-      })
-        .catch(() => {
-          // Ignore failures. A failure to create a redirect verifier is often
-          // recoverable.
-          return null;
-        })
-        .then(pair => {
-          this.pairCreated_ = true;
-          this.pair_ = pair;
-          return pair;
-        });
-    } else {
-      // Not supported.
-      this.pairCreated_ = true;
-      this.pair_ = null;
+      iframeUrl = `https://pay'+  (environment == Constants.Environment.PREPROD ? '-preprod' : '')+  '.sandbox.google.com/gp/p/ui/pay?origin=${origin}`;
     }
+    return iframeUrl;
   }
-}
-
-/**
- * @param {!Object} paymentRequest
- * @param {string} param
- * @param {*} value
- */
-function setInternalParam(paymentRequest, param, value) {
-  paymentRequest['i'] = Object.assign(paymentRequest['i'] || {}, {
-    [param]: value,
-  });
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-const NO_PROMISE_ERR = 'No account promise provided';
 
-class WaitForSubscriptionLookupApi {
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {?Promise} accountPromise
+   * Close iframe with animation.
+   *
+   * @param {!Element} container
+   * @param {!HTMLIFrameElement} iframe
+   * @private
    */
-  constructor(deps, accountPromise) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
-
-    /** @private {?Promise} */
-    this.openViewPromise_ = null;
-
-    /** @private {!Promise} */
-    this.accountPromise_ = accountPromise || Promise.reject(NO_PROMISE_ERR);
-
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/waitforsubscriptionlookupiframe'),
-      feArgs({
-        publicationId: deps.pageConfig().getPublicationId(),
-        productId: deps.pageConfig().getProductId(),
-      }),
-      /* shouldFadeBody */ true,
-      /* hasLoadingIndicator */ true
-    );
+  removeIframeAndContainer_(container, iframe) {
+    const transitionStyle = 'all ' + IFRAME_CLOSE_DURATION_IN_MS + 'ms ease 0s';
+    this.setTransition_(iframe, transitionStyle);
+    iframe.height = '0px';
+    // TODO: This should be replaced by listening to TransitionEnd event
+    setTimeout(() => {
+      if (container.parentNode) {
+        container.parentNode.removeChild(container);
+      }
+    }, IFRAME_CLOSE_DURATION_IN_MS);
   }
 
   /**
-   * Starts the Login Flow.
-   * @return {!Promise}
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @return {{container: !Element, iframe:!HTMLIFrameElement}}
+   * @private
    */
-  start() {
-    this.openViewPromise_ = this.dialogManager_.openView(
-      this.activityIframeView_
-    );
-
-    return this.accountPromise_.then(
-      account => {
-        // Account was found.
-        this.dialogManager_.completeView(this.activityIframeView_);
-        return account;
-      },
-      reason => {
-        this.dialogManager_.completeView(this.activityIframeView_);
-        throw reason;
-      }
+  injectIframe_(paymentDataRequest) {
+    const containerAndFrame = injectIframe(
+      this.isVerticalCenterExperimentEnabled_(paymentDataRequest)
+        ? Constants.IFRAME_STYLE_CENTER_CLASS
+        : Constants.IFRAME_STYLE_CLASS
     );
-  }
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+    const iframe = containerAndFrame['iframe'];
+    const container = containerAndFrame['container'];
+    container.addEventListener(
+      'click',
+      this.closeActionHandler_.bind(this, containerAndFrame)
+    );
+    // Hide iframe and disable resize at initialize.
+    container.style.display = 'none';
+    iframe.style.display = 'none';
+    iframe.height = '0px';
+    const transitionStyle =
+      'all ' + IFRAME_SHOW_UP_DURATION_IN_MS + 'ms ease 0s';
+    this.setTransition_(iframe, transitionStyle);
+    this.shouldHandleResizing_ = false;
+    return containerAndFrame;
+  }
 
-class OffersApi {
   /**
-   * @param {!../model/page-config.PageConfig} config
-   * @param {!./fetcher.Fetcher} fetcher
+   * Handler when back button is triggered, should dismiss iframe if present.
+   * @param {{container: !Element, iframe:!HTMLIFrameElement}} containerAndFrame
+   * @private
    */
-  constructor(config, fetcher) {
-    /** @private @const {!../model/page-config.PageConfig} */
-    this.config_ = config;
+  backButtonHandler_(containerAndFrame) {
+    this.dismissIframe_(containerAndFrame);
+  }
 
-    /** @private @const {!./fetcher.Fetcher} */
-    this.fetcher_ = fetcher;
+  /**
+   * Handler when close action is triggered, will pop history state to close
+   * the iframe.
+   * @param {{container: !Element, iframe:!HTMLIFrameElement}} containerAndFrame
+   * @private
+   */
+  closeActionHandler_(containerAndFrame) {
+    if (containerAndFrame['container'].parentNode) {
+      // Close action only when container is still attached to the page.
+      history.back();
+    }
   }
 
   /**
-   * @param {?string=} productId
-   * @return {!Promise<!Array<!../api/offer.Offer>>}
+   * @param {{container: !Element, iframe:!HTMLIFrameElement}} containerAndFrame
+   * @private
    */
-  getOffers(productId = this.config_.getProductId()) {
-    if (!productId) {
-      throw new Error('getOffers requires productId in config or arguments');
+  dismissIframe_(containerAndFrame) {
+    // Dismiss iframe only when container is still attached in the page.
+    if (containerAndFrame['container'].parentNode) {
+      // TODO: Think about whether this could be just hide instead of
+      // disconnect and remove, the tricky part is how to handle the case where
+      // payment data request is not the same.
+      this.dismissPromiseResolver_(Promise.reject({'errorCode': 'CANCELED'}));
+      this.removeIframeAndContainer_(
+        containerAndFrame['container'],
+        containerAndFrame['iframe']
+      );
+      this.port_ && this.port_.disconnect();
     }
-    return this.fetch_(productId);
   }
 
   /**
-   * @param {string} productId
-   * @return {!Promise<!Array<!../api/offer.Offer>>}
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @return {boolean}
    * @private
    */
-  fetch_(productId) {
-    const url = serviceUrl(
-      '/publication/' +
-        encodeURIComponent(this.config_.getPublicationId()) +
-        '/offers' +
-        '?label=' +
-        encodeURIComponent(productId)
+  isVerticalCenterExperimentEnabled_(paymentDataRequest) {
+    return (
+      null  
     );
-    // TODO(dvoytenko): switch to a non-credentialed request after launch.
-    return this.fetcher_.fetchCredentialedJson(url).then(json => {
-      return json['offers'] || [];
-    });
   }
-}
-
-/**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/**
- * @param {string} sku
- * @return {!EventParams}
- */
-function getEventParams$1(sku) {
-  return new EventParams([, , , , sku]);
-}
-
-/**
- * Offers view is closable when request was originated from 'AbbrvOfferFlow'
- * or from 'SubscribeOptionFlow'.
- */
-const OFFERS_VIEW_CLOSABLE = true;
-
-// The value logged when the offers screen shows all available SKUs.
-const ALL_SKUS = '*';
 
-/**
- * The class for Offers flow.
- */
-class OffersFlow {
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!../api/subscriptions.OffersRequest|undefined} options
+   * @param {!Element} container
+   * @param {!HTMLIFrameElement} iframe
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @private
    */
-  constructor(deps, options) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
-
-    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
-    this.eventManager_ = deps.eventManager();
-
-    let isClosable = options && options.isClosable;
-    if (isClosable == undefined) {
-      isClosable = false; // Default is to hide Close button.
-    }
-
-    const feArgsObj = {
-      'productId': deps.pageConfig().getProductId(),
-      'publicationId': deps.pageConfig().getPublicationId(),
-      'showNative': deps.callbacks().hasSubscribeRequestCallback(),
-      'productType': ProductType.SUBSCRIPTION,
-      'list': (options && options.list) || 'default',
-      'skus': (options && options.skus) || null,
-      'isClosable': isClosable,
-      'analyticsContext': deps
-        .analytics()
-        .getContext()
-        .toArray(),
-    };
-
-    this.prorationMode = feArgsObj['replaceSkuProrationMode'] || undefined;
-
-    if (options && options.oldSku) {
-      feArgsObj['oldSku'] = options.oldSku;
-    }
-
-    if (feArgsObj['oldSku']) {
-      log_2(feArgsObj['skus'], 'Need a sku list if old sku is provided!');
-
-      // Remove old sku from offers if in list.
-      let skuList = feArgsObj['skus'];
-      const /** @type {string} */ oldSku = feArgsObj['oldSku'];
-      skuList = skuList.filter(sku => sku !== oldSku);
-
-      log_2(
-        skuList.length > 0,
-        'Sku list only contained offer user already has'
-      );
-      feArgsObj['skus'] = skuList;
-    }
-
-    // Redirect to payments if only one upgrade option is passed.
-    if (feArgsObj['skus'] && feArgsObj['skus'].length === 1) {
-      const sku = feArgsObj['skus'][0];
-      const /** @type {string|undefined} */ oldSku = feArgsObj['oldSku'];
-      // Update subscription triggers experimental flag if oldSku is passed,
-      // so we need to check for oldSku to decide if it needs to be sent.
-      // Otherwise we might accidentally block a regular subscription request.
-      if (oldSku) {
-        new PayStartFlow(this.deps_, {
-          skuId: sku,
-          oldSku,
-          replaceSkuProrationMode: this.prorationMode,
-        }).start();
-        return;
+  showContainerAndIframeWithAnimation_(container, iframe, paymentDataRequest) {
+    container.style.display = 'block';
+    iframe.style.display = 'block';
+    setTimeout(() => {
+      // Hard code the apprx height here, it will be resize to expected height
+      // later.
+      iframe.height = '280px';
+      if (this.isVerticalCenterExperimentEnabled_(paymentDataRequest)) {
+        iframe.classList.add(Constants.IFRAME_ACTIVE_CONTAINER_CLASS);
       }
-    }
-
-    /** @private @const {!string} */
-    this.skus_ = (feArgsObj['skus'] || []).join(',') || ALL_SKUS;
+      // TODO: This should be handles properly by listening to
+      // TransitionEnd event.
+      setTimeout(() => {
+        this.shouldHandleResizing_ = true;
+        // TODO: Add browser test that catches this.
+        if (this.savedResizePayload_) {
+          this.setTransition_(iframe, this.savedResizePayload_['transition']);
+          iframe.height = this.savedResizePayload_['height'];
+          this.savedResizePayload_ = null;
+        }
+      }, IFRAME_SHOW_UP_DURATION_IN_MS);
+    }, 1);
+  }
 
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/offersiframe'),
-      feArgs(feArgsObj),
-      /* shouldFadeBody */ true
-    );
+  /**
+   * @param {!HTMLIFrameElement} iframe
+   * @param {string} transitionStyle
+   * @private
+   */
+  setTransition_(iframe, transitionStyle) {
+    iframe.style.setProperty('transition', transitionStyle);
+    // For safari.
+    iframe.style.setProperty('-webkit-transition', transitionStyle);
   }
 
   /**
-   * @param {SkuSelectedResponse} response
+   * Use WebActivitiy to open iframe that's in given container.
+   *
+   * @param {!Element} container
+   * @param {!HTMLIFrameElement} iframe
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @return {!Promise<!PaymentData>}
    * @private
    */
-  startPayFlow_(response) {
-    const sku = response.getSku();
-    const oldSku = response.getOldSku();
-    if (sku) {
-      if (oldSku) {
-        this.deps_.analytics().setSku(oldSku);
+  openIframe_(container, iframe, paymentDataRequest) {
+    if (!paymentDataRequest.swg) {
+      if (!paymentDataRequest.apiVersion) {
+        paymentDataRequest.apiVersion = 1;
       }
-      this.eventManager_.logSwgEvent(
-        AnalyticsEvent.ACTION_OFFER_SELECTED,
-        true,
-        getEventParams$1(sku)
+    }
+    paymentDataRequest.environment = this.environment_;
+    let iframeLoadStartTime;
+    const trustedUrl = this.getIframeUrl(
+      this.environment_,
+      window.location.origin
+    );
+    return this.activities
+      .openIframe(iframe, trustedUrl, paymentDataRequest)
+      .then(port => {
+        // Handle custom resize message.
+        this.port_ = port;
+        port.onMessage(payload => {
+          if (payload['type'] !== 'resize' || !this.shouldHandleResizing_) {
+            // Save the resize event later after initial animation is finished
+            this.savedResizePayload_ = {
+              'height': payload['height'],
+              'transition': payload['transition'],
+            };
+            return;
+          }
+          // b/111310899: Smooth out initial iFrame loading
+          if (!iframeLoadStartTime) {
+            iframeLoadStartTime = Date.now();
+          }
+          if (
+            Date.now() <
+            iframeLoadStartTime + IFRAME_SHOW_UP_DURATION_IN_MS
+          ) {
+            this.setTransition_(
+              iframe,
+              payload['transition'] + ', ' + IFRAME_SMOOTH_HEIGHT_TRANSITION
+            );
+          } else {
+            this.setTransition_(iframe, payload['transition']);
+          }
+          iframe.height = payload['height'];
+        });
+        return /** @type {!Promise<!Object>} */ (port.acceptResult());
+      })
+      .then(
+        /**
+         * @param {!Object} result
+         * @return {!PaymentData}
+         */
+        result => {
+          this.removeIframeAndContainer_(container, iframe);
+          // This is only for popping the state we pushed earlier.
+          history.back();
+          const data = /** @type {!PaymentData} */ (result['data']);
+          return data;
+        },
+        error => {
+          this.removeIframeAndContainer_(container, iframe);
+          // This is only for popping the state we pushed earlier.
+          history.back();
+          return Promise.reject(error);
+        }
       );
-      let skuOrSubscriptionRequest;
-      if (oldSku) {
-        skuOrSubscriptionRequest = {};
-        skuOrSubscriptionRequest['skuId'] = sku;
-        skuOrSubscriptionRequest['oldSku'] = oldSku;
-      } else {
-        skuOrSubscriptionRequest = sku;
-      }
-      new PayStartFlow(this.deps_, skuOrSubscriptionRequest).start();
-    }
   }
+}
 
-  /**
-   * @param {AlreadySubscribedResponse} response
-   * @private
-   */
-  handleLinkRequest_(response) {
-    if (response.getSubscriberOrMember()) {
-      this.eventManager_.logSwgEvent(
-        AnalyticsEvent.ACTION_ALREADY_SUBSCRIBED,
-        true
-      );
-      this.deps_.callbacks().triggerLoginRequest({
-        linkRequested: !!response.getLinkRequested(),
-      });
-    }
-  }
+/**
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+class UpiHandler {
+  constructor() {}
 
   /**
-   * @param {ViewSubscriptionsResponse} response
-   * @private
+   * Returns upi payment method object if it exists in allowed payment methods
+   * or null if it doesn't
+   *
+   * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
+   * @return {boolean}
    */
-  startNativeFlow_(response) {
-    if (response.getNative()) {
-      this.deps_.callbacks().triggerSubscribeRequest();
-    }
+  isUpiRequest(request) {
+    return !!getUpiPaymentMethod(request);
   }
 
   /**
-   * Starts the offers flow or alreadySubscribed flow.
-   * @return {!Promise}
+   * Returns upi payment method object if it exists in allowed payment methods
+   * or null if it doesn't
+   *
+   * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
+   * @return {!Promise} The promise will contain the boolean result and error
+   *     message when possible.
    */
-  start() {
-    if (this.activityIframeView_) {
-      // So no error if skipped to payment screen.
-      // Start/cancel events.
-      this.deps_.callbacks().triggerFlowStarted(SubscriptionFlows.SHOW_OFFERS);
-      this.activityIframeView_.onCancel(() => {
-        this.deps_
-          .callbacks()
-          .triggerFlowCanceled(SubscriptionFlows.SHOW_OFFERS);
-      });
-      this.activityIframeView_.on(
-        SkuSelectedResponse,
-        this.startPayFlow_.bind(this)
-      );
-      this.activityIframeView_.on(
-        AlreadySubscribedResponse,
-        this.handleLinkRequest_.bind(this)
-      );
-      this.activityIframeView_.on(
-        ViewSubscriptionsResponse,
-        this.startNativeFlow_.bind(this)
-      );
-
-      this.eventManager_.logSwgEvent(
-        AnalyticsEvent.IMPRESSION_OFFERS,
-        null,
-        getEventParams$1(this.skus_)
-      );
-
-      return this.dialogManager_.openView(this.activityIframeView_);
+  isReadyToPay(request) {
+    // Always return true for UPI if api version is 2 and chrome supports
+    // payment request
+    if (getUpiPaymentMethod(request)) {
+      if (request.existingPaymentMethodRequired) {
+        return Promise.resolve({'result': true, 'paymentMethodPresent': true});
+      } else {
+        return Promise.resolve({'result': true});
+      }
     }
-    return Promise.resolve();
+    throw new Error('No Upi payment method found in handler');
   }
-}
 
-/**
- * The class for subscribe option flow.
- */
-class SubscribeOptionFlow {
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!../api/subscriptions.OffersRequest|undefined} options
+   * Request payment data when payment method is UPI
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @param {!Object} upiPaymentMethod UPI paymentmethod in
+   *     allowedPaymentMethods array.
+   * @param {!Function} onResultCallback Function to call when everything is
+   *     done.
    */
-  constructor(deps, options) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!../api/subscriptions.OffersRequest|undefined} */
-    this.options_ = options;
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
-
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
+  loadPaymentData(paymentDataRequest, upiPaymentMethod, onResultCallback) {
+    const parameters = upiPaymentMethod['parameters'];
+    const transactionInfo = paymentDataRequest['transactionInfo'];
+    const supportedInstruments = 
+        [{
+          'supportedMethods': ['https://tez.google.com/pay'],
+          'data': {
+            'pa': parameters['payeeVpa'],
+            'pn': parameters['payeeName'],
+            'tr': parameters['transactionReferenceId'],
+            'url': parameters['referenceUrl'],
+            'mc': parameters['mcc'],
+            'tn': transactionInfo['transactionNote'],
+          },
+        }];
 
-    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
-    this.eventManager_ = deps.eventManager();
+    if (parameters['transactionId']) {
+      supportedInstruments[0]['data']['tid'] = parameters['transactionId'];
+    }
 
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      deps.win(),
-      this.activityPorts_,
-      feUrl('/optionsiframe'),
-      feArgs({
-        'publicationId': deps.pageConfig().getPublicationId(),
-        'productId': deps.pageConfig().getProductId(),
-        'list': (options && options.list) || 'default',
-        'skus': (options && options.skus) || null,
-        'isClosable': true,
-      }),
-      /* shouldFadeBody */ false
-    );
-  }
+    const details = {
+      'total': {
+        'label': 'Total',
+        'amount': {
+          'currency': transactionInfo['currencyCode'],
+          'value': transactionInfo['totalPrice'],
+        },
+      },
+      'displayItems': [{
+        'label': 'Original Amount',
+        'amount': {
+          'currency': transactionInfo['currencyCode'],
+          'value': transactionInfo['totalPrice'],
+        },
+      }],
+    };
 
-  /**
-   * Starts the offers flow or alreadySubscribed flow.
-   * @return {!Promise}
-   */
-  start() {
-    // Start/cancel events.
-    this.deps_
-      .callbacks()
-      .triggerFlowStarted(SubscriptionFlows.SHOW_SUBSCRIBE_OPTION);
-    this.activityIframeView_.onCancel(() => {
-      this.deps_
-        .callbacks()
-        .triggerFlowCanceled(SubscriptionFlows.SHOW_SUBSCRIBE_OPTION);
-    });
-    this.activityIframeView_.on(
-      SubscribeResponse,
-      this.maybeOpenOffersFlow_.bind(this)
-    );
+    let request = new PaymentRequest(supportedInstruments, details);
 
-    this.activityIframeView_.acceptResult().then(
-      result => {
-        const data = result.data;
-        const response = new SubscribeResponse();
-        if (data['subscribe']) {
-          response.setSubscribe(true);
-        }
-        this.maybeOpenOffersFlow_(response);
-      },
-      reason => {
-        this.dialogManager_.completeView(this.activityIframeView_);
-        throw reason;
-      }
-    );
-    this.eventManager_.logSwgEvent(
-      AnalyticsEvent.IMPRESSION_CLICK_TO_SHOW_OFFERS
-    );
-    return this.dialogManager_.openView(this.activityIframeView_);
+    onResultCallback(
+        this.checkCanMakePayment_(request)
+            .then(result => {
+              if (result) {
+                return this.showUi_(request);
+              } else {
+                return this.redirectToGooglePlay_();
+              }
+            })
+            .then(paymentData => {
+              return this.processData_(
+                  paymentData, paymentDataRequest, upiPaymentMethod);
+            })
+            .catch(error => {
+              error['statusCode'] = Constants.ResponseStatus.CANCELED;
+              return Promise.reject(error);
+            }));
   }
 
   /**
-   * @param {SubscribeResponse} response
+   * Show the Tez payment request UI.
+   *
    * @private
+   * @param {!PaymentRequest} request The payment request object.
+   * @return {!Promise<!PaymentData>} A promise containing payment response.
    */
-  maybeOpenOffersFlow_(response) {
-    if (response.getSubscribe()) {
-      const options = this.options_ || {};
-      if (options.isClosable == undefined) {
-        options.isClosable = OFFERS_VIEW_CLOSABLE;
-      }
-      this.eventManager_.logSwgEvent(AnalyticsEvent.ACTION_VIEW_OFFERS, true);
-      new OffersFlow(this.deps_, options).start();
-    }
+  showUi_(request) {
+    return request.show().then(paymentResponse => {
+      paymentResponse.complete('success');
+      return paymentResponse.details;
+    });
   }
-}
 
-/**
- * The class for Abbreviated Offer flow.
- *
- */
-class AbbrvOfferFlow {
   /**
-   * @param {!./deps.DepsDef} deps
-   * @param {!../api/subscriptions.OffersRequest=} options
+   * Checks whether can make a payment with Tez on this device.
+   *
+   * @private
+   * @param {!PaymentRequest} request The payment request object.
+   * @return {!Promise<boolean>} a promise containing the result of whether can
+   *     make payment.
    */
-  constructor(deps, options = {}) {
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
-
-    /** @private @const {!../api/subscriptions.OffersRequest|undefined} */
-    this.options_ = options;
-
-    /** @private @const {!Window} */
-    this.win_ = deps.win();
-
-    /** @private @const {!../components/activities.ActivityPorts} */
-    this.activityPorts_ = deps.activities();
+  checkCanMakePayment_(request) {
+    // Checks canMakePayment cache, and use the cache result if it exists.
+    const cacheResult =
+        window.sessionStorage.getItem(Constants.UPI_CAN_MAKE_PAYMENT_CACHE_KEY);
+    if (cacheResult) {
+      return Promise.resolve(cacheResult === 'true');
+    }
 
-    /** @private @const {!../components/dialog-manager.DialogManager} */
-    this.dialogManager_ = deps.dialogManager();
+    // Feature detect canMakePayment().
+    if (!request.canMakePayment) {
+      return Promise.resolve(true);
+    }
 
-    /** @private @const {!../runtime/client-event-manager.ClientEventManager} */
-    this.eventManager_ = deps.eventManager();
+    let canMakePaymentPromise = request.canMakePayment();
 
-    /** @private @const {!ActivityIframeView} */
-    this.activityIframeView_ = new ActivityIframeView(
-      this.win_,
-      this.activityPorts_,
-      feUrl('/abbrvofferiframe'),
-      feArgs({
-        'publicationId': deps.pageConfig().getPublicationId(),
-        'productId': deps.pageConfig().getProductId(),
-        'showNative': deps.callbacks().hasSubscribeRequestCallback(),
-        'list': (options && options.list) || 'default',
-        'skus': (options && options.skus) || null,
-        'isClosable': true,
-      }),
-      /* shouldFadeBody */ false
-    );
+    return canMakePaymentPromise.then(result => {
+      // Store the result in cache if the result is true to avoid quota error
+      // caused by querying multiple times with different data.
+      // Doesn't store false because if we do so, user will be redirected to
+      // Google Play again after installing Google Pay if Chrome is not closed.
+      if (result) {
+        window.sessionStorage.setItem(
+            Constants.UPI_CAN_MAKE_PAYMENT_CACHE_KEY, result.toString());
+      }
+      return result;
+    });
   }
 
   /**
-   * @param {AlreadySubscribedResponse} response
+   * Redirect user to Google Pay app in Google Play store
+   *
    * @private
+   * @returns {!Promise<!Object>} Rejected promise with error message
    */
-  handleLinkRequest_(response) {
-    if (response.getSubscriberOrMember()) {
-      this.eventManager_.logSwgEvent(
-        AnalyticsEvent.ACTION_ALREADY_SUBSCRIBED,
-        true
-      );
-      this.deps_.callbacks().triggerLoginRequest({
-        linkRequested: !!response.getLinkRequested(),
-      });
-    }
+  redirectToGooglePlay_() {
+    window.location.replace(
+          // NOLINT
+            'https://play.google.com/store/apps/details?id=com.google.android.apps.nbu.paisa.user');  // NOLINT
+    return Promise.reject(
+        {'errorMessage': 'Cannot redirect to Tez page in Google Play.'});
   }
 
   /**
-   * Starts the offers flow
-   * @return {!Promise}
+   * Convert Tez payment data to GPay payment data if payment succeeded, or
+   * reject if payment failed
+   *
+   * @private
+   * @param {!PaymentData} tezPaymentData The payment data object from Tez.
+   * @param {!PaymentDataRequest} paymentDataRequest The payment data request.
+   * @param {!Object} upiPaymentMethod UPI paymentmethod in
+   * allowedPaymentMethods array
+   * @returns {!Promise<PaymentData>} A promise containing payment data or
+   *     error message.
    */
-  start() {
-    // Start/cancel events.
-    this.deps_
-      .callbacks()
-      .triggerFlowStarted(SubscriptionFlows.SHOW_ABBRV_OFFER);
-    this.activityIframeView_.onCancel(() => {
-      this.deps_
-        .callbacks()
-        .triggerFlowCanceled(SubscriptionFlows.SHOW_ABBRV_OFFER);
-    });
+  processData_(tezPaymentData, paymentDataRequest, upiPaymentMethod) {
+    const tezResponse = JSON.parse(tezPaymentData['tezResponse']);
+    if (tezResponse['Status'] === 'FAILURE') {
+      let error;
+      switch (tezResponse['responseCode']) {
+        case 'ZM':
+          // payment failure due to invalid MPIN
+          error = {
+            'errorCode': PublicErrorCode.BUYER_ACCOUNT_ERROR,
+            'errorMessage': 'Payment failure due to invalid MPIN.'
+          };
+          break;
+        case 'Z9':
+          // payment failure due to insufficient funds
+          error = {
+            'errorCode': PublicErrorCode.BUYER_ACCOUNT_ERROR,
+            'errorMessage': 'Payment failure due to insufficient funds.'
+          };
+          break;
+        case '91':
+          // payment failure due to transaction timeout or connection issue
+          error = {
+            'errorCode': PublicErrorCode.INTERNAL_ERROR,
+            'errorMessage':
+                'Payment failure due to transaction timeout or connection' +
+                ' issue.'
+          };
+          break;
+        default:
+          // payment failure due to user cancel or other issues
+          error = {'errorMessage': 'Payment cancelled.'};
+      }
+      return Promise.reject(error);
+    }
 
-    // If the user is already subscribed, trigger login flow
-    this.activityIframeView_.on(
-      AlreadySubscribedResponse,
-      this.handleLinkRequest_.bind(this)
-    );
+    const signedMessage = {
+      'paymentMethodType': 'UPI',
+      'payeeVpa': upiPaymentMethod['parameters']['payeeVpa'],
+      'status': tezResponse['Status'],
+      'transactionReferenceId':
+          upiPaymentMethod['parameters']['transactionReferenceId'],
+      'transactionId': upiPaymentMethod['parameters']['transactionId'] ?
+          upiPaymentMethod['parameters']['transactionId'] :
+          tezResponse['txnId'],
+      'transactionInfo': paymentDataRequest['transactionInfo'],
+    };
+
+    let paymentData = {
+      'apiVersion': paymentDataRequest['apiVersion'],
+      'apiVersionMinor': paymentDataRequest['apiVersionMinor'],
+      'paymentMethodData': {
+        'type': upiPaymentMethod['type'],
+        'tokenizationData': {
+          'type': 'DIRECT',
+          'token': {
+            'protocolVersion': 'ECv1',
+            // TODO: Verify that response comes from tez and
+            // add signature and encrypt signed message here
+            'signature': '',
+            'signedMessage': signedMessage
+          }
+        }
+      }
+    };
+    return Promise.resolve(paymentData);
+  }
+}
+
+/** @license
+Math.uuid.js (v1.4)
+http://www.broofa.com
+mailto:robert@broofa.com
+Copyright (c) 2010 Robert Kieffer
+Dual licensed under the MIT and GPL licenses.
+*/
+
+/*
+ * Generate a random uuid.
+ *
+ * USAGE: Math.uuid(length, radix)
+ *   length - the desired number of characters
+ *   radix  - the number of allowable values for each character.
+ *
+ * EXAMPLES:
+ *   // No arguments  - returns RFC4122, version 4 ID
+ *   >>> Math.uuid()
+ *   "92329D39-6F5C-4520-ABFC-AAB64544E172"
+ *
+ *   // One argument - returns ID of the specified length
+ *   >>> Math.uuid(15)     // 15 character ID (default base=62)
+ *   "VcydxgltxrVZSTV"
+ *
+ *   // Two arguments - returns ID of the specified length, and radix. (Radix must be <= 62)
+ *   >>> Math.uuid(8, 2)  // 8 character ID (base=2)
+ *   "01001010"
+ *   >>> Math.uuid(8, 10) // 8 character ID (base=10)
+ *   "47473046"
+ *   >>> Math.uuid(8, 16) // 8 character ID (base=16)
+ *   "098F4D35"
+ */
+
+class Random_uuid {}  // Private array of chars to use
+  var CHARS$1 = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
+
+  Random_uuid.uuid = function (len, radix) {
+    var chars = CHARS$1, uuid = [], i;
+    radix = radix || chars.length;
+
+    if (len) {
+      // Compact form
+      for (i = 0; i < len; i++) uuid[i] = chars[0 | Math.random()*radix];
+    } else {
+      // rfc4122, version 4 form
+      var r;
 
-    // If result is due to requesting offers, redirect to offers flow
-    this.activityIframeView_.acceptResult().then(result => {
-      if (result.data['viewOffers']) {
-        const options = this.options_ || {};
-        if (options.isClosable == undefined) {
-          options.isClosable = OFFERS_VIEW_CLOSABLE;
+      // rfc4122 requires these characters
+      uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-';
+      uuid[14] = '4';
+
+      // Fill in random data.  At i==19 set the high bits of clock sequence as
+      // per rfc4122, sec. 4.1.5
+      for (i = 0; i < 36; i++) {
+        if (!uuid[i]) {
+          r = 0 | Math.random()*16;
+          uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
         }
-        this.eventManager_.logSwgEvent(AnalyticsEvent.ACTION_VIEW_OFFERS, true);
-        new OffersFlow(this.deps_, options).start();
-        return;
-      }
-      if (result.data['native']) {
-        this.deps_.callbacks().triggerSubscribeRequest();
-        // The flow is complete.
-        this.dialogManager_.completeView(this.activityIframeView_);
-        return;
       }
-    });
+    }
 
-    this.eventManager_.logSwgEvent(
-      AnalyticsEvent.IMPRESSION_CLICK_TO_SHOW_OFFERS_OR_ALREADY_SUBSCRIBED
-    );
+    return uuid.join('');
+  };
 
-    return this.dialogManager_.openView(this.activityIframeView_);
-  }
-}
+  // A more performant, but slightly bulkier, RFC4122v4 solution.  We boost performance
+  // by minimizing calls to random()
+  Random_uuid.uuidFast = function() {
+    var chars = CHARS$1, uuid = new Array(36), rnd=0, r;
+    for (var i = 0; i < 36; i++) {
+      if (i==8 || i==13 ||  i==18 || i==23) {
+        uuid[i] = '-';
+      } else if (i==14) {
+        uuid[i] = '4';
+      } else {
+        if (rnd <= 0x02) rnd = 0x2000000 + (Math.random()*0x1000000)|0;
+        r = rnd & 0xf;
+        rnd = rnd >> 4;
+        uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
+      }
+    }
+    return uuid.join('');
+  };
+
+  // A more compact, but less performant, RFC4122v4 solution:
+  Random_uuid.uuidCompact = function() {
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
+      var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
+      return v.toString(16);
+    });
+  };
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -14294,65 +14259,19 @@ class AbbrvOfferFlow {
  * limitations under the License.
  */
 
-class Preconnect {
-  /**
-   * @param {!Document} doc
-   */
-  constructor(doc) {
-    /** @private @const {!Document} */
-    this.doc_ = doc;
-  }
-
-  /**
-   * @param {string} url
-   */
-  preconnect(url) {
-    this.pre_(url, 'preconnect');
-  }
-
-  /**
-   * @param {string} url
-   */
-  dnsPrefetch(url) {
-    this.pre_(url, 'dns-prefetch');
-  }
-
-  /**
-   * @param {string} url
-   */
-  prefetch(url) {
-    this.pre_(url, 'preconnect prefetch');
-  }
-
-  /**
-   * @param {string} url
-   * @param {string} as
-   */
-  preload(url, as) {
-    this.pre_(url, 'preconnect preload', as);
-  }
-
-  /**
-   * @param {string} url
-   * @param {string} rel
-   * @param {?string=} as
-   * @private
-   */
-  pre_(url, rel, as) {
-    // <link rel="prefetch" href="..." as="">
-    const linkEl = createElement(this.doc_, 'link', {
-      'rel': rel,
-      'href': url,
-    });
-    if (as) {
-      linkEl.setAttribute('as', as);
-    }
-    this.doc_.head.appendChild(linkEl);
-  }
+/**
+ * Returns a google transaction id.
+ *
+ * @param {string} environment
+ * @return {string}
+ */
+function createGoogleTransactionId(environment) {
+  return Random_uuid.uuidFast() + '.' + environment;
 }
 
 /**
- * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ * @license
+ * Copyright 2018 Google Inc. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -14367,318 +14286,487 @@ class Preconnect {
  * limitations under the License.
  */
 
-const PREFIX = 'subscribe.google.com';
+const TRUSTED_DOMAINS = [
+  'actions.google.com',
+  'amp-actions.sandbox.google.com',
+  'amp-actions-staging.sandbox.google.com',
+  'amp-actions-autopush.sandbox.google.com',
+  'payments.developers.google.com',
+  'payments.google.com',
+];
 
-class Storage {
+/**
+ * The client for interacting with the Google Payment APIs.
+ * <p>
+ * The async refers to the fact that this client supports redirects
+ * when using webactivties.
+ * <p>
+ * If you are using this be sure that this is what you want.
+ * <p>
+ * In almost all cases PaymentsClient is the better client to use because
+ * it exposes a promises based api which is easier to deal with.
+ * @final
+ */
+class PaymentsAsyncClient {
   /**
-   * @param {!Window} win
+   * @param {!PaymentOptions} paymentOptions
+   * @param {function(!Promise<!PaymentData>)} onPaymentResponse
+   * @param {boolean=} useIframe
+   * @param {!ActivityPorts=} activities Can be used to provide a shared
+   *   activities manager. By default, the new manager is created.
    */
-  constructor(win) {
-    /** @private @const {!Window} */
-    this.win_ = win;
+  constructor(paymentOptions, onPaymentResponse, useIframe, activities) {
+    this.onPaymentResponse_ = onPaymentResponse;
 
-    /** @private @const {!Object<string, !Promise<?string>>} */
-    this.values_ = {};
+    validatePaymentOptions(paymentOptions);
+
+    /** @private {?number} */
+    this.loadPaymentDataApiStartTimeMs_ = null;
+
+    /** @private @const {string} */
+    this.environment_ =
+      paymentOptions.environment || Constants.Environment.TEST;
+    if (!PaymentsAsyncClient.googleTransactionId_) {
+      PaymentsAsyncClient.googleTransactionId_ =
+        /** @type {string} */ (this.isInTrustedDomain_() &&
+        paymentOptions['i'] &&
+        paymentOptions['i']['googleTransactionId']
+          ? paymentOptions['i']['googleTransactionId']
+          : createGoogleTransactionId(this.environment_));
+    }
+
+    /** @private @const {!PaymentOptions} */
+    this.paymentOptions_ = paymentOptions;
+
+    /** @private @const {!PaymentsClientDelegateInterface} */
+    this.webActivityDelegate_ = new PaymentsWebActivityDelegate(
+      this.environment_,
+      PaymentsAsyncClient.googleTransactionId_,
+      useIframe,
+      activities,
+      paymentOptions['i'] && paymentOptions['i']['redirectKey']
+    );
+
+    /** @private {number} */
+    this.buyFlowMode_ = BuyFlowMode.PAY_WITH_GOOGLE;
+
+    const paymentRequestSupported = chromeSupportsPaymentRequest();
+    // TODO: Remove the temporary hack that disable payments
+    // request for inline flow.
+    /** @private @const {?PaymentsClientDelegateInterface} */
+    this.delegate_ =
+      paymentRequestSupported && !useIframe
+        ? new PaymentsRequestDelegate(this.environment_)
+        : this.webActivityDelegate_;
+
+    this.upiHandler_ = new UpiHandler();
+
+    this.webActivityDelegate_.onResult(this.onResult_.bind(this));
+    this.delegate_.onResult(this.onResult_.bind(this));
+
+    // If web delegate is used anyway then this is overridden in the web
+    // activity delegate when load payment data is called.
+    if (chromeSupportsPaymentHandler()) {
+      PayFrameHelper.setBuyFlowActivityMode(
+        BuyFlowActivityMode.PAYMENT_HANDLER
+      );
+    } else if (paymentRequestSupported) {
+      PayFrameHelper.setBuyFlowActivityMode(BuyFlowActivityMode.ANDROID_NATIVE);
+    }
+
+    PayFrameHelper.setGoogleTransactionId(
+      PaymentsAsyncClient.googleTransactionId_
+    );
+    PayFrameHelper.postMessage({
+      'eventType': PostMessageEventType.LOG_INITIALIZE_PAYMENTS_CLIENT,
+      'clientLatencyStartMs': Date.now(),
+    });
+
+    window.addEventListener('message', event =>
+      this.handleMessageEvent_(event)
+    );
   }
 
   /**
-   * @param {string} key
-   * @return {!Promise<?string>}
+   * Check whether the user can make payments using the Payment API.
+   *
+   * @param {!IsReadyToPayRequest} isReadyToPayRequest
+   * @return {!Promise} The promise will contain the boolean result and error
+   *     message when possible.
+   * @export
    */
-  get(key) {
-    if (!this.values_[key]) {
-      this.values_[key] = new Promise(resolve => {
-        if (this.win_.sessionStorage) {
-          try {
-            resolve(this.win_.sessionStorage.getItem(storageKey(key)));
-          } catch (e) {
-            // Ignore error.
-            resolve(null);
-          }
-        } else {
-          resolve(null);
-        }
+  isReadyToPay(isReadyToPayRequest) {
+    // Merge with paymentOptions, preferring values from isReadyToPayRequest
+    if (isReadyToPayRequest) {
+      isReadyToPayRequest = Object.assign(
+        {},
+        this.paymentOptions_,
+        isReadyToPayRequest
+      );
+    }
+    const startTimeMs = Date.now();
+    /** @type {?string} */
+    const errorMessage =
+      validateSecureContext() ||
+      validateIsReadyToPayRequest(isReadyToPayRequest);
+    if (errorMessage) {
+      return new Promise((resolve, reject) => {
+        PaymentsAsyncClient.logDevErrorToConsole_('isReadyToPay', errorMessage);
+        PayFrameHelper.postMessage({
+          'eventType': PostMessageEventType.LOG_IS_READY_TO_PAY_API,
+          'error': PublicErrorCode.DEVELOPER_ERROR,
+        });
+        reject({
+          'statusCode': Constants.ResponseStatus.DEVELOPER_ERROR,
+          'statusMessage': errorMessage,
+        });
       });
     }
-    return this.values_[key];
-  }
 
-  /**
-   * @param {string} key
-   * @param {string} value
-   * @return {!Promise}
-   */
-  set(key, value) {
-    this.values_[key] = Promise.resolve(value);
-    return new Promise(resolve => {
-      if (this.win_.sessionStorage) {
-        try {
-          this.win_.sessionStorage.setItem(storageKey(key), value);
-        } catch (e) {
-          // Ignore error.
-        }
-      }
-      resolve();
+    const isReadyToPayPromise = this.isReadyToPay_(isReadyToPayRequest);
+
+    isReadyToPayPromise.then(response => {
+      PayFrameHelper.postMessage({
+        'eventType': PostMessageEventType.LOG_IS_READY_TO_PAY_API,
+        'clientLatencyStartMs': startTimeMs,
+        'isReadyToPayApiResponse': response,
+      });
+      return response;
     });
+    return isReadyToPayPromise;
   }
 
   /**
-   * @param {string} key
-   * @return {!Promise}
+   * Actual implementation of isReadyToPay in a private method so that
+   * we can add callbacks to the promise to measure latencies.
+   *
+   * @param {!IsReadyToPayRequest} isReadyToPayRequest
+   * @return {!Promise} The promise will contain the boolean result and error
+   *     message when possible.
+   * @private
    */
-  remove(key) {
-    delete this.values_[key];
-    return new Promise(resolve => {
-      if (this.win_.sessionStorage) {
-        try {
-          this.win_.sessionStorage.removeItem(storageKey(key));
-        } catch (e) {
-          // Ignore error.
+  isReadyToPay_(isReadyToPayRequest) {
+    if (this.upiHandler_.isUpiRequest(isReadyToPayRequest)) {
+      return this.upiHandler_.isReadyToPay(isReadyToPayRequest);
+    }
+    if (
+      chromeSupportsPaymentRequest() &&
+      !isNativeDisabledInRequest(isReadyToPayRequest)
+    ) {
+      if (isReadyToPayRequest.apiVersion >= 2) {
+        return this.isReadyToPayApiV2ForChromePaymentRequest_(
+          isReadyToPayRequest
+        );
+      } else {
+        // This is the apiVersion 1 branch.
+        // If the merchant supports only Tokenized cards then just rely on
+        // delegate to give us the result.
+        // This will need to change once b/78519188 is fixed.
+        const webPromise = this.webActivityDelegate_.isReadyToPay(
+          isReadyToPayRequest
+        );
+        const nativePromise = this.delegate_.isReadyToPay(isReadyToPayRequest);
+        if (
+          doesMerchantSupportOnlyTokenizedCards(isReadyToPayRequest) &&
+          !chromeSupportsPaymentHandler()
+        ) {
+          return nativePromise;
         }
+        // Return webIsReadyToPay only if delegateIsReadyToPay has been
+        // executed.
+        return nativePromise.then(() => webPromise);
       }
-      resolve();
-    });
+    }
+    const webPromise = this.webActivityDelegate_.isReadyToPay(
+      isReadyToPayRequest
+    );
+    return webPromise;
   }
-}
-
-/**
- * @param {string} key
- * @return {string}
- */
-function storageKey(key) {
-  return PREFIX + ':' + key;
-}
-
-/**
- * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/** @enum {number}  */
-const FilterResult = {
-  /** The event is allowed to proceed to the listeners. */
-  PROCESS_EVENT: 0,
-  /** The event is canceled and the listeners are not informed about it. */
-  CANCEL_EVENT: 1,
-};
-
-/**
- * Defines a client event in SwG
- * Properties:
- * - eventType: Required. The AnalyticsEvent type that occurred.
- * - eventOriginator: Required.  The codebase that initiated the event.
- * - isFromUserAction: Optional.  True if the user took an action to generate
- *   the event.
- * - additionalParameters: Optional.  A JSON object to store generic data.
- *
- *  @typedef {{
- *    eventType: !AnalyticsEvent,
- *    eventOriginator: !EventOriginator,
- *    isFromUserAction: ?boolean,
- *    additionalParameters: ?Object,
- * }}
- */
-let ClientEvent;
 
-/**
- * @interface
- */
-class ClientEventManagerApi {
   /**
-   * Call this function to log an event. The registered listeners will be
-   * invoked unless the event is filtered.
-   * @param {!function(!ClientEvent)} listener
+   * Handle is ready to pay for api v2.
+   *
+   * @param {!IsReadyToPayRequest} isReadyToPayRequest
+   * @return {!Promise} The promise will contain the boolean result and error
+   *     message when possible.
+   * @private
    */
-  registerEventListener(listener) { }
+  isReadyToPayApiV2ForChromePaymentRequest_(isReadyToPayRequest) {
+    let defaultPromise = Promise.resolve({'result': false});
+    if (isReadyToPayRequest.existingPaymentMethodRequired) {
+      defaultPromise = Promise.resolve({
+        'result': false,
+        'paymentMethodPresent': false,
+      });
+    }
 
-  /**
-   * Register a filterer for events if you need to potentially prevent the
-   * listeners from hearing about it.  A filterer should return
-   * FilterResult.CANCEL_EVENT to prevent listeners from hearing about the
-   * event.
-   * @param {!function(!ClientEvent):FilterResult} filterer
-   */
-  registerEventFilterer(filterer) { }
+    let nativePromise = defaultPromise;
+    if (
+      apiV2DoesMerchantSupportSpecifiedCardType(
+        isReadyToPayRequest,
+        Constants.AuthMethod.CRYPTOGRAM_3DS
+      )
+    ) {
+      // If the merchant supports tokenized cards.
+      // Make a separate call to gms core to check if the user isReadyToPay
+      // with just tokenized cards. We can't pass in PAN_ONLY here
+      // because gms core always returns true for PAN_ONLY.
+      // Leave other payment methods as is.
+      const nativeRtpRequest /** @type {!IsReadyToPayRequest} */ = JSON.parse(
+        JSON.stringify(isReadyToPayRequest)
+      );
+      for (let i = 0; i < nativeRtpRequest.allowedPaymentMethods.length; i++) {
+        if (
+          nativeRtpRequest.allowedPaymentMethods[i].type ==
+          Constants.PaymentMethod.CARD
+        ) {
+          nativeRtpRequest.allowedPaymentMethods[i].parameters[
+            'allowedAuthMethods'
+          ] = [Constants.AuthMethod.CRYPTOGRAM_3DS];
+        }
+      }
 
-  /**
-   * Call this function to log an event.  It will immediately throw an error if
-   * the event is invalid.  It will then asynchronously call the filterers and
-   * stop the event if a filterer cancels it.  After that, it will call each
-   * listener asynchronously.
-   * @param {!ClientEvent} event
-   */
-  logEvent(event) { }
-}
+      nativePromise = this.delegate_.isReadyToPay(nativeRtpRequest);
+    }
 
-/**
- * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS-IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
+    let webPromise = defaultPromise;
+    if (
+      apiV2DoesMerchantSupportSpecifiedCardType(
+        isReadyToPayRequest,
+        Constants.AuthMethod.PAN_ONLY
+      )
+    ) {
+      webPromise = this.webActivityDelegate_.isReadyToPay(isReadyToPayRequest);
+    }
 
-/**
- * Helper function to describe an issue with an event object
- * @param {!string} valueName
- * @param {?*} value
- * @returns {!string}
- */
-function createEventErrorMessage(valueName, value) {
-  return 'Event has an invalid ' + valueName + '(' + value + ')';
-}
+    // Update session storage with payment handler canMakePayment result but
+    // rely on web delegate for actual response
+    if (chromeSupportsPaymentHandler()) {
+      return nativePromise.then(() => webPromise);
+    }
 
-/**
- * Throws an error if the event is invalid.
- * @param {!../api/client-event-manager-api.ClientEvent} event
- */
-function validateEvent(event) {
-  if (!isObject(event)) {
-    throw new Error('Event must be a valid object');
+    return nativePromise.then(nativeResult => {
+      if ((nativeResult && nativeResult['result']) == true) {
+        return nativeResult;
+      }
+      return webPromise;
+    });
   }
 
-  if (!isEnumValue(AnalyticsEvent, event.eventType)) {
-    throw new Error(createEventErrorMessage('eventType', event.eventType));
+  /**
+   * Prefetch paymentData to speed up loadPaymentData call. Note the provided
+   * paymentDataRequest should exactly be the same as provided in
+   * loadPaymentData to make the loadPaymentData call fast since current
+   * web flow prefetching is based on the full request parameters.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @export
+   */
+  prefetchPaymentData(paymentDataRequest) {
+    /** @type {?string} */
+    const errorMessage =
+      validateSecureContext() || validatePaymentDataRequest(paymentDataRequest);
+    if (errorMessage) {
+      PaymentsAsyncClient.logDevErrorToConsole_(
+        'prefetchPaymentData',
+        errorMessage
+      );
+      return;
+    }
+    this.assignInternalParams_(paymentDataRequest);
+    if (
+      chromeSupportsPaymentRequest() &&
+      !isNativeDisabledInRequest(paymentDataRequest)
+    ) {
+      this.delegate_.prefetchPaymentData(paymentDataRequest);
+    } else {
+      // For non chrome supports always use the hosting page.
+      this.webActivityDelegate_.prefetchPaymentData(paymentDataRequest);
+    }
   }
 
-  if (!isEnumValue(EventOriginator, event.eventOriginator)) {
-    throw new Error(
-      createEventErrorMessage('eventOriginator', event.eventOriginator)
-    );
-  }
+  /**
+   * Request PaymentData, which contains necessary infomartion to complete a
+   * payment.
+   *
+   * @param {!PaymentDataRequest} paymentDataRequest Provides necessary
+   *     information to support a payment.
+   * @export
+   */
+  loadPaymentData(paymentDataRequest) {
+    PayFrameHelper.postMessage({
+      'eventType': PostMessageEventType.LOG_BUTTON_CLICK,
+    });
+    const errorMessage =
+      validateSecureContext() || validatePaymentDataRequest(paymentDataRequest);
+    this.buyFlowMode_ =
+      paymentDataRequest && paymentDataRequest.swg
+        ? BuyFlowMode.SUBSCRIBE_WITH_GOOGLE
+        : BuyFlowMode.PAY_WITH_GOOGLE;
+    if (errorMessage) {
+      this.onPaymentResponse_(
+        new Promise((resolve, reject) => {
+          PayFrameHelper.postMessage({
+            'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+            'error': PublicErrorCode.DEVELOPER_ERROR,
+            'buyFlowMode': this.buyFlowMode_,
+          });
+          PaymentsAsyncClient.logDevErrorToConsole_(
+            'loadPaymentData',
+            errorMessage
+          );
+          reject({
+            'statusCode': Constants.ResponseStatus.DEVELOPER_ERROR,
+            'statusMessage': errorMessage,
+          });
+        })
+      );
+      return;
+    }
 
-  if (
-    !isObject(event.additionalParameters) &&
-    event.additionalParameters != null
-  ) {
-    throw new Error(
-      createEventErrorMessage(
-        'additionalParameters',
-        event.additionalParameters
-      )
-    );
-  }
+    // Handler for UPI PaymentMethod
+    // Currently we don't support UPI along with other payment methods, if
+    // UPI is in payment methods then we assume it is UPI only.
+    const upiPaymentMethod = getUpiPaymentMethod(paymentDataRequest);
+    if (upiPaymentMethod) {
+      this.upiHandler_.loadPaymentData(
+        paymentDataRequest,
+        upiPaymentMethod,
+        this.onResult_.bind(this)
+      );
+      return;
+    }
 
-  if (event.isFromUserAction != null && !isBoolean(event.isFromUserAction)) {
-    throw new Error(
-      createEventErrorMessage('isFromUserAction', event.isFromUserAction)
+    const isReadyToPayResult = window.sessionStorage.getItem(
+      Constants.IS_READY_TO_PAY_RESULT_KEY
     );
+    this.loadPaymentDataApiStartTimeMs_ = Date.now();
+    this.assignInternalParams_(paymentDataRequest);
+    // We want to fall back to the web delegate if payment handler is supported
+    // and isReadyToPay bit is not explicitly set to true (fallback to web if
+    // isReadyToPay wasn't called for PH)
+    if (
+      (chromeSupportsPaymentHandler() && isReadyToPayResult !== 'true') ||
+      isNativeDisabledInRequest(paymentDataRequest)
+    ) {
+      this.webActivityDelegate_.loadPaymentData(paymentDataRequest);
+    } else {
+      this.delegate_.loadPaymentData(paymentDataRequest);
+    }
   }
-}
 
-/** @implements {../api/client-event-manager-api.ClientEventManagerApi} */
-class ClientEventManager {
   /**
-   * @param {!../api/client-event-manager-api.ClientEvent} event
-   * @return {boolean}
+   * Log developer error to console.
+   *
+   * @param {string} apiName
+   * @param {?string} errorMessage
+   * @private
    */
-  static isPublisherEvent(event) {
-    return (
-      event.eventOriginator === EventOriginator.PROPENSITY_CLIENT ||
-      event.eventOriginator === EventOriginator.PUBLISHER_CLIENT ||
-      event.eventOriginator === EventOriginator.AMP_CLIENT
-    );
+  static logDevErrorToConsole_(apiName, errorMessage) {
+    console.error('DEVELOPER_ERROR in ' + apiName + ' : ' + errorMessage);
   }
 
   /**
+   * Return a <div> element containing a Google Pay payment button.
    *
-   * @param {!Promise} configuredPromise
+   * @param {!ButtonOptions=} options
+   * @return {!Element}
+   * @export
    */
-  constructor(configuredPromise) {
-    /** @private {!Array<function(!../api/client-event-manager-api.ClientEvent)>} */
-    this.listeners_ = [];
-
-    /** @private {!Array<function(!../api/client-event-manager-api.ClientEvent):!FilterResult>} */
-    this.filterers_ = [];
-
-    /** @private {?Promise} */
-    this.lastAction_ = null;
-
-    /** @private @const {!Promise} */
-    this.isReadyPromise_ = configuredPromise;
+  createButton(options = {}) {
+    const button = null;
+    // Only log if button was created successfully
+    const startTimeMs = Date.now();
+    PayFrameHelper.postMessage({
+      'eventType': PostMessageEventType.LOG_RENDER_BUTTON,
+      'clientLatencyStartMs': startTimeMs,
+    });
+    return button;
   }
 
   /**
-   * @overrides
+   * @param {!Event} e postMessage event from the AMP page.
+   * @private
    */
-  registerEventListener(listener) {
-    if (!isFunction(listener)) {
-      throw new Error('Event manager listeners must be a function');
+  handleMessageEvent_(e) {
+    if (this.isInTrustedDomain_()) {
+      // Only handles the event right now if loaded in trusted domain.
+      if (e.data['name'] === 'logPaymentData') {
+        PayFrameHelper.postMessage(e.data['data']);
+      }
     }
-    this.listeners_.push(listener);
   }
 
   /**
-   * @overrides
+   * @private
+   * @return {boolean}
    */
-  registerEventFilterer(filterer) {
-    if (!isFunction(filterer)) {
-      throw new Error('Event manager filterers must be a function');
-    }
-    this.filterers_.push(filterer);
+  isInTrustedDomain_() {
+    return TRUSTED_DOMAINS.indexOf(window.location.hostname) != -1;
   }
 
   /**
-   * @overrides
+   * Called when load payment data result is returned. This triggers the payment
+   * response callback passed to the client.
+   *
+   * @private
    */
-  logEvent(event) {
-    validateEvent(event);
-    this.lastAction_ = this.isReadyPromise_.then(() => {
-      for (let filterer = 0; filterer < this.filterers_.length; filterer++) {
-        try {
-          if (this.filterers_[filterer](event) === FilterResult.CANCEL_EVENT) {
-            return Promise.resolve();
-          }
-        } catch (e) {
-          log_5(e);
-        }
-      }
-      for (let listener = 0; listener < this.listeners_.length; listener++) {
-        try {
-          this.listeners_[listener](event);
-        } catch (e) {
-          log_5(e);
+  onResult_(response) {
+    response
+      .then(result => {
+        PayFrameHelper.postMessage({
+          'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+          'clientLatencyStartMs': this.loadPaymentDataApiStartTimeMs_,
+          'buyFlowMode': this.buyFlowMode_,
+        });
+      })
+      .catch(result => {
+        if (result['errorCode']) {
+          PayFrameHelper.postMessage({
+            'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+            'error': /** @type {!PublicErrorCode} */ (result['errorCode']),
+            'buyFlowMode': this.buyFlowMode_,
+          });
+        } else {
+          // If user closes window we don't get a error code
+          PayFrameHelper.postMessage({
+            'eventType': PostMessageEventType.LOG_LOAD_PAYMENT_DATA_API,
+            'error': PublicErrorCode.BUYER_CANCEL,
+            'buyFlowMode': this.buyFlowMode_,
+          });
         }
-      }
-      return Promise.resolve();
-    });
+      });
+    this.onPaymentResponse_(response);
   }
 
-  /**
-   * Creates an event with the arguments provided and calls logEvent.
-   * @param {!AnalyticsEvent} eventType
-   * @param {?boolean=} isFromUserAction
-   * @param {../proto/api_messages.EventParams=} eventParams
+  /**
+   * @param {!PaymentDataRequest} paymentDataRequest
+   * @return {!PaymentDataRequest}
+   * @private
    */
-  logSwgEvent(eventType, isFromUserAction = false, eventParams = null) {
-    this.logEvent({
-      eventType,
-      eventOriginator: EventOriginator.SWG_CLIENT,
-      isFromUserAction,
-      additionalParameters: eventParams,
-    });
+  assignInternalParams_(paymentDataRequest) {
+    const internalParam = {
+      'startTimeMs': Date.now(),
+      'googleTransactionId': PaymentsAsyncClient.googleTransactionId_,
+    };
+    paymentDataRequest['i'] = paymentDataRequest['i']
+      ? Object.assign(internalParam, paymentDataRequest['i'])
+      : internalParam;
+    return paymentDataRequest;
   }
 }
 
+/**
+ * Whether the request specifies that the native support has to be disabled.
+ *
+ * @param {!IsReadyToPayRequest|!PaymentDataRequest} request
+ * @return {boolean}
+ */
+function isNativeDisabledInRequest(request) {
+  return (request['i'] && request['i']['disableNative']) === true;
+}
+
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
@@ -14695,270 +14783,406 @@ class ClientEventManager {
  * limitations under the License.
  */
 
-/** @const {!Object<string, string>} */
-const iframeStyles = {
-  display: 'none',
+const REDIRECT_STORAGE_KEY = 'subscribe.google.com:rk';
+
+/**
+ * @const {!Object<string, string>}
+ * @package Visible for testing only.
+ */
+const PAY_ORIGIN = {
+  'PRODUCTION': 'https://pay.google.com',
+  'SANDBOX': 'https://pay.sandbox.google.com',
 };
 
-class AnalyticsService {
+/** @return {string} */
+function payUrl() {
+  return feCached(PAY_ORIGIN['PRODUCTION'] + '/gp/p/ui/pay');
+}
+
+/**
+ */
+class PayClient {
   /**
    * @param {!./deps.DepsDef} deps
    */
   constructor(deps) {
-    /** @private @const {!../model/doc.Doc} */
-    this.doc_ = deps.doc();
-
-    /** @private @const {!./deps.DepsDef} */
-    this.deps_ = deps;
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
 
     /** @private @const {!../components/activities.ActivityPorts} */
     this.activityPorts_ = deps.activities();
 
-    /** @private @const {!HTMLIFrameElement} */
-    this.iframe_ = /** @type {!HTMLIFrameElement} */ (createElement(
-      this.doc_.getWin().document,
-      'iframe',
-      {}
-    ));
-
-    setImportantStyles(this.iframe_, iframeStyles);
-
-    /** @private @const {string} */
-    this.src_ = feUrl('/serviceiframe');
-
-    /** @private @const {string} */
-    this.publicationId_ = deps.pageConfig().getPublicationId();
+    /** @private {?function(!Promise<!PaymentData>)} */
+    this.responseCallback_ = null;
 
-    this.args_ = feArgs({
-      publicationId: this.publicationId_,
-    });
+    /** @private {?PaymentDataRequest} */
+    this.request_ = null;
 
-    /** @private @type {!boolean} */
-    this.everLogged_ = false;
+    /** @private {?Promise<!PaymentData>} */
+    this.response_ = null;
 
-    /**
-     * @private @const {!AnalyticsContext}
-     */
-    this.context_ = new AnalyticsContext();
+    /** @private @const {!./analytics-service.AnalyticsService} */
+    this.analytics_ = deps.analytics();
 
-    this.context_.setTransactionId(getUuid());
+    /** @private @const {!RedirectVerifierHelper} */
+    this.redirectVerifierHelper_ = new RedirectVerifierHelper(this.win_);
 
-    /** @private {?Promise<!web-activities/activity-ports.ActivityIframePort>} */
-    this.serviceReady_ = null;
+    /** @private @const {!PaymentsAsyncClient} */
+    this.client_ = this.createClient_(
+      /** @type {!PaymentOptions} */
+      ({
+        environment: 'PRODUCTION',
+        'i': {
+          'redirectKey': this.redirectVerifierHelper_.restoreKey(),
+        },
+      }),
+      this.analytics_.getTransactionId(),
+      this.handleResponse_.bind(this)
+    );
 
-    /** @private {?Promise} */
-    this.lastAction_ = null;
+    // Prepare new verifier pair.
+    this.redirectVerifierHelper_.prepare();
 
-    /** @private @const {!ClientEventManager} */
+    /** @private @const {!./client-event-manager.ClientEventManager} */
     this.eventManager_ = deps.eventManager();
-    this.eventManager_.registerEventListener(
-      this.handleClientEvent_.bind(this)
-    );
   }
 
   /**
-   * @param {string} transactionId
+   * @param {!PaymentOptions} options
+   * @param {string} googleTransactionId
+   * @param {function(!Promise<!PaymentData>)} handler
+   * @return {!PaymentsAsyncClient}
+   * @private
    */
-  setTransactionId(transactionId) {
-    this.context_.setTransactionId(transactionId);
+  createClient_(options, googleTransactionId, handler) {
+    // Assign Google Transaction ID to PaymentsAsyncClient.googleTransactionId_
+    // so it can be passed to gpay_async.js and stored in payment clearcut log.
+    PaymentsAsyncClient.googleTransactionId_ = googleTransactionId;
+    return new PaymentsAsyncClient(
+      options,
+      handler,
+      /* useIframe */ false,
+      this.activityPorts_.getOriginalWebActivityPorts()
+    );
   }
 
   /**
-   * @return {string}
+   * @param {!../utils/preconnect.Preconnect} pre
    */
-  getTransactionId() {
-    return /** @type {string} */ (this.context_.getTransactionId());
+  preconnect(pre) {
+    pre.prefetch(payUrl());
+    pre.prefetch(
+      'https://payments.google.com/payments/v4/js/integrator.js?ss=md'
+    );
+    pre.prefetch('https://clients2.google.com/gr/gr_full_2.0.6.js');
+    pre.preconnect('https://www.gstatic.com/');
+    pre.preconnect('https://fonts.googleapis.com/');
+    pre.preconnect('https://www.google.com/');
   }
 
   /**
-   * @return {?string}
+   * @return {string}
    */
-  getSku() {
-    return this.context_.getSku();
+  getType() {
+    // TODO(alin04): remove once all references removed.
+    return 'PAYJS';
   }
 
   /**
-   * @param {string} sku
+   * @param {!PaymentDataRequest} paymentRequest
+   * @param {!PayOptionsDef=} options
    */
-  setSku(sku) {
-    this.context_.setSku(sku);
-  }
+  start(paymentRequest, options = {}) {
+    this.request_ = paymentRequest;
 
-  /**
-   * @param {!Array<string>} labels
-   */
-  addLabels(labels) {
-    if (labels && labels.length > 0) {
-      const newLabels = [].concat(this.context_.getLabelList());
-      labels.forEach(label => {
-        if (newLabels.indexOf(label) == -1) {
-          newLabels.push(label);
-        }
+    if (options.forceRedirect) {
+      paymentRequest = Object.assign(paymentRequest, {
+        'forceRedirect': options.forceRedirect || false,
       });
-      this.context_.setLabelList(newLabels);
     }
+    setInternalParam(
+      paymentRequest,
+      'disableNative',
+      // The page cannot be iframed at this time. May be relaxed later
+      // for AMP and similar contexts.
+      this.win_ != this.top_()
+    );
+    let resolver = null;
+    const promise = new Promise(resolve => (resolver = resolve));
+    // Notice that the callback for verifier may execute asynchronously.
+    this.redirectVerifierHelper_.useVerifier(verifier => {
+      if (verifier) {
+        setInternalParam(paymentRequest, 'redirectVerifier', verifier);
+      }
+      if (options.forceRedirect) {
+        const client = this.client_;
+        this.eventManager_.getReadyPromise().then(() => {
+          this.analytics_.getLoggingPromise().then(() => {
+            client.loadPaymentData(paymentRequest);
+            resolver(true);
+          });
+        });
+      } else {
+        this.client_.loadPaymentData(paymentRequest);
+        resolver(true);
+      }
+    });
+    return promise;
   }
 
   /**
-   * @return {!HTMLIFrameElement}
+   * @param {function(!Promise<!PaymentData>)} callback
    */
-  getElement() {
-    return this.iframe_;
+  onResponse(callback) {
+    this.responseCallback_ = callback;
+    const response = this.response_;
+    if (response) {
+      Promise.resolve().then(() => {
+        if (response) {
+          callback(this.convertResponse_(response, this.request_));
+        }
+      });
+    }
   }
 
   /**
-   * @return {string}
+   * @param {!Promise<!PaymentData>} responsePromise
    * @private
    */
-  getQueryString_() {
-    return this.doc_.getWin().location.search;
+  handleResponse_(responsePromise) {
+    this.response_ = responsePromise;
+    if (this.responseCallback_) {
+      this.responseCallback_(
+        this.convertResponse_(this.response_, this.request_)
+      );
+    }
   }
 
   /**
-   * @return {string}
+   * @param {!Promise<!PaymentData>} response
+   * @param {?PaymentDataRequest} request
+   * @return {!Promise<!PaymentData>}
    * @private
    */
-  getReferrer_() {
-    return this.doc_.getWin().document.referrer;
+  convertResponse_(response, request) {
+    return response
+      .then(
+        // Temporary client side solution to remember the
+        // input params. TODO: Remove this once server-side
+        // input preservation is done and is part of the response.
+        res => {
+          if (request) {
+            res['paymentRequest'] = request;
+          }
+          return res;
+        }
+      )
+      .catch(reason => {
+        if (typeof reason == 'object' && reason['statusCode'] == 'CANCELED') {
+          const error = createCancelError(this.win_);
+          if (request) {
+            error['productType'] =
+              /** @type {!PaymentDataRequest} */ (request)['i']['productType'];
+          } else {
+            error['productType'] = null;
+          }
+          return Promise.reject(error);
+        }
+        return Promise.reject(reason);
+      });
   }
 
   /**
+   * @return {!Window}
    * @private
    */
-  setContext_() {
-    const utmParams = parseQueryString$1(this.getQueryString_());
-    this.context_.setReferringOrigin(parseUrl$1(this.getReferrer_()).origin);
-    const campaign = utmParams['utm_campaign'];
-    const medium = utmParams['utm_medium'];
-    const source = utmParams['utm_source'];
-    if (campaign) {
-      this.context_.setUtmCampaign(campaign);
-    }
-    if (medium) {
-      this.context_.setUtmMedium(medium);
-    }
-    if (source) {
-      this.context_.setUtmSource(source);
-    }
-    this.addLabels(getOnExperiments(this.doc_.getWin()));
-  }
-
-  /**
-   * @return {!Promise<!../components/activities.ActivityIframePort>}
-   */
-  start() {
-    if (!this.serviceReady_) {
-      // TODO(sohanirao): Potentially do this even earlier
-      this.doc_.getBody().appendChild(this.getElement());
-      this.serviceReady_ = this.activityPorts_
-        .openIframe(this.iframe_, this.src_, this.args_)
-        .then(port => {
-          this.setContext_();
-          return port.whenReady().then(() => port);
-        });
-    }
-    return this.serviceReady_;
+  top_() {
+    // Only exists for testing since it's not possible to override `window.top`.
+    return this.win_.top;
   }
+}
 
+/**
+ * This helper generates key/verifier pair for the redirect mode. When the
+ * redirect mode is used, the encrypted payload is returned via nivigation URL.
+ * This payload need to be decrypted and to avoid session fixation attacks, a
+ * verifier has to be used. This redirect verifier is not the only session
+ * verifier in use: we also use GAIA. However, we have to fallback to this
+ * verifier when GAIA is not available.
+ *
+ * @package Visible for testing only.
+ */
+class RedirectVerifierHelper {
   /**
-   * @param {boolean} isReadyToPay
+   * @param {!Window} win
    */
-  setReadyToPay(isReadyToPay) {
-    this.context_.setReadyToPay(isReadyToPay);
-  }
+  constructor(win) {
+    /** @private @const {!Window} */
+    this.win_ = win;
 
-  /**
-   */
-  close() {
-    this.doc_.getBody().removeChild(this.getElement());
-  }
+    /** @private {boolean} */
+    this.pairCreated_ = false;
 
-  /**
-   * @return {!AnalyticsContext}
-   */
-  getContext() {
-    return this.context_;
+    /** @private {?RedirectVerifierPairDef} */
+    this.pair_ = null;
+
+    /** @private {?Promise<?RedirectVerifierPairDef>} */
+    this.pairPromise_ = null;
   }
 
   /**
-   * Returns true if any logs have already be sent to the analytics server.
-   * @return {boolean}
+   * To avoid popup blockers, the key/verifier pair is created as soon as
+   * possible.
+   * @return {?Promise}
    */
-  getHasLogged() {
-    return this.everLogged_;
+  prepare() {
+    return this.getOrCreatePair_(() => {});
   }
 
   /**
-   * @param {!../api/client-event-manager-api.ClientEvent} event
-   * @return {!AnalyticsRequest}
+   * Calls the provided callback with the generated redirect verifier. This
+   * API is sync/async, which is a big anti-pattern. However, it's necessary
+   * to reduce the risk of popup blockers. If the verifier is already available
+   * (see `prepare` method), the callback will be called immediately and thus
+   * in the same event loop as the user action.
+   *
+   * The return verifier could be `null`. This could mean either that its
+   * generation failed, or if the platform doesn't support necessary APIs, such
+   * as Web Crypto. The redirect can still proceed and try to fallback on GAIA
+   * as a redirect verifier. The set of platforms where GAIA is not available
+   * and the redirect verifier cannot be created is negligible.
+   *
+   * The key corresponding to the returned verifier is stored in the session
+   * storage and can be later restored using `restoreKey` method.
+   *
+   * @param {function(?string)} callback
    */
-  createLogRequest_(event) {
-    const meta = new AnalyticsEventMeta();
-    meta.setEventOriginator(event.eventOriginator);
-    meta.setIsFromUserAction(event.isFromUserAction);
-
-    const request = new AnalyticsRequest();
-    request.setEvent(event.eventType);
-    request.setContext(this.context_);
-    request.setMeta(meta);
-    if (event.additionalParameters instanceof EventParams) {
-      request.setParams(event.additionalParameters);
-    } // Ignore event.additionalParameters.  It may have data we shouldn't log.
-    return request;
+  useVerifier(callback) {
+    this.getOrCreatePair_(pair => {
+      if (pair) {
+        try {
+          this.win_.localStorage.setItem(REDIRECT_STORAGE_KEY, pair.key);
+        } catch (e) {
+          // If storage has failed, there's no point in using the verifer.
+          // However, there are other ways to recover the redirect, so it's
+          // not necessarily a fatal condition.
+          pair = null;
+        }
+      }
+      callback((pair && pair.verifier) || null);
+    });
   }
 
   /**
-   * @return {boolean}
+   * Restores the redirect key from the session storage. The key may be null.
+   * @return {?string}
    */
-  shouldLogPublisherEvents_() {
-    return this.deps_.config().enableSwgAnalytics === true;
+  restoreKey() {
+    try {
+      return (
+        (this.win_.localStorage &&
+          this.win_.localStorage.getItem(REDIRECT_STORAGE_KEY)) ||
+        null
+      );
+    } catch (e) {
+      return null;
+    }
   }
 
   /**
-   * @param {!../api/client-event-manager-api.ClientEvent} event
-   * @return {boolean}
+   * @param {function(?RedirectVerifierPairDef)} callback
+   * @return {?Promise}
+   * @private
    */
-  shouldAlwaysLogEvent_(event) {
-    /* AMP_CLIENT events are considered publisher events and we generally only
-     * log those if the publisher decided to enable publisher event logging for
-     * privacy purposes.  The page load event is not private and is necessary
-     * just so we know the user is in AMP, so we will log it regardless of
-     * configuration.
-     */
-    return (
-      event.eventType === AnalyticsEvent.IMPRESSION_PAGE_LOAD &&
-      event.eventOriginator === EventOriginator.AMP_CLIENT
-    );
+  getOrCreatePair_(callback) {
+    this.createPair_();
+    if (this.pairCreated_) {
+      // Already created.
+      callback(this.pair_);
+    } else if (this.pairPromise_) {
+      // Otherwise wait for it to be created.
+      this.pairPromise_.then(pair => callback(pair));
+    }
+    return this.pairPromise_;
   }
 
   /**
-   *  Listens for new events from the events manager and handles logging
-   * @param {!../api/client-event-manager-api.ClientEvent} event
+   * @private
    */
-  handleClientEvent_(event) {
-    //this event is just used to communicate information internally.  It should
-    //not be reported to the SwG analytics service.
-    if (event.eventType === AnalyticsEvent.EVENT_SUBSCRIPTION_STATE) {
+  createPair_() {
+    // Either already created or already started.
+    if (this.pairCreated_ || this.pairPromise_) {
       return;
     }
 
+    // Check that the platform can fully support verification. That means
+    // that it's expected to implement the following APIs:
+    // a. Local storage (localStorage);
+    // b. WebCrypto (crypto.subtle);
+    // c. Crypto random (crypto.getRandomValues);
+    // d. SHA284 (crypto.subtle.digest).
+    const crypto = this.win_.crypto;
     if (
-      ClientEventManager.isPublisherEvent(event) &&
-      !this.shouldLogPublisherEvents_() &&
-      !this.shouldAlwaysLogEvent_(event)
+      this.win_.localStorage &&
+      crypto &&
+      crypto.getRandomValues &&
+      crypto.subtle &&
+      crypto.subtle.digest
     ) {
-      return;
+      this.pairPromise_ = new Promise((resolve, reject) => {
+        // 1. Use crypto random to create a 128-bit (16 byte) redirect key.
+        const keyBytes = new Uint8Array(16);
+        crypto.getRandomValues(keyBytes);
+
+        // 2. Encode key as base64.
+        const key = btoa(bytesToString(keyBytes));
+
+        // 3. Create a hash.
+        crypto.subtle.digest({name: 'SHA-384'}, stringToBytes(key)).then(
+          buffer => {
+            const verifier = btoa(
+              bytesToString(
+                new Uint8Array(/** @type {!ArrayBuffer} */ (buffer))
+              )
+            );
+            resolve({key, verifier});
+          },
+          reason => {
+            reject(reason);
+          }
+        );
+      })
+        .catch(() => {
+          // Ignore failures. A failure to create a redirect verifier is often
+          // recoverable.
+          return null;
+        })
+        .then(pair => {
+          this.pairCreated_ = true;
+          this.pair_ = pair;
+          return pair;
+        });
+    } else {
+      // Not supported.
+      this.pairCreated_ = true;
+      this.pair_ = null;
     }
-    this.lastAction_ = this.start().then(port => {
-      const request = this.createLogRequest_(event);
-      this.everLogged_ = true;
-      port.execute(request);
-    });
   }
 }
 
 /**
- * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
+ * @param {!PaymentDataRequest} paymentRequest
+ * @param {string} param
+ * @param {*} value
+ */
+function setInternalParam(paymentRequest, param, value) {
+  paymentRequest['i'] = Object.assign(paymentRequest['i'] || {}, {
+    [param]: value,
+  });
+}
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -14973,57 +15197,61 @@ class AnalyticsService {
  * limitations under the License.
  */
 
-/** @const {!Object<string,AnalyticsEvent>} */
-const PublisherEventToAnalyticsEvent = {
-  [Event.IMPRESSION_PAYWALL]: AnalyticsEvent.IMPRESSION_PAYWALL,
-  [Event.IMPRESSION_AD]: AnalyticsEvent.IMPRESSION_AD,
-  [Event.IMPRESSION_OFFERS]: AnalyticsEvent.IMPRESSION_OFFERS,
-  [Event.ACTION_SUBSCRIPTIONS_LANDING_PAGE]:
-    AnalyticsEvent.ACTION_SUBSCRIPTIONS_LANDING_PAGE,
-  [Event.ACTION_OFFER_SELECTED]: AnalyticsEvent.ACTION_OFFER_SELECTED,
-  [Event.ACTION_PAYMENT_FLOW_STARTED]:
-    AnalyticsEvent.ACTION_PAYMENT_FLOW_STARTED,
-  [Event.ACTION_PAYMENT_COMPLETED]: AnalyticsEvent.ACTION_PAYMENT_COMPLETE,
-  [Event.EVENT_CUSTOM]: AnalyticsEvent.EVENT_CUSTOM,
-};
+class Preconnect {
+  /**
+   * @param {!Document} doc
+   */
+  constructor(doc) {
+    /** @private @const {!Document} */
+    this.doc_ = doc;
+  }
 
-/** @const {!Object<number,?Event>} */
-const AnalyticsEventToPublisherEvent = {
-  [AnalyticsEvent.UNKNOWN]: null,
-  [AnalyticsEvent.IMPRESSION_PAYWALL]: Event.IMPRESSION_PAYWALL,
-  [AnalyticsEvent.IMPRESSION_AD]: Event.IMPRESSION_AD,
-  [AnalyticsEvent.IMPRESSION_OFFERS]: Event.IMPRESSION_OFFERS,
-  [AnalyticsEvent.IMPRESSION_SUBSCRIBE_BUTTON]: null,
-  [AnalyticsEvent.IMPRESSION_SMARTBOX]: null,
-  [AnalyticsEvent.ACTION_SUBSCRIBE]: null,
-  [AnalyticsEvent.ACTION_PAYMENT_COMPLETE]: Event.ACTION_PAYMENT_COMPLETED,
-  [AnalyticsEvent.ACTION_ACCOUNT_CREATED]: null,
-  [AnalyticsEvent.ACTION_ACCOUNT_ACKNOWLEDGED]: null,
-  [AnalyticsEvent.ACTION_SUBSCRIPTIONS_LANDING_PAGE]:
-    Event.ACTION_SUBSCRIPTIONS_LANDING_PAGE,
-  [AnalyticsEvent.ACTION_PAYMENT_FLOW_STARTED]:
-    Event.ACTION_PAYMENT_FLOW_STARTED,
-  [AnalyticsEvent.ACTION_OFFER_SELECTED]: Event.ACTION_OFFER_SELECTED,
-  [AnalyticsEvent.EVENT_PAYMENT_FAILED]: null,
-  [AnalyticsEvent.EVENT_CUSTOM]: Event.EVENT_CUSTOM,
-};
+  /**
+   * @param {string} url
+   */
+  preconnect(url) {
+    this.pre_(url, 'preconnect');
+  }
 
-/**
- * Converts a propensity event enum into an analytics event enum.
- * @param {!Event|string} propensityEvent
- * @returns {!AnalyticsEvent}
- */
-function publisherEventToAnalyticsEvent(propensityEvent) {
-  return PublisherEventToAnalyticsEvent[propensityEvent];
-}
+  /**
+   * @param {string} url
+   */
+  dnsPrefetch(url) {
+    this.pre_(url, 'dns-prefetch');
+  }
 
-/**
- * Converts an analytics event enum into a propensity event enum.
- * @param {!AnalyticsEvent} analyticsEvent
- * @returns {?Event}
- */
-function analyticsEventToPublisherEvent(analyticsEvent) {
-  return AnalyticsEventToPublisherEvent[analyticsEvent];
+  /**
+   * @param {string} url
+   */
+  prefetch(url) {
+    this.pre_(url, 'preconnect prefetch');
+  }
+
+  /**
+   * @param {string} url
+   * @param {string} as
+   */
+  preload(url, as) {
+    this.pre_(url, 'preconnect preload', as);
+  }
+
+  /**
+   * @param {string} url
+   * @param {string} rel
+   * @param {?string=} as
+   * @private
+   */
+  pre_(url, rel, as) {
+    // <link rel="prefetch" href="..." as="">
+    const linkEl = createElement(this.doc_, 'link', {
+      'rel': rel,
+      'href': url,
+    });
+    if (as) {
+      linkEl.setAttribute('as', as);
+    }
+    this.doc_.head.appendChild(linkEl);
+  }
 }
 
 /**
@@ -15105,12 +15333,13 @@ class PropensityServer {
    * @return {string}
    */
   propensityUrl_(url) {
-    url = url + '&u_tz=240&v=' + this.version_;
+    url = addQueryParam(url, 'u_tz', '240');
+    url = addQueryParam(url, 'v', String(this.version_));
     const clientId = this.getClientId_();
     if (clientId) {
-      url = url + '&cookie=' + clientId;
+      url = addQueryParam(url, 'cookie', clientId);
     }
-    url = url + '&cdm=' + this.win_.location.hostname;
+    url = addQueryParam(url, 'cdm', this.win_.location.hostname);
     return url;
   }
 
@@ -15123,11 +15352,11 @@ class PropensityServer {
       method: 'GET',
       credentials: 'include',
     });
-    let userState = this.publicationId_ + ':' + state;
+    let url = adsUrl('/subopt/data');
+    url = addQueryParam(url, 'states', this.publicationId_ + ':' + state);
     if (productsOrSkus) {
-      userState = userState + ':' + encodeURIComponent(productsOrSkus);
+      url = addQueryParam(url, 'extrainfo', productsOrSkus);
     }
-    const url = adsUrl('/subopt/data?states=') + encodeURIComponent(userState);
     return this.fetcher_.fetch(this.propensityUrl_(url), init);
   }
 
@@ -15141,11 +15370,11 @@ class PropensityServer {
       method: 'GET',
       credentials: 'include',
     });
-    let eventInfo = this.publicationId_ + ':' + event;
+    let url = adsUrl('/subopt/data');
+    url = addQueryParam(url, 'events', this.publicationId_ + ':' + event);
     if (context) {
-      eventInfo = eventInfo + ':' + encodeURIComponent(context);
+      url = addQueryParam(url, 'extrainfo', context);
     }
-    const url = adsUrl('/subopt/data?events=') + encodeURIComponent(eventInfo);
     return this.fetcher_.fetch(this.propensityUrl_(url), init);
   }
 
@@ -15385,8 +15614,10 @@ class Propensity {
   }
 }
 
+const CSS$1 = ".swg-dialog,.swg-toast{box-sizing:border-box;background-color:#fff!important}.swg-toast{position:fixed!important;bottom:0!important;max-height:46px!important;z-index:2147483647!important;border:none!important}@media (max-height:640px), (max-width:640px){.swg-dialog,.swg-toast{width:480px!important;left:-240px!important;margin-left:50vw!important;border-top-left-radius:8px!important;border-top-right-radius:8px!important;box-shadow:0 1px 1px rgba(60,64,67,.3),0 1px 4px 1px rgba(60,64,67,.15)!important}}@media (min-width:640px) and (min-height:640px){.swg-dialog{width:630px!important;left:-315px!important;margin-left:50vw!important;background-color:transparent!important;border:none!important}.swg-toast{left:0!important}}@media (max-width:480px){.swg-dialog,.swg-toast{width:100%!important;left:0!important;right:0!important;margin-left:0!important}}\n/*# sourceURL=/./src/components/dialog.css*/";
+
 /**
- * Copyright 2019 The Subscribe with Google Authors. All Rights Reserved.
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -15401,87 +15632,167 @@ class Propensity {
  * limitations under the License.
  */
 
-/**
- * @implements {../api/logger-api.LoggerApi}
- */
-class Logger {
+const PREFIX = 'subscribe.google.com';
+
+class Storage {
   /**
-   * @param {!./deps.DepsDef} deps
+   * @param {!Window} win
    */
-  constructor(deps) {
-    /** @private @const {!../api/client-event-manager-api.ClientEventManagerApi} */
-    this.eventManager_ = deps.eventManager();
-  }
+  constructor(win) {
+    /** @private @const {!Window} */
+    this.win_ = win;
 
-  /** @override */
-  sendSubscriptionState(state, jsonProducts) {
-    if (!isEnumValue(SubscriptionState, state)) {
-      throw new Error('Invalid subscription state provided');
-    }
-    if (
-      (SubscriptionState.SUBSCRIBER == state ||
-        SubscriptionState.PAST_SUBSCRIBER == state) &&
-      !jsonProducts
-    ) {
-      throw new Error(
-        'Entitlements must be provided for users with' +
-          ' active or expired subscriptions'
-      );
-    }
-    if (jsonProducts && !isObject(jsonProducts)) {
-      throw new Error('Entitlements must be an Object');
-    }
-    let productsOrSkus = null;
-    if (jsonProducts) {
-      productsOrSkus = JSON.stringify(jsonProducts);
-    }
-    this.eventManager_.logEvent({
-      eventType: AnalyticsEvent.EVENT_SUBSCRIPTION_STATE,
-      eventOriginator: EventOriginator.PUBLISHER_CLIENT,
-      isFromUserAction: null,
-      additionalParameters: {
-        state,
-        productsOrSkus,
-      },
-    });
+    /** @private @const {!Object<string, !Promise<?string>>} */
+    this.values_ = {};
   }
 
-  /** @override */
-  sendEvent(userEvent) {
-    let data = null;
-    if (
-      !isEnumValue(Event, userEvent.name) ||
-      !publisherEventToAnalyticsEvent(userEvent.name)
-    ) {
-      throw new Error('Invalid user event provided(' + userEvent.name + ')');
+  /**
+   * @param {string} key
+   * @return {!Promise<?string>}
+   */
+  get(key) {
+    if (!this.values_[key]) {
+      this.values_[key] = new Promise(resolve => {
+        if (this.win_.sessionStorage) {
+          try {
+            resolve(this.win_.sessionStorage.getItem(storageKey(key)));
+          } catch (e) {
+            // Ignore error.
+            resolve(null);
+          }
+        } else {
+          resolve(null);
+        }
+      });
     }
+    return this.values_[key];
+  }
 
-    if (userEvent.data) {
-      if (!isObject(userEvent.data)) {
-        throw new Error('Event data must be an Object(' + userEvent.data + ')');
-      } else {
-        data = {};
-        Object.assign(data, userEvent.data);
+  /**
+   * @param {string} key
+   * @param {string} value
+   * @return {!Promise}
+   */
+  set(key, value) {
+    this.values_[key] = Promise.resolve(value);
+    return new Promise(resolve => {
+      if (this.win_.sessionStorage) {
+        try {
+          this.win_.sessionStorage.setItem(storageKey(key), value);
+        } catch (e) {
+          // Ignore error.
+        }
       }
-    }
+      resolve();
+    });
+  }
 
-    if (isBoolean(userEvent.active)) {
-      if (!data) {
-        data = {};
+  /**
+   * @param {string} key
+   * @return {!Promise}
+   */
+  remove(key) {
+    delete this.values_[key];
+    return new Promise(resolve => {
+      if (this.win_.sessionStorage) {
+        try {
+          this.win_.sessionStorage.removeItem(storageKey(key));
+        } catch (e) {
+          // Ignore error.
+        }
       }
-      Object.assign(data, {'is_active': userEvent.active});
-    } else if (userEvent.active != null) {
-      throw new Error('Event active must be a boolean');
-    }
-    this.eventManager_.logEvent({
-      eventType: publisherEventToAnalyticsEvent(userEvent.name),
-      eventOriginator: EventOriginator.PUBLISHER_CLIENT,
-      isFromUserAction: userEvent.active,
-      additionalParameters: data,
+      resolve();
     });
   }
 }
 
+/**
+ * @param {string} key
+ * @return {string}
+ */
+function storageKey(key) {
+  return PREFIX + ':' + key;
+}
+
+/**
+ * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS-IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+const NO_PROMISE_ERR = 'No account promise provided';
+
+class WaitForSubscriptionLookupApi {
+  /**
+   * @param {!./deps.DepsDef} deps
+   * @param {?Promise} accountPromise
+   */
+  constructor(deps, accountPromise) {
+    /** @private @const {!./deps.DepsDef} */
+    this.deps_ = deps;
+
+    /** @private @const {!Window} */
+    this.win_ = deps.win();
+
+    /** @private @const {!../components/activities.ActivityPorts} */
+    this.activityPorts_ = deps.activities();
+
+    /** @private @const {!../components/dialog-manager.DialogManager} */
+    this.dialogManager_ = deps.dialogManager();
+
+    /** @private {?Promise} */
+    this.openViewPromise_ = null;
+
+    /** @private {!Promise} */
+    this.accountPromise_ = accountPromise || Promise.reject(NO_PROMISE_ERR);
+
+    /** @private @const {!ActivityIframeView} */
+    this.activityIframeView_ = new ActivityIframeView(
+      this.win_,
+      this.activityPorts_,
+      feUrl('/waitforsubscriptionlookupiframe'),
+      feArgs({
+        publicationId: deps.pageConfig().getPublicationId(),
+        productId: deps.pageConfig().getProductId(),
+      }),
+      /* shouldFadeBody */ true,
+      /* hasLoadingIndicator */ true
+    );
+  }
+
+  /**
+   * Starts the Login Flow.
+   * @return {!Promise}
+   */
+  start() {
+    this.openViewPromise_ = this.dialogManager_.openView(
+      this.activityIframeView_
+    );
+
+    return this.accountPromise_.then(
+      account => {
+        // Account was found.
+        this.dialogManager_.completeView(this.activityIframeView_);
+        return account;
+      },
+      reason => {
+        this.dialogManager_.completeView(this.activityIframeView_);
+        throw reason;
+      }
+    );
+  }
+}
+
 /**
  * Copyright 2018 The Subscribe with Google Authors. All Rights Reserved.
  *
@@ -15528,7 +15839,7 @@ class ConfiguredRuntime {
     /** @private @const {!../api/subscriptions.Config} */
     this.config_ = defaultConfig();
 
-    if (isEdgeBrowser$1(this.win_)) {
+    if (isLegacyEdgeBrowser(this.win_)) {
       // TODO(dvoytenko, b/120607343): Find a way to remove this restriction
       // or move it to Web Activities.
       this.config_.windowOpenMode = WindowOpenMode.REDIRECT;
@@ -15565,6 +15876,7 @@ class ConfiguredRuntime {
 
     /** @private @const {!AnalyticsService} */
     this.analyticsService_ = new AnalyticsService(this);
+    this.analyticsService_.start();
 
     /** @private @const {!PayClient} */
     this.payClient_ = new PayClient(this);
@@ -15588,6 +15900,7 @@ class ConfiguredRuntime {
     );
 
     // ALL CLEAR: DepsDef definition now complete.
+    this.eventManager_.logSwgEvent(AnalyticsEvent.IMPRESSION_PAGE_LOAD, false);
 
     /** @private @const {!OffersApi} */
     this.offersApi_ = new OffersApi(this.pageConfig_, this.fetcher_);
@@ -15602,7 +15915,7 @@ class ConfiguredRuntime {
     PayCompleteFlow.configurePending(this);
     this.payClient_.preconnect(preconnect);
 
-    injectStyleSheet(this.doc_, CSS);
+    injectStyleSheet(this.doc_, CSS$1);
 
     // Report redirect errors if any.
     this.activityPorts_.onRedirectError(error => {
@@ -15698,6 +16011,11 @@ class ConfiguredRuntime {
           break;
         case 'experiments':
           v.forEach(experiment => setExperiment(this.win_, experiment, true));
+          if (this.analytics()) {
+            // If analytics service isn't set up yet, then it will get the
+            // experiments later.
+            this.analytics().addLabels(v);
+          }
           break;
         case 'analyticsMode':
           if (v != AnalyticsMode.DEFAULT && v != AnalyticsMode.IMPRESSIONS) {
@@ -15754,7 +16072,20 @@ class ConfiguredRuntime {
   getEntitlements(encryptedDocumentKey) {
     return this.entitlementsManager_
       .getEntitlements(encryptedDocumentKey)
-      .then(entitlements => entitlements.clone());
+      .then(entitlements => {
+        // Auto update internal things tracking the user's current SKU.
+        if (entitlements) {
+          try {
+            const skus = entitlements.entitlements.map(
+              entitlement => entitlement.getSku() || 'unknown subscriptionToken'
+            );
+            if (skus.length > 0) {
+              this.analyticsService_.setSku(skus.join(','));
+            }
+          } catch (ex) {}
+        }
+        return entitlements.clone();
+      });
   }
 
   /** @override */
@@ -15813,10 +16144,6 @@ class ConfiguredRuntime {
 
   /** @override */
   showContributionOptions(options) {
-    log_2(
-      isExperimentOn(this.win_, ExperimentFlags.CONTRIBUTIONS),
-      'Not yet launched!'
-    );
     return this.documentParsed_.then(() => {
       const flow = new ContributionsFlow(this, options);
       return flow.start();
@@ -15891,7 +16218,7 @@ class ConfiguredRuntime {
       'for subscription updates please use the updateSubscription() method';
     log_2(typeof sku === 'string', errorMessage);
     return this.documentParsed_.then(() => {
-      return new PayStartFlow(this, sku).start();
+      return new PayStartFlow(this, {'skuId': sku}).start();
     });
   }
 
@@ -15920,15 +16247,15 @@ class ConfiguredRuntime {
 
   /** @override */
   contribute(skuOrSubscriptionRequest) {
-    log_2(
-      isExperimentOn(this.win_, ExperimentFlags.CONTRIBUTIONS),
-      'Not yet launched!'
-    );
-
+    /** @type {!../api/subscriptions.SubscriptionRequest} */
+    const request =
+      typeof skuOrSubscriptionRequest == 'string'
+        ? {'skuId': skuOrSubscriptionRequest}
+        : skuOrSubscriptionRequest;
     return this.documentParsed_.then(() => {
       return new PayStartFlow(
         this,
-        skuOrSubscriptionRequest,
+        request,
         ProductType.UI_CONTRIBUTION
       ).start();
     });
diff --git a/tools/experiments/README.md b/tools/experiments/README.md
index 725a568e7a11d..c1cbb7daa59ce 100644
--- a/tools/experiments/README.md
+++ b/tools/experiments/README.md
@@ -20,7 +20,7 @@ Experiment opt-ins are saved to `localStorage` and only enables the experiment o
 For content served from non-CDN domains, experiments can be toggled in the devtools console using:
 
 ```javascript
-AMP.toggleExperiment('experiment');
+AMP.toggleExperiment('my-experiment');
 ```
 
 ## Enable an experiment for a particular document
@@ -38,11 +38,29 @@ Document can choose to opt in a certain experiments. To do that, simply put a me
 ```
 
 By doing so, the specified experiments will be enabled for all visitors of the document.
-Note not all experiments allow document level opt-in. For a full list of white listed experiments, please see `allow-doc-opt-in` attribute in the project's `prod-config.json` file.
-Note that document opt-in can be overridden by user opt-out.
+
+Note: **only some experiments** allow document level opt-in. For a full list of allowed experiments, please see `allow-doc-opt-in` attribute in [the `prod-config.json` file.](../../build-system/global-configs/prod-config.json)
+
+The document opt-in can also be overridden by user opt-out:
 
 ```javascript
-AMP.toggleExperiment('experiment', false);
+AMP.toggleExperiment('my-experiment', false);
+```
+
+### Enable automatically for invalid documents (demos and automated tests)
+
+Before an experiment is toggled on for production or its flag is completely removed, it's useful to have it turned on by default for manual testing pages or for automated test fixtures (e.g. HTML document fixtures for integration and visual tests).
+
+This enables the experimental runtime features that are required for a specific document and works for **every experiment**, but also **causes the document to become invalid**.
+
+To prevent race conditions caused from loading the runtime and an inline script to toggle the experiment, you'll have to include an `AMP.push` callback in your document's `<head>`:
+
+```html
+<script>
+  (self.AMP = self.AMP || []).push(function(AMP) {
+    AMP.toggleExperiment('my-experiment', true);
+  });
+</script>
 ```
 
 ## Adding a new experiment
diff --git a/tools/experiments/experiments-config.js b/tools/experiments/experiments-config.js
index ecbdcb591561e..de48fa850af37 100644
--- a/tools/experiments/experiments-config.js
+++ b/tools/experiments/experiments-config.js
@@ -62,10 +62,10 @@ export const EXPERIMENTS = [
     cleanupIssue: 'https://github.com/ampproject/amphtml/issues/3996',
   },
   {
-    id: 'amp-mega-menu',
-    name: 'AMP extension for a mega menu with expandable items',
-    spec: 'https://github.com/ampproject/amphtml/issues/24814',
-    cleanupIssue: 'https://github.com/ampproject/amphtml/issues/24898',
+    id: 'amp-consent-restrict-fullscreen',
+    name: 'AMP consent restrict fullscreen API before user interaction',
+    spec: 'https://github.com/ampproject/amphtml/issues/26432',
+    cleanupIssue: 'https://github.com/ampproject/amphtml/issues/26432',
   },
   {
     id: 'amp-consent-geo-override',
@@ -74,11 +74,6 @@ export const EXPERIMENTS = [
       'https://github.com/ampproject/amphtml/blob/lannka-consent-design/extensions/amp-consent/amp-consent.md',
     cleanupIssue: 'https://github.com/ampproject/amphtml/issues/25623',
   },
-  {
-    id: 'amp-nested-menu',
-    name: 'AMP extension for a nested drilldown menu',
-    cleanupIssue: 'https://github.com/ampproject/amphtml/issues/25343',
-  },
   {
     id: 'amp-sidebar-v2',
     name: 'Updated sidebar component with nested menu and animations',
@@ -119,6 +114,11 @@ export const EXPERIMENTS = [
     name: 'Allows the new lightbox experience to be used in A4A (prototype).',
     spec: 'https://github.com/ampproject/amphtml/issues/7743',
   },
+  {
+    id: 'amp-list-init-from-state',
+    name: 'Allows amp-list to initialize off of amp-state',
+    spec: 'https://github.com/ampproject/amphtml/issues/26009',
+  },
   {
     id: 'amp-playbuzz',
     name: 'AMP extension for playbuzz items (launched)',
@@ -208,6 +208,12 @@ export const EXPERIMENTS = [
     name: 'Document level next page recommendations and infinite scroll',
     spec: 'https://github.com/ampproject/amphtml/issues/12945',
   },
+  {
+    id: 'amp-next-page-v2',
+    name: 'Document-level (true) infinite scroll experience',
+    spec: 'https://github.com/ampproject/amphtml/issues/25500',
+    cleanupIssue: 'https://github.com/ampproject/amphtml/issues/25634',
+  },
   {
     id: 'amp-story-branching',
     name: 'Allow for the go to action, advance to, and fragment parameter URLs',
@@ -253,6 +259,14 @@ export const EXPERIMENTS = [
     spec: 'https://github.com/ampproject/amphtml/issues/17475',
     cleanupIssue: 'https://github.com/ampproject/amphtml/issues/18897',
   },
+  {
+    id: 'inabox-viewport-friendly',
+    name:
+      'Inabox viewport measures the host window directly if ' +
+      'within friendly iframe',
+    spec: 'https://github.com/ampproject/amphtml/issues/19869',
+    cleanupIssue: 'TODO',
+  },
   {
     id: 'fie-css-cleanup',
     name:
@@ -277,13 +291,6 @@ export const EXPERIMENTS = [
     spec: 'N/A',
     cleanupIssue: 'N/A',
   },
-  {
-    id: 'macro-after-long-task',
-    name:
-      'If applicable, convert remaining micro tasks to the next macro ' +
-      ' tasks if a previous micro task execution took too long',
-    cleanupIssue: 'https://github.com/ampproject/amphtml/issues/23464',
-  },
   {
     id: 'pausable-iframe',
     name: 'Use iframe freezing instead of recreating iframes.',
@@ -310,12 +317,6 @@ export const EXPERIMENTS = [
     spec: 'https://github.com/ampproject/amphtml/issues/24168',
     cleanupIssue: 'https://github.com/ampproject/amphtml/issues/24169',
   },
-  {
-    id: 'remove-viewer-query-params-on-navigate',
-    name: 'Removes query params from viewer iframe on navigation.',
-    spec: 'https://github.com/ampproject/amphtml/issues/25179',
-    cleanupIssue: 'https://github.com/ampproject/amphtml/issues/24169',
-  },
   {
     id: 'layoutbox-invalidate-on-scroll',
     name:
diff --git a/tools/experiments/experiments.html b/tools/experiments/experiments.html
index 2b4de061b29c6..ffeb12c174c85 100644
--- a/tools/experiments/experiments.html
+++ b/tools/experiments/experiments.html
@@ -81,6 +81,21 @@
       min-width: 60px;
     }
 
+    details {
+      border: solid 1px gray;
+      margin-top: 5px;
+      padding: 10px;
+    }
+
+    details summary {
+      color: gray;
+      cursor: pointer;
+    }
+
+    details[open] summary {
+      color: inherit;
+    }
+
     #subdomain {
       color: gray;
       font-family: 'Courier New', Courier, monospace;
@@ -112,6 +127,21 @@
       display: block;
     }
 
+    #rtv {
+      border: solid 1px gray;
+      width: calc(100% - 150px);
+      padding: 10px;
+    }
+
+    #rtv-submit {
+      background: #aaa;
+      margin: 5px;
+    }
+
+    #rtv-submit[disabled] {
+      color: #777;
+    }
+
     #redirect > input {
       border: solid 1px gray;
       width: calc(100% - 20px);
@@ -209,10 +239,29 @@ <h2>Release channels</h2>
       These switches control which release channel (prod, RC, or dev) of AMP JS
       will be served through the <a href="https://developers.google.com/amp/cache/">Google AMP Cache</a>.
     </p>
+    <p>
+      <em>Note:</em> These controls set a cookie on the domain name <code>cdn.ampproject.org</code>. If your browser is
+      set to block all third-party cookies, they will not function. Make sure third-party cookies are enabled, or
+      whitelisted on the websites that you are testing.
+    </p>
   </section>
 
   <section class="content">
     <table id="channels-table" border=1></table>
+    <details id="rtv-details">
+      <summary>Advanced</summary>
+      <p>
+        You can manually opt in to a previously released RTV using this form.
+      </p>
+      <p>
+        <em>Warning:</em> This is an advanced setting. It is intended for use while debugging AMP runtime code, and is
+        not meant to be used to publish AMP documents. To opt out of this setting, clear the RTV in the input field.
+      </p>
+      <div>
+        <input id="rtv" placeholder="E.g., 011912312359590" maxlength="15" type="text">
+        <button id="rtv-submit" disabled>opt-in</button>
+      </div>
+    </detail>
   </section>
 
   <!-- Only displayed on top-level cdn.ampproject.org. -->
diff --git a/tools/experiments/experiments.js b/tools/experiments/experiments.js
index cb25bb0b26269..09dc8b0c4583e 100644
--- a/tools/experiments/experiments.js
+++ b/tools/experiments/experiments.js
@@ -34,6 +34,10 @@ setReportError(reportError);
 const COOKIE_MAX_AGE_DAYS = 180; // 6 month
 const MS_PER_DAY = 24 * 60 * 60 * 1000;
 const COOKIE_MAX_AGE_MS = COOKIE_MAX_AGE_DAYS * MS_PER_DAY;
+const RTV_COOKIE_MAX_AGE_MS = MS_PER_DAY / 2;
+
+const RTV_PATTERN = /^\d{15}$/;
+
 /**
  * @typedef {{
  *   id: string,
@@ -49,35 +53,47 @@ let ExperimentDef;
  * interpreted by the server to deliver a different version of the AMP
  * JS libraries.
  */
-const CANARY_EXPERIMENT_ID = 'dev-channel';
-const RC_EXPERIMENT_ID = 'rc-channel';
+const EXPERIMENTAL_CHANNEL_ID = 'experimental-channel';
+const BETA_CHANNEL_ID = 'beta-channel';
+const RTV_CHANNEL_ID = 'rtv-channel';
+
+/**
+ * The different states of the __Host-AMP_OPT_IN cookie.
+ */
+const AMP_OPT_IN_COOKIE = {
+  DISABLED: '0',
+  EXPERIMENTAL: 'experimental',
+  BETA: 'beta',
+  // NIGHTLY: 'nightly',  // TODO(#25616): add when CDN supports nightly builds.
+};
 
 /**
- * The different states of the AMP_CANARY cookie.
+ * Legacy values for __Host-AMP_OPT_IN cookie.
+ * TODO(#25205): remove this once the CDN stops supporting these values.
  */
-const AMP_CANARY_COOKIE = {
+const _LEGACY_AMP_OPT_IN_COOKIE = {
   DISABLED: '0',
-  CANARY: '1',
-  RC: '2',
+  EXPERIMENTAL: '1',
+  BETA: '2',
 };
 
 /** @const {!Array<!ExperimentDef>} */
 const CHANNELS = [
-  // Canary (Dev Channel)
+  // Experimental Channel
   {
-    id: CANARY_EXPERIMENT_ID,
-    name: 'AMP Dev Channel (more info)',
+    id: EXPERIMENTAL_CHANNEL_ID,
+    name: 'AMP Experimental Channel (more info)',
     spec:
       'https://github.com/ampproject/amphtml/blob/master/' +
-      'contributing/release-schedule.md#amp-dev-channel',
+      'contributing/release-schedule.md#amp-experimental-and-beta-channels',
   },
-  // Release Candidate (RC Channel)
+  // Beta Channel
   {
-    id: RC_EXPERIMENT_ID,
-    name: 'AMP RC Channel (more info)',
+    id: BETA_CHANNEL_ID,
+    name: 'AMP Beta Channel (more info)',
     spec:
       'https://github.com/ampproject/amphtml/blob/master/' +
-      'contributing/release-schedule.md#amp-release-candidate-rc-channel',
+      'contributing/release-schedule.md#amp-experimental-and-beta-channels',
   },
 ];
 
@@ -91,7 +107,7 @@ if (getMode().localDev) {
 }
 
 /**
- * Builds the expriments tbale.
+ * Builds the expriments table.
  */
 function build() {
   const {host} = window.location;
@@ -138,6 +154,35 @@ function build() {
   } else {
     redirect.setAttribute('hidden', '');
   }
+
+  const rtvInput = document.getElementById('rtv');
+  const rtvButton = document.getElementById('rtv-submit');
+  rtvInput.addEventListener('input', () => {
+    rtvButton.disabled = rtvInput.value && !RTV_PATTERN.test(rtvInput.value);
+    rtvButton.textContent = rtvInput.value ? 'opt-in' : 'opt-out';
+  });
+  rtvButton.addEventListener('click', () => {
+    if (!rtvInput.value) {
+      showConfirmation_(
+        'Do you really want to opt out of RTV?',
+        setAmpOptInCookie_.bind(null, AMP_OPT_IN_COOKIE.DISABLED)
+      );
+    } else if (RTV_PATTERN.test(rtvInput.value)) {
+      showConfirmation_(
+        `Do you really want to opt in to RTV ${rtvInput.value}?`,
+        setAmpOptInCookie_.bind(null, rtvInput.value)
+      );
+    }
+  });
+
+  if (isExperimentOn_(RTV_CHANNEL_ID)) {
+    // TODO(#25205): remove this once the CDN stops supporting the AMP_CANARY
+    // cookie.
+    rtvInput.value =
+      getCookie(window, '__Host-AMP_OPT_IN') || getCookie(window, 'AMP_CANARY');
+    rtvInput.dispatchEvent(new Event('input'));
+    document.getElementById('rtv-details').open = true;
+  }
 }
 
 /**
@@ -237,27 +282,41 @@ function updateExperimentRow(experiment) {
  * @return {boolean}
  */
 function isExperimentOn_(id) {
-  if (id == CANARY_EXPERIMENT_ID) {
-    return getCookie(window, 'AMP_CANARY') == AMP_CANARY_COOKIE.CANARY;
-  } else if (id == RC_EXPERIMENT_ID) {
-    return getCookie(window, 'AMP_CANARY') == AMP_CANARY_COOKIE.RC;
+  // TODO(#25205): remove this once the CDN stops supporting the AMP_CANARY
+  // cookie.
+  const optInCookieValue =
+    getCookie(window, '__Host-AMP_OPT_IN') || getCookie(window, 'AMP_CANARY');
+  switch (id) {
+    case EXPERIMENTAL_CHANNEL_ID:
+      return [
+        AMP_OPT_IN_COOKIE.EXPERIMENTAL,
+        _LEGACY_AMP_OPT_IN_COOKIE.EXPERIMENTAL,
+      ].includes(optInCookieValue);
+    case BETA_CHANNEL_ID:
+      return [AMP_OPT_IN_COOKIE.BETA, _LEGACY_AMP_OPT_IN_COOKIE.BETA].includes(
+        optInCookieValue
+      );
+    case RTV_CHANNEL_ID:
+      return RTV_PATTERN.test(optInCookieValue);
+    default:
+      return isExperimentOn(window, /*OK*/ id);
   }
-  return isExperimentOn(window, /*OK*/ id);
 }
 
 /**
- * Opts in to / out of the "canary" or "rc" runtime types by setting the
- * AMP_CANARY cookie.
- * @param {string} cookieState One of AMP_CANARY_COOKIE.{DISABLED|CANARY|RC}
+ * Opts in to / out of the "beta" or "experimental" channels or a specific RTV
+ * by setting the __Host-AMP_OPT_IN cookie.
+ * @param {string} cookieState One of the AMP_OPT_IN_COOKIE enum values, or a
+ *   15-digit RTV.
  */
-function setAmpCanaryCookie_(cookieState) {
-  const validUntil =
-    cookieState != AMP_CANARY_COOKIE.DISABLED
-      ? Date.now() + COOKIE_MAX_AGE_MS
-      : 0;
+function setAmpOptInCookie_(cookieState) {
+  let validUntil = 0;
+  if (RTV_PATTERN.test(cookieState)) {
+    validUntil = Date.now() + RTV_COOKIE_MAX_AGE_MS;
+  } else if (cookieState != AMP_OPT_IN_COOKIE.DISABLED) {
+    validUntil = Date.now() + COOKIE_MAX_AGE_MS;
+  }
   const cookieOptions = {
-    // Set explicit domain, so the cookie gets sent to sub domains.
-    domain: location.hostname,
     allowOnProxyOrigin: true,
     // Make sure the cookie is available for the script loads coming from
     // other domains. Chrome's default of LAX would otherwise prevent it
@@ -265,6 +324,17 @@ function setAmpCanaryCookie_(cookieState) {
     sameSite: SameSite.NONE,
     secure: true,
   };
+  setCookie(
+    window,
+    '__Host-AMP_OPT_IN',
+    cookieState,
+    validUntil,
+    cookieOptions
+  );
+  // TODO(#25205): remove this once the CDN stops supporting the AMP_CANARY
+  // cookie.
+  // Set explicit domain, so the cookie gets sent to sub domains.
+  cookieOptions.domain = location.hostname;
   setCookie(window, 'AMP_CANARY', cookieState, validUntil, cookieOptions);
   // Reflect default experiment state.
   self.location.reload();
@@ -279,19 +349,19 @@ function setAmpCanaryCookie_(cookieState) {
 function toggleExperiment_(id, name, opt_on) {
   const currentlyOn = isExperimentOn_(id);
   const on = opt_on === undefined ? !currentlyOn : opt_on;
-  // Protect against click jacking.
+  // Protect against accidental choice.
   const confirmMessage = on
-    ? 'Do you really want to activate the AMP experiment'
-    : 'Do you really want to deactivate the AMP experiment';
+    ? 'Do you really want to activate the AMP experiment?'
+    : 'Do you really want to deactivate the AMP experiment?';
 
   showConfirmation_(`${confirmMessage}: "${name}"`, () => {
-    if (id == CANARY_EXPERIMENT_ID) {
-      setAmpCanaryCookie_(
-        on ? AMP_CANARY_COOKIE.CANARY : AMP_CANARY_COOKIE.DISABLED
+    if (id == EXPERIMENTAL_CHANNEL_ID) {
+      setAmpOptInCookie_(
+        on ? AMP_OPT_IN_COOKIE.EXPERIMENTAL : AMP_OPT_IN_COOKIE.DISABLED
       );
-    } else if (id == RC_EXPERIMENT_ID) {
-      setAmpCanaryCookie_(
-        on ? AMP_CANARY_COOKIE.RC : AMP_CANARY_COOKIE.DISABLED
+    } else if (id == BETA_CHANNEL_ID) {
+      setAmpOptInCookie_(
+        on ? AMP_OPT_IN_COOKIE.BETA : AMP_OPT_IN_COOKIE.DISABLED
       );
     } else {
       toggleExperiment(window, id, on);
@@ -328,10 +398,10 @@ function showConfirmation_(message, callback) {
 }
 
 /**
- * Loads the AMP_CONFIG objects from whatever the v0.js is that the
- * user has (depends on whether they opted into canary or RC), so that
- * experiment state can reflect the default activated experiments.
- * @return {*} TODO(#23582): Specify return type
+ * Loads the AMP_CONFIG objects from whatever the v0.js is that the user has
+ * (depends on whether they opted into beta, experimental, or a specific RTV) so
+ * that experiment state can reflect the default activated experiments.
+ * @return {Promise<JSON>} the active AMP_CONFIG, parsed as a JSON object
  */
 function getAmpConfig() {
   const deferred = new Deferred();
@@ -343,12 +413,12 @@ function getAmpConfig() {
   xhr.addEventListener('error', () => {
     reject(new Error(xhr.statusText));
   });
-  // Cache bust, so we immediately reflect AMP_CANARY cookie changes.
+  // Cache bust, so we immediately reflect cookie changes.
   xhr.open('GET', '/v0.js?' + Math.random(), true);
   xhr.send(null);
   return promise
     .then(text => {
-      const match = text.match(/self\.AMP_CONFIG=([^;]+)/);
+      const match = text.match(/self\.AMP_CONFIG=(\{.+?\})/);
       if (!match) {
         throw new Error("Can't find AMP_CONFIG in: " + text);
       }
diff --git a/validator/build.py b/validator/build.py
index 225ac2807c30f..ce066b99e398b 100755
--- a/validator/build.py
+++ b/validator/build.py
@@ -284,7 +284,7 @@ def CompileWithClosure(js_files, definitions, entry_points, output_file):
 
   cmd = [
       'java', '-jar', 'node_modules/google-closure-compiler-java/compiler.jar',
-      '--language_out=ES5_STRICT', '--dependency_mode=STRICT',
+      '--language_out=ES5_STRICT', '--dependency_mode=PRUNE',
       '--js_output_file=%s' % output_file
   ]
   cmd += ['--entry_point=%s' % e for e in entry_points]
diff --git a/validator/engine/validator.js b/validator/engine/validator.js
index 3074cc9c34d94..8aff525dba2aa 100644
--- a/validator/engine/validator.js
+++ b/validator/engine/validator.js
@@ -1572,6 +1572,20 @@ class TagStack {
     return this.parentStackEntry_().tagName;
   }
 
+  /**
+   * The spec_name of the parent of the current tag if one exists, otherwise the
+   * tag_name.
+   * @return {string}
+   */
+  parentTagSpecName() {
+    if ((this.parentStackEntry_().tagSpec !== null) &&
+        (this.parentStackEntry_().tagSpec.getSpec().specName !== null)) {
+      return /** @type {string} */ (
+          this.parentStackEntry_().tagSpec.getSpec().specName);
+    }
+    return this.parentStackEntry_().tagName;
+  }
+
   /**
    * The number of children that have been discovered up to now by traversing
    * the stack.
@@ -2377,6 +2391,86 @@ class ExtensionsContext {
   }
 }
 
+// If any script in the page uses LTS, all scripts must use LTS. This is used to
+// record when a script is seen and validate following script tags.
+/** @enum {string} */
+const ScriptReleaseVersion = {
+  UNKNOWN: 'UNKNOWN',
+  STANDARD: 'STANDARD',
+  LTS: 'LTS',
+};
+
+/**
+ * Gets the name attribute for an extension script tag.
+ * @param {!amp.htmlparser.ParsedHtmlTag} tag
+ * @return {string}
+ */
+function ExtensionScriptNameAttribute(tag) {
+  if (tag.upperName() == 'SCRIPT') {
+    for (const attribute
+             of ['custom-element', 'custom-template', 'host-service']) {
+      if (attribute in tag.attrsByKey()) {
+        return attribute;
+      }
+    }
+  }
+  return '';
+}
+
+/**
+ * Gets the extension name for an extension script tag.
+ * @param {!amp.htmlparser.ParsedHtmlTag} tag
+ * @return {string}
+ */
+function ExtensionScriptName(tag) {
+  const nameAttr = ExtensionScriptNameAttribute(tag);
+  if (nameAttr) {
+    // Extension script names are required to be in lowercase by the validator,
+    // so we don't need to lowercase them here.
+    return tag.attrsByKey()[nameAttr] || '';
+  }
+  return '';
+}
+
+/**
+ * Tests if a tag is an extension script tag.
+ * @param {!amp.htmlparser.ParsedHtmlTag} tag
+ * @return {boolean}
+ */
+function IsExtensionScript(tag) {
+  return !!ExtensionScriptNameAttribute(tag);
+}
+
+/**
+ * Tests if a tag is an async script tag.
+ * @param {!amp.htmlparser.ParsedHtmlTag} tag
+ * @return {boolean}
+ */
+function IsAsyncScriptTag(tag) {
+  return tag.upperName() == 'SCRIPT' && 'async' in tag.attrsByKey() &&
+      'src' in tag.attrsByKey();
+}
+
+/**
+ * Tests if a tag is the AMP runtime script tag.
+ * @param {!amp.htmlparser.ParsedHtmlTag} tag
+ * @return {boolean}
+ */
+function IsAmpRuntimeScript(tag) {
+  const src = tag.attrsByKey()['src'] || '';
+  return IsAsyncScriptTag(tag) && !IsExtensionScript(tag) &&
+      src.startsWith('https://cdn.ampproject.org/') && src.endsWith('/v0.js');
+}
+
+/**
+ * Tests if a URL is for the LTS version of a script.
+ * @param {string} url
+ * @return {boolean}
+ */
+function IsLtsScriptUrl(url) {
+  return url.startsWith('https://cdn.ampproject.org/lts/');
+}
+
 /**
  * The Context keeps track of the line / column that the validator is
  * in, as well as the mandatory tag specs that have already been validated.
@@ -2487,6 +2581,13 @@ class Context {
      * @private
      */
     this.extensions_ = new ExtensionsContext();
+
+    /**
+     * Flag for if the LTS runtime engine is present.
+     * @type {!ScriptReleaseVersion}
+     * @private
+     */
+    this.scriptReleaseVersion_ = ScriptReleaseVersion.UNKNOWN;
   }
 
   /** @return {!ParsedValidatorRules} */
@@ -2603,6 +2704,22 @@ class Context {
     }
   }
 
+  /**
+   * Record if this document contains a tag requesting the LTS runtime engine.
+   * @param {!amp.htmlparser.ParsedHtmlTag} parsedTag
+   * @param {!amp.validator.ValidationResult} result
+   * @private
+   */
+  recordScriptReleaseVersionFromTagResult_(parsedTag, result) {
+    if (this.getScriptReleaseVersion() === ScriptReleaseVersion.UNKNOWN &&
+        (IsExtensionScript(parsedTag) || IsAmpRuntimeScript(parsedTag))) {
+      const src = parsedTag.attrsByKey()['src'] || '';
+      this.scriptReleaseVersion_ = IsLtsScriptUrl(src) ?
+          ScriptReleaseVersion.LTS :
+          ScriptReleaseVersion.STANDARD;
+    }
+  }
+
   /**
    * @param {!amp.validator.ValueSetProvision} provision
    * @return {string} A key for valueSetsProvided_ and valueSetsRequired_.
@@ -2628,6 +2745,8 @@ class Context {
     this.recordAttrRequiresExtension_(encounteredTag, tagResult);
     this.updateFromTagResult_(referencePointResult);
     this.updateFromTagResult_(tagResult);
+    this.recordScriptReleaseVersionFromTagResult_(
+        encounteredTag, tagResult.validationResult);
   }
 
   /**
@@ -2867,6 +2986,11 @@ class Context {
   getEncounteredBodyLineCol() {
     return /** @type {!LineCol} */ (this.encounteredBodyLineCol_);
   }
+
+  /** @return {!ScriptReleaseVersion} */
+  getScriptReleaseVersion() {
+    return this.scriptReleaseVersion_;
+  }
 }
 
 /**
@@ -3617,7 +3741,8 @@ function attrValueHasPartialsTemplateSyntax(value) {
 function validateParentTag(parsedTagSpec, context, validationResult) {
   const spec = parsedTagSpec.getSpec();
   if (spec.mandatoryParent !== null &&
-      spec.mandatoryParent !== context.getTagStack().parentTagName()) {
+      (spec.mandatoryParent !== context.getTagStack().parentTagName()) &&
+      (spec.mandatoryParent !== context.getTagStack().parentTagSpecName())) {
     // Output a parent/child error using CSS Child Selector syntax which is
     // both succinct and should be well understood by web developers.
     context.addError(
@@ -4096,7 +4221,7 @@ function validateLayout(parsedTagSpec, context, encounteredTag, result) {
         getTagSpecUrl(spec), result);
     return;
   }
-  // RESPONSIVE only allows heights attribute.
+  // heights attribute is only allowed for RESPONSIVE layout.
   if (heightsAttr !== undefined &&
       layout !== amp.validator.AmpLayout.Layout.RESPONSIVE) {
     const code = layoutAttr === undefined ?
@@ -4225,7 +4350,7 @@ function validateAttributeInExtension(tagSpec, context, attr, result) {
     return true;
   } else if (attr.name === 'src') {
     const srcUrlRe =
-        /^https:\/\/cdn\.ampproject\.org\/v0\/(amp-[a-z0-9-]*)-([a-z0-9.]*)\.js$/;
+        /^https:\/\/cdn\.ampproject\.org(?:\/lts)?\/v0\/(amp-[a-z0-9-]*)-([a-z0-9.]*)\.js$/;
     const reResult = srcUrlRe.exec(attr.value);
     // If the src URL matches this regex and the base name of the file matches
     // the extension, look to see if the version matches.
@@ -4254,6 +4379,38 @@ function validateAttributeInExtension(tagSpec, context, attr, result) {
   return false;
 }
 
+/**
+ * Validates that LTS is used for either all script sources or none.
+ * @param {!Object} srcAttr
+ * @param {!amp.validator.TagSpec} tagSpec
+ * @param {!Context} context
+ * @param {!amp.validator.ValidationResult} result
+ */
+function validateScriptSrcAttr(srcAttr, tagSpec, context, result) {
+  if (context.getScriptReleaseVersion() === ScriptReleaseVersion.UNKNOWN)
+    return;
+
+  const scriptReleaseVersion = IsLtsScriptUrl(srcAttr.value) ?
+      ScriptReleaseVersion.LTS :
+      ScriptReleaseVersion.STANDARD;
+
+  if (context.getScriptReleaseVersion() != scriptReleaseVersion) {
+    const specName = tagSpec.extensionSpec !== null ?
+        tagSpec.extensionSpec.name :
+        tagSpec.specName;
+    context.addError(
+        scriptReleaseVersion == ScriptReleaseVersion.LTS ?
+            amp.validator.ValidationError.Code.LTS_SCRIPT_AFTER_NON_LTS :
+            amp.validator.ValidationError.Code.NON_LTS_SCRIPT_AFTER_LTS,
+        context.getLineCol(),
+        /*params=*/[specName],
+
+        'https://amp.dev/documentation/guides-and-tutorials/learn/spec/' +
+            'amphtml#required-markup',
+        result);
+  }
+}
+
 /**
  * Helper method for ValidateAttributes.
  * @param {!ParsedAttrSpec} parsedAttrSpec
@@ -4389,11 +4546,21 @@ function validateAttributes(
   const attrsByName = parsedTagSpec.getAttrsByName();
   for (const attr of encounteredTag.attrs()) {
     // For transformed AMP, attributes `class` and `i-amphtml-layout` are
-    // handled within validateSsrLayout.
+    // handled within validateSsrLayout for non-sizer elements.
     if (context.isTransformed() &&
+        encounteredTag.lowerName() !== 'i-amphtml-sizer' &&
         (attr.name === 'class' || attr.name === 'i-amphtml-layout')) {
       continue;
     }
+
+    // If |spec| is the runtime or an extension script, validate that LTS is
+    // either used by all pages or no pages.
+    if (attr.name == 'src' &&
+        (IsExtensionScript(encounteredTag) ||
+         IsAmpRuntimeScript(encounteredTag))) {
+      validateScriptSrcAttr(attr, spec, context, result);
+    }
+
     if (!(attr.name in attrsByName)) {
       // The HTML tag specifies type identifiers which are validated in
       // validateHtmlTag(), so we skip them here.
@@ -5050,11 +5217,14 @@ class ParsedValidatorRules {
      * @private
      */
     this.typeIdentifiers_ = Object.create(null);
-    this.typeIdentifiers_['⚡'] = 0;
+    this.typeIdentifiers_['\u26a1'] = 0;
+    this.typeIdentifiers_['\u26a1\ufe0f'] = 0;
     this.typeIdentifiers_['amp'] = 0;
-    this.typeIdentifiers_['⚡4ads'] = 0;
+    this.typeIdentifiers_['\u26a14ads'] = 0;
+    this.typeIdentifiers_['\u26a1\ufe0f4ads'] = 0;
     this.typeIdentifiers_['amp4ads'] = 0;
-    this.typeIdentifiers_['⚡4email'] = 0;
+    this.typeIdentifiers_['\u26a14email'] = 0;
+    this.typeIdentifiers_['\u26a1\ufe0f4email'] = 0;
     this.typeIdentifiers_['amp4email'] = 0;
     this.typeIdentifiers_['actions'] = 0;
     this.typeIdentifiers_['transformed'] = 0;
@@ -5285,7 +5455,8 @@ class ParsedValidatorRules {
         if (formatIdentifiers.indexOf(attr.name) !== -1) {
           // Only add the type identifier once per representation. That is, both
           // "⚡" and "amp", which represent the same type identifier.
-          const typeIdentifier = attr.name.replace('⚡', 'amp');
+          const typeIdentifier = attr.name.replace('\u26a1\ufe0f', 'amp')
+                                          .replace('\u26a1', 'amp');
           if (validationResult.typeIdentifier.indexOf(typeIdentifier) === -1) {
             validationResult.typeIdentifier.push(typeIdentifier);
             context.recordTypeIdentifier(typeIdentifier);
@@ -5351,22 +5522,26 @@ class ParsedValidatorRules {
     switch (this.htmlFormat_) {
       case 'AMP':
         this.validateTypeIdentifiers(
-            htmlTag.attrs(), ['⚡', 'amp', 'transformed', 'data-ampdevmode'],
+            htmlTag.attrs(), ['\u26a1', '\u26a1\ufe0f',
+                              'amp', 'transformed', 'data-ampdevmode'],
             context, validationResult);
         break;
       case 'AMP4ADS':
         this.validateTypeIdentifiers(
-            htmlTag.attrs(), ['⚡4ads', 'amp4ads', 'data-ampdevmode'], context,
+            htmlTag.attrs(), ['\u26a14ads', '\u26a1\ufe0f4ads',
+                              'amp4ads', 'data-ampdevmode'], context,
             validationResult);
         break;
       case 'AMP4EMAIL':
         this.validateTypeIdentifiers(
-            htmlTag.attrs(), ['⚡4email', 'amp4email', 'data-ampdevmode'],
+            htmlTag.attrs(), ['\u26a14email', '\u26a1\ufe0f4email',
+                              'amp4email', 'data-ampdevmode'],
             context, validationResult);
         break;
       case 'ACTIONS':
         this.validateTypeIdentifiers(
-            htmlTag.attrs(), ['⚡', 'amp', 'actions', 'data-ampdevmode'],
+            htmlTag.attrs(), ['\u26a1', '\u26a1\ufe0f', 'amp',
+                              'actions', 'data-ampdevmode'],
             context,  validationResult);
         if (validationResult.typeIdentifier.indexOf('actions') === -1) {
           context.addError(
@@ -6049,7 +6224,8 @@ amp.validator.ValidationHandler =
    */
       cdata(text) {
         // Validate that JSON can be parsed.
-        if (this.context_.getTagStack().isScriptTypeJsonChild()) {
+        if (!this.context_.getTagStack().hasAncestor('TEMPLATE') &&
+            this.context_.getTagStack().isScriptTypeJsonChild()) {
           try {
             JSON.parse(text);
           } catch (e) {
diff --git a/validator/engine/validator_test.js b/validator/engine/validator_test.js
index 9bf9fcffe86f4..fc5a1caa3945e 100644
--- a/validator/engine/validator_test.js
+++ b/validator/engine/validator_test.js
@@ -1214,7 +1214,6 @@ describe('ValidatorRulesMakeSense', () => {
   const tagWithoutSpecNameIsUnique = {};
   const tagNameRegex =
       new RegExp('(!DOCTYPE|O:P|[A-Z0-9-]+|\\$REFERENCE_POINT)');
-  const mandatoryParentRegex = new RegExp('(!DOCTYPE|\\$ROOT|[A-Z0-9-]+)');
   const disallowedAncestorRegex = new RegExp('[A-Z0-9-]+');
   for (const tagSpec of rules.tags) {
     // Helper for message output, set a tagspec_name in this order:
@@ -1290,6 +1289,7 @@ describe('ValidatorRulesMakeSense', () => {
         'amp-mustache': ['0.1', '0.2', 'latest'],
         'amp-pixel': ['0.1', 'latest'],
         'amp-position-observer': ['0.1', 'latest'],
+        'amp-selector': ['0.1', 'latest'],
         'amp-social-share': ['0.1', 'latest'],
         'amp-video': ['0.1', 'latest'],
       };
@@ -1367,12 +1367,6 @@ describe('ValidatorRulesMakeSense', () => {
         }
       }
     }
-    // mandatory_parent
-    if (tagSpec.mandatoryParent !== null) {
-      it('mandatory parent tag name defined', () => {
-        expect(mandatoryParentRegex.test(tagSpec.mandatoryParent)).toBe(true);
-      });
-    }
     // disallowed_ancestor must be a upper case alphabetic name.
     it('disallowed_ancestor defined and not equal to mandatory parent', () => {
       for (const disallowedAncestor of tagSpec.disallowedAncestor) {
@@ -1492,7 +1486,7 @@ describe('ValidatorRulesMakeSense', () => {
         // getNameByAttrSpecId() looks like it would do what we want, but it's
         // sufficiently wrapped in private context inside the validator that I
         // don't see a way to call it.  For now just gold the current index.
-        expect(tagSpec.attrLists[0]).toEqual(19);
+        expect(tagSpec.attrLists[0]).toEqual(20);
       });
     }
 
@@ -1577,33 +1571,47 @@ describe('ValidatorRulesMakeSense', () => {
         });
       }
       // We want to be certain not to allow SCRIPT tagspecs which don't either
-      // define a src attribute OR define a JSON or TEXT/PLAIN type.
+      // define a src attribute OR define a JSON, OCTET-STREAM, or TEXT/PLAIN
+      // type. Note that OCTET-STREAM scripts can only be used during SwG
+      // Encryption (go/swg-encryption).
       if (tagSpec.tagName === 'SCRIPT') {
         let hasSrc = false;
         let hasJson = false;
         let hasTextPlain = false;
+        let hasOctetStream = false;
+        let hasCiphertext = false;
         for (const attrSpecId of tagSpec.attrs) {
           if (attrSpecId < 0) { continue; }
           const attrSpec = rules.attrs[attrSpecId];
           if (attrSpec.name === 'src') {
             hasSrc = true;
           }
+          if (attrSpec.name === 'ciphertext') {
+            hasCiphertext = true;
+          }
           if (attrSpec.name === 'type' && attrSpec.valueCasei.length > 0) {
             for (const value of attrSpec.valueCasei) {
               if (value === 'application/ld+json' ||
                   value === 'application/json') {
                 hasJson = true;
               }
+              if (value === 'application/octet-stream') {
+                hasOctetStream = true;
+              }
               if (value == 'text/plain') {
                 hasTextPlain = true;
               }
             }
           }
         }
-        it('script tags must have either a src attribute or type json or '
-           + 'text/plain', () => {
-          expect(hasSrc || hasJson || hasTextPlain).toBe(true);
-        });
+        it('script tags must have either a src attribute or type json, ' +
+               'octet-stream (during SwG encryption), or text/plain',
+           () => {
+             expect(
+                 hasSrc || hasJson || hasTextPlain ||
+                 (hasOctetStream && hasCiphertext))
+                 .toBe(true);
+           });
       }
       // cdata_regex and mandatory_cdata
       if ((tagSpec.cdata.cdataRegex !== null) ||
diff --git a/validator/gulpjs/package.json b/validator/gulpjs/package.json
index eee23a5b4f9c8..3c7eb5fd81f85 100644
--- a/validator/gulpjs/package.json
+++ b/validator/gulpjs/package.json
@@ -10,9 +10,6 @@
     "AMP HTML",
     "Accelerated Mobile Pages"
   ],
-  "engines": {
-    "node": ">=0.10.25"
-  },
   "author": "The AMP HTML Authors",
   "license": "Apache-2.0",
   "repository": {
diff --git a/validator/htmlparser/LICENSE b/validator/htmlparser/LICENSE
new file mode 100644
index 0000000000000..d645695673349
--- /dev/null
+++ b/validator/htmlparser/LICENSE
@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
diff --git a/validator/htmlparser/README.md b/validator/htmlparser/README.md
new file mode 100644
index 0000000000000..540bd55cb3198
--- /dev/null
+++ b/validator/htmlparser/README.md
@@ -0,0 +1,24 @@
+<!---
+Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS-IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+# HTML Parser
+
+This is an HTML5 compliant parser, created to be used by the [AMPHTML
+Validator](https://github.com/ampproject/amphtml/tree/master/validator) to
+standardize how AMPHTML documents should be parsed for validation.
+
+It is maintained by the [AMP Working Group](https://amp.dev/community/working-groups/amp4email/):
+[Caching](https://amp.dev/community/working-groups/caching/)
diff --git a/validator/java/BUILD b/validator/java/BUILD
new file mode 100644
index 0000000000000..a6c822add8c96
--- /dev/null
+++ b/validator/java/BUILD
@@ -0,0 +1,75 @@
+sh_binary(
+    name = "copyValidatorJavaSource",
+    srcs = ["src/main/bin/copyValidatorJavaSource.sh"],
+    deps = [
+        "@bazel_tools//tools/bash/runfiles"
+    ],
+)
+
+sh_binary(
+    name = "fetchAMPResources",
+    srcs = ["src/main/bin/fetchAMPResources.sh"],
+    deps = [
+        "@bazel_tools//tools/bash/runfiles"
+    ],
+)
+
+load("@rules_java//java:defs.bzl", "java_proto_library")
+load("@rules_proto//proto:defs.bzl", "proto_library")
+
+java_proto_library(
+    name = "amphtml_validator_java_proto_lib",
+    visibility = ["//visibility:public"],
+    deps = [":amphtml_validator_proto_lib"],
+)
+
+proto_library(
+    name = "amphtml_validator_proto_lib",
+    srcs = ["src/main/proto/validator.proto"],
+)
+
+java_library(
+    name = "amphtml_validator_lib",
+    srcs = glob(["src/main/java/**/*.java"]),
+    resources = glob(["src/main/resources/**"]),
+    deps = [
+       "@maven//:org_w3c_css_sac",
+       "@maven//:com_google_code_findbugs_jsr305",
+       "@maven//:org_json_json",
+       "@maven//:net_sourceforge_cssparser_cssparser",
+       "@maven//:org_testng_testng",
+       "@maven//:ch_qos_logback_logback_classic",
+       "@maven//:org_slf4j_slf4j_api",
+       "@maven//:com_google_protobuf_protobuf_java",
+       "@maven//:com_yahoo_tagchowder_tagchowder_core",
+       "@maven//:org_apache_commons_commons_lang3",
+       "@maven//:org_apache_commons_commons_text"
+    ],
+)
+
+java_library(
+    name = "amphtml_validator_test_lib",
+    srcs = glob(["src/test/java/**/*.java"]),
+    resources = glob(["src/test/resources/**", "src/main/resources/**"]),
+    deps = [
+        ":amphtml_validator_java_proto_lib",
+        ":amphtml_validator_lib",
+        "@maven//:net_sourceforge_cssparser_cssparser",
+        "@maven//:com_google_code_findbugs_jsr305",
+        "@maven//:org_testng_testng",
+        "@maven//:junit_junit",
+        "@maven//:org_mockito_mockito_all",
+        "@maven//:com_google_guava_guava",
+    ],
+)
+
+java_test(
+    name = "amphtml_validator_test",
+    size = "small",
+    runtime_deps = [
+        ":amphtml_validator_test_lib",
+    ],
+    use_testrunner=False,
+    main_class='org.testng.TestNG',
+    args=['-testjar','libamphtml_validator_test_lib.jar','-verbose','2'],
+)
diff --git a/validator/java/Changelog.md b/validator/java/Changelog.md
new file mode 100644
index 0000000000000..eba6fe8722e12
--- /dev/null
+++ b/validator/java/Changelog.md
@@ -0,0 +1,5 @@
+# Changelog
+
+## AMP HTML Validator 1.0.0 released
+
+AMP HTML Validator 1.0.0 is an initial release. The goal of this project is to keep updating the code with small fixes and features. This project requires unit tests and code coverage by default, and uses github and a automated pipe-line to publish new versions in a automated fashion for every commit that is merged, without humans need for each release.
diff --git a/validator/java/Contribute.md b/validator/java/Contribute.md
new file mode 100644
index 0000000000000..2da3d4abc1a81
--- /dev/null
+++ b/validator/java/Contribute.md
@@ -0,0 +1,29 @@
+# How to contribute
+
+First, thanks for taking the time to contribute to our project! The following information provides a guide for making contributions.
+
+## Code of Conduct
+
+By participating in this project, you agree to abide by the [AMP code of conduct](https://github.com/ampproject/meta/blob/master/CODE_OF_CONDUCT.md). Everyone is welcome to submit a pull request or open an issue to improve the documentation, add improvements, or report bugs.
+
+## How to Ask a Question
+
+If you simply have a question that needs an answer, [create an issue](https://help.github.com/articles/creating-an-issue/), and label it as a question.
+
+## How To Contribute
+
+### Report a Bug or Request a Feature
+
+If you encounter any bugs while using this software, or want to request a new feature or enhancement, feel free to [create an issue](https://help.github.com/articles/creating-an-issue/) to report it, make sure you add a label to indicate what type of issue it is.
+
+### Contribute Code
+
+Pull requests are welcome for bug fixes. If you want to implement something new, please [request a feature first](#report-a-bug-or-request-a-feature) so we can discuss it.
+
+#### Creating a Pull Request
+
+Before you submit any code, we need you to agree to our [Contributor License Agreement](https://yahoocla.herokuapp.com/); this ensures we can continue to protect your contributions under an open source license well into the future.
+
+Please follow [best practices](https://github.com/trein/dev-best-practices/wiki/Git-Commit-Best-Practices) for creating git commits.
+
+When your code is ready to be submitted, you can [submit a pull request](https://help.github.com/articles/creating-a-pull-request/) to begin the code review process.
diff --git a/validator/java/LICENSE b/validator/java/LICENSE
new file mode 100644
index 0000000000000..f49a4e16e68b1
--- /dev/null
+++ b/validator/java/LICENSE
@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
\ No newline at end of file
diff --git a/validator/java/NOTICE b/validator/java/NOTICE
new file mode 100644
index 0000000000000..753dbb0de8bd1
--- /dev/null
+++ b/validator/java/NOTICE
@@ -0,0 +1,4 @@
+AMP HTML Validator
+Copyright 2016 by Google's AMP group (https://github.com/ampproject/amphtml).
+
+This product includes software developed Google's AMP dev (https://github.com/ampproject/amphtml/blob/master/OWNERS.yaml), and portions of this software were developed at Verizon Media Inc.
\ No newline at end of file
diff --git a/validator/java/README.md b/validator/java/README.md
new file mode 100644
index 0000000000000..344760c63b2f4
--- /dev/null
+++ b/validator/java/README.md
@@ -0,0 +1,87 @@
+# AMP HTML ⚡ Validator
+
+AMP HTML Validator takes input of HTML text and parses the text tag by tag, running the ruleset against every tag. Resultant from this process is validity of the input text and the errors generated while parsing.
+
+## Table of Contents
+
+- [Background](#Background)
+- [Install](#Install)
+- [Usage](#Usage)
+- [Issues](#Issues)
+- [Contribute](#Contribute)
+- [License](#License)
+- [Attribution](#Attribution)
+
+## Background
+
+@nhant01 and @GeorgeLuo own development and maintenance responsibility of the project. As such they will serve as the points of contact surrounding changes and modifications. The team will allocate resources to align the business with the implementations provided under the amphtml repo. With that in mind, should supporting this project become infeasible, we will publish a version of the codebase marked for deprecation and prepare for its removal from public repositories (every effort will be made to not have this happen).
+
+### Install
+
+#### Maven
+
+AMP HTML Validator uses maven as tool for building and managing project. Add following snippet to your pom.xml and hit "mvn" to build your project.
+
+```
+<dependency>
+  <groupId>amp.validator</groupId>
+  <artifactId>amphtml-validator</artifactId>
+  <version>1.0</version>
+</dependency>
+```
+
+Here are the instructions to setup maven environment.
+https://maven.apache.org/what-is-maven.html
+https://maven.apache.org/guides/introduction/introduction-to-the-pom.html
+
+#### Bazel
+
+The Bazel BUILD file provides the instructions to construct a useable jar. There are two jars necessary to use the amp-validator, found in the bazel-bin, the bazel-bin/libamphtml_validator_lib.jar (validator business logic) and the bazel-bin/libamphtml_validator_proto_lib-speed.jar (the compiled proto objects). Run,
+
+```
+bazel clean
+bazel run //:fetchAMPResources
+bazel build //:amphtml_validator_java_proto_lib
+bazel run //:copyValidatorJavaSource
+bazel build //:amphtml_validator_lib
+```
+
+To run the suite of tests against this repo, run,
+
+```
+bazel run //:amphtml_validator_test
+```
+
+## Usage
+
+Initialize the validator using
+
+```
+final AMPHtmlParser ampHtmlParser = new AMPHtmlParser();
+final ValidationResult validationResult = ampHtmlParser.parse(inputHtml, htmlFormat, condition, maxNodes);
+```
+
+The parser can be used beyond the first document, to truncate initialization time. The maxNode condition is the maximum number of tags reviewed by the validator before forcing exit on exception. The condition is an enumeration of type ExitCondition, either exit on first error or a full parsing attempt. The htmlFormat is an enumeration for the format of AMP to be validated against.
+
+## Issues
+
+The are several known bugs in the validation output.
+
+- the DOCTYPE tag is assumed to exist. Documents without the tag will fail to return an error.
+- Observance of afterbody mode is not implemented. Tags that appear following a body closing tag should be interpreted as within the body tag. Specs that mandate relationships between tags and ancestors related to the body tag will not account for this behavior and will return unexpected errors.
+- Attributes are de-duped by the internal html parser (the last value assigned to an attribute is the one returned to the handler). This leads to discrepancies in attribute validation to do with validation of the uniqueness of attributes and unexpected behavior in value validation.
+- Attributes are sanitized for disallowed characters. This affects operators with contextual meaning such as '{' or '['. This will affect amp-mustache tag validation.
+- Validation of URLs found within the HTML document may not return the same errors as the Node.js implementation. This stems from the fact that the internal URL library is lenient in terms of validating hostnames and characters used within the URL.
+- The parser obfuscates Unicode values, this is grievous as the amp symbol is never discovered (⚡), this package only handles the literal "amp4email."
+  Importantly, this validator prioritizes amp4email html content, enforcement of validator logic for other formats is not guaranteed.
+- CSS validation does not yet configure for a max nodes value
+
+## Contribute
+
+Please refer to the [Contribute.md](Contribute.md) file for information about how to get involved. We welcome issues, questions, and pull requests. Pull Requests are welcome.
+
+## License
+
+This project is licensed under the terms of the [Apache 2.0](https://www.apache.org/licenses/LICENSE-2.0.txt) open source license. Please refer to [LICENSE](LICENSE) for the full terms.
+
+## Attribution
diff --git a/validator/java/TODO b/validator/java/TODO
new file mode 100644
index 0000000000000..e69de29bb2d1d
diff --git a/validator/java/WORKSPACE b/validator/java/WORKSPACE
new file mode 100644
index 0000000000000..e4d578386d4b7
--- /dev/null
+++ b/validator/java/WORKSPACE
@@ -0,0 +1,78 @@
+load("@bazel_tools//tools/build_defs/repo:http.bzl", "http_archive")
+
+# rules_java defines rules for generating Java code from Protocol Buffers.
+http_archive(
+    name = "rules_java",
+    sha256 = "ccf00372878d141f7d5568cedc4c42ad4811ba367ea3e26bc7c43445bbc52895",
+    strip_prefix = "rules_java-d7bf804c8731edd232cb061cb2a9fe003a85d8ee",
+    urls = [
+        "https://mirror.bazel.build/github.com/bazelbuild/rules_java/archive/d7bf804c8731edd232cb061cb2a9fe003a85d8ee.tar.gz",
+        "https://github.com/bazelbuild/rules_java/archive/d7bf804c8731edd232cb061cb2a9fe003a85d8ee.tar.gz",
+    ],
+)
+
+# rules_proto defines abstract rules for building Protocol Buffers.
+http_archive(
+    name = "rules_proto",
+    sha256 = "57001a3b33ec690a175cdf0698243431ef27233017b9bed23f96d44b9c98242f",
+    strip_prefix = "rules_proto-9cd4f8f1ede19d81c6d48910429fe96776e567b1",
+    urls = [
+        "https://mirror.bazel.build/github.com/bazelbuild/rules_proto/archive/9cd4f8f1ede19d81c6d48910429fe96776e567b1.tar.gz",
+        "https://github.com/bazelbuild/rules_proto/archive/9cd4f8f1ede19d81c6d48910429fe96776e567b1.tar.gz",
+    ],
+)
+
+# java_lite_proto_library rules implicitly depend on @com_google_protobuf_javalite//:javalite_toolchain,
+# which is the JavaLite proto runtime (base classes and common utilities).
+http_archive(
+    name = "com_google_protobuf_javalite",
+    sha256 = "311b29b8d0803ab4f89be22ff365266abb6c48fd3483d59b04772a144d7a24a1",
+    strip_prefix = "protobuf-7b64714af67aa967dcf941df61fe5207975966be",
+    urls = [
+        "https://github.com/google/protobuf/archive/7b64714af67aa967dcf941df61fe5207975966be.zip",
+    ],
+)
+
+load("@rules_java//java:repositories.bzl", "rules_java_dependencies", "rules_java_toolchains")
+rules_java_dependencies()
+rules_java_toolchains()
+
+load("@rules_proto//proto:repositories.bzl", "rules_proto_dependencies", "rules_proto_toolchains")
+rules_proto_dependencies()
+rules_proto_toolchains()
+
+load("@bazel_tools//tools/build_defs/repo:http.bzl", "http_archive")
+
+RULES_JVM_EXTERNAL_TAG = "2.8"
+RULES_JVM_EXTERNAL_SHA = "79c9850690d7614ecdb72d68394f994fef7534b292c4867ce5e7dec0aa7bdfad"
+
+http_archive(
+    name = "rules_jvm_external",
+    strip_prefix = "rules_jvm_external-%s" % RULES_JVM_EXTERNAL_TAG,
+    sha256 = RULES_JVM_EXTERNAL_SHA,
+    url = "https://github.com/bazelbuild/rules_jvm_external/archive/%s.zip" % RULES_JVM_EXTERNAL_TAG,
+)
+
+load("@rules_jvm_external//:defs.bzl", "maven_install")
+
+maven_install(
+    artifacts = [
+	"com.google.code.findbugs:jsr305:3.0.2",
+	"org.json:json:20190722",
+	"net.sourceforge.cssparser:cssparser:0.9.27",
+	"org.w3c.css:sac:1.3",
+	"org.testng:testng:6.8",
+	"ch.qos.logback:logback-classic:1.2.3",
+	"org.slf4j:slf4j-api:1.7.25",
+	"com.google.protobuf:protobuf-java:3.8.0",
+	"com.yahoo.tagchowder:tagchowder.core:2.0.10",
+	"org.apache.commons:commons-lang3:3.9",
+	"org.apache.commons:commons-text:1.8",
+	"org.mockito:mockito-all:1.10.19",
+	"com.google.guava:guava:26.0-jre"
+    ],
+    repositories = [
+	"https://repo1.maven.org/maven2/",
+	"https://jcenter.bintray.com/",
+    ],
+)
\ No newline at end of file
diff --git a/validator/java/ampvalidator_checkstyle.xml b/validator/java/ampvalidator_checkstyle.xml
new file mode 100644
index 0000000000000..cce806fa8f413
--- /dev/null
+++ b/validator/java/ampvalidator_checkstyle.xml
@@ -0,0 +1,213 @@
+<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE module PUBLIC "-//Puppy Crawl//DTD Check Configuration 1.3//EN"
+        "http://www.puppycrawl.com/dtds/configuration_1_3.dtd">
+
+<!-- Checkstyle-Configuration: ampvalidator checks Description: none -->
+<module name="Checker">
+    <property name="severity" value="warning"/>
+    <module name="TreeWalker">
+        <property name="tabWidth" value="4"/>
+        <!-- Make the @SuppressWarnings annotations available to Checkstyle -->
+        <module name="SuppressWarningsHolder" />
+        <module name="JavadocMethod">
+            <property name="suppressLoadErrors" value="true"/>
+            <property name="allowUndeclaredRTE" value="true"/>
+            <property name="scope" value="public"/>
+        </module>
+        <module name="JavadocType">
+            <property name="scope" value="public"/>
+        </module>
+        <module name="JavadocVariable">
+            <property name="scope" value="public"/>
+        </module>
+        <module name="JavadocStyle">
+            <property name="checkFirstSentence" value="false"/>
+        </module>
+        <module name="ConstantName"/>
+        <module name="LocalFinalVariableName"/>
+        <module name="LocalVariableName"/>
+        <module name="MemberName"/>
+        <module name="MethodName"/>
+        <module name="PackageName"/>
+        <module name="ParameterName"/>
+        <module name="StaticVariableName"/>
+        <module name="TypeName"/>
+        <module name="AvoidStarImport"/>
+        <module name="IllegalImport">
+            <property name="severity" value="error"/>
+            <property name="illegalPkgs"
+                      value="edu.emory.mathcs.backport.java.util, org.ocpsoft.prettytime.shade.edu.emory.mathcs.backport.java.util, org.apache.log4j, yjava.messaging.ynet, yjava.security.ysecure, yjava.security.yck, yjava.security.yhdrs, , yjava.messaging.ynet"/>
+            <message key="import.illegal" value="Import from illegal package - {0}."/>
+        </module>
+        <module name="ImportControl">
+            <property name="file" value="${config_loc}/ampvalidator_checkstyle_import_control.xml"/>
+        </module>
+        <module name="RedundantImport"/>
+        <module name="UnusedImports"/>
+        <module name="ParameterNumber"/>
+        <module name="EmptyForIteratorPad"/>
+        <module name="MethodParamPad"/>
+        <module name="NoWhitespaceAfter">
+            <property name="tokens"
+                      value="BNOT,DEC,DOT,INC,LNOT,UNARY_MINUS,UNARY_PLUS"/>
+        </module>
+        <module name="NoWhitespaceBefore"/>
+        <module name="OperatorWrap"/>
+        <module name="ParenPad"/>
+        <module name="TypecastParenPad"/>
+        <module name="WhitespaceAfter"/>
+        <module name="WhitespaceAround"/>
+        <module name="ModifierOrder"/>
+        <module name="RedundantModifier"/>
+        <module name="AvoidNestedBlocks">
+            <property name="severity" value="ignore"/>
+        </module>
+        <module name="EmptyBlock">
+            <property name="option" value="text"/>
+        </module>
+        <module name="LeftCurly"/>
+        <module name="NeedBraces"/>
+        <module name="RightCurly"/>
+        <module name="EmptyStatement"/>
+        <module name="EqualsHashCode"/>
+        <module name="IllegalInstantiation"/>
+        <module name="InnerAssignment">
+            <property name="severity" value="ignore"/>
+        </module>
+        <module name="MagicNumber"/>
+        <module name="MissingSwitchDefault"/>
+        <!-- <module name="RedundantThrows"> <property name="suppressLoadErrors"
+            value="true"/> </module> -->
+        <module name="SimplifyBooleanExpression"/>
+        <module name="SimplifyBooleanReturn"/>
+        <module name="FinalClass"/>
+        <module name="HideUtilityClassConstructor"/>
+        <module name="InterfaceIsType"/>
+        <module name="VisibilityModifier">
+            <property name="protectedAllowed" value="true"/>
+        </module>
+        <module name="ArrayTypeStyle"/>
+        <module name="FinalParameters"/>
+        <module name="IllegalCatch">
+            <property name="illegalClassNames"
+                      value="java.lang.Exception, java.lang.Throwable, java.lang.RuntimeException, java.lang.IllegalArgumentException, java.lang.IllegalStateException, java.lang.UnsupportedOperationException, java.lang.NumberFormatException,
+                 java.lang.NullPointerException, java.lang.StringIndexOutOfBoundsException, java.lang.ArrayIndexOutOfBoundsException, java.util.NoSuchElementException, java.util.MissingResourceException,
+                 javax.ws.rs.NotSupportedException, javax.ws.rs.BadRequestException, javax.ws.rs.ProcessingException, javax.ws.rs.core.UriBuilderException"/>
+        </module>
+        <module name="IllegalThrows">
+            <property name="illegalClassNames"
+                      value="java.lang.Exception, java.lang.Throwable, java.lang.RuntimeException, java.lang.IllegalArgumentException, java.lang.IllegalStateException, java.lang.UnsupportedOperationException, java.lang.NumberFormatException,
+                 java.lang.NullPointerException, java.lang.StringIndexOutOfBoundsException, java.lang.ArrayIndexOutOfBoundsException, java.util.NoSuchElementException, java.util.MissingResourceException,
+                 javax.ws.rs.NotSupportedException, javax.ws.rs.BadRequestException, javax.ws.rs.ProcessingException, javax.ws.rs.core.UriBuilderException"/>
+        </module>
+        <module name="IllegalInstantiation">
+            <property name="classes" value="java.net.URLEncoder"/>
+            <property name="classes" value="java.net.URLDecoder"/>
+            <property name="classes" value="javax.mail.internet.InternetAddress"/>
+        </module>
+        <module name="TodoComment">
+            <property name="severity" value="ignore"/>
+            <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity"
+                      value="inherit"/>
+        </module>
+        <module name="UpperEll"/>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="System\.(out|err|in|exit)"/>
+            <property name="message"
+                      value="Prohibited System.out/err/in/exit reference(s)."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="\.getBytes\(\)"/>
+            <property name="message" value="Possible usage of String.getBytes() without Charset specification."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="Charset\.getDefaultCharset\(\)"/>
+            <property name="message" value="Usage of Charset.getDefaultCharset() is prohibited."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="\.getBytes\(&quot;(.*)&quot;\)"/>
+            <property name="message" value="Possible usage of String.getBytes() with String to specific Charset."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="@Test.*dependsOn(Groups|Methods).*"/>
+            <property name="message"
+                      value="Prohibited TestNG dependsOn due to issues with parallelization.  Make all tests run independently."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="\.submit\([a-zA-Z]*[Ww]orker, null\)"/>
+            <property name="message"
+                      value="Prohibited use of submit with null passed as handler. Please use WorkerExceptionStatsHandler."/>
+        </module>
+    </module>
+    <!--
+    A multiline regex matcher for the illegal ConfigGets (of type ValueType.StringList). It can detect the invalid default values like:
+    "[Personal]"
+    "[ Personal ]"
+    "[    Personal    ]"
+    "[Personal, Unknown]"
+    "[ Personal, Unknown ]"
+    "[\"Unknown]"
+
+    It will not detect the valid default values like:
+    "[ ]"
+    "[]"
+    "[\"Personal\", \"Unknown\", \"ghjgjggjhgjgjghjgjhg \"]"
+    "[ \"Personal\", \"Unknown\" ]"
+    "[ \"Personal\", \"Unknown\"]"
+    "[   \"Personal\", \"Unknown\"]"
+    "[\"Personal\", \"Unknown\"]"
+    "[\"Personal\", \"Unknown\" ]"
+    "[\"Personal\", \"Unknown\"   ]"
+    "[    \"Personal\", \"Unknown\"    ]"
+    "[\"Unknown\"]"
+    ""
+    "Personal"
+    "Personal, Unknown"
+
+    Refer https://regex101.com/r/iX3QQT/6/tests for the regex and the corresponding tests.
+     -->
+    <module name="RegexpMultiline">
+        <property name="format"
+                  value="type = ValueType\.StringList,\s*defaultValue = \&quot;\[ *[^\\ ][^&quot;]\S+( |\S)+[^\\][^&quot; ] *\]\&quot;\)$"/>
+        <property name="message" value="Default value for StringList should be a string representation of an array of strings."/>
+    </module>
+    <module name="JavadocPackage">
+        <property name="allowLegacy" value="true"/>
+    </module>
+    <module name="NewlineAtEndOfFile">
+        <property name="severity" value="ignore"/>
+        <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity"
+                  value="inherit"/>
+    </module>
+    <module name="Translation"/>
+    <module name="FileLength"/>
+    <module name="FileTabCharacter">
+        <property name="severity" value="ignore"/>
+        <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity"
+                  value="inherit"/>
+    </module>
+    <module name="RegexpSingleline">
+        <property name="severity" value="ignore"/>
+        <property name="format" value="\s+$"/>
+        <property name="message" value="Line has trailing spaces."/>
+        <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity"
+                  value="inherit"/>
+    </module>
+    <module name="SuppressWarningsFilter"/>
+    <!-- Eclipse-Only Suppression Filter Configuration / Fails for Maven
+        Commandline Maven command-line build uses pom.xml suppressionLocation setting
+        in the checkstyle configuration. Eclipse checkstyle does not recognize the
+        pom.xml setting, only the checkstyle.xml SuppressionFilter module here. But
+        Maven command-line does not compile with the following because no variable
+        is defined to locate the supporessions.xml in a way that works consistently
+        regardless of where invoked (from root of project or cd into individual projects.
+        You can set pom.xml PropertiesLocation tag with a .properties file containing
+        key=value pairs for such variables, but they are not relative to the checkstyle.xml
+        location. DISABLED: Enable only if you want to see the same exclusions from
+        eclipse, but will not build from command-line. <module name="SuppressionFilter">
+        <property name="file" value="${samedir}/ampvalidator_checkstyle_suppressions.xml"/>
+        </module> -->
+    <module name="SuppressionFilter">
+        <property name="file"
+                  value="${config_loc}/ampvalidator_checkstyle_suppressions.xml"/>
+    </module>
+</module>
\ No newline at end of file
diff --git a/validator/java/ampvalidator_checkstyle_edit.xml b/validator/java/ampvalidator_checkstyle_edit.xml
new file mode 100644
index 0000000000000..68e630be7e81d
--- /dev/null
+++ b/validator/java/ampvalidator_checkstyle_edit.xml
@@ -0,0 +1,174 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE module PUBLIC "-//Puppy Crawl//DTD Check Configuration 1.3//EN" "http://www.puppycrawl.com/dtds/configuration_1_3.dtd">
+
+<!--
+    This configuration file was written by the eclipse-cs plugin configuration editor
+-->
+<!--
+    Checkstyle-Configuration: ampvalidator_checkstyle_edit
+    Description:
+Jedi Check Style rules
+-->
+<module name="Checker">
+    <property name="severity" value="warning"/>
+    <module name="TreeWalker">
+        <property name="tabWidth" value="4"/>
+        <module name="JavadocMethod">
+            <property name="allowUndeclaredRTE" value="true"/>
+            <property name="suppressLoadErrors" value="true"/>
+        </module>
+        <module name="JavadocType"/>
+        <module name="JavadocVariable"/>
+        <module name="JavadocStyle"/>
+        <module name="ConstantName"/>
+        <module name="LocalFinalVariableName"/>
+        <module name="LocalVariableName"/>
+        <module name="MemberName"/>
+        <module name="MethodName"/>
+        <module name="PackageName"/>
+        <module name="ParameterName"/>
+        <module name="StaticVariableName"/>
+        <module name="TypeName"/>
+        <module name="AvoidStarImport"/>
+        <module name="IllegalImport">
+            <property name="severity" value="error"/>
+            <property name="illegalPkgs"
+                      value="edu.emory.mathcs.backport.java.util, org.ocpsoft.prettytime.shade.edu.emory.mathcs.backport.java.util, org.apache.log4j"/>
+            <message key="import.illegal" value="Import from illegal package - {0}."/>
+        </module>
+        <module name="RedundantImport"/>
+        <module name="UnusedImports"/>
+        <module name="LineLength">
+            <property name="max" value="150"/>
+        </module>
+        <module name="ParameterNumber"/>
+        <module name="EmptyForIteratorPad"/>
+        <module name="MethodParamPad"/>
+        <module name="NoWhitespaceAfter">
+            <property name="tokens" value="BNOT,DEC,DOT,INC,LNOT,UNARY_MINUS,UNARY_PLUS"/>
+        </module>
+        <module name="NoWhitespaceBefore"/>
+        <module name="OperatorWrap"/>
+        <module name="ParenPad"/>
+        <module name="TypecastParenPad"/>
+        <module name="WhitespaceAfter"/>
+        <module name="WhitespaceAround"/>
+        <module name="ModifierOrder"/>
+        <module name="RedundantModifier"/>
+        <module name="AvoidNestedBlocks">
+            <property name="severity" value="ignore"/>
+            <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity" value="inherit"/>
+        </module>
+        <module name="EmptyBlock">
+            <property name="option" value="text"/>
+        </module>
+        <module name="LeftCurly"/>
+        <module name="NeedBraces"/>
+        <module name="RightCurly"/>
+        <module name="EmptyStatement"/>
+        <module name="EqualsHashCode"/>
+        <module name="IllegalInstantiation"/>
+        <module name="InnerAssignment">
+            <property name="severity" value="ignore"/>
+            <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity" value="inherit"/>
+        </module>
+        <module name="MagicNumber"/>
+        <module name="MissingSwitchDefault"/>
+        <module name="SimplifyBooleanExpression"/>
+        <module name="SimplifyBooleanReturn"/>
+        <module name="FinalClass"/>
+        <module name="HideUtilityClassConstructor"/>
+        <module name="InterfaceIsType"/>
+        <module name="VisibilityModifier">
+            <property name="protectedAllowed" value="true"/>
+        </module>
+        <module name="ArrayTypeStyle"/>
+        <module name="FinalParameters"/>
+        <module name="IllegalCatch"/>
+        <module name="IllegalInstantiation">
+            <property name="classes" value="javax.mail.internet.InternetAddress"/>
+        </module>
+        <module name="TodoComment">
+            <property name="severity" value="ignore"/>
+            <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity" value="inherit"/>
+        </module>
+        <module name="UpperEll"/>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="System\.(out|err|in|exit)"/>
+            <property name="message" value="Prohibited System.out/err/in/exit reference(s)."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="\.getBytes\(\)"/>
+            <property name="message" value="Possible usage of String.getBytes() without Charset specification."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="\.getBytes\(&quot;(.*)&quot;\)"/>
+            <property name="message" value="Possible usage of String.getBytes() with String to specific Charset."/>
+        </module>
+        <module name="RegexpSinglelineJava">
+            <property name="format" value="@Test.*dependsOn(Groups|Methods).*"/>
+            <property name="message" value="Prohibited TestNG dependsOn due to issues with parallelization.  Make all tests run independently."/>
+        </module>
+        <module name="MissingDeprecated">
+            <property name="severity" value="warning"/>
+        </module>
+        <module name="MissingOverride">
+            <property name="severity" value="warning"/>
+        </module>
+        <module name="LineLength">
+            <property name="max" value="150"/>
+            <property name="tabWidth" value="10"/>
+        </module>
+        <module name="EmptyCatchBlock"/>
+        <module name="DefaultComesLast"/>
+        <module name="EqualsAvoidNull"/>
+        <module name="FinalLocalVariable"/>
+        <module name="HiddenField"/>
+        <module name="IllegalThrows"/>
+        <module name="NestedForDepth"/>
+        <module name="NestedIfDepth"/>
+        <module name="NestedTryDepth"/>
+        <module name="NoClone"/>
+        <module name="NoFinalizer"/>
+        <module name="PackageDeclaration"/>
+        <module name="ParameterAssignment"/>
+        <module name="StringLiteralEquality"/>
+        <module name="SuperFinalize"/>
+        <module name="SuperClone"/>
+        <module name="UnnecessaryParentheses"/>
+        <module name="VariableDeclarationUsageDistance">
+            <property name="allowedDistance" value="5"/>
+        </module>
+        <module name="BooleanExpressionComplexity">
+            <property name="max" value="5"/>
+        </module>
+        <module name="ClassDataAbstractionCoupling"/>
+        <module name="ClassFanOutComplexity"/>
+        <module name="CyclomaticComplexity"/>
+        <module name="JavaNCSS"/>
+        <module name="NPathComplexity"/>
+    </module>
+    <module name="JavadocPackage">
+        <property name="allowLegacy" value="true"/>
+    </module>
+    <module name="NewlineAtEndOfFile">
+        <property name="severity" value="ignore"/>
+        <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity" value="inherit"/>
+    </module>
+    <module name="Translation"/>
+    <module name="FileLength"/>
+    <module name="FileTabCharacter"/>
+    <module name="RegexpSingleline">
+        <property name="severity" value="ignore"/>
+        <property name="format" value="\s+$"/>
+        <property name="message" value="Line has trailing spaces."/>
+        <metadata name="net.sf.eclipsecs.core.lastEnabledSeverity" value="inherit"/>
+    </module>
+    <module name="SuppressionFilter">
+        <property name="file" value="${config_loc}/ampvalidator_checkstyle_suppressions.xml"/>
+    </module>
+    <module name="SuppressWarningsFilter">
+        <property name="id" value="checkstyle:suppresswarnings"/>
+    </module>
+    <module name="FileLength"/>
+</module>
\ No newline at end of file
diff --git a/validator/java/ampvalidator_checkstyle_import_control.xml b/validator/java/ampvalidator_checkstyle_import_control.xml
new file mode 100644
index 0000000000000..762ecea5ba5a5
--- /dev/null
+++ b/validator/java/ampvalidator_checkstyle_import_control.xml
@@ -0,0 +1,24 @@
+<?xml version="1.0"?>
+<!DOCTYPE import-control PUBLIC
+        "-//Puppy Crawl//DTD Import Control 1.2//EN"
+        "import_control_1_2.dtd">
+<!-- This file is used to control the imports in different packages in amp validator-->
+<import-control pkg="dev.amp.validator">
+    <allow pkg=".*" regex="true" />
+    <disallow pkg="org\.slf4j\.*" regex="true"/>
+    <subpackage name="css">
+        <allow pkg="org\.slf4j\.*" regex="true"/>
+    </subpackage>
+    <subpackage name="exception">
+        <allow pkg="org\.slf4j\.*" regex="true"/>
+    </subpackage>
+    <subpackage name="parser">
+        <allow pkg="org\.slf4j\.*" regex="true"/>
+    </subpackage>
+    <subpackage name="utils">
+        <allow pkg="org\.slf4j\.*" regex="true"/>
+    </subpackage>
+    <subpackage name="visitor">
+        <allow pkg="org\.slf4j\.*" regex="true"/>
+    </subpackage>
+</import-control>
\ No newline at end of file
diff --git a/validator/java/ampvalidator_checkstyle_suppressions.xml b/validator/java/ampvalidator_checkstyle_suppressions.xml
new file mode 100644
index 0000000000000..98e180237cb98
--- /dev/null
+++ b/validator/java/ampvalidator_checkstyle_suppressions.xml
@@ -0,0 +1,30 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE suppressions PUBLIC "-//Puppy Crawl//DTD Suppressions 1.1//EN" "http://www.puppycrawl.com/dtds/suppressions_1_1.dtd">
+
+<suppressions>
+    <!-- Suppress package-info.java checks in the unit test source folders
+        (src/test/java) with the same package as product code (src/main/java). We
+        exclude all UT classes from package enforcement, which may include test-only
+        packages such as utilities. But we cannot have the same-named file in the
+        same package at different locations or Eclipse will complain. However, only
+        command-line check-style honors this exclusion, so Eclipse check-style will
+        still complain, but at least it will not be an Eclipse compile failure when
+        you have 2 of the same files in the same package. note: Alternatively we
+        could exclude anything with "test" in the name by files="[\\/]test[\\/]"
+        @author dvictor -->
+    <suppress checks="JavadocPackage" files="[\\/]test[\\/]"/>
+    <suppress checks="JavadocMethod" files="[\\/]test[\\/]"/>
+    <suppress checks="JavadocType" files="[\\/]test[\\/]"/>
+    <suppress checks="JavadocStyleCheck" files="[\\/]test[\\/]"/>
+    <suppress checks="MagicNumber" files="[\\/]test[\\/]"/>
+    <suppress checks="IllegalThrows" files="[\\/]test[\\/]"/>
+
+    <suppress checks="[a-zA-Z0-9]*" files="ValidatorProtos.java"/>
+    <suppress checks="[a-zA-Z0-9]*" files="[\\/]test[\\/]java[\\/]dev[\\/]amp[\\/]validator[\\/]css[\\/]"/>
+    <suppress checks="[a-zA-Z0-9]*" files="[\\/]test[\\/]java[\\/]dev[\\/]amp[\\/]validator[\\/]exception[\\/]"/>
+    <suppress checks="[a-zA-Z0-9]*" files="[\\/]test[\\/]java[\\/]dev[\\/]amp[\\/]validator[\\/]parser[\\/]"/>
+    <suppress checks="[a-zA-Z0-9]*" files="[\\/]test[\\/]java[\\/]dev[\\/]amp[\\/]validator[\\/]utils[\\/]"/>
+
+    <!-- Suppress all checkstyle for autogenerated jaxws.managed package -->
+    <suppress checks="[a-zA-Z0-9]*" files="[\\/]target[\\/]"/>
+</suppressions>
diff --git a/validator/java/exclude-pmd.properties b/validator/java/exclude-pmd.properties
new file mode 100644
index 0000000000000..81681a003d035
--- /dev/null
+++ b/validator/java/exclude-pmd.properties
@@ -0,0 +1,30 @@
+dev.amp.validator.ValidatorProtos$AttrTriggerSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$PropertySpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$PropertySpecList$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$UrlSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$CssDeclaration$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$AttrSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$AttrList$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$DescendantTagList$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$BlackListedCDataRegex$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$MediaQuerySpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$AtRuleSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$CssSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$CdataSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$AmpLayout$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$AncestorMarker$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ChildTagSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ReferencePoint$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ExtensionSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$TagSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$CssLengthSpec$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ValidatorRules$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ValidationError$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ErrorSpecificity$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ErrorFormat$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ValidationResult$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ValidatorInfo$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ValueSetRequirement$Builder=AvoidThrowingNullPointerException
+dev.amp.validator.ValidatorProtos$ValueSetProvision$Builder=AvoidThrowingNullPointerException
+AMPValidatorLoader=AvoidThrowingNullPointerException,SignatureDeclareThrowsException
+AMPValidatorManager=AvoidThrowingNullPointerException,SignatureDeclareThrowsException
diff --git a/validator/java/pmd-ruleset-nullchecks.xml b/validator/java/pmd-ruleset-nullchecks.xml
new file mode 100644
index 0000000000000..20f82ffe8d39a
--- /dev/null
+++ b/validator/java/pmd-ruleset-nullchecks.xml
@@ -0,0 +1,11 @@
+<?xml version="1.0"?>
+<ruleset name="PMD-Rules-Nullchecks">
+    <description>Jedi PMD rules for checking null usage.</description>
+    <!-- Null checks. -->
+    <rule ref="rulesets/java/basic.xml/MisplacedNullCheck">
+        <priority>1</priority>
+    </rule>
+    <rule ref="rulesets/java/basic.xml/BrokenNullCheck">
+        <priority>1</priority>
+    </rule>
+</ruleset>
\ No newline at end of file
diff --git a/validator/java/pmd-ruleset.xml b/validator/java/pmd-ruleset.xml
new file mode 100644
index 0000000000000..f8d2bc959b8d7
--- /dev/null
+++ b/validator/java/pmd-ruleset.xml
@@ -0,0 +1,30 @@
+<?xml version="1.0"?>
+<ruleset name="PMD-Rules">
+    <description>AMP Validator PMD rules.</description>
+    <!-- String instantiation -->
+    <rule ref="rulesets/java/strings.xml/StringInstantiation"><priority>1</priority></rule>
+    <rule ref="rulesets/java/basic.xml/BooleanInstantiation"><priority>1</priority></rule>
+    <rule ref="rulesets/java/basic.xml/UnconditionalIfStatement"><priority>1</priority></rule>
+    <!-- Guards around log statements -->
+    <rule ref="rulesets/java/logging-java.xml/GuardLogStatementJavaUtil"><priority>1</priority></rule>
+    <!-- Rules about throwing and catching exceptions -->
+    <rule ref="rulesets/java/strictexception.xml/AvoidCatchingThrowable"><priority>1</priority></rule>
+    <rule ref="rulesets/java/strictexception.xml/SignatureDeclareThrowsException"><priority>1</priority></rule>
+    <rule ref="rulesets/java/strictexception.xml/ExceptionAsFlowControl"><priority>1</priority></rule>
+    <rule ref="rulesets/java/strictexception.xml/AvoidCatchingNPE"><priority>1</priority></rule>
+    <!--<rule ref="rulesets/java/strictexception.xml/AvoidThrowingRawExceptionTypes"><priority>1</priority></rule>  -->
+    <rule ref="rulesets/java/strictexception.xml/AvoidThrowingNullPointerException"><priority>1</priority></rule>
+    <!--<rule ref="rulesets/java/strictexception.xml/AvoidRethrowingException"><priority>1</priority></rule>  -->
+    <rule ref="rulesets/java/strictexception.xml/DoNotExtendJavaLangError"><priority>1</priority></rule>
+    <rule ref="rulesets/java/strictexception.xml/DoNotThrowExceptionInFinally"><priority>1</priority></rule>
+    <!--<rule ref="rulesets/java/strictexception.xml/AvoidThrowingNewInstanceOfSameException"><priority>1</priority></rule>  -->
+    <!--<rule ref="rulesets/java/strictexception.xml/AvoidCatchingGenericException"><priority>1</priority></rule>  -->
+    <!--<rule ref="rulesets/java/strictexception.xml/AvoidLosingExceptionInformation"><priority>1</priority></rule>  -->
+    <!-- Cyclomatic Complexity -->
+    <!-- <rule ref="rulesets/java/codesize.xml/CyclomaticComplexity"><priority>1</priority></rule> -->
+    <!-- A collection of rules that find unused code -->
+    <!--<rule ref="rulesets/java/unusedcode.xml/UnusedPrivateField"><priority>1</priority></rule>  -->
+    <!--<rule ref="rulesets/java/unusedcode.xml/UnusedLocalVariable"><priority>1</priority></rule>  -->
+    <!--<rule ref="rulesets/java/unusedcode.xml/UnusedPrivateMethod"><priority>1</priority></rule>  -->
+    <!--<rule ref="rulesets/java/unusedcode.xml/UnusedFormalParameter"><priority>1</priority></rule>  -->
+</ruleset>
\ No newline at end of file
diff --git a/validator/java/pom.xml b/validator/java/pom.xml
new file mode 100644
index 0000000000000..cf3e5f70dc5ca
--- /dev/null
+++ b/validator/java/pom.xml
@@ -0,0 +1,576 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project xmlns="http://maven.apache.org/POM/4.0.0"
+         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
+    <modelVersion>4.0.0</modelVersion>
+
+    <groupId>amp.validator</groupId>
+    <artifactId>amphtml-validator</artifactId>
+    <name>AMP validator Java API</name>
+    <version>1.0-SNAPSHOT</version>
+    <description>A Java validator for the AMP Html format.</description>
+    <packaging>jar</packaging>
+
+    <properties>
+        <!-- protobuf paths -->
+        <protobuf.input.directory>${project.basedir}/src/main/proto</protobuf.input.directory>
+        <protobuf.output.directory>${project.basedir}/src/main/java</protobuf.output.directory>
+        <validator.main.proto.ascii.directory>${project.basedir}/src/main/resources</validator.main.proto.ascii.directory>
+        <validator.proto.directory>${project.basedir}/src/main/proto</validator.proto.directory>
+
+        <!-- library versions -->
+        <build-helper-maven-plugin.version>3.0.0</build-helper-maven-plugin.version>
+        <maven-antrun-plugin.version>1.8</maven-antrun-plugin.version>
+        <maven-dependency-plugin.version>3.1.1</maven-dependency-plugin.version>
+        <maven-shade-plugin.version>2.4.2</maven-shade-plugin.version>
+        <maven-javadoc-plugin.version>3.1.1</maven-javadoc-plugin.version>
+        <maven-source-plugin.version>3.2.0</maven-source-plugin.version>
+
+        <os-maven-plugin.version>1.6.2</os-maven-plugin.version>
+        <protobuf.version>3.8.0</protobuf.version>
+        <maven-surefire-plugin.version>3.0.0-M3</maven-surefire-plugin.version>
+        <jdk.version>1.8</jdk.version>
+        <main.basedir>${project.basedir}</main.basedir>
+
+        <checkstyle.maxAllowedViolations>10</checkstyle.maxAllowedViolations>
+
+        <mockito.version>1.10.19</mockito.version>
+    </properties>
+
+    <repositories>
+        <repository>
+            <id>maven2</id>
+            <name>Maven Repository Switchboard</name>
+            <url>https://repo1.maven.org/maven2/</url>
+        </repository>
+        <repository>
+            <id>central</id>
+            <name>bintray</name>
+            <url>https://jcenter.bintray.com/</url>
+        </repository>
+    </repositories>
+
+    <build>
+        <!--
+            protoc Maven artifact is provided in various platform-specific classifications:
+            linux-x86_32, linux-x86_64, osx-x86_32, osx-x86_64, windows-x86_32, windows-x86_64.
+            In order to pick the right artifact, we will employ os.detected.classifier property
+            exposed by os-maven-plugin
+        -->
+        <extensions>
+            <!-- provides os.detected.classifier (i.e. linux-x86_64, osx-x86_64) property -->
+            <extension>
+                <groupId>kr.motd.maven</groupId>
+                <artifactId>os-maven-plugin</artifactId>
+                <version>${os-maven-plugin.version}</version>
+            </extension>
+        </extensions>
+
+        <!--
+            We will use maven-dependency-plugin to download the platform-specific protoc binary
+            suitable for the current build platform and copy it into project.build.directory.
+        -->
+        <plugins>
+            <plugin>
+                <artifactId>maven-clean-plugin</artifactId>
+                <version>3.1.0</version>
+                <executions>
+                    <execution>
+                        <id>Deleting generated Validator class</id>
+                        <phase>validate</phase>
+                        <goals>
+                            <goal>clean</goal>
+                        </goals>
+                    </execution>
+                </executions>
+                <configuration>
+                    <excludeDefaultDirectories>true</excludeDefaultDirectories>
+                    <filesets>
+                        <fileset>
+                            <directory>${protobuf.output.directory}/amp/validator</directory>
+                            <includes>
+                                <include>
+                                    Validator.java
+                                </include>
+                            </includes>
+                        </fileset>
+                        <fileset>
+                            <directory>${project.basedir}/target</directory>
+                        </fileset>
+                    </filesets>
+                    <verbose>true</verbose>
+                </configuration>
+            </plugin>
+            <plugin>
+                <artifactId>exec-maven-plugin</artifactId>
+                <groupId>org.codehaus.mojo</groupId>
+                <version>1.6.0</version>
+                <executions>
+                    <execution>
+                        <id>Fetching AMP resources</id>
+                        <phase>generate-sources</phase>
+                        <goals>
+                            <goal>exec</goal>
+                        </goals>
+                        <configuration>
+                            <executable>${basedir}/src/main/bin/fetchAMPResources.sh</executable>
+                            <arguments>
+                                <argument>${project.basedir}</argument>
+                            </arguments>
+                        </configuration>
+                    </execution>
+                </executions>
+            </plugin>
+            <!-- copy protoc binary into build directory -->
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-dependency-plugin</artifactId>
+                <version>${maven-dependency-plugin.version}</version>
+                <executions>
+                    <execution>
+                        <id>copy-protoc</id>
+                        <phase>generate-sources</phase>
+                        <goals>
+                            <goal>copy</goal>
+                        </goals>
+                        <configuration>
+                            <artifactItems>
+                                <artifactItem>
+                                    <groupId>com.google.protobuf</groupId>
+                                    <artifactId>protoc</artifactId>
+                                    <version>${protobuf.version}</version>
+                                    <classifier>${os.detected.classifier}</classifier>
+                                    <type>exe</type>
+                                    <overWrite>true</overWrite>
+                                    <outputDirectory>${project.build.directory}</outputDirectory>
+                                </artifactItem>
+                            </artifactItems>
+                        </configuration>
+                    </execution>
+                </executions>
+            </plugin>
+            <!-- compile proto buffer files using copied protoc binary -->
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-antrun-plugin</artifactId>
+                <version>${maven-antrun-plugin.version}</version>
+                <executions>
+                    <execution>
+                        <id>exec-protoc</id>
+                        <phase>generate-sources</phase>
+                        <configuration>
+                            <target>
+                                <property name="protoc.filename" value="protoc-${protobuf.version}-${os.detected.classifier}.exe"/>
+                                <property name="protoc.filepath" value="${project.build.directory}/${protoc.filename}"/>
+                                <chmod file="${protoc.filepath}" perm="ugo+rx"/>
+                                <mkdir dir="${protobuf.output.directory}" />
+                                <path id="protobuf.input.filepaths.path">
+                                    <fileset dir="${protobuf.input.directory}">
+                                        <include name="**/*.proto"/>
+                                    </fileset>
+                                </path>
+                                <pathconvert pathsep=" " property="protobuf.input.filepaths" refid="protobuf.input.filepaths.path"/>
+                                <exec executable="${protoc.filepath}" failonerror="true">
+                                    <arg value="-I"/>
+                                    <arg value="${protobuf.input.directory}"/>
+                                    <arg value="--java_out"/>
+                                    <arg value="${protobuf.output.directory}"/>
+                                    <arg line="${protobuf.input.filepaths}"/>
+                                </exec>
+                            </target>
+                        </configuration>
+                        <goals>
+                            <goal>run</goal>
+                        </goals>
+                    </execution>
+                </executions>
+            </plugin>
+            <!-- add generated proto buffer classes into the package -->
+            <plugin>
+                <groupId>org.codehaus.mojo</groupId>
+                <artifactId>build-helper-maven-plugin</artifactId>
+                <version>${build-helper-maven-plugin.version}</version>
+                <executions>
+                    <execution>
+                        <id>add-classes</id>
+                        <phase>generate-sources</phase>
+                        <goals>
+                            <goal>add-source</goal>
+                        </goals>
+                        <configuration>
+                            <sources>
+                                <source>${protobuf.output.directory}</source>
+                            </sources>
+                        </configuration>
+                    </execution>
+                </executions>
+            </plugin>
+            <plugin>
+                <groupId>com.googlecode.jslint4java</groupId>
+                <artifactId>jslint4java-maven-plugin</artifactId>
+                <version>2.0.5</version>
+            </plugin>
+            <plugin>
+                <groupId>org.antlr</groupId>
+                <artifactId>antlr3-maven-plugin</artifactId>
+                <version>3.5.2</version>
+            </plugin>
+            <plugin>
+                <groupId>org.codehaus.mojo</groupId>
+                <artifactId>build-helper-maven-plugin</artifactId>
+                <version>3.0.0</version>
+            </plugin>
+            <plugin>
+                <groupId>org.codehaus.mojo</groupId>
+                <artifactId>javacc-maven-plugin</artifactId>
+                <version>2.6</version>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-resources-plugin</artifactId>
+                <version>3.1.0</version>
+            </plugin>
+            <plugin>
+                <artifactId>maven-assembly-plugin</artifactId>
+                <version>3.1.1</version>
+            </plugin>
+            <plugin>
+                <artifactId>maven-enforcer-plugin</artifactId>
+                <version>3.0.0-M2</version>
+            </plugin>
+            <plugin>
+                <artifactId>maven-pmd-plugin</artifactId>
+                <version>3.11.0</version>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-checkstyle-plugin</artifactId>
+                <!--<version>3.0.0</version>-->
+                <version>2.17</version>
+                <dependencies>
+                    <dependency>
+                        <groupId>com.puppycrawl.tools</groupId>
+                        <artifactId>checkstyle</artifactId>
+                        <version>8.18</version>
+                    </dependency>
+                </dependencies>
+            </plugin>
+            <plugin>
+                <groupId>com.github.spotbugs</groupId>
+                <artifactId>spotbugs-maven-plugin</artifactId>
+                <version>3.1.0-RC8</version>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-scm-plugin</artifactId>
+                <version>1.9.5</version>
+                <inherited>false</inherited>
+            </plugin>
+            <plugin>
+                <groupId>com.googlecode.jslint4java</groupId>
+                <artifactId>jslint4java-maven-plugin</artifactId>
+                <executions>
+                    <execution>
+                        <id>jslint</id>
+                        <phase>validate</phase>
+                        <goals>
+                            <goal>lint</goal>
+                        </goals>
+                        <configuration>
+                            <failOnError>true</failOnError>
+                            <outputFolder>${project.basedir}/target</outputFolder>
+                            <sourceFolders>
+                                <sourceFolder>${project.basedir}</sourceFolder>
+                            </sourceFolders>
+                            <includes>
+                                <include>**/*.json</include>
+                            </includes>
+                            <excludes>
+                                <exclude>**/target/**/*.json</exclude>
+                            </excludes>
+                            <options>
+                                <white>true</white>
+                            </options>
+                        </configuration>
+                    </execution>
+                </executions>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-enforcer-plugin</artifactId>
+                <executions>
+                    <execution>
+                        <id>enforce</id>
+                        <goals>
+                            <goal>enforce</goal>
+                        </goals>
+                        <configuration>
+                            <rules>
+                                <requireMavenVersion>
+                                    <version>3.5.2</version>
+                                </requireMavenVersion>
+                                <requireJavaVersion>
+                                    <version>${jdk.version}</version>
+                                </requireJavaVersion>
+                            </rules>
+                        </configuration>
+                    </execution>
+                </executions>
+            </plugin>
+            <plugin>
+                <groupId>com.github.spotbugs</groupId>
+                <artifactId>spotbugs-maven-plugin</artifactId>
+                <dependencies>
+                    <dependency>
+                        <groupId>com.github.spotbugs</groupId>
+                        <artifactId>spotbugs</artifactId>
+                        <version>3.1.12</version>
+                    </dependency>
+                    <dependency>
+                        <groupId>com.github.spotbugs</groupId>
+                        <artifactId>spotbugs-annotations</artifactId>
+                        <version>3.1.12</version>
+                    </dependency>
+                    <dependency>
+                        <groupId>org.dom4j</groupId>
+                        <artifactId>dom4j</artifactId>
+                        <version>2.1.1</version>
+                    </dependency>
+                </dependencies>
+                <!-- https://spotbugs.github.io/
+                    When running spotbugs on a project, the default heap size might not be enough
+                    to complete the build. For now there is no way to fork spotbugs and run with
+                    its own memory requirements, but the following system variable will allow
+                    you to do so for Maven: export MAVEN_OPTS=-Xmx2048M -->
+                <configuration>
+                    <fork>true</fork>
+                    <maxHeap>2048</maxHeap>
+                    <!-- Fail build in case of spotbugs errors during build. -->
+                    <failOnError>true</failOnError>
+                    <!-- Level of analysis effort. -->
+                    <effort>low</effort>
+                    <includeTests>false</includeTests>
+                    <includeFilterFile>${main.basedir}/spotbugs-include.xml</includeFilterFile>
+                    <excludeFilterFile>${main.basedir}/spotbugs-exclude.xml</excludeFilterFile>
+                    <threshold>medium</threshold>
+                    <!-- No XML output from Findgbugs. -->
+                    <xmlOutput>false</xmlOutput>
+                    <spotbugsXmlOutput>false</spotbugsXmlOutput>
+                </configuration>
+                <executions>
+                    <!-- Ensures that Spotbugs inspects source code when
+                        project is compiled. -->
+                    <execution>
+                        <id>check-compile</id>
+                        <phase>verify</phase>
+                        <goals>
+                            <goal>check</goal>
+                        </goals>
+                    </execution>
+                </executions>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-pmd-plugin</artifactId>
+                <configuration>
+                    <skip>false</skip>
+                    <failOnViolation>true</failOnViolation>
+                    <failurePriority>1</failurePriority>
+                    <rulesets>
+                        <ruleset>${main.basedir}/pmd-ruleset.xml</ruleset>
+                    </rulesets>
+                    <excludeFromFailureFile>${main.basedir}/exclude-pmd.properties</excludeFromFailureFile>
+                    <linkXRef>false</linkXRef>
+                    <verbose>true</verbose>
+                    <printFailingErrors>true</printFailingErrors>
+                </configuration>
+                <executions>
+                    <execution>
+                        <id>pmd</id>
+                        <goals>
+                            <goal>check</goal>
+                        </goals>
+                    </execution>
+                </executions>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-surefire-plugin</artifactId>
+                <version>${maven-surefire-plugin.version}</version>
+                <configuration>
+                    <forkMode>once</forkMode>
+                    <!-- do not change the library.path - lafa -->
+                    <!-- JDK9 and above doesn't allow to attach to self,
+                        our UT connects to self and tests, using jdk.attach.allowAttachSelf allows to do that -->
+                    <argLine>-Dfile.encoding=ANSI_X3.4-1968
+                        -Djava.library.path=
+                        -Djdk.attach.allowAttachSelf=true
+                    </argLine>
+                    <excludedGroups>notIsolate,EventListenersRegression</excludedGroups>
+                    <!-- DO NOT TOUCH: SETTINGS BELOW ALLOW THE CONFIG LOADER
+                        TO FIND CONFIG TEST RESOURCES :- LAFA -->
+                    <useSystemClassLoader>true</useSystemClassLoader>
+                    <useManifestOnlyJar>false</useManifestOnlyJar>
+                </configuration>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-checkstyle-plugin</artifactId>
+                <executions>
+                    <execution>
+                        <id>checkstyle</id>
+                        <phase>validate</phase>
+                        <configuration>
+                            <configLocation>ampvalidator_checkstyle.xml</configLocation>
+                            <violationSeverity>warning</violationSeverity>
+                            <logViolationsToConsole>true</logViolationsToConsole>
+                            <failsOnError>true</failsOnError>
+                            <includeTestSourceDirectory>true</includeTestSourceDirectory>
+                            <propertyExpansion>config_loc=${main.basedir}</propertyExpansion>
+                            <suppressionsLocation>ampvalidator_checkstyle_suppressions.xml</suppressionsLocation>
+                            <suppressionsFileExpression>checkstyle.suppressions.file</suppressionsFileExpression>
+                        </configuration>
+                        <goals>
+                            <goal>check</goal>
+                        </goals>
+                    </execution>
+                </executions>
+            </plugin>
+            <plugin>
+                <groupId>org.jacoco</groupId>
+                <artifactId>jacoco-maven-plugin</artifactId>
+                <configuration>
+                    <includes>
+                        <include>**/amp/validator/**</include>
+                    </includes>
+                    <excludes>
+                        <exclude>**/org/ocpsoft/prettytime/shade/com/joestelmach/natty/generated/**</exclude>
+                    </excludes>
+                </configuration>
+                <executions>
+                    <execution>
+                        <id>jacoco-initialize</id>
+                        <phase>initialize</phase>
+                        <goals>
+                            <goal>prepare-agent</goal>
+                        </goals>
+                        <configuration>
+                            <destFile>${basedir}/target/jacoco.exec</destFile>
+                        </configuration>
+                    </execution>
+                    <execution>
+                        <id>jacoco-site</id>
+                        <phase>package</phase>
+                        <goals>
+                            <goal>report</goal>
+                        </goals>
+                        <configuration>
+                            <dataFile>${basedir}/target/jacoco.exec</dataFile>
+                            <outputDirectory>${basedir}/target/jacoco</outputDirectory>
+                        </configuration>
+                    </execution>
+                </executions>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-compiler-plugin</artifactId>
+                <version>3.8.0</version>
+                <configuration>
+                    <fork>true</fork>
+                    <meminitial>128m</meminitial>
+                    <maxmem>512m</maxmem>
+                    <source>${jdk.version}</source>
+                    <target>${jdk.version}</target>
+                    <showDeprecation>true</showDeprecation>
+                    <showWarnings>true</showWarnings>
+                    <optimize>true</optimize>
+                    <encoding>UTF-8</encoding>
+                </configuration>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-source-plugin</artifactId>
+                <version>${maven-source-plugin.version}</version>
+                <executions>
+                    <execution>
+                        <id>attach-sources</id>
+                        <goals>
+                            <goal>jar-no-fork</goal>
+                        </goals>
+                    </execution>
+                </executions>
+            </plugin>
+        </plugins>
+    </build>
+
+    <dependencies>
+        <dependency>
+            <groupId>org.json</groupId>
+            <artifactId>json</artifactId>
+            <version>20190722</version>
+        </dependency>
+        <dependency>
+            <groupId>net.sourceforge.cssparser</groupId>
+            <artifactId>cssparser</artifactId>
+            <version>0.9.27</version>
+        </dependency>
+        <dependency>
+            <groupId>com.puppycrawl.tools</groupId>
+            <artifactId>checkstyle</artifactId>
+            <version>8.18</version>
+        </dependency>
+        <dependency>
+            <groupId>org.testng</groupId>
+            <artifactId>testng</artifactId>
+            <version>6.8</version>
+            <scope>test</scope>
+        </dependency>
+        <dependency>
+            <groupId>ch.qos.logback</groupId>
+            <artifactId>logback-classic</artifactId>
+            <version>1.2.3</version>
+        </dependency>
+        <dependency>
+            <groupId>org.slf4j</groupId>
+            <artifactId>slf4j-api</artifactId>
+            <version>1.7.25</version>
+        </dependency>
+        <dependency>
+            <groupId>junit</groupId>
+            <artifactId>junit</artifactId>
+            <version>3.8.1</version>
+            <scope>test</scope>
+        </dependency>
+        <dependency>
+            <groupId>com.google.protobuf</groupId>
+            <artifactId>protobuf-java</artifactId>
+            <version>${protobuf.version}</version>
+        </dependency>
+        <dependency>
+            <groupId>com.yahoo.tagchowder</groupId>
+            <artifactId>tagchowder.core</artifactId>
+            <version>2.0.10</version>
+        </dependency>
+        <dependency>
+            <groupId>com.google.code.findbugs</groupId>
+            <artifactId>jsr305</artifactId>
+            <version>3.0.2</version>
+        </dependency>
+        <dependency>
+            <groupId>org.apache.commons</groupId>
+            <artifactId>commons-lang3</artifactId>
+            <version>3.9</version>
+        </dependency>
+        <dependency>
+            <groupId>org.apache.commons</groupId>
+            <artifactId>commons-text</artifactId>
+            <version>1.8</version>
+        </dependency>
+        <dependency>
+            <groupId>org.mockito</groupId>
+            <artifactId>mockito-all</artifactId>
+            <version>${mockito.version}</version>
+            <scope>test</scope>
+        </dependency>
+    </dependencies>
+</project>
\ No newline at end of file
diff --git a/validator/java/spotbugs-exclude.xml b/validator/java/spotbugs-exclude.xml
new file mode 100644
index 0000000000000..cbfec69374f3c
--- /dev/null
+++ b/validator/java/spotbugs-exclude.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<FindBugsFilter>
+
+</FindBugsFilter>
\ No newline at end of file
diff --git a/validator/java/spotbugs-include.xml b/validator/java/spotbugs-include.xml
new file mode 100644
index 0000000000000..1db0579bd3a0b
--- /dev/null
+++ b/validator/java/spotbugs-include.xml
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<FindBugsFilter>
+    <Match>
+        <Bug pattern="
+                      RCN_REDUNDANT_NULLCHECK_OF_NONNULL_VALUE,
+                      RCN_REDUNDANT_NULLCHECK_WOULD_HAVE_BEEN_A_NPE,
+                      NP_NONNULL_PARAM_VIOLATION,
+                      NP_PARAMETER_MUST_BE_NONNULL_BUT_MARKED_AS_NULLABLE,
+                      NP_CLOSING_NULL,
+                      NP_NONNULL_FIELD_NOT_INITIALIZED_IN_CONSTRUCTOR,
+
+                      ODR_OPEN_DATABASE_RESOURCE,
+                      ODR_OPEN_DATABASE_RESOURCE_EXCEPTION_PATH,
+                      OS_OPEN_STREAM,
+                      OS_OPEN_STREAM_EXCEPTION_PATH,
+                      OBL_UNSATISFIED_OBLIGATION,
+                      OBL_UNSATISFIED_OBLIGATION_EXCEPTION_EDGE,
+                      ES_COMPARING_PARAMETER_STRING_WITH_EQ,
+                      ES_COMPARING_STRINGS_WITH_EQ,
+                      ISC_INSTANTIATE_STATIC_CLASS"/>
+    </Match>
+</FindBugsFilter>
\ No newline at end of file
diff --git a/validator/java/src/main/bin/copyValidatorJavaSource.sh b/validator/java/src/main/bin/copyValidatorJavaSource.sh
new file mode 100755
index 0000000000000..1f6f205ff7fd5
--- /dev/null
+++ b/validator/java/src/main/bin/copyValidatorJavaSource.sh
@@ -0,0 +1,21 @@
+#!/bin/bash
+
+#
+# This script copies Validator.java from bazel-bin directory.
+#
+
+# Fall back to bazel build working directory if not using Maven
+BASE_DIR=$1
+if [ -z "$BASE_DIR" ]
+then
+      BASE_DIR=$BUILD_WORKING_DIRECTORY
+fi
+
+BAZEL_BIN_DIR=$BASE_DIR/bazel-bin
+AMP_VALIDATOR_GENERATED_DIR=$BASE_DIR/"src/main/java/dev/amp/validator"
+
+cd $BAZEL_BIN_DIR
+jar xvf amphtml_validator_proto_lib-speed-src.jar
+
+echo "Copying Validator.java from ${BAZEL_BIN_DIR}/amp/validator"
+cp $BAZEL_BIN_DIR/dev/amp/validator/ValidatorProtos.java $AMP_VALIDATOR_GENERATED_DIR/.
diff --git a/validator/java/src/main/bin/fetchAMPResources.sh b/validator/java/src/main/bin/fetchAMPResources.sh
new file mode 100755
index 0000000000000..d6c1b49368710
--- /dev/null
+++ b/validator/java/src/main/bin/fetchAMPResources.sh
@@ -0,0 +1,43 @@
+#!/bin/bash
+
+#
+# This is a pre hook script which executes before compiling the codes.
+#
+# Concatenate all protoascii files into a single file, validator-all.protoascii,
+# under /src/main/resources directory.
+#
+
+# Fall back to bazel build working directory if not using Maven
+BASE_DIR=$1
+if [ -z "$BASE_DIR" ]
+then
+      BASE_DIR=$BUILD_WORKING_DIRECTORY
+fi
+
+AMP_VALIDATOR_PROTOASCII="validator-all.protoascii"
+AMP_VALIDATOR_PROTO="validator.proto"
+AMP_VALIDATOR_PROTO_DIR=$BASE_DIR/"src/main/proto"
+AMP_RESOURCES_DIR=$BASE_DIR/"src/main/resources"
+AMP_VALIDATOR_GENERATED_DIR=$BASE_DIR/"src/main/java/amp/validator"
+
+if [[ -f "$AMP_VALIDATOR_PROTO_DIR/$AMP_VALIDATOR_PROTO" && -f "$AMP_RESOURCES_DIR/$AMP_VALIDATOR_PROTOASCII" ]]; then
+    echo "Both $AMP_VALIDATOR_PROTO && $AMP_VALIDATOR_PROTOASCII exists";
+else
+    # Creating proto & resources directories.
+    mkdir -p ${AMP_VALIDATOR_GENERATED_DIR}
+    mkdir -p ${AMP_VALIDATOR_PROTO_DIR}
+    mkdir -p ${AMP_RESOURCES_DIR}
+
+    pushd $BASE_DIR
+
+    echo "Append validator main proto asci files"
+    cat ../validator-main.protoascii >> ${AMP_RESOURCES_DIR}/${AMP_VALIDATOR_PROTOASCII};
+
+    echo "Concatenate all extension proto asci files"
+    for i in `find ../../extensions -name "*.protoascii"`; do
+        echo $i;
+        cat $i >> ${AMP_RESOURCES_DIR}/${AMP_VALIDATOR_PROTOASCII};
+    done
+
+    popd
+fi
diff --git a/validator/java/src/main/java/com/steadystate/css/parser/ListableTokenManager.java b/validator/java/src/main/java/com/steadystate/css/parser/ListableTokenManager.java
new file mode 100644
index 0000000000000..5e18df5338cc9
--- /dev/null
+++ b/validator/java/src/main/java/com/steadystate/css/parser/ListableTokenManager.java
@@ -0,0 +1,100 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package com.steadystate.css.parser;
+
+import dev.amp.validator.css.CssTokenUtil;
+import dev.amp.validator.css.TokenType;
+
+import java.util.LinkedList;
+import java.util.List;
+
+/**
+ * A class to extend the default css parser's manager in order to override the next
+ * token method to populate a list of tokens.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ListableTokenManager extends SACParserCSS3TokenManager {
+    /**
+     * Constructor to initialize the list of tokens.
+     * @param stream a stream of css text to parse into tokens
+     */
+    public ListableTokenManager(final CharStream stream) {
+        super(stream);
+        parsedTokens  = new LinkedList<>();
+    }
+
+    /**
+     * Store the token in a list of tokens.
+     * @return the next token in the css text
+     */
+    @Override
+    public Token getNextToken() {
+        Token t = super.getNextToken();
+        parsedTokens.add(t);
+
+        return t;
+    }
+
+    /**
+     * Compress the tail tokens with the input token to produce a single token,
+     * by stepping backwards WHITESPACE tokens until an IDENT token is detected.
+     */
+    public void compressEnd() {
+        StringBuilder image = new StringBuilder();
+        image.insert(0, parsedTokens.get(parsedTokens.size() - 1).image);
+        parsedTokens.pollLast();
+
+        while (parsedTokens.getLast() != null) {
+            if (CssTokenUtil.getTokenType(parsedTokens.getLast()) == TokenType.WHITESPACE) {
+                image.insert(0, parsedTokens.getLast().image);
+                parsedTokens.pollLast();
+            } else if (CssTokenUtil.getTokenType(parsedTokens.getLast()) == TokenType.IDENT) {
+                image.insert(0, parsedTokens.getLast().image);
+                parsedTokens.getLast().image = image.toString();
+                parsedTokens.getLast().kind = SACParserCSS3Constants.FUNCTION;
+                break;
+            }
+        }
+    }
+
+    /**
+     * accessor for current lex state, which informs whether the parser is within a comment
+     * @return value of 1 for comment and 0 for css cdata
+     */
+    public int getCurLexState() {
+        return this.curLexState;
+    }
+
+    /**
+     * Getter for the list of tokens.
+     * @return the underlying tokens
+     */
+    public List<Token> getParsedTokens() {
+        return parsedTokens;
+    }
+
+    /** The parsed tokens. */
+    private LinkedList<Token> parsedTokens;
+}
diff --git a/validator/java/src/main/java/com/steadystate/css/parser/package-info.java b/validator/java/src/main/java/com/steadystate/css/parser/package-info.java
new file mode 100644
index 0000000000000..47685ed290424
--- /dev/null
+++ b/validator/java/src/main/java/com/steadystate/css/parser/package-info.java
@@ -0,0 +1,25 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+/**
+ * AMP validator.
+ */
+package com.steadystate.css.parser;
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/AMPHtmlHandler.java b/validator/java/src/main/java/dev/amp/validator/AMPHtmlHandler.java
new file mode 100644
index 0000000000000..ca07a81b3bf10
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/AMPHtmlHandler.java
@@ -0,0 +1,402 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.exception.ExitOnFirstErrorException;
+import dev.amp.validator.exception.MaxParseNodesException;
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.exception.ValidatorException;
+import dev.amp.validator.utils.ByteUtils;
+import dev.amp.validator.utils.TagSpecUtils;
+import org.json.JSONObject;
+import org.json.JSONException;
+
+import org.xml.sax.Attributes;
+import org.xml.sax.Locator;
+import org.xml.sax.SAXException;
+import org.xml.sax.helpers.DefaultHandler;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * Validation handler which accepts callbacks from HTML parser.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class AMPHtmlHandler extends DefaultHandler {
+    /**
+     * Creates an AMPHtmlHandler.
+     *
+     * @param validatorManager the validator manager instance.
+     * @param htmlFormat       HtmlFormat code.
+     * @param condition        exit condition.
+     * @param maxNodesAllowed  max nodes allowed.
+     */
+    public AMPHtmlHandler(@Nonnull final AMPValidatorManager validatorManager,
+                          @Nonnull final ValidatorProtos.HtmlFormat.Code htmlFormat, @Nonnull final ExitCondition condition,
+                          final int maxNodesAllowed) {
+        this.validatorManager = validatorManager;
+        this.exitCondition = condition;
+        this.maxNodesAllowed = maxNodesAllowed;
+        this.htmlFormat = htmlFormat;
+        this.validationResult = ValidatorProtos.ValidationResult.newBuilder();
+        context = new Context(new ParsedValidatorRules(htmlFormat, validatorManager));
+    }
+
+    /**
+     * Processing the beginning of the document.
+     *
+     * @exception SAXException Any SAX exception.
+     */
+    @Override
+    public void startDocument() throws SAXException {
+        validationResult.setStatus(ValidatorProtos.ValidationResult.Status.UNKNOWN);
+    }
+
+    /**
+     * Processing the end of the document.
+     *
+     * @exception SAXException Any SAX exception.
+     */
+    @Override
+    public void endDocument() throws SAXException {
+        try {
+            context.getRules().maybeEmitGlobalTagValidationErrors(context, validationResult);
+            if (validationResult.getStatus() == ValidatorProtos.ValidationResult.Status.UNKNOWN) {
+                validationResult.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+            }
+            if (validationResult.getErrorsCount() > 0) {
+                validationResult.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+            }
+        } catch (TagValidationException tve) {
+            /** ignore */
+        }
+    }
+
+    /**
+     * Processing the start of an element.
+     *
+     * @param uri The Namespace URI, or the empty string if the
+     *        element has no Namespace URI or if Namespace
+     *        processing is not being performed.
+     * @param localName The local name (without prefix), or the
+     *        empty string if Namespace processing is not being
+     *        performed.
+     * @param qName The qualified name (with prefix), or the
+     *        empty string if qualified names are not available.
+     * @param attributes The attributes attached to the element.  If
+     *        there are no attributes, it shall be an empty
+     *        Attributes object.
+     * @exception SAXException Any SAX exception
+     */
+    @Override
+    public void startElement(final String uri, final String localName,
+                             final String qName, final Attributes attributes) throws SAXException {
+        if (this.maxNodesAllowed > 0 && this.totalNodes > this.maxNodesAllowed) {
+            throw new MaxParseNodesException();
+        }
+
+        this.totalNodes++;
+
+        this.encounteredTag = new ParsedHtmlTag(localName, attributes);
+        if (encounteredTag.upperName().equals("HTML")) {
+            this.context.getRules().validateHtmlTag(
+                    encounteredTag, this.context, this.validationResult);
+        }
+
+        // TODO: discuss how to handle this warning (Attributes class dedupes)
+        final String maybeDuplicateAttrName = encounteredTag.hasDuplicateAttrs();
+        if (maybeDuplicateAttrName != null) {
+            final List<String> params = new ArrayList<>();
+            params.add(encounteredTag.lowerName());
+            params.add(maybeDuplicateAttrName);
+            this.context.addWarning(
+                    ValidatorProtos.ValidationError.Code.DUPLICATE_ATTRIBUTE,
+                    this.context.getLineCol(),
+                    params,
+                    /* specUrl */ "",
+                    this.validationResult);
+            //TODO - tagchowder doesn't seem to maintain duplicate attributes.
+            //encounteredTag.dedupeAttrs();
+        }
+
+        if (encounteredTag.upperName().equals("BODY")) {
+            this.emitMissingExtensionErrors();
+        }
+
+        Map<String, String> attrsByKey = encounteredTag.attrsByKey();
+        String styleAttr = attrsByKey.get("style");
+        if (styleAttr != null) {
+            int styleLen = ByteUtils.byteLength(styleAttr);
+            this.context.addInlineStyleByteSize(styleLen);
+            for (ValidatorProtos.CssLengthSpec cssLengthSpec : this.context.getRules().getCssLengthSpec()) {
+                if (cssLengthSpec.getMaxBytesPerInlineStyle() != -1
+                        && styleLen > cssLengthSpec.getMaxBytesPerInlineStyle()) {
+
+                    List<String> params = new ArrayList<>();
+                    params.add(encounteredTag.lowerName());
+                    params.add(Integer.toString(styleLen));
+                    params.add(Integer.toString(cssLengthSpec.getMaxBytesPerInlineStyle()));
+
+                    this.context.addError(
+                            ValidatorProtos.ValidationError.Code.INLINE_STYLE_TOO_LONG,
+                            this.context.getLineCol(), params,
+                            cssLengthSpec.getSpecUrl(), this.validationResult);
+                    //TODO - tagchowder doesn't seem to maintain duplicate attributes.
+                    //encounteredTag.dedupeAttrs();
+                }
+            }
+        }
+
+        try {
+            ValidateTagResult resultForReferencePoint =
+                    new ValidateTagResult(ValidatorProtos.ValidationResult.newBuilder(), null);
+            resultForReferencePoint.getValidationResult().setStatus(ValidatorProtos.ValidationResult.Status.UNKNOWN);
+
+            final ReferencePointMatcher referencePointMatcher = context.getTagStack().parentReferencePointMatcher();
+            if (referencePointMatcher != null) {
+                resultForReferencePoint = referencePointMatcher.validateTag(encounteredTag, context);
+            }
+
+            final ValidateTagResult resultForTag =
+                    TagSpecUtils.validateTag(context, encounteredTag, resultForReferencePoint.getBestMatchTagSpec());
+            if (referencePointMatcher != null
+                    && (resultForTag.getValidationResult().getStatus() == ValidatorProtos.ValidationResult.Status.PASS)) {
+                this.validationResult.mergeFrom(resultForReferencePoint.getValidationResult().build());
+            }
+
+            checkForReferencePointCollision(
+                    resultForReferencePoint.getBestMatchTagSpec(),
+                    resultForTag.getBestMatchTagSpec(),
+                    resultForTag.getValidationResult());
+
+            this.validationResult.mergeFrom(resultForTag.getValidationResult().build());
+            this.context.updateFromTagResults(encounteredTag, resultForReferencePoint, resultForTag);
+
+            if (this.validationResult.getErrorsCount() > 0
+                    && exitCondition == ExitCondition.EXIT_ON_FIRST_ERROR) {
+                throw new ExitOnFirstErrorException();
+            }
+        } catch (TagValidationException | ValidatorException | IOException | CssValidationException ex) {
+            /** ignore */
+        }
+    }
+
+    /**
+     * Processing the end of an element.
+     *
+     * @param uri The Namespace URI, or the empty string if the
+     *        element has no Namespace URI or if Namespace
+     *        processing is not being performed.
+     * @param localName The local name (without prefix), or the
+     *        empty string if Namespace processing is not being performed.
+     * @param qName The qualified name (with prefix), or the
+     *        empty string if qualified names are not available.
+     */
+    @Override
+    public void endElement(final String uri, final String localName, final String qName) {
+        if (encounteredTag != null) {
+            try {
+                if (charactersBuilder != null) {
+                    cdata(charactersBuilder.toString());
+                } else {
+                    cdata("");
+                }
+            } catch (TagValidationException | CssValidationException | IOException e) {
+                /** ignore */
+            }
+            encounteredTag.cleanup();
+        }
+        try {
+            this.context.getTagStack().exitTag(this.context, this.validationResult);
+        } catch (TagValidationException tve) {
+            /** ignore */
+        }
+
+        charactersBuilder = null;
+        encounteredTag = null;
+    }
+
+    /**
+     * Receive a Locator object for document events.
+     *
+     * @param locator A locator for all SAX document events.
+     */
+    @Override
+    public void setDocumentLocator(@Nonnull final Locator locator) {
+        this.context.setLineCol(locator);
+    }
+
+    /**
+     * Returns the validation result.
+     *
+     * @return returns the validation result.
+     */
+    public ValidatorProtos.ValidationResult.Builder validationResult() {
+        return validationResult;
+    }
+
+    /**
+     * While parsing the document HEAD, we may accumulate errors which depend
+     * on seeing later extension script tags.
+     */
+    public void emitMissingExtensionErrors() {
+        final ExtensionsContext extensionsCtx = this.context.getExtensions();
+        for (ValidatorProtos.ValidationError error : extensionsCtx.missingExtensionErrors()) {
+            this.context.addBuiltError(error, this.validationResult);
+        }
+    }
+
+    /**
+     * Considering that reference points could be defined by both reference
+     * points and regular tag specs, check that we don't have matchers assigned
+     * from both, there can be only one.
+     *
+     * @param refPointSpec a reference point parsed tag spec.
+     * @param tagSpec a parsed tag spec.
+     * @param validationResult a ValidationResult.
+     */
+    private void checkForReferencePointCollision(
+            final ParsedTagSpec refPointSpec, final ParsedTagSpec tagSpec,
+            @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        if (refPointSpec == null || !refPointSpec.hasReferencePoints()) {
+            return;
+        }
+
+        if (tagSpec == null || !tagSpec.hasReferencePoints()) {
+            return;
+        }
+
+        final List<String> params = new ArrayList<>();
+        params.add(TagSpecUtils.getTagSpecName(tagSpec.getSpec()));
+        params.add(refPointSpec.getReferencePoints().parentTagSpecName());
+        context.addError(
+                ValidatorProtos.ValidationError.Code.TAG_REFERENCE_POINT_CONFLICT,
+                context.getLineCol(),
+                params,
+                refPointSpec.getReferencePoints().parentSpecUrl(),
+                validationResult);
+    }
+
+    /**
+     * Callback for cdata.
+     *
+     * @param text the css content to validate
+     * @throws TagValidationException tag validation exception.
+     * @throws CssValidationException css validation exception.
+     * @throws IOException IO exception.
+     */
+    public void cdata(@Nonnull final String text) throws TagValidationException, CssValidationException, IOException {
+        // Validate that JSON can be parsed.
+        if (this.context.getTagStack().isScriptTypeJsonChild()) {
+            try {
+                new JSONObject(text);
+            } catch (JSONException e) {
+                List<String> params = new ArrayList<>();
+                this.context.addWarning(
+                        ValidatorProtos.ValidationError.Code.INVALID_JSON_CDATA,
+                        this.context.getLineCol(),
+                        params, "",
+                        this.validationResult);
+            }
+        }
+        final CdataMatcher matcher = this.context.getTagStack().cdataMatcher();
+        if (matcher != null) {
+            matcher.match(text, this.context, this.validationResult);
+        }
+    }
+
+    /**
+     * Processing character data inside an element.
+     *
+     * @param ch The characters.
+     * @param start The start position in the character array.
+     * @param length The number of characters to use from the character array.
+     */
+    @Override
+    public void characters(final char[] ch, final int start, final int length) {
+        if (this.encounteredTag != null) {
+            if (charactersBuilder == null) {
+                this.charactersBuilder = new StringBuilder();
+            }
+            charactersBuilder.append(new String(ch, start, length));
+        }
+    }
+
+    /**
+     * AMPValidatorManager object.
+     */
+    @Nonnull
+    private final AMPValidatorManager validatorManager;
+
+    /**
+     * ExitCondition object.
+     */
+    @Nonnull
+    private final ExitCondition exitCondition;
+
+    /**
+     * Max nodes.
+     */
+    private int maxNodesAllowed;
+
+    /**
+     * Total nodes.
+     */
+    private int totalNodes;
+
+    /**
+     * ValidationResult object.
+     */
+    @Nonnull
+    private ValidatorProtos.ValidationResult.Builder validationResult;
+
+    /**
+     * HtmlFormat used to validate against.
+     */
+    @Nonnull
+    private final ValidatorProtos.HtmlFormat.Code htmlFormat;
+
+    /**
+     * Context object capturing session variables of the current validation.
+     */
+    @Nonnull
+    private final Context context;
+
+    /**
+     * Encountered tag.
+     */
+    private ParsedHtmlTag encounteredTag;
+
+    /**
+     * Characters can be called multiple times per tag.
+     */
+    private StringBuilder charactersBuilder;
+}
+
diff --git a/validator/java/src/main/java/dev/amp/validator/AMPValidatorLoader.java b/validator/java/src/main/java/dev/amp/validator/AMPValidatorLoader.java
new file mode 100644
index 0000000000000..c99de6a7ef0e7
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/AMPValidatorLoader.java
@@ -0,0 +1,107 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import com.google.protobuf.TextFormat;
+
+import javax.annotation.Nonnull;
+import java.io.BufferedReader;
+import java.io.IOException;
+import java.io.InputStream;
+import java.io.InputStreamReader;
+import java.net.URISyntaxException;
+
+/**
+ * This class load the validator main and extension proto ascii files.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class AMPValidatorLoader {
+    /**
+     * Loading the rules.
+     *
+     * @param filePath  file path.
+     * @throws IOException if I/O errors occur.
+     * @throws  URISyntaxException if this URL is not formatted strictly
+     * according to to RFC2396 and cannot be converted to a URI.
+     * @return a Builder instance
+     */
+    public ValidatorProtos.ValidatorRules.Builder load(final String filePath) throws IOException, URISyntaxException {
+        final InputStream is;
+
+        final ClassLoader classLoader = getClass().getClassLoader();
+        if (filePath == null) {
+            is = classLoader.getResourceAsStream(PROTO_ASCII_RESOURCE);
+            if (is == null) {
+                throw new IllegalArgumentException(PROTO_ASCII_RESOURCE + " file is not found!");
+            }
+        } else {
+            is = classLoader.getResourceAsStream(filePath);
+        }
+
+        final ValidatorProtos.ValidatorRules.Builder builder;
+        try {
+            final StringBuilder protoAsciiRules = new StringBuilder();
+            protoAsciiRules.append(getFileContent(is));
+
+            final TextFormat.Parser parser = TextFormat.Parser.newBuilder()
+                    .setAllowUnknownFields(true)
+                    .setAllowUnknownExtensions(true)
+                    .build();
+            builder = ValidatorProtos.ValidatorRules.newBuilder();
+            parser.merge(protoAsciiRules.toString(), builder);
+        } finally {
+            if (is != null) {
+                is.close();
+            }
+        }
+
+        return builder;
+    }
+
+    /**
+     * Reading file as a string.
+     *
+     * @param is input stream.
+     * @return the content of the file in string
+     * @throws Exception throws Exception.
+     */
+    private String getFileContent(@Nonnull final InputStream is) throws IOException {
+        final StringBuilder sb = new StringBuilder();
+        try (BufferedReader buf = new BufferedReader(new InputStreamReader(is))) {
+            String line = buf.readLine();
+            while (line != null) {
+                sb.append(line).append("\n");
+                line = buf.readLine();
+            }
+        }
+
+        return sb.toString();
+    }
+
+    /**
+     * Proto ascii resources.
+     */
+    private static final String PROTO_ASCII_RESOURCE = "validator-all.protoascii";
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/AMPValidatorManager.java b/validator/java/src/main/java/dev/amp/validator/AMPValidatorManager.java
new file mode 100644
index 0000000000000..007c104360d3d
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/AMPValidatorManager.java
@@ -0,0 +1,296 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.utils.DispatchKeyUtils;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.net.URISyntaxException;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * This class manages the rules.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class AMPValidatorManager {
+    /**
+     * Constructor of AMP validator manager class.
+     */
+    public AMPValidatorManager() {
+    }
+
+    /**
+     * Loading AMP validator main and extensions rules.
+     *
+     * @throws IOException if I/O errors occur.
+     * @throws  URISyntaxException if this URL is not formatted strictly
+     * according to to RFC2396 and cannot be converted to a URI.
+     */
+    public void loadRule() throws IOException, URISyntaxException {
+        loadRule(null);
+    }
+
+    /**
+     * Loading AMP validator main and extensions rules.
+     *
+     * @param filePath file path.
+     * @throws IOException if I/O errors occur.
+     * @throws  URISyntaxException if this URL is not formatted strictly
+     * according to to RFC2396 and cannot be converted to a URI.
+     */
+    public void loadRule(final String filePath) throws IOException, URISyntaxException {
+        final AMPValidatorLoader ampValidatorLoader = new AMPValidatorLoader();
+
+        this.builder = ampValidatorLoader.load(filePath);
+        this.combinedBlacklistedCdataRegexMap = new HashMap<>();
+
+        final List<ValidatorProtos.TagSpec> tagSpecs = builder.getTagsList();
+
+        int tagSpecId = 0;
+        for (ValidatorProtos.TagSpec tagSpec : tagSpecs) {
+            final List<ValidatorProtos.HtmlFormat.Code> htmlFormats = tagSpec.getHtmlFormatList();
+            for (final ValidatorProtos.HtmlFormat.Code htmlFormat : htmlFormats) {
+                Map<String, List<ValidatorProtos.TagSpec>> tagSpecMap = tagSpecMapByHtmlFormat.get(htmlFormat);
+                if (tagSpecMap == null) {
+                    tagSpecMap = new HashMap<>();
+                    tagSpecMap.put(tagSpec.getTagName(), new ArrayList<>());
+                    tagSpecMapByHtmlFormat.put(htmlFormat, tagSpecMap);
+                }
+                List<ValidatorProtos.TagSpec> tagSpecList = tagSpecMap.get(tagSpec.getTagName());
+                if (tagSpecList == null) {
+                    tagSpecList = new ArrayList<>();
+                }
+                tagSpecList.add(tagSpec);
+                tagSpecMap.put(tagSpec.getTagName(), tagSpecList);
+            }
+
+            String dispatchKey = DispatchKeyUtils.getDispatchKeyForTagSpecOrNone(tagSpec);
+            if (dispatchKey != null) {
+                dispatchKeyByTagSpecId.put(tagSpecId, dispatchKey);
+            }
+
+            final List<ValidatorProtos.BlackListedCDataRegex> blackListedCDataRegexList =
+                    tagSpec.getCdata().getBlacklistedCdataRegexList();
+            if (blackListedCDataRegexList != null) {
+                final List<String> combined = new ArrayList<>();
+                for (final ValidatorProtos.BlackListedCDataRegex blackListedCDataRegex : blackListedCDataRegexList) {
+                    combined.add(blackListedCDataRegex.getRegex());
+                }
+
+                if (!combined.isEmpty()) {
+                    final String combinedBlacklistedCdataRegex = String.join("|", combined);
+                    this.combinedBlacklistedCdataRegexMap.put(String.valueOf(tagSpecId), combinedBlacklistedCdataRegex);
+                }
+            }
+
+            tagSpecId++;
+        }
+
+
+
+        /** Populating the lookup for attribute list by name. */
+        List<ValidatorProtos.AttrList> attrListsList = builder.getAttrListsList();
+        for (ValidatorProtos.AttrList attrList : attrListsList) {
+            attrListMap.put(attrList.getName(), attrList);
+        }
+    }
+
+    /**
+     * Return true if tag spec name exists.
+     * @param htmlFormat the HtmlFormat.
+     * @param name tag spec name.
+     * @return returns true if tag spec name exists.
+     */
+    public boolean hasTagSpec(@Nonnull final ValidatorProtos.HtmlFormat.Code htmlFormat, @Nonnull final String name) {
+        Map<String, List<ValidatorProtos.TagSpec>> tagSpecMap = tagSpecMapByHtmlFormat.get(htmlFormat);
+        return tagSpecMap != null ? tagSpecMap.containsKey(name) : false;
+    }
+
+    /**
+     * Return a list of TagSpec given a tag name.
+     * @param htmlFormat the HtmlFormat.
+     * @param name tag spec name.
+     * @return returns a list of TagSpect given a tag name.
+     */
+    public List<ValidatorProtos.TagSpec> getTagSpec(@Nonnull final ValidatorProtos.HtmlFormat.Code htmlFormat, @Nonnull final String name) {
+         Map<String, List<ValidatorProtos.TagSpec>> tagSpecMap = tagSpecMapByHtmlFormat.get(htmlFormat);
+         return tagSpecMap != null ? tagSpecMap.get(name) : null;
+    }
+
+    /**
+     * Return a list of AttrList given an attribute list name.
+     * @param name attribute list name.
+     * @return returns a list of AttrList given an attribute spec name.
+     */
+    public ValidatorProtos.AttrList getAttrList(@Nonnull final String name) {
+        return attrListMap.get(name);
+    }
+
+    /**
+     * Return a list of TagSpec given a tag name.
+     * @param htmlFormat the HtmlFormat.
+     * @param tagName a tag name.
+     * @return returns a list of TagSpec given a tag name.
+     */
+    public List<ValidatorProtos.TagSpec> getListTagSpecByName(@Nonnull final ValidatorProtos.HtmlFormat.Code htmlFormat,
+                                                        @Nonnull final String tagName) {
+        Map<String, List<ValidatorProtos.TagSpec>> tagMap = tagSpecMapByHtmlFormat.get(htmlFormat);
+        return (tagMap != null ? tagMap.get(tagName) : null);
+    }
+
+    /**
+     * Returns the validation rules.
+     *
+     * @return returns the validation rules.
+     */
+    public ValidatorProtos.ValidatorRules.Builder getRules() {
+        return this.builder;
+    }
+
+    /**
+     * Returns the $GLOBAL_ATTRS attr spec list.
+     * @return returns the $GLOBAL_ATTRS attr spec list.
+     */
+    public List<ValidatorProtos.AttrSpec> getGlobalAttrs() {
+        for (ValidatorProtos.AttrList attrList : builder.getAttrListsList()) {
+            if (attrList.getName().equals("$GLOBAL_ATTRS")) {
+                return attrList.getAttrsList();
+            }
+        }
+
+        return Collections.emptyList();
+    }
+
+    /**
+     * Returns the $AMP_LAYOUT_ATTRS attr spec list.
+     * @return returns the $AMP_LAYOUT_ATTRS attr spec list.
+     */
+    public List<ValidatorProtos.AttrSpec> getAmpLayoutAttrs() {
+        for (ValidatorProtos.AttrList attrList : builder.getAttrListsList()) {
+            if (attrList.getName().equals("$AMP_LAYOUT_ATTRS")) {
+                return attrList.getAttrsList();
+            }
+        }
+
+        return Collections.emptyList();
+    }
+
+    /**
+     * Returns the descendant tag lists.
+     * @return returns the descendant tag lists.
+     */
+    public List<ValidatorProtos.DescendantTagList> getDescendantTagLists() {
+        return this.builder.getDescendantTagListList();
+    }
+
+    /**
+     * Returns dispatch key given tag spec id.
+     * @param tagSpecId tag spec id.
+     * @return returns dispatch key.
+     */
+    public String getDispatchKeyByTagSpecId(final int tagSpecId) {
+        return dispatchKeyByTagSpecId.get(tagSpecId);
+    }
+
+    /**
+     * Returns the specId for given the tag spec name of the reference point.
+     * @param specName the spec name.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns specId.
+     */
+    public int getTagSpecIdByReferencePointTagSpecName(@Nonnull final String specName) throws TagValidationException {
+        int index = 0;
+        for (ValidatorProtos.TagSpec tagSpec : builder.getTagsList()) {
+            if (tagSpec.getTagName().equals("$REFERENCE_POINT")) {
+                if (tagSpec.getSpecName().equals(specName)) {
+                    return index;
+                }
+            }
+            index++;
+        }
+
+        throw new TagValidationException("The reference point with spec name " + specName + " does not exist");
+    }
+
+    /**
+     * Returns the styles spec url.
+     * @return returns the styles spec url.
+     */
+    public String getStylesSpecUrl() {
+        return builder.getStylesSpecUrl();
+    }
+
+    /**
+     * Returns the script spec url.
+     * @return returns the script spec url.
+     */
+    public String getScriptSpecUrl() {
+        return builder.getScriptSpecUrl();
+    }
+
+    /**
+     * Returns the attr list map.
+     * @return returns the attr list map.
+     */
+    public Map<String, ValidatorProtos.AttrList> getAttrListMap() {
+        return attrListMap;
+    }
+
+    /**
+     * Returns a combined black listed regex.
+     * @param tagSpecId tag spec id.
+     * @return returns a combined black listed regex.
+     */
+    public String getCombinedBlacklistedCdataRegex(final int tagSpecId) {
+        return combinedBlacklistedCdataRegexMap.get(Integer.toString(tagSpecId));
+    }
+
+    /** Validator builder rules. */
+    @Nonnull
+    private ValidatorProtos.ValidatorRules.Builder builder = null;
+
+    /** TagSpec lookup (tag_name) by name. */
+    @Nonnull
+    private final Map<ValidatorProtos.HtmlFormat.Code, Map<String, List<ValidatorProtos.TagSpec>>> tagSpecMapByHtmlFormat = new HashMap<>();
+
+    /** Attribute list (attr_list) lookup by name. */
+    @Nonnull
+    private final Map<String, ValidatorProtos.AttrList> attrListMap = new HashMap<>();
+
+    /**
+     * The map of dispatch key by tag spec id.
+     */
+    @Nonnull
+    private final Map<Integer, String> dispatchKeyByTagSpecId = new HashMap<>();
+
+    /** Combined black listed Cdata regex per Cdataspec. */
+    private Map<String, String> combinedBlacklistedCdataRegexMap;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/CdataMatcher.java b/validator/java/src/main/java/dev/amp/validator/CdataMatcher.java
new file mode 100644
index 0000000000000..d99f6158bef0a
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/CdataMatcher.java
@@ -0,0 +1,383 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import com.steadystate.css.parser.Token;
+
+import dev.amp.validator.css.CssParser;
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.Stylesheet;
+import dev.amp.validator.css.ParsedCssUrl;
+import dev.amp.validator.css.CssParsingConfig;
+
+import dev.amp.validator.utils.CssSpecUtils;
+import dev.amp.validator.utils.TagSpecUtils;
+import dev.amp.validator.visitor.InvalidRuleVisitor;
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.regex.Pattern;
+
+import static dev.amp.validator.css.CssTokenUtil.copyPosTo;
+import static dev.amp.validator.utils.AttributeSpecUtils.validateUrlAndProtocol;
+import static dev.amp.validator.utils.ByteUtils.byteLength;
+import static dev.amp.validator.utils.CssSpecUtils.stripMinMax;
+import static dev.amp.validator.utils.CssSpecUtils.stripVendorPrefix;
+import static dev.amp.validator.utils.TagSpecUtils.getTagSpecName;
+import static dev.amp.validator.utils.UrlUtils.isDataUrl;
+import static dev.amp.validator.visitor.MediaQueryVisitor.parseMediaQueries;
+
+/**
+ * CdataMatcher maintains a constraint to check which an opening tag
+ * introduces: a tag's cdata matches constraints set by it's cdata
+ * spec. Unfortunately we need to defer such checking and can't
+ * handle it while the opening tag is being processed.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class CdataMatcher {
+    /**
+     * Constructor.
+     *
+     * @param parsedTagSpec the ParsedTagSpec.
+     * @param lineCol a line / column pair.
+     */
+    public CdataMatcher(@Nonnull final ParsedTagSpec parsedTagSpec, @Nonnull final Locator lineCol) {
+        this.parsedTagSpec = parsedTagSpec;
+        this.lineCol = lineCol;
+    }
+
+    /**
+     * Matches the provided cdata against what this CdataMatcher expects.
+     *
+     * @param cdata            the cdata.
+     * @param context          the context object.
+     * @param validationResult validation result object.
+     * @throws TagValidationException the TagValidationException.
+     * @throws CssValidationException css validation exception.
+     * @throws IOException            IO exception.
+     */
+    public void match(@Nonnull final String cdata, @Nonnull final Context context,
+                      @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+            throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.CdataSpec cdataSpec = this.getTagSpec().getCdata();
+        if (cdataSpec == null) {
+            return;
+        }
+
+        // Max CDATA Byte Length
+        if (cdataSpec.hasMaxBytes() && cdataSpec.getMaxBytes() != CDATA_MAX_BYTES
+                && cdata.length() > cdataSpec.getMaxBytes()) {
+            List<String> params = new ArrayList<>();
+            params.add(String.valueOf(cdata.length()));
+            params.add(String.valueOf(cdataSpec.getMaxBytes()));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.STYLESHEET_TOO_LONG,
+                    context.getLineCol(),
+                    params,
+                    cdataSpec.getMaxBytesSpecUrl(),
+                    validationResult);
+            return;
+        }
+
+        int urlBytes = 0;
+        // The mandatory_cdata, cdata_regex, and css_spec fields are treated
+        // like a oneof, but we're not using oneof because it's a feature
+        // that was added after protobuf 2.5.0 (which our open-source
+        // version uses).
+
+        // Mandatory CDATA exact match
+        List<String> params = new ArrayList<>();
+        params.add(getTagSpecName(this.getTagSpec()));
+
+        if (cdataSpec.hasMandatoryCdata()) {
+            if (!cdataSpec.getMandatoryCdata().equals(cdata)) {
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MANDATORY_CDATA_MISSING_OR_INCORRECT,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(this.getTagSpec()),
+                        validationResult);
+            }
+            // We return early if the cdata has an exact match rule. The
+            // spec shouldn't have an exact match rule that doesn't validate.
+            return;
+        } else if (this.getTagSpec().getCdata().hasCdataRegex()) {
+            if (!context.getRules()
+                    .getFullMatchRegex(this.getTagSpec().getCdata().getCdataRegex())
+                    .matcher(cdata).matches()) {
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MANDATORY_CDATA_MISSING_OR_INCORRECT,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(this.getTagSpec()),
+                        validationResult);
+                return;
+            }
+        } else if (cdataSpec.hasCssSpec()) {
+            urlBytes = this.matchCss(cdata, cdataSpec.getCssSpec(), context, validationResult);
+        } else if (cdataSpec.getWhitespaceOnly()) {
+            if (!(WHITE_SPACE_CHARACTER_PATTERN.matcher(cdata).matches())) {
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.NON_WHITESPACE_CDATA_ENCOUNTERED,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(this.getTagSpec()),
+                        validationResult);
+            }
+        }
+
+        int adjustedCdataLength = byteLength(cdata);
+        if (!cdataSpec.hasUrlBytesIncluded()) {
+            adjustedCdataLength -= urlBytes;
+        }
+
+        // Record <style amp-custom> byte size
+        if (context.getTagStack().isStyleAmpCustomChild()) {
+            context.addStyleAmpCustomByteSize(adjustedCdataLength);
+        }
+
+        // Blacklisted CDATA Regular Expressions
+        // We use a combined regex as a fast test. If it matches, we re-match
+        // against each individual regex so that we can generate better error
+        // messages.
+        final String combinedBlacklistedCdataRegex =
+                context.getRules().getCombinedBlacklistedCdataRegex(parsedTagSpec.getId());
+        if (combinedBlacklistedCdataRegex == null) {
+            return;
+        }
+
+        if (!context.getRules()
+                .getPartialMatchCaseiRegex(combinedBlacklistedCdataRegex)
+                .matcher(cdata).find()) {
+            return;
+        }
+
+        for (ValidatorProtos.BlackListedCDataRegex blacklist : cdataSpec.getBlacklistedCdataRegexList()) {
+            final Pattern p = Pattern.compile(blacklist.getRegex(), Pattern.CASE_INSENSITIVE);
+            if (p.matcher(cdata).find()) {
+                params.add(blacklist.getErrorMessage());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.CDATA_VIOLATES_BLACKLIST,
+                        context.getLineCol(),
+                        /* params */
+                        params,
+                        TagSpecUtils.getTagSpecUrl(this.getTagSpec()),
+                        validationResult);
+            }
+        }
+    }
+
+
+    /**
+     * Matches the provided cdata against a CSS specification. Helper
+     * routine for match (see above). The return value is the number of
+     * bytes in the CSS string which were measured as URLs. In some
+     * validation types, these bytes are not counted against byte limits.
+     *
+     * @param cdata            the cdata.
+     * @param cssSpec          CSS specification.
+     * @param context          the context object.
+     * @param validationResult validation result.
+     * @return returns 1 if css matches against a CSS spec.
+     * @throws CssValidationException css validation exception.
+     * @throws IOException            IO validation exception.
+     */
+    public int matchCss(@Nonnull final String cdata, @Nonnull final ValidatorProtos.CssSpec cssSpec,
+                        @Nonnull final Context context,
+                        @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) throws CssValidationException,
+            IOException {
+        final List<ErrorToken> cssErrors = new ArrayList<>();
+        final List<ErrorToken> cssWarnings = new ArrayList<>();
+
+        final CssParser cssParser = new CssParser(cdata,
+                this.getLineCol().getLineNumber(), this.getLineCol().getColumnNumber(), cssErrors);
+        final List<Token> tokenList = cssParser.tokenize();
+        final CssParsingConfig cssParsingConfig = CssParsingConfig.computeCssParsingConfig(cssSpec);
+        final Stylesheet stylesheet = CssSpecUtils.parseAStylesheet(
+                tokenList, cssParsingConfig.getAtRuleSpec(), cssParsingConfig.getDefaultSpec(),
+                cssErrors);
+        int urlBytes = 0;
+
+        // We extract the urls from the stylesheet. As a side-effect, this can
+        // generate errors for url(…) functions with invalid parameters.
+        final List<ParsedCssUrl> parsedUrls = new ArrayList<>();
+        CssSpecUtils.extractUrls(stylesheet, parsedUrls, cssErrors);
+        // Similarly we extract query types and features from @media rules.
+        for (final ValidatorProtos.AtRuleSpec atRuleSpec : cssSpec.getAtRuleSpecList()) {
+            if (atRuleSpec.hasMediaQuerySpec()) {
+                if (!atRuleSpec.getName().equals("media")) {
+                    throw new CssValidationException("atRuleSpec name is not 'media'");
+                }
+                ValidatorProtos.MediaQuerySpec mediaQuerySpec = atRuleSpec.getMediaQuerySpec();
+                List<ErrorToken> errorBuffer = mediaQuerySpec.getIssuesAsError() ? cssErrors : cssWarnings;
+                this.matchMediaQuery(stylesheet, mediaQuerySpec, errorBuffer);
+                // There will be at most @media atRuleSpec
+                break;
+            }
+        }
+
+        if (cssSpec.getValidateAmp4Ads()) {
+            CssSpecUtils.validateAmp4AdsCss(stylesheet, cssErrors);
+        }
+
+        if (cssSpec.getValidateKeyframes()) {
+            CssSpecUtils.validateKeyframesCss(stylesheet, cssErrors);
+        }
+
+        // Add errors then warnings:
+        for (final ErrorToken errorToken : cssErrors) {
+            // Override the first parameter with the name of this style tag.
+            final List<String> params = errorToken.getParams();
+            // Override the first parameter with the name of this style tag.
+            params.set(0, getTagSpecName(this.getTagSpec()));
+            context.addError(
+                    errorToken.getCode(),
+                    context.getLineCol().getColumnNumber() + errorToken.getLine(),
+                    context.getLineCol().getColumnNumber() + errorToken.getCol(),
+                    params,
+                    /* url */ "",
+                    validationResult);
+        }
+
+        for (ErrorToken errorToken : cssWarnings) {
+            // Override the first parameter with the name of this style tag.
+            List<String> params = errorToken.getParams();
+            // Override the first parameter with the name of this style tag.
+            params.set(0, getTagSpecName(this.getTagSpec()));
+            context.addError(
+                    errorToken.getCode(),
+                    context.getLineCol().getColumnNumber() + errorToken.getLine(),
+                    context.getLineCol().getColumnNumber() + errorToken.getCol(),
+                    params,
+                    /* url */ "",
+                    validationResult);
+        }
+
+        final ParsedUrlSpec parsedFontUrlSpec = new ParsedUrlSpec(cssSpec.getFontUrlSpec());
+        final ParsedUrlSpec parsedImageUrlSpec = new ParsedUrlSpec(cssSpec.getImageUrlSpec());
+        for (final ParsedCssUrl url : parsedUrls) {
+            // Some CSS specs can choose to not count URLs against the byte limit,
+            // but data URLs are always counted (or in other words, they aren't
+            // considered URLs).
+            if (!isDataUrl(url.getUtf8Url())) {
+                urlBytes += byteLength(url.getUtf8Url());
+            }
+            final UrlErrorInStylesheetAdapter adapter = new UrlErrorInStylesheetAdapter(url.getLine(), url.getCol());
+            validateUrlAndProtocol(
+                    ((url.getAtRuleScope().equals("font-face")) ? parsedFontUrlSpec : parsedImageUrlSpec),
+                    adapter, context, url.getUtf8Url(), this.getTagSpec(), validationResult);
+        }
+
+        final InvalidRuleVisitor visitor = new InvalidRuleVisitor(
+                this.getTagSpec(), cssSpec, context, validationResult);
+        stylesheet.accept(visitor);
+        return urlBytes;
+    }
+
+    /**
+     * Matches the provided stylesheet against a CSS media query specification.
+     *
+     * @param stylesheet  the stylesheet to validate
+     * @param spec        the spec to validate against
+     * @param errorBuffer the errors collection to populate
+     * @throws CssValidationException css validation exception.
+     * @private
+     */
+    private void matchMediaQuery(@Nonnull final Stylesheet stylesheet,
+                                 @Nonnull final ValidatorProtos.MediaQuerySpec spec,
+                                 @Nonnull final List<ErrorToken> errorBuffer) throws CssValidationException {
+        List<Token> seenMediaTypes = new ArrayList<>();
+        List<Token> seenMediaFeatures = new ArrayList<>();
+        parseMediaQueries(stylesheet, seenMediaTypes, seenMediaFeatures, errorBuffer);
+
+        for (final Token token : seenMediaTypes) {
+            final String strippedMediaType = stripVendorPrefix((token.toString().toLowerCase()));
+            if (!spec.getTypeList().contains(strippedMediaType)) {
+                final List<String> params = new ArrayList<>();
+                params.add("");
+                params.add(token.toString());
+                final ErrorToken errorToken = new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_MEDIA_TYPE,
+                        params);
+                copyPosTo(token, errorToken);
+                errorBuffer.add(errorToken);
+            }
+        }
+
+        for (final Token token : seenMediaFeatures) {
+            final String strippedMediaFeature = stripMinMax(
+                    stripVendorPrefix((token.toString().toLowerCase())));
+            if (!spec.getFeatureList().contains(strippedMediaFeature)) {
+                List<String> params = new ArrayList<>();
+                params.add("");
+                params.add(token.toString());
+                ErrorToken errorToken = new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_MEDIA_FEATURE,
+                        params);
+                copyPosTo(token, errorToken);
+                errorBuffer.add(errorToken);
+            }
+        }
+    }
+
+    /**
+     * @return lineCol of CdataMatcher
+     */
+    public Locator getLineCol() {
+        return this.lineCol;
+    }
+
+    /**
+     * @return tagspec of the CdataMatcher
+     */
+    public ValidatorProtos.TagSpec getTagSpec() {
+        return parsedTagSpec.getSpec();
+    }
+
+    /**
+     * A TagSpec object.
+     */
+    private ParsedTagSpec parsedTagSpec;
+
+    /**
+     * A pair of line/col.
+     */
+    private Locator lineCol;
+
+    /**
+     * A white space character pattern.
+     */
+    private static final Pattern WHITE_SPACE_CHARACTER_PATTERN = Pattern.compile("^\\s*$");
+
+    /**
+     * CDATA max bytes.
+     */
+    private static final int CDATA_MAX_BYTES = -2;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ChildTagMatcher.java b/validator/java/src/main/java/dev/amp/validator/ChildTagMatcher.java
new file mode 100644
index 0000000000000..7ceb2d5926636
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ChildTagMatcher.java
@@ -0,0 +1,157 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.utils.TagSpecUtils;
+import org.apache.commons.lang3.StringUtils;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * The child tag matcher evaluates ChildTagSpec. The constructor
+ * provides the enclosing TagSpec for the parent tag so that we can
+ * produce error messages mentioning the parent.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ChildTagMatcher {
+    /**
+     * Constructor.
+     *
+     * @param parentSpec parent tag spec.
+     * @throws TagValidationException child tag expected to be null.
+     */
+    public ChildTagMatcher(@Nonnull final ValidatorProtos.TagSpec parentSpec)
+            throws TagValidationException {
+        this.parentSpec = parentSpec;
+        if (!parentSpec.hasChildTags()) {
+            throw new TagValidationException("The parent's child tag should be null");
+        }
+    }
+
+    /**
+     * Matching child tag name.
+     * @param encounteredTag the ParsedHtmlTag.
+     * @param context the Context.
+     * @param result validation result.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void matchChildTagName(@Nonnull final ParsedHtmlTag encounteredTag,
+                                  @Nonnull final Context context,
+                                  @Nonnull final ValidatorProtos.ValidationResult.Builder result)
+            throws TagValidationException {
+        final ValidatorProtos.ChildTagSpec childTags = parentSpec.getChildTags();
+        // Enforce child_tag_name_oneof: If at least one tag name is specified,
+        // then the child tags of the parent tag must have one of the provided
+        // tag names.
+
+        String allowedNames;
+        if (childTags.getChildTagNameOneofList().size() > 0) {
+            final List<String> names = childTags.getChildTagNameOneofList();
+            if (names.indexOf(encounteredTag.upperName()) == -1) {
+                allowedNames = "[\'" + StringUtils.join(names, ", ") + "\']";
+                final List<String> params = new ArrayList<>();
+                params.add(encounteredTag.lowerName());
+                params.add(TagSpecUtils.getTagSpecName(this.parentSpec));
+                params.add(allowedNames.toLowerCase());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_CHILD_TAG_NAME,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(this.parentSpec),
+                        result);
+            }
+        }
+        // Enforce first_child_tag_name_oneof: If at least one tag name is
+        // specified, then the first child of the parent tag must have one
+        // of the provided tag names.
+        if (childTags.getFirstChildTagNameOneofList().size() > 0
+                && context.getTagStack().parentChildCount() == 0) {
+            final List<String> names = childTags.getFirstChildTagNameOneofList();
+            if (names.indexOf(encounteredTag.upperName()) == -1) {
+                allowedNames = "[\'" + StringUtils.join(names, ", ") + "\']";
+                final List<String> params = new ArrayList<>();
+                params.add(encounteredTag.lowerName());
+                params.add(TagSpecUtils.getTagSpecName(this.parentSpec));
+                params.add(allowedNames.toLowerCase());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_FIRST_CHILD_TAG_NAME,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(this.parentSpec),
+                        result);
+            }
+        }
+    }
+
+    /**
+     * Exit tag.
+     * @param context the context.
+     * @param result validation result.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void exitTag(@Nonnull final Context context, @Nonnull final ValidatorProtos.ValidationResult.Builder result) throws TagValidationException {
+        final int expectedNumChildTags =
+                this.parentSpec.getChildTags().getMandatoryNumChildTags();
+        List<String> params;
+        if (expectedNumChildTags != -1
+                && expectedNumChildTags != context.getTagStack().parentChildCount()) {
+            params = new ArrayList<>();
+            params.add(TagSpecUtils.getTagSpecName(this.parentSpec));
+            params.add(String.valueOf(expectedNumChildTags));
+            params.add(String.valueOf(context.getTagStack().parentChildCount()));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INCORRECT_NUM_CHILD_TAGS,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(this.parentSpec),
+                    result);
+            return;
+        }
+
+        final int  expectedMinNumChildTags =
+                this.parentSpec.getChildTags().getMandatoryMinNumChildTags();
+        if (expectedMinNumChildTags != -1
+                && context.getTagStack().parentChildCount() < expectedMinNumChildTags) {
+            params = new ArrayList<>();
+            params.add(TagSpecUtils.getTagSpecName(this.parentSpec));
+            params.add(String.valueOf(expectedMinNumChildTags));
+            params.add(String.valueOf(context.getTagStack().parentChildCount()));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INCORRECT_MIN_NUM_CHILD_TAGS,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(this.parentSpec),
+                    result);
+            return;
+        }
+    }
+
+    /** Parent tag spec. */
+    @Nonnull
+    private ValidatorProtos.TagSpec parentSpec;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/Context.java b/validator/java/src/main/java/dev/amp/validator/Context.java
new file mode 100644
index 0000000000000..4540f18a180cc
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/Context.java
@@ -0,0 +1,551 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.utils.TagSpecUtils;
+import dev.amp.validator.utils.ValidationErrorUtils;
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.HashSet;
+import java.util.List;
+import java.util.Map;
+import java.util.Set;
+
+/**
+ * The Context keeps track of the line / column that the validator is
+ * in, as well as the mandatory tag specs that have already been validated.
+ * So, this constitutes the mutable state for the validator except for
+ * the validation result itself.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class Context {
+    /**
+     * Constructor.
+     * @param parsedValidatorRules a ParsedValidationRules object.
+     */
+    public Context(@Nonnull final ParsedValidatorRules parsedValidatorRules) {
+        this.rules = parsedValidatorRules;
+        this.mandatoryAlternativesSatisfied = new ArrayList<>();
+        this.docLocator = null;
+        this.tagStack = new TagStack();
+        this.tagspecsValidated = new HashMap<>();
+        //TODO - it's a hack, remove this when DOCTYPE is fixed
+        tagspecsValidated.put(0, true);
+
+        this.styleAmpCustomByteSize = 0;
+        this.inlineStyleByteSize = 0;
+        this.typeIdentifiers = new ArrayList<>();
+        this.valueSetsProvided = new HashSet<>();
+        this.valueSetsRequired = new HashMap<>();
+        this.conditionsSatisfied = new HashMap<>();
+        this.firstUrlSeenTag = null;
+        this.extensions = new ExtensionsContext();
+    }
+
+    /**
+     * Given the tagResult from validating a single tag, update the overall
+     * result as well as the Context state to affect later validation.
+     * @param encounteredTag the encountered tag.
+     * @param referencePointResult the reference point result.
+     * @param tagResult the tag result.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void updateFromTagResults(@Nonnull final ParsedHtmlTag encounteredTag,
+                                     @Nonnull final ValidateTagResult referencePointResult,
+                                     @Nonnull final ValidateTagResult tagResult) throws TagValidationException {
+        this.tagStack.updateFromTagResults(
+                encounteredTag, referencePointResult, tagResult, this.getRules(),
+                this.getLineCol());
+
+        this.recordAttrRequiresExtension(encounteredTag, referencePointResult);
+        this.recordAttrRequiresExtension(encounteredTag, tagResult);
+        this.updateFromTagResult(referencePointResult);
+        this.updateFromTagResult(tagResult);
+    }
+
+    /**
+     * Given a tag result, update the Context state to affect
+     * later validation. Does not handle updating the tag stack.
+     * @param result a result.
+     */
+    private void updateFromTagResult(@Nonnull final ValidateTagResult result) {
+        if (result.getBestMatchTagSpec() == null) {
+            return;
+        }
+
+        final ParsedTagSpec parsedTagSpec = result.getBestMatchTagSpec();
+        final boolean isPassing =
+                (result.getValidationResult().getStatus() == ValidatorProtos.ValidationResult.Status.PASS);
+
+        this.extensions.updateFromTagResult(result);
+        // If this requires an extension and we are still in the document head,
+        // record that we may still need to emit a missing extension error at
+        // the end of the document head. We do this even for a tag failing
+        // validation since extensions are based on the tag name, and we're still
+        // pretty confident the user forgot to include the extension.
+        if (this.tagStack.hasAncestor("HEAD")) {
+            this.extensions.recordFutureErrorsIfMissing(
+                    parsedTagSpec, this.getLineCol());
+        }
+        // We also want to satisfy conditions, to reduce errors seen elsewhere in
+        // the document.
+        this.satisfyConditionsFromTagSpec(parsedTagSpec);
+        this.satisfyMandatoryAlternativesFromTagSpec(parsedTagSpec);
+        this.recordValidatedFromTagSpec(isPassing, parsedTagSpec);
+
+        final ValidatorProtos.ValidationResult.Builder validationResult = result.getValidationResult();
+        for (final ValidatorProtos.ValueSetProvision provision : validationResult.getValueSetProvisionsList()) {
+            this.valueSetsProvided.add(this.keyFromValueSetProvision(provision));
+        }
+        for (final ValidatorProtos.ValueSetRequirement requirement : validationResult.getValueSetRequirementsList()) {
+            if (!requirement.hasProvision()) {
+                continue;
+            }
+
+            final String key = this.keyFromValueSetProvision(requirement.getProvision());
+            List<ValidatorProtos.ValidationError> errors = this.valueSetsRequired.get(key);
+            if (errors == null) {
+                errors = new ArrayList<>();
+                this.valueSetsRequired.put(key, errors);
+            }
+            errors.add(requirement.getErrorIfUnsatisfied());
+        }
+
+        if (isPassing) {
+            // If the tag spec didn't match, we don't know that the tag actually
+            // contained a URL, so no need to complain about it.
+            this.markUrlSeenFromMatchingTagSpec(parsedTagSpec);
+        }
+    }
+
+    /**
+     * Records that a Tag was seen which contains an URL. Used to note issues
+     * with base href occurring in the document after an URL.
+     * @param parsedTagSpec parsed tag spec.
+     */
+    public void markUrlSeenFromMatchingTagSpec(@Nonnull final ParsedTagSpec parsedTagSpec) {
+        if (!this.hasSeenUrl() && parsedTagSpec.containsUrl()) {
+            this.firstUrlSeenTag = parsedTagSpec.getSpec();
+        }
+    }
+
+    /**
+     * Returns all the value set provisions so far, as a set of derived keys, as
+     * computed by keyFromValueSetProvision_().
+     * @return the value sets provided
+     */
+    public Set<String> valueSetsProvided() {
+        return this.valueSetsProvided;
+    }
+
+    /**
+     * Returns all the value set requirements so far, keyed by derived keys, as
+     * computed by getValueSetProvisionKey().
+     * @return the map of value sets required.
+     */
+    public Map<String, List<ValidatorProtos.ValidationError>> valueSetsRequired() {
+        return this.valueSetsRequired;
+    }
+
+    /**
+     * Records that this document contains a tag matching a particular tag spec.
+     * @param isPassing is passing status.
+     * @param parsedTagSpec parsed tag spec.
+     */
+    private void recordValidatedFromTagSpec(final boolean isPassing, @Nonnull final ParsedTagSpec parsedTagSpec) {
+        final RecordValidated recordValidated = parsedTagSpec.shouldRecordTagspecValidated();
+        if (recordValidated == RecordValidated.ALWAYS) {
+            this.tagspecsValidated.put(parsedTagSpec.id(), true);
+        } else if (isPassing && (recordValidated == RecordValidated.IF_PASSING)) {
+            this.tagspecsValidated.put(parsedTagSpec.id(), true);
+        }
+    }
+
+    /**
+     * Record document-level conditions which have been satisfied.
+     * @param parsedTagSpec parsed tag spec.
+     */
+    private void satisfyConditionsFromTagSpec(@Nonnull final ParsedTagSpec parsedTagSpec) {
+        for (final String condition : parsedTagSpec.getSpec().getSatisfiesList()) {
+            this.conditionsSatisfied.put(condition, true);
+        }
+    }
+
+    /**
+     * Record that this document contains a tag which is a member of a list
+     * of mandatory alternatives.
+     * @param parsedTagSpec parsed tag spec.
+     */
+    public void satisfyMandatoryAlternativesFromTagSpec(@Nonnull final ParsedTagSpec parsedTagSpec) {
+        final ValidatorProtos.TagSpec tagSpec = parsedTagSpec.getSpec();
+        if (tagSpec.hasMandatoryAlternatives()) {
+            this.mandatoryAlternativesSatisfied.add(tagSpec.getMandatoryAlternatives());
+        }
+    }
+
+    /**
+     * Record when an encountered tag's attribute that requires an extension
+     * that it also satisfies that the requied extension is used.
+     * @param encounteredTag encountered tag.
+     * @param tagResult tag result.
+     */
+    private void recordAttrRequiresExtension(@Nonnull final ParsedHtmlTag encounteredTag,
+                                              @Nonnull final ValidateTagResult tagResult) {
+        if (tagResult.getBestMatchTagSpec() == null) {
+            return;
+        }
+
+        final ParsedTagSpec parsedTagSpec = tagResult.getBestMatchTagSpec();
+        if (!parsedTagSpec.attrsCanSatisfyExtension()) {
+            return;
+        }
+
+        Map<String, ValidatorProtos.AttrSpec> attrsByName = parsedTagSpec.getAttrsByName();
+        final ExtensionsContext extensionsCtx = this.extensions;
+        for (int i = 0; i < encounteredTag.attrs().getLength(); i++) {
+            String attrName = encounteredTag.attrs().getLocalName(i);
+            String attrValue = encounteredTag.attrs().getValue(i);
+            if (attrName.equals(attrValue)) {
+                attrValue = "";
+            }
+            if (attrsByName.containsKey(attrName)) {
+                final ValidatorProtos.AttrSpec attrSpec = attrsByName.get(attrName);
+                if (attrSpec == null) {
+                    continue;
+                }
+                final ParsedAttrSpec parsedAttrSpec =
+                        this.rules.getParsedAttrSpecs().getParsedAttrSpec(attrName, attrValue, attrSpec);
+                if (parsedAttrSpec != null && parsedAttrSpec.getSpec().getRequiresExtensionCount() > 0) {
+                    extensionsCtx.recordUsedExtensions(
+                            parsedAttrSpec.getSpec().getRequiresExtensionList());
+                }
+            }
+        }
+    }
+
+    /**
+     * @param error a ValidationError object.
+     * @param validationResult a ValidationResult object.
+     */
+    public void addBuiltError(@Nonnull final ValidatorProtos.ValidationError error,
+                              @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        // If any of the errors amount to more than a WARNING, validation fails.
+        if (error.getSeverity() != ValidatorProtos.ValidationError.Severity.WARNING) {
+            validationResult.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        }
+        validationResult.addErrors(error);
+    }
+
+    /**
+     * Add an error field to validationResult with severity ERROR.
+     * @param validationErrorCode Error code
+     * @param lineCol a line / column pair.
+     * @param params a list of params.
+     * @param specUrl a link (URL) to the amphtml spec
+     * @param validationResult a ValidationResult object.
+     */
+    public void addError(@Nonnull final ValidatorProtos.ValidationError.Code validationErrorCode,
+                         @Nonnull final Locator lineCol,
+                         final List<String> params, final String specUrl,
+                         @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        addError(validationErrorCode, lineCol.getLineNumber(),
+                lineCol.getColumnNumber(), params, specUrl, validationResult);
+    }
+
+    /**
+     * Add an error field to validationResult with severity ERROR.
+     * @param validationErrorCode Error code
+     * @param line a line number.
+     * @param column a column number.
+     * @param params a list of params.
+     * @param specUrl a link (URL) to the amphtml spec
+     * @param validationResult a ValidationResult object.
+     */
+    public void addError(@Nonnull final ValidatorProtos.ValidationError.Code validationErrorCode,
+                         final int line,
+                         final int column,
+                         final List<String> params, final String specUrl,
+                         @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        this.addBuiltError(
+                ValidationErrorUtils.populateError(
+                        ValidatorProtos.ValidationError.Severity.ERROR,
+                        validationErrorCode,
+                        line, column, params, specUrl),
+                validationResult);
+        validationResult.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+    }
+
+    /**
+     * Add an error field to validationResult with severity WARNING.
+     * @param validationErrorCode Error code
+     * @param lineCol a line / column pair.
+     * @param params a list of params.
+     * @param specUrl a link (URL) to the amphtml spec
+     * @param validationResult a ValidationResult object.
+     */
+    public void addWarning(@Nonnull final ValidatorProtos.ValidationError.Code validationErrorCode,
+                           @Nonnull final Locator lineCol,
+                           final List<String> params, final String specUrl,
+                           @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        this.addBuiltError(
+                ValidationErrorUtils.populateError(
+                        ValidatorProtos.ValidationError.Severity.WARNING, validationErrorCode,
+                        lineCol, params, specUrl),
+                validationResult);
+    }
+
+    /**
+     * Returns a line/col pair.
+     * @return returns a line/col pair.
+     */
+    public Locator getLineCol() {
+        return docLocator;
+    }
+
+    /**
+     * Setting the LineCol.
+     * @param lineCol a pair line/col.
+     */
+    public void setLineCol(@Nonnull final Locator lineCol) {
+        this.docLocator = lineCol;
+    }
+
+    /**
+     * Returns the ParsedValidatorRules.
+     * @return returns the ParsedValidatorRules object.
+     */
+    public ParsedValidatorRules getRules() {
+        return rules;
+    }
+
+    /**
+     * Returns the tag stack.
+     * @return returns the tag stack.
+     */
+    public TagStack getTagStack() {
+        return tagStack;
+    }
+
+    /**
+     * Record the type identifier in this document.
+     * @param typeIdentifier type identifier.
+     */
+    public void recordTypeIdentifier(@Nonnull final String typeIdentifier) {
+        this.typeIdentifiers.add(typeIdentifier);
+    }
+
+    /**
+     * Returns the type identifiers in this document.
+     * @return returns the type identifiers.
+     */
+    public List<String> getTypeIdentifiers() {
+        return this.typeIdentifiers;
+    }
+
+    /**
+     * @return returns the extensions of the current validation job.
+     */
+    public ExtensionsContext getExtensions() {
+        return extensions;
+    }
+
+    /**
+     * Returns the tag spec ids that have been validated. The return object
+     * should be treated as a set (the object keys), and the value should be
+     * ignored.
+     * @return returns validated tag specs.
+     */
+    public Map<Integer, Boolean> getTagspecsValidated() {
+        return this.tagspecsValidated;
+    }
+
+    /**
+     * Returns the boolean value of true if exists.
+     * @param id tag spec id.
+     * @return returns the boolean value of true if exists.
+     */
+    public boolean hasTagspecsValidated(final int id) {
+        Boolean b = tagspecsValidated.get(id);
+        if (b == null) {
+            return false;
+        }
+
+        return b.booleanValue();
+    }
+
+    /**
+     * Records how much of the document is used towards &lt;style amp-custom&gt;.
+     * @param byteSize byte size.
+     */
+    public void addStyleAmpCustomByteSize(final int byteSize) {
+        this.styleAmpCustomByteSize += byteSize;
+    }
+
+    /**
+     * Records how much of the document is used towards inline style.
+     * @param byteSize integer to add to running inline style byte size.
+     */
+    public void addInlineStyleByteSize(final int byteSize) {
+        this.inlineStyleByteSize += byteSize;
+    }
+
+    /**
+     * Returns the size of inline styles.
+     * @return returns running inline style byte size.
+     */
+    public int getInlineStyleByteSize() {
+        return this.inlineStyleByteSize;
+    }
+
+    /**
+     * Returns the size of style amp-custom.
+     * @return returns the size of style of amp-custom
+     */
+    public int getStyleAmpCustomByteSize() {
+        return this.styleAmpCustomByteSize;
+    }
+
+    /**
+     * Returns true iff "transformed" is a type identifier in this document.
+     * @return returns true iff "transformed" is a type identifier in this document.
+     */
+    public boolean isTransformed() {
+        return this.typeIdentifiers.contains("transformed");
+    }
+
+    /**
+     * Returns true iff the current context has observed a tag which contains
+     * an URL. This is set by calling markUrlSeen_ above.
+     * @return returns true if first url seen tag is not null.
+     */
+    public boolean hasSeenUrl() {
+        return this.firstUrlSeenTag != null;
+    }
+
+    /**
+     * @param condition the condition.
+     * @return returns true if condition exists.
+     */
+    public boolean satisfiesCondition(@Nonnull final String condition) {
+        return this.conditionsSatisfied.containsKey(condition);
+    }
+
+    /**
+     * The TagSpecName of the first seen URL. Do not call unless HasSeenUrl
+     * returns true.
+     * @return returns TagSpecName of the first seen URL.
+     */
+    public String firstSeenUrlTagName() {
+        return TagSpecUtils.getTagSpecName(this.firstUrlSeenTag);
+    }
+
+    /**
+     * The mandatory alternatives that we've satisfied. This may contain
+     * duplicates (we'd have to filter them in record... above if we cared).
+     * @return returns the mandatory alternatives that we've satisfied.
+     */
+    public List<String> getMandatoryAlternativesSatisfied() {
+        return this.mandatoryAlternativesSatisfied;
+    }
+
+    /**
+     * @param provision a ValueSetProvision.
+     * @return A key for valueSetsProvided and valueSetsRequired.
+     */
+    private String keyFromValueSetProvision(@Nonnull final ValidatorProtos.ValueSetProvision provision) {
+        return (provision.hasSet() ? provision.getSet() : "")
+                + ">"
+                + (provision.hasValue() ? provision.getValue() : "");
+    }
+
+    /**
+     * An instance of ParsedValidatorRules.
+     */
+    private ParsedValidatorRules rules;
+
+    /**
+     * The mandatory alternatives that we've validated (a small list of ids).
+     */
+    private List<String> mandatoryAlternativesSatisfied;
+
+    /**
+     * DocLocator object from the parser which gives us line/col numbers.
+     */
+    private Locator docLocator = null;
+
+    /**
+     * An instance of TagStack.
+     */
+    private TagStack tagStack = null;
+
+    /**
+     * Set of tagSpec ids that have been validated.
+     */
+    private Map<Integer, Boolean> tagspecsValidated;
+
+    /**
+     * Size of &lt;style amp-custom&gt;.
+     */
+    private int styleAmpCustomByteSize = 0;
+
+    /**
+     * Size of all inline styles (style attribute) combined.
+     */
+    private int inlineStyleByteSize = 0;
+
+    /**
+     * Set of type identifiers in this document.
+     */
+    private List<String> typeIdentifiers;
+
+    /**
+     * All the value set provisions so far.
+     */
+    private Set<String> valueSetsProvided;
+
+    /**
+     * All the value set requirements so far.
+     */
+    private Map<String, List<ValidatorProtos.ValidationError>> valueSetsRequired;
+
+    /**
+     * Set of conditions that we've satisfied.
+     */
+    private Map<String, Boolean> conditionsSatisfied;
+
+    /**
+     * First tag spec seen (matched) which contains an URL.
+     */
+    private ValidatorProtos.TagSpec firstUrlSeenTag = null;
+
+    /**
+     * Extension-specific context.
+     */
+    private ExtensionsContext extensions;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/CssLength.java b/validator/java/src/main/java/dev/amp/validator/CssLength.java
new file mode 100644
index 0000000000000..d37aa207694d2
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/CssLength.java
@@ -0,0 +1,158 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+
+/**
+ * Parses a width or height layout attribute, for the determining the layout
+ * of AMP tags.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class CssLength {
+    /**
+     * Constructor.
+     * @param input The input attribute value to be parsed.
+     * @param allowAuto Whether or not to allow the 'auto' value as a value.
+     * @param allowFluid whether or not to allow the 'fluid' value
+     *   as a value.
+     */
+    public CssLength(@Nonnull final String input, final boolean allowAuto, final boolean allowFluid) {
+        this.isValid = false;
+        this.isSet = false;
+        this.isAuto = false;
+        this.isFluid = false;
+        this.numeral = Float.NaN;
+        this.unit = "px";
+
+        if (input == null) {
+            this.isValid = true;
+            return;
+        }
+        this.isSet = true;
+        if (input.equals("auto")) {
+            this.isAuto = true;
+            this.isValid = allowAuto;
+            return;
+        } else if (input.equals("fluid")) {
+            this.isFluid = true;
+            this.isValid = allowFluid;
+        }
+
+        Matcher matcher = CSS_LENGTH_PATTERN.matcher(input);
+        if (matcher.matches()) {
+            this.isValid = true;
+            this.numeral = Float.parseFloat(matcher.group(1));
+            this.unit = matcher.group(2) != null ? matcher.group(2) : "px";
+        }
+    }
+
+    /**
+     * Returns isValid.
+     * @return returns boolean isSet.
+     */
+    public boolean isValid() {
+        return isValid;
+    }
+
+    /**
+     * Returns isSet.
+     * @return returns boolean isSet.
+     */
+    public boolean isSet() {
+        return isSet;
+    }
+
+    /**
+     * Returns isAuto.
+     * @return returns a float isAuto.
+     */
+    public boolean isAuto() {
+        return isAuto;
+    }
+
+    /**
+     * Returns a isFluid.
+     * @return returns a boolean isFluid.
+     */
+    public boolean isFluid() {
+        return isFluid;
+    }
+
+    /**
+     * Returns a isNumeral.
+     * @return returns a float isNumeral.
+     */
+    public Float getNumeral() {
+        return numeral;
+    }
+
+    /**
+     * Returns a isUnit.
+     * @return returns a String isUnit.
+     */
+    public String getUnit() {
+        return unit;
+    }
+
+    /**
+     * Whether the value or unit is invalid. Note that passing
+     * undefined as |input| is considered valid.
+     */
+    private boolean isValid;
+
+    /**
+     * Whether the attribute value is set.
+     */
+    private boolean isSet;
+
+    /**
+     * Whether the attribute value is 'auto'. This is a special value that
+     * indicates that the value gets derived from the context. In practice
+     * that's only ever the case for a width.
+     */
+    private boolean isAuto;
+
+    /**
+     * Whether the attribute value is 'fluid'
+     */
+    private boolean isFluid;
+
+    /**
+     * The numeric value.
+     */
+    private Float numeral;
+
+    /**
+     * The unit, 'px' being the default in case it's absent.
+     */
+    private String unit;
+
+    /** CSS length regex pattern. */
+    private static final Pattern CSS_LENGTH_PATTERN =
+            Pattern.compile("^(\\d+(?:\\.\\d+)?)(px|em|rem|vh|vw|vmin|vmax)?$");
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/DescendantConstraints.java b/validator/java/src/main/java/dev/amp/validator/DescendantConstraints.java
new file mode 100644
index 0000000000000..5f1beacf58c51
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/DescendantConstraints.java
@@ -0,0 +1,67 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+import java.util.List;
+
+/**
+ * Instances of this class specify which tag names (|allowedTags|)
+ * are allowed as descendent tags of a particular tag (|tagName|).
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class DescendantConstraints {
+    /**
+     * Constructor.
+     * @param tagName tag name.
+     * @param allowedTags allowed tags.
+     */
+    public DescendantConstraints(@Nonnull final String tagName, @Nonnull final List<String> allowedTags) {
+        this.tagName = tagName;
+        this.allowedTags = allowedTags;
+    }
+
+    /**
+     * Returns the tag name.
+     * @return returns the tag name.
+     */
+    public String getTagName() {
+        return tagName;
+    }
+
+    /**
+     * Returns the allowed tags.
+     * @return returns the allowed tags.
+     */
+    public List<String> getAllowedTags() {
+        return allowedTags;
+    }
+
+    /** A tag name. */
+    private final String tagName;
+
+    /** Allowed tags. */
+    private final List<String> allowedTags;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ErrorCodeMetadata.java b/validator/java/src/main/java/dev/amp/validator/ErrorCodeMetadata.java
new file mode 100644
index 0000000000000..5155e79de1b0a
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ErrorCodeMetadata.java
@@ -0,0 +1,75 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+/**
+ * Error code meta data data holder.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ErrorCodeMetadata {
+    /**
+     * Default constructor.
+     */
+    public ErrorCodeMetadata() {
+    }
+
+    /**
+     * Getting the format.
+     * @return returns the format.
+     */
+    public String getFormat() {
+        return format;
+    }
+
+    /**
+     * Setting the format.
+     * @param format the format.
+     */
+    public void setFormat(final String format) {
+        this.format = format;
+    }
+
+    /**
+     * Getting the specificity.
+     * @return returns the specificity.
+     */
+    public int getSpecificity() {
+        return specificity;
+    }
+
+    /**
+     * Setting the specificity.
+     * @param specificity the specificity.
+     */
+    public void setSpecificity(final int specificity) {
+        this.specificity = specificity;
+    }
+
+    /** The format. */
+    private String format;
+
+    /** The specificity. */
+    private int specificity;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ExitCondition.java b/validator/java/src/main/java/dev/amp/validator/ExitCondition.java
new file mode 100644
index 0000000000000..b12fefee805b3
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ExitCondition.java
@@ -0,0 +1,37 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+/**
+ * Exit condition enumeration types.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public enum ExitCondition {
+    /** Full parsing. */
+    FULL_PARSING,
+
+    /** Exit on first error. */
+    EXIT_ON_FIRST_ERROR;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ExtensionMissingError.java b/validator/java/src/main/java/dev/amp/validator/ExtensionMissingError.java
new file mode 100644
index 0000000000000..3c51357bcaf40
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ExtensionMissingError.java
@@ -0,0 +1,67 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+
+/**
+ * Extension missing error data.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ExtensionMissingError {
+    /**
+     * Default constructor.
+     * @param missingExtension missing extension.
+     * @param validationError  validation error.
+     */
+    public ExtensionMissingError(@Nonnull final String missingExtension,
+                                 @Nonnull final ValidatorProtos.ValidationError validationError) {
+        this.maybeError = validationError;
+        this.missingExtension = missingExtension;
+    }
+
+    /**
+     * Returns the missing extension generating the
+     * ExtensionMissingError.
+     * @return returns the missing extension.
+     */
+    public String getMissingExtension() {
+        return missingExtension;
+    }
+
+    /**
+     * Returns the ValidationError of ExtensionMissingError.
+     *  @return ValidationError basis of ExtensionMissingError.
+     */
+    public ValidatorProtos.ValidationError getMaybeError() {
+        return maybeError;
+    }
+
+    /** Missing extension. */
+    private String missingExtension;
+
+    /** Validation error. */
+    private ValidatorProtos.ValidationError maybeError;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ExtensionsContext.java b/validator/java/src/main/java/dev/amp/validator/ExtensionsContext.java
new file mode 100644
index 0000000000000..155ebed672867
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ExtensionsContext.java
@@ -0,0 +1,200 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.utils.TagSpecUtils;
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * The extensions context keeys track of the extensions that the validator has
+ * seen, as well as which have been used, which are required to be used, etc.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ExtensionsContext {
+    /**
+     * A constructor.
+     */
+    public ExtensionsContext() {
+        // |extensionsLoaded tracks the valid <script> tags loading
+        // amp extensions which were seen in the document's head. Most extensions
+        // are also added to |extensionsUnusedRequired| when encountered in the
+        // head. When a tag is seen later in the document which makes use of an
+        // extension, that extension is recorded in |extensionsUsed|.
+
+        this.extensionsLoaded = new HashMap<>();
+        extensionsLoaded.put("amp-ad", true);
+
+        this.extensionsUnusedRequired = new ArrayList<>();
+        this.extensionMissingErrors = new ArrayList<>();
+        this.extensionsUsed = new HashMap<>();
+    }
+
+    /**
+     * Returns a list of errors accrued while processing the
+     * head for tags requiring an extension which was not found.
+     * @return returns a list of errors found while processing head
+     */
+    public List<ValidatorProtos.ValidationError> missingExtensionErrors() {
+        final List<ValidatorProtos.ValidationError> out = new ArrayList<>();
+        for (final ExtensionMissingError err : this.extensionMissingErrors) {
+            if (!this.isExtensionLoaded(err.getMissingExtension())) {
+                out.add(err.getMaybeError());
+            }
+        }
+
+        return out;
+    }
+
+    /**
+     * Returns false if the named extension has not yet been loaded. Note that
+     * this assumes that all extensions will be loaded in the document earlier
+     * than their first usage. This is true for amp-foo tags, since the
+     * extension must be loaded in the head and amp-foo tags are not supported
+     * in the head as per HTML spec.
+     * @param extension to check for.
+     * @return returns true iff extension is loaded.
+     */
+    public boolean isExtensionLoaded(@Nonnull final String extension) {
+        return this.extensionsLoaded.containsKey(extension);
+    }
+
+    /**
+     * Returns a list of unused extensions which produce validation errors
+     * when unused.
+     * @return returns a list of unused extensions.
+     */
+    public List<String> unusedExtensionsRequired() {
+        // Compute Difference: extensionsUnusedRequired_ - extensionsUsed_
+        final List<String> out = new ArrayList<>();
+        for (final String extension : this.extensionsUnusedRequired) {
+            if (!(this.extensionsUsed.containsKey(extension))) {
+                out.add(extension);
+            }
+        }
+        Collections.sort(out);
+        return out;
+    }
+
+    /**
+     * Update ExtensionContext state when we encounter an amp extension or
+     * tag using an extension.
+     * @param result a ValidateTagResult.
+     */
+    public void updateFromTagResult(@Nonnull final ValidateTagResult result) {
+        if (result.getBestMatchTagSpec() == null) {
+            return;
+        }
+
+        final ParsedTagSpec parsedTagSpec = result.getBestMatchTagSpec();
+        final ValidatorProtos.TagSpec tagSpec = parsedTagSpec.getSpec();
+
+        // Keep track of which extensions are loaded.
+        if (tagSpec.hasExtensionSpec()) {
+            final ValidatorProtos.ExtensionSpec extensionSpec = tagSpec.getExtensionSpec();
+            // This is an always present field if extension spec is set.
+            final String extensionName = extensionSpec.getName();
+
+            // Record that we have encountered an extension 'load' tag. This will
+            // look like <script custom-element=amp-foo ...> or similar.
+            this.extensionsLoaded.put(extensionName, true);
+            switch (extensionSpec.getRequiresUsage()) {
+                case GRANDFATHERED: // Fallthrough intended:
+                case NONE:
+                    // This extension does not have usage demonstrated by a tag, for
+                    // example: amp-dynamic-css-classes
+                    break;
+                case ERROR:
+                    // TODO(powdercloud): Make enum proto defaults work in generated
+                    // javascript.
+                default: // Default is error
+                    // Record that a loaded extension indicates a new requirement:
+                    // namely that some tag must make use of this extension.
+                    this.extensionsUnusedRequired.add(extensionName);
+                    break;
+            }
+        }
+
+        // Record presence of a tag, such as <amp-foo> which requires the usage
+        // of an amp extension.
+        this.recordUsedExtensions(tagSpec.getRequiresExtensionList());
+    }
+
+    /**
+     * Records extensions that are used within the document.
+     * @param extensions the list of extensions.
+     */
+    public void recordUsedExtensions(@Nonnull final List<String> extensions) {
+        for (final String extension : extensions) {
+            this.extensionsUsed.put(extension, true);
+        }
+    }
+
+    /**
+     * Record a possible error to report once we have collected all
+     * extensions in the document. If the given extension is missing,
+     * then report the given error.
+     * @param parsedTagSpec parsed tag spec.
+     * @param lineCol a line/col.
+     */
+    public void recordFutureErrorsIfMissing(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                            @Nonnull final Locator lineCol) {
+        final ValidatorProtos.TagSpec tagSpec = parsedTagSpec.getSpec();
+        for (final String requiredExtension : tagSpec.getRequiresExtensionList()) {
+            if (!this.isExtensionLoaded(requiredExtension)) {
+                final ValidatorProtos.ValidationError.Builder error = ValidatorProtos.ValidationError.newBuilder();
+                error.setSeverity(ValidatorProtos.ValidationError.Severity.ERROR);
+                error.setCode(ValidatorProtos.ValidationError.Code.MISSING_REQUIRED_EXTENSION);
+                final List<String> params = new ArrayList<>();
+                params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                params.add(requiredExtension);
+                error.addAllParams(params);
+                error.setLine(lineCol.getLineNumber());
+                error.setCol(lineCol.getColumnNumber());
+                error.setSpecUrl(TagSpecUtils.getTagSpecUrl(tagSpec));
+
+                this.extensionMissingErrors.add(new ExtensionMissingError(requiredExtension, error.build()));
+            }
+        }
+    }
+
+    /** Used as a set, based on key names. */
+    private Map<String, Boolean> extensionsLoaded;
+
+   /** A list of extension unused required. */
+    private List<String> extensionsUnusedRequired;
+
+    /** Used as a set, based on key names. */
+    private Map<String, Boolean> extensionsUsed;
+
+    /** Missing errors extension. */
+    private List<ExtensionMissingError> extensionMissingErrors;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedAttrSpec.java b/validator/java/src/main/java/dev/amp/validator/ParsedAttrSpec.java
new file mode 100644
index 0000000000000..c29d06725165d
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedAttrSpec.java
@@ -0,0 +1,157 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.utils.AttributeSpecUtils;
+
+import javax.annotation.Nonnull;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * This wrapper class provides access to an AttrSpec and an attribute id which is unique within its context
+ * (e.g., it's unique within the ParsedTagSpec).
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedAttrSpec {
+    /**
+     * Constructor.
+     * @param attrSpec the AttrSpec.
+     * @param attrName attr name.
+     */
+    public ParsedAttrSpec(@Nonnull final ValidatorProtos.AttrSpec attrSpec, final String attrName) {
+        this.spec = attrSpec;
+        this.attrName = attrName;
+        this.valueUrlSpec = null;
+        this.valueProperties = null;
+        this.cssDeclarationByName = new HashMap<>();
+
+        for (final ValidatorProtos.CssDeclaration cssDeclaration : attrSpec.getCssDeclarationList()) {
+            if (cssDeclaration.getName() != null) {
+                this.cssDeclarationByName.put(cssDeclaration.getName(), cssDeclaration);
+            }
+        }
+    }
+
+    /**
+     * Returns unique name for this attr spec.
+     * @return returns unique name for this attr spec.
+     */
+    public String getAttrName() {
+        return this.attrName;
+    }
+
+    /**
+     * Returns the AttrSpec.
+     * @return returns this AttrSpec.
+     */
+    public ValidatorProtos.AttrSpec getSpec() {
+        return this.spec;
+    }
+
+    /**
+     * Returns the ParsedUrlSpec.
+     * @return returns the ParsedUrlSpec.
+     */
+    public ParsedUrlSpec getValueUrlSpec() {
+        if (this.valueUrlSpec == null) {
+            this.valueUrlSpec = new ParsedUrlSpec(this.spec.getValueUrl());
+        }
+        return this.valueUrlSpec;
+    }
+
+    /**
+     * Returns the ParsedValueProperties.
+     * @return returns the ParsedValueProperties.
+     */
+    public ParsedValueProperties getValuePropertiesOrNull() {
+        if (!this.spec.hasValueProperties()) {
+            return null;
+        }
+
+        if (this.valueProperties == null) {
+            this.valueProperties =
+                    new ParsedValueProperties(this.spec.getValueProperties());
+        }
+        return this.valueProperties;
+    }
+
+    /**
+     * Returns the CssDeclaration map.
+     * @return returns the CssDeclaration map.
+     */
+    public Map<String, ValidatorProtos.CssDeclaration> getCssDeclarationByName() {
+        return this.cssDeclarationByName;
+    }
+
+    /**
+     * Returns true if this AttrSpec should be used for the given type identifiers
+     * based on the AttrSpec's disabled_by or enabled_by fields.
+     * @param typeIdentifiers a list of type identifies.
+     * @return returns true if this AttrSpec should be used for the given type identifiers
+     * based on AttrSpec's disabled or enabled_by fields.
+     */
+    public boolean isUsedForTypeIdentifiers(@Nonnull final List<String> typeIdentifiers) {
+        return AttributeSpecUtils.isUsedForTypeIdentifiers(
+                typeIdentifiers, this.spec.getEnabledByList(), this.spec.getDisabledByList());
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.spec = null;
+        this.attrName = null;
+        this.valueUrlSpec = null;
+        this.valueProperties = null;
+        this.cssDeclarationByName = null;
+    }
+
+    /**
+     * AttributeSpec instance.
+     */
+    private ValidatorProtos.AttrSpec spec;
+
+    /**
+     * Globally unique attribute rule name.
+     */
+    private String attrName;
+
+    /**
+     * ParsedUrlSpec instance.
+     */
+    private ParsedUrlSpec valueUrlSpec;
+
+    /**
+     * ParsedValueProperties instance.
+     */
+    private ParsedValueProperties valueProperties;
+
+    /**
+     * CssDeclaration map.
+     */
+    private Map<String, ValidatorProtos.CssDeclaration> cssDeclarationByName;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedAttrSpecs.java b/validator/java/src/main/java/dev/amp/validator/ParsedAttrSpecs.java
new file mode 100644
index 0000000000000..4b94eb7dd551d
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedAttrSpecs.java
@@ -0,0 +1,126 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+import java.util.Collections;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * TagSpecs specify attributes that are valid for a particular tag.
+ * They can also reference lists of attributes (AttrLists), thereby
+ * sharing those definitions. This abstraction instantiates
+ * ParsedAttrSpec for each AttrSpec (from validator-*.protoascii, our
+ * specification file) exactly once, and provides quick access to the
+ * attr spec names as well, including for simple attr specs (those
+ * which only have a name but no specification for their value).
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedAttrSpecs {
+    /**
+     * Constructor.
+     *
+     * @param validatorManager the AMPValidatorManager instance.
+     */
+    public ParsedAttrSpecs(@Nonnull final AMPValidatorManager validatorManager) {
+        this.validatorManager = validatorManager;
+        this.parsedAttrSpecs = new HashMap<>();
+    }
+
+    /**
+     * Returns the ParsedAttrSpec.
+     *
+     * @param name     the attr spec name.
+     * @param value    the attr spec value.
+     * @param attrSpec the AttributeSpec.
+     * @return returns the ParsedAttrSpec.
+     */
+    public ParsedAttrSpec getParsedAttrSpec(@Nonnull final String name,
+                                            @Nonnull final String value,
+                                            @Nonnull final ValidatorProtos.AttrSpec attrSpec) {
+        final String key = name + value;
+        if (this.parsedAttrSpecs.containsKey(key)) {
+            return parsedAttrSpecs.get(key);
+        }
+
+        final ParsedAttrSpec parsed = new ParsedAttrSpec(attrSpec, name);
+        this.parsedAttrSpecs.put(key, parsed);
+
+        return parsed;
+    }
+
+    /**
+     * Returns the attr list by name.
+     *
+     * @param name the attr list name.
+     * @return returns the attr list.
+     */
+    public List<ValidatorProtos.AttrSpec> getAttrListByName(@Nonnull final String name) {
+        ValidatorProtos.AttrList attrList = validatorManager.getAttrListMap().get(name);
+        if (attrList != null) {
+            return attrList.getAttrsList();
+        }
+
+        return Collections.emptyList();
+    }
+
+    /**
+     * Returns the global attr list.
+     *
+     * @return returns the global attr list.
+     */
+    public List<ValidatorProtos.AttrSpec> getGlobalAttrs() {
+        return validatorManager.getGlobalAttrs();
+    }
+
+    /**
+     * Returns the AmpLayout attr list.
+     *
+     * @return returns the AmpLayout attr list.
+     */
+    public List<ValidatorProtos.AttrSpec> getAmpLayoutAttrs() {
+        return validatorManager.getAmpLayoutAttrs();
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.parsedAttrSpecs = null;
+    }
+
+    /**
+     * AMPValidatorManager instance.
+     */
+    private final AMPValidatorManager validatorManager;
+
+    /**
+     * The already instantiated ParsedAttrSpec instances, indexed by
+     * attr spec name.
+     */
+    private Map<String, ParsedAttrSpec> parsedAttrSpecs;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedHtmlTag.java b/validator/java/src/main/java/dev/amp/validator/ParsedHtmlTag.java
new file mode 100644
index 0000000000000..d9d35bca8eb84
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedHtmlTag.java
@@ -0,0 +1,131 @@
+package dev.amp.validator;
+
+import org.xml.sax.Attributes;
+
+import javax.annotation.Nonnull;
+import java.util.HashMap;
+
+/**
+ * The AMP HTML ParsedHtmlTag class.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedHtmlTag {
+    /**
+     * Constructor.
+     *
+     * @param tagName the name of the underlying tag in html document.
+     * @param attributes the attributes attached to the element.  If
+     *  there are no attributes, it shall be an empty Attributes object.
+     */
+    public ParsedHtmlTag(@Nonnull final String tagName, @Nonnull final Attributes attributes) {
+        this.tagName = tagName.toUpperCase();
+        this.attrs = attributes;
+        this.attrsByKey = null;
+    }
+
+    /**
+     * Lower-case tag name.
+     * @return returns a lower case tag name.
+     */
+    public String lowerName() {
+        return this.tagName.toLowerCase();
+    }
+
+    /**
+     * Returns an array of attributes. Each attribute has two fields: name and
+     * value. Name is always lower-case, value is the case from the original
+     * document. Values are unescaped.
+     * @return returns the attributes.
+     */
+    public Attributes attrs() {
+        return this.attrs;
+    }
+
+    /**
+     * Returns an object mapping attribute name to attribute value. This is
+     * populated lazily, as it's not used for most tags.
+     * @return a HashMap of attribute name to attribute value
+     * */
+    public HashMap<String, String> attrsByKey() {
+        if (this.attrsByKey == null) {
+            this.attrsByKey = new HashMap<>();
+            for (int i = 0; i < attrs.getLength(); i++) {
+                this.attrsByKey.put(attrs.getLocalName(i), attrs.getValue(i));
+            }
+        }
+        return this.attrsByKey;
+    }
+
+    /**
+     * Returns a duplicate attribute name if the tag contains two attributes
+     * named the same, but with different attribute values. Same attribute name
+     * AND value is OK. Returns null if there are no such duplicate attributes.
+     * @return returns a duplicate attribute name if the tag contains two attributes named the same.
+     */
+    public String hasDuplicateAttrs() {
+        String lastAttrName = "";
+        String lastAttrValue = "";
+        for (int i = 0; i < attrs.getLength(); i++) {
+            if (lastAttrName.equals(attrs.getLocalName(i))
+                    && !lastAttrValue.equals(attrs.getValue(i))) {
+                return attrs.getLocalName(i);
+            }
+            lastAttrName = attrs.getLocalName(i);
+            lastAttrValue = attrs.getValue(i);
+        }
+        return null;
+    }
+
+    /**
+     * Need to replace the value with an empty string if attr name is equal to the value.
+     * @param attrName attr name.
+     * @param index index to the Attributes.
+     * @return returns the value.
+     */
+    public String getValue(@Nonnull final String attrName, final int index) {
+        String val = attrs.getValue(index);
+        if (val != null && val.equals(attrName.toLowerCase())) {
+            return "";
+        }
+
+        return val;
+    }
+
+    /**
+     * Method to nullify object values.
+     */
+    public void cleanup() {
+        this.tagName = null;
+        this.attrsByKey = null;
+    }
+
+    /**
+     * Upper-case tag name.
+     * @return returns a upper case tag name.
+     */
+    public String upperName() {
+        return this.tagName.toUpperCase();
+    }
+
+    /**
+     * Returns true if tag name length is zero.
+     * @return returns true if tag name length is zero.
+     */
+    public boolean isEmpty() {
+        return this.tagName.length() == 0;
+    }
+
+    /** The parsed tag name. */
+    @Nonnull
+    private String tagName;
+
+    /** The attributes. */
+    @Nonnull
+    private final Attributes attrs;
+
+    /** Lazily allocated map from attribute name to value */
+    private HashMap<String, String> attrsByKey;
+}
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedReferencePoints.java b/validator/java/src/main/java/dev/amp/validator/ParsedReferencePoints.java
new file mode 100644
index 0000000000000..a2d1f7f7d924e
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedReferencePoints.java
@@ -0,0 +1,103 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.utils.TagSpecUtils;
+
+import javax.annotation.Nonnull;
+import java.util.List;
+
+/**
+ * Holds the reference points for a particular parent tag spec, including
+ * their resolved TagSpec ids.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedReferencePoints {
+    /**
+     * Constructor.
+     * @param parentTagSpec the parent TagSpec.
+     */
+    public ParsedReferencePoints(@Nonnull final ValidatorProtos.TagSpec parentTagSpec) {
+        this.parentTagSpec = parentTagSpec;
+    }
+
+    /**
+     * Return the reference points list.
+     *
+     * @return returns the reference points list.
+     */
+    public List<ValidatorProtos.ReferencePoint> iterate() {
+        return this.parentTagSpec.getReferencePointsList();
+    }
+
+    /**
+     * Return true if the parent tag spec's reference point size is empty.
+     *
+     * @return returns true if parent tag spec's reference point size is empty.
+     */
+    public boolean empty() {
+        return this.size() == 0;
+    }
+
+    /**
+     * Returns the parent tag spec's reference points size.
+     *
+     * @return returns the parent tag spec's reference points size.
+     */
+    public int size() {
+        return this.parentTagSpec.getReferencePointsCount();
+    }
+
+    /**
+     * Returns the parent's tag spec url.
+     *
+     * @return returns the parent's tag spec url.
+     */
+    public String parentSpecUrl() {
+        return TagSpecUtils.getTagSpecUrl(this.parentTagSpec);
+    }
+
+    /**
+     * Returns the parent's tag spec name.
+     *
+     * @return returns the parent's tag spec name.
+     */
+    public String parentTagSpecName() {
+        return TagSpecUtils.getTagSpecName(this.parentTagSpec);
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.parentTagSpec = null;
+    }
+
+    /**
+     * The parent TagSpec.
+     */
+    @Nonnull
+    private ValidatorProtos.TagSpec parentTagSpec;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedTagSpec.java b/validator/java/src/main/java/dev/amp/validator/ParsedTagSpec.java
new file mode 100644
index 0000000000000..1d684b988ac05
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedTagSpec.java
@@ -0,0 +1,460 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import com.google.protobuf.ProtocolStringList;
+import dev.amp.validator.utils.AttributeSpecUtils;
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.HashSet;
+import java.util.List;
+import java.util.Map;
+import java.util.Set;
+
+/**
+ * This class provides access to a TagSpec and a tag id
+ * which is unique within its context, the ParsedValidatorRules.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedTagSpec {
+    /**
+     * Constructor.
+     * @param parsedAttrSpecs the ParsedAttrSpecs instance.
+     * @param shouldRecordTagsValidated  a record validated value to determine if record tag should validate.
+     * @param tagSpec the TagSpec.
+     * @param id the id.
+     */
+    public ParsedTagSpec(@Nonnull final ParsedAttrSpecs parsedAttrSpecs,
+                         @Nonnull final RecordValidated shouldRecordTagsValidated,
+                         @Nonnull final ValidatorProtos.TagSpec tagSpec, final int id) {
+        this.spec = tagSpec;
+        this.id = id;
+        this.referencePoints = new ParsedReferencePoints(tagSpec);
+        this.isReferencePoint = (tagSpec.getTagName().equals("$REFERENCE_POINT"));
+        this.isTypeJson = false;
+        this.shouldRecordTagspecValidated = shouldRecordTagsValidated;
+        this.attrsCanSatisfyExtension = false;
+        this.attrsByName = new HashMap<>();
+        this.mandatoryAttrs = new HashSet<>();
+        this.mandatoryAnyofs = new HashSet<>();
+        this.mandatoryOneofs = new HashSet<>();
+        this.implicitAttrspecs = new ArrayList<>();
+        this.containsUrl = false;
+
+        // Collect the attr spec ids for a given |tagspec|.
+        // There are four ways to specify attributes:
+        // (1) implicitly by a tag spec, if the tag spec has the amp_layout field
+        // set - in this case, the AMP_LAYOUT_ATTRS are assumed;
+        // (2) within a TagSpec::attrs;
+        // (3) via TagSpec::attr_lists which references lists by key;
+        // (4) within the $GLOBAL_ATTRS TagSpec::attr_list.
+        // It's possible to provide multiple specifications for the same attribute
+        // name, but for any given tag only one such specification can be active.
+        // The precedence is (1), (2), (3), (4)
+        // If tagSpec.explicitAttrsOnly is true then only collect the attributes
+        // from (2) and (3).
+
+        // (1) layout attrs (except when explicitAttrsOnly is true).
+        if (!tagSpec.hasExplicitAttrsOnly() && tagSpec.getAmpLayout() != null
+                && !this.isReferencePoint) {
+            this.mergeAttrs(parsedAttrSpecs.getAmpLayoutAttrs(), parsedAttrSpecs);
+        }
+        // (2) attributes specified within |tagSpec|.
+        this.mergeAttrs(tagSpec.getAttrsList(), parsedAttrSpecs);
+
+        // (3) attributes specified via reference to an attr_list.
+        for (final String attrLists : tagSpec.getAttrListsList()) {
+            this.mergeAttrs(parsedAttrSpecs.getAttrListByName(attrLists), parsedAttrSpecs);
+        }
+        // (4) attributes specified in the global_attr list (except when
+        // explicitAttrsOnly is true).
+        if (!tagSpec.hasExplicitAttrsOnly() && !this.isReferencePoint) {
+            this.mergeAttrs(parsedAttrSpecs.getGlobalAttrs(), parsedAttrSpecs);
+        }
+    }
+
+    /**
+     * Getting the TagSpec.
+     *
+     * @return returns the TagSpec.
+     */
+    public ValidatorProtos.TagSpec getSpec() {
+        return spec;
+    }
+
+    /**
+     * If tag has a cdata spec, returns a CdataMatcher, else null.
+     * @param lineCol the pair of line/col.
+     * @return CdataMatcher returns CdataMatcher object.
+     */
+    public CdataMatcher cdataMatcher(@Nonnull final Locator lineCol) {
+        if (this.spec.getCdata() != null) {
+            return new CdataMatcher(this, lineCol);
+        }
+
+        return null;
+    }
+
+    /**
+     * If tag has a child_tag spec, returns a ChildTagMatcher, else null.
+     * @throws TagValidationException the TagValidationException.
+     * @return ChildTagMatcher returns the ChildTagMatcher.
+     */
+    public ChildTagMatcher childTagMatcher() throws TagValidationException {
+        if (this.spec.hasChildTags()) {
+            return new ChildTagMatcher(this.spec);
+        }
+        return null;
+    }
+
+    /**
+     * If tag has a reference_point spec, returns a ReferencePointMatcher,
+     * else null.
+     * @param rules the ParsedValidatorRules object.
+     * @param lineCol the pair of line/col.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the ReferencePointMatcher object.
+     */
+    public ReferencePointMatcher referencePointMatcher(@Nonnull final ParsedValidatorRules rules,
+                                                       @Nonnull final Locator lineCol)
+            throws TagValidationException {
+        if (this.hasReferencePoints()) {
+            return new ReferencePointMatcher(rules, this.referencePoints, lineCol);
+        }
+        return null;
+    }
+
+    /**
+     * Returns true if this tagSpec contains an attribute of name "type" and value
+     * "application/json".
+     * @return returns true if this tagSpec contains an attribute of name "type"
+     * and value "application/json.".
+     */
+    public boolean isTypeJson() {
+        return this.isTypeJson;
+    }
+
+    /**
+     * Return the parsed tag id.
+     * @return returns the parsed tag id.
+     */
+    public int getId() {
+        return id;
+    }
+
+    /**
+     * Returns true if this TagSpec should be used for the given type identifiers
+     * based on the TagSpec's disabled_by or enabled_by fields.
+     * @param typeIdentifiers the list of identifiers.
+     * @return returns true if this tagSpec should be used for the given type identifiers.
+     */
+    public boolean isUsedForTypeIdentifiers(@Nonnull final List<String> typeIdentifiers) {
+        return AttributeSpecUtils.isUsedForTypeIdentifiers(
+                typeIdentifiers, this.spec.getEnabledByList(), this.spec.getDisabledByList());
+    }
+
+    /**
+     * A TagSpec may specify other tags to be required as well, when that
+     * tag is used. This accessor returns the IDs for the tagspecs that
+     * are also required if |this| tag occurs in the document, but where
+     * such requirement is currently only a warning.
+     * @return returns a list of requires tag warning list.
+     */
+    public List<String> getAlsoRequiresTagWarning() {
+        return this.spec.getAlsoRequiresTagWarningList();
+    }
+
+    /**
+     * A TagSpec may specify generic conditions which are required if the
+     * tag is present. This accessor returns the list of those conditions.
+     * @return returns requires list.
+     */
+    public List<String> requires() {
+        return this.spec.getRequiresList();
+    }
+
+    /**
+     * A TagSpec may specify that another tag is excluded. This accessor returns
+     * the list of those tags.
+     * @return returns excludes list.
+     */
+    public List<String> excludes() {
+        return this.spec.getExcludesList();
+    }
+
+    /**
+     * Returns true if this tagSpec contains a value_url field.
+     * @return returns true if this tagSpec contains a value_url field.
+     */
+    public boolean containsUrl() {
+        return this.containsUrl;
+    }
+
+    /**
+     * Whether or not the tag should be recorded via
+     * Context.recordTagspecValidated_ if it was validated
+     * successfully. For performance, this is only done for tags that are
+     * mandatory, unique, or possibly required by some other tag.
+     * @return returns a record validated enumeration whether or not the tag should be recorded.
+     */
+    public RecordValidated shouldRecordTagspecValidated() {
+        return this.shouldRecordTagspecValidated;
+    }
+
+    /**
+     * Returns a boolean whether the this tagSpec has reference point.
+     *
+     * @return returns a boolean whether the this tagSpec has reference point.
+     */
+    public boolean isReferencePoint() {
+        return this.isReferencePoint;
+    }
+
+    /**
+     * Return true if reference points not empty. Else return false.
+     * @return Returns true if reference points not empty. Else return false.
+     */
+    public boolean hasReferencePoints() {
+        return !this.referencePoints.empty();
+    }
+
+    /** @return returns ParsedReferencePoints object. */
+    public ParsedReferencePoints getReferencePoints() {
+        return this.referencePoints;
+    }
+
+    /** @return returns if this tagSpec can satisfy extension. */
+    public boolean attrsCanSatisfyExtension() {
+        return this.attrsCanSatisfyExtension;
+    }
+
+    /**
+     * Returns if attrsByName contains the mapping keyed name.
+     * @param name attribute name.
+     * @return returns if attrsByName contains the mapping keyed name.
+     */
+    public boolean hasAttrWithName(@Nonnull final String name) {
+        return attrsByName.containsKey(name);
+    }
+
+    /**
+     * Returns the implicit attr specs.
+     * @return returns the implicit attr specs.
+     */
+    public List<ValidatorProtos.AttrSpec> getImplicitAttrspecs() {
+        return this.implicitAttrspecs;
+    }
+
+    /**
+     * Returns the map of attrs by name.
+     * @return returns the map of attrs by name.
+     */
+    public Map<String, ValidatorProtos.AttrSpec> getAttrsByName() {
+        return this.attrsByName;
+    }
+
+    /**
+     * Returns the set of mandatoryOneofs.
+     * @return returns the set of mandatoryOneofs.
+     */
+    public Set<String> getMandatoryOneofs() {
+        return this.mandatoryOneofs;
+    }
+
+    /**
+     * Returns the set of mandatoryAnyofs.
+     * @return returns the set of mandatoryAnyofs.
+     */
+    public Set<String> getMandatoryAnyofs() {
+        return this.mandatoryAnyofs;
+    }
+
+    /**
+     * Returns the set of mandatoryAttrs.
+     * @return returns the set of mandatoryAttrs.
+     */
+    public Set<ValidatorProtos.AttrSpec> getMandatoryAttrIds() {
+        return this.mandatoryAttrs;
+    }
+
+    /**
+     * Merges the list of attrs into attrsByName, avoiding to merge in attrs
+     * with names that are already in attrsByName.
+     * @param attrs the list of attr specs.
+     * @param parsedAttrSpecs the ParsedAttrSpec object.
+     */
+    private void mergeAttrs(final List<ValidatorProtos.AttrSpec> attrs, final ParsedAttrSpecs parsedAttrSpecs) {
+        for (ValidatorProtos.AttrSpec attrSpec : attrs) {
+            final String name = attrSpec.getName();
+            if (attrsByName.containsKey(name)) {
+                continue;
+            }
+
+            attrsByName.put(name, attrSpec);
+            if (attrSpec.getName() != null
+                    && attrSpec.getAllFields().size() == 1) { // negative attr ids are simple attrs (only name set).
+                continue;
+            }
+
+            if (attrSpec.getValueCaseiCount() > 0) {
+                for (final String valueCasei : attrSpec.getValueCaseiList()) {
+                    populateAttrSpec(name, valueCasei, parsedAttrSpecs, attrSpec);
+                }
+            } else {
+                populateAttrSpec(name, "", parsedAttrSpecs, attrSpec);
+            }
+        }
+    }
+
+    /**
+     * Returns the parsed tag spec id.
+     * @return tag spec id.
+     */
+    public int id() {
+        return this.id;
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.spec = null;
+        this.referencePoints = null;
+        this.attrsByName = null;
+        this.mandatoryAttrs = null;
+        this.mandatoryOneofs = null;
+        this.mandatoryAnyofs = null;
+        this.implicitAttrspecs = null;
+    }
+
+    private void populateAttrSpec(@Nonnull final String name, @Nonnull final String value,
+                                  @Nonnull final ParsedAttrSpecs parsedAttrSpecs,
+                                  @Nonnull final ValidatorProtos.AttrSpec attrSpec) {
+        final ParsedAttrSpec attr = parsedAttrSpecs.getParsedAttrSpec(name, value, attrSpec);
+        if (attr != null) {
+            final ValidatorProtos.AttrSpec spec = attr.getSpec();
+            if (spec.hasMandatory()) {
+                this.mandatoryAttrs.add(spec);
+            }
+            if (spec.hasMandatoryOneof()) {
+                this.mandatoryOneofs.add(spec.getMandatoryOneof());
+            }
+            if (spec.hasMandatoryAnyof()) {
+                this.mandatoryAnyofs.add(spec.getMandatoryAnyof());
+            }
+
+            ProtocolStringList protocolStringList = spec.getAlternativeNamesList();
+            for (final String altName : protocolStringList) {
+                this.attrsByName.put(altName, attrSpec);
+            }
+            if (spec.hasImplicit()) {
+                this.implicitAttrspecs.add(attrSpec);
+            }
+            if (spec.getName().equals("type") && spec.getValueCaseiList().size() > 0) {
+                for (final String v : spec.getValueCaseiList()) {
+                    if ("application/json".equals(v)) {
+                        this.isTypeJson = true;
+                        break;
+                    }
+                }
+            }
+            if (spec.hasValueUrl()) {
+                this.containsUrl = true;
+            }
+            if (spec.getRequiresExtensionList().size() > 0) {
+                this.attrsCanSatisfyExtension = true;
+            }
+        }
+    }
+
+    /**
+     * The TagSpec.
+     */
+    private ValidatorProtos.TagSpec spec;
+
+    /**
+     * A unique tag id.
+     */
+    private int id;
+
+    /**
+     * The ParsedReferencePoints.
+     */
+    private ParsedReferencePoints referencePoints;
+
+    /**
+     * Reference point flag.
+     */
+    private boolean isReferencePoint;
+
+    /**
+     * Type json flag.
+     */
+    private boolean isTypeJson;
+
+    /**
+     * Should record tags validated.
+     */
+    private RecordValidated shouldRecordTagspecValidated;
+
+    /**
+     * A flag to indicate if attrs can satisfy extension.
+     */
+    private boolean attrsCanSatisfyExtension;
+
+    /**
+     * ParsedAttributes keyed by name.
+     */
+    private Map<String, ValidatorProtos.AttrSpec> attrsByName;
+
+    /**
+     * Attributes that are mandatory for this tag to legally validate.
+     */
+    private Set<ValidatorProtos.AttrSpec> mandatoryAttrs;
+
+    /**
+     * A list of mandatory one ofs.
+     */
+    private Set<String> mandatoryOneofs;
+
+    /**
+     * A list of mandatory any ofs.
+     */
+    private Set<String> mandatoryAnyofs;
+
+    /**
+     * A list of implicit attr specs.
+     */
+    private List<ValidatorProtos.AttrSpec> implicitAttrspecs;
+
+    /**
+     * Flag to indicate whether it contains an url.
+     */
+    private boolean containsUrl;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedUrlSpec.java b/validator/java/src/main/java/dev/amp/validator/ParsedUrlSpec.java
new file mode 100644
index 0000000000000..33884577d8dcc
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedUrlSpec.java
@@ -0,0 +1,89 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+import java.util.HashSet;
+import java.util.Set;
+
+/**
+ * ParsedUrlSpec is used for both ParsedAttrSpec and ParsedCdataSpec, to
+ * check URLs.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedUrlSpec {
+    /**
+     * Constructor.
+     *
+     * @param urlSpec the UrlSpec.
+     */
+    public ParsedUrlSpec(@Nonnull final ValidatorProtos.UrlSpec urlSpec) {
+        this.spec = urlSpec;
+        this.allowedProtocols = new HashSet<>();
+        if (this.spec != null) {
+            for (final String protocol : spec.getProtocolList()) {
+                allowedProtocols.add(protocol);
+            }
+        }
+    }
+
+    /**
+     * Returns the UrlSpec.
+     *
+     * @return returns the UrlSpec.
+     */
+    public ValidatorProtos.UrlSpec getSpec() {
+        return this.spec;
+    }
+
+    /**
+     * Returns true if the protocol is found.
+     *
+     * @param protocol the allowed protocol.
+     * @return returns true if the protocol is found.
+     */
+    public boolean isAllowedProtocol(final String protocol) {
+        return allowedProtocols.contains(protocol);
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.allowedProtocols = null;
+    }
+
+    /**
+     * The UrlSpec.
+     */
+    @Nonnull
+    private ValidatorProtos.UrlSpec spec;
+
+    /**
+     * A set of allowed protocols.
+     */
+    @Nonnull
+    private Set<String> allowedProtocols;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedValidatorRules.java b/validator/java/src/main/java/dev/amp/validator/ParsedValidatorRules.java
new file mode 100644
index 0000000000000..bf1087ed0256b
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedValidatorRules.java
@@ -0,0 +1,947 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.exception.ValidatorException;
+import dev.amp.validator.utils.AttributeSpecUtils;
+import dev.amp.validator.utils.DispatchKeyUtils;
+import dev.amp.validator.utils.TagSpecUtils;
+import org.xml.sax.Attributes;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+import java.util.Set;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+
+/**
+ * This wrapper class provides access to the validation rules.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedValidatorRules {
+    /**
+     * Constructor.
+     * @param htmlFormat the HTML format.
+     * @param ampValidatorManager the AMPValidatorManager instance.
+     */
+    public ParsedValidatorRules(@Nonnull final ValidatorProtos.HtmlFormat.Code htmlFormat,
+                                @Nonnull final AMPValidatorManager ampValidatorManager) {
+        this.ampValidatorManager = ampValidatorManager;
+
+        this.htmlFormat = htmlFormat;
+        this.parsedTagSpecById = new HashMap<>();
+        this.tagSpecByTagName = new HashMap<>();
+        this.mandatoryTagSpecs = new ArrayList<>();
+        this.fullMatchRegexes = new HashMap<>();
+        this.fullMatchCaseiRegexes = new HashMap<>();
+        this.partialMatchCaseiRegexes = new HashMap<>();
+
+        this.typeIdentifiers = new HashMap<>();
+        typeIdentifiers.put("⚡", 0);
+        typeIdentifiers.put("amp", 0);
+        typeIdentifiers.put("⚡4ads", 0);
+        typeIdentifiers.put("amp4ads", 0);
+        typeIdentifiers.put("⚡4email", 0);
+        typeIdentifiers.put("amp4email", 0);
+        typeIdentifiers.put("actions", 0);
+        typeIdentifiers.put("transformed", 0);
+        typeIdentifiers.put("data-ampdevmode", 0);
+
+        expandExtensionSpec();
+
+        this.parsedAttrSpecs = new ParsedAttrSpecs(ampValidatorManager);
+
+        this.tagSpecIdsToTrack = new HashMap<>();
+        final int numTags = this.ampValidatorManager.getRules().getTagsList().size();
+        for (int tagSpecId = 0; tagSpecId < numTags; ++tagSpecId) {
+            final ValidatorProtos.TagSpec tag = this.ampValidatorManager.getRules().getTags(tagSpecId);
+            if (!this.isTagSpecCorrectHtmlFormat(tag)) {
+                continue;
+            }
+
+            if (tag.hasSpecName()) {
+                tagSpecNameToSpecId.put(tag.getSpecName(), tagSpecId);
+            }
+
+            if (tag.getAlsoRequiresTagWarningList().size() > 0) {
+                this.tagSpecIdsToTrack.put(tagSpecId, true);
+            }
+
+            for (String otherTag : tag.getAlsoRequiresTagWarningList()) {
+                this.tagSpecIdsToTrack.put(otherTag, true);
+            }
+
+            if (!tag.getTagName().equals("$REFERENCE_POINT")) {
+                if (!(tagSpecByTagName.containsKey(tag.getTagName()))) {
+                    this.tagSpecByTagName.put(tag.getTagName(), new TagSpecDispatch());
+                }
+
+                final TagSpecDispatch tagnameDispatch = this.tagSpecByTagName.get(tag.getTagName());
+                if (tag.hasExtensionSpec()) {
+                    // This tag is an extension. Compute and register a dispatch key
+                    // for it.
+                    String dispatchKey = DispatchKeyUtils.makeDispatchKey(
+                            ValidatorProtos.AttrSpec.DispatchKeyType.NAME_VALUE_DISPATCH,
+                            AttributeSpecUtils.getExtensionNameAttribute(tag.getExtensionSpec()),
+                            tag.getExtensionSpec().getName(), "");
+                    tagnameDispatch.registerDispatchKey(dispatchKey, tagSpecId);
+                } else {
+                    String dispatchKey = this.ampValidatorManager.getDispatchKeyByTagSpecId(tagSpecId);
+                    if (dispatchKey == null) {
+                        tagnameDispatch.registerTagSpec(tagSpecId);
+                    } else {
+                        tagnameDispatch.registerDispatchKey(dispatchKey, tagSpecId);
+                    }
+                }
+            }
+
+            if (tag.hasMandatory()) {
+                this.mandatoryTagSpecs.add(tagSpecId);
+            }
+        }
+
+        this.errorCodes = new HashMap<>();
+        for (int i = 0; i < this.ampValidatorManager.getRules().getErrorFormatsList().size(); ++i) {
+            final ValidatorProtos.ErrorFormat errorFormat =
+                    this.ampValidatorManager.getRules().getErrorFormats(i);
+            if (errorFormat != null) {
+                ErrorCodeMetadata errorCodeMetadata = new ErrorCodeMetadata();
+                errorCodeMetadata.setFormat(errorFormat.getFormat());
+                errorCodes.put(errorFormat.getCode(), errorCodeMetadata);
+            }
+        }
+
+        for (int i = 0; i < this.ampValidatorManager.getRules().getErrorSpecificityList().size(); ++i) {
+            final ValidatorProtos.ErrorSpecificity errorSpecificity =
+                    this.ampValidatorManager.getRules().getErrorSpecificity(i);
+            if (errorSpecificity != null) {
+                ErrorCodeMetadata errorCodeMetadata = errorCodes.get(errorSpecificity.getCode());
+                if (errorCodeMetadata != null) {
+                    errorCodeMetadata.setSpecificity(errorSpecificity.getSpecificity());
+                }
+            }
+        }
+    }
+
+    /**
+     * TODO - verify ALL regex getXXX() to ensure proper implementation
+     * @param regex the regex.
+     * @return returns the full match regex pattern.
+     */
+    public Pattern getFullMatchRegex(@Nonnull final String regex) {
+        String regexEscape = regex.replace("{", "\\{");
+
+        for (String fullMatchRegex : fullMatchRegexes.keySet()) {
+            if (fullMatchRegex.equals(regex))  {
+                return fullMatchRegexes.get(regexEscape);
+            }
+        }
+        String fullMatchRegex = "^(" + regexEscape + ")$";
+        Pattern pattern = Pattern.compile(fullMatchRegex);
+        fullMatchRegexes.put(regexEscape, pattern);
+
+        return pattern;
+    }
+
+    /**
+     * @param caseiRegex case insensitive regex.
+     * @return returns the full match case insensitive regex pattern.
+     */
+    public Pattern getFullMatchCaseiRegex(@Nonnull final String caseiRegex) {
+        String caseiRegexEscape = caseiRegex.replace("{", "\\{");
+
+        for (String fullMatchRegex : fullMatchCaseiRegexes.keySet()) {
+            if (fullMatchRegex.equals(caseiRegexEscape))  {
+                return fullMatchCaseiRegexes.get(caseiRegexEscape);
+            }
+        }
+
+        Pattern pattern = Pattern.compile("^(" + caseiRegexEscape + ")$");
+        this.fullMatchCaseiRegexes.put(caseiRegexEscape, pattern);
+        return pattern;
+    }
+
+    /**
+     * Returns the partial match case insensitive match regex pattern.
+     *
+     * @param caseiRegex the regex.
+     * @return returns the partial match case insensitive match regex pattern.
+     */
+    public Pattern getPartialMatchCaseiRegex(@Nonnull final String caseiRegex) {
+        final String caseiRegexEscape = caseiRegex.replace("{", "\\{");
+
+        for (String fullMatchRegex : partialMatchCaseiRegexes.keySet()) {
+            if (fullMatchRegex.equals(caseiRegexEscape))  {
+                return partialMatchCaseiRegexes.get(caseiRegexEscape);
+            }
+        }
+
+        Pattern pattern = Pattern.compile(caseiRegexEscape);
+        partialMatchCaseiRegexes.put(caseiRegexEscape, pattern);
+
+        return pattern;
+    }
+
+    /**
+     * Computes the name for a given reference point.
+     * Used in generating error strings.
+     * @param referencePoint the reference point.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the compute name for a given reference point.
+     */
+    public String getReferencePointName(@Nonnull final ValidatorProtos.ReferencePoint referencePoint)
+            throws TagValidationException {
+        // tagSpecName here is actually a number, which was replaced in
+        // validator_gen_js.py from the name string, so this works.
+        final int tagSpecId =
+                ampValidatorManager.getTagSpecIdByReferencePointTagSpecName(referencePoint.getTagSpecName());
+        final ParsedTagSpec refPointSpec = this.getByTagSpecId(tagSpecId);
+        return TagSpecUtils.getTagSpecName(refPointSpec.getSpec());
+    }
+
+    /**
+     * Return the ParsedTagSpec given the reference point spec name.
+     * @param specName the spec name.
+     * @throws TagValidationException the TagValidationException.
+     * @return return the ParsedTagSpec given the reference point spec name.
+     */
+    public ParsedTagSpec getByTagSpecId(final String specName) throws TagValidationException {
+        int tagSpecId = this.ampValidatorManager.getTagSpecIdByReferencePointTagSpecName(specName);
+        return getByTagSpecId(tagSpecId);
+    }
+
+    /**
+     * Returns the spec id by spec name.
+     * @param specName the spec name.
+     * @return returns the spec id if exists.
+     */
+    public Integer getTagSpecIdBySpecName(@Nonnull final String specName) {
+        return tagSpecNameToSpecId.get(specName);
+    }
+
+    /**
+     * Returns the ParsedTagSpec given the tag spec id.
+     * @param id tag spec id.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the ParsedTagSpec.
+     */
+    public ParsedTagSpec getByTagSpecId(final int id) throws TagValidationException {
+        ParsedTagSpec parsed = this.parsedTagSpecById.get(id);
+        if (parsed != null) {
+            return parsed;
+        }
+
+        ValidatorProtos.TagSpec tag = this.ampValidatorManager.getRules().getTags(id);
+        if (tag == null) {
+            throw new TagValidationException("TagSpec is null for tag spec id " + id);
+        }
+
+        parsed = new ParsedTagSpec(
+                this.parsedAttrSpecs,
+                TagSpecUtils.shouldRecordTagspecValidated(tag, id, this.tagSpecIdsToTrack), tag,
+                id);
+        this.parsedTagSpecById.put(id, parsed);
+        return parsed;
+    }
+
+    /**
+     * Returns the tag spec id by reference point tag spec name.
+     * @param tagName the reference point tag name.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the tag spec id by reference point tag spec name.
+     */
+    public int getTagSpecIdByReferencePointTagSpecName(@Nonnull final String tagName) throws TagValidationException {
+        return this.ampValidatorManager.getTagSpecIdByReferencePointTagSpecName(tagName);
+    }
+
+    /**
+     * Returns true iff resultA is a better result than resultB.
+     * @param resultA a validation result.
+     * @param resultB a validation result.
+     * @throws ValidatorException the ValidatorException.
+     * @return returns true iff resultA is a better result than resultB.
+     */
+    public boolean betterValidationResultThan(@Nonnull final ValidatorProtos.ValidationResult.Builder resultA,
+                                              @Nonnull final ValidatorProtos.ValidationResult.Builder resultB)
+                                            throws ValidatorException {
+        if (resultA.getStatus() != resultB.getStatus()) {
+            return this.betterValidationStatusThan(resultA.getStatus(), resultB.getStatus());
+        }
+
+        // If one of the error sets by error.code is a subset of the other
+        // error set's error.codes, use the subset one. It's essentially saying, if
+        // you fix these errors that we both complain about, then you'd be passing
+        // for my tagspec, but not the other one, regardless of specificity.
+        if (this.isErrorSubset(resultB.getErrorsList(), resultA.getErrorsList())) {
+            return true;
+        }
+
+        if (this.isErrorSubset(resultA.getErrorsList(), resultB.getErrorsList())) {
+            return false;
+        }
+
+        // Prefer the most specific error found in either set.
+        if (this.maxSpecificity(resultA.getErrorsList())
+                > this.maxSpecificity(resultB.getErrorsList())) {
+            return true;
+        }
+        if (this.maxSpecificity(resultB.getErrorsList())
+                > this.maxSpecificity(resultA.getErrorsList())) {
+            return false;
+        }
+
+        // Prefer the attempt with the fewest errors if the most specific errors
+        // are the same.
+        if (resultA.getErrorsCount() < resultB.getErrorsCount()) {
+            return true;
+        }
+        if (resultB.getErrorsCount() < resultA.getErrorsCount()) {
+            return false;
+        }
+
+        // Equal, so not better than.
+        return false;
+    }
+
+    /**
+     * Checks if maybeTypeIdentifier is contained in rules' typeIdentifiers.
+     * @param maybeTypeIdentifier identifier to check
+     * @return true iff maybeTypeIdentifier is in typeIdentifiers.
+     */
+    public boolean isTypeIdentifier(@Nonnull final String maybeTypeIdentifier) {
+        return this.typeIdentifiers.containsKey(maybeTypeIdentifier);
+    }
+
+    /**
+     * Validates type identifiers within a set of attributes, adding
+     * ValidationErrors as necessary, and sets type identifiers on
+     * ValidationResult.typeIdentifier.
+     * @param attrs sax Attributes object from tag.
+     * @param formatIdentifiers html formats
+     * @param context global context of document validation
+     * @param validationResult status of document validation
+     */
+    public void validateTypeIdentifiers(@Nonnull final Attributes attrs,
+                                        @Nonnull final List<String> formatIdentifiers, @Nonnull final Context context,
+                                        @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        boolean hasMandatoryTypeIdentifier = false;
+        for (int i = 0; i < attrs.getLength(); i++) {
+            // Verify this attribute is a type identifier. Other attributes are
+            // validated in validateAttributes.
+            if (this.isTypeIdentifier(attrs.getLocalName(i))) {
+                // Verify this type identifier is allowed for this format.
+                if (formatIdentifiers.contains(attrs.getLocalName(i))) {
+                    // Only add the type identifier once per representation. That is, both
+                    // "⚡" and "amp", which represent the same type identifier.
+                    final String typeIdentifier = attrs.getLocalName(i).replace("⚡", "amp");
+                    if (!validationResult.getTypeIdentifierList().contains(typeIdentifier)) {
+                        validationResult.addTypeIdentifier(typeIdentifier);
+                        context.recordTypeIdentifier(typeIdentifier);
+                    }
+                    // The type identifier "actions" and "transformed" are not considered
+                    // mandatory unlike other type identifiers.
+                    if (!typeIdentifier.equals("actions")
+                            && !typeIdentifier.equals("transformed")
+                            && !typeIdentifier.equals("data-ampdevmode")) {
+                        hasMandatoryTypeIdentifier = true;
+                    }
+                    // The type identifier "transformed" has restrictions on it's value.
+                    // It must be \w+;v=\d+ (e.g. google;v=1).
+                    if ((typeIdentifier.equals("transformed") && !(attrs.getValue(i).equals("")))) {
+                        Matcher reResult = TRANSFORMED_VALUE_REGEX.matcher(attrs.getValue(i));
+                        if (reResult.matches()) {
+                            validationResult.setTransformerVersion(Integer.parseInt(reResult.group(1)));
+                        } else {
+                            final List<String> params = new ArrayList<>();
+                            params.add(attrs.getLocalName(i));
+                            params.add("html");
+                            params.add(attrs.getValue(i));
+                            context.addError(
+                                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                                    context.getLineCol(),
+                                    /*params=*/params,
+                            "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup",
+                                    validationResult);
+                        }
+                    }
+                    if (typeIdentifier.equals("data-ampdevmode")) {
+                        // https://github.com/ampproject/amphtml/issues/20974
+                        // We always emit an error for this type identifier, but it
+                        // suppresses other errors later in the document.
+                        context.addError(
+                                ValidatorProtos.ValidationError.Code.DEV_MODE_ONLY,
+                                context.getLineCol(), /*params=*/new ArrayList<>(), /*url*/ "",
+                                validationResult);
+                    }
+                } else {
+                    final List<String> params = new ArrayList<>();
+                    params.add(attrs.getLocalName(i));
+                    params.add("html");
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR,
+                            context.getLineCol(), /*params=*/params,
+                    "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup",
+                            validationResult);
+                }
+            }
+        }
+        if (!hasMandatoryTypeIdentifier) {
+            // Missing mandatory type identifier (any AMP variant but "actions" or
+            // "transformed").
+            final List<String> params = new ArrayList<>();
+            params.add(formatIdentifiers.get(0));
+            params.add("html");
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING,
+                    context.getLineCol(), /*params=*/params,
+            "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup",
+                    validationResult);
+        }
+    }
+
+    /**
+     * Validates the HTML tag for type identifiers.
+     * @param htmlTag the html tag to validate.
+     * @param context global context of document validation
+     * @param validationResult status of document validation
+     */
+    public void validateHtmlTag(@Nonnull final ParsedHtmlTag htmlTag,
+                                @Nonnull final Context context,
+                                @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        switch (this.htmlFormat) {
+            case AMP:
+                this.validateTypeIdentifiers(
+                        htmlTag.attrs(), TagSpecUtils.AMP_IDENTIFIERS, context, validationResult);
+                break;
+            case AMP4ADS:
+                this.validateTypeIdentifiers(
+                        htmlTag.attrs(), TagSpecUtils.AMP4ADS_IDENTIFIERS, context, validationResult);
+                break;
+            case AMP4EMAIL:
+                this.validateTypeIdentifiers(
+                        htmlTag.attrs(), TagSpecUtils.AMP4EMAIL_IDENTIFIERS, context, validationResult);
+                break;
+            case ACTIONS:
+                this.validateTypeIdentifiers(
+                        htmlTag.attrs(), TagSpecUtils.ACTIONS_IDENTIFIERS, context,  validationResult);
+
+                if (!validationResult.getTypeIdentifierList().contains("actions")) {
+                    final List<String> params = new ArrayList<>();
+                    params.add("actions");
+                    params.add("html");
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING,
+                            context.getLineCol(), /* params */params,
+                            /* url */"", validationResult);
+                }
+                break;
+            default:
+                // fallthrough
+        }
+    }
+
+    /**
+     * Returns the error code specificity.
+     * @param errorCode the validation error code.
+     * @return returns the error code specificity.
+     */
+    public int specificity(@Nonnull final ValidatorProtos.ValidationError.Code errorCode) {
+        return this.errorCodes.get(errorCode).getSpecificity();
+    }
+
+    /**
+     * A helper function which allows us to compare two candidate results
+     * in validateTag to report the results which have the most specific errors.
+     * @param errors a list of validation errors.
+     * @throws ValidatorException the TagValidationException.
+     * @return returns maximum value of specificity found in all errors.
+     */
+    public int maxSpecificity(@Nonnull final List<ValidatorProtos.ValidationError> errors) throws ValidatorException {
+        int max = 0;
+        for (final ValidatorProtos.ValidationError error : errors) {
+            if (error.getCode() == null) {
+                throw new ValidatorException("Validation error code is null");
+            }
+            max = Math.max(this.specificity(error.getCode()), max);
+        }
+        return max;
+    }
+
+    /**
+     * Returns true iff the error codes in errorsB are a subset of the error
+     * codes in errorsA.
+     * @param errorsA a list of validation errors.
+     * @param errorsB a list of validation errors.
+     * @return returns true iff the error codes in errorsB are a subset of the error
+     * codes in errorsA.
+     */
+    public boolean isErrorSubset(@Nonnull final List<ValidatorProtos.ValidationError> errorsA,
+                                 @Nonnull final List<ValidatorProtos.ValidationError> errorsB) {
+        Map<ValidatorProtos.ValidationError.Code, Integer> codesA = new HashMap<>();
+        for (final ValidatorProtos.ValidationError error : errorsA) {
+            codesA.put(error.getCode(), 1);
+        }
+
+        Map<ValidatorProtos.ValidationError.Code, Integer> codesB = new HashMap<>();
+        for (final ValidatorProtos.ValidationError error : errorsB) {
+            codesB.put(error.getCode(), 1);
+            if (!codesA.containsKey(error.getCode())) {
+                return false;
+            }
+        }
+
+        // Every code in B is also in A. If they are the same, not a subset.
+        return  codesA.size() > codesB.size();
+    }
+
+    /**
+     * Returns true iff statusA is a better status than statusB.
+     * @param statusA validation result status.
+     * @param statusB validation result status.
+     * @throws ValidatorException the ValidatorException.
+     * @return returns true iff statusA is a better status than statusB.
+     */
+    public boolean betterValidationStatusThan(@Nonnull final ValidatorProtos.ValidationResult.Status statusA,
+                                              @Nonnull final ValidatorProtos.ValidationResult.Status statusB)
+                                            throws ValidatorException {
+        // Equal, so not better than.
+        if (statusA == statusB) {
+            return false;
+        }
+
+        // PASS > FAIL > UNKNOWN
+        if (statusA == ValidatorProtos.ValidationResult.Status.PASS) {
+            return true;
+        }
+
+        if (statusB == ValidatorProtos.ValidationResult.Status.PASS) {
+            return false;
+        }
+
+        if (statusA == ValidatorProtos.ValidationResult.Status.FAIL) {
+            return true;
+        }
+
+        if (statusA == ValidatorProtos.ValidationResult.Status.UNKNOWN) {
+            throw new ValidatorException("Status unknown");
+        }
+
+        return false;
+    }
+
+    /**
+     * Returns a TagSpecDispatch for a give tag name.
+     * @param tagName the tag name.
+     * @return returns a TagSpecDispatch if found.
+     */
+    public TagSpecDispatch dispatchForTagName(@Nonnull final String tagName) {
+        return this.tagSpecByTagName.get(tagName);
+    }
+
+    /**
+     * Returns a styles spec url.
+     * @return returns a styles spec url.
+     */
+    public String getStylesSpecUrl() {
+        return this.ampValidatorManager.getRules().getStylesSpecUrl();
+    }
+
+    /**
+     * Returns a template spec url.
+     * @return returns a template spec url.
+     */
+    public String getTemplateSpecUrl() {
+        return this.ampValidatorManager.getRules().getTemplateSpecUrl();
+    }
+
+    /**
+     * Returns the script spec url.
+     * @return returns the script spec url.
+     */
+    public String getScriptSpecUrl() {
+        return this.ampValidatorManager.getRules().getScriptSpecUrl();
+    }
+
+    /**
+     * Returns the list of Css length spec.
+     * @return returns the list of Css length spec.
+     */
+    public List<ValidatorProtos.CssLengthSpec> getCssLengthSpec() {
+        return this.ampValidatorManager.getRules().getCssLengthSpecList();
+    }
+
+    /**
+     * Returns the descendant tag lists.
+     * @return returns the descendant tag lists.
+     */
+    public List<ValidatorProtos.DescendantTagList> getDescendantTagLists() {
+        return ampValidatorManager.getDescendantTagLists();
+    }
+
+    /**
+     * Returns a combined black listed regex.
+     * @param tagSpecId tag spec id.
+     * @return returns a combined black listed regex.
+     */
+    public String getCombinedBlacklistedCdataRegex(final int tagSpecId) {
+        return ampValidatorManager.getCombinedBlacklistedCdataRegex(tagSpecId);
+    }
+
+    /**
+     * Emits any validation errors which require a global view
+     * (mandatory tags, tags required by other tags, mandatory alternatives).
+     * @param context the Context.
+     * @param validationResult the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void maybeEmitGlobalTagValidationErrors(@Nonnull final Context context,
+                                                   @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+                            throws TagValidationException {
+        this.maybeEmitMandatoryTagValidationErrors(context, validationResult);
+        this.maybeEmitAlsoRequiresTagValidationErrors(context, validationResult);
+        this.maybeEmitMandatoryAlternativesSatisfiedErrors(
+                context, validationResult);
+        this.maybeEmitCssLengthSpecErrors(context, validationResult);
+        this.maybeEmitValueSetMismatchErrors(context, validationResult);
+    }
+
+    /**
+     * Emits errors when there is a ValueSetRequirement with no matching
+     * ValueSetProvision in the document.
+     * @param context the Context.
+     * @param validationResult the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void maybeEmitValueSetMismatchErrors(@Nonnull final Context context,
+                                                @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+                            throws TagValidationException {
+        final Set<String> providedKeys = context.valueSetsProvided();
+        for (final String requiredKey : context.valueSetsRequired().keySet()) {
+            if (!providedKeys.contains(requiredKey)) {
+                context.valueSetsRequired().get(requiredKey);
+                for (final ValidatorProtos.ValidationError error :  context.valueSetsRequired().get(requiredKey)) {
+                    context.addBuiltError(error, validationResult);
+                }
+            }
+        }
+    }
+
+    /**
+     * Emits errors for css size limitations across entire document.
+     * @param context the Context.
+     * @param validationResult the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void maybeEmitCssLengthSpecErrors(@Nonnull final Context context,
+                                             @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+            throws TagValidationException {
+        // Only emit an error if there have been inline styles used. Otherwise
+        // if there was to be an error it would have been caught by
+        // CdataMatcher::Match().
+        if (context.getInlineStyleByteSize() == 0) {
+            return;
+        }
+
+        final int bytesUsed =
+                context.getInlineStyleByteSize() + context.getStyleAmpCustomByteSize();
+
+        for (final ValidatorProtos.CssLengthSpec cssLengthSpec : getCssLengthSpec()) {
+            if (!this.isCssLengthSpecCorrectHtmlFormat(cssLengthSpec)) {
+                continue;
+            }
+            if (cssLengthSpec.hasMaxBytes() && bytesUsed > cssLengthSpec.getMaxBytes()) {
+                final List<String> params = new ArrayList<>();
+                params.add(String.valueOf(bytesUsed));
+                params.add(String.valueOf(cssLengthSpec.getMaxBytes()));
+                context.addError(
+                        ValidatorProtos.ValidationError.Code
+                                .STYLESHEET_AND_INLINE_STYLE_TOO_LONG,
+                        context.getLineCol(), /* params */
+                        params,
+                        /* specUrl */ cssLengthSpec.getSpecUrl(), validationResult);
+            }
+        }
+    }
+
+    /**
+     * Emits errors for tags that are specified as mandatory alternatives.
+     * Returns false iff context.Progress(result).complete.
+     * @param context the Context.
+     * @param validationResult the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void maybeEmitMandatoryAlternativesSatisfiedErrors(@Nonnull final Context context,
+                                                              @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+        throws TagValidationException {
+        final List<String> satisfied = context.getMandatoryAlternativesSatisfied();
+        /** @type {!Array<string>} */
+        final List<String> missing = new ArrayList<>();
+        Map<String, String> specUrlsByMissing = new HashMap<>();
+        for (final ValidatorProtos.TagSpec tagSpec : this.ampValidatorManager.getRules().getTagsList()) {
+            if (!tagSpec.hasMandatoryAlternatives() || !this.isTagSpecCorrectHtmlFormat(tagSpec)) {
+                continue;
+            }
+            final String alternative = tagSpec.getMandatoryAlternatives();
+            if (satisfied.indexOf(alternative) == -1) {
+                if (!missing.contains(alternative)) {
+                    missing.add(alternative);
+                    specUrlsByMissing.put(alternative, TagSpecUtils.getTagSpecUrl(tagSpec));
+                }
+            }
+        }
+        //sortAndUniquify(missing);
+        for (final String tagMissing : missing) {
+            final List<String> params = new ArrayList<>();
+            params.add(tagMissing);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING,
+                    context.getLineCol(),
+                    params,
+                    /* specUrl */ specUrlsByMissing.get(tagMissing),
+                    validationResult);
+        }
+    }
+
+    /**
+     * Emits errors for tags that are specified to be mandatory.
+     * @param context the Context.
+     * @param validationResult the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void maybeEmitMandatoryTagValidationErrors(@Nonnull final Context context,
+                                                      @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+                    throws TagValidationException {
+        for (int tagSpecId : this.mandatoryTagSpecs) {
+            final ParsedTagSpec parsedTagSpec = this.getByTagSpecId(tagSpecId);
+            // Skip TagSpecs that aren't used for these type identifiers.
+            if (!parsedTagSpec.isUsedForTypeIdentifiers(
+                    context.getTypeIdentifiers())) {
+                continue;
+            }
+
+            if (!context.getTagspecsValidated().containsKey(tagSpecId)) {
+                final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+                final List<String> params = new ArrayList<>();
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        validationResult);
+            }
+        }
+    }
+
+    /**
+     * Emits errors for tags that specify that another tag is also required or
+     * a condition is required to be satisfied.
+     * Returns false iff context.Progress(result).complete.
+     * @param context the Context.
+     * @param validationResult the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void maybeEmitAlsoRequiresTagValidationErrors(@Nonnull final Context context,
+                                                         @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+                                    throws TagValidationException {
+        for (final int tagSpecId : context.getTagspecsValidated().keySet()) {
+            final ParsedTagSpec parsedTagSpec = this.getByTagSpecId(tagSpecId);
+            // Skip TagSpecs that aren't used for these type identifiers.
+            if (!parsedTagSpec.isUsedForTypeIdentifiers(
+                    context.getTypeIdentifiers())) {
+                continue;
+            }
+            for (final String condition : parsedTagSpec.requires()) {
+                if (!context.satisfiesCondition(condition)) {
+                    final List<String> params = new ArrayList<>();
+                    params.add(condition);
+                    params.add(TagSpecUtils.getTagSpecName(parsedTagSpec.getSpec()));
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.TAG_REQUIRED_BY_MISSING,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(parsedTagSpec.getSpec()),
+                            validationResult);
+                }
+            }
+            for (final String condition : parsedTagSpec.excludes()) {
+                if (context.satisfiesCondition(condition)) {
+                    final List<String> params = new ArrayList<>();
+                    params.add(TagSpecUtils.getTagSpecName(parsedTagSpec.getSpec()));
+                    params.add(condition);
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.TAG_EXCLUDED_BY_TAG,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(parsedTagSpec.getSpec()),
+                            validationResult);
+                }
+            }
+            for (final String requiresTagWarning : parsedTagSpec.getAlsoRequiresTagWarning()) {
+                final Integer tagSpecIdObj = getTagSpecIdBySpecName(requiresTagWarning);
+                if (tagSpecIdObj == null || !context.getTagspecsValidated().containsKey(tagSpecIdObj)) {
+                    final ParsedTagSpec alsoRequiresTagspec = this.getByTagSpecId(tagSpecIdObj);
+                    final List<String> params = new ArrayList<>();
+                    params.add(TagSpecUtils.getTagSpecName(alsoRequiresTagspec.getSpec()));
+                    params.add(TagSpecUtils.getTagSpecName(parsedTagSpec.getSpec()));
+                    context.addWarning(
+                            ValidatorProtos.ValidationError.Code.WARNING_TAG_REQUIRED_BY_MISSING,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(parsedTagSpec.getSpec()),
+                            validationResult);
+                }
+            }
+        }
+
+        final ExtensionsContext extensionsCtx = context.getExtensions();
+        final List<String> unusedRequired = extensionsCtx.unusedExtensionsRequired();
+        for (final String unusedExtensionName : unusedRequired) {
+            final List<String> params = new ArrayList<>();
+            params.add(unusedExtensionName);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.EXTENSION_UNUSED,
+                    context.getLineCol(),
+                    params,
+                    /* specUrl */ "", validationResult);
+        }
+    }
+
+
+    /**
+     * Returns true if Css length spec's html format is equal to this html format.
+     * @param cssLengthSpec the CssLengthSpec.
+     * @return returns true of Css length spec's html format is same as this html format.
+     */
+    private boolean isCssLengthSpecCorrectHtmlFormat(@Nonnull final ValidatorProtos.CssLengthSpec cssLengthSpec) {
+        return cssLengthSpec.hasHtmlFormat() ? cssLengthSpec.getHtmlFormat() == htmlFormat : false;
+    }
+
+    /**
+     * Returns true if TagSpec's html format is the same as this html format.
+     * @param tagSpec the TagSpec.
+     * @return returns true if TagSpec's html format is the same as this html format.
+     */
+    private boolean isTagSpecCorrectHtmlFormat(@Nonnull final ValidatorProtos.TagSpec tagSpec) {
+        for (final ValidatorProtos.HtmlFormat.Code htmlFormatCode : tagSpec.getHtmlFormatList()) {
+            if (htmlFormatCode == htmlFormat) {
+                return true;
+            }
+        }
+
+        return false;
+    }
+
+    /**
+     * For every tagspec that contains an ExtensionSpec, we add several TagSpec
+     * fields corresponding to the data found in the ExtensionSpec.
+     */
+    private void expandExtensionSpec() {
+        final int numTags = this.ampValidatorManager.getRules().getTagsList().size();
+        for (int tagSpecId = 0; tagSpecId < numTags; ++tagSpecId) {
+            ValidatorProtos.TagSpec tagSpec = this.ampValidatorManager.getRules().getTags(tagSpecId);
+
+            if (!tagSpec.hasExtensionSpec()) {
+                continue;
+            }
+
+            ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+            tagSpecBuilder.mergeFrom(tagSpec);
+
+            if (!tagSpec.hasSpecName()) {
+                tagSpecBuilder.setSpecName(tagSpec.getTagName() + " extension .js script");
+            }
+
+            tagSpecBuilder.setMandatoryParent("HEAD");
+            if (tagSpec.getExtensionSpec().hasDeprecatedAllowDuplicates()) {
+                tagSpecBuilder.setUniqueWarning(true);
+            } else {
+                tagSpecBuilder.setUnique(true);
+            }
+
+            ValidatorProtos.CdataSpec cdataSpec = ValidatorProtos.CdataSpec.getDefaultInstance();
+            cdataSpec = cdataSpec.toBuilder().setWhitespaceOnly(true).build();
+            tagSpecBuilder.setCdata(cdataSpec);
+
+            this.ampValidatorManager.getRules().setTags(tagSpecId, tagSpecBuilder.build());
+        }
+    }
+
+    /**
+     * @return {!ParsedAttrSpecs}
+     */
+    public ParsedAttrSpecs getParsedAttrSpecs() {
+        return this.parsedAttrSpecs;
+    }
+
+    /** AmpValidatorManager. */
+    private AMPValidatorManager ampValidatorManager;
+
+    /** The HTML format. */
+    private ValidatorProtos.HtmlFormat.Code htmlFormat;
+
+    /** ParsedTagSpecs in id order. */
+    private Map<Integer, ParsedTagSpec> parsedTagSpecById;
+
+    /** ParsedTagSpecs keyed by name. */
+    private Map<String, TagSpecDispatch> tagSpecByTagName;
+
+    /** Tag ids that are mandatory for a document to legally validate. */
+    private List<Integer> mandatoryTagSpecs;
+
+    /** A cache for full match regex instantiations. */
+    private Map<String, Pattern> fullMatchRegexes;
+
+    /** A cache for full match case insensitive regex instantiation. */
+    private  Map<String, Pattern> fullMatchCaseiRegexes;
+
+    /** A cache for partial match case insensitive regex instantiation. */
+    private  Map<String, Pattern> partialMatchCaseiRegexes;
+
+    /**
+     * Type identifiers which are used to determine the set of validation
+     * rules to be applied.
+     */
+    private Map<String, Integer> typeIdentifiers;
+
+    /** A ParsedAttrSpecs object. */
+    private ParsedAttrSpecs parsedAttrSpecs;
+
+    /** A tag spec names to track. */
+    private Map<Object, Boolean> tagSpecIdsToTrack;
+
+    /** ErrorCodeMetadata keyed by error code. */
+    private Map<ValidatorProtos.ValidationError.Code, ErrorCodeMetadata> errorCodes;
+
+    /** Tag spec name to spec id .*/
+    private Map<String, Integer> tagSpecNameToSpecId = new HashMap<>();
+
+    /** Transformed value regex pattern. */
+    private static final Pattern TRANSFORMED_VALUE_REGEX = Pattern.compile("^\\w+;v=(\\d+)$");
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ParsedValueProperties.java b/validator/java/src/main/java/dev/amp/validator/ParsedValueProperties.java
new file mode 100644
index 0000000000000..db6b574dca71c
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ParsedValueProperties.java
@@ -0,0 +1,92 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * This class creates a map of property specs key by name.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedValueProperties {
+    /**
+     * Constructor.
+     * @param spec property spec list.
+     */
+    public ParsedValueProperties(@Nonnull final ValidatorProtos.PropertySpecList spec) {
+        this.valuePropertyByName = new HashMap<>();
+        this.mandatoryValuePropertyNames = new ArrayList<>();
+
+        for (final ValidatorProtos.PropertySpec propertySpec : spec.getPropertiesList()) {
+            this.valuePropertyByName.put(propertySpec.getName(), propertySpec);
+            if (propertySpec.hasMandatory()) {
+                this.mandatoryValuePropertyNames.add(propertySpec.getName());
+            }
+        }
+        Collections.sort(this.mandatoryValuePropertyNames);
+    }
+
+    /**
+     * Returns the a map of PropertySpec.
+     * @return returns a map of PropertySpec.
+     */
+    @Nonnull
+    public Map<String, ValidatorProtos.PropertySpec> getValuePropertyByName() {
+        return this.valuePropertyByName;
+    }
+
+    /**
+     * Returns a list of mandatory property names.
+     * @return returns a list of mandatory property names.
+     */
+    public List<String> getMandatoryValuePropertyNames() {
+        return this.mandatoryValuePropertyNames;
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.valuePropertyByName = null;
+        this.mandatoryValuePropertyNames = null;
+    }
+
+    /**
+     * PropertySpec map.
+     */
+    @Nonnull
+    private Map<String, ValidatorProtos.PropertySpec> valuePropertyByName;
+
+    /**
+     * A list of mandatory property names.
+     */
+    @Nonnull
+    private List<String> mandatoryValuePropertyNames;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/RecordValidated.java b/validator/java/src/main/java/dev/amp/validator/RecordValidated.java
new file mode 100644
index 0000000000000..b2153807ee438
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/RecordValidated.java
@@ -0,0 +1,40 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+/**
+ * Record validated enumeration types.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public enum RecordValidated {
+    /** ALWAYS */
+    ALWAYS,
+
+    /** NEVER */
+    NEVER,
+
+    /** IF_PASSING */
+    IF_PASSING
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ReferencePointMatcher.java b/validator/java/src/main/java/dev/amp/validator/ReferencePointMatcher.java
new file mode 100644
index 0000000000000..f09b2cdcde466
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ReferencePointMatcher.java
@@ -0,0 +1,236 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.exception.ValidatorException;
+import dev.amp.validator.utils.TagSpecUtils;
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * A tag may initialize this ReferencePointMatcher with its reference points.
+ * Then, the matcher will be invoked for each child tag via ::Match,
+ * and eventually it will be invoked upon exiting the parent tag.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ReferencePointMatcher {
+    /**
+     * Constructor.
+     * @param parsedValidatorRules the ParsedValidatorRules object.
+     * @param parsedReferencePoints the parsed reference points.
+     * @param lineCol a pair of line/col.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public ReferencePointMatcher(@Nonnull final ParsedValidatorRules parsedValidatorRules,
+                                 @Nonnull final ParsedReferencePoints parsedReferencePoints,
+                                 @Nonnull final Locator lineCol) throws TagValidationException {
+        this.parsedValidatorRules = parsedValidatorRules;
+        this.parsedReferencePoints = parsedReferencePoints;
+        if (parsedReferencePoints.empty()) {
+            throw new TagValidationException("Reference point matcher should not be empty");
+        }
+
+        this.lineCol = lineCol;
+        this.referencePointsMatched = new ArrayList<>();
+
+    }
+
+    /**
+     * This method gets invoked when matching a child tag of the parent
+     * that is specifying / requiring the reference points. So
+     * effectively, this method will try through the specified reference
+     * points and record them in this.referencePointsMatched.
+     * @param tag the ParsedHtmlTag.
+     * @param context the Context.
+     * @throws TagValidationException the TagValidationException.
+     * @throws ValidatorException the ValidatorException.
+     * @throws IOException IO Exception
+     * @throws CssValidationException CssValidation Exception
+     * @return result returns ValidateTagResult.
+     */
+    public ValidateTagResult validateTag(@Nonnull final ParsedHtmlTag tag, @Nonnull final Context context)
+            throws TagValidationException, ValidatorException, IOException, CssValidationException {
+        // Look for a matching reference point, if we find one, record and exit.
+        ValidatorProtos.ValidationResult.Builder resultForBestAttempt = ValidatorProtos.ValidationResult.newBuilder();
+        resultForBestAttempt.setStatus(ValidatorProtos.ValidationResult.Status.UNKNOWN);
+        for (ValidatorProtos.ReferencePoint p : this.parsedReferencePoints.iterate()) {
+            final ParsedTagSpec parsedTagSpec = context.getRules().getByTagSpecId(p.getTagSpecName());
+            // Skip TagSpecs that aren't used for these type identifiers.
+            if (!parsedTagSpec.isUsedForTypeIdentifiers(context.getTypeIdentifiers())) {
+                continue;
+            }
+            ValidatorProtos.ValidationResult.Builder resultForAttempt =
+                    TagSpecUtils.validateTagAgainstSpec(
+                    parsedTagSpec, /*bestMatchReferencePoint=*/null, context, tag);
+
+            if (context.getRules().betterValidationResultThan(resultForAttempt, resultForBestAttempt)) {
+                resultForBestAttempt = resultForAttempt;
+            }
+            if (resultForBestAttempt.getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+                ValidateTagResult validateTagResult = new ValidateTagResult(resultForBestAttempt, parsedTagSpec);
+                return  validateTagResult;
+            }
+        }
+
+        // This check cannot fail as a successful validation above exits early.
+        if (resultForBestAttempt.getStatus() != ValidatorProtos.ValidationResult.Status.FAIL) {
+            throw new ValidatorException("Successful validation should have exited earlier");
+        }
+
+        // Special case: only one reference point defined - emit a singular
+        // error message *and* merge in the errors from the best attempt above.
+        if (this.parsedReferencePoints.size() == 1) {
+            List<String> params = new ArrayList<>();
+            params.add(tag.lowerName());
+            params.add(this.parsedReferencePoints.parentTagSpecName());
+            params.add(this.parsedValidatorRules.getReferencePointName(
+                    this.parsedReferencePoints.iterate().get(0)));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code
+                            .CHILD_TAG_DOES_NOT_SATISFY_REFERENCE_POINT_SINGULAR,
+                    context.getLineCol(),
+                    params,
+                    this.parsedReferencePoints.parentSpecUrl(), resultForBestAttempt);
+            ValidateTagResult validateTagResult = new ValidateTagResult(resultForBestAttempt, null);
+            return validateTagResult;
+        }
+        // General case: more than one reference point defined. Emit a plural
+        // message with the acceptable reference points listed.
+        final List<String> acceptable = new ArrayList<>();
+        for (final ValidatorProtos.ReferencePoint p : this.parsedReferencePoints.iterate()) {
+            acceptable.add(this.parsedValidatorRules.getReferencePointName(p));
+        }
+        final ValidatorProtos.ValidationResult.Builder resultForMultipleAttempts = ValidatorProtos.ValidationResult.newBuilder();
+        final List<String> params = new ArrayList<>();
+        params.add(tag.lowerName());
+        params.add(this.parsedReferencePoints.parentTagSpecName());
+        params.add(String.join(", ", acceptable));
+        context.addError(
+                ValidatorProtos.ValidationError.Code
+                        .CHILD_TAG_DOES_NOT_SATISFY_REFERENCE_POINT,
+                context.getLineCol(),
+                params,
+                this.parsedReferencePoints.parentSpecUrl(),
+                resultForMultipleAttempts);
+
+        ValidateTagResult validateTagResult = new ValidateTagResult(resultForMultipleAttempts, null);
+        return validateTagResult;
+    }
+
+    /**
+     * This method gets invoked when we're done with processing all the
+     * child tags, so now we can determine whether any reference points
+     * remain unsatisfied or duplicate.
+     * @param context the Context.
+     * @param result the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void exitParentTag(@Nonnull final Context context, @Nonnull final ValidatorProtos.ValidationResult.Builder result)
+            throws TagValidationException {
+        final Map<Integer, Integer> referencePointByCount = new HashMap<>();
+        for (final int r : this.referencePointsMatched) {
+            int count = 1;
+            if (referencePointByCount.containsKey(r)) {
+                count = referencePointByCount.get(r);
+                count++;
+            }
+            referencePointByCount.put(r, count);
+        }
+
+        for (final ValidatorProtos.ReferencePoint p : this.parsedReferencePoints.iterate()) {
+            int refPointTagSpecId = this.parsedValidatorRules.getTagSpecIdByReferencePointTagSpecName(p.getTagSpecName());
+            if (p.hasMandatory()
+                    && !referencePointByCount.containsKey(refPointTagSpecId)) {
+                final List<String> params = new ArrayList<>();
+                params.add(this.parsedValidatorRules.getReferencePointName(p));
+                params.add(this.parsedReferencePoints.parentTagSpecName());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MANDATORY_REFERENCE_POINT_MISSING,
+                        this.getLineCol(),
+                        params,
+                        this.parsedReferencePoints.parentSpecUrl(),
+                        result);
+            }
+
+            if (p.hasUnique()
+                    && referencePointByCount.containsKey(refPointTagSpecId)
+                    && referencePointByCount.get(refPointTagSpecId) != 1) {
+                final List<String> params = new ArrayList<>();
+                params.add(this.parsedValidatorRules.getReferencePointName(p));
+                params.add(this.parsedReferencePoints.parentTagSpecName());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DUPLICATE_REFERENCE_POINT,
+                        this.getLineCol(),
+                        params,
+                        this.parsedReferencePoints.parentSpecUrl(),
+                        result);
+            }
+        }
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.lineCol = null;
+        this.referencePointsMatched = null;
+    }
+
+    /**
+     * Returns a pair of line/col.
+     * @return returns a pair of line/col.
+     */
+    public Locator getLineCol() {
+        return this.lineCol;
+    }
+
+    /**
+     * Record the parsed tag spec id.
+     * @param parsedTagSpec the ParsedTagSpec.
+     */
+    public void recordMatch(@Nonnull final ParsedTagSpec parsedTagSpec) {
+        this.referencePointsMatched.add(parsedTagSpec.id());
+    }
+
+    /** A ParsedValidatorRules instance. */
+    private ParsedValidatorRules parsedValidatorRules;
+
+    /** A ParsedReferencePoints instance. */
+    private ParsedReferencePoints parsedReferencePoints;
+
+    /** A line/col pair. */
+    private Locator lineCol;
+
+    /** An array of reference points matched. */
+    private List<Integer> referencePointsMatched;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/SrcsetParsingResult.java b/validator/java/src/main/java/dev/amp/validator/SrcsetParsingResult.java
new file mode 100644
index 0000000000000..2a70a66e8b7d1
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/SrcsetParsingResult.java
@@ -0,0 +1,95 @@
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * This class contains the result of srcset parsing.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class SrcsetParsingResult {
+    /** Default constructor. */
+    public SrcsetParsingResult() {
+        this.success = false;
+        this.errorCode = ValidatorProtos.ValidationError.Code.UNKNOWN_CODE;
+        this.srcsetImages = new ArrayList<>();
+    }
+
+    /**
+     * Returns success flag.
+     * @return returns success flag.
+     */
+    public boolean isSuccess() {
+        return success;
+    }
+
+    /**
+     * Setting the success flag.
+     * @param success success flag.
+     */
+    public void setSuccess(final boolean success) {
+        this.success = success;
+    }
+
+    /**
+     * Returns the error code.
+     * @return returns the error code.
+     */
+    public ValidatorProtos.ValidationError.Code getErrorCode() {
+        return errorCode;
+    }
+
+    /**
+     * Setting the error code.
+     * @param errorCode the error code.
+     */
+    public void setErrorCode(@Nonnull final ValidatorProtos.ValidationError.Code errorCode) {
+        this.errorCode = errorCode;
+    }
+
+    /**
+     * Returns the srcset images.
+     * @return returns the srcset images.
+     */
+    public List<SrcsetSourceDef> getSrcsetImages() {
+        return srcsetImages;
+    }
+
+    /**
+     * Add source set def to the list.
+     * @param srcSetSourceDef the source set def.
+     */
+    public void add(@Nonnull final SrcsetSourceDef srcSetSourceDef) {
+        srcsetImages.add(srcSetSourceDef);
+    }
+
+    /**
+     * Setting the srcset images.
+     * @param srcsetImages srcset images.
+     */
+    public void setSrcsetImages(@Nonnull final List<SrcsetSourceDef> srcsetImages) {
+        this.srcsetImages = srcsetImages;
+    }
+
+    /**
+     * Returns the size of srcset images.
+     * @return returns the size of srcset images.
+     */
+    public int getSrcsetImagesSize() {
+        return srcsetImages.size();
+    }
+
+    /** Flag success. */
+    private boolean success;
+
+    /** Error code. */
+    private ValidatorProtos.ValidationError.Code errorCode;
+
+    /** List of srcset images. */
+    private List<SrcsetSourceDef> srcsetImages;
+}
+
diff --git a/validator/java/src/main/java/dev/amp/validator/SrcsetSourceDef.java b/validator/java/src/main/java/dev/amp/validator/SrcsetSourceDef.java
new file mode 100644
index 0000000000000..dc115b72aecdb
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/SrcsetSourceDef.java
@@ -0,0 +1,67 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+
+/**
+ * This class contains a single source within a srcset.
+ *
+ *  @author nhant01
+ *  @author GeorgeLuo
+ */
+
+public class SrcsetSourceDef {
+    /**
+     * Constructor.
+     * @param url the url.
+     * @param widthOrPixelDensity width or pixel density.
+     */
+    public SrcsetSourceDef(@Nonnull final String url, @Nonnull final String widthOrPixelDensity) {
+        this.url = url;
+        this.widthOrPixelDensity = widthOrPixelDensity;
+    }
+
+    /**
+     * Returns the url.
+     * @return returns the url.
+     */
+    public String getUrl() {
+        return url;
+    }
+
+    /**
+     * Returns the width or pixel density.
+     * @return returns the width or pixel density.
+     */
+    public String getWidthOrPixelDensity() {
+        return widthOrPixelDensity;
+    }
+
+    /** The url. */
+    private String url;
+
+    /** Width or pixel density. */
+    private String widthOrPixelDensity;
+}
+
+
diff --git a/validator/java/src/main/java/dev/amp/validator/TagSpecDispatch.java b/validator/java/src/main/java/dev/amp/validator/TagSpecDispatch.java
new file mode 100644
index 0000000000000..f1dc3dd49cb9a
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/TagSpecDispatch.java
@@ -0,0 +1,167 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.utils.DispatchKeyUtils;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * This class stores the dispatch rules for all TagSpecs with the same tag name.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class TagSpecDispatch {
+    /**
+     * Constructor.
+     */
+    public TagSpecDispatch() {
+        this.allTagSpecs = new ArrayList<>();
+    }
+
+    /**
+     * Registers a new dispatch key to match a tagspec id
+     * @param dispatchKey the dispatch key.
+     * @param tagSpecId tag spec id.
+     */
+    public void registerDispatchKey(@Nonnull final String dispatchKey, final int tagSpecId) {
+        if (this.tagSpecsByDispatch == null) {
+            this.tagSpecsByDispatch = new HashMap<>();
+        }
+        // Multiple TagSpecs may have the same dispatch key. These are added in the
+        // order in which they are found.
+        List<Integer> tagSpecIds;
+        if (!(tagSpecsByDispatch.containsKey(dispatchKey))) {
+            tagSpecIds = new ArrayList<>();
+            tagSpecIds.add(tagSpecId);
+            this.tagSpecsByDispatch.put(dispatchKey, tagSpecIds);
+        } else {
+            tagSpecIds = this.tagSpecsByDispatch.get(dispatchKey);
+            tagSpecIds.add(tagSpecId);
+        }
+    }
+
+    /**
+     * Looks up a dispatch key as previously registered, returning the
+     * corresponding tagSpecIds which are ordered by their specificity of match
+     * (e.g. Name/Value/Parent, then Name/Value, and then Name).
+     * @param attrName attribute name.
+     * @param attrValue attribute value.
+     * @param mandatoryParent mandatory parent.
+     * @return returns the list of tag spec ids.
+     */
+    public List<Integer> matchingDispatchKey(@Nonnull final String attrName,
+                                             @Nonnull final String attrValue,
+                                             @Nonnull final String mandatoryParent) {
+        List<Integer> tagSpecIds = new ArrayList<>();
+        if (!this.hasDispatchKeys()) {
+            return tagSpecIds;
+        }
+
+        // Try first to find a key with the given parent.
+        final String dispatchKey = DispatchKeyUtils.makeDispatchKey(
+               ValidatorProtos.AttrSpec.DispatchKeyType.NAME_VALUE_PARENT_DISPATCH,
+                attrName, attrValue, mandatoryParent);
+        final List<Integer> match = this.tagSpecsByDispatch.get(dispatchKey);
+        if (match != null) {
+            tagSpecIds.addAll(match);
+        }
+
+        // Try next to find a key that allows any parent.
+        final String noParentKey = DispatchKeyUtils.makeDispatchKey(
+                ValidatorProtos.AttrSpec.DispatchKeyType.NAME_VALUE_DISPATCH, attrName,
+                attrValue, "");
+        final List<Integer> noParentMatch = this.tagSpecsByDispatch.get(noParentKey);
+        if (noParentMatch != null) {
+            tagSpecIds.addAll(noParentMatch);
+        }
+
+        // Try last to find a key that matches just this attribute name.
+        final String noValueKey = DispatchKeyUtils.makeDispatchKey(
+                ValidatorProtos.AttrSpec.DispatchKeyType.NAME_DISPATCH, attrName, "", "");
+        final List<Integer> noValueMatch = this.tagSpecsByDispatch.get(noValueKey);
+        if (noValueMatch != null) {
+            tagSpecIds.addAll(noValueMatch);
+        }
+
+        // Special case for foo=foo. We consider this a match for a dispatch key of
+        // foo="" or just <tag foo>.
+        if (attrName.equals(attrValue)) {
+            tagSpecIds.addAll(
+                    this.matchingDispatchKey(attrName, "", mandatoryParent));
+        }
+
+        return tagSpecIds;
+    }
+
+    /**
+     * Registers a new non dispatch key tagspec id.
+     * @param tagSpecId tag spec id.
+     */
+    public void registerTagSpec(final int tagSpecId) {
+        this.allTagSpecs.add(tagSpecId);
+    }
+
+    /**
+     * Returns true if dispatch key is not null and tag specs is not empty.
+     * @return returns true if dispatch key is not null and tag specs is not empty.
+     */
+    public boolean empty() {
+        return !this.hasDispatchKeys() && !this.hasTagSpecs();
+    }
+
+    /**
+     * Returns true if tag spec key by dispatch not null.
+     * @return returns true if tag spec key by dispatch not null.
+     */
+    public boolean hasDispatchKeys() {
+        return this.tagSpecsByDispatch != null;
+    }
+
+    /**
+     * Return true if tag specs not empty.
+     * @return returns true if tag specs not empty.
+     */
+    public boolean hasTagSpecs() {
+        return this.allTagSpecs.size() > 0;
+    }
+
+    /**
+     * Returns the tag specs.
+     * @return returns the tag specs.
+     */
+    public List<Integer> allTagSpecs() {
+        return this.allTagSpecs;
+    }
+
+   /** TagSpec ids for a specific attribute dispatch key. */
+    private Map<String, List<Integer>> tagSpecsByDispatch;
+
+    /** List of all tag specs. */
+    private List<Integer> allTagSpecs;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/TagStack.java b/validator/java/src/main/java/dev/amp/validator/TagStack.java
new file mode 100644
index 0000000000000..04288d14fd90e
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/TagStack.java
@@ -0,0 +1,539 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.utils.TagSpecUtils;
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.LinkedList;
+import java.util.List;
+
+/**
+ * This class keeps track of the tag names and ChildTagMatchers
+ * as we enter / exit tags in the document. Closing tags is tricky:
+ * - We assume that all end tags are optional and we close, that is, pop off
+ *   tags our stack, lazily as we encounter parent closing tags. This part
+ *   differs slightly from the behavior per spec: instead of closing an
+ *   option tag when a following option tag is seen, we close it when the
+ *   parent closing tag (in practice select) is encountered.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class TagStack {
+    /**
+     * Constructor.
+     */
+    public TagStack() {
+        this.stack = new LinkedList<>();
+        //TODO - REMOVE DOCTYPE when tagchowder supports doctype element.
+        this.stack.add(new TagStackEntry("$ROOT"));
+        this.stack.add(new TagStackEntry("!DOCTYPE"));
+    }
+
+    /**
+     * Returns true if this within lt;style amp-custom gt;.
+     *
+     * @throws TagValidationException the TagValidationException.
+     * @return returns true if this within lt;style amp-custom gt; Else false.
+     */
+    public boolean isStyleAmpCustomChild() throws TagValidationException {
+        return (this.parentStackEntry().getTagSpec() != null)
+                && (this.parentStackEntry().getTagSpec().getSpec().getNamedId()
+                == ValidatorProtos.TagSpec.NamedId.STYLE_AMP_CUSTOM);
+    }
+
+    /**
+     * The parent of the current stack entry.
+     *
+     * @throws TagValidationException the TagValidationException.
+     * @return TagStackEntry the TagStackEntry.
+     */
+    public TagStackEntry parentStackEntry() throws TagValidationException {
+        if (this.stack.size() < 1) {
+            throw new TagValidationException("Parent of empty $ROOT tag requested.");
+        }
+        return this.back();
+    }
+
+    /**
+     * Alias to the last element on the tag stack.
+     * @throws TagValidationException the TagValidationException.
+     * @return TagStackEntry the TagStackEntry.
+     */
+    public TagStackEntry back() throws TagValidationException {
+        if (this.stack.size() <= 0) {
+            throw new TagValidationException("Exiting an empty tag stack.");
+        }
+        return this.stack.getLast();
+    }
+
+    /**
+     * Returns the parent stack entry reference point matcher.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the parent stack entry reference point matcher.
+     */
+    public ReferencePointMatcher parentReferencePointMatcher() throws TagValidationException {
+        return this.parentStackEntry().getReferencePointMatcher();
+    }
+
+    /**
+     * Tells the parent of the current stack entry that it can only have 1 child
+     * and that child must be me (the current stack entry).
+     * @param tagName The current stack entry's tag name.
+     * @param lineCol pair of line/col.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void tellParentNoSiblingsAllowed(@Nonnull final String tagName, @Nonnull final Locator lineCol)
+            throws TagValidationException {
+        this.parentStackEntry().setOnlyChildTagName(tagName);
+        this.parentStackEntry().setOnlyChildErrorLineCol(lineCol);
+    }
+
+    /**
+     * Returns the parent only child error line col.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the Locator of the tag that set the rule.
+     */
+    public Locator parentOnlyChildErrorLineCol() throws TagValidationException {
+        return this.parentStackEntry().getOnlyChildErrorLineCol();
+    }
+
+    /**
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the name of the tag that set the 'no siblings allowed'
+     * rule.
+     */
+    public String parentOnlyChildTagName() throws TagValidationException {
+        return this.parentStackEntry().getOnlyChildTagName();
+    }
+
+    /**
+     * @throws TagValidationException the TagValidationException.
+     * @return returns true if this tag's parent has a child with 'no siblings
+     * allowed' rule. Else false.
+     */
+    public boolean parentHasChildWithNoSiblingRule() throws TagValidationException {
+        return this.parentOnlyChildTagName().length() > 0;
+    }
+
+    /**
+     * Returns the Locator of the tag that set the 'last child' rule.
+     * @throws TagValidationException the TagValidationException.
+     * @return The Locator of the tag that set the 'last child' rule.
+     */
+    public Locator parentLastChildErrorLineCol() throws TagValidationException {
+        return this.parentStackEntry().getLastChildErrorLineCol();
+    }
+
+    /**
+     * Returns the list of DescendantConstraints.
+     * @return returns the list of DescendantConstraints.
+     */
+    public List<DescendantConstraints> allowedDescendantsList() {
+        return this.allowedDescendantsList;
+    }
+
+    /**
+     * Tells the parent of the current stack entry that its last child must be me
+     * (the current stack entry).
+     * @param tagName The current stack entry's tag name.
+     * @param url The current stack entry's spec url.
+     * @param lineCol a pair line/col.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void tellParentImTheLastChild(@Nonnull final String tagName,
+                                         @Nonnull final String url,
+                                         @Nonnull final Locator lineCol)
+            throws TagValidationException {
+        this.parentStackEntry().setLastChildTagName(tagName);
+        this.parentStackEntry().setLastChildErrorLineCol(lineCol);
+        this.parentStackEntry().setLastChildUrl(url);
+    }
+
+    /**
+     * This method is called as we're visiting a tag; so the matcher we
+     * need here is the one provided/specified for the tag parent.
+     * @param encounteredTag encountered tag.
+     * @param context the Context object.
+     * @param result validation result.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void matchChildTagName(@Nonnull final ParsedHtmlTag encounteredTag,
+                                  @Nonnull final Context context,
+                                  @Nonnull final ValidatorProtos.ValidationResult.Builder result)
+            throws TagValidationException {
+        final ChildTagMatcher matcher = this.parentStackEntry().getChildTagMatcher();
+        if (matcher != null) {
+            matcher.matchChildTagName(encounteredTag, context, result);
+        }
+    }
+
+    /**
+     * Returns true if this within script type=application/json. Else false.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns true if this within script type=application/json. Else
+     * false.
+     */
+    public boolean isScriptTypeJsonChild() throws TagValidationException {
+        return (this.parentStackEntry().getTagName().equals("SCRIPT")
+                && (this.parentStackEntry().getTagSpec() != null)
+                && this.parentStackEntry().getTagSpec().isTypeJson());
+    }
+
+    /**
+     * Returns true if the current tag has ancestor with the given tag name or
+     * specName.
+     * @param ancestor ancestor tag.
+     * @return returns true if the current tag has ancestor with the given tag name or specName.
+     */
+    public boolean hasAncestor(@Nonnull final String ancestor) {
+        // Skip the first element, which is "$ROOT".
+        for (int i = 1; i < this.stack.size(); ++i) {
+            if (this.stack.get(i).getTagName().equals(ancestor)) {
+                return true;
+            }
+            if ((this.stack.get(i).getTagSpec() != null)
+                    && (this.stack.get(i).getTagSpec().getSpec().getSpecName().equals(ancestor))) {
+                return true;
+            }
+        }
+        return false;
+    }
+
+    /**
+     * Returns true if the current tag has an ancestor which set the given marker.
+     * @param query the ancestor marker.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns true if the current tag has an ancestor which set the given marker.
+     */
+    public boolean hasAncestorMarker(@Nonnull final ValidatorProtos.AncestorMarker.Marker query) throws TagValidationException {
+        if (query == ValidatorProtos.AncestorMarker.Marker.UNKNOWN) {
+            throw new TagValidationException("Ancestor marker is unknown");
+        }
+        // Skip the first element, which is "$ROOT".
+        for (int i = 1; i < this.stack.size(); ++i) {
+            if (this.stack.get(i).getTagSpec() == null) {
+                continue;
+            }
+            final ValidatorProtos.TagSpec spec = this.stack.get(i).getTagSpec().getSpec();
+            if (!spec.hasMarkDescendants()) {
+                continue;
+            }
+            for (final ValidatorProtos.AncestorMarker.Marker marker : spec.getMarkDescendants().getMarkerList()) {
+                if (marker == query) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    }
+
+    /**
+     * Enter a tag, opening a scope for child tags.
+     * @param tagName the tag name.
+     * @param referencePointResult the reference point result.
+     * @param tagResult the tag result.
+     */
+    private void enterTag(@Nonnull final String tagName, @Nonnull final ValidateTagResult referencePointResult,
+                          @Nonnull final ValidateTagResult tagResult) {
+        final TagStackEntry stackEntry = new TagStackEntry(tagName);
+        stackEntry.setReferencePoint(referencePointResult.getBestMatchTagSpec());
+        stackEntry.setTagSpec(tagResult.getBestMatchTagSpec());
+        this.stack.add(stackEntry);
+    }
+
+    /**
+     * Upon exiting a tag, validation for the current child tag matcher is
+     * triggered, e.g. for checking that the tag had some specified number
+     * of children.
+     * @param context the context.
+     * @param result the ValidationResult.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void exitTag(@Nonnull final Context context, @Nonnull final ValidatorProtos.ValidationResult.Builder result)
+            throws TagValidationException {
+        if (this.stack.size() <= 0) {
+            throw new TagValidationException("Exiting an empty tag stack.");
+        }
+
+        this.unSetDescendantConstraintList();
+        final TagStackEntry topStackEntry = this.back();
+
+        if (topStackEntry.getChildTagMatcher() != null) {
+            topStackEntry.getChildTagMatcher().exitTag(context, result);
+        }
+        if (topStackEntry.getReferencePointMatcher() != null) {
+            topStackEntry.getReferencePointMatcher().exitParentTag(context, result);
+        }
+
+        this.stack.removeLast();
+    }
+
+    /**
+     * Given a ValidateTagResult, update the tag stack entry at the top of the
+     * tag stack to add any constraints from the spec.
+     * @param result the ValidateTagResult.
+     * @param parsedRules the ParsedValidatorRules.
+     * @param lineCol a pair of line/col.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void updateStackEntryFromTagResult(@Nonnull final ValidateTagResult result,
+                                              @Nonnull final ParsedValidatorRules parsedRules,
+                                              @Nonnull final Locator lineCol) throws TagValidationException {
+        if (result.getBestMatchTagSpec() == null) {
+            return;
+        }
+
+        final ParsedTagSpec parsedTagSpec = result.getBestMatchTagSpec();
+
+        this.setReferencePointMatcher(
+                parsedTagSpec.referencePointMatcher(parsedRules, lineCol));
+
+        // The following only add new constraints, not new allowances, so
+        // only add the constraints if the validation passed.
+        if (result.getValidationResult().getStatus()
+                == ValidatorProtos.ValidationResult.Status.PASS) {
+            this.setChildTagMatcher(parsedTagSpec.childTagMatcher());
+            this.setCdataMatcher(parsedTagSpec.cdataMatcher(lineCol));
+            this.setDescendantConstraintList(parsedTagSpec, parsedRules);
+        }
+    }
+
+    /**
+     * Update tagstack state after validating an encountered tag. Called with the
+     * best matching specs, even if not a match.
+     * @param encounteredTag the ParsedHtmlTag.
+     * @param referencePointResult reference point result.
+     * @param tagResult tag result.
+     * @param parsedRules parsed rules.
+     * @param lineCol a pair line/col.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void updateFromTagResults(
+            @Nonnull final ParsedHtmlTag encounteredTag, @Nonnull final ValidateTagResult referencePointResult,
+            @Nonnull final ValidateTagResult tagResult, @Nonnull final ParsedValidatorRules parsedRules,
+            @Nonnull final Locator lineCol) throws TagValidationException {
+        // Keep track of the number of direct children this tag has, even as we
+        // pop in and out of them on the stack.
+        this.parentStackEntry().incrementNumChildren();
+
+        // Record in the parent element that a reference point has been satisfied,
+        // even if the reference point didn't match completely.
+        if (referencePointResult.getBestMatchTagSpec() != null) {
+            if (this.parentReferencePointMatcher() == null) {
+                throw new TagValidationException("Parent's reference point matcher is null");
+            }
+            this.parentReferencePointMatcher().recordMatch(
+                    /** @type{!ParsedTagSpec} */ (referencePointResult.getBestMatchTagSpec()));
+        }
+
+        // The following only add new constraints, not new allowances, so
+        // only add the constraints if the validation passed.
+        if (tagResult.getValidationResult().getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+            final ParsedTagSpec parsedTagSpec = tagResult.getBestMatchTagSpec();
+            final ValidatorProtos.TagSpec tagSpec = parsedTagSpec.getSpec();
+            // Record that this tag must not have any siblings.
+            if (tagSpec.getSiblingsDisallowed()) {
+                this.tellParentNoSiblingsAllowed(tagSpec.getTagName(), lineCol);
+            }
+
+            // Record that this tag must be the last child of it's parent.
+            if (tagSpec.getMandatoryLastChild()) {
+                this.tellParentImTheLastChild(
+                        TagSpecUtils.getTagSpecName(tagSpec), TagSpecUtils.getTagSpecUrl(tagSpec), lineCol);
+            }
+        }
+
+        // Add the tag to the stack, and then update the stack entry.
+        this.enterTag(encounteredTag.upperName(), referencePointResult, tagResult);
+
+        this.updateStackEntryFromTagResult(
+                referencePointResult, parsedRules, lineCol);
+        this.updateStackEntryFromTagResult(tagResult, parsedRules, lineCol);
+    }
+
+    /**
+     * Updates the allowed descendants list if a tag introduced constraints. This
+     * is called when exiting a tag.
+     * @throws TagValidationException the TagValidationException.
+     */
+    private void unSetDescendantConstraintList() throws TagValidationException {
+        if (this.hasDescendantConstraintLists()) {
+            // pop operation, remove last item from list.
+            this.allowedDescendantsList.remove(this.allowedDescendantsList.size() - 1);
+            this.setHasDescendantConstraintLists(false);
+        }
+    }
+
+    /**
+     * @throws TagValidationException the TagValidationException.
+     * @return {boolean} true if the tag introduced descendant constraints.
+     * Else false.
+     */
+    private boolean hasDescendantConstraintLists() throws TagValidationException {
+        return this.back().getHasDescendantConstraintLists();
+    }
+
+    /**
+     * Setting descendant constraint lists.
+     * @throws TagValidationException the TagValidationException.
+     * @param value a boolean value.
+     */
+    private void setHasDescendantConstraintLists(final boolean value) throws TagValidationException {
+        this.back().setHasDescendantConstraintLists(value);
+    }
+
+    /**
+     * The number of children that have been discovered up to now by traversing
+     * the stack.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns parent stack's num children.
+     */
+    public int parentChildCount() throws TagValidationException {
+        return this.parentStackEntry().getNumChildren();
+    }
+
+    /**
+     * Sets the reference point matcher for the tag currently on the stack.
+     * @param matcher reference point matcher.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void setReferencePointMatcher(final ReferencePointMatcher matcher) throws TagValidationException {
+        if (matcher != null) {
+            this.back().setReferencePointMatcher(matcher);
+        }
+    }
+
+    /**
+     * Sets the child tag matcher for the tag currently on the stack.
+     * @param matcher child tag matcher.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void setChildTagMatcher(final ChildTagMatcher matcher) throws TagValidationException {
+        if (matcher != null) {
+            this.back().setChildTagMatcher(matcher);
+        }
+    }
+
+    /**
+     * Sets the cdata matcher for the tag currently on the stack.
+     * @param matcher Cdata matcher.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void setCdataMatcher(final CdataMatcher matcher) throws TagValidationException {
+        if (matcher != null) {
+            this.back().setCdataMatcher(matcher);
+        }
+    }
+
+    /**
+     * Returns the cdata matcher for the tag currently on the stack. If there
+     * is no cdata matcher, returns null.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the CdataMatcher for the tag currently on the stack.
+     */
+    public CdataMatcher cdataMatcher() throws TagValidationException {
+        return this.back().getCdataMatcher();
+    }
+
+    /**
+     * The name of the parent of the current tag.
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the parent stack entry tag name.
+     */
+    public String parentTagName() throws TagValidationException {
+        return this.parentStackEntry().getTagName();
+    }
+
+    /**
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the name of the tag with the 'last child' rule.
+     */
+    public String parentLastChildTagName() throws TagValidationException {
+        return this.parentStackEntry().getLastChildTagName();
+    }
+
+    /**
+     * @throws TagValidationException the TagValidationException.
+     * @return returns the spec url of the last child.
+     */
+    public String parentLastChildUrl() throws TagValidationException {
+        return this.parentStackEntry().getLastChildUrl();
+    }
+
+    /**
+     * @throws TagValidationException the TagValidationException.
+     * @return returns true if this tag's parent has a child with 'last child'
+     * rule. Else false.
+     */
+    public boolean parentHasChildWithLastChildRule() throws TagValidationException {
+        return this.parentLastChildTagName().length() > 0;
+    }
+
+    /**
+     * Setting the descendant constraint list.
+     * @param parsedTagSpec the parsed tag spec.
+     * @param parsedRules the parsed rules.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public void setDescendantConstraintList(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                            @Nonnull final ParsedValidatorRules parsedRules)
+                        throws TagValidationException {
+        if (parsedTagSpec.getSpec().getDescendantTagList() == null
+                || parsedTagSpec.getSpec().getDescendantTagList().equals("")) {
+            return;
+        }
+
+        List<String> allowedDescendantsForThisTag = new ArrayList<>();
+        for (final ValidatorProtos.DescendantTagList descendantTagList : parsedRules.getDescendantTagLists()) {
+            // Get the list matching this tag's descendant tag name.
+            if (parsedTagSpec.getSpec().getDescendantTagList().equals(descendantTagList.getName())) {
+                for (final String tag : descendantTagList.getTagList()) {
+                    allowedDescendantsForThisTag.add(tag);
+                }
+            }
+        }
+
+        final String tagName = TagSpecUtils.getTagSpecName(parsedTagSpec.getSpec());
+        if (tagName != null && !tagName.equals("")) {
+            this.allowedDescendantsList.add(new DescendantConstraints(
+                    TagSpecUtils.getTagSpecName(parsedTagSpec.getSpec()),
+                    allowedDescendantsForThisTag));
+            this.setHasDescendantConstraintLists(true);
+        }
+    }
+
+    /** The current tag name and its parents. */
+    @Nonnull
+    private LinkedList<TagStackEntry> stack;
+
+    /** Allowed descendant list. */
+    @Nonnull
+    private List<DescendantConstraints> allowedDescendantsList = new ArrayList<>();
+
+}
+
diff --git a/validator/java/src/main/java/dev/amp/validator/TagStackEntry.java b/validator/java/src/main/java/dev/amp/validator/TagStackEntry.java
new file mode 100644
index 0000000000000..2b5cea3b2c594
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/TagStackEntry.java
@@ -0,0 +1,320 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+
+
+package dev.amp.validator;
+
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+
+/**
+ * This class is the unit definition of the TagStack collection.
+ * It is responsible for containing information relevant to evaluation of
+ * future tags. It is a wrapper for the individual tags found in the html
+ * document and maintains a record of child-parent relationships.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class TagStackEntry {
+    /**
+     * Constructor.
+     *
+     * @param tagName the tag name.
+     */
+    public TagStackEntry(@Nonnull final String tagName) {
+        this.tagName = tagName;
+        this.tagSpec = null;
+        this.referencePoint = null;
+        this.hasDescendantConstraintLists = false;
+        this.numChildren = 0;
+        this.onlyChildTagName = "";
+        this.onlyChildErrorLineCol = null;
+        this.lastChildSiblingCount = 0;
+        this.lastChildTagName = "";
+        this.lastChildUrl = "";
+        this.lastChildErrorLineCol = null;
+        this.cdataMatcher = null;
+        this.childTagMatcher = null;
+        this.referencePointMatcher = null;
+    }
+
+    /**
+     * Getting the ParsedTagSpec instance.
+     * @return the ParsedTagSpec instance.
+     */
+    public ParsedTagSpec getTagSpec() {
+        return tagSpec;
+    }
+
+    /**
+     * Getting the parsed tag spec of the reference point.
+     * @return returns the parsed tag spec of the reference point.
+     */
+    public ParsedTagSpec getReferencePoint() {
+        return referencePoint;
+    }
+
+    /**
+     * Getting the descendant constraint list.
+     * @return returns the descendant constraint list.
+     */
+    public boolean getHasDescendantConstraintLists() {
+        return hasDescendantConstraintLists;
+    }
+
+    /**
+     * Setting the descendant constraint lists value.
+     * @param hasDescendantConstraintLists descendant constraint lists value.
+     */
+    public void setHasDescendantConstraintLists(final boolean hasDescendantConstraintLists) {
+        this.hasDescendantConstraintLists = hasDescendantConstraintLists;
+    }
+
+    /**
+     * Setting the parsed tag spec of the reference point.
+     * @param referencePoint parsed tag spec.
+     */
+    public void setReferencePoint(@Nonnull final ParsedTagSpec referencePoint) {
+        this.referencePoint = referencePoint;
+    }
+
+    /**
+     * Setting the parsed tag spec.
+     * @param tagSpec tag spec.
+     */
+    public void setTagSpec(@Nonnull final ParsedTagSpec tagSpec) {
+        this.tagSpec = tagSpec;
+    }
+
+    /**
+     * Getting the child tag matcher.
+     * @return returns child tag matcher.
+     */
+    public ChildTagMatcher getChildTagMatcher() {
+        return childTagMatcher;
+    }
+
+    /**
+     * Setting the child tag matcher.
+     * @param childTagMatcher child tag matcher.
+     */
+    public void setChildTagMatcher(@Nonnull final ChildTagMatcher childTagMatcher) {
+        this.childTagMatcher = childTagMatcher;
+    }
+
+    /**
+     * Setting the Cdata matcher.
+     * @param cdataMatcher Cdata matcher.
+     */
+    public void setCdataMatcher(@Nonnull final CdataMatcher cdataMatcher) {
+        this.cdataMatcher = cdataMatcher;
+    }
+
+    /**
+     * Getting the reference point matcher.
+     * @return returns the reference point matcher.
+     */
+    public ReferencePointMatcher getReferencePointMatcher() {
+        return referencePointMatcher;
+    }
+
+    /**
+     * Returning the number children count.
+     * @return returns the number children count.
+     */
+    public int getNumChildren() {
+        return numChildren;
+    }
+
+    /**
+     * Increment the number children count.
+     */
+    public void incrementNumChildren() {
+        numChildren++;
+    }
+
+    /**
+     * Setting the only child tag name.
+     * @param name only child tag name.
+     */
+    public void setOnlyChildTagName(@Nonnull final String name) {
+        this.onlyChildTagName = name;
+    }
+
+    /**
+     * Getting the only child tag name.
+     * @return returns the only child tag name.
+     */
+    public String getOnlyChildTagName() {
+        return onlyChildTagName;
+    }
+
+    /**
+     * Setting the only child error line col.
+     * @param lineCol the pair of line/col.
+     */
+    public void setOnlyChildErrorLineCol(@Nonnull final Locator lineCol) {
+        this.onlyChildErrorLineCol = lineCol;
+    }
+
+    /**
+     * Getting the only child error line col.
+     * @return returns a pair of line/col.
+     */
+    public Locator getOnlyChildErrorLineCol() {
+        return onlyChildErrorLineCol;
+    }
+
+    /**
+     * Setting the reference point matcher.
+     * @param referencePointMatcher reference point matcher.
+     */
+    public void setReferencePointMatcher(@Nonnull final ReferencePointMatcher referencePointMatcher) {
+        this.referencePointMatcher = referencePointMatcher;
+    }
+
+    /**
+     * Setting the last child tag name.
+     * @param tagName last child tag name.
+     */
+    public void setLastChildTagName(@Nonnull final String tagName) {
+        this.lastChildTagName = tagName;
+    }
+
+    /**
+     * Getting the last child tag name.
+     * @return returns the last child tag name.
+     */
+    public String getLastChildTagName() {
+        return lastChildTagName;
+    }
+
+    /**
+     * Getting the last child url.
+     * @return returns the last child url.
+     */
+    public String getLastChildUrl() {
+        return lastChildUrl;
+    }
+
+    /**
+     * Setting the last child url.
+     * @param lastChildUrl the last child url.
+     */
+    public void setLastChildUrl(@Nonnull final String lastChildUrl) {
+        this.lastChildUrl = lastChildUrl;
+    }
+
+    /**
+     * Getting the last child error line col.
+     * @return returns the last child error line col.
+     */
+    public Locator getLastChildErrorLineCol() {
+        return lastChildErrorLineCol;
+    }
+
+    /**
+     * Setting the last child error line col.
+     * @param lastChildErrorLineCol last child error line col.
+     */
+    public void setLastChildErrorLineCol(@Nonnull final Locator lastChildErrorLineCol) {
+        this.lastChildErrorLineCol = lastChildErrorLineCol;
+    }
+
+    /**
+     * Getting the Cdata matcher.
+     * @return returns the Cdata matcher.
+     */
+    public CdataMatcher getCdataMatcher() {
+        return cdataMatcher;
+    }
+
+    /**
+     * Getting the tag name.
+     * @return returns the tag name.
+     */
+    public String getTagName() {
+        return this.tagName;
+    }
+
+    /**
+     * Clean up reference, improve gc performance.
+     */
+    public void cleanup() {
+        this.tagName = null;
+        this.tagSpec = null;
+        this.referencePoint = null;
+        this.onlyChildTagName = null;
+        this.onlyChildErrorLineCol = null;
+        this.lastChildTagName = null;
+        this.lastChildUrl = null;
+        this.lastChildErrorLineCol = null;
+        this.cdataMatcher = null;
+        this.childTagMatcher = null;
+        this.referencePointMatcher = null;
+    }
+
+    /** Tag name. */
+    private String tagName;
+
+    /** Tag spec object. */
+    private ParsedTagSpec tagSpec;
+
+    /** Tag spec of a reference point. */
+    private ParsedTagSpec referencePoint;
+
+    /** Flag for descendant constraint lists. */
+    private boolean hasDescendantConstraintLists;
+
+    /** Children count. */
+    private int numChildren;
+
+    /** Only child tag name. */
+    private String onlyChildTagName;
+
+    /** only child error line/col. */
+    private Locator onlyChildErrorLineCol;
+
+    /** Last child sibling count. */
+    private int lastChildSiblingCount;
+
+    /** Last child tag name. */
+    private String lastChildTagName;
+
+    /** Last child url. */
+    private String lastChildUrl;
+
+    /** Last child error line col. */
+    private Locator lastChildErrorLineCol;
+
+    /** Cdata matcher. */
+    private CdataMatcher cdataMatcher;
+
+    /** Child tag matcher. */
+    private ChildTagMatcher childTagMatcher;
+
+    /** Reference point matcher. */
+    private ReferencePointMatcher referencePointMatcher;
+}
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/UrlErrorAdapter.java b/validator/java/src/main/java/dev/amp/validator/UrlErrorAdapter.java
new file mode 100644
index 0000000000000..5154e7e673311
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/UrlErrorAdapter.java
@@ -0,0 +1,74 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+/**
+ * An url error adaptor interface.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public interface UrlErrorAdapter {
+    /**
+     * Adding missing url validation error.
+     *
+     * @param context context.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    void missingUrl(Context context, ValidatorProtos.TagSpec tagSpec,
+                           ValidatorProtos.ValidationResult.Builder result);
+
+    /**
+     * Adding invalid url validation error.
+     *
+     * @param context context.
+     * @param url the url.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    void invalidUrl(Context context, String url, ValidatorProtos.TagSpec tagSpec,
+                           ValidatorProtos.ValidationResult.Builder result);
+
+    /**
+     * Adding invalid url protocol error.
+     *
+     * @param context context.
+     * @param protocol the protocol.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    void invalidUrlProtocol(Context context, String protocol, ValidatorProtos.TagSpec tagSpec,
+                           ValidatorProtos.ValidationResult.Builder result);
+
+    /**
+     * Adding disallowed relative url error.
+     *
+     * @param context context.
+     * @param url the url.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    void disallowedRelativeUrl(Context context, String url, ValidatorProtos.TagSpec tagSpec,
+                           ValidatorProtos.ValidationResult.Builder result);
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/UrlErrorInAttrAdapter.java b/validator/java/src/main/java/dev/amp/validator/UrlErrorInAttrAdapter.java
new file mode 100644
index 0000000000000..93bb341ef4181
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/UrlErrorInAttrAdapter.java
@@ -0,0 +1,145 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.utils.TagSpecUtils;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * URL error in attribute adaptor.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class UrlErrorInAttrAdapter implements UrlErrorAdapter {
+    /**
+     * Constructor.
+     * @param attrName attribute name.
+     */
+    public UrlErrorInAttrAdapter(@Nonnull final String attrName) {
+        this.attrName = attrName;
+    }
+
+    /**
+     * Adding missing url validation error.
+     *
+     * @param context context.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void missingUrl(@Nonnull final Context context,
+                           @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                           @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(this.attrName);
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        context.addError(
+                ValidatorProtos.ValidationError.Code.MISSING_URL,
+                context.getLineCol(),
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /**
+     * Adding invalid url validation error.
+     *
+     * @param context context.
+     * @param url the url.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void invalidUrl(@Nonnull final Context context,
+                           @Nonnull final String url,
+                           @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                           @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(this.attrName);
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        params.add(url);
+        context.addError(
+                ValidatorProtos.ValidationError.Code.INVALID_URL,
+                context.getLineCol(),
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /**
+     * Adding invalid url protocol error.
+     *
+     * @param context context.
+     * @param protocol the protocol.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void invalidUrlProtocol(@Nonnull final Context context,
+                       @Nonnull final String protocol,
+                       @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                       @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(this.attrName);
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        params.add(protocol);
+        context.addError(
+                ValidatorProtos.ValidationError.Code.INVALID_URL_PROTOCOL,
+                context.getLineCol(),
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /**
+     * Adding disallowed relative url error.
+     *
+     * @param context context.
+     * @param url the url.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void disallowedRelativeUrl(@Nonnull final Context context,
+                          @Nonnull final String url,
+                          @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                          @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(this.attrName);
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        params.add(url);
+        context.addError(
+                ValidatorProtos.ValidationError.Code.DISALLOWED_RELATIVE_URL,
+                context.getLineCol(),
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /** Attribute name. */
+    private final String attrName;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/UrlErrorInStylesheetAdapter.java b/validator/java/src/main/java/dev/amp/validator/UrlErrorInStylesheetAdapter.java
new file mode 100644
index 0000000000000..a2fd88787c64f
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/UrlErrorInStylesheetAdapter.java
@@ -0,0 +1,151 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.utils.TagSpecUtils;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * URL error in stylesheet adapter.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class UrlErrorInStylesheetAdapter implements UrlErrorAdapter {
+    /**
+     * Constructor.
+     *
+     * @param lineNumber line number.
+     * @param columnNumber column number.
+     */
+    public UrlErrorInStylesheetAdapter(final int lineNumber, final int columnNumber) {
+        this.lineNumber = lineNumber;
+        this.columnNumber = columnNumber;
+    }
+
+    /**
+     * Adding missing url validation error.
+     *
+     * @param context context.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void missingUrl(@Nonnull final Context context,
+                           @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                           @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        context.addError(
+                ValidatorProtos.ValidationError.Code.CSS_SYNTAX_MISSING_URL,
+                lineNumber,
+                columnNumber,
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /**
+     * Adding invalid url validation error.
+     *
+     * @param context context.
+     * @param url the url.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void invalidUrl(@Nonnull final Context context,
+                           @Nonnull final String url,
+                           @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                           @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        params.add(url);
+        context.addError(
+                ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_URL,
+                lineNumber,
+                columnNumber,
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /**
+     * Adding invalid url protocol error.
+     *
+     * @param context context.
+     * @param protocol the protocol.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void invalidUrlProtocol(@Nonnull final Context context,
+                                   @Nonnull final String protocol,
+                                   @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                                   @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        params.add(protocol);
+        context.addError(
+                ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_URL_PROTOCOL,
+                lineNumber,
+                columnNumber,
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /**
+     * Adding disallowed relative url error.
+     *
+     * @param context context.
+     * @param url the url.
+     * @param tagSpec tag spec.
+     * @param result validation result.
+     */
+    @Override
+    public void disallowedRelativeUrl(@Nonnull final Context context,
+                                      @Nonnull final String url,
+                                      @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                                      @Nonnull final  ValidatorProtos.ValidationResult.Builder result) {
+        final List<String> params = new ArrayList<>();
+        params.add(TagSpecUtils.getTagSpecName(tagSpec));
+        params.add(url);
+        context.addError(
+                ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_RELATIVE_URL,
+                lineNumber,
+                columnNumber,
+                /* params */params,
+                TagSpecUtils.getTagSpecUrl(tagSpec),
+                result);
+    }
+
+    /** A line number. */
+    private final int lineNumber;
+
+    /** A column number. */
+    private final int columnNumber;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/ValidateTagResult.java b/validator/java/src/main/java/dev/amp/validator/ValidateTagResult.java
new file mode 100644
index 0000000000000..0fd47f4fc88d2
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/ValidateTagResult.java
@@ -0,0 +1,86 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import javax.annotation.Nonnull;
+
+/**
+ * This class contains the validation result and the best match tag spec.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ValidateTagResult {
+    /**
+     * Constructor.
+     * @param validationResult validation result.
+     * @param parsedTagSpec parsed tag spec.
+     */
+    public ValidateTagResult(@Nonnull final ValidatorProtos.ValidationResult.Builder validationResult,
+                             final ParsedTagSpec parsedTagSpec) {
+        this.validationResult = validationResult;
+        this.bestMatchTagSpec = parsedTagSpec;
+    }
+
+    /**
+     * Return best match tag spec.
+     * @return returns best match tag spec.
+     */
+    public ParsedTagSpec getBestMatchTagSpec() {
+        return bestMatchTagSpec;
+    }
+
+    /**
+     * Setting the best match tag spec.
+     * @param bestMatchTagSpec best match tag spec.
+     */
+    public void setBestMatchTagSpec(@Nonnull final ParsedTagSpec bestMatchTagSpec) {
+        this.bestMatchTagSpec = bestMatchTagSpec;
+    }
+
+    /**
+     * Getting the validation result.
+     * @return returns the validation result.
+     */
+    public ValidatorProtos.ValidationResult.Builder getValidationResult() {
+        return validationResult;
+    }
+
+    /**
+     * Setting the validation result.
+     * @param validationResult validation result.
+     */
+    public void setValidationResult(@Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        this.validationResult = validationResult;
+    }
+
+    /**
+     * Validation result.
+     */
+    private ValidatorProtos.ValidationResult.Builder validationResult;
+
+    /**
+     * Best match tag spec.
+     */
+    private ParsedTagSpec bestMatchTagSpec;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/AtRule.java b/validator/java/src/main/java/dev/amp/validator/css/AtRule.java
new file mode 100644
index 0000000000000..06460ac724ce3
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/AtRule.java
@@ -0,0 +1,129 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.visitor.RuleVisitor;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * Object model for @rules of css content.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class AtRule extends Rule {
+
+    /**
+     * Constructor.
+     * @param name of AtRule
+     */
+    public AtRule(@Nonnull final String name) {
+        super();
+        this.rules = new ArrayList<>();
+        this.declarations = new ArrayList<>();
+        this.prelude = new ArrayList<>();
+        this.name = name;
+    }
+
+    /**
+     * Return type of token.
+     *
+     * @return TokenType.AT_RULE
+     */
+    @Override
+    public TokenType getTokenType() {
+        return TokenType.AT_RULE;
+    }
+
+    /**
+     * Setter for rules.
+     *
+     * @param rules to set within at rules
+     */
+    public void setRules(@Nonnull final List<Rule> rules) {
+        this.rules = rules;
+    }
+
+    /**
+     * Setter for declarations.
+     *
+     * @param declarations to set within at rules
+     */
+    public void setDeclarations(@Nonnull final List<Declaration> declarations) {
+        this.declarations = declarations;
+    }
+
+    /**
+     * Getter of name.
+     *
+     * @return name
+     */
+    public String getName() {
+        if (name.length() > 0) {
+            return name.substring(1);
+        }
+
+        return name;
+    }
+
+    /**
+     * Getter for prelude.
+     *
+     * @return prelude list
+     */
+    public List<com.steadystate.css.parser.Token> getPrelude() {
+        return prelude;
+    }
+
+    /**
+     * Visit a rule.
+     *
+     * @param visitor rule visitor.
+     */
+    @Override
+    public void accept(@Nonnull final RuleVisitor visitor) throws CssValidationException {
+        visitor.visitAtRule(this);
+        for (final Rule rule : this.rules) {
+            rule.accept(visitor);
+        }
+        for (final Declaration declaration : this.declarations) {
+            declaration.accept(visitor);
+        }
+        visitor.leaveAtRule(this);
+    }
+
+    @Nonnull
+    private List<Rule> rules;
+
+    @Nonnull
+    private List<Declaration> declarations;
+
+    @Nonnull
+    private final String name;
+
+    @Nonnull
+    private List<com.steadystate.css.parser.Token> prelude;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/Canonicalizer.java b/validator/java/src/main/java/dev/amp/validator/css/Canonicalizer.java
new file mode 100644
index 0000000000000..773ac1d794f3a
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/Canonicalizer.java
@@ -0,0 +1,510 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.Token;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.Map;
+
+import static dev.amp.validator.utils.CssSpecUtils.asciiMatch;
+import static dev.amp.validator.utils.CssSpecUtils.stripVendorPrefix;
+
+/**
+ * Process and validate a css document.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class Canonicalizer {
+
+    private static final int K_MAXIMUM_CSS_RECURSION = 100;
+
+    /**
+     * Constructor for canonicalizer.
+     *
+     * @param atRuleSpec  the AtRule Spec to validate against
+     * @param defaultSpec the block type to process as
+     */
+    public Canonicalizer(@Nonnull final Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec,
+                         @Nonnull final ValidatorProtos.AtRuleSpec.BlockType defaultSpec) {
+        this.atRuleSpec = atRuleSpec;
+        this.defaultAtRuleSpec = defaultSpec;
+    }
+
+    /**
+     * Parses and returns a list of rules, such as at the top level of a stylesheet.
+     * Return list has only QualifiedRule's and AtRule's as top level elements.
+     *
+     * @param tokenList the css content
+     * @param topLevel  the relative top level to parse from
+     * @param errors    output array for the errors.
+     * @return list of rules
+     * @throws CssValidationException Css Validation Exception
+     */
+    public List<Rule> parseAListOfRules(@Nonnull final List<Token> tokenList, final boolean topLevel,
+                                        @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        TokenStream tokenStream = new TokenStream(tokenList);
+        final List<Rule> rules = new ArrayList<>();
+
+        while (true) {
+            tokenStream.consume();
+            TokenType current = CssTokenUtil.getTokenType(tokenStream.current());
+            if (current == TokenType.WHITESPACE) {
+                continue;
+            } else if (current == TokenType.EOF_TOKEN) {
+                return rules;
+            } else if (current == TokenType.CDO
+                    || current == TokenType.CDC) {
+                if (topLevel) {
+                    continue;
+                }
+                this.parseAQualifiedRule(tokenStream, rules, errors);
+            } else if (current == TokenType.AT_KEYWORD) {
+                rules.add(this.parseAnAtRule(tokenStream, errors));
+            } else {
+                this.parseAQualifiedRule(tokenStream, rules, errors);
+            }
+        }
+    }
+
+    /**
+     * Extracts an atRule from beginning of token stream
+     *
+     * @param tokenStream the css content to process
+     * @param errors      generated from parse job
+     * @return an AtRule extracted from the token stream
+     * @throws CssValidationException Css Validation Exception
+     */
+    private AtRule parseAnAtRule(@Nonnull final TokenStream tokenStream,
+                                 @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        if (CssTokenUtil.getTokenType(tokenStream.current()) != TokenType.AT_KEYWORD) {
+            throw new CssValidationException("Internal Error: parseAnAtRule precondition not met");
+        }
+
+        final Token startToken = tokenStream.current();
+        final AtRule rule = new AtRule(startToken.toString());
+        CssTokenUtil.copyPosTo(startToken, rule);
+
+        while (true) {
+            tokenStream.consume();
+            final TokenType current = CssTokenUtil.getTokenType(tokenStream.current());
+            if (current == TokenType.SEMICOLON
+                    || current == TokenType.EOF_TOKEN) {
+                rule.getPrelude().add(tokenStream.current());
+                return rule;
+            }
+            if (current == TokenType.OPEN_CURLY) {
+                rule.getPrelude().add(CssTokenUtil.copyPosTo(tokenStream.current(), new EOFToken()));
+
+                List<Token> contents = extractASimpleBlock(tokenStream, errors);
+
+                switch (this.blockTypeFor(rule)) {
+                    case PARSE_AS_RULES: {
+                        rule.setRules(this.parseAListOfRules(contents, /* topLevel */ false, errors));
+                        break;
+                    }
+                    case PARSE_AS_DECLARATIONS: {
+                        rule.setDeclarations(this.parseAListOfDeclarations(contents, errors));
+                        break;
+                    }
+                    case PARSE_AS_IGNORE: {
+                        break;
+                    }
+                    default: {
+                        throw new CssValidationException(
+                                "Unrecognized blockType " + this.blockTypeFor(rule));
+                    }
+                }
+                return rule;
+            }
+            if (!consumeAComponentValue(tokenStream, rule.getPrelude(), /*depth*/0)) {
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+                errors.add((ErrorToken) CssTokenUtil.copyPosTo(tokenStream.current(), new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_EXCESSIVELY_NESTED, params)));
+            }
+        }
+
+    }
+
+    /**
+     * returns a list of Declarations from css content
+     *
+     * @param tokenList of tokens within a block
+     * @param errors    output array for the errors.
+     * @return a list of Declarations
+     * @throws CssValidationException Css Validation Exception
+     */
+    public List<Declaration> parseAListOfDeclarations(@Nonnull final List<Token> tokenList, @Nonnull final List<ErrorToken> errors)
+            throws CssValidationException {
+        final List<Declaration> decls = new ArrayList<>();
+        TokenStream tokenStream = new TokenStream(tokenList);
+        while (true) {
+            tokenStream.consume();
+            final TokenType current = CssTokenUtil.getTokenType(tokenStream.current());
+            if (current == TokenType.WHITESPACE
+                    || current == TokenType.SEMICOLON) {
+                continue;
+            } else if (current == TokenType.EOF_TOKEN) {
+                return decls;
+            } else if (current == TokenType.AT_KEYWORD) {
+                // The CSS3 Parsing spec allows for AT rules inside lists of
+                // declarations, but our grammar does not so we deviate a tiny bit here.
+                // We consume an AT rule, but drop it and instead push an error token.
+                final AtRule atRule = this.parseAnAtRule(tokenStream, errors);
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+                params.add(atRule.getName());
+                errors.add((ErrorToken) CssTokenUtil.copyPosTo(atRule, new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_AT_RULE, params)));
+            } else if (current == TokenType.IDENT) {
+                this.parseADeclaration(tokenStream, decls, errors);
+            } else {
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+
+                errors.add((ErrorToken) CssTokenUtil.copyPosTo(tokenStream.current(), new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_DECLARATION,
+                        params)));
+                tokenStream.reconsume();
+                while (!(CssTokenUtil.getTokenType(tokenStream.next()) == TokenType.SEMICOLON
+                        || CssTokenUtil.getTokenType(tokenStream.next()) == TokenType.EOF_TOKEN)) {
+                    tokenStream.consume();
+                    List<Token> dummyTokenList = new ArrayList<>();
+                    if (!consumeAComponentValue(tokenStream, dummyTokenList, /*depth*/0)) {
+
+                        errors.add((ErrorToken) CssTokenUtil.copyPosTo(tokenStream.current(), new ErrorToken(
+                                ValidatorProtos.ValidationError.Code.CSS_EXCESSIVELY_NESTED,
+                                params)));
+                    }
+                }
+            }
+
+        }
+    }
+
+    /**
+     * Adds one element to either declarations or errors.
+     *
+     * @param tokenStream  the css tokens to parse
+     * @param declarations output array for
+     *                     declarations
+     * @param errors       output array for the errors.
+     * @throws CssValidationException Css Validation Exception
+     */
+    public void parseADeclaration(@Nonnull final TokenStream tokenStream, @Nonnull final List<Declaration> declarations,
+                                  @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+
+        if (CssTokenUtil.getTokenType(tokenStream.current()) != TokenType.IDENT) {
+            throw new CssValidationException("Internal Error: parseADeclaration precondition not met");
+        }
+
+        Token startToken = tokenStream.current();
+        final Declaration decl = (Declaration) CssTokenUtil.copyPosTo(startToken,
+                new Declaration(startToken.toString()));
+
+        while (CssTokenUtil.getTokenType(tokenStream.next()) == TokenType.WHITESPACE) {
+            tokenStream.consume();
+        }
+
+        tokenStream.consume();
+        if (!(CssTokenUtil.getTokenType(tokenStream.current()) == TokenType.COLON)) {
+            final List<String> params = new ArrayList<>();
+            params.add("style");
+
+            errors.add((ErrorToken) CssTokenUtil.copyPosTo(startToken, new ErrorToken(
+                    ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INCOMPLETE_DECLARATION,
+                    params)));
+            tokenStream.reconsume();
+            while (
+                    !(CssTokenUtil.getTokenType(tokenStream.next()) == TokenType.SEMICOLON
+                            || CssTokenUtil.getTokenType(tokenStream.next()) == TokenType.EOF_TOKEN)) {
+                tokenStream.consume();
+            }
+            return;
+        }
+
+        while (!(CssTokenUtil.getTokenType(tokenStream.next()) == TokenType.SEMICOLON
+                        || CssTokenUtil.getTokenType(tokenStream.next()) == TokenType.EOF_TOKEN)) {
+            tokenStream.consume();
+            if (!consumeAComponentValue(tokenStream, decl.getValue(), /*depth*/0)) {
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+
+                errors.add((ErrorToken) CssTokenUtil.copyPosTo(startToken, new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_EXCESSIVELY_NESTED,
+                        params)));
+            }
+            decl.getValue().add(CssTokenUtil.copyPosTo(tokenStream.next(), new EOFToken()));
+
+            boolean foundImportant = false;
+            for (int i = decl.getValue().size() - 1; i >= 0; i--) {
+                if (CssTokenUtil.getTokenType(decl.getValue().get(i)) == TokenType.WHITESPACE) {
+                    continue;
+                } else if (
+                        CssTokenUtil.getTokenType(decl.getValue().get(i)) == TokenType.IDENT
+                                && asciiMatch(decl.getValue().get(i), "important")) {
+                    foundImportant = true;
+                } else if (foundImportant && CssTokenUtil.getTokenType(decl.getValue().get(i)) == TokenType.DELIM
+                        && decl.getValue().get(i).getValue().equals("!")) {
+                    decl.getValue().subList(i, decl.getValue().size()).clear();
+                    decl.setImportant(true);
+                    break;
+                } else {
+                    break;
+                }
+            }
+        }
+
+        declarations.add(decl);
+    }
+
+    /**
+     * Returns a type telling us how to canonicalize a given AT rule's block.
+     *
+     * @param atRule
+     * @return the block type of an atRule
+     */
+    private ValidatorProtos.AtRuleSpec.BlockType blockTypeFor(@Nonnull final AtRule atRule) {
+        final ValidatorProtos.AtRuleSpec.BlockType maybeBlockType = this.atRuleSpec.get(stripVendorPrefix(atRule.getName()));
+        if (maybeBlockType != null) {
+            return maybeBlockType;
+        } else {
+            return this.defaultAtRuleSpec;
+        }
+    }
+
+    /**
+     * Returns a simple block's contents in tokenStream, excluding the
+     * start/end grouping token, and appended with an EOFToken.
+     *
+     * @param tokenStream the token stream of html content
+     * @param errors      generated from extraction
+     * @return a list of tokens in a block.
+     * @throws CssValidationException Css Validation Exception
+     */
+    private List<Token> extractASimpleBlock(@Nonnull final TokenStream tokenStream,
+                                            @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        /** @type {!Array<!parse_css.Token>} */
+        final List<Token> consumedTokens = new ArrayList<Token>();
+        if (!consumeASimpleBlock(tokenStream, consumedTokens, /*depth*/0)) {
+            final List<String> params = new ArrayList<>();
+            params.add("style");
+            errors.add((ErrorToken) CssTokenUtil.copyPosTo(tokenStream.current(), new ErrorToken(
+                    ValidatorProtos.ValidationError.Code.CSS_EXCESSIVELY_NESTED, params)));
+        }
+
+        // A simple block always has a start token (e.g. '{') and
+        // either a closing token or EOF token.
+        if (consumedTokens.size() < 2) {
+            throw new CssValidationException("size of consumedTokens less than 2");
+        }
+
+        // Exclude the start token. Convert end token to EOF.
+        final int end = consumedTokens.size() - 1;
+        consumedTokens.set(end, CssTokenUtil.copyPosTo(consumedTokens.get(end), new EOFToken()));
+        return consumedTokens.subList(1, consumedTokens.size());
+    }
+
+    /**
+     * Consumes one or more tokens from a tokenStream, appending them to a
+     * tokenList. If exceeds depth, returns false
+     *
+     * @param tokenStream the stream of token content
+     * @param tokenList   output array for tokens.
+     * @param depth the depth to check against exceeding
+     * @return true iff finished consuming without exceeding depth
+     * @throws CssValidationException Css Validation Exception
+     */
+    public static boolean consumeAComponentValue(@Nonnull final TokenStream tokenStream,
+                                                 @Nonnull final List<Token> tokenList,
+                                                 final int depth) throws CssValidationException {
+        if (depth > K_MAXIMUM_CSS_RECURSION) {
+            return false;
+        }
+        final TokenType current = CssTokenUtil.getTokenType(tokenStream.current());
+        if (current == TokenType.OPEN_CURLY
+                || current == TokenType.OPEN_SQUARE
+                || current == TokenType.OPEN_PAREN) {
+            if (!consumeASimpleBlock(tokenStream, tokenList, depth + 1)) {
+                return false;
+            }
+        } else if (current == TokenType.FUNCTION_TOKEN) {
+            if (!consumeAFunction(tokenStream, tokenList, depth + 1)) {
+                return false;
+            }
+        } else {
+            tokenList.add(tokenStream.current());
+        }
+        return true;
+    }
+
+    /**
+     * Appends a function's contents to a tokenList, consuming from the
+     * stream all those tokens that it adds to the tokenList, including
+     * the function token and end grouping token. If exceeds depth, returns false.
+     *
+     * @param tokenStream of html document block
+     * @param tokenList   output array for tokens.
+     * @param depth       to check against exceeding
+     * @return true iff depth not exceeded
+     * @throws CssValidationException Css Validation Exception
+     */
+    private static boolean consumeAFunction(@Nonnull final TokenStream tokenStream,
+                                            @Nonnull final List<Token> tokenList,
+                                            final int depth) throws CssValidationException {
+        if (depth > K_MAXIMUM_CSS_RECURSION) {
+            return false;
+        }
+        if (CssTokenUtil.getTokenType(tokenStream.current()) != TokenType.FUNCTION_TOKEN) {
+            throw new CssValidationException("Internal Error: consumeAFunction precondition not met");
+        }
+        tokenList.add(tokenStream.current());
+        while (true) {
+            tokenStream.consume();
+            final TokenType current = CssTokenUtil.getTokenType(tokenStream.current());
+            if (current == TokenType.EOF_TOKEN
+                    || current == TokenType.CLOSE_PAREN) {
+                tokenList.add(tokenStream.current());
+                return true;
+            } else {
+                if (!consumeAComponentValue(tokenStream, tokenList, depth + 1)) {
+                    return false;
+                }
+            }
+        }
+    }
+
+    /**
+     * Appends a simple block's contents to a tokenList, consuming from
+     * the stream all those tokens that it adds to the tokenList,
+     * including the start/end grouping token. If exceeds depth, returns false.
+     *
+     * @param tokenStream of html document block
+     * @param tokenList   output array for tokens.
+     * @param depth       to check against exceeding
+     * @return true iff depth not exceeded
+     * @throws CssValidationException Css Validation Exception
+     */
+    private static boolean consumeASimpleBlock(@Nonnull final TokenStream tokenStream,
+                                               @Nonnull final List<Token> tokenList,
+                                               final int depth) throws CssValidationException {
+        if (depth > K_MAXIMUM_CSS_RECURSION) {
+            return false;
+        }
+        TokenType current = CssTokenUtil.getTokenType(tokenStream.current());
+        if (current != TokenType.OPEN_CURLY
+                && current != TokenType.OPEN_SQUARE && current != TokenType.OPEN_PAREN) {
+            throw new CssValidationException("Internal Error: consumeASimpleBlock precondition not met");
+
+        }
+
+        final Token startToken = tokenStream.current();
+        final String mirror = CssTokenUtil.getMirror(startToken);
+
+        tokenList.add(startToken);
+        while (true) {
+            tokenStream.consume();
+            current = CssTokenUtil.getTokenType(tokenStream.current());
+            if (current == TokenType.EOF_TOKEN) {
+                tokenList.add(tokenStream.current());
+                return true;
+            } else if (
+                    (current == TokenType.CLOSE_CURLY
+                            || current == TokenType.CLOSE_SQUARE
+                            || current == TokenType.CLOSE_PAREN)
+                            && (tokenStream.current()).toString().equals(mirror)) {
+//                            /** @type {parse_css.GroupingToken} */(tokenStream.current()).getValue() ==
+//                            mirror) {
+                tokenList.add(tokenStream.current());
+                return true;
+            } else {
+                if (!consumeAComponentValue(tokenStream, tokenList, depth + 1)) {
+                    return false;
+                }
+            }
+        }
+    }
+
+    /**
+     * Parses one Qualified rule or ErrorToken appended to either rules or errors
+     * respectively. Rule will include a prelude with the CSS selector (if any)
+     * and a list of declarations.
+     *
+     * @param tokenStream input token stream.
+     * @param rules       output array for new rule
+     * @param errors      output array for new error.
+     * @throws CssValidationException Css Validation Exception
+     */
+    private void parseAQualifiedRule(@Nonnull final TokenStream tokenStream, @Nonnull final List<Rule> rules,
+                                     @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        if (CssTokenUtil.getTokenType(tokenStream.current()) == TokenType.EOF_TOKEN
+                || CssTokenUtil.getTokenType(tokenStream.current()) == TokenType.AT_KEYWORD) {
+            throw new CssValidationException("Internal Error: parseAQualifiedRule precondition not met");
+        }
+
+        final QualifiedRule rule = (QualifiedRule) CssTokenUtil.copyPosTo(tokenStream.current(), new QualifiedRule());
+        tokenStream.reconsume();
+        while (true) {
+            tokenStream.consume();
+            final TokenType current = CssTokenUtil.getTokenType(tokenStream.current());
+            if (current == TokenType.EOF_TOKEN) {
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+                errors.add((ErrorToken) CssTokenUtil.copyPosTo(rule, new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_EOF_IN_PRELUDE_OF_QUALIFIED_RULE, params)));
+                return;
+            }
+            if (current == TokenType.OPEN_CURLY) {
+                rule.getPrelude().add(
+                        CssTokenUtil.copyPosTo(tokenStream.current(), new EOFToken()));
+
+                // This consumes declarations (ie: "color: red;" ) inside
+                // a qualified rule as that rule's value.
+                rule.setDeclarations(this.parseAListOfDeclarations(
+                        extractASimpleBlock(tokenStream, errors), errors));
+
+                rules.add(rule);
+                return;
+            }
+//            // This consumes a CSS selector as the rules prelude.
+            if (!consumeAComponentValue(tokenStream, rule.getPrelude(), /*depth*/0)) {
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+                errors.add((ErrorToken) CssTokenUtil.copyPosTo(tokenStream.current(),
+                        new ErrorToken(ValidatorProtos.ValidationError.Code.CSS_EXCESSIVELY_NESTED, params)));
+            }
+        }
+    }
+
+    @Nonnull
+    private final Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec;
+
+    @Nonnull
+    private final ValidatorProtos.AtRuleSpec.BlockType defaultAtRuleSpec;
+
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/CssErrorHandler.java b/validator/java/src/main/java/dev/amp/validator/css/CssErrorHandler.java
new file mode 100644
index 0000000000000..98cf2036751fd
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/CssErrorHandler.java
@@ -0,0 +1,62 @@
+package dev.amp.validator.css;
+
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+import org.w3c.css.sac.CSSException;
+import org.w3c.css.sac.CSSParseException;
+import org.w3c.css.sac.ErrorHandler;
+
+import javax.annotation.Nonnull;
+
+/**
+ * Error handler for css errors
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class CssErrorHandler implements ErrorHandler {
+
+    /**
+     * Error handler for warning
+     * @param e exception caught
+     */
+    @Override
+    public void warning(@Nonnull final CSSParseException e) throws CSSException {
+    }
+
+    /**
+     * Error handler for error
+     * @param e exception caught
+     */
+    @Override
+    public void error(@Nonnull final CSSParseException e) throws CSSException {
+    }
+
+    /**
+     * Error handler for fatal error
+     * @param e exception caught
+     */
+    @Override
+    public void fatalError(@Nonnull final CSSParseException e) throws CSSException {
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/CssParser.java b/validator/java/src/main/java/dev/amp/validator/css/CssParser.java
new file mode 100644
index 0000000000000..eb9718f240e24
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/CssParser.java
@@ -0,0 +1,165 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.SACParserCSS3;
+import com.steadystate.css.parser.CssCharStream;
+import com.steadystate.css.parser.ParseException;
+import com.steadystate.css.parser.ListableTokenManager;
+import com.steadystate.css.parser.Token;
+import com.steadystate.css.parser.TokenMgrError;
+import org.w3c.css.sac.CSSParseException;
+import org.w3c.css.sac.InputSource;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.io.StringReader;
+import java.util.ArrayList;
+import java.util.List;
+
+import static dev.amp.validator.css.CssTokenUtil.copyPosTo;
+
+/**
+ * A utility to parse css text into a list of tokens.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class CssParser extends SACParserCSS3 {
+
+    /**
+     * Constructor.
+     *
+     * @param cssText the stylesheet data.
+     * @param line    line number.
+     * @param col     column number.
+     * @param errors  the global error token list for css validation errors.
+     */
+    public CssParser(@Nonnull final String cssText,
+                     final int line,
+                     final int col,
+                     @Nonnull final List<ErrorToken> errors) {
+        this.errors = errors;
+        setErrorHandler(new CssErrorHandler());
+        this.line = line;
+        this.col = col;
+
+        /** Initializing the token manager. */
+        this.source = new InputSource(new StringReader(cssText));
+        final ListableTokenManager manager =
+                new ListableTokenManager(new CssCharStream(source.getCharacterStream(), 1, 1));
+        ReInit(manager);
+    }
+
+    /**
+     * Override to handle specific validation errors encountered during tokenization.
+     *
+     * @param key the type of the exception
+     * @param ex  the exception to handle
+     * @return a populated CSSParseException
+     */
+    @Override
+    protected CSSParseException toCSSParseException(final String key, @Nonnull final ParseException ex) {
+        try {
+            // catch CSS_SYNTAX_STRAY_TRAILING_BACKSLASH
+            if (ex.currentToken != null && ex.currentToken.next != null
+                    && ex.currentToken.next.image != null && ex.currentToken.next.image.equals("\\")) {
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+                this.errors.add((ErrorToken) copyPosTo(ex.currentToken.next, new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_STRAY_TRAILING_BACKSLASH,
+                        params)));
+            }
+
+            // catch CSS_SYNTAX_STRAY_TRAILING_BACKSLASH
+            if (ex.currentToken != null && ex.currentToken.next != null
+                    && ex.currentToken.next.image != null
+                    && (ex.currentToken.next.image.equals("\"") || ex.currentToken.next.image.equals("\'"))) {
+                final List<String> params = new ArrayList<>();
+                params.add("style");
+                this.errors.add((ErrorToken) copyPosTo(ex.currentToken.next, new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_STRING,
+                        params)));
+            }
+        } catch (CssValidationException e) {
+            /**ignore*/
+        }
+        return super.toCSSParseException(key, ex);
+    }
+
+    @Override
+    protected CSSParseException toCSSParseException(final TokenMgrError ex) {
+        if (((ListableTokenManager) (this.token_source)).getCurLexState() == 1) {
+            final List<String> params = new ArrayList<>();
+            params.add("style");
+
+            try {
+                this.errors.add((ErrorToken) copyPosTo(this.token, new ErrorToken(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_COMMENT,
+                        params)));
+                ((ListableTokenManager) (this.token_source)).getParsedTokens().add(new EOFToken());
+            } catch (CssValidationException e) {
+                /**ignore*/
+            }
+        }
+        return super.toCSSParseException(ex);
+    }
+
+    /**
+     * Generates a list of cssparser Tokens extracted from cssText.
+     *
+     * @return a list of Tokens found.
+     * @throws IOException IO exception.
+     */
+    public List<Token> tokenize() throws IOException {
+        parseStyleSheet(source);
+        return ((ListableTokenManager) token_source).getParsedTokens();
+    }
+
+    /**
+     * Returns the token errors.
+     * @return returns the token errors.
+     */
+    public List<ErrorToken> getErrors() {
+        return errors;
+    }
+
+    @Nonnull
+    private List<ErrorToken> errors;
+
+    /**
+     * Line number.
+     */
+    private int line;
+
+    /**
+     * Column number.
+     */
+    private int col;
+
+    /**
+     * Source data.
+     */
+    private InputSource source;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/CssParsingConfig.java b/validator/java/src/main/java/dev/amp/validator/css/CssParsingConfig.java
new file mode 100644
index 0000000000000..943b426c21a6b
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/CssParsingConfig.java
@@ -0,0 +1,117 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+
+import javax.annotation.Nonnull;
+import java.util.HashMap;
+import java.util.Map;
+
+/**
+ * This class holds the CSS parsing configuration.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class CssParsingConfig {
+
+    /**
+     * Constructor for CssParsingConfig.
+     *
+     * @param atRuleSpec  the AtRule spec to validate against
+     * @param defaultSpec the default blocktype to validate for
+     */
+    public CssParsingConfig(@Nonnull final Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec,
+                            @Nonnull final ValidatorProtos.AtRuleSpec.BlockType defaultSpec) {
+        // TODO: atRuleSpec could be split into a string and BlockType, as the map is only ever size = 1
+        this.atRuleSpec = atRuleSpec;
+        this.defaultSpec = defaultSpec;
+    }
+
+    /**
+     * Generates a CssParsingConfig from a CssSpec.
+     *
+     * @param cssSpec to extract validator parameters from
+     * @return a CssParsingConfig representing the CssSpec
+     * @throws CssValidationException Css Validation Exception
+     */
+    public static CssParsingConfig computeCssParsingConfig(@Nonnull final ValidatorProtos.CssSpec cssSpec)
+            throws CssValidationException {
+        final Map<String, ValidatorProtos.AtRuleSpec.BlockType> ampAtRuleParsingSpec = new HashMap<>();
+        for (final ValidatorProtos.AtRuleSpec atRuleSpec : cssSpec.getAtRuleSpecList()) {
+            if (atRuleSpec.getType() == ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR
+                    || (atRuleSpec.getType() == ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE)) {
+                ampAtRuleParsingSpec.put(atRuleSpec.getName(), ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE);
+            } else if (atRuleSpec.getType() == ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_RULES) {
+                ampAtRuleParsingSpec.put(atRuleSpec.getName(), ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_RULES);
+            } else if (atRuleSpec.getType() == ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS) {
+                ampAtRuleParsingSpec.put(atRuleSpec.getName(), ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS);
+            } else {
+                throw new CssValidationException("Unrecognized atRuleSpec type: " + atRuleSpec.getType());
+            }
+        }
+        final CssParsingConfig config =
+                new CssParsingConfig(ampAtRuleParsingSpec, ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE);
+
+        if (cssSpec.getAtRuleSpecList().size() > 0) {
+            config.setDefaultSpec(ampAtRuleParsingSpec.get("$DEFAULT"));
+        }
+        return config;
+    }
+
+  /**
+     * Getter for underlying AtRule spec.
+     *
+     * @return the AtRule spec
+     */
+    public Map<String, ValidatorProtos.AtRuleSpec.BlockType> getAtRuleSpec() {
+        return this.atRuleSpec;
+    }
+
+    /**
+     * Getter for underlying default spec default spec.
+     *
+     * @return the default spec blocktype
+     */
+    public ValidatorProtos.AtRuleSpec.BlockType getDefaultSpec() {
+        return this.defaultSpec;
+    }
+
+    /**
+     * Setter for underlying default spec blocktype spec.
+     *
+     * @param defaultSpec the value to set default spec to.
+     */
+    public void setDefaultSpec(@Nonnull final ValidatorProtos.AtRuleSpec.BlockType defaultSpec) {
+        this.defaultSpec = defaultSpec;
+    }
+
+    /** Default block type. */
+    @Nonnull
+    private ValidatorProtos.AtRuleSpec.BlockType defaultSpec;
+
+    /** AtRuleSpec map. */
+    @Nonnull
+    private Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/CssTokenUtil.java b/validator/java/src/main/java/dev/amp/validator/css/CssTokenUtil.java
new file mode 100644
index 0000000000000..60471890bf06f
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/CssTokenUtil.java
@@ -0,0 +1,142 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import com.steadystate.css.parser.SACParserCSS3Constants;
+import com.steadystate.css.parser.Token;
+
+import javax.annotation.Nonnull;
+import java.util.HashMap;
+import java.util.Map;
+
+/**
+ * General utility methods to map token types to token kinds from cssparser library.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class CssTokenUtil {
+
+    /**
+     * Default constructor
+     */
+    private CssTokenUtil() {
+
+    }
+
+    // mapping for tokens that are defined under SACParserCSS3Constants
+    private static final Map<Integer, TokenType> KIND_TO_TOKENTYPE;
+
+    // mirror map for grouping tokens
+    private static final Map<String, String> REFLECT_TOKEN;
+
+    static {
+        KIND_TO_TOKENTYPE = new HashMap<>();
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.S, TokenType.WHITESPACE);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.EOF, TokenType.EOF_TOKEN);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.ATKEYWORD, TokenType.AT_KEYWORD);
+
+        // these are both @ keywords and will be treated the same as other @ keywords
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.MEDIA_SYM, TokenType.AT_KEYWORD);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.FONT_FACE_SYM, TokenType.AT_KEYWORD);
+
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.CDC, TokenType.CDC);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.CDO, TokenType.CDO);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.SEMICOLON, TokenType.SEMICOLON);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.LBRACE, TokenType.OPEN_CURLY);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.RBRACE, TokenType.CLOSE_CURLY);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.LSQUARE, TokenType.OPEN_SQUARE);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.RSQUARE, TokenType.CLOSE_SQUARE);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.LROUND, TokenType.OPEN_PAREN);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.RROUND, TokenType.CLOSE_PAREN);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.COLON, TokenType.COLON);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.COMMA, TokenType.COMMA);
+        // TODO: verify delim mappings
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.UNKNOWN, TokenType.DELIM);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.ASTERISK, TokenType.DELIM);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.PLUS, TokenType.DELIM);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.MINUS, TokenType.DELIM);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.DOT, TokenType.DELIM);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.TILDE, TokenType.DELIM);
+
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.ONLY, TokenType.IDENT);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.NOT, TokenType.IDENT);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.AND, TokenType.IDENT);
+
+        // TODO : check this
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.FUNCTION, TokenType.FUNCTION_TOKEN);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.IDENT, TokenType.IDENT);
+
+        // TODO : verify uri and url are interchangeable for validation
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.URL, TokenType.URL);
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.URI, TokenType.URL);
+
+        KIND_TO_TOKENTYPE.put(SACParserCSS3Constants.STRING, TokenType.STRING);
+
+        REFLECT_TOKEN = new HashMap<>();
+        REFLECT_TOKEN.put("[", "]");
+        REFLECT_TOKEN.put("(", ")");
+        REFLECT_TOKEN.put("{", "}");
+
+        REFLECT_TOKEN.put("]", "[");
+        REFLECT_TOKEN.put(")", "(");
+        REFLECT_TOKEN.put("}", "{");
+    }
+
+
+    /**
+     * Overloaded method to return a TokenType, given a CSS3 Token
+     *
+     * @param token of CSS3 Token type
+     * @return a TokenType enum value useful to Canonicalizer
+     */
+    public static TokenType getTokenType(@Nonnull final Token token) {
+        return KIND_TO_TOKENTYPE.get(token.kind);
+    }
+
+    /**
+     * Copies the line / col values of |this| to |other|.
+     *
+     * @param css3Token is the token to copy location from.
+     * @param other     is the value receiving the location values.
+     * @return other
+     */
+    public static dev.amp.validator.css.Token copyPosTo(@Nonnull final Token css3Token,
+                                                    @Nonnull final dev.amp.validator.css.Token other) {
+        other.setCol(css3Token.beginColumn);
+        other.setLine(css3Token.beginLine);
+
+        return other;
+    }
+
+    /**
+     * Returns a mirroring character for a token with a reflective match
+     *
+     * @param token of interest.
+     * @return the mirroring character
+     */
+    public static String getMirror(@Nonnull final Token token) {
+        return REFLECT_TOKEN.get(token.toString().trim());
+    }
+
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/CssValidationException.java b/validator/java/src/main/java/dev/amp/validator/css/CssValidationException.java
new file mode 100644
index 0000000000000..33e32f9ae6c1f
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/CssValidationException.java
@@ -0,0 +1,49 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+/**
+ * Css validation exception.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class CssValidationException extends Exception {
+    /**
+     * Constructor.
+     * @param message the message.
+     */
+    public CssValidationException(final String message) {
+        super(message);
+    }
+
+    /**
+     * Constructor.
+     * @param message the message.
+     * @param cause the cause.
+     */
+    public CssValidationException(final String message, final Throwable cause) {
+        super(message, cause);
+    }
+
+}
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/css/Declaration.java b/validator/java/src/main/java/dev/amp/validator/css/Declaration.java
new file mode 100644
index 0000000000000..e008079f35225
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/Declaration.java
@@ -0,0 +1,132 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.visitor.RuleVisitor;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * Object model for a declaration used to define css.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class Declaration extends Rule {
+
+    /**
+     * Constructor of Declaration
+     *
+     * @param name to set for this declaration
+     */
+    public Declaration(@Nonnull final String name) {
+        super();
+        this.name = name;
+        this.value = new ArrayList<>();
+        this.important = false;
+    }
+
+    /**
+     * Process a Declaration with a visitor
+     *
+     * @param visitor a rule visitor object used to access a declaration
+     * @throws CssValidationException Css Validation Exception
+     */
+    @Override
+    public void accept(@Nonnull final RuleVisitor visitor) throws CssValidationException {
+        visitor.visitDeclaration(this);
+        visitor.leaveDeclaration(this);
+    }
+
+    /**
+     * Getter for token type
+     *
+     * @return the type of the token (declaration)
+     */
+    @Override
+    public TokenType getTokenType() {
+        return TokenType.DECLARATION;
+    }
+
+
+    /**
+     * For a declaration, if the first non-whitespace token is an identifier,
+     * returns its string value. Otherwise, returns the empty string.
+     *
+     * @return value of first non-whitespace identifier or empty string
+     */
+    public String firstIdent() {
+        if (this.value.size() == 0) {
+            return "";
+        }
+
+        if (CssTokenUtil.getTokenType(this.value.get(0)) == TokenType.IDENT) {
+            return this.value.get(0).toString();
+        }
+        if (this.value.size() >= 2
+                && (CssTokenUtil.getTokenType(this.value.get(0)) == TokenType.WHITESPACE)
+                && CssTokenUtil.getTokenType(this.value.get(1)) == TokenType.IDENT) {
+            return this.value.get(1).toString();
+        }
+        return "";
+    }
+
+    /**
+     * Getter for contents of declaration
+     *
+     * @return the value of Declaration as a list of its contents
+     */
+    @Override
+    public List<Token> getValue() {
+        return value;
+    }
+
+    /**
+     * Getter for contents of name of declaration
+     *
+     * @return the name of a declaration
+     */
+    @Nonnull
+    public String getName() {
+        return name;
+    }
+
+    /**
+     * @param important the target value of important
+     * Setter for importance of declaration
+     */
+    public void setImportant(final boolean important) {
+        this.important = important;
+    }
+
+    private boolean important;
+
+    @Nonnull
+    private final String name;
+
+    @Nonnull
+    private final List<Token> value;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/EOFToken.java b/validator/java/src/main/java/dev/amp/validator/css/EOFToken.java
new file mode 100644
index 0000000000000..c6c674fc2b13e
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/EOFToken.java
@@ -0,0 +1,40 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+/**
+ * Token representation of end of file.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class EOFToken extends Token {
+    /**
+     * Return type of token
+     * @return TokenType.EOF_TOKEN
+     */
+    @Override
+    public TokenType getTokenType() {
+        return TokenType.EOF_TOKEN;
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/ErrorToken.java b/validator/java/src/main/java/dev/amp/validator/css/ErrorToken.java
new file mode 100644
index 0000000000000..fec13d6306ff7
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/ErrorToken.java
@@ -0,0 +1,96 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+
+import javax.annotation.Nonnull;
+import java.util.List;
+
+/**
+ * Error tokens carry an error code and parameters, which can be
+ * formatted into an error message via the format strings in
+ * validator.protoascii.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ErrorToken extends Token {
+
+    /**
+     * Constructor
+     * @param optCode the optCode value to set
+     * @param optParams the optParams to set
+     * @throws CssValidationException Css Validation Exception
+     */
+    public ErrorToken(final ValidatorProtos.ValidationError.Code optCode,
+                      final List<String> optParams) throws CssValidationException {
+        super();
+        if (optCode == null) {
+            throw new CssValidationException("opt_code is null");
+        }
+
+        if (optParams == null) {
+            throw new CssValidationException("opt_params is null");
+        }
+
+        this.code = optCode;
+        this.params = optParams;
+    }
+
+    /**
+     * Getter for error params
+     * @return list of params
+     */
+    public List<String> getParams() {
+        return this.params;
+    }
+
+    /**
+     * Getter for error code
+     * @return error code
+     */
+    public ValidatorProtos.ValidationError.Code getCode() {
+        return this.code;
+    }
+
+    /**
+     * Getter for token type.
+     * @return returns token type error
+     */
+    @Override
+    public TokenType getTokenType() {
+        return TokenType.ERROR;
+    }
+
+    /** Validation error code. */
+    @Nonnull
+    private final ValidatorProtos.ValidationError.Code code;
+
+    /** List of params. */
+    @Nonnull
+    private final List<String> params;
+
+
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/ParsedCssUrl.java b/validator/java/src/main/java/dev/amp/validator/css/ParsedCssUrl.java
new file mode 100644
index 0000000000000..353e3fa4773cb
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/ParsedCssUrl.java
@@ -0,0 +1,113 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import javax.annotation.Nonnull;
+
+import static dev.amp.validator.css.TokenType.PARSED_CSS_URL;
+
+/**
+ * Used by parse_css.ExtractUrls to return urls it has seen. This represents
+ * URLs in CSS such as url(http://foo.com/) and url("http://bar.com/").
+ * For this token, line() and col() indicate the position information
+ * of the left-most CSS token that's part of the URL. E.g., this would be
+ * the URLToken instance or the FunctionToken instance.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ParsedCssUrl extends Token {
+
+    /**
+     * Constructor for empty css url
+     */
+    public ParsedCssUrl() {
+        super();
+
+        /**
+         * The decoded URL. This string will not contain CSS string escapes,
+         * quotes, or similar. Encoding is utf8.
+         */
+        this.utf8Url = "";
+        /**
+         * A rule scope, in case the url was encountered within an at-rule.
+         * If not within an at-rule, this string is empty.
+         */
+        this.atRuleScope = "";
+    }
+
+    /**
+     * Getter for rule scope
+     *
+     * @return the atRule scope
+     */
+    @Nonnull
+    public String getAtRuleScope() {
+        return atRuleScope;
+    }
+
+    /**
+     * Getter for url
+     *
+     * @return the url as utf8 string
+     */
+    @Nonnull
+    public String getUtf8Url() {
+        return utf8Url;
+    }
+
+    /**
+     * setter for url
+     *
+     * @param utf8Url the value to set utf8Url to
+     */
+    public void setUtf8Url(@Nonnull final String utf8Url) {
+        this.utf8Url = utf8Url;
+    }
+
+    /**
+     * setter for rule scope
+     *
+     * @param atRuleScope at rule scope to
+     */
+    public void setAtRuleScope(@Nonnull final String atRuleScope) {
+        this.atRuleScope = atRuleScope;
+    }
+
+    /**
+     * return the token type
+     *
+     * @return TokenType.PARSED_CSS_URL
+     */
+    @Override
+    public TokenType getTokenType() {
+        return PARSED_CSS_URL;
+    }
+
+    @Nonnull
+    private String atRuleScope;
+
+    @Nonnull
+    private String utf8Url;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/QualifiedRule.java b/validator/java/src/main/java/dev/amp/validator/css/QualifiedRule.java
new file mode 100644
index 0000000000000..06312168ae85d
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/QualifiedRule.java
@@ -0,0 +1,146 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+
+package dev.amp.validator.css;
+
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.visitor.RuleVisitor;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * The abstract superclass for all tokens.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class QualifiedRule extends Rule {
+
+  /**
+   * Constructor to initialize empty qualified rule
+   */
+  public QualifiedRule() {
+    super();
+    rules = new ArrayList<>();
+    prelude = new ArrayList<>();
+    declarations = new ArrayList<>();
+  }
+
+  /**
+   * process a qualified rule through a visitor
+   *
+   * @param visitor used to process the rule
+   */
+  @Override
+  public void accept(@Nonnull final RuleVisitor visitor) throws CssValidationException {
+    visitor.visitQualifiedRule(this);
+    for (final Declaration declaration : this.declarations) {
+      declaration.accept(visitor);
+    }
+    visitor.leaveQualifiedRule(this);
+  }
+
+  /**
+   * return the token type of the qualified rule
+   *
+   * @return TokenType.QUALIFIED_RULE
+   */
+  @Override
+  public TokenType getTokenType() {
+    return TokenType.QUALIFIED_RULE;
+  }
+
+  /**
+   * Setter for rules
+   *
+   * @return the list of rules associated with this qualified rule.
+   */
+  public List<Rule> getRules() {
+    return this.rules;
+  }
+
+  /**
+   * Setter for rules
+   *
+   * @param rules the rules to initialize to the qualified rule
+   */
+  public void setRules(@Nonnull final List<Rule> rules) {
+    this.rules = rules;
+  }
+
+  /**
+   * Setter for declarations
+   *
+   * @param declarations to initialize to the qualified rule
+   */
+  public void setDeclarations(@Nonnull final List<Declaration> declarations) {
+    this.declarations = declarations;
+  }
+
+  /**
+   * Getter for declarations
+   *
+   * @return the declarations of the rule
+   */
+  @Nonnull
+  public List<Declaration> getDeclarations() {
+    return declarations;
+  }
+
+  /**
+   * Getter for the prelude
+   *
+   * @return the prelude of the qualified rule
+   */
+  public List<com.steadystate.css.parser.Token> getPrelude() {
+    return prelude;
+  }
+
+  /**
+   * concatenate a qualified rule name
+   *
+   * @return The concatenation of the qualified rule name.
+   */
+  public String ruleName() {
+    @Nonnull String ruleName = "";
+    for (int i = 0; i < this.prelude.size(); i++) {
+      Token prelude = this.prelude.get(i);
+      if (prelude.toString() != null) {
+        ruleName += prelude.toString();
+      }
+    }
+    return ruleName;
+  }
+
+  @Nonnull
+  private List<Rule> rules;
+
+  @Nonnull
+  private List<Declaration> declarations;
+
+  @Nonnull
+  private List<Token> prelude;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/Rule.java b/validator/java/src/main/java/dev/amp/validator/css/Rule.java
new file mode 100644
index 0000000000000..bd9bf42052cc7
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/Rule.java
@@ -0,0 +1,49 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.visitor.RuleVisitor;
+
+import javax.annotation.Nonnull;
+
+/**
+ * Abstract class modeling a css rule.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public abstract class Rule extends Token {
+
+    /**
+     * Default constructor
+     */
+    public Rule() {
+        super();
+    }
+
+    /**
+     * @param visitor object to access a rule
+     * @throws CssValidationException Css Validation Exception
+     */
+    public abstract void accept(@Nonnull RuleVisitor visitor) throws CssValidationException;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/Stylesheet.java b/validator/java/src/main/java/dev/amp/validator/css/Stylesheet.java
new file mode 100644
index 0000000000000..7368062098828
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/Stylesheet.java
@@ -0,0 +1,96 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.visitor.RuleVisitor;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * Stylesheet object model.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class Stylesheet extends Rule {
+
+    /**
+     * Constructor for empty stylesheet
+     */
+    public Stylesheet() {
+        super();
+        this.rules = new ArrayList<>();
+        this.eof = null;
+    }
+
+    /**
+     * Process the rules of a stylesheet.
+     *
+     * @param visitor used to rules of a stylesheet
+     * @throws CssValidationException Css Validation Exception
+     */
+    @Override
+    public void accept(@Nonnull final RuleVisitor visitor) throws CssValidationException {
+        visitor.visitStylesheet(this);
+        for (final Rule rule : this.rules) {
+            rule.accept(visitor);
+        }
+        visitor.leaveStylesheet(this);
+    }
+
+    /**
+     * Getter for token type returns stylesheet.
+     *
+     * @return TokenType.STYLESHEET
+     */
+    @Override
+    public TokenType getTokenType() {
+        return TokenType.STYLESHEET;
+    }
+
+    /**
+     * Setter for rules tokens
+     *
+     * @param rules of stylesheet
+     */
+    public void setRules(@Nonnull final List<Rule> rules) {
+        this.rules = rules;
+    }
+
+    /**
+     * Setter for eof token of stylesheet
+     *
+     * @param eof of stylesheet
+     */
+    public void setEOF(@Nonnull final EOFToken eof) {
+        this.eof = eof;
+    }
+
+    @Nonnull
+    private List<Rule> rules;
+
+    @Nonnull
+    private Token eof;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/Token.java b/validator/java/src/main/java/dev/amp/validator/css/Token.java
new file mode 100644
index 0000000000000..a2032df575aa8
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/Token.java
@@ -0,0 +1,99 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+/**
+ * The abstract superclass for all tokens.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public abstract class Token extends com.steadystate.css.parser.Token {
+    /**
+     * Constructor for Token object, sets default location values
+     */
+    public Token() {
+        this.line = 1;
+        this.col = 0;
+    }
+
+    /**
+     * Overwrite from children class to get token type
+     * @return the type of the token.
+     */
+    public abstract TokenType getTokenType();
+
+    /**
+     * Setter for line value.
+     * @param line the value to set in line.
+     */
+    public void setLine(final int line) {
+        this.line = line;
+    }
+
+    /**
+     * Setter for Token's column.
+     * @param col value to set in column.
+     */
+    public void setCol(final int col) {
+        this.col = col;
+    }
+
+    /**
+     * Getter for Token's line.
+     * @return a String value of the token from parent class Token.
+     */
+    public int getLine() {
+        return line;
+    }
+
+    /**
+     * Returns value of token.
+     * @return a value of the token from parent class Token, most of time is String,
+     * few cases will return a list of tokens
+     */
+    @Override
+    public Object getValue() {
+        return this.toString();
+    }
+
+    /**
+     * Returns value column of token.
+     * @return a column value from token
+     */
+    public int getCol() {
+        return col;
+    }
+
+    @Override
+    public String toString() {
+        return getTokenType().toString();
+    }
+
+    /** Line number. */
+    private int line;
+
+    /** Column number. */
+    private int col;
+}
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/css/TokenStream.java b/validator/java/src/main/java/dev/amp/validator/css/TokenStream.java
new file mode 100644
index 0000000000000..adba27c482715
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/TokenStream.java
@@ -0,0 +1,102 @@
+package dev.amp.validator.css;
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+import com.steadystate.css.parser.SACParserCSS3Constants;
+
+import javax.annotation.Nonnull;
+import java.util.List;
+import com.steadystate.css.parser.Token;
+
+/**
+ * Class to manage a list of tokens as a stream with accessors to iterate through stream.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class TokenStream {
+
+    /**
+     * Constructor to initialize stream with underlying token list.
+     * @param tokens css content to store in stream
+     * @throws CssValidationException Css Validation Exception
+     */
+    public TokenStream(@Nonnull final List<com.steadystate.css.parser.Token> tokens) throws CssValidationException {
+        if (tokens.size() <= 0) {
+            throw new CssValidationException("Internal Error: empty TokenStream - must have EOF token");
+        }
+
+        if (tokens.get(tokens.size() - 1).kind != SACParserCSS3Constants.EOF) {
+            throw new CssValidationException("Internal Error: TokenStream must end with EOF");
+        }
+
+        this.tokens = tokens;
+        this.pos = -1;
+    }
+
+    /**
+     * Function to advance the stream by a token
+     */
+    public void consume() {
+        this.pos++;
+    }
+
+    /**
+     * Returns the token at the next position in the token stream.
+     * @return the token at the position after the current token.
+     */
+    public Token next() {
+        return this.tokenAt(this.pos + 1);
+    }
+
+    /**
+     * Returns the token at an absolute position in the token stream.
+     *
+     * @param num is the index of the token returned
+     * @return the token at num
+     */
+    public Token tokenAt(final int num) {
+        // The last token is guaranteed to be the EOF token (with correct
+        // line / col!) so any request past the length of the array
+        // fetches that.
+        return (num < this.tokens.size()) ? this.tokens.get(num) : this.tokens.get(this.tokens.size() - 1);
+    }
+
+    /**
+     * Returns the token at the current position in the token stream.
+     * @return the token currently found at pos
+     */
+    public Token current() {
+        return this.tokenAt(this.pos);
+    }
+
+    /** Rewinds to the previous position in the input. */
+    public void reconsume() {
+        this.pos--;
+    }
+
+    @Nonnull
+    private final List<com.steadystate.css.parser.Token> tokens;
+
+    /** Position of the input. */
+    private int pos;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/css/TokenType.java b/validator/java/src/main/java/dev/amp/validator/css/TokenType.java
new file mode 100644
index 0000000000000..7023099670b0d
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/TokenType.java
@@ -0,0 +1,84 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+/**
+ * Token enumeration types.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public enum TokenType {
+    /** EOF_TOKEN */
+    EOF_TOKEN,
+    /** PARSED_CSS_URL */
+    PARSED_CSS_URL,
+    /** WHITESPACE */
+    WHITESPACE,
+    /** CDO */
+    CDO,
+    /** CDC */
+    CDC,
+    /** AT_KEYWORD */
+    AT_KEYWORD,
+    /** SEMICOLON */
+    SEMICOLON,
+    /** OPEN_CURLY */
+    OPEN_CURLY,
+    /** CLOSE_CURLY */
+    CLOSE_CURLY,
+    /** OPEN_SQUARE */
+    OPEN_SQUARE,
+    /** CLOSE_SQUARE */
+    CLOSE_SQUARE,
+    /** OPEN_PAREN */
+    OPEN_PAREN,
+    /** CLOSE_PAREN */
+    CLOSE_PAREN,
+    /** FUNCTION_TOKEN */
+    FUNCTION_TOKEN,
+    /** IDENT */
+    IDENT,
+    /** COLON */
+    COLON,
+    /** COMMA */
+    COMMA,
+    /** STYLESHEET */
+    STYLESHEET,
+    /** QUALIFIED_RULE */
+    AT_RULE,
+    /** QUALIFIED_RULE */
+    QUALIFIED_RULE,
+    /** DECLARATION */
+    DECLARATION,
+    /** UNKNOWN */
+    UNKNOWN,
+    /** DELIM */
+    DELIM,
+    /** URL */
+    URL,
+    /** STRING */
+    STRING,
+    /** ERROR */
+    ERROR,
+}
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/css/package-info.java b/validator/java/src/main/java/dev/amp/validator/css/package-info.java
new file mode 100644
index 0000000000000..301e1e3767e3e
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/css/package-info.java
@@ -0,0 +1,25 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+/**
+ * AMP validator.
+ */
+package dev.amp.validator.css;
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/exception/ExitOnFirstErrorException.java b/validator/java/src/main/java/dev/amp/validator/exception/ExitOnFirstErrorException.java
new file mode 100644
index 0000000000000..938113d9a4314
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/exception/ExitOnFirstErrorException.java
@@ -0,0 +1,39 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.exception;
+
+import org.xml.sax.SAXException;
+
+/**
+ * Exception thrown when the first error occurs.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ExitOnFirstErrorException extends SAXException {
+    /**
+     * Constructor.
+     */
+    public ExitOnFirstErrorException() {
+    }
+}
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/exception/MaxParseNodesException.java b/validator/java/src/main/java/dev/amp/validator/exception/MaxParseNodesException.java
new file mode 100644
index 0000000000000..aed36dc2362de
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/exception/MaxParseNodesException.java
@@ -0,0 +1,43 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.exception;
+
+import org.xml.sax.SAXException;
+
+/**
+ * Exception thrown when max (HTML) nodes are encountered.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class MaxParseNodesException extends SAXException {
+    /** Error message. */
+    private static final String ERROR_MSG = "Maximum nodes reached parsing HTML";
+
+    /**
+     * Constructor.
+     */
+    public MaxParseNodesException() {
+        super(ERROR_MSG);
+    }
+}
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/exception/TagValidationException.java b/validator/java/src/main/java/dev/amp/validator/exception/TagValidationException.java
new file mode 100644
index 0000000000000..84ac4ae794bac
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/exception/TagValidationException.java
@@ -0,0 +1,48 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.exception;
+
+/**
+ * Tag validation exception.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class TagValidationException extends Exception {
+    /**
+     * Constructor.
+     * @param message the message.
+     */
+    public TagValidationException(final String message) {
+        super(message);
+    }
+
+    /**
+     * Constructor.
+     * @param message the message.
+     * @param cause the cause.
+     */
+    public TagValidationException(final String message, final Throwable cause) {
+        super(message, cause);
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/exception/ValidatorException.java b/validator/java/src/main/java/dev/amp/validator/exception/ValidatorException.java
new file mode 100644
index 0000000000000..ad286e82a8ecd
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/exception/ValidatorException.java
@@ -0,0 +1,49 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.exception;
+
+/**
+ * Validator exception.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class ValidatorException extends Exception {
+    /**
+     * Constructor.
+     * @param message the message.
+     */
+    public ValidatorException(final String message) {
+        super(message);
+    }
+
+    /**
+     * Constructor.
+     * @param message the message.
+     * @param cause the cause.
+     */
+    public ValidatorException(final String message, final Throwable cause) {
+        super(message, cause);
+    }
+}
+
diff --git a/validator/java/src/main/java/dev/amp/validator/exception/package-info.java b/validator/java/src/main/java/dev/amp/validator/exception/package-info.java
new file mode 100644
index 0000000000000..a283738548352
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/exception/package-info.java
@@ -0,0 +1,25 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+/**
+ * AMP validator exception package.
+ */
+package dev.amp.validator.exception;
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/package-info.java b/validator/java/src/main/java/dev/amp/validator/package-info.java
new file mode 100644
index 0000000000000..45859083dcd30
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/package-info.java
@@ -0,0 +1,25 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+/**
+ * AMP validator.
+ */
+package dev.amp.validator;
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/parser/AMPHtmlParser.java b/validator/java/src/main/java/dev/amp/validator/parser/AMPHtmlParser.java
new file mode 100644
index 0000000000000..e7276b7a4a7c2
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/parser/AMPHtmlParser.java
@@ -0,0 +1,118 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.parser;
+
+import dev.amp.validator.ValidatorProtos;
+import dev.amp.validator.AMPValidatorManager;
+import dev.amp.validator.AMPHtmlHandler;
+import dev.amp.validator.ExitCondition;
+import com.yahoo.tagchowder.Parser;
+import com.yahoo.tagchowder.templates.HTMLSchema;
+import org.xml.sax.InputSource;
+import org.xml.sax.SAXException;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.io.StringReader;
+import java.net.URISyntaxException;
+
+/**
+ * The AMP HTML parser class.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ *
+ */
+
+public class AMPHtmlParser {
+    /**
+     * Constructor.
+     *
+     * @throws ParserException exception occurs while loading rules
+     */
+    public AMPHtmlParser() throws ParserException {
+        validatorManager = new AMPValidatorManager();
+        try {
+            validatorManager.loadRule();
+        } catch (IOException | URISyntaxException ex) {
+            throw  new ParserException("Unable to load AMP validation rules.", ex);
+        }
+    }
+
+    /**
+     * Parse the input html document and returns validation result.
+     *
+     * @param inputHtml input html document.
+     * @param htmlFormat html format.
+     * @param condition exit condition.
+     * @return returns a validation object.
+     */
+    public ValidatorProtos.ValidationResult parse(@Nonnull final String inputHtml,
+                                            @Nonnull final ValidatorProtos.HtmlFormat.Code htmlFormat,
+                                            @Nonnull final ExitCondition condition) {
+        return parse(inputHtml, htmlFormat, condition, 0);
+    }
+
+    /**
+     * Parse the input html document and returns validation result.
+     *
+     * @param inputHtml input html document.
+     * @param htmlFormat html format.
+     * @param condition exit condition.
+     * @param maxNodes max nodes.
+     * @return returns a validation object.
+     */
+    public ValidatorProtos.ValidationResult parse(@Nonnull final String inputHtml,
+                                            @Nonnull final ValidatorProtos.HtmlFormat.Code htmlFormat,
+                                            @Nonnull final ExitCondition condition,
+                                            final int maxNodes) {
+        final Parser parser = new Parser();
+        final AMPHtmlHandler handler = new AMPHtmlHandler(validatorManager, htmlFormat, condition, maxNodes);
+        try {
+            parser.setContentHandler(handler);
+            parser.setProperty(Parser.SCHEMA_PROPERTY, new HTMLSchema());
+            parser.setFeature(Parser.DEFAULT_ATTRIBUTES_FEATURE, false);
+            parser.parse(new InputSource(new StringReader(inputHtml)));
+        } catch (IOException | SAXException ex) {
+            final ValidatorProtos.ValidationResult.Builder result = handler.validationResult();
+            if (result.getErrorsCount() == 0) {
+                result.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+                ValidatorProtos.ValidationError.Builder error = ValidatorProtos.ValidationError.newBuilder();
+                error.setSeverity(ValidatorProtos.ValidationError.Severity.ERROR);
+                error.setCode(ValidatorProtos.ValidationError.Code.UNKNOWN_CODE);
+                final String message =
+                        (ex.getMessage() != null ? ex.getMessage() : "Unable to parse input HTML document");
+                error.addParams(message);
+                result.addErrors(error);
+            }
+        }
+
+        return handler.validationResult().build();
+    }
+
+    /** Validation manager object. */
+    @Nonnull
+    private final AMPValidatorManager validatorManager;
+}
+
+
diff --git a/validator/java/src/main/java/dev/amp/validator/parser/ParserException.java b/validator/java/src/main/java/dev/amp/validator/parser/ParserException.java
new file mode 100644
index 0000000000000..ba5600d9b4958
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/parser/ParserException.java
@@ -0,0 +1,60 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.parser;
+
+/**
+ /**
+ * Exception class for parsing.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ *
+ */
+
+public class ParserException extends Exception {
+    /**
+     * Constructs a new exception with {@code null} as its detail message.
+     */
+    public ParserException() {
+        super();
+    }
+
+    /**
+     * Constructs a new exception with the specified detail message.  The
+     * cause is not initialized.
+     * @param message the detail message.
+     */
+    public ParserException(final String message) {
+        super(message);
+    }
+
+    /**
+     * Constructs a new exception with the specified detail message and
+     * cause.
+     *
+     * @param  message the detail message.
+     * @param  cause the cause.
+     */
+    public ParserException(final String message, final Throwable cause) {
+        super(message, cause);
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/parser/package-info.java b/validator/java/src/main/java/dev/amp/validator/parser/package-info.java
new file mode 100644
index 0000000000000..48e2f239a2108
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/parser/package-info.java
@@ -0,0 +1,25 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+/**
+ * AMP validator.
+ */
+package dev.amp.validator.parser;
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/AttributeSpecUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/AttributeSpecUtils.java
new file mode 100644
index 0000000000000..bb96e9eda837f
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/AttributeSpecUtils.java
@@ -0,0 +1,1461 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.css.CssParser;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.Declaration;
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.Context;
+import dev.amp.validator.CssLength;
+import dev.amp.validator.ExtensionsContext;
+import dev.amp.validator.ParsedAttrSpec;
+import dev.amp.validator.ParsedHtmlTag;
+import dev.amp.validator.ParsedTagSpec;
+import dev.amp.validator.ParsedUrlSpec;
+import dev.amp.validator.ParsedValueProperties;
+import dev.amp.validator.SrcsetParsingResult;
+import dev.amp.validator.SrcsetSourceDef;
+import dev.amp.validator.UrlErrorAdapter;
+import dev.amp.validator.UrlErrorInAttrAdapter;
+import dev.amp.validator.exception.TagValidationException;
+import org.apache.commons.text.StringEscapeUtils;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.net.MalformedURLException;
+import java.net.URL;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.HashMap;
+import java.util.HashSet;
+import java.util.List;
+import java.util.Map;
+import java.util.Set;
+import java.util.TreeSet;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+
+import static dev.amp.validator.utils.CssSpecUtils.parseInlineStyle;
+import static dev.amp.validator.utils.CssSpecUtils.stripVendorPrefix;
+
+/**
+ * Methods to handle attribute spec validation.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class AttributeSpecUtils {
+    /**
+     * Private constructor.
+     */
+    private AttributeSpecUtils() {
+    }
+
+    /**
+     * Returns true if this spec should be used for the given type identifiers
+     * based on the spec's disabled_by or enabled_by fields.
+     *
+     * @param typeIdentifiers type identifiers.
+     * @param enabledBys      enabled bys.
+     * @param disabledBys     disabled bys.
+     * @return returns true if type identifiers are used.
+     */
+    public static boolean isUsedForTypeIdentifiers(@Nonnull final List<String> typeIdentifiers,
+                                                   @Nonnull final List<String> enabledBys,
+                                                   @Nonnull final List<String> disabledBys) {
+        if (enabledBys.size() > 0) {
+            for (final String enabledBy : enabledBys) {
+                // Is enabled by a given type identifier, use.
+                if (typeIdentifiers.contains(enabledBy)) {
+                    return true;
+                }
+            }
+            // Is not enabled for these type identifiers, do not use.
+            return false;
+        } else if (disabledBys.size() > 0) {
+            for (final String disabledBy : disabledBys) {
+                // Is disabled by a given type identifier, do not use.
+                if (typeIdentifiers.contains(disabledBy)) {
+                    return false;
+                }
+            }
+            // Is not disabled for these type identifiers, use.
+            return true;
+        }
+        // Is not enabled nor disabled for any type identifiers, use.
+        return true;
+    }
+
+
+    /**
+     * Validates whether the attributes set on |encountered_tag| conform to this
+     * tag specification. All mandatory attributes must appear. Only attributes
+     * explicitly mentioned by this tag spec may appear.
+     * Returns true iff the validation is successful.
+     *
+     * @param parsedTagSpec           the parsed tag spec.
+     * @param bestMatchReferencePoint best match reference point.
+     * @param context                 the context.
+     * @param encounteredTag          encountered tag.
+     * @param result                  validation result.
+     * @throws TagValidationException tag validation exception.
+     * @throws IOException            IO Exception
+     * @throws CssValidationException Css Validation Exception
+     */
+    public static void validateAttributes(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                          @Nonnull final ParsedTagSpec bestMatchReferencePoint,
+                                          @Nonnull final Context context,
+                                          @Nonnull final  ParsedHtmlTag encounteredTag,
+                                          @Nonnull final ValidatorProtos.ValidationResult.Builder result)
+            throws TagValidationException, IOException, CssValidationException {
+        final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+        if (spec.hasAmpLayout()) {
+            validateLayout(parsedTagSpec, context, encounteredTag, result);
+        }
+        // For extension TagSpecs, we track if we've validated a src attribute.
+        // We must have done so for the extension to be valid.
+        boolean seenExtensionSrcAttr = false;
+        final boolean hasTemplateAncestor = context.getTagStack().hasAncestor("TEMPLATE");
+        final boolean isHtmlTag = encounteredTag.upperName().equals("HTML");
+        final List<String> mandatoryAttrsSeen = new ArrayList<>();
+        final List<String> mandatoryOneofsSeen = new ArrayList<>();
+        final List<String> mandatoryAnyofsSeen = new ArrayList<>();
+        final List<ValidatorProtos.AttrSpec> triggersToCheck = new ArrayList<>();
+
+        /**
+         * If a tag has implicit attributes, we then add these attributes as
+         * validated. E.g. tag 'a' has implicit attributes 'role' and 'tabindex'.
+         */
+        final Set<String> attrspecsValidated = new HashSet<>();
+        for (final ValidatorProtos.AttrSpec implicit : parsedTagSpec.getImplicitAttrspecs()) {
+            attrspecsValidated.add(implicit.getName());
+        }
+        // Our html parser delivers attributes as an array of alternating keys and
+        // values. We skip over this array 2 at a time to iterate over the keys.
+        final Map<String, ValidatorProtos.AttrSpec> attrsByName = parsedTagSpec.getAttrsByName();
+        for (int i = 0; i < encounteredTag.attrs().getLength(); i++) {
+            final String name = encounteredTag.attrs().getLocalName(i);
+            String value = encounteredTag.attrs().getValue(i);
+            if (name.equals(value)) {
+                value = "";
+            }
+
+            // For transformed AMP, attributes `class` and `i-amphtml-layout` are
+            // handled within validateSsrLayout.
+            if (context.isTransformed()
+                    && (name.equals("class") || name.equals("i-amphtml-layout"))) {
+                continue;
+            }
+            if (!(attrsByName.containsKey(name))) {
+                // The HTML tag specifies type identifiers which are validated in
+                // validateHtmlTag(), so we skip them here.
+                if (isHtmlTag && context.getRules().isTypeIdentifier(name)) {
+                    continue;
+                }
+                // While validating a reference point, we skip attributes that
+                // we don't have a spec for. They will be validated when the
+                // TagSpec itself gets validated.
+                if (parsedTagSpec.isReferencePoint()) {
+                    continue;
+                }
+                // On the other hand, if we did just validate a reference point for
+                // this tag, we check whether that reference point covers the attribute.
+                if (bestMatchReferencePoint != null
+                        && bestMatchReferencePoint.hasAttrWithName(name)) {
+                    continue;
+                }
+
+                // If |spec| is an extension, then we ad-hoc validate 'custom-element',
+                // 'custom-template', 'host-service', and 'src' attributes by calling this
+                // method.  For 'src', we also keep track whether we validated it this
+                // way, (seen_src_attr), since it's a mandatory attr.
+                if (spec.hasExtensionSpec()
+                        && validateAttributeInExtension(spec, context, name, value, result)) {
+                    if (name.equals("src")) {
+                        seenExtensionSrcAttr = true;
+                    }
+                    continue;
+                }
+                validateAttrNotFoundInSpec(parsedTagSpec, context, name, result);
+                if (result.getStatus() == ValidatorProtos.ValidationResult.Status.FAIL) {
+                    continue;
+                }
+                if (hasTemplateAncestor) {
+                    validateAttrValueBelowTemplateTag(parsedTagSpec, context, name, value, result);
+                    if (result.getStatus() == ValidatorProtos.ValidationResult.Status.FAIL) {
+                        continue;
+                    }
+                }
+                continue;
+            }
+            if (hasTemplateAncestor) {
+                validateAttrValueBelowTemplateTag(parsedTagSpec, context, name, value, result);
+                if (result.getStatus() == ValidatorProtos.ValidationResult.Status.FAIL) {
+                    continue;
+                }
+            }
+
+            final ValidatorProtos.AttrSpec attrSpec = attrsByName.get(name);
+            if (attrSpec.getValueCount() < 0) {
+                attrspecsValidated.add(attrSpec.getName());
+                continue;
+            }
+
+            final ParsedAttrSpec parsedAttrSpec =
+                    context.getRules().getParsedAttrSpecs().getParsedAttrSpec(name, value, attrSpec);
+            // If this attribute isn't used for these type identifiers, then error.
+            if (!parsedAttrSpec.isUsedForTypeIdentifiers(
+                    context.getTypeIdentifiers())) {
+                List<String> params = new ArrayList<>();
+                params.add(name);
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        result);
+                continue;
+            }
+            if (attrSpec.hasDeprecation()) {
+                List<String> params = new ArrayList<>();
+                params.add(name);
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                params.add(attrSpec.getDeprecation());
+                context.addWarning(
+                        ValidatorProtos.ValidationError.Code.DEPRECATED_ATTR,
+                        context.getLineCol(),
+                        params,
+                        attrSpec.getDeprecationUrl(),
+                        result);
+                // Deprecation is only a warning, so we don't return.
+            }
+            if (attrSpec.getRequiresExtensionCount() > 0) {
+                validateAttrRequiredExtensions(parsedAttrSpec, context, result);
+            }
+            if (attrSpec.getCssDeclarationCount() > 0) {
+                validateAttrDeclaration(
+                        parsedAttrSpec, context, TagSpecUtils.getTagSpecName(spec), name, value,
+                        result);
+            }
+            if (!hasTemplateAncestor || !attrValueHasTemplateSyntax(value)) {
+                validateNonTemplateAttrValueAgainstSpec(
+                        parsedAttrSpec, context, name, value, spec, result);
+                if (result.getStatus() == ValidatorProtos.ValidationResult.Status.FAIL) {
+                    continue;
+                }
+            }
+
+            final List<String> params;
+            if (attrSpec.hasBlacklistedValueRegex()) {
+                final Pattern regex = context.getRules().getPartialMatchCaseiRegex(
+                        attrSpec.getBlacklistedValueRegex());
+                if (regex.matcher(value).find()) {
+                    params = new ArrayList<>();
+                    params.add(name);
+                    params.add(TagSpecUtils.getTagSpecName(spec));
+                    params.add(value);
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(spec),
+                            result);
+                    continue;
+                }
+            }
+            if (attrSpec.hasMandatory()) {
+                mandatoryAttrsSeen.add(parsedAttrSpec.getAttrName());
+
+            }
+            if (parsedTagSpec.getSpec().getTagName().equals("BASE")
+                    && name.equals("href")
+                    && context.hasSeenUrl()) {
+                params = new ArrayList<>();
+                params.add(context.firstSeenUrlTagName());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.BASE_TAG_MUST_PRECEED_ALL_URLS,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        result);
+                continue;
+            }
+            final String mandatoryOneof = attrSpec.getMandatoryOneof(); // question const {mandatoryOneof} = attrSpec;
+            if (attrSpec.hasMandatoryOneof()) {
+                // The "at most 1" part of mandatory_oneof: mandatory_oneof
+                // wants exactly one of the alternatives, so here
+                // we check whether we already saw another alternative
+                if (mandatoryOneofsSeen.indexOf(mandatoryOneof) != -1) {
+                    params = new ArrayList<>();
+                    params.add(TagSpecUtils.getTagSpecName(spec));
+                    params.add(mandatoryOneof);
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.MUTUALLY_EXCLUSIVE_ATTRS,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(spec),
+                            result);
+                    continue;
+                }
+
+                mandatoryOneofsSeen.add(mandatoryOneof);
+            }
+            if (attrSpec.hasRequiresAncestor()) {
+                final List<ValidatorProtos.AncestorMarker.Marker> markers = attrSpec.getRequiresAncestor().getMarkerList();
+                boolean matchesMarker = false;
+                for (final ValidatorProtos.AncestorMarker.Marker marker : markers) {
+                    if (context.getTagStack().hasAncestorMarker(marker)) {
+                        matchesMarker = true;
+                        break;
+                    }
+                }
+                if (!matchesMarker) {
+                    params = new ArrayList<>();
+                    params.add(name);
+                    params.add(TagSpecUtils.getTagSpecName(spec));
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(spec),
+                            result);
+                    continue;
+                }
+            }
+            final String mandatoryAnyof = attrSpec.getMandatoryAnyof(); //const {mandatoryAnyof} = attrSpec;
+            if (attrSpec.hasMandatoryAnyof()) {
+                mandatoryAnyofsSeen.add(mandatoryAnyof);
+            }
+            attrspecsValidated.add(parsedAttrSpec.getAttrName());
+            // If the trigger does not have an if_value_regex, then proceed to add the
+            // spec. If it does have an if_value_regex, then test the regex to see
+            // if it should add the spec.
+            if (!attrSpec.hasTrigger()) {
+                continue;
+            }
+            final ValidatorProtos.AttrTriggerSpec trigger = attrSpec.getTrigger();
+            if (trigger != null) {
+                final boolean hasIfValueRegex = trigger.hasIfValueRegex();
+                Pattern ifValueRegexPattern = null;
+                if (hasIfValueRegex) {
+                    ifValueRegexPattern = context.getRules().getFullMatchRegex(trigger.getIfValueRegex());
+                }
+
+                if (!hasIfValueRegex || ifValueRegexPattern.matcher(value).matches()) {
+                    triggersToCheck.add(attrSpec);
+                }
+            }
+        }
+        if (result.getStatus() == ValidatorProtos.ValidationResult.Status.FAIL) {
+            return;
+        }
+        // The "exactly 1" part of mandatory_oneof: If none of the
+        // alternatives were present, we report that an attribute is missing.
+        for (final String mandatoryOneof : parsedTagSpec.getMandatoryOneofs()) {
+            if (mandatoryOneofsSeen.indexOf(mandatoryOneof) == -1) {
+                List<String> params = new ArrayList<>();
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                params.add(mandatoryOneof);
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MANDATORY_ONEOF_ATTR_MISSING,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        result);
+            }
+        }
+        // The "at least 1" part of mandatory_anyof: If none of the
+        // alternatives were present, we report that an attribute is missing.
+        for (final String mandatoryAnyof : parsedTagSpec.getMandatoryAnyofs()) {
+            if (mandatoryAnyofsSeen.indexOf(mandatoryAnyof) == -1) {
+                List<String> params = new ArrayList<>();
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                params.add(mandatoryAnyof);
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MANDATORY_ANYOF_ATTR_MISSING,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        result);
+            }
+        }
+        for (final ValidatorProtos.AttrSpec attrSpec : triggersToCheck) {
+            for (final String alsoRequiresAttr : attrSpec.getTrigger().getAlsoRequiresAttrList()) {
+                if (!(attrsByName.containsKey(alsoRequiresAttr))) {
+                    continue;
+                }
+                ValidatorProtos.AttrSpec attrId = attrsByName.get(alsoRequiresAttr);
+                if (!attrspecsValidated.contains(attrId.getName())) {
+                    List<String> params = new ArrayList<>();
+                    params.add(attrId.getName());
+                    params.add(TagSpecUtils.getTagSpecName(spec));
+                    params.add(attrSpec.getName());
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.ATTR_REQUIRED_BUT_MISSING,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(spec),
+                            result);
+                }
+            }
+        }
+        final List<String> missingAttrs = new ArrayList<>();
+        for (final ValidatorProtos.AttrSpec mandatory : parsedTagSpec.getMandatoryAttrIds()) {
+            if (!mandatoryAttrsSeen.contains(mandatory.getName())) {
+                missingAttrs.add(mandatory.getName());
+            }
+        }
+        // Sort this list for stability across implementations.
+        Collections.sort(missingAttrs);
+        for (final String missingAttr : missingAttrs) {
+            List<String> params = new ArrayList<>();
+            params.add(missingAttr);
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+        }
+        // Extension specs mandate the 'src' attribute.
+        if (spec.hasExtensionSpec() && !seenExtensionSrcAttr) {
+            List<String> params = new ArrayList<>();
+            params.add("src");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+        }
+    }
+
+    /**
+     * If this attribute requires an extension and we have processed all extensions,
+     * report an error if that extension has not been loaded.
+     *
+     * @param parsedAttrSpec   the parsed Attr spec.
+     * @param context          context
+     * @param validationResult validationResult
+     */
+    public static void validateAttrRequiredExtensions(
+            @Nonnull final ParsedAttrSpec parsedAttrSpec,
+            @Nonnull final Context context,
+            @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        final ValidatorProtos.AttrSpec attrSpec = parsedAttrSpec.getSpec();
+        final ExtensionsContext extensionsCtx = context.getExtensions();
+        for (String requiredExtension : attrSpec.getRequiresExtensionList()) {
+            if (!extensionsCtx.isExtensionLoaded(requiredExtension)) {
+                final List<String> params = new ArrayList<>();
+                params.add(attrSpec.getName());
+                params.add(requiredExtension);
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.ATTR_MISSING_REQUIRED_EXTENSION,
+                        context.getLineCol(),
+                        params,
+                        "",
+                        validationResult);
+            }
+        }
+    }
+
+    /**
+     * Helper method for ValidateAttributes.
+     *
+     * @param parsedAttrSpec   the parsed Attr spec.
+     * @param context          context.
+     * @param tagSpecName      tag spec name.
+     * @param attrName         attr Name.
+     * @param attrValue        attr Value
+     * @param validationResult validationResult.
+     * @throws IOException            IO Exception
+     * @throws CssValidationException Css Validation Exception
+     */
+    public static void validateAttrDeclaration(
+            @Nonnull final ParsedAttrSpec parsedAttrSpec,
+            @Nonnull final Context context,
+            @Nonnull final String tagSpecName,
+            @Nonnull final String attrName,
+            @Nonnull final String attrValue,
+            @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) throws IOException,
+            CssValidationException {
+        final List<ErrorToken> cssErrors = new ArrayList<>();
+        final CssParser cssParser = new CssParser(attrValue,
+                context.getLineCol().getLineNumber(), context.getLineCol().getColumnNumber(), cssErrors);
+        final List<Token> tokenList = cssParser.tokenize();
+
+        final List<Declaration> declarations = parseInlineStyle(tokenList, cssErrors);
+
+        for (final ErrorToken errorToken : cssErrors) {
+            // Override the first parameter with the name of this style tag.
+            final List<String> params = errorToken.getParams();
+            // Override the first parameter with the name of this style tag.
+            params.set(0, tagSpecName);
+            context.addError(
+                    errorToken.getCode(),
+                    errorToken.getLine(),
+                    errorToken.getCol(),
+                    params,
+                    /* url */ "",
+                    validationResult);
+        }
+
+        // If there were errors parsing, exit from validating further.
+        if (cssErrors.size() > 0) {
+            return;
+        }
+
+        final Map<String, ValidatorProtos.CssDeclaration> cssDeclarationByName = parsedAttrSpec.getCssDeclarationByName();
+
+        for (final Declaration declaration : declarations) {
+            final String declarationName =
+                    stripVendorPrefix(declaration.getName().toLowerCase());
+            if (!(cssDeclarationByName.containsKey(declarationName))) {
+                // Declaration not allowed.
+                final List<String> params = new ArrayList<>();
+                params.add(declaration.getName());
+                params.add(attrName);
+                params.add(tagSpecName);
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_PROPERTY_IN_ATTR_VALUE,
+                        context.getLineCol(),
+                        params,
+                        context.getRules().getStylesSpecUrl(),
+                        validationResult);
+            } else {
+                final ValidatorProtos.CssDeclaration cssDeclaration = cssDeclarationByName.get(declarationName);
+                if (cssDeclaration.getValueCaseiList().size() > 0) {
+                    boolean hasValidValue = false;
+                    final String firstIdent = declaration.firstIdent();
+                    for (final String value : cssDeclaration.getValueCaseiList()) {
+                        if (firstIdent.toLowerCase().equals(value)) {
+                            hasValidValue = true;
+                            break;
+                        }
+                    }
+                    if (!hasValidValue) {
+                        // Declaration value not allowed.
+                        final List<String> params = new ArrayList<>();
+                        params.add(tagSpecName);
+                        params.add(declaration.getName());
+                        params.add(firstIdent);
+                        context.addError(
+                                ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE,
+                                context.getLineCol(),
+                                params,
+                                context.getRules().getStylesSpecUrl(),
+                                validationResult);
+                    }
+                }
+            }
+        }
+    }
+
+    /**
+     * Returns true if |value| contains mustache template syntax.
+     *
+     * @param value value.
+     * @return {boolean}
+     */
+    public static boolean attrValueHasTemplateSyntax(@Nonnull final String value) {
+        // Mustache (https://mustache.github.io/mustache.5.html), our template
+        // system, supports replacement tags that start with {{ and end with }}.
+        // We relax attribute value rules if the value contains this syntax as we
+        // will validate the post-processed tag instead.
+        return MUSTACHE_TAG_PATTERN.matcher(value).matches();
+    }
+
+    /**
+     * This is the main validation procedure for attributes, operating with a
+     * ParsedAttrSpec instance.
+     *
+     * @param parsedAttrSpec parsed attribute spec.
+     * @param context        the context.
+     * @param attrName       attribute name.
+     * @param attrValue      attribute value.
+     * @param tagSpec        the tag spec.
+     * @param result         the validation result.
+     */
+    public static void validateNonTemplateAttrValueAgainstSpec(
+            @Nonnull final ParsedAttrSpec parsedAttrSpec,
+            @Nonnull final Context context,
+            @Nonnull final String attrName,
+            @Nonnull final String attrValue,
+            @Nonnull final ValidatorProtos.TagSpec tagSpec,
+            @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        // The value, value_regex, value_url, and value_properties fields are treated
+        // like a oneof, but we're not using oneof because it's a feature that was
+        // added after protobuf 2.5.0 (which our open-source version uses).
+        // begin oneof {
+        final ValidatorProtos.AttrSpec spec = parsedAttrSpec.getSpec();
+        if (spec.hasAddValueToSet()) {
+            ValidatorProtos.ValueSetProvision.Builder provision = ValidatorProtos.ValueSetProvision.newBuilder();
+            provision.setSet(spec.getAddValueToSet());
+            provision.setValue(attrValue);
+            result.addValueSetProvisions(provision);
+        }
+        if (spec.hasValueOneofSet()) {
+            ValidatorProtos.ValueSetRequirement.Builder requirement = ValidatorProtos.ValueSetRequirement.newBuilder();
+            ValidatorProtos.ValueSetProvision.Builder provision = ValidatorProtos.ValueSetProvision.newBuilder();
+            provision.setSet(spec.getValueOneofSet());
+            provision.setValue(attrValue);
+            requirement.setProvision(provision);
+
+            final List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(tagSpec));
+            requirement.setErrorIfUnsatisfied(
+                    ValidationErrorUtils.populateError(
+                            ValidatorProtos.ValidationError.Severity.ERROR,
+                            ValidatorProtos.ValidationError.Code.VALUE_SET_MISMATCH,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(tagSpec)));
+            result.addValueSetRequirements(requirement);
+        }
+        if (spec.getValueCount() > 0) {
+            for (final String value : spec.getValueList()) {
+                if (attrValue.equals(value)) {
+                    return;
+                }
+            }
+            final List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(tagSpec));
+            params.add(attrValue);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(tagSpec),
+                    result);
+        } else if (spec.getValueCaseiCount() > 0) {
+            for (final String value : spec.getValueCaseiList()) {
+                if (attrValue.toLowerCase().equals(value)) {
+                    return;
+                }
+            }
+
+            final List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(tagSpec));
+            params.add(attrValue);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(tagSpec),
+                    result);
+        } else if (spec.hasValueRegex() || spec.hasValueRegexCasei()) {
+            final Pattern valueRegex =
+                    (spec.hasValueRegex())
+                            ? context.getRules().getFullMatchRegex(spec.getValueRegex())
+                            : context.getRules().getFullMatchCaseiRegex(spec.getValueRegexCasei());
+            if (!valueRegex.matcher(attrValue).matches()) {
+                final List<String> params = new ArrayList<>();
+                params.add(attrName);
+                params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                params.add(attrValue);
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(tagSpec),
+                        result);
+            }
+        } else if (spec.hasValueUrl()) {
+            validateAttrValueUrl(parsedAttrSpec, context, attrName, attrValue, tagSpec, result);
+        } else {
+            final ParsedValueProperties valueProperties = parsedAttrSpec.getValuePropertiesOrNull();
+            if (valueProperties != null) {
+                validateAttrValueProperties(
+                        valueProperties, context, attrName, attrValue, tagSpec, result);
+            }
+        }
+        // } end oneof
+    }
+
+
+    /**
+     * Helper method for validateNonTemplateAttrValueAgainstSpec.
+     *
+     * @param parsedValueProperties value properties.
+     * @param context               the context.
+     * @param attrName              the attribute name.
+     * @param attrValue             the attribute value.
+     * @param tagSpec               the tag spec.
+     * @param result                validation result.
+     */
+    public static void validateAttrValueProperties(@Nonnull final ParsedValueProperties parsedValueProperties,
+                                                   @Nonnull final Context context,
+                                                   @Nonnull final String attrName,
+                                                   @Nonnull final String attrValue,
+                                                   @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                                                   @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        final String[] segments = attrValue.split("[,;]");
+        final Map<String, String> properties = new HashMap<>();
+        for (final String segment : segments) {
+            final String[] keyValue = segment.split("=");
+            if (keyValue.length < 2) {
+                continue;
+            }
+            properties.put(keyValue[0].trim().toLowerCase(), keyValue[1]);
+        }
+        // TODO(johannes): End hack.
+        final Set<String> names = properties.keySet();
+        for (final String name : names) {
+            final String value = properties.get(name);
+            final Map<String, ValidatorProtos.PropertySpec> valuePropertyByName =
+                    parsedValueProperties.getValuePropertyByName();
+            if (!(valuePropertyByName.containsKey(name))) {
+                final List<String> params = new ArrayList<>();
+                params.add(name);
+                params.add(attrName);
+                params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_PROPERTY_IN_ATTR_VALUE,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(tagSpec),
+                        result);
+                continue;
+            }
+            final ValidatorProtos.PropertySpec propertySpec = valuePropertyByName.get(name);
+            final List<String> params;
+            if (propertySpec.hasValue()) {
+                if (!propertySpec.getValue().equals(value.toLowerCase())) {
+                    params = new ArrayList<>();
+                    params.add(name);
+                    params.add(attrName);
+                    params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                    params.add(value);
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.INVALID_PROPERTY_VALUE_IN_ATTR_VALUE,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(tagSpec),
+                            result);
+                }
+            } else if (propertySpec.hasValueDouble()) {
+                Double doubleValue = null;
+                try {
+                    doubleValue = Double.valueOf(value);
+                } catch (NumberFormatException e) {
+                    //no op
+                }
+                if (doubleValue == null || doubleValue != propertySpec.getValueDouble()) {
+                    params = new ArrayList<>();
+                    params.add(name);
+                    params.add(attrName);
+                    params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                    params.add(value);
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.INVALID_PROPERTY_VALUE_IN_ATTR_VALUE,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(tagSpec),
+                            result);
+                }
+            }
+        }
+
+        /** Make a copy here because we don't want to remove from the original parsed value properties. */
+        List<String> notSeen =
+                new ArrayList<>(parsedValueProperties.getMandatoryValuePropertyNames());
+        List<String> seen = new ArrayList<>(names);
+        notSeen.removeAll(seen);
+        for (final String name : notSeen) {
+            final List<String> params = new ArrayList<>();
+            params.add(name);
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(tagSpec));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(tagSpec),
+                    result);
+        }
+    }
+
+    /**
+     * Helper method for validateNonTemplateAttrValueAgainstSpec.
+     *
+     * @param parsedAttrSpec the parsed attribute spec.
+     * @param context        the context.
+     * @param attrName       the attribute name.
+     * @param attrValue      the attribute value.
+     * @param tagSpec        the tag spec.
+     * @param result         validation result.
+     */
+    public static void validateAttrValueUrl(@Nonnull final ParsedAttrSpec parsedAttrSpec,
+                                            @Nonnull final Context context,
+                                            @Nonnull final String attrName,
+                                            @Nonnull final String attrValue,
+                                            @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                                            @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        final Set<String> maybeUris = new TreeSet<>();
+
+        if (!attrName.equals("srcset")) {
+            maybeUris.add(attrValue);
+        } else {
+            if (attrValue.equals("")) {
+                final List<String> params = new ArrayList<>();
+                params.add(attrName);
+                params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MISSING_URL,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(tagSpec),
+                        result);
+                return;
+            }
+
+            final SrcsetParsingResult parseResult = ParseSrcSetUtils.parseSrcset(attrValue);
+            if (!parseResult.isSuccess()) {
+                // DUPLICATE_DIMENSION only needs two parameters, it does not report
+                // on the attribute value.
+                final List<String> params = new ArrayList<>();
+                params.add(attrName);
+                params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                if (parseResult.getErrorCode() == ValidatorProtos.ValidationError.Code.DUPLICATE_DIMENSION) {
+                    context.addError(
+                            parseResult.getErrorCode(),
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(tagSpec),
+                            result);
+                } else {
+                    params.add(attrValue);
+                    context.addError(
+                            parseResult.getErrorCode(),
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(tagSpec),
+                            result);
+                }
+                return;
+            }
+            for (final SrcsetSourceDef image : parseResult.getSrcsetImages()) {
+                maybeUris.add(image.getUrl());
+            }
+        }
+        if (maybeUris.size() == 0) {
+            final List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(tagSpec));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MISSING_URL,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(tagSpec),
+                    result);
+            return;
+        }
+        final UrlErrorInAttrAdapter adapter = new UrlErrorInAttrAdapter(attrName);
+        for (final String maybeUri : maybeUris) {
+            final String unescapedMaybeUri = StringEscapeUtils.unescapeHtml4(maybeUri);
+            validateUrlAndProtocol(
+                    parsedAttrSpec.getValueUrlSpec(), adapter, context, unescapedMaybeUri,
+                    tagSpec, result);
+            if (result.getStatus() == ValidatorProtos.ValidationResult.Status.FAIL) {
+                return;
+            }
+        }
+    }
+
+    /**
+     * @param parsedUrlSpec parsed url spec.
+     * @param adapter       UrlErrorAdaptor interface.
+     * @param context       the context.
+     * @param urlStr        url string.
+     * @param tagSpec       tag spec.
+     * @param result        validation result.
+     */
+    public static void validateUrlAndProtocol(@Nonnull final ParsedUrlSpec parsedUrlSpec,
+                                              @Nonnull final UrlErrorAdapter adapter,
+                                              @Nonnull final Context context,
+                                              @Nonnull final String urlStr,
+                                              @Nonnull final ValidatorProtos.TagSpec tagSpec,
+                                              @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        final ValidatorProtos.UrlSpec spec = parsedUrlSpec.getSpec();
+        if (ONLY_WHITESPACE_PATTERN.matcher(urlStr).matches() && (!spec.hasAllowEmpty())) {
+            adapter.missingUrl(context, tagSpec, result);
+            return;
+        }
+
+        URL url;
+        String protocol = "";
+        try {
+            url = new URL(urlStr);
+        } catch (MalformedURLException e) {
+            /** Fallback where we can't instantiate URL, need to obtain the protocol. */
+            String urlStrTrimmed = urlStr.toLowerCase().trim();
+            Matcher matcher = URL_PROTOCOL_PATTERN.matcher(urlStrTrimmed);
+            if (matcher.matches()) {
+                protocol = matcher.group(1);
+            }
+
+            if (!spec.getAllowRelative() && (protocol.length() == 0)) {
+                adapter.disallowedRelativeUrl(context, urlStr, tagSpec, result);
+                return;
+            }
+
+            if (protocol.length() > 0 && !parsedUrlSpec.isAllowedProtocol(protocol)) {
+                adapter.invalidUrl(context, urlStr, tagSpec, result);
+            }
+            return;
+        }
+
+        protocol = url.getProtocol();
+        if (protocol.length() > 0 && !parsedUrlSpec.isAllowedProtocol(protocol)) {
+            adapter.invalidUrlProtocol(context, protocol, tagSpec, result);
+            return;
+        }
+        if (!spec.getAllowRelative() && (protocol.length() == 0)) {
+            adapter.disallowedRelativeUrl(context, urlStr, tagSpec, result);
+            return;
+        }
+    }
+
+    /**
+     * Validates the layout for the given tag. This involves checking the
+     * layout, width, height, sizes attributes with AMP specific logic.
+     *
+     * @param parsedTagSpec  the parsed tag spec.
+     * @param context        the context.
+     * @param encounteredTag encountered tag.
+     * @param result         validation result.
+     * @throws TagValidationException the tag validation exception.
+     */
+    public static void validateLayout(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                      @Nonnull final Context context,
+                                      @Nonnull final ParsedHtmlTag encounteredTag,
+                                      @Nonnull final ValidatorProtos.ValidationResult.Builder result)
+            throws TagValidationException {
+
+        final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+        if (!spec.hasAmpLayout()) {
+            throw new TagValidationException("Expecting AMP Layout null");
+        }
+
+        final HashMap<String, String> attrsByKey = encounteredTag.attrsByKey();
+        final String layoutAttr = attrsByKey.get("layout");
+        final String widthAttr = attrsByKey.get("width");
+        final String heightAttr = attrsByKey.get("height");
+        final String sizesAttr = attrsByKey.get("sizes");
+        final String heightsAttr = attrsByKey.get("heights");
+
+        // We disable validating layout for tags where one of the layout attributes
+        // contains mustache syntax.
+        final boolean hasTemplateAncestor = context.getTagStack().hasAncestor("TEMPLATE");
+        if (hasTemplateAncestor
+                && (attrValueHasTemplateSyntax(layoutAttr)
+                || attrValueHasTemplateSyntax(widthAttr)
+                || attrValueHasTemplateSyntax(heightAttr)
+                || attrValueHasTemplateSyntax(sizesAttr)
+                || attrValueHasTemplateSyntax(heightsAttr))) {
+            return;
+        }
+
+        // Parse the input layout attributes which we found for this tag.
+        final ValidatorProtos.AmpLayout.Layout inputLayout = TagSpecUtils.parseLayout(layoutAttr);
+        if (layoutAttr != null
+                && inputLayout == ValidatorProtos.AmpLayout.Layout.UNKNOWN) {
+            List<String> params = new ArrayList<>();
+            params.add("layout");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(layoutAttr);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+        final CssLength inputWidth = new CssLength(
+                widthAttr, /* allowAuto */ true,
+                /* allowFluid */ inputLayout.equals(ValidatorProtos.AmpLayout.Layout.FLUID));
+        if (!inputWidth.isValid()) {
+            List<String> params = new ArrayList<>();
+            params.add("width");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(widthAttr);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+        final CssLength inputHeight = new CssLength(
+                heightAttr, /* allowAuto */ true,
+                /* allowFluid */ inputLayout == ValidatorProtos.AmpLayout.Layout.FLUID);
+        if (!inputHeight.isValid()) {
+            List<String> params = new ArrayList<>();
+            params.add("height");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(heightAttr);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+
+        // Now calculate the effective layout attributes.
+        final CssLength width = TagSpecUtils.calculateWidth(spec.getAmpLayout(), inputLayout, inputWidth);
+        final CssLength height = TagSpecUtils.calculateHeight(spec.getAmpLayout(), inputLayout, inputHeight);
+        final ValidatorProtos.AmpLayout.Layout layout =
+                TagSpecUtils.calculateLayout(inputLayout, width, height, sizesAttr, heightsAttr);
+
+        // Validate for transformed AMP the server-side rendering layout.
+        TagSpecUtils.validateSsrLayout(
+                spec, encounteredTag, inputLayout, inputWidth, inputHeight, sizesAttr,
+                heightsAttr, context, result);
+
+        // Only FLEX_ITEM allows for height to be set to auto.
+        if (height.isAuto() && layout != ValidatorProtos.AmpLayout.Layout.FLEX_ITEM) {
+            List<String> params = new ArrayList<>();
+            params.add("height");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(heightAttr);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+
+        // Does the tag support the computed layout?
+        if (spec.getAmpLayout().getSupportedLayoutsList().indexOf(layout) == -1) {
+            final ValidatorProtos.ValidationError.Code code =
+                    (layoutAttr == null)
+                            ? ValidatorProtos.ValidationError.Code.IMPLIED_LAYOUT_INVALID
+                            : ValidatorProtos.ValidationError.Code.SPECIFIED_LAYOUT_INVALID;
+            // Special case. If no layout related attributes were provided, this implies
+            // the CONTAINER layout. However, telling the user that the implied layout
+            // is unsupported for this tag is confusing if all they need is to provide
+            // width and height in, for example, the common case of creating
+            // an AMP-IMG without specifying dimensions. In this case, we emit a
+            // less correct, but simpler error message that could be more useful to
+            // the average user.
+            if (code == ValidatorProtos.ValidationError.Code.IMPLIED_LAYOUT_INVALID
+                    && layout == ValidatorProtos.AmpLayout.Layout.CONTAINER
+                    && spec.getAmpLayout().getSupportedLayoutsList().indexOf(
+                    ValidatorProtos.AmpLayout.Layout.RESPONSIVE) != -1) {
+                List<String> params = new ArrayList<>();
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MISSING_LAYOUT_ATTRIBUTES,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        result);
+                return;
+            }
+            List<String> params = new ArrayList<>();
+            params.add(layout.toString());
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            context.addError(
+                    code,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+        // FIXED, FIXED_HEIGHT, INTRINSIC, RESPONSIVE must have height set.
+        if ((layout == ValidatorProtos.AmpLayout.Layout.FIXED
+                || layout == ValidatorProtos.AmpLayout.Layout.FIXED_HEIGHT
+                || layout == ValidatorProtos.AmpLayout.Layout.INTRINSIC
+                || layout == ValidatorProtos.AmpLayout.Layout.RESPONSIVE)
+                && !height.isSet()) {
+            List<String> params = new ArrayList<>();
+            params.add("height");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING,
+                    context.getLineCol(),
+                    params, TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+        // For FIXED_HEIGHT if width is set it must be auto.
+        if (layout == ValidatorProtos.AmpLayout.Layout.FIXED_HEIGHT
+                && width.isSet()
+                && !width.isAuto()) {
+            List<String> params = new ArrayList<>();
+            params.add(widthAttr);
+            params.add("width");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add("FIXED_HEIGHT");
+            params.add("auto");
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.ATTR_VALUE_REQUIRED_BY_LAYOUT,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+        // FIXED, INTRINSIC, RESPONSIVE must have width set and not be auto.
+        if (layout == ValidatorProtos.AmpLayout.Layout.FIXED
+                || layout == ValidatorProtos.AmpLayout.Layout.INTRINSIC
+                || layout == ValidatorProtos.AmpLayout.Layout.RESPONSIVE) {
+            if (!width.isSet()) {
+                List<String> params = new ArrayList<>();
+                params.add("width");
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        result);
+                return;
+            } else if (width.isAuto()) {
+                List<String> params = new ArrayList<>();
+                params.add("width");
+                params.add(TagSpecUtils.getTagSpecName(spec));
+                params.add("auto");
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(spec),
+                        result);
+                return;
+            }
+        }
+        // INTRINSIC, RESPONSIVE must have same units for height and width.
+        if ((layout == ValidatorProtos.AmpLayout.Layout.INTRINSIC
+                || layout == ValidatorProtos.AmpLayout.Layout.RESPONSIVE)
+                && !(width.getUnit().equals(height.getUnit()))) {
+            List<String> params = new ArrayList<>();
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(width.getUnit());
+            params.add(height.getUnit());
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INCONSISTENT_UNITS_FOR_WIDTH_AND_HEIGHT,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    result);
+            return;
+        }
+        // RESPONSIVE only allows heights attribute.
+        if (heightsAttr != null && layout != ValidatorProtos.AmpLayout.Layout.RESPONSIVE) {
+            List<String> params = new ArrayList<>();
+            params.add("height");
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(layout.toString());
+            final ValidatorProtos.ValidationError.Code code =
+                    (layoutAttr == null)
+                            ? ValidatorProtos.ValidationError.Code.ATTR_DISALLOWED_BY_IMPLIED_LAYOUT
+                            : ValidatorProtos.ValidationError.Code.ATTR_DISALLOWED_BY_SPECIFIED_LAYOUT;
+            context.addError(code, context.getLineCol(), params, TagSpecUtils.getTagSpecUrl(spec), result);
+            return;
+        }
+    }
+
+    /**
+     * Validates whether an encountered attribute is validated by an ExtensionSpec.
+     * ExtensionSpec's validate the 'custom-element', 'custom-template', and 'src'
+     * attributes. If an error is found, it is added to the |result|. The return
+     * value indicates whether or not the provided attribute is explained by this
+     * validation function.
+     *
+     * @param tagSpec   tag spec.
+     * @param context   the context.
+     * @param attrName  attribute name.
+     * @param attrValue attribute value.
+     * @param result    validation result.
+     * @return returns value indicates whether or not the provided attribute is explained by validation function.
+     * @throws TagValidationException the tag validation exception.
+     */
+    public static boolean validateAttributeInExtension(@Nonnull final ValidatorProtos.TagSpec tagSpec,
+                                                       @Nonnull final Context context,
+                                                       @Nonnull final String attrName,
+                                                       @Nonnull final String attrValue,
+                                                       @Nonnull final ValidatorProtos.ValidationResult.Builder result)
+            throws TagValidationException {
+        if (!tagSpec.hasExtensionSpec()) {
+            throw new TagValidationException("Expecting extension spec not null");
+        }
+
+        final ValidatorProtos.ExtensionSpec extensionSpec = tagSpec.getExtensionSpec();
+        // TagSpecs with extensions will only be evaluated if their dispatch_key
+        // matches, which is based on this custom-element/custom-template/host-service
+        // field attribute value. The dispatch key matching is case-insensitive for
+        // faster lookups, so it still possible for the attribute value to not match
+        // if it contains upper-case letters.
+        if (tagSpec.hasExtensionSpec() && getExtensionNameAttribute(extensionSpec) == attrName) {
+            if (!extensionSpec.getName().equals(attrValue)) {
+                if (extensionSpec.getName().equals(attrValue.toLowerCase())) {
+                    throw new TagValidationException("Extension spec name is matched to a lower case attribute value.");
+                }
+                return false;
+            }
+            return true;
+        } else if (attrName.equals("src")) {
+            final Matcher reResult = SRC_URL_REGEX.matcher(attrValue);
+
+            // If the src URL matches this regex and the base name of the file matches
+            // the extension, look to see if the version matches.
+            if (reResult.matches()
+                    && reResult.group(1).equals(extensionSpec.getName())) {
+                final String encounteredVersion = reResult.group(2);
+                boolean foundDecprecatedVersion = false;
+                for (String deprecatedVersion : extensionSpec.getDeprecatedVersionList()) {
+                    if (deprecatedVersion.equals(encounteredVersion)) {
+                        foundDecprecatedVersion = true;
+                        break;
+                    }
+                }
+                if (foundDecprecatedVersion) {
+                    List<String> params = new ArrayList<>();
+                    params.add(extensionSpec.getName());
+                    params.add(encounteredVersion);
+                    context.addWarning(
+                            ValidatorProtos.ValidationError.Code.WARNING_EXTENSION_DEPRECATED_VERSION,
+                            context.getLineCol(),
+                            params,
+                            TagSpecUtils.getTagSpecUrl(tagSpec),
+                            result);
+                    return true;
+                }
+
+                boolean foundVersion = false;
+                for (String version : extensionSpec.getVersionList()) {
+                    if (version.equals(encounteredVersion)) {
+                        foundVersion = true;
+                        break;
+                    }
+                }
+                if (foundVersion) {
+                    return true;
+                }
+            }
+            List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(tagSpec));
+            params.add(attrValue);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(tagSpec),
+                    result);
+            return true;
+        }
+        return false;
+    }
+
+    /**
+     * Determines the name of the attribute where you find the name of this sort of
+     * extension. Typically, this will return 'custom-element'.
+     *
+     * @param extensionSpec extensionSpec
+     * @return returns the name of the attribute where you find the name of this sort of extension.
+     */
+    public static String getExtensionNameAttribute(@Nonnull final ValidatorProtos.ExtensionSpec extensionSpec) {
+        switch (extensionSpec.getExtensionType()) {
+            case CUSTOM_TEMPLATE:
+                return "custom-template";
+            case HOST_SERVICE:
+                return "host-service";
+            default:
+                return "custom-element";
+        }
+    }
+
+    /**
+     * Helper method for validateAttributes, for when an attribute is
+     * encountered which is not specified by the validator.protoascii
+     * specification.
+     *
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context       the context.
+     * @param attrName      attribute name.
+     * @param result        validation result.
+     */
+    public static void validateAttrNotFoundInSpec(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                                  @Nonnull final Context context, @Nonnull final String attrName,
+                                                  @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        // For now, we just skip data- attributes in the validator, because
+        // our schema doesn't capture which ones would be ok or not. E.g.
+        // in practice, some type of ad or perhaps other custom elements require
+        // particular data attributes.
+        // http://www.w3.org/TR/html5/single-page.html#attr-data-*
+        // http://w3c.github.io/aria-in-html/
+        // However, to avoid parsing differences, we restrict the set of allowed
+        // characters in the document.
+        // If explicitAttrsOnly is true then do not allow data- attributes by default.
+        // They must be explicitly added to the tagSpec.
+        if (!parsedTagSpec.getSpec().hasExplicitAttrsOnly()
+                && (DATA_PATTERN.matcher(attrName).matches())) {
+            return;
+        }
+
+        // At this point, it's an error either way, but we try to give a
+        // more specific error in the case of Mustache template characters.
+        if (attrName.indexOf("{{") != -1) {
+            List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(parsedTagSpec.getSpec()));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.TEMPLATE_IN_ATTR_NAME,
+                    context.getLineCol(),
+                    params,
+                    context.getRules().getTemplateSpecUrl(), result);
+        } else {
+            List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(parsedTagSpec.getSpec()));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR,
+                    context.getLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(parsedTagSpec.getSpec()),
+                    result);
+        }
+    }
+
+    /**
+     * Specific checks for attribute values descending from a template tag.
+     *
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context       the context.
+     * @param attrName      attribute name.
+     * @param attrValue     attribute value.
+     * @param result        the validation result.
+     */
+    public static void validateAttrValueBelowTemplateTag(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                                         @Nonnull final Context context,
+                                                         @Nonnull final String attrName, @Nonnull final String attrValue,
+                                                         @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        if (attrValueHasUnescapedTemplateSyntax(attrValue)) {
+            final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+            List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(attrValue);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.UNESCAPED_TEMPLATE_IN_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    context.getRules().getTemplateSpecUrl(),
+                    result);
+        } else if (attrValueHasPartialsTemplateSyntax(attrValue)) {
+            final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+            List<String> params = new ArrayList<>();
+            params.add(attrName);
+            params.add(TagSpecUtils.getTagSpecName(spec));
+            params.add(attrValue);
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.TEMPLATE_PARTIAL_IN_ATTR_VALUE,
+                    context.getLineCol(),
+                    params,
+                    context.getRules().getTemplateSpecUrl(),
+                    result);
+        }
+
+    }
+
+    /**
+     * Returns true if |value| contains a mustache partials template syntax.
+     *
+     * @param value a test value.
+     * @return Returns true if |value| contains a mustache partials template syntax.
+     */
+    public static boolean attrValueHasPartialsTemplateSyntax(@Nonnull final String value) {
+        // Mustache (https://mustache.github.io/mustache.5.html), our template
+        // system, supports 'partials' which include other Mustache templates
+        // in the format of {{>partial}} and there can be whitespace after the {{.
+        // We disallow partials in attribute values.
+        return PARTIALS_PATTERN.matcher(value).find();
+    }
+
+    /**
+     * Returns true if |value| contains a mustache unescaped template syntax.
+     *
+     * @param value a test value.
+     * @return returns true if |value| contains a mustache unescaped template syntax.
+     */
+    public static boolean attrValueHasUnescapedTemplateSyntax(@Nonnull final String value) {
+        // Mustache (https://mustache.github.io/mustache.5.html), our template
+        // system, supports {{{unescaped}}} or {{{&unescaped}}} and there can
+        // be whitespace after the 2nd '{'. We disallow these in attribute Values.
+        return UNESCAPED_OPEN_TAG.matcher(value).find();
+    }
+
+    /**
+     * URL protocol pattern.
+     */
+    private static final Pattern URL_PROTOCOL_PATTERN = Pattern.compile("^([^:\\/?#.]+):.*$");
+
+    /**
+     * Only whitespace pattern.
+     */
+    private static final Pattern ONLY_WHITESPACE_PATTERN = Pattern.compile("^[\\s\\xa0]*$");
+
+    /**
+     * Partials pattern.
+     */
+    private static final Pattern PARTIALS_PATTERN = Pattern.compile("\\{\\{\\s*>");
+
+    /**
+     * Unescaped open tag pattern.
+     */
+    private static final Pattern UNESCAPED_OPEN_TAG = Pattern.compile("\\{\\{\\s*[&{]");
+
+    /**
+     * Data pattern.
+     */
+    private static final Pattern DATA_PATTERN = Pattern.compile("^data-[A-Za-z0-9-_:.]*$");
+
+    /**
+     * Mustache tag pattern.
+     */
+    private static final Pattern MUSTACHE_TAG_PATTERN = Pattern.compile("\\{\\{.*\\}\\}");
+
+    /**
+     * Src url Regex.
+     */
+    private static final Pattern SRC_URL_REGEX =
+            Pattern.compile("^https:\\/\\/cdn\\.ampproject\\.org\\/v0\\/(amp-[a-z0-9-]*)-([a-z0-9.]*)\\.js$");
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/ByteUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/ByteUtils.java
new file mode 100644
index 0000000000000..932b1255ed44a
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/ByteUtils.java
@@ -0,0 +1,58 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import javax.annotation.Nonnull;
+import java.io.UnsupportedEncodingException;
+
+/**
+ * Byte utility methods.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ *
+ */
+
+public final class ByteUtils {
+    /**
+     * Private constructor.
+     */
+    private ByteUtils() {
+    }
+
+    /**
+     * Computes the byte length, rather than character length, of a utf8 string.
+     * https://en.wikipedia.org/wiki/UTF-8
+     * @param utf8Str UTF-8 string.
+     * @return returns the byte length.
+     */
+    public static int byteLength(@Nonnull final String utf8Str) {
+        // To figure out which characters are multi-byte we can abuse
+        // encodeURIComponent which will escape those specific characters.
+        try {
+            final int multiByteLength = utf8Str.getBytes("UTF-8").length;
+            return multiByteLength;
+        } catch (UnsupportedEncodingException uee) {
+            return utf8Str.length();
+        }
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/CssSpecUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/CssSpecUtils.java
new file mode 100644
index 0000000000000..8159c14c29982
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/CssSpecUtils.java
@@ -0,0 +1,338 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.visitor.Amp4AdsVisitor;
+import dev.amp.validator.visitor.KeyframesVisitor;
+import dev.amp.validator.visitor.RuleVisitor;
+import dev.amp.validator.visitor.UrlFunctionVisitor;
+
+import javax.annotation.Nonnull;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+import static dev.amp.validator.css.CssTokenUtil.copyPosTo;
+import static dev.amp.validator.css.CssTokenUtil.getTokenType;
+
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.TokenType;
+import dev.amp.validator.css.Stylesheet;
+import dev.amp.validator.css.Declaration;
+import dev.amp.validator.css.ParsedCssUrl;
+import dev.amp.validator.css.Canonicalizer;
+import dev.amp.validator.css.CssTokenUtil;
+import dev.amp.validator.css.EOFToken;
+
+/**
+ * Methods to handle Css Spec processing.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class CssSpecUtils {
+    /**
+     * private constructor
+     */
+    private CssSpecUtils() {
+    }
+
+    /**
+     * Returns a Stylesheet object with nested parse_css.Rules.
+     * <p>
+     * The top level Rules in a Stylesheet are always a series of
+     * QualifiedRule's or AtRule's.
+     *
+     * @param tokenList   the css content as token list
+     * @param atRuleSpec  block type rules for
+     *                    all CSS AT rules this canonicalizer should handle.
+     * @param defaultSpec default block type for types not
+     *                    found in atRuleSpec.
+     * @param errors      output array for the errors.
+     * @return a stylesheet object model
+     * @throws CssValidationException css validation exception
+     */
+    public static Stylesheet parseAStylesheet(@Nonnull final List<Token> tokenList,
+                                              @Nonnull final Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec,
+                                              @Nonnull final ValidatorProtos.AtRuleSpec.BlockType defaultSpec,
+                                              @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        final Canonicalizer canonicalizer = new Canonicalizer(atRuleSpec, defaultSpec);
+        final Stylesheet stylesheet = new Stylesheet();
+
+        stylesheet.setRules(canonicalizer.parseAListOfRules(tokenList, /* topLevel */ true, errors));
+        CssTokenUtil.copyPosTo(tokenList.get(0), stylesheet);
+        stylesheet.setEOF((EOFToken) CssTokenUtil.copyPosTo(tokenList.get(tokenList.size() - 1), new EOFToken()));
+
+        return stylesheet;
+    }
+
+    /**
+     * Extracts the URLs within the provided stylesheet, emitting them into
+     * parsedUrls and errors into errors.
+     *
+     * @param stylesheet to parse urls from
+     * @param parsedUrls urls found in stylesheet
+     * @param errors     collection of tokens to populate
+     * @throws CssValidationException css validation exception
+     */
+    public static void extractUrls(@Nonnull final Stylesheet stylesheet, @Nonnull final List<ParsedCssUrl> parsedUrls,
+                                   @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+
+        final int parsedUrlsOldLength = parsedUrls.size();
+        final int errorsOldLength = errors.size();
+        final UrlFunctionVisitor visitor = new UrlFunctionVisitor(parsedUrls, errors);
+        stylesheet.accept(visitor);
+        // If anything went wrong, delete the urls we've already emitted.
+        if (errorsOldLength != errors.size()) {
+            parsedUrls.subList(parsedUrlsOldLength, parsedUrls.size()).clear();
+        }
+    }
+
+    /**
+     * Strips vendor prefixes from identifiers, e.g. property names or names
+     * of at rules. E.g., "-moz-keyframes" to "keyframes".
+     *
+     * @param prefixedString string with prefix
+     * @return input string less the prefix component
+     */
+    public static String stripVendorPrefix(@Nonnull final String prefixedString) {
+        // Checking for '-' is an optimization.
+        if (!prefixedString.equals("") && prefixedString.charAt(0) == '-') {
+            if (prefixedString.startsWith("-o-")) {
+                return prefixedString.substring("-o-".length());
+            }
+            if (prefixedString.startsWith("-moz-")) {
+                return prefixedString.substring("-moz-".length());
+            }
+            if (prefixedString.startsWith("-ms-")) {
+                return prefixedString.substring("-ms-".length());
+            }
+            if (prefixedString.startsWith("-webkit-")) {
+                return prefixedString.substring("-webkit-".length());
+            }
+        }
+        return prefixedString;
+    }
+
+    /**
+     * Strips 'min-' or 'max-' from the start of a media feature identifier, if
+     * present. E.g., "min-width" to "width".
+     *
+     * @param prefixedString the string with a prefix
+     * @return the prefix-stripped string
+     */
+    public static String stripMinMax(@Nonnull final String prefixedString) {
+        if (prefixedString.startsWith("min-")) {
+            return prefixedString.substring("min-".length());
+        }
+        if (prefixedString./*OK*/ startsWith("max-")) {
+            return prefixedString.substring("max-".length());
+        }
+        return prefixedString;
+    }
+
+    /**
+     * @param token value to match
+     * @param str   to match against
+     * @return true iff ascii value of token and string match
+     */
+    public static boolean asciiMatch(@Nonnull final Token token, @Nonnull final String str) {
+        return token.toString().toLowerCase().equals(str.toLowerCase());
+    }
+
+
+    /**
+     * validate the keyframes of css content
+     *
+     * @param styleSheet to validate
+     * @param errors     generated from css parsing
+     * @throws CssValidationException css validation exception
+     */
+    public static void validateKeyframesCss(@Nonnull final Stylesheet styleSheet,
+                                            @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        final RuleVisitor visitor = new KeyframesVisitor(errors);
+        styleSheet.accept(visitor);
+
+    }
+
+    /**
+     * validate a css document against amp4ads specs
+     *
+     * @param styleSheet to validate
+     * @param errors     generated from css parsing
+     * @throws CssValidationException css validation exception
+     */
+    public static void validateAmp4AdsCss(@Nonnull final Stylesheet styleSheet,
+                                          @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        final RuleVisitor visitor = new Amp4AdsVisitor(errors);
+        styleSheet.accept(visitor);
+    }
+
+    /**
+     * Returns true if the given Declaration is considered valid.
+     *
+     * @param cssSpec         the css spec of interest.
+     * @param declarationName the declaration to query for in the css spec.
+     * @return true iff the declaration is found in scc spec's allowed declarations
+     */
+    public static boolean isDeclarationValid(@Nonnull final ValidatorProtos.CssSpec cssSpec, @Nonnull final String declarationName) {
+        if (cssSpec.getDeclarationList().size() == 0) {
+            return true;
+        }
+        return cssSpec.getDeclarationList().indexOf(stripVendorPrefix(declarationName)) > -1;
+    }
+
+    /**
+     * Returns a string of the allowed Declarations.
+     *
+     * @param cssSpec of interest
+     * @return a string representation of allowed declarations
+     */
+    public static String allowedDeclarationsString(@Nonnull final ValidatorProtos.CssSpec cssSpec) {
+        if (cssSpec.getDeclarationList().size() > MAX_NUM_ALLOWED_DECLARATIONS) {
+            return "";
+        }
+        return "[\'" + String.join("\', \'", cssSpec.getDeclarationList()) + "\']";
+    }
+
+    /**
+     * Parses a CSS URL token; typically takes the form "url(http://foo)".
+     * Preconditions: tokens[token_idx] is a URL token
+     * and token_idx + 1 is in range.
+     *
+     * @param tokens   to parse
+     * @param tokenIdx starting index from tokens
+     * @param parsed   ParsedCssUrl to populate
+     * @throws CssValidationException css validation exception
+     */
+    public static void parseUrlToken(@Nonnull final List<Token> tokens, final int tokenIdx,
+                                     @Nonnull final ParsedCssUrl parsed) throws CssValidationException {
+        if (tokenIdx + 1 >= tokens.size()) {
+            throw new CssValidationException("Url token not within range of tokens");
+        }
+        final Token token = tokens.get(tokenIdx);
+
+        if (getTokenType(token) != TokenType.URL) {
+            throw new CssValidationException("Url token not within range of tokens");
+        }
+
+        copyPosTo(token, parsed);
+        parsed.setUtf8Url(token.toString());
+    }
+
+    /**
+     * Parses a CSS function token named 'url', including the string and closing
+     * paren. Typically takes the form "url('http://foo')".
+     * Returns the token_idx past the closing paren, or -1 if parsing fails.
+     * Preconditions: tokens[token_idx] is a URL token
+     * and tokens[token_idx].StringValue() == "url"
+     *
+     * @param tokens   to validate
+     * @param tokenIdx index to start from
+     * @param parsed   ParsedCssUrl object to populate
+     * @return the token_idx past the closing paren, or -1 if parsing fails.
+     * @throws CssValidationException css validation exception
+     */
+    public static int parseUrlFunction(@Nonnull final List<Token> tokens, int tokenIdx,
+                                       @Nonnull final ParsedCssUrl parsed) throws CssValidationException {
+        final Token token = tokens.get(tokenIdx);
+
+        if (getTokenType(token) != TokenType.FUNCTION_TOKEN) {
+            throw new CssValidationException("Token at index is not a function token");
+        }
+
+        if (!token.toString().equals("url(")) {
+            throw new CssValidationException("Token value is not url");
+        }
+
+        if (getTokenType(tokens.get(tokens.size() - 1)) != TokenType.EOF_TOKEN) {
+            throw new CssValidationException("Last token is not EOF token");
+        }
+
+        copyPosTo(token, parsed);
+        tokenIdx++; // We've digested the function token above.
+        // Safe: tokens ends w/ EOF_TOKEN.
+        if (tokenIdx >= tokens.size()) {
+            throw new CssValidationException("Index outside of tokens range");
+        }
+
+        // Consume optional whitespace.
+        while (getTokenType(tokens.get(tokenIdx)) == TokenType.WHITESPACE) {
+            tokenIdx++;
+            // Safe: tokens ends w/ EOF_TOKEN.
+            if (tokenIdx >= tokens.size()) {
+                throw new CssValidationException("Index outside of tokens range");
+            }
+        }
+
+        // Consume URL.
+        if (getTokenType(tokens.get(tokenIdx)) != TokenType.STRING) {
+            return -1;
+        }
+        parsed.setUtf8Url((tokens.get(tokenIdx).toString()));
+
+        tokenIdx++;
+        // Safe: tokens ends w/ EOF_TOKEN.
+        if (tokenIdx >= tokens.size()) {
+            throw new CssValidationException("token index outside of tokens range");
+        }
+
+        // Consume optional whitespace.
+        while (getTokenType(tokens.get(tokenIdx)) == TokenType.WHITESPACE) {
+            tokenIdx++;
+            // Safe: tokens ends w/ EOF_TOKEN.
+            if (tokenIdx >= tokens.size()) {
+                throw new CssValidationException("token index outside of tokens range");
+            }
+        }
+
+        // Consume ')'
+        if (getTokenType(tokens.get(tokenIdx)) != TokenType.CLOSE_PAREN) {
+            return -1;
+        }
+        return tokenIdx + 1;
+    }
+
+    /**
+     * Parse inline style content into Declaration objects.
+     *
+     * @param tokenList the css content in a list of tokens.
+     * @param errors    output array for the errors.
+     * @return Returns a array of Declaration objects.
+     * @throws CssValidationException Css Validation Exception
+     */
+    public static List<Declaration> parseInlineStyle(@Nonnull final List<Token> tokenList,
+                                                     @Nonnull final List<ErrorToken> errors)
+            throws CssValidationException {
+        final Canonicalizer canonicalizer =
+                new Canonicalizer(new HashMap<String, ValidatorProtos.AtRuleSpec.BlockType>(),
+                        ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS);
+        return canonicalizer.parseAListOfDeclarations(tokenList, errors);
+    }
+
+    /** Max number of allowed declarations. */
+    private static final int MAX_NUM_ALLOWED_DECLARATIONS = 5;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/DispatchKeyUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/DispatchKeyUtils.java
new file mode 100644
index 0000000000000..f42fe22699988
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/DispatchKeyUtils.java
@@ -0,0 +1,112 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+
+import javax.annotation.Nonnull;
+
+/**
+ * Dispatch key utility methods.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class DispatchKeyUtils {
+    /**
+     * Private constructor.
+     */
+    private DispatchKeyUtils() {
+    }
+
+    /**
+     *  DispatchKey represents a tuple of either 1-3 strings:
+     *    - attribute name
+     *    - attribute value (optional)
+     *    - mandatory parent html tag (optional)
+     *  A Dispatch key can be generated from some validator TagSpecs. One dispatch
+     *  key per attribute can be generated from any HTML tag. If one of the
+     *  dispatch keys for an HTML tag match that of a a TagSpec, we validate that
+     *  HTML tag against only this one TagSpec. Otherwise, this TagSpec is not
+     *  eligible for validation against this HTML tag.
+     * @param dispatchKeyType a DispatchKeyType.
+     * @param attrName attribute name.
+     * @param attrValue attribute value.
+     * @param mandatoryParent may be set to "$NOPARENT"
+     * @return returns dispatch key.
+     */
+    public static String makeDispatchKey(
+            @Nonnull final ValidatorProtos.AttrSpec.DispatchKeyType dispatchKeyType,
+            @Nonnull final String attrName, @Nonnull final String attrValue,
+            @Nonnull final String mandatoryParent) {
+        switch (dispatchKeyType) {
+            case NAME_DISPATCH:
+                return attrName;
+            case NAME_VALUE_DISPATCH:
+                return attrName + "\0" + attrValue;
+            case NAME_VALUE_PARENT_DISPATCH:
+                return attrName + "\0" + attrValue + "\0" + (mandatoryParent != null ? "true" : "");
+            case NONE_DISPATCH:
+            default:
+                assert false;
+        }
+        return ""; // To make closure happy.
+    }
+
+    /**
+     * For a provided tag spec, generates its dispatch key.
+     * @param tagSpec a tag spec.
+     * @return a dispatch key.
+     */
+    public static String getDispatchKeyForTagSpecOrNone(@Nonnull final ValidatorProtos.TagSpec tagSpec)  {
+        for (ValidatorProtos.AttrSpec attr : tagSpec.getAttrsList()) {
+            if (attr.getDispatchKey() != ValidatorProtos.AttrSpec.DispatchKeyType.NONE_DISPATCH) {
+                final boolean mandatoryParent = tagSpec.hasMandatoryParent();
+                if (attr.getDispatchKey() == ValidatorProtos.AttrSpec.DispatchKeyType.NAME_DISPATCH) {
+                    return attr.getName();
+                }
+
+                String attrValue = null;
+                if (attr.getValueCaseiList() != null && attr.getValueCaseiList().size() > 0) {
+                    attrValue = attr.getValueCasei(0);
+                } else if (attr.getValueList() != null && attr.getValueList().size() > 0) {
+                    attrValue = attr.getValue(0).toLowerCase();
+                }
+
+                if (attrValue == null) {
+                    return null;
+                }
+
+                if (attr.getDispatchKey() == ValidatorProtos.AttrSpec.DispatchKeyType.NAME_VALUE_DISPATCH) {
+                    return attr.getName() + "\0" + attrValue;
+                }
+
+                if (attr.getDispatchKey() == ValidatorProtos.AttrSpec.DispatchKeyType.NAME_VALUE_PARENT_DISPATCH) {
+                    return attr.getName() + "\0" + attrValue + "\0" + (mandatoryParent ? mandatoryParent : "");
+                }
+            }
+        }
+
+        return null;
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/ParseSrcSetUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/ParseSrcSetUtils.java
new file mode 100644
index 0000000000000..d2a2892655e56
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/ParseSrcSetUtils.java
@@ -0,0 +1,130 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import dev.amp.validator.SrcsetParsingResult;
+import dev.amp.validator.SrcsetSourceDef;
+
+import javax.annotation.Nonnull;
+import java.util.HashSet;
+import java.util.Set;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+
+/**
+ * Utility class to parse the text representation of srcset.
+ * See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#Attributes.
+ * See http://www.w3.org/html/wg/drafts/html/master/semantics.html#attr-img-srcset.
+ *
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class ParseSrcSetUtils {
+    /**
+     * Private constructor.
+     */
+    private ParseSrcSetUtils() {
+    }
+
+    /**
+     * Parses the text representation of srcset into array of SrcsetSourceDef.
+     * See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#Attributes.
+     * See http://www.w3.org/html/wg/drafts/html/master/semantics.html#attr-img-srcset.
+     *
+     * If parsing fails, returns false in SrcsetParsingResult.status.
+     *
+     * @param srcset the srcset.
+     * @return returns SrcsetParsingResult.
+     */
+    public static SrcsetParsingResult parseSrcset(@Nonnull final String srcset) {
+        // Regex for leading spaces, followed by an optional comma and whitespace,
+        // followed by an URL*, followed by an optional space, followed by an
+        // optional width or pixel density**, followed by spaces, followed by an
+        // optional comma and whitespace.
+        //
+        // URL*: matches non-space, non-empty string which neither ends nor begins
+        // with a comma. The set of space characters in the srcset attribute is
+        // defined to include only ascii characters, so using \s, which is an
+        // ascii only character set, is fine. See
+        // https://html.spec.whatwg.org/multipage/infrastructure.html#space-character.
+        //
+        // Optional width or pixel density**: Matches the empty string or (one or
+        // more spaces + a non empty string containing no space or commas).
+        // Doesn't capture the initial space.
+        //
+        // \s*                       Match, but don't capture leading spaces
+        // (?:,\s*)?                 Optionally match comma and trailing space,
+        //                           but don't capture comma.
+        // ([^,\s]\S*[^,\s])         Match something like "google.com/favicon.ico"
+        //                           but not ",google.com/favicon.ico,"
+        // \s*                       Match, but dont capture spaces.
+        // ([\d]+.?[\d]*[w|x])?      e.g. "5w" or "5x" or "10.2x"
+        // \s*                       Match, but don't capture space
+        // (?:(,)\s*)?               Optionally match comma and trailing space,
+        //                           capturing comma.
+
+        String remainingSrcset = srcset;
+        final Set<String> seenWidthOrPixelDensity = new HashSet<>();
+        final SrcsetParsingResult result = new SrcsetParsingResult();
+        final Matcher matcher = IMAGE_CANDIDATE_REGEX.matcher(srcset);
+        while (matcher.find()) {
+            final String url = matcher.group(1);
+            String widthOrPixelDensity = matcher.group(2);
+            final String comma = matcher.group(3);
+            if (widthOrPixelDensity == null) {
+                widthOrPixelDensity = "1x";
+            }
+            // Duplicate width or pixel density in srcset.
+            if (seenWidthOrPixelDensity.contains(widthOrPixelDensity)) {
+                result.setErrorCode(ValidatorProtos.ValidationError.Code.DUPLICATE_DIMENSION);
+                return result;
+            }
+            seenWidthOrPixelDensity.add(widthOrPixelDensity);
+            result.add(new SrcsetSourceDef(url, widthOrPixelDensity));
+
+            // More srcset, comma expected as separator for image candidates.
+            if (comma == null) {
+                result.setErrorCode(ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE);
+                return result;
+            }
+        }
+
+        // Must have at least one image candidate.
+        if (result.getSrcsetImagesSize() == 0) {
+            result.setErrorCode(ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE);
+            return result;
+        }
+        result.setSuccess(true);
+        return result;
+    }
+
+    private static final Pattern IMAGE_CANDIDATE_REGEX = Pattern.compile("\\s*"
+                    + "(?:,\\s*)?"
+                    + "([^,\\s]\\S*[^,\\s])"
+                    + "\\s*"
+                    + "([\\d]+.?[\\d]*[w|x])?"
+                    + "\\s*"
+                    + "(?:(,)\\s*)?");
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/TagSpecUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/TagSpecUtils.java
new file mode 100644
index 0000000000000..19d928da78049
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/TagSpecUtils.java
@@ -0,0 +1,884 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import dev.amp.validator.RecordValidated;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.Context;
+import dev.amp.validator.CssLength;
+import dev.amp.validator.DescendantConstraints;
+import dev.amp.validator.ExtensionsContext;
+import dev.amp.validator.ParsedHtmlTag;
+import dev.amp.validator.ParsedTagSpec;
+import dev.amp.validator.TagSpecDispatch;
+import dev.amp.validator.TagStack;
+import dev.amp.validator.ValidateTagResult;
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.exception.ValidatorException;
+
+import javax.annotation.Nonnull;
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.Arrays;
+import java.util.HashMap;
+import java.util.HashSet;
+import java.util.List;
+import java.util.Map;
+import java.util.Set;
+
+/**
+ * Tag spec utility methods.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class TagSpecUtils {
+    /**
+     * Private constructor.
+     */
+    private TagSpecUtils() {
+    }
+
+    /**
+     * For creating error URLs, we either find the specUrl in the tag spec or fall
+     * back to the extension spec URL if available.
+     *
+     * @param tagSpec TagSpec instance from the validator.protoscii file.
+     * @return returns the tag spec URL.
+     */
+    public static String getTagSpecUrl(@Nonnull final ValidatorProtos.TagSpec tagSpec) {
+        // Handle a ParsedTagSpec as well as a tag spec.
+        // TODO(gregable): This is a bit hacky, we should improve on this approach
+        // in the future.
+        if (tagSpec.hasSpecUrl()) {
+            return tagSpec.getSpecUrl();
+        }
+
+        final String extensionSpecUrlPrefix = "https://amp.dev/documentation/components/";
+        if (tagSpec.hasExtensionSpec() && tagSpec.getExtensionSpec().getName() != null) {
+            return extensionSpecUrlPrefix + tagSpec.getExtensionSpec().getName();
+        }
+
+        if (tagSpec.getRequiresExtensionCount() > 0) {
+            // Return the first |requires_extension|, which should be the most
+            // representitive.
+            return extensionSpecUrlPrefix + tagSpec.getRequiresExtension(0);
+        }
+
+        return "";
+    }
+
+    /**
+     * For creating error messages, we either find the specName in the tag spec or
+     * fall back to the tagName.
+     *
+     * @param tagSpec TagSpec instance from the validator.protoscii file.
+     * @return return the tag spec name.
+     */
+    public static String getTagSpecName(@Nonnull final ValidatorProtos.TagSpec tagSpec) {
+        return (tagSpec.hasSpecName()) ? tagSpec.getSpecName() : tagSpec.getTagName().toLowerCase();
+    }
+
+    /**
+     * We only track (that is, add them to Context.RecordTagspecValidated) validated
+     * tagspecs as necessary. That is, if it's needed for document scope validation:
+     * - Mandatory tags
+     * - Unique tags
+     * - Tags (identified by their TagSpecName() that are required by other tags.
+     * @param tag the TagSpec.
+     * @param tagSpecId the tag spec id.
+     * @param tagSpecIdsToTrack a map of tag spec id to boolean.
+     * @return returns a record validated enum value.
+     */
+    public static RecordValidated shouldRecordTagspecValidated(@Nonnull final ValidatorProtos.TagSpec tag, final int tagSpecId,
+                                                               @Nonnull final Map<Object, Boolean> tagSpecIdsToTrack) {
+        // Always update from TagSpec if the tag is passing. If it's failing we
+        // typically want to update from the best match as it can satisfy
+        // requirements which otherwise can confuse the user later. The exception is
+        // tagspecs which introduce requirements but satisfy none, such as unique.
+        // https://github.com/ampproject/amphtml/issues/24359
+
+        // Mandatory and tagSpecIdsToTrack only satisfy requirements, making the
+        // output less verbose even if the tag is failing.
+        if (tag.hasMandatory() || tagSpecIdsToTrack.containsKey(tagSpecId)) {
+            return RecordValidated.ALWAYS;
+        }
+        // Unique and similar can introduce requirements, ie: there cannot be another
+        // such tag. We don't want to introduce requirements for failing tags.
+        if (tag.hasUnique() || tag.getRequiresList().size() > 0 || tag.hasUniqueWarning()) {
+            return RecordValidated.IF_PASSING;
+        }
+        return RecordValidated.NEVER;
+    }
+
+    /**
+     * Validates the provided |tagName| with respect to the tag
+     * specifications in the validator's rules, returning a ValidationResult
+     * with errors for this tag and a PASS or FAIL status. At least one
+     * specification must validate, or the result will have status FAIL.
+     * Also passes back a reference to the tag spec which matched, if a match
+     * was found.
+     *
+     * @param context the context
+     * @param encounteredTag the encountered tag
+     * @param bestMatchReferencePoint the best match reference point
+     * @return returns ValidateTagResult.
+     * @throws TagValidationException tag validation exception.
+     * @throws ValidatorException tag validation exception.
+     * @throws IOException the IOException.
+     * @throws CssValidationException Css Validation Exception.
+     */
+    public static ValidateTagResult validateTag(@Nonnull final Context context,
+                                                @Nonnull final ParsedHtmlTag encounteredTag,
+                                                final ParsedTagSpec bestMatchReferencePoint)
+            throws TagValidationException, ValidatorException, IOException, CssValidationException {
+        final TagSpecDispatch tagSpecDispatch =
+                context.getRules().dispatchForTagName(encounteredTag.upperName());
+        // Filter TagSpecDispatch.AllTagSpecs by type identifiers.
+        List<ParsedTagSpec> filteredTagSpecs = new ArrayList<>();
+        if (tagSpecDispatch != null) {
+            for (Integer tagSpecId : tagSpecDispatch.allTagSpecs()) {
+                final ParsedTagSpec parsedTagSpec = context.getRules().getByTagSpecId(tagSpecId);
+                // Keep TagSpecs that are used for these type identifiers.
+                if (parsedTagSpec.isUsedForTypeIdentifiers(
+                        context.getTypeIdentifiers())) {
+                    filteredTagSpecs.add(parsedTagSpec);
+                }
+            }
+        }
+        // If there are no dispatch keys matching the tag name, ex: tag name is
+        // "foo", set a disallowed tag error.
+        if (tagSpecDispatch == null
+                || (!tagSpecDispatch.hasDispatchKeys() && filteredTagSpecs.size() == 0)) {
+            ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+            String specUrl = "";
+            // Special case the spec_url for font tags to be slightly more useful.
+            if (encounteredTag.upperName().equals("FONT")) {
+                specUrl = context.getRules().getStylesSpecUrl();
+            }
+            final List<String> params = new ArrayList<>();
+            params.add(encounteredTag.lowerName());
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.DISALLOWED_TAG,
+                    context.getLineCol(),
+                    params,
+                    specUrl,
+                    result);
+
+            return new ValidateTagResult(result, null);
+        }
+
+        // At this point, we have dispatch keys, tagspecs, or both.
+        // The strategy is to look for a matching dispatch key first. A matching
+        // dispatch key does not guarantee that the dispatched tagspec will also
+        // match. If we find a matching dispatch key, we immediately return the
+        // result for that tagspec, success or fail.
+        // If we don't find a matching dispatch key, we must try all of the
+        // tagspecs to see if any of them match. If there are no tagspecs, we want
+        // to return a GENERAL_DISALLOWED_TAG error.
+        // calling HasDispatchKeys here is only an optimization to skip the loop
+        // over encountered attributes in the case where we have no dispatches.
+        if (tagSpecDispatch.hasDispatchKeys()) {
+            for (int i = 0; i < encounteredTag.attrs().getLength(); i++) {
+                final String name = encounteredTag.attrs().getLocalName(i);
+                final String value = encounteredTag.attrs().getValue(i);
+                List<Integer> tagSpecIds = tagSpecDispatch.matchingDispatchKey(
+                        name,
+                        // Attribute values are case-sensitive by default, but we
+                        // match dispatch keys in a case-insensitive manner and then
+                        // validate using whatever the tagspec requests.
+                        value.toLowerCase(), context.getTagStack().parentTagName());
+                ValidatorProtos.ValidationResult.Builder validationResult = ValidatorProtos.ValidationResult.newBuilder();
+                ValidateTagResult ret = new ValidateTagResult(validationResult, null);
+                validationResult.setStatus(ValidatorProtos.ValidationResult.Status.UNKNOWN);
+                for (Integer tagSpecId : tagSpecIds) {
+                    final ParsedTagSpec parsedTagSpec = context.getRules().getByTagSpecId(tagSpecId);
+                    // Skip TagSpecs that aren't used for these type identifiers.
+                    if (!parsedTagSpec.isUsedForTypeIdentifiers(
+                            context.getTypeIdentifiers())) {
+                        continue;
+                    }
+                    final ValidatorProtos.ValidationResult.Builder resultForAttempt = TagSpecUtils.validateTagAgainstSpec(
+                            parsedTagSpec, bestMatchReferencePoint, context, encounteredTag);
+                    if (context.getRules().betterValidationResultThan(
+                            resultForAttempt, ret.getValidationResult())) {
+                        ret.setBestMatchTagSpec(parsedTagSpec);
+                        ret.setValidationResult(resultForAttempt);
+                        // Exit early on success
+                        if (ret.getValidationResult().getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+                            return ret;
+                        }
+                    }
+                }
+
+                if (ret.getValidationResult().getStatus() != ValidatorProtos.ValidationResult.Status.UNKNOWN) {
+                    return ret;
+                }
+            }
+        }
+        // None of the dispatch tagspecs matched and passed. If there are no
+        // non-dispatch tagspecs, consider this a 'generally' disallowed tag,
+        // which gives an error that reads "tag foo is disallowed except in
+        // specific forms".
+        if (filteredTagSpecs.size() == 0) {
+            final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+            if (encounteredTag.upperName().equals("SCRIPT")) {
+                // Special case for <script> tags to produce better error messages.
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_SCRIPT_TAG,
+                        context.getLineCol(),
+                        new ArrayList<>(),
+                        context.getRules().getScriptSpecUrl(),
+                        result);
+            } else {
+                final List<String> params = new ArrayList<>();
+                params.add(encounteredTag.lowerName());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.GENERAL_DISALLOWED_TAG,
+                        context.getLineCol(),
+                        params,
+                        /* specUrl */ "",
+                        result);
+            }
+            return new ValidateTagResult(result, null);
+        }
+        // Validate against all remaining tagspecs. Each tagspec will produce a
+        // different set of errors. Even if none of them match, we only want to
+        // return errors from a single tagspec, not all of them. We keep around
+        // the 'best' attempt until we have found a matching TagSpec or have
+        // tried them all.
+        ValidatorProtos.ValidationResult.Builder resultForBestAttempt = ValidatorProtos.ValidationResult.newBuilder();
+        resultForBestAttempt.setStatus(ValidatorProtos.ValidationResult.Status.UNKNOWN);
+        ParsedTagSpec bestMatchTagSpec = null;
+        for (final ParsedTagSpec parsedTagSpec : filteredTagSpecs) {
+            final ValidatorProtos.ValidationResult.Builder resultForAttempt = TagSpecUtils.validateTagAgainstSpec(
+                    parsedTagSpec, bestMatchReferencePoint, context, encounteredTag);
+            if (context.getRules().betterValidationResultThan(resultForAttempt, resultForBestAttempt)) {
+                resultForBestAttempt = resultForAttempt;
+                bestMatchTagSpec = parsedTagSpec;
+                // Exit early
+                if (resultForBestAttempt.getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+                    return new ValidateTagResult(resultForBestAttempt, bestMatchTagSpec);
+                }
+            }
+        }
+        return new ValidateTagResult(resultForBestAttempt, bestMatchTagSpec);
+    }
+
+
+    /**
+     * Validates the provided |tagName| with respect to a single tag
+     * specification.
+     * @param parsedTagSpec parsed tag spec.
+     * @param bestMatchReferencePoint best match reference point.
+     * @param context the context object.
+     * @param encounteredTag the encountered tag.
+     * @throws TagValidationException the TagValidationException.
+     * @throws IOException IO Exception
+     * @throws CssValidationException Css validation exception.
+     * @return returns the validation result.
+     */
+    public static ValidatorProtos.ValidationResult.Builder validateTagAgainstSpec(
+            @Nonnull final ParsedTagSpec parsedTagSpec,
+            final ParsedTagSpec bestMatchReferencePoint,
+            @Nonnull final Context context,
+            @Nonnull final ParsedHtmlTag encounteredTag)
+            throws TagValidationException, IOException, CssValidationException {
+        final ValidatorProtos.ValidationResult.Builder resultForAttempt = ValidatorProtos.ValidationResult.newBuilder();
+        resultForAttempt.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        validateParentTag(parsedTagSpec, context, resultForAttempt);
+        validateAncestorTags(parsedTagSpec, context, resultForAttempt);
+        // Some parent tag specs also define allowed child tag names for the first
+        // child or all children. Validate that we aren't violating any of those
+        // rules either.
+        context.getTagStack().matchChildTagName(
+                encounteredTag, context, resultForAttempt);
+
+        // Only validate attributes if we haven't yet found any errors. The
+        // Parent/Ancestor errors are informative without adding additional errors
+        // about attributes.
+        if (resultForAttempt.getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+            AttributeSpecUtils.validateAttributes(
+                    parsedTagSpec, bestMatchReferencePoint, context, encounteredTag,
+                    resultForAttempt);
+        }
+
+        // Only validate that this is a valid descendant if it's not already invalid.
+        if (resultForAttempt.getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+            validateDescendantTags(
+                    encounteredTag, parsedTagSpec, context, resultForAttempt);
+        }
+
+        validateNoSiblingsAllowedTags(parsedTagSpec, context, resultForAttempt);
+        validateLastChildTags(context, resultForAttempt);
+
+        // If we haven't reached the body element yet, we may not have seen the
+        // necessary extension. That case is handled elsewhere.
+        if (context.getTagStack().hasAncestor("BODY")) {
+            validateRequiredExtensions(parsedTagSpec, context, resultForAttempt);
+        }
+
+        // Only validate uniqueness if we haven't yet found any errors, as it's
+        // likely that this is not the correct tagspec if we have.
+        if (resultForAttempt.getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+            validateUniqueness(parsedTagSpec, context, resultForAttempt);
+        }
+
+        // Append some warnings, only if no errors.
+        if (resultForAttempt.getStatus() == ValidatorProtos.ValidationResult.Status.PASS) {
+            final ValidatorProtos.TagSpec tagSpec = parsedTagSpec.getSpec();
+            List<String> params = new ArrayList<>();
+            if (tagSpec.hasDeprecation()) {
+                params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                params.add(tagSpec.getDeprecation());
+                context.addWarning(
+                        ValidatorProtos.ValidationError.Code.DEPRECATED_TAG,
+                        context.getLineCol(),
+                        params,
+                        tagSpec.getDeprecationUrl(),
+                        resultForAttempt);
+            }
+            if (tagSpec.hasUniqueWarning()
+                   && context.hasTagspecsValidated(parsedTagSpec.getId())) {
+                params.clear();
+                params.add(TagSpecUtils.getTagSpecName(tagSpec));
+                context.addWarning(
+                        ValidatorProtos.ValidationError.Code.DUPLICATE_UNIQUE_TAG_WARNING,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(tagSpec),
+                        resultForAttempt);
+            }
+        }
+        return resultForAttempt;
+    }
+
+    /**
+     * Validates whether the parent tag satisfied the spec (e.g., some
+     * tags can only appear in head).
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context the Context object.
+     * @param validationResult validation result.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public static void validateParentTag(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                         @Nonnull final Context context,
+                                         @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+                    throws TagValidationException {
+        final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+        if (spec.hasMandatoryParent()
+                && !spec.getMandatoryParent().equals(context.getTagStack().parentTagName())) {
+            // Output a parent/child error using CSS Child Selector syntax which is
+            // both succinct and should be well understood by web developers.
+            List<String> params = new ArrayList<>();
+            params.add(getTagSpecName(spec));
+            params.add(context.getTagStack().parentTagName().toLowerCase());
+            params.add(spec.getMandatoryParent().toLowerCase());
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.WRONG_PARENT_TAG,
+                    context.getLineCol(),
+                    params,
+                    getTagSpecUrl(spec),
+                    validationResult);
+        }
+    }
+
+    /**
+     * Validates if the tag ancestors satisfied the spec.
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context the context.
+     * @param validationResult validation result.
+     */
+    public static void validateAncestorTags(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                            @Nonnull final Context context,
+                                            @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+        if (spec.hasMandatoryAncestor()) {
+            final String mandatoryAncestor = /** @type {string} */ spec.getMandatoryAncestor();
+            if (!context.getTagStack().hasAncestor(mandatoryAncestor)) {
+                if (spec.hasMandatoryAncestorSuggestedAlternative()) {
+                    final List<String> params = new ArrayList<>();
+                    params.add(getTagSpecName(spec));
+                    params.add(mandatoryAncestor.toLowerCase());
+                    params.add(spec.getMandatoryAncestorSuggestedAlternative().toLowerCase());
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.MANDATORY_TAG_ANCESTOR_WITH_HINT,
+                            context.getLineCol(),
+                            params,
+                            getTagSpecUrl(spec),
+                            validationResult);
+                } else {
+                    final List<String> params = new ArrayList<>();
+                    params.add(getTagSpecName(spec));
+                    params.add(mandatoryAncestor.toLowerCase());
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.MANDATORY_TAG_ANCESTOR,
+                            context.getLineCol(),
+                            params,
+                            getTagSpecUrl(spec),
+                            validationResult);
+                }
+                return;
+            }
+        }
+        for (String disallowedAncestor : spec.getDisallowedAncestorList()) {
+            if (context.getTagStack().hasAncestor(disallowedAncestor)) {
+                final List<String> params = new ArrayList<>();
+                params.add(getTagSpecName(spec));
+                params.add(disallowedAncestor.toLowerCase());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_TAG_ANCESTOR,
+                        context.getLineCol(),
+                        params,
+                        getTagSpecUrl(spec),
+                        validationResult);
+                return;
+            }
+        }
+    }
+
+    /**
+     * @param layout layout.
+     * @return amp.validator.AmpLayout.Layout.
+     */
+    public static ValidatorProtos.AmpLayout.Layout parseLayout(final String layout) {
+        if (layout == null) {
+            return ValidatorProtos.AmpLayout.Layout.UNKNOWN;
+        }
+
+        final String normLayout = layout.toUpperCase().replace('-', '_');
+        if (ValidatorProtos.AmpLayout.Layout.getDescriptor().findValueByName(normLayout) == null) {
+            return ValidatorProtos.AmpLayout.Layout.UNKNOWN;
+        }
+        return ValidatorProtos.AmpLayout.Layout.valueOf(normLayout);
+    }
+
+    /**
+     * Calculates the effective height from input layout and input height.
+     *
+     * @param spec the amp layout spec.
+     * @param inputLayout input layout.
+     * @param inputHeight css length input height.
+     * @return returns the css length instance.
+     */
+    public static CssLength calculateHeight(@Nonnull final ValidatorProtos.AmpLayout spec,
+                                                      @Nonnull final ValidatorProtos.AmpLayout.Layout inputLayout,
+                                                      @Nonnull final CssLength inputHeight) {
+        if ((inputLayout == ValidatorProtos.AmpLayout.Layout.UNKNOWN
+                || inputLayout == ValidatorProtos.AmpLayout.Layout.FIXED
+                || inputLayout == ValidatorProtos.AmpLayout.Layout.FIXED_HEIGHT)
+                && !inputHeight.isSet() && spec.hasDefinesDefaultHeight()) {
+            return new CssLength(
+                    "1px", /* allowAuto */ false, /* allowFluid */ false);
+        }
+        return inputHeight;
+    }
+
+    /**
+     * Calculates the layout; this depends on the width / height
+     * calculation above. It happens last because web designers often make
+     * fixed-sized mocks first and then the layout determines how things
+     * will change for different viewports / devices / etc.
+     *
+     * @param inputLayout input layout.
+     * @param width widht.
+     * @param height height.
+     * @param sizesAttr sizes attribute.
+     * @param heightsAttr heights attribute.
+     * @return return the layout depends on the width/height.
+     */
+    public static ValidatorProtos.AmpLayout.Layout calculateLayout(@Nonnull final ValidatorProtos.AmpLayout.Layout inputLayout,
+                                                             @Nonnull final CssLength width,
+                                                             @Nonnull final CssLength height,
+                                                             final String sizesAttr,
+                                                             final String heightsAttr) {
+        if (inputLayout != ValidatorProtos.AmpLayout.Layout.UNKNOWN) {
+            return inputLayout;
+        } else if (!width.isSet() && !height.isSet()) {
+            return ValidatorProtos.AmpLayout.Layout.CONTAINER;
+        } else if ((height.isSet() && height.isFluid()) || (width.isSet() && width.isFluid())) {
+            return ValidatorProtos.AmpLayout.Layout.FLUID;
+        } else if (height.isSet() && (!width.isSet() || width.isAuto())) {
+            return ValidatorProtos.AmpLayout.Layout.FIXED_HEIGHT;
+        } else if (height.isSet() && width.isSet() && (sizesAttr != null || heightsAttr != null)) {
+            return ValidatorProtos.AmpLayout.Layout.RESPONSIVE;
+        } else {
+            return ValidatorProtos.AmpLayout.Layout.FIXED;
+        }
+    }
+
+    /**
+     * Helper method for validateLayout.
+     * Validates the server-side rendering related attributes for the given layout.
+     * @param spec the tag spec.
+     * @param encounteredTag the encounted tag.
+     * @param inputLayout input layout.
+     * @param inputWidth input width.
+     * @param inputHeight input height.
+     * @param sizesAttr sizes attribute.
+     * @param heightsAttr heights attribute.
+     * @param context the context.
+     * @param result validation result.
+     */
+    public static void validateSsrLayout(
+            @Nonnull final ValidatorProtos.TagSpec spec,
+            @Nonnull final ParsedHtmlTag encounteredTag,
+            @Nonnull final ValidatorProtos.AmpLayout.Layout inputLayout,
+            @Nonnull final CssLength inputWidth,
+            @Nonnull final CssLength inputHeight,
+            final String sizesAttr,
+            final String heightsAttr,
+            @Nonnull final Context context,
+            @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        // Only applies to transformed AMP and custom elements (<amp-...>).
+        if (!context.isTransformed()
+                || !encounteredTag.lowerName().startsWith("amp-")) {
+            return;
+        }
+
+        // calculate effective ssr layout
+        final CssLength width =
+                calculateWidthForTag(inputLayout, inputWidth, encounteredTag.upperName());
+        final CssLength height = calculateHeightForTag(
+                inputLayout, inputHeight, encounteredTag.upperName());
+        final ValidatorProtos.AmpLayout.Layout layout =
+                calculateLayout(inputLayout, width, height, sizesAttr, heightsAttr);
+
+        final HashMap<String, String> attrsByKey = encounteredTag.attrsByKey();
+
+        // class attribute
+        final String classAttr = attrsByKey.get("class");
+        if (classAttr != null) {
+            // i-amphtml-layout-{layout_name}
+            final Set<String> validInternalClasses = new HashSet<>();
+            validInternalClasses.add(getLayoutClass(layout));
+            if (isLayoutSizeDefined(layout)) {
+                // i-amphtml-layout-size-defined
+                validInternalClasses.add(getLayoutSizeDefinedClass());
+            }
+            final String [] classes = classAttr.split("[\\s+]");
+            for (String classValue : classes) {
+                if (classValue.startsWith("i-amphtml-")
+                        && !(validInternalClasses.contains(classValue))) {
+                    List<String> params = new ArrayList<>();
+                    params.add("class");
+                    params.add(getTagSpecName(spec));
+                    params.add(classAttr);
+                    context.addError(
+                            ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE,
+                            context.getLineCol(),
+                            params,
+                            getTagSpecUrl(spec),
+                            result);
+                }
+            }
+        }
+
+        // i-amphtml-layout attribute
+        final String ssrAttr = attrsByKey.get("i-amphtml-layout");
+        if (ssrAttr != null) {
+            final String layoutName = layout.name(); //getLayoutName(layout);
+            if (!layoutName.equals(ssrAttr.toLowerCase())) {
+                List<String> params = new ArrayList<>();
+                params.add(ssrAttr);
+                params.add("i-amphtml-layout");
+                params.add(getTagSpecName(spec));
+                params.add(layoutName.toUpperCase());
+                params.add(layoutName);
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.ATTR_VALUE_REQUIRED_BY_LAYOUT,
+                        context.getLineCol(),
+                        params,
+                        getTagSpecUrl(spec),
+                        result);
+            }
+        }
+    }
+
+    /**
+     * @param layout AMP layout.
+     * @return returns true if layout size is matched.
+     */
+    public static boolean isLayoutSizeDefined(@Nonnull final ValidatorProtos.AmpLayout.Layout layout) {
+        return (
+                layout == ValidatorProtos.AmpLayout.Layout.FILL
+                        || layout == ValidatorProtos.AmpLayout.Layout.FIXED
+                        || layout == ValidatorProtos.AmpLayout.Layout.FIXED_HEIGHT
+                        || layout == ValidatorProtos.AmpLayout.Layout.FLEX_ITEM
+                        || layout == ValidatorProtos.AmpLayout.Layout.FLUID
+                        || layout == ValidatorProtos.AmpLayout.Layout.INTRINSIC
+                        || layout == ValidatorProtos.AmpLayout.Layout.RESPONSIVE);
+    }
+
+    /**
+     * @param layout AMP layout.
+     * @return returns the layout class.
+     */
+    public static String getLayoutClass(@Nonnull final ValidatorProtos.AmpLayout.Layout layout) {
+        return "i-amphtml-layout-" + layout.name();
+    }
+
+    /**
+     * @return returns the layout size defined class.
+     */
+    public static String getLayoutSizeDefinedClass() {
+        return "i-amphtml-layout-size-defined";
+    }
+
+    /**
+     * Calculates the effective width from the input layout, input width and tag.
+     * For certain tags it uses explicit dimensions.
+     *
+     * @param inputLayout input layout.
+     * @param inputWidth input width.
+     * @param tagName the tag name.
+     * @return returns the css length instance.
+     */
+    public static CssLength calculateWidthForTag(@Nonnull final ValidatorProtos.AmpLayout.Layout inputLayout,
+                                                           @Nonnull final CssLength inputWidth,
+                                                           @Nonnull final String tagName) {
+        if ((inputLayout == ValidatorProtos.AmpLayout.Layout.UNKNOWN
+                || inputLayout == ValidatorProtos.AmpLayout.Layout.FIXED)
+                && !inputWidth.isSet()) {
+            if (tagName.equals("AMP-ANALYTICS") || tagName.equals("AMP-PIXEL")) {
+                return new CssLength(
+                        "1px", /* allowAuto */ false, /* allowFluid */ false);
+            }
+            if (tagName.equals("AMP-SOCIAL-SHARE")) {
+                return new CssLength(
+                        "60px", /* allowAuto */ false, /* allowFluid */ false);
+            }
+        }
+        return inputWidth;
+    }
+
+    /**
+     * Calculates the effective height from the input layout, input height and tag.
+     * For certain tags it uses explicit dimensions.
+     *
+     * @param inputLayout input layout.
+     * @param inputHeight input height.
+     * @param tagName the tag name.
+     * @return returns the css length instance.
+     */
+    public static CssLength calculateHeightForTag(@Nonnull final ValidatorProtos.AmpLayout.Layout inputLayout,
+                                                  @Nonnull final CssLength inputHeight,
+                                                  @Nonnull final String tagName) {
+        if ((inputLayout == ValidatorProtos.AmpLayout.Layout.UNKNOWN
+                || inputLayout == ValidatorProtos.AmpLayout.Layout.FIXED
+                || inputLayout == ValidatorProtos.AmpLayout.Layout.FIXED_HEIGHT)
+                && !inputHeight.isSet()) {
+            if (tagName.equals("AMP-ANALYTICS") || tagName.equals("AMP-PIXEL")) {
+                return new CssLength(
+                        "1px", /* allowAuto */ false, /* allowFluid */ false);
+            }
+            if (tagName.equals("AMP-SOCIAL-SHARE")) {
+                return new CssLength(
+                        "44px", /* allowAuto */ false, /* allowFluid */ false);
+            }
+        }
+        return inputHeight;
+    }
+
+    /**
+     * Calculates the effective width from the input layout and input width.
+     * This involves considering that some elements, such as amp-audio and
+     * amp-pixel, have natural dimensions (browser or implementation-specific
+     * defaults for width / height).
+     *
+     * @param spec AMP layout spec.
+     * @param inputLayout input layout.
+     * @param inputWidth input width.
+     * @return return the css length instance.
+     */
+    public static CssLength calculateWidth(@Nonnull final ValidatorProtos.AmpLayout spec,
+                                                     @Nonnull final ValidatorProtos.AmpLayout.Layout inputLayout,
+                                                     @Nonnull final CssLength inputWidth) {
+        if ((inputLayout == ValidatorProtos.AmpLayout.Layout.UNKNOWN
+                || inputLayout == ValidatorProtos.AmpLayout.Layout.FIXED)
+                && !inputWidth.isSet() && spec.hasDefinesDefaultWidth()) {
+            return new CssLength(
+                    "1px", /* allowAuto */ false, /* allowFluid */ false);
+        }
+        return inputWidth;
+    }
+
+    /**
+     * Validates that this tag is an allowed descendant tag type.
+     * Registers new descendent constraints if they are set.
+     * @param encounteredTag encountered tag.
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context the context.
+     * @param validationResult validation result.
+     */
+    public static void validateDescendantTags(
+            @Nonnull final ParsedHtmlTag encounteredTag, @Nonnull final ParsedTagSpec parsedTagSpec,
+            @Nonnull final Context context,
+            @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        final TagStack tagStack = context.getTagStack();
+
+        for (DescendantConstraints allowedDescendantsList : tagStack.allowedDescendantsList()) {
+            // If the tag we're validating is not whitelisted for a specific ancestor,
+            // then throw an error.
+            if (!allowedDescendantsList.getAllowedTags().contains(encounteredTag.upperName())) {
+                final List<String> params = new ArrayList<>();
+                params.add(encounteredTag.lowerName());
+                params.add(allowedDescendantsList.getTagName().toLowerCase());
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.DISALLOWED_TAG_ANCESTOR,
+                        context.getLineCol(),
+                        params,
+                        TagSpecUtils.getTagSpecUrl(parsedTagSpec.getSpec()),
+                        validationResult);
+                return;
+            }
+        }
+    }
+
+    /**
+     * Validates if the 'no siblings allowed' rule exists.
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context the context.
+     * @param validationResult validation result.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public static void validateNoSiblingsAllowedTags(
+            @Nonnull final ParsedTagSpec parsedTagSpec, @Nonnull final Context context,
+            @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+            throws TagValidationException {
+        final ValidatorProtos.TagSpec spec = parsedTagSpec.getSpec();
+        final TagStack tagStack = context.getTagStack();
+
+        if (spec.hasSiblingsDisallowed() && tagStack.parentChildCount() > 0) {
+            final List<String> params = new ArrayList<>();
+            params.add(spec.getTagName().toLowerCase());
+            params.add(tagStack.parentTagName().toLowerCase());
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.TAG_NOT_ALLOWED_TO_HAVE_SIBLINGS,
+                    context.getLineCol(),
+                    params,
+                    getTagSpecUrl(spec),
+                    validationResult);
+        }
+
+        if (tagStack.parentHasChildWithNoSiblingRule() && tagStack.parentChildCount() > 0) {
+            final List<String> params = new ArrayList<>();
+            params.add(tagStack.parentOnlyChildTagName().toLowerCase());
+            params.add(tagStack.parentTagName().toLowerCase());
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.TAG_NOT_ALLOWED_TO_HAVE_SIBLINGS,
+                    tagStack.parentOnlyChildErrorLineCol(),
+                    params,
+                    TagSpecUtils.getTagSpecUrl(spec),
+                    validationResult);
+        }
+    }
+
+    /**
+     * Validates if the 'last child' rule exists.
+     * @param context the context.
+     * @param validationResult validation result.
+     * @throws TagValidationException the TagValidationException.
+     */
+    public static void validateLastChildTags(@Nonnull final Context context,
+                             @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult)
+                            throws TagValidationException {
+        final TagStack tagStack = context.getTagStack();
+
+        if (tagStack.parentHasChildWithLastChildRule()) {
+            final List<String> params = new ArrayList<>();
+            params.add(tagStack.parentLastChildTagName().toLowerCase());
+            params.add(tagStack.parentTagName().toLowerCase());
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.MANDATORY_LAST_CHILD_TAG,
+                    tagStack.parentLastChildErrorLineCol(),
+                    params,
+                    tagStack.parentLastChildUrl(),
+                    validationResult);
+        }
+    }
+
+    /**
+     * If this tag requires an extension and we have processed all extensions,
+     * report an error if that extension has not been loaded.
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context the context.
+     * @param validationResult validation result.
+     */
+    public static void validateRequiredExtensions(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                      @Nonnull final Context context,
+                                      @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        final ValidatorProtos.TagSpec tagSpec = parsedTagSpec.getSpec();
+        final ExtensionsContext extensionsCtx = context.getExtensions();
+        for (final String requiredExtension : tagSpec.getRequiresExtensionList()) {
+            if (!extensionsCtx.isExtensionLoaded(requiredExtension)) {
+                final List<String> params = new ArrayList<>();
+                params.add(getTagSpecName(parsedTagSpec.getSpec()));
+                params.add(requiredExtension);
+                context.addError(
+                        ValidatorProtos.ValidationError.Code.MISSING_REQUIRED_EXTENSION,
+                        context.getLineCol(),
+                        params,
+                        getTagSpecUrl(parsedTagSpec.getSpec()),
+                        validationResult);
+            }
+        }
+    }
+
+    /**
+     * Check for duplicates of tags that should be unique, reporting errors for
+     * the second instance of each unique tag.
+     * @param parsedTagSpec the parsed tag spec.
+     * @param context the context.
+     * @param validationResult validation result.
+     */
+    public static void validateUniqueness(@Nonnull final ParsedTagSpec parsedTagSpec,
+                                          @Nonnull final Context context,
+                                          @Nonnull final ValidatorProtos.ValidationResult.Builder validationResult) {
+        final ValidatorProtos.TagSpec tagSpec = parsedTagSpec.getSpec();
+        if (tagSpec.hasUnique()
+                && context.getTagspecsValidated().containsKey(parsedTagSpec.id())) {
+            final List<String> params = new ArrayList<>();
+            params.add(getTagSpecName(tagSpec));
+            context.addError(
+                    ValidatorProtos.ValidationError.Code.DUPLICATE_UNIQUE_TAG,
+                    context.getLineCol(),
+                    params,
+                    getTagSpecUrl(parsedTagSpec.getSpec()),
+                    validationResult);
+        }
+    }
+
+    /** List identifiers for AMP format. */
+    public static final List AMP_IDENTIFIERS = Arrays.asList("⚡", "amp", "transformed", "data-ampdevmode");
+
+    /** List identifiers for AMP4ADS format. */
+    public static final List AMP4ADS_IDENTIFIERS = Arrays.asList("⚡4ads", "amp4ads", "data-ampdevmode");
+
+    /** List identifiers for AMP4EMAIL format. */
+    public static final List AMP4EMAIL_IDENTIFIERS = Arrays.asList("⚡4email", "amp4email", "data-ampdevmode");
+
+    /** List identifiers for ACTIONS format. */
+    public static final List ACTIONS_IDENTIFIERS = Arrays.asList("⚡", "amp", "actions", "data-ampdevmode");
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/UrlUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/UrlUtils.java
new file mode 100644
index 0000000000000..e764ee0e50957
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/UrlUtils.java
@@ -0,0 +1,66 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import javax.annotation.Nonnull;
+import java.net.MalformedURLException;
+import java.net.URL;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+
+/**
+ * Functions to extract information from urls.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class UrlUtils {
+  /**
+   * private constructor
+   */
+  private UrlUtils() {
+  }
+
+  /**
+   * Returns true iff the passed in URL is a data: protocol URL.
+   *
+   * @param urlStr the url to check
+   * @return true iff URL is a data: protocol
+   */
+  public static boolean isDataUrl(@Nonnull final String urlStr) {
+    final Matcher match = PROTOCOL.matcher(urlStr);
+    String protocol;
+    if (match.matches()) {
+      protocol = match.group(1);
+      protocol = protocol.toLowerCase().trim();
+      return protocol.equals("data");
+    }
+    return false;
+  }
+
+  /**
+   * A pattern to extract protocol from url.
+   */
+  private static final Pattern PROTOCOL = Pattern.compile("^([^:\\/?#.]+):.*$");
+
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/ValidationErrorUtils.java b/validator/java/src/main/java/dev/amp/validator/utils/ValidationErrorUtils.java
new file mode 100644
index 0000000000000..85c14eeb7c01b
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/ValidationErrorUtils.java
@@ -0,0 +1,87 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import org.xml.sax.Locator;
+
+import javax.annotation.Nonnull;
+import java.util.List;
+
+/**
+ * Validation error utility methods.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public final class ValidationErrorUtils {
+    /**
+     * A private constructor.
+     */
+    private ValidationErrorUtils() {
+    }
+
+    /**
+     * Construct a ValidationError object from the given argument list.
+     *
+     * @param severity the severity.
+     * @param validationErrorCode Error code.
+     * @param lineCol a line / column pair.
+     * @param params the list of params.
+     * @param specUrl a link (URL) to the amphtml spec.
+     * @return returns the ValidationError instance.
+     */
+    public static ValidatorProtos.ValidationError populateError(
+            @Nonnull final ValidatorProtos.ValidationError.Severity severity,
+            @Nonnull final  ValidatorProtos.ValidationError.Code validationErrorCode,
+            @Nonnull final Locator lineCol, @Nonnull final List<String> params, @Nonnull final String specUrl) {
+        return populateError(severity, validationErrorCode,
+                lineCol.getLineNumber(), lineCol.getColumnNumber(), params, specUrl);
+    }
+
+    /**
+     * Construct a ValidationError object from the given argument list.
+     *
+     * @param severity the severity.
+     * @param validationErrorCode Error code.
+     * @param line a line number.
+     * @param column a column number.
+     * @param params the list of params.
+     * @param specUrl a link (URL) to the amphtml spec.
+     * @return returns the ValidationError instance.
+     */
+    public static ValidatorProtos.ValidationError populateError(
+            @Nonnull final ValidatorProtos.ValidationError.Severity severity,
+            @Nonnull final  ValidatorProtos.ValidationError.Code validationErrorCode,
+            final int line, final int column, @Nonnull final List<String> params,
+            @Nonnull final String specUrl) {
+        final ValidatorProtos.ValidationError.Builder error = ValidatorProtos.ValidationError.newBuilder();
+        error.setSeverity(severity);
+        error.setCode(validationErrorCode);
+        error.addAllParams(params);
+        error.setLine(line);
+        error.setCol(column);
+        error.setSpecUrl(specUrl == null ? "" : specUrl);
+        return error.build();
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/utils/package-info.java b/validator/java/src/main/java/dev/amp/validator/utils/package-info.java
new file mode 100644
index 0000000000000..46fb1fd1c3d86
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/utils/package-info.java
@@ -0,0 +1,25 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+/**
+ * AMP validator.
+ */
+package dev.amp.validator.utils;
\ No newline at end of file
diff --git a/validator/java/src/main/java/dev/amp/validator/visitor/Amp4AdsVisitor.java b/validator/java/src/main/java/dev/amp/validator/visitor/Amp4AdsVisitor.java
new file mode 100644
index 0000000000000..17e913d44b00d
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/visitor/Amp4AdsVisitor.java
@@ -0,0 +1,201 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.visitor;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.css.AtRule;
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.TokenType;
+import dev.amp.validator.css.Declaration;
+import dev.amp.validator.css.QualifiedRule;
+
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+import static dev.amp.validator.css.CssTokenUtil.copyPosTo;
+import static dev.amp.validator.css.CssTokenUtil.getTokenType;
+import static dev.amp.validator.utils.CssSpecUtils.stripVendorPrefix;
+
+/**
+ * A visitor class extension to handle amp4ads validation of css tokens.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class Amp4AdsVisitor implements RuleVisitor {
+    /**
+     * Constructor.
+     *
+     * @param errors to populate upon error encountered
+     */
+    public Amp4AdsVisitor(@Nonnull final List<ErrorToken> errors) {
+        super();
+        this.errors = errors;
+        this.inKeyframes = null;
+    }
+
+    /**
+     * Visit a declaration.
+     *
+     * @param declaration to populate upon error encountered
+     * @throws CssValidationException Css Validation Exception
+     */
+    public void visitDeclaration(@Nonnull final Declaration declaration) throws CssValidationException {
+        // position:fixed and position:sticky are disallowed.
+        if (declaration.getName().equals("position")) {
+            return;
+        }
+
+        final String ident = firstIdent(declaration.getValue());
+        if (ident.equals("fixed") || ident.equals("sticky")) {
+            List<String> params = new ArrayList<>();
+            params.add("style");
+            params.add("position");
+            params.add(ident);
+            this.errors.add(createParseErrorTokenAt(
+                    declaration,
+                    ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE,
+                    params));
+        }
+    }
+
+    /**
+     * Visit a qualified rule.
+     *
+     * @param qualifiedRule to validate
+     * @throws CssValidationException Css Validation Exception
+     */
+    @Override
+    public void visitQualifiedRule(@Nonnull final QualifiedRule qualifiedRule) throws CssValidationException {
+        for (final Declaration decl : qualifiedRule.getDeclarations()) {
+            final String name = stripVendorPrefix(decl.getName());
+            // The name of the property may identify a transition. The only
+            // properties that may be transitioned are opacity and transform.
+            if (name.equals("transition")) {
+                final String transitionedProperty = firstIdent(decl.getValue());
+                final String transitionedPropertyStripped = stripVendorPrefix(transitionedProperty);
+                if (!transitionedPropertyStripped.equals("opacity")
+                        && !transitionedPropertyStripped.equals("transform")) {
+                    final List<String> params = new ArrayList<>();
+                    params.add("style");
+                    params.add("transition");
+                    params.add(transitionedProperty);
+                    params.add("[\'opacity\', \'transform\']");
+                    this.errors.add(createParseErrorTokenAt(
+                            decl,
+                            ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE_WITH_HINT,
+                            params));
+                }
+            }
+            // This is the @keyframes variant for identifying transitions;
+            // the only properties that may be specified within a transition
+            // are opacity, transform, and animation-timing-function.
+            if (this.inKeyframes != null && !name.equals("transform")
+                    && !name.equals("opacity") && !name.equals("animation-timing-function")) {
+                List<String> params = new ArrayList<>();
+                params.add("style");
+                params.add(decl.getName());
+                params.add(this.inKeyframes.getName());
+                params.add("[\'animation-timing-function\', \'opacity\', \'transform\']");
+
+                this.errors.add(createParseErrorTokenAt(
+                        decl,
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_PROPERTY_DISALLOWED_WITHIN_AT_RULE,
+                        params));
+            }
+        }
+    }
+
+    /**
+     * Visit a rule.
+     *
+     * @param atRule to process
+     */
+    @Override
+    public void visitAtRule(@Nonnull final AtRule atRule) {
+        if (stripVendorPrefix(atRule.getName()).equals("keyframes")) {
+            this.inKeyframes = atRule;
+        } else {
+            this.inKeyframes = null;
+        }
+    }
+
+    /**
+     * Leave an atRule.
+     *
+     * @param atRule unnecessary, must exist in method pattern
+     */
+    @Override
+    public void leaveAtRule(@Nonnull final AtRule atRule) {
+        this.inKeyframes = null;
+    }
+
+    /**
+     * For a list of |tokens|, if the first non-whitespace token is an identifier,
+     * returns its string value. Otherwise, returns the empty string.
+     *
+     * @param tokens
+     * @return a string value.
+     */
+    private static String firstIdent(@Nonnull final List<Token> tokens) {
+        if (tokens.size() == 0) {
+            return "";
+        }
+        if (getTokenType(tokens.get(0)) == TokenType.IDENT) {
+            return (String) (tokens.get(0)).getValue();
+        }
+        if (tokens.size() >= 2
+                && (getTokenType(tokens.get(0)) == TokenType.WHITESPACE)
+                && getTokenType(tokens.get(1)) == TokenType.IDENT) {
+            return (String) (tokens.get(1)).getValue();
+        }
+        return "";
+    }
+
+    /**
+     * Fills an ErrorToken with the provided position, code, and params.
+     *
+     * @param positionToken token generating an error
+     * @param code          the code to populate error with
+     * @param params        the error params to report
+     * @return the error list
+     * @throws CssValidationException Css Validation Exception
+     */
+    public static ErrorToken createParseErrorTokenAt(@Nonnull final Token positionToken,
+                                                     @Nonnull final ValidatorProtos.ValidationError.Code code,
+                                                     @Nonnull final List<String> params) throws CssValidationException {
+        ErrorToken token = new ErrorToken(code, params);
+        copyPosTo(positionToken, token);
+        return token;
+    }
+
+    @Nonnull
+    private final List<ErrorToken> errors;
+
+    @Nonnull
+    private AtRule inKeyframes;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/visitor/InvalidRuleVisitor.java b/validator/java/src/main/java/dev/amp/validator/visitor/InvalidRuleVisitor.java
new file mode 100644
index 0000000000000..1ffab1fefaade
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/visitor/InvalidRuleVisitor.java
@@ -0,0 +1,163 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.visitor;
+
+import dev.amp.validator.ValidatorProtos;
+import dev.amp.validator.css.AtRule;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.Declaration;
+import dev.amp.validator.Context;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+import static dev.amp.validator.utils.CssSpecUtils.allowedDeclarationsString;
+import static dev.amp.validator.utils.CssSpecUtils.isDeclarationValid;
+import static dev.amp.validator.utils.TagSpecUtils.getTagSpecName;
+import static dev.amp.validator.utils.CssSpecUtils.stripVendorPrefix;
+
+/**
+ * Extension of RuleVisitor used to handle an invalid css rule.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class InvalidRuleVisitor implements RuleVisitor {
+    /**
+     * Initialize an InvalidRuleVisitor.
+     *
+     * @param tagSpec to validate against.
+     * @param cssSpec to validate against.
+     * @param context provides global information related to html validation.
+     * @param result  the validation result to populate.
+     */
+    public InvalidRuleVisitor(@Nonnull final ValidatorProtos.TagSpec tagSpec, @Nonnull final ValidatorProtos.CssSpec cssSpec,
+                              @Nonnull final Context context,
+                              @Nonnull final ValidatorProtos.ValidationResult.Builder result) {
+        super();
+        this.tagSpec = tagSpec;
+        this.cssSpec = cssSpec;
+        this.context = context;
+        this.result = result;
+    }
+
+    /**
+     * Visit an atRule
+     *
+     * @param atRule to visit
+     */
+    @Override
+    public void visitAtRule(@Nonnull final AtRule atRule) throws CssValidationException {
+        if (!isAtRuleValid(this.cssSpec, atRule.getName())) {
+            List<String> params = new ArrayList<>();
+            params.add(getTagSpecName(this.tagSpec));
+            params.add(atRule.getName());
+            this.context.addError(
+                    ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_AT_RULE,
+                    context.getLineCol().getLineNumber() + atRule.getLine(),
+                    context.getLineCol().getColumnNumber() + atRule.getCol(),
+                    params,
+                    "",
+                    this.result);
+        }
+    }
+
+    /**
+     * Returns true if the given AT rule is considered valid.
+     *
+     * @param cssSpec    to validate against
+     * @param atRuleName the rule to validate
+     * @return true iff rule is valid
+     * @throws CssValidationException Css Validation Exception
+     */
+    public boolean isAtRuleValid(@Nonnull final ValidatorProtos.CssSpec cssSpec,
+                                 @Nonnull final String atRuleName) throws CssValidationException {
+        String defaultType = "";
+
+        for (final ValidatorProtos.AtRuleSpec atRuleSpec : cssSpec.getAtRuleSpecList()) {
+            if (atRuleSpec.getName().equals("$DEFAULT")) {
+                defaultType = atRuleSpec.getType().toString();
+            } else if (atRuleSpec.getName().equals(stripVendorPrefix(atRuleName))) {
+                return atRuleSpec.getType() != ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR;
+            }
+        }
+
+        if (defaultType.equals("")) {
+            throw new CssValidationException("Default type not defined");
+        }
+        return !defaultType.equals(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR.toString());
+    }
+
+    /**
+     * Touches a Declaration
+     *
+     * @param declaration to visit
+     */
+    @Override
+    public void visitDeclaration(@Nonnull final Declaration declaration) {
+        if (!isDeclarationValid(this.cssSpec, declaration.getName())) {
+            final String declarationsStr = allowedDeclarationsString(this.cssSpec);
+            if (declarationsStr.equals("")) {
+                List<String> params = new ArrayList<>();
+                params.add(getTagSpecName(this.tagSpec));
+                params.add(declaration.getName());
+
+                this.context.addError(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_PROPERTY_NOLIST,
+                        context.getLineCol().getLineNumber() + declaration.getLine(),
+                        context.getLineCol().getColumnNumber() + declaration.getCol(),
+                        params,
+                        "",
+                        this.result);
+
+            } else {
+                List<String> params = new ArrayList<>();
+                params.add(getTagSpecName(this.tagSpec));
+                params.add(declaration.getName());
+                params.add(declaration.getName());
+                allowedDeclarationsString(this.cssSpec);
+
+                this.context.addError(
+                        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_PROPERTY,
+                        context.getLineCol().getLineNumber() + declaration.getLine(),
+                        context.getLineCol().getColumnNumber() + declaration.getCol(),
+                        params,
+                        "",
+                        this.result);
+            }
+        }
+    }
+
+    /** Tag spec. */
+    private final ValidatorProtos.TagSpec tagSpec;
+
+    /** Css spec. */
+    private final ValidatorProtos.CssSpec cssSpec;
+
+    /** Context. */
+    private final Context context;
+
+    /** Result builder. */
+    private final ValidatorProtos.ValidationResult.Builder result;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/visitor/KeyframesVisitor.java b/validator/java/src/main/java/dev/amp/validator/visitor/KeyframesVisitor.java
new file mode 100644
index 0000000000000..2cd11a26343c4
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/visitor/KeyframesVisitor.java
@@ -0,0 +1,146 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.visitor;
+
+import dev.amp.validator.ValidatorProtos;
+import dev.amp.validator.css.CssTokenUtil;
+import dev.amp.validator.css.QualifiedRule;
+import dev.amp.validator.css.Token;
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.css.AtRule;
+import dev.amp.validator.css.CssValidationException;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * A visitor for keyframes at rule.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class KeyframesVisitor implements RuleVisitor {
+    /**
+     * Constructor.
+     *
+     * @param errors the errors collection to populate
+     */
+    public KeyframesVisitor(@Nonnull final List<ErrorToken> errors) {
+        super();
+        this.errors = errors;
+        this.parentIsKeyframesAtRule = false;
+    }
+
+    /**
+     * visit a qualified rule
+     *
+     * @param qualifiedRule to visit
+     * @throws CssValidationException Css Validation Error
+     */
+    @Override
+    public void visitQualifiedRule(@Nonnull final QualifiedRule qualifiedRule) throws CssValidationException {
+        if (!this.parentIsKeyframesAtRule) {
+            List<String> params = new ArrayList<>();
+            params.add("style");
+            params.add(qualifiedRule.ruleName());
+            this.errors.add(createErrorTokenAt(
+                    qualifiedRule,
+                    ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_QUALIFIED_RULE_MUST_BE_INSIDE_KEYFRAME,
+                    params));
+            return;
+        }
+        if (qualifiedRule.getDeclarations().size() > 0) {
+            return;
+        }
+        List<String> params = new ArrayList<>();
+        params.add("style");
+        params.add(qualifiedRule.ruleName());
+        this.errors.add(createErrorTokenAt(
+                qualifiedRule,
+                ValidatorProtos.ValidationError.Code.CSS_SYNTAX_QUALIFIED_RULE_HAS_NO_DECLARATIONS,
+                params));
+    }
+
+
+    /**
+     * Fills an ErrorToken with the provided position, code, and params.
+     *
+     * @param positionToken generating error
+     * @param code          the code generated by the error
+     * @param params        the error params
+     * @return an ErrorToken positioned at positionToken location
+     * @throws CssValidationException Css Validation Error
+     */
+    public static ErrorToken createErrorTokenAt(@Nonnull final Token positionToken,
+                                                @Nonnull final ValidatorProtos.ValidationError.Code code,
+                                                @Nonnull final List<String> params) throws CssValidationException {
+        ErrorToken token = new ErrorToken(code, params);
+        CssTokenUtil.copyPosTo(positionToken, token);
+        return token;
+    }
+
+    /**
+     * Visit an atRule.
+     *x
+     * @param atRule to visit
+     * @throws CssValidationException Css Validation Error
+     */
+    @Override
+    public void visitAtRule(@Nonnull final AtRule atRule) throws CssValidationException {
+        switch (atRule.getName()) {
+            case "keyframes":
+            case "-moz-keyframes":
+            case "-o-keyframes":
+            case "-webkit-keyframes":
+                if (this.parentIsKeyframesAtRule) {
+                    List<String> params = new ArrayList<>();
+                    params.add("style");
+                    this.errors.add(createErrorTokenAt(
+                            atRule,
+                            ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_KEYFRAME_INSIDE_KEYFRAME,
+                            params));
+                }
+                this.parentIsKeyframesAtRule = true;
+                return;
+            default:
+        }
+    }
+
+    /**
+     * Leave an atRule.
+     *
+     * @param atRule currently visiting
+     */
+    @Override
+    public void leaveAtRule(@Nonnull final AtRule atRule) {
+        this.parentIsKeyframesAtRule = false;
+    }
+
+    /** List of token errors. */
+    @Nonnull
+    private final List<ErrorToken> errors;
+
+    /** Flag to indicate whether if the parent is key frame at rule. */
+    private boolean parentIsKeyframesAtRule;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/visitor/MediaQueryVisitor.java b/validator/java/src/main/java/dev/amp/validator/visitor/MediaQueryVisitor.java
new file mode 100644
index 0000000000000..4bf5552b3dd5e
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/visitor/MediaQueryVisitor.java
@@ -0,0 +1,285 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.visitor;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.css.AtRule;
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.TokenStream;
+import dev.amp.validator.css.TokenType;
+import dev.amp.validator.css.Stylesheet;
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+import static dev.amp.validator.css.CssTokenUtil.copyPosTo;
+import static dev.amp.validator.css.CssTokenUtil.getTokenType;
+import static dev.amp.validator.utils.CssSpecUtils.asciiMatch;
+
+/**
+ * A Vistor class to touch media queries.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class MediaQueryVisitor implements RuleVisitor {
+    /**
+     * Constructor for media query visitor
+     * @param mediaTypes the types to validate
+     * @param mediaFeatures the features to validate
+     * @param errors to populate as media query is visited
+     */
+    public MediaQueryVisitor(@Nonnull final List<Token> mediaTypes, @Nonnull final List<Token> mediaFeatures,
+                             @Nonnull final List<ErrorToken> errors) {
+        super();
+        this.mediaTypes = mediaTypes;
+        this.mediaFeatures = mediaFeatures;
+        this.errors = errors;
+    }
+
+    /**
+     * Visit an AtRule.
+     * @param atRule to visit
+     */
+    @Override
+    public void visitAtRule(@Nonnull final AtRule atRule) throws CssValidationException {
+        if (!atRule.getName().toLowerCase().equals("media")) {
+            return;
+        }
+
+        final TokenStream tokenStream = new TokenStream(atRule.getPrelude());
+        tokenStream.consume(); // Advance to first token.
+        if (!this.parseAMediaQueryList(tokenStream)) {
+            final List<String> params = new ArrayList<>();
+            params.add("style");
+            this.errors.add((ErrorToken) copyPosTo(atRule,
+                    new ErrorToken(ValidatorProtos.ValidationError.Code.CSS_SYNTAX_MALFORMED_MEDIA_QUERY,
+                    params)));
+        }
+    }
+
+    /**
+     * Maybe consume one whitespace token.
+     *
+     * @param tokenStream to consume from
+     */
+    private void maybeConsumeAWhitespaceToken(@Nonnull final TokenStream tokenStream) {
+        // While the grammar calls for consuming multiple whitespace tokens,
+        // our tokenizer already collapses whitespace so only one token can ever
+        // be present.
+        if (getTokenType(tokenStream.current()) == TokenType.WHITESPACE) {
+            tokenStream.consume();
+        }
+    }
+
+    /**
+     * Parse a media query list.
+     *
+     * @param tokenStream content to validate
+     * @return success of parse job
+     * @private
+     */
+    private boolean parseAMediaQueryList(@Nonnull final TokenStream tokenStream) {
+        // https://www.w3.org/TR/css3-mediaqueries/#syntax
+        // : S* [media_query [ ',' S* media_query ]* ]?
+        // ;
+        this.maybeConsumeAWhitespaceToken(tokenStream);
+        if (getTokenType(tokenStream.current()) != TokenType.EOF_TOKEN) {
+            if (!this.parseAMediaQuery(tokenStream)) {
+                return false;
+            }
+            while (getTokenType(tokenStream.current()) == TokenType.COMMA) {
+                tokenStream.consume(); // ','
+                this.maybeConsumeAWhitespaceToken(tokenStream);
+                if (!this.parseAMediaQuery(tokenStream)) {
+                    return false;
+                }
+            }
+        }
+        return getTokenType(tokenStream.current()) == TokenType.EOF_TOKEN;
+    }
+
+    /**
+     * Parse a media query.
+     *
+     * @param tokenStream content to parse
+     * @return true iff parse job is successful
+     */
+    private boolean parseAMediaQuery(@Nonnull final TokenStream tokenStream) {
+        // : [ONLY | NOT]? S* media_type S* [ AND S* expression ]*
+        // | expression [ AND S* expression ]*
+        // ;
+        //
+        // Below we parse media queries with this equivalent grammar:
+        // : (expression | [ONLY | NOT]? S* media_type S* )
+        // [ AND S* expression ]*
+        // ;
+        //
+        // This is more convenient because we know that expressions must start with
+        // '(', so it's simpler to use as a check to distinguis the expression case
+        // from the media type case.
+        if (getTokenType(tokenStream.current()) == TokenType.OPEN_PAREN) {
+            if (!this.parseAMediaExpression(tokenStream)) {
+                return false;
+            }
+        } else {
+            if (getTokenType(tokenStream.current()) == TokenType.IDENT
+                    && (asciiMatch((tokenStream.current()), ("only"))
+                    || asciiMatch((tokenStream.current()), ("not")))) {
+                tokenStream.consume(); // 'ONLY' | 'NOT'
+            }
+            this.maybeConsumeAWhitespaceToken(tokenStream);
+            if (!this.parseAMediaType(tokenStream)) {
+                return false;
+            }
+            this.maybeConsumeAWhitespaceToken(tokenStream);
+        }
+        while (getTokenType(tokenStream.current()) == TokenType.IDENT
+                && asciiMatch((tokenStream.current()), ("and"))) {
+            tokenStream.consume(); // 'AND'
+            this.maybeConsumeAWhitespaceToken(tokenStream);
+            if (!this.parseAMediaExpression(tokenStream)) {
+                return false;
+            }
+        }
+        return true;
+    }
+
+    /**
+     * Parse a media expression.
+     *
+     * @param tokenStream content to parse
+     * @return true iff parse is successful
+     */
+    private boolean parseAMediaExpression(@Nonnull final TokenStream tokenStream) {
+        //  : '(' S* media_feature S* [ ':' S* expr ]? ')' S*
+        //  ;
+        if (getTokenType(tokenStream.current()) != TokenType.OPEN_PAREN) {
+            return false;
+        }
+        tokenStream.consume(); // '('
+        this.maybeConsumeAWhitespaceToken(tokenStream);
+        if (!this.parseAMediaFeature(tokenStream)) {
+            return false;
+        }
+        this.maybeConsumeAWhitespaceToken(tokenStream);
+        if (getTokenType(tokenStream.current()) == TokenType.COLON) {
+            tokenStream.consume(); // '('
+            this.maybeConsumeAWhitespaceToken(tokenStream);
+            // The CSS3 grammar at this point just tells us to expect some
+            // expr. Which tokens are accepted here are defined by the media
+            // feature found above. We don't implement media features here, so
+            // we just loop over tokens until we find a CLOSE_PAREN or EOF.
+            // While expr in general may have arbitrary sets of open/close parens,
+            // it seems that https://www.w3.org/TR/css3-mediaqueries/#media1
+            // suggests that media features cannot:
+            //
+            // "Media features only accept single values: one keyword, one number,
+            // or a number with a unit identifier. (The only exceptions are the
+            // ‘aspect-ratio’ and ‘device-aspect-ratio’ media features.)
+            while (
+                    getTokenType(tokenStream.current()) != TokenType.EOF_TOKEN
+                            && getTokenType(tokenStream.current()) != TokenType.CLOSE_PAREN) {
+                tokenStream.consume();
+            }
+        }
+        if (getTokenType(tokenStream.current()) != TokenType.CLOSE_PAREN) {
+            return false;
+        }
+        tokenStream.consume(); // ')'
+        this.maybeConsumeAWhitespaceToken(tokenStream);
+        return true;
+    }
+
+    /**
+     * Parse a media feature.
+     *
+     * @param tokenStream
+     * @return true iff feature parsing is successful
+     */
+    private boolean parseAMediaFeature(@Nonnull final TokenStream tokenStream) {
+        // : IDENT
+        // ;
+        if (getTokenType(tokenStream.current()) == TokenType.IDENT) {
+            this.mediaFeatures.add(
+                    /** @type {!parse_css.IdentToken} */(tokenStream.current()));
+            tokenStream.consume();
+            return true;
+        }
+        return false;
+    }
+
+    /**
+     * Parse a media type.
+     *
+     * @param tokenStream
+     * @return true iff media type successfully parsed
+     */
+    private boolean parseAMediaType(@Nonnull final TokenStream tokenStream) {
+        // : IDENT
+        // ;
+        if (getTokenType(tokenStream.current()) == TokenType.IDENT) {
+            this.mediaTypes.add(
+                    /** @type {!parse_css.IdentToken} */(tokenStream.current()));
+            tokenStream.consume();
+            return true;
+        }
+        return false;
+    }
+
+
+    /**
+     * Parses media queries within the provided stylesheet, emitting the set of
+     * discovered media types and media features, as well as errors if parsing
+     * failed.
+     * parsedUrls and errors into errors.
+     *
+     * @param stylesheet to parse
+     * @param mediaTypes found in stylesheet
+     * @param mediaFeatures found in stylesheet
+     * @param errors discovered during parse
+     * @throws CssValidationException css validation exception
+     */
+    public static void parseMediaQueries(@Nonnull final Stylesheet stylesheet, @Nonnull final List<Token> mediaTypes,
+                                         @Nonnull final List<Token> mediaFeatures,
+                                         @Nonnull final List<ErrorToken> errors) throws CssValidationException {
+        MediaQueryVisitor visitor = new MediaQueryVisitor(mediaTypes, mediaFeatures, errors);
+        stylesheet.accept(visitor);
+    }
+
+    /** List of media types. */
+    @Nonnull
+    private final List<Token> mediaTypes;
+
+    /** List of media features. */
+    @Nonnull
+    private final List<Token> mediaFeatures;
+
+    /** List of token errors. */
+    @Nonnull
+    private final List<ErrorToken> errors;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/visitor/RuleVisitor.java b/validator/java/src/main/java/dev/amp/validator/visitor/RuleVisitor.java
new file mode 100644
index 0000000000000..80e29485eeded
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/visitor/RuleVisitor.java
@@ -0,0 +1,98 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.visitor;
+
+import dev.amp.validator.css.AtRule;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.Stylesheet;
+import dev.amp.validator.css.Declaration;
+import dev.amp.validator.css.QualifiedRule;
+
+import javax.annotation.Nonnull;
+
+/**
+ * A visitor model implementation for rules to implement.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public interface RuleVisitor {
+    /**
+     * Visit a Stylesheet.
+     * @param stylesheet to visit
+     */
+    default void visitStylesheet(@Nonnull Stylesheet stylesheet) {
+    }
+
+    /**
+     * Leave a Stylesheet.
+     * @param stylesheet to leave
+     */
+    default void leaveStylesheet(@Nonnull Stylesheet stylesheet) {
+    }
+
+    /**
+     * Visit an AtRule.
+     * @param atRule to visit
+     * @throws CssValidationException Css Validation Exception
+     */
+    default void visitAtRule(@Nonnull AtRule atRule) throws CssValidationException {
+    }
+
+    /**
+     * Leave an AtRule.
+     * @param atRule to leave
+     */
+    default void leaveAtRule(@Nonnull AtRule atRule) {
+    }
+
+    /**
+     * Visit a QualifiedRule.
+     * @param qualifiedRule to visit
+     * @throws CssValidationException Css Validation Exception
+     */
+    default void visitQualifiedRule(@Nonnull QualifiedRule qualifiedRule) throws CssValidationException {
+    }
+
+    /**
+     * Leave a qualified rule.
+     * @param qualifiedRule to leave
+     */
+    default void leaveQualifiedRule(@Nonnull QualifiedRule qualifiedRule) {
+    }
+
+    /**
+     * Visit a declaration.
+     * @param declaration to visit
+     * @throws CssValidationException Css Validation Exception
+     */
+    default void visitDeclaration(@Nonnull Declaration declaration) throws CssValidationException {
+    }
+
+    /**
+     * Leave a declaration.
+     * @param declaration to leave
+     */
+    default void leaveDeclaration(@Nonnull Declaration declaration) {
+    }
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/visitor/UrlFunctionVisitor.java b/validator/java/src/main/java/dev/amp/validator/visitor/UrlFunctionVisitor.java
new file mode 100644
index 0000000000000..684fb8aaa483b
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/visitor/UrlFunctionVisitor.java
@@ -0,0 +1,128 @@
+package dev.amp.validator.visitor;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.css.AtRule;
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.TokenType;
+import dev.amp.validator.css.Declaration;
+import dev.amp.validator.css.ParsedCssUrl;
+import dev.amp.validator.css.QualifiedRule;
+
+
+import javax.annotation.Nonnull;
+import java.util.ArrayList;
+import java.util.List;
+
+import static dev.amp.validator.css.CssTokenUtil.copyPosTo;
+import static dev.amp.validator.css.CssTokenUtil.getTokenType;
+import static dev.amp.validator.utils.CssSpecUtils.parseUrlFunction;
+import static dev.amp.validator.utils.CssSpecUtils.parseUrlToken;
+
+/**
+ * Helper class for implementing extractUrls.
+ *
+ * @author nhant01
+ * @author GeorgeLuo
+ */
+
+public class UrlFunctionVisitor implements RuleVisitor {
+    /**
+     * @param parsedUrls a list of urls found in css parse
+     * @param errors     to populate with css validation errors
+     */
+    public UrlFunctionVisitor(@Nonnull final List<ParsedCssUrl> parsedUrls, @Nonnull final List<ErrorToken> errors) {
+        super();
+
+        this.parsedUrls = parsedUrls;
+        this.errors = errors;
+        this.atRuleScope = "";
+    }
+
+    /**
+     * Visit an AtRule.
+     *
+     * @param atRule to visit
+     */
+    @Override
+    public void visitAtRule(@Nonnull final AtRule atRule) {
+        this.atRuleScope = atRule.getName();
+    }
+
+    /**
+     * Leave an AtRule.
+     *
+     * @param atRule AtRule to leave
+     */
+    @Override
+    public void leaveAtRule(@Nonnull final AtRule atRule) {
+        this.atRuleScope = "";
+    }
+
+    /**
+     * Visit a qualified rule.
+     *
+     * @param qualifiedRule to visit
+     */
+    @Override
+    public void visitQualifiedRule(@Nonnull final QualifiedRule qualifiedRule) {
+        this.atRuleScope = "";
+    }
+
+    /**
+     * Visit a declaration rule.
+     *
+     * @param declaration to visit
+     * @throws CssValidationException Css Validation Exception
+     */
+    public void visitDeclaration(@Nonnull final Declaration declaration) throws CssValidationException {
+        if (declaration.getValue().size() <= 0) {
+            throw new CssValidationException("Invalid declaration size");
+        }
+
+        if (getTokenType(declaration.getValue().get(declaration.getValue().size() - 1)) != TokenType.EOF_TOKEN) {
+            throw new CssValidationException("Last Token is not EOF");
+        }
+
+        for (int ii = 0; ii < declaration.getValue().size() - 1;) {
+            Token token = declaration.getValue().get(ii);
+            if (getTokenType(token) == TokenType.URL) {
+                final ParsedCssUrl parsedUrl = new ParsedCssUrl();
+                parseUrlToken(declaration.getValue(), ii, parsedUrl);
+                parsedUrl.setAtRuleScope(this.atRuleScope);
+                this.parsedUrls.add(parsedUrl);
+                ii++;
+                continue;
+            }
+            if (getTokenType(token) == TokenType.FUNCTION_TOKEN && (token).toString().equals("url(")) {
+                final ParsedCssUrl parsedUrl = new ParsedCssUrl();
+                ii = parseUrlFunction(declaration.getValue(), ii, parsedUrl);
+                if (ii == -1) {
+                    List<String> params = new ArrayList<>();
+                    params.add("style");
+                    this.errors.add((ErrorToken) copyPosTo(token, new ErrorToken(
+                            ValidatorProtos.ValidationError.Code.CSS_SYNTAX_BAD_URL, params)));
+                    return;
+                }
+                parsedUrl.setAtRuleScope(this.atRuleScope);
+                this.parsedUrls.add(parsedUrl);
+                continue;
+            }
+            // It's neither a url token nor a function token named url. So, we skip.
+            ii++;
+        }
+    }
+
+    /** AT rule scope. */
+    @Nonnull
+    private String atRuleScope;
+
+    /** List of error token. */
+    @Nonnull
+    private final List<ErrorToken> errors;
+
+    /** List of parsed css urls. */
+    @Nonnull
+    private final List<ParsedCssUrl> parsedUrls;
+}
diff --git a/validator/java/src/main/java/dev/amp/validator/visitor/package-info.java b/validator/java/src/main/java/dev/amp/validator/visitor/package-info.java
new file mode 100644
index 0000000000000..f8ba6511eb9d8
--- /dev/null
+++ b/validator/java/src/main/java/dev/amp/validator/visitor/package-info.java
@@ -0,0 +1,25 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+/**
+ * AMP validator exception package.
+ */
+package dev.amp.validator.visitor;
\ No newline at end of file
diff --git a/validator/java/src/main/proto/validator.proto b/validator/java/src/main/proto/validator.proto
new file mode 100644
index 0000000000000..e5298fab5ce2e
--- /dev/null
+++ b/validator/java/src/main/proto/validator.proto
@@ -0,0 +1,929 @@
+//
+// Copyright 2015 The AMP HTML Authors. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS-IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the license.
+//
+syntax = "proto2";
+
+package amp.validator;
+
+option java_package = "dev.amp.validator";
+option java_outer_classname = "ValidatorProtos";
+
+// Used for validating attributes that require another attribute for some
+// given set of conditions.
+// E.g. attr name: "on" if_value_regex: "tap:.*" also_require_attr: "role"
+message AttrTriggerSpec {
+  // If set, attribute's value must match to also require attribute(s).
+  // If not set, attribute automatically also require attribute(s).
+  optional string if_value_regex = 1;  // case sensitive
+
+  // If set, other attributes - identified by their name string - must
+  // be present as well.
+  repeated string also_requires_attr = 2;
+}
+
+// Used for validating properties in attribute values. Our validator
+// (via parse-viewport.h) implements the parsing algorithm as described here:
+// https://drafts.csswg.org/css-device-adapt/#parsing-algorithm
+message PropertySpec {
+  // Must be lowercase, and will be matched case-insensitively.
+  optional string name = 1;
+  optional bool mandatory = 2;
+
+  // This would be a oneof, but this file only uses features in protobuf 2.5.0.
+  // begin oneof {
+
+  // Must be lowercase, and will be matched case-insensitively.
+  optional string value = 3;
+  optional double value_double = 4;
+  // } end oneof
+}
+
+message PropertySpecList {
+  repeated PropertySpec properties = 1;
+}
+
+// Used for validating urls in attribute values (such as href/src/srcset).
+message UrlSpec {
+  // protocol must be in lowercase (e.g. "javascript" not "JavaScript").
+  repeated string protocol = 1;
+  optional bool allow_relative = 2 [default = true];
+  // Whether the empty string '' is allowed for this URL value.
+  optional bool allow_empty = 3 [default = false];
+
+  // Deprecated fields, do not resuse.
+  // reserved 4;
+}
+
+// NEXT AVAILABLE TAG: 3
+message CssDeclaration {
+  // The name of the declaration (e.g. display). Use lower-case attribute names
+  // only.
+  optional string name = 1;
+  // The valid values of the declaration (e.g. block).
+  repeated string value_casei = 2;
+}
+
+// Attributes that are not covered by at least one of these specs are
+// disallowed. Within a given context (e.g., for a given TagSpec),
+// names are unique.
+// NEXT AVAILABLE TAG: 27
+message AttrSpec {
+  // If provided, the Type Identifier(s) that either enable or disable
+  // this AttrSpec. If a Type Identifier is in enabled_by then this
+  // AttrSpec will be used in validating parsed documents with that Type
+  // Identifier. If a Type Identifier is in disabled_by then this
+  // AttrSpec will not be used in validating parsed documents with that
+  // Type Identifier. An AttrSpec can not have both enabled_by and disabled_by
+  // set.
+  repeated string enabled_by = 23;
+  repeated string disabled_by = 24;
+
+  // Use lower-case attribute names only.
+  optional string name = 1;
+  repeated string alternative_names = 2;
+  optional bool mandatory = 3;
+  // Within the context of the tag, *exactly one* of the attributes tagged
+  // with this identifier must be present. Per convention, this identifier
+  // should list the tags participating in the mandatory oneof:
+  // e.g. mandatory_oneof: "['foo', 'bar']"
+  optional string mandatory_oneof = 12;
+  // Within the context of the tag, *at least one* of the attributes tagged
+  // with this identifier must be present. Per convention, this identifier
+  // should list the tags participating in the mandatory oneof:
+  // e.g. mandatory_oneof: "['foo', 'bar']"
+  optional string mandatory_anyof = 21;
+
+  // This would be a oneof, but this file only uses features in protobuf 2.5.0.
+  // begin oneof {
+
+  // If none of these are set, any value is accepted unless
+  // blacklisted_value_regex is set. Note that prior to comparing, the
+  // attributes in a given HTML document will be unescaped.
+
+  // The attribute value must be equal to the value in this field.
+  repeated string value = 4;              // case sensitive
+  repeated string value_casei = 18;       // case insensitive
+  optional string value_regex = 15;       // case sensitive
+  optional string value_regex_casei = 5;  // case insensitive
+  optional UrlSpec value_url = 14;
+  // validates against a list of properties (see PropertySpec).
+  optional PropertySpecList value_properties = 11;
+  // } end oneof
+
+  // These two fields specify that values from one AttrSpec refer to values from
+  // another AttrSpec elsewhere on the page; validator will verify the
+  // references are not "dangling". These references may appear before or after
+  // their referents.
+  //
+  // For example, in the "id" AttrSpec in the "template" TagSpec, we have:
+  //   add_value_to_set: TEMPLATE_IDS
+  // and in any "template" AttrSpec, we have:
+  //   value_oneof_set: TEMPLATE_IDS
+  enum ValueSet {
+    UNKNOWN_VALUESET = 0;  // Never used
+    TEMPLATE_IDS = 1;      // <template id> values
+    AMP_SCRIPT_IDS = 2;    // <script id> values, referenced by <amp-script>
+  }
+  optional ValueSet add_value_to_set = 25;
+  optional ValueSet value_oneof_set = 26;
+
+  optional AttrTriggerSpec trigger = 16;
+
+  // If set, then the attribute value may not match this regex, which is
+  // always applied case-insensitively and as a partial match.
+  optional string blacklisted_value_regex = 6;
+  // If set, generates a DEPRECATED_ATTR error with severity WARNING.
+  // The value of the deprecation field indicates what to use instead,
+  // e.g. the name of an attribute or tag.
+  optional string deprecation = 7;
+  // If provided, a URL which links to the AMP HTML spec for this deprecation.
+  optional string deprecation_url = 8;
+
+  // Valid CSS declarations.
+  repeated CssDeclaration css_declaration = 20;
+
+  enum DispatchKeyType {
+    // Indicates that the attribute does not form a dispatch key.
+    NONE_DISPATCH = 0;
+    // Indicates that the name of the attribute alone forms a dispatch key.
+    NAME_DISPATCH = 1;
+    // Indicates that the name + value of the attribute forms a dispatch key.
+    NAME_VALUE_DISPATCH = 2;
+    // Indicates that the name + value + mandatory parent forms a dispatch key.
+    NAME_VALUE_PARENT_DISPATCH = 3;
+  }
+  // If set true, the TagSpec containing this AttrSpec will be evaluated first
+  // for any encountered tag which matches the tag name and this attribute spec.
+  // May only be set for an AttrSpec where mandatory=true and type matches those
+  // specified in the comments of DispatchKeyType above.
+  optional DispatchKeyType dispatch_key = 13 [default = NONE_DISPATCH];
+
+  // If set to true, the TagSpec containing this AttrSpec implicitly has this
+  // attribute and the attribute is considered valid.
+  optional bool implicit = 17 [default = false];
+
+  // If set, this attr is considered part of an amp extended component, and
+  // requires that the named extended component script tag is present on the
+  // page.
+  repeated string requires_extension = 19;
+
+  // If set, this attr is invalid unless the current tag has an ancestor
+  // tag which set one or more of the required markers.
+  optional AncestorMarker requires_ancestor = 22;
+}
+
+// Some tags share several attributes, so they're identified by unique key
+// (see the attr_lists map in ValidatorRules).
+message AttrList {
+  optional string name = 1;
+  repeated AttrSpec attrs = 2;
+}
+
+// A list of allowed tags for descendants of any level (children, grandchildren,
+// great-grandchildren, etc).
+message DescendantTagList {
+  optional string name = 1;
+  repeated string tag = 2;
+}
+
+// Regex which, if matches the cdata of a tag, causes the tag validation to
+// fail.
+message BlackListedCDataRegex {
+  // Syntax is partial match, use ^ and $ if you want global match.
+  optional string regex = 1;
+  optional string error_message = 2;
+}
+
+// This spec is used when parsing a media query inside a CSS @media rule.
+message MediaQuerySpec {
+  // If issues_as_error is true, then parsing errors and invalid
+  // types / features will be treated as validator errors, otherwise warnings.
+  optional bool issues_as_error = 1 [default = false];
+  // These are the media query types and features allowed within the stylesheet.
+  // http://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries#Syntax
+  repeated string type = 2;
+  repeated string feature = 3;
+}
+
+// This spec is used by our CSS parser to determine how the contents of a given
+// AT rule should be parsed, if at all. The term 'rule' here refers to the AT
+// Rule in CSS, not a validation rule.
+message AtRuleSpec {
+  enum BlockType {
+    // Invalid, ignore contents.
+    PARSE_AS_ERROR = 0;
+    // Valid, ignore contents.
+    PARSE_AS_IGNORE = 1;
+    // Valid, parse contents (as CSS rules).
+    PARSE_AS_RULES = 2;
+    // Valid, parse contents (as CSS declarations).
+    PARSE_AS_DECLARATIONS = 3;
+  }
+  // Name of the AT rule to parse. Do not include the '@' symbol (e.g. '@media'
+  // should be encoded as 'media'. A value of '$DEFAULT' indicates the default
+  // AT rule which will match any AT rule not present in any other AtRuleSpec.
+  optional string name = 1;
+  optional BlockType type = 2 [default = PARSE_AS_ERROR];
+
+  // A MediaQuerySpec may only be set for an AtRuleSpec with the name
+  // "media". If not set, media queries will be left unparsed, so no errors or
+  // warnings about them will be reported.
+  optional MediaQuerySpec media_query_spec = 3;
+}
+
+// NEXT AVAILABLE TAG: 8
+message CssSpec {
+  // Spec for how to parse CSS AT rules, one per AT rule. Must not contain
+  // duplicate names, and must contain at least one entry for the default.
+  repeated AtRuleSpec at_rule_spec = 1;
+  // urls within the CSS are checked against this spec.
+  optional UrlSpec image_url_spec = 3;
+  optional UrlSpec font_url_spec = 4;
+
+  // Enables checks specific to the draft A4A specification.
+  // TODO(powdercloud): Make this more generic.
+  optional bool validate_amp4ads = 5;
+
+  // Enables checks specific to the style[keyframes] specification.
+  // TODO(chenshay): Make this more generic.
+  optional bool validate_keyframes = 6;
+
+  // Any declaration listed here are allowed.
+  repeated string declaration = 7;
+}
+
+// NEXT AVAILABLE TAG: 10
+message CdataSpec {
+  // If set, the cdata contents cannot be greater than this length, in bytes.
+  optional int32 max_bytes = 1 [default = -2];
+  // If false, bytes inside URLs are not included in the byte calculation for
+  // max_bytes. This is used for handling signed exchange transformations which
+  // can potentially take the number of bytes over the 50,000 byte limit due
+  // to rewriting URLs to point at an AMP Cache.
+  optional bool url_bytes_included = 9 [default = true];
+  // If provided, a URL which linking to a section / sentence in the
+  // AMP HTML spec.
+  optional string max_bytes_spec_url = 2;
+
+  // This would be a oneof, but this file only uses features in protobuf 2.5.0.
+  // begin oneof {
+
+  // If non-empty, the text between the start / end tag must match this value.
+  optional string mandatory_cdata = 3;
+  // If non-empty, the text between the start / end tag must match this regex.
+  optional string cdata_regex = 6;
+  // If at least one CssSpec is provided, this cdata field will be parsed
+  // as CSS3, and any parsing errors will become validation errors.
+  optional CssSpec css_spec = 7;
+  // If set to true, then only whitespace may be in the cdata contents.
+  // This is useful for script tags that reference extensions etc.
+  optional bool whitespace_only = 8;
+  // } end oneof
+
+  // If any of these regexes match, then this cdata spec does not validate.
+  repeated BlackListedCDataRegex blacklisted_cdata_regex = 4;
+
+  // Deprecated fields, do not reuse.
+  // reserved 5;
+}
+
+// Specifies which AMP Layouts are supported by a given element.
+// For the purpose of the validator, this specifies which
+// values for layout, height, and width attributes are allowed. Also see
+// https://github.com/ampproject/amphtml/blob/master/spec/amp-html-layout.md
+// TODO(johannes): Make the error messages around layouts better. This
+// may require revamping the documentation for elements and/or the above spec,
+// so that a user gets more clearly informed about which layouts are
+// applicable to a given tag, what happens when layout attribute or other
+// attributes are not set, etc.
+message AmpLayout {
+  enum Layout {
+    UNKNOWN = 0;
+    NODISPLAY = 1;
+    FIXED = 2;
+    FIXED_HEIGHT = 3;
+    RESPONSIVE = 4;
+    CONTAINER = 5;
+    FILL = 6;
+    FLEX_ITEM = 7;
+    FLUID = 8;
+    INTRINSIC = 9;
+  }
+  // Specifies which layouts are supported by this element.
+  repeated Layout supported_layouts = 1;
+  // Specifies whether this element has default dimensions. This corresponds
+  // to being whitelisted in naturalDimensions_ in
+  // https://github.com/ampproject/amphtml/blob/master/src/layout.js.
+  optional bool defines_default_width = 2;
+  optional bool defines_default_height = 3;
+}
+
+// An AncestorMarker is a state maintained on the stack of matching tags.
+// When a TagSpec with an AncestorMarker matches, this Marker is placed on the
+// stack until the matched html tag is popped from the stack. Other rules may be
+// triggered by the presence of a specific AncestorMarker on the stack.
+message AncestorMarker {
+  enum Marker {
+    UNKNOWN = 0;
+    // Set by <amp-sidebar> tags to allow autoscroll attributes on descendants.
+    // See https://github.com/ampproject/amphtml/pull/20524 for more context.
+    AUTOSCROLL = 1;
+  }
+  repeated Marker marker = 1;
+}
+
+// TagSpec::child_tags uses this configuration to specify which child tags
+// are expected for a specific tag.
+//
+// Matching child tags is done by tag name, while the parent is
+// matched by TagSpec. The reason for this is that matching by tag
+// spec name would produce less useful error messages, because we want
+// to be able to produce a good message even if the tag spec name
+// could not be determined because the enclosed child tag is invalid
+// (no TagSpec matches). By doing a tag name match, we can produce a
+// reasonable error regardless if a child tag was misplaced.
+message ChildTagSpec {
+  // Unless set to -1 (the default), the parent tag must have exactly
+  // |mandatory_num_child_tags| immediate child tags.
+  optional int32 mandatory_num_child_tags = 1 [default = -1];
+  // If at least one tag name is specified, then the first child of the
+  // parent tag must have one of the provided names.
+  repeated string first_child_tag_name_oneof = 2;
+  // If at least one tag name is specified, then the child tags of
+  // the parent tag must have one of the provided tag names.
+  repeated string child_tag_name_oneof = 3;
+  // Unless set to -1 (the default), the parent tag must have a minimum of
+  // |mandatory_min_num_child_tags| immediate child tags.
+  optional int32 mandatory_min_num_child_tags = 4 [default = -1];
+}
+
+// TagSpecs and reference points.
+//
+// Any TagSpec may define a list of reference points via the
+// TagSpec::reference_points field. These reference points specify how
+// DOM elements that are children of this parent tag fulfill particular
+// functionality. For instance, a widget (implemented as an AMP tag) may
+// require a login reference point. Any valid AMP tag would be allowed,
+// whether it's a clickable DIV or an AMP-IMG or a BUTTON, so long as
+// it *also* conforms to the reference point specification. This
+// specification is a TagSpec which does not define a name (the
+// name is set to the special value '$REFERENCE_POINT'), but rather
+// identifies the reference point with AttrSpec requirements. For instance,
+// the login reference point may require that there be a login attribute,
+// or some end-point attribute with a URL, or similar.
+// Therefore, for any child tags of a tag that defines reference points,
+// they are first matched against these reference points, and only
+// then are they validated as regular tags against the TagSpecs that are
+// not reference points while their reference point attributes are skipped.
+// The complexity of this mechanism is unfortunate but reduces the markup
+// required and makes CSS styling more convenient. Please see
+// the amp-live-list specification for an example.
+message ReferencePoint {
+  // A tag spec identified by its TagSpec::spec_name which specifies how
+  // a specific functionality for the parent tag is assigned.
+  optional string tag_spec_name = 1;
+  // At least one of the child tags of the parent defining this
+  // reference point must match it.
+  optional bool mandatory = 2;
+  // At most one of the child tags of the parent defining this
+  // reference point must match it.
+  optional bool unique = 3;
+}
+
+// Specs specific to AMP Extensions. This is a field within TagSpec that
+// replaces the standard tagspec list of attributes, requirements, etc.
+// NEXT AVAILABLE TAG: 9
+message ExtensionSpec {
+  // e.g. "amp-video". This is used both as the attribute value for the
+  // 'custom-element' attribute value as well as part of the 'src' attribute
+  // value.
+  optional string name = 1;
+  // e.g. "0.1", "1.0", "latest".
+  repeated string version = 2;
+  // deprecated_version must be a strict subset of version. If the version
+  // matches a deprecated_version, validation will emit a warning.
+  repeated string deprecated_version = 3;
+
+  // Most extensions are custom-elements. For custom-template extensions, this
+  // value needs to be set true. E.g: amp-mustache.
+  enum ExtensionType {
+    UNKNOWN = 0;
+    CUSTOM_ELEMENT = 1;
+    CUSTOM_TEMPLATE = 2;
+    HOST_SERVICE = 3;
+  }
+  optional ExtensionType extension_type = 8 [default = CUSTOM_ELEMENT];
+
+  // For older tags, we did not originally require that the tag only be included
+  // once, so those tags are grandfathered in for multiple inclusion in the file
+  optional bool deprecated_allow_duplicates = 6 [default = false];
+
+  // TagSpec.requires_extension will be set to the new extension's name on one
+  // or more TagSpecs that require that extension. This typically creates 2
+  // validation requirements:
+  //  1) If a tag is on the page whose TagSpec has the requires_extension
+  //     field set, but that extension is not present, this is an error.
+  //     (Usage requires extension).
+  //  2) If an extension is on the page, but no tags indicating usage of that
+  //     extension via the required_extension field are on the page, this is an
+  //     error. (Extension requires usage).
+  //
+  // The second requirement (extension requires usage) has a few exceptions:
+  //   1) For older extensions, implemented before these tagspec rules, we
+  //      do not want to introduce a breaking change, so we grandfather these
+  //      extensions to not require usage. New extensions must use ERROR.
+  //   2) Some extensions, such as `amp-dynamic-css-classes`, do not have any
+  //      associated tag in the document indicating usage. These extensions do
+  //      not trigger warnings or errors.
+  enum ExtensionUsageRequirement {
+    ERROR = 1;
+    // Exception for grandfathered extensions. #1 above.
+    GRANDFATHERED = 2;
+    // Exception for extensions with no usage-indicating tag. #2 above.
+    NONE = 3;
+  }
+  optional ExtensionUsageRequirement requires_usage = 7 [default = ERROR];
+
+  // Deprecated fields, do not reuse.
+  // reserved 4, 5;
+}
+
+// The HtmlFormat is the declared format in the top-level html tag, which
+// prescribes a particular set of validation rules. This should be kept in sync
+// with Request.HtmlFormat in
+// github.com/ampproject/amppackager/transformer/request/request.proto.
+message HtmlFormat {
+  enum Code {
+    UNKNOWN_CODE = 0;  // Never used
+    AMP = 1;
+    AMP4ADS = 2;
+    AMP4EMAIL = 3;
+    ACTIONS = 5;
+    EXPERIMENTAL = 4;  // Currently unused
+  }
+}
+
+// Tags that are not covered by at least one of these specs are disallowed.
+// Some tags are mandatory. Note that the tag name is not unique, that is,
+// there can be multiple tag specs covering the same name, e.g., for
+// multiple meta tags (with different attributes).
+// NEXT AVAILABLE TAG: 39
+message TagSpec {
+  // The html_format field tells the validator for which html formats
+  // (ie: (<html ⚡> vs <html a4⚡>) this HTML TagSpec is allowed to validate.
+  // The repeated field is not allowed to be empty, it must have at least one
+  // HtmlFormat.
+  repeated HtmlFormat.Code html_format = 21;
+
+  // If provided, the Type Identifier(s) that either enable or disable
+  // this TagSpec. If a Type Identifier is in enabled_by then this
+  // TagSpec will be used in validating parsed documents with that Type
+  // Identifier. If a Type Identifier is in disabled_by then this
+  // TagSpec will not be used in validating parsed documents with that
+  // Type Identifier. A TagSpec can not have both enabled_by and disabled_by
+  // set.
+  repeated string enabled_by = 35;
+  repeated string disabled_by = 36;
+
+  // Use UPPER-CASE tag names only. If adding the same tag twice, then they must
+  // also have a spec_name string which is unique throughout all detail.
+  // Note: "$REFERENCE_POINT" is a special tag_name value.
+  //       Reference points are partial tag specs which don't have a defined
+  //       tag_name.
+  optional string tag_name = 1;
+
+  // If provided, the spec_name must be unique within the validator
+  // rules. It will be used with preference over the tag_name in
+  // parameters for error messages and other usages that require or
+  // benefit from a unique identifier.
+  optional string spec_name = 2;
+
+  // NamedId's are used to uniquely identify specific TagSpecs in the
+  // validator rules in a stable manner. Most TagSpecs have no set NamedId.
+  // If a TagSpec has a NamedId it must be unique. In other words, no two
+  // TagSpec's may have the same NamedId except for the NOT_SET (0) value.
+  // NEXT AVAILABLE TAG: 3
+  enum NamedId {
+    NOT_SET = 0;
+    // By convention, the first "word" in the Id should be the tag_name.
+    LINK_FONT_STYLESHEET = 1;
+    STYLE_AMP_CUSTOM = 2;
+  }
+  optional NamedId named_id = 33 [default = NOT_SET];
+
+  // If provided, this is a SCRIPT tag defining an amp custom element
+  // extension. The other fields, such as expected attributes, will be
+  // validated by the extension spec rules.
+  optional ExtensionSpec extension_spec = 27;
+
+  // If set, this tag is considered part of an amp extended component, and
+  // requires that the named extended component script tag is present on the
+  // page.
+  repeated string requires_extension = 28;
+
+  // If true, a tag conforming to this tag spec must occur at least once
+  // within the document.
+  optional bool mandatory = 3;
+  // A string identifying that this tag belongs to a set of alternative
+  // choices from which at least one needs to be satisfied.
+  optional string mandatory_alternatives = 4;
+  // If true, a tag conforming to this tag spec may occur at most once within
+  // the document.
+  optional bool unique = 5;
+  // If true, a tag conforming to this tag spec should occur at most once within
+  // the document. That is, unlike for unique, we'll emit a warning.
+  optional bool unique_warning = 25;
+
+  // If set to "$ROOT", this tag must be the root tag.
+  // If set to any other string, the tag must be the direct child of the
+  //   specified mandatory parent tag.
+  optional string mandatory_parent = 6;
+  // If set, the tag must descend from (not necessarily direct parent of) the
+  // specified mandatory parent string which is either a tag name or a tag
+  // spec_name (e.g. tag.name = "!DOCTYPE" or tag.spec_name = "html doctype").
+  optional string mandatory_ancestor = 15;
+  // Use only for tags where mandatory_ancestor is set. If tag validation fails
+  // due to the mandatory_ancestor, and this field is set, then the error
+  // detail will suggest the tag specified here as an alternative to consider.
+  optional string mandatory_ancestor_suggested_alternative = 16;
+  // This tag may not descend from any tag with any of these tag names or tag
+  // spec_names (e.g. tag.name = "!DOCTYPE" or tag.spec_name = "html doctype").
+  repeated string disallowed_ancestor = 13;
+
+  // If set, all of the tag's descendants must be tags from the named list.
+  // A tag not in the named list will generate an error.
+  optional string descendant_tag_list = 29;
+
+  // If set, other tags - identified by their detail string - must be
+  // present as well or a warning will be issued (will not invalidate doc).
+  repeated string also_requires_tag_warning = 22;
+  // Expresses a generic condition which is satisfied if this tag is found. Used
+  // in combination with the `requires` attribute on a different tag.
+  repeated string satisfies = 23;
+  // Expresses a generic condition which must be satisfied if this tag is found.
+  // Used in combination with the `satisfies` attributes on a different tag.
+  repeated string requires = 24;
+  // The excludes field is a generic condition, which must not be satisfied if
+  // this tag is found. Otherwise a TAG_EXCLUDED_BY_TAG error will be generated.
+  // Used in combination with the `satisfies` attributes on a different tag.
+  repeated string excludes = 32;
+
+  // If set, generates a DEPRECATED_TAG error with severity WARNING.
+  // The value of the deprecation field indicates what to use instead,
+  // e.g. the name of a tag.
+  optional string deprecation = 17;
+  // If provided, a URL which links to the AMP HTML spec for this deprecation.
+  optional string deprecation_url = 18;
+
+  // This TagSpec will only validate against attributes explicitly
+  // listed within the TagSpec (attrs and attr_lists). No attributes
+  // from $GLOBAL_ATTRS and $AMP_LAYOUT_ATTRS are valid unless explicitly
+  // added as an attribute within the TagSpec. The field `amp_layout` is not
+  // allowed to be set when `explicit_attrs_only` is true.
+  optional bool explicit_attrs_only = 34 [default = false];
+  // Attribute specifications related to this tag.
+  repeated AttrSpec attrs = 7;
+  // Top level attr lists of shared tags, identified by unique key
+  // (see attr_lists map in ValidatorRules).
+  repeated string attr_lists = 8;
+
+  // Note that these are evaluated after a particular TagSpec
+  // has been evaluated. Unlike other checks in this TagSpec, we
+  // no longer have the ability to fall back on a different TagSpec.
+  optional CdataSpec cdata = 12;
+
+  // Specifies which tags can be the child tags, that is, immediately children
+  // of this tag in the document.
+  optional ChildTagSpec child_tags = 19;
+
+  // If set to true, this tag cannot have any siblings.
+  optional bool siblings_disallowed = 30 [default = false];
+
+  // If set to true, this tag must be the last child of its parent.
+  optional bool mandatory_last_child = 31 [default = false];
+
+  // The reference_points defined by this TagSpec instance determine how
+  // specific child tags are identified. Please see the comment for the
+  // ReferencePoint message.
+  repeated ReferencePoint reference_points = 20;
+
+  // If provided, a URL which linking to a section / sentence in the
+  // AMP HTML spec. If a TagSpec contains a requires_extension field,
+  // spec_url will be inherited from the named extension, unless overridden
+  // by the setting it here.
+  optional string spec_url = 10;
+
+  // If set, specifies which AMP Layouts are supported by this element.
+  optional AmpLayout amp_layout = 11;
+
+  // If set, triggers related validation rules for descendants of this tag.
+  optional AncestorMarker mark_descendants = 38;
+
+  // Deprecated fields, do not reuse.
+  // reserved 14, 26;
+}
+
+// Defines how much css is allowed on the document including inline styles.
+// If a CssLengthSpec is not defined for a particular html_format, then
+// no limit is enforced for inline styles but a limit may be enforced on
+// particular style tags. Those would be defined in that tag's CdataSpec.
+message CssLengthSpec {
+  // The html_format field tells the validator for which html formats
+  // (ie: (<html ⚡> vs <html a4⚡>) this CssLengthSpec is defined for.
+  optional HtmlFormat.Code html_format = 1;
+
+  // If set, the combined style amp-custom cdata contents and all inline style
+  // contents cannot be greater than this length, in bytes.
+  optional int32 max_bytes = 2 [default = -1];
+
+  // If set, the inline style content (per use) cannot be greater than this
+  // length, in bytes.
+  optional int32 max_bytes_per_inline_style = 4 [default = -1];
+
+  // If provided, a URL which linking to a section / sentence in the
+  // AMP HTML spec.
+  optional string spec_url = 3;
+}
+
+// Top level message - start reading here.
+// The validator knows about a set of tag specifications.
+// NEXT AVAILABLE TAG: 19
+message ValidatorRules {
+  repeated TagSpec tags = 1;
+  repeated AttrList attr_lists = 7;
+  // The min file revision for validator.cc which can digest this file.
+  optional int32 min_validator_revision_required = 4;
+  // See comment in validator.protoascii.
+  optional int32 spec_file_revision = 6 [default = -1];
+
+  // Spec URL for information about mustache templates.
+  optional string template_spec_url = 8;
+
+  // Spec URL for information about styles and amp-custom stylesheet
+  optional string styles_spec_url = 15;
+
+  // Spec URL for information about script tags.
+  optional string script_spec_url = 17;
+
+  repeated ErrorFormat error_formats = 9;
+  repeated ErrorSpecificity error_specificity = 13;
+
+  repeated DescendantTagList descendant_tag_list = 16;
+
+  repeated CssLengthSpec css_length_spec = 18;
+
+  // Deprecated fields, do not reuse.
+  // reserved 2, 5, 11, 12, 14;
+}
+
+// This feature was removed in October 2019, however there are still
+// some callers that expect an ErrorCategory to be set. Do not rely
+// on this in new code.
+// TODO(#25188): Remove ErrorCategory completely.
+message ErrorCategory {
+  enum Code {
+    UNKNOWN = 0;
+  }
+}
+
+// We record validation errors in a structured form, so that they can be
+// worked with in code - e.g., to provide translated messages.
+// In the Javascript implementation (validator.js), you may find
+// the amp.validator.renderErrorMessage function which will make a
+// human-readable string from the structured form. It should be easy to port
+// this to other languages as needed; for instance Google has implementations
+// in C++, Java, and for templates used in some frontends.
+message ValidationError {
+  enum Severity {
+    UNKNOWN_SEVERITY = 0;
+    // A document with at least one error of this severity fails validation.
+    ERROR = 1;
+    // A document may have warnings and still pass validation.
+    WARNING = 4;
+    // DO NOT REASSIGN the previously used values 2, 3.
+  }
+  optional Severity severity = 6 [default = ERROR];
+  // NEXT AVAILABLE TAG: 111
+  enum Code {
+    UNKNOWN_CODE = 0;
+    MANDATORY_TAG_MISSING = 1;
+    TAG_REQUIRED_BY_MISSING = 24;
+    WARNING_TAG_REQUIRED_BY_MISSING = 76;
+    TAG_EXCLUDED_BY_TAG = 101;
+    WARNING_EXTENSION_UNUSED = 79;
+    EXTENSION_UNUSED = 84;
+    WARNING_EXTENSION_DEPRECATED_VERSION = 80;
+    ATTR_REQUIRED_BUT_MISSING = 61;
+    DISALLOWED_TAG = 2;
+    GENERAL_DISALLOWED_TAG = 51;
+    DISALLOWED_SCRIPT_TAG = 88;
+    DISALLOWED_ATTR = 3;
+    DISALLOWED_STYLE_ATTR = 81;
+    INVALID_ATTR_VALUE = 4;
+    DUPLICATE_ATTRIBUTE = 94;
+    ATTR_VALUE_REQUIRED_BY_LAYOUT = 27;
+    MISSING_LAYOUT_ATTRIBUTES = 105;
+    IMPLIED_LAYOUT_INVALID = 22;
+    SPECIFIED_LAYOUT_INVALID = 26;
+    MANDATORY_ATTR_MISSING = 5;
+    MANDATORY_ONEOF_ATTR_MISSING = 28;
+    MANDATORY_ANYOF_ATTR_MISSING = 104;
+    DUPLICATE_DIMENSION = 60;
+    DUPLICATE_UNIQUE_TAG = 6;
+    DUPLICATE_UNIQUE_TAG_WARNING = 77;
+    WRONG_PARENT_TAG = 7;
+    STYLESHEET_TOO_LONG = 50;
+    STYLESHEET_AND_INLINE_STYLE_TOO_LONG = 102;
+    INLINE_STYLE_TOO_LONG = 103;
+    MANDATORY_CDATA_MISSING_OR_INCORRECT = 9;
+    CDATA_VIOLATES_BLACKLIST = 30;
+    NON_WHITESPACE_CDATA_ENCOUNTERED = 82;
+    INVALID_JSON_CDATA = 106;
+    DEPRECATED_ATTR = 11;
+    DEPRECATED_TAG = 12;
+    MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE = 14;
+    INVALID_PROPERTY_VALUE_IN_ATTR_VALUE = 15;
+    MISSING_URL = 35;
+    INVALID_URL = 36;
+    INVALID_URL_PROTOCOL = 37;
+    DISALLOWED_DOMAIN = 62;
+    DISALLOWED_RELATIVE_URL = 49;
+    DISALLOWED_PROPERTY_IN_ATTR_VALUE = 16;
+    MUTUALLY_EXCLUSIVE_ATTRS = 17;
+    UNESCAPED_TEMPLATE_IN_ATTR_VALUE = 18;
+    TEMPLATE_PARTIAL_IN_ATTR_VALUE = 19;
+    TEMPLATE_IN_ATTR_NAME = 20;
+    INCONSISTENT_UNITS_FOR_WIDTH_AND_HEIGHT = 21;
+    DISALLOWED_TAG_ANCESTOR = 23;
+    MANDATORY_LAST_CHILD_TAG = 89;
+    MANDATORY_TAG_ANCESTOR = 31;
+    MANDATORY_TAG_ANCESTOR_WITH_HINT = 32;
+    ATTR_DISALLOWED_BY_IMPLIED_LAYOUT = 33;
+    ATTR_DISALLOWED_BY_SPECIFIED_LAYOUT = 34;
+    INCORRECT_NUM_CHILD_TAGS = 56;
+    INCORRECT_MIN_NUM_CHILD_TAGS = 85;
+    DISALLOWED_CHILD_TAG_NAME = 57;
+    DISALLOWED_FIRST_CHILD_TAG_NAME = 58;
+    DISALLOWED_MANUFACTURED_BODY = 64;
+    CHILD_TAG_DOES_NOT_SATISFY_REFERENCE_POINT = 66;
+    MANDATORY_REFERENCE_POINT_MISSING = 67;
+    DUPLICATE_REFERENCE_POINT = 68;
+    TAG_NOT_ALLOWED_TO_HAVE_SIBLINGS = 87;
+    TAG_REFERENCE_POINT_CONFLICT = 69;
+    CHILD_TAG_DOES_NOT_SATISFY_REFERENCE_POINT_SINGULAR = 70;
+    BASE_TAG_MUST_PRECEED_ALL_URLS = 78;
+    MISSING_REQUIRED_EXTENSION = 83;
+    ATTR_MISSING_REQUIRED_EXTENSION = 97;
+    DOCUMENT_TOO_COMPLEX = 86;
+    INVALID_UTF8 = 96;
+    DOCUMENT_SIZE_LIMIT_EXCEEDED = 108;
+    DEV_MODE_ONLY = 109;
+    VALUE_SET_MISMATCH = 110;
+
+    CSS_SYNTAX_INVALID_AT_RULE = 29;
+    CSS_SYNTAX_STRAY_TRAILING_BACKSLASH = 38;
+    CSS_SYNTAX_UNTERMINATED_COMMENT = 39;
+    CSS_SYNTAX_UNTERMINATED_STRING = 40;
+    CSS_SYNTAX_BAD_URL = 41;
+    CSS_SYNTAX_EOF_IN_PRELUDE_OF_QUALIFIED_RULE = 42;
+    CSS_SYNTAX_INVALID_DECLARATION = 43;
+    CSS_SYNTAX_INCOMPLETE_DECLARATION = 44;
+    CSS_SYNTAX_ERROR_IN_PSEUDO_SELECTOR = 45;
+    CSS_SYNTAX_MISSING_SELECTOR = 46;
+    CSS_SYNTAX_NOT_A_SELECTOR_START = 47;
+    CSS_SYNTAX_UNPARSED_INPUT_REMAINS_IN_SELECTOR = 48;
+    CSS_SYNTAX_MISSING_URL = 52;
+    CSS_SYNTAX_INVALID_URL = 53;
+    CSS_SYNTAX_INVALID_URL_PROTOCOL = 54;
+    CSS_SYNTAX_DISALLOWED_DOMAIN = 63;
+    CSS_SYNTAX_DISALLOWED_RELATIVE_URL = 55;
+    CSS_SYNTAX_INVALID_ATTR_SELECTOR = 59;
+    CSS_SYNTAX_INVALID_PROPERTY = 90;
+    CSS_SYNTAX_INVALID_PROPERTY_NOLIST = 95;
+    CSS_SYNTAX_QUALIFIED_RULE_HAS_NO_DECLARATIONS = 91;
+    CSS_SYNTAX_DISALLOWED_QUALIFIED_RULE_MUST_BE_INSIDE_KEYFRAME = 92;
+    CSS_SYNTAX_DISALLOWED_KEYFRAME_INSIDE_KEYFRAME = 93;
+    CSS_SYNTAX_MALFORMED_MEDIA_QUERY = 98;
+    CSS_SYNTAX_DISALLOWED_MEDIA_TYPE = 99;
+    CSS_SYNTAX_DISALLOWED_MEDIA_FEATURE = 100;
+    CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE = 71;
+    CSS_EXCESSIVELY_NESTED = 107;
+
+    // The following codes are currently used only by A4A CSS validation.
+    CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE_WITH_HINT = 72;
+    CSS_SYNTAX_PROPERTY_DISALLOWED_WITHIN_AT_RULE = 73;
+    CSS_SYNTAX_PROPERTY_DISALLOWED_TOGETHER_WITH = 74;
+    CSS_SYNTAX_PROPERTY_REQUIRES_QUALIFICATION = 75;
+
+    // Deprecated fields, do not reuse.
+    // reserved 13;
+  }
+  optional Code code = 1;
+  optional int32 line = 2 [default = 1];
+  optional int32 col = 3;
+  optional string spec_url = 5;
+  repeated string params = 7;
+  // This field is deprecated. Do not use.
+  optional ErrorCategory.Code category = 8;
+
+  // Used only in JavaScript, if an error is emitted for a specific HTML tag and
+  // if that HTML tag has an attribute named data-amp-report-test, this string
+  // will be set and contain the value found for that attribute. This is used
+  // in tests to match specific errors to specific tags in the test cases. It
+  // is not a rendered value.
+  optional string data_amp_report_test_value = 9;
+
+  // Deprecated fields, do not reuse.
+  // reserved 4;
+}
+
+// Used in the verbose validator to select between multiple generated error
+// types for a failing error. A higher number means that the error is more
+// specific, ie: more helpful, preferred.
+message ErrorSpecificity {
+  optional ValidationError.Code code = 1;
+  optional int32 specificity = 2;
+}
+
+message ErrorFormat {
+  optional ValidationError.Code code = 1;
+  optional string format = 2;
+}
+
+// A value to be added to a particular ValueSet, as found when scanning the
+// document (i.e. AttrSpec.add_value_to_set).
+message ValueSetProvision {
+  // The collection to add the attribute value to.
+  optional AttrSpec.ValueSet set = 1;
+  // The value of the attribute itself.
+  optional string value = 2;
+}
+// A requirement that a particular value appears in a particular ValueSet (i.e.
+// AttrSpec.value_oneof_set). All the provisions and requirements are collected
+// until the document has been fully scanned, and then compared to ensure that
+// all requirements are met. This allows provisions to appear after (or even
+// alongside) requirements.
+message ValueSetRequirement {
+  // The provision that is required.
+  optional ValueSetProvision provision = 1;
+  // The error that will appear if the requirement is not met. This includes the
+  // line/col of the attribute that makes the requirement.
+  optional ValidationError error_if_unsatisfied = 2;
+}
+
+// The validation result provided by Validator instances (see Validator::Result
+// in validator.h). To render such a proto see RenderValidationResult.
+message ValidationResult {
+  enum Status {
+    UNKNOWN = 0;
+    PASS = 1;
+    FAIL = 2;
+  }
+  optional Status status = 2;
+  repeated ValidationError errors = 1;
+  optional int32 validator_revision = 3 [default = -1];
+  optional int32 spec_file_revision = 4 [default = -1];
+  // If the AMP document is a transformed AMP document, then this is the
+  // version of the transformers that were used to transform it. If the document
+  // is not transformed, then the transformer_version's value will be 0.
+  // Note: the AMP Pacakager's transformer library specifies the version as
+  // int64. However, JavaScript does not natively support int64 so int32 is
+  // used instead.
+  // https://github.com/ampproject/amppackager/blob/master/transformer/transformers/context.go
+  optional int32 transformer_version = 6 [default = 0];
+  // The type idenfitier of the parsed document, e.g. AMP, AMP4ADS or some other
+  // type that has yet to be defined. These are declared on the HTML tag and
+  // parsed by the Validator Engine.
+  repeated string type_identifier = 5;
+  // The set of provisions from all matching AttrSpecs in this TagSpec match.
+  // If the TagSpec is selected, these will be added to the final set of
+  // provisions.
+  repeated ValueSetProvision value_set_provisions = 7;
+  // The set of requirements from all matching AttrSpecs in this TagSpec match.
+  // If the TagSpec is selected, these will be added to the final set of
+  // requirements.
+  repeated ValueSetRequirement value_set_requirements = 8;
+}
+
+// Information about the validator returned by ValidatorFactory
+// (see validator.h).
+message ValidatorInfo {
+  // Path from which the spec file was loaded.
+  optional string rules_path = 1;
+  // The file revision of validator.cc.
+  optional int32 validator_revision = 2 [default = -1];
+  // The file revision of the spec file (validator.protoascii).
+  optional int32 spec_file_revision = 3 [default = -1];
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/AMPHtmlHandlerTest.java b/validator/java/src/test/java/dev/amp/validator/AMPHtmlHandlerTest.java
new file mode 100644
index 0000000000000..daa0b53c16c6c
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/AMPHtmlHandlerTest.java
@@ -0,0 +1,122 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.BeforeMethod;
+import org.testng.annotations.Test;
+import org.xml.sax.Attributes;
+import org.xml.sax.Locator;
+import org.xml.sax.SAXException;
+
+import java.io.IOException;
+import java.net.URISyntaxException;
+
+import static org.mockito.Mockito.mock;
+import static org.mockito.Mockito.when;
+
+/**
+ * Test for {@link AMPHtmlHandler}
+ *
+ * @author sphatak01
+ */
+public class AMPHtmlHandlerTest {
+
+    @BeforeMethod
+    public void setUp() throws IOException, URISyntaxException {
+        ampValidatorManager = new AMPValidatorManager();
+        ampValidatorManager.loadRule();
+    }
+
+    /**
+     * start document must set state status to UNKNOWN.
+     *
+     * @throws SAXException Sax exception.
+     */
+    @Test
+    public void testStartDocument() throws SAXException {
+        final AMPHtmlHandler handler = new AMPHtmlHandler(ampValidatorManager,
+                ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING,
+                MAX_NODES_ALLOWED);
+
+        handler.startDocument();
+
+        Assert.assertEquals(handler.validationResult().getStatus(), ValidatorProtos.ValidationResult.Status.UNKNOWN);
+    }
+
+    /**
+     *
+     */
+    @Test
+    public void testStartElement() throws SAXException {
+        final AMPHtmlHandler handler = new AMPHtmlHandler(ampValidatorManager,
+                ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING,
+                MAX_NODES_ALLOWED);
+
+        final String uri = "";
+        final Attributes attrs = mock(Attributes.class);
+        when(attrs.getLocalName(0)).thenReturn("height");
+        handler.setDocumentLocator(new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pub_id";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sys_id";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        });
+        handler.startElement(uri, "html", "", attrs);
+    }
+
+    @Test
+    public void testEndElement() {
+    }
+
+    @Test
+    public void testSetDocumentLocator() {
+    }
+
+    @Test
+    public void testValidationResult() {
+    }
+
+    @Test
+    public void testEmitMissingExtensionErrors() {
+    }
+
+    /** AMPValidatorManager object. */
+    private AMPValidatorManager ampValidatorManager;
+
+    private static final int MAX_NODES_ALLOWED = 50;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/AMPValidatorManagerTest.java b/validator/java/src/test/java/dev/amp/validator/AMPValidatorManagerTest.java
new file mode 100644
index 0000000000000..422837d1ebafa
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/AMPValidatorManagerTest.java
@@ -0,0 +1,76 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.BeforeClass;
+import org.testng.annotations.Test;
+
+import java.util.List;
+
+/**
+ * This class tests {@code AMPValidatorManagerTest}.
+ *
+ * @author nhant01
+ *
+ */
+
+public class AMPValidatorManagerTest {
+    /**
+     * Initialization method to load the rules.
+     *
+     * @throws Exception if fails to load the rules.
+     */
+    @BeforeClass
+    public void init() throws Exception {
+        ampValidatorManager = new AMPValidatorManager();
+        ampValidatorManager.loadRule();
+    }
+
+    /**
+     * Validating if a tag exists for a given specific HtmlFormat type.
+     */
+    @Test
+    public void testHasTagSpec() {
+        boolean hasTag = ampValidatorManager.hasTagSpec(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, "H");
+        Assert.assertFalse(hasTag, "AMP4EMAIL html format should not contain H tag");
+
+        hasTag = ampValidatorManager.hasTagSpec(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, "A");
+        Assert.assertTrue(hasTag, "AMP4EMAIL html format should contain A tag");
+    }
+
+    /**
+     * Validating to ensure a list of tag returns if exists for given a specific HtmlFormat type.
+     */
+    @Test
+    public void testGetTagSpec() {
+        List<ValidatorProtos.TagSpec> tagSpec = ampValidatorManager.getTagSpec(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, "H");
+        Assert.assertNull(tagSpec, "AMP4EMAIL html format should not contain H tag");
+
+        tagSpec = ampValidatorManager.getTagSpec(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, "STYLE");
+        Assert.assertNotNull(tagSpec, "AMP4EMAIL html format should contain STYLE tag");
+        Assert.assertEquals(tagSpec.size(), 3, "AMP4EMAIL htmlformat contains STYLE tag with size 2");
+    }
+
+    /** AMPValidatorManager object. */
+    private AMPValidatorManager ampValidatorManager;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/CdataMatcherTest.java b/validator/java/src/test/java/dev/amp/validator/CdataMatcherTest.java
new file mode 100644
index 0000000000000..e363af4d6d1b7
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/CdataMatcherTest.java
@@ -0,0 +1,731 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.exception.TagValidationException;
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Locator;
+
+import java.io.IOException;
+import java.util.List;
+import java.util.regex.Pattern;
+
+/**
+ * Tests for {@link CdataMatcher}
+ *
+ * @author sphatak01
+ */
+public class CdataMatcherTest {
+
+    @Test
+    public void testMatchStylesheetTooLong() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(2);
+
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        cDataMatcher.match("cdata1", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 2);
+        Assert.assertEquals(params.get(0), "6");
+        Assert.assertEquals(params.get(1), "2");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.STYLESHEET_TOO_LONG);
+
+    }
+
+    @Test
+    public void testMatchMandatoryCDataMissing() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.setMandatoryCdata("manCdata");
+
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        cDataMatcher.match("cdata1", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "title");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.MANDATORY_CDATA_MISSING_OR_INCORRECT);
+
+    }
+
+    @Test
+    public void testMatchExactMatch() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.setCdataRegex("cdata");
+
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        String fullMatchRegex = "cdata";
+        Pattern pattern = Pattern.compile(fullMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getFullMatchRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        cDataMatcher.match("cdata1", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "title");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.MANDATORY_CDATA_MISSING_OR_INCORRECT);
+
+    }
+
+    @Test
+    public void testMatchCssSpec() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.setCssSpec(ValidatorProtos.CssSpec.newBuilder()
+                .addAtRuleSpec(ValidatorProtos.AtRuleSpec.newBuilder()
+                        .setName("font-face").setType(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR).build()).build());
+
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getLineCol()).thenReturn(locator);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        String fullMatchRegex = "cdata";
+        Pattern pattern = Pattern.compile(fullMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getFullMatchRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        cDataMatcher.match("cdata1", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.anyInt(),
+                        Mockito.anyInt(),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "title");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_EOF_IN_PRELUDE_OF_QUALIFIED_RULE);
+
+    }
+
+    @Test
+    public void testMatchWhitespaceOnly() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.setWhitespaceOnly(true);
+
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getLineCol()).thenReturn(locator);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        String fullMatchRegex = "cdata";
+        Pattern pattern = Pattern.compile(fullMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getFullMatchRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        cDataMatcher.match("cdata1", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "title");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.NON_WHITESPACE_CDATA_ENCOUNTERED);
+
+    }
+
+    @Test
+    public void testMatchViolateBlacklist() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.addBlacklistedCdataRegex(ValidatorProtos.BlackListedCDataRegex.newBuilder().setRegex("cdata").build());
+
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getLineCol()).thenReturn(locator);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.isStyleAmpCustomChild()).thenReturn(true);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        Mockito.when(mockParsedValidatorRules.getCombinedBlacklistedCdataRegex(Mockito.anyInt())).thenReturn("cdata");
+        String partialMatchRegex = "cdata";
+        Pattern pattern = Pattern.compile(partialMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getPartialMatchCaseiRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        cDataMatcher.match("cdata1", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 2);
+        Assert.assertEquals(params.get(0), "title");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CDATA_VIOLATES_BLACKLIST);
+
+    }
+
+    @Test
+    public void testMatchPartialMatch() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.addBlacklistedCdataRegex(ValidatorProtos.BlackListedCDataRegex.newBuilder().setRegex("cdata1").build());
+
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getLineCol()).thenReturn(locator);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        Mockito.when(mockParsedValidatorRules.getCombinedBlacklistedCdataRegex(Mockito.anyInt())).thenReturn("xyz");
+        String partialMatchRegex = "[0-9]";
+        Pattern pattern = Pattern.compile(partialMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getPartialMatchCaseiRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        cDataMatcher.match("cdata", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(0))
+                .addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                        Mockito.any(Locator.class),
+                        Mockito.anyListOf(String.class),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    }
+
+    @Test(expectedExceptions = CssValidationException.class, expectedExceptionsMessageRegExp = "atRuleSpec name is not 'media'")
+    public void testMatchCssNotMedia() throws TagValidationException, CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.addBlacklistedCdataRegex(ValidatorProtos.BlackListedCDataRegex.newBuilder().setRegex("cdata1").build());
+        cDataBuilder.setCssSpec(ValidatorProtos.CssSpec.newBuilder()
+                .addAtRuleSpec(ValidatorProtos.AtRuleSpec.newBuilder()
+                        .setName("font-face").setMediaQuerySpec(ValidatorProtos.MediaQuerySpec.newBuilder()
+                                .build()).setType(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR).build()).build());
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getLineCol()).thenReturn(locator);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        Mockito.when(mockParsedValidatorRules.getCombinedBlacklistedCdataRegex(Mockito.anyInt())).thenReturn("xyz");
+        String partialMatchRegex = "[0-9]";
+        Pattern pattern = Pattern.compile(partialMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getPartialMatchCaseiRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        cDataMatcher.match("cdata", mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(0))
+                .addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                        Mockito.any(Locator.class),
+                        Mockito.anyListOf(String.class),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    }
+
+    @Test
+    public void testMatchCssMediaErrors() throws CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CssSpec cssSpec = ValidatorProtos.CssSpec.newBuilder()
+                .addAtRuleSpec(ValidatorProtos.AtRuleSpec.newBuilder()
+                        .setName("media").setMediaQuerySpec(ValidatorProtos.MediaQuerySpec.newBuilder().setIssuesAsError(true)
+                                .build()).setType(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR).build())
+                .setValidateAmp4Ads(true).setValidateKeyframes(true).build();
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.addBlacklistedCdataRegex(ValidatorProtos.BlackListedCDataRegex.newBuilder().setRegex("cdata1").build());
+        cDataBuilder.setCssSpec(cssSpec);
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getLineCol()).thenReturn(locator);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        Mockito.when(mockParsedValidatorRules.getCombinedBlacklistedCdataRegex(Mockito.anyInt())).thenReturn("xyz");
+        String partialMatchRegex = "[0-9]";
+        Pattern pattern = Pattern.compile(partialMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getPartialMatchCaseiRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        cDataMatcher.matchCss("cdata", cssSpec, mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.anyInt(),
+                        Mockito.anyInt(),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "title");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_EOF_IN_PRELUDE_OF_QUALIFIED_RULE);
+
+    }
+
+    @Test
+    public void testMatchCssMediaWarnings() throws CssValidationException, IOException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecName("title");
+
+        final ValidatorProtos.CssSpec cssSpec = ValidatorProtos.CssSpec.newBuilder()
+                .addAtRuleSpec(ValidatorProtos.AtRuleSpec.newBuilder()
+                        .setName("media").setMediaQuerySpec(ValidatorProtos.MediaQuerySpec.newBuilder().setIssuesAsError(false)
+                                .build()).setType(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR).build())
+                .setValidateAmp4Ads(false).setValidateKeyframes(false).build();
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.setMaxBytes(6);
+        cDataBuilder.addBlacklistedCdataRegex(ValidatorProtos.BlackListedCDataRegex.newBuilder().setRegex("cdata1").build());
+        cDataBuilder.setCssSpec(cssSpec);
+        tagSpecBuilder.setCdata(cDataBuilder.build());
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 24;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 35;
+            }
+        };
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getLineCol()).thenReturn(locator);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockParsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+        Mockito.when(mockParsedValidatorRules.getCombinedBlacklistedCdataRegex(Mockito.anyInt())).thenReturn("xyz");
+        String partialMatchRegex = "[0-9]";
+        Pattern pattern = Pattern.compile(partialMatchRegex);
+
+        Mockito.when(mockParsedValidatorRules.getPartialMatchCaseiRegex(Mockito.anyString())).thenReturn(pattern);
+        Mockito.when(mockContext.getRules()).thenReturn(mockParsedValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        final CdataMatcher cDataMatcher = new CdataMatcher(mockParsedTagSpec, locator);
+
+        cDataMatcher.matchCss("cdata", cssSpec, mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.anyInt(),
+                        Mockito.anyInt(),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "title");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_EOF_IN_PRELUDE_OF_QUALIFIED_RULE);
+
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ChildTagMatcherTest.java b/validator/java/src/test/java/dev/amp/validator/ChildTagMatcherTest.java
new file mode 100644
index 0000000000000..f157a337578cc
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ChildTagMatcherTest.java
@@ -0,0 +1,267 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Locator;
+
+import java.util.List;
+
+/**
+ * Tests for {@link ChildTagMatcher}
+ *
+ * @author sphatak01
+ */
+public class ChildTagMatcherTest {
+
+    @Test(expectedExceptions = TagValidationException.class)
+    public void testConstructorError() throws TagValidationException {
+        new ChildTagMatcher(ValidatorProtos.TagSpec.newBuilder().build());
+    }
+
+    @Test
+    public void testMatchChildTagNameNoError() throws TagValidationException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+
+        final ParsedHtmlTag parsedHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(parsedHtmlTag.upperName()).thenReturn("CHILDNOTONEOF");
+        Mockito.when(parsedHtmlTag.lowerName()).thenReturn("childnotoneof");
+
+        final ValidatorProtos.ChildTagSpec.Builder childSpecBuilder = ValidatorProtos.ChildTagSpec.newBuilder();
+        tagSpecBuilder.setChildTags(childSpecBuilder.build());
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+
+        final ChildTagMatcher childTagMatcher = new ChildTagMatcher(tagSpec);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+
+        childTagMatcher.matchChildTagName(parsedHtmlTag, mockContext, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(0))
+                .addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                        Mockito.any(Locator.class),
+                        Mockito.anyListOf(String.class),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+    }
+
+    @Test
+    public void testMatchChildTagName() throws TagValidationException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        final ValidatorProtos.ChildTagSpec.Builder childSpecBuilder = ValidatorProtos.ChildTagSpec.newBuilder();
+        childSpecBuilder.addChildTagNameOneof("CHILDONEOF");
+
+        final ParsedHtmlTag parsedHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(parsedHtmlTag.upperName()).thenReturn("CHILDNOTONEOF");
+        Mockito.when(parsedHtmlTag.lowerName()).thenReturn("childnotoneof");
+
+        tagSpecBuilder.setChildTags(childSpecBuilder.build());
+        tagSpecBuilder.setSpecName("spec1");
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+
+        final ChildTagMatcher childTagMatcher = new ChildTagMatcher(tagSpec);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        childTagMatcher.matchChildTagName(parsedHtmlTag, mockContext, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "childnotoneof");
+        Assert.assertEquals(params.get(1), "spec1");
+        Assert.assertEquals(params.get(2), "['childoneof']");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DISALLOWED_CHILD_TAG_NAME);
+    }
+
+    @Test
+    public void testMatchChildTagFirstChildTag() throws TagValidationException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        final ValidatorProtos.ChildTagSpec.Builder childSpecBuilder = ValidatorProtos.ChildTagSpec.newBuilder();
+        childSpecBuilder.addChildTagNameOneof("CHILDONEOF");
+        childSpecBuilder.addFirstChildTagNameOneof("FIRSTCHILDONEOF");
+
+        final ParsedHtmlTag parsedHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(parsedHtmlTag.upperName()).thenReturn("CHILDONEOF");
+        Mockito.when(parsedHtmlTag.lowerName()).thenReturn("childoneof");
+
+        tagSpecBuilder.setChildTags(childSpecBuilder.build());
+        tagSpecBuilder.setSpecName("spec1");
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+
+        final ChildTagMatcher childTagMatcher = new ChildTagMatcher(tagSpec);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentChildCount()).thenReturn(0);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+
+        childTagMatcher.matchChildTagName(parsedHtmlTag, mockContext, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "childoneof");
+        Assert.assertEquals(params.get(1), "spec1");
+        Assert.assertEquals(params.get(2), "['firstchildoneof']");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DISALLOWED_FIRST_CHILD_TAG_NAME);
+    }
+
+    @Test
+    public void testExitTagSuccess() throws TagValidationException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        final ValidatorProtos.ChildTagSpec.Builder childSpecBuilder = ValidatorProtos.ChildTagSpec.newBuilder();
+        childSpecBuilder.addChildTagNameOneof("CHILDONEOF");
+        childSpecBuilder.addFirstChildTagNameOneof("FIRSTCHILDONEOF");
+
+        tagSpecBuilder.setChildTags(childSpecBuilder.setMandatoryNumChildTags(1).setMandatoryMinNumChildTags(1).build());
+        tagSpecBuilder.setSpecName("spec1");
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+
+        final ChildTagMatcher childTagMatcher = new ChildTagMatcher(tagSpec);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentChildCount()).thenReturn(1);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        childTagMatcher.exitTag(mockContext, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(0))
+                .addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                        Mockito.any(Locator.class),
+                        Mockito.anyListOf(String.class),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+    }
+
+    @Test
+    public void testExitTagExpectedChildTags() throws TagValidationException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        final ValidatorProtos.ChildTagSpec.Builder childSpecBuilder = ValidatorProtos.ChildTagSpec.newBuilder();
+        childSpecBuilder.addChildTagNameOneof("CHILDONEOF");
+        childSpecBuilder.addFirstChildTagNameOneof("FIRSTCHILDONEOF");
+
+        tagSpecBuilder.setChildTags(childSpecBuilder.setMandatoryNumChildTags(1).build());
+        tagSpecBuilder.setSpecName("spec1");
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+
+        final ChildTagMatcher childTagMatcher = new ChildTagMatcher(tagSpec);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentChildCount()).thenReturn(0);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        childTagMatcher.exitTag(mockContext, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "spec1");
+        Assert.assertEquals(params.get(1), "1");
+        Assert.assertEquals(params.get(2), "0");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.INCORRECT_NUM_CHILD_TAGS);
+    }
+
+    @Test
+    public void testExitTagExpectedMinChildTags() throws TagValidationException {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        final ValidatorProtos.ChildTagSpec.Builder childSpecBuilder = ValidatorProtos.ChildTagSpec.newBuilder();
+        childSpecBuilder.addChildTagNameOneof("CHILDONEOF");
+        childSpecBuilder.addFirstChildTagNameOneof("FIRSTCHILDONEOF");
+
+        tagSpecBuilder.setChildTags(childSpecBuilder.setMandatoryMinNumChildTags(1).build());
+        tagSpecBuilder.setSpecName("spec1");
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+
+        final ChildTagMatcher childTagMatcher = new ChildTagMatcher(tagSpec);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentChildCount()).thenReturn(0);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        childTagMatcher.exitTag(mockContext, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "spec1");
+        Assert.assertEquals(params.get(1), "1");
+        Assert.assertEquals(params.get(2), "0");
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.INCORRECT_MIN_NUM_CHILD_TAGS);
+    }
+
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ContextTest.java b/validator/java/src/test/java/dev/amp/validator/ContextTest.java
new file mode 100644
index 0000000000000..242a0c18ac77d
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ContextTest.java
@@ -0,0 +1,321 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import org.testng.Assert;
+import org.testng.annotations.BeforeClass;
+import org.testng.annotations.Test;
+import org.xml.sax.Locator;
+
+import java.util.Collections;
+
+import static org.mockito.Mockito.mock;
+import static org.mockito.Mockito.when;
+
+/**
+ * Test class for {@link Context}
+ *
+ * @author sphatak01
+ */
+public class ContextTest {
+
+    /**
+     * Initialize.
+     */
+    @BeforeClass
+    public void init() throws Exception {
+        ampValidatorManager = new AMPValidatorManager();
+        ampValidatorManager.loadRule("validator-all-test.protoascii");
+    }
+
+    /**
+     *
+     * @throws TagValidationException
+     */
+    @Test
+    public void testUpdateFromTagResultsAncestorNoHead() throws TagValidationException {
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+        final ParsedHtmlTag htmlTag = mock(ParsedHtmlTag.class);
+        when(htmlTag.upperName()).thenReturn(UPPER_NAME);
+
+        final ValidateTagResult mockReferencePointResult = mock(ValidateTagResult.class);
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        final ParsedTagSpec tagSpec = mock(ParsedTagSpec.class);
+        final ValidatorProtos.TagSpec tagSpecMock = mockValidatorRules.getByTagSpecId("test_satisfies").getSpec();
+        when(tagSpec.getSpec()).thenReturn(tagSpecMock);
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+
+        context.updateFromTagResults(htmlTag, mockReferencePointResult, mockTagResult);
+
+        Assert.assertTrue(context.satisfiesCondition("amp-app-banner button[open-button]"));
+        Assert.assertEquals(context.getMandatoryAlternativesSatisfied().size(), 1);
+        Assert.assertEquals(context.getMandatoryAlternativesSatisfied().get(0), "alternative");
+        Assert.assertNotNull(context.getTagspecsValidated());
+        Assert.assertTrue(context.getTagspecsValidated().get(0));
+        Assert.assertTrue(context.hasTagspecsValidated(0));
+    }
+
+    @Test
+    public void testMarkUrlSeenFromMatchingTagSpec() {
+    }
+
+    /**
+     *
+     * @throws TagValidationException
+     */
+    @Test
+    public void testSatisfyMandatoryAlternativesFromTagSpec() throws TagValidationException {
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+
+        final ParsedTagSpec tagSpec = mock(ParsedTagSpec.class);
+        final ValidatorProtos.TagSpec tagSpecMock = mockValidatorRules.getByTagSpecId("test_satisfies").getSpec();
+        when(tagSpec.getSpec()).thenReturn(tagSpecMock);
+
+        context.satisfyMandatoryAlternativesFromTagSpec(tagSpec);
+
+        Assert.assertEquals(context.getMandatoryAlternativesSatisfied().size(), 1);
+        Assert.assertEquals(context.getMandatoryAlternativesSatisfied().get(0), "alternative");
+    }
+
+    /**
+     *
+     */
+    @Test
+    public void testAddBuiltError() {
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+
+        final ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        final ValidatorProtos.ValidationError.Builder error = ValidatorProtos.ValidationError.newBuilder();
+        error.setCode(ValidatorProtos.ValidationError.Code.EXTENSION_UNUSED);
+        error.setSeverity(ValidatorProtos.ValidationError.Severity.WARNING);
+
+        context.addBuiltError(error.build(), builder);
+
+        Assert.assertEquals(builder.getStatus(), ValidatorProtos.ValidationResult.Status.UNKNOWN);
+        Assert.assertEquals(builder.getErrorsList().size(), 1);
+
+        error.setSeverity(ValidatorProtos.ValidationError.Severity.ERROR);
+
+        context.addBuiltError(error.build(), builder);
+        Assert.assertEquals(builder.getStatus(), ValidatorProtos.ValidationResult.Status.FAIL);
+        Assert.assertEquals(builder.getErrorsList().size(), 2);
+    }
+
+    /**
+     * test adding an error field to validationResult with severity ERROR.
+     */
+    @Test
+    public void testAddError() {
+        final String mockSpecUrl = "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#links";
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        context.addError(ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR,
+                new Locator() {
+                    @Override
+                    public String getPublicId() {
+                        return null;
+                    }
+
+                    @Override
+                    public String getSystemId() {
+                        return null;
+                    }
+
+                    @Override
+                    public int getLineNumber() {
+                        return 23;
+                    }
+
+                    @Override
+                    public int getColumnNumber() {
+                        return 2;
+                    }
+                },
+                Collections.emptyList(),
+                mockSpecUrl,
+                builder);
+
+        Assert.assertEquals(builder.getStatus(), ValidatorProtos.ValidationResult.Status.FAIL);
+        Assert.assertEquals(builder.getErrorsList().size(), 1);
+        Assert.assertEquals(builder.getErrorsList().get(0).getLine(), 23);
+        Assert.assertEquals(builder.getErrorsList().get(0).getCol(), 2);
+        Assert.assertEquals(builder.getErrorsList().get(0).getCode(), ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR);
+        Assert.assertEquals(builder.getErrorsList().get(0).getSpecUrl(), mockSpecUrl);
+    }
+
+    /**
+     *
+     */
+    @Test
+    public void testAddError1() {
+        final String mockSpecUrl = "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#links";
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        context.addError(ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR,
+                23, 2, Collections.emptyList(),
+                mockSpecUrl,
+                builder);
+
+        Assert.assertEquals(builder.getStatus(), ValidatorProtos.ValidationResult.Status.FAIL);
+        Assert.assertEquals(builder.getErrorsList().size(), 1);
+        Assert.assertEquals(builder.getErrorsList().get(0).getLine(), 23);
+        Assert.assertEquals(builder.getErrorsList().get(0).getCol(), 2);
+        Assert.assertEquals(builder.getErrorsList().get(0).getCode(), ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR);
+        Assert.assertEquals(builder.getErrorsList().get(0).getSpecUrl(), mockSpecUrl);
+    }
+
+    /**
+     *
+     */
+    @Test
+    public void testAddWarning() {
+        final String mockSpecUrl = "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#links";
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+        final ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        context.addWarning(ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR,
+                new Locator() {
+                    @Override
+                    public String getPublicId() {
+                        return null;
+                    }
+
+                    @Override
+                    public String getSystemId() {
+                        return null;
+                    }
+
+                    @Override
+                    public int getLineNumber() {
+                        return 23;
+                    }
+
+                    @Override
+                    public int getColumnNumber() {
+                        return 2;
+                    }
+                },
+                Collections.emptyList(),
+                mockSpecUrl,
+                builder);
+
+        Assert.assertEquals(builder.getStatus(), ValidatorProtos.ValidationResult.Status.UNKNOWN);
+        Assert.assertEquals(builder.getErrorsList().size(), 1);
+        Assert.assertEquals(builder.getErrorsList().get(0).getLine(), 23);
+        Assert.assertEquals(builder.getErrorsList().get(0).getCol(), 2);
+        Assert.assertEquals(builder.getErrorsList().get(0).getCode(), ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR);
+        Assert.assertEquals(builder.getErrorsList().get(0).getSpecUrl(), mockSpecUrl);
+    }
+
+    /**
+     * test line cols.
+     */
+    @Test
+    public void testLineCol() {
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+
+        context.setLineCol(new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pub_id";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sys_id";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        });
+
+        Assert.assertEquals(context.getLineCol().getColumnNumber(), 2);
+        Assert.assertEquals(context.getLineCol().getLineNumber(), 23);
+        Assert.assertEquals(context.getLineCol().getSystemId(), "sys_id");
+        Assert.assertEquals(context.getLineCol().getPublicId(), "pub_id");
+
+    }
+
+    /**
+     *
+     */
+    @Test
+    public void testSettersGetters() {
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+        context.recordTypeIdentifier("type_id");
+        context.recordTypeIdentifier("transformed");
+
+        Assert.assertEquals(context.getRules(), mockValidatorRules);
+        Assert.assertNotNull(context.getTagStack());
+        Assert.assertEquals(context.getTypeIdentifiers().size(), 2);
+        Assert.assertEquals(context.getTypeIdentifiers().get(0), "type_id");
+        Assert.assertTrue(context.isTransformed());
+        Assert.assertNotNull(context.getTagStack());
+        Assert.assertNotNull(context.getExtensions());
+
+    }
+
+    /**
+     *
+     */
+    @Test
+    public void testByteSizeComputations() {
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final Context context = new Context(mockValidatorRules);
+
+        context.addInlineStyleByteSize(40);
+        context.addStyleAmpCustomByteSize(50);
+
+        Assert.assertEquals(context.getInlineStyleByteSize(), 40);
+        Assert.assertEquals(context.getStyleAmpCustomByteSize(), 50);
+    }
+
+    private ParsedValidatorRules mockValidatorRules;
+    private static final String UPPER_NAME = "HEAD";
+    /** AMPValidatorManager object. */
+    private AMPValidatorManager ampValidatorManager;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/CssLengthTest.java b/validator/java/src/test/java/dev/amp/validator/CssLengthTest.java
new file mode 100644
index 0000000000000..7e918c68a1629
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/CssLengthTest.java
@@ -0,0 +1,81 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+public class CssLengthTest {
+
+    @Test
+    public void testNullInput() {
+        final CssLength cssLength = new CssLength(null, true, true);
+        Assert.assertTrue(cssLength.isValid());
+        Assert.assertFalse(cssLength.isFluid());
+        Assert.assertFalse(cssLength.isAuto());
+        Assert.assertFalse(cssLength.isSet());
+    }
+
+    @Test
+    public void testAutoInput() {
+        final CssLength cssLength = new CssLength("auto", true, true);
+        Assert.assertTrue(cssLength.isAuto());
+        Assert.assertTrue(cssLength.isValid());
+        Assert.assertFalse(cssLength.isFluid());
+        Assert.assertTrue(cssLength.isSet());
+
+    }
+
+    @Test
+    public void testFluidInput() {
+        final CssLength cssLength = new CssLength("fluid", true, true);
+        Assert.assertFalse(cssLength.isAuto());
+        Assert.assertTrue(cssLength.isFluid());
+        Assert.assertTrue(cssLength.isValid());
+        Assert.assertTrue(cssLength.isSet());
+
+    }
+
+    @Test
+    public void testPxInput() {
+        final CssLength cssLength = new CssLength("800px", true, true);
+        Assert.assertFalse(cssLength.isAuto());
+        Assert.assertFalse(cssLength.isFluid());
+        Assert.assertTrue(cssLength.isValid());
+        Assert.assertEquals(cssLength.getNumeral(), new Float(800.0));
+        Assert.assertEquals(cssLength.getUnit(), "px");
+        Assert.assertTrue(cssLength.isSet());
+
+    }
+
+    @Test
+    public void testRemInput() {
+        final CssLength cssLength = new CssLength("800rem", true, true);
+        Assert.assertFalse(cssLength.isAuto());
+        Assert.assertFalse(cssLength.isFluid());
+        Assert.assertTrue(cssLength.isValid());
+        Assert.assertEquals(cssLength.getNumeral(), new Float(800.0));
+        Assert.assertEquals(cssLength.getUnit(), "rem");
+        Assert.assertTrue(cssLength.isSet());
+
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ErrorCodeMetadataTest.java b/validator/java/src/test/java/dev/amp/validator/ErrorCodeMetadataTest.java
new file mode 100644
index 0000000000000..5b2770c90ca91
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ErrorCodeMetadataTest.java
@@ -0,0 +1,44 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for class {@link ErrorCodeMetadata}
+ *
+ * @author sphatak01
+ */
+public class ErrorCodeMetadataTest {
+
+    @Test
+    public void testGettersSetters() {
+        final ErrorCodeMetadata errorCodeMetadata = new ErrorCodeMetadata();
+
+        errorCodeMetadata.setFormat("html");
+        errorCodeMetadata.setSpecificity(10);
+
+        Assert.assertEquals(errorCodeMetadata.getFormat(), "html");
+        Assert.assertEquals(errorCodeMetadata.getSpecificity(), 10);
+    }
+
+}
\ No newline at end of file
diff --git a/validator/java/src/test/java/dev/amp/validator/ExtensionMissingErrorTest.java b/validator/java/src/test/java/dev/amp/validator/ExtensionMissingErrorTest.java
new file mode 100644
index 0000000000000..19602af60a27a
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ExtensionMissingErrorTest.java
@@ -0,0 +1,42 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Tests for {@link ExtensionMissingError}
+ *
+ * @author sphatak01
+ */
+public class ExtensionMissingErrorTest {
+
+    @Test
+    public void testConstructor() {
+        final ExtensionMissingError error = new ExtensionMissingError("ext_missing",
+                ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_PROPERTY_IN_ATTR_VALUE).build());
+
+        Assert.assertEquals(error.getMissingExtension(), "ext_missing");
+        Assert.assertEquals(error.getMaybeError().getCode(), ValidatorProtos.ValidationError.Code.DISALLOWED_PROPERTY_IN_ATTR_VALUE);
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ExtensionsContextTest.java b/validator/java/src/test/java/dev/amp/validator/ExtensionsContextTest.java
new file mode 100644
index 0000000000000..ae7ba6c574b06
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ExtensionsContextTest.java
@@ -0,0 +1,138 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+
+package dev.amp.validator;
+
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Locator;
+
+import java.util.List;
+
+public class ExtensionsContextTest {
+
+    @Test
+    public void testRecordFutureErrorsIfMissing() {
+        final ExtensionsContext extContext = new ExtensionsContext();
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        final ValidatorProtos.TagSpec tagSpec = ValidatorProtos.TagSpec.newBuilder().addRequiresExtension("amp-form").
+                setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup").
+                setSpecName("test_parent").build();
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpec);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId2";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId1";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 45;
+            }
+        };
+
+        extContext.recordFutureErrorsIfMissing(mockParsedTagSpec, locator);
+        final List<ValidatorProtos.ValidationError> errors = extContext.missingExtensionErrors();
+
+        Assert.assertEquals(errors.size(), 1);
+        Assert.assertEquals(errors.get(0).getCode(), ValidatorProtos.ValidationError.Code.MISSING_REQUIRED_EXTENSION);
+        Assert.assertEquals(errors.get(0).getSeverity(), ValidatorProtos.ValidationError.Severity.ERROR);
+        Assert.assertEquals(errors.get(0).getLine(), 23);
+        Assert.assertEquals(errors.get(0).getCol(), 45);
+        Assert.assertEquals(errors.get(0).getSpecUrl(), "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup");
+        Assert.assertEquals(errors.get(0).getParamsList().size(), 2);
+        Assert.assertEquals(errors.get(0).getParamsList().get(0), "test_parent");
+        Assert.assertEquals(errors.get(0).getParamsList().get(1), "amp-form");
+
+    }
+
+    @Test
+    public void testUpdateFromtagResultsNullbestMatchTagSpec() {
+        final ExtensionsContext extContext = new ExtensionsContext();
+
+        ValidateTagResult mockTagResult = Mockito.mock(ValidateTagResult.class);
+        Mockito.when(mockTagResult.getBestMatchTagSpec()).thenReturn(null);
+
+        extContext.updateFromTagResult(mockTagResult);
+        Assert.assertEquals(extContext.unusedExtensionsRequired().size(), 0);
+    }
+
+    @Test
+    public void testUpdateFromtagResults() {
+        final ExtensionsContext extContext = new ExtensionsContext();
+
+        ValidateTagResult mockTagResult = Mockito.mock(ValidateTagResult.class);
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        final ValidatorProtos.TagSpec tagSpec = ValidatorProtos.TagSpec.newBuilder()
+                .setExtensionSpec(ValidatorProtos.ExtensionSpec.newBuilder().setName("amp-date-picker")
+                        .setRequiresUsage(ValidatorProtos.ExtensionSpec.ExtensionUsageRequirement.GRANDFATHERED).build())
+                .addRequiresExtension("amp-form")
+                .setSpecName("test_parent").build();
+
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpec);
+        Mockito.when(mockTagResult.getBestMatchTagSpec()).thenReturn(mockParsedTagSpec);
+
+        extContext.updateFromTagResult(mockTagResult);
+
+        Assert.assertTrue(extContext.isExtensionLoaded("amp-date-picker"));
+        Assert.assertTrue(extContext.isExtensionLoaded("amp-ad"));
+
+        Assert.assertEquals(extContext.unusedExtensionsRequired().size(), 0);
+    }
+
+    @Test
+    public void testUpdateFromtagResultsError() {
+        final ExtensionsContext extContext = new ExtensionsContext();
+
+        ValidateTagResult mockTagResult = Mockito.mock(ValidateTagResult.class);
+
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+        final ValidatorProtos.TagSpec tagSpec = ValidatorProtos.TagSpec.newBuilder()
+                .setExtensionSpec(ValidatorProtos.ExtensionSpec.newBuilder().setName("amp-date-picker")
+                        .setRequiresUsage(ValidatorProtos.ExtensionSpec.ExtensionUsageRequirement.ERROR).build())
+                .addRequiresExtension("amp-form")
+                .setSpecName("test_parent").build();
+
+        Mockito.when(mockParsedTagSpec.getSpec()).thenReturn(tagSpec);
+        Mockito.when(mockTagResult.getBestMatchTagSpec()).thenReturn(mockParsedTagSpec);
+
+        extContext.updateFromTagResult(mockTagResult);
+
+        Assert.assertTrue(extContext.isExtensionLoaded("amp-date-picker"));
+        Assert.assertTrue(extContext.isExtensionLoaded("amp-ad"));
+        Assert.assertEquals(extContext.unusedExtensionsRequired().size(), 1);
+        Assert.assertEquals(extContext.unusedExtensionsRequired().get(0), "amp-date-picker");
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedAttrSpecTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedAttrSpecTest.java
new file mode 100644
index 0000000000000..b640c3db5cafd
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedAttrSpecTest.java
@@ -0,0 +1,70 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import com.google.common.collect.ImmutableList;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link ParsedAttrSpec}
+ *
+ * @author sphatak01
+ */
+public class ParsedAttrSpecTest {
+
+    @Test
+    public void testGettersSetters() {
+        final ValidatorProtos.AttrSpec.Builder attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+        attrSpecBuilder.addCssDeclaration(ValidatorProtos.CssDeclaration.newBuilder().setName("content")
+                .addValueCasei("fill").build());
+
+        final ValidatorProtos.UrlSpec valueUrl = ValidatorProtos.UrlSpec.newBuilder().addProtocol("https").build();
+        attrSpecBuilder.setValueUrl(valueUrl);
+
+        final ValidatorProtos.PropertySpecList.Builder propBuilder = ValidatorProtos.PropertySpecList.newBuilder();
+        propBuilder.addProperties(ValidatorProtos.PropertySpec.newBuilder().setMandatory(true).setName("height").setValue("40").build());
+
+        attrSpecBuilder.setValueProperties(propBuilder.build());
+        attrSpecBuilder.addEnabledBy("transformation");
+
+        final ValidatorProtos.AttrSpec attrSpec = attrSpecBuilder.build();
+        final ParsedAttrSpec parsedAttrSpec = new ParsedAttrSpec(attrSpec, "content");
+
+        Assert.assertEquals(parsedAttrSpec.getAttrName(), "content");
+        Assert.assertEquals(parsedAttrSpec.getSpec(), attrSpec);
+
+        Assert.assertNotNull(parsedAttrSpec.getValuePropertiesOrNull());
+        Assert.assertEquals(parsedAttrSpec.getValuePropertiesOrNull().getMandatoryValuePropertyNames().size(), 1);
+        Assert.assertEquals(parsedAttrSpec.getValuePropertiesOrNull().getMandatoryValuePropertyNames().get(0), "height");
+
+        Assert.assertEquals(parsedAttrSpec.getCssDeclarationByName().get("content").getValueCasei(0), "fill");
+        Assert.assertTrue(parsedAttrSpec.isUsedForTypeIdentifiers(ImmutableList.of("transformation")));
+
+        Assert.assertTrue(parsedAttrSpec.getValueUrlSpec().isAllowedProtocol("https"));
+
+        parsedAttrSpec.cleanup();
+
+        Assert.assertNull(parsedAttrSpec.getAttrName());
+        Assert.assertNull(parsedAttrSpec.getSpec());
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedAttrSpecsTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedAttrSpecsTest.java
new file mode 100644
index 0000000000000..7e1883149b5c8
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedAttrSpecsTest.java
@@ -0,0 +1,77 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import com.google.common.collect.ImmutableList;
+import com.google.common.collect.ImmutableMap;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.util.Collections;
+import java.util.Map;
+
+/**
+ * Tests for {@link ParsedAttrSpecs}
+ *
+ * @author sphatak01
+ */
+public class ParsedAttrSpecsTest {
+
+    @Test
+    public void testGettersSetters() {
+        final AMPValidatorManager validationManager = Mockito.mock(AMPValidatorManager.class);
+
+        final ValidatorProtos.AttrSpec.Builder attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+        attrSpecBuilder.addEnabledBy("transformation");
+
+        final ValidatorProtos.AttrSpec attrSpec = attrSpecBuilder.build();
+
+        final ParsedAttrSpecs parsedAttrSpecs = new ParsedAttrSpecs(validationManager);
+
+        // first time doesn't exist in map
+        Assert.assertNotNull(parsedAttrSpecs.getParsedAttrSpec("a", "b", attrSpec));
+
+        //second time exists in map
+        Assert.assertNotNull(parsedAttrSpecs.getParsedAttrSpec("a", "b", attrSpec));
+
+        Mockito.when(validationManager.getAttrListMap()).thenReturn(Collections.emptyMap());
+
+        Assert.assertEquals(parsedAttrSpecs.getAttrListByName("content").size(), 0);
+
+        final Map<String, ValidatorProtos.AttrList> attrListMap = ImmutableMap.of("content", ValidatorProtos.AttrList.newBuilder()
+                .addAttrs(ValidatorProtos.AttrSpec.newBuilder().setName("color").build()).build());
+        Mockito.when(validationManager.getAttrListMap()).thenReturn(attrListMap);
+
+        Assert.assertEquals(parsedAttrSpecs.getAttrListByName("content").size(), 1);
+
+        Mockito.when(validationManager.getGlobalAttrs()).thenReturn(ImmutableList.of(ValidatorProtos.AttrSpec.newBuilder().setName("itemprop").build()));
+        Assert.assertEquals(parsedAttrSpecs.getGlobalAttrs().size(), 1);
+        Assert.assertEquals(parsedAttrSpecs.getGlobalAttrs().get(0).getName(), "itemprop");
+
+        Mockito.when(validationManager.getAmpLayoutAttrs()).thenReturn(ImmutableList.of(ValidatorProtos.AttrSpec.newBuilder().setName("NODISPLAY").build()));
+        Assert.assertEquals(parsedAttrSpecs.getAmpLayoutAttrs().size(), 1);
+        Assert.assertEquals(parsedAttrSpecs.getAmpLayoutAttrs().get(0).getName(), "NODISPLAY");
+
+        parsedAttrSpecs.cleanup();
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedHtmlTagTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedHtmlTagTest.java
new file mode 100644
index 0000000000000..4f852af64fb0a
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedHtmlTagTest.java
@@ -0,0 +1,72 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Attributes;
+
+/**
+ * Tests for {@link ParsedHtmlTag}
+ *
+ * @author sphatak01
+ */
+
+public class ParsedHtmlTagTest {
+
+    @Test
+    public void testgettersSetters() {
+        final Attributes attrs = Mockito.mock(Attributes.class);
+        Mockito.when(attrs.getLocalName(0)).thenReturn("crossorigin");
+        Mockito.when(attrs.getValue(0)).thenReturn("true");
+
+        final ParsedHtmlTag parsedHtmltag = new ParsedHtmlTag("TITLE", attrs);
+
+        Assert.assertNull(parsedHtmltag.hasDuplicateAttrs());
+
+        Mockito.when(attrs.getLength()).thenReturn(1);
+
+        Assert.assertFalse(parsedHtmltag.isEmpty());
+        Assert.assertEquals(parsedHtmltag.lowerName(), "title");
+        Assert.assertEquals(parsedHtmltag.upperName(), "TITLE");
+        Assert.assertEquals(parsedHtmltag.attrs(), attrs);
+
+        Assert.assertEquals(parsedHtmltag.attrsByKey().get("crossorigin"), "true");
+
+        // second time should be populated
+        Assert.assertEquals(parsedHtmltag.attrsByKey().get("crossorigin"), "true");
+
+        Assert.assertNull(parsedHtmltag.hasDuplicateAttrs());
+
+        Assert.assertEquals(parsedHtmltag.getValue("crossorigin", 0), "true");
+
+        Mockito.when(attrs.getLength()).thenReturn(2);
+        Mockito.when(attrs.getLocalName(1)).thenReturn("crossorigin");
+        Mockito.when(attrs.getValue(1)).thenReturn("false");
+
+        Assert.assertEquals(parsedHtmltag.hasDuplicateAttrs(), "crossorigin");
+
+        parsedHtmltag.cleanup();
+
+    }
+}
\ No newline at end of file
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedReferencePointsTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedReferencePointsTest.java
new file mode 100644
index 0000000000000..6ae68eb973337
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedReferencePointsTest.java
@@ -0,0 +1,66 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Tests for {@link ParsedReferencePoints}
+ *
+ * @author sphatak01
+ */
+
+public class ParsedReferencePointsTest {
+
+    @Test
+    public void testGettersSetters() {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder1 = ValidatorProtos.ReferencePoint.newBuilder();
+        refPointBuilder1.setTagSpecName("AMP-NEXT-PAGE > [separator]");
+        refPointBuilder1.setUnique(true);
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder2 = ValidatorProtos.ReferencePoint.newBuilder();
+        refPointBuilder2.setTagSpecName("amp-next-page extension .json configuration");
+        refPointBuilder2.setUnique(false);
+
+        tagSpecBuilder.addReferencePoints(refPointBuilder1.build());
+        tagSpecBuilder.addReferencePoints(refPointBuilder2.build());
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#svg");
+        tagSpecBuilder.setSpecName("lineargradient > stop");
+
+        final ParsedReferencePoints parsedReferencePoints = new ParsedReferencePoints(tagSpecBuilder.build());
+        Assert.assertFalse(parsedReferencePoints.empty());
+        Assert.assertEquals(parsedReferencePoints.size(), 2);
+        Assert.assertEquals(parsedReferencePoints.iterate().get(0).getTagSpecName(), "AMP-NEXT-PAGE > [separator]");
+        Assert.assertTrue(parsedReferencePoints.iterate().get(0).getUnique());
+        Assert.assertEquals(parsedReferencePoints.iterate().get(1).getTagSpecName(),
+                "amp-next-page extension .json configuration");
+        Assert.assertFalse(parsedReferencePoints.iterate().get(1).getUnique());
+        Assert.assertEquals(parsedReferencePoints.parentSpecUrl(),
+                "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#svg");
+        Assert.assertEquals(parsedReferencePoints.parentTagSpecName(), "lineargradient > stop");
+
+        parsedReferencePoints.cleanup();
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedTagSpecTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedTagSpecTest.java
new file mode 100644
index 0000000000000..20a5db63a6c63
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedTagSpecTest.java
@@ -0,0 +1,149 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import com.google.common.collect.ImmutableList;
+import dev.amp.validator.exception.TagValidationException;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Locator;
+
+import static org.mockito.Matchers.any;
+import static org.mockito.Matchers.anyString;
+import static org.mockito.Mockito.mock;
+import static org.mockito.Mockito.when;
+
+/**
+ * Test for {@link ParsedTagSpec}
+ *
+ * @author sphatak01
+ */
+public class ParsedTagSpecTest {
+
+
+    /**
+     * Tests for {@link ParsedTagSpec}
+     */
+    @Test
+    public void testConstructor() throws TagValidationException {
+
+        final ParsedAttrSpecs parsedAttrSpecs = mock(ParsedAttrSpecs.class);
+        final RecordValidated shouldRecordTagsValidated = RecordValidated.NEVER;
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        final int id = 23;
+
+        tagSpecBuilder.setAmpLayout(ValidatorProtos.AmpLayout.newBuilder()
+                .addSupportedLayouts(ValidatorProtos.AmpLayout.Layout.INTRINSIC).build());
+
+
+        final ValidatorProtos.AttrSpec.Builder attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+        attrSpecBuilder.setName("content");
+
+        final ValidatorProtos.AttrSpec.Builder attrSpecBuilder2 = ValidatorProtos.AttrSpec.newBuilder();
+        attrSpecBuilder2.setName("content");
+
+        when(parsedAttrSpecs.getAmpLayoutAttrs()).thenReturn(ImmutableList.of(attrSpecBuilder.build(), attrSpecBuilder2.build()));
+
+        final ValidatorProtos.AttrSpec.Builder attrSpecBuilder3 = ValidatorProtos.AttrSpec.newBuilder();
+        attrSpecBuilder3.setName("height");
+        attrSpecBuilder3.addValueCasei("_top");
+        tagSpecBuilder.addAttrs(attrSpecBuilder3.build());
+
+        final ValidatorProtos.CdataSpec.Builder cDataBuilder = ValidatorProtos.CdataSpec.newBuilder();
+        cDataBuilder.addBlacklistedCdataRegex(ValidatorProtos.BlackListedCDataRegex.newBuilder().setRegex("4").build());
+        final ValidatorProtos.CdataSpec cDataSpec = cDataBuilder.build();
+
+        tagSpecBuilder.setCdata(cDataSpec);
+
+        final ValidatorProtos.AttrSpec.Builder attrSpecBuilder4 = ValidatorProtos.AttrSpec.newBuilder();
+        when(parsedAttrSpecs.getGlobalAttrs()).thenReturn(ImmutableList.of(attrSpecBuilder4.build()));
+
+        final ParsedAttrSpec parsedHeightSpec = mock(ParsedAttrSpec.class);
+        final ValidatorProtos.AttrSpec.Builder heightSpec = ValidatorProtos.AttrSpec.newBuilder();
+        heightSpec.setMandatory(true);
+        heightSpec.setMandatoryOneof("data-momentid");
+        heightSpec.setMandatoryAnyof("src");
+        heightSpec.addAlternativeNames("ht");
+        heightSpec.setImplicit(true);
+        heightSpec.setValueUrl(ValidatorProtos.UrlSpec.newBuilder().addProtocol("http").build());
+        heightSpec.addRequiresExtension("amp-form");
+
+        when(parsedHeightSpec.getSpec()).thenReturn(heightSpec.build());
+
+        when(parsedAttrSpecs.getParsedAttrSpec(anyString(), anyString(), any(ValidatorProtos.AttrSpec.class))).thenReturn(parsedHeightSpec);
+
+        tagSpecBuilder.setChildTags(ValidatorProtos.ChildTagSpec.newBuilder().setMandatoryMinNumChildTags(1).build());
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+
+        final ParsedTagSpec parsedTagSpec = new ParsedTagSpec(parsedAttrSpecs, shouldRecordTagsValidated,
+                tagSpec, id);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 42;
+            }
+        };
+
+
+        Assert.assertEquals(parsedTagSpec.getSpec(), tagSpec);
+        Assert.assertEquals(parsedTagSpec.cdataMatcher(locator).getTagSpec(), tagSpec);
+        Assert.assertEquals(parsedTagSpec.cdataMatcher(locator).getLineCol().getColumnNumber(), 42);
+        Assert.assertEquals(parsedTagSpec.cdataMatcher(locator).getLineCol().getLineNumber(), 23);
+        parsedTagSpec.childTagMatcher();
+        //Assert.assertEquals(parsedTagSpec.referencePointMatcher(mock(ParsedValidatorRules.class), locator).getLineCol().getLineNumber(), 23);
+        Assert.assertFalse(parsedTagSpec.hasReferencePoints());
+        Assert.assertNotNull(parsedTagSpec.getReferencePoints());
+        Assert.assertTrue(parsedTagSpec.attrsCanSatisfyExtension());
+        Assert.assertTrue(parsedTagSpec.hasAttrWithName("height"));
+        Assert.assertEquals(parsedTagSpec.getImplicitAttrspecs().size(), 2);
+        Assert.assertEquals(parsedTagSpec.getImplicitAttrspecs().get(0).getName(), "height");
+        Assert.assertEquals(parsedTagSpec.getAttrsByName().size(), 4);
+        Assert.assertTrue(parsedTagSpec.getAttrsByName().containsKey("height"));
+        Assert.assertTrue(parsedTagSpec.getAttrsByName().containsKey("content"));
+        Assert.assertTrue(parsedTagSpec.getAttrsByName().containsKey("ht"));
+        Assert.assertTrue(parsedTagSpec.getAttrsByName().containsKey(""));
+        Assert.assertEquals(parsedTagSpec.getMandatoryOneofs().size(), 1);
+        Assert.assertTrue(parsedTagSpec.getMandatoryOneofs().contains("data-momentid"));
+        Assert.assertEquals(parsedTagSpec.getMandatoryAnyofs().size(), 1);
+        Assert.assertTrue(parsedTagSpec.getMandatoryAnyofs().contains("src"));
+        Assert.assertEquals(parsedTagSpec.getMandatoryAttrIds().size(), 1);
+        Assert.assertEquals(parsedTagSpec.id(), 23);
+
+        parsedTagSpec.cleanup();
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedUrlSpecTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedUrlSpecTest.java
new file mode 100644
index 0000000000000..544ebc738ceea
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedUrlSpecTest.java
@@ -0,0 +1,51 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link ParsedUrlSpec}
+ *
+ * @author sphatak01
+ */
+public class ParsedUrlSpecTest {
+
+    @Test
+    public void testGetterSetters() {
+        final ValidatorProtos.UrlSpec.Builder specBuilder = ValidatorProtos.UrlSpec.newBuilder();
+        specBuilder.addProtocol("http");
+        specBuilder.addProtocol("https");
+
+        final ValidatorProtos.UrlSpec spec = specBuilder.build();
+        final ParsedUrlSpec parsedSpec = new ParsedUrlSpec(spec);
+
+        Assert.assertEquals(parsedSpec.getSpec(), spec);
+        Assert.assertTrue(parsedSpec.isAllowedProtocol("http"));
+        Assert.assertTrue(parsedSpec.isAllowedProtocol("https"));
+        Assert.assertFalse(parsedSpec.isAllowedProtocol("random-http"));
+
+        parsedSpec.cleanup();
+
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedValidatorRulesTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedValidatorRulesTest.java
new file mode 100644
index 0000000000000..74181a75ff8b2
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedValidatorRulesTest.java
@@ -0,0 +1,857 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+
+package dev.amp.validator;
+
+import com.google.common.collect.ImmutableList;
+import com.google.common.collect.ImmutableMap;
+import com.google.common.collect.ImmutableSet;
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.exception.ValidatorException;
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.BeforeMethod;
+import org.testng.annotations.Test;
+import org.xml.sax.Attributes;
+import org.xml.sax.Locator;
+
+import java.util.Collections;
+import java.util.List;
+import java.util.regex.Pattern;
+
+/**
+ * Tests for {@link ParsedValidatorRules}
+ *
+ * @author sphatak01
+ */
+public class ParsedValidatorRulesTest {
+
+    @BeforeMethod
+    public void init() {
+        htmlFormatCode = ValidatorProtos.HtmlFormat.Code.AMP4EMAIL;
+
+        mockValidationManager = Mockito.mock(AMPValidatorManager.class);
+        Mockito.when(mockValidationManager.getDispatchKeyByTagSpecId(3)).thenReturn("NAME_VALUE_DISPATCH");
+
+        rulesBuilder = ValidatorProtos.ValidatorRules.newBuilder();
+        rulesBuilder.addTags(ValidatorProtos.TagSpec.newBuilder()
+                .addHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL)
+                .setExtensionSpec(ValidatorProtos.ExtensionSpec.newBuilder()
+                        .setDeprecatedAllowDuplicates(true).setName("amp-lightbox-gallery").addVersion("1.0").build())
+                .addAlsoRequiresTagWarning("amp-ad extension .js script")
+                .setSpecName("SCRIPT")
+                .setTagName("SCRIPT")
+                .addRequires("requires")
+                .addExcludes("excludes")
+                .setMandatory(true)
+                .build());
+        // different html format
+        rulesBuilder.addTags(ValidatorProtos.TagSpec.newBuilder()
+                .setTagName("AMP-STICKY-AD")
+                .setExtensionSpec(ValidatorProtos.ExtensionSpec.newBuilder()
+                        .setName("amp-inputmask")
+                        .build())
+                .addHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP)
+                .build());
+        rulesBuilder.addTags(ValidatorProtos.TagSpec.newBuilder()
+                .addHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL)
+                .setMandatoryAlternatives("alternatives")
+                .setSpecName("AMP-CAROUSEL lightbox")
+                .build());
+        rulesBuilder.addTags(ValidatorProtos.TagSpec.newBuilder()
+                .addHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL)
+                .setMandatory(true)
+                .addDisabledBy("transformed")
+                .setSpecName("amp-consent [type]")
+                .setMandatoryAlternatives("not-alternatives")
+                .build());
+        rulesBuilder.addTags(ValidatorProtos.TagSpec.newBuilder()
+                .setTagName("$REFERENCE_POINT")
+                .setSpecName("AMP-SELECTOR option")
+                .addHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP)
+                .build());
+        rulesBuilder.addTags(ValidatorProtos.TagSpec.newBuilder()
+                .addHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL)
+                .setSpecName("amp-ad extension .js script")
+                .setTagName("amp-ad extension .js script")
+                .build());
+
+        rulesBuilder.addErrorFormats(ValidatorProtos.ErrorFormat.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING)
+                .setFormat("The mandatory tag '%1' is missing or incorrect.")
+                .build());
+        rulesBuilder.addErrorFormats(ValidatorProtos.ErrorFormat.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG)
+                .setFormat("The tag '%1' is disallowed.")
+                .build());
+        rulesBuilder.addErrorFormats(ValidatorProtos.ErrorFormat.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE)
+                .setFormat("The property '%1' is missing from attribute '%2' in tag '%3'.")
+                .build());
+        rulesBuilder.addErrorFormats(ValidatorProtos.ErrorFormat.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE)
+                .setFormat("SS syntax error in tag '%1' - the property '%2' is set to the disallowed value '%3'. Allowed values: %4.")
+                .build());
+
+        rulesBuilder.addErrorSpecificity(ValidatorProtos.ErrorSpecificity.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING)
+                .setSpecificity(0)
+                .build());
+        rulesBuilder.addErrorSpecificity(ValidatorProtos.ErrorSpecificity.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG)
+                .setSpecificity(0)
+                .build());
+        rulesBuilder.addErrorSpecificity(ValidatorProtos.ErrorSpecificity.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE)
+                .setSpecificity(33)
+                .build());
+        rulesBuilder.addErrorSpecificity(ValidatorProtos.ErrorSpecificity.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE)
+                .setSpecificity(0)
+                .build());
+        rulesBuilder.setStylesSpecUrl(STYLES_SPEC_URL);
+        rulesBuilder.setScriptSpecUrl(SCRIPT_SPEC_URL);
+        rulesBuilder.setTemplateSpecUrl(TEMPLATE_SPEC_URL);
+        rulesBuilder.addCssLengthSpec(ValidatorProtos.CssLengthSpec.newBuilder()
+                .setHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL)
+                .setMaxBytes(MAX_BYTES)
+                .build());
+        rulesBuilder.addCssLengthSpec(ValidatorProtos.CssLengthSpec.newBuilder()
+                .setHtmlFormat(ValidatorProtos.HtmlFormat.Code.AMP)
+                .build());
+
+        Mockito.when(mockValidationManager.getRules()).thenReturn(rulesBuilder);
+    }
+
+    @Test
+    public void testRegex() {
+        final ValidatorProtos.HtmlFormat.Code htmlFormatCode = ValidatorProtos.HtmlFormat.Code.AMP4EMAIL;
+        final AMPValidatorManager mockValidationManager = Mockito.mock(AMPValidatorManager.class);
+        Mockito.when(mockValidationManager.getDispatchKeyByTagSpecId(0)).thenReturn("NAME_VALUE_DISPATCH");
+        Mockito.when(mockValidationManager.getDispatchKeyByTagSpecId(1)).thenReturn(null);
+
+        final ValidatorProtos.ValidatorRules.Builder rulesBuilder = ValidatorProtos.ValidatorRules.newBuilder();
+        rulesBuilder.addTags(ValidatorProtos.TagSpec.newBuilder()
+                .setExtensionSpec(ValidatorProtos.ExtensionSpec.newBuilder()
+                        .setDeprecatedAllowDuplicates(true).setName("amp-lightbox-gallery").addVersion("1.0").build())
+                .setSpecName("SCRIPT")
+                .build());
+        rulesBuilder.addErrorFormats(ValidatorProtos.ErrorFormat.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG)
+                .setFormat("The tag '%1' is disallowed.")
+                .build());
+        rulesBuilder.addErrorSpecificity(ValidatorProtos.ErrorSpecificity.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG)
+                .setSpecificity(8)
+                .build());
+        Mockito.when(mockValidationManager.getRules()).thenReturn(rulesBuilder);
+
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        final Pattern pattern = rules.getFullMatchRegex("[0-9]+");
+
+        Assert.assertTrue(pattern.matcher("98").matches());
+
+        final Pattern pattern1 = rules.getFullMatchCaseiRegex("[0-9a-f]+");
+
+        Assert.assertTrue(pattern1.matcher("a1").matches());
+
+        final Pattern pattern2 = rules.getPartialMatchCaseiRegex("[0-9a-f]");
+
+        Assert.assertTrue(pattern2.matcher("a").matches());
+
+        rules.getFullMatchRegex("[0-9a-d]{2}");
+        rules.getFullMatchCaseiRegex("[0-9a-d]{3}");
+        rules.getPartialMatchCaseiRegex("[0-9a-d]{4}");
+
+        Assert.assertTrue(rules.getFullMatchRegex("[0-9]+").matcher("98").matches());
+        Assert.assertTrue(rules.getFullMatchCaseiRegex("[0-9a-f]+").matcher("a1").matches());
+        Assert.assertTrue(rules.getPartialMatchCaseiRegex("[0-9a-f]").matcher("a").matches());
+    }
+
+    @Test
+    public void testRefPointName() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Mockito.when(mockValidationManager.getTagSpecIdByReferencePointTagSpecName(Mockito.anyString())).thenReturn(4);
+
+        String refPointName = rules.getReferencePointName(ValidatorProtos.ReferencePoint.newBuilder().setTagSpecName("AMP-CAROUSEL lightbox").build());
+
+        Assert.assertEquals(refPointName, "AMP-SELECTOR option");
+
+    }
+
+    @Test
+    public void testTagSpecGetters() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Mockito.when(mockValidationManager.getTagSpecIdByReferencePointTagSpecName(Mockito.anyString())).thenReturn(2);
+
+        ParsedTagSpec tagSpec = rules.getByTagSpecId("AMP-CAROUSEL lightbox");
+
+        Assert.assertEquals(tagSpec.getSpec().getSpecName(), "AMP-CAROUSEL lightbox");
+
+        Assert.assertEquals(rules.getTagSpecIdBySpecName("AMP-CAROUSEL lightbox").intValue(), 2);
+
+        Assert.assertEquals(rules.getByTagSpecId(2).getSpec().getSpecName(), "AMP-CAROUSEL lightbox");
+
+        Mockito.when(mockValidationManager.getTagSpecIdByReferencePointTagSpecName(Mockito.anyString())).thenReturn(4);
+        Assert.assertEquals(rules.getTagSpecIdByReferencePointTagSpecName("AMP-SELECTOR option"), 4);
+    }
+
+    @Test
+    public void testBetterValidationResultThan() throws ValidatorException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        ValidatorProtos.ValidationResult.Builder resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        ValidatorProtos.ValidationResult.Builder resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+        Assert.assertTrue(rules.betterValidationResultThan(resultA, resultB));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+
+        Assert.assertTrue(rules.betterValidationResultThan(resultA, resultB));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+
+        Assert.assertFalse(rules.betterValidationResultThan(resultA, resultB));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+
+        Assert.assertTrue(rules.betterValidationResultThan(resultA, resultB));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE).build());
+
+        Assert.assertFalse(rules.betterValidationResultThan(resultA, resultB));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE).build());
+
+
+        Assert.assertTrue(rules.betterValidationResultThan(resultA, resultB));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE).build());
+
+
+        Assert.assertFalse(rules.betterValidationResultThan(resultA, resultB));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+
+
+        Assert.assertFalse(rules.betterValidationResultThan(resultA, resultB));
+
+    }
+
+    @Test
+    public void testTypeIdentifiersDevAndDisallowedAttr() {
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+
+        Mockito.when(mockAttrs.getLength()).thenReturn(4);
+        Mockito.when(mockAttrs.getLocalName(0)).thenReturn("amp4email");
+        Mockito.when(mockAttrs.getLocalName(1)).thenReturn("transformed");
+        Mockito.when(mockAttrs.getValue(1)).thenReturn("google;v=1");
+        Mockito.when(mockAttrs.getLocalName(2)).thenReturn("data-ampdevmode");
+        Mockito.when(mockAttrs.getLocalName(3)).thenReturn("amp4ads");
+
+        final List<String> formatIdentifiers = ImmutableList.of("transformed", "data-ampdevmode", "amp4email");
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final ValidatorProtos.ValidationResult.Builder validationResult = ValidatorProtos.ValidationResult.newBuilder();
+        validationResult.addTypeIdentifier("transformed");
+
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        rules.validateTypeIdentifiers(mockAttrs, formatIdentifiers, mockContext, validationResult);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        Mockito.verify(mockContext, Mockito.times(2)).addError(errorCodeCapture.capture(),
+                Mockito.any(Locator.class),
+                listCaptor.capture(),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Assert.assertEquals(errorCodeCapture.getAllValues().get(0), ValidatorProtos.ValidationError.Code.DEV_MODE_ONLY);
+        Assert.assertEquals(errorCodeCapture.getAllValues().get(1), ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR);
+
+        final List<List> params = listCaptor.getAllValues();
+        Assert.assertEquals(params.size(), 2);
+
+        Assert.assertEquals(params.get(0).size(), 0);
+
+        Assert.assertEquals(params.get(1).size(), 2);
+        Assert.assertEquals(params.get(1).get(0), "amp4ads");
+        Assert.assertEquals(params.get(1).get(1), "html");
+    }
+
+    @Test
+    public void testTypeIdentifiersInvalidAttrAndMandatoryAttrMissing() {
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+
+        Mockito.when(mockAttrs.getLength()).thenReturn(4);
+        Mockito.when(mockAttrs.getLocalName(0)).thenReturn("transformed");
+        Mockito.when(mockAttrs.getValue(0)).thenReturn("google;v=abc");
+
+        final List<String> formatIdentifiers = ImmutableList.of("transformed", "data-ampdevmode");
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final ValidatorProtos.ValidationResult.Builder validationResult = ValidatorProtos.ValidationResult.newBuilder();
+        validationResult.addTypeIdentifier("transformed");
+
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        rules.validateTypeIdentifiers(mockAttrs, formatIdentifiers, mockContext, validationResult);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        Mockito.verify(mockContext, Mockito.times(2)).addError(errorCodeCapture.capture(),
+                Mockito.any(Locator.class),
+                listCaptor.capture(),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Assert.assertEquals(errorCodeCapture.getAllValues().get(0), ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE);
+        Assert.assertEquals(errorCodeCapture.getAllValues().get(1), ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING);
+
+        final List<List> params = listCaptor.getAllValues();
+        Assert.assertEquals(params.size(), 2);
+
+        Assert.assertEquals(params.get(0).size(), 3);
+        Assert.assertEquals(params.get(0).get(0), "transformed");
+        Assert.assertEquals(params.get(0).get(1), "html");
+        Assert.assertEquals(params.get(0).get(2), "google;v=abc");
+
+        Assert.assertEquals(params.get(1).size(), 2);
+        Assert.assertEquals(params.get(1).get(0), "transformed");
+        Assert.assertEquals(params.get(1).get(1), "html");
+    }
+
+    @Test
+    public void testValidateHtmlTag() {
+        ValidatorProtos.HtmlFormat.Code testHtmlFormatCode = ValidatorProtos.HtmlFormat.Code.AMP4EMAIL;
+        ParsedValidatorRules rules = new ParsedValidatorRules(testHtmlFormatCode, mockValidationManager);
+
+        final ParsedHtmlTag mockParsedHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockParsedHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        Context mockContext = Mockito.mock(Context.class);
+
+        final ValidatorProtos.ValidationResult.Builder validationResult = ValidatorProtos.ValidationResult.newBuilder();
+
+        rules.validateHtmlTag(mockParsedHtmlTag, mockContext, validationResult);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+
+
+        testHtmlFormatCode = ValidatorProtos.HtmlFormat.Code.AMP4ADS;
+        mockContext = Mockito.mock(Context.class);
+
+        rules = new ParsedValidatorRules(testHtmlFormatCode, mockValidationManager);
+        rules.validateHtmlTag(mockParsedHtmlTag, mockContext, validationResult);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        testHtmlFormatCode = ValidatorProtos.HtmlFormat.Code.AMP4EMAIL;
+        mockContext = Mockito.mock(Context.class);
+
+        rules = new ParsedValidatorRules(testHtmlFormatCode, mockValidationManager);
+        rules.validateHtmlTag(mockParsedHtmlTag, mockContext, validationResult);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        testHtmlFormatCode = ValidatorProtos.HtmlFormat.Code.ACTIONS;
+        mockContext = Mockito.mock(Context.class);
+
+        rules = new ParsedValidatorRules(testHtmlFormatCode, mockValidationManager);
+        rules.validateHtmlTag(mockParsedHtmlTag, mockContext, validationResult);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        Mockito.verify(mockContext, Mockito.times(2))
+                .addError(errorCodeCapture.capture(),
+                    Mockito.any(Locator.class),
+                    listCaptor.capture(),
+                    Mockito.anyString(),
+                    Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Assert.assertEquals(errorCodeCapture.getAllValues().get(1), ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING);
+        Assert.assertEquals(listCaptor.getAllValues().get(1).size(), 2);
+        Assert.assertEquals(listCaptor.getAllValues().get(1).get(0), "actions");
+        Assert.assertEquals(listCaptor.getAllValues().get(1).get(1), "html");
+    }
+
+    @Test
+    public void testSpecificity() throws ValidatorException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Assert.assertEquals(rules.specificity(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG), 0);
+
+        Assert.assertEquals(rules.maxSpecificity(ImmutableList.of(
+                ValidatorProtos.ValidationError.newBuilder()
+                        .setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG)
+                        .build(),
+                ValidatorProtos.ValidationError.newBuilder()
+                        .setCode(ValidatorProtos.ValidationError.Code.MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE)
+                        .build())), 33);
+
+    }
+
+    @Test
+    public void testIsErrorSubset() {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        ValidatorProtos.ValidationResult.Builder resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        ValidatorProtos.ValidationResult.Builder resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+
+        Assert.assertFalse(rules.isErrorSubset(resultA.getErrorsList(), resultB.getErrorsList()));
+
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultB.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+
+        Assert.assertTrue(rules.isErrorSubset(resultA.getErrorsList(), resultB.getErrorsList()));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING).build());
+        resultA.addErrors(ValidatorProtos.ValidationError.newBuilder().setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG).build());
+
+    }
+
+    @Test(expectedExceptions = ValidatorException.class, expectedExceptionsMessageRegExp = "Status unknown")
+    public void testBetterValidationStatusThan() throws ValidatorException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        ValidatorProtos.ValidationResult.Builder resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        ValidatorProtos.ValidationResult.Builder resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        Assert.assertFalse(rules.betterValidationStatusThan(resultA.getStatus(), resultB.getStatus()));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+        Assert.assertTrue(rules.betterValidationStatusThan(resultA.getStatus(), resultB.getStatus()));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        Assert.assertFalse(rules.betterValidationStatusThan(resultA.getStatus(), resultB.getStatus()));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.UNKNOWN);
+
+        Assert.assertTrue(rules.betterValidationStatusThan(resultA.getStatus(), resultB.getStatus()));
+
+        resultA = ValidatorProtos.ValidationResult.newBuilder();
+        resultA.setStatus(ValidatorProtos.ValidationResult.Status.UNKNOWN);
+
+        resultB = ValidatorProtos.ValidationResult.newBuilder();
+        resultB.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+        rules.betterValidationStatusThan(resultA.getStatus(), resultB.getStatus());
+    }
+
+    @Test
+    public void testDispatchForTagName() {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Assert.assertTrue(rules.dispatchForTagName("SCRIPT").allTagSpecs().isEmpty());
+    }
+
+    @Test
+    public void testSpecUrl() {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+        Assert.assertEquals(rules.getStylesSpecUrl(), STYLES_SPEC_URL);
+        Assert.assertEquals(rules.getTemplateSpecUrl(), TEMPLATE_SPEC_URL);
+        Assert.assertEquals(rules.getScriptSpecUrl(), SCRIPT_SPEC_URL);
+
+    }
+
+    @Test
+    public void testCssLengthSpec() {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Assert.assertEquals(rules.getCssLengthSpec().get(0).getHtmlFormat(), ValidatorProtos.HtmlFormat.Code.AMP4EMAIL);
+    }
+
+    @Test
+    public void testDescendantTagLists() {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Mockito.when(mockValidationManager.getDescendantTagLists())
+                .thenReturn(Collections.singletonList(ValidatorProtos.DescendantTagList.newBuilder()
+                        .addTag("tag1")
+                        .build()));
+
+        Assert.assertEquals(rules.getDescendantTagLists().get(0).getTag(0), "tag1");
+    }
+
+    @Test
+    public void testCombinedBlacklistedCdataRegex() {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Mockito.when(mockValidationManager.getCombinedBlacklistedCdataRegex(Mockito.anyInt()))
+                .thenReturn("\\d");
+
+        Assert.assertEquals(rules.getCombinedBlacklistedCdataRegex(1), "\\d");
+    }
+
+    @Test
+    public void testMaybeEmitValueSetMismatchErrors() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.valueSetsProvided()).thenReturn(ImmutableSet.of("a", "b"));
+        final ValidatorProtos.ValidationError mismatchError = ValidatorProtos.ValidationError.newBuilder()
+                .setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_PROPERTY_IN_ATTR_VALUE)
+                .build();
+        Mockito.when(mockContext.valueSetsRequired())
+                .thenReturn(ImmutableMap.of("a", ImmutableList.of(ValidatorProtos.ValidationError.newBuilder()
+                                .setCode(ValidatorProtos.ValidationError.Code.DISALLOWED_TAG)
+                                .build()),
+                "b", ImmutableList.of(ValidatorProtos.ValidationError.newBuilder()
+                                .setCode(ValidatorProtos.ValidationError.Code.EXTENSION_UNUSED)
+                                .build()),
+                        "c", ImmutableList.of(mismatchError)));
+
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        rules.maybeEmitValueSetMismatchErrors(mockContext, result);
+        Mockito.verify(mockContext, Mockito.times(1)).addBuiltError(mismatchError, result);
+    }
+
+    @Test
+    public void testMaybeEmitCssLengthSpecErrors() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getInlineStyleByteSize()).thenReturn(MAX_BYTES);
+        Mockito.when(mockContext.getStyleAmpCustomByteSize()).thenReturn(MAX_BYTES);
+
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        rules.maybeEmitCssLengthSpecErrors(mockContext, result);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.STYLESHEET_AND_INLINE_STYLE_TOO_LONG);
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 2);
+        Assert.assertEquals(params.get(0), "2000");
+        Assert.assertEquals(params.get(1), "1000");
+
+        mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getInlineStyleByteSize()).thenReturn(0);
+        rules.maybeEmitCssLengthSpecErrors(mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(0))
+                .addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                        Mockito.any(Locator.class),
+                        Mockito.anyListOf(String.class),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    }
+
+    @Test
+    public void testMaybeEmitMandatoryAlternativesSatisfiedErrors() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getMandatoryAlternativesSatisfied()).thenReturn(ImmutableList.of("alternatives"));
+
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        rules.maybeEmitMandatoryAlternativesSatisfiedErrors(mockContext, result);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING);
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "not-alternatives");
+
+    }
+
+    @Test
+    public void testMaybeEmitMandatoryTagValidationErrors() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.getTypeIdentifiers()).thenReturn(ImmutableList.of("transformed"));
+
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        rules.maybeEmitMandatoryTagValidationErrors(mockContext, result);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING);
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "SCRIPT");
+
+
+    }
+
+
+    @Test
+    public void testMaybeEmitAlsoRequiresTagValidationErrors() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Context mockContext = Mockito.mock(Context.class);
+        Mockito.when(mockContext.satisfiesCondition("requires")).thenReturn(false);
+        Mockito.when(mockContext.satisfiesCondition("excludes")).thenReturn(true);
+        Mockito.when(mockContext.getTagspecsValidated()).thenReturn(ImmutableMap.of(0, true,
+                1, true,
+                2, true,
+                3, true,
+                4, true));
+        final ExtensionsContext mockExtContext = Mockito.mock(ExtensionsContext.class);
+        Mockito.when(mockExtContext.unusedExtensionsRequired()).thenReturn(ImmutableList.of("unused_ext_1"));
+
+        Mockito.when(mockContext.getExtensions()).thenReturn(mockExtContext);
+
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+        rules.maybeEmitAlsoRequiresTagValidationErrors(mockContext, result);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        Mockito.verify(mockContext, Mockito.times(3))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addWarning(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<ValidatorProtos.ValidationError.Code> errorCodes = errorCodeCapture.getAllValues();
+        final List<List> params = listCaptor.getAllValues();
+
+        Assert.assertEquals(errorCodes.size(), 4);
+        Assert.assertEquals(errorCodes.get(0), ValidatorProtos.ValidationError.Code.TAG_REQUIRED_BY_MISSING);
+        Assert.assertEquals(errorCodes.get(1), ValidatorProtos.ValidationError.Code.TAG_EXCLUDED_BY_TAG);
+        Assert.assertEquals(errorCodes.get(2), ValidatorProtos.ValidationError.Code.EXTENSION_UNUSED);
+        Assert.assertEquals(errorCodes.get(3), ValidatorProtos.ValidationError.Code.WARNING_TAG_REQUIRED_BY_MISSING);
+
+        Assert.assertEquals(params.size(), 4);
+        Assert.assertEquals(params.get(0).size(), 2);
+        Assert.assertEquals(params.get(0).get(0), "requires");
+        Assert.assertEquals(params.get(0).get(1), "SCRIPT");
+
+        Assert.assertEquals(params.get(1).size(), 2);
+        Assert.assertEquals(params.get(1).get(0), "SCRIPT");
+        Assert.assertEquals(params.get(1).get(1), "excludes");
+
+        Assert.assertEquals(params.get(2).size(), 1);
+        Assert.assertEquals(params.get(2).get(0), "unused_ext_1");
+
+        Assert.assertEquals(params.get(3).size(), 2);
+        Assert.assertEquals(params.get(3).get(0), "amp-ad extension .js script");
+        Assert.assertEquals(params.get(3).get(1), "SCRIPT");
+    }
+
+    @Test
+    public void testmMybeEmitGlobalTagValidationErrors() throws TagValidationException {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        final ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+        Context mockContext = Mockito.mock(Context.class);
+        final ExtensionsContext mockExtContext = Mockito.mock(ExtensionsContext.class);
+        Mockito.when(mockExtContext.unusedExtensionsRequired()).thenReturn(ImmutableList.of("unused_ext_1"));
+        Mockito.when(mockContext.getExtensions()).thenReturn(mockExtContext);
+
+        rules.maybeEmitGlobalTagValidationErrors(mockContext, result);
+
+        Mockito.verify(mockContext, Mockito.times(5))
+                .addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                        Mockito.any(Locator.class),
+                        Mockito.anyListOf(String.class),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Mockito.verify(mockContext, Mockito.times(0))
+                .addWarning(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                        Mockito.any(Locator.class),
+                        Mockito.anyListOf(String.class),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    }
+
+
+    @Test
+    public void testGetParsedAttrSpecs() {
+        final ParsedValidatorRules rules = new ParsedValidatorRules(htmlFormatCode, mockValidationManager);
+
+        Assert.assertNotNull(rules.getParsedAttrSpecs());
+    }
+
+    private ValidatorProtos.ValidatorRules.Builder rulesBuilder;
+
+    private ValidatorProtos.HtmlFormat.Code htmlFormatCode;
+
+    private AMPValidatorManager mockValidationManager;
+
+    private static final String STYLES_SPEC_URL = "https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages";
+
+    private static final String TEMPLATE_SPEC_URL = "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags";
+
+    private static final String SCRIPT_SPEC_URL = "https://amp.dev/documentation/components/amp-mustache";
+
+    private static final int MAX_BYTES = 1000;
+
+
+
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ParsedValuePropertiesTest.java b/validator/java/src/test/java/dev/amp/validator/ParsedValuePropertiesTest.java
new file mode 100644
index 0000000000000..9e0042fea3bb0
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ParsedValuePropertiesTest.java
@@ -0,0 +1,49 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+public class ParsedValuePropertiesTest {
+
+    @Test
+    public void testGetters() {
+        final ValidatorProtos.PropertySpecList.Builder specListBuilder = ValidatorProtos.PropertySpecList.newBuilder();
+        specListBuilder.addProperties(ValidatorProtos.PropertySpec.newBuilder().setName("prop1").setMandatory(true).build());
+        specListBuilder.addProperties(ValidatorProtos.PropertySpec.newBuilder().setName("prop2").build());
+
+        final ParsedValueProperties parsedValueProperties = new ParsedValueProperties(specListBuilder.build());
+
+        Assert.assertEquals(parsedValueProperties.getValuePropertyByName().size(), 2);
+        Assert.assertTrue(parsedValueProperties.getValuePropertyByName().containsKey("prop1"));
+        Assert.assertTrue(parsedValueProperties.getValuePropertyByName().containsKey("prop2"));
+
+        Assert.assertEquals(parsedValueProperties.getMandatoryValuePropertyNames().size(), 1);
+        Assert.assertEquals(parsedValueProperties.getMandatoryValuePropertyNames().get(0), "prop1");
+
+        parsedValueProperties.cleanup();
+
+        Assert.assertNull(parsedValueProperties.getValuePropertyByName());
+        Assert.assertNull(parsedValueProperties.getMandatoryValuePropertyNames());
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ReferencePointMatcherTest.java b/validator/java/src/test/java/dev/amp/validator/ReferencePointMatcherTest.java
new file mode 100644
index 0000000000000..b8bb45f7af682
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ReferencePointMatcherTest.java
@@ -0,0 +1,814 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+
+package dev.amp.validator;
+
+import com.google.common.collect.ImmutableList;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.exception.ValidatorException;
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.mockito.invocation.InvocationOnMock;
+import org.mockito.stubbing.Answer;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Attributes;
+import org.xml.sax.Locator;
+
+import java.io.IOException;
+import java.util.List;
+
+/**
+ * Tests for {@link ReferencePointMatcher}
+ */
+public class ReferencePointMatcherTest {
+
+    @Test(expectedExceptions = TagValidationException.class, expectedExceptionsMessageRegExp = "Reference point matcher should not be empty")
+    public void testTagValidationFailure() throws TagValidationException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+        Mockito.when(mockPoints.empty()).thenReturn(true);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        new ReferencePointMatcher(mockRules, mockPoints, locator);
+    }
+
+    @Test(expectedExceptions = ValidatorException.class,
+            expectedExceptionsMessageRegExp = "Successful validation should have exited earlier")
+    public void testValidateTagValidatorException() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.getSpec()).thenReturn(ValidatorProtos.TagSpec.newBuilder().build());
+
+        Mockito.when(mockTagSpec.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(true);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.build();
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint));
+
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+        refPointMatcher.validateTag(mockHtmlTag, mockContext);
+    }
+
+    @Test
+    public void testValidateTagPass() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.getSpec()).thenReturn(ValidatorProtos.TagSpec.newBuilder().build());
+
+        Mockito.when(mockTagSpec.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(true);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.build();
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint));
+
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+        final ValidateTagResult validateTagResult = refPointMatcher.validateTag(mockHtmlTag, mockContext);
+
+        Assert.assertEquals(validateTagResult.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.PASS);
+        Assert.assertEquals(validateTagResult.getBestMatchTagSpec(), mockTagSpec);
+
+        refPointMatcher.cleanup();
+    }
+
+    @Test
+    public void testValidateTagFailOneRefPoint() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.getSpec()).thenReturn(ValidatorProtos.TagSpec.newBuilder().setMandatoryParent("HEAD").build());
+
+        Mockito.when(mockTagSpec.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(true);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.doAnswer(new Answer() {
+            public Void answer(final InvocationOnMock invocation) {
+                Object[] args = invocation.getArguments();
+
+                ValidatorProtos.ValidationResult.Builder validationResult = (ValidatorProtos.ValidationResult.Builder) args[4];
+                validationResult.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+                return null;
+            }
+        }).when(mockContext).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                                    Mockito.any(Locator.class),
+                                    Mockito.anyListOf(String.class),
+                                    Mockito.anyString(),
+                                    Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("BODY");
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.build();
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint));
+        Mockito.when(mockPoints.size()).thenReturn(1);
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+        final ValidateTagResult validateTagResult = refPointMatcher.validateTag(mockHtmlTag, mockContext);
+
+        Assert.assertEquals(validateTagResult.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.FAIL);
+        Assert.assertNull(validateTagResult.getBestMatchTagSpec());
+
+        Mockito.verify(mockContext, Mockito.times(2)).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        refPointMatcher.cleanup();
+    }
+
+    @Test
+    public void testValidateTagFailTwoRefPoint() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.getSpec()).thenReturn(ValidatorProtos.TagSpec.newBuilder().setMandatoryParent("HEAD").build());
+
+        Mockito.when(mockTagSpec.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(true);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.doAnswer(new Answer() {
+            public Void answer(final InvocationOnMock invocation) {
+                Object[] args = invocation.getArguments();
+
+                ValidatorProtos.ValidationResult.Builder validationResult = (ValidatorProtos.ValidationResult.Builder) args[4];
+                validationResult.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+                return null;
+            }
+        }).when(mockContext).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("BODY");
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.build();
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder2 = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint2 = refPointBuilder2.build();
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint, refPoint2));
+        Mockito.when(mockPoints.size()).thenReturn(2);
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+        Assert.assertEquals(refPointMatcher.getLineCol(), locator);
+
+        final ValidateTagResult validateTagResult = refPointMatcher.validateTag(mockHtmlTag, mockContext);
+
+        Assert.assertEquals(validateTagResult.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.FAIL);
+        Assert.assertNull(validateTagResult.getBestMatchTagSpec());
+
+        Mockito.verify(mockContext, Mockito.times(3)).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        refPointMatcher.cleanup();
+
+        Assert.assertNull(refPointMatcher.getLineCol());
+    }
+
+    @Test(expectedExceptions = ValidatorException.class, expectedExceptionsMessageRegExp = "Successful validation should have exited earlier")
+    public void testValidateTagPassNotUsedForTypeIdentifiers()
+            throws TagValidationException, ValidatorException, IOException, CssValidationException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.getSpec()).thenReturn(ValidatorProtos.TagSpec.newBuilder().setMandatoryParent("HEAD").build());
+
+        Mockito.when(mockTagSpec.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(false);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+        Mockito.doAnswer(new Answer() {
+            public Void answer(final InvocationOnMock invocation) {
+                Object[] args = invocation.getArguments();
+
+                ValidatorProtos.ValidationResult.Builder validationResult = (ValidatorProtos.ValidationResult.Builder) args[4];
+                validationResult.setStatus(ValidatorProtos.ValidationResult.Status.FAIL);
+
+                return null;
+            }
+        }).when(mockContext).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("BODY");
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.build();
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint));
+        Mockito.when(mockPoints.size()).thenReturn(1);
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+        refPointMatcher.validateTag(mockHtmlTag, mockContext);
+    }
+
+    @Test
+    public void testExitParentTagMandatoryTagMissing()
+            throws TagValidationException, ValidatorException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.id()).thenReturn(10);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockRules.getReferencePointName(Mockito.any(ValidatorProtos.ReferencePoint.class))).thenReturn("refPoint1");
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("BODY");
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.setMandatory(true).build();
+        Mockito.when(mockRules.getTagSpecIdByReferencePointTagSpecName(Mockito.anyString())).thenReturn(8);
+
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint));
+        Mockito.when(mockPoints.size()).thenReturn(2);
+        Mockito.when(mockPoints.parentTagSpecName()).thenReturn("parent1");
+        ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+
+        refPointMatcher.recordMatch(mockTagSpec);
+        refPointMatcher.recordMatch(mockTagSpec);
+
+        final ParsedTagSpec mockTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec2.id()).thenReturn(9);
+
+        refPointMatcher.exitParentTag(mockContext, builder);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(errorCodeCapture.capture(),
+                Mockito.any(Locator.class),
+                listCaptor.capture(),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 2);
+        Assert.assertEquals(params.get(0), "refPoint1");
+        Assert.assertEquals(params.get(1), "parent1");
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.MANDATORY_REFERENCE_POINT_MISSING);
+
+        refPointMatcher.cleanup();
+    }
+
+    @Test
+    public void testExitParentTagDuplicateRefPoint()
+            throws TagValidationException, ValidatorException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.id()).thenReturn(10);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockRules.getReferencePointName(Mockito.any(ValidatorProtos.ReferencePoint.class))).thenReturn("refPoint1");
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("BODY");
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.setUnique(true).build();
+        Mockito.when(mockRules.getTagSpecIdByReferencePointTagSpecName(Mockito.anyString())).thenReturn(10);
+
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint));
+        Mockito.when(mockPoints.size()).thenReturn(2);
+        Mockito.when(mockPoints.parentTagSpecName()).thenReturn("parent1");
+        ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+
+        refPointMatcher.recordMatch(mockTagSpec);
+        refPointMatcher.recordMatch(mockTagSpec);
+
+        final ParsedTagSpec mockTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec2.id()).thenReturn(9);
+
+        refPointMatcher.exitParentTag(mockContext, builder);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(errorCodeCapture.capture(),
+                Mockito.any(Locator.class),
+                listCaptor.capture(),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 2);
+        Assert.assertEquals(params.get(0), "refPoint1");
+        Assert.assertEquals(params.get(1), "parent1");
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DUPLICATE_REFERENCE_POINT);
+
+        refPointMatcher.cleanup();
+    }
+
+    @Test
+    public void testExitParentTag()
+            throws TagValidationException, ValidatorException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.id()).thenReturn(10);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("BODY");
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.setMandatory(true).build();
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder2 = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint2 = refPointBuilder2.setUnique(true).build();
+        Mockito.when(mockRules.getTagSpecIdByReferencePointTagSpecName(Mockito.anyString())).thenReturn(8).thenReturn(10);
+
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint, refPoint2));
+        Mockito.when(mockPoints.size()).thenReturn(2);
+
+        ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+
+        refPointMatcher.recordMatch(mockTagSpec);
+        refPointMatcher.recordMatch(mockTagSpec);
+
+        final ParsedTagSpec mockTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec2.id()).thenReturn(9);
+
+        refPointMatcher.exitParentTag(mockContext, builder);
+
+        Mockito.verify(mockContext, Mockito.times(2)).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        refPointMatcher.cleanup();
+    }
+
+    @Test
+    public void testExitParentTagZeroErrors()
+            throws TagValidationException, ValidatorException {
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final ParsedTagSpec mockTagSpec = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec.id()).thenReturn(10);
+
+        final ParsedReferencePoints mockPoints = Mockito.mock(ParsedReferencePoints.class);
+
+        final Locator locator = new Locator() {
+            @Override
+            public String getPublicId() {
+                return "pubId1";
+            }
+
+            @Override
+            public String getSystemId() {
+                return "sysId2";
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 30;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 40;
+            }
+        };
+
+        final ParsedHtmlTag mockHtmlTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(mockHtmlTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(0);
+        Mockito.when(mockHtmlTag.attrs()).thenReturn(mockAttrs);
+
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockRules.getByTagSpecId(Mockito.anyString())).thenReturn(mockTagSpec);
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("BODY");
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint = refPointBuilder.build();
+
+        final ValidatorProtos.ReferencePoint.Builder refPointBuilder2 = ValidatorProtos.ReferencePoint.newBuilder();
+
+        final ValidatorProtos.ReferencePoint refPoint2 = refPointBuilder2.build();
+        Mockito.when(mockRules.getTagSpecIdByReferencePointTagSpecName(Mockito.anyString())).thenReturn(8).thenReturn(10);
+
+
+        Mockito.when(mockPoints.iterate()).thenReturn(ImmutableList.of(refPoint, refPoint2));
+        Mockito.when(mockPoints.size()).thenReturn(2);
+
+        ValidatorProtos.ValidationResult.Builder builder = ValidatorProtos.ValidationResult.newBuilder();
+
+        final ReferencePointMatcher refPointMatcher = new ReferencePointMatcher(mockRules, mockPoints, locator);
+
+        refPointMatcher.recordMatch(mockTagSpec);
+        refPointMatcher.recordMatch(mockTagSpec);
+
+        final ParsedTagSpec mockTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockTagSpec2.id()).thenReturn(9);
+
+        refPointMatcher.exitParentTag(mockContext, builder);
+
+        Mockito.verify(mockContext, Mockito.times(0)).addError(Mockito.any(ValidatorProtos.ValidationError.Code.class),
+                Mockito.any(Locator.class),
+                Mockito.anyListOf(String.class),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        refPointMatcher.cleanup();
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/SrcsetParsingResultTest.java b/validator/java/src/test/java/dev/amp/validator/SrcsetParsingResultTest.java
new file mode 100644
index 0000000000000..9d40a088170bb
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/SrcsetParsingResultTest.java
@@ -0,0 +1,61 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.util.Collections;
+
+/**
+ * Tests for {@link SrcsetParsingResult}
+ *
+ * @author sphatak01
+ */
+public class SrcsetParsingResultTest {
+
+    @Test
+    public void testSettersGetters() {
+        final SrcsetParsingResult srcsetParsingResult = new SrcsetParsingResult();
+        Assert.assertFalse(srcsetParsingResult.isSuccess());
+        srcsetParsingResult.setSuccess(true);
+        Assert.assertTrue(srcsetParsingResult.isSuccess());
+
+        Assert.assertEquals(srcsetParsingResult.getErrorCode(), ValidatorProtos.ValidationError.Code.UNKNOWN_CODE);
+        srcsetParsingResult.setErrorCode(ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE);
+        Assert.assertEquals(srcsetParsingResult.getErrorCode(), ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE);
+
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImages().size(), 0);
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImagesSize(), 0);
+        srcsetParsingResult.add(new SrcsetSourceDef("url1", "23"));
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImages().size(), 1);
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImagesSize(), 1);
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImages().get(0).getUrl(), "url1");
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImages().get(0).getWidthOrPixelDensity(), "23");
+
+        srcsetParsingResult.setSrcsetImages(Collections.singletonList(new SrcsetSourceDef("url2", "22")));
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImages().size(), 1);
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImagesSize(), 1);
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImages().get(0).getUrl(), "url2");
+        Assert.assertEquals(srcsetParsingResult.getSrcsetImages().get(0).getWidthOrPixelDensity(), "22");
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/TagSpecDispatchTest.java b/validator/java/src/test/java/dev/amp/validator/TagSpecDispatchTest.java
new file mode 100644
index 0000000000000..6bf3dc41abda4
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/TagSpecDispatchTest.java
@@ -0,0 +1,109 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+
+package dev.amp.validator;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.util.List;
+
+/**
+ * Tests for {@link TagSpecDispatch}
+ *
+ * @author sphatak01
+ */
+public class TagSpecDispatchTest {
+
+    @Test
+    public void testRegisterDispatchKeyAndTagSpec() {
+        final TagSpecDispatch tagSpecDispatch = new TagSpecDispatch();
+
+        final String dispatchKey1 = "dk1";
+
+        final int tagSpecId1 = 10;
+        final int tagSpecId2 = 9;
+        tagSpecDispatch.registerDispatchKey(dispatchKey1, tagSpecId1);
+        tagSpecDispatch.registerDispatchKey(dispatchKey1, tagSpecId2);
+
+        tagSpecDispatch.registerTagSpec(tagSpecId1);
+        tagSpecDispatch.registerTagSpec(tagSpecId2);
+
+        Assert.assertFalse(tagSpecDispatch.empty());
+        Assert.assertTrue(tagSpecDispatch.hasDispatchKeys());
+        Assert.assertTrue(tagSpecDispatch.hasTagSpecs());
+        Assert.assertEquals(tagSpecDispatch.allTagSpecs().size(), 2);
+        Assert.assertEquals(tagSpecDispatch.allTagSpecs().get(0), new Integer(10));
+        Assert.assertEquals(tagSpecDispatch.allTagSpecs().get(1), new Integer(9));
+    }
+
+    @Test
+    public void testMatchingDispatchKeyEmpty() {
+        final TagSpecDispatch tagSpecDispatch = new TagSpecDispatch();
+
+        Assert.assertTrue(tagSpecDispatch.matchingDispatchKey("attr1", "value1", "manPar1").isEmpty());
+    }
+
+    @Test
+    public void testMatchingNameValueDispatchKey() {
+        final String attrName = "content";
+        final String attrValue = "val1";
+
+        final TagSpecDispatch tagSpecDispatch = new TagSpecDispatch();
+        tagSpecDispatch.registerDispatchKey(attrName + "\0" + attrValue, 10);
+        tagSpecDispatch.registerDispatchKey(attrName + "\0" + attrValue + "\0" + "true", 11);
+
+        final List<Integer> matchingKeys = tagSpecDispatch.matchingDispatchKey("content", "val1", "HEAD");
+
+        Assert.assertEquals(matchingKeys.size(), 2);
+        Assert.assertEquals(matchingKeys.get(0).intValue(), 11);
+        Assert.assertEquals(matchingKeys.get(1).intValue(), 10);
+
+    }
+
+    @Test
+    public void testMatchingNameDispatchKey() {
+        final String attrName = "content";
+
+        final TagSpecDispatch tagSpecDispatch = new TagSpecDispatch();
+        tagSpecDispatch.registerDispatchKey(attrName, 10);
+
+        final List<Integer> matchingKeys = tagSpecDispatch.matchingDispatchKey("content", "val1", "HEAD");
+
+        Assert.assertEquals(matchingKeys.size(), 1);
+        Assert.assertEquals(matchingKeys.get(0).intValue(), 10);
+
+    }
+
+    @Test
+    public void testMatchingDispatchKeySameNameAndValue() {
+        final String attrName = "foo";
+
+        final TagSpecDispatch tagSpecDispatch = new TagSpecDispatch();
+        tagSpecDispatch.registerDispatchKey(attrName, 10);
+
+        final List<Integer> matchingKeys = tagSpecDispatch.matchingDispatchKey("foo", "foo", "HEAD");
+
+        Assert.assertEquals(matchingKeys.size(), 2);
+        Assert.assertEquals(matchingKeys.get(0).intValue(), 10);
+        Assert.assertEquals(matchingKeys.get(1).intValue(), 10);
+    }
+}
\ No newline at end of file
diff --git a/validator/java/src/test/java/dev/amp/validator/TagStackEntryTest.java b/validator/java/src/test/java/dev/amp/validator/TagStackEntryTest.java
new file mode 100644
index 0000000000000..aceb27454f513
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/TagStackEntryTest.java
@@ -0,0 +1,55 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Tests for {@link TagStackEntry}
+ *
+ * @author sphatak01
+ */
+public class TagStackEntryTest {
+
+    @Test
+    public void testSettersgetters() {
+        final TagStackEntry tagStackEntry = new TagStackEntry("tagName");
+
+        Assert.assertEquals(tagStackEntry.getTagName(), "tagName");
+        Assert.assertNull(tagStackEntry.getTagSpec());
+        Assert.assertNull(tagStackEntry.getReferencePoint());
+        Assert.assertFalse(tagStackEntry.getHasDescendantConstraintLists());
+        Assert.assertEquals(tagStackEntry.getNumChildren(), 0);
+        Assert.assertEquals(tagStackEntry.getOnlyChildTagName(), "");
+        Assert.assertNull(tagStackEntry.getOnlyChildErrorLineCol());
+        Assert.assertEquals(tagStackEntry.getLastChildTagName(), "");
+        Assert.assertEquals(tagStackEntry.getLastChildUrl(), "");
+        Assert.assertNull(tagStackEntry.getOnlyChildErrorLineCol());
+        Assert.assertNull(tagStackEntry.getCdataMatcher());
+        Assert.assertNull(tagStackEntry.getChildTagMatcher());
+        Assert.assertNull(tagStackEntry.getReferencePointMatcher());
+
+        tagStackEntry.cleanup();
+    }
+}
\ No newline at end of file
diff --git a/validator/java/src/test/java/dev/amp/validator/TagStackTest.java b/validator/java/src/test/java/dev/amp/validator/TagStackTest.java
new file mode 100644
index 0000000000000..5ac66f5fa0443
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/TagStackTest.java
@@ -0,0 +1,583 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import dev.amp.validator.exception.TagValidationException;
+import org.testng.Assert;
+import org.testng.annotations.BeforeClass;
+import org.testng.annotations.Test;
+import org.xml.sax.Locator;
+
+import static org.mockito.Mockito.mock;
+import static org.mockito.Mockito.when;
+import static org.mockito.Mockito.verify;
+import static org.mockito.Mockito.times;
+import static org.mockito.Mockito.any;
+
+/**
+ * Tests for {@link TagStack}
+ *
+ * @author sphatak01
+ */
+public class TagStackTest {
+
+    @BeforeClass
+    public void init() throws Exception {
+        ampValidatorManager = new AMPValidatorManager();
+        ampValidatorManager.loadRule("validator-all-test.protoascii");
+    }
+
+    @Test
+    public void testParentStackEntry() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        Assert.assertEquals(tagStack.parentTagName(), "!DOCTYPE");
+        Assert.assertEquals(tagStack.parentStackEntry().getTagName(), "!DOCTYPE");
+    }
+
+    @Test(expectedExceptions = TagValidationException.class)
+    public void testParentStackEntryError() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Context context = mock(Context.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        tagStack.exitTag(context, validationBuilder);
+        tagStack.exitTag(context, validationBuilder);
+
+        tagStack.parentStackEntry();
+    }
+
+    @Test
+    public void testBack() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        Assert.assertEquals(tagStack.back().getTagName(), "!DOCTYPE");
+    }
+
+    @Test(expectedExceptions = TagValidationException.class)
+    public void testBackError() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Context context = mock(Context.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        Assert.assertEquals(tagStack.back().getTagName(), "!DOCTYPE");
+        tagStack.exitTag(context, validationBuilder);
+        tagStack.exitTag(context, validationBuilder);
+
+        tagStack.back();
+    }
+
+    @Test
+    public void testTellParentNoSiblingsAllowed() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        tagStack.tellParentNoSiblingsAllowed("test_satisfies", lineCol);
+
+        Assert.assertTrue(tagStack.parentHasChildWithNoSiblingRule());
+        Assert.assertEquals(tagStack.parentOnlyChildTagName(), "test_satisfies");
+        Assert.assertEquals(tagStack.parentStackEntry().getOnlyChildTagName(), "test_satisfies");
+        Assert.assertEquals(tagStack.parentOnlyChildErrorLineCol().getColumnNumber(), lineCol.getColumnNumber());
+        Assert.assertEquals(tagStack.parentStackEntry().getOnlyChildErrorLineCol().getColumnNumber(), lineCol.getColumnNumber());
+        Assert.assertEquals(tagStack.parentOnlyChildErrorLineCol().getLineNumber(), lineCol.getLineNumber());
+        Assert.assertEquals(tagStack.parentStackEntry().getOnlyChildErrorLineCol().getLineNumber(), lineCol.getLineNumber());
+    }
+
+    @Test
+    public void testTellParentImTheLastChild() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        tagStack.tellParentImTheLastChild("test_satisfies", "last_url", lineCol);
+        Assert.assertTrue(tagStack.parentHasChildWithLastChildRule());
+        Assert.assertEquals(tagStack.parentLastChildTagName(), "test_satisfies");
+        Assert.assertEquals(tagStack.parentStackEntry().getLastChildTagName(), "test_satisfies");
+        Assert.assertEquals(tagStack.parentLastChildUrl(), "last_url");
+        Assert.assertEquals(tagStack.parentStackEntry().getLastChildUrl(), "last_url");
+        Assert.assertEquals(tagStack.parentLastChildErrorLineCol().getColumnNumber(), lineCol.getColumnNumber());
+        Assert.assertEquals(tagStack.parentStackEntry().getLastChildErrorLineCol().getColumnNumber(), lineCol.getColumnNumber());
+        Assert.assertEquals(tagStack.parentLastChildErrorLineCol().getLineNumber(), lineCol.getLineNumber());
+        Assert.assertEquals(tagStack.parentStackEntry().getLastChildErrorLineCol().getLineNumber(), lineCol.getLineNumber());
+    }
+
+    @Test
+    public void testMatchChildTagName() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final ParsedHtmlTag htmlTag = mock(ParsedHtmlTag.class);
+        when(htmlTag.upperName()).thenReturn("test_satisfies_parent_head");
+        final ValidateTagResult mockReferencePointResult = mock(ValidateTagResult.class);
+        when(mockReferencePointResult.getBestMatchTagSpec()).thenReturn(mockValidatorRules
+                .getByTagSpecId("test_satisfies"));
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        when(mockReferencePointResult.getValidationResult()).thenReturn(validationBuilder);
+
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        final ParsedTagSpec tagSpec = mockValidatorRules.getByTagSpecId("test_satisfies_parent_head");
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+
+        Assert.assertFalse(tagStack.hasAncestorMarker(ValidatorProtos.AncestorMarker.Marker.AUTOSCROLL));
+
+        final ReferencePointMatcher refMatch = mock(ReferencePointMatcher.class);
+        tagStack.setReferencePointMatcher(refMatch);
+        tagStack.updateFromTagResults(htmlTag, mockReferencePointResult, mockTagResult, mockValidatorRules, lineCol);
+
+        final Context context = mock(Context.class);
+
+        tagStack.matchChildTagName(htmlTag, context, validationBuilder);
+    }
+
+    @Test
+    public void testAncestor() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final ParsedHtmlTag htmlTag = mock(ParsedHtmlTag.class);
+        when(htmlTag.upperName()).thenReturn("test_satisfies_parent_head");
+        final ValidateTagResult mockReferencePointResult = mock(ValidateTagResult.class);
+        when(mockReferencePointResult.getBestMatchTagSpec()).thenReturn(mockValidatorRules
+                .getByTagSpecId("test_satisfies"));
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        when(mockReferencePointResult.getValidationResult()).thenReturn(validationBuilder);
+
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        final ParsedTagSpec tagSpec = mockValidatorRules.getByTagSpecId("test_satisfies_parent_head");
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+
+        Assert.assertFalse(tagStack.hasAncestorMarker(ValidatorProtos.AncestorMarker.Marker.AUTOSCROLL));
+
+        final ReferencePointMatcher refMatch = mock(ReferencePointMatcher.class);
+        tagStack.setReferencePointMatcher(refMatch);
+        tagStack.updateFromTagResults(htmlTag, mockReferencePointResult, mockTagResult, mockValidatorRules, lineCol);
+
+        Assert.assertTrue(tagStack.hasAncestor("!DOCTYPE"));
+        Assert.assertTrue(tagStack.hasAncestor("test_satisfies_parent_head"));
+        Assert.assertFalse(tagStack.hasAncestor("test_satisfies"));
+
+        Assert.assertTrue(tagStack.hasAncestorMarker(ValidatorProtos.AncestorMarker.Marker.AUTOSCROLL));
+    }
+
+    @Test(expectedExceptions = TagValidationException.class, expectedExceptionsMessageRegExp = "Ancestor marker is unknown")
+    public void testHasAncestorMarkerError() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        tagStack.hasAncestorMarker(ValidatorProtos.AncestorMarker.Marker.UNKNOWN);
+    }
+
+    @Test(expectedExceptions = TagValidationException.class, expectedExceptionsMessageRegExp = "Exiting an empty tag stack.")
+    public void testExitTagError() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Context context = mock(Context.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        tagStack.exitTag(context, validationBuilder);
+        tagStack.exitTag(context, validationBuilder);
+
+        tagStack.exitTag(context, validationBuilder);
+    }
+
+    @Test
+    public void testExitTag() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final ParsedHtmlTag htmlTag = mock(ParsedHtmlTag.class);
+        when(htmlTag.upperName()).thenReturn("test_satisfies_parent_head");
+        final ValidateTagResult mockReferencePointResult = mock(ValidateTagResult.class);
+        when(mockReferencePointResult.getBestMatchTagSpec()).thenReturn(mockValidatorRules
+                .getByTagSpecId("test_satisfies"));
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        when(mockReferencePointResult.getValidationResult()).thenReturn(validationBuilder);
+
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        final ParsedTagSpec tagSpec = mockValidatorRules.getByTagSpecId("test_satisfies_parent_head");
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+
+        final ReferencePointMatcher refMatch = mock(ReferencePointMatcher.class);
+        tagStack.setReferencePointMatcher(refMatch);
+        tagStack.updateFromTagResults(htmlTag, mockReferencePointResult, mockTagResult, mockValidatorRules, lineCol);
+
+        final Context context = mock(Context.class);
+        tagStack.exitTag(context, validationBuilder);
+
+        Assert.assertEquals(tagStack.parentTagName(), "!DOCTYPE");
+    }
+
+    @Test
+    public void testUpdateStackEntryFromTagResultBestMatchNull() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+
+        tagStack.updateStackEntryFromTagResult(mockTagResult, mockValidatorRules, lineCol);
+    }
+
+    @Test
+    public void testUpdateStackEntryFromTagResult() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+
+        final ParsedTagSpec tagSpec = mockValidatorRules.getByTagSpecId("test_parent");
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        tagStack.updateStackEntryFromTagResult(mockTagResult, mockValidatorRules, lineCol);
+
+        Assert.assertNotNull(tagStack.parentStackEntry().getChildTagMatcher());
+        Assert.assertNotNull(tagStack.cdataMatcher());
+    }
+
+    @Test
+    public void testUpdateFromTagResults() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final ParsedHtmlTag htmlTag = mock(ParsedHtmlTag.class);
+        when(htmlTag.upperName()).thenReturn("test_satisfies");
+        final ValidateTagResult mockReferencePointResult = mock(ValidateTagResult.class);
+        when(mockReferencePointResult.getBestMatchTagSpec()).thenReturn(mockValidatorRules
+                .getByTagSpecId("test_satisfies_parent_head"));
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        when(mockReferencePointResult.getValidationResult()).thenReturn(validationBuilder);
+
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        final ParsedTagSpec tagSpec = mockValidatorRules.getByTagSpecId("test_satisfies");
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+
+        final ReferencePointMatcher refMatch = mock(ReferencePointMatcher.class);
+        tagStack.setReferencePointMatcher(refMatch);
+        tagStack.updateFromTagResults(htmlTag, mockReferencePointResult, mockTagResult, mockValidatorRules, lineCol);
+
+
+        Assert.assertTrue(tagStack.hasAncestor("!DOCTYPE"));
+        verify(refMatch, times(1)).recordMatch(any(ParsedTagSpec.class));
+        Assert.assertEquals(tagStack.parentStackEntry().getNumChildren(), 0);
+        Assert.assertEquals(tagStack.parentStackEntry().getReferencePoint(), mockValidatorRules
+                .getByTagSpecId("test_satisfies_parent_head"));
+        Assert.assertEquals(tagStack.parentStackEntry().getTagSpec(),
+                mockValidatorRules.getByTagSpecId("test_satisfies"));
+        Assert.assertFalse(tagStack.isStyleAmpCustomChild());
+    }
+
+    @Test
+    public void testUpdateFromTagResultsParentHead() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ampValidatorManager);
+        final ParsedHtmlTag htmlTag = mock(ParsedHtmlTag.class);
+        when(htmlTag.upperName()).thenReturn("test_satisfies_parent_head");
+        final ValidateTagResult mockReferencePointResult = mock(ValidateTagResult.class);
+        when(mockReferencePointResult.getBestMatchTagSpec()).thenReturn(mockValidatorRules
+                .getByTagSpecId("test_satisfies"));
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+        when(mockReferencePointResult.getValidationResult()).thenReturn(validationBuilder);
+
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        ParsedTagSpec tagSpec = mockValidatorRules.getByTagSpecId("test_satisfies_parent_head");
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+
+        final ReferencePointMatcher refMatch = mock(ReferencePointMatcher.class);
+        tagStack.setReferencePointMatcher(refMatch);
+        tagStack.updateFromTagResults(htmlTag, mockReferencePointResult, mockTagResult, mockValidatorRules, lineCol);
+
+
+        Assert.assertTrue(tagStack.hasAncestor("!DOCTYPE"));
+        verify(refMatch, times(1)).recordMatch(any(ParsedTagSpec.class));
+        Assert.assertEquals(tagStack.parentStackEntry().getNumChildren(), 0);
+        Assert.assertEquals(tagStack.parentStackEntry().getReferencePoint(), mockValidatorRules
+                .getByTagSpecId("test_satisfies"));
+        Assert.assertEquals(tagStack.parentStackEntry().getTagSpec(),
+                mockValidatorRules.getByTagSpecId("test_satisfies_parent_head"));
+        Assert.assertTrue(tagStack.isStyleAmpCustomChild());
+
+        Assert.assertTrue(tagStack.parentStackEntry().getHasDescendantConstraintLists());
+        Assert.assertEquals(tagStack.allowedDescendantsList().size(), 1);
+        Assert.assertEquals(tagStack.allowedDescendantsList().get(0).getTagName(), "test_satisfies_parent_head");
+        Assert.assertEquals(tagStack.allowedDescendantsList().get(0).getAllowedTags().size(), 2);
+
+        Assert.assertEquals(tagStack.allowedDescendantsList().get(0).getAllowedTags().get(0), "A");
+        Assert.assertEquals(tagStack.allowedDescendantsList().get(0).getAllowedTags().get(1), "ABBR");
+        Assert.assertFalse(tagStack.isScriptTypeJsonChild());
+
+    }
+
+    @Test(expectedExceptions = TagValidationException.class, expectedExceptionsMessageRegExp = "Parent's reference point matcher is null")
+    public void testUpdateFromTagResultsRefParentNull() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        final Locator lineCol = new Locator() {
+            @Override
+            public String getPublicId() {
+                return null;
+            }
+
+            @Override
+            public String getSystemId() {
+                return null;
+            }
+
+            @Override
+            public int getLineNumber() {
+                return 23;
+            }
+
+            @Override
+            public int getColumnNumber() {
+                return 2;
+            }
+        };
+        mockValidatorRules = new ParsedValidatorRules(ValidatorProtos.HtmlFormat.Code.AMP, ampValidatorManager);
+        final ParsedHtmlTag htmlTag = mock(ParsedHtmlTag.class);
+        final ValidateTagResult mockReferencePointResult = mock(ValidateTagResult.class);
+        when(mockReferencePointResult.getBestMatchTagSpec()).thenReturn(mockValidatorRules
+                .getByTagSpecId("test_satisfies"));
+
+        final ValidateTagResult mockTagResult = mock(ValidateTagResult.class);
+        final ValidatorProtos.ValidationResult.Builder validationBuilder = ValidatorProtos.ValidationResult.newBuilder();
+        validationBuilder.setStatus(ValidatorProtos.ValidationResult.Status.PASS);
+
+        when(mockTagResult.getValidationResult()).thenReturn(validationBuilder);
+
+        final ParsedTagSpec tagSpec = mockValidatorRules.getByTagSpecId("test_satisfies_parent_head");
+        when(mockTagResult.getBestMatchTagSpec()).thenReturn(tagSpec);
+
+        tagStack.updateFromTagResults(htmlTag, mockReferencePointResult, mockTagResult, mockValidatorRules, lineCol);
+    }
+
+    @Test
+    public void testParentChildCount() throws TagValidationException {
+        final TagStack tagStack = new TagStack();
+        Assert.assertEquals(tagStack.parentChildCount(), 0);
+    }
+
+    private ParsedValidatorRules mockValidatorRules;
+
+    /** AMPValidatorManager object. */
+    private AMPValidatorManager ampValidatorManager;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/UrlErrorInAttrAdapterTest.java b/validator/java/src/test/java/dev/amp/validator/UrlErrorInAttrAdapterTest.java
new file mode 100644
index 0000000000000..19d1cfaab42b3
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/UrlErrorInAttrAdapterTest.java
@@ -0,0 +1,175 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Locator;
+
+import java.util.List;
+
+/**
+ * Tests for {@link UrlErrorInAttrAdapter}
+ *
+ * @author sphatak01
+ */
+public class UrlErrorInAttrAdapterTest {
+
+    @Test
+    public void testMissingUrl() {
+        final String attrName = "attr";
+
+        final UrlErrorInAttrAdapter urlErrorInAttrAdapter = new UrlErrorInAttrAdapter(attrName);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInAttrAdapter.missingUrl(mockContext, tagSpec, resultBuilder);
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "attr");
+        Assert.assertEquals(params.get(1), "spec1");
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.MISSING_URL);
+
+    }
+
+    @Test
+    public void testInvalidUrl() {
+        final String attrName = "attr";
+
+        final UrlErrorInAttrAdapter urlErrorInAttrAdapter = new UrlErrorInAttrAdapter(attrName);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final String url = "https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages";
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInAttrAdapter.invalidUrl(mockContext, url, tagSpec, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "attr");
+        Assert.assertEquals(params.get(1), "spec1");
+        Assert.assertEquals(params.get(2), url);
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.INVALID_URL);
+
+    }
+
+    @Test
+    public void testInvalidUrlProtocol() {
+        final String attrName = "attr";
+
+        final UrlErrorInAttrAdapter urlErrorInAttrAdapter = new UrlErrorInAttrAdapter(attrName);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final String protocol = "http";
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInAttrAdapter.invalidUrlProtocol(mockContext, protocol, tagSpec, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "attr");
+        Assert.assertEquals(params.get(1), "spec1");
+        Assert.assertEquals(params.get(2), protocol);
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.INVALID_URL_PROTOCOL);
+
+    }
+
+    @Test
+    public void testDisallowedRelativeUrl() {
+        final String attrName = "attr";
+
+        final UrlErrorInAttrAdapter urlErrorInAttrAdapter = new UrlErrorInAttrAdapter(attrName);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final String url = "https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages";
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInAttrAdapter.disallowedRelativeUrl(mockContext, url, tagSpec, resultBuilder);
+
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.any(Locator.class),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "attr");
+        Assert.assertEquals(params.get(1), "spec1");
+        Assert.assertEquals(params.get(2), url);
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DISALLOWED_RELATIVE_URL);
+
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/UrlErrorInStylesheetAdapterTest.java b/validator/java/src/test/java/dev/amp/validator/UrlErrorInStylesheetAdapterTest.java
new file mode 100644
index 0000000000000..6560c1499a646
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/UrlErrorInStylesheetAdapterTest.java
@@ -0,0 +1,175 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.util.List;
+
+/**
+ * Tests for {@link UrlErrorInStylesheetAdapter}
+ *
+ * @author sphatak01
+ */
+public class UrlErrorInStylesheetAdapterTest {
+
+    @Test
+    public void testMissingUrl() {
+        int lineNumber = 23;
+        int colNumber = 45;
+
+        final UrlErrorInStylesheetAdapter urlErrorInStylesheetAdapter = new UrlErrorInStylesheetAdapter(lineNumber, colNumber);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInStylesheetAdapter.missingUrl(mockContext, tagSpec, resultBuilder);
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.anyInt(),
+                        Mockito.anyInt(),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "spec1");
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_MISSING_URL);
+
+    }
+
+    @Test
+    public void testInvalidUrl() {
+        final int lineNumber = 23;
+        final int colNumber = 45;
+        final String url = "https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages";
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final UrlErrorInStylesheetAdapter urlErrorInStylesheetAdapter = new UrlErrorInStylesheetAdapter(lineNumber, colNumber);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInStylesheetAdapter.invalidUrl(mockContext, url, tagSpec, resultBuilder);
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.anyInt(),
+                        Mockito.anyInt(),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "spec1");
+        Assert.assertEquals(params.get(1), url);
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_URL);
+
+    }
+
+    @Test
+    public void testInvalidUrlProtocol() {
+        final int lineNumber = 23;
+        final int colNumber = 45;
+        final String protocol = "https";
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final UrlErrorInStylesheetAdapter urlErrorInStylesheetAdapter = new UrlErrorInStylesheetAdapter(lineNumber, colNumber);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInStylesheetAdapter.invalidUrlProtocol(mockContext, protocol, tagSpec, resultBuilder);
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.anyInt(),
+                        Mockito.anyInt(),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "spec1");
+        Assert.assertEquals(params.get(1), protocol);
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_URL_PROTOCOL);
+
+    }
+
+    @Test
+    public void testDisallowedRelativeUrl() {
+        final int lineNumber = 23;
+        final int colNumber = 45;
+        final String url = "https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages";
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final UrlErrorInStylesheetAdapter urlErrorInStylesheetAdapter = new UrlErrorInStylesheetAdapter(lineNumber, colNumber);
+        final Context mockContext = Mockito.mock(Context.class);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+        tagSpecBuilder.setSpecUrl("https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages");
+        tagSpecBuilder.setSpecName("spec1");
+
+        final ValidatorProtos.TagSpec tagSpec = tagSpecBuilder.build();
+        final ValidatorProtos.ValidationResult.Builder resultBuilder = ValidatorProtos.ValidationResult.newBuilder();
+
+        urlErrorInStylesheetAdapter.disallowedRelativeUrl(mockContext, url, tagSpec, resultBuilder);
+        Mockito.verify(mockContext, Mockito.times(1))
+                .addError(errorCodeCapture.capture(),
+                        Mockito.anyInt(),
+                        Mockito.anyInt(),
+                        listCaptor.capture(),
+                        Mockito.anyString(),
+                        Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.get(0), "spec1");
+        Assert.assertEquals(params.get(1), url);
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_RELATIVE_URL);
+
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/ValidateTagResultTest.java b/validator/java/src/test/java/dev/amp/validator/ValidateTagResultTest.java
new file mode 100644
index 0000000000000..b7ae54d2d50c9
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/ValidateTagResultTest.java
@@ -0,0 +1,53 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator;
+
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link ValidateTagResult}
+ *
+ * @author sphatak01
+ */
+public class ValidateTagResultTest {
+
+    @Test
+    public void testGettersSetters() {
+        final ValidatorProtos.ValidationResult.Builder validationResult = ValidatorProtos.ValidationResult.newBuilder();
+        final ParsedTagSpec mockParsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+
+        final ValidateTagResult validateTagResult = new ValidateTagResult(validationResult, mockParsedTagSpec);
+        Assert.assertEquals(validateTagResult.getBestMatchTagSpec(), mockParsedTagSpec);
+        Assert.assertEquals(validateTagResult.getValidationResult(), validationResult);
+
+        final ValidatorProtos.ValidationResult.Builder validationResult2 = ValidatorProtos.ValidationResult.newBuilder();
+        final ParsedTagSpec mockParsedTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+
+        validateTagResult.setBestMatchTagSpec(mockParsedTagSpec2);
+        validateTagResult.setValidationResult(validationResult2);
+
+        Assert.assertEquals(validateTagResult.getBestMatchTagSpec(), mockParsedTagSpec2);
+        Assert.assertEquals(validateTagResult.getValidationResult(), validationResult2);
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/AtRuleTest.java b/validator/java/src/test/java/dev/amp/validator/css/AtRuleTest.java
new file mode 100644
index 0000000000000..5f9bd0cc4ff3f
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/AtRuleTest.java
@@ -0,0 +1,109 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.visitor.RuleVisitor;
+import org.mockito.Mockito;
+import org.mockito.invocation.InvocationOnMock;
+import org.mockito.stubbing.Answer;
+import org.testng.Assert;
+import org.testng.annotations.BeforeClass;
+import org.testng.annotations.Test;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import static org.mockito.Mockito.doAnswer;
+
+/**
+ * Test for {@link AtRule}
+ *
+ * @author GeorgeLuo
+ */
+
+public class AtRuleTest {
+
+  @BeforeClass
+  public void init() {
+    canonicalizer = Mockito.mock(Canonicalizer.class);
+    atRule = new AtRule("@media");
+  }
+
+  @Test
+  public void testAccept() {
+
+    atRule = new AtRule("@media");
+
+    final List<Rule> rules = new ArrayList<>();
+    QualifiedRule qualifiedRule = new QualifiedRule();
+
+    rules.add(qualifiedRule);
+
+    final List<Declaration> declarations = new ArrayList<>();
+    Declaration declaration = new Declaration("background-image");
+    declarations.add(declaration);
+
+    atRule.setDeclarations(declarations);
+
+    final RuleVisitor ruleVisitor = Mockito.mock(RuleVisitor.class);
+    try {
+      doAnswer(new Answer<Void>() {
+        public Void answer(final InvocationOnMock invocation) {
+          final Object[] args = invocation.getArguments();
+          Assert.assertEquals(((AtRule) args[0]).getName(), "media");
+          return null;
+        }
+      }).when(ruleVisitor).visitAtRule(Mockito.any(AtRule.class));
+
+      doAnswer(new Answer<Void>() {
+        public Void answer(final InvocationOnMock invocation) {
+          final Object[] args = invocation.getArguments();
+          Assert.assertEquals(((Declaration) args[0]).getName(), "background-image");
+          return null;
+        }
+      }).when(ruleVisitor).visitDeclaration(Mockito.any(Declaration.class));
+
+      doAnswer(new Answer<Void>() {
+        public Void answer(final InvocationOnMock invocation) {
+          final Object[] args = invocation.getArguments();
+          Assert.assertEquals(((Declaration) args[0]).getName(), "background-image");
+          return null;
+        }
+      }).when(ruleVisitor).leaveDeclaration(Mockito.any(Declaration.class));
+
+      doAnswer(new Answer<Void>() {
+        public Void answer(final InvocationOnMock invocation) {
+          final Object[] args = invocation.getArguments();
+          Assert.assertEquals(((AtRule) args[0]).getName(), "media");
+          return null;
+        }
+      }).when(ruleVisitor).leaveAtRule(Mockito.any(AtRule.class));
+
+      atRule.accept(ruleVisitor);
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  private Canonicalizer canonicalizer;
+  private AtRule atRule;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/CanonicalizerTest.java b/validator/java/src/test/java/dev/amp/validator/css/CanonicalizerTest.java
new file mode 100644
index 0000000000000..3707897099838
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/CanonicalizerTest.java
@@ -0,0 +1,202 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.SACParserCSS3Constants;
+import com.steadystate.css.parser.Token;
+import org.testng.Assert;
+import org.testng.annotations.BeforeSuite;
+import org.testng.annotations.BeforeTest;
+import org.testng.annotations.Test;
+
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.LinkedList;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * Test for {@link Canonicalizer}
+ *
+ * @author GeorgeLuo
+ */
+
+public class CanonicalizerTest {
+
+  @BeforeSuite
+  public void init() {
+    defaultSpec = ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE;
+    atRuleSpec = new HashMap<>();
+
+    atRuleSpec.put("$DEFAULT", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE);
+    atRuleSpec.put("media", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_RULES);
+    atRuleSpec.put("page", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS);
+  }
+
+  @BeforeTest
+  public void initTest() {
+    canonicalizer = new Canonicalizer(atRuleSpec, defaultSpec);
+  }
+
+  @Test
+  public void testParseAListOfRules() {
+    try {
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+      List<Token> tokens = new LinkedList<>();
+      tokens.add(new Token(22, "amp-img"));
+      tokens.add(new Token(55, "{"));
+      tokens.add(new Token(1, ""));
+      tokens.add(new Token(56, "}"));
+      tokens.add(new Token(1, ""));
+      tokens.add(new Token(0, ""));
+      TokenStream tokenStream = new TokenStream(tokens);
+      tokenStream.consume();
+
+      List<Rule> rules = canonicalizer.parseAListOfRules(tokens, true, cssErrors);
+
+      Assert.assertEquals(rules.size(), 1);
+      Assert.assertEquals(rules.get(0).toString(), "QUALIFIED_RULE");
+
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testParseAListOfDeclarationsInvalidAtRule() {
+    try {
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+      cssParser = new CssParser(MEDIA_RULE,
+        0, 0, cssErrors);
+      tokenList = cssParser.tokenize();
+
+      List<ErrorToken> errors = new ArrayList<>();
+      List<Declaration> declarations = canonicalizer.parseAListOfDeclarations(tokenList, errors);
+      Assert.assertEquals(declarations.size(), 0);
+      Assert.assertEquals(errors.size(), 1);
+      Assert.assertEquals(errors.get(0).getCode(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_AT_RULE);
+
+    } catch (CssValidationException | IOException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testParseADeclaration() {
+    List<ErrorToken> errors = new ArrayList<>();
+    List<Declaration> declarations = new ArrayList<>();
+
+    try {
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+      cssParser = new CssParser(A_DECLARATION,
+        0, 0, cssErrors);
+      tokenList = cssParser.tokenize();
+
+      TokenStream tokenStream = new TokenStream(tokenList);
+      tokenStream.consume();
+      canonicalizer.parseADeclaration(tokenStream, declarations, errors);
+      Assert.assertEquals(declarations.size(), 1);
+      Assert.assertEquals(declarations.get(0).getName(), "color");
+    } catch (final IOException | CssValidationException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testConsumeAComponentValue() {
+    try {
+      List<com.steadystate.css.parser.Token> tokens = new LinkedList<>();
+      tokens.add(new com.steadystate.css.parser.Token(SACParserCSS3Constants.LBRACE, "{"));
+      tokens.add(new com.steadystate.css.parser.Token(SACParserCSS3Constants.IDENT, "width"));
+      tokens.add(new Token(SACParserCSS3Constants.COLON, ":"));
+      tokens.add(new Token(SACParserCSS3Constants.S, " "));
+      tokens.add(new Token(SACParserCSS3Constants.IDENT, "square"));
+      tokens.add(new Token(SACParserCSS3Constants.S, " "));
+      tokens.add(new Token(SACParserCSS3Constants.FUNCTION, "and"));
+      tokens.add(new Token(SACParserCSS3Constants.EOF, ""));
+      TokenStream tokenStream = new TokenStream(tokens);
+      tokenStream.consume();
+
+      List<com.steadystate.css.parser.Token> tokensEmpty = new LinkedList<>();
+      Assert.assertTrue(Canonicalizer.consumeAComponentValue(tokenStream, tokensEmpty, 3));
+      Assert.assertEquals(tokensEmpty.size(), 9);
+
+      Assert.assertFalse(Canonicalizer.consumeAComponentValue(tokenStream, tokensEmpty, 100000));
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testConsumeAFunction() {
+    try {
+      List<com.steadystate.css.parser.Token> tokens = new LinkedList<>();
+      tokens.add(new com.steadystate.css.parser.Token(SACParserCSS3Constants.FUNCTION, "and"));
+      tokens.add(new com.steadystate.css.parser.Token(SACParserCSS3Constants.EOF, ""));
+
+      TokenStream tokenStream = new TokenStream(tokens);
+      tokenStream.consume();
+
+      List<com.steadystate.css.parser.Token> tokensEmpty = new LinkedList<>();
+      Canonicalizer.consumeAComponentValue(tokenStream, tokensEmpty, 3);
+
+      Assert.assertEquals(tokensEmpty, tokens);
+
+      tokens = new LinkedList<>();
+      tokensEmpty = new LinkedList<>();
+      tokens.add(new com.steadystate.css.parser.Token(SACParserCSS3Constants.FUNCTION, "and"));
+      tokens.add(new com.steadystate.css.parser.Token(SACParserCSS3Constants.IDENT, "blue"));
+      tokens.add(new com.steadystate.css.parser.Token(SACParserCSS3Constants.EOF, ""));
+      tokenStream = new TokenStream(tokens);
+      tokenStream.consume();
+
+      Canonicalizer.consumeAComponentValue(tokenStream, tokensEmpty, 3);
+      Assert.assertEquals(tokensEmpty, tokens);
+
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  private ValidatorProtos.AtRuleSpec.BlockType defaultSpec;
+  private Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec;
+  private Canonicalizer canonicalizer;
+  private List<com.steadystate.css.parser.Token> tokenList;
+  private CssParser cssParser;
+
+  private static final String MEDIA_RULE = "@media (min-width: 500px) and (max-width: 600px) {\n"
+    + "    h1 {\n"
+    + "        color: fuchsia;\n"
+    + "        font-size: 12px;\n"
+    + "    }\n"
+    + "\n" + "    .desc:after {\n"
+    + "        content:\".\";\n"
+    + "    }\n"
+    + "}";
+  private static final String CSS_BODY = "        ul {\n"
+    + "            list-style: square url(());\n"
+    + "        }\n";
+  private static final String A_DECLARATION = "color: red;";
+
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/CssParserTest.java b/validator/java/src/test/java/dev/amp/validator/css/CssParserTest.java
new file mode 100644
index 0000000000000..5bb2fc1e5e517
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/CssParserTest.java
@@ -0,0 +1,136 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.Token;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * Test for {@link CssParser}
+ *
+ * @author GeorgeLuo
+ */
+
+public class CssParserTest {
+
+  @Test
+  public void testToCSSParseExceptionStrayTrailingBackslash() {
+    try {
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+      CssParser cssParser = new CssParser(CSS_CONTENT_STRAY_TRAILING_BACKSLASH,
+        0, 0, cssErrors);
+      List<Token> tokenList = cssParser.tokenize();
+
+      Assert.assertEquals(cssParser.getErrors().size(), 1);
+      Assert.assertEquals(cssParser.getErrors().get(0).getCode(),
+        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_STRAY_TRAILING_BACKSLASH);
+
+    } catch (IOException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testToCSSParseExceptionUnterminatedString() {
+    try {
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+      CssParser cssParser = new CssParser(CSS_CONTENT_UNTERMINATED_STRING,
+        0, 0, cssErrors);
+      List<Token> tokenList = cssParser.tokenize();
+
+      Assert.assertEquals(cssParser.getErrors().size(), 2);
+      Assert.assertEquals(cssParser.getErrors().get(0).getCode(),
+        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_STRING);
+      Assert.assertEquals(cssParser.getErrors().get(1).getCode(),
+        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_STRING);
+
+    } catch (IOException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testToCSSParseExceptionUnterminatedComment() {
+    try {
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+      CssParser cssParser = new CssParser(CSS_CONTENT_UNTERMINATED_COMMENT,
+        0, 0, cssErrors);
+      List<Token> tokenList = cssParser.tokenize();
+
+      Assert.assertEquals(cssParser.getErrors().size(), 1);
+      Assert.assertEquals(cssParser.getErrors().get(0).getCode(),
+        ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_COMMENT);
+
+    } catch (IOException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testTokenize() {
+    try {
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+      CssParser cssParser = new CssParser(CSS_CONTENT,
+        0, 0, cssErrors);
+      List<Token> tokenList = cssParser.tokenize();
+
+      Assert.assertEquals(tokenList.size(), 35);
+      Assert.assertEquals(cssParser.getErrors().size(), 0);
+
+      Assert.assertEquals(tokenList.get(0).image, "@media");
+      Assert.assertEquals(tokenList.get(9).image, "and");
+      Assert.assertEquals(tokenList.get(19).image, ".");
+      Assert.assertEquals(tokenList.get(29).image, "\n    ");
+
+    } catch (IOException e) {
+      e.printStackTrace();
+    }
+  }
+
+  private static final String CSS_CONTENT = "@media (min-width: 500px) and (max-width: 600px) {\n"
+    + "    .desc:after {\n"
+    + "        content:\".\";\n"
+    + "    }\n"
+    + "}";
+
+  private static final String CSS_CONTENT_UNTERMINATED_COMMENT = "    <style amp-custom>\n"
+    + "        h1 { color: red; }\n"
+    + "        @page :first {\n"
+    + "            margin: 1in;\n"
+    + "        }/*uhbuhbuyb\n";
+
+  private static final String CSS_CONTENT_UNTERMINATED_STRING = "        ul {\"\n"
+    + "        }\n"
+    + "        ul {'\n"
+    + "        }\n";
+
+  private static final String CSS_CONTENT_STRAY_TRAILING_BACKSLASH = "        body {\n"
+    + "            background-color: white;\n"
+    + "            color: beige;\\\n"
+    + "        }";
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/CssParsingConfigTest.java b/validator/java/src/test/java/dev/amp/validator/css/CssParsingConfigTest.java
new file mode 100644
index 0000000000000..da9f2d14ca939
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/CssParsingConfigTest.java
@@ -0,0 +1,83 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+import org.testng.Assert;
+import org.testng.annotations.BeforeTest;
+import org.testng.annotations.Test;
+
+import java.util.HashMap;
+import java.util.Map;
+
+/**
+ * Test for {@link CssParsingConfig}
+ *
+ * @author GeorgeLuo
+ */
+
+public class CssParsingConfigTest {
+
+  @BeforeTest
+  public void init() {
+    defaultSpec = ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE;
+    atRuleSpec = new HashMap<>();
+
+    atRuleSpec.put("$DEFAULT", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE);
+    atRuleSpec.put("media", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_RULES);
+    atRuleSpec.put("page", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS);
+  }
+
+  @Test
+  public void testComputeCssParsingConfig() {
+    final ValidatorProtos.CssSpec.Builder cssSpecBuilder = ValidatorProtos.CssSpec.newBuilder();
+
+    final ValidatorProtos.AtRuleSpec.Builder atRuleSpecBuilder1 = ValidatorProtos.AtRuleSpec.newBuilder();
+    atRuleSpecBuilder1.setType(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_RULES);
+    atRuleSpecBuilder1.setName("media");
+
+    final ValidatorProtos.AtRuleSpec.Builder atRuleSpecBuilder2 = ValidatorProtos.AtRuleSpec.newBuilder();
+    atRuleSpecBuilder2.setType(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS);
+    atRuleSpecBuilder2.setName("page");
+
+    final ValidatorProtos.AtRuleSpec.Builder atRuleSpecBuilder3 = ValidatorProtos.AtRuleSpec.newBuilder();
+    atRuleSpecBuilder3.setType(ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_ERROR);
+    atRuleSpecBuilder3.setName("$DEFAULT");
+
+    cssSpecBuilder.addAtRuleSpec(atRuleSpecBuilder1.build());
+    cssSpecBuilder.addAtRuleSpec(atRuleSpecBuilder2.build());
+    cssSpecBuilder.addAtRuleSpec(atRuleSpecBuilder3.build());
+
+    final ValidatorProtos.CssSpec cssSpec = cssSpecBuilder.build();
+    try {
+      final CssParsingConfig cssParsingConfig = CssParsingConfig.computeCssParsingConfig(cssSpec);
+      Assert.assertEquals(cssParsingConfig.getAtRuleSpec().size(), 3);
+      Assert.assertEquals(cssParsingConfig.getAtRuleSpec(), atRuleSpec);
+      Assert.assertEquals(cssParsingConfig.getDefaultSpec(), defaultSpec);
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  private Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec;
+  private ValidatorProtos.AtRuleSpec.BlockType defaultSpec;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/EOFTokenTest.java b/validator/java/src/test/java/dev/amp/validator/css/EOFTokenTest.java
new file mode 100644
index 0000000000000..44d665f65395d
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/EOFTokenTest.java
@@ -0,0 +1,40 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link EOFToken}
+ *
+ * @author GeorgeLuo
+ */
+
+public class EOFTokenTest {
+
+    @Test
+    public void testGetTokenType() {
+        Token eofToken = new EOFToken();
+        Assert.assertEquals(eofToken.getTokenType(), TokenType.EOF_TOKEN);
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/ErrorTokenTest.java b/validator/java/src/test/java/dev/amp/validator/css/ErrorTokenTest.java
new file mode 100644
index 0000000000000..81b7adf24b703
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/ErrorTokenTest.java
@@ -0,0 +1,58 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.ValidatorProtos;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * Test for {@link ErrorToken}
+ *
+ * @author GeorgeLuo
+ */
+
+public class ErrorTokenTest {
+
+  @Test
+  public void testGetters() {
+    try {
+      final String param = "param";
+      final List<String> params = new ArrayList<>();
+      params.add(param);
+
+      final ErrorToken errorToken
+        = new ErrorToken(ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_STRING, params);
+
+      Assert.assertEquals(errorToken.getParams(), params);
+      Assert.assertEquals(errorToken.getCode(), ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_STRING);
+
+      Assert.assertEquals(errorToken.getTokenType(), TokenType.ERROR);
+
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/ParsedCssUrlTest.java b/validator/java/src/test/java/dev/amp/validator/css/ParsedCssUrlTest.java
new file mode 100644
index 0000000000000..9f2fb8357d803
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/ParsedCssUrlTest.java
@@ -0,0 +1,52 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+package dev.amp.validator.css;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link ParsedCssUrl}
+ *
+ * @author GeorgeLuo
+ */
+
+public class ParsedCssUrlTest {
+
+    @Test
+    public void testGetAtRuleScope() {
+        ParsedCssUrl parsedCssUrl = new ParsedCssUrl();
+        Assert.assertEquals(parsedCssUrl.getAtRuleScope(), "");
+    }
+
+    @Test
+    public void testGetUtf8Url() {
+        ParsedCssUrl parsedCssUrl = new ParsedCssUrl();
+        parsedCssUrl.setUtf8Url("https://www.someurl.com");
+        Assert.assertEquals(parsedCssUrl.getUtf8Url(), "https://www.someurl.com");
+    }
+
+    @Test
+    public void testGetTokenType() {
+        ParsedCssUrl parsedCssUrl = new ParsedCssUrl();
+        Assert.assertEquals(parsedCssUrl.getTokenType(), TokenType.PARSED_CSS_URL);
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/QualifiedRuleTest.java b/validator/java/src/test/java/dev/amp/validator/css/QualifiedRuleTest.java
new file mode 100644
index 0000000000000..3eff942619dea
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/QualifiedRuleTest.java
@@ -0,0 +1,126 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.visitor.RuleVisitor;
+import org.mockito.Mockito;
+import org.mockito.invocation.InvocationOnMock;
+import org.mockito.stubbing.Answer;
+import org.testng.Assert;
+import org.testng.annotations.BeforeTest;
+import org.testng.annotations.Test;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import static org.mockito.Mockito.doAnswer;
+
+/**
+ * Test for {@link QualifiedRule}
+ *
+ * @author GeorgeLuo
+ */
+
+public class QualifiedRuleTest {
+
+    @BeforeTest
+    public void init() {
+        declaration = new Declaration("background-image");
+        declaration.setLine(0);
+        declaration.setCol(1);
+
+        List<Declaration> declarations = new ArrayList<>();
+        declarations.add(declaration);
+
+        qualifiedRule = new QualifiedRule();
+        qualifiedRule.setDeclarations(declarations);
+
+        rules = new ArrayList<>();
+        rules.add(qualifiedRule);
+
+        prelude = new ArrayList<>();
+        prelude.add(new Declaration("h1"));
+
+    }
+
+    @Test
+    public void testAccept() {
+
+        final RuleVisitor ruleVisitor = Mockito.mock(RuleVisitor.class);
+        try {
+
+          doAnswer(new Answer<Void>() {
+            public Void answer(final InvocationOnMock invocation) {
+              final Object[] args = invocation.getArguments();
+              Assert.assertEquals(((QualifiedRule) args[0]).getDeclarations().get(0).getName(), "background-image");
+              return null;
+            }
+          }).when(ruleVisitor).visitQualifiedRule(qualifiedRule);
+
+          doAnswer(new Answer<Void>() {
+            public Void answer(final InvocationOnMock invocation) {
+              final Object[] args = invocation.getArguments();
+              Assert.assertEquals(((Declaration) args[0]).getName(), "background-image");
+              return null;
+            }
+          }).when(ruleVisitor).visitDeclaration(Mockito.any(Declaration.class));
+
+          doAnswer(new Answer<Void>() {
+            public Void answer(final InvocationOnMock invocation) {
+              final Object[] args = invocation.getArguments();
+              Assert.assertEquals(((Declaration) args[0]).getName(), "background-image");
+              return null;
+            }
+          }).when(ruleVisitor).leaveDeclaration(Mockito.any(Declaration.class));
+
+            qualifiedRule.accept(ruleVisitor);
+        } catch (CssValidationException e) {
+            e.printStackTrace();
+        }
+    }
+
+    @Test
+    public void testGetTokenType() {
+        Assert.assertEquals(qualifiedRule.getTokenType(), TokenType.QUALIFIED_RULE);
+    }
+
+    @Test
+    public void testSetRules() {
+        qualifiedRule.setRules(rules);
+        Assert.assertEquals(qualifiedRule.getRules(), rules);
+    }
+
+    @Test
+    public void testSetDeclarations() {
+        Assert.assertEquals(qualifiedRule.getDeclarations().get(0), declaration);
+    }
+
+    @Test
+    public void testRuleName() {
+        qualifiedRule.ruleName();
+    }
+
+    private QualifiedRule qualifiedRule;
+    private List<Rule> rules;
+    private Declaration declaration;
+    private List<Token> prelude;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/StylesheetTest.java b/validator/java/src/test/java/dev/amp/validator/css/StylesheetTest.java
new file mode 100644
index 0000000000000..20a20443596b0
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/StylesheetTest.java
@@ -0,0 +1,86 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import dev.amp.validator.visitor.UrlFunctionVisitor;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.util.ArrayList;
+import java.util.List;
+
+/**
+ * Test for {@link Stylesheet}
+ *
+ * @author GeorgeLuo
+ */
+
+public class StylesheetTest {
+
+  @Test
+  public void testAccept() {
+    try {
+      final Stylesheet stylesheet = new Stylesheet();
+      final List<ErrorToken> cssErrors = new ArrayList<>();
+
+      final List<ParsedCssUrl> parsedCssUrls = new ArrayList<>();
+
+      final ParsedCssUrl parsedCssUrl1 = new ParsedCssUrl();
+      parsedCssUrl1.setUtf8Url("https://www.someurl1.com");
+
+      parsedCssUrls.add(parsedCssUrl1);
+
+      final ParsedCssUrl parsedCssUrl2 = new ParsedCssUrl();
+      parsedCssUrl2.setUtf8Url("https://www.someurl2.com");
+
+      parsedCssUrls.add(parsedCssUrl2);
+
+      final UrlFunctionVisitor visitor = new UrlFunctionVisitor(parsedCssUrls, cssErrors);
+
+      Declaration declaration = new Declaration("background-image");
+      declaration.setLine(0);
+      declaration.setCol(1);
+      declaration.getValue().add(new EOFToken());
+
+      List<Declaration> declarations = new ArrayList<>();
+      declarations.add(declaration);
+
+      QualifiedRule qualifiedRule = new QualifiedRule();
+      qualifiedRule.setDeclarations(declarations);
+
+      List<Rule> rules = new ArrayList<>();
+      rules.add(qualifiedRule);
+
+      stylesheet.setRules(rules);
+      stylesheet.accept(visitor);
+
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testGetTokenType() {
+    final Stylesheet stylesheet = new Stylesheet();
+    Assert.assertEquals(stylesheet.getTokenType(), TokenType.STYLESHEET);
+  }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/TokenStreamTest.java b/validator/java/src/test/java/dev/amp/validator/css/TokenStreamTest.java
new file mode 100644
index 0000000000000..8c59792d25a44
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/TokenStreamTest.java
@@ -0,0 +1,83 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.css;
+
+import com.steadystate.css.parser.SACParserCSS3Constants;
+import com.steadystate.css.parser.Token;
+import org.testng.Assert;
+import org.testng.annotations.BeforeTest;
+import org.testng.annotations.Test;
+
+import java.util.LinkedList;
+import java.util.List;
+
+/**
+ * Test for {@link TokenStream}
+ *
+ * @author GeorgeLuo
+ */
+
+public class TokenStreamTest {
+
+    @BeforeTest
+    public void init() throws Exception {
+        List<Token> tokens = new LinkedList<>();
+        tokens.add(new Token(SACParserCSS3Constants.S, " "));
+        tokens.add(new Token(SACParserCSS3Constants.IDENT, "square"));
+        tokens.add(new Token(SACParserCSS3Constants.EOF, ""));
+        tokenStream = new TokenStream(tokens);
+    }
+
+    @Test
+    public void testConsume() {
+        tokenStream.consume();
+        Token t = tokenStream.current();
+        Assert.assertEquals(t.kind, SACParserCSS3Constants.S);
+        Assert.assertEquals(t.image, " ");
+    }
+
+    @Test
+    public void testNext() {
+        Token t = tokenStream.next();
+        Assert.assertEquals(t.kind, SACParserCSS3Constants.IDENT);
+        Assert.assertEquals(t.image, "square");
+    }
+
+    @Test
+    public void testTokenAt() {
+        Token t = tokenStream.tokenAt(1);
+        Assert.assertEquals(t.kind, SACParserCSS3Constants.IDENT);
+        Assert.assertEquals(t.image, "square");
+    }
+
+    @Test
+    public void testReconsume() {
+        tokenStream.consume();
+        tokenStream.consume();
+        tokenStream.reconsume();
+        Token t = tokenStream.current();
+        Assert.assertEquals(t.kind, SACParserCSS3Constants.IDENT);
+        Assert.assertEquals(t.image, "square");
+    }
+
+    private TokenStream tokenStream;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/css/TokenTest.java b/validator/java/src/test/java/dev/amp/validator/css/TokenTest.java
new file mode 100644
index 0000000000000..e6def2f9151e0
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/css/TokenTest.java
@@ -0,0 +1,67 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+package dev.amp.validator.css;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link Token}
+ *
+ * @author GeorgeLuo
+ */
+
+public class TokenTest {
+
+    @Test
+    public void testGetTokenType() {
+        Token token = new Declaration("h1");
+        Assert.assertEquals(((Declaration) token).getTokenType(), TokenType.DECLARATION);
+    }
+
+    @Test
+    public void testSetLine() {
+        Declaration token = new Declaration("h1");
+        token.setLine(12);
+        Assert.assertEquals(token.getLine(), 12);
+    }
+
+    @Test
+    public void testSetCol() {
+        Declaration token = new Declaration("h1");
+        token.setCol(12);
+        Assert.assertEquals(token.getCol(), 12);
+    }
+
+    @Test
+    public void testGetValue() {
+        final Token token = new EOFToken();
+        Assert.assertEquals(token.getValue(), "EOF_TOKEN");
+    }
+
+    @Test
+    public void testTestToString() {
+        Token token = new Declaration("h1");
+        Assert.assertEquals(token.toString(), "DECLARATION");
+    }
+
+    private Token token;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/parser/AMPHtmlParserTest.java b/validator/java/src/test/java/dev/amp/validator/parser/AMPHtmlParserTest.java
new file mode 100644
index 0000000000000..8ba876ac3b701
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/parser/AMPHtmlParserTest.java
@@ -0,0 +1,1092 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.parser;
+
+import dev.amp.validator.ValidatorProtos;
+import dev.amp.validator.ExitCondition;
+import org.testng.Assert;
+import org.testng.annotations.BeforeClass;
+import org.testng.annotations.Test;
+
+import javax.annotation.Nonnull;
+import java.io.BufferedReader;
+import java.io.IOException;
+import java.io.InputStream;
+import java.io.InputStreamReader;
+
+public class AMPHtmlParserTest {
+  @BeforeClass
+  public void init() throws Exception {
+    ampHtmlParser = new AMPHtmlParser();
+  }
+
+  //VALIDATION TAG
+// TODO - Tagchowder implicitly added html tag to the parent of head.
+//    @Test
+//    public void testMandatoryTagMissing() {
+//        try {
+//            String inputHtml =
+//                    readFile(
+//                            "test-cases/tags/testMandatoryTagMissing.html");
+//            final int maxNode = 10000;
+//            ValidatorProtos.ValidationResult result =
+//                    ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+//            Assert.assertEquals(result.getErrorsCount(), 3, "Expecting to have 3 error");
+//            Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.WRONG_PARENT_TAG);
+//            Assert.assertTrue(result.getErrors(1).getCode() == ValidatorProtos.ValidationError.Code.WRONG_PARENT_TAG);
+//            Assert.assertTrue(result.getErrors(2).getCode() == ValidatorProtos.ValidationError.Code.MANDATORY_TAG_MISSING);
+//        } catch (final IOException ex) {
+//            ex.printStackTrace();
+//        }
+//    }
+
+  @Test
+  public void testTagRequiredByMissing() {
+  }
+
+  @Test
+  public void getTagExcludedByTag() {
+  }
+
+  @Test
+  public void testDisallowedTag() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testDisallowedTag.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_TAG);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testDisallowedScriptTag() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testDisallowedScriptTag.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_SCRIPT_TAG);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testDuplicateUniqueTag() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testDuplicateUniqueTag.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DUPLICATE_UNIQUE_TAG);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testWrongParentTag() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testWrongParentTag.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.WRONG_PARENT_TAG);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testDisallowedTagAncestor() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testDisallowedTagAncestor.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_TAG_ANCESTOR);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testMandatoryLastChildTag() {
+
+  }
+
+  @Test
+  public void testMandatoryTagAncestor() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testMandatoryTagAncestor.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.MANDATORY_TAG_ANCESTOR);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testMandatoryTagAncestorWithHint() {
+
+  }
+
+  @Test
+  public void testIncorrectNumChildTags() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testIncorrectNumChildTags.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.INCORRECT_NUM_CHILD_TAGS);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testIncorrectMinNumChildTag() {
+
+  }
+
+  @Test
+  public void testDisallowedChildTagName() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testDisallowedChildTagName.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_CHILD_TAG_NAME);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testDisallowedFirstChildTagName() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testDisallowedFirstChildTagName.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_FIRST_CHILD_TAG_NAME);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testChildTagDoesNotSatisfyReferencePoint() {
+
+  }
+
+  @Test
+  public void testTagNotAllowedToHaveSiblings() {
+
+  }
+
+  @Test
+  public void testReferencePointConflict() {
+
+  }
+
+  @Test
+  public void testChildTagDoesNotSatisfyReferencePointSingular() {
+
+  }
+
+  @Test
+  public void testBaseTagMustProceedAllUrls() {
+
+  }
+
+  @Test
+  public void testMaxParseNodesException() {
+//        try {
+//            String inputHtml =
+//                    readFile(
+//                            "test-cases/testPass1.html");
+//            final int maxNode = 2;
+//            ValidatorProtos.ValidationResult result =
+//                    ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+//            Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have max parse nodes error");
+//            //Assert.assertEquals(result.getErrors(0).getParams(0),
+//                    //"Maximum nodes reached parsing HTML");
+//        } catch (final IOException ex) {
+//            ex.printStackTrace();
+//        }
+  }
+
+  @Test
+  public void testMissingRequiredExtension() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testMissingRequiredExtension.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.MISSING_REQUIRED_EXTENSION);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testSpecifiedLayoutInvalid() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testSpecifiedLayoutInvalid.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.SPECIFIED_LAYOUT_INVALID);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testTagReferencePointConflict() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testTagReferencePointConflict.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 2, "Expecting to have 2 errors");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_TAG_ANCESTOR);
+      Assert.assertTrue(result.getErrors(1).getCode() == ValidatorProtos.ValidationError.Code.TAG_REFERENCE_POINT_CONFLICT);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testDeprecatedTag() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testDeprecatedTag.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DEPRECATED_TAG);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testExtensionUnused() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testExtensionUnused.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.EXTENSION_UNUSED);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testNonWhitespaceCdataEncountered() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testNonWhitespaceCdataEncountered.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.NON_WHITESPACE_CDATA_ENCOUNTERED);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+
+  @Test
+  public void testMandatoryCdataMissingOrIncorrect() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testMandatoryCdataMissingOrIncorrect.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.MANDATORY_CDATA_MISSING_OR_INCORRECT);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testInvalidJsonCdata() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/tags/testInvalidJsonCdata.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.INVALID_JSON_CDATA);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  //VALIDATION ATTRIBUTES
+
+  @Test
+  public void testDisallowedAttr() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testDisallowedAttr.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 2, "Expecting to have 2 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR);
+      Assert.assertTrue(result.getErrors(1).getCode() == ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING);
+      // TODO : write a containsError helper method
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testInvalidAttrValue() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testInvalidAttrValue.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  // TODO : waiting on TagChowder fix
+  @Test
+  public void testDuplicateAttribute() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testDuplicateAttribute.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+//            Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+//            Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DUPLICATE_ATTRIBUTE);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testMandatoryAttrMissing() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testMandatoryAttrMissing.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.MANDATORY_ATTR_MISSING);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testAttrMissingRequiredExtension() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testAttrMissingRequiredExtension.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.ATTR_MISSING_REQUIRED_EXTENSION);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  // VALIDATION TEMPLATE
+
+  @Test
+  public void testTemplateInAttrName() {
+    try {
+      //TODO - TagChowder is removing '{{ }}'.
+      String inputHtml =
+        readFile(
+          "test-cases/templates/testTemplateInAttrName.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR);
+      //Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.TEMPLATE_IN_ATTR_NAME);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testUnescapedTemplateInAttrValue() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/templates/testUnescapedTemplateInAttrValue.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.UNESCAPED_TEMPLATE_IN_ATTR_VALUE);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testTemplatePartialInAttrValue() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/templates/testTemplatePartialInAttrValue.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.TEMPLATE_PARTIAL_IN_ATTR_VALUE);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testMissingLayoutAttributes() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testMissingLayoutAttributes.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.MISSING_LAYOUT_ATTRIBUTES);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testAttrDisallowedBySpecifiedLayout() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testAttrDisallowedBySpecifiedLayout.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.ATTR_DISALLOWED_BY_SPECIFIED_LAYOUT);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testAttrDisallowedByImpliedLayout() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testAttrDisallowedByImpliedLayout.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.ATTR_DISALLOWED_BY_IMPLIED_LAYOUT);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testAttrValueRequiredByLayout() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testAttrValueRequiredByLayout.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.ATTR_VALUE_REQUIRED_BY_LAYOUT);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testImpliedLayoutInvalid() {
+//        try {
+//            String inputHtml =
+//                    readFile(
+//                            "test-cases/attributes/testImpliedLayoutInvalid.html");
+//            final int maxNode = 10000;
+//            ValidatorProtos.ValidationResult result =
+//                    ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+//            Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+//            Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.IMPLIED_LAYOUT_INVALID);
+//        } catch (final IOException ex) {
+//            ex.printStackTrace();
+//        }
+  }
+
+  @Test
+  public void testInconsistentUnitsForWidthAndHeight() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testInconsistentUnitsForWidthAndHeight.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.INCONSISTENT_UNITS_FOR_WIDTH_AND_HEIGHT);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testAttrRequiredButMissing() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testAttrRequiredButMissing.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.ATTR_REQUIRED_BUT_MISSING);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testDisallowedPropertyInAttrValue() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testDisallowedPropertyInAttrValue.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_PROPERTY_IN_ATTR_VALUE);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testMissingUrl() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testMissingUrl.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.MISSING_URL);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testDisallowedRelativeUrl() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testDisallowedRelativeUrl.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DISALLOWED_RELATIVE_URL);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testInvalidUrlProtocol() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/attributes/testInvalidUrlProtocol.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.INVALID_URL_PROTOCOL);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+
+  // VALIDATION CSS
+
+  // TODO: debugging indicates the CSS is tokenized before the length check. Should validate length before.
+  @Test
+  public void testStylesheetTooLong() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testStylesheetTooLong.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.STYLESHEET_TOO_LONG);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testInlineStyleTooLong() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testInlineStyleTooLong.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.INLINE_STYLE_TOO_LONG);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxUnterminatedComment() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxUnterminatedComment.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_COMMENT);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSUnterminatedString() {
+    try {
+      //TODO - Results add additional CSS_SYNTAX_INVALID_DECLARATION (should only return unterminated error)
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxUnterminatedString.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 4, "Expecting to have 4 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_STRING);
+      Assert.assertTrue(result.getErrors(1).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_UNTERMINATED_STRING);
+      Assert.assertTrue(result.getErrors(2).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_DECLARATION);
+      Assert.assertTrue(result.getErrors(3).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_DECLARATION);
+
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxStrayTrailingBackslash() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxStrayTrailingBackslash.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 2, "Expecting to have 2 errors.");
+      Assert.assertTrue(result.getErrors(0).getCode()
+        == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_STRAY_TRAILING_BACKSLASH);
+      Assert.assertTrue(result.getErrors(1).getCode()
+        == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_DECLARATION);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxInvalidDeclaration() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxInvalidDeclaration.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_DECLARATION);
+
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxIncompleteDeclaration() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxIncompleteDeclaration.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INCOMPLETE_DECLARATION);
+
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxDisallowedMediaType() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxDisallowedMediaType.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_MEDIA_TYPE);
+
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxDisallowedPropertyValue() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxDisallowedPropertyValue.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE);
+
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxInvalidAtRule() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxInvalidAtRule.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 4, "Expecting to have 4 errors");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_AT_RULE);
+      Assert.assertTrue(result.getErrors(1).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_AT_RULE);
+      Assert.assertTrue(result.getErrors(2).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_AT_RULE);
+      Assert.assertTrue(result.getErrors(3).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_AT_RULE);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxMalformedMediaQuery() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxMalformedMediaQuery.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_MALFORMED_MEDIA_QUERY);
+
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxDisallowedMediaFeature() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxDisallowedMediaFeature.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error.");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_MEDIA_FEATURE);
+
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxMissingURL() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxMissingURL.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_MISSING_URL);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxBadUrl() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxBadUrl.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_BAD_URL);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSExcessivelyNested() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSExcessivelyNested.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_EXCESSIVELY_NESTED);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+//    @Test
+//    public void testCSSDisallowedRelativeURL() {
+//        try {
+//            String inputHtml =
+//                    readFile(
+//                            "test-cases/css/testCSSDisallowedRelativeURL.html");
+//            final int maxNode = 10000;
+//            ValidatorProtos.ValidationResult result =
+//                    ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+//            Assert.assertEquals(result.getErrorsCount(), 0, "Expecting to have 1 error");
+//            Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_DISALLOWED_RELATIVE_URL);
+//        } catch (final IOException ex) {
+//            ex.printStackTrace();
+//        }
+//    }
+
+  @Test
+  public void testCSSSyntaxInvalidUrlProtocol() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCSSSyntaxInvalidUrlProtocol.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_URL_PROTOCOL);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testCSSSyntaxInvalidUrl() {
+//        try {
+//            String inputHtml =
+//                    readFile(
+//                            "test-cases/css/testCSSSyntaxInvalidUrl.html");
+//            final int maxNode = 10000;
+//            ValidatorProtos.ValidationResult result =
+//                    ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+//            Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+//            Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CSS_SYNTAX_INVALID_URL);
+//        } catch (final IOException ex) {
+//            ex.printStackTrace();
+//        }
+  }
+
+  // VALIDATION MISC
+
+  @Test
+  public void testWarningExtensionDeprecatedVersion() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/misc/testWarningExtensionDeprecatedVersion.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.WARNING_EXTENSION_DEPRECATED_VERSION);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  // VALIDATION NON-AMP4EMAIL
+
+  @Test
+  public void testDuplicateDimension() {
+//        try {
+//            String inputHtml =
+//                    readFile(
+//                            "test-cases/attributes/testDuplicateDimension.html");
+//            final int maxNode = 10000;
+//            ValidatorProtos.ValidationResult result =
+//                    ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP, ExitCondition.FULL_PARSING, maxNode);
+//            Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+//            Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.DUPLICATE_DIMENSION);
+//        } catch (final IOException ex) {
+//            ex.printStackTrace();
+//        }
+  }
+
+  @Test
+  public void testCdataViolatesBlacklist() {
+    try {
+      String inputHtml =
+        readFile(
+          "test-cases/css/testCdataViolatesBlacklist.html");
+      final int maxNode = 10000;
+      ValidatorProtos.ValidationResult result =
+        ampHtmlParser.parse(inputHtml, ValidatorProtos.HtmlFormat.Code.AMP4EMAIL, ExitCondition.FULL_PARSING, maxNode);
+      Assert.assertEquals(result.getErrorsCount(), 1, "Expecting to have 1 error");
+      Assert.assertTrue(result.getErrors(0).getCode() == ValidatorProtos.ValidationError.Code.CDATA_VIOLATES_BLACKLIST);
+    } catch (final IOException ex) {
+      ex.printStackTrace();
+    }
+  }
+
+  public static String readFile(@Nonnull final String filePath) throws IOException {
+    final StringBuilder sb = new StringBuilder();
+    final InputStream is =
+      Thread.currentThread().getContextClassLoader().getResourceAsStream(filePath);
+    try (BufferedReader br = new BufferedReader(new InputStreamReader(is))) {
+      String currentLine;
+      while ((currentLine = br.readLine()) != null) {
+        sb.append(currentLine).append("\n");
+      }
+    }
+    return sb.toString();
+  }
+
+  /**
+   * AMPHtmlParser instance.
+   */
+  private AMPHtmlParser ampHtmlParser;
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/utils/AttributeSpecUtilsTest.java b/validator/java/src/test/java/dev/amp/validator/utils/AttributeSpecUtilsTest.java
new file mode 100644
index 0000000000000..dd5cce13e5033
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/utils/AttributeSpecUtilsTest.java
@@ -0,0 +1,411 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import dev.amp.validator.Context;
+import dev.amp.validator.ParsedAttrSpec;
+import dev.amp.validator.ParsedAttrSpecs;
+import dev.amp.validator.ParsedHtmlTag;
+import dev.amp.validator.ParsedTagSpec;
+import dev.amp.validator.ParsedValidatorRules;
+import dev.amp.validator.TagStack;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.exception.TagValidationException;
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Attributes;
+import org.xml.sax.Locator;
+
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+import java.util.regex.Pattern;
+
+/**
+ * Test for {@link AttributeSpecUtils}
+ *
+ * @author GeorgeLuo
+ */
+
+public class AttributeSpecUtilsTest {
+
+  @Test
+  public void testIsUsedForTypeIdentifiers() {
+    final List<String> typeIdentifiers = new ArrayList<>();
+    final List<String> enabledBys = new ArrayList<>();
+    final List<String> disabledBys = new ArrayList<>();
+
+    typeIdentifiers.add("amp4email");
+    enabledBys.add("enablingId");
+    typeIdentifiers.add("transformed");
+    Assert.assertFalse(AttributeSpecUtils.isUsedForTypeIdentifiers(typeIdentifiers, enabledBys, disabledBys));
+
+    typeIdentifiers.add("enablingId");
+    Assert.assertTrue(AttributeSpecUtils.isUsedForTypeIdentifiers(typeIdentifiers, enabledBys, disabledBys));
+
+    enabledBys.clear();
+    typeIdentifiers.add("disablingId");
+    disabledBys.add("disablingId");
+    Assert.assertFalse(AttributeSpecUtils.isUsedForTypeIdentifiers(typeIdentifiers, enabledBys, disabledBys));
+
+    typeIdentifiers.clear();
+    Assert.assertTrue(AttributeSpecUtils.isUsedForTypeIdentifiers(typeIdentifiers, enabledBys, disabledBys));
+
+    enabledBys.clear();
+    disabledBys.clear();
+    Assert.assertTrue(AttributeSpecUtils.isUsedForTypeIdentifiers(typeIdentifiers, enabledBys, disabledBys));
+  }
+
+  // TODO : write assertions for mocks that touch notable objects
+  @Test
+  public void testValidateAttributes() {
+
+    // IMPLIED_LAYOUT_INVALID
+
+    final ValidatorProtos.AmpLayout.Builder ampLayoutBuilder = ValidatorProtos.AmpLayout.newBuilder();
+
+    ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+
+    tagSpecBuilder.setAmpLayout(ampLayoutBuilder.build());
+
+    ValidatorProtos.AttrSpec.Builder attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+    attrSpecBuilder.setDeprecation("deprecationString");
+    List<ValidatorProtos.AttrSpec> attrSpecs = new ArrayList<>();
+    attrSpecs.add(attrSpecBuilder.build());
+
+    Map<String, ValidatorProtos.AttrSpec> attrsByName = new HashMap<>();
+    attrsByName.put("HTML", attrSpecBuilder.build());
+
+    ParsedTagSpec parsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+    Mockito.when(parsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+    Mockito.when(parsedTagSpec.getImplicitAttrspecs()).thenReturn(attrSpecs);
+    Mockito.when(parsedTagSpec.getAttrsByName()).thenReturn(attrsByName);
+
+    ParsedTagSpec bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+    TagStack tagStack = Mockito.mock(TagStack.class);
+
+    ParsedAttrSpec parsedAttrSpec = Mockito.mock(ParsedAttrSpec.class);
+    Mockito.when(parsedAttrSpec.isUsedForTypeIdentifiers(Mockito.anyList())).thenReturn(true);
+    Mockito.when(parsedAttrSpec.getSpec()).thenReturn(attrSpecBuilder.build());
+
+    ParsedAttrSpecs parsedAttrSpecs = Mockito.mock(ParsedAttrSpecs.class);
+    Mockito.when(parsedAttrSpecs.getParsedAttrSpec("HTML", "htmlValue",
+      attrSpecBuilder.build())).thenReturn(parsedAttrSpec);
+
+    ParsedValidatorRules parsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+    Mockito.when(parsedValidatorRules.getParsedAttrSpecs()).thenReturn(parsedAttrSpecs);
+
+    Context context = Mockito.mock(Context.class);
+    Mockito.when(context.getTagStack()).thenReturn(tagStack);
+    Mockito.when(context.getRules()).thenReturn(parsedValidatorRules);
+
+    Attributes attributes = Mockito.mock(Attributes.class);
+    Mockito.when(attributes.getLength()).thenReturn(1);
+    Mockito.when(attributes.getLocalName(0)).thenReturn("HTML");
+    Mockito.when(attributes.getValue(0)).thenReturn("htmlValue");
+
+
+    ParsedHtmlTag encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+    Mockito.when(encounteredTag.upperName()).thenReturn("HTML");
+    Mockito.when(encounteredTag.attrs()).thenReturn(attributes);
+
+    ValidatorProtos.ValidationResult.Builder result = ValidatorProtos.ValidationResult.newBuilder();
+
+    try {
+      AttributeSpecUtils.validateAttributes(parsedTagSpec, bestMatchReferencePoint, context, encounteredTag, result);
+    } catch (TagValidationException | IOException | CssValidationException e) {
+      e.printStackTrace();
+    }
+
+    ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+    ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+    ArgumentCaptor<ValidatorProtos.ValidationError.Code> warningCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+    Mockito.verify(context, Mockito.times(1)).addError(errorCodeCapture.capture(),
+      Mockito.any(Locator.class),
+      listCaptor.capture(),
+      Mockito.anyString(),
+      Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    Mockito.verify(context, Mockito.times(1)).addWarning(warningCodeCapture.capture(),
+      Mockito.any(Locator.class),
+      listCaptor.capture(),
+      Mockito.anyString(),
+      Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+
+    Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.IMPLIED_LAYOUT_INVALID);
+    Assert.assertEquals(warningCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DEPRECATED_ATTR);
+
+    // DISALLOWED_ATTR
+
+    tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+
+    attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+//    attrSpecBuilder.setDeprecation("deprecationString");
+    attrSpecs = new ArrayList<>();
+    attrSpecs.add(attrSpecBuilder.build());
+
+    attrsByName = new HashMap<>();
+    attrsByName.put("HTML", attrSpecBuilder.build());
+
+    parsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+    Mockito.when(parsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+    Mockito.when(parsedTagSpec.getImplicitAttrspecs()).thenReturn(attrSpecs);
+    Mockito.when(parsedTagSpec.getAttrsByName()).thenReturn(attrsByName);
+
+    bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+    tagStack = Mockito.mock(TagStack.class);
+
+    parsedAttrSpec = Mockito.mock(ParsedAttrSpec.class);
+    Mockito.when(parsedAttrSpec.isUsedForTypeIdentifiers(Mockito.anyList())).thenReturn(false);
+    Mockito.when(parsedAttrSpec.getSpec()).thenReturn(attrSpecBuilder.build());
+
+    parsedAttrSpecs = Mockito.mock(ParsedAttrSpecs.class);
+    Mockito.when(parsedAttrSpecs.getParsedAttrSpec("HTML", "htmlValue", attrSpecBuilder.build())).thenReturn(parsedAttrSpec);
+
+    parsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+    Mockito.when(parsedValidatorRules.getParsedAttrSpecs()).thenReturn(parsedAttrSpecs);
+
+    context = Mockito.mock(Context.class);
+    Mockito.when(context.getTagStack()).thenReturn(tagStack);
+    Mockito.when(context.getRules()).thenReturn(parsedValidatorRules);
+
+    attributes = Mockito.mock(Attributes.class);
+    Mockito.when(attributes.getLength()).thenReturn(1);
+    Mockito.when(attributes.getLocalName(0)).thenReturn("HTML");
+    Mockito.when(attributes.getValue(0)).thenReturn("htmlValue");
+
+    encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+    Mockito.when(encounteredTag.upperName()).thenReturn("HTML");
+    Mockito.when(encounteredTag.attrs()).thenReturn(attributes);
+
+    result = ValidatorProtos.ValidationResult.newBuilder();
+
+    try {
+      AttributeSpecUtils.validateAttributes(parsedTagSpec, bestMatchReferencePoint, context, encounteredTag, result);
+    } catch (TagValidationException | IOException | CssValidationException e) {
+      e.printStackTrace();
+    }
+
+    listCaptor = ArgumentCaptor.forClass(List.class);
+    errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+    Mockito.verify(context, Mockito.times(1)).addError(errorCodeCapture.capture(),
+      Mockito.any(Locator.class),
+      listCaptor.capture(),
+      Mockito.anyString(),
+      Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DISALLOWED_ATTR);
+
+    // INVALID_ATTR_VALUE
+
+    tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+
+    attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+    attrSpecBuilder.setBlacklistedValueRegex("");
+    attrSpecs = new ArrayList<>();
+    attrSpecs.add(attrSpecBuilder.build());
+
+    attrsByName = new HashMap<>();
+    attrsByName.put("HTML", attrSpecBuilder.build());
+
+    parsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+    Mockito.when(parsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+    Mockito.when(parsedTagSpec.getImplicitAttrspecs()).thenReturn(attrSpecs);
+    Mockito.when(parsedTagSpec.getAttrsByName()).thenReturn(attrsByName);
+
+    bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+    tagStack = Mockito.mock(TagStack.class);
+
+    parsedAttrSpec = Mockito.mock(ParsedAttrSpec.class);
+    Mockito.when(parsedAttrSpec.isUsedForTypeIdentifiers(Mockito.anyList())).thenReturn(true);
+    Mockito.when(parsedAttrSpec.getSpec()).thenReturn(attrSpecBuilder.build());
+
+    parsedAttrSpecs = Mockito.mock(ParsedAttrSpecs.class);
+    Mockito.when(parsedAttrSpecs.getParsedAttrSpec("HTML", "htmlValue", attrSpecBuilder.build())).thenReturn(parsedAttrSpec);
+
+    parsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+    Mockito.when(parsedValidatorRules.getParsedAttrSpecs()).thenReturn(parsedAttrSpecs);
+    Mockito.when(parsedValidatorRules.getPartialMatchCaseiRegex(Mockito.anyString())).thenReturn(Pattern.compile(""));
+
+    context = Mockito.mock(Context.class);
+    Mockito.when(context.getTagStack()).thenReturn(tagStack);
+    Mockito.when(context.getRules()).thenReturn(parsedValidatorRules);
+
+    attributes = Mockito.mock(Attributes.class);
+    Mockito.when(attributes.getLength()).thenReturn(1);
+    Mockito.when(attributes.getLocalName(0)).thenReturn("HTML");
+    Mockito.when(attributes.getValue(0)).thenReturn("htmlValue");
+
+    encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+    Mockito.when(encounteredTag.upperName()).thenReturn("HTML");
+    Mockito.when(encounteredTag.attrs()).thenReturn(attributes);
+
+    result = ValidatorProtos.ValidationResult.newBuilder();
+
+    try {
+      AttributeSpecUtils.validateAttributes(parsedTagSpec, bestMatchReferencePoint, context, encounteredTag, result);
+    } catch (TagValidationException | IOException | CssValidationException e) {
+      e.printStackTrace();
+    }
+
+    listCaptor = ArgumentCaptor.forClass(List.class);
+    errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+    Mockito.verify(context, Mockito.times(1)).addError(errorCodeCapture.capture(),
+      Mockito.any(Locator.class),
+      listCaptor.capture(),
+      Mockito.anyString(),
+      Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.INVALID_ATTR_VALUE);
+
+    // BASE_TAG_MUST_PRECEED_ALL_URLS
+
+    tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+    tagSpecBuilder.setTagName("BASE");
+
+    attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+    attrSpecs = new ArrayList<>();
+    attrSpecs.add(attrSpecBuilder.build());
+
+    attrsByName = new HashMap<>();
+    attrsByName.put("attr", attrSpecBuilder.build());
+    attrsByName.put("href", attrSpecBuilder.build());
+
+    parsedTagSpec = Mockito.mock(ParsedTagSpec.class);
+    Mockito.when(parsedTagSpec.getSpec()).thenReturn(tagSpecBuilder.build());
+    Mockito.when(parsedTagSpec.getImplicitAttrspecs()).thenReturn(attrSpecs);
+    Mockito.when(parsedTagSpec.getAttrsByName()).thenReturn(attrsByName);
+
+    bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+    tagStack = Mockito.mock(TagStack.class);
+
+    parsedAttrSpec = Mockito.mock(ParsedAttrSpec.class);
+    Mockito.when(parsedAttrSpec.isUsedForTypeIdentifiers(Mockito.anyList())).thenReturn(true);
+    Mockito.when(parsedAttrSpec.getSpec()).thenReturn(attrSpecBuilder.build());
+
+    parsedAttrSpecs = Mockito.mock(ParsedAttrSpecs.class);
+    Mockito.when(parsedAttrSpecs.getParsedAttrSpec("attr", "attrValue", attrSpecBuilder.build())).thenReturn(parsedAttrSpec);
+    Mockito.when(parsedAttrSpecs.getParsedAttrSpec("href", "hrefValue", attrSpecBuilder.build())).thenReturn(parsedAttrSpec);
+
+    parsedValidatorRules = Mockito.mock(ParsedValidatorRules.class);
+    Mockito.when(parsedValidatorRules.getParsedAttrSpecs()).thenReturn(parsedAttrSpecs);
+    Mockito.when(parsedValidatorRules.getPartialMatchCaseiRegex(Mockito.anyString())).thenReturn(Pattern.compile(""));
+
+    context = Mockito.mock(Context.class);
+    Mockito.when(context.getTagStack()).thenReturn(tagStack);
+    Mockito.when(context.getRules()).thenReturn(parsedValidatorRules);
+    Mockito.when(context.hasSeenUrl()).thenReturn(true);
+
+    attributes = Mockito.mock(Attributes.class);
+    Mockito.when(attributes.getLength()).thenReturn(1);
+    Mockito.when(attributes.getLocalName(0)).thenReturn("href");
+    Mockito.when(attributes.getValue(0)).thenReturn("hrefValue");
+
+    encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+    Mockito.when(encounteredTag.upperName()).thenReturn("BASE");
+    Mockito.when(encounteredTag.attrs()).thenReturn(attributes);
+
+    result = ValidatorProtos.ValidationResult.newBuilder();
+
+    try {
+      AttributeSpecUtils.validateAttributes(parsedTagSpec, bestMatchReferencePoint, context, encounteredTag, result);
+    } catch (TagValidationException | IOException | CssValidationException e) {
+      e.printStackTrace();
+    }
+
+    listCaptor = ArgumentCaptor.forClass(List.class);
+    errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+    Mockito.verify(context, Mockito.times(1)).addError(errorCodeCapture.capture(),
+      Mockito.any(Locator.class),
+      listCaptor.capture(),
+      Mockito.anyString(),
+      Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+    Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.BASE_TAG_MUST_PRECEED_ALL_URLS);
+  }
+
+  @Test
+  public void testValidateAttrRequiredExtensions() {
+  }
+
+  @Test
+  public void testValidateAttrDeclaration() {
+  }
+
+  @Test
+  public void testAttrValueHasTemplateSyntax() {
+  }
+
+  @Test
+  public void testValidateNonTemplateAttrValueAgainstSpec() {
+  }
+
+  @Test
+  public void testValidateAttrValueProperties() {
+  }
+
+  @Test
+  public void testValidateAttrValueUrl() {
+  }
+
+  @Test
+  public void testValidateUrlAndProtocol() {
+  }
+
+  @Test
+  public void testValidateLayout() {
+  }
+
+  @Test
+  public void testValidateAttributeInExtension() {
+  }
+
+  @Test
+  public void testGetExtensionNameAttribute() {
+  }
+
+  @Test
+  public void testValidateAttrNotFoundInSpec() {
+  }
+
+  @Test
+  public void testValidateAttrValueBelowTemplateTag() {
+  }
+
+  @Test
+  public void testAttrValueHasPartialsTemplateSyntax() {
+  }
+
+  @Test
+  public void testAttrValueHasUnescapedTemplateSyntax() {
+  }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/utils/CssSpecUtilsTest.java b/validator/java/src/test/java/dev/amp/validator/utils/CssSpecUtilsTest.java
new file mode 100644
index 0000000000000..b3172ba85f797
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/utils/CssSpecUtilsTest.java
@@ -0,0 +1,247 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import com.steadystate.css.parser.SACParserCSS3Constants;
+import com.steadystate.css.parser.Token;
+import dev.amp.validator.css.AtRule;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.css.Declaration;
+import dev.amp.validator.css.ErrorToken;
+import dev.amp.validator.css.ParsedCssUrl;
+import dev.amp.validator.css.Stylesheet;
+import dev.amp.validator.visitor.RuleVisitor;
+import org.mockito.Mockito;
+import org.mockito.invocation.InvocationOnMock;
+import org.mockito.stubbing.Answer;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+import java.util.HashMap;
+import java.util.LinkedList;
+import java.util.List;
+import java.util.Map;
+import java.util.ArrayList;
+
+import static org.mockito.Mockito.doAnswer;
+
+/**
+ * Test for {@link CssSpecUtils}
+ *
+ * @author GeorgeLuo
+ */
+
+public class CssSpecUtilsTest {
+
+  @Test
+  public void testParseAStylesheet() {
+    final List<Token> tokens = new LinkedList<>();
+    tokens.add(new Token(75, "@media"));
+    tokens.add(new Token(1, " "));
+    tokens.add(new Token(22, "screen"));
+    tokens.add(new Token(55, "{"));
+    tokens.add(new Token(56, "}"));
+    tokens.add(new Token(56, "}"));
+    tokens.add(new Token(1, "\n"));
+    tokens.add(new Token(0, ""));
+
+    final Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec = new HashMap<>();
+    atRuleSpec.put("$DEFAULT", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE);
+    atRuleSpec.put("media", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_RULES);
+    atRuleSpec.put("page", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS);
+
+    final ValidatorProtos.AtRuleSpec.BlockType defaultSpec = ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE;
+    final List<ErrorToken> errors = new ArrayList<>();
+
+    try {
+      final Stylesheet stylesheet = CssSpecUtils.parseAStylesheet(tokens, atRuleSpec, defaultSpec, errors);
+
+      final RuleVisitor ruleVisitor = Mockito.mock(RuleVisitor.class);
+
+      doAnswer(new Answer<Void>() {
+        public Void answer(final InvocationOnMock invocation) {
+          final Object[] args = invocation.getArguments();
+          Assert.assertEquals(((AtRule) args[0]).getName(), "media");
+          Assert.assertEquals(((AtRule) args[0]).getPrelude().size(), 3);
+          Assert.assertEquals(((AtRule) args[0]).getPrelude().get(0).toString(), " ");
+          Assert.assertEquals(((AtRule) args[0]).getPrelude().get(1).toString(), "screen");
+          Assert.assertEquals(((AtRule) args[0]).getPrelude().get(2).kind, 0);
+          return null;
+        }
+      }).when(ruleVisitor).visitAtRule(Mockito.any(AtRule.class));
+      stylesheet.accept(ruleVisitor);
+
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testExtractUrls() {
+
+    final List<Token> tokens = new LinkedList<>();
+    tokens.add(new Token(22, "@media"));
+    tokens.add(new Token(55, "screen"));
+    tokens.add(new Token(1, "\n"));
+    tokens.add(new Token(22, "background-image"));
+    tokens.add(new Token(61, ":"));
+    tokens.add(new Token(100, "https://www.somesite.com/image.jpg"));
+    tokens.add(new Token(60, ";"));
+    tokens.add(new Token(1, "\n"));
+    tokens.add(new Token(0, ""));
+
+
+    final Map<String, ValidatorProtos.AtRuleSpec.BlockType> atRuleSpec = new HashMap<>();
+    atRuleSpec.put("$DEFAULT", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE);
+    atRuleSpec.put("media", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_RULES);
+    atRuleSpec.put("page", ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_DECLARATIONS);
+
+    final ValidatorProtos.AtRuleSpec.BlockType defaultSpec = ValidatorProtos.AtRuleSpec.BlockType.PARSE_AS_IGNORE;
+    final List<ErrorToken> errors = new ArrayList<>();
+    final List<ParsedCssUrl> parsedUrls = new ArrayList<>();
+
+    try {
+      final Stylesheet stylesheet = CssSpecUtils.parseAStylesheet(tokens, atRuleSpec, defaultSpec, errors);
+      CssSpecUtils.extractUrls(stylesheet, parsedUrls, errors);
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+
+    Assert.assertEquals(parsedUrls.size(), 1);
+    Assert.assertEquals(parsedUrls.get(0).getUtf8Url(), "https://www.somesite.com/image.jpg");
+
+  }
+
+  @Test
+  public void testStripVendorPrefix() {
+    Assert.assertEquals(CssSpecUtils.stripVendorPrefix("-moz-keyframes"), "keyframes");
+    Assert.assertEquals(CssSpecUtils.stripVendorPrefix("-o-keyframes"), "keyframes");
+    Assert.assertEquals(CssSpecUtils.stripVendorPrefix("-webkit-keyframes"), "keyframes");
+    Assert.assertEquals(CssSpecUtils.stripVendorPrefix("-ms-keyframes"), "keyframes");
+  }
+
+  @Test
+  public void testStripMinMax() {
+    Assert.assertEquals(CssSpecUtils.stripMinMax("min-width"), "width");
+    Assert.assertEquals(CssSpecUtils.stripMinMax("max-width"), "width");
+  }
+
+  @Test
+  public void testAsciiMatch() {
+    final Token token = new Token(22, "@media");
+    Assert.assertTrue(CssSpecUtils.asciiMatch(token, "@media"));
+  }
+
+  @Test
+  public void testValidateKeyframesCss() {
+  }
+
+  @Test
+  public void testValidateAmp4AdsCss() {
+  }
+
+  @Test
+  public void testIsDeclarationValid() {
+    final ValidatorProtos.CssSpec.Builder cssSpecBuilder = ValidatorProtos.CssSpec.newBuilder();
+    cssSpecBuilder.addDeclaration("testName");
+    Assert.assertTrue(CssSpecUtils.isDeclarationValid(cssSpecBuilder.build(), "testName"));
+  }
+
+  @Test
+  public void testAllowedDeclarationsString() {
+    final ValidatorProtos.CssSpec.Builder cssSpecBuilder = ValidatorProtos.CssSpec.newBuilder();
+    cssSpecBuilder.addDeclaration("testName1");
+    cssSpecBuilder.addDeclaration("testName2");
+    Assert.assertEquals(CssSpecUtils.allowedDeclarationsString(cssSpecBuilder.build()),
+      "['testName1', 'testName2']");
+  }
+
+  @Test
+  public void testParseUrlToken() {
+    final List<Token> tokens = new LinkedList<>();
+    tokens.add(new Token(22, "@media"));
+    tokens.add(new Token(100, "https://www.someurl.com/image.jpg"));
+    tokens.add(new Token(0, ""));
+
+    final ParsedCssUrl parsedCssUrl = new ParsedCssUrl();
+
+    try {
+      CssSpecUtils.parseUrlToken(tokens, 1, parsedCssUrl);
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+
+    Assert.assertEquals(parsedCssUrl.getUtf8Url(),
+      "https://www.someurl.com/image.jpg");
+  }
+
+  @Test
+  public void testParseUrlFunction() {
+    final List<Token> tokens = new LinkedList<>();
+    tokens.add(new Token(22, "square"));
+    tokens.add(new Token(1, "\n"));
+    tokens.add(new Token(SACParserCSS3Constants.FUNCTION, "url("));
+    tokens.add(new Token(SACParserCSS3Constants.STRING, "https://www.somesite.com/image.jpg"));
+    tokens.add(new Token(SACParserCSS3Constants.RROUND, ")"));
+    tokens.add(new Token(1, "\n"));
+    tokens.add(new Token(0, ""));
+
+    final ParsedCssUrl parsedCssUrl = new ParsedCssUrl();
+
+    try {
+      Assert.assertEquals(CssSpecUtils.parseUrlFunction(tokens, 2, parsedCssUrl), 5);
+      Assert.assertEquals(parsedCssUrl.getUtf8Url(), "https://www.somesite.com/image.jpg");
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+
+  @Test
+  public void testParseInlineStyle() {
+    final List<Token> tokens = new LinkedList<>();
+    tokens.add(new Token(22, "position"));
+    tokens.add(new Token(61, ":"));
+    tokens.add(new Token(22, "10"));
+    tokens.add(new Token(60, ";"));
+    tokens.add(new Token(22, "color"));
+    tokens.add(new Token(61, ":"));
+    tokens.add(new Token(22, "blue"));
+    tokens.add(new Token(60, ";"));
+    tokens.add(new Token(0, ""));
+
+    final List<ErrorToken> errors = new ArrayList<>();
+
+    try {
+      List<Declaration> declarations = CssSpecUtils.parseInlineStyle(tokens, errors);
+      Assert.assertEquals(declarations.size(), 2);
+      Assert.assertEquals(declarations.get(0).getName(), "position");
+      Assert.assertEquals(declarations.get(0).getValue().get(0).image, "10");
+      Assert.assertEquals(declarations.get(0).getValue().get(1).kind, 0);
+      Assert.assertEquals(declarations.get(1).getName(), "color");
+      Assert.assertEquals(declarations.get(1).getValue().get(0).image, "blue");
+      Assert.assertEquals(declarations.get(1).getValue().get(1).kind, 0);
+    } catch (CssValidationException e) {
+      e.printStackTrace();
+    }
+  }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/utils/DispatchKeyUtilsTest.java b/validator/java/src/test/java/dev/amp/validator/utils/DispatchKeyUtilsTest.java
new file mode 100644
index 0000000000000..b23be54a9bfdb
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/utils/DispatchKeyUtilsTest.java
@@ -0,0 +1,91 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import dev.amp.validator.ValidatorProtos;
+import org.testng.Assert;
+import org.testng.TestException;
+import org.testng.annotations.Test;
+
+import static dev.amp.validator.ValidatorProtos.AttrSpec.DispatchKeyType;
+
+/**
+ * Test for {@link DispatchKeyUtils}
+ *
+ * @author GeorgeLuo
+ */
+
+public class DispatchKeyUtilsTest {
+
+  @Test
+  public void testMakeDispatchKey() {
+    Assert.assertEquals(DispatchKeyUtils.makeDispatchKey(DispatchKeyType.NAME_DISPATCH, "custom-element",
+      "amp-image-lightbox", ""), "custom-element");
+    Assert.assertEquals(DispatchKeyUtils.makeDispatchKey(DispatchKeyType.NAME_VALUE_DISPATCH, "custom-element",
+      "amp-image-lightbox", ""), "custom-element\u0000amp-image-lightbox");
+    Assert.assertEquals(DispatchKeyUtils.makeDispatchKey(DispatchKeyType.NAME_VALUE_PARENT_DISPATCH, "custom-element",
+      "amp-image-lightbox", ""), "custom-element\u0000amp-image-lightbox\u0000true");
+  }
+
+//  TODO: bazel does not like this test
+//  @Test(expectedExceptions = AssertionError.class)
+//  public void testMakeDispatchKeyNoneDispatch() {
+//    DispatchKeyUtils.makeDispatchKey(DispatchKeyType.NONE_DISPATCH, "custom-element",
+//      "amp-image-lightbox", "");
+//  }
+
+  @Test
+  public void testGetDispatchKeyForTagSpecOrNone() {
+    ValidatorProtos.AttrSpec.Builder attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+    attrSpecBuilder.setDispatchKey(DispatchKeyType.NAME_DISPATCH);
+    attrSpecBuilder.setName("someAttr");
+
+    ValidatorProtos.TagSpec.Builder tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+    tagSpecBuilder.addAttrs(attrSpecBuilder.build());
+
+    Assert.assertEquals(DispatchKeyUtils.getDispatchKeyForTagSpecOrNone(tagSpecBuilder.build()), "someAttr");
+
+    attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+    attrSpecBuilder.setDispatchKey(DispatchKeyType.NAME_VALUE_DISPATCH);
+    attrSpecBuilder.setName("someAttr");
+    attrSpecBuilder.addValueCasei("someValue");
+
+    tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+    tagSpecBuilder.addAttrs(attrSpecBuilder.build());
+
+    Assert.assertEquals(DispatchKeyUtils.getDispatchKeyForTagSpecOrNone(tagSpecBuilder.build()),
+      "someAttr\u0000someValue");
+
+    attrSpecBuilder = ValidatorProtos.AttrSpec.newBuilder();
+    attrSpecBuilder.setDispatchKey(DispatchKeyType.NAME_VALUE_PARENT_DISPATCH);
+    attrSpecBuilder.setName("someAttr");
+    attrSpecBuilder.addValueCasei("someValue");
+
+    tagSpecBuilder = ValidatorProtos.TagSpec.newBuilder();
+    tagSpecBuilder.addAttrs(attrSpecBuilder.build());
+    tagSpecBuilder.setMandatoryParent("mandatoryParent");
+
+    Assert.assertEquals(DispatchKeyUtils.getDispatchKeyForTagSpecOrNone(tagSpecBuilder.build()),
+      "someAttr\u0000someValue\u0000true");
+
+  }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/utils/ParseSrcSetUtilsTest.java b/validator/java/src/test/java/dev/amp/validator/utils/ParseSrcSetUtilsTest.java
new file mode 100644
index 0000000000000..58ce892fee015
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/utils/ParseSrcSetUtilsTest.java
@@ -0,0 +1,37 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link ParseSrcSetUtils}
+ *
+ * @author GeorgeLuo
+ */
+
+public class ParseSrcSetUtilsTest {
+
+  @Test
+  public void testParseSrcset() {
+  }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/utils/TagSpecUtilsTest.java b/validator/java/src/test/java/dev/amp/validator/utils/TagSpecUtilsTest.java
new file mode 100644
index 0000000000000..76a71f43fb7c2
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/utils/TagSpecUtilsTest.java
@@ -0,0 +1,415 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Oath Inc..
+ */
+package dev.amp.validator.utils;
+
+
+import dev.amp.validator.ValidatorProtos;
+import com.google.common.collect.ImmutableList;
+import com.google.common.collect.ImmutableMap;
+import dev.amp.validator.Context;
+import dev.amp.validator.ParsedHtmlTag;
+import dev.amp.validator.ParsedTagSpec;
+import dev.amp.validator.ParsedValidatorRules;
+import dev.amp.validator.RecordValidated;
+import dev.amp.validator.TagSpecDispatch;
+import dev.amp.validator.TagStack;
+import dev.amp.validator.ValidateTagResult;
+import dev.amp.validator.css.CssValidationException;
+import dev.amp.validator.exception.TagValidationException;
+import dev.amp.validator.exception.ValidatorException;
+import org.mockito.ArgumentCaptor;
+import org.mockito.Mockito;
+import org.testng.Assert;
+import org.testng.annotations.Test;
+import org.xml.sax.Attributes;
+import org.xml.sax.Locator;
+
+import java.io.IOException;
+import java.util.Collections;
+import java.util.List;
+
+/**
+ * Tests for {@link TagSpecUtils}
+ *
+ * @author sphatak01
+ */
+
+public class TagSpecUtilsTest {
+
+    @Test
+    public void testGetTagSpecUrl() {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder1 = ValidatorProtos.TagSpec.newBuilder().setSpecUrl("url1");
+
+
+        Assert.assertEquals(TagSpecUtils.getTagSpecUrl(tagSpecBuilder1.build()), "url1");
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder2 = ValidatorProtos.TagSpec.newBuilder()
+                .setExtensionSpec(ValidatorProtos.ExtensionSpec.newBuilder()
+                        .setName("extSpec2")
+                        .build());
+
+        Assert.assertEquals(TagSpecUtils.getTagSpecUrl(tagSpecBuilder2.build()), "https://amp.dev/documentation/components/extSpec2");
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder3 = ValidatorProtos.TagSpec.newBuilder().addRequiresExtension("ext3");
+
+        Assert.assertEquals(TagSpecUtils.getTagSpecUrl(tagSpecBuilder3.build()), "https://amp.dev/documentation/components/ext3");
+
+        Assert.assertEquals(TagSpecUtils.getTagSpecUrl(ValidatorProtos.TagSpec.getDefaultInstance()), "");
+    }
+
+    @Test
+    public void testGetTagSpecName() {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder1 = ValidatorProtos.TagSpec.newBuilder().setSpecName("spec1");
+
+        Assert.assertEquals(TagSpecUtils.getTagSpecName(tagSpecBuilder1.build()), "spec1");
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder2 = ValidatorProtos.TagSpec.newBuilder().setTagName("TAG1");
+
+        Assert.assertEquals(TagSpecUtils.getTagSpecName(tagSpecBuilder2.build()), "tag1");
+    }
+
+    @Test
+    public void testShouldRecordTagspecValidated() {
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder1 = ValidatorProtos.TagSpec.newBuilder().setMandatory(true);
+
+        Assert.assertEquals(TagSpecUtils.shouldRecordTagspecValidated(tagSpecBuilder1.build(), 2, ImmutableMap.of(2, true)),
+                RecordValidated.ALWAYS);
+
+        Assert.assertEquals(TagSpecUtils.shouldRecordTagspecValidated(tagSpecBuilder1.build(), 0, ImmutableMap.of(2, true)),
+                RecordValidated.ALWAYS);
+
+
+        Assert.assertEquals(TagSpecUtils.shouldRecordTagspecValidated(ValidatorProtos.TagSpec
+                        .getDefaultInstance(), 2, ImmutableMap.of(2, true)), RecordValidated.ALWAYS);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder2 = ValidatorProtos.TagSpec.newBuilder().setUnique(true);
+
+        Assert.assertEquals(TagSpecUtils.shouldRecordTagspecValidated(tagSpecBuilder2.build(), 3, ImmutableMap.of(2, true)),
+                RecordValidated.IF_PASSING);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder3 = ValidatorProtos.TagSpec.newBuilder().addRequires("req3");
+
+        Assert.assertEquals(TagSpecUtils.shouldRecordTagspecValidated(tagSpecBuilder3.build(), 3, ImmutableMap.of(2, true)),
+                RecordValidated.IF_PASSING);
+
+        final ValidatorProtos.TagSpec.Builder tagSpecBuilder4 = ValidatorProtos.TagSpec.newBuilder().setUniqueWarning(true);
+
+        Assert.assertEquals(TagSpecUtils.shouldRecordTagspecValidated(tagSpecBuilder4.build(), 3, ImmutableMap.of(2, true)),
+                RecordValidated.IF_PASSING);
+
+        Assert.assertEquals(TagSpecUtils.shouldRecordTagspecValidated(ValidatorProtos.TagSpec.getDefaultInstance(),
+                3, ImmutableMap.of(2, true)), RecordValidated.NEVER);
+    }
+
+    @Test
+    public void testValidateTag() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getTypeIdentifiers()).thenReturn(Collections.emptyList());
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("parent");
+
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final TagSpecDispatch mockDispatch = Mockito.mock(TagSpecDispatch.class);
+        Mockito.when(mockDispatch.allTagSpecs()).thenReturn(ImmutableList.of(0, 1, 2));
+        Mockito.when(mockDispatch.hasDispatchKeys()).thenReturn(true);
+
+        final ParsedTagSpec mockParsedTagSpec1 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec1.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockParsedTagSpec1.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(true);
+        Mockito.when(mockRules.getByTagSpecId(0)).thenReturn(mockParsedTagSpec1);
+        Mockito.when(mockRules.getByTagSpecId(2)).thenReturn(mockParsedTagSpec1);
+
+        final ParsedTagSpec mockParsedTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec2.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(false);
+        Mockito.when(mockParsedTagSpec2.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockRules.getByTagSpecId(1)).thenReturn(mockParsedTagSpec2);
+
+        Mockito.when(mockRules.dispatchForTagName(Mockito.anyString())).thenReturn(mockDispatch);
+
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final ParsedHtmlTag encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(encounteredTag.upperName()).thenReturn("HTML");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(2);
+        Mockito.when(mockAttrs.getLocalName(0)).thenReturn("attr0");
+        Mockito.when(mockAttrs.getValue(0)).thenReturn("val0");
+        Mockito.when(mockAttrs.getLocalName(1)).thenReturn("attr1");
+        Mockito.when(mockAttrs.getValue(1)).thenReturn("val0");
+
+        Mockito.when(encounteredTag.attrs()).thenReturn(mockAttrs);
+
+        Mockito.when(mockDispatch.matchingDispatchKey("attr1", "val0", "parent"))
+            .thenReturn(ImmutableList.of(0, 1));
+
+
+        final ParsedTagSpec bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+        final ValidateTagResult res = TagSpecUtils.validateTag(mockContext, encounteredTag, bestMatchReferencePoint);
+        Assert.assertEquals(res.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.PASS);
+        Assert.assertEquals(res.getValidationResult().getErrorsCount(), 0);
+    }
+
+    @Test
+    public void testValidateTagDisallowedTag() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getTypeIdentifiers()).thenReturn(Collections.emptyList());
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("parent");
+
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedHtmlTag encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(encounteredTag.upperName()).thenReturn("FONT");
+        Mockito.when(encounteredTag.lowerName()).thenReturn("font");
+
+        final ParsedTagSpec bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidateTagResult res = TagSpecUtils.validateTag(mockContext, encounteredTag, bestMatchReferencePoint);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(errorCodeCapture.capture(),
+                Mockito.any(Locator.class),
+                listCaptor.capture(),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DISALLOWED_TAG);
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "font");
+
+        Assert.assertEquals(res.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.UNKNOWN);
+    }
+
+    @Test
+    public void testValidateTagDisallowedScriptTag() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getTypeIdentifiers()).thenReturn(Collections.emptyList());
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("parent");
+
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final TagSpecDispatch mockDispatch = Mockito.mock(TagSpecDispatch.class);
+        Mockito.when(mockDispatch.allTagSpecs()).thenReturn(Collections.emptyList());
+        Mockito.when(mockDispatch.hasDispatchKeys()).thenReturn(true);
+
+        final ParsedTagSpec mockParsedTagSpec1 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec1.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockParsedTagSpec1.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(false);
+        Mockito.when(mockRules.getByTagSpecId(0)).thenReturn(mockParsedTagSpec1);
+        Mockito.when(mockRules.getByTagSpecId(2)).thenReturn(mockParsedTagSpec1);
+
+        final ParsedTagSpec mockParsedTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec2.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(false);
+        Mockito.when(mockParsedTagSpec2.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockRules.getByTagSpecId(1)).thenReturn(mockParsedTagSpec2);
+
+        Mockito.when(mockRules.dispatchForTagName(Mockito.anyString())).thenReturn(mockDispatch);
+
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final ParsedHtmlTag encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(encounteredTag.upperName()).thenReturn("SCRIPT");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(2);
+        Mockito.when(mockAttrs.getLocalName(0)).thenReturn("attr0");
+        Mockito.when(mockAttrs.getValue(0)).thenReturn("val0");
+        Mockito.when(mockAttrs.getLocalName(1)).thenReturn("attr1");
+        Mockito.when(mockAttrs.getValue(1)).thenReturn("val0");
+
+        Mockito.when(encounteredTag.attrs()).thenReturn(mockAttrs);
+
+        Mockito.when(mockDispatch.matchingDispatchKey("attr1", "val0", "parent"))
+                .thenReturn(ImmutableList.of(0, 1));
+
+
+        final ParsedTagSpec bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidateTagResult res = TagSpecUtils.validateTag(mockContext, encounteredTag, bestMatchReferencePoint);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(errorCodeCapture.capture(),
+                Mockito.any(Locator.class),
+                listCaptor.capture(),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.DISALLOWED_SCRIPT_TAG);
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 0);
+
+        Assert.assertEquals(res.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.UNKNOWN);
+        Assert.assertEquals(res.getValidationResult().getErrorsCount(), 0);
+    }
+
+    @Test
+    public void testValidateTagGeneralDisallowedTag() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getTypeIdentifiers()).thenReturn(Collections.emptyList());
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("parent");
+
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final TagSpecDispatch mockDispatch = Mockito.mock(TagSpecDispatch.class);
+        Mockito.when(mockDispatch.allTagSpecs()).thenReturn(Collections.emptyList());
+        Mockito.when(mockDispatch.hasDispatchKeys()).thenReturn(true);
+
+        final ParsedTagSpec mockParsedTagSpec1 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec1.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockParsedTagSpec1.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(false);
+        Mockito.when(mockRules.getByTagSpecId(0)).thenReturn(mockParsedTagSpec1);
+        Mockito.when(mockRules.getByTagSpecId(2)).thenReturn(mockParsedTagSpec1);
+
+        final ParsedTagSpec mockParsedTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec2.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(false);
+        Mockito.when(mockParsedTagSpec2.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockRules.getByTagSpecId(1)).thenReturn(mockParsedTagSpec2);
+
+        Mockito.when(mockRules.dispatchForTagName(Mockito.anyString())).thenReturn(mockDispatch);
+
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final ParsedHtmlTag encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(encounteredTag.upperName()).thenReturn("HTML");
+        Mockito.when(encounteredTag.lowerName()).thenReturn("html");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(2);
+        Mockito.when(mockAttrs.getLocalName(0)).thenReturn("attr0");
+        Mockito.when(mockAttrs.getValue(0)).thenReturn("val0");
+        Mockito.when(mockAttrs.getLocalName(1)).thenReturn("attr1");
+        Mockito.when(mockAttrs.getValue(1)).thenReturn("val0");
+
+        Mockito.when(encounteredTag.attrs()).thenReturn(mockAttrs);
+
+        Mockito.when(mockDispatch.matchingDispatchKey("attr1", "val0", "parent"))
+                .thenReturn(ImmutableList.of(0, 1));
+
+
+        final ParsedTagSpec bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+        ArgumentCaptor<List> listCaptor = ArgumentCaptor.forClass(List.class);
+        ArgumentCaptor<ValidatorProtos.ValidationError.Code> errorCodeCapture = ArgumentCaptor.forClass(ValidatorProtos.ValidationError.Code.class);
+
+        final ValidateTagResult res = TagSpecUtils.validateTag(mockContext, encounteredTag, bestMatchReferencePoint);
+
+        Mockito.verify(mockContext, Mockito.times(1)).addError(errorCodeCapture.capture(),
+                Mockito.any(Locator.class),
+                listCaptor.capture(),
+                Mockito.anyString(),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class));
+
+        Assert.assertEquals(errorCodeCapture.getValue(), ValidatorProtos.ValidationError.Code.GENERAL_DISALLOWED_TAG);
+        final List<String> params = listCaptor.getValue();
+        Assert.assertEquals(params.size(), 1);
+        Assert.assertEquals(params.get(0), "html");
+
+        Assert.assertEquals(res.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.UNKNOWN);
+        Assert.assertEquals(res.getValidationResult().getErrorsCount(), 0);
+    }
+
+    @Test
+    public void testValidateTagBestAttempt() throws TagValidationException, ValidatorException, IOException, CssValidationException {
+        final Context mockContext = Mockito.mock(Context.class);
+
+        Mockito.when(mockContext.getTypeIdentifiers()).thenReturn(Collections.emptyList());
+
+        final TagStack mockTagStack = Mockito.mock(TagStack.class);
+        Mockito.when(mockTagStack.parentTagName()).thenReturn("parent");
+
+        Mockito.when(mockContext.getTagStack()).thenReturn(mockTagStack);
+
+        final ParsedValidatorRules mockRules = Mockito.mock(ParsedValidatorRules.class);
+        final TagSpecDispatch mockDispatch = Mockito.mock(TagSpecDispatch.class);
+        Mockito.when(mockDispatch.allTagSpecs()).thenReturn(ImmutableList.of(0, 1, 2));
+        Mockito.when(mockDispatch.hasDispatchKeys()).thenReturn(false);
+
+        final ParsedTagSpec mockParsedTagSpec1 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec1.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockParsedTagSpec1.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(true);
+        Mockito.when(mockRules.getByTagSpecId(0)).thenReturn(mockParsedTagSpec1);
+        Mockito.when(mockRules.getByTagSpecId(2)).thenReturn(mockParsedTagSpec1);
+
+        final ParsedTagSpec mockParsedTagSpec2 = Mockito.mock(ParsedTagSpec.class);
+        Mockito.when(mockParsedTagSpec2.isUsedForTypeIdentifiers(Mockito.anyListOf(String.class))).thenReturn(true);
+        Mockito.when(mockParsedTagSpec2.getSpec()).thenReturn(ValidatorProtos.TagSpec.getDefaultInstance());
+        Mockito.when(mockRules.getByTagSpecId(1)).thenReturn(mockParsedTagSpec2);
+
+        Mockito.when(mockRules.dispatchForTagName(Mockito.anyString())).thenReturn(mockDispatch);
+
+        Mockito.when(mockRules.betterValidationResultThan(Mockito.any(ValidatorProtos.ValidationResult.Builder.class),
+                Mockito.any(ValidatorProtos.ValidationResult.Builder.class))).thenReturn(true);
+        Mockito.when(mockContext.getRules()).thenReturn(mockRules);
+
+        final ParsedHtmlTag encounteredTag = Mockito.mock(ParsedHtmlTag.class);
+        Mockito.when(encounteredTag.upperName()).thenReturn("HTML");
+        Mockito.when(encounteredTag.lowerName()).thenReturn("html");
+
+        final Attributes mockAttrs = Mockito.mock(Attributes.class);
+        Mockito.when(mockAttrs.getLength()).thenReturn(2);
+        Mockito.when(mockAttrs.getLocalName(0)).thenReturn("attr0");
+        Mockito.when(mockAttrs.getValue(0)).thenReturn("val0");
+        Mockito.when(mockAttrs.getLocalName(1)).thenReturn("attr1");
+        Mockito.when(mockAttrs.getValue(1)).thenReturn("val0");
+
+        Mockito.when(encounteredTag.attrs()).thenReturn(mockAttrs);
+
+        Mockito.when(mockDispatch.matchingDispatchKey("attr1", "val0", "parent"))
+                .thenReturn(ImmutableList.of(0, 1));
+
+        final ParsedTagSpec bestMatchReferencePoint = Mockito.mock(ParsedTagSpec.class);
+
+        final ValidateTagResult res = TagSpecUtils.validateTag(mockContext, encounteredTag, bestMatchReferencePoint);
+
+        Assert.assertEquals(res.getValidationResult().getStatus(), ValidatorProtos.ValidationResult.Status.PASS);
+        Assert.assertEquals(res.getValidationResult().getErrorsCount(), 0);
+    }
+}
diff --git a/validator/java/src/test/java/dev/amp/validator/utils/UrlUtilsTest.java b/validator/java/src/test/java/dev/amp/validator/utils/UrlUtilsTest.java
new file mode 100644
index 0000000000000..b21b0f6a329e7
--- /dev/null
+++ b/validator/java/src/test/java/dev/amp/validator/utils/UrlUtilsTest.java
@@ -0,0 +1,41 @@
+/*
+ *
+ * ====================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *  ====================================================================
+ */
+
+/*
+ * Changes to the original project are Copyright 2019, Verizon Media Inc..
+ */
+
+package dev.amp.validator.utils;
+
+import org.testng.Assert;
+import org.testng.annotations.Test;
+
+/**
+ * Test for {@link UrlUtils}
+ *
+ * @author GeorgeLuo
+ */
+
+public class UrlUtilsTest {
+
+  @Test
+  public void testIsDataUrl() {
+    Assert.assertTrue(UrlUtils.isDataUrl("data://somedata.com"));
+    Assert.assertFalse(UrlUtils.isDataUrl("https://somenotdata.com"));
+    Assert.assertFalse(UrlUtils.isDataUrl("www.somenotdata.com"));
+  }
+}
diff --git a/validator/java/src/test/resources/test-cases/attributes/testAttrDisallowedByImpliedLayout.html b/validator/java/src/test/resources/test-cases/attributes/testAttrDisallowedByImpliedLayout.html
new file mode 100644
index 0000000000000..64b55e82b9aea
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testAttrDisallowedByImpliedLayout.html
@@ -0,0 +1,20 @@
+<!--
+     ATTR_DISALLOWED_BY_IMPLIED_LAYOUT
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-img
+        src="https://ampimgs.com/img/amp.jpg"
+        width="auto"
+        height="610"
+        heights="610"
+        alt="an image"
+></amp-img>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testAttrDisallowedBySpecifiedLayout.html b/validator/java/src/test/resources/test-cases/attributes/testAttrDisallowedBySpecifiedLayout.html
new file mode 100644
index 0000000000000..385c8063cd4f3
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testAttrDisallowedBySpecifiedLayout.html
@@ -0,0 +1,21 @@
+<!--
+     ATTR_DISALLOWED_BY_SPECIFIED_LAYOUT
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-img
+        src="https://ampimgs.com/img/amp.jpg"
+        width="200"
+        height="610"
+        heights="610"
+        layout="FIXED"
+        alt="an image"
+></amp-img>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testAttrMissingRequiredExtension.html b/validator/java/src/test/resources/test-cases/attributes/testAttrMissingRequiredExtension.html
new file mode 100644
index 0000000000000..f6f181f172709
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testAttrMissingRequiredExtension.html
@@ -0,0 +1,18 @@
+<!--
+     ATTR_MISSING_REQUIRED_EXTENSION
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <style amp-custom>
+        amp-ig {
+        }
+    </style>
+</head>
+<body>
+<textarea rows="4" cols="50" autoexpand>
+</textarea>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testAttrRequiredButMissing.html b/validator/java/src/test/resources/test-cases/attributes/testAttrRequiredButMissing.html
new file mode 100644
index 0000000000000..a70c2b1aef163
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testAttrRequiredButMissing.html
@@ -0,0 +1,18 @@
+<!--
+     ATTR_REQUIRED_BUT_MISSING
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<h1>Welcome to the mobile web</h1>
+<ul>
+    <li> Nav item 1</li>
+    <li on="tap:sidebar1.close" role=button> Close</li>
+</ul>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testAttrValueRequiredByLayout.html b/validator/java/src/test/resources/test-cases/attributes/testAttrValueRequiredByLayout.html
new file mode 100644
index 0000000000000..476cbc03cda98
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testAttrValueRequiredByLayout.html
@@ -0,0 +1,20 @@
+<!--
+     ATTR_VALUE_REQUIRED_BY_LAYOUT
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-img
+        src="https://ampimgs.com/img/amp.jpg"
+        width="1080"
+        height="610"
+        layout="fixed-height"
+        alt="an image"
+></amp-img>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testDisallowedAttr.html b/validator/java/src/test/resources/test-cases/attributes/testDisallowedAttr.html
new file mode 100644
index 0000000000000..50a073fc551b0
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testDisallowedAttr.html
@@ -0,0 +1,15 @@
+<!--
+     DISALLOWED_ATTR
+     INVALID_ATTR_VALUE
+-->
+<!doctype html>
+<html amp4ads>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/attributes/testDisallowedPropertyInAttrValue.html b/validator/java/src/test/resources/test-cases/attributes/testDisallowedPropertyInAttrValue.html
new file mode 100644
index 0000000000000..535ce28ff7b10
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testDisallowedPropertyInAttrValue.html
@@ -0,0 +1,17 @@
+<!--
+  DISALLOWED_PROPERTY_IN_ATTR_VALUE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<h1 style="notvalid:blue;text-align:center;">This is a heading</h1>
+<p style="color:red;">This is a paragraph.</p>
+
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testDisallowedRelativeUrl.html b/validator/java/src/test/resources/test-cases/attributes/testDisallowedRelativeUrl.html
new file mode 100644
index 0000000000000..0e8e6100e2479
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testDisallowedRelativeUrl.html
@@ -0,0 +1,16 @@
+<!--
+     DISALLOWED_RELATIVE_URL
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+
+</head>
+<body>
+<a href="rel/ative/url">Visit our HTML tutorial</a>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/attributes/testDuplicateAttribute.html b/validator/java/src/test/resources/test-cases/attributes/testDuplicateAttribute.html
new file mode 100644
index 0000000000000..bbcea5c74b3fb
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testDuplicateAttribute.html
@@ -0,0 +1,17 @@
+<!--
+     DUPLICATE_ATTRIBUTE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8" charset="utf-7">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <style amp-custom>
+        amp-ig {
+        }
+    </style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testDuplicateDimension.html b/validator/java/src/test/resources/test-cases/attributes/testDuplicateDimension.html
new file mode 100644
index 0000000000000..3b2946e93e0ab
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testDuplicateDimension.html
@@ -0,0 +1,20 @@
+<!--
+     DUPLICATE_DIMENSION
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-img src="https://images.com/img/amp.jpg"
+         width="1080"
+         height="610"
+         height="500"
+         layout="responsive"
+         alt="an image"></amp-img>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/attributes/testImpliedLayoutInvalid.html b/validator/java/src/test/resources/test-cases/attributes/testImpliedLayoutInvalid.html
new file mode 100644
index 0000000000000..f07a4f21f040d
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testImpliedLayoutInvalid.html
@@ -0,0 +1,24 @@
+<!--
+     IMPLIED_LAYOUT_INVALID
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+<!--    <script async custom-element="amp-anim" src="https://cdn.ampproject.org/v0/amp-anim-0.1.js"></script>-->
+    <script async custom-element="amp-timeago" src="https://cdn.ampproject.org/v0/amp-timeago-0.1.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<!--<AMP-ANIM-->
+<!--        src="https://ampimgs.com/img/amp.jpg"-->
+<!--        width="1080"-->
+<!--        height="610"-->
+<!--        alt="an image"-->
+<!--&gt;</AMP-ANIM>-->
+<amp-timeago
+        width: 80%;
+        height: 80%;></amp-timeago>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testInconsistentUnitsForWidthAndHeight.html b/validator/java/src/test/resources/test-cases/attributes/testInconsistentUnitsForWidthAndHeight.html
new file mode 100644
index 0000000000000..8089e42b70097
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testInconsistentUnitsForWidthAndHeight.html
@@ -0,0 +1,20 @@
+<!--
+     INCONSISTENT_UNITS_FOR_WIDTH_AND_HEIGHT
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-img
+        src="https://ampimgs.com/img/amp.jpg"
+        width="200px"
+        height="610vw"
+        layout="responsive"
+        alt="an image"
+></amp-img>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testInvalidAttrValue.html b/validator/java/src/test/resources/test-cases/attributes/testInvalidAttrValue.html
new file mode 100644
index 0000000000000..818cacc4ce8a8
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testInvalidAttrValue.html
@@ -0,0 +1,18 @@
+<!--
+     INVALID_ATTR_VALUE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <style amp-custom>
+        amp-ig {
+        }
+    </style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testInvalidUrlProtocol.html b/validator/java/src/test/resources/test-cases/attributes/testInvalidUrlProtocol.html
new file mode 100644
index 0000000000000..d96c3e9586403
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testInvalidUrlProtocol.html
@@ -0,0 +1,17 @@
+<!--
+     INVALID_URL_PROTOCOL
+-->
+<!doctype html>
+<html amp4email>
+
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+
+</head>
+<body>
+<a href="ftp://telat.com">Visit our HTML tutorial</a>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/attributes/testMandatoryAttrMissing.html b/validator/java/src/test/resources/test-cases/attributes/testMandatoryAttrMissing.html
new file mode 100644
index 0000000000000..7a62163b8047f
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testMandatoryAttrMissing.html
@@ -0,0 +1,15 @@
+<!--
+     MANDATORY_ATTR_MISSING
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <style>
+    </style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/attributes/testMissingLayoutAttributes.html b/validator/java/src/test/resources/test-cases/attributes/testMissingLayoutAttributes.html
new file mode 100644
index 0000000000000..7c54c8613134f
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testMissingLayoutAttributes.html
@@ -0,0 +1,15 @@
+<!--
+     MISSING_LAYOUT_ATTRIBUTES
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-img src="https://images.com/img/amp.jpg"></amp-img>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/attributes/testMissingUrl.html b/validator/java/src/test/resources/test-cases/attributes/testMissingUrl.html
new file mode 100644
index 0000000000000..c2a5eb3f8916d
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/attributes/testMissingUrl.html
@@ -0,0 +1,16 @@
+<!--
+     MISSING_URL
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+
+</head>
+<body>
+<a href="">Visit our HTML tutorial</a>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSDisallowedRelativeURL.html b/validator/java/src/test/resources/test-cases/css/testCSSDisallowedRelativeURL.html
new file mode 100644
index 0000000000000..57193d87cc17d
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSDisallowedRelativeURL.html
@@ -0,0 +1,19 @@
+<!--
+     CSS_SYNTAX_DISALLOWED_RELATIVE_URL
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {
+            background-image: url('images/header-background.jpg');
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSExcessivelyNested.html b/validator/java/src/test/resources/test-cases/css/testCSSExcessivelyNested.html
new file mode 100644
index 0000000000000..f6890f1de0da0
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSExcessivelyNested.html
@@ -0,0 +1,66 @@
+<!--
+     CSS_EXCESSIVELY_NESTED
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        i{width:
+          {width:
+           {width:
+            {width:
+             {width:
+              {width:
+               {width:
+                {width:
+                 {width:
+                  {width:
+                   {width:
+                    {width:
+                     {width:
+                      {width:
+                       {width:
+                        {width:
+                         {width:
+                          {width:
+                           {width:
+                            {width:
+                             {width:
+                              {width:
+                               {width:
+                                {width:
+                                 {width:
+                                  {width:
+                                   {width:
+                                    {width:
+                                     {width:
+                                      {width:
+                                       {width:
+                                        {width:
+                                         {width:
+                                          {width:
+                                           {width:
+                                            {width:
+                                             {width:
+                                              {width:
+                                               {width:
+                                                {width:
+                                                 {width:
+                                                  {width:
+                                                   {width:
+                                                    {width:
+                                                     {width:
+                                                      {width:
+                                                       {width:
+                                                        {width:
+                                                         {width:
+                                                          {width:
+                                                           {width: {}</style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxBadUrl.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxBadUrl.html
new file mode 100644
index 0000000000000..77eabf0deb5a0
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxBadUrl.html
@@ -0,0 +1,19 @@
+<!--
+     CSS_SYNTAX_BAD_URL
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {
+            list-style: square url(());
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedMediaFeature.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedMediaFeature.html
new file mode 100644
index 0000000000000..9de25582df717
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedMediaFeature.html
@@ -0,0 +1,20 @@
+<!--
+  CSS_SYNTAX_DISALLOWED_MEDIA_FEATURE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp-custom>
+        /* media queries are allowed */
+        @media only screen
+        and (min: 320px) {
+            body { font-size: 13px; }
+        }  </style>
+</head>
+<body>
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedMediaType.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedMediaType.html
new file mode 100644
index 0000000000000..4c700285abfe6
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedMediaType.html
@@ -0,0 +1,18 @@
+<!--
+  CSS_SYNTAX_DISALLOWED_MEDIA_TYPE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp-custom>
+        /* media queries are allowed */
+        @media ad {}
+    </style>
+</head>
+<body>
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedPropertyValue.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedPropertyValue.html
new file mode 100644
index 0000000000000..fc893b856979c
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxDisallowedPropertyValue.html
@@ -0,0 +1,17 @@
+<!--
+  CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<h1 style="position:blue;text-align:center;">This is a heading</h1>
+<p style="color:red;">This is a paragraph.</p>
+
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxIncompleteDeclaration.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxIncompleteDeclaration.html
new file mode 100644
index 0000000000000..627d51cce7c23
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxIncompleteDeclaration.html
@@ -0,0 +1,20 @@
+<!--
+     CSS_SYNTAX_INVALID_DECLARATION
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {
+        }
+        ul {d
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidAtRule.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidAtRule.html
new file mode 100644
index 0000000000000..3cc8d418a4cd9
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidAtRule.html
@@ -0,0 +1,24 @@
+<!--
+  CSS_SYNTAX_INVALID_AT_RULE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp-custom>
+        /* media queries are allowed */
+        @media screen {}
+
+        /* all other @ rules are banned */
+        @supports (display: flex) {}
+        @font-face {}
+        @keyframes slidein {}
+        @invalid {}
+    </style>
+</head>
+<body>
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidDeclaration.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidDeclaration.html
new file mode 100644
index 0000000000000..ca9ca2266440b
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidDeclaration.html
@@ -0,0 +1,20 @@
+<!--
+     CSS_SYNTAX_INVALID_DECLARATION
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {
+        }
+        ul {%
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidURL.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidURL.html
new file mode 100644
index 0000000000000..90ed03d811379
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidURL.html
@@ -0,0 +1,19 @@
+<!--
+     CSS_SYNTAX_INVALID_URL
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {
+            list-style: square url(https://www.e$edball.png);
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidUrlProtocol.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidUrlProtocol.html
new file mode 100644
index 0000000000000..3598235ea0b89
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxInvalidUrlProtocol.html
@@ -0,0 +1,19 @@
+<!--
+     CSS_SYNTAX_INVALID_URL_PROTOCOL
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {
+            background-image: url('http://İnançEsasları.com/header-background.jpg');
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxMalformedMediaQuery.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxMalformedMediaQuery.html
new file mode 100644
index 0000000000000..5d9432e9a43bb
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxMalformedMediaQuery.html
@@ -0,0 +1,18 @@
+<!--
+  CSS_SYNTAX_MALFORMED_MEDIA_QUERY
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp-custom>
+        /* media queries are allowed */
+        @media screen ((min-width:500px))
+    </style>
+</head>
+<body>
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxMissingURL.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxMissingURL.html
new file mode 100644
index 0000000000000..c5ca179e4627d
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxMissingURL.html
@@ -0,0 +1,19 @@
+<!--
+     CSS_SYNTAX_MISSING_URL
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {
+            list-style: square url();
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxStrayTrailingBackslash.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxStrayTrailingBackslash.html
new file mode 100644
index 0000000000000..4cf562fe9cc1e
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxStrayTrailingBackslash.html
@@ -0,0 +1,20 @@
+<!--
+     CSS_SYNTAX_STRAY_TRAILING_BACKSLASH
+     "CSS syntax error in tag '...' - stray trailing backslash."
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        /* any custom styles go here. */
+        body {
+            background-color: white;
+            color: beige;\
+        }
+    </style>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxUnterminatedComment.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxUnterminatedComment.html
new file mode 100644
index 0000000000000..043e06c7dab15
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxUnterminatedComment.html
@@ -0,0 +1,19 @@
+<!--
+     CSS_SYNTAX_UNTERMINATED_COMMENT
+     "CSS syntax error in tag '...' - unterminated comment."
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        h1 { color: red; }
+        @page :first {
+            margin: 1in;
+        }/*uhbuhbuyb
+    </style>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCSSSyntaxUnterminatedString.html b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxUnterminatedString.html
new file mode 100644
index 0000000000000..cefacfa9c8092
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCSSSyntaxUnterminatedString.html
@@ -0,0 +1,20 @@
+<!--
+     CSS_SYNTAX_UNTERMINATED_STRING
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        ul {"
+        }
+        ul {'
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testCdataViolatesBlacklist.html b/validator/java/src/test/resources/test-cases/css/testCdataViolatesBlacklist.html
new file mode 100644
index 0000000000000..30e9538e97b44
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testCdataViolatesBlacklist.html
@@ -0,0 +1,30 @@
+<!--
+     CDATA_VIOLATES_BLACKLIST
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        /* any custom styles go here. */
+        body {
+            background-color: white;
+            color: beige !important;
+        }
+        amp-img {
+            border: 5px solid black;
+        }
+        amp-img.grey-placeholder {
+            background-color: grey;
+        }
+        @page :first {
+            margin: 1in;
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testInlineStyleTooLong.html b/validator/java/src/test/resources/test-cases/css/testInlineStyleTooLong.html
new file mode 100644
index 0000000000000..551c1ab7e4711
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testInlineStyleTooLong.html
@@ -0,0 +1,17 @@
+<!--
+  INLINE_STYLE_TOO_LONG
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<h1 style="color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;color:blue;text-align:center;">This is a heading</h1>
+<p style="color:red;">This is a paragraph.</p>
+
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/css/testStylesheetTooLong.html b/validator/java/src/test/resources/test-cases/css/testStylesheetTooLong.html
new file mode 100644
index 0000000000000..283ba806e69df
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/css/testStylesheetTooLong.html
@@ -0,0 +1,8667 @@
+<!--
+  Copyright 2015 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+  Tests the CSS restrictions that exist for AMP4Email.
+  CSS_SYNTAX_INVALID_AT_RULE should be returned
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp-custom>
+        /* media queries are allowed */
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+        @media screen {}
+    </style>
+</head>
+<body>
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/misc/testCSSFail.html b/validator/java/src/test/resources/test-cases/misc/testCSSFail.html
new file mode 100644
index 0000000000000..f6a34c926e597
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/misc/testCSSFail.html
@@ -0,0 +1,30 @@
+<!--
+     testing blacklisted regex
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        /* any custom styles go here. */
+        body {
+            background-color: white;
+            color: beige;\
+        }
+        amp-img {
+            border: 5px solid black;
+        }
+        amp-img.grey-placeholder {
+            background-color: grey;
+        }
+        @page :first {
+            margin: 1in;zz
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/misc/testCSSFail2.html b/validator/java/src/test/resources/test-cases/misc/testCSSFail2.html
new file mode 100644
index 0000000000000..3cc8d418a4cd9
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/misc/testCSSFail2.html
@@ -0,0 +1,24 @@
+<!--
+  CSS_SYNTAX_INVALID_AT_RULE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp-custom>
+        /* media queries are allowed */
+        @media screen {}
+
+        /* all other @ rules are banned */
+        @supports (display: flex) {}
+        @font-face {}
+        @keyframes slidein {}
+        @invalid {}
+    </style>
+</head>
+<body>
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/misc/testCSSInlineFail.html b/validator/java/src/test/resources/test-cases/misc/testCSSInlineFail.html
new file mode 100644
index 0000000000000..a4b484d6abd5c
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/misc/testCSSInlineFail.html
@@ -0,0 +1,32 @@
+<!--
+  Copyright 2015 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+  Tests the CSS restrictions that exist for AMP4Email.
+   should be returned
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<p style=not_valid>This is a paragraph.</p>
+
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/misc/testCSSInlinePass.html b/validator/java/src/test/resources/test-cases/misc/testCSSInlinePass.html
new file mode 100644
index 0000000000000..56cc57345cd6e
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/misc/testCSSInlinePass.html
@@ -0,0 +1,34 @@
+<!--
+  Copyright 2015 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+  Tests the CSS restrictions that exist for AMP4Email.
+  CSS_SYNTAX_INVALID_AT_RULE should be returned
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+<h1 style="color:blue;text-align:center;">This is a heading</h1>
+<p style="color:red;">This is a paragraph.</p>
+
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/misc/testCSSPass.html b/validator/java/src/test/resources/test-cases/misc/testCSSPass.html
new file mode 100644
index 0000000000000..23481a6bba304
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/misc/testCSSPass.html
@@ -0,0 +1,30 @@
+<!--
+     testing blacklisted regex
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <style amp-custom>
+        /* any custom styles go here. */
+        body {
+            background-color: white;
+            color: beige;
+        }
+        amp-img {
+            border: 5px solid black;
+        }
+        amp-img.grey-placeholder {
+            background-color: grey;
+        }
+        @page :first {
+            margin: 1in;
+        }
+    </style>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/misc/testWarningExtensionDeprecatedVersion.html b/validator/java/src/test/resources/test-cases/misc/testWarningExtensionDeprecatedVersion.html
new file mode 100644
index 0000000000000..b727d6ef3b02e
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/misc/testWarningExtensionDeprecatedVersion.html
@@ -0,0 +1,19 @@
+<!--
+     WARNING_EXTENSION_DEPRECATED_VERSION
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.1.js"></script>
+    <style amp-custom>
+        amp-ig {
+        }
+    </style>
+</head>
+<body>
+<template type="amp-mustache">
+</template>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testDeprecatedTag.html b/validator/java/src/test/resources/test-cases/tags/testDeprecatedTag.html
new file mode 100644
index 0000000000000..c359bac0a36b4
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testDeprecatedTag.html
@@ -0,0 +1,16 @@
+<!--
+     DEPRECATED_TAG
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <title>Hello, AMPs</title>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/tags/testDisallowedChildTagName.html b/validator/java/src/test/resources/test-cases/tags/testDisallowedChildTagName.html
new file mode 100644
index 0000000000000..4a8f765cfcd28
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testDisallowedChildTagName.html
@@ -0,0 +1,21 @@
+<!--
+     DISALLOWED_CHILD_TAG_NAME
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-sidebar" src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-sidebar id="sidebar1" layout="nodisplay" side="left">
+    <nav id="document-navigation"
+         toolbar="(max-width: 641px)"
+         toolbar-target="nav-target">
+        <li>
+        </li>
+    </nav>
+</amp-sidebar></body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testDisallowedFirstChildTagName.html b/validator/java/src/test/resources/test-cases/tags/testDisallowedFirstChildTagName.html
new file mode 100644
index 0000000000000..99d6e269da5f4
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testDisallowedFirstChildTagName.html
@@ -0,0 +1,28 @@
+<!--
+     DISALLOWED_FIRST_CHILD_TAG_NAME
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script custom-element="amp-accordion" src="https://cdn.ampproject.org/v0/amp-accordion-0.1.js" async></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-accordion>
+    <section>
+        <h2>Section 1</h2>
+        <p>Content in section 1.</p>
+    </section>
+    <section>
+        <h2>Section 2</h2>
+        <div>Content in section 2.</div>
+    </section>
+    <section expanded>
+        <div>Section 1</div>
+        <h1>Section 2</h1>
+    </section>
+</amp-accordion>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testDisallowedScriptTag.html b/validator/java/src/test/resources/test-cases/tags/testDisallowedScriptTag.html
new file mode 100644
index 0000000000000..bea424f5ac6e9
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testDisallowedScriptTag.html
@@ -0,0 +1,15 @@
+<!--
+     DISALLOWED_SCRIPT_TAG
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport1">
+    <script async src="https://my.js.com/script.js"></script>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testDisallowedTag.html b/validator/java/src/test/resources/test-cases/tags/testDisallowedTag.html
new file mode 100644
index 0000000000000..d8e495b065098
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testDisallowedTag.html
@@ -0,0 +1,15 @@
+<!--
+     DISALLOWED_TAG
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+<not_a_tag></not_a_tag>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testDisallowedTagAncestor.html b/validator/java/src/test/resources/test-cases/tags/testDisallowedTagAncestor.html
new file mode 100644
index 0000000000000..bbf63a01ba50f
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testDisallowedTagAncestor.html
@@ -0,0 +1,18 @@
+<!--
+     DISALLOWED_TAG_ANCESTOR
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<template type="amp-mustache">
+    <template type="amp-mustache">
+    </template>
+</template>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testDuplicateUniqueTag.html b/validator/java/src/test/resources/test-cases/tags/testDuplicateUniqueTag.html
new file mode 100644
index 0000000000000..c5c4622efee75
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testDuplicateUniqueTag.html
@@ -0,0 +1,15 @@
+<!--
+     DUPLICATE_UNIQUE_TAG
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testExtensionUnused.html b/validator/java/src/test/resources/test-cases/tags/testExtensionUnused.html
new file mode 100644
index 0000000000000..fdf532a4444a8
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testExtensionUnused.html
@@ -0,0 +1,15 @@
+<!--
+     EXTENSION_UNUSED
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js" async></script>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/tags/testIncorrectNumChildTags.html b/validator/java/src/test/resources/test-cases/tags/testIncorrectNumChildTags.html
new file mode 100644
index 0000000000000..8c6f2cbd14718
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testIncorrectNumChildTags.html
@@ -0,0 +1,27 @@
+<!--
+     INCORRECT_NUM_CHILD_TAGS
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script custom-element="amp-accordion" src="https://cdn.ampproject.org/v0/amp-accordion-0.1.js" async></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-accordion>
+    <section>
+        <h2>Section 1</h2>
+        <p>Content in section 1.</p>
+    </section>
+    <section>
+        <h2>Section 2</h2>
+        <div>Content in section 2.</div>
+    </section>
+    <section expanded>
+        <h2>Section 3</h2>
+    </section>
+</amp-accordion>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testInvalidJsonCdata.html b/validator/java/src/test/resources/test-cases/tags/testInvalidJsonCdata.html
new file mode 100644
index 0000000000000..5c05a4afca6e5
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testInvalidJsonCdata.html
@@ -0,0 +1,19 @@
+<!--
+     INVALID_JSON_CDATA
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
+</head>
+<body>
+
+<amp-state id="123">
+    <script type="application/json">{sometext}</script>
+</amp-state>
+</body>
+</html>
+
diff --git a/validator/java/src/test/resources/test-cases/tags/testMandatoryCdataMissingOrIncorrect.html b/validator/java/src/test/resources/test-cases/tags/testMandatoryCdataMissingOrIncorrect.html
new file mode 100644
index 0000000000000..9eaa57c0dd23c
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testMandatoryCdataMissingOrIncorrect.html
@@ -0,0 +1,14 @@
+<!--
+  MANDATORY_CDATA_MISSING_OR_INCORRECT
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <style amp4email-boilerplate></style>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+</head>
+<body>
+Test body.
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testMandatoryTagAncestor.html b/validator/java/src/test/resources/test-cases/tags/testMandatoryTagAncestor.html
new file mode 100644
index 0000000000000..8396e81a08217
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testMandatoryTagAncestor.html
@@ -0,0 +1,16 @@
+<!--
+     MANDATORY_TAG_ANCESTOR
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+</body>
+<template type="amp-mustache">
+</template>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testMandatoryTagMissing.html b/validator/java/src/test/resources/test-cases/tags/testMandatoryTagMissing.html
new file mode 100644
index 0000000000000..20d0326e1e163
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testMandatoryTagMissing.html
@@ -0,0 +1,12 @@
+<!--
+     MANDATORY_TAG_MISSING
+-->
+<!doctype html>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+Hello, AMP4EMAIL world.
+</body>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testMissingRequiredExtension.html b/validator/java/src/test/resources/test-cases/tags/testMissingRequiredExtension.html
new file mode 100644
index 0000000000000..7a651e2065ff4
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testMissingRequiredExtension.html
@@ -0,0 +1,14 @@
+<!--
+     MISSING_REQUIRED_EXTENSION
+-->
+<!doctype html>
+<html amp4email>
+<head>
+  <meta charset="utf-8">
+  <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<form>
+</form>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testNonWhitespaceCdataEncountered.html b/validator/java/src/test/resources/test-cases/tags/testNonWhitespaceCdataEncountered.html
new file mode 100644
index 0000000000000..cd974314bcff8
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testNonWhitespaceCdataEncountered.html
@@ -0,0 +1,20 @@
+<!--
+     NON_WHITESPACE_CDATA_ENCOUNTERED
+-->
+<!doctype html>
+<html amp4email>
+
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js">ad</script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+
+</head>
+<body>
+<amp-carousel class="amp-carousel" height="250"
+              layout="fixed-height"
+              type="carousel">
+</amp-carousel>
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/tags/testSpecifiedLayoutInvalid.html b/validator/java/src/test/resources/test-cases/tags/testSpecifiedLayoutInvalid.html
new file mode 100644
index 0000000000000..1d1e531496f0a
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testSpecifiedLayoutInvalid.html
@@ -0,0 +1,19 @@
+<!--
+     SPECIFIED_LAYOUT_INVALID
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<amp-img src="https://images.com/img/amp.jpg"
+         width="1080"
+         height="610"
+         layout="fluid"
+         alt="an image"></amp-img>
+Hello, AMP4EMAIL world.
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/tags/testTagReferencePointConflict.html b/validator/java/src/test/resources/test-cases/tags/testTagReferencePointConflict.html
new file mode 100644
index 0000000000000..4c98b4ca7762d
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testTagReferencePointConflict.html
@@ -0,0 +1,46 @@
+<!--
+     TAG_REFERENCE_POINT_CONFLICT
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <script async custom-element="amp-selector" src="https://cdn.ampproject.org/v0/amp-selector-0.1.js"></script>
+    <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
+    <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <style amp-custom>
+        .radio-selector [option][selected] {
+            outline: none;
+        }
+        .radio-selector [option] {
+            display: flex;
+            align-items: center;
+        }
+        .radio-selector [option]:before {
+            transition: background 0.25s ease-in-out;
+            content: "";
+            display: inline-block;
+            width: 24px;
+            height: 24px;
+            margin: .5rem;
+            border-radius: 100%;
+            border: solid 1px #005AF0;
+        }
+        .radio-selector [option][selected]:before {
+            text-align: center;
+            content: "✓";
+            color: #fff;
+            background-color: #005AF0;
+        }
+    </style>
+</head>
+<body>
+<div>
+    <amp-selector layout="container" class="radio-selector">
+        <amp-selector></amp-selector>
+    </amp-selector>
+</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/tags/testWrongParentTag.html b/validator/java/src/test/resources/test-cases/tags/testWrongParentTag.html
new file mode 100644
index 0000000000000..676ea9737a6dd
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/tags/testWrongParentTag.html
@@ -0,0 +1,15 @@
+<!--
+     WRONG_PARENT_TAG
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>
+    <style amp4email-boilerplate>body{visibility:hidden}</style>
+</head>
+<body>
+<style amp-custom></style>
+
+</body>
+</html>
diff --git a/validator/java/src/test/resources/test-cases/templates/testTemplateInAttrName.html b/validator/java/src/test/resources/test-cases/templates/testTemplateInAttrName.html
new file mode 100644
index 0000000000000..f8902f8a5d73b
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/templates/testTemplateInAttrName.html
@@ -0,0 +1,21 @@
+<!--
+     TEMPLATE_IN_ATTR_NAME
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+    <style amp-custom>
+        amp-ig {
+        }
+    </style>
+</head>
+<body>
+<template type="amp-mustache">
+    <div {{attrName}}=something>
+    </div>
+</template>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/templates/testTemplatePartialInAttrValue.html b/validator/java/src/test/resources/test-cases/templates/testTemplatePartialInAttrValue.html
new file mode 100644
index 0000000000000..71447ab5ce5dc
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/templates/testTemplatePartialInAttrValue.html
@@ -0,0 +1,20 @@
+<!--
+     TEMPLATE_PARTIAL_IN_ATTR_VALUE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+    <style amp-custom>
+        amp-ig {
+        }
+    </style>
+</head>
+<body>
+<template type="amp-mustache">
+    <p title="{{ > notallowed }}"></p>
+</template>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/test-cases/templates/testUnescapedTemplateInAttrValue.html b/validator/java/src/test/resources/test-cases/templates/testUnescapedTemplateInAttrValue.html
new file mode 100644
index 0000000000000..b5bf07ec285f6
--- /dev/null
+++ b/validator/java/src/test/resources/test-cases/templates/testUnescapedTemplateInAttrValue.html
@@ -0,0 +1,21 @@
+<!--
+     UNESCAPED_TEMPLATE_IN_ATTR_VALUE
+-->
+<!doctype html>
+<html amp4email>
+<head>
+    <meta charset="utf-8">
+    <script async src="https://cdn.ampproject.org/v0.js"></script>  <style amp4email-boilerplate>body{visibility:hidden}</style>
+    <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
+    <style amp-custom>
+        amp-ig {
+        }
+    </style>
+</head>
+<body>
+<template type="amp-mustache">
+    <div lang={{{language}}}>
+    </div>
+</template>
+</body>
+</html>
\ No newline at end of file
diff --git a/validator/java/src/test/resources/validator-all-test.protoascii b/validator/java/src/test/resources/validator-all-test.protoascii
new file mode 100644
index 0000000000000..1fb79c027aa20
--- /dev/null
+++ b/validator/java/src/test/resources/validator-all-test.protoascii
@@ -0,0 +1,61 @@
+tags: {
+  html_format: AMP4EMAIL
+  tag_name: "$REFERENCE_POINT"
+  spec_name: "test_satisfies"
+  satisfies: "amp-app-banner button[open-button]"
+  mandatory_alternatives: "alternative"
+  siblings_disallowed: true
+}
+
+descendant_tag_list: {
+      name: "satisfies-allowed-descendants"
+      tag: "A"
+      tag: "ABBR"
+}
+
+tags: {
+  html_format: AMP4EMAIL
+  tag_name: "$REFERENCE_POINT"
+  spec_name: "test_satisfies_parent_head"
+  descendant_tag_list: "satisfies-allowed-descendants"
+  attrs: {
+      name: "href"
+      mandatory: true
+      alternative_names: "href"
+      value_url: {
+        protocol: "https"
+      }
+      blacklisted_value_regex: "__amp_source_origin"
+    }
+    mark_descendants {
+        marker: AUTOSCROLL
+      }
+    siblings_disallowed: true
+    mandatory_last_child: true
+    named_id: STYLE_AMP_CUSTOM
+
+}
+
+tags: {
+  html_format: AMP4EMAIL
+  tag_name: "$REFERENCE_POINT"
+  spec_name: "SCRIPT"
+  attrs: {
+    name: "type"
+    mandatory: true
+    value_casei: "application/json"
+  }
+}
+
+tags: {
+  html_format: AMP4EMAIL
+  tag_name: "$REFERENCE_POINT"
+  spec_name: "test_parent"
+  satisfies: "amp-app-banner button[open-button]"
+  mandatory_alternatives: "alternative"
+  siblings_disallowed: true
+  child_tags: {
+      mandatory_num_child_tags: 1
+      first_child_tag_name_oneof: "AMP-AD"
+  }
+}
\ No newline at end of file
diff --git a/validator/nodejs/package.json b/validator/nodejs/package.json
index a01d63f27eade..d95635490621d 100644
--- a/validator/nodejs/package.json
+++ b/validator/nodejs/package.json
@@ -9,9 +9,6 @@
     "AMP HTML",
     "Accelerated Mobile Pages"
   ],
-  "engines": {
-    "node": "^8 || ^10 || ^12 || ^14"
-  },
   "author": "The AMP HTML Authors",
   "license": "Apache-2.0",
   "repository": {
diff --git a/validator/package.json b/validator/package.json
index 597e3bcb30af4..6dfe30a774997 100644
--- a/validator/package.json
+++ b/validator/package.json
@@ -2,9 +2,6 @@
   "name": "amp-validator",
   "version": "0.1.0",
   "description": "Validator for AMP HTML (amp.dev)",
-  "engines": {
-    "node": "^12.0.0"
-  },
   "author": "The AMP HTML Authors",
   "license": "Apache-2.0",
   "repository": {
@@ -15,8 +12,8 @@
     "preinstall": "node ../build-system/common/check-package-manager.js"
   },
   "devDependencies": {
-    "google-closure-compiler": "20191111.0.0",
-    "google-closure-library": "20191111.0.0",
+    "google-closure-compiler": "20200112.0.0",
+    "google-closure-library": "20200112.0.0",
     "jasmine": "3.5.0"
   },
   "resolutions": {
diff --git a/validator/testdata/amp4ads_feature_tests/amp_selector.html b/validator/testdata/amp4ads_feature_tests/amp_selector.html
new file mode 100644
index 0000000000000..71703deff8c33
--- /dev/null
+++ b/validator/testdata/amp4ads_feature_tests/amp_selector.html
@@ -0,0 +1,40 @@
+<!--
+  Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+      http://www.apache.org/licenses/LICENSE-2.0
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+  This tests that amp-selector is allowed in A4A.
+-->
+<!doctype html>
+<html ⚡4ads>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp4ads-boilerplate>body{visibility:hidden}</style>
+  <script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script>
+  <script async custom-element="amp-selector" src="https://cdn.ampproject.org/v0/amp-selector-0.1.js"></script>
+</head>
+<body>
+  <amp-selector layout="container">
+    <option option="0" selected>0</option>
+    <option option="1">1</option>
+    <option option="2">2</option>
+    <option option="3" disabled>3</option>
+  </amp-selector>
+  <amp-selector layout="container" multiple>
+    <option option="0" selected>0</option>
+    <option option="1">1</option>
+    <option option="2">2</option>
+    <option option="3" disabled>3</option>
+  </amp-selector> 
+</body>
+</html>
diff --git a/validator/testdata/amp4ads_feature_tests/amp_selector.out b/validator/testdata/amp4ads_feature_tests/amp_selector.out
new file mode 100644
index 0000000000000..77edda299058a
--- /dev/null
+++ b/validator/testdata/amp4ads_feature_tests/amp_selector.out
@@ -0,0 +1,41 @@
+PASS
+|  <!--
+|    Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+|    Licensed under the Apache License, Version 2.0 (the "License");
+|    you may not use this file except in compliance with the License.
+|    You may obtain a copy of the License at
+|        http://www.apache.org/licenses/LICENSE-2.0
+|    Unless required by applicable law or agreed to in writing, software
+|    distributed under the License is distributed on an "AS-IS" BASIS,
+|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+|    See the License for the specific language governing permissions and
+|    limitations under the license.
+|  -->
+|  <!--
+|    Test Description:
+|    This tests that amp-selector is allowed in A4A.
+|  -->
+|  <!doctype html>
+|  <html ⚡4ads>
+|  <head>
+|    <meta charset="utf-8">
+|    <meta name="viewport" content="width=device-width,minimum-scale=1">
+|    <style amp4ads-boilerplate>body{visibility:hidden}</style>
+|    <script async src="https://cdn.ampproject.org/amp4ads-v0.js"></script>
+|    <script async custom-element="amp-selector" src="https://cdn.ampproject.org/v0/amp-selector-0.1.js"></script>
+|  </head>
+|  <body>
+|    <amp-selector layout="container">
+|      <option option="0" selected>0</option>
+|      <option option="1">1</option>
+|      <option option="2">2</option>
+|      <option option="3" disabled>3</option>
+|    </amp-selector>
+|    <amp-selector layout="container" multiple>
+|      <option option="0" selected>0</option>
+|      <option option="1">1</option>
+|      <option option="2">2</option>
+|      <option option="3" disabled>3</option>
+|    </amp-selector> 
+|  </body>
+|  </html>
diff --git a/validator/testdata/amp4ads_feature_tests/extensions.html b/validator/testdata/amp4ads_feature_tests/extensions.html
index 207058d54a384..d32c3fc678c76 100644
--- a/validator/testdata/amp4ads_feature_tests/extensions.html
+++ b/validator/testdata/amp4ads_feature_tests/extensions.html
@@ -94,6 +94,8 @@
      src="https://cdn.ampproject.org/v0/amp-pinterest-0.1.js"></script>
   <script async custom-element="amp-reach-player"
      src="https://cdn.ampproject.org/v0/amp-reach-player-0.1.js"></script>
+  <script async custom-element="amp-selector"
+     src="https://cdn.ampproject.org/v0/amp-selector-0.1.js"></script>
   <script async custom-element="amp-sidebar"
      src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script>
   <script async custom-element="amp-slides"
diff --git a/validator/testdata/amp4ads_feature_tests/extensions.out b/validator/testdata/amp4ads_feature_tests/extensions.out
index 263d922a08af7..4884ba02afea9 100644
--- a/validator/testdata/amp4ads_feature_tests/extensions.out
+++ b/validator/testdata/amp4ads_feature_tests/extensions.out
@@ -137,43 +137,45 @@ amp4ads_feature_tests/extensions.html:93:2 Custom JavaScript is not allowed. (se
 >>   ^~~~~~~~~
 amp4ads_feature_tests/extensions.html:95:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-reach-player-0.1.js"></script>
+|    <script async custom-element="amp-selector"
+|       src="https://cdn.ampproject.org/v0/amp-selector-0.1.js"></script>
 |    <script async custom-element="amp-sidebar"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:97:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:99:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script>
 |    <script async custom-element="amp-slides"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:99:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:101:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-slides-0.1.js"></script>
 |    <script async custom-element="amp-social-share"
 |       src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>
 |    <script async custom-element="amp-soundcloud"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:103:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:105:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-soundcloud-0.1.js"></script>
 |    <script async custom-element="amp-springboard-player"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:105:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:107:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-springboard-player-0.1.js"></script>
 |    <script async custom-element="amp-sticky-ad"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:107:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:109:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-sticky-ad-0.1.js"></script>
 |    <script async custom-element="amp-twitter"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:109:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:111:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-twitter-0.1.js"></script>
 |    <script async custom-element="amp-user-notification"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:111:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:113:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-user-notification-0.1.js"></script>
 |    <script async custom-element="amp-vimeo"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:113:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:115:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-vimeo-0.1.js"></script>
 |    <script async custom-element="amp-vine"
 >>   ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:115:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
+amp4ads_feature_tests/extensions.html:117:2 Custom JavaScript is not allowed. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags)
 |       src="https://cdn.ampproject.org/v0/amp-vine-0.1.js"></script>
 |
 |    <script async custom-template="amp-mustache"
@@ -181,8 +183,8 @@ amp4ads_feature_tests/extensions.html:115:2 Custom JavaScript is not allowed. (s
 |  </head>
 |  <body></body></html>
 >>                    ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:121:19 The extension 'amp-animation' was found on this page, but is unused. Please remove this extension.
+amp4ads_feature_tests/extensions.html:123:19 The extension 'amp-animation' was found on this page, but is unused. Please remove this extension.
 >>                    ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:121:19 The extension 'amp-lightbox' was found on this page, but is unused. Please remove this extension.
+amp4ads_feature_tests/extensions.html:123:19 The extension 'amp-lightbox' was found on this page, but is unused. Please remove this extension.
 >>                    ^~~~~~~~~
-amp4ads_feature_tests/extensions.html:121:19 The extension 'amp-mustache' was found on this page, but is unused. Please remove this extension.
+amp4ads_feature_tests/extensions.html:123:19 The extension 'amp-mustache' was found on this page, but is unused. Please remove this extension.
diff --git a/validator/testdata/amp4email_feature_tests/nonce_disallowed.out b/validator/testdata/amp4email_feature_tests/nonce_disallowed.out
index e92e6b9b946fd..8e85308d7c1a4 100644
--- a/validator/testdata/amp4email_feature_tests/nonce_disallowed.out
+++ b/validator/testdata/amp4email_feature_tests/nonce_disallowed.out
@@ -26,7 +26,7 @@ FAIL
 |    <style amp4email-boilerplate>body{visibility:hidden}</style>
 |    <script async src="https://cdn.ampproject.org/v0.js" nonce="disallowed"></script>
 >>   ^~~~~~~~~
-amp4email_feature_tests/nonce_disallowed.html:26:2 The attribute 'nonce' may not appear in tag 'amphtml engine v0.js script'. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
+amp4email_feature_tests/nonce_disallowed.html:26:2 The attribute 'nonce' may not appear in tag 'amphtml engine v0.js script [AMP4EMAIL,ACTIONS]'. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
 |  </head>
 |  <body>
 |  Hello, world.
diff --git a/validator/testdata/feature_tests/empty.out b/validator/testdata/feature_tests/empty.out
index 85acb6d87a41b..1dc7424a46c2f 100644
--- a/validator/testdata/feature_tests/empty.out
+++ b/validator/testdata/feature_tests/empty.out
@@ -19,6 +19,6 @@ feature_tests/empty.html:1:0 The mandatory tag 'noscript > style[amp-boilerplate
 >> ^~~~~~~~~
 feature_tests/empty.html:1:0 The mandatory tag 'body' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
 >> ^~~~~~~~~
-feature_tests/empty.html:1:0 The mandatory tag 'amphtml engine v0.js script' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
->> ^~~~~~~~~
 feature_tests/empty.html:1:0 The mandatory tag 'noscript enclosure for boilerplate' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amp-boilerplate?format=websites)
+>> ^~~~~~~~~
+feature_tests/empty.html:1:0 The mandatory tag 'amphtml engine v0.js script' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
diff --git a/validator/testdata/feature_tests/lts_extension_without_lts_runtime.html b/validator/testdata/feature_tests/lts_extension_without_lts_runtime.html
new file mode 100644
index 0000000000000..35260f95cbced
--- /dev/null
+++ b/validator/testdata/feature_tests/lts_extension_without_lts_runtime.html
@@ -0,0 +1,46 @@
+<!--
+  Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+
+  This test demonstrates that an LTS version of an extension may not be used with the standard
+  runtime.
+-->
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <link rel="canonical" href="./regular-html-version.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+
+  <!-- Valid: First script is non-LTS runtime -->
+  <script async src="https://cdn.ampproject.org/v0.js"></script>
+  <!-- Invalid: LTS extension is included. Produces error. -->
+  <script async custom-element='amp-ad'
+     src='https://cdn.ampproject.org/lts/v0/amp-ad-0.1.js'></script>
+  <!-- Valid: Non-LTS extension is included and used. No error or warning. -->
+  <script async custom-element='amp-font'
+     src='https://cdn.ampproject.org/v0/amp-font-0.1.js'></script>
+</head>
+<body>
+  <amp-font
+    layout="nodisplay"
+    font-family="Comic Amp"
+    timeout="3000">
+  </amp-font>
+</body>
+</html>
diff --git a/validator/testdata/feature_tests/lts_extension_without_lts_runtime.out b/validator/testdata/feature_tests/lts_extension_without_lts_runtime.out
new file mode 100644
index 0000000000000..18f3ad7b0ca66
--- /dev/null
+++ b/validator/testdata/feature_tests/lts_extension_without_lts_runtime.out
@@ -0,0 +1,49 @@
+FAIL
+|  <!--
+|    Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+|
+|    Licensed under the Apache License, Version 2.0 (the "License");
+|    you may not use this file except in compliance with the License.
+|    You may obtain a copy of the License at
+|
+|        http://www.apache.org/licenses/LICENSE-2.0
+|
+|    Unless required by applicable law or agreed to in writing, software
+|    distributed under the License is distributed on an "AS-IS" BASIS,
+|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+|    See the License for the specific language governing permissions and
+|    limitations under the license.
+|  -->
+|  <!--
+|    Test Description:
+|
+|    This test demonstrates that an LTS version of an extension may not be used with the standard
+|    runtime.
+|  -->
+|  <!doctype html>
+|  <html ⚡>
+|  <head>
+|    <meta charset="utf-8">
+|    <link rel="canonical" href="./regular-html-version.html">
+|    <meta name="viewport" content="width=device-width,minimum-scale=1">
+|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+|
+|    <!-- Valid: First script is non-LTS runtime -->
+|    <script async src="https://cdn.ampproject.org/v0.js"></script>
+|    <!-- Invalid: LTS extension is included. Produces error. -->
+|    <script async custom-element='amp-ad'
+>>   ^~~~~~~~~
+feature_tests/lts_extension_without_lts_runtime.html:33:2 'amp-ad' must use the non-LTS version to correspond with the first script in the page, which does not use LTS. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
+|       src='https://cdn.ampproject.org/lts/v0/amp-ad-0.1.js'></script>
+|    <!-- Valid: Non-LTS extension is included and used. No error or warning. -->
+|    <script async custom-element='amp-font'
+|       src='https://cdn.ampproject.org/v0/amp-font-0.1.js'></script>
+|  </head>
+|  <body>
+|    <amp-font
+|      layout="nodisplay"
+|      font-family="Comic Amp"
+|      timeout="3000">
+|    </amp-font>
+|  </body>
+|  </html>
diff --git a/validator/testdata/feature_tests/lts_runtime_after_extension.html b/validator/testdata/feature_tests/lts_runtime_after_extension.html
new file mode 100644
index 0000000000000..e04a16c80837d
--- /dev/null
+++ b/validator/testdata/feature_tests/lts_runtime_after_extension.html
@@ -0,0 +1,46 @@
+<!--
+  Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+
+  This test demonstrates that an LTS version of an extension may not be used with the standard
+  runtime when the runtime is included after the extensions.
+-->
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <link rel="canonical" href="./regular-html-version.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+
+  <!-- Valid: First script is an LTS extension. -->
+  <script async custom-element='amp-ad'
+     src='https://cdn.ampproject.org/lts/v0/amp-ad-0.1.js'></script>
+  <!-- Invalid: Non-LTS extension is included and used. Produces error. -->
+  <script async custom-element='amp-font'
+     src='https://cdn.ampproject.org/v0/amp-font-0.1.js'></script>
+  <!-- Valid: LTS runtime is included at the end. -->
+  <script async src="https://cdn.ampproject.org/lts/v0.js"></script>
+</head>
+<body>
+  <amp-font
+    layout="nodisplay"
+    font-family="Comic Amp"
+    timeout="3000">
+  </amp-font>
+</body>
+</html>
diff --git a/validator/testdata/feature_tests/lts_runtime_after_extension.out b/validator/testdata/feature_tests/lts_runtime_after_extension.out
new file mode 100644
index 0000000000000..d9a095296e2dc
--- /dev/null
+++ b/validator/testdata/feature_tests/lts_runtime_after_extension.out
@@ -0,0 +1,49 @@
+FAIL
+|  <!--
+|    Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+|
+|    Licensed under the Apache License, Version 2.0 (the "License");
+|    you may not use this file except in compliance with the License.
+|    You may obtain a copy of the License at
+|
+|        http://www.apache.org/licenses/LICENSE-2.0
+|
+|    Unless required by applicable law or agreed to in writing, software
+|    distributed under the License is distributed on an "AS-IS" BASIS,
+|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+|    See the License for the specific language governing permissions and
+|    limitations under the license.
+|  -->
+|  <!--
+|    Test Description:
+|
+|    This test demonstrates that an LTS version of an extension may not be used with the standard
+|    runtime when the runtime is included after the extensions.
+|  -->
+|  <!doctype html>
+|  <html ⚡>
+|  <head>
+|    <meta charset="utf-8">
+|    <link rel="canonical" href="./regular-html-version.html">
+|    <meta name="viewport" content="width=device-width,minimum-scale=1">
+|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+|
+|    <!-- Valid: First script is an LTS extension. -->
+|    <script async custom-element='amp-ad'
+|       src='https://cdn.ampproject.org/lts/v0/amp-ad-0.1.js'></script>
+|    <!-- Invalid: Non-LTS extension is included and used. Produces error. -->
+|    <script async custom-element='amp-font'
+>>   ^~~~~~~~~
+feature_tests/lts_runtime_after_extension.html:34:2 'amp-font' must use the LTS version to correspond with the first script in the page, which uses LTS. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
+|       src='https://cdn.ampproject.org/v0/amp-font-0.1.js'></script>
+|    <!-- Valid: LTS runtime is included at the end. -->
+|    <script async src="https://cdn.ampproject.org/lts/v0.js"></script>
+|  </head>
+|  <body>
+|    <amp-font
+|      layout="nodisplay"
+|      font-family="Comic Amp"
+|      timeout="3000">
+|    </amp-font>
+|  </body>
+|  </html>
diff --git a/validator/testdata/feature_tests/lts_runtime_and_extensions.html b/validator/testdata/feature_tests/lts_runtime_and_extensions.html
new file mode 100644
index 0000000000000..6e48522b91580
--- /dev/null
+++ b/validator/testdata/feature_tests/lts_runtime_and_extensions.html
@@ -0,0 +1,46 @@
+<!--
+  Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS-IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the license.
+-->
+<!--
+  Test Description:
+
+  This test demonstrates that the standard version of an extension may not be used with the LTS
+  runtime.
+-->
+<!doctype html>
+<html ⚡>
+<head>
+  <meta charset="utf-8">
+  <link rel="canonical" href="./regular-html-version.html">
+  <meta name="viewport" content="width=device-width,minimum-scale=1">
+  <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+
+  <!-- Valid: First script is LTS runtime -->
+  <script async src="https://cdn.ampproject.org/lts/v0.js"></script>
+  <!-- Invalid: Non-LTS extension is included. Produces error. -->
+  <script async custom-element='amp-ad'
+     src='https://cdn.ampproject.org/v0/amp-ad-0.1.js'></script>
+  <!-- Valid: LTS extension is included and used. No error or warning. -->
+  <script async custom-element='amp-font'
+     src='https://cdn.ampproject.org/lts/v0/amp-font-0.1.js'></script>
+</head>
+<body>
+  <amp-font
+    layout="nodisplay"
+    font-family="Comic Amp"
+    timeout="3000">
+  </amp-font>
+</body>
+</html>
diff --git a/validator/testdata/feature_tests/lts_runtime_and_extensions.out b/validator/testdata/feature_tests/lts_runtime_and_extensions.out
new file mode 100644
index 0000000000000..7fb77aed1c85f
--- /dev/null
+++ b/validator/testdata/feature_tests/lts_runtime_and_extensions.out
@@ -0,0 +1,49 @@
+FAIL
+|  <!--
+|    Copyright 2019 The AMP HTML Authors. All Rights Reserved.
+|
+|    Licensed under the Apache License, Version 2.0 (the "License");
+|    you may not use this file except in compliance with the License.
+|    You may obtain a copy of the License at
+|
+|        http://www.apache.org/licenses/LICENSE-2.0
+|
+|    Unless required by applicable law or agreed to in writing, software
+|    distributed under the License is distributed on an "AS-IS" BASIS,
+|    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+|    See the License for the specific language governing permissions and
+|    limitations under the license.
+|  -->
+|  <!--
+|    Test Description:
+|
+|    This test demonstrates that the standard version of an extension may not be used with the LTS
+|    runtime.
+|  -->
+|  <!doctype html>
+|  <html ⚡>
+|  <head>
+|    <meta charset="utf-8">
+|    <link rel="canonical" href="./regular-html-version.html">
+|    <meta name="viewport" content="width=device-width,minimum-scale=1">
+|    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
+|
+|    <!-- Valid: First script is LTS runtime -->
+|    <script async src="https://cdn.ampproject.org/lts/v0.js"></script>
+|    <!-- Invalid: Non-LTS extension is included. Produces error. -->
+|    <script async custom-element='amp-ad'
+>>   ^~~~~~~~~
+feature_tests/lts_runtime_and_extensions.html:33:2 'amp-ad' must use the LTS version to correspond with the first script in the page, which uses LTS. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
+|       src='https://cdn.ampproject.org/v0/amp-ad-0.1.js'></script>
+|    <!-- Valid: LTS extension is included and used. No error or warning. -->
+|    <script async custom-element='amp-font'
+|       src='https://cdn.ampproject.org/lts/v0/amp-font-0.1.js'></script>
+|  </head>
+|  <body>
+|    <amp-font
+|      layout="nodisplay"
+|      font-family="Comic Amp"
+|      timeout="3000">
+|    </amp-font>
+|  </body>
+|  </html>
diff --git a/validator/testdata/feature_tests/no_dev_mode.html b/validator/testdata/feature_tests/no_dev_mode.html
index cee3f6ad8d4aa..c80529e030c0a 100644
--- a/validator/testdata/feature_tests/no_dev_mode.html
+++ b/validator/testdata/feature_tests/no_dev_mode.html
@@ -49,7 +49,7 @@
     <anotherfaketag></anotherfaketag>
   </faketag>
 
-  <amp-autocomplete data-ampdevmode></amp-autocomplete>
+  <amp-autocomplete filter="prefix" data-ampdevmode></amp-autocomplete>
 
 </body>
 </html>
diff --git a/validator/testdata/feature_tests/no_dev_mode.out b/validator/testdata/feature_tests/no_dev_mode.out
index 48910da8120c8..3608899a29678 100644
--- a/validator/testdata/feature_tests/no_dev_mode.out
+++ b/validator/testdata/feature_tests/no_dev_mode.out
@@ -60,7 +60,7 @@ feature_tests/no_dev_mode.html:48:2 The tag 'faketag' is disallowed.
 feature_tests/no_dev_mode.html:49:4 The tag 'anotherfaketag' is disallowed.
 |    </faketag>
 |
-|    <amp-autocomplete data-ampdevmode></amp-autocomplete>
+|    <amp-autocomplete filter="prefix" data-ampdevmode></amp-autocomplete>
 |
 |  </body>
 |  </html>
diff --git a/validator/testdata/feature_tests/not_amp.out b/validator/testdata/feature_tests/not_amp.out
index fceb7e50bf490..9b50bb30f64c0 100644
--- a/validator/testdata/feature_tests/not_amp.out
+++ b/validator/testdata/feature_tests/not_amp.out
@@ -38,6 +38,6 @@ feature_tests/not_amp.html:28:6 The mandatory tag 'head > style[amp-boilerplate]
 >>       ^~~~~~~~~
 feature_tests/not_amp.html:28:6 The mandatory tag 'noscript > style[amp-boilerplate]' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amp-boilerplate?format=websites)
 >>       ^~~~~~~~~
-feature_tests/not_amp.html:28:6 The mandatory tag 'amphtml engine v0.js script' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
->>       ^~~~~~~~~
 feature_tests/not_amp.html:28:6 The mandatory tag 'noscript enclosure for boilerplate' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amp-boilerplate?format=websites)
+>>       ^~~~~~~~~
+feature_tests/not_amp.html:28:6 The mandatory tag 'amphtml engine v0.js script' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
diff --git a/validator/testdata/feature_tests/several_errors.out b/validator/testdata/feature_tests/several_errors.out
index 46b6988527906..79b4341d38476 100644
--- a/validator/testdata/feature_tests/several_errors.out
+++ b/validator/testdata/feature_tests/several_errors.out
@@ -57,6 +57,6 @@ feature_tests/several_errors.html:40:2 The attribute 'height' in tag 'amp-ad' is
 >>       ^~~~~~~~~
 feature_tests/several_errors.html:43:6 The mandatory tag 'meta name=viewport' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
 >>       ^~~~~~~~~
-feature_tests/several_errors.html:43:6 The mandatory tag 'amphtml engine v0.js script' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
->>       ^~~~~~~~~
 feature_tests/several_errors.html:43:6 The tag 'amp-ad extension .js script' is missing or incorrect, but required by 'amp-ad'. This will soon be an error. (see https://amp.dev/documentation/components/amp-ad)
+>>       ^~~~~~~~~
+feature_tests/several_errors.html:43:6 The mandatory tag 'amphtml engine v0.js script' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup)
diff --git a/validator/testdata/transformed_feature_tests/server_side_rendering.html b/validator/testdata/transformed_feature_tests/server_side_rendering.html
index f76280ab9ac46..1fbba208866db 100644
--- a/validator/testdata/transformed_feature_tests/server_side_rendering.html
+++ b/validator/testdata/transformed_feature_tests/server_side_rendering.html
@@ -17,7 +17,8 @@
   Test Description:
   Test for server side rendering transformer:
    - html tag attributes i-amphtml-layout and i-amphtml-no-boilerplate present
-   - i-amphtml-sizer tag with style attribute
+   - responsive layout: i-amphtml-sizer tag with style attribute
+   - intrinsic layout: i-amphtml-sizer tag with img tag
 -->
 <!doctype html>
 <html ⚡ transformed="google;v=1" i-amphtml-layout i-amphtml-no-boilerplate>
@@ -35,6 +36,20 @@
     <i-amphtml-sizer style=display:block;padding-top:171.4370%;></i-amphtml-sizer>
   </amp-img>
   <!-- Valid -->
+  <amp-img src="image.png" height="100" width="300" layout="intrinsic" class="i-amphtml-layout-intrinsic i-amphtml-layout-size-defined" i-amphtml-layout="intrinsic">
+    <i-amphtml-sizer class="i-amphtml-sizer"><img alt="" aria-hidden="true" class="i-amphtml-intrinsic-sizer" role="presentation" src="data:image/svg+xml;charset=utf-8,<svg height=&quot;100&quot; width=&quot;300&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; version=&quot;1.1&quot;/>"></i-amphtml-sizer>
+  </amp-img>
+  <!-- Invalid i-amphtml-sizer > img does not specify an svg -->
+  <amp-img src="image.png" height="100" width="300" layout="intrinsic" class="i-amphtml-layout-intrinsic i-amphtml-layout-size-defined" i-amphtml-layout="intrinsic">
+    <i-amphtml-sizer class="i-amphtml-sizer"><img alt="" aria-hidden="true" class="i-amphtml-intrinsic-sizer" role="presentation" src="image.png"></i-amphtml-sizer>
+  </amp-img>
+  <!-- Invalid intrinsic i-amphtml-sizer inside responsive sizer  -->
+  <amp-img src="image.png" height="100" width="300" layout="intrinsic" class="i-amphtml-layout-intrinsic i-amphtml-layout-size-defined" i-amphtml-layout="intrinsic">
+    <i-amphtml-sizer style=display:block;padding-top:171.4370%;>
+      <img alt="" aria-hidden="true" class="i-amphtml-intrinsic-sizer" role="presentation" src="data:image/svg+xml;charset=utf-8,<svg height=&quot;100&quot; width=&quot;300&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; version=&quot;1.1&quot;/>">
+    </i-amphtml-sizer>
+  </amp-img>
+  <!-- Valid -->
   <amp-social-share class="i-amphtml-layout-fixed i-amphtml-layout-size-defined" i-amphtml-layout=fixed style=width:60px;height:44px; type=test></amp-social-share>
   <!-- Invalid i-amphtml-layout attribute value does not match layout value -->
   <amp-img class="i-amphtml-layout-responsive i-amphtml-layout-size-defined" height=2911 i-amphtml-layout=nodisplay layout=responsive src=https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg srcset="https://example-com.cdn.ampproject.org/i/s/example.com/lemur-wide.jpg 640w, https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg 320w" width=1698>
diff --git a/validator/testdata/transformed_feature_tests/server_side_rendering.out b/validator/testdata/transformed_feature_tests/server_side_rendering.out
index 4370d3b7618c9..86ffdac7ed1a7 100644
--- a/validator/testdata/transformed_feature_tests/server_side_rendering.out
+++ b/validator/testdata/transformed_feature_tests/server_side_rendering.out
@@ -18,7 +18,8 @@ FAIL
 |    Test Description:
 |    Test for server side rendering transformer:
 |     - html tag attributes i-amphtml-layout and i-amphtml-no-boilerplate present
-|     - i-amphtml-sizer tag with style attribute
+|     - responsive layout: i-amphtml-sizer tag with style attribute
+|     - intrinsic layout: i-amphtml-sizer tag with img tag
 |  -->
 |  <!doctype html>
 |  <html ⚡ transformed="google;v=1" i-amphtml-layout i-amphtml-no-boilerplate>
@@ -36,35 +37,53 @@ FAIL
 |      <i-amphtml-sizer style=display:block;padding-top:171.4370%;></i-amphtml-sizer>
 |    </amp-img>
 |    <!-- Valid -->
+|    <amp-img src="image.png" height="100" width="300" layout="intrinsic" class="i-amphtml-layout-intrinsic i-amphtml-layout-size-defined" i-amphtml-layout="intrinsic">
+|      <i-amphtml-sizer class="i-amphtml-sizer"><img alt="" aria-hidden="true" class="i-amphtml-intrinsic-sizer" role="presentation" src="data:image/svg+xml;charset=utf-8,<svg height=&quot;100&quot; width=&quot;300&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; version=&quot;1.1&quot;/>"></i-amphtml-sizer>
+|    </amp-img>
+|    <!-- Invalid i-amphtml-sizer > img does not specify an svg -->
+|    <amp-img src="image.png" height="100" width="300" layout="intrinsic" class="i-amphtml-layout-intrinsic i-amphtml-layout-size-defined" i-amphtml-layout="intrinsic">
+|      <i-amphtml-sizer class="i-amphtml-sizer"><img alt="" aria-hidden="true" class="i-amphtml-intrinsic-sizer" role="presentation" src="image.png"></i-amphtml-sizer>
+>>                                              ^~~~~~~~~
+transformed_feature_tests/server_side_rendering.html:44:45 The attribute 'src' in tag 'IMG-I-AMPHTML-INTRINSIC-SIZER' is set to the invalid value 'image.png'.
+|    </amp-img>
+|    <!-- Invalid intrinsic i-amphtml-sizer inside responsive sizer  -->
+|    <amp-img src="image.png" height="100" width="300" layout="intrinsic" class="i-amphtml-layout-intrinsic i-amphtml-layout-size-defined" i-amphtml-layout="intrinsic">
+|      <i-amphtml-sizer style=display:block;padding-top:171.4370%;>
+|        <img alt="" aria-hidden="true" class="i-amphtml-intrinsic-sizer" role="presentation" src="data:image/svg+xml;charset=utf-8,<svg height=&quot;100&quot; width=&quot;300&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; version=&quot;1.1&quot;/>">
+>>       ^~~~~~~~~
+transformed_feature_tests/server_side_rendering.html:49:6 The parent tag of tag 'IMG-I-AMPHTML-INTRINSIC-SIZER' is 'i-amphtml-sizer', but it can only be 'i-amphtml-sizer-intrinsic'.
+|      </i-amphtml-sizer>
+|    </amp-img>
+|    <!-- Valid -->
 |    <amp-social-share class="i-amphtml-layout-fixed i-amphtml-layout-size-defined" i-amphtml-layout=fixed style=width:60px;height:44px; type=test></amp-social-share>
 |    <!-- Invalid i-amphtml-layout attribute value does not match layout value -->
 |    <amp-img class="i-amphtml-layout-responsive i-amphtml-layout-size-defined" height=2911 i-amphtml-layout=nodisplay layout=responsive src=https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg srcset="https://example-com.cdn.ampproject.org/i/s/example.com/lemur-wide.jpg 640w, https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg 320w" width=1698>
 >>   ^~~~~~~~~
-transformed_feature_tests/server_side_rendering.html:40:2 Invalid value 'nodisplay' for attribute 'i-amphtml-layout' in tag 'amp-img' - for layout 'RESPONSIVE', set the attribute 'i-amphtml-layout' to value 'responsive'. (see https://amp.dev/documentation/components/amp-img)
+transformed_feature_tests/server_side_rendering.html:55:2 Invalid value 'nodisplay' for attribute 'i-amphtml-layout' in tag 'amp-img' - for layout 'RESPONSIVE', set the attribute 'i-amphtml-layout' to value 'responsive'. (see https://amp.dev/documentation/components/amp-img)
 |      <i-amphtml-sizer style=display:block;padding-top:171.4370%;></i-amphtml-sizer>
 |    </amp-img>
 |    <!-- Invalid class attribute value due to not matching layout value -->
 |    <amp-img class="i-amphtml-layout-nodisplay i-amphtml-layout-size-defined" height=2911 i-amphtml-layout=responsive layout=responsive src=https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg srcset="https://example-com.cdn.ampproject.org/i/s/example.com/lemur-wide.jpg 640w, https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg 320w" width=1698>
 >>   ^~~~~~~~~
-transformed_feature_tests/server_side_rendering.html:44:2 The attribute 'class' in tag 'amp-img' is set to the invalid value 'i-amphtml-layout-nodisplay i-amphtml-layout-size-defined'. (see https://amp.dev/documentation/components/amp-img)
+transformed_feature_tests/server_side_rendering.html:59:2 The attribute 'class' in tag 'amp-img' is set to the invalid value 'i-amphtml-layout-nodisplay i-amphtml-layout-size-defined'. (see https://amp.dev/documentation/components/amp-img)
 |      <i-amphtml-sizer style=display:block;padding-top:171.4370%;></i-amphtml-sizer>
 |    </amp-img>
 |    <!-- Invalid class attribute value due to layout not being size defined (spaces) -->
 |    <amp-img class="i-amphtml-layout-nodisplay i-amphtml-layout-size-defined" i-amphtml-layout=nodisplay layout=nodisplay></amp-img>
 >>   ^~~~~~~~~
-transformed_feature_tests/server_side_rendering.html:48:2 The attribute 'class' in tag 'amp-img' is set to the invalid value 'i-amphtml-layout-nodisplay i-amphtml-layout-size-defined'. (see https://amp.dev/documentation/components/amp-img)
+transformed_feature_tests/server_side_rendering.html:63:2 The attribute 'class' in tag 'amp-img' is set to the invalid value 'i-amphtml-layout-nodisplay i-amphtml-layout-size-defined'. (see https://amp.dev/documentation/components/amp-img)
 |    <!-- Invalid class attribute value due to layout not being size defined (tabs) -->
 |    <amp-img class="i-amphtml-layout-nodisplay  i-amphtml-layout-size-defined" i-amphtml-layout=nodisplay layout=nodisplay></amp-img>
 >>   ^~~~~~~~~
-transformed_feature_tests/server_side_rendering.html:50:2 The attribute 'class' in tag 'amp-img' is set to the invalid value 'i-amphtml-layout-nodisplay i-amphtml-layout-size-defined'. (see https://amp.dev/documentation/components/amp-img)
+transformed_feature_tests/server_side_rendering.html:65:2 The attribute 'class' in tag 'amp-img' is set to the invalid value 'i-amphtml-layout-nodisplay i-amphtml-layout-size-defined'. (see https://amp.dev/documentation/components/amp-img)
 |    <!-- Invalid i-amphtml-sizer due to css declarations -->
 |    <amp-img class="i-amphtml-layout-responsive i-amphtml-layout-size-defined" height=2911 i-amphtml-layout=responsive layout=responsive src=https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg srcset="https://example-com.cdn.ampproject.org/i/s/example.com/lemur-wide.jpg 640w, https://example-com.cdn.ampproject.org/i/s/example.com/lemur-narrow.jpg 320w" width=1698>
 |      <i-amphtml-sizer style=display:none;padding-bottom:171.4370%;></i-amphtml-sizer>
 >>     ^~~~~~~~~
-transformed_feature_tests/server_side_rendering.html:53:4 CSS syntax error in tag 'i-amphtml-sizer' - the property 'display' is set to the disallowed value 'none'. (see https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages)
+transformed_feature_tests/server_side_rendering.html:68:4 CSS syntax error in tag 'I-AMPHTML-SIZER-RESPONSIVE' - the property 'display' is set to the disallowed value 'none'. (see https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages)
 >>     ^~~~~~~~~
-transformed_feature_tests/server_side_rendering.html:53:4 The property 'padding-bottom' in attribute 'style' in tag 'i-amphtml-sizer' is disallowed. (see https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages)
+transformed_feature_tests/server_side_rendering.html:68:4 The property 'padding-bottom' in attribute 'style' in tag 'I-AMPHTML-SIZER-RESPONSIVE' is disallowed. (see https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages)
 |    </amp-img>
 |
 |  </body>
-|  </html>
+|  </html>
\ No newline at end of file
diff --git a/validator/testdata/transformed_feature_tests/transformed_but_not_identified_transformed.out b/validator/testdata/transformed_feature_tests/transformed_but_not_identified_transformed.out
index b97752330f836..c228999c30921 100644
--- a/validator/testdata/transformed_feature_tests/transformed_but_not_identified_transformed.out
+++ b/validator/testdata/transformed_feature_tests/transformed_but_not_identified_transformed.out
@@ -44,7 +44,7 @@ transformed_feature_tests/transformed_but_not_identified_transformed.html:31:2 T
 transformed_feature_tests/transformed_but_not_identified_transformed.html:31:2 The attribute 'i-amphtml-layout' may not appear in tag 'amp-img'. (see https://amp.dev/documentation/components/amp-img)
 |      <i-amphtml-sizer style=display:block;padding-top:171.4370%;></i-amphtml-sizer>
 >>     ^~~~~~~~~
-transformed_feature_tests/transformed_but_not_identified_transformed.html:32:4 The tag 'i-amphtml-sizer' is disallowed.
+transformed_feature_tests/transformed_but_not_identified_transformed.html:32:4 The tag 'i-amphtml-sizer' is disallowed except in specific forms.
 |    </amp-img>
 |  </body>
 |  </html>
@@ -53,4 +53,4 @@ transformed_feature_tests/transformed_but_not_identified_transformed.html:35:6 T
 >>       ^~~~~~~~~
 transformed_feature_tests/transformed_but_not_identified_transformed.html:35:6 The mandatory tag 'noscript > style[amp-boilerplate]' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amp-boilerplate?format=websites)
 >>       ^~~~~~~~~
-transformed_feature_tests/transformed_but_not_identified_transformed.html:35:6 The mandatory tag 'noscript enclosure for boilerplate' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amp-boilerplate?format=websites)
+transformed_feature_tests/transformed_but_not_identified_transformed.html:35:6 The mandatory tag 'noscript enclosure for boilerplate' is missing or incorrect. (see https://amp.dev/documentation/guides-and-tutorials/learn/spec/amp-boilerplate?format=websites)
\ No newline at end of file
diff --git a/validator/validator-main.protoascii b/validator/validator-main.protoascii
index 9622c57acba74..f9bc6d6c108b9 100644
--- a/validator/validator-main.protoascii
+++ b/validator/validator-main.protoascii
@@ -26,7 +26,7 @@ min_validator_revision_required: 375
 # newer versions of the spec file. This is currently a Google internal
 # mechanism, validator.js does not use this facility. However, any
 # change to this file (validator-main.js) requires updating this revision id.
-spec_file_revision: 974
+spec_file_revision: 997
 
 styles_spec_url: "https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages"
 script_spec_url: "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#html-tags"
@@ -1895,6 +1895,7 @@ tags: {
       # Blackberry messenger
       # (http://devblog.blackberry.com/2015/02/cross-platform-sharing-with-bbm/)
       protocol: "bbmi"
+      protocol: "chrome"
       # IOS over-the-air app installation
       # (https://github.com/nifcblm/AHPP-iOS-App/wiki/How-to-distribute-enterprise-iOS-App)
       protocol: "itms-services"
@@ -4857,16 +4858,14 @@ tags: {
 # description are allowed.
 # Note that the type TEXT/PLAIN description is define in
 # validator-amp-mustache.protoascii.
-tags: {
-  html_format: AMP
-  html_format: AMP4EMAIL
-  html_format: ACTIONS
-  tag_name: "SCRIPT"
-  spec_name: "amphtml engine v0.js script"
-  mandatory: true
-  unique: true
-  mandatory_parent: "HEAD"
-  attr_lists: "nonce-attr"
+
+# The three tagspecs below all handle the runtime engine v0.js script. They
+# enforce that exactly one runtime script must be included. This tagspec is
+# for the standard runtime, while the one below it is an identical spec but for
+# the LTS runtime, with the only difference being the src attribute. The third
+# is the corresponding spec for AMP4EMAIL and ACTIONS.
+attr_lists: {
+  name: "amphtml-engine-attrs"
   attrs: {
     name: "async"
     mandatory: true
@@ -4876,15 +4875,48 @@ tags: {
     name: "crossorigin"
     value: "anonymous"
   }
+  attrs: {
+    name: "type"
+    value_casei: "text/javascript"
+  }
+}
+tags: {
+  html_format: AMP
+  tag_name: "SCRIPT"
+  spec_name: "amphtml engine v0.js script"
+  mandatory_alternatives: "amphtml engine v0.js script"
+  unique: true
+  mandatory_parent: "HEAD"
+  attr_lists: "nonce-attr"
+  attr_lists: "amphtml-engine-attrs"
   attrs: {
     name: "src"
     mandatory: true
     value: "https://cdn.ampproject.org/v0.js"
     dispatch_key: NAME_VALUE_DISPATCH
   }
+  cdata: {
+    blacklisted_cdata_regex: {
+      regex: "."
+      error_message: "contents"
+    }
+  }
+  spec_url: "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup"
+}
+tags: {
+  html_format: AMP
+  tag_name: "SCRIPT"
+  spec_name: "amphtml engine v0.js lts script"
+  mandatory_alternatives: "amphtml engine v0.js script"
+  unique: true
+  mandatory_parent: "HEAD"
+  attr_lists: "nonce-attr"
+  attr_lists: "amphtml-engine-attrs"
   attrs: {
-    name: "type"
-    value_casei: "text/javascript"
+    name: "src"
+    mandatory: true
+    value: "https://cdn.ampproject.org/lts/v0.js"
+    dispatch_key: NAME_VALUE_DISPATCH
   }
   cdata: {
     blacklisted_cdata_regex: {
@@ -4895,32 +4927,44 @@ tags: {
   spec_url: "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup"
 }
 tags: {
-  html_format: AMP4ADS
+  html_format: AMP4EMAIL
+  html_format: ACTIONS
   tag_name: "SCRIPT"
-  spec_name: "amp4ads engine amp4ads-v0.js script"
+  spec_name: "amphtml engine v0.js script [AMP4EMAIL,ACTIONS]"
   mandatory: true
   unique: true
   mandatory_parent: "HEAD"
   attr_lists: "nonce-attr"
+  attr_lists: "amphtml-engine-attrs"
   attrs: {
-    name: "async"
+    name: "src"
     mandatory: true
-    value: ""
+    value: "https://cdn.ampproject.org/v0.js"
+    dispatch_key: NAME_VALUE_DISPATCH
   }
-  attrs: {
-    name: "crossorigin"
-    value: "anonymous"
+  cdata: {
+    blacklisted_cdata_regex: {
+      regex: "."
+      error_message: "contents"
+    }
   }
+  spec_url: "https://amp.dev/documentation/guides-and-tutorials/learn/spec/amphtml#required-markup"
+}
+tags: {
+  html_format: AMP4ADS
+  tag_name: "SCRIPT"
+  spec_name: "amp4ads engine amp4ads-v0.js script"
+  mandatory: true
+  unique: true
+  mandatory_parent: "HEAD"
+  attr_lists: "nonce-attr"
+  attr_lists: "amphtml-engine-attrs"
   attrs: {
     name: "src"
     mandatory: true
     value: "https://cdn.ampproject.org/amp4ads-v0.js"
     dispatch_key: NAME_VALUE_DISPATCH
   }
-  attrs: {
-    name: "type"
-    value_casei: "text/javascript"
-  }
   cdata: {
     blacklisted_cdata_regex: {
       regex: "."
@@ -5320,9 +5364,11 @@ tags: {
   html_format: ACTIONS
   enabled_by: "transformed"
   tag_name: "I-AMPHTML-SIZER"
+  spec_name: "I-AMPHTML-SIZER-RESPONSIVE"
   explicit_attrs_only: true
   attrs: {
     name: "style"
+    dispatch_key: NAME_DISPATCH
     mandatory: true
     blacklisted_value_regex: "!\\s*important"
     css_declaration: {
@@ -5333,6 +5379,49 @@ tags: {
   }
 }
 
+tags: {
+  html_format: AMP
+  html_format: ACTIONS
+  enabled_by: "transformed"
+  tag_name: "I-AMPHTML-SIZER"
+  spec_name: "I-AMPHTML-SIZER-INTRINSIC"
+  explicit_attrs_only: true
+  attrs: {
+    name: "class"
+    value: "i-amphtml-sizer"
+    mandatory: true
+    dispatch_key: NAME_DISPATCH
+  }
+}
+
+tags: {
+  html_format: AMP
+  enabled_by: "transformed"
+  tag_name: "IMG"
+  spec_name: "IMG-I-AMPHTML-INTRINSIC-SIZER"
+  mandatory_parent: "I-AMPHTML-SIZER-INTRINSIC"
+  attrs: {
+    name: "alt"
+    value: ""
+    mandatory: true
+  }
+  attrs: {
+    name: "aria-hidden"
+    value: "true"
+    mandatory: true
+  }
+  attrs: {
+    name: "role"
+    value: "presentation"
+    mandatory: true
+  }
+  attrs: {
+    name: "src"
+    value_regex: "data:image\\/svg\\+xml;charset=utf-8,<svg height=\"\\d+\" width=\"\\d+\" xmlns=\"http:\\/\\/www\\.w3\\.org\\/2000\\/svg\" version=\"1\\.1\"\\/>"
+    mandatory: true
+  }
+}
+
 # AMP Layout attributes: implied for TagSpecs with amp_layout field
 # set. Note that while these attributes are defined as optional here,
 # depending on amp layout the validator will examine these fields and
@@ -6639,6 +6728,7 @@ attr_lists: {
     value: "rangeUnderflow"
     value: "stepMismatch"
     value: "tooLong"
+    value: "tooShort"
     value: "typeMismatch"
     value: "valueMissing"
     trigger: {
@@ -6779,156 +6869,162 @@ error_specificity { code: WARNING_TAG_REQUIRED_BY_MISSING specificity: 14 }
 error_specificity { code: EXTENSION_UNUSED specificity: 15 }
 error_specificity { code: WARNING_EXTENSION_UNUSED specificity: 16 }
 error_specificity { code: WARNING_EXTENSION_DEPRECATED_VERSION specificity: 17 }
-error_specificity { code: DISALLOWED_TAG specificity: 18 }
-error_specificity { code: DISALLOWED_ATTR specificity: 19 }
-error_specificity { code: INVALID_ATTR_VALUE specificity: 20 }
-error_specificity { code: DUPLICATE_ATTRIBUTE specificity: 21 }
-error_specificity { code: ATTR_VALUE_REQUIRED_BY_LAYOUT specificity: 22 }
-error_specificity { code: MANDATORY_ATTR_MISSING specificity: 23 }
-error_specificity { code: MANDATORY_ONEOF_ATTR_MISSING specificity: 24 }
-error_specificity { code: MANDATORY_ANYOF_ATTR_MISSING specificity: 25 }
-error_specificity { code: ATTR_REQUIRED_BUT_MISSING specificity: 26 }
-error_specificity { code: DUPLICATE_UNIQUE_TAG specificity: 27 }
-error_specificity { code: DUPLICATE_UNIQUE_TAG_WARNING specificity: 28 }
-error_specificity { code: STYLESHEET_TOO_LONG specificity: 29 }
-error_specificity { code: STYLESHEET_AND_INLINE_STYLE_TOO_LONG specificity: 30 }
-error_specificity { code: INLINE_STYLE_TOO_LONG specificity: 31 }
-error_specificity { code: CSS_SYNTAX_INVALID_AT_RULE specificity: 32 }
+error_specificity { code: NON_LTS_SCRIPT_AFTER_LTS specificity: 18 }
+error_specificity { code: LTS_SCRIPT_AFTER_NON_LTS specificity: 19 }
+error_specificity { code: DISALLOWED_TAG specificity: 20 }
+error_specificity { code: DISALLOWED_ATTR specificity: 21 }
+error_specificity { code: INVALID_ATTR_VALUE specificity: 22 }
+error_specificity { code: DUPLICATE_ATTRIBUTE specificity: 23 }
+error_specificity { code: ATTR_VALUE_REQUIRED_BY_LAYOUT specificity: 24 }
+error_specificity { code: MANDATORY_ATTR_MISSING specificity: 25 }
+error_specificity { code: MANDATORY_ONEOF_ATTR_MISSING specificity: 26 }
+error_specificity { code: MANDATORY_ANYOF_ATTR_MISSING specificity: 27 }
+error_specificity { code: ATTR_REQUIRED_BUT_MISSING specificity: 28 }
+error_specificity { code: DUPLICATE_UNIQUE_TAG specificity: 29 }
+error_specificity { code: DUPLICATE_UNIQUE_TAG_WARNING specificity: 30 }
+error_specificity { code: STYLESHEET_TOO_LONG specificity: 31 }
+error_specificity { code: STYLESHEET_AND_INLINE_STYLE_TOO_LONG specificity: 32 }
+error_specificity { code: INLINE_STYLE_TOO_LONG specificity: 33 }
+error_specificity { code: CSS_SYNTAX_INVALID_AT_RULE specificity: 34 }
 error_specificity {
-  code: MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE specificity: 33
-}
-error_specificity { code: INVALID_PROPERTY_VALUE_IN_ATTR_VALUE specificity: 34 }
-error_specificity { code: DISALLOWED_PROPERTY_IN_ATTR_VALUE specificity: 35 }
-error_specificity { code: MUTUALLY_EXCLUSIVE_ATTRS specificity: 36 }
-error_specificity { code: UNESCAPED_TEMPLATE_IN_ATTR_VALUE specificity: 37 }
-error_specificity { code: TEMPLATE_PARTIAL_IN_ATTR_VALUE specificity: 38 }
-error_specificity { code: TEMPLATE_IN_ATTR_NAME specificity: 39 }
+  code: MANDATORY_PROPERTY_MISSING_FROM_ATTR_VALUE specificity: 35
+}
+error_specificity { code: INVALID_PROPERTY_VALUE_IN_ATTR_VALUE specificity: 36 }
+error_specificity { code: DISALLOWED_PROPERTY_IN_ATTR_VALUE specificity: 37 }
+error_specificity { code: MUTUALLY_EXCLUSIVE_ATTRS specificity: 38 }
+error_specificity { code: UNESCAPED_TEMPLATE_IN_ATTR_VALUE specificity: 39 }
+error_specificity { code: TEMPLATE_PARTIAL_IN_ATTR_VALUE specificity: 40 }
+error_specificity { code: TEMPLATE_IN_ATTR_NAME specificity: 41 }
 error_specificity {
-  code: INCONSISTENT_UNITS_FOR_WIDTH_AND_HEIGHT specificity: 40
-}
-error_specificity { code: MISSING_LAYOUT_ATTRIBUTES specificity: 41 }
-error_specificity { code: IMPLIED_LAYOUT_INVALID specificity: 42 }
-error_specificity { code: SPECIFIED_LAYOUT_INVALID specificity: 43 }
-error_specificity { code: ATTR_DISALLOWED_BY_IMPLIED_LAYOUT specificity: 44 }
-error_specificity { code: ATTR_DISALLOWED_BY_SPECIFIED_LAYOUT specificity: 45 }
-error_specificity { code: DUPLICATE_DIMENSION specificity: 46 }
-error_specificity { code: DISALLOWED_RELATIVE_URL specificity: 47 }
-error_specificity { code: MISSING_URL specificity: 48 }
-error_specificity { code: DISALLOWED_DOMAIN specificity: 49 }
-error_specificity { code: INVALID_URL_PROTOCOL specificity: 50 }
-error_specificity { code: INVALID_URL specificity: 51 }
-error_specificity { code: DISALLOWED_STYLE_ATTR specificity: 52 }
-error_specificity { code: CSS_SYNTAX_STRAY_TRAILING_BACKSLASH specificity: 53 }
-error_specificity { code: CSS_SYNTAX_UNTERMINATED_COMMENT specificity: 54 }
-error_specificity { code: CSS_SYNTAX_UNTERMINATED_STRING specificity: 55 }
-error_specificity { code: CSS_SYNTAX_BAD_URL specificity: 56 }
+  code: INCONSISTENT_UNITS_FOR_WIDTH_AND_HEIGHT specificity: 42
+}
+error_specificity { code: MISSING_LAYOUT_ATTRIBUTES specificity: 43 }
+error_specificity { code: IMPLIED_LAYOUT_INVALID specificity: 44 }
+error_specificity { code: SPECIFIED_LAYOUT_INVALID specificity: 45 }
+error_specificity { code: ATTR_DISALLOWED_BY_IMPLIED_LAYOUT specificity: 46 }
+error_specificity { code: ATTR_DISALLOWED_BY_SPECIFIED_LAYOUT specificity: 47 }
+error_specificity { code: DUPLICATE_DIMENSION specificity: 48 }
+error_specificity { code: DISALLOWED_RELATIVE_URL specificity: 49 }
+error_specificity { code: MISSING_URL specificity: 50 }
+error_specificity { code: DISALLOWED_DOMAIN specificity: 51 }
+error_specificity { code: INVALID_URL_PROTOCOL specificity: 52 }
+error_specificity { code: INVALID_URL specificity: 53 }
+error_specificity { code: DISALLOWED_STYLE_ATTR specificity: 54 }
+error_specificity { code: CSS_SYNTAX_STRAY_TRAILING_BACKSLASH specificity: 55 }
+error_specificity { code: CSS_SYNTAX_UNTERMINATED_COMMENT specificity: 56 }
+error_specificity { code: CSS_SYNTAX_UNTERMINATED_STRING specificity: 57 }
+error_specificity { code: CSS_SYNTAX_BAD_URL specificity: 58 }
 error_specificity {
-  code: CSS_SYNTAX_EOF_IN_PRELUDE_OF_QUALIFIED_RULE specificity: 57
+  code: CSS_SYNTAX_EOF_IN_PRELUDE_OF_QUALIFIED_RULE specificity: 59
 }
-error_specificity { code: CSS_SYNTAX_INVALID_DECLARATION specificity: 58 }
-error_specificity { code: CSS_SYNTAX_INCOMPLETE_DECLARATION specificity: 59 }
-error_specificity { code: CSS_SYNTAX_ERROR_IN_PSEUDO_SELECTOR specificity: 60 }
-error_specificity { code: CSS_SYNTAX_MISSING_SELECTOR specificity: 61 }
-error_specificity { code: CSS_SYNTAX_NOT_A_SELECTOR_START specificity: 62 }
+error_specificity { code: CSS_SYNTAX_INVALID_DECLARATION specificity: 60 }
+error_specificity { code: CSS_SYNTAX_INCOMPLETE_DECLARATION specificity: 61 }
+error_specificity { code: CSS_SYNTAX_ERROR_IN_PSEUDO_SELECTOR specificity: 62 }
+error_specificity { code: CSS_SYNTAX_MISSING_SELECTOR specificity: 63 }
+error_specificity { code: CSS_SYNTAX_NOT_A_SELECTOR_START specificity: 64 }
 error_specificity {
-  code: CSS_SYNTAX_UNPARSED_INPUT_REMAINS_IN_SELECTOR specificity: 63
-}
-error_specificity { code: CSS_SYNTAX_MISSING_URL specificity: 64 }
-error_specificity { code: CSS_SYNTAX_DISALLOWED_DOMAIN specificity: 65 }
-error_specificity { code: CSS_SYNTAX_INVALID_URL specificity: 66 }
-error_specificity { code: CSS_SYNTAX_INVALID_URL_PROTOCOL specificity: 67 }
-error_specificity { code: CSS_SYNTAX_DISALLOWED_RELATIVE_URL specificity: 68 }
-error_specificity { code: INCORRECT_NUM_CHILD_TAGS specificity: 69 }
-error_specificity { code: DISALLOWED_CHILD_TAG_NAME specificity: 70 }
-error_specificity { code: DISALLOWED_FIRST_CHILD_TAG_NAME specificity: 71 }
-error_specificity { code: CSS_SYNTAX_INVALID_ATTR_SELECTOR specificity: 72 }
+  code: CSS_SYNTAX_UNPARSED_INPUT_REMAINS_IN_SELECTOR specificity: 65
+}
+error_specificity { code: CSS_SYNTAX_MISSING_URL specificity: 66 }
+error_specificity { code: CSS_SYNTAX_DISALLOWED_DOMAIN specificity: 67 }
+error_specificity { code: CSS_SYNTAX_INVALID_URL specificity: 68 }
+error_specificity { code: CSS_SYNTAX_INVALID_URL_PROTOCOL specificity: 69 }
+error_specificity { code: CSS_SYNTAX_DISALLOWED_RELATIVE_URL specificity: 70 }
+error_specificity { code: INCORRECT_NUM_CHILD_TAGS specificity: 71 }
+error_specificity { code: DISALLOWED_CHILD_TAG_NAME specificity: 72 }
+error_specificity { code: DISALLOWED_FIRST_CHILD_TAG_NAME specificity: 73 }
+error_specificity { code: CSS_SYNTAX_INVALID_ATTR_SELECTOR specificity: 74 }
 error_specificity {
-  code: CHILD_TAG_DOES_NOT_SATISFY_REFERENCE_POINT specificity: 73
+  code: CHILD_TAG_DOES_NOT_SATISFY_REFERENCE_POINT specificity: 75
 }
-error_specificity { code: MANDATORY_REFERENCE_POINT_MISSING specificity: 74 }
-error_specificity { code: DUPLICATE_REFERENCE_POINT specificity: 75 }
-error_specificity { code: TAG_REFERENCE_POINT_CONFLICT specificity: 76 }
+error_specificity { code: MANDATORY_REFERENCE_POINT_MISSING specificity: 76 }
+error_specificity { code: DUPLICATE_REFERENCE_POINT specificity: 77 }
+error_specificity { code: TAG_REFERENCE_POINT_CONFLICT specificity: 78 }
 error_specificity {
   code: CHILD_TAG_DOES_NOT_SATISFY_REFERENCE_POINT_SINGULAR
-  specificity: 77
+  specificity: 79
 }
-error_specificity { code: CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE specificity: 78 }
+error_specificity { code: CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE specificity: 80 }
 error_specificity {
   code: CSS_SYNTAX_DISALLOWED_PROPERTY_VALUE_WITH_HINT
-  specificity: 79
+  specificity: 81
 }
 error_specificity {
   code: CSS_SYNTAX_PROPERTY_DISALLOWED_WITHIN_AT_RULE
-  specificity: 80
+  specificity: 82
 }
 error_specificity {
   code: CSS_SYNTAX_PROPERTY_DISALLOWED_TOGETHER_WITH
-  specificity: 81
+  specificity: 83
 }
 error_specificity {
   code: CSS_SYNTAX_PROPERTY_REQUIRES_QUALIFICATION
-  specificity: 82
+  specificity: 84
 }
 error_specificity {
   code: BASE_TAG_MUST_PRECEED_ALL_URLS
-  specificity: 83
-}
-error_specificity { code: DISALLOWED_SCRIPT_TAG specificity: 100 }
-error_specificity { code: GENERAL_DISALLOWED_TAG specificity: 101 }
-error_specificity { code: DEPRECATED_ATTR specificity: 102 }
-error_specificity { code: DEPRECATED_TAG specificity: 103 }
-error_specificity { code: DISALLOWED_MANUFACTURED_BODY specificity: 104 }
-error_specificity { code: DOCUMENT_TOO_COMPLEX specificity: 105 }
-error_specificity { code: INCORRECT_MIN_NUM_CHILD_TAGS specificity: 106 }
-error_specificity { code: TAG_NOT_ALLOWED_TO_HAVE_SIBLINGS specificity: 107 }
-error_specificity { code: MANDATORY_LAST_CHILD_TAG specificity: 108 }
+  specificity: 85
+}
+error_specificity { code: DISALLOWED_SCRIPT_TAG specificity: 102 }
+error_specificity { code: GENERAL_DISALLOWED_TAG specificity: 103 }
+error_specificity { code: DEPRECATED_ATTR specificity: 104 }
+error_specificity { code: DEPRECATED_TAG specificity: 105 }
+error_specificity { code: DISALLOWED_MANUFACTURED_BODY specificity: 106 }
+error_specificity { code: DOCUMENT_TOO_COMPLEX specificity: 107 }
+error_specificity { code: INCORRECT_MIN_NUM_CHILD_TAGS specificity: 108 }
+error_specificity { code: TAG_NOT_ALLOWED_TO_HAVE_SIBLINGS specificity: 109 }
+error_specificity { code: MANDATORY_LAST_CHILD_TAG specificity: 110 }
 error_specificity {
   code: CSS_SYNTAX_INVALID_PROPERTY
-  specificity: 109
+  specificity: 111
 }
 error_specificity {
   code: CSS_SYNTAX_INVALID_PROPERTY_NOLIST
-  specificity: 110
+  specificity: 112
 }
 error_specificity {
   code: CSS_SYNTAX_QUALIFIED_RULE_HAS_NO_DECLARATIONS
-  specificity: 111
+  specificity: 113
 }
 error_specificity {
   code: CSS_SYNTAX_DISALLOWED_QUALIFIED_RULE_MUST_BE_INSIDE_KEYFRAME
-  specificity: 112
+  specificity: 114
 }
 error_specificity {
   code: CSS_SYNTAX_DISALLOWED_KEYFRAME_INSIDE_KEYFRAME
-  specificity: 113
+  specificity: 115
 }
 error_specificity {
   code: CSS_SYNTAX_MALFORMED_MEDIA_QUERY
-  specificity: 115
+  specificity: 117
 }
 error_specificity {
   code: CSS_SYNTAX_DISALLOWED_MEDIA_TYPE
-  specificity: 116
+  specificity: 118
 }
 error_specificity {
   code: CSS_SYNTAX_DISALLOWED_MEDIA_FEATURE
-  specificity: 117
+  specificity: 119
 }
 error_specificity {
   code: INVALID_UTF8
-  specificity: 118
+  specificity: 120
 }
 error_specificity {
   code: CSS_EXCESSIVELY_NESTED
-  specificity: 119
+  specificity: 121
 }
 error_specificity {
   code: DOCUMENT_SIZE_LIMIT_EXCEEDED
-  specificity: 120
+  specificity: 122
 }
 error_specificity {
   code: VALUE_SET_MISMATCH
-  specificity: 121
+  specificity: 123
+}
+error_specificity {
+  code: INVALID_DOCTYPE_HTML
+  specificity: 124
 }
 error_specificity {
   code: DEV_MODE_ONLY
@@ -6943,6 +7039,11 @@ error_formats {
   code: UNKNOWN_CODE
   format: "Unknown error."
 }
+error_formats {
+  code: INVALID_DOCTYPE_HTML
+  format: "Invalid or missing doctype declaration. Should be <!doctype html>. "
+          "See https://amp.dev/documentation/guides-and-tutorials/start/create/basic_markup/"
+}
 error_formats {
   code: MANDATORY_TAG_MISSING
   format: "The mandatory tag '%1' is missing or incorrect."
@@ -6977,6 +7078,17 @@ error_formats {
           "extension. This may become an error in the future."
 }
 
+error_formats {
+  code: NON_LTS_SCRIPT_AFTER_LTS
+  format: "'%1' must use the LTS version to correspond with the first script "
+          "in the page, which uses LTS."
+}
+error_formats {
+  code: LTS_SCRIPT_AFTER_NON_LTS
+  format: "'%1' must use the non-LTS version to correspond with the first "
+          "script in the page, which does not use LTS."
+}
+
 error_formats {
   code: ATTR_REQUIRED_BUT_MISSING
   format: "The attribute '%1' in tag '%2' is missing or incorrect, but "
diff --git a/validator/validator.pb.go b/validator/validator.pb.go
index 5f5b13877b056..ca7138a6daee7 100644
--- a/validator/validator.pb.go
+++ b/validator/validator.pb.go
@@ -571,11 +571,12 @@ func (ValidationError_Severity) EnumDescriptor() ([]byte, []int) {
 	return fileDescriptor_bf1c6ec7c0d80dd5, []int{23, 0}
 }
 
-// NEXT AVAILABLE TAG: 111
+// NEXT AVAILABLE TAG: 114
 type ValidationError_Code int32
 
 const (
 	ValidationError_UNKNOWN_CODE                                                 ValidationError_Code = 0
+	ValidationError_INVALID_DOCTYPE_HTML                                         ValidationError_Code = 111
 	ValidationError_MANDATORY_TAG_MISSING                                        ValidationError_Code = 1
 	ValidationError_TAG_REQUIRED_BY_MISSING                                      ValidationError_Code = 24
 	ValidationError_WARNING_TAG_REQUIRED_BY_MISSING                              ValidationError_Code = 76
@@ -583,6 +584,8 @@ const (
 	ValidationError_WARNING_EXTENSION_UNUSED                                     ValidationError_Code = 79
 	ValidationError_EXTENSION_UNUSED                                             ValidationError_Code = 84
 	ValidationError_WARNING_EXTENSION_DEPRECATED_VERSION                         ValidationError_Code = 80
+	ValidationError_NON_LTS_SCRIPT_AFTER_LTS                                     ValidationError_Code = 112
+	ValidationError_LTS_SCRIPT_AFTER_NON_LTS                                     ValidationError_Code = 113
 	ValidationError_ATTR_REQUIRED_BUT_MISSING                                    ValidationError_Code = 61
 	ValidationError_DISALLOWED_TAG                                               ValidationError_Code = 2
 	ValidationError_GENERAL_DISALLOWED_TAG                                       ValidationError_Code = 51
@@ -686,6 +689,7 @@ const (
 
 var ValidationError_Code_name = map[int32]string{
 	0:   "UNKNOWN_CODE",
+	111: "INVALID_DOCTYPE_HTML",
 	1:   "MANDATORY_TAG_MISSING",
 	24:  "TAG_REQUIRED_BY_MISSING",
 	76:  "WARNING_TAG_REQUIRED_BY_MISSING",
@@ -693,6 +697,8 @@ var ValidationError_Code_name = map[int32]string{
 	79:  "WARNING_EXTENSION_UNUSED",
 	84:  "EXTENSION_UNUSED",
 	80:  "WARNING_EXTENSION_DEPRECATED_VERSION",
+	112: "NON_LTS_SCRIPT_AFTER_LTS",
+	113: "LTS_SCRIPT_AFTER_NON_LTS",
 	61:  "ATTR_REQUIRED_BUT_MISSING",
 	2:   "DISALLOWED_TAG",
 	51:  "GENERAL_DISALLOWED_TAG",
@@ -795,6 +801,7 @@ var ValidationError_Code_name = map[int32]string{
 
 var ValidationError_Code_value = map[string]int32{
 	"UNKNOWN_CODE":                                                 0,
+	"INVALID_DOCTYPE_HTML":                                         111,
 	"MANDATORY_TAG_MISSING":                                        1,
 	"TAG_REQUIRED_BY_MISSING":                                      24,
 	"WARNING_TAG_REQUIRED_BY_MISSING":                              76,
@@ -802,6 +809,8 @@ var ValidationError_Code_value = map[string]int32{
 	"WARNING_EXTENSION_UNUSED":                                     79,
 	"EXTENSION_UNUSED":                                             84,
 	"WARNING_EXTENSION_DEPRECATED_VERSION":                         80,
+	"NON_LTS_SCRIPT_AFTER_LTS":                                     112,
+	"LTS_SCRIPT_AFTER_NON_LTS":                                     113,
 	"ATTR_REQUIRED_BUT_MISSING":                                    61,
 	"DISALLOWED_TAG":                                               2,
 	"GENERAL_DISALLOWED_TAG":                                       51,
@@ -3572,310 +3581,312 @@ func init() {
 func init() { proto.RegisterFile("validator.proto", fileDescriptor_bf1c6ec7c0d80dd5) }
 
 var fileDescriptor_bf1c6ec7c0d80dd5 = []byte{
-	// 4850 bytes of a gzipped FileDescriptorProto
-	0x1f, 0x8b, 0x08, 0x00, 0x00, 0x00, 0x00, 0x00, 0x02, 0xff, 0x9c, 0x7a, 0xe9, 0x76, 0x1b, 0xc7,
-	0x95, 0xb0, 0xc0, 0x15, 0xb8, 0xdc, 0x8a, 0x45, 0x8a, 0x82, 0x36, 0x8b, 0x6a, 0xc9, 0x96, 0x62,
-	0xc7, 0xb4, 0xad, 0x38, 0xb6, 0xa3, 0x38, 0x4e, 0x9a, 0x40, 0x81, 0x6c, 0xab, 0xd1, 0x0d, 0x57,
-	0x37, 0x28, 0x31, 0x5f, 0x92, 0xfa, 0x5a, 0x40, 0x93, 0xea, 0x08, 0x5b, 0xba, 0x1b, 0xb2, 0x39,
-	0x7f, 0xe7, 0x05, 0x32, 0x27, 0x67, 0xce, 0x3c, 0xc1, 0x9c, 0xf9, 0x35, 0x6f, 0x30, 0x8f, 0x30,
-	0xf3, 0x00, 0xf3, 0x2e, 0xf3, 0x63, 0xce, 0xad, 0xea, 0x0d, 0x4d, 0x50, 0xd2, 0xe4, 0x17, 0x59,
-	0x77, 0xab, 0x5b, 0xb7, 0xee, 0x56, 0xb7, 0x01, 0x5b, 0x6f, 0xbc, 0x41, 0xd0, 0xf7, 0xe2, 0x71,
-	0x78, 0x30, 0x09, 0xc7, 0xf1, 0x98, 0x6e, 0x78, 0xc3, 0xc9, 0x41, 0x06, 0xd4, 0x7c, 0xd8, 0xd2,
-	0xe3, 0x38, 0x74, 0xc3, 0xe0, 0xfc, 0xdc, 0x0f, 0x9d, 0x89, 0xdf, 0xa3, 0x0f, 0x61, 0x33, 0x38,
-	0x13, 0x6f, 0xbc, 0xc1, 0xd4, 0x17, 0xa1, 0x7f, 0xee, 0xff, 0x54, 0xaf, 0xec, 0x57, 0x1e, 0xd7,
-	0xf8, 0x7a, 0x70, 0x76, 0x82, 0x40, 0x8e, 0x30, 0xfa, 0x73, 0xa0, 0xde, 0x20, 0x1a, 0x8b, 0xd0,
-	0xff, 0xcb, 0x34, 0x08, 0xfd, 0x48, 0x78, 0x71, 0x1c, 0xd6, 0x17, 0xf6, 0x17, 0x1f, 0xd7, 0x38,
-	0x41, 0x0c, 0x4f, 0x10, 0x28, 0x5e, 0xbb, 0x80, 0xf5, 0x4e, 0x38, 0x9e, 0xf8, 0x61, 0x7c, 0x21,
-	0xf7, 0xa0, 0xb0, 0x34, 0xf2, 0x86, 0x7e, 0x22, 0x59, 0xfe, 0x4f, 0xef, 0x40, 0x6d, 0xe8, 0x8d,
-	0xa4, 0x5a, 0x17, 0xf5, 0x85, 0xfd, 0xca, 0xe3, 0x2a, 0xcf, 0x01, 0x74, 0x17, 0x96, 0xa5, 0x4a,
-	0xf5, 0x45, 0xc9, 0xa2, 0x16, 0xf4, 0x3e, 0xac, 0x2b, 0x45, 0xfb, 0xe3, 0xe9, 0xcb, 0x81, 0x5f,
-	0x5f, 0xda, 0xaf, 0x3c, 0xae, 0xf0, 0x35, 0x09, 0x6b, 0x4a, 0x90, 0x66, 0x03, 0x29, 0x6e, 0x6d,
-	0x06, 0x51, 0x4c, 0x7f, 0x0d, 0x30, 0x51, 0xb0, 0xc0, 0x8f, 0xea, 0x95, 0xfd, 0xc5, 0xc7, 0x6b,
-	0x4f, 0x6e, 0x1f, 0xcc, 0x58, 0xe6, 0xa0, 0xc8, 0xc4, 0x0b, 0xe4, 0xda, 0x3f, 0xc0, 0x6a, 0x37,
-	0x1c, 0xc8, 0x63, 0xdc, 0x82, 0xaa, 0xb4, 0x6a, 0x6f, 0x3c, 0x90, 0x52, 0x6a, 0x3c, 0x5b, 0xd3,
-	0x4f, 0x60, 0xd3, 0x1b, 0x0c, 0xc6, 0x3f, 0x8a, 0xd0, 0x1f, 0x78, 0x71, 0xf0, 0xc6, 0x57, 0x67,
-	0x7a, 0xba, 0x14, 0x87, 0x53, 0x9f, 0x6f, 0x48, 0x1c, 0x4f, 0x50, 0xf4, 0x23, 0x58, 0x53, 0xc4,
-	0xfe, 0x70, 0x12, 0x5f, 0xc8, 0x33, 0x56, 0x9f, 0x2e, 0x9f, 0x79, 0x83, 0xc8, 0xe7, 0x20, 0x31,
-	0x0c, 0x11, 0x1a, 0x83, 0xcd, 0x46, 0x14, 0x35, 0xfd, 0xde, 0xc0, 0x0b, 0xbd, 0x38, 0x18, 0x8f,
-	0xe6, 0x5a, 0xf2, 0x1e, 0x28, 0x0b, 0x88, 0x9e, 0x17, 0xf9, 0x41, 0x72, 0x29, 0x20, 0x41, 0x0d,
-	0x84, 0x68, 0xff, 0x05, 0x50, 0xc5, 0x7b, 0x91, 0x87, 0xb8, 0x0b, 0xe0, 0x8f, 0xbc, 0x97, 0x03,
-	0xbf, 0x2f, 0x5e, 0x5e, 0xd4, 0x6f, 0x48, 0xe2, 0x5a, 0x02, 0x39, 0xbc, 0x40, 0x61, 0xfd, 0x20,
-	0xca, 0xf0, 0x75, 0x25, 0x2c, 0x05, 0x1d, 0x5e, 0xcc, 0xd5, 0xe0, 0x13, 0xd8, 0xf6, 0x06, 0xb1,
-	0x1f, 0x8e, 0xe4, 0xf1, 0x04, 0xc2, 0xa2, 0xdc, 0x39, 0x32, 0x84, 0x85, 0xf0, 0xd9, 0x8b, 0x5f,
-	0x2c, 0x5f, 0xfc, 0x23, 0xd8, 0xca, 0x16, 0x62, 0x3c, 0xf2, 0xc7, 0x67, 0xf5, 0x75, 0xb9, 0xd3,
-	0x66, 0x06, 0xb6, 0x11, 0x3a, 0x4b, 0xe8, 0x8d, 0x2e, 0xc6, 0x67, 0xf5, 0xeb, 0x25, 0x42, 0x1d,
-	0xa1, 0xb9, 0x2b, 0x2d, 0x49, 0x85, 0x12, 0x57, 0x2a, 0x19, 0x8d, 0x96, 0x8d, 0x96, 0x13, 0xa8,
-	0xa0, 0xd8, 0x92, 0xb2, 0x15, 0x81, 0x0a, 0x89, 0x8f, 0x61, 0xbb, 0x40, 0x90, 0xc8, 0x59, 0x96,
-	0x64, 0x5b, 0x39, 0x99, 0x12, 0xf6, 0x0b, 0xa8, 0x29, 0xda, 0x69, 0x38, 0xa8, 0x6f, 0xee, 0x57,
-	0x1e, 0xaf, 0x3d, 0xd9, 0x2b, 0x39, 0x60, 0xe2, 0x64, 0xbc, 0x2a, 0x09, 0xbb, 0xe1, 0x80, 0x7e,
-	0x0f, 0x44, 0x31, 0x15, 0x9c, 0x77, 0x4d, 0xf2, 0xde, 0x7b, 0x8b, 0xf3, 0xa2, 0xc7, 0x27, 0x0a,
-	0x74, 0x32, 0x3e, 0x6a, 0x00, 0xf1, 0xfa, 0xfd, 0x24, 0xcc, 0xe3, 0xb1, 0x88, 0xfc, 0xb8, 0x7e,
-	0x73, 0xbf, 0xf2, 0x78, 0xf3, 0xc9, 0x7e, 0x49, 0x56, 0xea, 0x28, 0x07, 0x32, 0xfa, 0x1d, 0x3f,
-	0xe6, 0x1b, 0x5e, 0xbf, 0x2f, 0x17, 0xee, 0xd8, 0xf1, 0x63, 0x7a, 0x0c, 0x4a, 0xba, 0xba, 0x1d,
-	0x29, 0xe9, 0xd6, 0xfb, 0x4a, 0x92, 0x8c, 0xf2, 0xfe, 0x50, 0xd2, 0x37, 0xb0, 0x1a, 0xab, 0x4c,
-	0x54, 0x27, 0xf2, 0x5c, 0x1f, 0xcc, 0x91, 0x50, 0xc8, 0x55, 0x3c, 0x25, 0xa7, 0x5f, 0xc1, 0x8d,
-	0x97, 0x03, 0xaf, 0xf7, 0x7a, 0x10, 0x44, 0xb1, 0xdf, 0x9f, 0xc9, 0x5e, 0x2b, 0xf2, 0x06, 0xae,
-	0x17, 0xd0, 0x85, 0x34, 0xb6, 0x0f, 0x6b, 0x7d, 0x7f, 0x12, 0xfa, 0x3d, 0x19, 0x4d, 0xf5, 0x55,
-	0x49, 0x5b, 0x04, 0xa1, 0x5b, 0x15, 0x96, 0xf2, 0xbe, 0xaa, 0xca, 0xad, 0x0a, 0x60, 0xbc, 0x9d,
-	0x16, 0x6c, 0xf5, 0xa2, 0x48, 0xf4, 0xf3, 0xe0, 0xac, 0xef, 0xca, 0xcc, 0x72, 0xb7, 0x74, 0x88,
-	0xd9, 0x08, 0xe6, 0x9b, 0xbd, 0xd9, 0x88, 0x3e, 0x85, 0xf5, 0x7e, 0x10, 0x4d, 0xbc, 0xb8, 0xf7,
-	0x4a, 0xbc, 0xf6, 0x2f, 0xea, 0x1b, 0xd2, 0x96, 0x8f, 0xae, 0xb2, 0x65, 0x33, 0xa1, 0x7d, 0xe6,
-	0x5f, 0xb8, 0x17, 0x13, 0xff, 0xe9, 0x86, 0x65, 0x5b, 0x4c, 0x34, 0x0d, 0xa7, 0xa3, 0xbb, 0x8d,
-	0x63, 0xbe, 0xd6, 0xcf, 0xf1, 0xf4, 0x3e, 0x54, 0x83, 0xe1, 0x64, 0x10, 0xf4, 0x82, 0xb8, 0xbe,
-	0x5d, 0xcc, 0x31, 0x19, 0x98, 0x7e, 0x0a, 0x34, 0x4b, 0xe9, 0xfe, 0x4f, 0xb1, 0x3f, 0x8a, 0xf0,
-	0x20, 0x3b, 0x32, 0x1a, 0xb6, 0x53, 0x0c, 0x4b, 0x11, 0xf4, 0x7b, 0xd8, 0xce, 0x2b, 0xc0, 0xa8,
-	0xe7, 0x47, 0xf1, 0x38, 0xac, 0xef, 0xc9, 0xbb, 0x2b, 0x1f, 0x5b, 0x4f, 0xd0, 0x6d, 0x2f, 0x7c,
-	0xed, 0x87, 0x9c, 0xa4, 0x7c, 0x29, 0x5c, 0x6b, 0x41, 0x35, 0x75, 0x0c, 0xba, 0x0b, 0xa4, 0x6b,
-	0x3d, 0xb3, 0xec, 0xe7, 0x96, 0x38, 0xd1, 0xcd, 0x2e, 0x73, 0x98, 0x4b, 0xae, 0x51, 0x02, 0xeb,
-	0x2e, 0x6b, 0x77, 0x4c, 0xdd, 0x65, 0xc2, 0x68, 0x3a, 0xa4, 0x42, 0x29, 0x6c, 0xea, 0xed, 0x8e,
-	0x70, 0x1a, 0xdc, 0xe8, 0xb8, 0x12, 0xb6, 0xa0, 0x4d, 0x60, 0xab, 0x64, 0x14, 0xba, 0x0d, 0xb3,
-	0x66, 0x21, 0xd7, 0x24, 0x48, 0x6f, 0x17, 0x40, 0x15, 0x7a, 0x03, 0x76, 0x24, 0x48, 0xee, 0x98,
-	0x23, 0x16, 0xe8, 0x07, 0x70, 0xab, 0x80, 0xe8, 0xe8, 0x9c, 0x59, 0x6e, 0x8e, 0x5f, 0xd4, 0xda,
-	0x2a, 0x9d, 0xca, 0xda, 0x32, 0x2f, 0x1d, 0x7e, 0x0a, 0xcb, 0x58, 0x1e, 0x55, 0x0a, 0x5c, 0x7b,
-	0x72, 0xe3, 0x8a, 0xbb, 0xe4, 0x8a, 0x4a, 0xfb, 0x15, 0x6c, 0x37, 0xfd, 0xa8, 0xe7, 0x8f, 0xfa,
-	0xde, 0x28, 0x76, 0xbd, 0xf3, 0x2b, 0xe5, 0x12, 0x58, 0x8c, 0xbd, 0xf3, 0x24, 0xb1, 0xe2, 0xbf,
-	0x1a, 0x87, 0xeb, 0x87, 0xe8, 0xe8, 0xa6, 0x74, 0xf4, 0x46, 0xd3, 0x8b, 0x3d, 0xe5, 0xe8, 0xbb,
-	0xb0, 0x5c, 0x2c, 0xe6, 0x6a, 0x41, 0x1f, 0xc0, 0x86, 0x1f, 0x86, 0xe3, 0x50, 0x0c, 0xfd, 0x28,
-	0xf2, 0xce, 0x55, 0x8d, 0xaa, 0xf1, 0x75, 0x09, 0x6c, 0x2b, 0x98, 0x36, 0x84, 0xcd, 0xb6, 0xdf,
-	0x0f, 0xbc, 0x1f, 0xa6, 0x7e, 0xa8, 0xca, 0xf7, 0xa7, 0xb0, 0x15, 0x44, 0xd1, 0x14, 0xef, 0x3c,
-	0x12, 0x92, 0x56, 0x8a, 0xcd, 0xdc, 0x69, 0x43, 0x61, 0xf5, 0x88, 0x21, 0x0e, 0x55, 0x8f, 0x2f,
-	0x26, 0x7e, 0xa2, 0xa7, 0xfc, 0x9f, 0xd6, 0x61, 0xf5, 0xcc, 0xf7, 0xe2, 0x69, 0x88, 0x15, 0x1d,
-	0xc1, 0xe9, 0x52, 0xfb, 0x97, 0x05, 0x00, 0x3d, 0xe6, 0xd3, 0x81, 0x7f, 0x65, 0xab, 0x70, 0x94,
-	0x09, 0xc4, 0xd0, 0x78, 0x70, 0xc9, 0x9c, 0x29, 0xf3, 0xc1, 0xe1, 0x60, 0xdc, 0x7b, 0x2d, 0xc3,
-	0x62, 0xb3, 0xa3, 0x73, 0x87, 0x09, 0xdd, 0x11, 0x8c, 0x73, 0x9b, 0x27, 0x5a, 0x1c, 0x01, 0x19,
-	0xe2, 0xd1, 0xc4, 0x5f, 0xf0, 0x6c, 0x22, 0x9a, 0xf8, 0x3d, 0x59, 0x81, 0x2e, 0x7b, 0xef, 0xac,
-	0x05, 0xf8, 0xe6, 0x70, 0x66, 0xad, 0xf5, 0xa0, 0x96, 0xed, 0x85, 0x4e, 0x39, 0xbb, 0x1b, 0xb9,
-	0x46, 0x77, 0x60, 0x2b, 0x83, 0x19, 0x47, 0x96, 0xcd, 0x99, 0xf2, 0xde, 0x0c, 0xc8, 0xbb, 0x26,
-	0x73, 0xc8, 0x02, 0xbd, 0x09, 0xd7, 0x33, 0x58, 0x93, 0x35, 0x4c, 0x9d, 0xeb, 0xae, 0x61, 0x5b,
-	0x0e, 0x59, 0xd4, 0xfe, 0x63, 0x01, 0x56, 0x1b, 0x51, 0x24, 0xcd, 0xf2, 0x6b, 0x58, 0xf7, 0x62,
-	0x11, 0x4e, 0x07, 0xbe, 0xd2, 0x5a, 0x35, 0x31, 0x37, 0xaf, 0x34, 0x05, 0x07, 0x2f, 0xb7, 0xe9,
-	0xb7, 0xb0, 0x19, 0x0c, 0xbd, 0x73, 0x59, 0x7d, 0x8a, 0x87, 0xbe, 0xaa, 0x04, 0xad, 0x4b, 0xea,
-	0xb4, 0xeb, 0x79, 0x0a, 0x1b, 0x67, 0xe3, 0x51, 0x9c, 0x33, 0x2f, 0xbd, 0x95, 0x79, 0x0d, 0x89,
-	0x53, 0xde, 0x9f, 0xc9, 0x12, 0x86, 0x14, 0xbe, 0xf0, 0x86, 0x93, 0x2f, 0xbd, 0x7e, 0x24, 0x4b,
-	0x64, 0x95, 0xa7, 0x9d, 0xaa, 0xaf, 0x2b, 0x30, 0x66, 0xa2, 0x8c, 0xf4, 0xb5, 0x7f, 0x71, 0x16,
-	0xca, 0x26, 0x62, 0x45, 0x12, 0x6f, 0xa7, 0x98, 0x67, 0x29, 0x42, 0x65, 0xf2, 0x3c, 0xf5, 0xae,
-	0x4a, 0xa7, 0x2a, 0x82, 0xb4, 0x7f, 0x5a, 0x84, 0x5a, 0xa3, 0xef, 0xc5, 0x9e, 0xd4, 0xe4, 0x1e,
-	0x76, 0x1d, 0x3f, 0x89, 0x97, 0x17, 0xb1, 0x6c, 0x01, 0x2b, 0x8f, 0x97, 0x9f, 0x2e, 0x7c, 0xfa,
-	0x84, 0x57, 0x87, 0xde, 0x4f, 0x87, 0x08, 0xa3, 0x4f, 0x80, 0xe2, 0x09, 0x25, 0x81, 0x08, 0x46,
-	0xbd, 0xc1, 0xb4, 0xef, 0xf7, 0xeb, 0xb5, 0x42, 0x13, 0x47, 0xa6, 0xe1, 0x40, 0xd2, 0x1a, 0x09,
-	0x96, 0x7e, 0x02, 0x34, 0x13, 0x2a, 0x6d, 0x23, 0xeb, 0x85, 0x0a, 0xaa, 0xad, 0x54, 0x32, 0x6e,
-	0x8f, 0x05, 0x63, 0xa6, 0x61, 0xe9, 0xa1, 0x62, 0x49, 0x73, 0x9b, 0x37, 0x2c, 0x52, 0x5d, 0xec,
-	0x3c, 0x24, 0x7a, 0xa6, 0xa0, 0x81, 0x04, 0xa9, 0xe0, 0xfe, 0x02, 0xaa, 0x58, 0x7a, 0xe4, 0x65,
-	0xac, 0xce, 0xbd, 0x8c, 0xc4, 0x6d, 0xf8, 0x6a, 0x2f, 0xf1, 0x9f, 0x47, 0xb0, 0xf5, 0xe3, 0xab,
-	0x20, 0xf6, 0xa3, 0x89, 0xd7, 0xc3, 0xca, 0x3d, 0xb8, 0x90, 0x65, 0xad, 0xca, 0x37, 0x73, 0xb0,
-	0x3d, 0x1a, 0x5c, 0xd0, 0x3f, 0xcc, 0x56, 0xd6, 0xa2, 0x22, 0x4b, 0xd2, 0xe7, 0x1e, 0x96, 0xb6,
-	0x9a, 0x9b, 0x7f, 0x66, 0xea, 0x6f, 0x23, 0xd3, 0x5c, 0xfb, 0xef, 0x05, 0xa8, 0xe9, 0xc3, 0x89,
-	0xe9, 0x5d, 0x8c, 0xa7, 0x31, 0x35, 0x61, 0x3b, 0x9a, 0x4e, 0x26, 0xe3, 0x10, 0x77, 0x1a, 0x48,
-	0x98, 0x6a, 0xcf, 0x37, 0x2f, 0x75, 0x38, 0x19, 0xd3, 0x81, 0xfa, 0xc3, 0x49, 0xc6, 0xa9, 0x00,
-	0x78, 0x81, 0xd7, 0xfb, 0xfe, 0x59, 0x30, 0xf2, 0xb1, 0x28, 0x9f, 0x79, 0xd3, 0x41, 0x2c, 0x7e,
-	0x0c, 0xfa, 0xf1, 0xab, 0xe4, 0x71, 0xb1, 0x93, 0x20, 0x9b, 0x0a, 0xf7, 0x1c, 0x51, 0xf4, 0x4b,
-	0xd8, 0x2b, 0xf3, 0xbc, 0xf2, 0x83, 0xf3, 0x57, 0x71, 0xd2, 0x98, 0xee, 0xce, 0x32, 0x1d, 0x4b,
-	0x9c, 0xf6, 0xb7, 0x0a, 0xac, 0x24, 0x47, 0x58, 0x83, 0xd5, 0xa4, 0x70, 0x91, 0x6b, 0x74, 0x03,
-	0x6a, 0x96, 0x8d, 0x75, 0xc2, 0xd4, 0x4f, 0x49, 0x85, 0xd6, 0x60, 0xb9, 0x65, 0xbc, 0x60, 0x4d,
-	0xb2, 0x80, 0x95, 0x4c, 0xfe, 0x2b, 0x8e, 0x99, 0x71, 0x74, 0xec, 0x92, 0x45, 0xba, 0x09, 0xc0,
-	0x99, 0xd3, 0xb1, 0x2d, 0xc7, 0x38, 0x61, 0x64, 0x09, 0x79, 0x1b, 0xb6, 0xe5, 0xea, 0x86, 0xc5,
-	0x38, 0x59, 0xa6, 0x55, 0x58, 0x6a, 0x19, 0xa6, 0x49, 0x56, 0x10, 0xd1, 0x32, 0xd9, 0x0b, 0x61,
-	0xb8, 0xac, 0x4d, 0x56, 0xa5, 0x50, 0xb3, 0x6b, 0x34, 0x49, 0x15, 0x31, 0x86, 0xe5, 0x72, 0xc3,
-	0x72, 0x8c, 0x06, 0xa9, 0x69, 0x53, 0xd8, 0x9c, 0xad, 0xb9, 0xf4, 0x5b, 0x58, 0x19, 0xca, 0xff,
-	0x12, 0xa3, 0x3e, 0x7c, 0x6b, 0x89, 0x3e, 0x48, 0x2a, 0x75, 0xc2, 0xa3, 0x7d, 0x08, 0x2b, 0x89,
-	0x9c, 0x99, 0x43, 0x6e, 0x02, 0xe8, 0x5d, 0xd7, 0x76, 0x1a, 0xdc, 0x36, 0x4d, 0x52, 0xd1, 0xfe,
-	0xa7, 0x02, 0xeb, 0x8d, 0x57, 0xc1, 0xa0, 0xef, 0x7a, 0xe7, 0x49, 0xaa, 0xaa, 0xe7, 0x7e, 0x3e,
-	0x9a, 0x0e, 0x45, 0x0f, 0xb1, 0x22, 0xf6, 0xce, 0xf3, 0xc0, 0xfb, 0x82, 0x5f, 0xcf, 0x68, 0xac,
-	0xe9, 0x30, 0xe5, 0x8f, 0xe8, 0x53, 0xb8, 0x75, 0x16, 0x84, 0x51, 0x9c, 0x33, 0xc9, 0xd7, 0x44,
-	0xf2, 0x12, 0x50, 0x15, 0x65, 0x4f, 0x52, 0xa4, 0x3c, 0xf8, 0xa8, 0x50, 0x2f, 0x82, 0xcf, 0x60,
-	0x77, 0x2e, 0x97, 0x2a, 0x38, 0xdb, 0xbd, 0x4b, 0x0c, 0x87, 0x70, 0x27, 0xd7, 0x74, 0x18, 0x8c,
-	0xca, 0xda, 0x2e, 0x65, 0xda, 0xe6, 0x27, 0x6a, 0x07, 0xa3, 0xa2, 0xc2, 0xda, 0x9f, 0x61, 0x93,
-	0xfb, 0x67, 0x7e, 0xe8, 0x8f, 0x7a, 0x7e, 0x67, 0x1c, 0x8c, 0x62, 0xaa, 0xc1, 0x06, 0x2a, 0x20,
-	0xd3, 0x41, 0xa1, 0x94, 0xad, 0xc5, 0xca, 0x3e, 0xd6, 0xbb, 0x1f, 0xbf, 0x7b, 0xb0, 0x32, 0x1d,
-	0x05, 0x7f, 0x49, 0x5e, 0xbf, 0x55, 0x9e, 0xac, 0xb4, 0x7f, 0x5e, 0x82, 0x8d, 0xac, 0x17, 0xbb,
-	0xb2, 0x5a, 0xd6, 0x61, 0xf5, 0x8d, 0x1f, 0xca, 0x3e, 0x4e, 0xd9, 0x2b, 0x5d, 0x62, 0x8a, 0x4d,
-	0x9b, 0x58, 0x6c, 0x9a, 0x13, 0xa2, 0xc4, 0x3c, 0x39, 0xe6, 0x24, 0x21, 0xf7, 0x60, 0x33, 0x6b,
-	0x09, 0x85, 0x2c, 0xc0, 0x55, 0x59, 0x80, 0x3f, 0x2e, 0xb9, 0xd1, 0x8c, 0x4a, 0xf9, 0x4a, 0xd5,
-	0xe1, 0x46, 0xd7, 0x71, 0xed, 0xb6, 0x60, 0x26, 0x6b, 0x33, 0xcb, 0xe5, 0x1b, 0x7e, 0x11, 0x4d,
-	0x19, 0xdc, 0x2e, 0x68, 0xa4, 0xde, 0xc4, 0xfd, 0x29, 0xf6, 0xa6, 0x5e, 0x9c, 0x66, 0xff, 0xb4,
-	0xcb, 0xb8, 0x99, 0x53, 0xea, 0x48, 0xd8, 0xcc, 0xe8, 0x68, 0x1f, 0x36, 0xb3, 0xb6, 0x74, 0x2a,
-	0x1b, 0x9b, 0x55, 0xa9, 0xe9, 0x57, 0xef, 0xa7, 0x69, 0x17, 0x59, 0x92, 0x01, 0xc6, 0xd0, 0x1f,
-	0xc5, 0x4f, 0x97, 0x55, 0xd3, 0xb0, 0x91, 0x0a, 0x95, 0x04, 0xda, 0xf3, 0x82, 0xf5, 0xa5, 0xf6,
-	0x33, 0x71, 0x41, 0xa1, 0x74, 0x56, 0x52, 0xc1, 0x2e, 0x20, 0x81, 0xa5, 0x7d, 0xac, 0xca, 0x05,
-	0xc7, 0xb6, 0xe3, 0x0a, 0x87, 0xf1, 0x13, 0xa3, 0xc1, 0xc8, 0xa2, 0xf6, 0x1d, 0xdc, 0xbc, 0x52,
-	0x17, 0x0c, 0x78, 0xd5, 0x54, 0x54, 0xe8, 0x3a, 0x54, 0xd9, 0x0b, 0xd6, 0xee, 0xb8, 0x32, 0xa7,
-	0x54, 0x61, 0x09, 0x9b, 0x5c, 0xb2, 0xa8, 0xfd, 0x19, 0xe0, 0x38, 0x1e, 0x0e, 0x5a, 0xe3, 0x70,
-	0xe8, 0xc5, 0xda, 0x1f, 0x60, 0xa9, 0x31, 0xee, 0x63, 0xb7, 0xb8, 0x9e, 0xf6, 0xd4, 0x0d, 0xbb,
-	0xc9, 0xc8, 0x35, 0xba, 0x0a, 0x8b, 0x7a, 0xbb, 0x43, 0x2a, 0xa8, 0xb8, 0xde, 0xee, 0x7c, 0xa9,
-	0x63, 0xff, 0x8c, 0x69, 0x04, 0x17, 0xac, 0xad, 0x1b, 0x26, 0x59, 0x94, 0xb8, 0x86, 0x6a, 0x41,
-	0x96, 0x51, 0x06, 0x7b, 0xd1, 0x61, 0xdc, 0xc0, 0x03, 0xe9, 0x26, 0x59, 0xd2, 0xfe, 0xba, 0x01,
-	0xab, 0x69, 0xa4, 0xff, 0x16, 0xd6, 0x5e, 0xc5, 0xc3, 0x81, 0x38, 0x93, 0x1b, 0xd7, 0xaf, 0xcb,
-	0x24, 0x53, 0x7e, 0xc3, 0xe5, 0x9a, 0x1d, 0xa0, 0x5a, 0x1c, 0x5e, 0x65, 0x80, 0xd2, 0x2c, 0xe2,
-	0xc1, 0x3b, 0x66, 0x11, 0x0f, 0x2f, 0xcd, 0x22, 0x6e, 0x42, 0x35, 0x8d, 0xf5, 0x24, 0x04, 0x56,
-	0x63, 0x15, 0xe0, 0xf4, 0x36, 0xd4, 0xf2, 0x08, 0x54, 0x15, 0xb9, 0x1a, 0xa5, 0xe1, 0x77, 0x08,
-	0x55, 0x84, 0xf7, 0x45, 0xd0, 0xaf, 0xdf, 0x97, 0x9e, 0x52, 0xd6, 0x3a, 0x39, 0xe2, 0x01, 0x92,
-	0xf7, 0x8d, 0xfe, 0xd3, 0x55, 0xcb, 0xc6, 0x1b, 0x73, 0xf9, 0xea, 0x48, 0x41, 0x68, 0xa3, 0x18,
-	0x1d, 0xb2, 0x14, 0xdf, 0x96, 0xa5, 0xf8, 0xce, 0xdb, 0x7c, 0xae, 0xe0, 0xff, 0x49, 0x67, 0x3d,
-	0xef, 0xf9, 0x75, 0xe7, 0xaa, 0xe7, 0xd7, 0xdb, 0x47, 0x27, 0xbf, 0x84, 0xbd, 0xc2, 0x44, 0x24,
-	0x1f, 0xbb, 0xa8, 0x44, 0x56, 0x2b, 0xa4, 0x5c, 0xbd, 0x80, 0x2c, 0x64, 0x9b, 0xe5, 0x62, 0xb6,
-	0xa1, 0x1f, 0xc2, 0xa6, 0xfa, 0x4f, 0xfc, 0xe8, 0x85, 0xa3, 0x60, 0x74, 0x2e, 0x07, 0x06, 0x55,
-	0xbe, 0xa1, 0xa0, 0xcf, 0x15, 0x10, 0x5b, 0xbc, 0x7c, 0xd7, 0x89, 0x17, 0xfa, 0xa3, 0x38, 0x69,
-	0x59, 0xf2, 0x76, 0xa7, 0x23, 0xc1, 0x78, 0xda, 0xe2, 0xc8, 0x26, 0x79, 0x3e, 0xaa, 0xc9, 0xca,
-	0x76, 0x61, 0x6a, 0xa3, 0x10, 0xf4, 0x39, 0x3c, 0xbe, 0x4c, 0x2e, 0xa2, 0xe9, 0xf9, 0xb9, 0x1f,
-	0xa9, 0x74, 0x91, 0x9d, 0x42, 0xce, 0x0f, 0x6a, 0xfc, 0xc3, 0x4b, 0x42, 0x9c, 0x94, 0xba, 0x70,
-	0x64, 0xfa, 0x19, 0xec, 0xa0, 0x13, 0x61, 0x12, 0x41, 0x31, 0xa9, 0x22, 0x1b, 0xd2, 0xec, 0x34,
-	0x47, 0x65, 0x9a, 0x1c, 0xc0, 0x4e, 0x3f, 0x7b, 0xa1, 0xc9, 0xf2, 0x82, 0x9d, 0x4d, 0xfd, 0xae,
-	0xd2, 0xbc, 0x7f, 0xe9, 0xf1, 0xf6, 0x2b, 0xb8, 0x39, 0x3b, 0x2d, 0x45, 0x96, 0xd4, 0x8a, 0x7b,
-	0xaa, 0x88, 0x15, 0x87, 0xa6, 0xae, 0x77, 0x9e, 0x9a, 0xf3, 0x0e, 0xd4, 0x22, 0x2f, 0x0e, 0xa2,
-	0xb3, 0xc0, 0x8f, 0xd2, 0xe9, 0x5c, 0x06, 0xa0, 0xb7, 0xa0, 0x9a, 0xca, 0x4c, 0x46, 0x73, 0xd9,
-	0x1a, 0x71, 0xfe, 0x4f, 0xb2, 0x31, 0x8d, 0xea, 0xfb, 0x0a, 0x97, 0xae, 0xcb, 0x73, 0x8f, 0xed,
-	0xf7, 0x9a, 0x7b, 0xd0, 0xb9, 0x73, 0x8f, 0x5f, 0xc2, 0x8e, 0xff, 0x93, 0x9a, 0x1e, 0xc8, 0x21,
-	0x70, 0xa4, 0xba, 0x49, 0xad, 0x98, 0xaa, 0xb7, 0x53, 0x0a, 0x7c, 0xea, 0x46, 0xb2, 0xaf, 0xcc,
-	0xde, 0xc4, 0xab, 0xef, 0xf3, 0x26, 0xc6, 0xcc, 0x80, 0xff, 0x48, 0x3b, 0x47, 0xf5, 0xaa, 0xb2,
-	0x83, 0x97, 0x3c, 0xba, 0x23, 0x7a, 0x00, 0xcb, 0xaa, 0x83, 0x5e, 0x97, 0x31, 0x57, 0x2f, 0xb7,
-	0xbf, 0x69, 0xdb, 0xcf, 0x15, 0x19, 0x7d, 0x0a, 0x50, 0xa8, 0xeb, 0x3b, 0x92, 0xa9, 0x3c, 0x01,
-	0x2e, 0x36, 0x31, 0xbc, 0xd6, 0xcb, 0x5a, 0x92, 0xaf, 0x60, 0x27, 0x0a, 0x5e, 0x0e, 0x82, 0xd1,
-	0x79, 0x24, 0x72, 0xdf, 0xa8, 0x7f, 0x50, 0x3c, 0x30, 0x4d, 0x29, 0x9a, 0x19, 0x01, 0xfd, 0x1a,
-	0x76, 0x73, 0xf7, 0x1d, 0x78, 0x69, 0x4f, 0x53, 0xbf, 0x37, 0xc3, 0x98, 0x91, 0x98, 0x5e, 0xd2,
-	0xd3, 0xd0, 0x63, 0x20, 0x61, 0xda, 0x52, 0x88, 0x09, 0xf6, 0x14, 0xd1, 0x15, 0xa3, 0xa5, 0xd9,
-	0xce, 0x83, 0x6f, 0x85, 0x33, 0xeb, 0x08, 0xf3, 0x63, 0xf6, 0x2a, 0x01, 0x95, 0x1f, 0xa3, 0xe4,
-	0x35, 0xf2, 0x35, 0x80, 0x37, 0x9c, 0x24, 0x5d, 0x77, 0x32, 0x56, 0xac, 0x5f, 0xd5, 0x74, 0xf3,
-	0x9a, 0x97, 0x35, 0xed, 0xc7, 0x18, 0xef, 0xe1, 0x6b, 0x91, 0x7b, 0x7d, 0x54, 0xff, 0xe8, 0x7d,
-	0x26, 0x40, 0x5b, 0xc8, 0x96, 0x0f, 0x3a, 0x22, 0xad, 0x05, 0xab, 0x49, 0x7a, 0xc5, 0xa2, 0x93,
-	0x24, 0x58, 0x72, 0x8d, 0xd6, 0x61, 0xd7, 0x34, 0xac, 0x67, 0xa2, 0x65, 0x5b, 0xae, 0x70, 0xdc,
-	0x53, 0x93, 0x39, 0xc7, 0x8c, 0x61, 0x3d, 0xdd, 0x05, 0x22, 0xd7, 0x42, 0x6f, 0x77, 0x84, 0xaa,
-	0xac, 0x64, 0x41, 0xfb, 0xcf, 0x0a, 0x6c, 0x34, 0xa2, 0xc8, 0xf4, 0x47, 0xe7, 0xf1, 0xab, 0x79,
-	0x85, 0xa9, 0x32, 0x37, 0xc5, 0xbf, 0xad, 0x30, 0xcd, 0xbc, 0x16, 0x17, 0xb2, 0x36, 0x30, 0x7f,
-	0x2d, 0x7e, 0x07, 0xb7, 0xf2, 0x97, 0xdf, 0xc4, 0x0f, 0x45, 0x30, 0x1a, 0x04, 0x23, 0x5f, 0x44,
-	0xf1, 0x45, 0xf2, 0x5d, 0x42, 0x71, 0xec, 0xa5, 0x1c, 0x1d, 0x3f, 0x34, 0x24, 0x89, 0x83, 0x14,
-	0x33, 0x37, 0xb3, 0x38, 0x73, 0x33, 0xda, 0x5f, 0x97, 0x61, 0xf3, 0x24, 0xd5, 0x12, 0xdf, 0xf0,
-	0x11, 0xfd, 0x18, 0x96, 0x92, 0xf6, 0x79, 0x71, 0xce, 0x63, 0x2f, 0xf5, 0x59, 0x49, 0x43, 0xbf,
-	0x9a, 0x89, 0x9c, 0xab, 0xa3, 0x4d, 0xce, 0x89, 0x0b, 0x21, 0xc5, 0xe0, 0x1e, 0xb6, 0xc0, 0x19,
-	0x91, 0x08, 0xfd, 0x37, 0x81, 0x2c, 0x6e, 0x49, 0x86, 0xe9, 0xab, 0x63, 0xf1, 0x3b, 0xc3, 0x60,
-	0x94, 0xeb, 0x97, 0x10, 0x25, 0x99, 0xac, 0x4f, 0x3f, 0x07, 0x2a, 0x0f, 0x76, 0x16, 0x0c, 0xfc,
-	0x4c, 0x84, 0x2c, 0x08, 0xca, 0x20, 0x04, 0xb1, 0xad, 0x60, 0xe0, 0xa7, 0x9c, 0xf4, 0x63, 0xd8,
-	0x8e, 0xfd, 0xe1, 0x64, 0x80, 0x0f, 0xff, 0xcc, 0x26, 0x6a, 0xe6, 0xba, 0x95, 0x22, 0xd2, 0x37,
-	0xf4, 0x47, 0xb0, 0x25, 0x2d, 0x5c, 0x78, 0x6d, 0xab, 0xf2, 0xb1, 0xa1, 0xc0, 0x45, 0xba, 0x5e,
-	0x18, 0x4c, 0xe2, 0x9c, 0x6e, 0x3b, 0xa1, 0x93, 0xe0, 0x94, 0xee, 0xb7, 0xe9, 0x40, 0x4c, 0x79,
-	0x4a, 0x54, 0xaf, 0x49, 0x7b, 0xdd, 0x2a, 0xd7, 0x70, 0xa4, 0x51, 0xae, 0x91, 0x0c, 0xcb, 0xd4,
-	0x22, 0xc2, 0x27, 0xac, 0x12, 0x80, 0xfb, 0x04, 0x67, 0x98, 0xf3, 0x2e, 0x64, 0x21, 0xb9, 0x3c,
-	0xa4, 0x97, 0x42, 0x9c, 0x9c, 0x8c, 0x13, 0xbf, 0x04, 0xa1, 0x9d, 0xf9, 0x75, 0x86, 0x48, 0x79,
-	0xe5, 0xf1, 0xfa, 0xa5, 0x99, 0xe1, 0xbc, 0x4a, 0xd4, 0x54, 0x53, 0xea, 0x81, 0x8c, 0x0d, 0xd5,
-	0xa6, 0x50, 0x29, 0xed, 0xce, 0xe5, 0x89, 0x41, 0x1e, 0x40, 0x7c, 0xa3, 0x57, 0x5c, 0x6a, 0x0f,
-	0x61, 0x43, 0x6a, 0xdf, 0xf0, 0x62, 0xff, 0x7c, 0x1c, 0x5e, 0x68, 0x3b, 0x49, 0x8f, 0x59, 0xec,
-	0x80, 0xb5, 0x7f, 0xbf, 0x07, 0x5b, 0x89, 0x63, 0x04, 0xe3, 0x91, 0x9a, 0x05, 0x7e, 0x0f, 0xd5,
-	0xc8, 0x7f, 0xe3, 0x87, 0x68, 0x96, 0x95, 0xb9, 0x93, 0xed, 0x12, 0xc7, 0x81, 0x93, 0x90, 0xa7,
-	0x4d, 0x78, 0xc6, 0x4f, 0xbf, 0x86, 0xa5, 0xde, 0xb8, 0xef, 0x27, 0xe1, 0xfc, 0xe0, 0x1d, 0x72,
-	0x64, 0x4c, 0x4b, 0x06, 0x7a, 0x1d, 0x96, 0x30, 0xf2, 0x92, 0x40, 0xae, 0x7c, 0xc1, 0xe5, 0x92,
-	0x12, 0x58, 0xec, 0x8d, 0x55, 0xf8, 0x2d, 0x73, 0xfc, 0x77, 0x26, 0x2a, 0x97, 0x67, 0xf3, 0xe5,
-	0x1e, 0xac, 0x4c, 0xbc, 0xd0, 0x1b, 0x46, 0xc9, 0xa8, 0x29, 0x59, 0xd1, 0xdf, 0x40, 0xb5, 0x97,
-	0x58, 0x25, 0x79, 0x1e, 0xdd, 0x9f, 0x77, 0xef, 0xa9, 0xe5, 0x94, 0x5a, 0x19, 0x0b, 0xbe, 0x77,
-	0xe5, 0x84, 0x05, 0x73, 0x71, 0xe8, 0x4f, 0xc6, 0x61, 0x2c, 0x62, 0x3f, 0x8a, 0xd5, 0x17, 0x0d,
-	0x39, 0x7d, 0xaa, 0xf1, 0x3d, 0xa4, 0xd0, 0x87, 0x13, 0x2e, 0xf1, 0xae, 0x1f, 0xc5, 0x72, 0x6e,
-	0xae, 0x7d, 0x03, 0xd5, 0xd4, 0x58, 0xc5, 0x01, 0xba, 0xc3, 0x4e, 0x18, 0x37, 0xdc, 0x53, 0x72,
-	0xad, 0xf8, 0x76, 0x58, 0x83, 0xd5, 0xe7, 0x3a, 0xb7, 0x0c, 0xeb, 0x88, 0x2c, 0x69, 0xff, 0x78,
-	0xe7, 0xca, 0x37, 0xc2, 0x4d, 0xb8, 0xde, 0xd6, 0xad, 0xa6, 0xee, 0xda, 0xfc, 0x54, 0xb8, 0xfa,
-	0x91, 0x68, 0x1b, 0x8e, 0x83, 0x5c, 0x15, 0x7a, 0x1b, 0x6e, 0x20, 0x80, 0xb3, 0x1f, 0xba, 0x06,
-	0x67, 0x4d, 0x71, 0x78, 0x9a, 0x21, 0xeb, 0xf4, 0x01, 0xdc, 0x4b, 0xe4, 0x8b, 0xab, 0x88, 0x4c,
-	0x7a, 0x03, 0x76, 0x10, 0xc9, 0x5e, 0x34, 0xcc, 0x6e, 0x53, 0x21, 0x5d, 0xfd, 0x88, 0xe0, 0x7b,
-	0xb8, 0x9e, 0x72, 0xb3, 0x17, 0x2e, 0xb3, 0x1c, 0xc3, 0xb6, 0x44, 0xd7, 0xea, 0x3a, 0xac, 0x49,
-	0x6c, 0x3c, 0xdc, 0x25, 0xa8, 0x4b, 0x1f, 0xc3, 0xc3, 0xcb, 0x3c, 0x4d, 0xd6, 0xe1, 0xac, 0xa1,
-	0xbb, 0xac, 0x29, 0x4e, 0x18, 0x47, 0x10, 0xe9, 0xd0, 0xbb, 0x70, 0x53, 0x77, 0x5d, 0x5e, 0x50,
-	0xaa, 0xeb, 0x66, 0x5a, 0xfd, 0x06, 0x5f, 0x6e, 0x4d, 0xc3, 0xd1, 0x4d, 0xd3, 0x7e, 0xce, 0x9a,
-	0x52, 0xa1, 0x05, 0x7a, 0x0b, 0xf6, 0x8e, 0x98, 0xc5, 0xb8, 0x6e, 0x8a, 0x12, 0xee, 0x17, 0x68,
-	0xa2, 0x02, 0x2c, 0xf9, 0x16, 0x81, 0xa8, 0x17, 0xf8, 0xe0, 0x2b, 0xa0, 0x70, 0x53, 0xb2, 0x58,
-	0xa6, 0x57, 0x05, 0x0c, 0x51, 0x3f, 0xd0, 0x3d, 0xa0, 0x86, 0x75, 0xa2, 0x9b, 0x86, 0x22, 0x56,
-	0x5f, 0x1c, 0xc8, 0x12, 0x1a, 0xaa, 0xd9, 0xed, 0x98, 0x06, 0x9e, 0x44, 0x62, 0x8c, 0xc3, 0xae,
-	0xcb, 0xc8, 0x9f, 0xe8, 0x7d, 0xb8, 0x9b, 0x13, 0xce, 0x58, 0xd9, 0xd4, 0x4f, 0xed, 0xae, 0x4b,
-	0x6e, 0xe3, 0x69, 0x93, 0xb3, 0x25, 0xb0, 0x5c, 0x80, 0x43, 0x02, 0x3c, 0x99, 0xd1, 0xee, 0x98,
-	0x06, 0x6b, 0xa6, 0xe8, 0x44, 0x03, 0xb2, 0x87, 0xd7, 0xe0, 0x74, 0x58, 0xc3, 0x68, 0xcd, 0xc1,
-	0xde, 0x42, 0xce, 0xdc, 0x35, 0xa4, 0x16, 0xa9, 0x0d, 0x97, 0xe9, 0x3e, 0xdc, 0xc9, 0x71, 0xb6,
-	0xc5, 0xec, 0xd6, 0x2c, 0xc5, 0x9d, 0x59, 0x0a, 0xdd, 0x3a, 0x2d, 0x53, 0xbc, 0x9a, 0x3d, 0x74,
-	0x13, 0x9f, 0x9c, 0xf2, 0xfe, 0xbe, 0xc5, 0x86, 0x20, 0x47, 0x74, 0x2d, 0xe3, 0x87, 0x2e, 0x93,
-	0xf6, 0x5e, 0x41, 0xa1, 0xf3, 0x30, 0x22, 0x75, 0xf5, 0x36, 0xfa, 0xce, 0x73, 0x6e, 0x5b, 0x47,
-	0xe9, 0x67, 0x1c, 0xe4, 0x5b, 0xc5, 0xad, 0xf2, 0xc6, 0x42, 0xb8, 0xb6, 0x2d, 0x4c, 0xdb, 0x3a,
-	0x22, 0x4f, 0xd0, 0xa9, 0x0a, 0x08, 0xdd, 0x6a, 0x0a, 0xc3, 0x32, 0x0d, 0x8b, 0x25, 0xd7, 0x96,
-	0x51, 0x9e, 0xe1, 0xad, 0xce, 0x47, 0x9d, 0xa3, 0x90, 0xfc, 0xa8, 0x8d, 0xa6, 0xee, 0xea, 0xe9,
-	0x29, 0x85, 0xcd, 0x85, 0x61, 0x35, 0x6c, 0xce, 0x59, 0xc3, 0x25, 0x35, 0x34, 0xb8, 0xc2, 0x9f,
-	0x18, 0xb6, 0xa9, 0xbb, 0xcc, 0x11, 0x87, 0xa6, 0xde, 0x78, 0x66, 0x1a, 0x8e, 0x4b, 0x3e, 0xa0,
-	0x0f, 0x61, 0xdf, 0xb2, 0x2d, 0xf1, 0xfc, 0xd8, 0x70, 0x99, 0xd3, 0xd1, 0x1b, 0x2c, 0x11, 0xc6,
-	0xac, 0x86, 0xdd, 0xb5, 0x5c, 0xc6, 0x59, 0x93, 0xf0, 0xa2, 0x0f, 0x7d, 0xef, 0xd8, 0x96, 0xa2,
-	0x21, 0x7f, 0x96, 0xbe, 0x98, 0x47, 0x83, 0x74, 0xb8, 0x35, 0xe9, 0xeb, 0x39, 0x10, 0x8d, 0xb1,
-	0x4e, 0x0f, 0xe0, 0xe3, 0x5c, 0xdd, 0x0e, 0xb7, 0x3b, 0x8c, 0xbb, 0x59, 0xd4, 0x8a, 0x16, 0xb7,
-	0xdb, 0x45, 0xe7, 0xdc, 0xc4, 0xe3, 0xa5, 0x1b, 0x66, 0xd4, 0xca, 0x1f, 0x0d, 0xab, 0x48, 0xb9,
-	0x45, 0xb7, 0x60, 0x2d, 0x15, 0xd3, 0xe5, 0x26, 0x79, 0x80, 0x80, 0x94, 0x15, 0x01, 0x0f, 0xf1,
-	0x6a, 0x0b, 0x00, 0x94, 0xe7, 0xda, 0x0d, 0xdb, 0x24, 0x1f, 0xd2, 0xeb, 0xb0, 0x5d, 0x88, 0x9a,
-	0xa6, 0xdd, 0xd6, 0x0d, 0x8b, 0x7c, 0x87, 0x49, 0xa8, 0x00, 0xe6, 0xcc, 0xd4, 0x5d, 0xe3, 0x84,
-	0x49, 0x69, 0x5f, 0xd0, 0x0f, 0xe1, 0x7e, 0x01, 0x99, 0x29, 0x37, 0xab, 0x16, 0x41, 0xab, 0xb7,
-	0xbb, 0x6e, 0x57, 0x37, 0xcd, 0x53, 0x95, 0x8b, 0x1c, 0x14, 0x81, 0x24, 0x0e, 0xd9, 0x46, 0xab,
-	0x77, 0x2d, 0xe6, 0x34, 0xf4, 0x0e, 0x5a, 0x28, 0xfb, 0xfe, 0x38, 0x23, 0x83, 0x52, 0x0d, 0x3e,
-	0xc8, 0x70, 0x1d, 0x9d, 0xbb, 0x86, 0x6e, 0x96, 0x68, 0x76, 0xd0, 0x45, 0x2e, 0xf1, 0x5b, 0x7a,
-	0x9b, 0x91, 0x5d, 0xfa, 0x09, 0x3c, 0x42, 0x3f, 0xb0, 0x1c, 0xc3, 0x71, 0xd1, 0x2d, 0xbb, 0x96,
-	0xe1, 0x3a, 0xa2, 0x65, 0x73, 0xf1, 0xdc, 0x68, 0xba, 0xc7, 0xd2, 0xf3, 0x92, 0x59, 0xf1, 0xf5,
-	0xd2, 0x99, 0xd1, 0xbf, 0x75, 0xab, 0xc1, 0x1c, 0xd7, 0xe6, 0xe4, 0x86, 0x3c, 0x4c, 0x76, 0x7b,
-	0xa6, 0xee, 0xb8, 0xa2, 0x71, 0x6c, 0x98, 0xea, 0x6e, 0x4f, 0x67, 0x63, 0x76, 0x86, 0xf3, 0x1e,
-	0x1e, 0x74, 0x3e, 0x4e, 0x3c, 0x37, 0xdc, 0x63, 0x71, 0x6c, 0x58, 0x2e, 0xd9, 0x47, 0x9b, 0x4a,
-	0xc5, 0x0b, 0x1a, 0x1c, 0x9e, 0x8a, 0xd9, 0x14, 0x42, 0xee, 0xd3, 0x47, 0xf0, 0x60, 0x0e, 0x59,
-	0x39, 0x9b, 0x10, 0x0d, 0xf5, 0xcd, 0x22, 0x40, 0x58, 0xdd, 0x76, 0xae, 0xae, 0x43, 0xbe, 0xc1,
-	0x80, 0xce, 0xb1, 0x6d, 0xc3, 0x2a, 0x53, 0x74, 0x31, 0xbd, 0x15, 0xf6, 0xc8, 0x50, 0xca, 0xb0,
-	0xbf, 0xc2, 0x3a, 0x54, 0x40, 0xb7, 0x0c, 0x5e, 0x34, 0x88, 0x22, 0x7a, 0x2a, 0xd3, 0x46, 0x4e,
-	0xd4, 0xd6, 0xad, 0x6e, 0x4b, 0x6f, 0xb8, 0x5d, 0x99, 0x49, 0xed, 0xe6, 0x29, 0xf9, 0x1d, 0xc6,
-	0x44, 0xce, 0xd5, 0xb4, 0x99, 0x23, 0xe4, 0xfb, 0x44, 0x77, 0x0d, 0xa7, 0x75, 0x2a, 0x38, 0x6b,
-	0x31, 0xce, 0xac, 0x06, 0x13, 0x1d, 0x1b, 0xad, 0x74, 0x88, 0x56, 0xca, 0x6d, 0x59, 0x42, 0x67,
-	0x29, 0xae, 0x21, 0x95, 0xcf, 0xf2, 0x55, 0x59, 0x4a, 0x13, 0x6f, 0x44, 0x6a, 0x69, 0xbb, 0x22,
-	0xbb, 0x6d, 0x5b, 0x1c, 0xeb, 0x27, 0x4c, 0x38, 0xc6, 0xa1, 0x69, 0x58, 0x47, 0x0e, 0x79, 0x8e,
-	0xda, 0xab, 0x12, 0x3b, 0xbb, 0x4b, 0xc3, 0xb6, 0x5a, 0xa6, 0xd1, 0x70, 0x09, 0xa3, 0x5f, 0xc3,
-	0x2f, 0xde, 0x5f, 0x7b, 0x81, 0xba, 0x75, 0x4d, 0x9d, 0x93, 0x16, 0x7a, 0xf5, 0xa1, 0xee, 0xa8,
-	0x1c, 0xda, 0xee, 0x3a, 0xae, 0xc0, 0x54, 0xc1, 0x30, 0x7d, 0x98, 0x26, 0xc6, 0x98, 0x43, 0x2c,
-	0xfa, 0x01, 0xdc, 0x4a, 0x83, 0x3a, 0xab, 0x3f, 0x59, 0x01, 0x26, 0x0e, 0xde, 0x40, 0x31, 0xb1,
-	0xcf, 0x23, 0xf2, 0x64, 0x4a, 0xb7, 0x1b, 0xdd, 0xb6, 0x4c, 0xc9, 0xb6, 0x2d, 0x1a, 0x76, 0xbb,
-	0x63, 0xb2, 0x17, 0xe4, 0x04, 0x5b, 0x92, 0x2c, 0x23, 0xb8, 0xad, 0x6f, 0xc8, 0xff, 0x97, 0xb7,
-	0x95, 0xd2, 0x3a, 0xc6, 0xef, 0x99, 0x30, 0x8d, 0xb6, 0xe1, 0x62, 0xe4, 0x32, 0xd6, 0x64, 0x4d,
-	0x32, 0xa0, 0xdb, 0xb0, 0xd1, 0x64, 0x27, 0xa2, 0x6d, 0x37, 0x99, 0xb0, 0x2d, 0xf3, 0x94, 0x0c,
-	0x31, 0x2b, 0xaa, 0x9c, 0xe4, 0x30, 0x79, 0x01, 0x6d, 0xf9, 0xed, 0x7e, 0x84, 0xda, 0x37, 0x1c,
-	0x47, 0x38, 0xa7, 0x96, 0xab, 0xbf, 0x10, 0x79, 0xf1, 0x95, 0x1f, 0x64, 0xc9, 0x5d, 0xf4, 0xe3,
-	0x02, 0xde, 0x71, 0xb9, 0x7e, 0x2a, 0x5c, 0xae, 0x1b, 0x68, 0x7c, 0x71, 0xa8, 0x37, 0x9e, 0x39,
-	0xa6, 0xee, 0x1c, 0x93, 0x8f, 0xf0, 0x98, 0x05, 0x42, 0x99, 0x8e, 0xdb, 0x86, 0x25, 0xd3, 0x6a,
-	0xc3, 0x6e, 0xcb, 0x01, 0xf0, 0x23, 0xb4, 0xe7, 0x55, 0x44, 0x8e, 0xcb, 0xd1, 0x27, 0x1e, 0xa3,
-	0xa6, 0x05, 0x9a, 0x43, 0x5d, 0xa5, 0xc6, 0x9f, 0xd1, 0xcf, 0xe0, 0x93, 0x02, 0x1c, 0x2b, 0xaa,
-	0x61, 0xe1, 0x7d, 0x60, 0xeb, 0x24, 0xec, 0x96, 0xf8, 0xa1, 0xab, 0x9b, 0x2a, 0xb6, 0xa4, 0xea,
-	0x1f, 0x97, 0x36, 0x4b, 0x8f, 0x56, 0xf8, 0xa8, 0x4c, 0x3e, 0x41, 0x3f, 0x9d, 0xa1, 0x51, 0x76,
-	0xc7, 0x7a, 0x5b, 0x20, 0xfb, 0x79, 0xc9, 0x0a, 0xb2, 0x87, 0x94, 0xbb, 0x3b, 0xac, 0xdb, 0xb4,
-	0x85, 0xc3, 0x4c, 0xd6, 0xc0, 0x1c, 0xf2, 0x29, 0xbd, 0x07, 0xb7, 0x0b, 0x84, 0xe9, 0x95, 0x67,
-	0x04, 0x07, 0x25, 0x33, 0x49, 0xcf, 0xce, 0xd0, 0xc2, 0x71, 0x75, 0xee, 0x92, 0xcf, 0xe8, 0x17,
-	0xf0, 0xe9, 0x8c, 0x99, 0xe4, 0x17, 0x71, 0x2c, 0xbd, 0x9d, 0xae, 0x2b, 0x38, 0xc3, 0xd4, 0xef,
-	0xe0, 0xfe, 0x99, 0xdc, 0xcf, 0x31, 0xb1, 0xcd, 0xd9, 0x18, 0x2d, 0xf7, 0x65, 0x09, 0x57, 0x2c,
-	0x38, 0xbf, 0x2c, 0xe9, 0x33, 0xb7, 0xf6, 0x7c, 0x85, 0x1e, 0x57, 0x20, 0xba, 0x5c, 0x86, 0x7e,
-	0x4b, 0x3f, 0x02, 0x6d, 0x3e, 0xc5, 0x4c, 0x45, 0xfa, 0x1a, 0x23, 0x7a, 0xae, 0xbb, 0xb9, 0x3c,
-	0x3f, 0xcc, 0xaf, 0x4b, 0x56, 0x2c, 0x17, 0x57, 0xf2, 0xfb, 0xd2, 0x76, 0x97, 0xaa, 0xaf, 0x65,
-	0xcb, 0x8e, 0x41, 0x94, 0x0c, 0x39, 0xeb, 0x21, 0xe2, 0x58, 0xc7, 0x3c, 0x30, 0xfb, 0x2b, 0x83,
-	0xff, 0x47, 0x7f, 0x07, 0xdf, 0xce, 0x3f, 0x49, 0x89, 0x5b, 0xa6, 0x83, 0x43, 0x2c, 0x64, 0x8e,
-	0xd1, 0x64, 0xe2, 0x19, 0x3b, 0x6d, 0x71, 0xcc, 0xa6, 0x7f, 0xa0, 0x4f, 0xe0, 0x60, 0xbe, 0x84,
-	0x94, 0xe6, 0x12, 0xcf, 0x1f, 0x4b, 0x76, 0x69, 0xeb, 0x66, 0xcb, 0xe6, 0x6d, 0xcc, 0xc5, 0xac,
-	0x69, 0xe8, 0xe2, 0x87, 0x2e, 0xe3, 0xa7, 0xe4, 0x65, 0x89, 0xaa, 0x98, 0xb2, 0x25, 0x99, 0x7b,
-	0xda, 0x61, 0xa4, 0x57, 0x72, 0xd6, 0x4b, 0x54, 0x2d, 0xa6, 0x63, 0x6a, 0x27, 0x7d, 0x6c, 0x5c,
-	0xe6, 0x13, 0xce, 0xb6, 0x31, 0xe4, 0x28, 0xf5, 0x20, 0x4c, 0x31, 0x0e, 0x36, 0x07, 0xe6, 0xa9,
-	0xb0, 0x98, 0xe3, 0xb2, 0x26, 0x79, 0x7d, 0xf5, 0x71, 0x4b, 0xcd, 0x50, 0x5e, 0x44, 0x8f, 0x4b,
-	0xf7, 0x92, 0x11, 0x16, 0x98, 0x91, 0x5a, 0xf6, 0x08, 0x2a, 0x9a, 0x0d, 0xfa, 0x39, 0xfc, 0xfc,
-	0x1d, 0x2c, 0xae, 0x7d, 0xc4, 0xdc, 0x63, 0xa6, 0xca, 0x35, 0xf9, 0x5e, 0xd6, 0xac, 0x39, 0x1c,
-	0x49, 0xfe, 0x75, 0xd2, 0x0b, 0x6d, 0xa8, 0x20, 0x7f, 0xa6, 0x0d, 0x81, 0x94, 0x67, 0x12, 0x7f,
-	0xff, 0x1b, 0x7b, 0x1f, 0xd6, 0x8a, 0x23, 0x10, 0xf9, 0xd4, 0xe6, 0x45, 0x90, 0xf6, 0x27, 0x58,
-	0x2b, 0xcc, 0x51, 0xfe, 0xfe, 0x9d, 0xf6, 0x60, 0x25, 0x99, 0xeb, 0xa9, 0xcf, 0x3a, 0xc9, 0x4a,
-	0xfb, 0x23, 0x6c, 0xa7, 0xbf, 0x27, 0xeb, 0x84, 0xe3, 0x64, 0xb8, 0xf4, 0x04, 0x16, 0x23, 0x3f,
-	0x9d, 0x00, 0xbe, 0xfb, 0x07, 0x8a, 0x48, 0x9c, 0xff, 0x60, 0x74, 0xa1, 0xf0, 0xdb, 0x63, 0xed,
-	0xdf, 0x2a, 0xb0, 0x93, 0xd1, 0x15, 0xbe, 0xcf, 0x7d, 0x07, 0xb5, 0x49, 0xba, 0x9d, 0xdc, 0xe7,
-	0xf2, 0xa4, 0xe6, 0x92, 0x5a, 0x3c, 0x67, 0xa1, 0x1d, 0xd8, 0x55, 0x13, 0xa4, 0xe0, 0x4c, 0x4c,
-	0x47, 0xe9, 0xa8, 0xbf, 0x2f, 0x37, 0xbf, 0xfc, 0x8b, 0xc8, 0x92, 0x5d, 0x38, 0x95, 0xbc, 0xc6,
-	0x59, 0x37, 0xe7, 0xd4, 0xfe, 0x75, 0x09, 0x48, 0x4e, 0xc7, 0xfd, 0x68, 0x3a, 0x40, 0x35, 0x57,
-	0xa2, 0xd8, 0x8b, 0xa7, 0x51, 0xf2, 0x2b, 0xaa, 0x8f, 0xae, 0x14, 0xac, 0x18, 0x0e, 0x1c, 0x49,
-	0xcd, 0x13, 0x2e, 0xfa, 0x15, 0xac, 0xc8, 0xad, 0xd2, 0x21, 0xe4, 0xbb, 0x14, 0x4b, 0xa8, 0xe9,
-	0x17, 0xd9, 0xcf, 0x7a, 0x0a, 0x23, 0x45, 0x35, 0x73, 0x91, 0xf3, 0xc0, 0xed, 0x37, 0xe5, 0x51,
-	0xe2, 0x15, 0x23, 0xc4, 0xa5, 0xb7, 0x8c, 0x10, 0x9f, 0xc0, 0x4e, 0x1c, 0x7a, 0xa3, 0x08, 0x3d,
-	0xc1, 0x0f, 0xb3, 0x2f, 0xdb, 0x6a, 0xea, 0x58, 0xf9, 0x9c, 0xd3, 0x02, 0x36, 0xfd, 0xba, 0xfd,
-	0x08, 0xb6, 0xe2, 0x8b, 0x89, 0x2f, 0x82, 0xbe, 0x3f, 0x8a, 0x83, 0xb3, 0xc0, 0x0f, 0xeb, 0xcb,
-	0x72, 0xb2, 0xb3, 0x89, 0x60, 0x23, 0x83, 0x52, 0x0e, 0xbb, 0xea, 0xf7, 0xa5, 0x91, 0x1f, 0x8b,
-	0xec, 0xde, 0xd2, 0xd1, 0xea, 0xbb, 0xef, 0x9a, 0xbe, 0x29, 0x83, 0x22, 0xfa, 0x02, 0xf6, 0x72,
-	0x99, 0x61, 0xee, 0x4d, 0xea, 0x53, 0xc7, 0xda, 0x13, 0xed, 0x0a, 0xa9, 0x05, 0xc7, 0xe3, 0xbb,
-	0x6f, 0x2e, 0x03, 0x23, 0xed, 0x67, 0xb0, 0xa2, 0x6e, 0x6e, 0xf6, 0xeb, 0x74, 0x15, 0x96, 0x3a,
-	0xba, 0xe3, 0x90, 0x8a, 0xfc, 0x65, 0x89, 0x6e, 0x98, 0x64, 0x41, 0xfb, 0x5b, 0x05, 0x36, 0xb2,
-	0x41, 0xae, 0x31, 0x3a, 0x1b, 0xd3, 0xbb, 0x00, 0xe1, 0x74, 0xe0, 0x47, 0x62, 0xe2, 0xc5, 0xaf,
-	0x92, 0x2f, 0xaa, 0x35, 0x09, 0xe9, 0x78, 0xf1, 0xab, 0x2b, 0xee, 0x72, 0xe1, 0xff, 0x7e, 0x97,
-	0x8b, 0x57, 0xdf, 0xe5, 0xff, 0x06, 0x00, 0x00, 0xff, 0xff, 0xf4, 0x98, 0x92, 0x66, 0xc3, 0x30,
-	0x00, 0x00,
+	// 4889 bytes of a gzipped FileDescriptorProto
+	0x1f, 0x8b, 0x08, 0x00, 0x00, 0x00, 0x00, 0x00, 0x02, 0xff, 0x9c, 0x7a, 0xfb, 0x7a, 0xdb, 0xc6,
+	0x95, 0xb8, 0xa9, 0x2b, 0x79, 0x74, 0x1b, 0x8d, 0x64, 0x99, 0xbe, 0xc5, 0x32, 0xec, 0xc4, 0x6e,
+	0xd2, 0x28, 0x89, 0x9b, 0x26, 0xa9, 0x9b, 0xa6, 0x85, 0xc8, 0xa1, 0x84, 0x18, 0x04, 0x98, 0x01,
+	0x28, 0x5b, 0xfd, 0xb5, 0x9d, 0x1f, 0x4c, 0x42, 0x32, 0x62, 0xde, 0x02, 0x80, 0x4e, 0xb4, 0xff,
+	0xee, 0x0b, 0x74, 0xbf, 0x7e, 0xfb, 0xed, 0x13, 0xec, 0xb7, 0x2f, 0xb1, 0x8f, 0xb0, 0xfb, 0x00,
+	0x7d, 0x97, 0xfd, 0x63, 0xbf, 0x33, 0x83, 0x1b, 0x21, 0xca, 0xce, 0xf6, 0x2f, 0x69, 0xce, 0x6d,
+	0xce, 0x9c, 0x39, 0xb7, 0x39, 0x20, 0x6c, 0xbd, 0xf1, 0x06, 0x41, 0xdf, 0x8b, 0xc7, 0xe1, 0xc1,
+	0x24, 0x1c, 0xc7, 0x63, 0xba, 0xe1, 0x0d, 0x27, 0x07, 0x19, 0x50, 0xf3, 0x61, 0x4b, 0x8f, 0xe3,
+	0xd0, 0x0d, 0x83, 0xf3, 0x73, 0x3f, 0x74, 0x26, 0x7e, 0x8f, 0x3e, 0x84, 0xcd, 0xe0, 0x4c, 0xbc,
+	0xf1, 0x06, 0x53, 0x5f, 0x84, 0xfe, 0xb9, 0xff, 0x53, 0xbd, 0xb2, 0x5f, 0x79, 0x5c, 0xe3, 0xeb,
+	0xc1, 0xd9, 0x09, 0x02, 0x39, 0xc2, 0xe8, 0x2f, 0x81, 0x7a, 0x83, 0x68, 0x2c, 0x42, 0xff, 0x87,
+	0x69, 0x10, 0xfa, 0x91, 0xf0, 0xe2, 0x38, 0xac, 0x2f, 0xec, 0x2f, 0x3e, 0xae, 0x71, 0x82, 0x18,
+	0x9e, 0x20, 0x50, 0xbc, 0x76, 0x01, 0xeb, 0x9d, 0x70, 0x3c, 0xf1, 0xc3, 0xf8, 0x42, 0xee, 0x41,
+	0x61, 0x69, 0xe4, 0x0d, 0xfd, 0x44, 0xb2, 0xfc, 0x9f, 0xde, 0x81, 0xda, 0xd0, 0x1b, 0x49, 0xb5,
+	0x2e, 0xea, 0x0b, 0xfb, 0x95, 0xc7, 0x55, 0x9e, 0x03, 0xe8, 0x2e, 0x2c, 0x4b, 0x95, 0xea, 0x8b,
+	0x92, 0x45, 0x2d, 0xe8, 0x7d, 0x58, 0x57, 0x8a, 0xf6, 0xc7, 0xd3, 0x97, 0x03, 0xbf, 0xbe, 0xb4,
+	0x5f, 0x79, 0x5c, 0xe1, 0x6b, 0x12, 0xd6, 0x94, 0x20, 0xcd, 0x06, 0x52, 0xdc, 0xda, 0x0c, 0xa2,
+	0x98, 0xfe, 0x16, 0x60, 0xa2, 0x60, 0x81, 0x1f, 0xd5, 0x2b, 0xfb, 0x8b, 0x8f, 0xd7, 0x9e, 0xdc,
+	0x3e, 0x98, 0xb1, 0xcc, 0x41, 0x91, 0x89, 0x17, 0xc8, 0xb5, 0x7f, 0x82, 0xd5, 0x6e, 0x38, 0x90,
+	0xc7, 0xb8, 0x05, 0x55, 0x69, 0xd5, 0xde, 0x78, 0x20, 0xa5, 0xd4, 0x78, 0xb6, 0xa6, 0x1f, 0xc1,
+	0xa6, 0x37, 0x18, 0x8c, 0x7f, 0x14, 0xa1, 0x3f, 0xf0, 0xe2, 0xe0, 0x8d, 0xaf, 0xce, 0xf4, 0x74,
+	0x29, 0x0e, 0xa7, 0x3e, 0xdf, 0x90, 0x38, 0x9e, 0xa0, 0xe8, 0x07, 0xb0, 0xa6, 0x88, 0xfd, 0xe1,
+	0x24, 0xbe, 0x90, 0x67, 0xac, 0x3e, 0x5d, 0x3e, 0xf3, 0x06, 0x91, 0xcf, 0x41, 0x62, 0x18, 0x22,
+	0x34, 0x06, 0x9b, 0x8d, 0x28, 0x6a, 0xfa, 0xbd, 0x81, 0x17, 0x7a, 0x71, 0x30, 0x1e, 0xcd, 0xb5,
+	0xe4, 0x3d, 0x50, 0x16, 0x10, 0x3d, 0x2f, 0xf2, 0x83, 0xe4, 0x52, 0x40, 0x82, 0x1a, 0x08, 0xd1,
+	0xfe, 0x1b, 0xa0, 0x8a, 0xf7, 0x22, 0x0f, 0x71, 0x17, 0xc0, 0x1f, 0x79, 0x2f, 0x07, 0x7e, 0x5f,
+	0xbc, 0xbc, 0xa8, 0xdf, 0x90, 0xc4, 0xb5, 0x04, 0x72, 0x78, 0x81, 0xc2, 0xfa, 0x41, 0x94, 0xe1,
+	0xeb, 0x4a, 0x58, 0x0a, 0x3a, 0xbc, 0x98, 0xab, 0xc1, 0x47, 0xb0, 0xed, 0x0d, 0x62, 0x3f, 0x1c,
+	0xc9, 0xe3, 0x09, 0x84, 0x45, 0xb9, 0x73, 0x64, 0x08, 0x0b, 0xe1, 0xb3, 0x17, 0xbf, 0x58, 0xbe,
+	0xf8, 0x47, 0xb0, 0x95, 0x2d, 0xc4, 0x78, 0xe4, 0x8f, 0xcf, 0xea, 0xeb, 0x72, 0xa7, 0xcd, 0x0c,
+	0x6c, 0x23, 0x74, 0x96, 0xd0, 0x1b, 0x5d, 0x8c, 0xcf, 0xea, 0xd7, 0x4b, 0x84, 0x3a, 0x42, 0x73,
+	0x57, 0x5a, 0x92, 0x0a, 0x25, 0xae, 0x54, 0x32, 0x1a, 0x2d, 0x1b, 0x2d, 0x27, 0x50, 0x41, 0xb1,
+	0x25, 0x65, 0x2b, 0x02, 0x15, 0x12, 0x1f, 0xc2, 0x76, 0x81, 0x20, 0x91, 0xb3, 0x2c, 0xc9, 0xb6,
+	0x72, 0x32, 0x25, 0xec, 0x57, 0x50, 0x53, 0xb4, 0xd3, 0x70, 0x50, 0xdf, 0xdc, 0xaf, 0x3c, 0x5e,
+	0x7b, 0xb2, 0x57, 0x72, 0xc0, 0xc4, 0xc9, 0x78, 0x55, 0x12, 0x76, 0xc3, 0x01, 0xfd, 0x16, 0x88,
+	0x62, 0x2a, 0x38, 0xef, 0x9a, 0xe4, 0xbd, 0xf7, 0x16, 0xe7, 0x45, 0x8f, 0x4f, 0x14, 0xe8, 0x64,
+	0x7c, 0xd4, 0x00, 0xe2, 0xf5, 0xfb, 0x49, 0x98, 0xc7, 0x63, 0x11, 0xf9, 0x71, 0xfd, 0xe6, 0x7e,
+	0xe5, 0xf1, 0xe6, 0x93, 0xfd, 0x92, 0xac, 0xd4, 0x51, 0x0e, 0x64, 0xf4, 0x3b, 0x7e, 0xcc, 0x37,
+	0xbc, 0x7e, 0x5f, 0x2e, 0xdc, 0xb1, 0xe3, 0xc7, 0xf4, 0x18, 0x94, 0x74, 0x75, 0x3b, 0x52, 0xd2,
+	0xad, 0x9f, 0x2b, 0x49, 0x32, 0xca, 0xfb, 0x43, 0x49, 0x5f, 0xc1, 0x6a, 0xac, 0x32, 0x51, 0x9d,
+	0xc8, 0x73, 0xbd, 0x37, 0x47, 0x42, 0x21, 0x57, 0xf1, 0x94, 0x9c, 0x7e, 0x01, 0x37, 0x5e, 0x0e,
+	0xbc, 0xde, 0xeb, 0x41, 0x10, 0xc5, 0x7e, 0x7f, 0x26, 0x7b, 0xad, 0xc8, 0x1b, 0xb8, 0x5e, 0x40,
+	0x17, 0xd2, 0xd8, 0x3e, 0xac, 0xf5, 0xfd, 0x49, 0xe8, 0xf7, 0x64, 0x34, 0xd5, 0x57, 0x25, 0x6d,
+	0x11, 0x84, 0x6e, 0x55, 0x58, 0xca, 0xfb, 0xaa, 0x2a, 0xb7, 0x2a, 0x80, 0xf1, 0x76, 0x5a, 0xb0,
+	0xd5, 0x8b, 0x22, 0xd1, 0xcf, 0x83, 0xb3, 0xbe, 0x2b, 0x33, 0xcb, 0xdd, 0xd2, 0x21, 0x66, 0x23,
+	0x98, 0x6f, 0xf6, 0x66, 0x23, 0xfa, 0x14, 0xd6, 0xfb, 0x41, 0x34, 0xf1, 0xe2, 0xde, 0x2b, 0xf1,
+	0xda, 0xbf, 0xa8, 0x6f, 0x48, 0x5b, 0x3e, 0xba, 0xca, 0x96, 0xcd, 0x84, 0xf6, 0x99, 0x7f, 0xe1,
+	0x5e, 0x4c, 0xfc, 0xa7, 0x1b, 0x96, 0x6d, 0x31, 0xd1, 0x34, 0x9c, 0x8e, 0xee, 0x36, 0x8e, 0xf9,
+	0x5a, 0x3f, 0xc7, 0xd3, 0xfb, 0x50, 0x0d, 0x86, 0x93, 0x41, 0xd0, 0x0b, 0xe2, 0xfa, 0x76, 0x31,
+	0xc7, 0x64, 0x60, 0xfa, 0x31, 0xd0, 0x2c, 0xa5, 0xfb, 0x3f, 0xc5, 0xfe, 0x28, 0xc2, 0x83, 0xec,
+	0xc8, 0x68, 0xd8, 0x4e, 0x31, 0x2c, 0x45, 0xd0, 0x6f, 0x61, 0x3b, 0xaf, 0x00, 0xa3, 0x9e, 0x1f,
+	0xc5, 0xe3, 0xb0, 0xbe, 0x27, 0xef, 0xae, 0x7c, 0x6c, 0x3d, 0x41, 0xb7, 0xbd, 0xf0, 0xb5, 0x1f,
+	0x72, 0x92, 0xf2, 0xa5, 0x70, 0xad, 0x05, 0xd5, 0xd4, 0x31, 0xe8, 0x2e, 0x90, 0xae, 0xf5, 0xcc,
+	0xb2, 0x9f, 0x5b, 0xe2, 0x44, 0x37, 0xbb, 0xcc, 0x61, 0x2e, 0xb9, 0x46, 0x09, 0xac, 0xbb, 0xac,
+	0xdd, 0x31, 0x75, 0x97, 0x09, 0xa3, 0xe9, 0x90, 0x0a, 0xa5, 0xb0, 0xa9, 0xb7, 0x3b, 0xc2, 0x69,
+	0x70, 0xa3, 0xe3, 0x4a, 0xd8, 0x82, 0x36, 0x81, 0xad, 0x92, 0x51, 0xe8, 0x36, 0xcc, 0x9a, 0x85,
+	0x5c, 0x93, 0x20, 0xbd, 0x5d, 0x00, 0x55, 0xe8, 0x0d, 0xd8, 0x91, 0x20, 0xb9, 0x63, 0x8e, 0x58,
+	0xa0, 0xef, 0xc1, 0xad, 0x02, 0xa2, 0xa3, 0x73, 0x66, 0xb9, 0x39, 0x7e, 0x51, 0x6b, 0xab, 0x74,
+	0x2a, 0x6b, 0xcb, 0xbc, 0x74, 0xf8, 0x31, 0x2c, 0x63, 0x79, 0x54, 0x29, 0x70, 0xed, 0xc9, 0x8d,
+	0x2b, 0xee, 0x92, 0x2b, 0x2a, 0xed, 0x37, 0xb0, 0xdd, 0xf4, 0xa3, 0x9e, 0x3f, 0xea, 0x7b, 0xa3,
+	0xd8, 0xf5, 0xce, 0xaf, 0x94, 0x4b, 0x60, 0x31, 0xf6, 0xce, 0x93, 0xc4, 0x8a, 0xff, 0x6a, 0x1c,
+	0xae, 0x1f, 0xa2, 0xa3, 0x9b, 0xd2, 0xd1, 0x1b, 0x4d, 0x2f, 0xf6, 0x94, 0xa3, 0xef, 0xc2, 0x72,
+	0xb1, 0x98, 0xab, 0x05, 0x7d, 0x00, 0x1b, 0x7e, 0x18, 0x8e, 0x43, 0x31, 0xf4, 0xa3, 0xc8, 0x3b,
+	0x57, 0x35, 0xaa, 0xc6, 0xd7, 0x25, 0xb0, 0xad, 0x60, 0xda, 0x10, 0x36, 0xdb, 0x7e, 0x3f, 0xf0,
+	0xbe, 0x9b, 0xfa, 0xa1, 0x2a, 0xdf, 0x1f, 0xc3, 0x56, 0x10, 0x45, 0x53, 0xbc, 0xf3, 0x48, 0x48,
+	0x5a, 0x29, 0x36, 0x73, 0xa7, 0x0d, 0x85, 0xd5, 0x23, 0x86, 0x38, 0x54, 0x3d, 0xbe, 0x98, 0xf8,
+	0x89, 0x9e, 0xf2, 0x7f, 0x5a, 0x87, 0xd5, 0x33, 0xdf, 0x8b, 0xa7, 0x21, 0x56, 0x74, 0x04, 0xa7,
+	0x4b, 0xed, 0xdf, 0x16, 0x00, 0xf4, 0x98, 0x4f, 0x07, 0xfe, 0x95, 0xad, 0xc2, 0x51, 0x26, 0x10,
+	0x43, 0xe3, 0xc1, 0x25, 0x73, 0xa6, 0xcc, 0x07, 0x87, 0x83, 0x71, 0xef, 0xb5, 0x0c, 0x8b, 0xcd,
+	0x8e, 0xce, 0x1d, 0x26, 0x74, 0x47, 0x30, 0xce, 0x6d, 0x9e, 0x68, 0x71, 0x04, 0x64, 0x88, 0x47,
+	0x13, 0x3f, 0xe0, 0xd9, 0x44, 0x34, 0xf1, 0x7b, 0xb2, 0x02, 0x5d, 0xf6, 0xde, 0x59, 0x0b, 0xf0,
+	0xcd, 0xe1, 0xcc, 0x5a, 0xeb, 0x41, 0x2d, 0xdb, 0x0b, 0x9d, 0x72, 0x76, 0x37, 0x72, 0x8d, 0xee,
+	0xc0, 0x56, 0x06, 0x33, 0x8e, 0x2c, 0x9b, 0x33, 0xe5, 0xbd, 0x19, 0x90, 0x77, 0x4d, 0xe6, 0x90,
+	0x05, 0x7a, 0x13, 0xae, 0x67, 0xb0, 0x26, 0x6b, 0x98, 0x3a, 0xd7, 0x5d, 0xc3, 0xb6, 0x1c, 0xb2,
+	0xa8, 0xfd, 0xe7, 0x02, 0xac, 0x36, 0xa2, 0x48, 0x9a, 0xe5, 0xb7, 0xb0, 0xee, 0xc5, 0x22, 0x9c,
+	0x0e, 0x7c, 0xa5, 0xb5, 0x6a, 0x62, 0x6e, 0x5e, 0x69, 0x0a, 0x0e, 0x5e, 0x6e, 0xd3, 0xaf, 0x61,
+	0x33, 0x18, 0x7a, 0xe7, 0xb2, 0xfa, 0x14, 0x0f, 0x7d, 0x55, 0x09, 0x5a, 0x97, 0xd4, 0x69, 0xd7,
+	0xf3, 0x14, 0x36, 0xce, 0xc6, 0xa3, 0x38, 0x67, 0x5e, 0x7a, 0x2b, 0xf3, 0x1a, 0x12, 0xa7, 0xbc,
+	0xbf, 0x90, 0x25, 0x0c, 0x29, 0x7c, 0xe1, 0x0d, 0x27, 0x9f, 0x7b, 0xfd, 0x48, 0x96, 0xc8, 0x2a,
+	0x4f, 0x3b, 0x55, 0x5f, 0x57, 0x60, 0xcc, 0x44, 0x19, 0xe9, 0x6b, 0xff, 0xe2, 0x2c, 0x94, 0x4d,
+	0xc4, 0x8a, 0x24, 0xde, 0x4e, 0x31, 0xcf, 0x52, 0x84, 0xca, 0xe4, 0x79, 0xea, 0x5d, 0x95, 0x4e,
+	0x55, 0x04, 0x69, 0xff, 0xb2, 0x08, 0xb5, 0x46, 0xdf, 0x8b, 0x3d, 0xa9, 0xc9, 0x3d, 0xec, 0x3a,
+	0x7e, 0x12, 0x2f, 0x2f, 0x62, 0xd9, 0x02, 0x56, 0x1e, 0x2f, 0x3f, 0x5d, 0xf8, 0xf8, 0x09, 0xaf,
+	0x0e, 0xbd, 0x9f, 0x0e, 0x11, 0x46, 0x9f, 0x00, 0xc5, 0x13, 0x4a, 0x02, 0x11, 0x8c, 0x7a, 0x83,
+	0x69, 0xdf, 0xef, 0xd7, 0x6b, 0x85, 0x26, 0x8e, 0x4c, 0xc3, 0x81, 0xa4, 0x35, 0x12, 0x2c, 0xfd,
+	0x08, 0x68, 0x26, 0x54, 0xda, 0x46, 0xd6, 0x0b, 0x15, 0x54, 0x5b, 0xa9, 0x64, 0xdc, 0x1e, 0x0b,
+	0xc6, 0x4c, 0xc3, 0xd2, 0x43, 0xc5, 0x92, 0xe6, 0x36, 0x6f, 0x58, 0xa4, 0xba, 0xd8, 0x79, 0x48,
+	0xf4, 0x4c, 0x41, 0x03, 0x09, 0x52, 0xc1, 0xfd, 0x19, 0x54, 0xb1, 0xf4, 0xc8, 0xcb, 0x58, 0x9d,
+	0x7b, 0x19, 0x89, 0xdb, 0xf0, 0xd5, 0x5e, 0xe2, 0x3f, 0x8f, 0x60, 0xeb, 0xc7, 0x57, 0x41, 0xec,
+	0x47, 0x13, 0xaf, 0x87, 0x95, 0x7b, 0x70, 0x21, 0xcb, 0x5a, 0x95, 0x6f, 0xe6, 0x60, 0x7b, 0x34,
+	0xb8, 0xa0, 0x7f, 0x9a, 0xad, 0xac, 0x45, 0x45, 0x96, 0xa4, 0xcf, 0x3d, 0x2c, 0x6d, 0x35, 0x37,
+	0xff, 0xcc, 0xd4, 0xdf, 0x46, 0xa6, 0xb9, 0xf6, 0xf7, 0x05, 0xa8, 0xe9, 0xc3, 0x89, 0xe9, 0x5d,
+	0x8c, 0xa7, 0x31, 0x35, 0x61, 0x3b, 0x9a, 0x4e, 0x26, 0xe3, 0x10, 0x77, 0x1a, 0x48, 0x98, 0x6a,
+	0xcf, 0x37, 0x2f, 0x75, 0x38, 0x19, 0xd3, 0x81, 0xfa, 0xc3, 0x49, 0xc6, 0xa9, 0x00, 0x78, 0x81,
+	0xd7, 0xfb, 0xfe, 0x59, 0x30, 0xf2, 0xb1, 0x28, 0x9f, 0x79, 0xd3, 0x41, 0x2c, 0x7e, 0x0c, 0xfa,
+	0xf1, 0xab, 0xe4, 0x71, 0xb1, 0x93, 0x20, 0x9b, 0x0a, 0xf7, 0x1c, 0x51, 0xf4, 0x73, 0xd8, 0x2b,
+	0xf3, 0xbc, 0xf2, 0x83, 0xf3, 0x57, 0x71, 0xd2, 0x98, 0xee, 0xce, 0x32, 0x1d, 0x4b, 0x9c, 0xf6,
+	0xb7, 0x0a, 0xac, 0x24, 0x47, 0x58, 0x83, 0xd5, 0xa4, 0x70, 0x91, 0x6b, 0x74, 0x03, 0x6a, 0x96,
+	0x8d, 0x75, 0xc2, 0xd4, 0x4f, 0x49, 0x85, 0xd6, 0x60, 0xb9, 0x65, 0xbc, 0x60, 0x4d, 0xb2, 0x80,
+	0x95, 0x4c, 0xfe, 0x2b, 0x8e, 0x99, 0x71, 0x74, 0xec, 0x92, 0x45, 0xba, 0x09, 0xc0, 0x99, 0xd3,
+	0xb1, 0x2d, 0xc7, 0x38, 0x61, 0x64, 0x09, 0x79, 0x1b, 0xb6, 0xe5, 0xea, 0x86, 0xc5, 0x38, 0x59,
+	0xa6, 0x55, 0x58, 0x6a, 0x19, 0xa6, 0x49, 0x56, 0x10, 0xd1, 0x32, 0xd9, 0x0b, 0x61, 0xb8, 0xac,
+	0x4d, 0x56, 0xa5, 0x50, 0xb3, 0x6b, 0x34, 0x49, 0x15, 0x31, 0x86, 0xe5, 0x72, 0xc3, 0x72, 0x8c,
+	0x06, 0xa9, 0x69, 0x53, 0xd8, 0x9c, 0xad, 0xb9, 0xf4, 0x6b, 0x58, 0x19, 0xca, 0xff, 0x12, 0xa3,
+	0x3e, 0x7c, 0x6b, 0x89, 0x3e, 0x48, 0x2a, 0x75, 0xc2, 0xa3, 0xbd, 0x0f, 0x2b, 0x89, 0x9c, 0x99,
+	0x43, 0x6e, 0x02, 0xe8, 0x5d, 0xd7, 0x76, 0x1a, 0xdc, 0x36, 0x4d, 0x52, 0xd1, 0xfe, 0xa7, 0x02,
+	0xeb, 0x8d, 0x57, 0xc1, 0xa0, 0xef, 0x7a, 0xe7, 0x49, 0xaa, 0xaa, 0xe7, 0x7e, 0x3e, 0x9a, 0x0e,
+	0x45, 0x0f, 0xb1, 0x22, 0xf6, 0xce, 0xf3, 0xc0, 0xfb, 0x8c, 0x5f, 0xcf, 0x68, 0xac, 0xe9, 0x30,
+	0xe5, 0x8f, 0xe8, 0x53, 0xb8, 0x75, 0x16, 0x84, 0x51, 0x9c, 0x33, 0xc9, 0xd7, 0x44, 0xf2, 0x12,
+	0x50, 0x15, 0x65, 0x4f, 0x52, 0xa4, 0x3c, 0xf8, 0xa8, 0x50, 0x2f, 0x82, 0x4f, 0x60, 0x77, 0x2e,
+	0x97, 0x2a, 0x38, 0xdb, 0xbd, 0x4b, 0x0c, 0x87, 0x70, 0x27, 0xd7, 0x74, 0x18, 0x8c, 0xca, 0xda,
+	0x2e, 0x65, 0xda, 0xe6, 0x27, 0x6a, 0x07, 0xa3, 0xa2, 0xc2, 0xda, 0xf7, 0xb0, 0xc9, 0xfd, 0x33,
+	0x3f, 0xf4, 0x47, 0x3d, 0xbf, 0x33, 0x0e, 0x46, 0x31, 0xd5, 0x60, 0x03, 0x15, 0x90, 0xe9, 0xa0,
+	0x50, 0xca, 0xd6, 0x62, 0x65, 0x1f, 0xeb, 0xdd, 0x8f, 0xdf, 0x3d, 0x58, 0x99, 0x8e, 0x82, 0x1f,
+	0x92, 0xd7, 0x6f, 0x95, 0x27, 0x2b, 0xed, 0x5f, 0x97, 0x60, 0x23, 0xeb, 0xc5, 0xae, 0xac, 0x96,
+	0x75, 0x58, 0x7d, 0xe3, 0x87, 0xb2, 0x8f, 0x53, 0xf6, 0x4a, 0x97, 0x98, 0x62, 0xd3, 0x26, 0x16,
+	0x9b, 0xe6, 0x84, 0x28, 0x31, 0x4f, 0x8e, 0x39, 0x49, 0xc8, 0x3d, 0xd8, 0xcc, 0x5a, 0x42, 0x21,
+	0x0b, 0x70, 0x55, 0x16, 0xe0, 0x0f, 0x4b, 0x6e, 0x34, 0xa3, 0x52, 0xbe, 0x52, 0x75, 0xb8, 0xd1,
+	0x75, 0x5c, 0xbb, 0x2d, 0x98, 0xc9, 0xda, 0xcc, 0x72, 0xf9, 0x86, 0x5f, 0x44, 0x53, 0x06, 0xb7,
+	0x0b, 0x1a, 0xa9, 0x37, 0x71, 0x7f, 0x8a, 0xbd, 0xa9, 0x17, 0xa7, 0xd9, 0x3f, 0xed, 0x32, 0x6e,
+	0xe6, 0x94, 0x3a, 0x12, 0x36, 0x33, 0x3a, 0xda, 0x87, 0xcd, 0xac, 0x2d, 0x9d, 0xca, 0xc6, 0x66,
+	0x55, 0x6a, 0xfa, 0xc5, 0xcf, 0xd3, 0xb4, 0x8b, 0x2c, 0xc9, 0x00, 0x63, 0xe8, 0x8f, 0xe2, 0xa7,
+	0xcb, 0xaa, 0x69, 0xd8, 0x48, 0x85, 0x4a, 0x02, 0xed, 0x79, 0xc1, 0xfa, 0x52, 0xfb, 0x99, 0xb8,
+	0xa0, 0x50, 0x3a, 0x2b, 0xa9, 0x60, 0x17, 0x90, 0xc0, 0xd2, 0x3e, 0x56, 0xe5, 0x82, 0x63, 0xdb,
+	0x71, 0x85, 0xc3, 0xf8, 0x89, 0xd1, 0x60, 0x64, 0x51, 0xfb, 0x06, 0x6e, 0x5e, 0xa9, 0x0b, 0x06,
+	0xbc, 0x6a, 0x2a, 0x2a, 0x74, 0x1d, 0xaa, 0xec, 0x05, 0x6b, 0x77, 0x5c, 0x99, 0x53, 0xaa, 0xb0,
+	0x84, 0x4d, 0x2e, 0x59, 0xd4, 0xbe, 0x07, 0x38, 0x8e, 0x87, 0x83, 0xd6, 0x38, 0x1c, 0x7a, 0xb1,
+	0xf6, 0x27, 0x58, 0x6a, 0x8c, 0xfb, 0xd8, 0x2d, 0xae, 0xa7, 0x3d, 0x75, 0xc3, 0x6e, 0x32, 0x72,
+	0x8d, 0xae, 0xc2, 0xa2, 0xde, 0xee, 0x90, 0x0a, 0x2a, 0xae, 0xb7, 0x3b, 0x9f, 0xeb, 0xd8, 0x3f,
+	0x63, 0x1a, 0xc1, 0x05, 0x6b, 0xeb, 0x86, 0x49, 0x16, 0x25, 0xae, 0xa1, 0x5a, 0x90, 0x65, 0x94,
+	0xc1, 0x5e, 0x74, 0x18, 0x37, 0xf0, 0x40, 0xba, 0x49, 0x96, 0xb4, 0xbf, 0x6e, 0xc0, 0x6a, 0x1a,
+	0xe9, 0xbf, 0x87, 0xb5, 0x57, 0xf1, 0x70, 0x20, 0xce, 0xe4, 0xc6, 0xf5, 0xeb, 0x32, 0xc9, 0x94,
+	0xdf, 0x70, 0xb9, 0x66, 0x07, 0xa8, 0x16, 0x87, 0x57, 0x19, 0xa0, 0x34, 0x8b, 0x78, 0xf0, 0x8e,
+	0x59, 0xc4, 0xc3, 0x4b, 0xb3, 0x88, 0x9b, 0x50, 0x4d, 0x63, 0x3d, 0x09, 0x81, 0xd5, 0x58, 0x05,
+	0x38, 0xbd, 0x0d, 0xb5, 0x3c, 0x02, 0x55, 0x45, 0xae, 0x46, 0x69, 0xf8, 0x1d, 0x42, 0x15, 0xe1,
+	0x7d, 0x11, 0xf4, 0xeb, 0xf7, 0xa5, 0xa7, 0x94, 0xb5, 0x4e, 0x8e, 0x78, 0x80, 0xe4, 0x7d, 0xa3,
+	0xff, 0x74, 0xd5, 0xb2, 0xf1, 0xc6, 0x5c, 0xbe, 0x3a, 0x52, 0x10, 0xda, 0x28, 0x46, 0x87, 0x2c,
+	0xc5, 0xb7, 0x65, 0x29, 0xbe, 0xf3, 0x36, 0x9f, 0x2b, 0xf8, 0x7f, 0xd2, 0x59, 0xcf, 0x7b, 0x7e,
+	0xdd, 0xb9, 0xea, 0xf9, 0xf5, 0xf6, 0xd1, 0xc9, 0xaf, 0x61, 0xaf, 0x30, 0x11, 0xc9, 0xc7, 0x2e,
+	0x2a, 0x91, 0xd5, 0x0a, 0x29, 0x57, 0x2f, 0x20, 0x0b, 0xd9, 0x66, 0xb9, 0x98, 0x6d, 0xe8, 0xfb,
+	0xb0, 0xa9, 0xfe, 0x13, 0x3f, 0x7a, 0xe1, 0x28, 0x18, 0x9d, 0xcb, 0x81, 0x41, 0x95, 0x6f, 0x28,
+	0xe8, 0x73, 0x05, 0xc4, 0x16, 0x2f, 0xdf, 0x75, 0xe2, 0x85, 0xfe, 0x28, 0x4e, 0x5a, 0x96, 0xbc,
+	0xdd, 0xe9, 0x48, 0x30, 0x9e, 0xb6, 0x38, 0xb2, 0x49, 0x9e, 0x8f, 0x6a, 0xb2, 0xb2, 0x5d, 0x98,
+	0xda, 0x28, 0x04, 0x7d, 0x0e, 0x8f, 0x2f, 0x93, 0x8b, 0x68, 0x7a, 0x7e, 0xee, 0x47, 0x2a, 0x5d,
+	0x64, 0xa7, 0x90, 0xf3, 0x83, 0x1a, 0x7f, 0xff, 0x92, 0x10, 0x27, 0xa5, 0x2e, 0x1c, 0x99, 0x7e,
+	0x02, 0x3b, 0xe8, 0x44, 0x98, 0x44, 0x50, 0x4c, 0xaa, 0xc8, 0x86, 0x34, 0x3b, 0xcd, 0x51, 0x99,
+	0x26, 0x07, 0xb0, 0xd3, 0xcf, 0x5e, 0x68, 0xb2, 0xbc, 0x60, 0x67, 0x53, 0xbf, 0xab, 0x34, 0xef,
+	0x5f, 0x7a, 0xbc, 0xfd, 0x06, 0x6e, 0xce, 0x4e, 0x4b, 0x91, 0x25, 0xb5, 0xe2, 0x9e, 0x2a, 0x62,
+	0xc5, 0xa1, 0xa9, 0xeb, 0x9d, 0xa7, 0xe6, 0xbc, 0x03, 0xb5, 0xc8, 0x8b, 0x83, 0xe8, 0x2c, 0xf0,
+	0xa3, 0x74, 0x3a, 0x97, 0x01, 0xe8, 0x2d, 0xa8, 0xa6, 0x32, 0x93, 0xd1, 0x5c, 0xb6, 0x46, 0x9c,
+	0xff, 0x93, 0x6c, 0x4c, 0xa3, 0xfa, 0xbe, 0xc2, 0xa5, 0xeb, 0xf2, 0xdc, 0x63, 0xfb, 0x67, 0xcd,
+	0x3d, 0xe8, 0xdc, 0xb9, 0xc7, 0xaf, 0x61, 0xc7, 0xff, 0x49, 0x4d, 0x0f, 0xe4, 0x10, 0x38, 0x52,
+	0xdd, 0xa4, 0x56, 0x4c, 0xd5, 0xdb, 0x29, 0x05, 0x3e, 0x75, 0x23, 0xd9, 0x57, 0x66, 0x6f, 0xe2,
+	0xd5, 0x9f, 0xf3, 0x26, 0xc6, 0xcc, 0x80, 0xff, 0x48, 0x3b, 0x47, 0xf5, 0xaa, 0xb2, 0x83, 0x97,
+	0x3c, 0xba, 0x23, 0x7a, 0x00, 0xcb, 0xaa, 0x83, 0x5e, 0x97, 0x31, 0x57, 0x2f, 0xb7, 0xbf, 0x69,
+	0xdb, 0xcf, 0x15, 0x19, 0x7d, 0x0a, 0x50, 0xa8, 0xeb, 0x3b, 0x92, 0xa9, 0x3c, 0x01, 0x2e, 0x36,
+	0x31, 0xbc, 0xd6, 0xcb, 0x5a, 0x92, 0x2f, 0x60, 0x27, 0x0a, 0x5e, 0x0e, 0x82, 0xd1, 0x79, 0x24,
+	0x72, 0xdf, 0xa8, 0xbf, 0x57, 0x3c, 0x30, 0x4d, 0x29, 0x9a, 0x19, 0x01, 0xfd, 0x12, 0x76, 0x73,
+	0xf7, 0x1d, 0x78, 0x69, 0x4f, 0x53, 0xbf, 0x37, 0xc3, 0x98, 0x91, 0x98, 0x5e, 0xd2, 0xd3, 0xd0,
+	0x63, 0x20, 0x61, 0xda, 0x52, 0x88, 0x09, 0xf6, 0x14, 0xd1, 0x15, 0xa3, 0xa5, 0xd9, 0xce, 0x83,
+	0x6f, 0x85, 0x33, 0xeb, 0x08, 0xf3, 0x63, 0xf6, 0x2a, 0x01, 0x95, 0x1f, 0xa3, 0xe4, 0x35, 0xf2,
+	0x25, 0x80, 0x37, 0x9c, 0x24, 0x5d, 0x77, 0x32, 0x56, 0xac, 0x5f, 0xd5, 0x74, 0xf3, 0x9a, 0x97,
+	0x35, 0xed, 0xc7, 0x18, 0xef, 0xe1, 0x6b, 0x91, 0x7b, 0x7d, 0x54, 0xff, 0xe0, 0xe7, 0x4c, 0x80,
+	0xb6, 0x90, 0x2d, 0x1f, 0x74, 0x44, 0x5a, 0x0b, 0x56, 0x93, 0xf4, 0x8a, 0x45, 0x27, 0x49, 0xb0,
+	0xe4, 0x1a, 0xad, 0xc3, 0xae, 0x69, 0x58, 0xcf, 0x44, 0xcb, 0xb6, 0x5c, 0xe1, 0xb8, 0xa7, 0x26,
+	0x73, 0x8e, 0x19, 0xc3, 0x7a, 0xba, 0x0b, 0x44, 0xae, 0x85, 0xde, 0xee, 0x08, 0x55, 0x59, 0xc9,
+	0x82, 0xf6, 0x5f, 0x15, 0xd8, 0x68, 0x44, 0x91, 0xe9, 0x8f, 0xce, 0xe3, 0x57, 0xf3, 0x0a, 0x53,
+	0x65, 0x6e, 0x8a, 0x7f, 0x5b, 0x61, 0x9a, 0x79, 0x2d, 0x2e, 0x64, 0x6d, 0x60, 0xfe, 0x5a, 0xfc,
+	0x06, 0x6e, 0xe5, 0x2f, 0xbf, 0x89, 0x1f, 0x8a, 0x60, 0x34, 0x08, 0x46, 0xbe, 0x88, 0xe2, 0x8b,
+	0xe4, 0xbb, 0x84, 0xe2, 0xd8, 0x4b, 0x39, 0x3a, 0x7e, 0x68, 0x48, 0x12, 0x07, 0x29, 0x66, 0x6e,
+	0x66, 0x71, 0xe6, 0x66, 0xb4, 0xbf, 0x2e, 0xc3, 0xe6, 0x49, 0xaa, 0x25, 0xbe, 0xe1, 0x23, 0xfa,
+	0x21, 0x2c, 0x25, 0xed, 0xf3, 0xe2, 0x9c, 0xc7, 0x5e, 0xea, 0xb3, 0x92, 0x86, 0x7e, 0x31, 0x13,
+	0x39, 0x57, 0x47, 0x9b, 0x9c, 0x13, 0x17, 0x42, 0x8a, 0xc1, 0x3d, 0x6c, 0x81, 0x33, 0x22, 0x11,
+	0xfa, 0x6f, 0x02, 0x59, 0xdc, 0x92, 0x0c, 0xd3, 0x57, 0xc7, 0xe2, 0x77, 0x86, 0xc1, 0x28, 0xd7,
+	0x2f, 0x21, 0x4a, 0x32, 0x59, 0x9f, 0x7e, 0x0a, 0x54, 0x1e, 0xec, 0x2c, 0x18, 0xf8, 0x99, 0x08,
+	0x59, 0x10, 0x94, 0x41, 0x08, 0x62, 0x5b, 0xc1, 0xc0, 0x4f, 0x39, 0xe9, 0x87, 0xb0, 0x1d, 0xfb,
+	0xc3, 0xc9, 0x00, 0x1f, 0xfe, 0x99, 0x4d, 0xd4, 0xcc, 0x75, 0x2b, 0x45, 0xa4, 0x6f, 0xe8, 0x0f,
+	0x60, 0x4b, 0x5a, 0xb8, 0xf0, 0xda, 0x56, 0xe5, 0x63, 0x43, 0x81, 0x8b, 0x74, 0xbd, 0x30, 0x98,
+	0xc4, 0x39, 0xdd, 0x76, 0x42, 0x27, 0xc1, 0x29, 0xdd, 0xef, 0xd3, 0x81, 0x98, 0xf2, 0x94, 0xa8,
+	0x5e, 0x93, 0xf6, 0xba, 0x55, 0xae, 0xe1, 0x48, 0xa3, 0x5c, 0x23, 0x19, 0x96, 0xa9, 0x45, 0x84,
+	0x4f, 0x58, 0x25, 0x00, 0xf7, 0x09, 0xce, 0x30, 0xe7, 0x5d, 0xc8, 0x42, 0x72, 0x79, 0x48, 0x2f,
+	0x85, 0x38, 0x39, 0x19, 0x27, 0x7e, 0x09, 0x42, 0x3b, 0xf3, 0xeb, 0x0c, 0x91, 0xf2, 0xca, 0xe3,
+	0xf5, 0x4b, 0x33, 0xc3, 0x79, 0x95, 0xa8, 0xa9, 0xa6, 0xd4, 0x03, 0x19, 0x1b, 0xaa, 0x4d, 0xa1,
+	0x52, 0xda, 0x9d, 0xcb, 0x13, 0x83, 0x3c, 0x80, 0xf8, 0x46, 0xaf, 0xb8, 0xd4, 0x1e, 0xc2, 0x86,
+	0xd4, 0xbe, 0xe1, 0xc5, 0xfe, 0xf9, 0x38, 0xbc, 0xd0, 0x76, 0x92, 0x1e, 0xb3, 0xd8, 0x01, 0x6b,
+	0xff, 0xbc, 0x0f, 0x5b, 0x89, 0x63, 0x04, 0xe3, 0x91, 0x9a, 0x05, 0x7e, 0x0b, 0xd5, 0xc8, 0x7f,
+	0xe3, 0x87, 0x68, 0x96, 0x95, 0xb9, 0x93, 0xed, 0x12, 0xc7, 0x81, 0x93, 0x90, 0xa7, 0x4d, 0x78,
+	0xc6, 0x4f, 0xbf, 0x84, 0xa5, 0xde, 0xb8, 0xef, 0x27, 0xe1, 0xfc, 0xe0, 0x1d, 0x72, 0x64, 0x4c,
+	0x4b, 0x06, 0x7a, 0x1d, 0x96, 0x30, 0xf2, 0x92, 0x40, 0xae, 0x7c, 0xc6, 0xe5, 0x92, 0x12, 0x58,
+	0xec, 0x8d, 0x55, 0xf8, 0x2d, 0x73, 0xfc, 0x77, 0x26, 0x2a, 0x97, 0x67, 0xf3, 0xe5, 0x1e, 0xac,
+	0x4c, 0xbc, 0xd0, 0x1b, 0x46, 0xc9, 0xa8, 0x29, 0x59, 0xd1, 0xdf, 0x41, 0xb5, 0x97, 0x58, 0x25,
+	0x79, 0x1e, 0xdd, 0x9f, 0x77, 0xef, 0xa9, 0xe5, 0x94, 0x5a, 0x19, 0x0b, 0xbe, 0x77, 0xe5, 0x84,
+	0x05, 0x73, 0x71, 0xe8, 0x4f, 0xc6, 0x61, 0x2c, 0x62, 0x3f, 0x8a, 0xd5, 0x17, 0x0d, 0x39, 0x7d,
+	0xaa, 0xf1, 0x3d, 0xa4, 0xd0, 0x87, 0x13, 0x2e, 0xf1, 0xae, 0x1f, 0xc5, 0x72, 0x6e, 0xae, 0x7d,
+	0x05, 0xd5, 0xd4, 0x58, 0xc5, 0x01, 0xba, 0xc3, 0x4e, 0x18, 0x37, 0xdc, 0x53, 0x72, 0xad, 0xf8,
+	0x76, 0x58, 0x83, 0xd5, 0xe7, 0x3a, 0xb7, 0x0c, 0xeb, 0x88, 0x2c, 0x69, 0x7f, 0xbf, 0x73, 0xe5,
+	0x1b, 0xa1, 0x0e, 0xbb, 0x86, 0x75, 0xa2, 0x9b, 0x46, 0x53, 0x34, 0xed, 0x86, 0x7b, 0xda, 0x61,
+	0xe2, 0xd8, 0x6d, 0x9b, 0x64, 0x4c, 0x6f, 0xc2, 0xf5, 0xb6, 0x6e, 0x35, 0x75, 0xd7, 0xe6, 0xa7,
+	0xc2, 0xd5, 0x8f, 0x44, 0xdb, 0x70, 0x1c, 0x94, 0x57, 0xa1, 0xb7, 0xe1, 0x06, 0x02, 0x38, 0xfb,
+	0xae, 0x6b, 0x70, 0xd6, 0x14, 0x87, 0xa7, 0x19, 0xb2, 0x4e, 0x1f, 0xc0, 0xbd, 0x64, 0x67, 0x71,
+	0x15, 0x91, 0x49, 0x6f, 0xc0, 0x0e, 0x22, 0xd9, 0x8b, 0x86, 0xd9, 0x6d, 0x2a, 0xa4, 0xab, 0x1f,
+	0x11, 0x7c, 0x29, 0xd7, 0x53, 0x6e, 0xf6, 0xc2, 0x65, 0x96, 0x63, 0xd8, 0x96, 0xe8, 0x5a, 0x5d,
+	0x87, 0x35, 0x89, 0x8d, 0xc7, 0xbe, 0x04, 0x75, 0xe9, 0x63, 0x78, 0x78, 0x99, 0xa7, 0xc9, 0x3a,
+	0x9c, 0x35, 0x74, 0x97, 0x35, 0xc5, 0x09, 0xe3, 0x08, 0x22, 0x1d, 0x94, 0x6e, 0xd9, 0x96, 0x30,
+	0x5d, 0x27, 0xfd, 0xa6, 0xa0, 0xb7, 0x5c, 0xc6, 0x11, 0x40, 0x26, 0x88, 0xbd, 0x84, 0x49, 0xc8,
+	0xc9, 0x0f, 0xf4, 0x2e, 0xdc, 0xd4, 0x5d, 0x97, 0x17, 0x0e, 0xd4, 0x75, 0xb3, 0x13, 0xfd, 0x0e,
+	0xdf, 0x83, 0x4d, 0xc3, 0xd1, 0x4d, 0xd3, 0x7e, 0xce, 0x9a, 0xf2, 0x30, 0x0b, 0xf4, 0x16, 0xec,
+	0x1d, 0x31, 0x8b, 0x71, 0xdd, 0x14, 0x25, 0xdc, 0xaf, 0xd0, 0xbc, 0x05, 0x58, 0xb2, 0x27, 0xa2,
+	0x5e, 0xe0, 0x33, 0xb2, 0x80, 0xc2, 0x4d, 0xc9, 0x62, 0x99, 0x5e, 0x95, 0x45, 0x44, 0x7d, 0x47,
+	0xf7, 0x80, 0xa6, 0x77, 0x28, 0x35, 0x94, 0xdf, 0x31, 0xc8, 0x12, 0x1a, 0xb9, 0xd9, 0xed, 0x98,
+	0x06, 0x5a, 0x41, 0x62, 0x8c, 0xc3, 0xae, 0xcb, 0xc8, 0x5f, 0xe8, 0x7d, 0xb8, 0x9b, 0x13, 0xce,
+	0xdc, 0x90, 0xa9, 0x9f, 0xda, 0x5d, 0x97, 0xdc, 0xc6, 0xd3, 0x26, 0x67, 0x4b, 0x60, 0xb9, 0x00,
+	0x87, 0x04, 0x78, 0x32, 0xa3, 0xdd, 0x31, 0x0d, 0xd6, 0x4c, 0xd1, 0x89, 0x06, 0x64, 0x0f, 0xcd,
+	0xe8, 0x74, 0x58, 0xc3, 0x68, 0xcd, 0xc1, 0xde, 0x42, 0xce, 0xdc, 0xad, 0xa4, 0x16, 0xa9, 0x0d,
+	0x97, 0xe9, 0x3e, 0xdc, 0xc9, 0x71, 0xb6, 0xc5, 0xec, 0xd6, 0x2c, 0xc5, 0x9d, 0x59, 0x0a, 0xdd,
+	0x3a, 0x2d, 0x53, 0xbc, 0x9a, 0x3d, 0x74, 0x13, 0x1f, 0xb2, 0xf2, 0xee, 0xbf, 0x46, 0x4f, 0xcf,
+	0x11, 0x5d, 0xcb, 0xf8, 0xae, 0xcb, 0xa4, 0xbd, 0x57, 0x50, 0xe8, 0x3c, 0x8c, 0x48, 0x03, 0xa8,
+	0x8d, 0x7e, 0xf7, 0x9c, 0xdb, 0xd6, 0x51, 0xfa, 0x71, 0x08, 0xf9, 0x56, 0x71, 0xab, 0xbc, 0x5d,
+	0x11, 0xae, 0x6d, 0x0b, 0xd3, 0xb6, 0x8e, 0xc8, 0x13, 0x74, 0xc8, 0x02, 0x42, 0xb7, 0x9a, 0xc2,
+	0xb0, 0x4c, 0xc3, 0x62, 0xc9, 0xb5, 0x65, 0x94, 0x67, 0x78, 0xab, 0xf3, 0x51, 0xe7, 0x28, 0x24,
+	0x3f, 0x6a, 0xa3, 0xa9, 0xbb, 0x7a, 0x7a, 0x4a, 0x61, 0x73, 0x61, 0x58, 0x0d, 0x9b, 0x73, 0xd6,
+	0x70, 0x49, 0x0d, 0x0d, 0xae, 0xf0, 0x27, 0x86, 0x6d, 0xea, 0x2e, 0x73, 0xc4, 0xa1, 0xa9, 0x37,
+	0x9e, 0x99, 0x86, 0xe3, 0x92, 0xf7, 0xe8, 0x43, 0xd8, 0x47, 0x27, 0x7e, 0x7e, 0x6c, 0xb8, 0xcc,
+	0xe9, 0xe8, 0x0d, 0x96, 0x08, 0x63, 0x56, 0xc3, 0xee, 0x5a, 0x2e, 0xe3, 0xac, 0x49, 0x78, 0xd1,
+	0x87, 0xbe, 0x75, 0x6c, 0x4b, 0xd1, 0x90, 0xef, 0xa5, 0x2f, 0xe6, 0x91, 0x24, 0x1d, 0x6e, 0x4d,
+	0xfa, 0x7a, 0x0e, 0x44, 0x63, 0xac, 0xd3, 0x03, 0xf8, 0x30, 0x57, 0xb7, 0xc3, 0xed, 0x0e, 0xe3,
+	0x6e, 0x16, 0xf1, 0xa2, 0xc5, 0xed, 0x76, 0xd1, 0x39, 0x37, 0xf1, 0x78, 0xe9, 0x86, 0x19, 0xb5,
+	0xf2, 0x47, 0xc3, 0x2a, 0x52, 0x6e, 0xd1, 0x2d, 0x58, 0x4b, 0xc5, 0x74, 0xb9, 0x49, 0x1e, 0x20,
+	0x20, 0x65, 0x45, 0xc0, 0xc3, 0x62, 0x12, 0xeb, 0x72, 0x13, 0xe5, 0xb9, 0x76, 0xc3, 0x36, 0xc9,
+	0xfb, 0xf4, 0x3a, 0x6c, 0x17, 0xa2, 0xa6, 0x69, 0xb7, 0x75, 0xc3, 0x22, 0xdf, 0x60, 0x02, 0x2b,
+	0x80, 0x39, 0x33, 0x75, 0xd7, 0x38, 0x61, 0x52, 0xda, 0x67, 0xf4, 0x7d, 0xb8, 0x5f, 0x40, 0x66,
+	0xca, 0xcd, 0xaa, 0x45, 0xd0, 0xea, 0xed, 0xae, 0xdb, 0xd5, 0x4d, 0xf3, 0x54, 0xe5, 0x31, 0x07,
+	0x45, 0x20, 0x89, 0x43, 0xb6, 0xd1, 0xea, 0x5d, 0x8b, 0x39, 0x0d, 0xbd, 0x83, 0x16, 0xca, 0xbe,
+	0x6a, 0xce, 0xc8, 0xa0, 0x54, 0x83, 0xf7, 0x32, 0x5c, 0x47, 0xe7, 0xae, 0xa1, 0x9b, 0x25, 0x9a,
+	0x1d, 0x74, 0x91, 0x4b, 0xfc, 0x96, 0xde, 0x66, 0x64, 0x97, 0x7e, 0x04, 0x8f, 0xd0, 0x0f, 0x2c,
+	0xc7, 0x70, 0x5c, 0x74, 0xcb, 0xae, 0x65, 0xb8, 0x8e, 0x68, 0xd9, 0x5c, 0x3c, 0x37, 0x9a, 0xee,
+	0xb1, 0xf4, 0xbc, 0x64, 0x02, 0x7d, 0xbd, 0x74, 0x66, 0xf4, 0x6f, 0xdd, 0x6a, 0x30, 0xc7, 0xb5,
+	0x39, 0xb9, 0x21, 0x0f, 0x93, 0xdd, 0x9e, 0xa9, 0x3b, 0xae, 0x68, 0x1c, 0x1b, 0xa6, 0xba, 0xdb,
+	0xd3, 0xd9, 0x98, 0x9d, 0xe1, 0xbc, 0x87, 0x07, 0x9d, 0x8f, 0x13, 0xcf, 0x0d, 0xf7, 0x58, 0x1c,
+	0x1b, 0x96, 0x4b, 0xf6, 0xd1, 0xa6, 0x52, 0xf1, 0x82, 0x06, 0x87, 0xa7, 0x62, 0x36, 0x85, 0x90,
+	0xfb, 0xf4, 0x11, 0x3c, 0x98, 0x43, 0x56, 0xce, 0x26, 0x44, 0x43, 0x7d, 0xb3, 0x08, 0x10, 0x56,
+	0xb7, 0x9d, 0xab, 0xeb, 0x90, 0xaf, 0x30, 0xa0, 0x73, 0x6c, 0xdb, 0xb0, 0xca, 0x14, 0x5d, 0x4c,
+	0x6f, 0x85, 0x3d, 0x32, 0x94, 0x32, 0xec, 0x6f, 0xb0, 0x86, 0x15, 0xd0, 0x2d, 0x83, 0x17, 0x0d,
+	0xa2, 0x88, 0x9e, 0xca, 0xb4, 0x91, 0x13, 0xb5, 0x75, 0xab, 0xdb, 0xd2, 0x1b, 0x6e, 0x57, 0x66,
+	0x52, 0xbb, 0x79, 0x4a, 0xfe, 0x80, 0x31, 0x91, 0x73, 0x35, 0x6d, 0xe6, 0x08, 0xf9, 0xea, 0xd1,
+	0x5d, 0xc3, 0x69, 0x9d, 0x0a, 0xce, 0x5a, 0x8c, 0x33, 0xab, 0xc1, 0x44, 0xc7, 0x46, 0x2b, 0x1d,
+	0xa2, 0x95, 0x72, 0x5b, 0x96, 0xd0, 0x59, 0x8a, 0x6b, 0x48, 0xe5, 0xb3, 0x7c, 0x55, 0x96, 0xd2,
+	0xc4, 0x1b, 0x91, 0x5a, 0xda, 0xae, 0xc8, 0x6e, 0xdb, 0x16, 0xc7, 0xfa, 0x09, 0x13, 0x8e, 0x71,
+	0x68, 0x1a, 0xd6, 0x91, 0x43, 0x9e, 0xa3, 0xf6, 0xaa, 0x3c, 0xcf, 0xee, 0xd2, 0xb0, 0xad, 0x96,
+	0x69, 0x34, 0x5c, 0xc2, 0xe8, 0x97, 0xf0, 0xab, 0x9f, 0xaf, 0xbd, 0x40, 0xdd, 0xba, 0xa6, 0xce,
+	0x49, 0x0b, 0xbd, 0xfa, 0x50, 0x77, 0x54, 0x0e, 0x6d, 0x77, 0x1d, 0x57, 0x60, 0xaa, 0x60, 0x98,
+	0x3e, 0x4c, 0x13, 0x63, 0xcc, 0x21, 0x16, 0x7d, 0x0f, 0x6e, 0xa5, 0x41, 0x9d, 0xd5, 0x9f, 0xac,
+	0x78, 0x13, 0x07, 0x6f, 0xa0, 0x98, 0xd8, 0xe7, 0x11, 0x79, 0x32, 0xa5, 0xdb, 0x8d, 0x6e, 0x5b,
+	0xa6, 0x64, 0xdb, 0x16, 0x0d, 0xbb, 0xdd, 0x31, 0xd9, 0x0b, 0x72, 0x82, 0x8d, 0x4e, 0x96, 0x11,
+	0xdc, 0xd6, 0x57, 0xe4, 0xff, 0xcb, 0xdb, 0x4a, 0x69, 0x1d, 0xe3, 0x8f, 0x4c, 0x98, 0x46, 0xdb,
+	0x70, 0x31, 0x72, 0x19, 0x6b, 0xb2, 0x26, 0x19, 0xd0, 0x6d, 0xd8, 0x68, 0xb2, 0x13, 0xd1, 0xb6,
+	0x9b, 0x4c, 0xd8, 0x96, 0x79, 0x4a, 0x86, 0x98, 0x15, 0x55, 0x4e, 0x72, 0x98, 0xbc, 0x80, 0xb6,
+	0xfc, 0x45, 0xc0, 0x08, 0xb5, 0x6f, 0x38, 0x8e, 0x70, 0x4e, 0x2d, 0x57, 0x7f, 0x21, 0xf2, 0xe2,
+	0x2b, 0x3f, 0xf3, 0x92, 0xbb, 0xe8, 0xc7, 0x05, 0xbc, 0xe3, 0x72, 0xfd, 0x54, 0xb8, 0x5c, 0x37,
+	0xd0, 0xf8, 0xe2, 0x50, 0x6f, 0x3c, 0x73, 0x4c, 0xdd, 0x39, 0x26, 0x1f, 0xe0, 0x31, 0x0b, 0x84,
+	0x32, 0x1d, 0xb7, 0x0d, 0x4b, 0xa6, 0xd5, 0x86, 0xdd, 0x96, 0x63, 0xe5, 0x47, 0x68, 0xcf, 0xab,
+	0x88, 0x1c, 0x97, 0xa3, 0x4f, 0x3c, 0x46, 0x4d, 0x0b, 0x34, 0x87, 0xba, 0x4a, 0x8d, 0xbf, 0xa0,
+	0x9f, 0xc0, 0x47, 0x05, 0x38, 0x56, 0x54, 0xc3, 0xc2, 0xfb, 0xc0, 0xb6, 0x4b, 0xd8, 0x2d, 0xf1,
+	0x5d, 0x57, 0x37, 0x55, 0x6c, 0x49, 0xd5, 0x3f, 0x2c, 0x6d, 0x96, 0xf5, 0x86, 0xf9, 0xa7, 0x6a,
+	0xf2, 0x11, 0xfa, 0xe9, 0x0c, 0x8d, 0xb2, 0x3b, 0xd6, 0xdb, 0x02, 0xd9, 0x2f, 0x4b, 0x56, 0x90,
+	0x9d, 0xa9, 0xdc, 0xdd, 0x61, 0xdd, 0xa6, 0x2d, 0x1c, 0x66, 0xb2, 0x06, 0xe6, 0x90, 0x8f, 0xe9,
+	0x3d, 0xb8, 0x5d, 0x20, 0x4c, 0xaf, 0x3c, 0x23, 0x38, 0x28, 0x99, 0x49, 0x7a, 0x76, 0x86, 0x16,
+	0x8e, 0xab, 0x73, 0x97, 0x7c, 0x42, 0x3f, 0x83, 0x8f, 0x67, 0xcc, 0x24, 0xbf, 0xb3, 0x63, 0xe9,
+	0xed, 0x74, 0x5d, 0xc1, 0x19, 0xa6, 0x7e, 0x07, 0xf7, 0xcf, 0xe4, 0x7e, 0x8a, 0x89, 0x6d, 0xce,
+	0xc6, 0x68, 0xb9, 0xcf, 0x4b, 0xb8, 0x62, 0xc1, 0xf9, 0x75, 0x49, 0x9f, 0xb9, 0xb5, 0xe7, 0x0b,
+	0xf4, 0xb8, 0x02, 0xd1, 0xe5, 0x32, 0xf4, 0x7b, 0xfa, 0x01, 0x68, 0xf3, 0x29, 0x66, 0x2a, 0xd2,
+	0x97, 0x18, 0xd1, 0x73, 0xdd, 0xcd, 0xe5, 0xf9, 0x61, 0x7e, 0x5b, 0xb2, 0x62, 0xb9, 0xb8, 0x92,
+	0x3f, 0x96, 0xb6, 0xbb, 0x54, 0x7d, 0x2d, 0x5b, 0x76, 0x0c, 0xa2, 0x64, 0xc8, 0x59, 0x0f, 0x11,
+	0xc7, 0x3a, 0xe6, 0x81, 0xd9, 0xdf, 0x2e, 0xfc, 0x3f, 0xfa, 0x07, 0xf8, 0x7a, 0xfe, 0x49, 0x4a,
+	0xdc, 0x32, 0x1d, 0x1c, 0x62, 0x21, 0x73, 0x8c, 0x26, 0x13, 0xcf, 0xd8, 0x69, 0x8b, 0x63, 0x36,
+	0xfd, 0x13, 0x7d, 0x02, 0x07, 0xf3, 0x25, 0xa4, 0x34, 0x97, 0x78, 0xfe, 0x5c, 0xb2, 0x4b, 0x5b,
+	0x37, 0x5b, 0x36, 0x6f, 0x63, 0x2e, 0x66, 0x4d, 0x43, 0x17, 0xdf, 0x75, 0x19, 0x3f, 0x25, 0x2f,
+	0x4b, 0x54, 0xc5, 0x94, 0x2d, 0xc9, 0xf0, 0xcd, 0x43, 0x7a, 0x25, 0x67, 0xbd, 0x44, 0xd5, 0x62,
+	0x3a, 0xa6, 0x76, 0xd2, 0xc7, 0xc6, 0x65, 0x3e, 0xe1, 0x6c, 0x1b, 0x43, 0x8e, 0x52, 0x0f, 0xc2,
+	0x14, 0xe3, 0x60, 0x73, 0x60, 0x9e, 0x0a, 0x8b, 0x39, 0x2e, 0x6b, 0x92, 0xd7, 0x57, 0x1f, 0xb7,
+	0xd4, 0x0c, 0xe5, 0x45, 0xf4, 0xb8, 0x74, 0x2f, 0x19, 0x61, 0x81, 0x19, 0xa9, 0x65, 0x8f, 0xa0,
+	0xa2, 0xd9, 0xa0, 0x9f, 0xc2, 0x2f, 0xdf, 0xc1, 0xe2, 0xda, 0x47, 0xcc, 0x3d, 0x66, 0xaa, 0x5c,
+	0x93, 0x6f, 0x65, 0xcd, 0x9a, 0xc3, 0x91, 0xe4, 0x5f, 0x27, 0xbd, 0xd0, 0x86, 0x0a, 0xf2, 0x67,
+	0xda, 0x10, 0x48, 0x79, 0xd2, 0xf1, 0x8f, 0xbf, 0xdc, 0xf7, 0x61, 0xad, 0x38, 0x58, 0x91, 0x0f,
+	0x78, 0x5e, 0x04, 0x69, 0x7f, 0x81, 0xb5, 0xc2, 0x74, 0xe6, 0x1f, 0xdf, 0x69, 0x0f, 0x56, 0x92,
+	0x69, 0xa1, 0xfa, 0x58, 0x94, 0xac, 0xb4, 0x3f, 0xc3, 0x76, 0xfa, 0x2b, 0xb5, 0x4e, 0x38, 0x4e,
+	0x46, 0x56, 0x4f, 0x60, 0x31, 0xf2, 0xd3, 0xb9, 0xe2, 0xbb, 0x7f, 0xf6, 0x88, 0xc4, 0xf9, 0xcf,
+	0x50, 0x17, 0x0a, 0xbf, 0x68, 0xd6, 0xfe, 0xa3, 0x02, 0x3b, 0x19, 0x5d, 0xe1, 0xab, 0xdf, 0x37,
+	0x50, 0x9b, 0xa4, 0xdb, 0xc9, 0x7d, 0x2e, 0xcf, 0x7f, 0x2e, 0xa9, 0xc5, 0x73, 0x16, 0xda, 0x81,
+	0x5d, 0x35, 0x97, 0x0a, 0xce, 0xc4, 0x74, 0x94, 0x7e, 0x40, 0xe8, 0xcb, 0xcd, 0x2f, 0xff, 0xce,
+	0xb2, 0x64, 0x17, 0x4e, 0x25, 0xaf, 0x71, 0xd6, 0xcd, 0x39, 0xb5, 0x7f, 0x5f, 0x02, 0x92, 0xd3,
+	0x71, 0x3f, 0x9a, 0x0e, 0x50, 0xcd, 0x95, 0x28, 0xf6, 0xe2, 0x69, 0x94, 0xfc, 0x36, 0xeb, 0x83,
+	0x2b, 0x05, 0x2b, 0x86, 0x03, 0x47, 0x52, 0xf3, 0x84, 0x8b, 0x7e, 0x01, 0x2b, 0x72, 0xab, 0x74,
+	0xb4, 0xf9, 0x2e, 0xc5, 0x12, 0x6a, 0xfa, 0x59, 0xf6, 0x63, 0xa1, 0xc2, 0xa0, 0x52, 0x4d, 0x72,
+	0xe4, 0x94, 0x71, 0xfb, 0x4d, 0x79, 0x40, 0x79, 0xc5, 0x60, 0x72, 0xe9, 0x2d, 0x83, 0xc9, 0x27,
+	0xb0, 0x13, 0x87, 0xde, 0x28, 0x42, 0x4f, 0xf0, 0xc3, 0xec, 0x7b, 0xb9, 0x9a, 0x65, 0x56, 0x3e,
+	0xe5, 0xb4, 0x80, 0x4d, 0xbf, 0x99, 0x3f, 0x82, 0xad, 0xf8, 0x62, 0xe2, 0x8b, 0xa0, 0xef, 0x8f,
+	0xe2, 0xe0, 0x2c, 0xf0, 0xc3, 0xfa, 0xb2, 0x9c, 0x17, 0x6d, 0x22, 0xd8, 0xc8, 0xa0, 0x94, 0xc3,
+	0xae, 0xfa, 0xd5, 0x6a, 0xe4, 0xc7, 0x22, 0xbb, 0xb7, 0x74, 0x60, 0xfb, 0xee, 0xbb, 0xa6, 0x6f,
+	0xca, 0xa0, 0x88, 0xbe, 0x80, 0xbd, 0x5c, 0x66, 0x98, 0x7b, 0x93, 0xfa, 0x80, 0xb2, 0xf6, 0x44,
+	0xbb, 0x42, 0x6a, 0xc1, 0xf1, 0xf8, 0xee, 0x9b, 0xcb, 0xc0, 0x48, 0xfb, 0x05, 0xac, 0xa8, 0x9b,
+	0x9b, 0xfd, 0xe6, 0x5d, 0x85, 0xa5, 0x8e, 0xee, 0x38, 0xa4, 0x22, 0x7f, 0xaf, 0xa2, 0x1b, 0x26,
+	0x59, 0xd0, 0xfe, 0x56, 0x81, 0x8d, 0x6c, 0x3c, 0x6c, 0x8c, 0xce, 0xc6, 0xf4, 0x2e, 0x40, 0x38,
+	0x1d, 0xf8, 0x91, 0x98, 0x78, 0xf1, 0xab, 0xe4, 0x3b, 0x6d, 0x4d, 0x42, 0x3a, 0x5e, 0xfc, 0xea,
+	0x8a, 0xbb, 0x5c, 0xf8, 0xbf, 0xdf, 0xe5, 0xe2, 0xd5, 0x77, 0xf9, 0xbf, 0x01, 0x00, 0x00, 0xff,
+	0xff, 0x18, 0x69, 0x08, 0x53, 0x19, 0x31, 0x00, 0x00,
 }
 
diff --git a/validator/validator.proto b/validator/validator.proto
index ac0ecfddef9d8..759681b14c004 100644
--- a/validator/validator.proto
+++ b/validator/validator.proto
@@ -712,9 +712,10 @@ message ValidationError {
     // DO NOT REASSIGN the previously used values 2, 3.
   }
   optional Severity severity = 6 [default = ERROR];
-  // NEXT AVAILABLE TAG: 111
+  // NEXT AVAILABLE TAG: 114
   enum Code {
     UNKNOWN_CODE = 0;
+    INVALID_DOCTYPE_HTML = 111;
     MANDATORY_TAG_MISSING = 1;
     TAG_REQUIRED_BY_MISSING = 24;
     WARNING_TAG_REQUIRED_BY_MISSING = 76;
@@ -722,6 +723,8 @@ message ValidationError {
     WARNING_EXTENSION_UNUSED = 79;
     EXTENSION_UNUSED = 84;
     WARNING_EXTENSION_DEPRECATED_VERSION = 80;
+    NON_LTS_SCRIPT_AFTER_LTS = 112;
+    LTS_SCRIPT_AFTER_NON_LTS = 113;
     ATTR_REQUIRED_BUT_MISSING = 61;
     DISALLOWED_TAG = 2;
     GENERAL_DISALLOWED_TAG = 51;
diff --git a/validator/webui/package.json b/validator/webui/package.json
index 952b1c9decc0e..f1a69705df159 100644
--- a/validator/webui/package.json
+++ b/validator/webui/package.json
@@ -2,9 +2,6 @@
   "name": "amp-validator-webui",
   "version": "0.1.0",
   "description": "Web UI for Validator for AMP HTML (www.ampproject.org)",
-  "engines": {
-    "node": "^12.0.0"
-  },
   "author": "The AMP HTML Authors",
   "license": "Apache-2.0",
   "repository": {
diff --git a/validator/yarn.lock b/validator/yarn.lock
index bec2eef3abde0..e5015b50954e4 100644
--- a/validator/yarn.lock
+++ b/validator/yarn.lock
@@ -178,51 +178,51 @@ glob@^7.1.4:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-google-closure-compiler-java@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-java/-/google-closure-compiler-java-20191111.0.0.tgz#3fb9c464f49a73b5de3fa8ac3c2ef9c2b747266d"
-  integrity sha512-JgsQtJVVgDuj50VPQV1OgHxMy78daTL3d607V6zF/qETl3rEEiazEGfXDGUX/1V1SUOW+Y03Ct9bcO3LMxNlxg==
-
-google-closure-compiler-js@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-js/-/google-closure-compiler-js-20191111.0.0.tgz#94112796826d50d0b3717c80ab633a60d2617ff7"
-  integrity sha512-W3Oy5NF5CMgUv31CMbgLN7zhdCTVMTnNI//iEPYMotzXfX8viyOnTMipDDwJNeMnY7lfXbQrYOo+QkWP6WzZtg==
-
-google-closure-compiler-linux@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-linux/-/google-closure-compiler-linux-20191111.0.0.tgz#f66eb017b24c474565a903f966472e7a4c05efd9"
-  integrity sha512-pxxB83Ae7G9OHFSOEzOYlp844YyqQgU1RXBpCGBKeDAQrs3dykHqRhNGZdI7N1tsby/pT+hKL1US2l/CslPqag==
-
-google-closure-compiler-osx@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-osx/-/google-closure-compiler-osx-20191111.0.0.tgz#4b841fca5857dd05fbcf4ae312781e52e37c732e"
-  integrity sha512-sviL1DLN+dDfYBLzmU6+2Yk19P1uzUHQuKaXrHxEYZkU4jTJNq/TC4xi6t0ZgvLQEm2Vf7xhOrt80TYKnoQaVg==
-
-google-closure-compiler-windows@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-windows/-/google-closure-compiler-windows-20191111.0.0.tgz#da49d1814261fffbbe7bde1efc49c35eb533e89e"
-  integrity sha512-iKdz2bWrrM4zLv3USCRtWX4kLWzZhbj/afh/W6giLxg5XQzbNg+UpVF+2G6f/LEYK9UNBgS2TdyNTuw8mod+Mg==
-
-google-closure-compiler@20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler/-/google-closure-compiler-20191111.0.0.tgz#c2584b87d855cc4e23d5805e8f7269eb9a9166f2"
-  integrity sha512-Ji+FaqYKXNbJ78N5Do6hu61mPrB9D+8xSnmRO59u2CrIbmNCtoFnqkCAAL4Ye8LR8foRqtkDdiKJSblpe+5ttg==
+google-closure-compiler-java@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-java/-/google-closure-compiler-java-20200112.0.0.tgz#2b99f5e2869a573a1b35558ff3b6e6bc054a116f"
+  integrity sha512-h/ExDCXAw88nOniQSbbK6et31kOwmaDxl6t52dnETCIzituQtGToPzy21vUel1o8o+FvWUybLoap+dEYBam1pA==
+
+google-closure-compiler-js@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-js/-/google-closure-compiler-js-20200112.0.0.tgz#cb9fc1636671f3ce927e668e29db69b65cae6f2d"
+  integrity sha512-xW47rSuiRaql6q1YN7+b3FXIW74b1nCcENVwm9cigw1H5gWoBMBJOmpZiXnjMfmYC+MALjPQ8giMzvSeP+2X5A==
+
+google-closure-compiler-linux@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-linux/-/google-closure-compiler-linux-20200112.0.0.tgz#e6c7943cc0114046dbe9fc685e4d7d4eb536c1dc"
+  integrity sha512-imTfdYP7BVTzzp3y7MuZP+98nEkbX7LZsZtxalNpl56vd+Ysc9/vOHXS14CdSoThaXIVlzX/lfjOlBRqPow+ew==
+
+google-closure-compiler-osx@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-osx/-/google-closure-compiler-osx-20200112.0.0.tgz#df7a22c0dc32702b47c8ac4521f79bbe439effad"
+  integrity sha512-E3S1KqZw4+Zov0VXCkjomPrYhyuuV6jH9InBchQ7cZfipFJjhQmSRf39u4Mu0sINW7GXfODZbzBwOXhEIquFQw==
+
+google-closure-compiler-windows@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-windows/-/google-closure-compiler-windows-20200112.0.0.tgz#8300d1e651f2c84ed565e729ccf40d6ed7e63771"
+  integrity sha512-+5+UJFKXH0LGnYEHSVJxWwhtvX/MI6uebkAQkhma0057QsKs8fOToWuHL8/UbJULB4WUPa3DlHy0+Izs5z6lCQ==
+
+google-closure-compiler@20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler/-/google-closure-compiler-20200112.0.0.tgz#98d79ed2926b5c9a04c759c3f0853f2102c06ba2"
+  integrity sha512-8d43B3hU2pAFy6MD946oslArRe11jPJ/h/VaPPiiSMoSMFxnDpd8jjVJfM2solFSNOOZ9OacA6g/RVGMyp5lvg==
   dependencies:
     chalk "2.x"
-    google-closure-compiler-java "^20191111.0.0"
-    google-closure-compiler-js "^20191111.0.0"
+    google-closure-compiler-java "^20200112.0.0"
+    google-closure-compiler-js "^20200112.0.0"
     minimist "1.x"
     vinyl "2.x"
     vinyl-sourcemaps-apply "^0.2.0"
   optionalDependencies:
-    google-closure-compiler-linux "^20191111.0.0"
-    google-closure-compiler-osx "^20191111.0.0"
-    google-closure-compiler-windows "^20191111.0.0"
-
-google-closure-library@20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-library/-/google-closure-library-20191111.0.0.tgz#921701bda4ab3bce93e4d3cdcfecd9bac4ff5750"
-  integrity sha512-TWtVpMvhVyuBmXh2qwixYQBjxYLJufZ5wrkf+CPuH+Q+CE6peyO9OefYtd40HfE4fCXC+PkJ95R0j0TSxsPa2w==
+    google-closure-compiler-linux "^20200112.0.0"
+    google-closure-compiler-osx "^20200112.0.0"
+    google-closure-compiler-windows "^20200112.0.0"
+
+google-closure-library@20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-library/-/google-closure-library-20200112.0.0.tgz#87432c6d4c02582a9586935d665d5c1ce1dac4fd"
+  integrity sha512-6d0BOP812gEjCuPJiC6sixgmt2BASpy9TFgrBMFDHDXT9nnkfstV2jaqTCjEIGi0bShpBtLd6cljIsiyBLViZg==
   dependencies:
     promises-aplus-tests "^2.1.2"
 
diff --git a/yarn.lock b/yarn.lock
index c9295822b9741..a5f86f5dd3bf5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7,10 +7,10 @@
   resolved "https://registry.yarnpkg.com/@ampproject/animations/-/animations-0.2.0.tgz#82b6b68b6fe0eacbcc95d3f0a82ddf19a0e2b316"
   integrity sha512-CiMdKK9eMa6eqhqZc9bq86nPdgbALY+E8rKgUPR7wf2wGUNTm/jtFZQ7fn4sj/oggn0wvadBokabErtl1m1KSw==
 
-"@ampproject/worker-dom@0.21.0":
-  version "0.21.0"
-  resolved "https://registry.yarnpkg.com/@ampproject/worker-dom/-/worker-dom-0.21.0.tgz#f8e0ec9d96b2c8286e581d1c6d94e8edefbcaae7"
-  integrity sha512-XL1fwe6qdeC1Nk90bVxz9hID09NMOEbnx2jbaMSjDMcCNZrL73ubTt23IFLnuzAsaQyaP6xglJ1lfYvkb4gFlw==
+"@ampproject/worker-dom@0.23.2":
+  version "0.23.2"
+  resolved "https://registry.yarnpkg.com/@ampproject/worker-dom/-/worker-dom-0.23.2.tgz#9b27a6b96125ddca58ebef302d7d05dc6080d689"
+  integrity sha512-+L2MCofSaFqTyGlp5FxqoH2JuiuHJkxVuLyim2RpMsnj9CVcfNlCdNwn2KqROw9kFnJp8gnZ7c8voqwD6yDwEg==
 
 "@ava/babel-plugin-throws-helper@^4.0.0":
   version "4.0.0"
@@ -43,20 +43,37 @@
   dependencies:
     "@babel/highlight" "^7.0.0"
 
-"@babel/core@7.7.2":
-  version "7.7.2"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.7.2.tgz#ea5b99693bcfc058116f42fa1dd54da412b29d91"
-  integrity sha512-eeD7VEZKfhK1KUXGiyPFettgF3m513f8FoBSWiQ1xTvl1RAopLs42Wp9+Ze911I6H0N9lNqJMDgoZT7gHsipeQ==
+"@babel/code-frame@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.8.3.tgz#33e25903d7481181534e12ec0a25f16b6fcf419e"
+  integrity sha512-a9gxpmdXtZEInkCSHUJDLHZVBgb1QS0jhss4cPP93EW7s+uC5bikET2twEF3KV+7rDblJcmNvTR7VJejqd2C2g==
   dependencies:
-    "@babel/code-frame" "^7.5.5"
-    "@babel/generator" "^7.7.2"
-    "@babel/helpers" "^7.7.0"
-    "@babel/parser" "^7.7.2"
-    "@babel/template" "^7.7.0"
-    "@babel/traverse" "^7.7.2"
-    "@babel/types" "^7.7.2"
+    "@babel/highlight" "^7.8.3"
+
+"@babel/compat-data@^7.8.0", "@babel/compat-data@^7.8.1":
+  version "7.8.1"
+  resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.8.1.tgz#fc0bbbb7991e4fb2b47e168e60f2cc2c41680be9"
+  integrity sha512-Z+6ZOXvyOWYxJ50BwxzdhRnRsGST8Y3jaZgxYig575lTjVSs3KtJnmESwZegg6e2Dn0td1eDhoWlp1wI4BTCPw==
+  dependencies:
+    browserslist "^4.8.2"
+    invariant "^2.2.4"
+    semver "^5.5.0"
+
+"@babel/core@7.8.3", "@babel/core@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.8.3.tgz#30b0ebb4dd1585de6923a0b4d179e0b9f5d82941"
+  integrity sha512-4XFkf8AwyrEG7Ziu3L2L0Cv+WyY47Tcsp70JFmpftbAA1K7YL/sgE9jh9HyNj08Y/U50ItUchpN0w6HxAoX1rA==
+  dependencies:
+    "@babel/code-frame" "^7.8.3"
+    "@babel/generator" "^7.8.3"
+    "@babel/helpers" "^7.8.3"
+    "@babel/parser" "^7.8.3"
+    "@babel/template" "^7.8.3"
+    "@babel/traverse" "^7.8.3"
+    "@babel/types" "^7.8.3"
     convert-source-map "^1.7.0"
     debug "^4.1.0"
+    gensync "^1.0.0-beta.1"
     json5 "^2.1.0"
     lodash "^4.17.13"
     resolve "^1.3.2"
@@ -83,6 +100,26 @@
     semver "^5.4.1"
     source-map "^0.5.0"
 
+"@babel/core@^7.7.5":
+  version "7.7.7"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.7.7.tgz#ee155d2e12300bcc0cff6a8ad46f2af5063803e9"
+  integrity sha512-jlSjuj/7z138NLZALxVgrx13AOtqip42ATZP7+kYl53GvDV6+4dCek1mVUo8z8c8Xnw/mx2q3d9HWh3griuesQ==
+  dependencies:
+    "@babel/code-frame" "^7.5.5"
+    "@babel/generator" "^7.7.7"
+    "@babel/helpers" "^7.7.4"
+    "@babel/parser" "^7.7.7"
+    "@babel/template" "^7.7.4"
+    "@babel/traverse" "^7.7.4"
+    "@babel/types" "^7.7.4"
+    convert-source-map "^1.7.0"
+    debug "^4.1.0"
+    json5 "^2.1.0"
+    lodash "^4.17.13"
+    resolve "^1.3.2"
+    semver "^5.4.1"
+    source-map "^0.5.0"
+
 "@babel/generator@^7.0.0", "@babel/generator@^7.4.0", "@babel/generator@^7.6.0", "@babel/generator@^7.6.2":
   version "7.6.2"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.6.2.tgz#dac8a3c2df118334c2a29ff3446da1636a8f8c03"
@@ -93,12 +130,32 @@
     lodash "^4.17.13"
     source-map "^0.5.0"
 
-"@babel/generator@^7.7.2":
-  version "7.7.2"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.7.2.tgz#2f4852d04131a5e17ea4f6645488b5da66ebf3af"
-  integrity sha512-WthSArvAjYLz4TcbKOi88me+KmDJdKSlfwwN8CnUYn9jBkzhq0ZEPuBfkAWIvjJ3AdEV1Cf/+eSQTnp3IDJKlQ==
+"@babel/generator@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.7.4.tgz#db651e2840ca9aa66f327dcec1dc5f5fa9611369"
+  integrity sha512-m5qo2WgdOJeyYngKImbkyQrnUN1mPceaG5BV+G0E3gWsa4l/jCSryWJdM2x8OuGAOyh+3d5pVYfZWCiNFtynxg==
   dependencies:
-    "@babel/types" "^7.7.2"
+    "@babel/types" "^7.7.4"
+    jsesc "^2.5.1"
+    lodash "^4.17.13"
+    source-map "^0.5.0"
+
+"@babel/generator@^7.7.7":
+  version "7.7.7"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.7.7.tgz#859ac733c44c74148e1a72980a64ec84b85f4f45"
+  integrity sha512-/AOIBpHh/JU1l0ZFS4kiRCBnLi6OTHzh0RPk3h9isBxkkqELtQNFi1Vr/tiG9p1yfoUdKVwISuXWQR+hwwM4VQ==
+  dependencies:
+    "@babel/types" "^7.7.4"
+    jsesc "^2.5.1"
+    lodash "^4.17.13"
+    source-map "^0.5.0"
+
+"@babel/generator@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.8.3.tgz#0e22c005b0a94c1c74eafe19ef78ce53a4d45c03"
+  integrity sha512-WjoPk8hRpDRqqzRpvaR8/gDUPkrnOOeuT2m8cNICJtZH6mwaCo3v0OKMI7Y6SM1pBtyijnLtAL0HDi41pf41ug==
+  dependencies:
+    "@babel/types" "^7.8.3"
     jsesc "^2.5.1"
     lodash "^4.17.13"
     source-map "^0.5.0"
@@ -110,12 +167,12 @@
   dependencies:
     "@babel/types" "^7.0.0"
 
-"@babel/helper-annotate-as-pure@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.7.0.tgz#efc54032d43891fe267679e63f6860aa7dbf4a5e"
-  integrity sha512-k50CQxMlYTYo+GGyUGFwpxKVtxVJi9yh61sXZji3zYHccK9RYliZGSTOgci85T+r+0VFN2nWbGM04PIqwfrpMg==
+"@babel/helper-annotate-as-pure@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.8.3.tgz#60bc0bc657f63a0924ff9a4b4a0b24a13cf4deee"
+  integrity sha512-6o+mJrZBxOoEX77Ezv9zwW7WV8DdluouRKNY/IR5u/YTMuKHgugHOzYWlYvYLpLA9nPsQCAAASpCIbjI9Mv+Uw==
   dependencies:
-    "@babel/types" "^7.7.0"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-builder-binary-assignment-operator-visitor@^7.1.0":
   version "7.1.0"
@@ -125,6 +182,14 @@
     "@babel/helper-explode-assignable-expression" "^7.1.0"
     "@babel/types" "^7.0.0"
 
+"@babel/helper-builder-binary-assignment-operator-visitor@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.8.3.tgz#c84097a427a061ac56a1c30ebf54b7b22d241503"
+  integrity sha512-5eFOm2SyFPK4Rh3XMMRDjN7lBH0orh3ss0g3rTYZnBQ+r6YPj7lgDyCvPphynHvUrobJmeMignBr6Acw9mAPlw==
+  dependencies:
+    "@babel/helper-explode-assignable-expression" "^7.8.3"
+    "@babel/types" "^7.8.3"
+
 "@babel/helper-call-delegate@^7.4.4":
   version "7.4.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-call-delegate/-/helper-call-delegate-7.4.4.tgz#87c1f8ca19ad552a736a7a27b1c1fcf8b1ff1f43"
@@ -134,6 +199,26 @@
     "@babel/traverse" "^7.4.4"
     "@babel/types" "^7.4.4"
 
+"@babel/helper-call-delegate@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-call-delegate/-/helper-call-delegate-7.8.3.tgz#de82619898aa605d409c42be6ffb8d7204579692"
+  integrity sha512-6Q05px0Eb+N4/GTyKPPvnkig7Lylw+QzihMpws9iiZQv7ZImf84ZsZpQH7QoWN4n4tm81SnSzPgHw2qtO0Zf3A==
+  dependencies:
+    "@babel/helper-hoist-variables" "^7.8.3"
+    "@babel/traverse" "^7.8.3"
+    "@babel/types" "^7.8.3"
+
+"@babel/helper-compilation-targets@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.8.3.tgz#2deedc816fd41dca7355ef39fd40c9ea69f0719a"
+  integrity sha512-JLylPCsFjhLN+6uBSSh3iYdxKdeO9MNmoY96PE/99d8kyBFaXLORtAVhqN6iHa+wtPeqxKLghDOZry0+Aiw9Tw==
+  dependencies:
+    "@babel/compat-data" "^7.8.1"
+    browserslist "^4.8.2"
+    invariant "^2.2.4"
+    levenary "^1.1.0"
+    semver "^5.5.0"
+
 "@babel/helper-create-class-features-plugin@^7.5.5", "@babel/helper-create-class-features-plugin@^7.6.0":
   version "7.6.0"
   resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.6.0.tgz#769711acca889be371e9bc2eb68641d55218021f"
@@ -146,24 +231,24 @@
     "@babel/helper-replace-supers" "^7.5.5"
     "@babel/helper-split-export-declaration" "^7.4.4"
 
-"@babel/helper-create-class-features-plugin@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.7.0.tgz#bcdc223abbfdd386f94196ae2544987f8df775e8"
-  integrity sha512-MZiB5qvTWoyiFOgootmRSDV1udjIqJW/8lmxgzKq6oDqxdmHUjeP2ZUOmgHdYjmUVNABqRrHjYAYRvj8Eox/UA==
+"@babel/helper-create-class-features-plugin@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.8.3.tgz#5b94be88c255f140fd2c10dd151e7f98f4bff397"
+  integrity sha512-qmp4pD7zeTxsv0JNecSBsEmG1ei2MqwJq4YQcK3ZWm/0t07QstWfvuV/vm3Qt5xNMFETn2SZqpMx2MQzbtq+KA==
   dependencies:
-    "@babel/helper-function-name" "^7.7.0"
-    "@babel/helper-member-expression-to-functions" "^7.7.0"
-    "@babel/helper-optimise-call-expression" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-replace-supers" "^7.7.0"
-    "@babel/helper-split-export-declaration" "^7.7.0"
+    "@babel/helper-function-name" "^7.8.3"
+    "@babel/helper-member-expression-to-functions" "^7.8.3"
+    "@babel/helper-optimise-call-expression" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-replace-supers" "^7.8.3"
+    "@babel/helper-split-export-declaration" "^7.8.3"
 
-"@babel/helper-create-regexp-features-plugin@^7.7.0":
-  version "7.7.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.7.2.tgz#6f20443778c8fce2af2ff4206284afc0ced65db6"
-  integrity sha512-pAil/ZixjTlrzNpjx+l/C/wJk002Wo7XbbZ8oujH/AoJ3Juv0iN/UTcPUHXKMFLqsfS0Hy6Aow8M31brUYBlQQ==
+"@babel/helper-create-regexp-features-plugin@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.8.3.tgz#c774268c95ec07ee92476a3862b75cc2839beb79"
+  integrity sha512-Gcsm1OHCUr9o9TcJln57xhWHtdXbA2pgQ58S0Lxlks0WMGNXuki4+GLfX0p+L2ZkINUGZvfkz8rzoqJQSthI+Q==
   dependencies:
-    "@babel/helper-regex" "^7.4.4"
+    "@babel/helper-regex" "^7.8.3"
     regexpu-core "^4.6.0"
 
 "@babel/helper-define-map@^7.5.5":
@@ -175,13 +260,13 @@
     "@babel/types" "^7.5.5"
     lodash "^4.17.13"
 
-"@babel/helper-define-map@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-define-map/-/helper-define-map-7.7.0.tgz#60b0e9fd60def9de5054c38afde8c8ee409c7529"
-  integrity sha512-kPKWPb0dMpZi+ov1hJiwse9dWweZsz3V9rP4KdytnX1E7z3cTNmFGglwklzFPuqIcHLIY3bgKSs4vkwXXdflQA==
+"@babel/helper-define-map@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-define-map/-/helper-define-map-7.8.3.tgz#a0655cad5451c3760b726eba875f1cd8faa02c15"
+  integrity sha512-PoeBYtxoZGtct3md6xZOCWPcKuMuk3IHhgxsRRNtnNShebf4C8YonTSblsK4tvDbm+eJAw2HAPOfCr+Q/YRG/g==
   dependencies:
-    "@babel/helper-function-name" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/helper-function-name" "^7.8.3"
+    "@babel/types" "^7.8.3"
     lodash "^4.17.13"
 
 "@babel/helper-explode-assignable-expression@^7.1.0":
@@ -192,10 +277,18 @@
     "@babel/traverse" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@babel/helper-fixtures@^7.6.0":
-  version "7.6.2"
-  resolved "https://registry.yarnpkg.com/@babel/helper-fixtures/-/helper-fixtures-7.6.2.tgz#d0acb63898b1338eb4e65a261df8deae162acc57"
-  integrity sha512-INvYzpXoFE+pd8+WQm8gFyg68jR/voFmba5UxfBdQfIX5tlspUVa5szBfQNlwW4vYLEGCKCDvROpMDwNLS8V0g==
+"@babel/helper-explode-assignable-expression@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.8.3.tgz#a728dc5b4e89e30fc2dfc7d04fa28a930653f982"
+  integrity sha512-N+8eW86/Kj147bO9G2uclsg5pwfs/fqqY5rwgIL7eTBklgXjcOJ3btzS5iM6AitJcftnY7pm2lGsrJVYLGjzIw==
+  dependencies:
+    "@babel/traverse" "^7.8.3"
+    "@babel/types" "^7.8.3"
+
+"@babel/helper-fixtures@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-fixtures/-/helper-fixtures-7.8.3.tgz#29247189406996c971888bdd545b5535bc29332b"
+  integrity sha512-n/B4+9oKmYT7UK9meGCkyoEKOy60al69+zGT4+uB0mITmSvaLJvaa+oSEysUxextpHVJX9eK25xmVlRfzwLrVw==
   dependencies:
     lodash "^4.17.13"
     semver "^5.3.0"
@@ -209,14 +302,23 @@
     "@babel/template" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@babel/helper-function-name@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.7.0.tgz#44a5ad151cfff8ed2599c91682dda2ec2c8430a3"
-  integrity sha512-tDsJgMUAP00Ugv8O2aGEua5I2apkaQO7lBGUq1ocwN3G23JE5Dcq0uh3GvFTChPa4b40AWiAsLvCZOA2rdnQ7Q==
+"@babel/helper-function-name@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.7.4.tgz#ab6e041e7135d436d8f0a3eca15de5b67a341a2e"
+  integrity sha512-AnkGIdiBhEuiwdoMnKm7jfPfqItZhgRaZfMg1XX3bS25INOnLPjPG1Ppnajh8eqgt5kPJnfqrRHqFqmjKDZLzQ==
+  dependencies:
+    "@babel/helper-get-function-arity" "^7.7.4"
+    "@babel/template" "^7.7.4"
+    "@babel/types" "^7.7.4"
+
+"@babel/helper-function-name@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.8.3.tgz#eeeb665a01b1f11068e9fb86ad56a1cb1a824cca"
+  integrity sha512-BCxgX1BC2hD/oBlIFUgOCQDOPV8nSINxCwM3o93xP4P9Fq6aV5sgv2cOOITDMtCfQ+3PvHp3l689XZvAM9QyOA==
   dependencies:
-    "@babel/helper-get-function-arity" "^7.7.0"
-    "@babel/template" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/helper-get-function-arity" "^7.8.3"
+    "@babel/template" "^7.8.3"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-get-function-arity@^7.0.0":
   version "7.0.0"
@@ -225,12 +327,19 @@
   dependencies:
     "@babel/types" "^7.0.0"
 
-"@babel/helper-get-function-arity@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.7.0.tgz#c604886bc97287a1d1398092bc666bc3d7d7aa2d"
-  integrity sha512-tLdojOTz4vWcEnHWHCuPN5P85JLZWbm5Fx5ZsMEMPhF3Uoe3O7awrbM2nQ04bDOUToH/2tH/ezKEOR8zEYzqyw==
+"@babel/helper-get-function-arity@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.7.4.tgz#cb46348d2f8808e632f0ab048172130e636005f0"
+  integrity sha512-QTGKEdCkjgzgfJ3bAyRwF4yyT3pg+vDgan8DSivq1eS0gwi+KGKE5x8kRcbeFTb/673mkO5SN1IZfmCfA5o+EA==
+  dependencies:
+    "@babel/types" "^7.7.4"
+
+"@babel/helper-get-function-arity@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.8.3.tgz#b894b947bd004381ce63ea1db9f08547e920abd5"
+  integrity sha512-FVDR+Gd9iLjUMY1fzE2SR0IuaJToR4RkCDARVfsBBPSP53GEqSFjD8gNyxg246VUyc/ALRxFaAK8rVG7UT7xRA==
   dependencies:
-    "@babel/types" "^7.7.0"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-hoist-variables@^7.4.4":
   version "7.4.4"
@@ -239,12 +348,12 @@
   dependencies:
     "@babel/types" "^7.4.4"
 
-"@babel/helper-hoist-variables@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.7.0.tgz#b4552e4cfe5577d7de7b183e193e84e4ec538c81"
-  integrity sha512-LUe/92NqsDAkJjjCEWkNe+/PcpnisvnqdlRe19FahVapa4jndeuJ+FBiTX1rcAKWKcJGE+C3Q3tuEuxkSmCEiQ==
+"@babel/helper-hoist-variables@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.8.3.tgz#1dbe9b6b55d78c9b4183fc8cdc6e30ceb83b7134"
+  integrity sha512-ky1JLOjcDUtSc+xkt0xhYff7Z6ILTAHKmZLHPxAhOP0Nd77O+3nCsd6uSVYur6nJnCI029CrNbYlc0LoPfAPQg==
   dependencies:
-    "@babel/types" "^7.7.0"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-member-expression-to-functions@^7.5.5":
   version "7.5.5"
@@ -253,12 +362,12 @@
   dependencies:
     "@babel/types" "^7.5.5"
 
-"@babel/helper-member-expression-to-functions@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.7.0.tgz#472b93003a57071f95a541ea6c2b098398bcad8a"
-  integrity sha512-QaCZLO2RtBcmvO/ekOLp8p7R5X2JriKRizeDpm5ChATAFWrrYDcDxPuCIBXKyBjY+i1vYSdcUTMIb8psfxHDPA==
+"@babel/helper-member-expression-to-functions@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.8.3.tgz#659b710498ea6c1d9907e0c73f206eee7dadc24c"
+  integrity sha512-fO4Egq88utkQFjbPrSHGmGLFqmrshs11d46WI+WZDESt7Wu7wN2G2Iu+NMMZJFDOVRHAMIkB5SNh30NtwCA7RA==
   dependencies:
-    "@babel/types" "^7.7.0"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-module-imports@^7.0.0":
   version "7.0.0"
@@ -267,12 +376,12 @@
   dependencies:
     "@babel/types" "^7.0.0"
 
-"@babel/helper-module-imports@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.7.0.tgz#99c095889466e5f7b6d66d98dffc58baaf42654d"
-  integrity sha512-Dv3hLKIC1jyfTkClvyEkYP2OlkzNvWs5+Q8WgPbxM5LMeorons7iPP91JM+DU7tRbhqA1ZeooPaMFvQrn23RHw==
+"@babel/helper-module-imports@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.8.3.tgz#7fe39589b39c016331b6b8c3f441e8f0b1419498"
+  integrity sha512-R0Bx3jippsbAEtzkpZ/6FIiuzOURPcMjHp+Z6xPe6DtApDJx+w7UYyOLanZqO8+wKR9G10s/FmHXvxaMd9s6Kg==
   dependencies:
-    "@babel/types" "^7.7.0"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-module-transforms@^7.1.0", "@babel/helper-module-transforms@^7.4.4":
   version "7.5.5"
@@ -286,16 +395,16 @@
     "@babel/types" "^7.5.5"
     lodash "^4.17.13"
 
-"@babel/helper-module-transforms@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.7.0.tgz#154a69f0c5b8fd4d39e49750ff7ac4faa3f36786"
-  integrity sha512-rXEefBuheUYQyX4WjV19tuknrJFwyKw0HgzRwbkyTbB+Dshlq7eqkWbyjzToLrMZk/5wKVKdWFluiAsVkHXvuQ==
+"@babel/helper-module-transforms@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.8.3.tgz#d305e35d02bee720fbc2c3c3623aa0c316c01590"
+  integrity sha512-C7NG6B7vfBa/pwCOshpMbOYUmrYQDfCpVL/JCRu0ek8B5p8kue1+BCXpg2vOYs7w5ACB9GTOBYQ5U6NwrMg+3Q==
   dependencies:
-    "@babel/helper-module-imports" "^7.7.0"
-    "@babel/helper-simple-access" "^7.7.0"
-    "@babel/helper-split-export-declaration" "^7.7.0"
-    "@babel/template" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/helper-module-imports" "^7.8.3"
+    "@babel/helper-simple-access" "^7.8.3"
+    "@babel/helper-split-export-declaration" "^7.8.3"
+    "@babel/template" "^7.8.3"
+    "@babel/types" "^7.8.3"
     lodash "^4.17.13"
 
 "@babel/helper-optimise-call-expression@^7.0.0":
@@ -305,25 +414,30 @@
   dependencies:
     "@babel/types" "^7.0.0"
 
-"@babel/helper-optimise-call-expression@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.7.0.tgz#4f66a216116a66164135dc618c5d8b7a959f9365"
-  integrity sha512-48TeqmbazjNU/65niiiJIJRc5JozB8acui1OS7bSd6PgxfuovWsvjfWSzlgx+gPFdVveNzUdpdIg5l56Pl5jqg==
+"@babel/helper-optimise-call-expression@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.8.3.tgz#7ed071813d09c75298ef4f208956006b6111ecb9"
+  integrity sha512-Kag20n86cbO2AvHca6EJsvqAd82gc6VMGule4HwebwMlwkpXuVqrNRj6CkCV2sKxgi9MyAUnZVnZ6lJ1/vKhHQ==
   dependencies:
-    "@babel/types" "^7.7.0"
+    "@babel/types" "^7.8.3"
 
-"@babel/helper-plugin-test-runner@7.1.0":
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-test-runner/-/helper-plugin-test-runner-7.1.0.tgz#d43a1a091ecf7fa58b279a648da228dd615d39df"
-  integrity sha512-kAUKusNRHY669QBEGdBo56K+VjM1jgy7+3Tm4BduVFHQYbRkZ9TQCg9JyclTiFxS1jmxM7dCfQ0ty/M1ruv6Xw==
+"@babel/helper-plugin-test-runner@7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-test-runner/-/helper-plugin-test-runner-7.8.3.tgz#e5a42a64f004dcc3ccdb6a672abd0589f1469bdd"
+  integrity sha512-hJKSigle8atxDV1fNybR4o38UZNywRltLDKYf0ZMC05O1ZfTKhqUo+5igXzwQqxvh5FpHBbbg/z0iERGnJS+EA==
   dependencies:
-    "@babel/helper-transform-fixture-test-runner" "^7.1.0"
+    "@babel/helper-transform-fixture-test-runner" "^7.8.3"
 
 "@babel/helper-plugin-utils@^7.0.0":
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.0.0.tgz#bbb3fbee98661c569034237cc03967ba99b4f250"
   integrity sha512-CYAOUCARwExnEixLdB6sDm2dIJ/YgEAKDM1MOeMeZu9Ld/bDgVo8aiWrXwcY7OBh+1Ea2uUcVRcxKk0GJvW7QA==
 
+"@babel/helper-plugin-utils@^7.8.0", "@babel/helper-plugin-utils@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.8.3.tgz#9ea293be19babc0f52ff8ca88b34c3611b208670"
+  integrity sha512-j+fq49Xds2smCUNYmEHF9kGNkhbet6yVIBp4e6oeQpH1RUs/Ir06xUKzDjDkGcaaokPiTNs2JBWHjaE4csUkZQ==
+
 "@babel/helper-regex@^7.0.0", "@babel/helper-regex@^7.4.4":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/helper-regex/-/helper-regex-7.5.5.tgz#0aa6824f7100a2e0e89c1527c23936c152cab351"
@@ -331,6 +445,13 @@
   dependencies:
     lodash "^4.17.13"
 
+"@babel/helper-regex@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-regex/-/helper-regex-7.8.3.tgz#139772607d51b93f23effe72105b319d2a4c6965"
+  integrity sha512-BWt0QtYv/cg/NecOAZMdcn/waj/5P26DR4mVLXfFtDokSR6fyuG0Pj+e2FqtSME+MqED1khnSMulkmGl8qWiUQ==
+  dependencies:
+    lodash "^4.17.13"
+
 "@babel/helper-remap-async-to-generator@^7.1.0":
   version "7.1.0"
   resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.1.0.tgz#361d80821b6f38da75bd3f0785ece20a88c5fe7f"
@@ -342,16 +463,16 @@
     "@babel/traverse" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@babel/helper-remap-async-to-generator@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.7.0.tgz#4d69ec653e8bff5bce62f5d33fc1508f223c75a7"
-  integrity sha512-pHx7RN8X0UNHPB/fnuDnRXVZ316ZigkO8y8D835JlZ2SSdFKb6yH9MIYRU4fy/KPe5sPHDFOPvf8QLdbAGGiyw==
+"@babel/helper-remap-async-to-generator@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.8.3.tgz#273c600d8b9bf5006142c1e35887d555c12edd86"
+  integrity sha512-kgwDmw4fCg7AVgS4DukQR/roGp+jP+XluJE5hsRZwxCYGg+Rv9wSGErDWhlI90FODdYfd4xG4AQRiMDjjN0GzA==
   dependencies:
-    "@babel/helper-annotate-as-pure" "^7.7.0"
-    "@babel/helper-wrap-function" "^7.7.0"
-    "@babel/template" "^7.7.0"
-    "@babel/traverse" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/helper-annotate-as-pure" "^7.8.3"
+    "@babel/helper-wrap-function" "^7.8.3"
+    "@babel/template" "^7.8.3"
+    "@babel/traverse" "^7.8.3"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-replace-supers@^7.5.5":
   version "7.5.5"
@@ -363,15 +484,15 @@
     "@babel/traverse" "^7.5.5"
     "@babel/types" "^7.5.5"
 
-"@babel/helper-replace-supers@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.7.0.tgz#d5365c8667fe7cbd13b8ddddceb9bd7f2b387512"
-  integrity sha512-5ALYEul5V8xNdxEeWvRsBzLMxQksT7MaStpxjJf9KsnLxpAKBtfw5NeMKZJSYDa0lKdOcy0g+JT/f5mPSulUgg==
+"@babel/helper-replace-supers@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-replace-supers/-/helper-replace-supers-7.8.3.tgz#91192d25f6abbcd41da8a989d4492574fb1530bc"
+  integrity sha512-xOUssL6ho41U81etpLoT2RTdvdus4VfHamCuAm4AHxGr+0it5fnwoVdwUJ7GFEqCsQYzJUhcbsN9wB9apcYKFA==
   dependencies:
-    "@babel/helper-member-expression-to-functions" "^7.7.0"
-    "@babel/helper-optimise-call-expression" "^7.7.0"
-    "@babel/traverse" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/helper-member-expression-to-functions" "^7.8.3"
+    "@babel/helper-optimise-call-expression" "^7.8.3"
+    "@babel/traverse" "^7.8.3"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-simple-access@^7.1.0":
   version "7.1.0"
@@ -381,13 +502,13 @@
     "@babel/template" "^7.1.0"
     "@babel/types" "^7.0.0"
 
-"@babel/helper-simple-access@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.7.0.tgz#97a8b6c52105d76031b86237dc1852b44837243d"
-  integrity sha512-AJ7IZD7Eem3zZRuj5JtzFAptBw7pMlS3y8Qv09vaBWoFsle0d1kAn5Wq6Q9MyBXITPOKnxwkZKoAm4bopmv26g==
+"@babel/helper-simple-access@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.8.3.tgz#7f8109928b4dab4654076986af575231deb639ae"
+  integrity sha512-VNGUDjx5cCWg4vvCTR8qQ7YJYZ+HBjxOgXEl7ounz+4Sn7+LMD3CFrCTEU6/qXKbA2nKg21CwhhBzO0RpRbdCw==
   dependencies:
-    "@babel/template" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/template" "^7.8.3"
+    "@babel/types" "^7.8.3"
 
 "@babel/helper-split-export-declaration@^7.4.4":
   version "7.4.4"
@@ -396,22 +517,29 @@
   dependencies:
     "@babel/types" "^7.4.4"
 
-"@babel/helper-split-export-declaration@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.7.0.tgz#1365e74ea6c614deeb56ebffabd71006a0eb2300"
-  integrity sha512-HgYSI8rH08neWlAH3CcdkFg9qX9YsZysZI5GD8LjhQib/mM0jGOZOVkoUiiV2Hu978fRtjtsGsW6w0pKHUWtqA==
+"@babel/helper-split-export-declaration@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.7.4.tgz#57292af60443c4a3622cf74040ddc28e68336fd8"
+  integrity sha512-guAg1SXFcVr04Guk9eq0S4/rWS++sbmyqosJzVs8+1fH5NI+ZcmkaSkc7dmtAFbHFva6yRJnjW3yAcGxjueDug==
   dependencies:
-    "@babel/types" "^7.7.0"
+    "@babel/types" "^7.7.4"
 
-"@babel/helper-transform-fixture-test-runner@^7.1.0":
-  version "7.6.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-transform-fixture-test-runner/-/helper-transform-fixture-test-runner-7.6.0.tgz#edb7ba9dd081e2ced015ea7ffc7bac8e1b4f3f87"
-  integrity sha512-nCEaWUTfJpmsTConilmVQC7j7ksY7ZcvBP22IiZP3w8JcmA/jX9FLiIhRPekcee+DOMvB8K/+Q/OuLgamW6vSA==
+"@babel/helper-split-export-declaration@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.8.3.tgz#31a9f30070f91368a7182cf05f831781065fc7a9"
+  integrity sha512-3x3yOeyBhW851hroze7ElzdkeRXQYQbFIb7gLK1WQYsw2GWDay5gAJNw1sWJ0VFP6z5J1whqeXH/WCdCjZv6dA==
   dependencies:
-    "@babel/code-frame" "^7.5.5"
-    "@babel/core" "^7.6.0"
-    "@babel/helper-fixtures" "^7.6.0"
-    "@babel/polyfill" "^7.6.0"
+    "@babel/types" "^7.8.3"
+
+"@babel/helper-transform-fixture-test-runner@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-transform-fixture-test-runner/-/helper-transform-fixture-test-runner-7.8.3.tgz#3a1cd8e27d6a2e03c671976935c2effd289ef0f8"
+  integrity sha512-oDMdkOS2Zenp7C7uEURN7IeIRjQxvSnRASS2hDFpiUBhu+A/wy8VpnJ5RRIy63t93WmIAJzylU09oTRCTfbYbQ==
+  dependencies:
+    "@babel/code-frame" "^7.8.3"
+    "@babel/core" "^7.8.3"
+    "@babel/helper-fixtures" "^7.8.3"
+    "@babel/polyfill" "^7.8.3"
     babel-check-duplicated-nodes "^1.0.0"
     jest "^24.8.0"
     jest-diff "^24.8.0"
@@ -429,15 +557,15 @@
     "@babel/traverse" "^7.1.0"
     "@babel/types" "^7.2.0"
 
-"@babel/helper-wrap-function@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.7.0.tgz#15af3d3e98f8417a60554acbb6c14e75e0b33b74"
-  integrity sha512-sd4QjeMgQqzshSjecZjOp8uKfUtnpmCyQhKQrVJBBgeHAB/0FPi33h3AbVlVp07qQtMD4QgYSzaMI7VwncNK/w==
+"@babel/helper-wrap-function@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.8.3.tgz#9dbdb2bb55ef14aaa01fe8c99b629bd5352d8610"
+  integrity sha512-LACJrbUET9cQDzb6kG7EeD7+7doC3JNvUgTEQOx2qaO1fKlzE/Bf05qs9w1oXQMmXlPO65lC3Tq9S6gZpTErEQ==
   dependencies:
-    "@babel/helper-function-name" "^7.7.0"
-    "@babel/template" "^7.7.0"
-    "@babel/traverse" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/helper-function-name" "^7.8.3"
+    "@babel/template" "^7.8.3"
+    "@babel/traverse" "^7.8.3"
+    "@babel/types" "^7.8.3"
 
 "@babel/helpers@^7.6.2":
   version "7.6.2"
@@ -448,14 +576,23 @@
     "@babel/traverse" "^7.6.2"
     "@babel/types" "^7.6.0"
 
-"@babel/helpers@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.7.0.tgz#359bb5ac3b4726f7c1fde0ec75f64b3f4275d60b"
-  integrity sha512-VnNwL4YOhbejHb7x/b5F39Zdg5vIQpUUNzJwx0ww1EcVRt41bbGRZWhAURrfY32T5zTT3qwNOQFWpn+P0i0a2g==
+"@babel/helpers@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.7.4.tgz#62c215b9e6c712dadc15a9a0dcab76c92a940302"
+  integrity sha512-ak5NGZGJ6LV85Q1Zc9gn2n+ayXOizryhjSUBTdu5ih1tlVCJeuQENzc4ItyCVhINVXvIT/ZQ4mheGIsfBkpskg==
+  dependencies:
+    "@babel/template" "^7.7.4"
+    "@babel/traverse" "^7.7.4"
+    "@babel/types" "^7.7.4"
+
+"@babel/helpers@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.8.3.tgz#382fbb0382ce7c4ce905945ab9641d688336ce85"
+  integrity sha512-LmU3q9Pah/XyZU89QvBgGt+BCsTPoQa+73RxAQh8fb8qkDyIfeQnmgs+hvzhTCKTzqOyk7JTkS3MS1S8Mq5yrQ==
   dependencies:
-    "@babel/template" "^7.7.0"
-    "@babel/traverse" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/template" "^7.8.3"
+    "@babel/traverse" "^7.8.3"
+    "@babel/types" "^7.8.3"
 
 "@babel/highlight@^7.0.0":
   version "7.5.0"
@@ -466,15 +603,34 @@
     esutils "^2.0.2"
     js-tokens "^4.0.0"
 
+"@babel/highlight@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.8.3.tgz#28f173d04223eaaa59bc1d439a3836e6d1265797"
+  integrity sha512-PX4y5xQUvy0fnEVHrYOarRPXVWafSjTW9T0Hab8gVIawpl2Sj0ORyrygANq+KjcNlSSTw0YCLSNA8OyZ1I4yEg==
+  dependencies:
+    chalk "^2.0.0"
+    esutils "^2.0.2"
+    js-tokens "^4.0.0"
+
 "@babel/parser@^7.0.0", "@babel/parser@^7.1.0", "@babel/parser@^7.4.3", "@babel/parser@^7.6.0", "@babel/parser@^7.6.2":
   version "7.6.2"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.6.2.tgz#205e9c95e16ba3b8b96090677a67c9d6075b70a1"
   integrity sha512-mdFqWrSPCmikBoaBYMuBulzTIKuXVPtEISFbRRVNwMWpCms/hmE2kRq0bblUHaNRKrjRlmVbx1sDHmjmRgD2Xg==
 
-"@babel/parser@^7.7.0", "@babel/parser@^7.7.2":
-  version "7.7.2"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.7.2.tgz#ea8334dc77416bfd9473eb470fd00d8245b3943b"
-  integrity sha512-DDaR5e0g4ZTb9aP7cpSZLkACEBdoLGwJDWgHtBhrGX7Q1RjhdoMOfexICj5cqTAtpowjGQWfcvfnQG7G2kAB5w==
+"@babel/parser@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.7.4.tgz#75ab2d7110c2cf2fa949959afb05fa346d2231bb"
+  integrity sha512-jIwvLO0zCL+O/LmEJQjWA75MQTWwx3c3u2JOTDK5D3/9egrWRRA0/0hk9XXywYnXZVVpzrBYeIQTmhwUaePI9g==
+
+"@babel/parser@^7.7.5", "@babel/parser@^7.7.7":
+  version "7.7.7"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.7.7.tgz#1b886595419cf92d811316d5b715a53ff38b4937"
+  integrity sha512-WtTZMZAZLbeymhkd/sEaPD8IQyGAhmuTuvTzLiCFM7iXiVdY0gc0IaI+cW0fh1BnSMbJSzXX6/fHllgHKwHhXw==
+
+"@babel/parser@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.8.3.tgz#790874091d2001c9be6ec426c2eed47bc7679081"
+  integrity sha512-/V72F4Yp/qmHaTALizEm9Gf2eQHV3QyTL3K0cNfijwnMnb1L+LDlAubb/ZnSdGAVzVSWakujHYs1I26x66sMeQ==
 
 "@babel/plugin-proposal-async-generator-functions@^7.2.0":
   version "7.2.0"
@@ -485,22 +641,22 @@
     "@babel/helper-remap-async-to-generator" "^7.1.0"
     "@babel/plugin-syntax-async-generators" "^7.2.0"
 
-"@babel/plugin-proposal-async-generator-functions@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.7.0.tgz#83ef2d6044496b4c15d8b4904e2219e6dccc6971"
-  integrity sha512-ot/EZVvf3mXtZq0Pd0+tSOfGWMizqmOohXmNZg6LNFjHOV+wOPv7BvVYh8oPR8LhpIP3ye8nNooKL50YRWxpYA==
+"@babel/plugin-proposal-async-generator-functions@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.8.3.tgz#bad329c670b382589721b27540c7d288601c6e6f"
+  integrity sha512-NZ9zLv848JsV3hs8ryEh7Uaz/0KsmPLqv0+PdkDJL1cJy0K4kOCFa8zc1E3mp+RHPQcpdfb/6GovEsW4VDrOMw==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-remap-async-to-generator" "^7.7.0"
-    "@babel/plugin-syntax-async-generators" "^7.2.0"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-remap-async-to-generator" "^7.8.3"
+    "@babel/plugin-syntax-async-generators" "^7.8.0"
 
-"@babel/plugin-proposal-class-properties@7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.7.0.tgz#ac54e728ecf81d90e8f4d2a9c05a890457107917"
-  integrity sha512-tufDcFA1Vj+eWvwHN+jvMN6QsV5o+vUlytNKrbMiCeDL0F2j92RURzUsUMWE5EJkLyWxjdUslCsMQa9FWth16A==
+"@babel/plugin-proposal-class-properties@7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.8.3.tgz#5e06654af5cd04b608915aada9b2a6788004464e"
+  integrity sha512-EqFhbo7IosdgPgZggHaNObkmO1kNUe3slaKu54d5OWvy+p9QIKOzK1GAEpAIsZtWVtPXUHSMcT4smvDrCfY4AA==
   dependencies:
-    "@babel/helper-create-class-features-plugin" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-create-class-features-plugin" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
 
 "@babel/plugin-proposal-class-properties@^7.0.0":
   version "7.5.5"
@@ -535,13 +691,13 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-dynamic-import" "^7.2.0"
 
-"@babel/plugin-proposal-dynamic-import@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.7.0.tgz#dc02a8bad8d653fb59daf085516fa416edd2aa7f"
-  integrity sha512-7poL3Xi+QFPC7sGAzEIbXUyYzGJwbc2+gSD0AkiC5k52kH2cqHdqxm5hNFfLW3cRSTcx9bN0Fl7/6zWcLLnKAQ==
+"@babel/plugin-proposal-dynamic-import@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.8.3.tgz#38c4fe555744826e97e2ae930b0fb4cc07e66054"
+  integrity sha512-NyaBbyLFXFLT9FP+zk0kYlUlA8XtCUbehs67F0nnEg7KICgMc2mNkIeu9TYhKzyXMkrapZFwAhXLdnt4IYHy1w==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-syntax-dynamic-import" "^7.2.0"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/plugin-syntax-dynamic-import" "^7.8.0"
 
 "@babel/plugin-proposal-export-default-from@^7.0.0":
   version "7.5.2"
@@ -584,6 +740,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-json-strings" "^7.2.0"
 
+"@babel/plugin-proposal-json-strings@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-json-strings/-/plugin-proposal-json-strings-7.8.3.tgz#da5216b238a98b58a1e05d6852104b10f9a70d6b"
+  integrity sha512-KGhQNZ3TVCQG/MjRbAUwuH+14y9q0tpxs1nWWs3pbSleRdDro9SAMMDyye8HhY1gqZ7/NqIc8SKhya0wRDgP1Q==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/plugin-syntax-json-strings" "^7.8.0"
+
 "@babel/plugin-proposal-logical-assignment-operators@^7.0.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-logical-assignment-operators/-/plugin-proposal-logical-assignment-operators-7.2.0.tgz#8a5cea6c42a7c87446959e02fff5fad012c56f57"
@@ -600,6 +764,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-nullish-coalescing-operator" "^7.2.0"
 
+"@babel/plugin-proposal-nullish-coalescing-operator@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-nullish-coalescing-operator/-/plugin-proposal-nullish-coalescing-operator-7.8.3.tgz#e4572253fdeed65cddeecfdab3f928afeb2fd5d2"
+  integrity sha512-TS9MlfzXpXKt6YYomudb/KU7nQI6/xnapG6in1uZxoxDghuSMZsPb6D2fyUwNYSAp4l1iR7QtFOjkqcRYcUsfw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.0"
+
 "@babel/plugin-proposal-numeric-separator@^7.0.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-numeric-separator/-/plugin-proposal-numeric-separator-7.2.0.tgz#646854daf4cd22fd6733f6076013a936310443ac"
@@ -616,6 +788,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
 
+"@babel/plugin-proposal-object-rest-spread@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.8.3.tgz#eb5ae366118ddca67bed583b53d7554cad9951bb"
+  integrity sha512-8qvuPwU/xxUCt78HocNlv0mXXo0wdh9VT1R04WU8HGOfaOob26pF+9P5/lYjN/q7DHOX1bvX60hnhOvuQUJdbA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/plugin-syntax-object-rest-spread" "^7.8.0"
+
 "@babel/plugin-proposal-optional-catch-binding@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-optional-catch-binding-7.2.0.tgz#135d81edb68a081e55e56ec48541ece8065c38f5"
@@ -624,6 +804,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-optional-catch-binding" "^7.2.0"
 
+"@babel/plugin-proposal-optional-catch-binding@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-optional-catch-binding-7.8.3.tgz#9dee96ab1650eed88646ae9734ca167ac4a9c5c9"
+  integrity sha512-0gkX7J7E+AtAw9fcwlVQj8peP61qhdg/89D5swOkjYbkboA2CVckn3kiyum1DE0wskGb7KJJxBdyEBApDLLVdw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/plugin-syntax-optional-catch-binding" "^7.8.0"
+
 "@babel/plugin-proposal-optional-chaining@^7.0.0":
   version "7.6.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.6.0.tgz#e9bf1f9b9ba10c77c033082da75f068389041af8"
@@ -632,6 +820,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/plugin-syntax-optional-chaining" "^7.2.0"
 
+"@babel/plugin-proposal-optional-chaining@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.8.3.tgz#ae10b3214cb25f7adb1f3bc87ba42ca10b7e2543"
+  integrity sha512-QIoIR9abkVn+seDE3OjA08jWcs3eZ9+wJCKSRgo3WdEU2csFYgdScb+8qHB3+WXsGJD55u+5hWCISI7ejXS+kg==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/plugin-syntax-optional-chaining" "^7.8.0"
+
 "@babel/plugin-proposal-pipeline-operator@^7.0.0":
   version "7.5.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-pipeline-operator/-/plugin-proposal-pipeline-operator-7.5.0.tgz#4100ec55ef4f6a4c2490b5f5a4f2a22dfa272c06"
@@ -657,13 +853,13 @@
     "@babel/helper-regex" "^7.4.4"
     regexpu-core "^4.6.0"
 
-"@babel/plugin-proposal-unicode-property-regex@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.7.0.tgz#549fe1717a1bd0a2a7e63163841cb37e78179d5d"
-  integrity sha512-mk34H+hp7kRBWJOOAR0ZMGCydgKMD4iN9TpDRp3IIcbunltxEY89XSimc6WbtSLCDrwcdy/EEw7h5CFCzxTchw==
+"@babel/plugin-proposal-unicode-property-regex@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.8.3.tgz#b646c3adea5f98800c9ab45105ac34d06cd4a47f"
+  integrity sha512-1/1/rEZv2XGweRwwSkLpY+s60za9OZ1hJs4YDqFHCw0kYWYwL5IFljVY1MYBL+weT1l9pokDO2uhSTLVxzoHkQ==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-create-regexp-features-plugin" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
 
 "@babel/plugin-syntax-async-generators@^7.2.0":
   version "7.2.0"
@@ -672,6 +868,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-async-generators@^7.8.0":
+  version "7.8.4"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-async-generators/-/plugin-syntax-async-generators-7.8.4.tgz#a983fb1aeb2ec3f6ed042a210f640e90e786fe0d"
+  integrity sha512-tycmZxkGfZaxhMRbXlPXuVFpdWlXpir2W4AMhSJgRKzk/eDlIXOhb2LHWoLpDF7TEHylV5zNhykX6KAgHJmTNw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.0"
+
 "@babel/plugin-syntax-decorators@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.2.0.tgz#c50b1b957dcc69e4b1127b65e1c33eef61570c1b"
@@ -693,6 +896,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-dynamic-import@^7.8.0":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz#62bf98b2da3cd21d626154fc96ee5b3cb68eacb3"
+  integrity sha512-5gdGbFon+PszYzqs83S3E5mpi7/y/8M9eC90MRTZfduQOYW76ig6SOSPNe41IG5LoP3FGBn2N0RjVDSQiS94kQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.0"
+
 "@babel/plugin-syntax-export-default-from@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-export-default-from/-/plugin-syntax-export-default-from-7.2.0.tgz#edd83b7adc2e0d059e2467ca96c650ab6d2f3820"
@@ -735,6 +945,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-json-strings@^7.8.0":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.8.3.tgz#01ca21b668cd8218c9e640cb6dd88c5412b2c96a"
+  integrity sha512-lY6kdGpWHvjoe2vk4WrAapEuBR69EMxZl+RoGRhrFGNYVK8mOPAW8VfbT/ZgrFbXlDNiiaxQnAtgVCZ6jv30EA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.0"
+
 "@babel/plugin-syntax-logical-assignment-operators@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.2.0.tgz#fcab7388530e96c6f277ce494c55caa6c141fcfb"
@@ -749,6 +966,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-nullish-coalescing-operator@^7.8.0":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-nullish-coalescing-operator/-/plugin-syntax-nullish-coalescing-operator-7.8.3.tgz#167ed70368886081f74b5c36c65a88c03b66d1a9"
+  integrity sha512-aSff4zPII1u2QD7y+F8oDsz19ew4IGEJg9SVW+bqwpwtfFleiQDMdzA/R+UlWDzfnHFCxxleFT0PMIrR36XLNQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.0"
+
 "@babel/plugin-syntax-numeric-separator@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.2.0.tgz#7470fe070c2944469a756752a69a6963135018be"
@@ -763,6 +987,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-object-rest-spread@^7.8.0":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.8.3.tgz#60e225edcbd98a640332a2e72dd3e66f1af55871"
+  integrity sha512-XoqMijGZb9y3y2XskN+P1wUGiVwWZ5JmoDRwx5+3GmEplNyVM2s2Dg8ILFQm8rWM48orGy5YpI5Bl8U1y7ydlA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.0"
+
 "@babel/plugin-syntax-optional-catch-binding@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-optional-catch-binding/-/plugin-syntax-optional-catch-binding-7.2.0.tgz#a94013d6eda8908dfe6a477e7f9eda85656ecf5c"
@@ -770,6 +1001,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-optional-catch-binding@^7.8.0":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-optional-catch-binding/-/plugin-syntax-optional-catch-binding-7.8.3.tgz#6111a265bcfb020eb9efd0fdfd7d26402b9ed6c1"
+  integrity sha512-6VPD0Pc1lpTqw0aKoeRTMiB+kWhAoT24PA+ksWSBrFtl5SIRVpZlwN3NNPQjehA2E/91FV3RjLWoVTglWcSV3Q==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.0"
+
 "@babel/plugin-syntax-optional-chaining@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-optional-chaining/-/plugin-syntax-optional-chaining-7.2.0.tgz#a59d6ae8c167e7608eaa443fda9fa8fa6bf21dff"
@@ -777,6 +1015,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-optional-chaining@^7.8.0":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-optional-chaining/-/plugin-syntax-optional-chaining-7.8.3.tgz#4f69c2ab95167e0180cd5336613f8c5788f7d48a"
+  integrity sha512-KoK9ErH1MBlCPxV0VANkXW2/dw4vlbGDrFgz8bmUsBGYkFRcbRwMh6cIJubdPrkxRwuGdtCk0v/wPTKbQgBjkg==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.0"
+
 "@babel/plugin-syntax-pipeline-operator@^7.5.0":
   version "7.5.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-pipeline-operator/-/plugin-syntax-pipeline-operator-7.5.0.tgz#8ea7c2c22847c797748bf07752722a317079dc1e"
@@ -791,12 +1036,12 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-syntax-top-level-await@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.7.0.tgz#f5699549f50bbe8d12b1843a4e82f0a37bb65f4d"
-  integrity sha512-hi8FUNiFIY1fnUI2n1ViB1DR0R4QeK4iHcTlW6aJkrPoTdb8Rf1EMQ6GT3f67DDkYyWgew9DFoOZ6gOoEsdzTA==
+"@babel/plugin-syntax-top-level-await@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.8.3.tgz#3acdece695e6b13aaf57fc291d1a800950c71391"
+  integrity sha512-kwj1j9lL/6Wd0hROD3b/OZZ7MSrZLqqn9RAZ5+cYYsflQ9HZBIKCUkr3+uL1MEJ1NePiUbf98jjiMQSv0NMR9g==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-plugin-utils" "^7.8.3"
 
 "@babel/plugin-transform-arrow-functions@^7.2.0":
   version "7.2.0"
@@ -805,6 +1050,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-arrow-functions@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.8.3.tgz#82776c2ed0cd9e1a49956daeb896024c9473b8b6"
+  integrity sha512-0MRF+KC8EqH4dbuITCWwPSzsyO3HIWWlm30v8BbbpOrS1B++isGxPnnuq/IZvOX5J2D/p7DQalQm+/2PnlKGxg==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-async-to-generator@^7.5.0":
   version "7.5.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.5.0.tgz#89a3848a0166623b5bc481164b5936ab947e887e"
@@ -814,14 +1066,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/helper-remap-async-to-generator" "^7.1.0"
 
-"@babel/plugin-transform-async-to-generator@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.7.0.tgz#e2b84f11952cf5913fe3438b7d2585042772f492"
-  integrity sha512-vLI2EFLVvRBL3d8roAMqtVY0Bm9C1QzLkdS57hiKrjUBSqsQYrBsMCeOg/0KK7B0eK9V71J5mWcha9yyoI2tZw==
+"@babel/plugin-transform-async-to-generator@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.8.3.tgz#4308fad0d9409d71eafb9b1a6ee35f9d64b64086"
+  integrity sha512-imt9tFLD9ogt56Dd5CI/6XgpukMwd/fLGSrix2httihVe7LOGVPhyhMh1BU5kDM7iHD08i8uUtmV2sWaBFlHVQ==
   dependencies:
-    "@babel/helper-module-imports" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-remap-async-to-generator" "^7.7.0"
+    "@babel/helper-module-imports" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-remap-async-to-generator" "^7.8.3"
 
 "@babel/plugin-transform-block-scoped-functions@^7.2.0":
   version "7.2.0"
@@ -830,6 +1082,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-block-scoped-functions@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.8.3.tgz#437eec5b799b5852072084b3ae5ef66e8349e8a3"
+  integrity sha512-vo4F2OewqjbB1+yaJ7k2EJFHlTP3jR634Z9Cj9itpqNjuLXvhlVxgnjsHsdRgASR8xYDrx6onw4vW5H6We0Jmg==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-block-scoping@^7.6.2":
   version "7.6.2"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.6.2.tgz#96c33ab97a9ae500cc6f5b19e04a7e6553360a79"
@@ -838,12 +1097,12 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     lodash "^4.17.13"
 
-"@babel/plugin-transform-block-scoping@^7.6.3":
-  version "7.6.3"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.6.3.tgz#6e854e51fbbaa84351b15d4ddafe342f3a5d542a"
-  integrity sha512-7hvrg75dubcO3ZI2rjYTzUrEuh1E9IyDEhhB6qfcooxhDA33xx2MasuLVgdxzcP6R/lipAC6n9ub9maNW6RKdw==
+"@babel/plugin-transform-block-scoping@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.8.3.tgz#97d35dab66857a437c166358b91d09050c868f3a"
+  integrity sha512-pGnYfm7RNRgYRi7bids5bHluENHqJhrV4bCZRwc5GamaWIIs07N4rZECcmJL6ZClwjDz1GbdMZFtPs27hTB06w==
   dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-plugin-utils" "^7.8.3"
     lodash "^4.17.13"
 
 "@babel/plugin-transform-classes@^7.5.5":
@@ -860,18 +1119,18 @@
     "@babel/helper-split-export-declaration" "^7.4.4"
     globals "^11.1.0"
 
-"@babel/plugin-transform-classes@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.7.0.tgz#b411ecc1b8822d24b81e5d184f24149136eddd4a"
-  integrity sha512-/b3cKIZwGeUesZheU9jNYcwrEA7f/Bo4IdPmvp7oHgvks2majB5BoT5byAql44fiNQYOPzhk2w8DbgfuafkMoA==
-  dependencies:
-    "@babel/helper-annotate-as-pure" "^7.7.0"
-    "@babel/helper-define-map" "^7.7.0"
-    "@babel/helper-function-name" "^7.7.0"
-    "@babel/helper-optimise-call-expression" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-replace-supers" "^7.7.0"
-    "@babel/helper-split-export-declaration" "^7.7.0"
+"@babel/plugin-transform-classes@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-classes/-/plugin-transform-classes-7.8.3.tgz#46fd7a9d2bb9ea89ce88720477979fe0d71b21b8"
+  integrity sha512-SjT0cwFJ+7Rbr1vQsvphAHwUHvSUPmMjMU/0P59G8U2HLFqSa082JO7zkbDNWs9kH/IUqpHI6xWNesGf8haF1w==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.8.3"
+    "@babel/helper-define-map" "^7.8.3"
+    "@babel/helper-function-name" "^7.8.3"
+    "@babel/helper-optimise-call-expression" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-replace-supers" "^7.8.3"
+    "@babel/helper-split-export-declaration" "^7.8.3"
     globals "^11.1.0"
 
 "@babel/plugin-transform-computed-properties@^7.2.0":
@@ -881,6 +1140,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-computed-properties@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.8.3.tgz#96d0d28b7f7ce4eb5b120bb2e0e943343c86f81b"
+  integrity sha512-O5hiIpSyOGdrQZRQ2ccwtTVkgUDBBiCuK//4RJ6UfePllUTCENOzKxfh6ulckXKc0DixTFLCfb2HVkNA7aDpzA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-destructuring@^7.6.0":
   version "7.6.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.6.0.tgz#44bbe08b57f4480094d57d9ffbcd96d309075ba6"
@@ -888,6 +1154,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-destructuring@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.8.3.tgz#20ddfbd9e4676906b1056ee60af88590cc7aaa0b"
+  integrity sha512-H4X646nCkiEcHZUZaRkhE2XVsoz0J/1x3VVujnn96pSoGCtKPA99ZZA+va+gK+92Zycd6OBKCD8tDb/731bhgQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-dotall-regex@^7.4.4", "@babel/plugin-transform-dotall-regex@^7.6.2":
   version "7.6.2"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.6.2.tgz#44abb948b88f0199a627024e1508acaf8dc9b2f9"
@@ -897,13 +1170,13 @@
     "@babel/helper-regex" "^7.4.4"
     regexpu-core "^4.6.0"
 
-"@babel/plugin-transform-dotall-regex@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.7.0.tgz#c5c9ecacab3a5e0c11db6981610f0c32fd698b3b"
-  integrity sha512-3QQlF7hSBnSuM1hQ0pS3pmAbWLax/uGNCbPBND9y+oJ4Y776jsyujG2k0Sn2Aj2a0QwVOiOFL5QVPA7spjvzSA==
+"@babel/plugin-transform-dotall-regex@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.8.3.tgz#c3c6ec5ee6125c6993c5cbca20dc8621a9ea7a6e"
+  integrity sha512-kLs1j9Nn4MQoBYdRXH6AeaXMbEJFaFu/v1nQkvib6QzTj8MZI5OQzqmD83/2jEM1z0DLilra5aWO5YpyC0ALIw==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-create-regexp-features-plugin" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
 
 "@babel/plugin-transform-duplicate-keys@^7.5.0":
   version "7.5.0"
@@ -912,6 +1185,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-duplicate-keys@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.8.3.tgz#8d12df309aa537f272899c565ea1768e286e21f1"
+  integrity sha512-s8dHiBUbcbSgipS4SMFuWGqCvyge5V2ZeAWzR6INTVC3Ltjig/Vw1G2Gztv0vU/hRG9X8IvKvYdoksnUfgXOEQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-exponentiation-operator@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.2.0.tgz#a63868289e5b4007f7054d46491af51435766008"
@@ -920,6 +1200,14 @@
     "@babel/helper-builder-binary-assignment-operator-visitor" "^7.1.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-exponentiation-operator@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.8.3.tgz#581a6d7f56970e06bf51560cd64f5e947b70d7b7"
+  integrity sha512-zwIpuIymb3ACcInbksHaNcR12S++0MDLKkiqXHl3AzpgdKlFNhog+z/K0+TGW+b0w5pgTq4H6IwV/WhxbGYSjQ==
+  dependencies:
+    "@babel/helper-builder-binary-assignment-operator-visitor" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-for-of@^7.4.4":
   version "7.4.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.4.4.tgz#0267fc735e24c808ba173866c6c4d1440fc3c556"
@@ -927,6 +1215,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-for-of@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.8.3.tgz#15f17bce2fc95c7d59a24b299e83e81cedc22e18"
+  integrity sha512-ZjXznLNTxhpf4Q5q3x1NsngzGA38t9naWH8Gt+0qYZEJAcvPI9waSStSh56u19Ofjr7QmD0wUsQ8hw8s/p1VnA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-function-name@^7.4.4":
   version "7.4.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.4.4.tgz#e1436116abb0610c2259094848754ac5230922ad"
@@ -935,13 +1230,13 @@
     "@babel/helper-function-name" "^7.1.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-function-name@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.7.0.tgz#0fa786f1eef52e3b7d4fc02e54b2129de8a04c2a"
-  integrity sha512-P5HKu0d9+CzZxP5jcrWdpe7ZlFDe24bmqP6a6X8BHEBl/eizAsY8K6LX8LASZL0Jxdjm5eEfzp+FIrxCm/p8bA==
+"@babel/plugin-transform-function-name@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.8.3.tgz#279373cb27322aaad67c2683e776dfc47196ed8b"
+  integrity sha512-rO/OnDS78Eifbjn5Py9v8y0aR+aSYhDhqAwVfsTl0ERuMZyr05L1aFSCJnbv2mmsLkit/4ReeQ9N2BgLnOcPCQ==
   dependencies:
-    "@babel/helper-function-name" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-function-name" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
 
 "@babel/plugin-transform-literals@^7.2.0":
   version "7.2.0"
@@ -950,6 +1245,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-literals@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-literals/-/plugin-transform-literals-7.8.3.tgz#aef239823d91994ec7b68e55193525d76dbd5dc1"
+  integrity sha512-3Tqf8JJ/qB7TeldGl+TT55+uQei9JfYaregDcEAyBZ7akutriFrt6C/wLYIer6OYhleVQvH/ntEhjE/xMmy10A==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-member-expression-literals@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.2.0.tgz#fa10aa5c58a2cb6afcf2c9ffa8cb4d8b3d489a2d"
@@ -957,6 +1259,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-member-expression-literals@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.8.3.tgz#963fed4b620ac7cbf6029c755424029fa3a40410"
+  integrity sha512-3Wk2EXhnw+rP+IDkK6BdtPKsUE5IeZ6QOGrPYvw52NwBStw9V1ZVzxgK6fSKSxqUvH9eQPR3tm3cOq79HlsKYA==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-modules-amd@^7.5.0":
   version "7.5.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.5.0.tgz#ef00435d46da0a5961aa728a1d2ecff063e4fb91"
@@ -966,6 +1275,15 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     babel-plugin-dynamic-import-node "^2.3.0"
 
+"@babel/plugin-transform-modules-amd@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.8.3.tgz#65606d44616b50225e76f5578f33c568a0b876a5"
+  integrity sha512-MadJiU3rLKclzT5kBH4yxdry96odTUwuqrZM+GllFI/VhxfPz+k9MshJM+MwhfkCdxxclSbSBbUGciBngR+kEQ==
+  dependencies:
+    "@babel/helper-module-transforms" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    babel-plugin-dynamic-import-node "^2.3.0"
+
 "@babel/plugin-transform-modules-commonjs@^7.5.0", "@babel/plugin-transform-modules-commonjs@^7.6.0":
   version "7.6.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.6.0.tgz#39dfe957de4420445f1fcf88b68a2e4aa4515486"
@@ -976,14 +1294,14 @@
     "@babel/helper-simple-access" "^7.1.0"
     babel-plugin-dynamic-import-node "^2.3.0"
 
-"@babel/plugin-transform-modules-commonjs@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.7.0.tgz#3e5ffb4fd8c947feede69cbe24c9554ab4113fe3"
-  integrity sha512-KEMyWNNWnjOom8vR/1+d+Ocz/mILZG/eyHHO06OuBQ2aNhxT62fr4y6fGOplRx+CxCSp3IFwesL8WdINfY/3kg==
+"@babel/plugin-transform-modules-commonjs@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.8.3.tgz#df251706ec331bd058a34bdd72613915f82928a5"
+  integrity sha512-JpdMEfA15HZ/1gNuB9XEDlZM1h/gF/YOH7zaZzQu2xCFRfwc01NXBMHHSTT6hRjlXJJs5x/bfODM3LiCk94Sxg==
   dependencies:
-    "@babel/helper-module-transforms" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/helper-simple-access" "^7.7.0"
+    "@babel/helper-module-transforms" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-simple-access" "^7.8.3"
     babel-plugin-dynamic-import-node "^2.3.0"
 
 "@babel/plugin-transform-modules-systemjs@^7.5.0":
@@ -995,13 +1313,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     babel-plugin-dynamic-import-node "^2.3.0"
 
-"@babel/plugin-transform-modules-systemjs@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.7.0.tgz#9baf471213af9761c1617bb12fd278e629041417"
-  integrity sha512-ZAuFgYjJzDNv77AjXRqzQGlQl4HdUM6j296ee4fwKVZfhDR9LAGxfvXjBkb06gNETPnN0sLqRm9Gxg4wZH6dXg==
+"@babel/plugin-transform-modules-systemjs@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.8.3.tgz#d8bbf222c1dbe3661f440f2f00c16e9bb7d0d420"
+  integrity sha512-8cESMCJjmArMYqa9AO5YuMEkE4ds28tMpZcGZB/jl3n0ZzlsxOAi3mC+SKypTfT8gjMupCnd3YiXCkMjj2jfOg==
   dependencies:
-    "@babel/helper-hoist-variables" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-hoist-variables" "^7.8.3"
+    "@babel/helper-module-transforms" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
     babel-plugin-dynamic-import-node "^2.3.0"
 
 "@babel/plugin-transform-modules-umd@^7.2.0":
@@ -1012,13 +1331,13 @@
     "@babel/helper-module-transforms" "^7.1.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
-"@babel/plugin-transform-modules-umd@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.7.0.tgz#d62c7da16670908e1d8c68ca0b5d4c0097b69966"
-  integrity sha512-u7eBA03zmUswQ9LQ7Qw0/ieC1pcAkbp5OQatbWUzY1PaBccvuJXUkYzoN1g7cqp7dbTu6Dp9bXyalBvD04AANA==
+"@babel/plugin-transform-modules-umd@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.8.3.tgz#592d578ce06c52f5b98b02f913d653ffe972661a"
+  integrity sha512-evhTyWhbwbI3/U6dZAnx/ePoV7H6OUG+OjiJFHmhr9FPn0VShjwC2kdxqIuQ/+1P50TMrneGzMeyMTFOjKSnAw==
   dependencies:
-    "@babel/helper-module-transforms" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-module-transforms" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
 
 "@babel/plugin-transform-named-capturing-groups-regex@^7.6.2":
   version "7.6.2"
@@ -1027,12 +1346,12 @@
   dependencies:
     regexpu-core "^4.6.0"
 
-"@babel/plugin-transform-named-capturing-groups-regex@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.7.0.tgz#358e6fd869b9a4d8f5cbc79e4ed4fc340e60dcaf"
-  integrity sha512-+SicSJoKouPctL+j1pqktRVCgy+xAch1hWWTMy13j0IflnyNjaoskj+DwRQFimHbLqO3sq2oN2CXMvXq3Bgapg==
+"@babel/plugin-transform-named-capturing-groups-regex@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.8.3.tgz#a2a72bffa202ac0e2d0506afd0939c5ecbc48c6c"
+  integrity sha512-f+tF/8UVPU86TrCb06JoPWIdDpTNSGGcAtaD9mLP0aYGA0OS0j7j7DHJR0GTFrUZPUU6loZhbsVZgTh0N+Qdnw==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.7.0"
+    "@babel/helper-create-regexp-features-plugin" "^7.8.3"
 
 "@babel/plugin-transform-new-target@^7.4.4":
   version "7.4.4"
@@ -1041,6 +1360,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-new-target@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.8.3.tgz#60cc2ae66d85c95ab540eb34babb6434d4c70c43"
+  integrity sha512-QuSGysibQpyxexRyui2vca+Cmbljo8bcRckgzYV4kRIsHpVeyeC3JDO63pY+xFZ6bWOBn7pfKZTqV4o/ix9sFw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-object-super@^7.5.5":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.5.5.tgz#c70021df834073c65eb613b8679cc4a381d1a9f9"
@@ -1049,6 +1375,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/helper-replace-supers" "^7.5.5"
 
+"@babel/plugin-transform-object-super@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.8.3.tgz#ebb6a1e7a86ffa96858bd6ac0102d65944261725"
+  integrity sha512-57FXk+gItG/GejofIyLIgBKTas4+pEU47IXKDBWFTxdPd7F80H8zybyAY7UoblVfBhBGs2EKM+bJUu2+iUYPDQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-replace-supers" "^7.8.3"
+
 "@babel/plugin-transform-parameters@^7.4.4":
   version "7.4.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.4.4.tgz#7556cf03f318bd2719fe4c922d2d808be5571e16"
@@ -1058,6 +1392,15 @@
     "@babel/helper-get-function-arity" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-parameters@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.8.3.tgz#7890576a13b17325d8b7d44cb37f21dc3bbdda59"
+  integrity sha512-/pqngtGb54JwMBZ6S/D3XYylQDFtGjWrnoCF4gXZOUpFV/ujbxnoNGNvDGu6doFWRPBveE72qTx/RRU44j5I/Q==
+  dependencies:
+    "@babel/helper-call-delegate" "^7.8.3"
+    "@babel/helper-get-function-arity" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-property-literals@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.2.0.tgz#03e33f653f5b25c4eb572c98b9485055b389e905"
@@ -1065,6 +1408,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-property-literals@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.8.3.tgz#33194300d8539c1ed28c62ad5087ba3807b98263"
+  integrity sha512-uGiiXAZMqEoQhRWMK17VospMZh5sXWg+dlh2soffpkAl96KAm+WZuJfa6lcELotSRmooLqg0MWdH6UUq85nmmg==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-regenerator@^7.4.5":
   version "7.4.5"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.4.5.tgz#629dc82512c55cee01341fb27bdfcb210354680f"
@@ -1072,10 +1422,10 @@
   dependencies:
     regenerator-transform "^0.14.0"
 
-"@babel/plugin-transform-regenerator@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.7.0.tgz#f1b20b535e7716b622c99e989259d7dd942dd9cc"
-  integrity sha512-AXmvnC+0wuj/cFkkS/HFHIojxH3ffSXE+ttulrqWjZZRaUOonfJc60e1wSNT4rV8tIunvu/R3wCp71/tLAa9xg==
+"@babel/plugin-transform-regenerator@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.8.3.tgz#b31031e8059c07495bf23614c97f3d9698bc6ec8"
+  integrity sha512-qt/kcur/FxrQrzFR432FGZznkVAjiyFtCOANjkAKwCbt465L6ZCiUQh2oMYGU3Wo8LRFJxNDFwWn106S5wVUNA==
   dependencies:
     regenerator-transform "^0.14.0"
 
@@ -1086,6 +1436,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-reserved-words@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.8.3.tgz#9a0635ac4e665d29b162837dd3cc50745dfdf1f5"
+  integrity sha512-mwMxcycN3omKFDjDQUl+8zyMsBfjRFr0Zn/64I41pmjv4NJuqcYlEtezwYtw9TFd9WR1vN5kiM+O0gMZzO6L0A==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-shorthand-properties@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.2.0.tgz#6333aee2f8d6ee7e28615457298934a3b46198f0"
@@ -1093,6 +1450,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-shorthand-properties@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.8.3.tgz#28545216e023a832d4d3a1185ed492bcfeac08c8"
+  integrity sha512-I9DI6Odg0JJwxCHzbzW08ggMdCezoWcuQRz3ptdudgwaHxTjxw5HgdFJmZIkIMlRymL6YiZcped4TTCB0JcC8w==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-spread@^7.6.2":
   version "7.6.2"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.6.2.tgz#fc77cf798b24b10c46e1b51b1b88c2bf661bb8dd"
@@ -1100,6 +1464,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-spread@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-spread/-/plugin-transform-spread-7.8.3.tgz#9c8ffe8170fdfb88b114ecb920b82fb6e95fe5e8"
+  integrity sha512-CkuTU9mbmAoFOI1tklFWYYbzX5qCIZVXPVy0jpXgGwkplCndQAa58s2jr66fTeQnA64bDox0HL4U56CFYoyC7g==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-sticky-regex@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.2.0.tgz#a1e454b5995560a9c1e0d537dfc15061fd2687e1"
@@ -1108,6 +1479,14 @@
     "@babel/helper-plugin-utils" "^7.0.0"
     "@babel/helper-regex" "^7.0.0"
 
+"@babel/plugin-transform-sticky-regex@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.8.3.tgz#be7a1290f81dae767475452199e1f76d6175b100"
+  integrity sha512-9Spq0vGCD5Bb4Z/ZXXSK5wbbLFMG085qd2vhL1JYu1WcQ5bXqZBAYRzU1d+p79GcHs2szYv5pVQCX13QgldaWw==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/helper-regex" "^7.8.3"
+
 "@babel/plugin-transform-template-literals@^7.4.4":
   version "7.4.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.4.4.tgz#9d28fea7bbce637fb7612a0750989d8321d4bcb0"
@@ -1116,6 +1495,14 @@
     "@babel/helper-annotate-as-pure" "^7.0.0"
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-template-literals@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.8.3.tgz#7bfa4732b455ea6a43130adc0ba767ec0e402a80"
+  integrity sha512-820QBtykIQOLFT8NZOcTRJ1UNuztIELe4p9DCgvj4NK+PwluSJ49we7s9FB1HIGNIYT7wFUJ0ar2QpCDj0escQ==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-typeof-symbol@^7.2.0":
   version "7.2.0"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.2.0.tgz#117d2bcec2fbf64b4b59d1f9819894682d29f2b2"
@@ -1123,6 +1510,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-transform-typeof-symbol@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.8.3.tgz#5cffb216fb25c8c64ba6bf5f76ce49d3ab079f4d"
+  integrity sha512-3TrkKd4LPqm4jHs6nPtSDI/SV9Cm5PRJkHLUgTcqRQQTMAZ44ZaAdDZJtvWFSaRcvT0a1rTmJ5ZA5tDKjleF3g==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.8.3"
+
 "@babel/plugin-transform-unicode-regex@^7.6.2":
   version "7.6.2"
   resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.6.2.tgz#b692aad888a7e8d8b1b214be6b9dc03d5031f698"
@@ -1132,77 +1526,83 @@
     "@babel/helper-regex" "^7.4.4"
     regexpu-core "^4.6.0"
 
-"@babel/plugin-transform-unicode-regex@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.7.0.tgz#743d9bcc44080e3cc7d49259a066efa30f9187a3"
-  integrity sha512-RrThb0gdrNwFAqEAAx9OWgtx6ICK69x7i9tCnMdVrxQwSDp/Abu9DXFU5Hh16VP33Rmxh04+NGW28NsIkFvFKA==
+"@babel/plugin-transform-unicode-regex@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.8.3.tgz#0cef36e3ba73e5c57273effb182f46b91a1ecaad"
+  integrity sha512-+ufgJjYdmWfSQ+6NS9VGUR2ns8cjJjYbrbi11mZBTaWm+Fui/ncTLFF28Ei1okavY+xkojGr1eJxNsWYeA5aZw==
   dependencies:
-    "@babel/helper-create-regexp-features-plugin" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
+    "@babel/helper-create-regexp-features-plugin" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
 
-"@babel/polyfill@^7.6.0":
-  version "7.6.0"
-  resolved "https://registry.yarnpkg.com/@babel/polyfill/-/polyfill-7.6.0.tgz#6d89203f8b6cd323e8d946e47774ea35dc0619cc"
-  integrity sha512-q5BZJI0n/B10VaQQvln1IlDK3BTBJFbADx7tv+oXDPIDZuTo37H5Adb9jhlXm/fEN4Y7/64qD9mnrJJG7rmaTw==
+"@babel/polyfill@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/polyfill/-/polyfill-7.8.3.tgz#2333fc2144a542a7c07da39502ceeeb3abe4debd"
+  integrity sha512-0QEgn2zkCzqGIkSWWAEmvxD7e00Nm9asTtQvi7HdlYvMhjy/J38V/1Y9ode0zEJeIuxAI0uftiAzqc7nVeWUGg==
   dependencies:
     core-js "^2.6.5"
     regenerator-runtime "^0.13.2"
 
-"@babel/preset-env@7.7.1":
-  version "7.7.1"
-  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.7.1.tgz#04a2ff53552c5885cf1083e291c8dd5490f744bb"
-  integrity sha512-/93SWhi3PxcVTDpSqC+Dp4YxUu3qZ4m7I76k0w73wYfn7bGVuRIO4QUz95aJksbS+AD1/mT1Ie7rbkT0wSplaA==
-  dependencies:
-    "@babel/helper-module-imports" "^7.7.0"
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@babel/plugin-proposal-async-generator-functions" "^7.7.0"
-    "@babel/plugin-proposal-dynamic-import" "^7.7.0"
-    "@babel/plugin-proposal-json-strings" "^7.2.0"
-    "@babel/plugin-proposal-object-rest-spread" "^7.6.2"
-    "@babel/plugin-proposal-optional-catch-binding" "^7.2.0"
-    "@babel/plugin-proposal-unicode-property-regex" "^7.7.0"
-    "@babel/plugin-syntax-async-generators" "^7.2.0"
-    "@babel/plugin-syntax-dynamic-import" "^7.2.0"
-    "@babel/plugin-syntax-json-strings" "^7.2.0"
-    "@babel/plugin-syntax-object-rest-spread" "^7.2.0"
-    "@babel/plugin-syntax-optional-catch-binding" "^7.2.0"
-    "@babel/plugin-syntax-top-level-await" "^7.7.0"
-    "@babel/plugin-transform-arrow-functions" "^7.2.0"
-    "@babel/plugin-transform-async-to-generator" "^7.7.0"
-    "@babel/plugin-transform-block-scoped-functions" "^7.2.0"
-    "@babel/plugin-transform-block-scoping" "^7.6.3"
-    "@babel/plugin-transform-classes" "^7.7.0"
-    "@babel/plugin-transform-computed-properties" "^7.2.0"
-    "@babel/plugin-transform-destructuring" "^7.6.0"
-    "@babel/plugin-transform-dotall-regex" "^7.7.0"
-    "@babel/plugin-transform-duplicate-keys" "^7.5.0"
-    "@babel/plugin-transform-exponentiation-operator" "^7.2.0"
-    "@babel/plugin-transform-for-of" "^7.4.4"
-    "@babel/plugin-transform-function-name" "^7.7.0"
-    "@babel/plugin-transform-literals" "^7.2.0"
-    "@babel/plugin-transform-member-expression-literals" "^7.2.0"
-    "@babel/plugin-transform-modules-amd" "^7.5.0"
-    "@babel/plugin-transform-modules-commonjs" "^7.7.0"
-    "@babel/plugin-transform-modules-systemjs" "^7.7.0"
-    "@babel/plugin-transform-modules-umd" "^7.7.0"
-    "@babel/plugin-transform-named-capturing-groups-regex" "^7.7.0"
-    "@babel/plugin-transform-new-target" "^7.4.4"
-    "@babel/plugin-transform-object-super" "^7.5.5"
-    "@babel/plugin-transform-parameters" "^7.4.4"
-    "@babel/plugin-transform-property-literals" "^7.2.0"
-    "@babel/plugin-transform-regenerator" "^7.7.0"
-    "@babel/plugin-transform-reserved-words" "^7.2.0"
-    "@babel/plugin-transform-shorthand-properties" "^7.2.0"
-    "@babel/plugin-transform-spread" "^7.6.2"
-    "@babel/plugin-transform-sticky-regex" "^7.2.0"
-    "@babel/plugin-transform-template-literals" "^7.4.4"
-    "@babel/plugin-transform-typeof-symbol" "^7.2.0"
-    "@babel/plugin-transform-unicode-regex" "^7.7.0"
-    "@babel/types" "^7.7.1"
-    browserslist "^4.6.0"
-    core-js-compat "^3.1.1"
+"@babel/preset-env@7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.8.3.tgz#dc0fb2938f52bbddd79b3c861a4b3427dd3a6c54"
+  integrity sha512-Rs4RPL2KjSLSE2mWAx5/iCH+GC1ikKdxPrhnRS6PfFVaiZeom22VFKN4X8ZthyN61kAaR05tfXTbCvatl9WIQg==
+  dependencies:
+    "@babel/compat-data" "^7.8.0"
+    "@babel/helper-compilation-targets" "^7.8.3"
+    "@babel/helper-module-imports" "^7.8.3"
+    "@babel/helper-plugin-utils" "^7.8.3"
+    "@babel/plugin-proposal-async-generator-functions" "^7.8.3"
+    "@babel/plugin-proposal-dynamic-import" "^7.8.3"
+    "@babel/plugin-proposal-json-strings" "^7.8.3"
+    "@babel/plugin-proposal-nullish-coalescing-operator" "^7.8.3"
+    "@babel/plugin-proposal-object-rest-spread" "^7.8.3"
+    "@babel/plugin-proposal-optional-catch-binding" "^7.8.3"
+    "@babel/plugin-proposal-optional-chaining" "^7.8.3"
+    "@babel/plugin-proposal-unicode-property-regex" "^7.8.3"
+    "@babel/plugin-syntax-async-generators" "^7.8.0"
+    "@babel/plugin-syntax-dynamic-import" "^7.8.0"
+    "@babel/plugin-syntax-json-strings" "^7.8.0"
+    "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.0"
+    "@babel/plugin-syntax-object-rest-spread" "^7.8.0"
+    "@babel/plugin-syntax-optional-catch-binding" "^7.8.0"
+    "@babel/plugin-syntax-optional-chaining" "^7.8.0"
+    "@babel/plugin-syntax-top-level-await" "^7.8.3"
+    "@babel/plugin-transform-arrow-functions" "^7.8.3"
+    "@babel/plugin-transform-async-to-generator" "^7.8.3"
+    "@babel/plugin-transform-block-scoped-functions" "^7.8.3"
+    "@babel/plugin-transform-block-scoping" "^7.8.3"
+    "@babel/plugin-transform-classes" "^7.8.3"
+    "@babel/plugin-transform-computed-properties" "^7.8.3"
+    "@babel/plugin-transform-destructuring" "^7.8.3"
+    "@babel/plugin-transform-dotall-regex" "^7.8.3"
+    "@babel/plugin-transform-duplicate-keys" "^7.8.3"
+    "@babel/plugin-transform-exponentiation-operator" "^7.8.3"
+    "@babel/plugin-transform-for-of" "^7.8.3"
+    "@babel/plugin-transform-function-name" "^7.8.3"
+    "@babel/plugin-transform-literals" "^7.8.3"
+    "@babel/plugin-transform-member-expression-literals" "^7.8.3"
+    "@babel/plugin-transform-modules-amd" "^7.8.3"
+    "@babel/plugin-transform-modules-commonjs" "^7.8.3"
+    "@babel/plugin-transform-modules-systemjs" "^7.8.3"
+    "@babel/plugin-transform-modules-umd" "^7.8.3"
+    "@babel/plugin-transform-named-capturing-groups-regex" "^7.8.3"
+    "@babel/plugin-transform-new-target" "^7.8.3"
+    "@babel/plugin-transform-object-super" "^7.8.3"
+    "@babel/plugin-transform-parameters" "^7.8.3"
+    "@babel/plugin-transform-property-literals" "^7.8.3"
+    "@babel/plugin-transform-regenerator" "^7.8.3"
+    "@babel/plugin-transform-reserved-words" "^7.8.3"
+    "@babel/plugin-transform-shorthand-properties" "^7.8.3"
+    "@babel/plugin-transform-spread" "^7.8.3"
+    "@babel/plugin-transform-sticky-regex" "^7.8.3"
+    "@babel/plugin-transform-template-literals" "^7.8.3"
+    "@babel/plugin-transform-typeof-symbol" "^7.8.3"
+    "@babel/plugin-transform-unicode-regex" "^7.8.3"
+    "@babel/types" "^7.8.3"
+    browserslist "^4.8.2"
+    core-js-compat "^3.6.2"
     invariant "^2.2.2"
-    js-levenshtein "^1.1.3"
+    levenary "^1.1.0"
     semver "^5.5.0"
 
 "@babel/preset-env@^7.0.0":
@@ -1270,14 +1670,23 @@
     "@babel/parser" "^7.6.0"
     "@babel/types" "^7.6.0"
 
-"@babel/template@^7.7.0":
-  version "7.7.0"
-  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.7.0.tgz#4fadc1b8e734d97f56de39c77de76f2562e597d0"
-  integrity sha512-OKcwSYOW1mhWbnTBgQY5lvg1Fxg+VyfQGjcBduZFljfc044J5iDlnDSfhQ867O17XHiSCxYHUxHg2b7ryitbUQ==
+"@babel/template@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.7.4.tgz#428a7d9eecffe27deac0a98e23bf8e3675d2a77b"
+  integrity sha512-qUzihgVPguAzXCK7WXw8pqs6cEwi54s3E+HrejlkuWO6ivMKx9hZl3Y2fSXp9i5HgyWmj7RKP+ulaYnKM4yYxw==
   dependencies:
     "@babel/code-frame" "^7.0.0"
-    "@babel/parser" "^7.7.0"
-    "@babel/types" "^7.7.0"
+    "@babel/parser" "^7.7.4"
+    "@babel/types" "^7.7.4"
+
+"@babel/template@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.8.3.tgz#e02ad04fe262a657809327f578056ca15fd4d1b8"
+  integrity sha512-04m87AcQgAFdvuoyiQ2kgELr2tV8B4fP/xJAVUL3Yb3bkNdMedD3d0rlSQr3PegP0cms3eHjl1F7PWlvWbU8FQ==
+  dependencies:
+    "@babel/code-frame" "^7.8.3"
+    "@babel/parser" "^7.8.3"
+    "@babel/types" "^7.8.3"
 
 "@babel/traverse@^7.0.0", "@babel/traverse@^7.1.0", "@babel/traverse@^7.4.3", "@babel/traverse@^7.4.4", "@babel/traverse@^7.5.5", "@babel/traverse@^7.6.2":
   version "7.6.2"
@@ -1294,17 +1703,32 @@
     globals "^11.1.0"
     lodash "^4.17.13"
 
-"@babel/traverse@^7.7.0", "@babel/traverse@^7.7.2":
-  version "7.7.2"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.7.2.tgz#ef0a65e07a2f3c550967366b3d9b62a2dcbeae09"
-  integrity sha512-TM01cXib2+rgIZrGJOLaHV/iZUAxf4A0dt5auY6KNZ+cm6aschuJGqKJM3ROTt3raPUdIDk9siAufIFEleRwtw==
+"@babel/traverse@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.7.4.tgz#9c1e7c60fb679fe4fcfaa42500833333c2058558"
+  integrity sha512-P1L58hQyupn8+ezVA2z5KBm4/Zr4lCC8dwKCMYzsa5jFMDMQAzaBNy9W5VjB+KAmBjb40U7a/H6ao+Xo+9saIw==
   dependencies:
     "@babel/code-frame" "^7.5.5"
-    "@babel/generator" "^7.7.2"
-    "@babel/helper-function-name" "^7.7.0"
-    "@babel/helper-split-export-declaration" "^7.7.0"
-    "@babel/parser" "^7.7.2"
-    "@babel/types" "^7.7.2"
+    "@babel/generator" "^7.7.4"
+    "@babel/helper-function-name" "^7.7.4"
+    "@babel/helper-split-export-declaration" "^7.7.4"
+    "@babel/parser" "^7.7.4"
+    "@babel/types" "^7.7.4"
+    debug "^4.1.0"
+    globals "^11.1.0"
+    lodash "^4.17.13"
+
+"@babel/traverse@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.8.3.tgz#a826215b011c9b4f73f3a893afbc05151358bf9a"
+  integrity sha512-we+a2lti+eEImHmEXp7bM9cTxGzxPmBiVJlLVD+FuuQMeeO7RaDbutbgeheDkw+Xe3mCfJHnGOWLswT74m2IPg==
+  dependencies:
+    "@babel/code-frame" "^7.8.3"
+    "@babel/generator" "^7.8.3"
+    "@babel/helper-function-name" "^7.8.3"
+    "@babel/helper-split-export-declaration" "^7.8.3"
+    "@babel/parser" "^7.8.3"
+    "@babel/types" "^7.8.3"
     debug "^4.1.0"
     globals "^11.1.0"
     lodash "^4.17.13"
@@ -1318,7 +1742,7 @@
     lodash "^4.17.13"
     to-fast-properties "^2.0.0"
 
-"@babel/types@^7.7.0", "@babel/types@^7.7.1", "@babel/types@^7.7.2":
+"@babel/types@^7.7.2":
   version "7.7.2"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.7.2.tgz#550b82e5571dcd174af576e23f0adba7ffc683f7"
   integrity sha512-YTf6PXoh3+eZgRCBzzP25Bugd2ngmpQVrk7kXX0i5N9BO7TFBtIgZYs7WtxtOGs8e6A4ZI7ECkbBCEHeXocvOA==
@@ -1327,6 +1751,24 @@
     lodash "^4.17.13"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.7.4":
+  version "7.7.4"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.7.4.tgz#516570d539e44ddf308c07569c258ff94fde9193"
+  integrity sha512-cz5Ji23KCi4T+YIE/BolWosrJuSmoZeN1EFnRtBwF+KKLi8GG/Z2c2hOJJeCXPk4mwk4QFvTmwIodJowXgttRA==
+  dependencies:
+    esutils "^2.0.2"
+    lodash "^4.17.13"
+    to-fast-properties "^2.0.0"
+
+"@babel/types@^7.8.3":
+  version "7.8.3"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.8.3.tgz#5a383dffa5416db1b73dedffd311ffd0788fb31c"
+  integrity sha512-jBD+G8+LWpMBBWvVcdr4QysjUE4mU/syrhN17o1u3gx0/WzJB1kwiVZAXRtWbsIPOwW8pF/YJV5+nmetPzepXg==
+  dependencies:
+    esutils "^2.0.2"
+    lodash "^4.17.13"
+    to-fast-properties "^2.0.0"
+
 "@cnakazawa/watch@^1.0.3":
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/@cnakazawa/watch/-/watch-1.0.3.tgz#099139eaec7ebf07a27c1786a3ff64f39464d2ef"
@@ -1361,6 +1803,21 @@
     normalize-path "^2.0.1"
     through2 "^2.0.3"
 
+"@istanbuljs/load-nyc-config@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@istanbuljs/load-nyc-config/-/load-nyc-config-1.0.0.tgz#10602de5570baea82f8afbfa2630b24e7a8cfe5b"
+  integrity sha512-ZR0rq/f/E4f4XcgnDvtMWXCUJpi8eO0rssVhmztsZqLIEFA9UUP9zmpE0VxlM+kv/E1ul2I876Fwil2ayptDVg==
+  dependencies:
+    camelcase "^5.3.1"
+    find-up "^4.1.0"
+    js-yaml "^3.13.1"
+    resolve-from "^5.0.0"
+
+"@istanbuljs/schema@^0.1.2":
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/@istanbuljs/schema/-/schema-0.1.2.tgz#26520bf09abe4a5644cd5414e37125a8954241dd"
+  integrity sha512-tsAQNx32a8CoFhjhijUIhI4kccIAgmGhy8LZMZgGfmXcpMbPRUqn5LWmgRttILi6yeGmBJd2xsPkFMs0PzgPCw==
+
 "@jest/console@^24.7.1", "@jest/console@^24.9.0":
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/@jest/console/-/console-24.9.0.tgz#79b1bc06fb74a8cfb01cbdedf945584b1b9707f0"
@@ -1524,11 +1981,24 @@
     "@nodelib/fs.stat" "2.0.2"
     run-parallel "^1.1.9"
 
+"@nodelib/fs.scandir@2.1.3":
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz#3a582bdb53804c6ba6d146579c46e52130cf4a3b"
+  integrity sha512-eGmwYQn3gxo4r7jdQnkrrN6bY478C3P+a/y72IJukF8LjB6ZHeB3c+Ehacj3sYeSmUXGlnA67/PmbM9CVwL7Dw==
+  dependencies:
+    "@nodelib/fs.stat" "2.0.3"
+    run-parallel "^1.1.9"
+
 "@nodelib/fs.stat@2.0.2", "@nodelib/fs.stat@^2.0.1":
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.2.tgz#2762aea8fe78ea256860182dcb52d61ee4b8fda6"
   integrity sha512-z8+wGWV2dgUhLqrtRYa03yDx4HWMvXKi1z8g3m2JyxAx8F7xk74asqPk5LAETjqDSGLFML/6CDl0+yFunSYicw==
 
+"@nodelib/fs.stat@2.0.3", "@nodelib/fs.stat@^2.0.2":
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz#34dc5f4cabbc720f4e60f75a747e7ecd6c175bd3"
+  integrity sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==
+
 "@nodelib/fs.walk@^1.2.1":
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.3.tgz#a555dc256acaf00c62b0db29529028dd4d4cb141"
@@ -1537,34 +2007,58 @@
     "@nodelib/fs.scandir" "2.1.2"
     fastq "^1.6.0"
 
+"@nodelib/fs.walk@^1.2.3":
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz#011b9202a70a6366e436ca5c065844528ab04976"
+  integrity sha512-1V9XOY4rDW0rehzbrcqAmHnz8e7SKvX27gh8Gt2WgB0+pdzdiLV83p72kZPU+jvMbS1qU5mauP2iOvO8rhmurQ==
+  dependencies:
+    "@nodelib/fs.scandir" "2.1.3"
+    fastq "^1.6.0"
+
 "@sindresorhus/is@^0.14.0":
   version "0.14.0"
   resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.14.0.tgz#9fb3a3cf3132328151f353de4632e01e52102bea"
   integrity sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ==
 
-"@sinonjs/commons@^1", "@sinonjs/commons@^1.3.0", "@sinonjs/commons@^1.4.0":
+"@sinonjs/commons@^1":
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.6.0.tgz#ec7670432ae9c8eb710400d112c201a362d83393"
   integrity sha512-w4/WHG7C4WWFyE5geCieFJF6MZkbW4VAriol5KlmQXpAQdxvV0p26sqNZOW6Qyw6Y0l9K4g+cHvvczR2sEEpqg==
   dependencies:
     type-detect "4.0.8"
 
-"@sinonjs/formatio@^3.2.1":
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/@sinonjs/formatio/-/formatio-3.2.1.tgz#52310f2f9bcbc67bdac18c94ad4901b95fde267e"
-  integrity sha512-tsHvOB24rvyvV2+zKMmPkZ7dXX6LSLKZ7aOtXY6Edklp0uRcgGpOsQTTGTcWViFyx4uhWc6GV8QdnALbIbIdeQ==
+"@sinonjs/commons@^1.6.0", "@sinonjs/commons@^1.7.0":
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.7.0.tgz#f90ffc52a2e519f018b13b6c4da03cbff36ebed6"
+  integrity sha512-qbk9AP+cZUsKdW1GJsBpxPKFmCJ0T8swwzVje3qFd+AkQb74Q/tiuzrdfFg8AD2g5HH/XbE/I8Uc1KYHVYWfhg==
+  dependencies:
+    type-detect "4.0.8"
+
+"@sinonjs/formatio@^4.0.1":
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/@sinonjs/formatio/-/formatio-4.0.1.tgz#50ac1da0c3eaea117ca258b06f4f88a471668bdb"
+  integrity sha512-asIdlLFrla/WZybhm0C8eEzaDNNrzymiTqHMeJl6zPW2881l3uuVRpm0QlRQEjqYWv6CcKMGYME3LbrLJsORBw==
   dependencies:
     "@sinonjs/commons" "^1"
-    "@sinonjs/samsam" "^3.1.0"
+    "@sinonjs/samsam" "^4.2.0"
 
-"@sinonjs/samsam@^3.1.0", "@sinonjs/samsam@^3.3.3":
-  version "3.3.3"
-  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-3.3.3.tgz#46682efd9967b259b81136b9f120fd54585feb4a"
-  integrity sha512-bKCMKZvWIjYD0BLGnNrxVuw4dkWCYsLqFOUWw8VgKF/+5Y+mE7LfHWPIYoDXowH+3a9LsWDMo0uAP8YDosPvHQ==
+"@sinonjs/samsam@^4.2.0":
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-4.2.0.tgz#64a9994331cc3da0a0d7cc06cae44faa09cb5f2c"
+  integrity sha512-yG7QbUz38ZPIegfuSMEcbOo0kkLGmPa8a0Qlz4dk7+cXYALDScWjIZzAm/u2+Frh+bcdZF6wZJZwwuJjY0WAjA==
   dependencies:
-    "@sinonjs/commons" "^1.3.0"
+    "@sinonjs/commons" "^1.6.0"
     array-from "^2.1.1"
-    lodash "^4.17.15"
+    lodash.get "^4.4.2"
+
+"@sinonjs/samsam@^4.2.2":
+  version "4.2.2"
+  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-4.2.2.tgz#0f6cb40e467865306d8a20a97543a94005204e23"
+  integrity sha512-z9o4LZUzSD9Hl22zV38aXNykgFeVj8acqfFabCY6FY83n/6s/XwNJyYYldz6/9lBJanpno9h+oL6HTISkviweA==
+  dependencies:
+    "@sinonjs/commons" "^1.6.0"
+    lodash.get "^4.4.2"
+    type-detect "^4.0.8"
 
 "@sinonjs/text-encoding@^0.7.1":
   version "0.7.1"
@@ -1705,11 +2199,21 @@ abab@^2.0.0:
   resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.2.tgz#a2fba1b122c69a85caa02d10f9270c7219709a9d"
   integrity sha512-2scffjvioEmNz0OyDSLGWDfKCVwaKc6l9Pm9kOIREU13ClXZvHpg/nRL5xyjSSSLhOnXqft2HpsAzNEEA8cFFg==
 
+abab@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.3.tgz#623e2075e02eb2d3f2475e49f99c91846467907a"
+  integrity sha512-tsFzPpcttalNjFBCFMqsKYQcWxxen1pgJR56by//QwvJc4/OUS3kPOOttx2tSIfjsylB0pYu7f5D3K1RCxUnUg==
+
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
   integrity sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==
 
+abbrev@1.0.x:
+  version "1.0.9"
+  resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"
+  integrity sha1-kbR5JYinc4wl813W9jdSovh3YTU=
+
 accepts@~1.2.12, accepts@~1.2.13:
   version "1.2.13"
   resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.2.13.tgz#e5f1f3928c6d95fd96558c36ec3d9d0de4a6ecea"
@@ -2334,7 +2838,7 @@ async-each@^1.0.0, async-each@^1.0.1:
   resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.3.tgz#b727dbf87d7651602f06f4d4ac387f47d91b0cbf"
   integrity sha512-z/WhQ5FPySLdvREByI2vZiTWwCnF0moMJ1hK9YQwDTHKh6I7/uSckMetoRGb5UBZPC1z0jlw+n/XCgjeH7y1AQ==
 
-async-limiter@^1.0.0, async-limiter@~1.0.0:
+async-limiter@~1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.1.tgz#dd379e94f0db8310b08291f9d64c3209766617fd"
   integrity sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ==
@@ -2346,6 +2850,11 @@ async-settle@^1.0.0:
   dependencies:
     async-done "^1.2.2"
 
+async@1.x:
+  version "1.5.2"
+  resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
+  integrity sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo=
+
 async@^2.1.2, async@^2.6.2:
   version "2.6.3"
   resolved "https://registry.yarnpkg.com/async/-/async-2.6.3.tgz#d72625e2344a3656e3a3ad4fa749fa83299d82ff"
@@ -2373,17 +2882,17 @@ atob@2.1.2, atob@^2.1.1:
   resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
   integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==
 
-autoprefixer@9.7.2:
-  version "9.7.2"
-  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.7.2.tgz#26cf729fbb709323b40171a874304884dcceffed"
-  integrity sha512-LCAfcdej1182uVvPOZnytbq61AhnOZ/4JelDaJGDeNwewyU1AMaNthcHsyz1NRjTmd2FkurMckLWfkHg3Z//KA==
+autoprefixer@9.7.4:
+  version "9.7.4"
+  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-9.7.4.tgz#f8bf3e06707d047f0641d87aee8cfb174b2a5378"
+  integrity sha512-g0Ya30YrMBAEZk60lp+qfX5YQllG+S5W3GYCFvyHTvhOki0AEQJLPEcIuGRsqVwLi8FvXPVtwTGhfr38hVpm0g==
   dependencies:
-    browserslist "^4.7.3"
-    caniuse-lite "^1.0.30001010"
+    browserslist "^4.8.3"
+    caniuse-lite "^1.0.30001020"
     chalk "^2.4.2"
     normalize-range "^0.1.2"
     num2fraction "^1.2.2"
-    postcss "^7.0.23"
+    postcss "^7.0.26"
     postcss-value-parser "^4.0.2"
 
 ava@^2.4.0:
@@ -2549,7 +3058,18 @@ babel-plugin-filter-imports@4.0.0:
     "@babel/types" "^7.7.2"
     lodash "^4.17.15"
 
-babel-plugin-istanbul@5.2.0, babel-plugin-istanbul@^5.1.0:
+babel-plugin-istanbul@6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-6.0.0.tgz#e159ccdc9af95e0b570c75b4573b7c34d671d765"
+  integrity sha512-AF55rZXpe7trmEylbaE1Gv54wn6rwU03aptvRoVIGP8YykoSxqdVLV1TfwflBCE/QtHmqtP8SWlTENqbK8GCSQ==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.0.0"
+    "@istanbuljs/load-nyc-config" "^1.0.0"
+    "@istanbuljs/schema" "^0.1.2"
+    istanbul-lib-instrument "^4.0.0"
+    test-exclude "^6.0.0"
+
+babel-plugin-istanbul@^5.1.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-5.2.0.tgz#df4ade83d897a92df069c4d9a25cf2671293c854"
   integrity sha512-5LphC0USA8t4i1zCtjbbNb6jJj/9+X6P37Qfirc/70EQ34xKlMW+a1RHGwxGI+SwWpNwZ27HqvzAobeqaXwiZw==
@@ -2589,15 +3109,6 @@ babel-plugin-transform-strict-mode@^6.24.1:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-polyfill@^6.26.0:
-  version "6.26.0"
-  resolved "https://registry.yarnpkg.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz#379937abc67d7895970adc621f284cd966cf2153"
-  integrity sha1-N5k3q8Z9eJWXCtxiHyhM2WbPIVM=
-  dependencies:
-    babel-runtime "^6.26.0"
-    core-js "^2.5.0"
-    regenerator-runtime "^0.10.5"
-
 babel-preset-jest@^24.9.0:
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-24.9.0.tgz#192b521e2217fb1d1f67cf73f70c336650ad3cdc"
@@ -2807,11 +3318,6 @@ blob@0.0.5:
   resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.5.tgz#d680eeef25f8cd91ad533f5b01eed48e64caf683"
   integrity sha512-gaqbzQPqOoamawKg0LGVd7SzLgXS+JH61oWprSLH+P+abTczqJbhTR8CmJ2u9/bUYNmHTGJx/UEmn6doAvvuig==
 
-bluebird@3.7.1:
-  version "3.7.1"
-  resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.1.tgz#df70e302b471d7473489acf26a93d63b53f874de"
-  integrity sha512-DdmyoGCleJnkbp3nkbxTLJ18rjDsE4yCggEwKNXkeV123sPNfOCYeDoeuOY+F2FrSjO1YXcTU+dsy96KMy+gcg==
-
 bluebird@^3.3.0, bluebird@^3.5.0, bluebird@^3.5.5:
   version "3.7.0"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.0.tgz#56a6a886e03f6ae577cffedeb524f8f2450293cf"
@@ -3101,14 +3607,23 @@ browserslist@^4.0.0, browserslist@^4.6.0, browserslist@^4.6.6:
     electron-to-chromium "^1.3.247"
     node-releases "^1.1.29"
 
-browserslist@^4.7.3:
-  version "4.7.3"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.7.3.tgz#02341f162b6bcc1e1028e30624815d4924442dc3"
-  integrity sha512-jWvmhqYpx+9EZm/FxcZSbUZyDEvDTLDi3nSAKbzEkyWvtI0mNSmUosey+5awDW1RUlrgXbQb5A6qY1xQH9U6MQ==
+browserslist@^4.8.2:
+  version "4.8.2"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.8.2.tgz#b45720ad5fbc8713b7253c20766f701c9a694289"
+  integrity sha512-+M4oeaTplPm/f1pXDw84YohEv7B1i/2Aisei8s4s6k3QsoSHa7i5sz8u/cGQkkatCPxMASKxPualR4wwYgVboA==
+  dependencies:
+    caniuse-lite "^1.0.30001015"
+    electron-to-chromium "^1.3.322"
+    node-releases "^1.1.42"
+
+browserslist@^4.8.3:
+  version "4.8.3"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.8.3.tgz#65802fcd77177c878e015f0e3189f2c4f627ba44"
+  integrity sha512-iU43cMMknxG1ClEZ2MDKeonKE1CCrFVkQK2AqO2YWFmvIrx4JWrvQ4w4hQez6EpVI8rHTtqh/ruHHDHSOKxvUg==
   dependencies:
-    caniuse-lite "^1.0.30001010"
-    electron-to-chromium "^1.3.306"
-    node-releases "^1.1.40"
+    caniuse-lite "^1.0.30001017"
+    electron-to-chromium "^1.3.322"
+    node-releases "^1.1.44"
 
 bser@^2.0.0:
   version "2.1.0"
@@ -3328,10 +3843,15 @@ caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000989:
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000998.tgz#7227a8046841e7d01e156ae7227a504d065f6744"
   integrity sha512-8Tj5sPZR9kMHeDD9SZXIVr5m9ofufLLCG2Y4QwQrH18GIwG+kCc+zYdlR036ZRkuKjVVetyxeAgGA1xF7XdmzQ==
 
-caniuse-lite@^1.0.30001010:
-  version "1.0.30001010"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001010.tgz#397a14034d384260453cc81994f494626d34b938"
-  integrity sha512-RA5GH9YjFNea4ZQszdWgh2SC+dpLiRAg4VDQS2b5JRI45OxmbGrYocYHTa9x0bKMQUE7uvHkNPNffUr+pCxSGw==
+caniuse-lite@^1.0.30001015:
+  version "1.0.30001016"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001016.tgz#16ea48d7d6e8caf3cad3295c2d746fe38c4e7f66"
+  integrity sha512-yYQ2QfotceRiH4U+h1Us86WJXtVHDmy3nEKIdYPsZCYnOV5/tMgGbmoIlrMzmh2VXlproqYtVaKeGDBkMZifFA==
+
+caniuse-lite@^1.0.30001017, caniuse-lite@^1.0.30001020:
+  version "1.0.30001020"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001020.tgz#3f04c1737500ffda78be9beb0b5c1e2070e15926"
+  integrity sha512-yWIvwA68wRHKanAVS1GjN8vajAv7MBFshullKCeq/eKpK7pJBVDgFFEqvgWTkcP2+wIDeQGYFRXECjKZnLkUjA==
 
 capture-exit@^2.0.0:
   version "2.0.0"
@@ -3433,6 +3953,21 @@ check-error@^1.0.2:
   resolved "https://registry.yarnpkg.com/check-error/-/check-error-1.0.2.tgz#574d312edd88bb5dd8912e9286dd6c0aed4aac82"
   integrity sha1-V00xLt2Iu13YkS6Sht1sCu1KrII=
 
+chokidar@3.3.0:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.3.0.tgz#12c0714668c55800f659e262d4962a97faf554a6"
+  integrity sha512-dGmKLDdT3Gdl7fBUe8XK+gAtGmzy5Fn0XkkWQuYxGIgWVPPse2CxFA5mtrlD0TOHaHjEUqkWNyP1XdHoJES/4A==
+  dependencies:
+    anymatch "~3.1.1"
+    braces "~3.0.2"
+    glob-parent "~5.1.0"
+    is-binary-path "~2.1.0"
+    is-glob "~4.0.1"
+    normalize-path "~3.0.0"
+    readdirp "~3.2.0"
+  optionalDependencies:
+    fsevents "~2.1.1"
+
 chokidar@^1.0.1:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-1.7.0.tgz#798e689778151c8076b4b360e5edd28cda2bb468"
@@ -3803,10 +4338,10 @@ commander@2.15.1:
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.15.1.tgz#df46e867d0fc2aec66a34662b406a9ccafff5b0f"
   integrity sha512-VlfT9F3V0v+jr4yxPc5gg9s62/fIVWsd2Bk2iD435um1NlGMYdVCq+MjcXnhYq2icNOizHr1kK+5TI6H0Hy0ag==
 
-commander@4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/commander/-/commander-4.0.1.tgz#b67622721785993182e807f4883633e6401ba53c"
-  integrity sha512-IPF4ouhCP+qdlcmCedhxX4xiGBPyigb8v5NeUp+0LyhwLgxMqyp3S0vl7TAPfS/hiP7FC3caI/PB9lTmP8r1NA==
+commander@4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-4.1.0.tgz#545983a0603fe425bc672d66c9e3c89c42121a83"
+  integrity sha512-NIQrwvv9V39FHgGFm36+U9SMQzbiHvU79k+iADraJTpmrFFfx7Ds0IvDoAdZsDrknlkRk14OYoWXb57uTh7/sw==
 
 commander@^2.19.0, commander@^2.20.0, commander@~2.20.0:
   version "2.20.1"
@@ -3823,10 +4358,10 @@ commander@~2.1.0:
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.1.0.tgz#d121bbae860d9992a3d517ba96f56588e47c6781"
   integrity sha1-0SG7roYNmZKj1Re6lvVliOR8Z4E=
 
-comment-parser@^0.7.0:
-  version "0.7.0"
-  resolved "https://registry.yarnpkg.com/comment-parser/-/comment-parser-0.7.0.tgz#9dc1f689a60d81fbcaf867d3c9eba3eb061ccfc1"
-  integrity sha512-m0SGP0RFO4P3hIBlIor4sBFPe5Y4HUeGgo/UZK/1Zdea5eUiqxroQ3lFqBDDSfWo9z9Q6LLnt2u0JqwacVEd/A==
+comment-parser@^0.7.2:
+  version "0.7.2"
+  resolved "https://registry.yarnpkg.com/comment-parser/-/comment-parser-0.7.2.tgz#baf6d99b42038678b81096f15b630d18142f4b8a"
+  integrity sha512-4Rjb1FnxtOcv9qsfuaNuVsmmVn4ooVoBHzYfyKteiXwIU84PClyGA5jASoFMwPV93+FPh9spwueXauxFJZkGAg==
 
 common-path-prefix@^1.0.0:
   version "1.0.0"
@@ -4100,16 +4635,29 @@ core-js-compat@^3.1.1:
     browserslist "^4.6.6"
     semver "^6.3.0"
 
+core-js-compat@^3.6.2:
+  version "3.6.4"
+  resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.6.4.tgz#938476569ebb6cda80d339bcf199fae4f16fff17"
+  integrity sha512-zAa3IZPvsJ0slViBQ2z+vgyyTuhd3MFn1rBQjZSKVEgB0UMYhUkCj9jJUVPgGTGqWvsBVmfnruXgTcNyTlEiSA==
+  dependencies:
+    browserslist "^4.8.3"
+    semver "7.0.0"
+
 core-js@^1.0.0:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
   integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
 
-core-js@^2.0.0, core-js@^2.4.0, core-js@^2.5.0, core-js@^2.6.5, core-js@^2.6.9:
+core-js@^2.0.0, core-js@^2.4.0, core-js@^2.6.5:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.9.tgz#6b4b214620c834152e179323727fc19741b084f2"
   integrity sha512-HOpZf6eXmnl7la+cUdMnLvUxKNqLUzJvgIziQ0DiF3JwSImNphIqdGqzj6hIKyX04MmV0poclQ7+wjWvxQyR2A==
 
+core-js@^3.0.0:
+  version "3.4.1"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.4.1.tgz#76dd6828412900ab27c8ce0b22e6114d7ce21b18"
+  integrity sha512-KX/dnuY/J8FtEwbnrzmAjUYgLqtk+cxM86hfG60LGiW3MmltIc2yAmDgBgEkfm0blZhUrdr1Zd84J2Y14mLxzg==
+
 core-util-is@1.0.2, core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
@@ -4378,10 +4926,10 @@ cssom@0.3.x, "cssom@>= 0.3.2 < 0.4.0", cssom@~0.3.6:
   resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.3.8.tgz#9f1276f5b2b463f2114d3f2c75250af8c1a36f4a"
   integrity sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==
 
-cssom@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.4.1.tgz#b24111d236b6dbd00cdfacb5ab67a20473381fe3"
-  integrity sha512-6Aajq0XmukE7HdXUU6IoSWuH1H6gH9z6qmagsstTiN7cW2FNTsb+J2Chs+ufPgZCsV/yo8oaEudQLrb9dGxSVQ==
+cssom@^0.4.4:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.4.4.tgz#5a66cf93d2d0b661d80bf6a44fb65f5c2e4e0a10"
+  integrity sha512-p3pvU7r1MyyqbTk+WbNJIgJjG2VmTIaB10rI93LzVPrmDJKkzKYMtxxyAvQXR/NS6otuzveI7+7BBq3SjBS2mw==
 
 cssstyle@^1.0.0:
   version "1.4.0"
@@ -4444,7 +4992,7 @@ dashdash@^1.12.0:
   dependencies:
     assert-plus "^1.0.0"
 
-data-urls@^1.0.0, data-urls@^1.1.0:
+data-urls@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-1.1.0.tgz#15ee0582baa5e22bb59c77140da8f9c76963bbfe"
   integrity sha512-YTWYI9se1P55u58gL5GkQHW4P6VJBJ5iBT+B5a7i2Tjadhv52paJG0qHX4A0OR6/t52odI64KP2YvFpkDOi3eQ==
@@ -4453,6 +5001,15 @@ data-urls@^1.0.0, data-urls@^1.1.0:
     whatwg-mimetype "^2.2.0"
     whatwg-url "^7.0.0"
 
+data-urls@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-2.0.0.tgz#156485a72963a970f5d5821aaf642bef2bf2db9b"
+  integrity sha512-X5eWTSXO/BJmpdIKCRuKUgSCgAN0OwliVK3yPKbwIWU1Tdw5BRajxlzMidvh+gwko9AfQ9zIj52pzF91Q3YAvQ==
+  dependencies:
+    abab "^2.0.3"
+    whatwg-mimetype "^2.3.0"
+    whatwg-url "^8.0.0"
+
 date-format@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/date-format/-/date-format-2.1.0.tgz#31d5b5ea211cf5fd764cd38baf9d033df7e125cf"
@@ -4535,6 +5092,11 @@ decamelize@^1.1.0, decamelize@^1.1.1, decamelize@^1.1.2, decamelize@^1.2.0:
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
   integrity sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=
 
+decimal.js@^10.2.0:
+  version "10.2.0"
+  resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.2.0.tgz#39466113a9e036111d02f82489b5fd6b0b5ed231"
+  integrity sha512-vDPw+rDgn3bZe1+F/pyEwb1oMG2XTlRVgAa6B4KccTEpYgF8w6eQllVbQcfIJnZyvzFtFpxnpGtx8dd7DJp/Rw==
+
 decode-uri-component@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"
@@ -4612,7 +5174,7 @@ defer-to-connect@^1.0.1:
   resolved "https://registry.yarnpkg.com/defer-to-connect/-/defer-to-connect-1.0.2.tgz#4bae758a314b034ae33902b5aac25a8dd6a8633e"
   integrity sha512-k09hcQcTDY+cwgiwa6PYKLm3jlagNzQ+RSvhjzESOGOx+MNOuXkxTfEvPrO1IOQ81tArCFYQgi631clB70RpQw==
 
-define-properties@^1.1.1, define-properties@^1.1.2, define-properties@^1.1.3:
+define-properties@^1.1.2, define-properties@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1"
   integrity sha512-3MqfYKj2lLzdMSf8ZIZE/V+Zuy+BgD6f164e8K2w7dgnpKArBDerGYpM46IYYcjnkdPNMjPk9A6VFB8+3SKlXQ==
@@ -4774,11 +5336,16 @@ diff-sequences@^24.9.0:
   resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-24.9.0.tgz#5715d6244e2aa65f48bba0bc972db0b0b11e95b5"
   integrity sha512-Dj6Wk3tWyTE+Fo1rW8v0Xhwk80um6yFYKbuAxc9c3EZxIHFDYwbi34Uk42u1CdnIiVorvt4RmlSDjIPyzGC2ew==
 
-diff@3.5.0, diff@^3.5.0:
+diff@3.5.0:
   version "3.5.0"
   resolved "https://registry.yarnpkg.com/diff/-/diff-3.5.0.tgz#800c0dd1e0a8bfbc95835c202ad220fe317e5a12"
   integrity sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA==
 
+diff@^4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/diff/-/diff-4.0.2.tgz#60f3aecb89d5fae520c11aa19efc2bb982aade7d"
+  integrity sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==
+
 diffie-hellman@^5.0.0:
   version "5.0.3"
   resolved "https://registry.yarnpkg.com/diffie-hellman/-/diffie-hellman-5.0.3.tgz#40e8ee98f55a2149607146921c63e1ae5f3d2875"
@@ -4847,6 +5414,13 @@ domexception@^1.0.1:
   dependencies:
     webidl-conversions "^4.0.2"
 
+domexception@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/domexception/-/domexception-2.0.1.tgz#fb44aefba793e1574b0af6aed2801d057529f304"
+  integrity sha512-yxJ2mFy/sibVQlu5qHjOkf9J3K6zgmCxgJ94u2EdvDOV09H+32LtRswEcUsmUWN72pVLOEnTSRaIVVzVQgS0dg==
+  dependencies:
+    webidl-conversions "^5.0.0"
+
 dompurify@2.0.7:
   version "2.0.7"
   resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.0.7.tgz#f8266ad38fe1602fb5b3222f31eedbf5c16c4fd5"
@@ -4954,10 +5528,10 @@ electron-to-chromium@^1.3.247:
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.273.tgz#94872d6823219f2812f2e35a2ce2a7d03c1eaa3f"
   integrity sha512-0kUppiHQvHEENHh+nTtvTt4eXMwcPyWmMaj73GPrSEm3ldKhmmHuOH6IjrmuW6YmyS/fpXcLvMQLNVpqRhpNWw==
 
-electron-to-chromium@^1.3.306:
-  version "1.3.306"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.306.tgz#e8265301d053d5f74e36cb876486830261fbe946"
-  integrity sha512-frDqXvrIROoYvikSKTIKbHbzO6M3/qC6kCIt/1FOa9kALe++c4VAJnwjSFvf1tYLEUsP2n9XZ4XSCyqc3l7A/A==
+electron-to-chromium@^1.3.322:
+  version "1.3.322"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.322.tgz#a6f7e1c79025c2b05838e8e344f6e89eb83213a8"
+  integrity sha512-Tc8JQEfGQ1MzfSzI/bTlSr7btJv/FFO7Yh6tanqVmIWOuNCu6/D1MilIEgLtmWqIrsv+o4IjpLAhgMBr/ncNAA==
 
 elliptic@^6.0.0:
   version "6.5.1"
@@ -5104,7 +5678,7 @@ errorhandler@~1.4.2:
     accepts "~1.3.0"
     escape-html "~1.0.3"
 
-es-abstract@^1.12.0, es-abstract@^1.13.0, es-abstract@^1.2.1, es-abstract@^1.5.1:
+es-abstract@^1.12.0, es-abstract@^1.13.0, es-abstract@^1.5.1:
   version "1.15.0"
   resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.15.0.tgz#8884928ec7e40a79e3c9bc812d37d10c8b24cc57"
   integrity sha512-bhkEqWJ2t2lMeaJDuk7okMkJWI/yqgH/EoGwpcvv0XW9RWQsRspI4wt6xuyuvMvvQE3gg/D9HXppgk21w78GyQ==
@@ -5120,6 +5694,23 @@ es-abstract@^1.12.0, es-abstract@^1.13.0, es-abstract@^1.2.1, es-abstract@^1.5.1
     string.prototype.trimleft "^2.1.0"
     string.prototype.trimright "^2.1.0"
 
+es-abstract@^1.17.0:
+  version "1.17.0"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.17.0.tgz#f42a517d0036a5591dbb2c463591dc8bb50309b1"
+  integrity sha512-yYkE07YF+6SIBmg1MsJ9dlub5L48Ek7X0qz+c/CPCHS9EBXfESorzng4cJQjJW5/pB6vDF41u7F8vUhLVDqIug==
+  dependencies:
+    es-to-primitive "^1.2.1"
+    function-bind "^1.1.1"
+    has "^1.0.3"
+    has-symbols "^1.0.1"
+    is-callable "^1.1.5"
+    is-regex "^1.0.5"
+    object-inspect "^1.7.0"
+    object-keys "^1.1.1"
+    object.assign "^4.1.0"
+    string.prototype.trimleft "^2.1.1"
+    string.prototype.trimright "^2.1.1"
+
 es-to-primitive@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.0.tgz#edf72478033456e8dda8ef09e00ad9650707f377"
@@ -5129,6 +5720,15 @@ es-to-primitive@^1.2.0:
     is-date-object "^1.0.1"
     is-symbol "^1.0.2"
 
+es-to-primitive@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a"
+  integrity sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==
+  dependencies:
+    is-callable "^1.1.4"
+    is-date-object "^1.0.1"
+    is-symbol "^1.0.2"
+
 es5-ext@^0.10.35, es5-ext@^0.10.45, es5-ext@^0.10.46, es5-ext@^0.10.50, es5-ext@^0.10.51, es5-ext@~0.10.14, es5-ext@~0.10.2, es5-ext@~0.10.46:
   version "0.10.51"
   resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.51.tgz#ed2d7d9d48a12df86e0299287e93a09ff478842f"
@@ -5233,12 +5833,12 @@ escape-string-regexp@^2.0.0:
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz#a30304e99daa32e23b2fd20f51babd07cffca344"
   integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==
 
-escodegen@1.12.0, escodegen@^1.11.1, escodegen@^1.9.1:
-  version "1.12.0"
-  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.12.0.tgz#f763daf840af172bb3a2b6dd7219c0e17f7ff541"
-  integrity sha512-TuA+EhsanGcme5T3R0L80u4t8CpbXQjegRmf7+FPTJrtCTErXFeelblRgHQa1FofEzqYYJmJ/OqjTwREp9qgmg==
+escodegen@1.13.0:
+  version "1.13.0"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.13.0.tgz#c7adf9bd3f3cc675bb752f202f79a720189cab29"
+  integrity sha512-eYk2dCkxR07DsHA/X2hRBj0CFAZeri/LyDMc0C8JT1Hqi6JnVpMhJ7XFITbb0+yZS3lVkaPL2oCkZ3AVmeVbMw==
   dependencies:
-    esprima "^3.1.3"
+    esprima "^4.0.1"
     estraverse "^4.2.0"
     esutils "^2.0.2"
     optionator "^0.8.1"
@@ -5256,6 +5856,42 @@ escodegen@1.3.x:
   optionalDependencies:
     source-map "~0.1.33"
 
+escodegen@1.8.x:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.8.1.tgz#5a5b53af4693110bebb0867aa3430dd3b70a1018"
+  integrity sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg=
+  dependencies:
+    esprima "^2.7.1"
+    estraverse "^1.9.1"
+    esutils "^2.0.2"
+    optionator "^0.8.1"
+  optionalDependencies:
+    source-map "~0.2.0"
+
+escodegen@^1.12.1:
+  version "1.12.1"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.12.1.tgz#08770602a74ac34c7a90ca9229e7d51e379abc76"
+  integrity sha512-Q8t2YZ+0e0pc7NRVj3B4tSQ9rim1oi4Fh46k2xhJ2qOiEwhQfdjyEQddWdj7ZFaKmU+5104vn1qrcjEPWq+bgQ==
+  dependencies:
+    esprima "^3.1.3"
+    estraverse "^4.2.0"
+    esutils "^2.0.2"
+    optionator "^0.8.1"
+  optionalDependencies:
+    source-map "~0.6.1"
+
+escodegen@^1.9.1:
+  version "1.12.0"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.12.0.tgz#f763daf840af172bb3a2b6dd7219c0e17f7ff541"
+  integrity sha512-TuA+EhsanGcme5T3R0L80u4t8CpbXQjegRmf7+FPTJrtCTErXFeelblRgHQa1FofEzqYYJmJ/OqjTwREp9qgmg==
+  dependencies:
+    esprima "^3.1.3"
+    estraverse "^4.2.0"
+    esutils "^2.0.2"
+    optionator "^0.8.1"
+  optionalDependencies:
+    source-map "~0.6.1"
+
 escope@^3.6.0:
   version "3.6.0"
   resolved "https://registry.yarnpkg.com/escope/-/escope-3.6.0.tgz#e01975e812781a163a6dadfdd80398dc64c889c3"
@@ -5266,22 +5902,22 @@ escope@^3.6.0:
     esrecurse "^4.1.0"
     estraverse "^4.1.1"
 
-eslint-config-prettier@6.7.0:
-  version "6.7.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-6.7.0.tgz#9a876952e12df2b284adbd3440994bf1f39dfbb9"
-  integrity sha512-FamQVKM3jjUVwhG4hEMnbtsq7xOIDm+SY5iBPfR8gKsJoAB2IQnNF+bk1+8Fy44Nq7PPJaLvkRxILYdJWoguKQ==
+eslint-config-prettier@6.10.0:
+  version "6.10.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-6.10.0.tgz#7b15e303bf9c956875c948f6b21500e48ded6a7f"
+  integrity sha512-AtndijGte1rPILInUdHjvKEGbIV06NuvPrqlIEaEaWtbtvJh464mDeyGMdZEQMsGvC0ZVkiex1fSNcC4HAbRGg==
   dependencies:
     get-stdin "^6.0.0"
 
-eslint-plugin-chai-expect@2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-chai-expect/-/eslint-plugin-chai-expect-2.0.1.tgz#0f9267745feafa723b8ec1bb151c073df5558f60"
-  integrity sha512-HiFoh9F9grVdVQEIwADwPA7SlcGZcsm9gdzZGDoH2SeUoUmYrUuq1cQmfjyOfqRpFOL6qlhcz5nZW2ppTH9ZlQ==
-
-eslint-plugin-eslint-plugin@2.1.0:
+eslint-plugin-chai-expect@2.1.0:
   version "2.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-eslint-plugin/-/eslint-plugin-eslint-plugin-2.1.0.tgz#a7a00f15a886957d855feacaafee264f039e62d5"
-  integrity sha512-kT3A/ZJftt28gbl/Cv04qezb/NQ1dwYIbi8lyf806XMxkus7DvOVCLIfTXMrorp322Pnoez7+zabXH29tADIDg==
+  resolved "https://registry.yarnpkg.com/eslint-plugin-chai-expect/-/eslint-plugin-chai-expect-2.1.0.tgz#9dd1d8e5a80543fdec956f6aef7f83f2241ca92b"
+  integrity sha512-rd0/4mjMV6c3i0o4DKkWI4uaFN9DK707kW+/fDphaDI6HVgxXnhML9Xgt5vHnTXmSSnDhupuCFBgsEAEpchXmQ==
+
+eslint-plugin-eslint-plugin@2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-eslint-plugin/-/eslint-plugin-eslint-plugin-2.2.1.tgz#9d567f2bb6891935d5d3e741f66c9ac42dc688fd"
+  integrity sha512-nvmoefIqdFX+skyCt/dN9HaeSNyL8A9UvEtCqCFfJBjKpAR0uRL3SGPLlvDsnfXWtN72G/viowvpA33VjQkGCg==
 
 eslint-plugin-google-camelcase@0.0.2:
   version "0.0.2"
@@ -5293,17 +5929,17 @@ eslint-plugin-jasmine@4.1.0:
   resolved "https://registry.yarnpkg.com/eslint-plugin-jasmine/-/eslint-plugin-jasmine-4.1.0.tgz#4f6d41b1a8622348c97559cbcd29badffa74dbfa"
   integrity sha512-Vfuk2Sm1ULR7MqGjVIOOEdQWyoFBfSwvwUeo9MrajVGJB3C24c9Mmj1Cgf8Qwmf3aS2bezPt1sckpKXWpd74Dw==
 
-eslint-plugin-jsdoc@18.1.4:
-  version "18.1.4"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-jsdoc/-/eslint-plugin-jsdoc-18.1.4.tgz#462b49f17acf3cc29b15c0eb124caaadf39be128"
-  integrity sha512-X3jXbAZAFwr2xZXpz8cyozDuu9ea2eWf8qiIgmgUbAo3vs8xWL0g4hVmCo/Pwg5T2qL6/+iksY3m+xjmd8NAig==
+eslint-plugin-jsdoc@20.4.0:
+  version "20.4.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-jsdoc/-/eslint-plugin-jsdoc-20.4.0.tgz#ea6725c3d1e68cd1ac0e633d935aa7e932b624c2"
+  integrity sha512-c/fnEpwWLFeQn+A7pb1qLOdyhovpqGCWCeUv1wtzFNL5G+xedl9wHUnXtp3b1sGHolVimi9DxKVTuhK/snXoOw==
   dependencies:
-    comment-parser "^0.7.0"
+    comment-parser "^0.7.2"
     debug "^4.1.1"
-    jsdoctypeparser "^6.0.0"
+    jsdoctypeparser "^6.1.0"
     lodash "^4.17.15"
     object.entries-ponyfill "^1.0.1"
-    regextras "^0.6.1"
+    regextras "^0.7.0"
     semver "^6.3.0"
     spdx-expression-parse "^3.0.0"
 
@@ -5321,10 +5957,10 @@ eslint-plugin-notice@0.8.9:
     lodash "^4.17.15"
     metric-lcs "^0.1.2"
 
-eslint-plugin-prettier@3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.1.1.tgz#507b8562410d02a03f0ddc949c616f877852f2ba"
-  integrity sha512-A+TZuHZ0KU0cnn56/9mfR7/KjUJ9QNVXUhwvRFSR7PGPe0zQR6PTkmyqg1AtUUEOzTqeRsUwyKFh0oVZKVCrtA==
+eslint-plugin-prettier@3.1.2:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.1.2.tgz#432e5a667666ab84ce72f945c72f77d996a5c9ba"
+  integrity sha512-GlolCC9y3XZfv3RQfwGew7NnuFDKsfI4lbvRK+PIIo23SFH+LemGs4cKwzAaRa+Mdb+lQO/STaIayno8T5sJJA==
   dependencies:
     prettier-linter-helpers "^1.0.0"
 
@@ -5367,10 +6003,10 @@ eslint-visitor-keys@^1.0.0, eslint-visitor-keys@^1.1.0:
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.1.0.tgz#e2a82cea84ff246ad6fb57f9bde5b46621459ec2"
   integrity sha512-8y9YjtM1JBJU/A9Kc+SbaOV4y29sSWckBwMHa+FGtVj5gN/sbnKDf6xJUl+8g7FAij9LVaP8C24DUiH/f/2Z9A==
 
-eslint@6.6.0:
-  version "6.6.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.6.0.tgz#4a01a2fb48d32aacef5530ee9c5a78f11a8afd04"
-  integrity sha512-PpEBq7b6qY/qrOmpYQ/jTMDYfuQMELR4g4WI1M/NaSDDD/bdcMb+dj4Hgks7p41kW2caXsPsEZAEAyAgjVVC0g==
+eslint@6.8.0:
+  version "6.8.0"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.8.0.tgz#62262d6729739f9275723824302fb227c8c93ffb"
+  integrity sha512-K+Iayyo2LtyYhDSYwz5D5QdWw0hCacNzyq1Y821Xna2xSJj7cijoLLYmLxTQgcgZ9mC61nryMy9S7GRbYpI5Ig==
   dependencies:
     "@babel/code-frame" "^7.0.0"
     ajv "^6.10.0"
@@ -5387,7 +6023,7 @@ eslint@6.6.0:
     file-entry-cache "^5.0.1"
     functional-red-black-tree "^1.0.1"
     glob-parent "^5.0.0"
-    globals "^11.7.0"
+    globals "^12.1.0"
     ignore "^4.0.6"
     import-fresh "^3.0.0"
     imurmurhash "^0.1.4"
@@ -5400,7 +6036,7 @@ eslint@6.6.0:
     minimatch "^3.0.4"
     mkdirp "^0.5.1"
     natural-compare "^1.4.0"
-    optionator "^0.8.2"
+    optionator "^0.8.3"
     progress "^2.0.0"
     regexpp "^2.0.1"
     semver "^6.1.2"
@@ -5491,7 +6127,7 @@ esprima@1.1.x, esprima@~1.1.1:
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-1.1.1.tgz#5b6f1547f4d102e670e140c509be6771d6aeb549"
   integrity sha1-W28VR/TRAuZw4UDFCb5ncdautUk=
 
-esprima@^2.1:
+esprima@2.7.x, esprima@^2.1, esprima@^2.7.1:
   version "2.7.3"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-2.7.3.tgz#96e3b70d5779f6ad49cd032673d1c312767ba581"
   integrity sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE=
@@ -5501,7 +6137,7 @@ esprima@^3.1.3:
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
   integrity sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM=
 
-esprima@^4.0.0:
+esprima@^4.0.0, esprima@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
   integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
@@ -5527,6 +6163,11 @@ esrecurse@^4.1.0:
   dependencies:
     estraverse "^4.1.0"
 
+estraverse@^1.9.1:
+  version "1.9.3"
+  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-1.9.3.tgz#af67f2dc922582415950926091a4005d29c9bb44"
+  integrity sha1-r2fy3JIlgkFZUJJgkaQAXSnJu0Q=
+
 estraverse@^4.0.0, estraverse@^4.1.0, estraverse@^4.1.1, estraverse@^4.2.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.3.0.tgz#398ad3f3c5a24948be7725e83d11a7de28cdbd1d"
@@ -5853,12 +6494,23 @@ fast-glob@^3.0.3:
     merge2 "^1.2.3"
     micromatch "^4.0.2"
 
+fast-glob@^3.1.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.1.1.tgz#87ee30e9e9f3eb40d6f254a7997655da753d7c82"
+  integrity sha512-nTCREpBY8w8r+boyFYAx21iL6faSsQynliPHM4Uf56SbkyohCNxpVPEH9xrF5TXKy+IsjkPUHDKiUkzBVRXn9g==
+  dependencies:
+    "@nodelib/fs.stat" "^2.0.2"
+    "@nodelib/fs.walk" "^1.2.3"
+    glob-parent "^5.1.0"
+    merge2 "^1.3.0"
+    micromatch "^4.0.2"
+
 fast-json-stable-stringify@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz#d5142c0caee6b1189f87d3a76111064f86c8bbf2"
   integrity sha1-1RQsDK7msRifh9OnYREGT4bIu/I=
 
-fast-levenshtein@~2.0.4:
+fast-levenshtein@~2.0.4, fast-levenshtein@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
@@ -5897,16 +6549,17 @@ fbjs@^0.8.4:
     setimmediate "^1.0.5"
     ua-parser-js "^0.7.18"
 
-fetch-mock@7.7.3:
-  version "7.7.3"
-  resolved "https://registry.yarnpkg.com/fetch-mock/-/fetch-mock-7.7.3.tgz#6a3f94cfed6e423ab7f5464912982030da605335"
-  integrity sha512-I4OkK90JFQnjH8/n3HDtWxH/I6D1wrxoAM2ri+nb444jpuH3RTcgvXx2el+G20KO873W727/66T7QhOvFxNHPg==
+fetch-mock@8.3.2:
+  version "8.3.2"
+  resolved "https://registry.yarnpkg.com/fetch-mock/-/fetch-mock-8.3.2.tgz#ca07cd0bbf8e9dd299733af364713766b43ab2a0"
+  integrity sha512-RUdLbhIBTvECX20I8htNhmLRrCplCiOP62srst8UQsSV0m8taJe31PBsQybL7OIq5fEf6tnqVGvQ62ZnZ4IFfQ==
   dependencies:
-    babel-polyfill "^6.26.0"
-    core-js "^2.6.9"
+    babel-runtime "^6.26.0"
+    core-js "^3.0.0"
     glob-to-regexp "^0.4.0"
     lodash.isequal "^4.5.0"
     path-to-regexp "^2.2.1"
+    querystring "^0.2.0"
     whatwg-url "^6.5.0"
 
 figures@^2.0.0:
@@ -6257,7 +6910,12 @@ fsevents@~2.1.0:
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.1.0.tgz#ce1a5f9ac71c6d75278b0c5bd236d7dfece4cbaa"
   integrity sha512-+iXhW3LuDQsno8dOIrCIT/CBjeBWuP7PXe8w9shnj9Lebny/Gx1ZjVBYwexLz36Ri2jKuXMNpV6CYNh8lHHgrQ==
 
-function-bind@^1.0.2, function-bind@^1.1.1:
+fsevents@~2.1.1:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.1.2.tgz#4c0a1fb34bc68e543b4b82a9ec392bfbda840805"
+  integrity sha512-R4wDiBwZ0KzpgOWetKDug1FZcYhqYnUYKtfZYt4mD5SBz76q0KR4Q9o7GIPamsVPGmW3EYPPJ0dOOjvx32ldZA==
+
+function-bind@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
   integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
@@ -6301,6 +6959,11 @@ gauge@~2.7.3:
     strip-ansi "^3.0.1"
     wide-align "^1.1.0"
 
+gensync@^1.0.0-beta.1:
+  version "1.0.0-beta.1"
+  resolved "https://registry.yarnpkg.com/gensync/-/gensync-1.0.0-beta.1.tgz#58f4361ff987e5ff6e1e7a210827aa371eaac269"
+  integrity sha512-r8EC6NO1sngH/zdD9fiRDLdcgnbayXah+mLgManTaIZJqEC1MZstmnox8KpnI2/fxQwrp5OpCOYWLp4rBl4Jcg==
+
 get-assigned-identifiers@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/get-assigned-identifiers/-/get-assigned-identifiers-1.2.0.tgz#6dbf411de648cbaf8d9169ebb0d2d576191e2ff1"
@@ -6392,7 +7055,7 @@ glob-parent@^3.0.1, glob-parent@^3.1.0:
     is-glob "^3.1.0"
     path-dirname "^1.0.0"
 
-glob-parent@^5.0.0, glob-parent@~5.1.0:
+glob-parent@^5.0.0, glob-parent@^5.1.0, glob-parent@~5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.0.tgz#5f4c1d1e748d30cd73ad2944b3577a81b081e8c2"
   integrity sha512-qjtRgnIVmOfnKUE3NJAQEdk+lKrxfw8t5ke7SXtfMTHcjsBfOfWXCQfdb30zfDoZQ2IRSIiidmjtbHZPZ++Ihw==
@@ -6444,7 +7107,7 @@ glob@7.1.3:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@^5.0.6:
+glob@^5.0.15, glob@^5.0.6:
   version "5.0.15"
   resolved "https://registry.yarnpkg.com/glob/-/glob-5.0.15.tgz#1bc936b9e02f4a603fcc222ecf7633d30b8b93b1"
   integrity sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E=
@@ -6467,6 +7130,18 @@ glob@^7.0.3, glob@^7.1.0, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
+glob@^7.1.4:
+  version "7.1.6"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.6.tgz#141f33b81a7c2492e125594307480c46679278a6"
+  integrity sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==
+  dependencies:
+    fs.realpath "^1.0.0"
+    inflight "^1.0.4"
+    inherits "2"
+    minimatch "^3.0.4"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
+
 global-cache@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/global-cache/-/global-cache-1.2.1.tgz#39ca020d3dd7b3f0934c52b75363f8d53312c16d"
@@ -6507,12 +7182,31 @@ globals@^11.1.0, globals@^11.7.0:
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
   integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==
 
+globals@^12.1.0:
+  version "12.3.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-12.3.0.tgz#1e564ee5c4dded2ab098b0f88f24702a3c56be13"
+  integrity sha512-wAfjdLgFsPZsklLJvOBUBmzYE8/CwhEqSBEMRXA3qxIiNtyqvjYurAtIfDh6chlEPUfmTY3MnZh5Hfh4q0UlIw==
+  dependencies:
+    type-fest "^0.8.1"
+
 globals@^9.18.0:
   version "9.18.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-9.18.0.tgz#aa3896b3e69b487f17e31ed2143d69a8e30c2d8a"
   integrity sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==
 
-globby@10.0.1, globby@^10.0.1:
+globby@11.0.0:
+  version "11.0.0"
+  resolved "https://registry.yarnpkg.com/globby/-/globby-11.0.0.tgz#56fd0e9f0d4f8fb0c456f1ab0dee96e1380bc154"
+  integrity sha512-iuehFnR3xu5wBBtm4xi0dMe92Ob87ufyu/dHwpDYfbcpYpIbrO5OnS8M1vWvrBhSGEJ3/Ecj7gnX76P8YxpPEg==
+  dependencies:
+    array-union "^2.1.0"
+    dir-glob "^3.0.1"
+    fast-glob "^3.1.1"
+    ignore "^5.1.4"
+    merge2 "^1.3.0"
+    slash "^3.0.0"
+
+globby@^10.0.1:
   version "10.0.1"
   resolved "https://registry.yarnpkg.com/globby/-/globby-10.0.1.tgz#4782c34cb75dd683351335c5829cc3420e606b22"
   integrity sha512-sSs4inE1FB2YQiymcmTv6NWENryABjUNPeWhOvmn4SjtKybglsyPZxFB3U1/+L1bYi0rNZDqCLlHyLYDl1Pq5A==
@@ -6544,46 +7238,46 @@ glogg@^1.0.0:
   dependencies:
     sparkles "^1.0.0"
 
-google-closure-compiler-java@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-java/-/google-closure-compiler-java-20191111.0.0.tgz#3fb9c464f49a73b5de3fa8ac3c2ef9c2b747266d"
-  integrity sha512-JgsQtJVVgDuj50VPQV1OgHxMy78daTL3d607V6zF/qETl3rEEiazEGfXDGUX/1V1SUOW+Y03Ct9bcO3LMxNlxg==
+google-closure-compiler-java@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-java/-/google-closure-compiler-java-20200112.0.0.tgz#2b99f5e2869a573a1b35558ff3b6e6bc054a116f"
+  integrity sha512-h/ExDCXAw88nOniQSbbK6et31kOwmaDxl6t52dnETCIzituQtGToPzy21vUel1o8o+FvWUybLoap+dEYBam1pA==
 
-google-closure-compiler-js@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-js/-/google-closure-compiler-js-20191111.0.0.tgz#94112796826d50d0b3717c80ab633a60d2617ff7"
-  integrity sha512-W3Oy5NF5CMgUv31CMbgLN7zhdCTVMTnNI//iEPYMotzXfX8viyOnTMipDDwJNeMnY7lfXbQrYOo+QkWP6WzZtg==
+google-closure-compiler-js@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-js/-/google-closure-compiler-js-20200112.0.0.tgz#cb9fc1636671f3ce927e668e29db69b65cae6f2d"
+  integrity sha512-xW47rSuiRaql6q1YN7+b3FXIW74b1nCcENVwm9cigw1H5gWoBMBJOmpZiXnjMfmYC+MALjPQ8giMzvSeP+2X5A==
 
-google-closure-compiler-linux@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-linux/-/google-closure-compiler-linux-20191111.0.0.tgz#f66eb017b24c474565a903f966472e7a4c05efd9"
-  integrity sha512-pxxB83Ae7G9OHFSOEzOYlp844YyqQgU1RXBpCGBKeDAQrs3dykHqRhNGZdI7N1tsby/pT+hKL1US2l/CslPqag==
+google-closure-compiler-linux@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-linux/-/google-closure-compiler-linux-20200112.0.0.tgz#e6c7943cc0114046dbe9fc685e4d7d4eb536c1dc"
+  integrity sha512-imTfdYP7BVTzzp3y7MuZP+98nEkbX7LZsZtxalNpl56vd+Ysc9/vOHXS14CdSoThaXIVlzX/lfjOlBRqPow+ew==
 
-google-closure-compiler-osx@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-osx/-/google-closure-compiler-osx-20191111.0.0.tgz#4b841fca5857dd05fbcf4ae312781e52e37c732e"
-  integrity sha512-sviL1DLN+dDfYBLzmU6+2Yk19P1uzUHQuKaXrHxEYZkU4jTJNq/TC4xi6t0ZgvLQEm2Vf7xhOrt80TYKnoQaVg==
+google-closure-compiler-osx@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-osx/-/google-closure-compiler-osx-20200112.0.0.tgz#df7a22c0dc32702b47c8ac4521f79bbe439effad"
+  integrity sha512-E3S1KqZw4+Zov0VXCkjomPrYhyuuV6jH9InBchQ7cZfipFJjhQmSRf39u4Mu0sINW7GXfODZbzBwOXhEIquFQw==
 
-google-closure-compiler-windows@^20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler-windows/-/google-closure-compiler-windows-20191111.0.0.tgz#da49d1814261fffbbe7bde1efc49c35eb533e89e"
-  integrity sha512-iKdz2bWrrM4zLv3USCRtWX4kLWzZhbj/afh/W6giLxg5XQzbNg+UpVF+2G6f/LEYK9UNBgS2TdyNTuw8mod+Mg==
+google-closure-compiler-windows@^20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler-windows/-/google-closure-compiler-windows-20200112.0.0.tgz#8300d1e651f2c84ed565e729ccf40d6ed7e63771"
+  integrity sha512-+5+UJFKXH0LGnYEHSVJxWwhtvX/MI6uebkAQkhma0057QsKs8fOToWuHL8/UbJULB4WUPa3DlHy0+Izs5z6lCQ==
 
-google-closure-compiler@20191111.0.0:
-  version "20191111.0.0"
-  resolved "https://registry.yarnpkg.com/google-closure-compiler/-/google-closure-compiler-20191111.0.0.tgz#c2584b87d855cc4e23d5805e8f7269eb9a9166f2"
-  integrity sha512-Ji+FaqYKXNbJ78N5Do6hu61mPrB9D+8xSnmRO59u2CrIbmNCtoFnqkCAAL4Ye8LR8foRqtkDdiKJSblpe+5ttg==
+google-closure-compiler@20200112.0.0:
+  version "20200112.0.0"
+  resolved "https://registry.yarnpkg.com/google-closure-compiler/-/google-closure-compiler-20200112.0.0.tgz#98d79ed2926b5c9a04c759c3f0853f2102c06ba2"
+  integrity sha512-8d43B3hU2pAFy6MD946oslArRe11jPJ/h/VaPPiiSMoSMFxnDpd8jjVJfM2solFSNOOZ9OacA6g/RVGMyp5lvg==
   dependencies:
     chalk "2.x"
-    google-closure-compiler-java "^20191111.0.0"
-    google-closure-compiler-js "^20191111.0.0"
+    google-closure-compiler-java "^20200112.0.0"
+    google-closure-compiler-js "^20200112.0.0"
     minimist "1.x"
     vinyl "2.x"
     vinyl-sourcemaps-apply "^0.2.0"
   optionalDependencies:
-    google-closure-compiler-linux "^20191111.0.0"
-    google-closure-compiler-osx "^20191111.0.0"
-    google-closure-compiler-windows "^20191111.0.0"
+    google-closure-compiler-linux "^20200112.0.0"
+    google-closure-compiler-osx "^20200112.0.0"
+    google-closure-compiler-windows "^20200112.0.0"
 
 got@^9.6.0:
   version "9.6.0"
@@ -6700,10 +7394,10 @@ gulp-file@0.4.0:
     through2 "^0.4.1"
     vinyl "^2.1.0"
 
-gulp-git@2.9.0:
-  version "2.9.0"
-  resolved "https://registry.yarnpkg.com/gulp-git/-/gulp-git-2.9.0.tgz#f1ea6528d855f5e9cd4d712913131214f5088b58"
-  integrity sha512-66ZCwlCCf0YXEUedDbx76p0ii6aQ6aUHC4oSytn3UM8J6VWJKYF4PBARMIgR/POGWyYeN7hjd81Elpjn/o4+Tg==
+gulp-git@2.10.0:
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/gulp-git/-/gulp-git-2.10.0.tgz#ba96e596c79c3f864392285b5f5b3d951f5ea371"
+  integrity sha512-AYh0xXpKdDYS+ftCuyF9+LFXoltjtFlpfKITTCKDI0LunztpwVuHFtp31SvRSFVZikvRHTHUGMZ9Z0TnXjDIxQ==
   dependencies:
     any-shell-escape "^0.1.1"
     fancy-log "^1.3.2"
@@ -6739,6 +7433,18 @@ gulp-if@^2.0.0:
     ternary-stream "^2.0.1"
     through2 "^2.0.1"
 
+gulp-istanbul@1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/gulp-istanbul/-/gulp-istanbul-1.1.3.tgz#669a21516adb2540de798be26faee843ade8f20f"
+  integrity sha512-uMLSdqPDnBAV/B9rNyOgVMgrVC1tPbe+5GH6P13UOyxbRDT/w4sKYHWftPMA8j9om+NFvfeRlqpDXL2fixFWNA==
+  dependencies:
+    istanbul "^0.4.0"
+    istanbul-threshold-checker "^0.2.1"
+    lodash "^4.0.0"
+    plugin-error "^0.1.2"
+    through2 "^2.0.0"
+    vinyl-sourcemaps-apply "^0.2.1"
+
 gulp-jest@4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/gulp-jest/-/gulp-jest-4.0.3.tgz#4cecf904585ba434d3cb8ef400ba83b5dc388f05"
@@ -6802,10 +7508,10 @@ gulp-regexp-sourcemaps@1.0.1:
     through2 "^0.6.3"
     vinyl-sourcemaps-apply "^0.1.4"
 
-gulp-rename@1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/gulp-rename/-/gulp-rename-1.4.0.tgz#de1c718e7c4095ae861f7296ef4f3248648240bd"
-  integrity sha512-swzbIGb/arEoFK89tPY58vg3Ok1bw+d35PfUNwWqdo7KM4jkmuGA78JiDNqR+JeZFaeeHnRg9N7aihX3YPmsyg==
+gulp-rename@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/gulp-rename/-/gulp-rename-2.0.0.tgz#9bbc3962b0c0f52fc67cd5eaff6c223ec5b9cf6c"
+  integrity sha512-97Vba4KBzbYmR5VBs9mWmK+HwIf5mj+/zioxfZhOKeXtx5ZjBk57KFlePf5nxq9QsTtFl0ejnHE3zTC9MHXqyQ==
 
 gulp-sourcemaps@2.6.5:
   version "2.6.5"
@@ -6881,6 +7587,17 @@ gzip-size@5.1.1:
     duplexer "^0.1.1"
     pify "^4.0.1"
 
+handlebars@^4.0.1:
+  version "4.5.3"
+  resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.5.3.tgz#5cf75bd8714f7605713511a56be7c349becb0482"
+  integrity sha512-3yPecJoJHK/4c6aZhSvxOyG4vJKDshV36VHp0iVCDVh7o9w2vwi3NSnL2MMPj3YdduqaBcu7cGbggJQM0br9xA==
+  dependencies:
+    neo-async "^2.6.0"
+    optimist "^0.6.1"
+    source-map "^0.6.1"
+  optionalDependencies:
+    uglify-js "^3.1.4"
+
 handlebars@^4.1.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.4.2.tgz#8810a9821a9d6d52cb2f57d326d6ce7c3dfe741d"
@@ -6936,6 +7653,11 @@ has-cors@1.1.0:
   resolved "https://registry.yarnpkg.com/has-cors/-/has-cors-1.1.0.tgz#5e474793f7ea9843d1bb99c23eef49ff126fff39"
   integrity sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk=
 
+has-flag@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-1.0.0.tgz#9d9e793165ce017a00f00418c43f942a7b1d11fa"
+  integrity sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo=
+
 has-flag@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
@@ -6951,6 +7673,11 @@ has-symbols@^1.0.0:
   resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.0.tgz#ba1a8f1af2a0fc39650f5c850367704122063b44"
   integrity sha1-uhqPGvKg/DllD1yFA2dwQSIGO0Q=
 
+has-symbols@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.1.tgz#9f5214758a44196c406d9bd76cebf81ec2dd31e8"
+  integrity sha512-PLcsoqu++dmEIZB+6totNFKq/7Do+Z0u4oT0zKOJNl3lYK6vGwwu2hjHs+68OEZbTjiUE9bgOABXbP/GvrS0Kg==
+
 has-unicode@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/has-unicode/-/has-unicode-2.0.1.tgz#e0e6fe6a28cf51138855e086d1691e771de2a8b9"
@@ -7098,6 +7825,13 @@ html-encoding-sniffer@^1.0.2:
   dependencies:
     whatwg-encoding "^1.0.1"
 
+html-encoding-sniffer@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-2.0.0.tgz#70b3b69bb5999f35d0d4495d79079f35630e71ae"
+  integrity sha512-Y9prnPKkM7FXxQevZ5UH8Z6aVTY0ede1tHquck5UxGmKWDshxXh95gSa2xXYjS8AsGO5iOvrCI5+GttRKnLdNA==
+  dependencies:
+    whatwg-encoding "^1.0.5"
+
 html-minifier@4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/html-minifier/-/html-minifier-4.0.0.tgz#cca9aad8bce1175e02e17a8c33e46d8988889f56"
@@ -7261,7 +7995,7 @@ ignore@^4.0.6:
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
   integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==
 
-ignore@^5.1.1:
+ignore@^5.1.1, ignore@^5.1.4:
   version "5.1.4"
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.4.tgz#84b7b3dbe64552b6ef0eca99f6743dbec6d97adf"
   integrity sha512-MzbUSahkTW1u7JpKKjY7LCARd1fU5W2rLdxlM4kdkayuCwZImjkpluF9CM1aLewYJguPDqewLam18Y6AU69A8A==
@@ -7545,6 +8279,11 @@ is-callable@^1.1.4:
   resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.4.tgz#1e1adf219e1eeb684d691f9d6a05ff0d30a24d75"
   integrity sha512-r5p9sxJjYnArLjObpjA4xu5EKI3CuKHkJXMhT7kwbpUyIFD1n5PMAsoPvWnvtZiNz7LjkYDRZhd7FlI0eMijEA==
 
+is-callable@^1.1.5:
+  version "1.1.5"
+  resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.5.tgz#f7e46b596890456db74e7f6e976cb3273d06faab"
+  integrity sha512-ESKv5sMCJB2jnHTWZ3O5itG+O128Hsus4K4Qh1h2/cgn2vbgnLSVqfV46AeJA9D5EeeLa9w81KUXMtn34zhX+Q==
+
 is-ci@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/is-ci/-/is-ci-2.0.0.tgz#6bc6334181810e04b5c22b3d589fdca55026404c"
@@ -7829,6 +8568,13 @@ is-regex@^1.0.4:
   dependencies:
     has "^1.0.1"
 
+is-regex@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.0.5.tgz#39d589a358bf18967f726967120b8fc1aed74eae"
+  integrity sha512-vlKW17SNq44owv5AQR3Cq0bQPEb8+kF3UKZ2fiZNOWtztYE5i0CzCZxFDwO58qAOWtxdBRVO/V5Qin1wjCqFYQ==
+  dependencies:
+    has "^1.0.3"
+
 is-relative-url@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/is-relative-url/-/is-relative-url-3.0.0.tgz#f623c8e26baa5bd3742b3b7ec074f50f3b45b3f3"
@@ -8012,6 +8758,11 @@ istanbul-lib-coverage@^2.0.2, istanbul-lib-coverage@^2.0.5:
   resolved "https://registry.yarnpkg.com/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.5.tgz#675f0ab69503fad4b1d849f736baaca803344f49"
   integrity sha512-8aXznuEPCJvGnMSRft4udDRDtb1V3pkQkMMI5LI+6HuQz5oQ4J2UFn1H82raA3qJtyOLkkwVqICBQkjnGtn5mA==
 
+istanbul-lib-coverage@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/istanbul-lib-coverage/-/istanbul-lib-coverage-3.0.0.tgz#f5944a37c70b550b02a78a5c3b2055b280cec8ec"
+  integrity sha512-UiUIqxMgRDET6eR+o5HbfRYP1l0hqkWOs7vNxC/mggutCMUIhWMm8gAHb8tHlyfD3/l6rlgNA5cKdDzEAf6hEg==
+
 istanbul-lib-hook@^2.0.7:
   version "2.0.7"
   resolved "https://registry.yarnpkg.com/istanbul-lib-hook/-/istanbul-lib-hook-2.0.7.tgz#c95695f383d4f8f60df1f04252a9550e15b5b133"
@@ -8032,6 +8783,19 @@ istanbul-lib-instrument@^3.0.1, istanbul-lib-instrument@^3.3.0:
     istanbul-lib-coverage "^2.0.5"
     semver "^6.0.0"
 
+istanbul-lib-instrument@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-4.0.0.tgz#53321a7970f076262fd3292c8f9b2e4ac544aae1"
+  integrity sha512-Nm4wVHdo7ZXSG30KjZ2Wl5SU/Bw7bDx1PdaiIFzEStdjs0H12mOTncn1GVYuqQSaZxpg87VGBRsVRPGD2cD1AQ==
+  dependencies:
+    "@babel/core" "^7.7.5"
+    "@babel/parser" "^7.7.5"
+    "@babel/template" "^7.7.4"
+    "@babel/traverse" "^7.7.4"
+    "@istanbuljs/schema" "^0.1.2"
+    istanbul-lib-coverage "^3.0.0"
+    semver "^6.3.0"
+
 istanbul-lib-report@^2.0.4, istanbul-lib-report@^2.0.8:
   version "2.0.8"
   resolved "https://registry.yarnpkg.com/istanbul-lib-report/-/istanbul-lib-report-2.0.8.tgz#5a8113cd746d43c4889eba36ab10e7d50c9b4f33"
@@ -8059,6 +8823,34 @@ istanbul-reports@^2.2.4, istanbul-reports@^2.2.6:
   dependencies:
     handlebars "^4.1.2"
 
+istanbul-threshold-checker@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/istanbul-threshold-checker/-/istanbul-threshold-checker-0.2.1.tgz#c5dc94e8f2cc5cd3ffd335452f84b553c4248331"
+  integrity sha1-xdyU6PLMXNP/0zVFL4S1U8QkgzE=
+  dependencies:
+    istanbul "~0.4.5"
+    lodash "~4.17.2"
+
+istanbul@^0.4.0, istanbul@~0.4.5:
+  version "0.4.5"
+  resolved "https://registry.yarnpkg.com/istanbul/-/istanbul-0.4.5.tgz#65c7d73d4c4da84d4f3ac310b918fb0b8033733b"
+  integrity sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=
+  dependencies:
+    abbrev "1.0.x"
+    async "1.x"
+    escodegen "1.8.x"
+    esprima "2.7.x"
+    glob "^5.0.15"
+    handlebars "^4.0.1"
+    js-yaml "3.x"
+    mkdirp "0.5.x"
+    nopt "3.x"
+    once "1.x"
+    resolve "1.1.x"
+    supports-color "^3.1.0"
+    which "^1.1.1"
+    wordwrap "^1.0.0"
+
 jest-changed-files@^24.9.0:
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-24.9.0.tgz#08d8c15eb79a7fa3fc98269bc14b451ee82f8039"
@@ -8472,7 +9264,7 @@ js-tokens@^3.0.2:
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
   integrity sha1-mGbfOVECEw449/mWvOtlRDIJwls=
 
-js-yaml@3.13.1, js-yaml@^3.10.0, js-yaml@^3.13.1:
+js-yaml@3.13.1, js-yaml@3.x, js-yaml@^3.10.0, js-yaml@^3.13.1:
   version "3.13.1"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847"
   integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==
@@ -8485,41 +9277,40 @@ jsbn@~0.1.0:
   resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
   integrity sha1-peZUwuWi3rXyAdls77yoDA7y9RM=
 
-jsdoctypeparser@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/jsdoctypeparser/-/jsdoctypeparser-6.0.0.tgz#b6778772339138cbddb6c7b0d182d105afe1d8ae"
-  integrity sha512-61VtBXLkHfOFSIdp/VDVNMksxK0ID0cPTNvxDR92tPA6K7r2AX0OcJegYxhJIwtpWKU4p3D9L3U02hhlP1kQLQ==
+jsdoctypeparser@^6.1.0:
+  version "6.1.0"
+  resolved "https://registry.yarnpkg.com/jsdoctypeparser/-/jsdoctypeparser-6.1.0.tgz#acfb936c26300d98f1405cb03e20b06748e512a8"
+  integrity sha512-UCQBZ3xCUBv/PLfwKAJhp6jmGOSLFNKzrotXGNgbKhWvz27wPsCsVeP7gIcHPElQw2agBmynAitXqhxR58XAmA==
 
-jsdom@15.2.1:
-  version "15.2.1"
-  resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-15.2.1.tgz#d2feb1aef7183f86be521b8c6833ff5296d07ec5"
-  integrity sha512-fAl1W0/7T2G5vURSyxBzrJ1LSdQn6Tr5UX/xD4PXDx/PDgwygedfW6El/KIj3xJ7FU61TTYnc/l/B7P49Eqt6g==
+jsdom@16.0.1:
+  version "16.0.1"
+  resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-16.0.1.tgz#5a5214cf69609531bf6fa5b6322fdd90ceed5bf7"
+  integrity sha512-wKJe/APzq+ak9i+2ybWE20lDIhF9AkGKSZf8UsjPN39acatFB6oA7K397kQvHVikds0yQono2h6J7UjbPtPOWw==
   dependencies:
-    abab "^2.0.0"
+    abab "^2.0.3"
     acorn "^7.1.0"
     acorn-globals "^4.3.2"
-    array-equal "^1.0.0"
-    cssom "^0.4.1"
+    cssom "^0.4.4"
     cssstyle "^2.0.0"
-    data-urls "^1.1.0"
-    domexception "^1.0.1"
-    escodegen "^1.11.1"
-    html-encoding-sniffer "^1.0.2"
+    data-urls "^2.0.0"
+    decimal.js "^10.2.0"
+    domexception "^2.0.1"
+    escodegen "^1.12.1"
+    html-encoding-sniffer "^2.0.0"
     nwsapi "^2.2.0"
-    parse5 "5.1.0"
-    pn "^1.1.0"
+    parse5 "5.1.1"
     request "^2.88.0"
-    request-promise-native "^1.0.7"
-    saxes "^3.1.9"
+    request-promise-native "^1.0.8"
+    saxes "^4.0.2"
     symbol-tree "^3.2.2"
     tough-cookie "^3.0.1"
     w3c-hr-time "^1.0.1"
-    w3c-xmlserializer "^1.1.2"
-    webidl-conversions "^4.0.2"
+    w3c-xmlserializer "^2.0.0"
+    webidl-conversions "^5.0.0"
     whatwg-encoding "^1.0.5"
     whatwg-mimetype "^2.3.0"
-    whatwg-url "^7.0.0"
-    ws "^7.0.0"
+    whatwg-url "^8.0.0"
+    ws "^7.2.1"
     xml-name-validator "^3.0.0"
 
 jsdom@^11.5.1:
@@ -8722,10 +9513,10 @@ karma-edge-launcher@0.4.2:
   dependencies:
     edge-launcher "1.2.2"
 
-karma-firefox-launcher@1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/karma-firefox-launcher/-/karma-firefox-launcher-1.2.0.tgz#64fe03dd10300f9754d48f9ebfbf31f6c94a200c"
-  integrity sha512-j9Zp8M8+VLq1nI/5xZGfzeaEPtGQ/vk3G+Y8vpmFWLvKLNZ2TDjD6cu2dUu7lDbu1HXNgatsAX4jgCZTkR9qhQ==
+karma-firefox-launcher@1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/karma-firefox-launcher/-/karma-firefox-launcher-1.3.0.tgz#ebcbb1d1ddfada6be900eb8fae25bcf2dcdc8171"
+  integrity sha512-Fi7xPhwrRgr+94BnHX0F5dCl1miIW4RHnzjIGxF8GaIEp7rNqX7LSi7ok63VXs3PS/5MQaQMhGxw+bvD+pibBQ==
   dependencies:
     is-wsl "^2.1.0"
 
@@ -8961,6 +9752,13 @@ leven@^3.1.0:
   resolved "https://registry.yarnpkg.com/leven/-/leven-3.1.0.tgz#77891de834064cccba82ae7842bb6b14a13ed7f2"
   integrity sha512-qsda+H8jTaUaN/x5vzW2rzc+8Rw4TAQ/4KjB46IwK5VH+IlVeeeje/EoZRpiXvIqjFgK84QffqPztGI3VBLG1A==
 
+levenary@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/levenary/-/levenary-1.1.0.tgz#fc146fe75f32dc483a0a2c64aef720f602cd6210"
+  integrity sha512-VHcwhO0UTpUW7rLPN2/OiWJdgA1e9BqEDALhrgCe/F+uUJnep6CoUsTzMeP8Rh0NGr9uKquXxqe7lwLZo509nQ==
+  dependencies:
+    leven "^3.1.0"
+
 levn@^0.3.0, levn@~0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/levn/-/levn-0.3.0.tgz#3b09924edf9f083c0490fdd4c0bc4421e04764ee"
@@ -9144,6 +9942,11 @@ lodash.flattendeep@^4.4.0:
   resolved "https://registry.yarnpkg.com/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz#fb030917f86a3134e5bc9bec0d69e0013ddfedb2"
   integrity sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI=
 
+lodash.get@^4.4.2:
+  version "4.4.2"
+  resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
+  integrity sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=
+
 lodash.isequal@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
@@ -9243,7 +10046,7 @@ lodash@^3.8.0:
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
   integrity sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y=
 
-lodash@^4.1.1, lodash@^4.16.6, lodash@^4.17.11, lodash@^4.17.12, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.4, lodash@^4.6.1:
+lodash@^4.0.0, lodash@^4.1.1, lodash@^4.16.6, lodash@^4.17.11, lodash@^4.17.12, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.4, lodash@^4.6.1, lodash@~4.17.2:
   version "4.17.15"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.15.tgz#b447f6670a0455bbfeedd11392eff330ea097548"
   integrity sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==
@@ -9281,15 +10084,12 @@ log4js@^4.0.0:
     rfdc "^1.1.4"
     streamroller "^1.0.6"
 
-lolex@5.1.1:
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/lolex/-/lolex-5.1.1.tgz#9587144854511d27940ee5e113dcb7de9b0fd666"
-  integrity sha512-dEwHz1CJ8DsdgfpiimgQQEhEJYOEiJ69a0s4aJDNHajaTqOJuF34vBAWVa/sS0V8aQvt72p+KgQ3pRmEVJM+iA==
-
-lolex@^4.1.0, lolex@^4.2.0:
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/lolex/-/lolex-4.2.0.tgz#ddbd7f6213ca1ea5826901ab1222b65d714b3cd7"
-  integrity sha512-gKO5uExCXvSm6zbF562EvM+rd1kQDnB9AZBbiQVzf1ZmdDpxUSvpnAaVOP83N/31mRK8Ml8/VE8DMvsAZQ+7wg==
+lolex@5.1.2, lolex@^5.0.1, lolex@^5.1.2:
+  version "5.1.2"
+  resolved "https://registry.yarnpkg.com/lolex/-/lolex-5.1.2.tgz#953694d098ce7c07bc5ed6d0e42bc6c0c6d5a367"
+  integrity sha512-h4hmjAvHTmd+25JSwrtTIuwbKdwg5NzZVRMLn9saij4SZaepCrTCxPr35H/3bjwfMJtN+t3CX8672UIkglz28A==
+  dependencies:
+    "@sinonjs/commons" "^1.7.0"
 
 loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
@@ -9344,10 +10144,10 @@ lru-queue@0.1:
   dependencies:
     es5-ext "~0.10.2"
 
-magic-string@0.25.4:
-  version "0.25.4"
-  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.4.tgz#325b8a0a79fc423db109b77fd5a19183b7ba5143"
-  integrity sha512-oycWO9nEVAP2RVPbIoDoA4Y7LFIJ3xRYov93gAyJhZkET1tNuB0u7uWkZS2LpBWTJUWnmau/To8ECWRC+jKNfw==
+magic-string@0.25.6:
+  version "0.25.6"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.6.tgz#5586387d1242f919c6d223579cc938bf1420795e"
+  integrity sha512-3a5LOMSGoCTH5rbqobC2HuDNRtE2glHZ8J7pK+QZYppyWA36yuNpsX994rIY2nCuyP7CZYy7lQq/X2jygiZ89g==
   dependencies:
     sourcemap-codec "^1.4.4"
 
@@ -9567,7 +10367,7 @@ merge-stream@^2.0.0:
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
   integrity sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==
 
-merge2@^1.2.3:
+merge2@^1.2.3, merge2@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.3.0.tgz#5b366ee83b2f1582c48f87e47cf1a9352103ca81"
   integrity sha512-2j4DAdlBOkiSZIsaXk4mTE3sRS02yBHAtfy127xRV3bQUFqXkjHCHLW6Scv7DwNRbIWNHH8zpnz9zMaKXIdvYw==
@@ -9773,7 +10573,7 @@ mixin-deep@^1.2.0:
     for-in "^1.0.2"
     is-extendable "^1.0.1"
 
-mkdirp@0.5.1, mkdirp@0.x.x, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.1:
+mkdirp@0.5.1, mkdirp@0.5.x, mkdirp@0.x.x, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
   integrity sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=
@@ -9787,13 +10587,14 @@ mocha-silent-reporter@1.0.0:
   dependencies:
     chalk "^0.5.1"
 
-mocha@6.2.2:
-  version "6.2.2"
-  resolved "https://registry.yarnpkg.com/mocha/-/mocha-6.2.2.tgz#5d8987e28940caf8957a7d7664b910dc5b2fea20"
-  integrity sha512-FgDS9Re79yU1xz5d+C4rv1G7QagNGHZ+iXF81hO8zY35YZZcLEsJVfFolfsqKFWunATEvNzMK0r/CwWd/szO9A==
+mocha@7.0.1:
+  version "7.0.1"
+  resolved "https://registry.yarnpkg.com/mocha/-/mocha-7.0.1.tgz#276186d35a4852f6249808c6dd4a1376cbf6c6ce"
+  integrity sha512-9eWmWTdHLXh72rGrdZjNbG3aa1/3NRPpul1z0D979QpEnFdCG0Q5tv834N+94QEN2cysfV72YocQ3fn87s70fg==
   dependencies:
     ansi-colors "3.2.3"
     browser-stdout "1.3.1"
+    chokidar "3.3.0"
     debug "3.2.6"
     diff "3.5.0"
     escape-string-regexp "1.0.5"
@@ -9806,7 +10607,7 @@ mocha@6.2.2:
     minimatch "3.0.4"
     mkdirp "0.5.1"
     ms "2.1.1"
-    node-environment-flags "1.0.5"
+    node-environment-flags "1.0.6"
     object.assign "4.1.0"
     strip-json-comments "2.0.1"
     supports-color "6.0.0"
@@ -10018,15 +10819,16 @@ nice-try@^1.0.4:
   resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366"
   integrity sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==
 
-nise@^1.5.2:
-  version "1.5.2"
-  resolved "https://registry.yarnpkg.com/nise/-/nise-1.5.2.tgz#b6d29af10e48b321b307e10e065199338eeb2652"
-  integrity sha512-/6RhOUlicRCbE9s+94qCUsyE+pKlVJ5AhIv+jEE7ESKwnbXqulKZ1FYU+XAtHHWE9TinYvAxDUJAb912PwPoWA==
+nise@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/nise/-/nise-3.0.1.tgz#0659982af515e5aac15592226246243e8da0013d"
+  integrity sha512-fYcH9y0drBGSoi88kvhpbZEsenX58Yr+wOJ4/Mi1K4cy+iGP/a73gNoyNhu5E9QxPdgTlVChfIaAlnyOy/gHUA==
   dependencies:
-    "@sinonjs/formatio" "^3.2.1"
+    "@sinonjs/commons" "^1.7.0"
+    "@sinonjs/formatio" "^4.0.1"
     "@sinonjs/text-encoding" "^0.7.1"
     just-extend "^4.0.2"
-    lolex "^4.1.0"
+    lolex "^5.0.1"
     path-to-regexp "^1.7.0"
 
 no-case@^2.2.0:
@@ -10036,10 +10838,10 @@ no-case@^2.2.0:
   dependencies:
     lower-case "^1.1.1"
 
-node-environment-flags@1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/node-environment-flags/-/node-environment-flags-1.0.5.tgz#fa930275f5bf5dae188d6192b24b4c8bbac3d76a"
-  integrity sha512-VNYPRfGfmZLx0Ye20jWzHUjyTW/c+6Wq+iLhDzUI4XmhrDd9l/FozXV3F2xOaXjvp0co0+v1YSR3CMP6g+VvLQ==
+node-environment-flags@1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/node-environment-flags/-/node-environment-flags-1.0.6.tgz#a30ac13621f6f7d674260a54dede048c3982c088"
+  integrity sha512-5Evy2epuL+6TM0lCQGpFIj6KwiEsGh1SrHUhTbNX+sLbBtjidPZFAnVK9y5yU1+h//RitLbRHTIMyxQPtxMdHw==
   dependencies:
     object.getownpropertydescriptors "^2.0.3"
     semver "^5.7.0"
@@ -10101,10 +10903,17 @@ node-releases@^1.1.29:
   dependencies:
     semver "^6.3.0"
 
-node-releases@^1.1.40:
-  version "1.1.40"
-  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.40.tgz#a94facfa8e2d612302601ca1361741d529c4515a"
-  integrity sha512-r4LPcC5b/bS8BdtWH1fbeK88ib/wg9aqmg6/s3ngNLn2Ewkn/8J6Iw3P9RTlfIAdSdvYvQl2thCY5Y+qTAQ2iQ==
+node-releases@^1.1.42:
+  version "1.1.43"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.43.tgz#2c6ca237f88ce11d49631f11190bb01f8d0549f2"
+  integrity sha512-Rmfnj52WNhvr83MvuAWHEqXVoZXCcDQssSOffU4n4XOL9sPrP61mSZ88g25NqmABDvH7PiAlFCzoSCSdzA293w==
+  dependencies:
+    semver "^6.3.0"
+
+node-releases@^1.1.44:
+  version "1.1.45"
+  resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.45.tgz#4cf7e9175d71b1317f15ffd68ce63bce1d53e9f2"
+  integrity sha512-cXvGSfhITKI8qsV116u2FTzH5EWZJfgG7d4cpqwF8I8+1tWpD6AsvvGRKq2onR0DNj1jfqsjkXZsm14JMS7Cyg==
   dependencies:
     semver "^6.3.0"
 
@@ -10124,6 +10933,13 @@ nomnom@1.5.2:
     chalk "~0.4.0"
     underscore "~1.6.0"
 
+nopt@3.x:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/nopt/-/nopt-3.0.6.tgz#c6465dbf08abcd4db359317f79ac68a646b28ff9"
+  integrity sha1-xkZdvwirzU2zWTF/eaxopkayj/k=
+  dependencies:
+    abbrev "1"
+
 nopt@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/nopt/-/nopt-4.0.1.tgz#d0d4685afd5415193c8c7505602d0d17cd64474d"
@@ -10281,6 +11097,11 @@ object-inspect@^1.6.0:
   resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.6.0.tgz#c70b6cbf72f274aab4c34c0c82f5167bf82cf15b"
   integrity sha512-GJzfBZ6DgDAmnuaM3104jR4s1Myxr3Y3zfIyN4z3UdqN69oSRacNK8UhnobDdC+7J2AHCjGwxQubNJfE70SXXQ==
 
+object-inspect@^1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.7.0.tgz#f4f6bd181ad77f006b5ece60bd0b6f398ff74a67"
+  integrity sha512-a7pEHdh1xKIAgTySUGgLMx/xwDZskN1Ud6egYYN3EdRW4ZMPNEDUTF+hwy2LUC+Bl+SyLXANnwz/jyh/qutKUw==
+
 object-is@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/object-is/-/object-is-1.0.1.tgz#0aa60ec9989a0b3ed795cf4d06f62cf1ad6539b6"
@@ -10407,7 +11228,7 @@ on-headers@~1.0.0, on-headers@~1.0.1:
   resolved "https://registry.yarnpkg.com/on-headers/-/on-headers-1.0.2.tgz#772b0ae6aaa525c399e489adfad90c403eb3c28f"
   integrity sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==
 
-once@^1.3.0, once@^1.3.1, once@^1.3.2, once@^1.4.0:
+once@1.x, once@^1.3.0, once@^1.3.1, once@^1.3.2, once@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
   integrity sha1-WDsap3WWHUsROsF9nFC6753Xa9E=
@@ -10455,6 +11276,18 @@ optionator@^0.8.1, optionator@^0.8.2:
     type-check "~0.3.2"
     wordwrap "~1.0.0"
 
+optionator@^0.8.3:
+  version "0.8.3"
+  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.3.tgz#84fa1d036fe9d3c7e21d99884b601167ec8fb495"
+  integrity sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==
+  dependencies:
+    deep-is "~0.1.3"
+    fast-levenshtein "~2.0.6"
+    levn "~0.3.0"
+    prelude-ls "~1.1.2"
+    type-check "~0.3.2"
+    word-wrap "~1.2.3"
+
 options@>=0.0.5:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/options/-/options-0.0.6.tgz#ec22d312806bb53e731773e7cdaefcf1c643128f"
@@ -10724,12 +11557,7 @@ parse5@4.0.0:
   resolved "https://registry.yarnpkg.com/parse5/-/parse5-4.0.0.tgz#6d78656e3da8d78b4ec0b906f7c08ef1dfe3f608"
   integrity sha512-VrZ7eOd3T1Fk4XWNXMgiGBK/z0MG48BWG2uQNU4I72fkQuKUTZpl+u9k+CxEG0twMVzSmXEEz12z5Fnw1jIQFA==
 
-parse5@5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/parse5/-/parse5-5.1.0.tgz#c59341c9723f414c452975564c7c00a68d58acd2"
-  integrity sha512-fxNG2sQjHvlVAYmzBZS9YlDp6PTSSDwa98vkD4QgVDDCAo84z5X1t5XyJQ62ImdLXx5NdIIfihey6xpum9/gRQ==
-
-parse5@^5.1.1:
+parse5@5.1.1, parse5@^5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/parse5/-/parse5-5.1.1.tgz#f68e4e5ba1852ac2cadc00f4555fff6c2abb6178"
   integrity sha512-ugq4DFI0Ptb+WWjAdOK16+u/nHfiIrcE+sh8kZMaM0WllQKLI9rOUq6c2b7cwPkXdzfQESqvoqK6ug7U/Yyzug==
@@ -10967,6 +11795,13 @@ pkg-dir@^4.2.0:
   dependencies:
     find-up "^4.0.0"
 
+pkg-up@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-3.1.0.tgz#100ec235cc150e4fd42519412596a28512a0def5"
+  integrity sha512-nDywThFk1i4BQK4twPQ6TA4RT8bDY96yeuCVBWL3ePARCiEKDRSrNGbFIgUJpLp+XeIR65v8ra7WuJOFUBtkMA==
+  dependencies:
+    find-up "^3.0.0"
+
 pkginfo@0.3.x:
   version "0.3.1"
   resolved "https://registry.yarnpkg.com/pkginfo/-/pkginfo-0.3.1.tgz#5b29f6a81f70717142e09e765bbeab97b4f81e21"
@@ -11301,10 +12136,10 @@ postcss-value-parser@^4.0.2:
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.0.2.tgz#482282c09a42706d1fc9a069b73f44ec08391dc9"
   integrity sha512-LmeoohTpp/K4UiyQCwuGWlONxXamGzCMtFxLq4W1nZVGIQLYvMCJx3yAF9qyyuFpflABI9yVdtJAqbihOsCsJQ==
 
-postcss@7.0.23, postcss@^7.0.23:
-  version "7.0.23"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.23.tgz#9f9759fad661b15964f3cfc3140f66f1e05eadc1"
-  integrity sha512-hOlMf3ouRIFXD+j2VJecwssTwbvsPGJVMzupptg+85WA+i7MwyrydmQAgY3R+m0Bc0exunhbJmijy8u8+vufuQ==
+postcss@7.0.26, postcss@^7.0.26:
+  version "7.0.26"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.26.tgz#5ed615cfcab35ba9bbb82414a4fa88ea10429587"
+  integrity sha512-IY4oRjpXWYshuTDFxMVkJDtWIk2LhsTlu8bZnbEJA4+bYT16Lvpo8Qv6EvDumhYRgzjZl489pmsY3qVgJQ08nA==
   dependencies:
     chalk "^2.4.2"
     source-map "^0.6.1"
@@ -11319,10 +12154,10 @@ postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.5:
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
-preact@10.0.5:
-  version "10.0.5"
-  resolved "https://registry.yarnpkg.com/preact/-/preact-10.0.5.tgz#16f0bcd77241693e710778069e703217dd497867"
-  integrity sha512-62+J+GTrv3Uhp6DefqZTel6VYcdUA1zqHO7gjQSKdOwkU2sNOp/Vl6Zf2A3hIWV5EBgjeDA8gsOn6dmB3I1Dvg==
+preact@10.2.1:
+  version "10.2.1"
+  resolved "https://registry.yarnpkg.com/preact/-/preact-10.2.1.tgz#b30eb4cdc455499ee2ff82e0fa1a16fc8e20f3a4"
+  integrity sha512-BUNvmQcVtNElku7mYHexIiM5JlGNSW2BY9O2t9xk1NqA43O8wbE0cah6PAlvT7PBHvyDRJ5TAj5Fewdi9DqLoQ==
 
 prelude-ls@~1.1.2:
   version "1.1.2"
@@ -11567,7 +12402,7 @@ querystring-es3@~0.2.0:
   resolved "https://registry.yarnpkg.com/querystring-es3/-/querystring-es3-0.2.1.tgz#9ec61f79049875707d69414596fd907a4d711e73"
   integrity sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM=
 
-querystring@0.2.0:
+querystring@0.2.0, querystring@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/querystring/-/querystring-0.2.0.tgz#b209849203bb25df820da756e747005878521620"
   integrity sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA=
@@ -11869,6 +12704,13 @@ readdirp@~3.1.3:
   dependencies:
     picomatch "^2.0.4"
 
+readdirp@~3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.2.0.tgz#c30c33352b12c96dfb4b895421a49fd5a9593839"
+  integrity sha512-crk4Qu3pmXwgxdSgGhgA/eXiJAPQiX4GMOZZMXnqKxHX7TaoL+3gQVo/WeuAiogr07DpnfjIMpXXa+PAIvwPGQ==
+  dependencies:
+    picomatch "^2.0.4"
+
 realpath-native@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/realpath-native/-/realpath-native-1.1.0.tgz#2003294fea23fb0672f2476ebe22fcf498a2d65c"
@@ -11921,11 +12763,6 @@ regenerate@^1.4.0:
   resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.0.tgz#4a856ec4b56e4077c557589cae85e7a4c8869a11"
   integrity sha512-1G6jJVDWrt0rK99kBjvEtziZNCICAuvIPkSiUFIQxVP06RCVpq3dmDo2oi6ABpYaDYaTRr67BEhL8r1wgEZZKg==
 
-regenerator-runtime@^0.10.5:
-  version "0.10.5"
-  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz#336c3efc1220adcedda2c9fab67b5a7955a33658"
-  integrity sha1-M2w+/BIgrc7dosn6tntaeVWjNlg=
-
 regenerator-runtime@^0.11.0:
   version "0.11.1"
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
@@ -11965,14 +12802,14 @@ regexp-sourcemaps@^1.0.0:
   dependencies:
     source-map "^0.4.2"
 
-regexp.escape@1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/regexp.escape/-/regexp.escape-1.0.2.tgz#bcbb6ffe9490ad81b9ef6e9672a18f2a01ba41a0"
-  integrity sha1-vLtv/pSQrYG5726WcqGPKgG6QaA=
+regexp.escape@1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/regexp.escape/-/regexp.escape-1.1.0.tgz#521924caaf35b1c01c5bce7ab72914b79101c967"
+  integrity sha512-KVeSRSGxG1oQn9Op7tkDaYo5MRacMciqL5cHzCsvChvFOCtyxLMplXe9p+Z3ItGMLAONUTtnHe+yEyYDDntdxA==
   dependencies:
-    define-properties "^1.1.1"
-    es-abstract "^1.2.1"
-    function-bind "^1.0.2"
+    define-properties "^1.1.3"
+    es-abstract "^1.17.0"
+    function-bind "^1.1.1"
 
 regexp.prototype.flags@^1.2.0:
   version "1.2.0"
@@ -11998,10 +12835,10 @@ regexpu-core@^4.6.0:
     unicode-match-property-ecmascript "^1.0.4"
     unicode-match-property-value-ecmascript "^1.1.0"
 
-regextras@^0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/regextras/-/regextras-0.6.1.tgz#9689641bbb338e0ff7001a5c507c6a2008df7b36"
-  integrity sha512-EzIHww9xV2Kpqx+corS/I7OBmf2rZ0pKKJPsw5Dc+l6Zq1TslDmtRIP9maVn3UH+72MIXmn8zzDgP07ihQogUA==
+regextras@^0.7.0:
+  version "0.7.0"
+  resolved "https://registry.yarnpkg.com/regextras/-/regextras-0.7.0.tgz#2298bef8cfb92b1b7e3b9b12aa8f69547b7d71e4"
+  integrity sha512-ds+fL+Vhl918gbAUb0k2gVKbTZLsg84Re3DI6p85Et0U0tYME3hyW4nMK8Px4dtDaBA2qNjvG5uWyW7eK5gfmw==
 
 registry-auth-token@^4.0.0:
   version "4.0.0"
@@ -12114,7 +12951,7 @@ request-promise-core@1.1.3:
   dependencies:
     lodash "^4.17.15"
 
-request-promise-native@^1.0.5, request-promise-native@^1.0.7:
+request-promise-native@^1.0.5:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/request-promise-native/-/request-promise-native-1.0.7.tgz#a49868a624bdea5069f1251d0a836e0d89aa2c59"
   integrity sha512-rIMnbBdgNViL37nZ1b3L/VfPOpSi0TqVDQPAvO6U14lMzOLrt5nilxCQqtDKhZeDiW0/hkCXGoQjhgJd/tCh6w==
@@ -12123,6 +12960,15 @@ request-promise-native@^1.0.5, request-promise-native@^1.0.7:
     stealthy-require "^1.1.1"
     tough-cookie "^2.3.3"
 
+request-promise-native@^1.0.8:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/request-promise-native/-/request-promise-native-1.0.8.tgz#a455b960b826e44e2bf8999af64dff2bfe58cb36"
+  integrity sha512-dapwLGqkHtwL5AEbfenuzjTYg35Jd6KPytsC2/TLkVMz8rm+tNt72MGUWT1RP/aYawMpN6HqbNGBQaRcBtjQMQ==
+  dependencies:
+    request-promise-core "1.1.3"
+    stealthy-require "^1.1.1"
+    tough-cookie "^2.3.3"
+
 request-promise@4.2.5:
   version "4.2.5"
   resolved "https://registry.yarnpkg.com/request-promise/-/request-promise-4.2.5.tgz#186222c59ae512f3497dfe4d75a9c8461bd0053c"
@@ -12250,7 +13096,7 @@ resolve-url@^0.2.1:
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
   integrity sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=
 
-resolve@1.1.7:
+resolve@1.1.7, resolve@1.1.x:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
   integrity sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs=
@@ -12448,12 +13294,12 @@ sax@>=0.6.0, sax@^1.2.4, sax@~1.2.4:
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
   integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
 
-saxes@^3.1.9:
-  version "3.1.11"
-  resolved "https://registry.yarnpkg.com/saxes/-/saxes-3.1.11.tgz#d59d1fd332ec92ad98a2e0b2ee644702384b1c5b"
-  integrity sha512-Ydydq3zC+WYDJK1+gRxRapLIED9PWeSuuS41wqyoRmzvhhh9nc+QQrVMKJYzJFULazeGhzSV0QleN2wD3boh2g==
+saxes@^4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/saxes/-/saxes-4.0.2.tgz#76f8e762efc96ec4af5f885d8151c50426103165"
+  integrity sha512-EZOTeQ4bgkOaGCDaTKux+LaRNcLNbdbvMH7R3/yjEEULPEmqvkFbFub6DJhJTub2iGMT93CfpZ5LTdKZmAbVeQ==
   dependencies:
-    xmlchars "^2.1.1"
+    xmlchars "^2.2.0"
 
 scheduler@^0.18.0:
   version "0.18.0"
@@ -12497,6 +13343,11 @@ semver@5.5.1:
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.5.1.tgz#7dfdd8814bdb7cabc7be0fb1d734cfb66c940477"
   integrity sha512-PqpAxfrEhlSUWge8dwIp4tZnQ25DIOthpiaHNIthsjEFQD6EvqUKUDM7L8O2rShkFccYo1VjJR0coWfNkCubRw==
 
+semver@7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e"
+  integrity sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A==
+
 semver@^6.0.0, semver@^6.1.2, semver@^6.2.0, semver@^6.3.0:
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
@@ -12725,23 +13576,23 @@ simple-swizzle@^0.2.2:
   dependencies:
     is-arrayish "^0.3.1"
 
-sinon-chai@3.3.0:
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/sinon-chai/-/sinon-chai-3.3.0.tgz#8084ff99451064910fbe2c2cb8ab540c00b740ea"
-  integrity sha512-r2JhDY7gbbmh5z3Q62pNbrjxZdOAjpsqW/8yxAZRSqLZqowmfGZPGUZPFf3UX36NLis0cv8VEM5IJh9HgkSOAA==
-
-sinon@7.5.0:
-  version "7.5.0"
-  resolved "https://registry.yarnpkg.com/sinon/-/sinon-7.5.0.tgz#e9488ea466070ea908fd44a3d6478fd4923c67ec"
-  integrity sha512-AoD0oJWerp0/rY9czP/D6hDTTUYGpObhZjMpd7Cl/A6+j0xBE+ayL/ldfggkBXUs0IkvIiM1ljM8+WkOc5k78Q==
-  dependencies:
-    "@sinonjs/commons" "^1.4.0"
-    "@sinonjs/formatio" "^3.2.1"
-    "@sinonjs/samsam" "^3.3.3"
-    diff "^3.5.0"
-    lolex "^4.2.0"
-    nise "^1.5.2"
-    supports-color "^5.5.0"
+sinon-chai@3.4.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/sinon-chai/-/sinon-chai-3.4.0.tgz#06fb88dee80decc565106a3061d380007f21e18d"
+  integrity sha512-BpVxsjEkGi6XPbDXrgWUe7Cb1ZzIfxKUbu/MmH5RoUnS7AXpKo3aIYIyQUg0FMvlUL05aPt7VZuAdaeQhEnWxg==
+
+sinon@8.1.1:
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/sinon/-/sinon-8.1.1.tgz#21fffd5ad0a2d072a8aa7f8a3cf7ed2ced497497"
+  integrity sha512-E+tWr3acRdoe1nXbHMu86SSqA1WGM7Yw3jZRLvlCMnXwTHP8lgFFVn5BnKnF26uc5SfZ3D7pA9sN7S3Y2jG4Ew==
+  dependencies:
+    "@sinonjs/commons" "^1.7.0"
+    "@sinonjs/formatio" "^4.0.1"
+    "@sinonjs/samsam" "^4.2.2"
+    diff "^4.0.2"
+    lolex "^5.1.2"
+    nise "^3.0.1"
+    supports-color "^7.1.0"
 
 sisteransi@^1.0.3:
   version "1.0.3"
@@ -12922,6 +13773,13 @@ source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
   integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
 
+source-map@~0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.2.0.tgz#dab73fbcfc2ba819b4de03bd6f6eaa48164b3f9d"
+  integrity sha1-2rc/vPwrqBm03gO9b26qSBZLP50=
+  dependencies:
+    amdefine ">=0.0.4"
+
 sourcemap-codec@1.4.6, sourcemap-codec@^1.4.4:
   version "1.4.6"
   resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.6.tgz#e30a74f0402bad09807640d39e971090a08ce1e9"
@@ -13180,6 +14038,14 @@ string.prototype.trimleft@^2.1.0:
     define-properties "^1.1.3"
     function-bind "^1.1.1"
 
+string.prototype.trimleft@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/string.prototype.trimleft/-/string.prototype.trimleft-2.1.1.tgz#9bdb8ac6abd6d602b17a4ed321870d2f8dcefc74"
+  integrity sha512-iu2AGd3PuP5Rp7x2kEZCrB2Nf41ehzh+goo8TV7z8/XDBbsvc6HQIlUl9RjkZ4oyrW1XM5UwlGl1oVEaDjg6Ag==
+  dependencies:
+    define-properties "^1.1.3"
+    function-bind "^1.1.1"
+
 string.prototype.trimright@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/string.prototype.trimright/-/string.prototype.trimright-2.1.0.tgz#669d164be9df9b6f7559fa8e89945b168a5a6c58"
@@ -13188,6 +14054,14 @@ string.prototype.trimright@^2.1.0:
     define-properties "^1.1.3"
     function-bind "^1.1.1"
 
+string.prototype.trimright@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/string.prototype.trimright/-/string.prototype.trimright-2.1.1.tgz#440314b15996c866ce8a0341894d45186200c5d9"
+  integrity sha512-qFvWL3/+QIgZXVmJBfpHmxLB7xsUXz6HsUmP8+5dRaC3Q7oKUv9Vo6aMCRZC1smrtyECFsIT30PqBJ1gTjAs+g==
+  dependencies:
+    define-properties "^1.1.3"
+    function-bind "^1.1.1"
+
 string_decoder@0.10, string_decoder@~0.10.x:
   version "0.10.31"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-0.10.31.tgz#62e203bc41766c6c28c9fc84301dab1c5310fa94"
@@ -13370,7 +14244,14 @@ supports-color@^2.0.0:
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
   integrity sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=
 
-supports-color@^5.3.0, supports-color@^5.5.0:
+supports-color@^3.1.0:
+  version "3.2.3"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.2.3.tgz#65ac0504b3954171d8a64946b2ae3cbb8a5f54f6"
+  integrity sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=
+  dependencies:
+    has-flag "^1.0.0"
+
+supports-color@^5.3.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
   integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
@@ -13508,10 +14389,10 @@ ternary-stream@^3.0.0:
     merge-stream "^2.0.0"
     through2 "^3.0.1"
 
-terser@4.4.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/terser/-/terser-4.4.0.tgz#22c46b4817cf4c9565434bfe6ad47336af259ac3"
-  integrity sha512-oDG16n2WKm27JO8h4y/w3iqBGAOSCtq7k8dRmrn4Wf9NouL0b2WpMHGChFGZq4nFAQy1FsNJrVQHfurXOSTmOA==
+terser@4.6.3:
+  version "4.6.3"
+  resolved "https://registry.yarnpkg.com/terser/-/terser-4.6.3.tgz#e33aa42461ced5238d352d2df2a67f21921f8d87"
+  integrity sha512-Lw+ieAXmY69d09IIc/yqeBqXpEQIpDGZqT34ui1QWXIUpR2RjbqEkT8X7Lgex19hslSqcWM5iMN2kM11eMsESQ==
   dependencies:
     commander "^2.20.0"
     source-map "~0.6.1"
@@ -13536,6 +14417,15 @@ test-exclude@^5.2.3:
     read-pkg-up "^4.0.0"
     require-main-filename "^2.0.0"
 
+test-exclude@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/test-exclude/-/test-exclude-6.0.0.tgz#04a8698661d805ea6fa293b6cb9e63ac044ef15e"
+  integrity sha512-cAGWPIyOHU6zlmg88jwm7VRyXnMN7iV68OGAbYDk/Mh/xC/pzVPlQtY6ngoIH/5/tciuhGfvESU8GrHrcxD56w==
+  dependencies:
+    "@istanbuljs/schema" "^0.1.2"
+    glob "^7.1.4"
+    minimatch "^3.0.4"
+
 text-table@0.2.0, text-table@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
@@ -13787,6 +14677,13 @@ tr46@^1.0.1:
   dependencies:
     punycode "^2.1.0"
 
+tr46@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/tr46/-/tr46-2.0.0.tgz#a85da3f8511231357b347caa686abb3dfb150634"
+  integrity sha512-LrErSqfhdUw73AC/eXV2fEmNkvgSYxfm5lvxnLvuVgoVDknvD28Pa5FeDGc8RuVouDxUD3GnHHFv7xnBp7As5w==
+  dependencies:
+    punycode "^2.1.1"
+
 traverse@0.6.6:
   version "0.6.6"
   resolved "https://registry.yarnpkg.com/traverse/-/traverse-0.6.6.tgz#cbdf560fd7b9af632502fed40f918c157ea97137"
@@ -13812,10 +14709,10 @@ trim-right@^1.0.1:
   resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
   integrity sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=
 
-tsickle@0.37.1:
-  version "0.37.1"
-  resolved "https://registry.yarnpkg.com/tsickle/-/tsickle-0.37.1.tgz#2f8a87c1b15766e866457bd06fb6c0e0d84eed09"
-  integrity sha512-0GwgOJEnsmRsrONXCvcbAWY0CvdqF3UugPVoupUpA8Ul0qCPTuqqq0ou/hLqtKZOyyulzCP6MYRjb9/J1g9bJg==
+tsickle@0.38.0:
+  version "0.38.0"
+  resolved "https://registry.yarnpkg.com/tsickle/-/tsickle-0.38.0.tgz#89f5952c9bb3ba0b36dc384975e23cf90e584822"
+  integrity sha512-k7kI6afBuLd2jIrj9JR8lKhEkp99sFVRKQbHeaHQkdvDaH5AvzwqA/qX+aNj28OfuAsWryOKAZoXm24l7JelEw==
 
 tslib@^1.9.0:
   version "1.10.0"
@@ -13851,7 +14748,7 @@ type-check@~0.3.2:
   dependencies:
     prelude-ls "~1.1.2"
 
-type-detect@4.0.8, type-detect@^4.0.0, type-detect@^4.0.5:
+type-detect@4.0.8, type-detect@^4.0.0, type-detect@^4.0.5, type-detect@^4.0.8:
   version "4.0.8"
   resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c"
   integrity sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==
@@ -13866,7 +14763,7 @@ type-fest@^0.5.2:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.5.2.tgz#d6ef42a0356c6cd45f49485c3b6281fc148e48a2"
   integrity sha512-DWkS49EQKVX//Tbupb9TFa19c7+MK1XmzkrZUR8TAktmE/DizXoaoJV6TZ/tSIPXipqNiRI6CyAe7x69Jb6RSw==
 
-type-fest@^0.8.0:
+type-fest@^0.8.0, type-fest@^0.8.1:
   version "0.8.1"
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"
   integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==
@@ -13896,10 +14793,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@3.7.2:
-  version "3.7.2"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.7.2.tgz#27e489b95fa5909445e9fef5ee48d81697ad18fb"
-  integrity sha512-ml7V7JfiN2Xwvcer+XAf2csGO1bPBdRbFCkYBczNZggrBZ9c7G3riSUeJmqEU5uOtXNPMhE3n+R4FA/3YOAWOQ==
+typescript@3.7.5:
+  version "3.7.5"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.7.5.tgz#0692e21f65fd4108b9330238aac11dd2e177a1ae"
+  integrity sha512-/P5lkRXkWHNAbcJIiHPfRoKqyd7bsyCma1hZNUGfn20qm64T6ZBlrzprymeu918H+mB/0rIg2gGK/BXkhhYgBw==
 
 ua-parser-js@^0.7.18:
   version "0.7.20"
@@ -14347,7 +15244,7 @@ vinyl-sourcemaps-apply@^0.1.4:
   dependencies:
     source-map "^0.1.39"
 
-vinyl-sourcemaps-apply@^0.2.0:
+vinyl-sourcemaps-apply@^0.2.0, vinyl-sourcemaps-apply@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz#ab6549d61d172c2b1b87be5c508d239c8ef87705"
   integrity sha1-q2VJ1h0XLCsbh75cUI0jnI74dwU=
@@ -14399,13 +15296,11 @@ w3c-hr-time@^1.0.1:
   dependencies:
     browser-process-hrtime "^0.1.2"
 
-w3c-xmlserializer@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/w3c-xmlserializer/-/w3c-xmlserializer-1.1.2.tgz#30485ca7d70a6fd052420a3d12fd90e6339ce794"
-  integrity sha512-p10l/ayESzrBMYWRID6xbuCKh2Fp77+sA0doRuGn4tTIMrrZVeqfpKjXHY+oDh3K4nLdPgNwMTVP6Vp4pvqbNg==
+w3c-xmlserializer@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/w3c-xmlserializer/-/w3c-xmlserializer-2.0.0.tgz#3e7104a05b75146cc60f564380b7f683acf1020a"
+  integrity sha512-4tzD0mF8iSiMiNs30BiLO3EpfGLZUT2MSX/G+o7ZywDzliWQ3OPtTZ0PTC3B3ca1UAf4cJMHB+2Bf56EriJuRA==
   dependencies:
-    domexception "^1.0.1"
-    webidl-conversions "^4.0.2"
     xml-name-validator "^3.0.0"
 
 walker@^1.0.7, walker@~1.0.5:
@@ -14452,6 +15347,11 @@ webidl-conversions@^4.0.2:
   resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.2.tgz#a855980b1f0b6b359ba1d5d9fb39ae941faa63ad"
   integrity sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==
 
+webidl-conversions@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-5.0.0.tgz#ae59c8a00b121543a2acc65c0434f57b0fc11aff"
+  integrity sha512-VlZwKPCkYKxQgeSbH5EyngOmRp7Ww7I9rQLERETtf5ofd9pGeswWiOtogpEO850jziPRarreGxn5QIiTqpb2wA==
+
 websocket-driver@>=0.5.1:
   version "0.7.3"
   resolved "https://registry.yarnpkg.com/websocket-driver/-/websocket-driver-0.7.3.tgz#a2d4e0d4f4f116f1e6297eba58b05d430100e9f9"
@@ -14506,6 +15406,15 @@ whatwg-url@^7.0.0:
     tr46 "^1.0.1"
     webidl-conversions "^4.0.2"
 
+whatwg-url@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-8.0.0.tgz#37f256cb746398e19b107bd6ef820b4ae2d15871"
+  integrity sha512-41ou2Dugpij8/LPO5Pq64K5q++MnRCBpEHvQr26/mArEKTkCV5aoXIqyhuYtE0pkqScXwhf2JP57rkRTYM29lQ==
+  dependencies:
+    lodash.sortby "^4.7.0"
+    tr46 "^2.0.0"
+    webidl-conversions "^5.0.0"
+
 which-module@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"
@@ -14516,7 +15425,7 @@ which-module@^2.0.0:
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
   integrity sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=
 
-which@1.3.1, which@^1.2.1, which@^1.2.14, which@^1.2.9, which@^1.3.0:
+which@1.3.1, which@^1.1.1, which@^1.2.1, which@^1.2.14, which@^1.2.9, which@^1.3.0:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
   integrity sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==
@@ -14544,16 +15453,21 @@ widest-line@^2.0.0:
   dependencies:
     string-width "^2.1.1"
 
-wordwrap@~0.0.2:
-  version "0.0.3"
-  resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.3.tgz#a3d5da6cd5c0bc0008d37234bbaf1bed63059107"
-  integrity sha1-o9XabNXAvAAI03I0u68b7WMFkQc=
+word-wrap@~1.2.3:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c"
+  integrity sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==
 
-wordwrap@~1.0.0:
+wordwrap@^1.0.0, wordwrap@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-1.0.0.tgz#27584810891456a4171c8d0226441ade90cbcaeb"
   integrity sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=
 
+wordwrap@~0.0.2:
+  version "0.0.3"
+  resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.3.tgz#a3d5da6cd5c0bc0008d37234bbaf1bed63059107"
+  integrity sha1-o9XabNXAvAAI03I0u68b7WMFkQc=
+
 wrap-ansi@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-2.1.0.tgz#d8fc3d284dd05794fe84973caecdd1cf824fdd85"
@@ -14637,12 +15551,10 @@ ws@^5.2.0:
   dependencies:
     async-limiter "~1.0.0"
 
-ws@^7.0.0:
-  version "7.1.2"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-7.1.2.tgz#c672d1629de8bb27a9699eb599be47aeeedd8f73"
-  integrity sha512-gftXq3XI81cJCgkUiAVixA0raD9IVmXqsylCrjRygw4+UOOGzPoxnQ6r/CnVL9i+mDncJo94tSkyrtuuQVBmrg==
-  dependencies:
-    async-limiter "^1.0.0"
+ws@^7.2.1:
+  version "7.2.1"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-7.2.1.tgz#03ed52423cd744084b2cf42ed197c8b65a936b8e"
+  integrity sha512-sucePNSafamSKoOqoNfBd8V0StlkzJKL2ZAhGQinCfNQ+oacw+Pk7lcdAElecBF2VkLNZRiIb5Oi1Q5lVUVt2A==
 
 ws@~3.3.1:
   version "3.3.3"
@@ -14677,7 +15589,7 @@ xmlbuilder@~11.0.0:
   resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-11.0.1.tgz#be9bae1c8a046e76b31127726347d0ad7002beb3"
   integrity sha512-fDlsI/kFEx7gLvbecc0/ohLG50fugQp8ryHzMTuW9vSa1GJ0XYWKnhsUx7oie3G98+r56aTQIUB4kht42R3JvA==
 
-xmlchars@^2.1.1:
+xmlchars@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-2.2.0.tgz#060fe1bcb7f9c76fe2a17db86a9bc3ab894210cb"
   integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==