From 64431d352c1a9711c0ed3f3d1d1d62efcf1ac997 Mon Sep 17 00:00:00 2001
From: Rick Zhou <rinick@gmail.com>
Date: Sun, 24 Mar 2019 01:24:18 -0700
Subject: [PATCH 1/3] remove duplicated keys

---
 src/ScrollableTabBarNode.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/ScrollableTabBarNode.js b/src/ScrollableTabBarNode.js
index 7b88f3fb..025f7e70 100755
--- a/src/ScrollableTabBarNode.js
+++ b/src/ScrollableTabBarNode.js
@@ -323,7 +323,6 @@ ScrollableTabBarNode.propTypes = {
   children: PropTypes.node,
   prevIcon: PropTypes.node,
   nextIcon: PropTypes.node,
-  activeKey: PropTypes.string,
 };
 
 ScrollableTabBarNode.defaultProps = {

From c26968d6e45e6447beed928b34b585ad6a1917bd Mon Sep 17 00:00:00 2001
From: Rick Zhou <rinick@gmail.com>
Date: Sun, 24 Mar 2019 01:25:31 -0700
Subject: [PATCH 2/3] use ResizeObserver in modern browsers

---
 src/ScrollableTabBarNode.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/ScrollableTabBarNode.js b/src/ScrollableTabBarNode.js
index 025f7e70..9a6dccbf 100755
--- a/src/ScrollableTabBarNode.js
+++ b/src/ScrollableTabBarNode.js
@@ -22,7 +22,13 @@ export default class ScrollableTabBarNode extends React.Component {
       this.setNextPrev();
       this.scrollToActiveTab();
     }, 200);
-    this.resizeEvent = addEventListener(window, 'resize', this.debouncedResize);
+    if ('ResizeObserver' in window) {
+      this.resizeObserver = new window.ResizeObserver(this.debouncedResize);
+      this.resizeObserver.observe(this.props.getRef('container'));
+    } else {
+      // fallback to window resize event when ResizeObserver is not available
+      this.resizeEvent = addEventListener(window, 'resize', this.debouncedResize);
+    }
   }
 
   componentDidUpdate(prevProps) {
@@ -43,7 +49,9 @@ export default class ScrollableTabBarNode extends React.Component {
   }
 
   componentWillUnmount() {
-    if (this.resizeEvent) {
+    if (this.resizeObserver) {
+      this.resizeObserver.disconnect();
+    } else if (this.resizeEvent) {
       this.resizeEvent.remove();
     }
     if (this.debouncedResize && this.debouncedResize.cancel) {

From 3efb889b6014571723a7443681a33d8b3f42b663 Mon Sep 17 00:00:00 2001
From: Rick Zhou <rinick@gmail.com>
Date: Sun, 24 Mar 2019 10:56:46 -0700
Subject: [PATCH 3/3] use resize-observer-polyfill to detect size change

---
 package.json                |  1 +
 src/ScrollableTabBarNode.js | 13 +++----------
 2 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/package.json b/package.json
index 6e55aa7c..d937a9aa 100644
--- a/package.json
+++ b/package.json
@@ -104,6 +104,7 @@
     "raf": "^3.4.1",
     "rc-hammerjs": "~0.6.0",
     "rc-util": "^4.0.4",
+    "resize-observer-polyfill": "^1.5.1",
     "warning": "^3.0.0"
   }
 }
diff --git a/src/ScrollableTabBarNode.js b/src/ScrollableTabBarNode.js
index 9a6dccbf..429f0114 100755
--- a/src/ScrollableTabBarNode.js
+++ b/src/ScrollableTabBarNode.js
@@ -1,8 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import addEventListener from 'rc-util/lib/Dom/addEventListener';
 import debounce from 'lodash/debounce';
+import ResizeObserver from 'resize-observer-polyfill';
 import { setTransform, isTransform3dSupported } from './utils';
 
 export default class ScrollableTabBarNode extends React.Component {
@@ -22,13 +22,8 @@ export default class ScrollableTabBarNode extends React.Component {
       this.setNextPrev();
       this.scrollToActiveTab();
     }, 200);
-    if ('ResizeObserver' in window) {
-      this.resizeObserver = new window.ResizeObserver(this.debouncedResize);
-      this.resizeObserver.observe(this.props.getRef('container'));
-    } else {
-      // fallback to window resize event when ResizeObserver is not available
-      this.resizeEvent = addEventListener(window, 'resize', this.debouncedResize);
-    }
+    this.resizeObserver = new ResizeObserver(this.debouncedResize);
+    this.resizeObserver.observe(this.props.getRef('container'));
   }
 
   componentDidUpdate(prevProps) {
@@ -51,8 +46,6 @@ export default class ScrollableTabBarNode extends React.Component {
   componentWillUnmount() {
     if (this.resizeObserver) {
       this.resizeObserver.disconnect();
-    } else if (this.resizeEvent) {
-      this.resizeEvent.remove();
     }
     if (this.debouncedResize && this.debouncedResize.cancel) {
       this.debouncedResize.cancel();