React-transition-group: failing unit tests on Node.js 10 (CI with yarn)

[DanielRuf]

Do you want to request a feature or report a bug?
Bug

What is the current behavior?
Unit tests fail on Node.js 10.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via https://jsfiddle.net or similar (template: https://jsfiddle.net/m4mb9Lg3/4/).
Run tests on Node.js 10.1.0

What is the expected behavior?
Unit tests should successfully run.

Which versions, and which browser / OS are affected by this issue? Did this work in previous versions?
It obviously worked in previous Node.js releases so we have to update the dependencies to fix this.

I'll try to fix this when I find the time.

[silvenon]

It works for me. Could you specify any details of how tests fail for you?

npm test output

~/Code/react-transition-group master
❯ node -v
v10.1.0

~/Code/react-transition-group master
❯ npm test

> [email protected] test /Users/silvenon/Code/react-transition-group
> npm run lint && npm run testonly


> [email protected] lint /Users/silvenon/Code/react-transition-group
> eslint src test


> [email protected] testonly /Users/silvenon/Code/react-transition-group
> jest --verbose

 PASS  test/CSSTransitionGroup-test.js
  CSSTransitionGroup
    ✓ should clean-up silently after the timeout elapses (42ms)
    ✓ should keep both sets of DOM nodes around (11ms)
    ✓ should switch transitionLeave from false to true (13ms)
    ✓ should work with a null child (6ms)
    ✓ should work with a child which renders as null (10ms)
    ✓ should transition from one to null (8ms)
    ✓ should transition from false to one (8ms)
    ✓ should clear transition timeouts when unmounted (7ms)
    ✓ should handle unmounted elements properly (6ms)
    ✓ should work with custom component wrapper cloning children (7ms)

 PASS  test/TransitionGroup-test.js
  TransitionGroup
    ✓ should allow null components (8ms)
    ✓ should allow callback refs (3ms)
    ✓ should work with no children
    ✓ should handle transitioning correctly (13ms)
    ✓ should not throw when enter callback is called and is now leaving (2ms)
    ✓ should not throw when leave callback is called and is now entering (2ms)

 PASS  test/CSSTransition-test.js
  CSSTransition
    ✓ should flush new props to the DOM before initiating a transition (5ms)
    entering
      ✓ should apply classes at each transition state (17ms)
      ✓ should apply custom classNames names (21ms)
    exiting
      ✓ should apply classes at each transition state (16ms)
      ✓ should apply custom classNames names (16ms)

 PASS  test/Transition-test.js
  Transition
    ✓ should not transition on mount (3ms)
    ✓ should transition on mount with `appear` (3ms)
    ✓ should pass filtered props to children (3ms)
    ✓ should allow addEndListener instead of timeouts (8ms)
    ✓ should fallback to timeous with addEndListener  (3ms)
    entering
      ✓ should fire callbacks (17ms)
      ✓ should move to each transition state (16ms)
    exiting
      ✓ should fire callbacks (19ms)
      ✓ should move to each transition state (15ms)
    mountOnEnter
      ✓ should mount when entering (6ms)
      ✓ should stay mounted after exiting (27ms)
    unmountOnExit
      ✓ should mount when entering (4ms)
      ✓ should unmount after exiting (17ms)

 PASS  test/ChildMapping-test.js
  ChildMapping
    ✓ should support getChildMapping (5ms)
    ✓ should support mergeChildMappings for adding keys (1ms)
    ✓ should support mergeChildMappings for removing keys
    ✓ should support mergeChildMappings for adding and removing
    ✓ should reconcile overlapping insertions and deletions
    ✓ should support mergeChildMappings with undefined input (1ms)

Test Suites: 5 passed, 5 total
Tests:       40 passed, 40 total
Snapshots:   0 total
Time:        1.723s, estimated 2s
Ran all test suites.

[DanielRuf]

Did you install with yarn? There is a yarn.lock file ;-)

[DanielRuf]

See https://travis-ci.org/reactjs/react-transition-group/builds/378840852 and https://github.com/reactjs/react-transition-group/pull/334#issuecomment-388912369

[silvenon]

Thanks. I think it's node-sass build that's failing, which is coming from webpack-atoms. What's confusing is installing dependencies for the webpack-atoms project passes, while updating the webpack-atoms to v7 in react-transition-group still causes node-sass to fail. node-sass v4.9 changelog says that it has a fix for Node v10, so it would probably be good to upgrade it in our project as well somehow.

I didn't have luck getting any further in that rabbit hole. 😕

[DanielRuf]

How did you update node-sass? Did you use npm rebuild node-sass --force?

[DanielRuf]

I'll try to tackle this today or tomorrow as, should be easy.

I just have to do some local testing and localize all dependencies which use node-sass and might lock the version and to make sure that there are no other dependencies which have to be upgraded or updated for Node.js 10.

[DanielRuf]

I think it's node-sass build that's failing

Right. But there might be more (like upath 1.0.4 which is often used and bound to Node.js <= 9) so I have to assure that node-sass is the only dependency which needs some update or upgrade.

[silvenon]

I think GitHub automatically closed this because I used the word "fix" in the PR to webpack-atoms, so I'm reopening this. Once the new version is released, we can see if upgrading it will fix the build.

[silvenon]

After ensuring that latest node-sass was installed I discovered the next failure: fsevents. After some tinkering I managed to find a combination of dependencies where every fsevents version is high enough. Next week I'll condense these upgrades to be minimal and submit a PR.

[jquense]

:tada: This issue has been resolved in version 2.4.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: