chai-enzyme | js assertions and convenience functions | Frontend Framework library

I am using chai to try and unit test a validation function I have found online. This validation function is being used inside of a 'react-final-form' component.

Here is where I got this validator function from:

https://youtu.be/OEg8jm-NbQ0?t=567

I'm trying to learn testing, started from basic tests, now I would like to test functions. However, I went through all of the internet it feels, and I couldn't manage to test onClick thing. Maybe I can't spot something.

I've tried to use sinon.spy, jest spyOn, etc. But none of these worked out.

Test, I'm trying to write.

Either I don't understand dependencies vs. devDependencies in node 100% yet or eslint is just wrong here (not capable of analyzing this correctly):

I have React project based on https://github.com/davezuko/react-redux-starter-kit.

In JEST tests: when I trying to import something with root-based path like "components/Link" - it does not working, only relative paths are working.

Putting

I am using the react-create-app boilerplate for my react apps and its wonderful. but I am not much comfortable with how the jest test framework works and would like to use mocha, chai, chai-enzyme.

How could I change the test framework to the above mentioned stack?

Thanks.

I have constant crashes on the simulator with an event keyboardDidChangeFrame in RCTKeyboardObserver

I have upgraded an older React Native project to 0.47, 0.48 and then 0.49.x. Since I've done so, I keep getting XCode breaking at random moments with the following breakpoint (sometimes others).

