Skip to content

Commit 69934f6

Browse files
author
zendo
committed
Add unit test
1 parent 5e541cc commit 69934f6

13 files changed

+9133
-93
lines changed

babel.config.js

+9-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,15 @@
11
const pk = require('./package.json')
22

3+
let presets
4+
5+
if (process.env.NODE_ENV === 'test') {
6+
presets = ["@babel/preset-env"]
7+
} else {
8+
presets = ["@babel/preset-env", "minify"]
9+
}
10+
311
module.exports = {
4-
presets: ["@babel/preset-env", "minify"],
12+
presets,
513
comments: true,
614
shouldPrintComment: val => /^!/.test(val),
715
plugins: [

jquery.cascadeSelect.js

+67-68
Original file line numberDiff line numberDiff line change
@@ -1,118 +1,117 @@
11
/* global jQuery */
22

3-
(function($) {
3+
(function ($) {
44
// Data keys
5-
const KEY_DATA_INITED = "inited.cascadeSelect";
6-
const KEY_DATA_OPTION = "option.cascadeSelect";
7-
const KEY_DATA_PREVICOUSUPPERTIER = "previous-uppertier.cascadeSelect";
5+
const KEY_DATA_INITED = 'inited.cascadeSelect'
6+
const KEY_DATA_OPTION = 'option.cascadeSelect'
7+
const KEY_DATA_PREVICOUSUPPERTIER = 'previous-uppertier.cascadeSelect'
88
// Events
9-
const EVENT_CHANGE = "cascadeSelectChange";
9+
const EVENT_CHANGE = 'cascadeSelectChange';
1010

1111
// Override $.fn.val
1212
// Opt for elements which has used cascadeSelect plugin.
13-
(function(originVal) {
14-
$.fn.val = function(value) {
13+
(function (originVal) {
14+
$.fn.val = function (value) {
1515
// Getter
1616
if (!arguments.length) {
17-
return originVal.call(this);
17+
return originVal.call(this)
1818
}
1919

2020
// Setter
21-
const r = originVal.call(this, value);
21+
const r = originVal.call(this, value)
2222
// Fire cascade changed
23-
return r.each(function() {
23+
return r.each(function () {
2424
if ($(this).data(KEY_DATA_INITED)) {
25-
$(this).trigger(EVENT_CHANGE);
25+
$(this).trigger(EVENT_CHANGE)
2626
}
27-
});
28-
};
29-
})($.fn.val);
27+
})
28+
}
29+
})($.fn.val)
3030

3131
// Generate list by upper-tier.
32-
const getList = function(strUpperTier, dataSource) {
33-
if (dataSource && strUpperTier != undefined) {
34-
const upperTiers = strUpperTier.split(";");
35-
let r = [];
36-
let upperTier;
32+
const getList = function (strUpperTier, dataSource) {
33+
if (dataSource && strUpperTier !== undefined) {
34+
const upperTiers = strUpperTier.split(';')
35+
let r = []
36+
let upperTier
3737

3838
for (let i = 0, len = upperTiers.length; i < len; i++) {
39-
upperTier = upperTiers[i];
39+
upperTier = upperTiers[i]
4040
// Only for valid list.
4141
if (dataSource[upperTier]) {
42-
r = r.concat(dataSource[upperTier]);
42+
r = r.concat(dataSource[upperTier])
4343
}
4444
}
45-
return r;
45+
return r
4646
}
47-
return null;
48-
};
47+
return null
48+
}
4949

5050
// Generate option html
5151
const genOptionHtml = (value, text) =>
52-
'<option value="' + value + '">' + text + "</option>";
52+
'<option value="' + value + '">' + text + '</option>'
5353

5454
// Update select html
55-
const updateOptionHtml = function(select, data, upperTier) {
56-
let list = getList(upperTier, data.dataSource);
57-
let $select = $(select);
55+
const updateOptionHtml = function (select, data, upperTier) {
56+
const list = getList(upperTier, data.dataSource)
57+
const $select = $(select)
5858

5959
if (list) {
6060
if (
6161
$select.data(KEY_DATA_PREVICOUSUPPERTIER) !== upperTier
6262
) {
63-
let h = [];
64-
let allIds = [];
65-
$.each(list, function(i, itm) {
66-
allIds.push(itm.id);
67-
h.push(genOptionHtml(itm.id, itm.label));
68-
});
63+
let h = []
64+
let allIds = []
65+
$.each(list, function (i, itm) {
66+
allIds.push(itm.id)
67+
h.push(genOptionHtml(itm.id, itm.label))
68+
})
6969
// Generate default option
70-
h.unshift(genOptionHtml(allIds.join(";"), data?.labels?.all ?? "全部"));
71-
$select.html(h.join(""));
72-
$select.data(KEY_DATA_PREVICOUSUPPERTIER, upperTier);
73-
h = null;
74-
allIds = null;
70+
h.unshift(genOptionHtml(allIds.join(';'), data?.labels?.all ?? '全部'))
71+
$select.html(h.join(''))
72+
$select.data(KEY_DATA_PREVICOUSUPPERTIER, upperTier)
73+
h = null
74+
allIds = null
7575
}
7676
} else {
77-
throw new Error("Missing data, key=" + upperTier);
77+
throw new Error('Missing data, key=' + upperTier)
7878
}
79-
};
79+
}
8080

8181
/**
82-
* $.fn.cascadeSelect plugin
83-
* @param {object} option plugin config data
84-
* @return {jQuery} jQuery object
85-
* option :
86-
* {
87-
* upperTierGetter: {function}, // return upperTier key
88-
* dataSource: {array} // Data source
89-
* }
82+
* $.fn.cascadeSelect Plugin
83+
*
84+
* @param {Object} option config data for plugin
85+
* @param {function} option.upperTierGetter return upperTier key
86+
* @param {Array} option.dataSource data source
87+
* @param {?Object} option.labels label map
88+
* @return {jQuery}
9089
*
9190
*/
92-
$.fn.cascadeSelect = function(option) {
93-
return this.each(function() {
94-
const $this = $(this);
91+
$.fn.cascadeSelect = function (option) {
92+
return this.each(function () {
93+
const $this = $(this)
9594
if (!$this.data(KEY_DATA_INITED)) {
96-
$this.data(KEY_DATA_INITED, true);
95+
$this.data(KEY_DATA_INITED, true)
9796
}
9897

99-
updateOptionHtml(this, option, option.upperTierGetter());
98+
updateOptionHtml(this, option, option.upperTierGetter())
10099

101-
$this.data(KEY_DATA_OPTION, option);
100+
$this.data(KEY_DATA_OPTION, option)
102101

103102
// If value changed, then call updated.
104-
$this.bind("change", function() {
105-
const $this = $(this);
106-
const val = $this.val();
107-
updateOptionHtml(this, option, option.upperTierGetter());
108-
$this.val(val); // A trick, get the real value.
109-
});
103+
$this.bind('change', function () {
104+
const $this = $(this)
105+
const val = $this.val()
106+
updateOptionHtml(this, option, option.upperTierGetter())
107+
$this.val(val) // A trick, get the real value.
108+
})
110109

111110
// For external API. Like $(elem).trigger("update");
112-
$this.bind("update", function() {
113-
const $this = $(this);
114-
$this.trigger("change");
115-
});
116-
});
117-
};
118-
})(jQuery);
111+
$this.bind('update', function () {
112+
const $this = $(this)
113+
$this.trigger('change')
114+
})
115+
})
116+
}
117+
})(jQuery)

jquery.cascadeSelect.min.js

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

+24-2
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,31 @@
1010
"@babel/core": "^7.8.4",
1111
"@babel/preset-env": "^7.8.4",
1212
"@comandeer/babel-plugin-banner": "^5.0.0",
13-
"babel-preset-minify": "^0.5.1"
13+
"babel-eslint": "^10.1.0",
14+
"babel-preset-minify": "^0.5.1",
15+
"cross-env": "^7.0.2",
16+
"http-server": "^0.12.1",
17+
"standard": "^14.3.2"
1418
},
1519
"scripts": {
16-
"build": "babel jquery.cascadeSelect.js --out-file jquery.cascadeSelect.min.js"
20+
"build": "npm run build:prod",
21+
"build:prod": "babel jquery.cascadeSelect.js --out-file jquery.cascadeSelect.min.js",
22+
"build:test": "cross-env NODE_ENV=test babel jquery.cascadeSelect.js --out-file ./test/jquery.cascadeSelect.debug.js",
23+
"lint": "standard",
24+
"lint:fix": "standard --fix",
25+
"test": "npm run build:test && npm run server",
26+
"server": "http-server -p 80 ."
27+
},
28+
"standard": {
29+
"parser": "babel-eslint",
30+
"ignore": [
31+
"node_modules",
32+
"coverage",
33+
"babel.config.js",
34+
"jquery.cascadeSelect.min.js",
35+
"jquery.cascadeSelect.debug.js",
36+
"test/lib/*.js",
37+
"test/jquery.cascadeSelect.debug.js"
38+
]
1739
}
1840
}

test/fns.js

+56
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
/* global testData_, $ */
2+
3+
testData_.initPluginWithNormalData = function (readyFn) {
4+
$(function () {
5+
var $ele = $('<select id="list1"></select>&lt;=&gt;<select id="list2"></select>&lt;=&gt;<select id="list3"></select>')
6+
$ele.appendTo('#qunit-fixture')
7+
var cascadeSelectConfigA = {
8+
upperTierGetter: function () {
9+
return ''
10+
},
11+
dataSource: testData_.list1
12+
}
13+
14+
var cascadeSelectConfigB = {
15+
upperTierGetter: function () {
16+
return $('#list1').val()
17+
},
18+
dataSource: testData_.list2
19+
}
20+
21+
var cascadeSelectConfigC = {
22+
upperTierGetter: function () {
23+
return $('#list2').val()
24+
},
25+
dataSource: testData_.list3
26+
}
27+
28+
var $list1 = $('#list1')
29+
var $list2 = $('#list2')
30+
var $list3 = $('#list3')
31+
32+
$list1
33+
.cascadeSelect(cascadeSelectConfigA)
34+
.bind('cascadeSelectChange', function () {
35+
console.log('List1 fire the change.')
36+
// Update next tier
37+
$('#list2').trigger('update')
38+
})
39+
40+
$list2
41+
.cascadeSelect(cascadeSelectConfigB)
42+
.bind('cascadeSelectChange', function () {
43+
console.log('List2 fire the change.')
44+
// Update next tier
45+
$('#list3').trigger('update')
46+
})
47+
48+
$list3
49+
.cascadeSelect(cascadeSelectConfigC)
50+
.bind('cascadeSelectChange', function () {
51+
console.log('List3 fire the change.')
52+
})
53+
54+
readyFn($list1, $list2, $list3)
55+
})
56+
}

test/index.html

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width">
6+
<title>QUnit Example</title>
7+
<link rel="stylesheet" href="./lib/qunit-2.9.2.css">
8+
</head>
9+
<body>
10+
<div id="qunit"></div>
11+
<div id="qunit-fixture"></div>
12+
<script src="./lib/qunit-2.9.2.js"></script>
13+
<script src="./lib/jquery.min.js"></script>
14+
<script src="./lib/data.js"></script>
15+
<script src="./jquery.cascadeSelect.debug.js"></script>
16+
<script src="./fns.js"></script>
17+
<script src="./jquery.cascadeSelect.test.js"></script>
18+
</body>
19+
</html>

0 commit comments

Comments
 (0)