Initial commit

.gitignore

+~$*
+.DS_Store
+Thumbs.db
+Desktop.ini
+build

.npmignore

+.gitignore
+.npmignore
+bower.json
+component.json
+examples
+Makefile
+tests

LICENSE

+Copyright (c) 2014 The Financial Times Ltd.
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.

Makefile

+SHELL := /bin/bash
+
+QS=compilation_level=SIMPLE_OPTIMIZATIONS&output_format=text
+URL=http://closure-compiler.appspot.com/compile
+CODE=js_code@lib/fastclick.js
+
+CHECK=\033[32m✔\033[39m
+
+build/fastclick.min.js: lib/fastclick.js
+	@mkdir -p build
+	@echo -n "Building build/fastclick.min.js...                  "
+	@curl --silent --show-error --data-urlencode "${CODE}" --data "${QS}&output_info=compiled_code" ${URL} -o build/fastclick.min.js
+	@echo -e "${CHECK} Done"
+	@echo -n "Getting compression stats...                        "
+	@echo -e "${CHECK} Done\n\n" "`curl --silent --show-error --data-urlencode "${CODE}" --data "${QS}&output_info=statistics" ${URL}`"
+	@echo ${STATS}
+
+test:
+	jshint -v lib/*.js
+
+clean:
+	rm -rf build
+
+.PHONY: clean test

README.md

+# FastClick #
+
+FastClick is a simple, easy-to-use library for eliminating the 300ms delay between a physical tap and the firing of a `click` event on mobile browsers. The aim is to make your application feel less laggy and more responsive while avoiding any interference with your current logic.
+
+FastClick is developed by [FT Labs](http://labs.ft.com/), part of the Financial Times.
+
+*Note: As of late 2015 most mobile browsers - notably Chrome and Safari - no longer have a 300ms touch delay, so fastclick offers no benefit on newer browsers, and risks introducing [bugs](https://github.com/ftlabs/fastclick/issues) into your application. Consider carefully whether you really need to use it.*
+
+[Explication en français](http://maxime.sh/2013/02/supprimer-le-lag-des-clics-sur-mobile-avec-fastclick/).
+
+[日本語で説明](https://developer.mozilla.org/ja/docs/Mozilla/Firefox_OS/Apps/Tips_and_techniques#Make_events_immediate)。
+
+## Why does the delay exist? ##
+
+According to [Google](https://developers.google.com/mobile/articles/fast_buttons):
+
+> ...mobile browsers will wait approximately 300ms from the time that you tap the button to fire the click event. The reason for this is that the browser is waiting to see if you are actually performing a double tap.
+
+## Compatibility ##
+
+The library has been deployed as part of the [FT Web App](http://app.ft.com/) and is tried and tested on the following mobile browsers:
+
+* Mobile Safari on iOS 3 and upwards
+* Chrome on iOS 5 and upwards
+* Chrome on Android (ICS)
+* Opera Mobile 11.5 and upwards
+* Android Browser since Android 2
+* PlayBook OS 1 and upwards
+
+## When it isn't needed ##
+
+FastClick doesn't attach any listeners on desktop browsers.
+
+Chrome 32+ on Android with `width=device-width` in the [viewport meta tag](https://developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag) doesn't have a 300ms delay, therefore listeners aren't attached.
+
+```html
+<meta name="viewport" content="width=device-width, initial-scale=1">
+```
+
+Same goes for Chrome on Android (all versions) with `user-scalable=no` in the viewport meta tag. But be aware that `user-scalable=no` also disables pinch zooming, which may be an accessibility concern.
+
+For IE11+, you can use `touch-action: manipulation;` to disable double-tap-to-zoom on certain elements (like links and buttons).  For IE10 use `-ms-touch-action: manipulation`.
+
+## Usage ##
+
+Include fastclick.js in your JavaScript bundle or add it to your HTML page like this:
+
+```html
+<script type='application/javascript' src='/path/to/fastclick.js'></script>
+```
+
+The script must be loaded prior to instantiating FastClick on any element of the page.
+
+To instantiate FastClick on the `body`, which is the recommended method of use:
+
+```js
+if ('addEventListener' in document) {
+	document.addEventListener('DOMContentLoaded', function() {
+		FastClick.attach(document.body);
+	}, false);
+}
+```
+
+Or, if you're using jQuery:
+
+```js
+$(function() {
+	FastClick.attach(document.body);
+});
+```
+
+If you're using Browserify or another CommonJS-style module system, the `FastClick.attach` function will be returned when you call `require('fastclick')`. As a result, the easiest way to use FastClick with these loaders is as follows:
+
+```js
+var attachFastClick = require('fastclick');
+attachFastClick(document.body);
+```
+
+### Minified ###
+
+Run `make` to build a minified version of FastClick using the Closure Compiler REST API. The minified file is saved to `build/fastclick.min.js` or you can [download a pre-minified version](https://origami-build.ft.com/bundles/js?modules=fastclick).
+
+Note: the pre-minified version is built using [our build service](http://origami.ft.com/docs/developer-guide/build-service/) which exposes the `FastClick` object through `Origami.fastclick` and will have the Browserify/CommonJS API (see above).
+
+```js
+var attachFastClick = Origami.fastclick;
+attachFastClick(document.body);
+```
+
+### AMD ###
+
+FastClick has AMD (Asynchronous Module Definition) support. This allows it to be lazy-loaded with an AMD loader, such as [RequireJS](http://requirejs.org/). Note that when using the AMD style require, the full `FastClick` object will be returned, _not_ `FastClick.attach`
+
+```js
+var FastClick = require('fastclick');
+FastClick.attach(document.body, options);
+```
+
+### Package managers ###
+
+You can install FastClick using [Component](https://github.com/component/component), [npm](https://npmjs.org/package/fastclick) or [Bower](http://bower.io/).
+
+For Ruby, there's a third-party gem called [fastclick-rails](http://rubygems.org/gems/fastclick-rails). For .NET there's a [NuGet package](http://nuget.org/packages/FastClick).
+
+## Advanced ##
+
+### Ignore certain elements with `needsclick` ###
+
+Sometimes you need FastClick to ignore certain elements. You can do this easily by adding the `needsclick` class.
+```html
+<a class="needsclick">Ignored by FastClick</a>
+```
+
+#### Use case 1: non-synthetic click required ####
+
+Internally, FastClick uses `document.createEvent` to fire a synthetic `click` event as soon as `touchend` is fired by the browser. It then suppresses the additional `click` event created by the browser after that. In some cases, the non-synthetic `click` event created by the browser is required, as described in the [triggering focus example](http://ftlabs.github.com/fastclick/examples/focus.html).
+
+This is where the `needsclick` class comes in. Add the class to any element that requires a non-synthetic click.
+
+#### Use case 2: Twitter Bootstrap 2.2.2 dropdowns ####
+
+Another example of when to use the `needsclick` class is with dropdowns in Twitter Bootstrap 2.2.2. Bootstrap add its own `touchstart` listener for dropdowns, so you want to tell FastClick to ignore those. If you don't, touch devices will automatically close the dropdown as soon as it is clicked, because both FastClick and Bootstrap execute the synthetic click, one opens the dropdown, the second closes it immediately after.
+
+```html
+<a class="dropdown-toggle needsclick" data-toggle="dropdown">Dropdown</a>
+```
+
+## Examples ##
+
+FastClick is designed to cope with many different browser oddities. Here are some examples to illustrate this:
+
+* [basic use](http://ftlabs.github.com/fastclick/examples/layer.html) showing the increase in perceived responsiveness
+* [triggering focus](http://ftlabs.github.com/fastclick/examples/focus.html) on an input element from a `click` handler
+* [input element](http://ftlabs.github.com/fastclick/examples/input.html) which never receives clicks but gets fast focus
+
+## Tests ##
+
+There are no automated tests. The files in `tests/` are manual reduced test cases. We've had a think about how best to test these cases, but they tend to be very browser/device specific and sometimes subjective which means it's not so trivial to test.
+
+## Credits and collaboration ##
+
+FastClick is maintained by [Rowan Beentje](http://twitter.com/rowanbeentje), [Matthew Caruana Galizia](http://twitter.com/mcaruanagalizia) and [Matthew Andrews](http://twitter.com/andrewsmatt) at [FT Labs](http://labs.ft.com). All open source code released by FT Labs is licenced under the MIT licence. We welcome comments, feedback and suggestions.  Please feel free to raise an issue or pull request.

bower.json

+{
+  "name": "fastclick",
+  "license": "MIT",
+  "main": "lib/fastclick.js",
+  "ignore": [
+    "**/.*",
+    "component.json",
+    "package.json",
+    "Makefile",
+    "tests",
+    "examples"
+  ]
+}

component.json

+{
+	"name": "fastclick",
+	"repo": "ftlabs/fastclick",
+	"description": "Polyfill to remove click delays on browsers with touch UIs.",
+	"version": "1.0.3",
+	"main": "lib/fastclick.js",
+	"scripts": [
+		"lib/fastclick.js"
+	],
+	"ignore": [
+		"examples/",
+		"tests/"
+	],
+	"license": "MIT"
+}

examples/focus.html

+<!DOCTYPE html> 
+<html> 
+<head> 
+<meta name="viewport" content="width=device-width, initial-scale=1"> 
+<style type="text/css"> 
+	p, .test { font-family: sans-serif; }
+	.test { margin: 1em 4em; line-height: 4em; border: 1px solid black; font-size: 2em; text-align: center; }
+	input { height: 3em; width: 10em; margin: 1em auto; display: block; }
+
+	/* Disable certain interactions on touch devices */
+	body { -webkit-touch-callout: none; -webkit-text-size-adjust: none; -webkit-user-select: none; -webkit-highlight: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
+</style> 
+<script type="application/javascript" src="../lib/fastclick.js"></script> 
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		var textInput = document.querySelector('input');
+
+		FastClick.attach(document.body);
+		Array.prototype.forEach.call(document.getElementsByClassName('test'), function(testEl) {
+			testEl.addEventListener('click', function() {
+				textInput.focus();
+			}, false)
+		});
+	}, false);
+</script> 
+</head> 
+<body> 
+	<p>FastClick is instantiated on the body element, so all visible elements on this page will receive fast clicks - except one.</p> 
+	<p>The layers marked <var>A</var> and <var>B</var> both have <code>click</code> handlers that will attempt to trigger focus on the <code>input</code> element programatically. However, <strong>on iOS before version 5.0</strong>, touch event handlers are not allowed to trigger focus on other elements.</p> 
+	<p>On earlier versions of iOS, only <var>B</var> will succeed at triggering focus on the input element, because it has a <code>needsclick</code> class which will instruct FastClick not to trigger a programmatic click in the touch event handler and let the system click event go through instead.</p> 
+	<div>
+		<input type="text">
+		<div class="test">A</div> 
+		<div class="test needsclick">B</div> 
+	</div>
+</body> 
+</html>

examples/input.html

+<!DOCTYPE html> 
+<html> 
+<head> 
+<meta name="viewport" content="width=device-width, initial-scale=1"> 
+<style type="text/css"> 
+	p, label { font-family: sans-serif; }
+	.test { text-align: center; }
+	input[type=text] { height: 3em; width: 10em; }
+	label { display: block; background: gray; line-height: 2em; display: inline-block; font-weight: bold; }
+
+	/* Disable certain interactions on touch devices */
+	body { -webkit-touch-callout: none; -webkit-text-size-adjust: none; -webkit-user-select: none; -webkit-highlight: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
+</style> 
+<script type="application/javascript" src="../lib/fastclick.js"></script> 
+<script type="application/javascript">
+	window.addEventListener('load', function () {
+		FastClick.attach(document.body);
+	}, false);
+</script> 
+</head> 
+<body> 
+	<p>FastClick is instantiated on the body element, but the <code>input</code> element below will not receive fast clicks. Instead <code>focus()</code> will be called on the input element when <code>touchend</code> fires.</p>
+	<p>The keyboard will still appear after delay on iOS 4 or earlier, however.</p>
+	<div class="test">
+		<input type="text" id="tap-me" placeholder="Tap me">
+	</div>
+	<p>The same is true for the <code>select</code> element. It should open quickly on iOS > 4.</p>
+	<div class="test">
+		<select>
+			<option>Banana</option>
+			<option>Apple</option>
+		</select>
+	</div>
+	<p>The text below is a <code>label</code> for the text input element above. FastClick should automatically resolve the ID in the <code>for</code> attribute and trigger focus on the input element. This doesn't work on iOS 4, however (with or without FastClick).</p>
+	<label for="tap-me">I'm a label - tap me</label>
+	<p>Checkbox labels don't work on iOS 4, but with FastClick, they do!</p>
+	<input type="checkbox" id="check-me" /> <label for="check-me">I'm a label - tap me</label>
+</body> 
+</html>

examples/layer.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<style type="text/css">
+	p, .test { font-family: sans-serif; }
+	.test { margin: 1em auto; width: 6em; line-height: 4em; border: 1px solid black; font-size: 2em; text-align: center; }
+	.stats, .stats input { font-family: monospace; font-size: 0.9em; }
+	input { width: 10em; }
+
+	/* Disable certain interactions on touch devices */
+	body { -webkit-touch-callout: none; -webkit-text-size-adjust: none; -webkit-user-select: none; -webkit-highlight: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
+</style>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		var testA, testB, teTime, cTime;
+
+		testA = document.getElementById('test-a');
+		testB = document.getElementById('test-b');
+
+		// Android 2.2 needs FastClick to be instantiated before the other listeners so that the stopImmediatePropagation hack can work.
+		FastClick.attach(testB);
+
+		testA.addEventListener('touchend', function(event) {
+			teTime = Date.now();
+			document.getElementById('te-time').value = teTime;
+		}, false);
+
+		testA.addEventListener('click', function(event) {
+			cTime = Date.now();
+			document.getElementById('c-time').value = cTime;
+			document.getElementById('d-time').value = cTime - teTime;
+			testA.style.backgroundColor = testA.style.backgroundColor ? '' : 'YellowGreen';
+		}, false);
+
+		testB.addEventListener('touchend', function(event) {
+			teTime = Date.now();
+			document.getElementById('te-time').value = teTime;
+			document.getElementById('d-time').value = cTime - teTime;
+		}, false);
+
+		testB.addEventListener('click', function(event) {
+			cTime = Date.now();
+			document.getElementById('c-time').value = cTime;
+			testB.style.backgroundColor = testB.style.backgroundColor ? '' : 'YellowGreen';
+		}, false);
+	}, false);
+</script>
+</head>
+<body>
+	<p>Layer A responds to click events normally, which on iOS will introduce a 300ms delay.</p>
+	<p>Layer B is enhanced with FastClick, and will fire the click handler with no delay.</p>
+	<p>The layers will behave normally on platforms that don't support touch events.</p>
+	<p class="stats">Touch end time: <input id="te-time" value="0" /></p>
+	<p class="stats">Click event time: <input id="c-time" /></p>
+	<p class="stats">Difference: <input id="d-time" /></p>
+	<div>
+		<div class="test" id="test-a">A</div>
+		<div class="test" id="test-b">B</div>
+	</div>
+</body>
+</html>

package.json

