developit / preact-css-transition-group

Apply CSS transitions when adding or removing Preact components/elements
62 stars 17 forks source link

Transition animation not being called with Preact-Router #6

Closed AdamJo closed 7 years ago

AdamJo commented 7 years ago

Running into issues with router transitions. React dev tools is showing that CSSTransitionGroup has been loaded but nothing is triggering the route animations.

        <CSSTransitionGroup
              transitionName='example'
            >
            {this.props.children}
    </CSSTransitionGroup>

I setup a test repo for CSSmodules and SCSS if you want to check it out.

developit commented 7 years ago

@AdamJo Are you able to test without preact/devtools enabled?

AdamJo commented 7 years ago

@developit Tried commenting out preact/devtools, no change so far. The span is being created but no sign of the enter / leave classes being called.

developit commented 7 years ago

Ok, good to know. What is being rendered as the child of this component? Would be useful to know if it's a pure functional component, a regular component, or an element.

AdamJo commented 7 years ago

They are 4 pure functional components. I also tested with a class component but got the same results.

AdamJo commented 7 years ago

I was able to find this guy's work that helped https://github.com/nerijusgood/ng.

Turns out I was passing in my component into CSSTransitionGroup wrong. I'll go ahead and close this issue now that I've got it working.