wpt/css/css-images/gradient/color-stops-parsing.html fails
[WebKit-https.git] / LayoutTests / fast / events / drag-and-drop.html
1 <html>
2 <head>
3 <script src="../../resources/js-test-pre.js"></script>
4 <style>
5 #dropTarget, #dragMe { text-align: center; display: table-cell; vertical-align: middle }
6 #dropTarget {width: 256px; height: 256px; border: 1px dashed}
7 #dragMe {-webkit-user-drag: element; -webkit-user-select: none; background: #ff0000; width: 64px; height: 64px; color: white}
8 </style>
9 <script>
10     var dragMe;
11     var dropTarget;
12     var effectAllowedElem;
13     var dropEffectElem;
14     var consoleElm;
15     var event;
16     
17     window.onload = function()
18     {
19         dragMe = document.getElementById("dragMe");
20         dropTarget = document.getElementById("dropTarget");
21         effectAllowedElem = document.getElementById("effectAllowed");
22         dropEffectElem = document.getElementById("dropEffect");
23         consoleElm = document.getElementById("console");
24         
25         if (!dragMe || !dropTarget || !effectAllowedElem || !dropEffectElem || !consoleElm)
26             return;
27         
28         dragMe.ondragstart = dragStart;
29         dragMe.ondragend = dragEnd;
30         
31         dropTarget.ondragenter = dragEntered;
32         dropTarget.ondragover = dragOver;
33         dropTarget.ondrop = drop;
34         
35         runTest();
36     }
37     
38     function dragStart(e)
39     {
40         event = e;
41         if (effectAllowedElem.options[effectAllowedElem.selectedIndex].value != "undefined")
42             e.dataTransfer.effectAllowed = effectAllowedElem.options[effectAllowedElem.selectedIndex].value;
43
44         e.dataTransfer.setData('Text', e.target.textContent);
45     }
46     
47     function dragEnd(e)
48     {
49         checkDragState(e);
50         return;
51     }
52     
53     function dragEntered(e)
54     {
55         dragEnteredAndUpdated(e);
56     }
57     
58     function dragOver(e)
59     {
60         dragEnteredAndUpdated(e);
61     }
62     
63     function dragEnteredAndUpdated(e)
64     {
65         event = e;
66         e.dataTransfer.dropEffect = dropEffectElem.options[dropEffectElem.selectedIndex].value;
67         cancelDrag(e);
68     }
69     
70     function drop(e)
71     {
72         cancelDrag(e);
73     }
74     
75     function cancelDrag(e)
76     {
77         if (e.preventDefault)
78             e.preventDefault();
79         else {
80             // Assume this script is executing within Internet Explorer
81             e.returnValue = false;
82         }
83     }
84     
85     function checkDragState(e)
86     {
87         event = e;
88         var chosenDropEffect = dropEffectElem.options[dropEffectElem.selectedIndex].value;
89         var chosenEffectAllowed = effectAllowedElem.options[effectAllowedElem.selectedIndex].value;
90         var actualDropEffect = e.dataTransfer.dropEffect;
91         
92         if (chosenEffectAllowed === "undefined") {
93             // If no effectAllowed is set, we should default to uninitialized. Make sure that's the case.
94             shouldBeEqualToString("event.dataTransfer.effectAllowed", "uninitialized");
95             
96             // Then set the chosenEffectAllowed so isDropEffectAllowed matches the HTML5 spec, and
97             // doesn't need special cases for undefined.
98             chosenEffectAllowed = "uninitialized";
99         }
100         
101         if (chosenEffectAllowed === "dummy") {
102             // If a bad effectAllowed is attempted to be set, it should never be set, and the
103             // effectAllowed should be uninitialized.
104             shouldBeEqualToString("event.dataTransfer.effectAllowed", "uninitialized");
105             
106             // Then set the chosenEffectAllowed so isDropEffectAllowed matches the HTML5 spec, and
107             // doesn't need special cases for undefined.
108             chosenEffectAllowed = "uninitialized";
109         }
110         expected = dropEffectElem.options[dropEffectElem.selectedIndex].value;
111         if (chosenDropEffect == "dummy") {
112             switch (chosenEffectAllowed) {
113                 case "undefined":
114                 case "copyLink":
115                 case "uninitialized":
116                 case "all":
117                     expected = "copy";
118                     break;
119                 case "copyMove":
120                 case "move":
121                 case "linkMove":
122                     expected = "move";
123                     break;
124                 default:
125                     expected = chosenEffectAllowed;
126             }
127         }
128         if (isDropEffectAllowed(chosenDropEffect, chosenEffectAllowed))
129             shouldBeEqualToString('event.dataTransfer.dropEffect', expected);
130         else
131             shouldBeEqualToString('event.dataTransfer.dropEffect', 'none');
132             
133     }
134     
135     function isDropEffectAllowed(chosenDropEffect, allowedDropEffect) {
136         // Extracted from the HTML 5 drag-and-drop section, http://dev.w3.org/html5/spec/Overview.html#dnd
137         if (chosenDropEffect == "none")
138             return true;
139         if (chosenDropEffect == "copy" && ["copy", "copyLink", "copyMove", "uninitialized", "all"].indexOf(allowedDropEffect) != -1)
140             return true;
141         if (chosenDropEffect == "move" && ["move", "copyMove", "linkMove", "uninitialized", "all"].indexOf(allowedDropEffect) != -1)
142             return true;
143         if (chosenDropEffect == "link" && ["link", "copyLink", "linkMove", "uninitialized", "all"].indexOf(allowedDropEffect) != -1)
144             return true;
145         if (chosenDropEffect == "dummy" && ["copy", "link", "move", "copyLink", "copyMove", "linkMove", "uninitialized", "all"].indexOf(allowedDropEffect) != -1)
146             return true; 
147         return false;
148     }
149
150     function runTest()
151     {
152         if (!window.eventSender)
153             return;
154             
155         if (window.testRunner)
156             testRunner.dumpAsText();
157             
158         var startX = dragMe.offsetLeft + 10;
159         var startY = dragMe.offsetTop + dragMe.offsetHeight / 2;
160         var endX = dropTarget.offsetLeft + 10;
161         var endY = dropTarget.offsetTop + dropTarget.offsetHeight / 2;
162         
163         var numEffectAllowed = effectAllowedElem.options.length;
164         var numEffects = dropEffectElem.options.length;
165         
166         for (var i = 0; i < numEffectAllowed; ++i) {
167             effectAllowedElem.options[i].selected = true;
168             debug('<br />When effectAllowed == "' + effectAllowedElem.options[i].value + '"<br />');
169             for (var j = 0; j < numEffects; ++j) {
170                 dropEffectElem.options[j].selected = true;
171                 eventSender.mouseMoveTo(startX, startY);
172                 eventSender.mouseDown();
173                 eventSender.leapForward(100);
174                 eventSender.mouseMoveTo(endX, endY);
175                 eventSender.mouseUp();
176             }
177         }
178         var testContainer = document.getElementById("test-container");
179         if (testContainer)
180             document.body.removeChild(testContainer);
181         debug('<br /><span class="pass">TEST COMPLETE</span>');
182     }
183 </script>
184 </head>
185 <body>
186     <p id="description"></p>
187     <div id="test-container">
188         <label for="effectAllowed">effectAllowed</label> <select id="effectAllowed">
189             <option value="uninitialized">Uninitialized</option>
190             <option value="undefined">Undefined</option>
191             <option value="none">None</option>
192             <option value="all">All</option>
193             <option value="copy">Copy</option>
194             <option value="move">Move</option>
195             <option value="link">Link</option>
196             <option value="copyMove">CopyMove</option>
197             <option value="copyLink">CopyLink</option>
198             <option value="linkMove">LinkMove</option>
199             <option value="dummy">Nonexistent (Dummy) Effect</option>
200         </select>
201         <br/><br/>
202         <div id="dropTarget">Drop the red square onto me.<br/><br/>
203             <label for="dropEffect">Expects dropEffect</label> <select id="dropEffect">
204                 <option value="none">None</option>
205                 <option value="copy">Copy</option>
206                 <option value="move">Move</option>
207                 <option value="link">Link</option>
208                 <option value="dummy">Nonexistent (Dummy) Effect</option>
209             </select>
210         </div>
211         <hr/>
212         <p>Items that can be dragged to the drop target:</p>
213         <div id="dragMe" draggable="true">Square</div>
214         <hr/>
215     </div>
216     <div id="console"></div>
217     <script>
218         description("This test checks that drag-and-drop support works and conforms to the HTML 5 specification.<br/>" +
219                     "For each effectAllowed, iterates through the possible dropEffects: none, copy, move, link, dummy.");
220     </script>
221 </body>
222 </html>