+{
+  "name": "fastclick",
+  "version": "1.0.6",
+  "description": "Polyfill to remove click delays on browsers with touch UIs.",
+  "maintainers": [
+    {
+      "name": "Matthew Caruana Galizia",
+      "email": "m@m.cg",
+      "url": "http://m.cg/"
+    }
+  ],
+  "author": {
+    "name": "Rowan Beentje",
+    "email": "rowan.beentje@ft.com"
+  },
+  "contributors": [
+    {
+      "name": "Rowan Beentje",
+      "email": "rowan.beentje@ft.com"
+    },
+    {
+      "name": "Matthew Caruana Galizia",
+      "email": "m@m.cg"
+    }
+  ],
+  "main": "lib/fastclick.js",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/ftlabs/fastclick.git"
+  },
+  "keywords": [
+    "fastclick",
+    "mobile",
+    "touch",
+    "tap",
+    "click",
+    "delay"
+  ],
+  "licenses": [
+    {
+      "type": "MIT",
+      "url": "http://opensource.org/licenses/MIT"
+    }
+  ],
+  "implements": [
+    "CommonJS/Modules/1.0"
+  ],
+  "homepage": "https://github.com/ftlabs/fastclick"
+}

tests/10.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	textarea { width: 25em; height: 5em; }
+</style>
+<title>#10</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+		document.getElementById('select').addEventListener('focus', function(event) {
+			event.target.setSelectionRange(0, event.target.value.length);
+		}, false);
+	}, false);
+</script>
+</head>
+<body>
+	<textarea>FastClick is instantiated on the document body. Try and select the text in this textarea.</textarea>
+	<br><br>
+	<textarea id="select">The text in this textarea should be selected automatically when focussed.</textarea>
+	<p>Now try and select the text in this paragraph.</p>
+</body>
+</html>
\ No newline at end of file

tests/111.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=3">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	.test { font-size: 2em; border-radius: 0.4em; padding: 1em 1.5em; line-height: 2em; width: 1em; color: white; display: inline-block; }
+	#test1 { background: rgb(253, 109, 109); margin-right: 0.2em; }
+	#test2 { background: rgb(173, 255, 47); margin-left: 0.2em; }
+	#testcontainer { text-align: center; }
+</style>
+<title>#111</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		var test1 = document.getElementById('test1');
+
+		FastClick.attach(test1);
+		test1.addEventListener('click', function(event) {
+			if (event.forwardedTouchEvent) {
+				setTimeout(function() {
+					test1.style.webkitTransform = test1.style.webkitTransform ? '' : 'rotate(20deg)';
+				}, 0);
+			}
+		}, false);
+	}, false);
+</script>
+</head>
+<body>
+	<p>If you attempt a pinch zoom on iOS with both fingers on the same element, pinch zooming should work. If each finger is touching a different element, the pinch zooming should also work.</p>
+	<p>Only the red block below has FastClick enabled.</p>
+	<div id="testcontainer">
+		<div class="test" id="test1">&#9678;</div>
+		<div class="test" id="test2">&#9678;</div>
+	</div>
+</body>
+</html>

tests/160-reduced.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+</style>
+<title>#160</title>
+<script type="application/javascript">
+	function test(event) {
+		var selectionStart, selectionDirection, selectionEnd, target = event.target, out = '';
+
+		try {
+			selectionStart = target.selectionStart;
+			out += 'Success getting selectionStart: ' + selectionStart + '\n';
+		} catch (err) {
+			out += 'Error getting selectionStart: ' + err + '\n';
+		}
+
+		try {
+			selectionEnd = target.selectionEnd;
+			out += 'Success getting selectionEnd: ' + selectionEnd + '\n';
+		} catch (err) {
+			out += 'Error getting selectionEnd: ' + err + '\n';
+		}
+
+		try {
+			selectionDirection = target.selectionDirection;
+			out += 'Success getting selectionDirection: ' + selectionDirection + '\n';
+		} catch (err) {
+			out += 'Error getting selectionDirection: ' + err + '\n';
+		}
+
+		try {
+			target.setSelectionRange(0, 0);
+			out += 'Success setting setSelectionRange.\n';
+		} catch (err) {
+			out += 'Error setting selection range: ' + err + '\n';
+		}
+
+		alert(out);
+	}
+
+	window.addEventListener('load', function() {
+		Array.prototype.forEach.call(document.getElementsByClassName('test'), function(elem) {
+			elem.addEventListener('click', test, false);
+		});
+	}, false);
+</script>
+</head>
+<body>
+	<p>Calling elem.setSelectionRange on inputs with type date or time, as well as getting the selectionStart or selectionEnd properties, throws a TypeError.</p>
+	<p>Filed as Apple bug #15122724.</p>
+	<form>
+		<p>Test (date):</p>
+		<input type="date" class="test">
+		<p>Test (datetime):</p>
+		<input type="datetime" class="test">
+		<p>Test (month):</p>
+		<input type="month" class="test">
+		<p>Test (time):</p>
+		<input type="time" class="test">
+		<p>Control (text):</p>
+		<input class="test">
+	</form>
+</body>
+</html>

tests/160.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+</style>
+<title>#160</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		FastClick.attach(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<p>Calling elem.setSelectionRange on inputs with type date or time throws a TypeError.</p>
+	<p>Filed as Apple bug #15122724.</p>
+	<form>
+		<p>Test:</p>
+		<input type="date" name="test">
+		<p>Control:</p>
+		<input name="control">
+	</form>
+</body>
+</html>

tests/176.html

+
+<!DOCTYPE HTML>
+<html>
+<head>
+    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
+    <meta name="viewport" content="width=device-width,minimum-scale=1,maximum-scale=1,initial-scale=1,user-scalable=0">
+    <title>fastclick</title>
+    <script src="../lib/fastclick.js"></script>
+    <style>
+
+    .page
+    {
+        padding: 50px;
+        font-size: 20px;
+        font-family: monospace;
+
+        /* for clickable layer */
+        height: 500px;
+    }
+
+    .input
+    {
+        font-size: 20px;
+
+        width: 100%;
+        height: 30px;
+    }
+
+    .button
+    {
+        text-align: center;
+        color: white;
+
+        margin-bottom: 20px;
+        padding: 10px;
+
+        background: #4a4d51;
+    }
+
+    </style>
+</head>
+<body class="page">
+
+    <div class="button">first, dye to blue!</div>
+    <input class="input" placeholder="then – focus here" id="ok">
+
+    <script>
+        (function(doc) {
+
+            function paint(color) {
+                doc.querySelector('.page').style.background = color;
+            };
+
+            function dye(e) { e.stopPropagation(); paint('#333'); }
+            function clean(e) { e.stopPropagation(); paint('#fff'); }
+
+            doc.querySelector('.button').addEventListener('click', dye);
+            doc.addEventListener('click', clean);
+
+            // fastclick initialization
+            FastClick.attach(doc.body);
+
+        })(document);
+    </script>
+</body>
+</html>
+

tests/18.html

+<!DOCTYPE html> 
+<html> 
+<head> 
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
+<style type="text/css"> 
+	p, label { font-family: sans-serif; }
+	.test { text-align: center; }
+	input[type=text] { height: 3em; width: 10em; }
+	label { display: block; background: gray; line-height: 2em; display: inline-block; font-weight: bold; }
+
+	/* Disable certain interactions on touch devices */
+	body { -webkit-touch-callout: none; -webkit-text-size-adjust: none; -webkit-user-select: none; -webkit-highlight: none; -webkit-tap-highlight-color: rgba(0,0,0,0); }
+</style> 
+<script type="application/javascript" src="../lib/fastclick.js"></script> 
+<script type="application/javascript">
+	window.addEventListener('load', function () {
+		new FastClick(document.body);
+		document.getElementsByTagName('form')[0].addEventListener('submit', function(event) {
+			event.preventDefault();
+			console.log('Submit caught');
+		}, false);
+	}, false);
+</script> 
+</head> 
+<body>
+	<p>On focusing on the input text element, hitting go in the device keyboard should submit the form. The actual submission will be prevented and instead 'Submit caught' will appear in the console.</p>
+	<div class="test">
+		<form action="http://google.com/search" method="GET">
+			<input type="text" id="query" name="q" placeholder="Tap me">
+			<input type="submit" value="Submit">
+		</form>
+	</div>
+</body> 
+</html>