My dependencies "dependencies": { "autobind-decorator": "^2.1.0", "cheerio-without-node-native": "^0.20.2", "diacritic": "0.0.2", "expect": "^1.20.2", "harmony-proxy": "^1.0.1", "hoist-non-react-statics": "^2.3.1", "immutable": "^3.8.1", "lodash": "^4.17.4", "lodash-es": "^4.17.4", "lodash.debounce": "^4.0.8", "lodash.memoize": "^4.1.2", "lodash.mergewith": "^4.6.0", "lodash.sorteduniq": "^4.2.0", "lodash.sorteduniqby": "^4.7.0", "lodash.union": "^4.6.0", "lodash.unionwith": "^4.6.0", "lodash.uniqby": "^4.7.0", "mime-types": "^2.1.17", "moment": "^2.18.1", "normalizr": "^3.2.3", "normalizr-immutable": "0.0.4-beta12", "path": "^0.12.7", "react": "16.0.0-alpha.12", "react-immutable-proptypes": "^2.1.0", "react-intl": "^2.4.0", "react-intl-redux": "^0.6.0", "react-native": "^0.49.3", "react-native-action-button": "^2.7.2", "react-native-animatable": "^1.2.3", "react-native-autolink": "^1.1.1", "react-native-code-push": "5.1.3-beta", "react-native-cookies": "^3.2.0", "react-native-deprecated-custom-components": "^0.1.1", "react-native-drawer": "^2.3.0", "react-native-fetch-blob": "^0.10.8", "react-native-fs": "^2.5.2", "react-native-google-analytics-bridge": "^5.3.3", "react-native-image-crop-picker": "^0.17.2", "react-native-image-picker": "^0.26.7", "react-native-immutable-list-view": "^0.6.2", "react-native-invertible-scroll-view": "^1.0.0", "react-native-keyboard-aware-scroll-view": "0.3.0", "react-native-keychain": "2.0.0-rc", "react-native-lightbox": "^0.7.0", "react-native-linear-gradient": "^2.3.0", "react-native-material-kit": "^0.4.1", "react-native-modalbox": "^1.4.1", "react-native-parallax-scroll-view": "^0.19.0", "react-native-photo-view": "^1.5.2", "react-native-popup-menu": "^0.8.0", "react-native-progress": "^3.3.0", "react-native-scrollable-tab-view": "^0.6.7", "react-native-sglistview": "^0.4.3", "react-native-share": "^1.0.23", "react-native-store": "^0.4.1", "react-native-swiper": "^1.5.12", "react-native-vector-icons": "^4.2.0", "react-navigation": "1.0.0-beta.13", "react-redux": "^5.0.5", "react-swipeable-views": "^0.12.5", "react-swipeable-views-native": "^0.12.5", "realm": "^1.13.0", "redux": "^3.7.2", "redux-form": "^7.0.3", "redux-logger": "^3.0.6", "redux-middleware-oneshot": "^0.1.1", "redux-persist": "^4.8.2", "redux-persist-immutable": "^4.3.0", "redux-persist-transform-immutable": "^4.3.0", "redux-thunk": "^2.2.0", "reselect": "^3.0.1", "route-parser": "0.0.5", "webstomp-client": "^1.0.8" }, "devDependencies": { "babel-cli": "^6.26.0", "babel-core": "^6.26.0", "babel-eslint": "^7.2.3", "babel-jest": "^21.2.0", "babel-plugin-module-resolver": "3.0.0-beta.5", "babel-plugin-react-intl": "^2.3.1", "babel-plugin-transform-class-properties": "^6.24.1", "babel-plugin-transform-decorators-legacy": "^1.3.4", "babel-plugin-transform-es2015-modules-commonjs": "^6.24.1", "babel-preset-airbnb": "^2.4.0", "babel-preset-es2015": "^6.24.1", "babel-preset-react": "^6.24.1", "babel-preset-react-native": "^4.0.0", "babel-preset-react-native-stage-0": "^1.0.1", "babel-register": "^6.24.1", "chai": "^4.1.0", "chai-as-promised": "^7.1.1", "chai-enzyme": "^0.8.0", "chai-immutable": "^1.6.0", "commitizen": "^2.9.6", "cz-conventional-changelog": "^2.0.0", "enzyme": "^3.0.0", "eslint": "^4.7.2", "eslint-config-airbnb": "^15.1.0", "eslint-plugin-babel": "^4.1.2", "eslint-plugin-import": "^2.7.0", "eslint-plugin-jsx-a11y": "^6.0.2", "eslint-plugin-prettier": "^2.3.1", "eslint-plugin-react": "^7.4.0", "eslint-plugin-react-native": "^3.1.0", "expect.js": "^0.3.1", "flow": "^0.2.3", "flow-bin": "^0.56.0", "immutablediff": "^0.4.3", "jest": "^21.2.1", "jest-serializer-enzyme": "^1.0.0", "jshint": "^2.9.5", "mocha": "^3.4.2", "react-addons-test-utils": "^15.6.2", "react-dom": "16.0.0-beta.5", "react-intl-cra": "^0.2.8", "react-native-mock": "^0.3.1", "react-test-renderer": "^16.0.0", "redux-debounce": "^1.0.1", "redux-debounced": "^0.4.0", "redux-devtools": "^3.4.0", "redux-devtools-dock-monitor": "^1.1.2", "redux-devtools-log-monitor": "^1.3.0", "redux-mock-store": "^1.2.3", "remote-redux-devtools": "^0.5.12", "sinon": "^4.0.0", "why-did-you-update": "0.0.8" }

Other symptoms: - react-native run-ios completes with BUILD SUCCEEDED but the app opens and immediately closes on the simulator (works ok from Xcode)

In order to eliminate "old file issues", I created a new react-native project and copied over the newly created xcodeproj file over. To no avail.

Any suggestions?

I'm currently working on a upgrade from Webpack 1 to 2, and then to 3. Within this upgrade, I've adhered to the migration instructions as per the instructions for 1 => 2 and for 2 => 3.

The issue I'm having is that none of the installed packages within my node_modules seem to be getting resolved within my code inside client/app/bundles. The error I'm getting for all the node_modules are in the following structure:

ERROR in ./node_modules/alt/lib/store/StoreMixin.js || Module not found: Error: Can't resolve 'transmitter' in 'client/node_modules/alt/lib/store'

My theory is that somewhere I have a mismatch on the file-loader, expose-loader, or imports-loader versions since it makes sense that without the proper versions, the modules wouldn't get imported. I've ensured that all the module.rules have loaders that end in the -loader pattern. yarn install also succeeds without errors.

My dependencies and Webpack configurations are as follows:

At work we are using Karma-Mocha with Chai-Enzyme to unit test our react code. I'm hoping some one could give me a basic example on how to unit test a basic ternary.

Example ternary such as this: