react-scroll - npm Package Compare versions

Comparing version 1.8.7 to 1.8.8

CHANGELOG.md

 #### Changelog
->1.8.7
-- Published peerDependencies for React 18.
->1.8.6
+
+> 1.8.8
+
+- Prevent unexpected spy callback removal on multiple unmount calls [PR](https://github.com/fisshy/react-scroll/pull/519)
+
+> 1.8.6
+
 - Fixed hashSpy to work within Nextjs [Issue](https://github.com/fisshy/react-scroll/issues/476)
->1.8.3
+
+> 1.8.3
+
 - Fix for scroll offset [PR](https://github.com/fisshy/react-scroll/pull/469)
+
 > 1.8.1
+
 - Better hash history
+
 > 1.8.0
+
 - Support for horizontal scroll
+
 > 1.7.16
+
 - Fixes issues from 1.7.15
+
 > 1.7.15
+
 - Fixed calculation for the offset
+
 > 1.7.14
+
 - Removed unsafe warnings
+
 > 1.7.13
-- Removed deprecated warnings, Ensure 'begin' event fires on all scroll events. 
+
+- Removed deprecated warnings, Ensure 'begin' event fires on all scroll events.
+
 > 1.7.12
+
 - Animating scroll-time is now consistent
 
 > 1.7.11
+
 - Should now scroll to exact position
 
 > 1.7.9
-- Set active now properly sets it's state after unmount and mount. 
 
+- Set active now properly sets it's state after unmount and mount.
+
 > 1.7.7
+
 - Minor performance improvements
 
 > 1.7.6
-- Support targeting elements with className 
 
+- Support targeting elements with className
+
 > 1.7.5
+
 - Improved performance.
 
 > 1.7.0
+
 - Deprecated Helpers.js
@@ -44,5 +70,7 @@ - Allow mulptiple scrolls
 > 1.6.5
+
 - Refactored some logic regarding hashspy, now have to set containerId if you want to scroll a specific element.
 
 > 1.6.3
+
 - Simplified cancelation events
@@ -52,32 +80,43 @@ - Now possible to nest containers
 > 1.6.1
+
 - Ability to scroll overflown elements and using hashes for history.
 
 > 1.5.5
+
 - React v16 support
 
 > 1.5.4
+
 - Allows testing with jsdom and jest. Uses ref instead of findDOMNode
 
 > 1.5.3
+
 - Fixes react error
 
 > 1.5.2
+
 - Fixes the way everything is built and transformed with babel.
 
 > 1.5.0
+
 - Now using class and extending React.Component to match later versions of react.
 
 > v1.4.8
+
 - Additional easings and animations added
 
 > v1.4.0
+
 - It's now possible to nest scroll areas and get a callback when "link is active"
 
 > v1.3.0
+
 - Remove directlink, now just use Link.
 
 > v1.2.0
+
 - Now using passive event listeners.
 
 > v1.1.0
+
 - now possible to set initial active link on componentDidMount ( see README or examples code )
@@ -87,2 +126,3 @@ - removed unnecessary events for scroll.
 > v1.0.24
+
 - you can now pass any native property to Link/Element
@@ -92,14 +132,19 @@ - patched minor bugs from v1.0.21 > v1.0.24
 > v1.0.21
+
 - scrollToBottom and scrollMore now works inside a container.
 
 > v1.0.20
+
 - Published, somehow the publish failed
 
 > v1.0.19
+
 - Property warnings has now been removed.
 
 > v1.0.18
+
 - It's now possible to scroll within a container, checkout the code under examples.
 
 > v1.0.17
+
 - isDynamic property has been added. To allow scrollSpy to recalculate components that expand

modules/__tests__/animate-scroll-test.js

@@ -1,31 +0,22 @@
-'use strict';
+"use strict";
 
-var _reactDom = require('react-dom');
+var _reactDom = require("react-dom");
 
-var _testUtils = require('react-dom/test-utils');
+var _react = require("react");
 
-var _testUtils2 = _interopRequireDefault(_testUtils);
-
-var _react = require('react');
-
 var _react2 = _interopRequireDefault(_react);
 
-var _expect = require('expect');
+var _expect = require("expect");
 
 var _expect2 = _interopRequireDefault(_expect);
 
-var _animateScroll = require('../mixins/animate-scroll');
+var _animateScroll = require("../mixins/animate-scroll");
 
 var _animateScroll2 = _interopRequireDefault(_animateScroll);
 
-var _scrollEvents = require('../mixins/scroll-events.js');
+var _utility = require("./utility");
 
-var _scrollEvents2 = _interopRequireDefault(_scrollEvents);
-
-var _utility = require('./utility');
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-describe('AnimateScroll', function () {
-
+describe("AnimateScroll", function () {
   var node = void 0;
@@ -37,112 +28,116 @@ var node2 = void 0;
   var tallComponent = _react2.default.createElement(
-    'div',
-    { id: 'hugeComponent' },
+    "div",
+    { id: "hugeComponent" },
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollToTop();
         } },
-      'Scroll To Top!'
+      "Scroll To Top!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollTo(100);
         } },
-      'Scroll To 100!'
+      "Scroll To 100!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollMore(10);
         } },
-      'Scroll More!'
+      "Scroll More!"
     ),
-    _react2.default.createElement('div', { style: { height: '10000px' } })
+    _react2.default.createElement("div", { style: { height: "10000px" } })
   );
 
   var tallComponent2 = _react2.default.createElement(
-    'div',
-    { id: 'hugeComponent2' },
+    "div",
+    { id: "hugeComponent2" },
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollToTop();
         } },
-      'Scroll To Top!'
+      "Scroll To Top!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollTo(100);
         } },
-      'Scroll To 100!'
+      "Scroll To 100!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollMore(10);
         } },
-      'Scroll More!'
+      "Scroll More!"
     ),
-    _react2.default.createElement('div', { style: { height: '10000px' } })
+    _react2.default.createElement("div", { style: { height: "10000px" } })
   );
 
   var wideComponent = _react2.default.createElement(
-    'div',
-    { id: 'wideComponent' },
+    "div",
+    { id: "wideComponent" },
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollToTop({ horizontal: true });
         } },
-      'Scroll To Top!'
+      "Scroll To Top!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollTo(100, { horizontal: true });
         } },
-      'Scroll To 100!'
+      "Scroll To 100!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollMore(10, { horizontal: true });
         } },
-      'Scroll More!'
+      "Scroll More!"
     ),
-    _react2.default.createElement('div', { style: { width: '10000px', height: '100px', display: 'inline-block' } })
+    _react2.default.createElement("div", {
+      style: { width: "10000px", height: "100px", display: "inline-block" }
+    })
   );
 
   var wideComponent2 = _react2.default.createElement(
-    'div',
-    { id: 'wideComponent2' },
+    "div",
+    { id: "wideComponent2" },
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollToTop({ horizontal: true });
         } },
-      'Scroll To Top!'
+      "Scroll To Top!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollTo(100, { horizontal: true });
         } },
-      'Scroll To 100!'
+      "Scroll To 100!"
     ),
     _react2.default.createElement(
-      'a',
+      "a",
       { onClick: function onClick() {
           return _animateScroll2.default.scrollMore(10, { horizontal: true });
         } },
-      'Scroll More!'
+      "Scroll More!"
     ),
