Nested SimpleBars Cause Multiple Initializations

[CreativeTechGuy]

Current Behavior

When nested SimpleBars are initialized from JavaScript, the MutationObserver will trigger a re-initialization of the children.

Expected behavior

The MutationObserver shouldn't re-initialize a simplebar with default options when it has already been created.

Reproducible example

Demo. The settings for autoHide are set to false for all .scroll-areas, but the child scroll area is initialized a second time due to the MutationObserver detecting the change of the first one. This causes the settings to get overwritten for the child and the autoHide is re-enabled.

Suggested solution(s)

MutationObserver should not re-initialize elements with a data-simplebar attribute set to init.

Your environment

Software	Version(s)
SimpleBar	3.1.5
Browser	Chrome 73
Operating System	Windows 10

[CreativeTechGuy]

A temporary solution for anyone affected is to add the following line to the top of their script.

SimpleBar.removeObserver()

This will completely disable the MutationObserver and only allow manual initialization, thereby avoiding the problem.

[Grsmto]

Should be fixed in [email protected]!

[Grsmto]

FYI I reverted the fix for this as it wasn't actually working properly.
I think the right way of fixing this issue is to either:

• disable the global mutation observer, just like you did
• pass options via data attribute and let the mutation observer do the job. So not instantiate manually