user-drag-none.html 3.73 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
<style>
    .box { width: 100px; height: 90px; margin-bottom: 10px; background-color: lightblue; }
    .drag-element { -webkit-user-drag: element; }
    .drag-none { -webkit-user-drag: none; }
    a { display: block; width: 80px; height: 80px; background-color: yellow; font-family: ahem; font-size: 25px; }
    a span { color: orange; }
    a img { vertical-align: bottom; }
</style>
<div id="container" style="position: relative;">
    <div class="box" expect="IMG nil">
        <img src="resources/greenbox.png">
    </div>

    <div class="box" expect="nil nil">
        <img class="drag-none" src="resources/greenbox.png">
    </div>

    <div class="box drag-element" expect="DIV DIV">
        <img class="drag-none" src="resources/greenbox.png">
    </div>

22
    <div class="box" expect="IMG A A A nil">
23 24 25
        <a href="#"><img src="resources/greenbox.png">x<br><span>y</span></a>
    </div>

26
    <div class="box" expect="IMG A A A nil">
27 28 29 30 31 32 33
        <a href="#" class="drag-element"><img src="resources/greenbox.png">x<br><span>y</span></a>
    </div>

    <div class="box" expect="IMG nil nil nil nil">
        <a href="#" class="drag-none"><img src="resources/greenbox.png">x<br><span>y</span></a>
    </div>

34
    <div class="box" expect="A A A A nil">
35 36 37
        <a href="#"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
    </div>

38
    <div class="box" expect="A A A A nil">
39 40 41 42 43 44 45
        <a href="#" class="drag-element"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
    </div>

    <div class="box drag-element" expect="IMG DIV DIV DIV DIV">
        <a href="#" class="drag-none"><img src="resources/greenbox.png">x<br><span>y</span></a>
    </div>

46
    <div class="box drag-element" expect="A A A A DIV">
47 48 49
        <a href="#"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
    </div>

50
    <div class="box drag-element" expect="A A A A DIV">
51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106
        <a href="#" class="drag-element"><img class="drag-none" src="resources/greenbox.png">x<br><span>y</span></a>
    </div>
</div>
<pre id="console"></pre>
<script>
    function log(message)
    {
        document.getElementById("console").appendChild(document.createTextNode(message + "\n"));
    }

    onload = window.layoutTestController ? function()
    {
        layoutTestController.dumpAsText();

        var container = document.getElementById("container");
        var y = container.getBoundingClientRect().top;
        for (var i = 0; i < container.childElementCount; ++i) {
            var listener = function(event)
            {
                result = event.target.nodeType === Node.TEXT_NODE ? "text" : event.target.tagName;
            };

            container.addEventListener("dragstart", listener);

            var child = container.children[i];
            log("Test #" + i);

            var expectedResults = child.getAttribute("expect").split(" ");
            var result;

            function test(h, v)
            {
                if (expectedResults.length) {
                    getSelection().empty();
                    result = "nil";
                    eventSender.mouseMoveTo(h, y - scrollY + v);
                    eventSender.mouseDown();
                    eventSender.mouseMoveTo(220, y - scrollY + v);
                    eventSender.mouseUp();
                    var expected = expectedResults.shift();
                    log(result === expected ? "PASS" : "FAIL: expected " + expected + " but got " + result);
                }
            }

            test(20, 20);
            test(45, 20);
            test(20, 45);
            test(45, 45);
            test(95, 85);

            container.removeEventListener("dragstart", listener);
            y += 100;
            scrollBy(0, 100);
        }
    } : undefined;
</script>