Webpack Dev-Server: Hook oder Mechanismus für Trigger-Befehl, sobald der Server läuft

Question

In meinem Entwicklungs-Workflow öffne ich 2 Terminal-Windows für die Ausführung in einem meiner npm start task, sobald der Server im zweiten Fenster läuft ich ein Gurkejs Funktional ausgeführt Testsuite und das funktionierte wie erwartet. Aber mein Problem ist, dass ich in meiner CI-Umgebung dies in einem einzigen Prozess ausführen muss. Ich habe dies versucht:

npm start | cucumberjs --require test/functional/ --compiler js:babel-register test/functional/

Das Problem dabei ist die Aufgabe npm Start eine Weile laufen nehmen und zugleich die Gurke Aufgabe, den Zugang zu localhost versuchen: 3000 (die URL wenn der webpack-dev-server läuft, aber der Server noch nicht bereit ist und die Tests fehlschlagen.

Also, wie kann ich damit umgehen?

Das Projekt:https://github.com/gpincheiraa/angularjs-tdd-jest/tree/dev

package.json

... 

    "scripts": { 
    "start": "npm run stubs & webpack-dev-server", 
    "dev": "npm start -- --open", 
    "stubs": "stubby -w -d stubs/fakeserver.yml -s 5000", 
    "tdd": "cross-env NODE_PATH=./src jest --watch --verbose", 
    "test": "cross-env NODE_PATH=./src jest --coverage --verbose", 
    "test:functional": "cucumberjs --require test/functional/ --compiler js:babel-register test/functional/", 
    //I want in the test:functional-ci task run the npm start and once that is serving the project, run npm run test:functional task 
    "test:functional-ci": "cross-env NODE_ENV=staging npm run test:functional", 
    "test-debug": "cross-env NODE_PATH=./src node --inspect --inspect-brk node_modules/.bin/jest -i", 
    "build": "webpack", 
    "check-coverage": "npm test | http-server -so -p 9000 coverage/lcov-report" 
    }, 

    ... 

webpack.config.js

module.exports = { 
    entry: [ 
     'core-js/shim', 
     'babel-polyfill', 
     'angular', 
     './src/index.js' 
    ], 
    output: { 
     path: 'dist', 
     filename: 'index.bundle.js' 
    }, 
    module: { 
     loaders: [ 
     { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader'}, 
     { test: /\.css$/, loader: 'style-loader!css-loader' }, 
     { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file" }, 
     { test: /\.(html)$/, loader: 'html-loader' }, 
     { test: /\.(woff|woff2)$/, loader:"url?prefix=font/&limit=5000" }, 
     { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/octet-stream" }, 
     { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=image/svg+xml" }] 
    }, 
    cache: true, 
    devtool: 'eval-source-map', 
    devServer: { 
     filename: "index.bundle.js", 
     contentBase: "./src", 
     port: 3000, 
     watch: true, 
     publicPath: "/", 
     historyApiFallback: true, 
     stats: { 
      colors: true, 
      chunks: false 
     } 
    } 
}; 

Answer 1

Endlich kann ich mein Problem nicht direkt lösen mit etwas Webpack Option. Auf meinem CI-System betreibe ich folgendes: So

package.json

"scripts": { 
    "start": "sh -c \"npm run stubs & webpack-dev-server\"", 
    ... 
    "test:functional": "cucumberjs --require test/functional/ --compiler 
    ... 

.travis.yml

before_script: npm start & sleep 7 
script: npm run test:functional 

wenn ich npm start & sleep 7 laufen, ich gebe 7 Sekunden zu npm start dafür die Aufgabe ihre Arbeit und dann ich das npm run test:functional Skript ausführen.

Das ist mein Repo: https://github.com/gpincheiraa/angularjs-tdd-jest und das ist das Ergebnis in der CI travis log: https://travis-ci.org/gpincheiraa/angularjs-tdd-jest/jobs/271532237