5 <title>Dialog Visual Test - Modal Dialog in Large DOM</title>
6 <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
7 <script src="../../../jquery-1.9.1.js"></script>
8 <script src="../../../ui/jquery.ui.core.js"></script>
9 <script src="../../../ui/jquery.ui.position.js"></script>
10 <script src="../../../ui/jquery.ui.widget.js"></script>
11 <script src="../../../ui/jquery.ui.mouse.js"></script>
12 <script src="../../../ui/jquery.ui.draggable.js"></script>
13 <script src="../../../ui/jquery.ui.resizable.js"></script>
14 <script src="../../../ui/jquery.ui.button.js"></script>
15 <script src="../../../ui/jquery.ui.dialog.js"></script>
19 html = new Array( 500 ).join( $.trim( $( "#template" ).html() ) );
20 $( html ).appendTo( "body" );
23 $( "#dialog" ).dialog({
27 $( "<li>Create: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" );
29 $( "#opener" ).click(function() {
31 $( "#dialog" ).dialog( "open" );
32 $( "<li>Open: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" );
39 <p>WHAT: A single dialog is created on a page with a large DOM.</p>
40 <p>EXPECTED: Creating and opening the dialog should be fast, regardless of page size.</p>
42 <button id="opener">open dialog</button>
43 <div id="dialog" title="Dialog Title">
44 <p> Dialog Content </p>
50 <script type="text/html" id="template">
51 <div><div><div><div><div><div><div><div><div><div>
52 <div><div><div><div><div><div><div><div><div><div>
53 <div><div><div><div><div><div><div><div><div><div>
54 <div><div><div><div><div><div><div><div><div><div>
55 <div><div><div><div><div><div><div><div><div><div>
56 <div><p>This <span>is</span> <span>a</span> <strong>large</strong> <abbr>DOM</abbr>.</p></div>
59 <option>option 1</option>
60 <option>option 2</option>
61 <option>option 3</option>
62 <option>option 4</option>
63 <option>option 5</option>
65 </div></div></div></div></div></div></div></div></div></div>
66 </div></div></div></div></div></div></div></div></div></div>
67 </div></div></div></div></div></div></div></div></div></div>
68 </div></div></div></div></div></div></div></div></div></div>
69 </div></div></div></div></div></div></div></div></div></div>