Permalink
Browse files

Update QUnit.js

  • Loading branch information...
mathiasbynens committed Jan 20, 2017
1 parent f3d4b7d commit 1ad6dacb0bbf717e95d4cba5dd05a3e933f93cd4
Showing with 51 additions and 49 deletions.
  1. +3 −3 tests/index.html
  2. +48 −46 tests/tests.js
View
@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<title>jquery-placeholder test suite</title>
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-1.12.0.css">
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-1.12.0.css">
<style>
.placeholder { color: #aaa; }
#input-type-password { border: 5px solid lime; }
@@ -24,8 +24,8 @@
<p><input type="submit" value="type=submit"></p>
</form>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://code.jquery.com/qunit/qunit-1.12.0.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://code.jquery.com/qunit/qunit-2.1.1.js"></script>
<script src="../jquery.placeholder.js"></script>
<script src="tests.js"></script>
</body>
View
@@ -1,104 +1,106 @@
(function($) {
module('jQuery#placeholder');
QUnit.module('jQuery#placeholder');
test('caches results of feature tests', function() {
strictEqual(typeof $.fn.placeholder.input, 'boolean', '$.fn.placeholder.input');
strictEqual(typeof $.fn.placeholder.textarea, 'boolean', '$.fn.placeholder.textarea');
var test = QUnit.test;
test('caches results of feature tests', function(assert) {
assert.strictEqual(typeof $.fn.placeholder.input, 'boolean', '$.fn.placeholder.input');
assert.strictEqual(typeof $.fn.placeholder.textarea, 'boolean', '$.fn.placeholder.textarea');
});
if ($.fn.placeholder.input && $.fn.placeholder.textarea) {
return;
}
var testElement = function($el) {
var testElement = function($el, assert) {
var el = $el[0];
var placeholder = el.getAttribute('placeholder');
deepEqual($el.placeholder(), $el, 'should be chainable');
strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
strictEqual($el.prop('value'), '', 'propHooks works properly');
strictEqual($el.val(), '', 'valHooks works properly');
assert.strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
assert.strictEqual($el.prop('value'), '', 'propHooks works properly');
assert.strictEqual($el.val(), '', 'valHooks works properly');
ok($el.hasClass('placeholder'), 'should have `placeholder` class');
// test on focus
$el.focus();
strictEqual(el.value, '', '`value` should be the empty string on focus');
strictEqual($el.prop('value'), '', 'propHooks works properly');
strictEqual($el.val(), '', 'valHooks works properly');
assert.strictEqual(el.value, '', '`value` should be the empty string on focus');
assert.strictEqual($el.prop('value'), '', 'propHooks works properly');
assert.strictEqual($el.val(), '', 'valHooks works properly');
ok(!$el.hasClass('placeholder'), 'should not have `placeholder` class on focus');
// and unfocus (blur) again
$el.blur();
strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
strictEqual($el.prop('value'), '', 'propHooks works properly');
strictEqual($el.val(), '', 'valHooks works properly');
assert.strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
assert.strictEqual($el.prop('value'), '', 'propHooks works properly');
assert.strictEqual($el.val(), '', 'valHooks works properly');
ok($el.hasClass('placeholder'), 'should have `placeholder` class');
// change the value
$el.val('lorem ipsum');
strictEqual($el.prop('value'), 'lorem ipsum', '`$el.val(string)` should change the `value` property');
strictEqual(el.value, 'lorem ipsum', '`$el.val(string)` should change the `value` attribute');
assert.strictEqual($el.prop('value'), 'lorem ipsum', '`$el.val(string)` should change the `value` property');
assert.strictEqual(el.value, 'lorem ipsum', '`$el.val(string)` should change the `value` attribute');
ok(!$el.hasClass('placeholder'), '`$el.val(string)` should remove `placeholder` class');
// and clear it again
$el.val('');
strictEqual($el.prop('value'), '', '`$el.val("")` should change the `value` property');
strictEqual(el.value, placeholder, '`$el.val("")` should change the `value` attribute');
assert.strictEqual($el.prop('value'), '', '`$el.val("")` should change the `value` property');
assert.strictEqual(el.value, placeholder, '`$el.val("")` should change the `value` attribute');
ok($el.hasClass('placeholder'), '`$el.val("")` should re-enable `placeholder` class');
// make sure the placeholder property works as expected.
strictEqual($el.prop('placeholder'), placeholder, '$el.prop(`placeholder`) should return the placeholder value');
assert.strictEqual($el.prop('placeholder'), placeholder, '$el.prop(`placeholder`) should return the placeholder value');
$el.prop('placeholder', 'new placeholder');
strictEqual($el.prop('placeholder'), 'new placeholder', '$el.prop(`placeholder`, <string>) should set the placeholder value');
strictEqual($el.value, 'new placeholder', '$el.prop(`placeholder`, <string>) should update the displayed placeholder value');
assert.strictEqual($el.prop('placeholder'), 'new placeholder', '$el.prop(`placeholder`, <string>) should set the placeholder value');
assert.strictEqual($el.value, 'new placeholder', '$el.prop(`placeholder`, <string>) should update the displayed placeholder value');
$el.prop('placeholder', placeholder);
};
test('emulates placeholder for <input type=text>', function() {
testElement( $('#input-type-text') );
test('emulates placeholder for <input type=text>', function(assert) {
testElement( assert, $('#input-type-text') );
});
test('emulates placeholder for <input type=search>', function() {
testElement( $('#input-type-search') );
test('emulates placeholder for <input type=search>', function(assert) {
testElement( assert, $('#input-type-search') );
});
test('emulates placeholder for <input type=email>', function() {
testElement( $('#input-type-email') );
test('emulates placeholder for <input type=email>', function(assert) {
testElement( assert, $('#input-type-email') );
});
test('emulates placeholder for <input type=url>', function() {
testElement( $('#input-type-url') );
test('emulates placeholder for <input type=url>', function(assert) {
testElement( assert, $('#input-type-url') );
});
test('emulates placeholder for <input type=tel>', function() {
testElement( $('#input-type-tel') );
test('emulates placeholder for <input type=tel>', function(assert) {
testElement( assert, $('#input-type-tel') );
});
test('emulates placeholder for <input type=tel>', function() {
testElement( $('#input-type-tel') );
test('emulates placeholder for <input type=tel>', function(assert) {
testElement( assert, $('#input-type-tel') );
});
test('emulates placeholder for <input type=password>', function() {
test('emulates placeholder for <input type=password>', function(assert) {
var selector = '#input-type-password';
var $el = $(selector);
var el = $el[0];
var placeholder = el.getAttribute('placeholder');
strictEqual($el.placeholder(), $el, 'should be chainable');
assert.strictEqual($el.placeholder(), $el, 'should be chainable');
// Re-select the element, as it gets replaced by another one in some browsers
$el = $(selector);
el = $el[0];
strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
strictEqual($el.prop('value'), '', 'propHooks works properly');
strictEqual($el.val(), '', 'valHooks works properly');
assert.strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
assert.strictEqual($el.prop('value'), '', 'propHooks works properly');
assert.strictEqual($el.val(), '', 'valHooks works properly');
ok($el.hasClass('placeholder'), 'should have `placeholder` class');
// test on focus
@@ -108,9 +110,9 @@
$el = $(selector);
el = $el[0];
strictEqual(el.value, '', '`value` should be the empty string on focus');
strictEqual($el.prop('value'), '', 'propHooks works properly');
strictEqual($el.val(), '', 'valHooks works properly');
assert.strictEqual(el.value, '', '`value` should be the empty string on focus');
assert.strictEqual($el.prop('value'), '', 'propHooks works properly');
assert.strictEqual($el.val(), '', 'valHooks works properly');
ok(!$el.hasClass('placeholder'), 'should not have `placeholder` class on focus');
// and unfocus (blur) again
@@ -120,15 +122,15 @@
$el = $(selector);
el = $el[0];
strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
strictEqual($el.prop('value'), '', 'propHooks works properly');
strictEqual($el.val(), '', 'valHooks works properly');
assert.strictEqual(el.value, placeholder, 'should set `placeholder` text as `value`');
assert.strictEqual($el.prop('value'), '', 'propHooks works properly');
assert.strictEqual($el.val(), '', 'valHooks works properly');
ok($el.hasClass('placeholder'), 'should have `placeholder` class');
});
test('emulates placeholder for <textarea></textarea>', function() {
testElement( $('#textarea') );
test('emulates placeholder for <textarea></textarea>', function(assert) {
testElement( assert, $('#textarea') );
});
}(jQuery));

0 comments on commit 1ad6dac

Please sign in to comment.