tests/22.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	textarea { width: 25em; height: 10em; }
+</style>
+<title>#22</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<textarea>FastClick is instantiated on the document body. Tap this textarea to gain focus.</textarea>
+	<p>On Android 4, single pressing the textarea should produce a cursor. Long-pressing a word should bring up the double arrow indicator for selection. It should be possible to move the indicators.</p>
+	<p>Tapping on a word with a squiggly red underline should bring up the spelling suggestion box.</p>
+</body>
+</html>
\ No newline at end of file

tests/226.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	textarea { width: 25em; height: 5em; }
+</style>
+<title>#226</title>
+<script type="application/javascript">
+  document.body.addEventListener('touchend', function(event) {
+    console.log('touchend event caught and default prevented', event.target);
+    event.target.focus();
+    event.preventDefault();
+  });
+</script>
+</head>
+<body>
+The follow select can be opened with VoiceOver off, but with VoiceOver on it will not open.
+<select id="sel">
+  <option>First</option>
+  <option>Second</option>
+</select>
+</body>
+</html>

tests/23-reduced.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	input, code { font-family: monospace; }
+</style>
+<title>#23</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+
+	// This function is for sending a touch event to the button programatically
+	var sendTouchEnd = function() {
+		var event, button;
+
+		button = document.getElementById('alert-on-click');
+
+		event = document.createEvent('UIEvent');
+		event.initUIEvent('touchend', true, true);
+		event.changedTouches = [{
+			screenX: button.offsetLeft,
+			screenY: button.offsetTop,
+			clientX: button.offsetLeft,
+			clientY: button.offsetTop
+		}];
+
+		button.dispatchEvent(event);
+	};
+
+	window.addEventListener('load', function() {
+		var i = 0;
+
+		var log = function(event) {
+			console.log(event.type, event);
+		};
+
+		document.body.addEventListener('touchend', function(event) {
+			var clickEvent, touch = event.changedTouches[0];
+
+			log(event);
+
+			// Synthesise a click event, with an extra attribute so it can be tracked
+			clickEvent = document.createEvent('MouseEvents');
+			clickEvent.initMouseEvent('click', true, true, window, 1, touch.screenX, touch.screenY, touch.clientX, touch.clientY, false, false, false, false, 0, null);
+			clickEvent.synthesized = true;
+			event.target.dispatchEvent(clickEvent);
+		}, false);
+
+		document.getElementById('alert-on-click').addEventListener('click', function(event) {
+			i++;
+			alert('Alert #' + i + ', on element with ID \'' + event.target.id + '\'.');
+		}, false);
+	}, false);
+</script>
+</head>
+<body>
+	<p>At the start of this test, <code>i = 0</code>. Tapping the first button will increment <code>i</code> and trigger an alert with the text <code>'Alert #' + i</code>.</p>
+	<p>Tapping on the second button should have absolutely no effect, but in iOS6 it will re-trigger the alert.</p>
+	<input type="button" id="alert-on-click" value="Button #1">
+	<br><br>
+	<input type="button" id="no-alert-on-click" value="Button #2">
+</body>
+</html>
\ No newline at end of file

tests/23.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	input, code { font-family: monospace; }
+</style>
+<title>#23</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		var i = 0, fastClick;
+
+		fastClick = new FastClick(document.body);
+		document.getElementById('alert-on-click').addEventListener('click', function(event) {
+			i++;
+			alert('Alert #' + i + ', on element with ID \'' + event.target.id + '\'.');
+		}, false);
+	}, false);
+</script>
+</head>
+<body>
+	<p>At the start of this test, <code>i = 0</code>. Tapping the first button will increment <code>i</code> and trigger an alert with the text <code>'Alert #' + i</code>.</p>
+	<p>Tapping on the second button should have absolutely no effect, but in iOS 4-6 it will re-trigger the alert.</p>
+	<input type="button" id="alert-on-click" value="Button #1">
+	<br><br>
+	<input type="button" id="no-alert-on-click" value="Button #2">
+</body>
+</html>
\ No newline at end of file

tests/24.html

+<!DOCTYPE html>
+<html>
+<head>
+<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
+<script src="../lib/fastclick.js"></script>
+<style type="text/css"> 
+	p, label { font-family: sans-serif; }
+	input[type=text] { height: 3em; width: 10em; }
+	label { display: block; background: gray; margin-left: 2em; line-height: 2em; display: inline-block; font-weight: bold; }
+</style> 
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta name="apple-mobile-web-app-capable" content="yes">
+<meta name="format-detection" content="telephone=no">
+<script>
+$(function() {
+	$('#test-me').focus();
+	new FastClick(document.body);
+});
+
+/*
+window.addEventListener('load', function() {
+	document.getElementById('test-me').focus();
+	new FastClick(document.body);
+}, false);
+*/
+</script>
+<title>#24</title>
+</head>
+<body>
+	<form action='fake'>
+		<input id="test-me" name="text" />
+		<div style='padding: 50px 0'>
+			<input type="radio" name="radio" id="x" checked />
+			<label for="x">This Is X</label>
+			<br>
+			<input type="radio" name="radio" id="y" />
+			<label for="y">This Is Y</label>
+		</div>
+	</form>
+</body>
+</html>

tests/26.html

+<!DOCTYPE html>
+<html>
+<head>
+	<script src="../lib/fastclick.js"></script>
+	<style type="text/css"> 
+		p { font-family: sans-serif; }
+		.test { background: pink; }
+	</style> 
+	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+	<meta name="apple-mobile-web-app-capable" content="yes">
+	<script>
+		var f;
+
+		function create() {
+			f = new FastClick(document.body);
+		}
+
+		function destroy() {
+			if (f) {
+				f.destroy();
+			}
+		}
+
+		function add() {
+			document.getElementById('test-area').insertAdjacentHTML('beforeend', '<p class="test">Click me</p>');
+		}
+
+		window.addEventListener('load', function() {
+			document.body.addEventListener('click', function(event) {
+				var clicksEl = document.getElementById('clicks');
+				clicks.value = parseInt(clicks.value, 10) + 1;
+
+				if (event.target.classList.contains('test')) {
+					event.target.style.backgroundColor = event.target.style.backgroundColor ? '' : 'YellowGreen';
+				}
+			}, false);
+
+			document.getElementById('create').addEventListener('click', create, false);
+			document.getElementById('destroy').addEventListener('click', destroy, false);
+			document.getElementById('add').addEventListener('click', add, false);
+		}, false);
+	</script>
+	<title>#26</title>
+</head>
+<body>
+	<input type="button" id="create" value="Create new FastClick instance" /><br />
+	<input type="button" id="destroy" value="Destroy last FastClick instance" /><br />
+	<hr />
+	<p>Clicks: <input type="text" id="clicks" value="0" /></p>
+	<hr />
+	<input type="button" id="add" value="Add element" />
+	<hr />
+	<div id="test-area"></div>
+</body>
+</html>

