enzymejs / enzyme

JavaScript Testing utilities for React
https://enzymejs.github.io/enzyme/
MIT License
19.95k stars 2.01k forks source link

Cannot find module 'react-addons-test-utils' from 'react-compat.js' #891

Closed tugorez closed 7 years ago

tugorez commented 7 years ago

Hi guys, thank you for such a nice library :)

I just created a react-native project today but when I try to run a test, this error message appears

Cannot find module 'react-addons-test-utils' from 'react-compat.js'

  at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:169:17)
  at node_modules/enzyme/build/react-compat.js:133:21
  at Object.<anonymous> (node_modules/enzyme/build/react-compat.js:219:5)

package.json

{                                                                                
  "name": "testing",                                                               
  "version": "0.0.1",                                                            
  "private": true,                                                               
  "scripts": {                                                                   
    "start": "node node_modules/react-native/local-cli/cli.js start",            
    "test": "jest",                                                              
    "test:all": "yarn run lint && yarn run flow && yarn run test:coverage",      
    "test:watch": "jest --watch",                                                
    "test:coverage": "jest --coverage",                                          
    "lint": "eslint --ignore-pattern coverage .",                                
    "flow": "node_modules/.bin/flow"                                             
  },                                                                             
  "dependencies": {                                                              
    "react": "16.0.0-alpha.6",                                                   
    "react-native": "0.43.3"                                                     
  },                                                                             
  "devDependencies": {                                                           
    "babel-jest": "19.0.0",                                                      
    "babel-preset-react-native": "1.9.1",                                        
    "enzyme": "^2.8.1",                                                          
    "eslint": "^3.19.0",                                                         
    "eslint-config-airbnb-base": "^11.1.3",                                      
    "eslint-plugin-import": "^2.2.0",                                            
    "eslint-plugin-react": "^6.10.3",                                            
    "eslint-plugin-react-native": "^2.3.1",                                      
    "flow-bin": "0.40.0",                                                        
    "jest": "19.0.2",                                                            
    "react-dom": "^15.5.4",                                                      
    "react-native-dotenv": "^0.0.4",                                             
    "react-test-renderer": "^15.5.4"                                             
  },                                                                             
  "jest": {                                                                      
    "preset": "react-native"                                                     
  }                                                                              
} 

index.js

import React from 'react';                                                       
import { Text, View } from 'react-native';                                       

const App = () => (                                                              
  <View>                                                                         
    <Text>Hello world!</Text>                                                    
  </View>                                                                        
);                                                                               

export default App;   

index.test.js

import React from 'react';                                                       
import { shallow } from 'enzyme';                                                
import App from '../index';                                                      

const wrapper = shallow(<App />);                                                

describe('<App />', () => {                                                      
  it('should render', () => {                                                    
    expect(wrapper).toBeTruthy();                                                
  });                                                                            
}); 
cloverich commented 7 years ago

I believe this is caused by React 15.5 changing the location of the react-test-utils to react-dom/test-utils. Meanwhile, enzyme's package.json file allows for 15.5 to be used.

Edit: If I am correct, #637 might be tangentially related.

ljharb commented 7 years ago

Also, see #892 and #876.

kopax commented 7 years ago

I have the same issue

ilikeflex commented 7 years ago

I have this in my package.json

"devDependencies": {
    "babel-eslint": "^4.1.0",
    "chai": "^2.3.0",
    "deep-freeze": "0.0.1",
    "enzyme": "^2.8.2",
    "grunt": "~0.4.4",
    "grunt-browserify": "^4.0.0",
    "grunt-cli": "^0.1.13",
    "grunt-contrib-clean": "^0.6.0",
    "grunt-contrib-concat": "^1.0.0",
    "grunt-contrib-cssmin": "^0.7.0",
    "grunt-contrib-less": "~0.9.0",
    "grunt-contrib-uglify": "^0.6.0",
    "grunt-contrib-watch": "^0.6.1",
    "grunt-eslint": "^17.1.0",
    "grunt-mocha-test": "^0.12.7",
    "jshint": "~2.4.4",
    "mocha": "^2.2.4",
    "mocha-teamcity-reporter": "0.0.2",
    "neo-browserify-exports": "^1.3.2",
    "neo-browserify-mold-sourcemap": "^1.0.4",
    "neo-core-css": "^1.6.4",
    "neo-core-js": "^0.4.0",
    "react-addons-perf": "0.14.2",
    "react-addons-test-utils": "^0.14.8",
    "reactify": "1.1.1",
    "stringify": "^3.1.0",
    "websdk-colours": "1.0.x"
  },
  "dependencies": {
    "common-logger": "^1.0.2",
    "d3": "^3.5.5",
    "immutable": "3.7.6",
    "lodash": "4.15.0",
    "moment": "2.11.2",
    "moment-timezone": "^0.5.11",
    "numeral": "1.5.3",
    "q": "2.0.3",
    "react": "0.14.8",
    "react-component-wrapper": "1.0.4",
    "react-dom": "0.14.6",
    "react-redux": "4.0.0",
    "react-truncate": "^2.0.5",
    "redux": "3.0.4",
    "redux-thunk": "1.0.0",
    "shims": "0.0.x",
    "uuid": "^3.0.1"
  },

and i am getting error Error: Cannot find module 'react-dom/test-utils'

Any pointer is highly appreciated.

ljharb commented 7 years ago

Bump react-dom to 0.14.8? All the react-* things need to be the same version.

matijastampfel commented 7 years ago

I find solution. You are missing npm package. Go to cmd and type yarn add react-addons-test-utils Hope it helps. ;)

ljharb commented 7 years ago

@matijastampfel we're not missing it. It's part of the instructions for React < 15.5.

rosskevin commented 7 years ago

I just bumped into this and seeing it with React > 15.5

    "enzyme": "^2.8.2",
    "react": "^15.6.0",
    "react-a11y": "^0.3.4",
    "react-addons-perf": "^15.4.2",
    "react-docgen": "^3.0.0-beta4",
    "react-dom": "^15.6.0",
    "react-test-renderer": "^15.5.4",
yarn list react-dom                                                                                                                                                                                 update-dependencies ✭
yarn list v0.24.6
└─ react-dom@15.6.0
ljharb commented 7 years ago

@rosskevin just to confirm; even if you update react-test-renderer to 15.6 (since, generally, all react-* packages always need to be on the same minor), you still see the problem?

rosskevin commented 7 years ago

@ljharb that was the most current as of 18 hours ago. Confirmed fixed now with updated packages released ~14 hours ago:

 react                ^15.6.0  →  ^15.6.1 
 react-dom            ^15.6.0  →  ^15.6.1 
 react-test-renderer  ^15.5.4  →  ^15.6.1 
ljharb commented 7 years ago

Thanks, looks like this is resolved (and that the react team may need to coordinate more timely release of their packages ;-) )

ljharb commented 7 years ago

(Happy to reopen if this problem is continuing to occur for anyone; also, filing a new issue would be great too!)

bishwenduk029 commented 6 years ago

Hi, Jest is a great library. But when trying run my tests with all three packages bumped up to version 16.3.1, it is giving me the same error "Cannot find module 'react-addons-test-utils' from 'react-compat.js'. Can someone please help me with resolving the same? below is my package.json

```json { "name": "ldds", "version": "0.0.0", "description": "ldds", "scripts": { "build": "gulp", "start": "gulp watch", "buildAll": "gulp buildAll", "build-phone": "gulp build-phone", "test": "jest login.test", "heatmap": "gulp replace-heatmap", "build-web": "gulp build-web", "build-internal": "gulp ana-internal", "build-ingress": "gulp ana-ingress", "build-saml20": "gulp ana-saml20", "min-react": "gulp min-react" }, "author": "", "license": "ISC", "dependencies": { "leaflet": "^1.2.0", "lodash": "^4.17.5", "material-ui": "0.19.4", "moment": "^2.22.0", "numeral": "^2.0.6", "react": "16.3.1", "react-dom": "16.3.1", "react-leaflet": "^1.9.1", "react-leaflet-heatmap-layer": "^1.0.4", "react-resize-detector": "^1.1.0", "react-router": "3.0.5", "react-simple-tooltip": "^2.3.1", "react-sortable-hoc": "^0.6.3", "react-tap-event-plugin": "2.0.1", "recharts": "0.22.4", "sanitize-html": "^1.18.2" }, "devDependencies": { "babel-core": "6.22.1", "babel-jest": "^22.4.3", "babel-plugin-rewire": "1.0.0", "babel-plugin-syntax-trailing-function-commas": "6.22.0", "babel-plugin-transform-object-assign": "6.22.0", "babel-plugin-transform-object-rest-spread": "6.23.0", "babel-polyfill": "6.23.0", "babel-preset-env": "^1.6.1", "babel-preset-es2015": "6.22.0", "babel-preset-es2016": "6.22.0", "babel-preset-es2017": "6.22.0", "babel-preset-react": "^6.24.1", "babel-preset-stage-1": "6.22.0", "babelify": "7.3.0", "browser-sync": "2.18.7", "browserify": "14.0.0", "envify": "^4.1.0", "enzyme": "^2.8.0", "enzyme-adapter-react-16": "^1.1.1", "es6-promise": "^4.1.1", "faker": "4.1.0", "fetch-mock": "5.9.4", "google-map-react": "0.24.0", "gulp": "3.9.1", "gulp-concat": "2.6.1", "gulp-minify-css": "1.2.4", "gulp-notify": "3.0.0", "gulp-replace": "^0.6.1", "gulp-string-replace": "^0.4.0", "gulp-strip-debug": "^2.0.0", "gulp-uglify": "2.0.1", "gulp-util": "3.0.8", "gutil": "^1.6.4", "jasmine-core": "2.5.2", "jest": "^22.4.3", "pretty-hrtime": "1.0.3", "pump": "1.0.2", "react-addons-deep-compare": "0.0.1", "react-copy-to-clipboard": "4.2.3", "react-dimensions": "1.3.0", "react-event-debounce": "^4.0.9", "react-swipeable-views": "0.10.7", "react-test-renderer": "16.3.1", "react-tooltip": "3.2.7", "require-dir": "0.3.2", "run-sequence": "^2.2.0", "sinon": "2.1.0", "underscore": "1.8.3", "vinyl-source-stream": "1.1.0", "watchify": "3.9.0", "whatwg-fetch": "^2.0.4", "yargs": "^8.0.2" } } ```