react-scroll-into-view-if-needed - npm Package Compare versions

Comparing version 2.1.1 to 2.1.2

dist/es/index.js

 import { createElement, createRef, PureComponent } from 'react';
 import PropTypes from 'prop-types';
 
+var viewport;
+var getViewport = (function () {
+  if (!viewport) {
+    viewport = document.compatMode === 'CSS1Compat' ? document.documentElement : document.scrollingElement || document.documentElement;
+  }
+
+  return viewport;
+});
+
 var isElement = function isElement(el) {
-  return el != null && typeof el == 'object' && (el.nodeType === 1 || el.nodeType === 11);
+  return el != null && typeof el === 'object' && (el.nodeType === 1 || el.nodeType === 11);
 };
@@ -23,3 +32,3 @@
 var isScrollable = function isScrollable(el, skipOverflowHiddenElements) {
-  return hasScrollableSpace(el, 'Y') && canOverflow(el, 'Y', skipOverflowHiddenElements) || hasScrollableSpace(el, 'X') && canOverflow(el, 'X', skipOverflowHiddenElements);
+  return el === getViewport() || hasScrollableSpace(el, 'Y') && canOverflow(el, 'Y', skipOverflowHiddenElements) || hasScrollableSpace(el, 'X') && canOverflow(el, 'X', skipOverflowHiddenElements);
 };
@@ -58,4 +67,4 @@
       skipOverflowHiddenElements = _options$skipOverflow === void 0 ? false : _options$skipOverflow;
