Added options object for indicating if the script should set the overflowX and overflowY. The default behavior lets the script control the overflows, which will normalize the appearance between browsers. Fixes #220.3.0.4

6 files changed, 80 insertions, 48 deletions

diff --git a/bower.json b/bower.json
index 6f56740..eaad968 100644
--- a/bower.json
+++ b/bower.json
@@ -1,7 +1,7 @@
 {
 	"name": "autosize",
 	"description": "Autosize is a small, stand-alone script to automatically adjust textarea height to fit text.",
-	"version": "3.0.2",
+	"version": "3.0.4",
 	"dependencies": {},
 	"keywords": [
 		"textarea",
diff --git a/changelog.md b/changelog.md
index 8b9fb04..9ba2e50 100644
--- a/changelog.md
+++ b/changelog.md
@@ -1,5 +1,8 @@
 ## Changelog

 

+##### v.3.0.4 - 2015-05-05

+* Added options object for indicating if the script should set the overflowX and overflowY.  The default behavior lets the script control the overflows, which will normalize the appearance between browsers.  Fixes #220.

+

 ##### v.3.0.3 - 2015-04-23

 * Avoided adjusting the height for hidden textarea elements.  Fixes #155.

 

diff --git a/dest/autosize.js b/dest/autosize.js
index 56420fa..053cf81 100644
--- a/dest/autosize.js
+++ b/dest/autosize.js
@@ -1,5 +1,5 @@
 /*!
-	Autosize 3.0.2
+	Autosize 3.0.4
 	license: MIT
 	http://www.jacklmoore.com/autosize
 */
@@ -19,9 +19,17 @@
 	'use strict';
 
 	function assign(ta) {
+		var _ref = arguments[1] === undefined ? {} : arguments[1];
+
+		var _ref$setOverflowX = _ref.setOverflowX;
+		var setOverflowX = _ref$setOverflowX === undefined ? true : _ref$setOverflowX;
+		var _ref$setOverflowY = _ref.setOverflowY;
+		var setOverflowY = _ref$setOverflowY === undefined ? true : _ref$setOverflowY;
+
 		if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA' || ta.hasAttribute('data-autosize-on')) {
 			return;
-		}var heightOffset;
+		}var heightOffset = null;
+		var overflowY = 'hidden';
 
 		function init() {
 			var style = window.getComputedStyle(ta, null);
@@ -55,7 +63,12 @@
 				ta.style.width = width;
 			}
 
-			ta.style.overflowY = value;
+			overflowY = value;
+
+			if (setOverflowY) {
+				ta.style.overflowY = value;
+			}
+
 			update();
 		}
 
@@ -84,14 +97,13 @@
 			var style = window.getComputedStyle(ta, null);
 
 			if (style.height !== ta.style.height) {
-				if (ta.style.overflowY !== 'visible') {
+				if (overflowY !== 'visible') {
 					changeOverflow('visible');
 					return;
 				}
 			} else {
-				if (ta.style.overflowY !== 'hidden') {
+				if (overflowY !== 'hidden') {
 					changeOverflow('hidden');
-					autosize();
 					return;
 				}
 			}
@@ -116,7 +128,9 @@
 		}).bind(ta, {
 			height: ta.style.height,
 			resize: ta.style.resize,
-			overflowY: ta.style.overflowY });
+			overflowY: ta.style.overflowY,
+			overflowX: ta.style.overflowX,
+			wordWrap: ta.style.wordWrap });
 
 		ta.addEventListener('autosize:destroy', destroy);
 
@@ -131,11 +145,20 @@
 		ta.addEventListener('input', update);
 		ta.addEventListener('autosize:update', update);
 		ta.setAttribute('data-autosize-on', true);
+
+		if (setOverflowY) {
+			ta.style.overflowY = 'hidden';
+		}
+		if (setOverflowX) {
+			ta.style.overflowX = 'hidden';
+			ta.style.wordWrap = 'break-word';
+		}
+
 		init();
 	}
 
 	function destroy(ta) {
-		if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA') {
+		if (!(ta && ta.nodeName && ta.nodeName === 'TEXTAREA')) {
 			return;
 		}var evt = document.createEvent('Event');
 		evt.initEvent('autosize:destroy', true, false);
@@ -150,7 +173,7 @@
 		ta.dispatchEvent(evt);
 	}
 
