reactjs


“Define is not defined” in Jest when testing es6 module with RequireJS dependency


I have a Jest test suite that fails to run because the component it's trying to test depends on a RequireJS module. Here's the error I'm seeing:
FAIL __tests__/components/MyComponent.test.js
● Test suite failed to run
ReferenceError: define is not defined
at Object.<anonymous> (node_modules/private-npm-module/utils.js:1:90)
The component has the following import:
import utils from 'private-npm-module';
And the private-npm-module is set up like so:
define('utils', [], function() {
return {};
});
When MyComponent is transpiled with babel and run in the browser, the dependency operates correctly. This issue only affects the unit test. How can I get my test suite to run on a component with a RequireJS dependency?
I'm using babel-jest as my scriptPreprocessor in package.json's jest config. I'm using jest v0.15.1.
So, RequireJS is not supported by Jest. In my particular case, it was easiest and most appropriate to mock my dependency at the top of MyComponent.test.js:
jest.mock('private-npm-module', () => {
// mock implementation
})
import MyComponent from '../../components/MyComponent';
This way, when MyComponent is loaded, its dependency is already mocked, so it won't try to load the RequireJS module.
If you really do need to load your RequireJS module for your test, it may be possible to use jest's transform configuration to wrap your implementation in a RequireJS to ES6 converter.

Related Links

React - Accessing updated values from nested components
React webpack create bundle with separated react
Handle meta tags and document title in React for crawlers
React native NavigationBar position
Is draft.js on bower?
React PropTypes vs. Flow
React Router Link does not work
How to use react-intl v2 + webpack to load locale file?
Can't get values of select and reassign it
Check if one propType is used with another inside Component
Webpack - errors at compile ES6
Pass meteor data to dynamic react children
Element-less component with bound events
compiled/minified jsx file is bigger than original file
How to use arrow functions inside React.createClass
Preventing react from rendering unchanged componets into the virtual DOM

Categories

HOME
reactjs
max
grpc
xamarin.forms
python-requests
azure-database-mysql
mingw
ms-access-2010
uml-designer
python-3.4
qt4
virtualhost
rethinkdb
software-collections
spring-data-solr
apache-httpclient-4.x
angular-universal
google-search-appliance
lambda-calculus
box2d
exchange-transport-agents
web-worker
airbnb
cherrypy
combinations
fibonacci
angular2-pipe
chartist.js
ckeditor4.x
aws-certificate-manager
suitescript
knapsack-problem
continuous-fourier
marionette
scripting-language
pypy
cqlsh
federated
boost-log
multilanguage
akamai
mplab
spring-oauth2
wercker
imdb
traitsui
bootcamp
mootools
odp.net
wit-ai
certbot
campaign-monitor
iterm2
idea-plugin
julia-jump
google-cloud-powershell
peerjs
rexx
taiga
cakephp-3.2
bootstrap-carousel
django-cors-headers
azure-data-catalog
serverless-architecture
jsfl
cc
grib
business-catalyst
blackberry
lattice
hfp
python-rq
cexception
dcast
music-player
instabug
wiql
taverna
roslyn-code-analysis
textblob
avrcp
fileinputstream
mergecursor
copy-on-write
veeam
nfa
attiny
xcode5
jsonmodel
sync
api-eveonline
android-jack-and-jill
mysql-error-1146
xml-validation
mencoder
sygic
oc4j
violation
dynamic-expresso
reference-manual
system.transactions
setcookie
esi
jquery-1.8
xcode4.6.3
bindinglist
sqlbuddy
maven-eclipse-plugin
copyfile
wdm
isgl3d
pex-and-moles
symfony-1.2
file-processing
object-tag
moss2007-security
s60
lts
time-management
opengl-to-opengles
file-icons

Resources

Encrypt Message



code
soft
python
ios
c
html
jquery
cloud
mobile