Bug Tracker

Ticket #5684: test_#5684.html

File test_#5684.html, 2.1 KB (added by jixxer, 5 years ago)

small test case

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
3    <head>
4    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
5    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
6    <script type="text/javascript">
7    function move() {
8        $("div#container > p").animate({"marginLeft": "+=200px"}, 1000, "linear", function() {
9            if(this.id=="asd") {
10                //this if block is just to show that the callback
11                //never fires for the second paragraph
12                this.id="bsd";
13                alert("Boohoo, I won't ever be called :-(");
14            }
15            foo(); //undefined function call --> exception
16        });
17    }
18    function moveBack() {
19        $('div#container > p').css('marginLeft', '')
20    }
21    </script>
22    <title>Test for Ticket #5684</title>
23</head>
24<body>
25    <div id="container">
26        <p>Move me right</p>
27        <p id="asd">Move me right too</p>
28    </div>
29    <input type="button" value="#1: Move paragraphs right" onclick="move()" />
30    <input type="button" value="#2: Reset paragraphs" onclick="moveBack()" /><br/><br/>
31    <div id="explanation" style="border:1px solid black; padding-left:5px">
32        <p>Clicking the first button (#1) will move the above paragraphs 200px to the right</p>
33        <p>Clicking the second button (#2) will reset them to the original position</p>
34        <p>Due to the nature of the bug I described in the bug ticket a second click on #1 won't
35            move the paragraphs further to the right</p>
36        <p>Also due to the nature of this bug clicking the button #2 after the animation will
37            only reset one of the two paragraphs the other will keep moving right</p>
38        <p>If you click the button #2 fast you will notice how also the first paragraph is reset
39            but springs back to the right immediatly</p>
40    </div>
41</body>
42</html>