Behaviour detach not trigger on story change

[zecka]

If a component script attach an event to document or window this will create issue on story change.

Let's assume following component example

// components/demo/demo.js
(function (Drupal, once) {
    const mouseListener = (event) => {
        console.log('MouseMove event');
    };
    Drupal.behaviors.demo = {
        attach: function attach(context, settings) {
            console.log('demo attach');
            jQuery(document).on('mousemove', mouseListener);
        },
        detach: function dettach(context, settings) {
            console.log('demo detach');
            jQuery(document).off('mousemove', mouseListener);
        }
    }

})(Drupal, once);

When we leave the story of demo component for another story the mouseListener event will not be removed because detach function from behaviour is not fired

[zecka]

I create a PR for that #54

In the meantime if people got same issue we can just add a decorator inside "/.storybook/preview.js"

// .storybook/preview.js
const preview = {
    ...
    decorators: [
        (storyFn) => {
            if(typeof Drupal !== 'undefined'){
                Object.keys(Drupal.behaviors).forEach(key => {
                    Drupal.behaviors[key].detach();
                });
            }
            return storyFn();
        }
    ]
};
export default preview;

[deviantintegral]

Thanks for this!

We're actually pretty close to archiving this project as it's been superseded by https://www.drupal.org/project/storybook which doesn't need a separate JS addon. Do you have anything that's blocking you from switching over?

If you know you're going to have to use and maintain this library in the long term, we'd be open to figuring out a way to add or transfer maintainership to you.