Nested components transition bug

[kroshilin]

Found some strange behaviour, most probably this is a bug. Not sure how to explain it correctly, so will better provide an example. Here is link to repository - https://github.com/kroshilin/svelma-transition-bug

npm i 
npm run dev

Press "Toggle" button on web page and try to close modal window. Modal is not closed, and there is an error in console.

Uncaught (in promise) TypeError: Cannot read property 'c' of undefined
    at transition_out (index.mjs:676)
    at Object.outro [as o] (module.js:2)
    at ve (module.js:1)
    at Object.o (module.js:1)
    at ve (module.js:1)
    at Object.p (module.js:1)
    at re (module.js:1)
    at le (module.js:1)

It seems that bug takes place when I try to place one components inside other and then remove parent component from DOM.
Deeper investigation led me to svelma/dist/index.js:420

function transition_out(block, local, detach, callback) {
       if (block && block.o) {
           if (outroing.has(block))
               return;
           outroing.add(block);
           outros.c.push(() => {
               outroing.delete(block);
               if (callback) {
                   if (detach)
                       block.d(1);
                   callback();
               }
           });
           block.o(local);
       }
   }

This code seems to be generated by svelte. If i add if (outros) - it fixes the issue.

[c0bra]

Thanks; I will take a look later today and update this comment.

[kroshilin]

It seems that problem is in duplicating parts of svelte in resulting bundle. There are two functions transition_out, for example. Further research led me to https://github.com/rollup/rollup-plugin-svelte#pkgsvelte. Adding "svelte": "src/index.js" to package.json of this repo solved the issue. But, that led to another issue - we need node-sass or sass as a dependency in end-user's project now, to be able to build svelma. Not sure if it is correct.
The other question - is there a reason why you use <style lang="scss"> inside components? We already include bulma.css while setup, so, classes in <style lang="scss"> look redundant. Am i wrong?

[kroshilin]

Ok, I understood the reason of usage custom css rules. Here is PR - #31

[c0bra]

@kroshilin thanks for the PR and sorry it took so long to get it; now merged.

The other question - is there a reason why you use <style lang="scss"> inside components?

Style blocks with the lang="scss" attribute are compiled with sass. Those without it are not.

[abbychau]

It seems it is resolved. closing this issue.