Skip to content

Commit

Permalink
Update QUnit.js
Browse files Browse the repository at this point in the history
  • Loading branch information
@mathiasbynens
mathiasbynens committed Jan 20, 2017
1 parent f3d4b7d commit 1ad6dac
Show file tree
Hide file tree
Showing 2 changed files with 51 additions and 49 deletions.
6 changes: 3 additions & 3 deletions tests/index.html
View file
Expand Up @@ -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; }
Expand All @@ -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>
Expand Down
94 changes: 48 additions & 46 deletions tests/tests.js
View file
@@ -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
Expand All @@ -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
Expand All @@ -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.