diff options
Diffstat (limited to 'devtools/client/webconsole/test/browser/test_jsterm_screenshot_command.html')
-rw-r--r-- | devtools/client/webconsole/test/browser/test_jsterm_screenshot_command.html | 87 |
1 files changed, 87 insertions, 0 deletions
diff --git a/devtools/client/webconsole/test/browser/test_jsterm_screenshot_command.html b/devtools/client/webconsole/test/browser/test_jsterm_screenshot_command.html new file mode 100644 index 0000000000..6af9104fb8 --- /dev/null +++ b/devtools/client/webconsole/test/browser/test_jsterm_screenshot_command.html @@ -0,0 +1,87 @@ +<html> + <head> + <meta charset="utf8"> + <style> + html, body { + margin: 0; + padding: 0; + } + + body { + --fixed-header-height: 50px; + margin-top: var(--fixed-header-height); + } + + header { + height: var(--fixed-header-height); + background: rgb(255, 0, 0); + position: fixed; + left: 0; + top: 0; + right: 0; + /* Since we may check the background-color, put the text in the center so we don't pick a pixel from the text */ + text-align: center; + } + + img { + height: 100px; + width: 100px; + } + + iframe { + display: block; + height: 50px; + border: none; + } + + .overflow { + overflow: scroll; + height: 200vh; + width: 200vw; + } + </style> + </head> + <body> + <header>Fixed header</header> + <iframe id="same-origin-iframe" data-bg-color="rgb(255, 255, 0)"></iframe> + <iframe id="remote-iframe" data-bg-color="rgb(0, 255, 255)"></iframe> + <img id="testImage"></img> + <script> + "use strict"; + + async function loadIframe(iframeEl, origin) { + const onIframeLoaded = new Promise(resolve => { + iframeEl.addEventListener("load", resolve, {once: true}) + }); + const bgColor = iframeEl.getAttribute("data-bg-color"); + iframeEl.src = + `${origin}/document-builder.sjs?html= + <style> + html { + background:${bgColor}; + text-align: center; + } + + span { + background-color: rgb(0, 100, 0); + /* move the text to right so we can check the span background color from test */ + padding-left: 10px; + } + </style> + <span>${origin}</span>`; + await onIframeLoaded; + iframeEl.classList.add("loaded-iframe"); + } + + const origin = document.location.origin; + // Since we can't know on which origin the document is loaded, we check it so we + // can pick another one for the remote iframe. + const remoteOrigin = origin.endsWith(".com") + ? origin.replace(".com", ".org") + : origin.replace(".org", ".com"); + + loadIframe(document.getElementById("same-origin-iframe"), origin); + loadIframe(document.getElementById("remote-iframe"), remoteOrigin); + </script> + </body> +</html> |