À l'aide de webpack alias moka tests
Je suis le développement d'une application web à l'œuvre dans de Réagir/Redux/Webpack et je suis maintenant de commencer à intégrer des tests avec Moka.
J'ai suivi les instructions pour l'écriture de tests dans le Redux documentation, mais maintenant, j'ai couru dans un problème avec mon webpack alias.
Par exemple, prendre un coup d'oeil à la section imports de ce test pour l'un de mes action créateurs:
import expect from 'expect' //resolves without an issue
import * as actions from 'actions/app'; //can't resolve this alias
import * as types from 'constants/actionTypes'; //can't resolve this alias
describe('Actions', () => {
describe('app',() => {
it('should create an action with a successful connection', () => {
const host = '***************',
port = ****,
db = '******',
user = '*********',
pass = '******';
const action = actions.createConnection(host, port, db, user, pass);
const expectedAction = {
type: types.CREATE_CONNECTION,
status: 'success',
payload: { host, port, database, username }
};
expect(action).toEqual(expectedAction);
});
});
});
Comme les commentaires le suggèrent, moka n'est pas en mesure de résoudre mes déclarations d'importation lorsqu'ils sont de référencement alias dépendances.
Parce que je suis encore nouveau pour webpack, voici mon webpack.config.js
:
module.exports = {
devtool: 'eval-source-map',
entry: [
'webpack-hot-middleware/client',
'./src/index'
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/static/'
},
resolve: {
extensions : ['', '.js', '.jsx'],
alias: {
actions: path.resolve(__dirname, 'src', 'actions'),
constants: path.resolve(__dirname, 'src', 'constants'),
/* more aliases */
}
},
plugins: [
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
],
module: {
loaders: [{
test: /\.js$/,
loaders: ['babel'],
exclude: /node_modules/,
include: __dirname
}]
}
};
Aussi, je suis en utilisant la commande npm test
pour exécuter moka, voici le script que j'utilise dans mon package.json
.
{
"scripts": {
"test": "mocha ./src/**/test/spec.js --compilers js:babel-core/register --recursive"
}
}
Donc voilà où je me retrouve coincé. J'ai besoin d'inclure les alias à partir de webpack en moka lorsqu'il s'exécute.
- Je vais avoir le même problème, avez vous trouvé un moyen de faire cela ?
- Yep, vient de poster ma réponse. YMMV
Vous devez vous connecter pour publier un commentaire.
Bon alors j'ai réalisé que tout ce dont j'ai été l'aliasing était dans le
src/
répertoire, donc j'ai simplement besoin de modifier monnpm run test
script.Probablement ne fonctionnera pas pour tout le monde, mais qui a résolu mon problème.
src
, mais vous ne savez pas comment mettre en œuvre votre correction dans mon script de test:find ./src -name '*.test.js' | xargs mocha --require babel-core/register
mocha-webpack
à la place de cette solution de contournement. github.com/zinserjan/mocha-webpackVous pouvez également utiliser un babel plugin j'ai été l'auteur:
https://github.com/trayio/babel-plugin-webpack-alias
Il vous permet de convertir vos alias de chemin d'accès pour les chemins relatifs en incluant une babel plugin pour votre
.babelrc
.J'ai aussi rencontré le même problème, mais avec ce plugin, je l'ai résolu.
https://www.npmjs.com/package/babel-plugin-webpack-aliases
L'exécution de la commande de votre "moka" n'est pas la lecture de la
webpack.config.js
, donc il ne peut pas résoudre le nom d'alias.Grâce à ce plugin, envisager
webpack.config.js
lors de la compilation avec "babel-core/s'inscrire". En conséquence, l'alias sera également valable lors des tests.et ajouter ce paramètre à
.babelrc
Danny réponse est grande. Mais ma situation est un peu différente.
J'ai utilisé webpack est
resolve.alias
d'utiliser tous les fichiers soussrc
dossier.et l'utilisation d'un préfixe spécial pour mes propres modules suivants:
Pour tester un code comme ceci
J'ai du ajouter une commande
ln -sf src test/alias/-
avant moka tester et d'utiliser laNODE_PATH=./test/alias
truc Danny camp avec. Donc le script final serait comme ceci:PS:
J'ai utilisé
-
parce que beautifal charactors comme@
ou~
ne sont pas assez sûres. J'ai trouvé la réponse pour la sécurité de caractères iciJe pense que j'ai résolu ce problème. Vous devez utiliser 2 package: maquette besoin et proxyquire.
En supposant que vous avez un fichier js comme ceci:
app.js
Et votre code de test doit écrire comme ceci:
app.test.js
arborescence des fichiers
Première maquette de l'alias de chemin d'accès par la maquette nécessitent en avant la fonction, et se moquer de l'objet du test par proxyquire dans beforeEach fonction.
Je suppose que vous auriez
--require babel-register
dans votremocha.opts
. Vous pouvez utiliser babel module de résolution plugin https://github.com/tleunen/babel-plugin-module-resolver. Cela vous permet de définir des alias dans .babelrc, similaire à votre webpack alias:J'ai eu exactement le même problème. Il semble impossible d'utiliser des alias dans webpack require.js ou du noeud besoin.
J'ai fini par utiliser maquette besoin dans les tests unitaires et simplement remplacer les chemins d'accès manuellement, comme ceci:
maquette besoin est un bon outil, parce que probablement que vous souhaitez pour se moquer de la plupart de vos dépendances de toute façon au lieu d'utiliser la réelle scripts de
src
.De garder les alias dans un endroit comme
config/webpack.common.js
puis installer babel-plugin-webpack-alias
puis dans
.babelrc
mettre :