avalon2
Version:
an elegant efficient express mvvm framework
478 lines (477 loc) • 18.4 kB
HTML
<html lang="en">
<head>
<title>Code coverage report for dom/css/compact.js</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="../../prettify.css" />
<link rel="stylesheet" href="../../base.css" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type='text/css'>
.coverage-summary .sorter {
background-image: url(../../sort-arrow-sprite.png);
}
</style>
</head>
<body>
<div class='wrapper'>
<div class='pad1'>
<h1>
<a href="../../index.html">all files</a> / <a href="index.html">dom/css/</a> compact.js
</h1>
<div class='clearfix'>
<div class='fl pad1y space-right2'>
<span class="strong">100% </span>
<span class="quiet">Statements</span>
<span class='fraction'>66/66</span>
</div>
<div class='fl pad1y space-right2'>
<span class="strong">100% </span>
<span class="quiet">Branches</span>
<span class='fraction'>71/71</span>
</div>
<div class='fl pad1y space-right2'>
<span class="strong">100% </span>
<span class="quiet">Functions</span>
<span class='fraction'>6/6</span>
</div>
<div class='fl pad1y space-right2'>
<span class="strong">100% </span>
<span class="quiet">Lines</span>
<span class='fraction'>66/66</span>
</div>
<div class='fl pad1y'>
<span class="strong">48 statements, 3 functions, 61 branches</span>
<span class="quiet">Ignored</span>
</div>
</div>
</div>
<div class='status-line high'></div>
<pre><table class="coverage">
<tr><td class="line-count quiet">1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137</td><td class="line-coverage quiet"><span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-yes">4×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">2×</span>
<span class="cline-any cline-yes">6×</span>
<span class="cline-any cline-yes">6×</span>
<span class="cline-any cline-yes">6×</span>
<span class="cline-any cline-yes">6×</span>
<span class="cline-any cline-yes">6×</span>
<span class="cline-any cline-yes">6×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-yes">1×</span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span>
<span class="cline-any cline-neutral"> </span></td><td class="text"><pre class="prettyprint lang-js">import { avalon, msie } from '../../seed/core'
import { cssMap, cssHooks, getWindow } from './share'
/* istanbul ignore if */
<span class="skip-if-branch" title="if path not taken" >I</span>if (msie < 9) {
<span class="cstat-skip" title="statement not covered" > cssMap['float'] = 'styleFloat'</span>
<span class="cstat-skip" title="statement not covered" > var rnumnonpx = /^-?(?:\d*\.)?\d+(?!px)[^\d\s]+$/i</span>
<span class="cstat-skip" title="statement not covered" > var rposition = /^(top|right|bottom|left)$/</span>
<span class="cstat-skip" title="statement not covered" > var ralpha = /alpha\([^)]+\)/i</span>
<span class="cstat-skip" title="statement not covered" > var ropactiy = /(opacity|\d(\d|\.)*)/g</span>
<span class="cstat-skip" title="statement not covered" > var ie8 = msie === 8</span>
<span class="cstat-skip" title="statement not covered" > var salpha = 'DXImageTransform.Microsoft.Alpha'</span>
<span class="cstat-skip" title="statement not covered" > var border = {</span>
thin: ie8 ? '1px' : '2px',
medium: ie8 ? '3px' : '4px',
thick: ie8 ? '5px' : '6px'
}
<span class="cstat-skip" title="statement not covered" > cssHooks['@:get'] = <span class="fstat-skip" title="function not covered" >function (node, name) {</span></span>
//取得精确值，不过它有可能是带em,pc,mm,pt,%等单位
<span class="cstat-skip" title="statement not covered" > var currentStyle = node.currentStyle</span>
<span class="cstat-skip" title="statement not covered" > var ret = currentStyle[name]</span>
<span class="cstat-skip" title="statement not covered" > if ((rnumnonpx.test(ret) && !rposition.test(ret))) {</span>
//①，保存原有的style.left, runtimeStyle.left,
<span class="cstat-skip" title="statement not covered" > var style = node.style,</span>
left = style.left,
rsLeft = node.runtimeStyle.left
//②由于③处的style.left = xxx会影响到currentStyle.left，
//因此把它currentStyle.left放到runtimeStyle.left，
//runtimeStyle.left拥有最高优先级，不会style.left影响
<span class="cstat-skip" title="statement not covered" > node.runtimeStyle.left = currentStyle.left</span>
//③将精确值赋给到style.left，然后通过IE的另一个私有属性 style.pixelLeft
//得到单位为px的结果；fontSize的分支见http://bugs.jquery.com/ticket/760
<span class="cstat-skip" title="statement not covered" > style.left = name === 'fontSize' ? '1em' : (ret || 0)</span>
<span class="cstat-skip" title="statement not covered" > ret = style.pixelLeft + 'px'</span>
//④还原 style.left，runtimeStyle.left
<span class="cstat-skip" title="statement not covered" > style.left = left</span>
<span class="cstat-skip" title="statement not covered" > node.runtimeStyle.left = rsLeft</span>
}
<span class="cstat-skip" title="statement not covered" > if (ret === 'medium') {</span>
<span class="cstat-skip" title="statement not covered" > name = name.replace('Width', 'Style')</span>
//border width 默认值为medium，即使其为0'
<span class="cstat-skip" title="statement not covered" > if (currentStyle[name] === 'none') {</span>
<span class="cstat-skip" title="statement not covered" > ret = '0px'</span>
}
}
<span class="cstat-skip" title="statement not covered" > return ret === '' ? 'auto' : border[ret] || ret</span>
}
<span class="cstat-skip" title="statement not covered" > cssHooks['opacity:set'] = <span class="fstat-skip" title="function not covered" >function (node, name, value) {</span></span>
<span class="cstat-skip" title="statement not covered" > var style = node.style</span>
<span class="cstat-skip" title="statement not covered" > var opacity = Number(value) <= 1 ? 'alpha(opacity=' + value * 100 + ')' : ''</span>
<span class="cstat-skip" title="statement not covered" > var filter = style.filter || ''</span>
<span class="cstat-skip" title="statement not covered" > style.zoom = 1</span>
//不能使用以下方式设置透明度
//node.filters.alpha.opacity = value * 100
<span class="cstat-skip" title="statement not covered" > style.filter = (ralpha.test(filter) ?</span>
filter.replace(ralpha, opacity) :
filter + ' ' + opacity).trim()
<span class="cstat-skip" title="statement not covered" > if (!style.filter) {</span>
<span class="cstat-skip" title="statement not covered" > style.removeAttribute('filter')</span>
}
}
<span class="cstat-skip" title="statement not covered" > cssHooks['opacity:get'] = <span class="fstat-skip" title="function not covered" >function (node) {</span></span>
<span class="cstat-skip" title="statement not covered" > var match = node.style.filter.match(ropactiy) || []</span>
<span class="cstat-skip" title="statement not covered" > var ret = false</span>
<span class="cstat-skip" title="statement not covered" > for (var i = 0, el; el = match[i++];) {</span>
<span class="cstat-skip" title="statement not covered" > if (el === 'opacity') {</span>
<span class="cstat-skip" title="statement not covered" > ret = true</span>
} else <span class="cstat-skip" title="statement not covered" >if (ret) {</span>
<span class="cstat-skip" title="statement not covered" > return (el / 100) + ''</span>
}
}
<span class="cstat-skip" title="statement not covered" > return '1' </span>//确保返回的是字符串
}
}
/* istanbul ignore next */
avalon.fn.offset = function () { //取得距离页面左右角的坐标
var node = this[0],
box = {
left: 0,
top: 0
}
<span class="skip-if-branch" title="if path not taken" >I</span>if (!node || !node.tagName || !node.ownerDocument) {
<span class="cstat-skip" title="statement not covered" > return box</span>
}
var doc = node.ownerDocument
var body = doc.body
var root = doc.documentElement
var win = doc.defaultView || <span class="branch-1 cbranch-skip" title="branch not covered" >doc.parentWindow</span>
<span class="skip-if-branch" title="else path not taken" >E</span>if (!avalon.contains(root, node)) {
return box
}
//http://hkom.blog1.fc2.com/?mode=m&no=750 body的偏移量是不包含margin的
//我们可以通过getBoundingClientRect来获得元素相对于client的rect.
//http://msdn.microsoft.com/en-us/library/ms536433.aspx
<span class="cstat-skip" title="statement not covered" > if (node.getBoundingClientRect) {</span>
<span class="cstat-skip" title="statement not covered" > box = node.getBoundingClientRect() </span>// BlackBerry 5, iOS 3 (original iPhone)
}
//chrome/IE6: body.scrollTop, firefox/other: root.scrollTop
<span class="cstat-skip" title="statement not covered" > var clientTop = root.clientTop || body.clientTop,</span>
clientLeft = root.clientLeft || body.clientLeft,
scrollTop = Math.max(win.pageYOffset || 0, root.scrollTop, body.scrollTop),
scrollLeft = Math.max(win.pageXOffset || 0, root.scrollLeft, body.scrollLeft)
// 把滚动距离加到left,top中去。
// IE一些版本中会自动为HTML元素加上2px的border，我们需要去掉它
// http://msdn.microsoft.com/en-us/library/ms533564(VS.85).aspx
<span class="cstat-skip" title="statement not covered" > return {</span>
top: box.top + scrollTop - clientTop,
left: box.left + scrollLeft - clientLeft
}
}
//生成avalon.fn.scrollLeft, avalon.fn.scrollTop方法
/* istanbul ignore next */
avalon.each({
scrollLeft: 'pageXOffset',
scrollTop: 'pageYOffset'
}, function (method, prop) {
avalon.fn[method] = function (val) {
var node = this[0] || <span class="branch-1 cbranch-skip" title="branch not covered" >{}</span>
var win = getWindow(node)
var root = avalon.root
var top = method === 'scrollTop'
<span class="skip-if-branch" title="else path not taken" >E</span>if (!arguments.length) {
return win ? <span class="branch-0 cbranch-skip" title="branch not covered" >(prop in win) ? win[prop] : root[method] </span>: node[method]
} else {
<span class="cstat-skip" title="statement not covered" > if (win) {</span>
<span class="cstat-skip" title="statement not covered" > win.scrollTo(!top ? val : avalon(win).scrollLeft(), top ? val : avalon(win).scrollTop())</span>
} else {
<span class="cstat-skip" title="statement not covered" > node[method] = val</span>
}
}
}
})
</pre></td></tr>
</table></pre>
<div class='push'></div><!-- for sticky footer -->
</div><!-- /wrapper -->
<div class='footer quiet pad2 space-top1 center small'>
Code coverage
generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Tue Dec 13 2016 18:10:11 GMT+0800 (CST)
</div>
</div>
<script src="../../prettify.js"></script>
<script>
window.onload = function () {
if (typeof prettyPrint === 'function') {
prettyPrint();
}
};
</script>
<script src="../../sorter.js"></script>
</body>
</html>