~ css 小数单位的检测

blearjs · Dec 6, 2016 · 679a529 · 679a529
1 parent 1d86d53
commit 679a529
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "blear.utils.compatible",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "浏览器兼容性",
   "scripts": {
     "live": "browser-sync start --config bs-config.js",

diff --git a/src/index.js b/src/index.js
@@ -14,6 +14,8 @@ var newTestEl = function () {
     return doc.createElement('p');
 };
 var testEl = newTestEl();
+// @link http://www.w3cplus.com/css/the-lengths-of-css.html
+var reUnit = /(px|em|rem|in|cm|mm|pt|pc|ex|ch|vw|vh|vmin|vmax|%)/i;
 
 
 /**
@@ -118,7 +120,6 @@ exports.css = function (standardKey, standardVal) {
                 array.each(browserCSSPrefixList, function (index, prefix) {
                     var setVal = prefix ? prefix + '-' + standardVal : standardVal;
                     // 防止一个元素多次测试互相影响
-                    //
                     var testEl = newTestEl();
 
                     try {
@@ -130,7 +131,9 @@ exports.css = function (standardKey, standardVal) {
 
                     var cssText = testEl.style.cssText.toLowerCase();
 
-                    if (cssText.indexOf(checkVal) > -1) {
+                    // 如果值里有单位说明是正确的 || 值里包含检查数据也是正确的
+                    // 12.34567px => 12.346px
+                    if (reUnit.test(checkVal) || cssText.indexOf(checkVal) > -1) {
                         findVal = setVal;
                         return false;
                     }

diff --git a/test/test.index.js b/test/test.index.js
@@ -54,6 +54,7 @@ describe('index.js', function () {
         var ret2 = compatible.css('display', 'flex');
         var ret3 = compatible.css('border-radius', '2px');
         var ret4 = compatible.css('filter', 'blur(2px)');
+        var ret5 = compatible.css('width', '11.11111px');
 
         expect(ret1.key).toBe('width');
         setStyle(divEl, ret1.key, '100px');
@@ -76,5 +77,7 @@ describe('index.js', function () {
             setStyle(divEl, ret4.key, ret4.val);
             expect(getStyle(divEl, ret4.key)).toEqual(ret4.val);
         }
+
+        expect(ret5.key).toBe('width');
     });
 });