-    _react2.default.createElement('div', { style: { width: '10000px', height: '100px', display: 'inline-block' } })
+    _react2.default.createElement("div", {
+      style: { width: "10000px", height: "100px", display: "inline-block" }
+    })
   );
 
   beforeEach(function () {
-    node = document.createElement('div');
-    node2 = document.createElement('div');
+    node = document.createElement("div");
+    node2 = document.createElement("div");
     document.body.appendChild(node);
@@ -165,3 +160,3 @@ document.body.appendChild(node2);
 
-  it('renders a component taller than the window height', function () {
+  it("renders a component taller than the window height", function () {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -172,3 +167,3 @@ (0, _expect2.default)(node.offsetHeight > window.innerHeight).toBe(true);
 
-  it('renders a component wider than the window width', function () {
+  it("renders a component wider than the window width", function () {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -179,3 +174,3 @@ (0, _expect2.default)(node.offsetWidth > window.innerWidth).toBe(true);
 
-  it('scrolls to an absolute position vertically', function (done) {
+  it("scrolls to an absolute position vertically", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -192,3 +187,3 @@ window.scrollTo(0, 1000);
 
-  it('scrolls to an absolute position horizontally', function (done) {
+  it("scrolls to an absolute position horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -205,5 +200,4 @@ window.scrollTo(1000, 0);
 
-  it('scrolls to a position given a node as a container vertically', function (done) {
+  it("scrolls to a position given a node as a container vertically", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
-
       window.scrollTo(0, 0);
@@ -221,9 +215,12 @@ node.style.cssText = "position: fixed; top: 0; bottom: 200px; width 100%; overflow: scroll";
 
-  it('scrolls to a position given a node as a container horizontally', function (done) {
+  it("scrolls to a position given a node as a container horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
-
       window.scrollTo(0, 0);
       node.style.cssText = "position: fixed; left: 0; right: 200px; height 100%; overflow: scroll";
 
-      _animateScroll2.default.scrollTo(400, { duration: duration, container: node, horizontal: true });
+      _animateScroll2.default.scrollTo(400, {
+        duration: duration,
+        container: node,
+        horizontal: true
+      });
       setTimeout(function () {
@@ -236,3 +233,3 @@ (0, _expect2.default)(node.scrollLeft).toEqual(400);
 
-  it('scrolls to an absolute position even if current position is higher vertically', function (done) {
+  it("scrolls to an absolute position even if current position is higher vertically", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -250,3 +247,3 @@ window.scrollTo(0, 1000);
 
-  it('scrolls to an absolute position even if current position is farther horizontally', function (done) {
+  it("scrolls to an absolute position even if current position is farther horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -264,3 +261,3 @@ window.scrollTo(1000, 0);
 
-  it('scrolls to top', function (done) {
+  it("scrolls to top", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -277,3 +274,3 @@ window.scrollTo(0, 1000);
 
-  it('scrolls to top horizontally', function (done) {
+  it("scrolls to top horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -290,3 +287,3 @@ window.scrollTo(1000, 0);
 
-  it('scrolls to bottom', function (done) {
+  it("scrolls to bottom", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -301,3 +298,3 @@ _animateScroll2.default.scrollToBottom({ duration: duration });
 
-  it('scrolls to bottom horizontally', function (done) {
+  it("scrolls to bottom horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -312,3 +309,3 @@ _animateScroll2.default.scrollToBottom({ duration: duration, horizontal: true });
 
-  it('scrolls to a position relative to the current position vertically', function (done) {
+  it("scrolls to a position relative to the current position vertically", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -334,3 +331,3 @@ window.scrollTo(0, 111);
 
-  it('scrolls to a position relative to the current position horizontally', function (done) {
+  it("scrolls to a position relative to the current position horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -356,3 +353,3 @@ window.scrollTo(111, 0);
 
-  it('can take 0 as a duration argument vertically', function (done) {
+  it("can take 0 as a duration argument vertically", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -368,3 +365,3 @@ _animateScroll2.default.scrollTo(120, { duration: 0 });
 
-  it('can take 0 as a duration argument horizontally', function (done) {
+  it("can take 0 as a duration argument horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -380,3 +377,3 @@ _animateScroll2.default.scrollTo(120, { duration: 0, horizontal: true });
 
-  it('can take a function as a duration argument vertically', function (done) {
+  it("can take a function as a duration argument vertically", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -395,3 +392,3 @@ _animateScroll2.default.scrollTo(120, { duration: function duration(v) {
 
-  it('can take a function as a duration argument horizontally', function (done) {
+  it("can take a function as a duration argument horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -410,3 +407,3 @@ _animateScroll2.default.scrollTo(120, { duration: function duration(v) {
 
-  it('can scroll two DIVs vertically', function (done) {
+  it("can scroll two DIVs vertically", function (done) {
     (0, _reactDom.render)(tallComponent, node, function () {
@@ -430,3 +427,3 @@ (0, _reactDom.render)(tallComponent2, node2, function () {
 
-  it('can scroll two DIVs horizontally', function (done) {
+  it("can scroll two DIVs horizontally", function (done) {
     (0, _utility.renderHorizontal)(wideComponent, node, function () {
@@ -439,4 +436,12 @@ (0, _utility.renderHorizontal)(wideComponent2, node2, function () {
 
-        _animateScroll2.default.scrollTo(300, { duration: duration, container: node, horizontal: true });
-        _animateScroll2.default.scrollTo(400, { duration: duration, container: node2, horizontal: true });
+        _animateScroll2.default.scrollTo(300, {
+          duration: duration,
+          container: node,
+          horizontal: true
+        });
+        _animateScroll2.default.scrollTo(400, {
+          duration: duration,
+          container: node2,
+          horizontal: true
+        });
         setTimeout(function () {
@@ -443,0 +448,0 @@ (0, _expect2.default)(node.scrollLeft).toEqual(300);

modules/__tests__/events-test.js

@@ -1,44 +0,41 @@
-'use strict';
+"use strict";
 
-var _reactDom = require('react-dom');
+var _reactDom = require("react-dom");
 
-var _testUtils = require('react-dom/test-utils');
+var _testUtils = require("react-dom/test-utils");
 
 var _testUtils2 = _interopRequireDefault(_testUtils);
 
-var _react = require('react');
+var _react = require("react");
 
 var _react2 = _interopRequireDefault(_react);
 
-var _Element = require('../components/Element.js');
+var _Element = require("../components/Element.js");
 
 var _Element2 = _interopRequireDefault(_Element);
 
-var _Link = require('../components/Link.js');
+var _Link = require("../components/Link.js");
 
 var _Link2 = _interopRequireDefault(_Link);
 
-var _scrollEvents = require('../mixins/scroll-events.js');
+var _scrollEvents = require("../mixins/scroll-events.js");
 
 var _scrollEvents2 = _interopRequireDefault(_scrollEvents);
 
-var _animateScroll = require('../mixins/animate-scroll.js');
+var _animateScroll = require("../mixins/animate-scroll.js");
 
 var _animateScroll2 = _interopRequireDefault(_animateScroll);
 
-var _expect = require('expect');
+var _expect = require("expect");
 
 var _expect2 = _interopRequireDefault(_expect);
 
-var _assert = require('assert');
+var _utility = require("./utility");
 
-var _assert2 = _interopRequireDefault(_assert);
-
-var _utility = require('./utility');
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-/* React */
-describe('Events', function () {
+/* Test */
 
+/* Components to test */
+describe("Events", function () {
   var node = void 0;
@@ -51,5 +48,5 @@ var scrollDuration = 10;
         return {
-          display: 'flex',
-          flexDirection: 'row',
-          flexWrap: 'nowrap'
+          display: "flex",
+          flexDirection: "row",
+          flexWrap: "nowrap"
         };
@@ -61,59 +58,95 @@ } else {
     return _react2.default.createElement(
-      'div',
+      "div",
       { style: { style: style } },
       _react2.default.createElement(
-        'ul',
+        "ul",
         null,
         _react2.default.createElement(
-          'li',
+          "li",
           null,
           _react2.default.createElement(
             _Link2.default,
-            { to: 'test1', spy: true, smooth: true, duration: scrollDuration, horizontal: horizontal },
-            'Test 1'
+            {
+              to: "test1",
+              spy: true,
+              smooth: true,
+              duration: scrollDuration,
+              horizontal: horizontal
+            },
+            "Test 1"
           )
         ),
         _react2.default.createElement(
-          'li',
+          "li",
           null,
           _react2.default.createElement(
             _Link2.default,
-            { to: 'test2', spy: true, smooth: true, duration: scrollDuration, horizontal: horizontal },
-            'Test 2'
+            {
+              to: "test2",
+              spy: true,
+              smooth: true,
+              duration: scrollDuration,
+              horizontal: horizontal
+            },
+            "Test 2"
           )
         ),
         _react2.default.createElement(
-          'li',
+          "li",
           null,
           _react2.default.createElement(
             _Link2.default,
-            { to: 'test3', spy: true, smooth: true, duration: scrollDuration, horizontal: horizontal },
-            'Test 3'
+            {
+              to: "test3",
+              spy: true,
+              smooth: true,
+              duration: scrollDuration,
+              horizontal: horizontal
+            },
+            "Test 3"
           )
         ),
         _react2.default.createElement(
-          'li',
+          "li",
           null,
           _react2.default.createElement(
             _Link2.default,
-            { to: 'test4', spy: true, smooth: true, duration: scrollDuration, horizontal: horizontal },
-            'Test 4'
+            {
+              to: "test4",
+              spy: true,
+              smooth: true,
+              duration: scrollDuration,
+              horizontal: horizontal
+            },
+            "Test 4"
           )
         ),
         _react2.default.createElement(
-          'li',
+          "li",
           null,
           _react2.default.createElement(
             _Link2.default,
-            { to: 'test5', spy: true, smooth: true, duration: scrollDuration, horizontal: horizontal },
-            'Test 5'
+            {
+              to: "test5",
+              spy: true,
+              smooth: true,
+              duration: scrollDuration,
+              horizontal: horizontal
+            },
+            "Test 5"
           )
         ),
         _react2.default.createElement(
-          'li',
+          "li",
           null,
           _react2.default.createElement(
             _Link2.default,
-            { to: 'test6', spy: true, smooth: true, duration: scrollDuration, horizontal: horizontal },
-            'Test 6'
+            {
+              to: "test6",
+              spy: true,
+              smooth: true,
+              duration: scrollDuration,
+              horizontal: horizontal
+            },
+            "Test 6"
           )
@@ -124,29 +157,29 @@ )
         _Element2.default,
-        { name: 'test1', className: 'element' },
-        'test 1'
+        { name: "test1", className: "element" },
+        "test 1"
       ),
       _react2.default.createElement(
         _Element2.default,
-        { name: 'test2', className: 'element' },
-        'test 2'
+        { name: "test2", className: "element" },
+        "test 2"
       ),
       _react2.default.createElement(
         _Element2.default,
-        { name: 'test3', className: 'element' },
-        'test 3'
+        { name: "test3", className: "element" },
+        "test 3"
       ),
       _react2.default.createElement(
         _Element2.default,
-        { name: 'test4', className: 'element' },
-        'test 4'
+        { name: "test4", className: "element" },
+        "test 4"
       ),
       _react2.default.createElement(
         _Element2.default,
-        { name: 'test5', className: 'element' },
-        'test 5'
+        { name: "test5", className: "element" },
+        "test 5"
       ),
       _react2.default.createElement(
-        'div',
-        { id: 'test6', className: 'element' },
-        'test 6'
+        "div",
+        { id: "test6", className: "element" },
+        "test 6"
       )
@@ -157,3 +190,3 @@ );
   beforeEach(function () {
-    node = document.createElement('div');
+    node = document.createElement("div");
     document.body.innerHtml = "";
@@ -164,4 +197,4 @@ document.body.appendChild(node);
   afterEach(function () {
-    _scrollEvents2.default.scrollEvent.remove('begin');
-    _scrollEvents2.default.scrollEvent.remove('end');
+    _scrollEvents2.default.scrollEvent.remove("begin");
+    _scrollEvents2.default.scrollEvent.remove("end");
     (0, _reactDom.unmountComponentAtNode)(node);
@@ -171,10 +204,8 @@ document.body.removeChild(node);
 
-  it('direct link calls begin and end event with vertical scroll', function (done) {
-
+  it("direct link calls begin and end event with vertical scroll", function (done) {
     (0, _reactDom.render)(component(false), node, function () {
+      var link = node.querySelectorAll("a")[5];
 
-      var link = node.querySelectorAll('a')[5];
-
       var begin = function begin(to, target) {
-        (0, _expect2.default)(to).toEqual('test6');
+        (0, _expect2.default)(to).toEqual("test6");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
@@ -184,3 +215,3 @@ };
       var end = function end(to, target) {
-        (0, _expect2.default)(to).toEqual('test6');
+        (0, _expect2.default)(to).toEqual("test6");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
@@ -190,4 +221,4 @@ done();
 
-      _scrollEvents2.default.scrollEvent.register('begin', begin);
-      _scrollEvents2.default.scrollEvent.register('end', end);
+      _scrollEvents2.default.scrollEvent.register("begin", begin);
+      _scrollEvents2.default.scrollEvent.register("end", end);
 
@@ -198,10 +229,8 @@ _testUtils2.default.Simulate.click(link);
 
-  it('direct link calls begin and end event with horizontal scroll', function (done) {
-
+  it("direct link calls begin and end event with horizontal scroll", function (done) {
     (0, _utility.renderHorizontal)(component(true), node, function () {
+      var link = node.querySelectorAll("a")[5];
 
-      var link = node.querySelectorAll('a')[5];
-
       var begin = function begin(to, target) {
-        (0, _expect2.default)(to).toEqual('test6');
+        (0, _expect2.default)(to).toEqual("test6");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
@@ -211,3 +240,3 @@ };
       var end = function end(to, target) {
-        (0, _expect2.default)(to).toEqual('test6');
+        (0, _expect2.default)(to).toEqual("test6");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
@@ -217,4 +246,4 @@ done();
 
-      _scrollEvents2.default.scrollEvent.register('begin', begin);
-      _scrollEvents2.default.scrollEvent.register('end', end);
+      _scrollEvents2.default.scrollEvent.register("begin", begin);
+      _scrollEvents2.default.scrollEvent.register("end", end);
 
@@ -225,10 +254,8 @@ _testUtils2.default.Simulate.click(link);
 
-  it('it calls begin and end event with vertical scroll', function (done) {
-
+  it("it calls begin and end event with vertical scroll", function (done) {
     (0, _reactDom.render)(component(false), node, function () {
+      var link = node.querySelectorAll("a")[2];
 
-      var link = node.querySelectorAll('a')[2];
-
       var begin = function begin(to, target) {
-        (0, _expect2.default)(to).toEqual('test3');
+        (0, _expect2.default)(to).toEqual("test3");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
@@ -238,8 +265,8 @@ };
       var end = function end(to, target) {
-        (0, _expect2.default)(to).toEqual('test3');
+        (0, _expect2.default)(to).toEqual("test3");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
       };
 
-      _scrollEvents2.default.scrollEvent.register('begin', begin);
-      _scrollEvents2.default.scrollEvent.register('end', end);
+      _scrollEvents2.default.scrollEvent.register("begin", begin);
+      _scrollEvents2.default.scrollEvent.register("end", end);
 
@@ -255,10 +282,8 @@ _testUtils2.default.Simulate.click(link);
 
-  it('it calls begin and end event with horizontal scroll', function (done) {
-
+  it("it calls begin and end event with horizontal scroll", function (done) {
     (0, _utility.renderHorizontal)(component(true), node, function () {
+      var link = node.querySelectorAll("a")[2];
 
-      var link = node.querySelectorAll('a')[2];
-
       var begin = function begin(to, target) {
-        (0, _expect2.default)(to).toEqual('test3');
+        (0, _expect2.default)(to).toEqual("test3");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
@@ -268,8 +293,8 @@ };
       var end = function end(to, target) {
-        (0, _expect2.default)(to).toEqual('test3');
+        (0, _expect2.default)(to).toEqual("test3");
         (0, _expect2.default)(_testUtils2.default.isDOMComponent(target)).toEqual(true);
       };
 
-      _scrollEvents2.default.scrollEvent.register('begin', begin);
-      _scrollEvents2.default.scrollEvent.register('end', end);
+      _scrollEvents2.default.scrollEvent.register("begin", begin);
+      _scrollEvents2.default.scrollEvent.register("end", end);
 
@@ -287,3 +312,2 @@ _testUtils2.default.Simulate.click(link);
     (0, _reactDom.render)(component(false), node, function () {
-
       var end = function end(to, target, endPosition) {
@@ -294,3 +318,3 @@ (0, _expect2.default)(endPosition).toEqual(100);
 
-      _scrollEvents2.default.scrollEvent.register('end', end);
+      _scrollEvents2.default.scrollEvent.register("end", end);
 
@@ -303,3 +327,2 @@ _animateScroll2.default.scrollTo(100, scrollDuration);
     (0, _utility.renderHorizontal)(component(true), node, function () {
-
       var end = function end(to, target, endPosition) {
@@ -310,3 +333,3 @@ (0, _expect2.default)(endPosition).toEqual(100);
 
-      _scrollEvents2.default.scrollEvent.register('end', end);
+      _scrollEvents2.default.scrollEvent.register("end", end);
 
@@ -319,5 +342,2 @@ _animateScroll2.default.scrollTo(100, {
   });
-});
-/* Test */
-
-/* Components to test */
+}); /* React */

modules/__tests__/scroll-cancellation-test.js

@@ -1,25 +0,17 @@
-'use strict';
+"use strict";
 
 var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-var _reactDom = require('react-dom');
+var _reactDom = require("react-dom");
 
-var _testUtils = require('react-dom/test-utils');
+var _react = require("react");
 
-var _testUtils2 = _interopRequireDefault(_testUtils);
-
-var _react = require('react');
-
 var _react2 = _interopRequireDefault(_react);
 
-var _expect = require('expect');
+var _expect = require("expect");
 
 var _expect2 = _interopRequireDefault(_expect);
 
-var _assert = require('assert');
+var _animateScroll = require("../mixins/animate-scroll.js");
 
-var _assert2 = _interopRequireDefault(_assert);
-
-var _animateScroll = require('../mixins/animate-scroll.js');
-
 var _animateScroll2 = _interopRequireDefault(_animateScroll);
@@ -36,4 +28,4 @@
 
-describe('Scroll cancelation', function () {
-  var node = document.createElement('div');
+describe("Scroll cancelation", function () {
+  var node = document.createElement("div");
   document.body.innerHtml = "";
@@ -74,9 +66,15 @@
         _createClass(TestComponent, [{
-          key: 'render',
+          key: "render",
           value: function render() {
             return _react2.default.createElement(
-              'div',
+              "div",
               null,
-              _react2.default.createElement('input', { onKeyDown: this.handleKeyDown }),
-              _react2.default.createElement('div', { style: { height: "3000px", width: "100%", background: "repeating-linear-gradient(to bottom, white, black 100px)" } })
+              _react2.default.createElement("input", { onKeyDown: this.handleKeyDown }),
+              _react2.default.createElement("div", {
+                style: {
+                  height: "3000px",
+                  width: "100%",
+                  background: "repeating-linear-gradient(to bottom, white, black 100px)"
+                }
+              })
             );
@@ -91,11 +89,11 @@ }
 
-      dispatchDOMKeydownEvent(13, node.querySelector('input'));
+      dispatchDOMKeydownEvent(13, node.querySelector("input"));
       wait(duration * 2, function () {
         (0, _expect2.default)(window.scrollY || window.pageYOffset).toBeGreaterThanOrEqualTo(distance);
 
-        dispatchDOMKeydownEvent(13, node.querySelector('input'));
+        dispatchDOMKeydownEvent(13, node.querySelector("input"));
         wait(duration * 2, function () {
           (0, _expect2.default)(window.scrollY || window.pageYOffset).toBeGreaterThanOrEqualTo(distance * 2);
 
-          dispatchDOMKeydownEvent(13, node.querySelector('input'));
+          dispatchDOMKeydownEvent(13, node.querySelector("input"));
           wait(duration * 2, function () {
@@ -130,3 +128,7 @@ (0, _expect2.default)(window.scrollY || window.pageYOffset).toBeGreaterThanOrEqualTo(distance * 3);
           return _ret2 = (_temp2 = (_this2 = _possibleConstructorReturn(this, (_ref2 = TestComponent.__proto__ || Object.getPrototypeOf(TestComponent)).call.apply(_ref2, [this].concat(args))), _this2), _this2.handleKeyDown = function (e) {
-            _animateScroll2.default.scrollMore(distance, { smooth: true, duration: duration, horizontal: true });
+            _animateScroll2.default.scrollMore(distance, {
+              smooth: true,
+              duration: duration,
+              horizontal: true
+            });
             e.stopPropagation();
@@ -137,9 +139,15 @@ }, _temp2), _possibleConstructorReturn(_this2, _ret2);
         _createClass(TestComponent, [{
-          key: 'render',
+          key: "render",
           value: function render() {
             return _react2.default.createElement(
-              'div',
+              "div",
               null,
-              _react2.default.createElement('input', { onKeyDown: this.handleKeyDown }),
-              _react2.default.createElement('div', { style: { width: "3000px", height: "100%", background: "repeating-linear-gradient(to right, white, black 100px)" } })
+              _react2.default.createElement("input", { onKeyDown: this.handleKeyDown }),
+              _react2.default.createElement("div", {
+                style: {
+                  width: "3000px",
+                  height: "100%",
+                  background: "repeating-linear-gradient(to right, white, black 100px)"
+                }
+              })
             );
@@ -154,11 +162,11 @@ }
 
-      dispatchDOMKeydownEvent(13, node.querySelector('input'));
+      dispatchDOMKeydownEvent(13, node.querySelector("input"));
       wait(duration * 2, function () {
         (0, _expect2.default)(window.scrollX || window.pageXOffset).toBeGreaterThanOrEqualTo(distance);
 
-        dispatchDOMKeydownEvent(13, node.querySelector('input'));
+        dispatchDOMKeydownEvent(13, node.querySelector("input"));
         wait(duration * 2, function () {
           (0, _expect2.default)(window.scrollX || window.pageXOffset).toBeGreaterThanOrEqualTo(distance * 2);
 
-          dispatchDOMKeydownEvent(13, node.querySelector('input'));
+          dispatchDOMKeydownEvent(13, node.querySelector("input"));
           wait(duration * 2, function () {
@@ -180,5 +188,5 @@ (0, _expect2.default)(window.scrollX || window.pageXOffset).toBeGreaterThanOrEqualTo(distance * 3);
   var event = document.createEvent("KeyboardEvent");
-  var initMethod = typeof event.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";
+  var initMethod = typeof event.initKeyboardEvent !== "undefined" ? "initKeyboardEvent" : "initKeyEvent";
   event[initMethod]("keydown", true, true, window, 0, 0, 0, 0, 0, keyCode);
   element.dispatchEvent(event);
 };

modules/mixins/scroll-spy.js

@@ -84,6 +84,6 @@ 'use strict';
     scrollSpy.scrollSpyContainers.forEach(function (c) {
-      return c.spyCallbacks && c.spyCallbacks.length && c.spyCallbacks.splice(c.spyCallbacks.indexOf(spyHandler), 1);
+      return c.spyCallbacks && c.spyCallbacks.length && c.spyCallbacks.indexOf(spyHandler) > -1 && c.spyCallbacks.splice(c.spyCallbacks.indexOf(spyHandler), 1);
     });
 
-    if (scrollSpy.spySetState && scrollSpy.spySetState.length) {
+    if (scrollSpy.spySetState && scrollSpy.spySetState.length && scrollSpy.spySetState.indexOf(stateHandler) > -1) {
       scrollSpy.spySetState.splice(scrollSpy.spySetState.indexOf(stateHandler), 1);
@@ -90,0 +90,0 @@ }

package.json

 {
   "name": "react-scroll",
-  "version": "1.8.7",
+  "version": "1.8.8",
   "description": "A scroll component for React.js",
@@ -62,3 +62,2 @@ "main": "modules",
     "react": "^16.13.1",
-    "react-addons-test-utils": "^15.6.2",
     "react-dom": "^16.13.1",
@@ -65,0 +64,0 @@ "sinon": "^4.5.0",

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

242714

increased by88.08%

Dev dependency count

25

decreased by-3.85%

Number of package files

51

increased by88.89%

Lines of code

5272

increased by94.04%

No dependency changes