1 files changed, 76 insertions, 0 deletions
diff --git a/tests/visual/autocomplete/autocomplete.html b/tests/visual/autocomplete/autocomplete.html
new file mode 100644
index 000000000..c39d032ff
--- /dev/null
+++ b/tests/visual/autocomplete/autocomplete.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8" />
+	<title>Autocomplete Visual Test: Default</title>
+	<link rel="stylesheet" href="../visual.css" type="text/css" />
+	<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
+	<script type="text/javascript" src="../../../jquery-1.4.2.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
+	<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
+	<script type="text/javascript">
+	$(function() {
+		$.fn.themeswitcher && $('<div/>').css({
+			position: "absolute",
+			right: 10,
+			top: 10
+		}).appendTo(document.body).themeswitcher();
+		
+		function log(message) {
+			$("<div/>").text(message).prependTo("#log");
+			$("#log").attr("scrollTop", 0);
+		}
+		
+		function enable() {
+			$("#tags").autocomplete({
+				source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl"],
+				delay: 0,
+				search: function() {
+					log("Searching for: " + this.value);
+				},
+				open: function() {
+					log("Found something");
+				},
+				focus: function(event, ui) {
+					log("Moving focus to " + ui.item.label);
+				},
+				close: function() {
+					log("Hiding suggestions");
+				},
+				change: function(event, ui) {
+					log(ui.item ? ("Selected: " + ui.item.value) : "Nothing selected, input was " + this.value);
+				}
+			});
+		}
+		enable();
+		$("#toggle").toggle(function() {
+			$("#tags").autocomplete("destroy");
+		}, enable);
+	});
+	</script>
+</head>
+<body>
+
+<div class="ui-widget">
+	<label for="tags">Tags: </label>
+	<input class="ui-widget ui-widget-content ui-corner-all" id="tags" />
+</div>
+<div>
+	<label for="tags">Select: </label>
+	<select>
+		<option>label</option>
+	</select>
+</div>
+
+<div class="ui-widget" style="margin-top:2em; font-family:Arial">
+	Log:
+	<div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
+</div>
+
+<button id="toggle">Toggle widget</button>
+
+</body>
+</html>