I am a bit confused as to how JavaScript is suppposed to be run in an AMP page.
I got as far as understanding that my JavaScript must be executed in an iframe. Such iframe has to be placed down in the page (75% at least from top) and has to be served through https. This does indeed work:
<amp-iframe
width=300
height=300
sandbox="allow-scripts allow-popups allow-popups-to-escape-sandbox"
layout="responsive"
frameborder="0"
src="https://localhost:8000/?p=myjs">
</amp-iframe>
In that page (https://localhost:8000/?p=myjs
) I can freely run my js.
My problem is the following though:
How am I supposed to run my code against the document of the main page including the iframe?
I tried accessing window.parent.document
and that is blocked. (of course).
Can anyone explain how AMP people think we can actually port pages to AMP if all our js gets killed? What is the recommended pattern to have our js run on an AMP page? Is there any such thing or is it just assumed that developers must dump all their code?
Thanks
How am I supposed to run my code against the document of the main page including the iframe?
You aren't.
Can anyone explain how AMP people think we can actually port pages to AMP if all our js gets killed?
The idea is that you write lightweight pages that don't depend on JavaScript.
From the spec:
AMP HTML is a subset of HTML for authoring content pages such as news articles in a way that guarantees certain baseline performance characteristics.
"Content pages such as news articles" don't need JavaScript. If you aren't writing that sort of page then maybe AMP HTML isn't a good choice of language and you should stick to HTML 5.