question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

The tag 'amp-story >> amp-video' may only appear as a descendant of tag 'amp-story'.

See original GitHub issue

Hi there,

I’m not sure if my issue qualifies as a bug, sorry if this is not the proper place to tell you about it.

The thing is, when I try to pass the AMP validator and my code has an amp-video in it, I get this error:

screenshot 2018-01-18 11 45 56 screenshot 2018-01-18 11 46 14

Should I say I’m not using an amp-story component on my site, and after checking the amp-video docs didn’t find anything indicating I should, so I currently don’t know how to solve this issue.

Could you shed some light on this?

Thanks!

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:8 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
Gregablecommented, Jan 22, 2018

@honeybadgerdontcare , the specificity changes fix this.

Short answer is that we have a fix ready for this bad error message (should land in github soon). The actual issue is that the autoplay attribute doesn’t allow a true value. The correct usage is just to add the autoplay attribute with no value. You can use autoplay="" if you want. Same with loop.

Long answer:

The validator potentially has multiple rules for each tag we encounter on an AMP page. Approximately speaking, these rules (represented as a TagSpec) are OR’ed together. That is, if any one of the rules match, the encountered tag is valid. That’s great, except sometimes neither rule matches. Then the validator has to guess which one matched ‘better’ in order to produce error messages.

For <amp-video> tags, we recently introduced a 2nd rule, specific to amp story videos. It’s the same as the original rule, except requires autoplay. We also added a new constraint to both rules. The old rule cannot match inside an amp-story tag and the new rule only matches inside an amp-story tag. This combination produces the validation behavior we want.

So, the validator now sees two possible rules, neither of which match.

For the old rule, it sees the two errors:

Invalid value 'true' for attribute 'autoplay'.
Invalid value '1' for attribute 'loop'.

For the new rule, it sees the error:

May only appear as a descendant of 'amp-story'.

Note in the 2nd case, we suppress attribute errors if there is an ancestor error, since the attribute errors are typically red herrings in these cases. (There are lots of hand-tune choices in this to get good errors).

The validator then prefers the rule with fewer errors. Since the new rule only produces 1 error, the validator picks it, leading to this.

The new change modifies our priorities to look for a more specific error first, and to break ties based on number of errors. Previously specificity broke ties on number of errors. It’s a small tweak, but fixes this case and a few others like it. Attribute errors are considered more specific than ancestor errors.

0reactions
orballocommented, Jan 23, 2018

Thanks for your explanation.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Embeds on AMP Pages are INVALID
Google says: The tag 'amp-img' may not appear as a descendant of tag 'amp-story-player'. Here's the only AMP page ...
Read more >
AMP validation errors
"The tag '%1' may only appear as a descendant of tag '%2'." Fix, Either remove the tag or make it a descendant of...
Read more >
Custom Google AMP tag and attributes in PhpStorm?
AMP: The tag 'amp-social-share' may not appear as a descendant of tag 'amp-sidebar'. Why? ... How can I add custom HTML & Javascript...
Read more >
The tag img may only appear as a descendant of ...
How to resolve AMP HTML page validation error: The tag img may only appear as a descendant of tag noscript. Did you mean...
Read more >
Google AMP - Video
Placeholder − This placeholder tag will show content before the video starts. Fallback − This tag will be called when the browser does...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found