tests/27.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+    .page { position: absolute; width: 200px; height: 150px; background-color:#eee; }
+    .page.next { background-color:#ccc; }
+    #btn { background-color:#ff00ff; }
+    #text {width: 100%; padding: 0; margin: 0; border: none; font-size: 22px; }
+    .animate { -webkit-transition: all .3s ease-out; }
+</style>
+<title>#27</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
+<script type="application/javascript">
+$(window).load(function() {
+	$(function() {
+		new FastClick(document.body);
+
+		$nextpage = $('.page.next');
+		$nextpage.css('-webkit-transform', 'translate(200px, 0) translateZ(0)');
+
+		$('#btn').click(function(e){
+			$('.page.next').addClass('animate').css('-webkit-transform', 'translate(0, 0) translateZ(0)');
+		});
+	});
+});
+</script>
+</head>
+<body>
+	<p>Clicking or tapping the <code>div</code> that says 'click me' should <em>not</em> trigger focus on the adjacent <code>input</code> element as or after it slides in.</p>
+	<div class="pages">
+		<div class="page">
+			<div id="btn">Click Me</div>
+		</div>
+		<div class="next page">
+			<input id="text" type="text" value="textbox 1">
+			<input id="text" type="text" value="textbox 2">
+		</div>
+	</div>
+</body>
+</html>
\ No newline at end of file

tests/30.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p, label { font-family: sans-serif; }
+	label { display: inline-block; background: silver; padding: 0 1em; line-height: 2em; }
+	.test { margin: 2em 0; }
+</style>
+<title>#30</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<p>FastClick is instantiated on the document body. Tap a label for the associated input control to gain focus. Focus should be equally fast in all tests.</p>
+	<div class="test">
+		<label><input type="text"> Descendant association</label>
+	</div>
+	<div class="test">
+		<input type="text" id="test-text"> <label for="test-text">Attribute association</label>
+	</div>
+	<div class="test">
+		<label><input type="checkbox"> Descendant association</label>
+	</div>
+	<div class="test">
+		<input type="checkbox" id="test-checkbox"> <label for="test-checkbox">Attribute association</label>
+	</div>
+</body>
+</html>
\ No newline at end of file

tests/32.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	textarea { width: 25em; height: 15em; }
+</style>
+<title>#32</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+		Array.prototype.forEach.call(document.getElementsByClassName('button'), function(button) {
+			button.addEventListener('click', function(event) {
+				console.log(event.target.nodeName + ' was tapped (forwarded: ' + (event.forwardedTouchEvent ? 'yes' : 'no') + ')');
+			}, false);
+		});
+	}, false);
+</script>
+</head>
+<body>
+<div class="appt-search-form no-height">
+	<div class="fancy">
+		<input type="hidden" class="apptPatient" name="patient" value="5004" data-shadow="false">
+		<div class="ui-hide-label">
+			<label for="apptType" class="ui-select">Appointment Type</label>
+			<div class="ui-select">
+				<div data-corners="true" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="th-list" data-iconpos="right" data-theme="a" class="ui-btn ui-btn-corner-all ui-btn-icon-right ui-btn-up-a">
+					<span class="ui-btn-inner ui-btn-corner-all">
+						<span class="ui-btn-text">
+							<span class="apptType">Appointment Type *</span>
+						</span>
+						<span class="ui-icon ui-icon-th-list ui-icon-shadow">&nbsp;</span>
+					</span>
+					<select class="apptType" name="apptType" id="apptType" data-shadow="false" data-icon="th-list">
+						<option value="-1" data-placeholder="true">Appointment Type</option>
+						<option value="5000">Sick Visit</option>
+						<option value="5509">9 months Well Visit</option>
+						<option value="5512">1 year Well Visit</option>
+						<option value="5515">15 months Well Visit</option>
+						<option value="5518">18 months Well Visit</option>
+					</select>
+				</div>
+			</div>
+			<label for="apptCalendar" class="ui-select">Physician</label>
+			<div class="ui-select">
+				<div data-corners="true" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="user-md" data-iconpos="right" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-corner-all ui-btn-icon-right">
+					<span class="ui-btn-inner ui-btn-corner-all">
+						<span class="ui-btn-text">
+							<span class="apptCalendar">Physician</span>
+						</span>
+						<span class="ui-icon ui-icon-user-md ui-icon-shadow">&nbsp;</span>
+					</span>
+					<select class="apptCalendar" id="apptCalendar" data-shadow="false" data-icon="user-md">
+						<option value="-1" data-placeholder="true">Physician</option>
+						<option value="-1">Any</option>
+						<option value="5000">Dr. Jim</option>
+						<option value="5001">Dr. Wixler</option>
+						<option value="5002">Anya</option>
+						<option value="5003">Jada</option>
+					</select>
+				</div>
+			</div>
+			<label for="dateAfter" class="ui-input-text">Date</label>
+			<input class="dateAfter ui-input-text ui-body-a ui-corner-all ui-shadow-inset" id="dateAfter" type="date" data-icon="calendar">
+			<label for="apptTimeWindow" class="ui-select">Time of Day</label>
+			<div class="ui-select">
+				<div data-corners="true" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="time" data-iconpos="right" data-theme="a" class="ui-btn ui-btn-up-a ui-btn-corner-all ui-btn-icon-right">
+					<span class="ui-btn-inner ui-btn-corner-all">
+						<span class="ui-btn-text">
+							<span class="apptTimeWindow">Time of Day</span>
+						</span>
+						<span class="ui-icon ui-icon-time ui-icon-shadow">&nbsp;</span>
+					</span>
+					<select class="apptTimeWindow" id="apptTimeWindow" data-shadow="false" data-icon="time">
+						<option value="0" data-placeholder="true">Time of Day</option>
+						<option value="0">Any</option>
+						<option value="1">Morning</option>
+						<option value="2">Afternoon</option>
+						<option value="3">Evening</option>
+					</select>
+				</div>
+			</div>
+		</div>
+	</div>
+	<span class="search btn-success">
+		<div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="null" data-iconpos="null" data-theme="a" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-up-a" aria-disabled="false">
+			<span class="ui-btn-inner ui-btn-corner-all">
+				<span class="ui-btn-text">Find Appointments</span>
+			</span>
+			<button class="btn-success ui-btn-hidden" aria-disabled="false">Find Appointments</button>
+		</div>
+	</span>
+</div>
+</body>
+</html>
\ No newline at end of file

tests/36.html

+<!DOCTYPE html>
+<html>
+	<head>
+		<title>#36</title>
+		<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
+		<meta content="yes" name="apple-mobile-web-app-capable" />
+		<meta content="telephone=no" name="format-detection" />
+		<style type="text/css">
+			p { font-family: sans-serif; }
+			input { height: 30px; }
+			p, input { margin: 0; padding: 0; }
+		</style>
+		<script src="../lib/fastclick.js" type="application/javascript"></script>
+		<script type="application/javascript">
+			window.addEventListener('load', function() {
+				new FastClick(document.body);
+			}, false);
+		</script>
+	</head>
+	<body>
+		<p>A tap and long hold, then release on input #1 will sometimes trigger focus on #2.</p>
+		<hr />
+		<form>
+			<p><input placeholder="1" name="i1" /></p>
+			<p><input placeholder="2" name="i2" /></p>
+			<p><input placeholder="3" name="i3" /></p>
+			<p><input placeholder="4" name="i4" /></p>
+			<p><input placeholder="5" name="i5" /></p>
+		</form>
+	</body>
+</html>

tests/37-reduced.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+</style>
+<title>#37-reduced</title>
+<script>
+	window.addEventListener('load', function() {
+		document.getElementById('frame').contentDocument.body.innerHTML = '<input type="text" id="text" ontouchend="this.focus();" />';
+	}, false);
+</script>
+</head>
+<body>
+	<p>On tapping the text input in the iframe and enter text, the entered text will not appear until the text input is tapped again. After that, tapping the text input a third time while it is still focus it will seem to disable text entry completely.</p>
+	<iframe id="frame"></iframe>
+</body>
+</html>
\ No newline at end of file

tests/37a.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<meta name="robots" content="NOINDEX, NOFOLLOW">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	* { box-sizing: border-box; }
+	*:focus { border: 5px solid blue; }
+</style>
+<title>#37</title>
+
+</head>
+<body>
+	<p>On touching/clicking the input field within the iframe, you should be able to input text normally.</p>
+	<iframe src="37b.html"></iframe>
+</body>
+</html>

tests/37b.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<meta name="robots" content="NOINDEX, NOFOLLOW">
+<meta http-equiv="cache-control" content="max-age=0" />
+<meta http-equiv="cache-control" content="no-cache" />
+<meta http-equiv="expires" content="0" />
+<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
+<meta http-equiv="pragma" content="no-cache" />
+<style type="text/css">
+	p { font-family: sans-serif; }
+	* { box-sizing: border-box; }
+	*:focus { border: 5px solid red; }
+</style>
+<title>IFrame Page</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<input type="text" id="mytext" name="mytext" />
+</body>
+</html>

tests/42.html