-  var checkBoundary = typeof boundary == 'function' ? boundary : function (parent) {
-    return parent !== boundary;
+  var checkBoundary = typeof boundary === 'function' ? boundary : function (node) {
+    return node !== boundary;
   };
@@ -68,3 +77,2 @@
   var targetRect = target.getBoundingClientRect();
-  var viewport = document.scrollingElement || document.documentElement;
   var frames = [];
@@ -74,3 +82,3 @@ var parent;
   while (isElement(parent = target.parentNode || target.host) && checkBoundary(target)) {
-    if (isScrollable(parent, skipOverflowHiddenElements) || parent === viewport) {
+    if (isScrollable(parent, skipOverflowHiddenElements)) {
       frames.push(parent);
@@ -82,4 +90,5 @@ }
 
-  var viewportWidth = window.visualViewport ? window.visualViewport.width : viewport.clientWidth;
-  var viewportHeight = window.visualViewport ? window.visualViewport.height : viewport.clientHeight;
+  var viewport = getViewport();
+  var viewportWidth = window.visualViewport ? window.visualViewport.width : Math.min(viewport.clientWidth, window.innerWidth);
+  var viewportHeight = window.visualViewport ? window.visualViewport.height : Math.min(viewport.clientHeight, window.innerHeight);
   var viewportX = window.scrollX || window.pageXOffset;
@@ -149,3 +158,3 @@ var viewportY = window.scrollY || window.pageYOffset;
       if (viewport === frame) {
-        blockScroll = viewportY + targetBlock - frame.clientHeight / 2;
+        blockScroll = viewportY + targetBlock - viewportHeight / 2;
       } else {
@@ -164,3 +173,3 @@ var _offset = 0 - Math.min(frameRect.top + frameRect.height / 2 - targetBlock, frame.scrollTop);
       if (viewport === frame) {
-        blockScroll = viewportY + targetBlock - frame.clientHeight;
+        blockScroll = viewportY + targetBlock - viewportHeight;
       } else {
@@ -209,3 +218,3 @@ var _offset2 = 0 - Math.min(frameRect.bottom - targetBlock, frame.scrollTop);
       if (viewport === frame) {
-        inlineScroll = viewportX + targetInline - frame.clientWidth / 2;
+        inlineScroll = viewportX + targetInline - viewportWidth / 2;
       } else {
@@ -224,3 +233,3 @@ var _offset6 = 0 - Math.min(frameRect.left + frameRect.width / 2 - targetInline, frame.scrollLeft);
       if (viewport === frame) {
-        inlineScroll = viewportX + targetInline - frame.clientWidth;
+        inlineScroll = viewportX + targetInline - viewportWidth;
       } else {
@@ -260,7 +269,4 @@ var _offset7 = 0 - Math.min(frameRect.right - targetInline, frame.scrollLeft);
 
-var supportsScrollBehavior;
-var scrollingElement;
-
 var isFunction = function isFunction(arg) {
-  return typeof arg == 'function';
+  return typeof arg === 'function';
 };
@@ -277,10 +283,4 @@
 
-  if (!scrollingElement) {
-    scrollingElement = document.scrollingElement || document.documentElement;
-  }
-
-  if (supportsScrollBehavior === undefined) {
-    supportsScrollBehavior = 'scrollBehavior' in scrollingElement.style;
-  }
-
+  var viewport = getViewport();
+  var supportsScrollBehavior = 'scrollBehavior' in viewport.style;
   actions.forEach(function (_ref) {
@@ -298,3 +298,3 @@ var el = _ref.el,
     } else {
-      if (el === scrollingElement) {
+      if (el === viewport) {
         window.scrollTo(left, top);
@@ -301,0 +301,0 @@ } else {

dist/umd/index.js

@@ -9,4 +9,13 @@ (function (global, factory) {
 
+  var viewport;
+  var getViewport = (function () {
+    if (!viewport) {
+      viewport = document.compatMode === 'CSS1Compat' ? document.documentElement : document.scrollingElement || document.documentElement;
+    }
+
+    return viewport;
+  });
+
   var isElement = function isElement(el) {
-    return el != null && typeof el == 'object' && (el.nodeType === 1 || el.nodeType === 11);
+    return el != null && typeof el === 'object' && (el.nodeType === 1 || el.nodeType === 11);
   };
@@ -29,3 +38,3 @@
   var isScrollable = function isScrollable(el, skipOverflowHiddenElements) {
-    return hasScrollableSpace(el, 'Y') && canOverflow(el, 'Y', skipOverflowHiddenElements) || hasScrollableSpace(el, 'X') && canOverflow(el, 'X', skipOverflowHiddenElements);
+    return el === getViewport() || hasScrollableSpace(el, 'Y') && canOverflow(el, 'Y', skipOverflowHiddenElements) || hasScrollableSpace(el, 'X') && canOverflow(el, 'X', skipOverflowHiddenElements);
   };
@@ -64,4 +73,4 @@
         skipOverflowHiddenElements = _options$skipOverflow === void 0 ? false : _options$skipOverflow;
-    var checkBoundary = typeof boundary == 'function' ? boundary : function (parent) {
-      return parent !== boundary;
+    var checkBoundary = typeof boundary === 'function' ? boundary : function (node) {
+      return node !== boundary;
     };
@@ -74,3 +83,2 @@
     var targetRect = target.getBoundingClientRect();
-    var viewport = document.scrollingElement || document.documentElement;
     var frames = [];
@@ -80,3 +88,3 @@ var parent;
     while (isElement(parent = target.parentNode || target.host) && checkBoundary(target)) {
-      if (isScrollable(parent, skipOverflowHiddenElements) || parent === viewport) {
+      if (isScrollable(parent, skipOverflowHiddenElements)) {
         frames.push(parent);
@@ -88,4 +96,5 @@ }
 
-    var viewportWidth = window.visualViewport ? window.visualViewport.width : viewport.clientWidth;
-    var viewportHeight = window.visualViewport ? window.visualViewport.height : viewport.clientHeight;
+    var viewport = getViewport();
+    var viewportWidth = window.visualViewport ? window.visualViewport.width : Math.min(viewport.clientWidth, window.innerWidth);
+    var viewportHeight = window.visualViewport ? window.visualViewport.height : Math.min(viewport.clientHeight, window.innerHeight);
     var viewportX = window.scrollX || window.pageXOffset;
@@ -155,3 +164,3 @@ var viewportY = window.scrollY || window.pageYOffset;
         if (viewport === frame) {
-          blockScroll = viewportY + targetBlock - frame.clientHeight / 2;
+          blockScroll = viewportY + targetBlock - viewportHeight / 2;
         } else {
@@ -170,3 +179,3 @@ var _offset = 0 - Math.min(frameRect.top + frameRect.height / 2 - targetBlock, frame.scrollTop);
         if (viewport === frame) {
-          blockScroll = viewportY + targetBlock - frame.clientHeight;
+          blockScroll = viewportY + targetBlock - viewportHeight;
         } else {
@@ -215,3 +224,3 @@ var _offset2 = 0 - Math.min(frameRect.bottom - targetBlock, frame.scrollTop);
         if (viewport === frame) {
-          inlineScroll = viewportX + targetInline - frame.clientWidth / 2;
+          inlineScroll = viewportX + targetInline - viewportWidth / 2;
         } else {
@@ -230,3 +239,3 @@ var _offset6 = 0 - Math.min(frameRect.left + frameRect.width / 2 - targetInline, frame.scrollLeft);
         if (viewport === frame) {
-          inlineScroll = viewportX + targetInline - frame.clientWidth;
+          inlineScroll = viewportX + targetInline - viewportWidth;
         } else {
@@ -266,7 +275,4 @@ var _offset7 = 0 - Math.min(frameRect.right - targetInline, frame.scrollLeft);
 
-  var supportsScrollBehavior;
-  var scrollingElement;
-
   var isFunction = function isFunction(arg) {
-    return typeof arg == 'function';
+    return typeof arg === 'function';
   };
@@ -283,10 +289,4 @@
 
-    if (!scrollingElement) {
-      scrollingElement = document.scrollingElement || document.documentElement;
-    }
-
-    if (supportsScrollBehavior === undefined) {
-      supportsScrollBehavior = 'scrollBehavior' in scrollingElement.style;
-    }
-
+    var viewport = getViewport();
+    var supportsScrollBehavior = 'scrollBehavior' in viewport.style;
     actions.forEach(function (_ref) {
@@ -304,3 +304,3 @@ var el = _ref.el,
       } else {
-        if (el === scrollingElement) {
+        if (el === viewport) {
           window.scrollTo(left, top);
@@ -307,0 +307,0 @@ } else {

package.json

 {
   "name": "react-scroll-into-view-if-needed",
-  "version": "2.1.1",
+  "version": "2.1.2",
   "description": "A thin component wrapper around scroll-into-view-if-needed",
@@ -25,3 +25,3 @@ "main": "dist/umd/index.js",
     "babel-eslint": "^8.2.3",
-    "babel-jest": "^22.4.3",
+    "babel-jest": "^23.0.1",
     "babel-plugin-external-helpers": "^6.22.0",
@@ -32,3 +32,3 @@ "babel-preset-env": "^1.7.0",
     "coveralls": "^3.0.1",
-    "cross-env": "^5.1.5",
+    "cross-env": "^5.1.6",
     "enzyme": "^3.3.0",
@@ -38,14 +38,14 @@ "enzyme-adapter-react-16": "^1.1.1",
     "eslint-config-airbnb": "^16.1.0",
-    "eslint-plugin-import": "^2.11.0",
+    "eslint-plugin-import": "^2.12.0",
     "eslint-plugin-jsx-a11y": "^6.0.3",
     "eslint-plugin-react": "^7.8.2",
-    "jest": "^22.4.3",
+    "jest": "^23.0.1",
     "prop-types": "^15.6.1",
-    "react": "^16.3.2",
-    "react-dom": "^16.3.2",
-    "rollup": "^0.58.2",
+    "react": "^16.4.0",
+    "react-dom": "^16.4.0",
+    "rollup": "^0.59.4",
     "rollup-plugin-babel": "^3.0.4",
     "rollup-plugin-commonjs": "^9.1.3",
     "rollup-plugin-node-resolve": "^3.3.0",
-    "scroll-into-view-if-needed": "^2.2.2"
+    "scroll-into-view-if-needed": "^2.2.4"
   },
@@ -52,0 +52,0 @@ "scripts": {

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

Lines of code

1773

increased by0.11%

Worsened metrics

Total package byte prevSize

533143

decreased by-0.68%

No dependency changes