From 3bb3f81db5ab6430c660fe4c20bb532ee3bb36e8 Mon Sep 17 00:00:00 2001 From: Adrien Denat Date: Wed, 10 Apr 2019 22:08:42 -0300 Subject: [PATCH] fix: avoid SimpleBar to be instantiated twice on the same node --- packages/simplebar/src/simplebar.js | 20 +++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/packages/simplebar/src/simplebar.js b/packages/simplebar/src/simplebar.js index c9edc1d4..05e3db54 100755 --- a/packages/simplebar/src/simplebar.js +++ b/packages/simplebar/src/simplebar.js @@ -19,7 +19,10 @@ export default class SimpleBar { this.scrollbarWidth; this.minScrollbarWidth = 20; this.options = { ...SimpleBar.defaultOptions, ...options }; - this.classNames = { ...SimpleBar.defaultOptions.classNames, ...this.options.classNames }; + this.classNames = { + ...SimpleBar.defaultOptions.classNames, + ...this.options.classNames + }; this.isRtl; this.axis = { x: { @@ -50,6 +53,11 @@ export default class SimpleBar { } }; + // Don't re-instantiate over an existing one + if (this.el.SimpleBar) { + return; + } + this.recalculate = throttle(this.recalculate.bind(this), 64); this.onMouseMove = throttle(this.onMouseMove.bind(this), 64); this.hideScrollbars = debounce( @@ -124,7 +132,7 @@ export default class SimpleBar { horizontal: 'simplebar-horizontal', vertical: 'simplebar-vertical', hover: 'simplebar-hover', - dragging: 'simplebar-dragging', + dragging: 'simplebar-dragging' }, scrollbarMinSize: 25, scrollbarMaxSize: 0, @@ -141,7 +149,7 @@ export default class SimpleBar { mutations.forEach(mutation => { Array.prototype.forEach.call(mutation.addedNodes, addedNode => { if (addedNode.nodeType === 1) { - if (addedNode.hasAttribute('data-simplebar')) { + if (addedNode.dataset.simplebar) { !addedNode.SimpleBar && new SimpleBar(addedNode, SimpleBar.getElOptions(addedNode)); } else { @@ -466,8 +474,10 @@ export default class SimpleBar { this.axis.y.isOverflowing = this.elStyles.overflowY === 'hidden' ? false : this.axis.y.isOverflowing; - this.axis.x.forceVisible = this.options.forceVisible === "x" || this.options.forceVisible === true; - this.axis.y.forceVisible = this.options.forceVisible === "y" || this.options.forceVisible === true; + this.axis.x.forceVisible = + this.options.forceVisible === 'x' || this.options.forceVisible === true; + this.axis.y.forceVisible = + this.options.forceVisible === 'y' || this.options.forceVisible === true; this.axis.x.scrollbar.size = this.getScrollbarSize('x'); this.axis.y.scrollbar.size = this.getScrollbarSize('y');