+<!doctype html>
+<html>
+<head>
+<title>#42</title>
+<meta charset='utf-8' />
+
+<meta name="viewport" content="initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
+<meta name='apple-mobile-web-app-capable' content='yes' />
+<!--
+	MUST be viewed on an iOS 5+ device
+
+
+	This is a layout for iOS 5+.
+	The basic idea is to have a navigation bar that always pins to the top.
+	The lower part is a scrollable content wrapper (with momemtum scrolling).
+
+
+	Here, we apply FastClick to the content wrapper.
+	Now when you scroll the content really fast, and click the link before the scrolling stops.
+	Chances are what you have clicked is not what see under your finger, but rather the link which lay at that position sometime during your scroll.
+
+-->
+<style>
+#everything {
+	position: absolute;
+	display: -webkit-box;
+	-webkit-box-orient: vertical;
+	height: 100%;
+}
+#content {
+	-webkit-box-flex: 1;
+}
+#content {
+	overflow: scroll;
+	position: relative;
+	-webkit-overflow-scrolling: touch;
+}
+#content > * {
+	-webkit-transform: translate3d(0,0,0);
+}
+a {
+	display: block;
+	background: #aaa;
+	padding: 10px 0;
+	margin: 5px 0;
+	height: 200px;
+	font-size: 22px;
+	line-height: 200px;
+	vertical-align: center;
+	text-align: center;
+}
+#everything {
+	width: 100%;
+	margin: 0 auto;
+}
+#content {
+	width: 100%;
+}
+</style>
+
+<script src="../lib/fastclick.js"></script>
+<script>
+	window.addEventListener('load', function() {
+		new FastClick(document.getElementById('content'))
+		
+		document.addEventListener('touchstart', function(event) {
+			console.log('start @ ' + event.pageY);
+		}, false);
+
+		document.addEventListener('touchmove', function(event) {
+			console.log('move @ ' + event.pageY);
+		}, false);
+
+		document.addEventListener('touchend', function(event) {
+			console.log('end @ ' + event.pageY);
+		}, false);
+
+		document.addEventListener('click', function(event) {
+			if (event.target.tagName.toLowerCase() === 'a') {
+				console.log('clicked ' + event.target.textContent);
+			}
+		}, false);
+
+	}, false);
+</script>
+</head>
+<body>
+<div id="everything">
+	<div id="content" class="ios5">
+		<a>1</a>
+		<a>2</a>
+		<a>3</a>
+		<a>4</a>
+		<a>5</a>
+		<a>6</a>
+		<a>7</a>
+		<a>8</a>
+		<a>9</a>
+		<a>10</a>
+		<a>11</a>
+		<a>12</a>
+		<a>13</a>
+		<a>14</a>
+		<a>15</a>
+		<a>16</a>
+		<a>17</a>
+		<a>18</a>
+		<a>19</a>
+		<a>20</a>
+		<a>21</a>
+		<a>22</a>
+		<a>23</a>
+		<a>24</a>
+		<a>25</a>
+		<a>26</a>
+		<a>27</a>
+		<a>28</a>
+		<a>29</a>
+		<a>30</a>
+		<a>31</a>
+		<a>32</a>
+		<a>33</a>
+		<a>34</a>
+		<a>35</a>
+		<a>36</a>
+		<a>37</a>
+		<a>38</a>
+		<a>39</a>
+		<a>40</a>
+		<a>41</a>
+		<a>42</a>
+		<a>43</a>
+		<a>44</a>
+		<a>45</a>
+		<a>46</a>
+		<a>47</a>
+		<a>48</a>
+		<a>49</a>
+		<a>50</a>
+		<a>51</a>
+		<a>52</a>
+		<a>53</a>
+		<a>54</a>
+		<a>55</a>
+		<a>56</a>
+		<a>57</a>
+		<a>58</a>
+		<a>59</a>
+		<a>60</a>
+		<a>61</a>
+		<a>62</a>
+		<a>63</a>
+		<a>64</a>
+		<a>65</a>
+		<a>66</a>
+		<a>67</a>
+		<a>68</a>
+		<a>69</a>
+		<a>70</a>
+		<a>71</a>
+		<a>72</a>
+		<a>73</a>
+		<a>74</a>
+		<a>75</a>
+		<a>76</a>
+		<a>77</a>
+		<a>78</a>
+		<a>79</a>
+		<a>80</a>
+		<a>81</a>
+		<a>82</a>
+		<a>83</a>
+		<a>84</a>
+		<a>85</a>
+		<a>86</a>
+		<a>87</a>
+		<a>88</a>
+		<a>89</a>
+		<a>90</a>
+		<a>91</a>
+		<a>92</a>
+		<a>93</a>
+		<a>94</a>
+		<a>95</a>
+		<a>96</a>
+		<a>97</a>
+		<a>98</a>
+		<a>99</a>
+		<a>100</a>
+	</div>
+</body>
+</html>
\ No newline at end of file

tests/44.html

+<!DOCTYPE html>
+<html>
+	<head>
+		<title>#36</title>
+		<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
+		<meta content="yes" name="apple-mobile-web-app-capable" />
+		<meta content="telephone=no" name="format-detection" />
+		<style type="text/css">
+			p { font-family: sans-serif; }
+			input { height: 30px; }
+			p, input { margin: 0; padding: 0; }
+			#map {width: 450px; height: 400px; }
+		</style>
+		<script src="http://maps.google.com/maps/api/js?sensor=false&.js" type="application/javascript"></script>
+		<script src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.9/src/infobox.js" type="application/javascript"></script>
+		<script src="../lib/fastclick.js" type="application/javascript"></script>
+		<script type="application/javascript">
+			window.addEventListener('load', function() {
+				   new FastClick(document.body);
+			
+				   var map;
+				   var elevator;
+				   var myOptions = {
+					   zoom: 6,
+					   center: new google.maps.LatLng(46.87916, -3.32910),
+					   mapTypeId: 'terrain'
+				   };
+				   map = new google.maps.Map(document.getElementById('map'), myOptions);
+				   var markers = [];
+				   
+				   // Add a listener for idle event and call getElevation on a random set of marker in the bound
+				   google.maps.event.addListener(map, 'idle', function()
+				   {
+					   var marker = new google.maps.Marker({
+						 position: new google.maps.LatLng(46.87916, -3.32910),
+						 map: map,
+						 title:"Hello World!"
+					   });
+					   
+					   var infowindow = new InfoBox({
+						   content: "Touch me on your iDevice"
+					   });
+					   
+					   google.maps.event.addListener(marker, 'click', function() {
+						 infowindow.open(map,marker);
+					   });
+				   });
+			}, false);
+		</script>
+	</head>
+	<body>
+		<p>Tap the map marker.</p>
+		<hr />
+		<div id="map"></div>
+	</body>
+</html>

