computed-style - npm Package Compare versions

Comparing version 0.1.4 to 0.2.0

bower.json

 {
   "name": "computedStyle",
-  "version": "0.1.4",
+  "version": "0.2.0",
   "main": "dist/computedStyle.js",
@@ -5,0 +5,0 @@ "ignore": [

CHANGELOG.md

 # computedStyle changelog
+0.2.0 - Added Firefox iframe support and removed 140 bytes support. Fixed by @kjarmicki in #5
+
 0.1.4 - Added `twolfson-style` and fixed up style issues
 
 Before 0.1.4 - See `git log`

component.json

@@ -5,3 +5,3 @@ {
   "description": "Cross-browser currentStyle/getComputedStyle implementation",
-  "version": "0.1.4",
+  "version": "0.2.0",
   "keywords": [
@@ -8,0 +8,0 @@ "cross-browser",

dist/computedStyle.amd.js

 define(function () {
-  // This code has been refactored for 140 bytes
-// You can see the original here: https://github.com/twolfson/computedStyle/blob/04cd1da2e30fa45844f95f5cb1ac898e9b9ef050/lib/computedStyle.js
-var computedStyle = function (el, prop, getComputedStyle) {
+  // DEV: We don't use var but favor parameters since these play nicer with minification
+function computedStyle(el, prop, getComputedStyle, style) {
   getComputedStyle = window.getComputedStyle;
+  style =
+      // If we have getComputedStyle
+      getComputedStyle ?
+        // Query it
+        // TODO: From CSS-Query notes, we might need (node, null) for FF
+        getComputedStyle(el) :
 
-  // In one fell swoop
-  return (
-    // If we have getComputedStyle
-    getComputedStyle ?
-      // Query it
-      // TODO: From CSS-Query notes, we might need (node, null) for FF
-      getComputedStyle(el) :
+      // Otherwise, we are in IE and use currentStyle
+        el.currentStyle;
+  if (style) {
+    return style
+    [
+      // Switch to camelCase for CSSOM
+      // DEV: Grabbed from jQuery
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
+      prop.replace(/-(\w)/gi, function (word, letter) {
+        return letter.toUpperCase();
+      })
+    ];
+  }
+}
 
-    // Otherwise, we are in IE and use currentStyle
-      el.currentStyle
-  )[
-    // Switch to camelCase for CSSOM
-    // DEV: Grabbed from jQuery
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
-    prop.replace(/-(\w)/gi, function (word, letter) {
-      return letter.toUpperCase();
-    })
-  ];
-};
-
   return computedStyle;
 });

dist/computedStyle.commonjs.js

@@ -1,27 +0,27 @@
-// This code has been refactored for 140 bytes
-// You can see the original here: https://github.com/twolfson/computedStyle/blob/04cd1da2e30fa45844f95f5cb1ac898e9b9ef050/lib/computedStyle.js
-var computedStyle = function (el, prop, getComputedStyle) {
+// DEV: We don't use var but favor parameters since these play nicer with minification
+function computedStyle(el, prop, getComputedStyle, style) {
   getComputedStyle = window.getComputedStyle;
+  style =
+      // If we have getComputedStyle
+      getComputedStyle ?
+        // Query it
+        // TODO: From CSS-Query notes, we might need (node, null) for FF
+        getComputedStyle(el) :
 
-  // In one fell swoop
-  return (
-    // If we have getComputedStyle
-    getComputedStyle ?
-      // Query it
-      // TODO: From CSS-Query notes, we might need (node, null) for FF
-      getComputedStyle(el) :
+      // Otherwise, we are in IE and use currentStyle
+        el.currentStyle;
+  if (style) {
+    return style
+    [
+      // Switch to camelCase for CSSOM
+      // DEV: Grabbed from jQuery
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
+      prop.replace(/-(\w)/gi, function (word, letter) {
+        return letter.toUpperCase();
+      })
+    ];
+  }
+}
 
-    // Otherwise, we are in IE and use currentStyle
-      el.currentStyle
-  )[
-    // Switch to camelCase for CSSOM
-    // DEV: Grabbed from jQuery
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
-    prop.replace(/-(\w)/gi, function (word, letter) {
-      return letter.toUpperCase();
-    })
-  ];
-};
-
 module.exports = computedStyle;

dist/computedStyle.js

 (function () {
-  // This code has been refactored for 140 bytes
-// You can see the original here: https://github.com/twolfson/computedStyle/blob/04cd1da2e30fa45844f95f5cb1ac898e9b9ef050/lib/computedStyle.js
-var computedStyle = function (el, prop, getComputedStyle) {
+  // DEV: We don't use var but favor parameters since these play nicer with minification
+function computedStyle(el, prop, getComputedStyle, style) {
   getComputedStyle = window.getComputedStyle;
+  style =
+      // If we have getComputedStyle
+      getComputedStyle ?
+        // Query it
+        // TODO: From CSS-Query notes, we might need (node, null) for FF
+        getComputedStyle(el) :
 
-  // In one fell swoop
-  return (
-    // If we have getComputedStyle
-    getComputedStyle ?
-      // Query it
-      // TODO: From CSS-Query notes, we might need (node, null) for FF
-      getComputedStyle(el) :
+      // Otherwise, we are in IE and use currentStyle
+        el.currentStyle;
+  if (style) {
+    return style
+    [
+      // Switch to camelCase for CSSOM
+      // DEV: Grabbed from jQuery
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
+      prop.replace(/-(\w)/gi, function (word, letter) {
+        return letter.toUpperCase();
+      })
+    ];
+  }
+}
 
-    // Otherwise, we are in IE and use currentStyle
-      el.currentStyle
-  )[
-    // Switch to camelCase for CSSOM
-    // DEV: Grabbed from jQuery
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
-    prop.replace(/-(\w)/gi, function (word, letter) {
-      return letter.toUpperCase();
-    })
-  ];
-};
-
   window.computedStyle = computedStyle;
 }());

dist/computedStyle.min.js

@@ -1,1 +0,1 @@
-window.computedStyle=function(e,p,g){g=window.getComputedStyle;return(g?g(e):e.currentStyle)[p.replace(/-(\w)/gi,function(w,l){return l.toUpperCase()})]}
+function computedStyle(e,p,g,style){g=window.getComputedStyle;style=g?g(e):e.currentStyle;if(style){return style[p.replace(/-(\w)/gi,function(w,l){return l.toUpperCase()})]}}

grunt.js

 module.exports = function (grunt) {
   // Helper function to resolve computedStyle
-  var minJs = 'dist/computedStyle.140.js';
-  var validJs = 'tmp/computedStyle.valid.js';
+  var computedStyleJs = 'lib/computedStyle.js';
+  var minJs = 'dist/computedStyle.min.js';
   function getVars() {
     return {
-      computedStyle: grunt.file.read(validJs),
-      'computedStyle-140': grunt.file.read(minJs)
+      computedStyle: grunt.file.read(computedStyleJs),
+      'computedStyle-min': grunt.file.read(minJs)
     };
@@ -14,2 +14,3 @@ }
   grunt.initConfig({
+    // TODO: Replace `jsmin-sourcemap` + `replace` with `uglifyjs`
     // Trim out comments and whitespace
@@ -26,3 +27,3 @@ // DEV: Uglify doesn't like partial JS scripts so this would fail
     replace: {
-      'computedStyle-140': {
+      'computedStyle-min': {
         src: 'tmp/computedStyle.comment_free.js',
@@ -57,12 +58,2 @@ dest: minJs,
         }]
-      },
-      'computedStyle-valid': {
-        // Generate valid JS
-        src: 'lib/computedStyle.js',
-        dest: validJs,
-        replacements: [{
-          // Replace the first function with a `var`
-          from: /function/,
-          to: 'var computedStyle = function'
-        }]
       }
@@ -79,8 +70,2 @@ },
       },
-      min: {
-        src: 'lib/templates/min.mustache.js',
-        dest: 'dist/computedStyle.min.js',
-        variables: getVars,
-        engine: 'mustache'
-      },
       amd: {
@@ -87,0 +72,0 @@ src: 'lib/templates/amd.mustache.js',

lib/computedStyle.js

@@ -1,25 +0,25 @@
-// This code has been refactored for 140 bytes
-// You can see the original here: https://github.com/twolfson/computedStyle/blob/04cd1da2e30fa45844f95f5cb1ac898e9b9ef050/lib/computedStyle.js
-function (el, prop, getComputedStyle) {
+// DEV: We don't use var but favor parameters since these play nicer with minification
+function computedStyle(el, prop, getComputedStyle, style) {
   getComputedStyle = window.getComputedStyle;
+  style =
+      // If we have getComputedStyle
+      getComputedStyle ?
+        // Query it
+        // TODO: From CSS-Query notes, we might need (node, null) for FF
+        getComputedStyle(el) :
 
-  // In one fell swoop
-  return (
-    // If we have getComputedStyle
-    getComputedStyle ?
-      // Query it
-      // TODO: From CSS-Query notes, we might need (node, null) for FF
-      getComputedStyle(el) :
-
-    // Otherwise, we are in IE and use currentStyle
-      el.currentStyle
-  )[
-    // Switch to camelCase for CSSOM
-    // DEV: Grabbed from jQuery
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
-    // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
-    prop.replace(/-(\w)/gi, function (word, letter) {
-      return letter.toUpperCase();
-    })
-  ];
-};
+      // Otherwise, we are in IE and use currentStyle
+        el.currentStyle;
+  if (style) {
+    return style
+    [
+      // Switch to camelCase for CSSOM
+      // DEV: Grabbed from jQuery
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/css.js#L191-L194
+      // https://github.com/jquery/jquery/blob/1.9-stable/src/core.js#L593-L597
+      prop.replace(/-(\w)/gi, function (word, letter) {
+        return letter.toUpperCase();
+      })
+    ];
+  }
+}

package.json

 {
   "name": "computed-style",
   "description": "Cross-browser currentStyle/getComputedStyle implementation",
-  "version": "0.1.4",
+  "version": "0.2.0",
   "homepage": "https://github.com/twolfson/computedStyle",
@@ -27,5 +27,5 @@ "author": {
     "build": "grunt build",
-    "lint": "twolfson-style lint grunt.js dist/computedStyle.commonjs.js test/",
+    "lint": "twolfson-style lint grunt.js lib/computedStyle.js test/",
     "_pretest": "twolfson-style install",
-    "test": "npm run build && npm run precheck && testem --file test/testem.json ci && npm run lint"
+    "test": "npm run build && testem --file test/testem.json ci && npm run lint"
   },
@@ -32,0 +32,0 @@ "dependencies": {},

README.md

@@ -14,3 +14,2 @@ # computedStyle
 - [AMD version][amd]
-- [140 bytes version][140]
 
@@ -21,3 +20,2 @@ [min]: https://raw.github.com/twolfson/computedStyle/master/dist/computedStyle.min.js
 [amd]: https://raw.github.com/twolfson/computedStyle/master/dist/computedStyle.amd.js
-[140]: https://raw.github.com/twolfson/computedStyle/master/dist/computedStyle.140.js
 
@@ -24,0 +22,0 @@ In your web page:

test/computedStyle_test.js

@@ -137,2 +137,33 @@ /* global computedStyle: true */
   });
+
+  // Firefox edge case, https://bugzilla.mozilla.org/show_bug.cgi?id=548397
+  describe('getting styles from hidden iframe', function () {
+    before(function (done) {
+      // Create global communication variable
+      window._invisibleIframeTest = 'unresolved';
+
+      // Create hidden iframe
+      this.iframe = document.createElement('iframe');
+      this.iframe.src = 'invisibleIframe.html';
+      this.iframe.style.display = 'none';
+
+      // Setup is complete when iframe loads
+      this.iframe.onload = function () {
+        done();
+      };
+
+      // Append it to the DOM
+      body.appendChild(this.iframe);
+    });
+
+    after(function () {
+      // Clean up the element and global communication variable
+      body.removeChild(this.iframe);
+      delete window._invisibleIframeTest;
+    });
+
+    it('should compute style to 300px or undefined', function () {
+      assert(window._invisibleIframeTest === '300px' || window._invisibleIframeTest === undefined);
+    });
+  });
 });

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

20918

increased by2.64%

Lines of code

367

increased by3.38%

Worsened metrics

Number of package files

22

decreased by-4.35%

Number of lines in readme file

70

decreased by-2.78%

No dependency changes