Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Test Suite failed to run TypeError: Cannot read property 'bind' of undefined

Working on a React Native project. I am trying to test one of the bigger components using Jest. I'm getting this test failed to run error with a property on undefined, which doesn't make any sense because a few lines later it says all the tests ran fine.

I've tried removing my node modules and running npm install again.

You can see the error here:

enter image description here

and the test here:

import React from 'react';
import ReactNative, {
  Image,
  Text,
  View
} from 'react-native';
import renderer from 'react-test-renderer';
import TeamDetail from '../../app/scenes/TeamDetail/TeamDetail';

const mockFn = () => 'THIS IS A MOCK!!!!';

describe('<TeamDetail />', () => {
  it('renders correctly', () => {
    const team = {};
    const captains = {
      count: 1,
      items: [],
      links: { next: 'next link', prev: 'prev link', },
    };
    const leagueTeamCount = 1;
    const games = {
      count: 1,
      items: [],
      links: { next: 'next link', prev: 'prev link', },
    };
    const roster = {
      count: 1,
      items: [],
      links: { next: 'next link', prev: 'prev link', },
    };
    const fetchPendingPlayers = mockFn;
    const pendingPlayers = {
      count: 1,
      items: [],
      links: { next: 'next link', prev: 'prev link', },
    };
    const updateTeam = mockFn;
    const addPlayerToTeam = mockFn;
    const addCaptainToTeam = mockFn;
    const approvePlayer = mockFn;
    const canManageTeam = true;
    const canMessage = true;
    const clearSearchResults = mockFn;
    const fetchTeamGames = mockFn;
    const fetchTeamPlayers = mockFn;
    const fetchUserProfile = mockFn;

    const tree = renderer.create(
      <TeamDetail
        team={team}
        captains={captains}
        leagueTeamCount={leagueTeamCount}
        games={games}
        roster={roster}
        fetchPendingPlayers={fetchPendingPlayers}
        pendingPlayers={pendingPlayers}
        updateTeam={updateTeam}
        addPlayerToTeam={addPlayerToTeam}
        addCaptainToTeam={addCaptainToTeam}
        approvePlayer={approvePlayer}
        canManageTeam={canManageTeam}
        canMessage={canMessage}
        clearSearchResults={clearSearchResults}
        fetchTeamGames={fetchTeamGames}
        fetchTeamPlayers={fetchTeamPlayers}
        fetchUserProfile={fetchUserProfile}
        searchResults={searchResults}
        searchUsers={searchUsers}
        setLocationAlert={setLocationAlert}
        viewTeamMessageFeed={viewTeamMessageFeed}
      />
    ).toJSON();

    expect(tree).toMatchSnapshot();
  });
});

and here is package.json

{
  "name": "APPNAME",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "flow": "flow",
    "jest": "jest",
    "lint": "eslint . --ext .js --ext .jsx --ignore-path .gitignore --ignore-path .eslintignore --cache",
    "packager": "remotedev-debugger --port 8000 --injectserver && node_modules/react-native/packager/packager.sh",
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "mocha --require babel-register $(find app/tests -name \"*_test.js\")",
    "bundle-android": "react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --sourcemap-output android/app/src/main/assets/index.android.map --assets-dest android/app/src/main/res/"
  },
  "pre-commit": [
    "lint",
    "flow",
    "test",
    "jest"
  ],
  "dependencies": {
    "apsl-react-native-button": "^3.0.2",
    "bugsnag-react-native": "^1.2.1",
    "flow": "^0.2.3",
    "flow-typed": "^2.0.0",
    "immutable": "^3.8.1",
    "jsrsasign": "^6.2.0",
    "jwt-decode": "^2.1.0",
    "momentjs": "^2.0.0",
    "phoenix": "^1.2.1",
    "ramda": "^0.22.1",
    "react": "~15.4.0-rc.4",
    "react-native": "0.40.0",
    "react-native-button": "^1.7.1",
    "react-native-drawer": "^2.3.0",
    "react-native-experimental-navigation": "^0.26.10",
    "react-native-fbsdk": "0.5",
    "react-native-fetch-blob": "v0.10.2-beta.8",
    "react-native-geocoder": "https://github.com/smartlogic/react-native-geocoder.git",
    "react-native-image-picker": "0.25",
    "react-native-invertible-scroll-view": "^1.0.0",
    "react-native-router-flux": "^3.36.0",
    "react-redux": "^4.4.5",
    "redux": "^3.6.0",
    "redux-action-buffer": "^1.0.1",
    "redux-persist": "^4.0.0-alpha7",
    "redux-saga": "^0.12.1"
  },
  "jest": {
    "preset": "jest-react-native"
  },
  "devDependencies": {
    "babel-eslint": "^7.1.0",
    "babel-jest": "16.0.0",
    "babel-plugin-ramda": "^1.1.6",
    "babel-plugin-syntax-flow": "^6.18.0",
    "babel-plugin-transform-flow-strip-types": "^6.22.0",
    "babel-preset-react-native": "1.9.0",
    "babel-register": "^6.18.0",
    "chai": "^3.5.0",
    "eslint": "^3.9.1",
    "eslint-plugin-flowtype": "^2.25.0",
    "eslint-plugin-react": "^6.4.1",
    "eslint-plugin-react-native": "^2.0.0",
    "flow-bin": "0.38",
    "jest": "^18.1.0",
    "jest-cli": "^19.0.2",
    "jest-react-native": "^17.1.0",
    "jsverify": "^0.7.4",
    "mocha": "^3.2.0",
    "pre-commit": "^1.1.3",
    "react-test-renderer": "^15.4.2",
    "remote-redux-devtools": "^0.5.7",
    "remote-redux-devtools-on-debugger": "^0.7.0"
  }
}
like image 628
Justus Eapen Avatar asked Nov 08 '22 00:11

Justus Eapen


1 Answers

Try to install both jest and jest babel last versions

npm install --save-dev jest

npm install --save-dev babel-jest regenerator-runtime

And re-run the test, it works for me

like image 169
Hussam Kurd Avatar answered Nov 14 '22 21:11

Hussam Kurd