tests/45.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="robots" content="NOINDEX, NOFOLLOW">
+<meta name="viewport">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	body { margin: 10em; }
+</style>
+<title>#45</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		//new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum at bibendum urna. Sed pellentesque felis eget massa luctus convallis. Duis posuere imperdiet velit, a vulputate elit pulvinar nec. Quisque eleifend sollicitudin quam, ac sodales turpis tincidunt sed. Donec ac hendrerit dui. Vestibulum vel tortor purus, a tempus purus. Nam dictum urna a lectus dapibus porttitor. <a href="#">Integer lobortis</a>, massa sit amet consequat rhoncus, purus justo lacinia ante, vitae suscipit lectus dui eu augue. Nulla ut imperdiet arcu. Morbi sapien dui, condimentum sed iaculis eu, accumsan pellentesque risus. Ut interdum mollis feugiat.</p>
+
+	<p>Nullam aliquet adipiscing sagittis. Duis adipiscing pellentesque semper. Maecenas sollicitudin porttitor ipsum, ac blandit sapien tristique eget. Donec sit amet nulla elit. In hac habitasse platea dictumst. Duis cursus mollis nulla, a sagittis lectus convallis vitae. Suspendisse vestibulum arcu sem. Ut eleifend nisi ac sapien iaculis sed tempor felis accumsan. Integer quis sapien massa, sed ullamcorper mi.</p>
+
+	<p>Aenean rutrum vehicula lobortis. Maecenas eleifend, augue quis elementum tincidunt, metus eros pulvinar odio, eget faucibus erat magna lacinia sapien. Pellentesque ullamcorper dolor ut <a href="#">ipsum fringilla</a> cursus. Integer gravida augue ac elit placerat hendrerit. Sed eget nisl justo, nec bibendum nunc. Aenean non nunc felis. Nullam semper, felis at venenatis bibendum, justo mauris laoreet ipsum, at tristique risus dui id eros. Aliquam erat volutpat.</p>
+
+	<p>Aliquam nunc enim, cursus id malesuada sed, vestibulum quis libero. Vivamus accumsan lacus sit amet libero tempor laoreet. Donec convallis, enim ac mattis luctus, nunc dolor rutrum neque, non auctor sem est nec lorem. Cras bibendum dui nec ante semper fermentum. Sed sollicitudin porttitor lorem vitae fermentum. Morbi vitae massa et diam gravida consequat. Nulla semper, leo vitae pharetra commodo, justo eros luctus velit, eget molestie neque mi nec turpis.</p>
+
+	<p>Fusce urna orci, molestie vitae blandit et, pellentesque in ante. Etiam mattis ultricies ligula, et scelerisque diam venenatis id. In dignissim molestie interdum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vehicula eros non tortor tristique non euismod urna laoreet. Curabitur mauris tellus, dapibus non blandit a, ultrices vitae purus. Morbi at diam lectus. Donec et purus a diam rutrum aliquam nec ac dolor. Donec quis dolor molestie quam lacinia mattis. Sed euismod condimentum quam sit amet accumsan.</p>
+
+	<p>Etiam accumsan ipsum vel nulla vulputate eleifend. Nullam vestibulum pulvinar consectetur. Aliquam erat volutpat. Curabitur nunc nisl, ultrices posuere accumsan sed, bibendum a nulla. Donec ac justo vitae orci fermentum euismod. Sed elit risus, <a href="#">rhoncus</a> et egestas vitae, feugiat eu sapien. Nam tempus, dolor quis venenatis pellentesque, lacus quam fringilla enim, non tristique dolor nulla vel eros. Quisque luctus, dolor id consectetur pharetra, mauris leo congue felis, at vehicula augue lacus id quam. Donec euismod laoreet hendrerit.</p>
+</body>
+</html>
\ No newline at end of file

tests/48.html

+<!DOCTYPE html>
+<html ng-app="strap">
+	<head>
+		<title>#48</title>
+		<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
+		<meta content="yes" name="apple-mobile-web-app-capable" />
+		<meta content="telephone=no" name="format-detection" />
+		<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/css/bootstrap.min.css" rel="stylesheet">
+		<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/css/bootstrap-responsive.min.css" rel="stylesheet">
+		<style type="text/css">
+			body { margin: 2em; }
+			p { font-family: sans-serif; }
+			input { height: 30px; }
+
+			.container { position: absolute; }
+		</style>
+		<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
+		<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.2.2/bootstrap.min.js"></script>
+		<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
+		<script src="https://raw.github.com/mgcrea/angular-strap/master/dist/angular-strap.min.js"></script>
+		<script src="../lib/fastclick.js"></script>
+		<script>
+			var app = angular.module('strap', ['$strap.directives']);
+
+			app.controller('StrapCtrl', function($scope) {
+				$scope.dropdown = [
+					{text: 'Another action', href: '#anotherAction'},
+					{text: 'Something else here', href: '#', click: 'modal.saved=true'},
+					{divider: true},
+					{text: 'Separated link', href: '#', submenu: [
+							{text: 'Second level link', href: '#'},
+							{text: 'Second level link 2', href: '#'}
+						]
+					}
+				];
+			});
+
+			window.addEventListener('load', function() {
+				new FastClick(document);
+			}, false);
+		</script>
+	</head>
+	<body>
+		<p>The dropdown should stay open after tapping the button once.</p>
+		<hr>
+		<div class="container" ng-controller="StrapCtrl">
+
+			<!-- Button to trigger dropdown -->
+			<button type="button" class="btn" bs-dropdown="dropdown">Dropdown</button>
+		</div>
+	</body>
+</html>

tests/51-reduced.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+</style>
+<title>#51-reduced</title>
+<script>
+	document.addEventListener('touchstart', function() {}, false);
+	window.addEventListener('load', function() {
+		document.getElementById('frame').contentDocument.body.innerHTML = '<input type="text" />';
+	}, false);
+</script>
+</head>
+<body>
+	<p>Tap the input twice in succession and try to type.</p>
+	<iframe id="frame"></iframe>
+</div>
+</body>
+</html>
\ No newline at end of file

tests/6.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	textarea { width: 25em; height: 15em; }
+</style>
+<title>#6</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+		Array.prototype.forEach.call(document.getElementsByClassName('button'), function(button) {
+			button.addEventListener('click', function(event) {
+				console.log(event.target.nodeName + ' was tapped (forwarded: ' + (event.forwardedTouchEvent ? 'yes' : 'no') + ')');
+			}, false);
+		});
+	}, false);
+</script>
+</head>
+<body>
+	<textarea>FastClick is instantiated on the document body. Tap this textarea to gain focus.</textarea>
+	<p>Open the browser console to see debug info.</p>
+	<input type="button" class="button" value="Now tap this <input> button">
+	<br><br>
+	<button class="button">Now tap this &lt;button&gt; button</button>
+</body>
+</html>
\ No newline at end of file

tests/60.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p, label { font-family: sans-serif; }
+	label > a { display: inline-block; background: silver; padding: 0 1em; line-height: 2em; pointer-events: none; }
+	.test { margin: 2em 0; }
+</style>
+<title>#60</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<p>FastClick is instantiated on the document body. A <code>label</code> element is wrapped around an anchor element. Tapping the anchor element should cause the label's the associated input control to gain focus.</p>
+	<p>This works because the CSS rule <code>label > a { pointer-events: none; }</code> is being used.</p>
+	<div class="test">
+		<input type="text" id="test-input"> <label for="test-input"><a href="#">Tap here</a></label>
+	</div>
+</body>
+</html>
\ No newline at end of file

tests/62.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p, label { font-family: sans-serif; }
+</style>
+<title>#62</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<p>Tapping a disabled checkbox should not change its value.</p>
+	<input type="checkbox" id="cb" disabled>
+	<label for="cb">Label for a disabled checkbox</label>
+</body>
+</html>
\ No newline at end of file

tests/68.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p { font-family: sans-serif; }
+	input { display: inline; }
+</style>
+<title>#68</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<p>On iOS, tapping either of the inputs should open the media selection dialog normally.</p>
+	<hr>
+	<input type="file" multiple="true">
+	<input type="file">
+</body>
+</html>
\ No newline at end of file

tests/6b.html

+<!DOCTYPE html>
+<html>
+<head>
+	<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
+	<script type="application/javascript" src="../lib/fastclick.js"></script>
+	<meta charset=utf-8 />
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<meta name="apple-mobile-web-app-capable" content="yes">
+	<meta name="format-detection" content="telephone=no">
+	<style type="text/css">
+		body {
+			font-size: 16px;
+		}
+
+		#form {
+			width: 400px;
+			border: 1px solid black;
+			border-radius: 14px;
+			padding: 20px;
+			box-sizing: border-box;
+		}
+
+		#form textarea {
+			width: 200px;
+			height: 100px;
+		}
+
+		#form .buttons {
+			margin-top: 20px;
+			text-align: right;
+		}
+	</style>
+	<title>#6b</title>
+	<script type="application/javascript">
+		$(function() {
+			var clicks = 0;
+			$('body').on('click', 'button', function() {
+				$('#report').text("click " + (++clicks));
+			});
+
+			new FastClick(document.body);
+		});
+	</script>
+</head>
+<body>
+	<p>This test case is designed for Chrome on Android 4.1 on the Nexus 7.</p>
+	<p>Tap the <code>textarea</code> so that it gains focus. The browser should zoom the page. Once that happens the coordinates for every tap will be off until the page is zoomed back to the normal level.</p>
+	<div id="form">
+		<div id="report">&nbsp;</div>
+		<textarea></textarea>
+		<div class="buttons">
+			<button>Hello World</button>
+		</div>
+		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sed mauris in nisi dignissim ultricies sit amet id sapien. Curabitur venenatis, justo sed iaculis molestie, velit nisl consectetur metus, at vulputate nulla nisl et urna. Ut et urna a mauris malesuada mollis non vel ante. Nulla volutpat tellus sed elit varius ultricies. Nam euismod pellentesque felis sed adipiscing. Morbi ultricies risus a diam blandit a tincidunt tellus rhoncus. Cras facilisis pulvinar ante vitae pretium. Ut non orci sem. Integer fringilla est in tortor consectetur porta. Mauris ullamcorper neque sed arcu ultrices accumsan. Morbi condimentum metus eu sem volutpat auctor. Nam posuere fermentum est sed aliquet. Maecenas mauris mauris, auctor hendrerit pellentesque eget, fringilla et nibh. Pellentesque euismod urna sed eros feugiat egestas. Pellentesque volutpat viverra sapien, in tincidunt ipsum tempor pharetra. Suspendisse fermentum posuere luctus.</p>
+		<p>Duis sed accumsan est. Etiam augue odio, vulputate a sollicitudin et, ornare ultricies massa. Nullam non lectus velit. Morbi consectetur pretium elit sed mollis. Sed id sem risus, vitae dapibus diam. Proin arcu metus, interdum nec pulvinar sed, auctor nec turpis. Aenean tempus, turpis sit amet pulvinar dapibus, erat arcu ornare enim, sit amet ornare lacus enim ut mauris. Pellentesque hendrerit fermentum massa vitae hendrerit. Morbi et velit libero. Nulla a fermentum nibh.</p>
+		<p>Aliquam orci turpis, dictum et rhoncus ac, imperdiet in enim. Nullam at nunc neque, a mollis urna. Phasellus gravida metus vitae turpis tempus vitae dictum ante sodales. Etiam lobortis vulputate ipsum, nec tincidunt velit volutpat nec. Pellentesque odio nibh, mattis vitae ultricies a, porta quis sapien. Curabitur rhoncus, erat ac bibendum porta, ante turpis semper nibh, porta dapibus urna ligula eu lorem. Cras lectus mi, volutpat a rhoncus et, faucibus non nibh. Ut non leo vitae tellus malesuada pharetra eget vitae lorem. Maecenas semper laoreet elit, non pulvinar leo mollis at. Mauris at rhoncus augue. Pellentesque ornare sodales nulla vitae pretium. Vivamus tempus suscipit neque vel auctor.</p>
+		<p>Maecenas blandit facilisis nulla a dignissim. In sem nulla, tincidunt id congue nec, volutpat a magna. Cras eleifend porta sodales. Suspendisse felis eros, aliquet sed faucibus sed, lacinia pretium magna. Vestibulum consequat neque non dui malesuada tempus. Quisque pharetra tristique elit consectetur tincidunt. Aenean justo ipsum, lacinia vitae fringilla nec, pulvinar at massa. Integer a mauris ligula, in adipiscing nisl. Curabitur urna massa, luctus non ullamcorper ut, auctor ac mauris. Curabitur malesuada sem ut ipsum pellentesque eu consectetur magna egestas. Vestibulum lorem nibh, iaculis id iaculis eget, imperdiet eget lorem. Nunc quis lorem lorem.</p>
+		<p>Quisque vel molestie nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ornare luctus sapien, vel scelerisque augue adipiscing in. Donec faucibus lobortis sollicitudin. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi rutrum sapien ut eros consequat dapibus. Etiam enim ligula, accumsan nec vestibulum sit amet, fermentum scelerisque est. Nunc in tincidunt quam. Praesent vitae sagittis odio. Aliquam malesuada, eros at adipiscing auctor, felis enim elementum magna, eget gravida arcu nisi ac enim. Pellentesque id vehicula velit. Aliquam dignissim, risus a adipiscing dapibus, nunc turpis adipiscing ligula, dictum sagittis augue ipsum non lacus. Curabitur felis elit, ullamcorper et gravida eget, elementum sed mauris. Maecenas luctus interdum molestie.</p>
+		<div class="buttons">
+			<button>Hello again</button>
+		</div>
+	</div>
+</body>
+</html>
\ No newline at end of file

tests/83-reduced.html

+<!doctype html>
+<html>
+<head>
+	<title>Fastclick test</title>
+	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1" />
+	<script>
+		document.addEventListener('touchend', function() {}, false);
+	</script>
+	<style>
+		html {
+			font-size: 32px;
+			font-family: Helvetica, sans-serif;
+		}
+		body {
+			padding: 1em;
+		}
+		div {
+			margin-top: 50%;
+			height: 900px;
+		}
+		.button {
+			width: 100%;
+			color: #fff;
+			text-align: center;
+			text-decoration: none;
+			font-weight: 600;
+			background: #ff3b46;
+			padding: 1em;
+		}
+		.button:hover,
+		.button:active {
+			color: #fff;
+			background: #5091d2;
+		}
+	</style>
+</head>
+<body>
+	<div>
+		<a class="button" href="http://www.apple.com/">Test button</a>
+	</div>
+</body>
+</html>
\ No newline at end of file

tests/83.html

+<!doctype html>
+<html>
+  <head>
+    <!-- Copied from: http://fastclick-issue83.aws.af.cm/ -->
+    <title>Fastclick test</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <script type='application/javascript' src='../lib/fastclick.js'></script>
+    <script>
+      window.addEventListener('load', function() {
+        new FastClick(document.body);
+      }, false);
+    </script>
+    <style>
+      * {
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+      }
+      html {
+        font-size: 32px;
+        font-family: Helvetica, sans-serif;
+      }
+      html, body {
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        padding: 0;
+      }
+      body {
+        padding: 1em;
+      }
+      div {
+        margin-top: 50%;
+        height: 900px;
+      }
+      .button {
+        width: 100%;
+        color: #fff;
+        text-align: center;
+        text-decoration: none;
+        font-weight: 600;
+        background: #ff3b46;
+        padding: 1em;
+        display: inline-block;
+        position: relative;
+        border: 0;
+        cursor: pointer;
+        -moz-border-radius: 2px;
+        -webkit-border-radius: 2px;
+        border-radius: 2px;
+        -webkit-box-shadow: 0 0.18em 0 #931517;
+        -moz-box-shadow: 0 0.18em 0 #931517;
+        box-shadow: 0 0.18em 0 #931517;
+      }
+      .button:hover,
+      .button:active {
+        color: #fff;
+        text-decoration: none;
+        background: #5091d2;
+        -webkit-box-shadow: 0 0.18em 0 #36628d;
+        -moz-box-shadow: 0 0.18em 0 #36628d;
+        box-shadow: 0 0.18em 0 #36628d;
+      }
+    </style>
+  </head>
+  <body>
+    <div>
+      <a class="button" href="https://github.com/ftlabs/fastclick">Test button</a>
+    </div>
+  </body>
+</html>
\ No newline at end of file

tests/84.html

+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+<style type="text/css">
+	p, label { font-family: sans-serif; }
+</style>
+<title>#84</title>
+<script type="application/javascript" src="../lib/fastclick.js"></script>
+<script type="application/javascript">
+	window.addEventListener('load', function() {
+		new FastClick(document.body);
+	}, false);
+</script>
+</head>
+<body>
+	<p>Tapping the following read-only input field should show the alert message.</p>
+	<input type="text" id="readOnlyText" onclick="alert('read-only input tapped')" readonly>
+</body>
+</html>