-	var autosize;
+	var autosize = null;
 
 	// Do nothing in IE8 or lower
 	if (typeof window.getComputedStyle !== 'function') {
@@ -164,27 +187,23 @@
 			return el;
 		};
 	} else {
-		autosize = function (el) {
-			if (el && el.length) {
-				Array.prototype.forEach.call(el, assign);
-			} else if (el && el.nodeName) {
-				assign(el);
+		autosize = function (el, options) {
+			if (el) {
+				Array.prototype.forEach.call(el.length ? el : [el], function (x) {
+					return assign(x, options);
+				});
 			}
 			return el;
 		};
 		autosize.destroy = function (el) {
-			if (el && el.length) {
-				Array.prototype.forEach.call(el, destroy);
-			} else if (el && el.nodeName) {
-				destroy(el);
+			if (el) {
+				Array.prototype.forEach.call(el.length ? el : [el], destroy);
 			}
 			return el;
 		};
 		autosize.update = function (el) {
-			if (el && el.length) {
-				Array.prototype.forEach.call(el, update);
-			} else if (el && el.nodeName) {
-				update(el);
+			if (el) {
+				Array.prototype.forEach.call(el.length ? el : [el], update);
 			}
 			return el;
 		};
diff --git a/dest/autosize.min.js b/dest/autosize.min.js
index 3dd49dc..d07c336 100644
--- a/dest/autosize.min.js
+++ b/dest/autosize.min.js
@@ -1,6 +1,6 @@
 /*!
-	Autosize 3.0.2
+	Autosize 3.0.4
 	license: MIT
 	http://www.jacklmoore.com/autosize
 */
-!function(e,t){if("function"==typeof define&&define.amd)define(["exports","module"],t);else if("undefined"!=typeof exports&&"undefined"!=typeof module)t(exports,module);else{var o={exports:{}};t(o.exports,o),e.autosize=o.exports}}(this,function(e,t){"use strict";function o(e){function t(){var t=window.getComputedStyle(e,null);"vertical"===t.resize?e.style.resize="none":"both"===t.resize&&(e.style.resize="horizontal"),i="content-box"===t.boxSizing?-(parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)):parseFloat(t.borderTopWidth)+parseFloat(t.borderBottomWidth),n()}function o(t){var o=e.style.width;e.style.width="0px",e.offsetWidth,e.style.width=o,e.style.overflowY=t,n()}function n(){var t=e.style.height,n=document.documentElement.scrollTop,d=document.body.scrollTop,s=e.style.height;e.style.height="auto";var a=e.scrollHeight+i;if(0===e.scrollHeight)return void(e.style.height=s);e.style.height=a+"px",document.documentElement.scrollTop=n,document.body.scrollTop=d;var u=window.getComputedStyle(e,null);if(u.height!==e.style.height){if("visible"!==e.style.overflowY)return void o("visible")}else if("hidden"!==e.style.overflowY)return o("hidden"),void r();if(t!==e.style.height){var l=document.createEvent("Event");l.initEvent("autosize:resized",!0,!1),e.dispatchEvent(l)}}if(e&&e.nodeName&&"TEXTAREA"===e.nodeName&&!e.hasAttribute("data-autosize-on")){var i,d=function(t){window.removeEventListener("resize",n),e.removeEventListener("input",n),e.removeEventListener("keyup",n),e.removeAttribute("data-autosize-on"),e.removeEventListener("autosize:destroy",d),Object.keys(t).forEach(function(o){e.style[o]=t[o]})}.bind(e,{height:e.style.height,resize:e.style.resize,overflowY:e.style.overflowY});e.addEventListener("autosize:destroy",d),"onpropertychange"in e&&"oninput"in e&&e.addEventListener("keyup",n),window.addEventListener("resize",n),e.addEventListener("input",n),e.addEventListener("autosize:update",n),e.setAttribute("data-autosize-on",!0),t()}}function n(e){if(e&&e.nodeName&&"TEXTAREA"===e.nodeName){var t=document.createEvent("Event");t.initEvent("autosize:destroy",!0,!1),e.dispatchEvent(t)}}function i(e){if(e&&e.nodeName&&"TEXTAREA"===e.nodeName){var t=document.createEvent("Event");t.initEvent("autosize:update",!0,!1),e.dispatchEvent(t)}}var r;"function"!=typeof window.getComputedStyle?(r=function(e){return e},r.destroy=function(e){return e},r.update=function(e){return e}):(r=function(e){return e&&e.length?Array.prototype.forEach.call(e,o):e&&e.nodeName&&o(e),e},r.destroy=function(e){return e&&e.length?Array.prototype.forEach.call(e,n):e&&e.nodeName&&n(e),e},r.update=function(e){return e&&e.length?Array.prototype.forEach.call(e,i):e&&e.nodeName&&i(e),e}),t.exports=r});
\ No newline at end of file
+!function(e,t){if("function"==typeof define&&define.amd)define(["exports","module"],t);else if("undefined"!=typeof exports&&"undefined"!=typeof module)t(exports,module);else{var o={exports:{}};t(o.exports,o),e.autosize=o.exports}}(this,function(e,t){"use strict";function o(e){function t(){var t=window.getComputedStyle(e,null);"vertical"===t.resize?e.style.resize="none":"both"===t.resize&&(e.style.resize="horizontal"),l="content-box"===t.boxSizing?-(parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)):parseFloat(t.borderTopWidth)+parseFloat(t.borderBottomWidth),n()}function o(t){var o=e.style.width;e.style.width="0px",e.offsetWidth,e.style.width=o,u=t,a&&(e.style.overflowY=t),n()}function n(){var t=e.style.height,n=document.documentElement.scrollTop,i=document.body.scrollTop,r=e.style.height;e.style.height="auto";var d=e.scrollHeight+l;if(0===e.scrollHeight)return void(e.style.height=r);e.style.height=d+"px",document.documentElement.scrollTop=n,document.body.scrollTop=i;var s=window.getComputedStyle(e,null);if(s.height!==e.style.height){if("visible"!==u)return void o("visible")}else if("hidden"!==u)return void o("hidden");if(t!==e.style.height){var a=document.createEvent("Event");a.initEvent("autosize:resized",!0,!1),e.dispatchEvent(a)}}var i=void 0===arguments[1]?{}:arguments[1],r=i.setOverflowX,d=void 0===r?!0:r,s=i.setOverflowY,a=void 0===s?!0:s;if(e&&e.nodeName&&"TEXTAREA"===e.nodeName&&!e.hasAttribute("data-autosize-on")){var l=null,u="hidden",v=function(t){window.removeEventListener("resize",n),e.removeEventListener("input",n),e.removeEventListener("keyup",n),e.removeAttribute("data-autosize-on"),e.removeEventListener("autosize:destroy",v),Object.keys(t).forEach(function(o){e.style[o]=t[o]})}.bind(e,{height:e.style.height,resize:e.style.resize,overflowY:e.style.overflowY,overflowX:e.style.overflowX,wordWrap:e.style.wordWrap});e.addEventListener("autosize:destroy",v),"onpropertychange"in e&&"oninput"in e&&e.addEventListener("keyup",n),window.addEventListener("resize",n),e.addEventListener("input",n),e.addEventListener("autosize:update",n),e.setAttribute("data-autosize-on",!0),a&&(e.style.overflowY="hidden"),d&&(e.style.overflowX="hidden",e.style.wordWrap="break-word"),t()}}function n(e){if(e&&e.nodeName&&"TEXTAREA"===e.nodeName){var t=document.createEvent("Event");t.initEvent("autosize:destroy",!0,!1),e.dispatchEvent(t)}}function i(e){if(e&&e.nodeName&&"TEXTAREA"===e.nodeName){var t=document.createEvent("Event");t.initEvent("autosize:update",!0,!1),e.dispatchEvent(t)}}var r=null;"function"!=typeof window.getComputedStyle?(r=function(e){return e},r.destroy=function(e){return e},r.update=function(e){return e}):(r=function(e,t){return e&&Array.prototype.forEach.call(e.length?e:[e],function(e){return o(e,t)}),e},r.destroy=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],n),e},r.update=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],i),e}),t.exports=r});
\ No newline at end of file
diff --git a/package.json b/package.json
index 3b6c14f..96e5ed4 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "autosize",
   "description": "Autosize is a small, stand-alone script to automatically adjust textarea height to fit text.",
