Skip to content

Commit

Permalink
✨ [Story auto-analytics] Added validation and tests (#32288)
Browse files Browse the repository at this point in the history
* Added validation and tests

* Make mandatory

* Updated regex and validation files
  • Loading branch information
mszylkowski committed Jan 29, 2021
1 parent 71469e7 commit 08db5b6
Show file tree
Hide file tree
Showing 7 changed files with 132 additions and 6 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
<!--
Copyright 2021 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 a proper auto-analytics component with a gtag
-->
<!doctype html>
<html >
<head>
<meta charset="utf-8">
<title>STAMP auto analytics</title>
<link rel="canonical" href="http://nonblocking.io/" >
<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-story" src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
<script async custom-element="amp-story-auto-analytics" src="https://cdn.ampproject.org/v0/amp-story-auto-analytics-0.1.js"></script>
</head>
<body>
<amp-story standalone title="My Story" publisher="Me" publisher-logo-src="http://me.com/logo.png" poster-portrait-src="http://me.com/poster.jpg">
<!-- Valid: has correct gtag attribute and value -->
<amp-story-auto-analytics gtag-id="UA-ANALYTICS"></amp-story-auto-analytics>
<amp-story-page id="cover" auto-advance-after="1s">
<amp-story-grid-layer template="fill">
<h1>Title</h1>
</amp-story-grid-layer>
</amp-story-page>
</amp-story>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
PASS
| <!--
| Copyright 2021 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 a proper auto-analytics component with a gtag
| -->
| <!doctype html>
| <html ⚡>
| <head>
| <meta charset="utf-8">
| <title>STAMP auto analytics</title>
| <link rel="canonical" href="http://nonblocking.io/" >
| <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-story" src="https://cdn.ampproject.org/v0/amp-story-1.0.js"></script>
| <script async custom-element="amp-story-auto-analytics" src="https://cdn.ampproject.org/v0/amp-story-auto-analytics-0.1.js"></script>
| </head>
| <body>
| <amp-story standalone title="My Story" publisher="Me" publisher-logo-src="http://me.com/logo.png" poster-portrait-src="http://me.com/poster.jpg">
| <!-- Valid: has correct gtag attribute and value -->
| <amp-story-auto-analytics gtag-id="UA-ANALYTICS"></amp-story-auto-analytics>
| <amp-story-page id="cover" auto-advance-after="1s">
| <amp-story-grid-layer template="fill">
| <h1>Title</h1>
| </amp-story-grid-layer>
| </amp-story-page>
| </amp-story>
| </body>
| </html>
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
#
# Copyright 2021 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-story-auto-analytics
html_format: AMP
tag_name: "SCRIPT"
extension_spec: {
name: "amp-story-auto-analytics"
version: "0.1"
version: "latest"
}
attr_lists: "common-extension-attrs"
}
tags: { # <amp-story-auto-analytics>
html_format: AMP
tag_name: "AMP-STORY-AUTO-ANALYTICS"
requires_extension: "amp-story-auto-analytics"
attrs: {
name: "gtag-id"
mandatory: true
value_regex: "[A-Z]{1,2}-[A-Z0-9-]+"
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ amp-story/1.0/test/validator-amp-story-amp-experiment-error.html:48:8 Custom Jav
| <!-- Invalid: amp-experiment not allowed as a child of amp-story-page -->
| <amp-experiment>
>> ^~~~~~~~~
amp-story/1.0/test/validator-amp-story-amp-experiment-error.html:61:6 Tag 'amp-experiment' is disallowed as child of tag 'amp-story-page'. Child tag must be one of ['amp-analytics', 'amp-pixel', 'amp-story-animation', 'amp-story-cta-layer', 'amp-story-grid-layer', 'amp-story-page-attachment']. (see https://amp.dev/documentation/components/amp-story)
amp-story/1.0/test/validator-amp-story-amp-experiment-error.html:61:6 Tag 'amp-experiment' is disallowed as child of tag 'amp-story-page'. Child tag must be one of ['amp-analytics', 'amp-pixel', 'amp-story-animation', 'amp-story-auto-analytics', 'amp-story-cta-layer', 'amp-story-grid-layer', 'amp-story-page-attachment']. (see https://amp.dev/documentation/components/amp-story)
| <script type="application/json">
| {
| "background-color-test": {
Expand All @@ -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-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-auto-analytics', 'amp-story-bookend', 'amp-story-page']. (see https://amp.dev/documentation/components/amp-story)
| <script type="application/json">
| {
| "background-color-test": {
Expand All @@ -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>
| </html>
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ FAIL
| <!-- Invalid: is not a descendant of amp-story-grid-layer. -->
| <amp-twitter width="375"
>> ^~~~~~~~~
amp-story/1.0/test/validator-amp-story-amp-twitter-error.html:36:6 Tag 'amp-twitter' is disallowed as child of tag 'amp-story-page'. Child tag must be one of ['amp-analytics', 'amp-pixel', 'amp-story-animation', 'amp-story-cta-layer', 'amp-story-grid-layer', 'amp-story-page-attachment']. (see https://amp.dev/documentation/components/amp-story)
amp-story/1.0/test/validator-amp-story-amp-twitter-error.html:36:6 Tag 'amp-twitter' is disallowed as child of tag 'amp-story-page'. Child tag must be one of ['amp-analytics', 'amp-pixel', 'amp-story-animation', 'amp-story-auto-analytics', 'amp-story-cta-layer', 'amp-story-grid-layer', 'amp-story-page-attachment']. (see https://amp.dev/documentation/components/amp-story)
>> ^~~~~~~~~
amp-story/1.0/test/validator-amp-story-amp-twitter-error.html:36:6 The tag 'amp-twitter' requires including the 'amp-twitter' extension JavaScript. (see https://amp.dev/documentation/components/amp-twitter)
| height="472"
Expand All @@ -46,4 +46,4 @@ amp-story/1.0/test/validator-amp-story-amp-twitter-error.html:36:6 The tag 'amp-
| </amp-story-page>
| </amp-story>
| </body>
| </html>
| </html>
Original file line number Diff line number Diff line change
Expand Up @@ -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-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-auto-analytics', '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>
Expand Down
3 changes: 3 additions & 0 deletions extensions/amp-story/validator-amp-story.protoascii
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,7 @@ tags: { # <amp-story>
child_tag_name_oneof: "AMP-PIXEL"
child_tag_name_oneof: "AMP-SIDEBAR"
child_tag_name_oneof: "AMP-STORY-AUTO-ADS"
child_tag_name_oneof: "AMP-STORY-AUTO-ANALYTICS"
child_tag_name_oneof: "AMP-STORY-BOOKEND"
child_tag_name_oneof: "AMP-STORY-PAGE"
}
Expand All @@ -146,6 +147,7 @@ tags: { # <amp-story-page>
child_tag_name_oneof: "AMP-ANALYTICS"
child_tag_name_oneof: "AMP-PIXEL"
child_tag_name_oneof: "AMP-STORY-ANIMATION"
child_tag_name_oneof: "AMP-STORY-AUTO-ANALYTICS"
child_tag_name_oneof: "AMP-STORY-CTA-LAYER"
child_tag_name_oneof: "AMP-STORY-GRID-LAYER"
child_tag_name_oneof: "AMP-STORY-PAGE-ATTACHMENT"
Expand Down Expand Up @@ -671,6 +673,7 @@ descendant_tag_list: {
tag: "AMP-PIXEL"
tag: "AMP-STATE"
tag: "AMP-STORY-360"
tag: "AMP-STORY-AUTO-ANALYTICS"
tag: "AMP-STORY-INTERACTIVE-BINARY-POLL"
tag: "AMP-STORY-INTERACTIVE-POLL"
tag: "AMP-STORY-INTERACTIVE-QUIZ"
Expand Down

0 comments on commit 08db5b6

Please sign in to comment.