elementsFromPoint-iframes.html

Enable keyboard shortcuts

This WPT test may be referenced by the following Test IDs:
- /css/cssom-view/elementsFromPoint-iframes.html - WPT Dashboard Interop Dashboard

<!DOCTYPE HTML>

<script src="/resources/testharness.js"></script>

<script src="/resources/testharnessreport.js"></script>

<script src="resources/elementsFromPoint.js"></script>

<script>

var loadedFrameCount = 0;

var t1 = async_test('elementsFromPoint on the root document for points in iframe elements');

var t2 = async_test('elementsFromPoint on inner documents');

function onFrameLoaded() {

    loadedFrameCount++;

    if (loadedFrameCount < 2)

        return;

    var body = document.body;

    var html = document.documentElement;

    var iframe = document.getElementById('iframe');

    var scrollableIframe = document.getElementById('scrollableIframe');

    t1.step(function() {

        checkElementsFromPointFourCorners('document', 'iframe',

            [iframe, body,  html],

            [iframe, body, html],

            [iframe, body, html],

            [scrollableIframe, iframe, body, html]);

        checkElementsFromPointFourCorners('document', 'scrollableIframe',

            [scrollableIframe, iframe, body, html],

            [scrollableIframe, iframe, body, html],

            [scrollableIframe, iframe, body, html],

            [scrollableIframe, iframe, body, html]);

});

    t1.done();

    t2.step(function() {

        var iframeDocument = document.getElementById('iframe').contentDocument;

        var iframeRoot = iframeDocument.documentElement;

        var iframeBody = iframeDocument.body;

        var iframeDiv = iframeDocument.getElementById('div');

        checkElementsFromPointFourCorners('document.getElementById(\'iframe\').contentDocument', 'div',

            [iframeDiv, iframeBody, iframeRoot],

            [iframeDiv, iframeBody, iframeRoot],

            [iframeDiv, iframeBody, iframeRoot],

            [iframeDiv, iframeBody, iframeRoot]);

        var iframeDocument2 = document.getElementById('scrollableIframe').contentDocument;

        var iframeRoot2 = iframeDocument2.documentElement;

        var iframeBody2 = iframeDocument2.body;

        var iframeSmallDiv = iframeDocument2.getElementById('small');

        var iframeBigDiv = iframeDocument2.getElementById('big');

        checkElementsFromPointFourCorners('document.getElementById(\'scrollableIframe\').contentDocument', 'big',

            [iframeSmallDiv, iframeBigDiv, iframeBody2, iframeRoot2],

            [iframeBigDiv, iframeBody2, iframeRoot2],

[],

            []);

});

    t2.done();

</script>

<style>

html, body {

    margin: 0;

    padding: 0;

body {

    height: 500px;

#iframe {

    width: 200px;

    height: 200px;

#scrollableIframe {

    position: absolute;

    top: 0;

    left: 0;

    transform: translate(50px, 50px);

    width: 150px;

    height: 150px;

    overflow-y: scroll;

    overflow-x: scroll;

</style>

<iframe id="iframe" src="resources/iframe1.html"></iframe>

<iframe id="scrollableIframe" src="resources/iframe2.html"></iframe>