-  "version": "3.0.3",
+  "version": "3.0.4",
   "keywords": [
     "textarea",
     "form",
diff --git a/src/autosize.js b/src/autosize.js
index 9847ed5..99fca40 100644
--- a/src/autosize.js
+++ b/src/autosize.js
@@ -1,7 +1,8 @@
-function assign(ta) {
+function assign(ta, {setOverflowX = true, setOverflowY = true} = {}) {
 	if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA' || ta.hasAttribute('data-autosize-on')) return;
 
-	var heightOffset;
+	let heightOffset = null;
+	let overflowY = 'hidden';
 
 	function init() {
 		const style = window.getComputedStyle(ta, null);
@@ -35,7 +36,12 @@ function assign(ta) {
 			ta.style.width = width;
 		}
 
-		ta.style.overflowY = value;
+		overflowY = value;
+
+		if (setOverflowY) {
+			ta.style.overflowY = value;
+		}
+
 		update();
 	}
 
@@ -64,14 +70,13 @@ function assign(ta) {
 		const style = window.getComputedStyle(ta, null);
 
 		if (style.height !== ta.style.height) {
-			if (ta.style.overflowY !== 'visible') {
+			if (overflowY !== 'visible') {
 				changeOverflow('visible');
 				return;
 			}
 		} else {
-			if (ta.style.overflowY !== 'hidden') {
+			if (overflowY !== 'hidden') {
 				changeOverflow('hidden');
-				autosize();
 				return;
 			}
 		}
@@ -97,6 +102,8 @@ function assign(ta) {
 		height: ta.style.height,
 		resize: ta.style.resize,
 		overflowY: ta.style.overflowY,
+		overflowX: ta.style.overflowX,
+		wordWrap: ta.style.wordWrap,
 	});
 
 	ta.addEventListener('autosize:destroy', destroy);
@@ -112,11 +119,20 @@ function assign(ta) {
 	ta.addEventListener('input', update);
 	ta.addEventListener('autosize:update', update);
 	ta.setAttribute('data-autosize-on', true);
-	init();		
+	
+	if (setOverflowY) {
+		ta.style.overflowY = 'hidden';
+	}
+	if (setOverflowX) {
+		ta.style.overflowX = 'hidden';
+		ta.style.wordWrap = 'break-word';
+	}
+
+	init();
 }
 
 function destroy(ta) {
-	if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA') return;
+	if (!(ta && ta.nodeName && ta.nodeName === 'TEXTAREA')) return;
 	const evt = document.createEvent('Event');
 	evt.initEvent('autosize:destroy', true, false);
 	ta.dispatchEvent(evt);
@@ -129,7 +145,7 @@ function update(ta) {
 	ta.dispatchEvent(evt);
 }
 
-var autosize;
+let autosize = null;
 
 // Do nothing in IE8 or lower
 if (typeof window.getComputedStyle !== 'function') {
@@ -137,27 +153,21 @@ if (typeof window.getComputedStyle !== 'function') {
 	autosize.destroy = el => el;
 	autosize.update = el => el;
 } else {
-	autosize = el => {
-		if (el && el.length) {
-			Array.prototype.forEach.call(el, assign);
-		} else if (el && el.nodeName) {
-			assign(el);
+	autosize = (el, options) => {
+		if (el) {
+			Array.prototype.forEach.call(el.length ? el : [el], x => assign(x, options));
 		}
 		return el;
 	};
 	autosize.destroy = el => {
-		if (el && el.length) {
-			Array.prototype.forEach.call(el, destroy);
-		} else if (el && el.nodeName) {
-			destroy(el);
+		if (el) {
+			Array.prototype.forEach.call(el.length ? el : [el], destroy);
 		}
 		return el;
 	};
 	autosize.update = el => {
-		if (el && el.length) {
-			Array.prototype.forEach.call(el, update);
-		} else if (el && el.nodeName) {
-			update(el);
+		if (el) {
+			Array.prototype.forEach.call(el.length ? el : [el], update);
 		}
 		return el;
 	};