• Stars
    star
    1,417
  • Rank 32,444 (Top 0.7 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 6 years ago
  • Updated about 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Starts server, waits for URL, then runs test command; when the tests end, shuts down server

start-server-and-test

Starts server, waits for URL, then runs test command; when the tests end, shuts down server

NPM

Build status semantic-release js-standard-style renovate-app badge

Install

Requires Node version 8.9 or above.

npm install --save-dev start-server-and-test

Upgrade

v1 to v2

If you are using just the port number, and the resolved URL localhost:xxxx no longer works, use the explicit http://localhost:xxxx instead

# v1
$ npx start-test 3000
# v2
$ npx start-test http://localhost:3000

Use

This command is meant to be used with NPM script commands. If you have a "start server", and "test" script names for example, you can start the server, wait for a url to respond, then run tests. When the test process exits, the server is shut down.

{
    "scripts": {
        "start-server": "npm start",
        "test": "mocha e2e-spec.js",
        "ci": "start-server-and-test start-server http://localhost:8080 test"
    }
}

To execute all tests simply run npm run ci.

Commands

In addition to using NPM script names, you can pass entire commands (surround them with quotes so it is still a single string) that will be executed "as is". For example, to start globally installed http-server before running and recording Cypress.io tests you can use

# run http-server, then when port 8000 responds run Cypress tests
start-server-and-test 'http-server -c-1 --silent' 8000 './node_modules/.bin/cypress run --record'

Because npm scripts execute with ./node_modules/.bin in the $PATH, you can mix global and locally installed tools when using commands inside package.json file. For example, if you want to run a single spec file:

{
  "scripts": {
    "ci": "start-server-and-test 'http-server -c-1 --silent' 8080 'cypress run --spec cypress/integration/location.spec.js'"
  }
}

Or you can move http-server part into its own start script, which is used by default and have the equivalent JSON

{
  "scripts": {
    "start": "http-server -c-1 --silent",
    "ci": "start-server-and-test 8080 'cypress run --spec cypress/integration/location.spec.js'"
  }
}

Here is another example that uses Mocha

{
  "scripts": {
    "ci": "start-server-and-test 'http-server -c-1 --silent' 8080 'mocha e2e-spec.js'"
  }
}

Alias

You can use either start-server-and-test, server-test or start-test commands in your scripts.

You can use : in front of port number like server-test :8080, so all these are equivalent

start-server-and-test start http://127.0.0.1:8080 test
server-test start http://127.0.0.1:8080 test
server-test http://127.0.0.1:8080 test
server-test 127.0.0.1:8080 test
start-test :8080 test
start-test 8080 test
start-test 8080

Tip: I highly recommend you specify the full url instead of the port, see the localhost vs 0.0.0.0 vs 127.0.0.1 section later in this README.

Options

If you use convention and name your scripts "start" and "test" you can simply provide URL

{
    "scripts": {
        "start": "npm start",
        "test": "mocha e2e-spec.js",
        "ci": "start-server-and-test http://localhost:8080"
    }
}

You can also shorten local url to just port, the code below is equivalent to checking http://127.0.0.1:8080.

{
    "scripts": {
        "start": "npm start",
        "test": "mocha e2e-spec.js",
        "ci": "server-test 8080"
    }
}

You can provide first start command, port (or url) and implicit test command

{
    "scripts": {
        "start-it": "npm start",
        "test": "mocha e2e-spec.js",
        "ci": "server-test start-it 8080"
    }
}

You can provide port number and custom test command, in that case npm start is assumed to start the server.

{
    "scripts": {
        "start": "npm start",
        "test-it": "mocha e2e-spec.js",
        "ci": "server-test :9000 test-it"
    }
}

You can provide multiple resources to wait on, separated by a pipe |. (be sure to wrap in quotes)

{
  "scripts": {
    "start": "npm start",
    "test-it": "mocha e2e-spec.js",
    "ci": "server-test \"8080|http://foo.com\""
  }
}

or for multiple ports simply: server-test '8000|9000' test.

If you want to start the server, wait for it to respond, and then run multiple test commands (and stop the server after they finish), you should be able to use && to separate the test commands:

{
  "scripts": {
    "start": "npm start",
    "test:unit": "mocha test.js",
    "test:e2e": "mocha e2e.js",
    "ci": "start-test 9000 'npm run test:unit && npm run test:e2e'"
  }
}

The above script ci after the 127.0.0.1:9000 responds executes the npm run test:unit command. Then when it finishes it runs npm run test:e2e. If the first or second command fails, the ci script fails. Of course, your mileage on Windows might vary.

expected

The server might respond, but require authorization, returning an error HTTP code by default. You can still know that the server is responding by using --expect argument (or its alias --expected):

$ start-test --expect 403 start :9000 test:e2e

See demo-expect-403 NPM script.

Default expected value is 200.

npx and yarn

If you have npx available, you can execute locally installed tools from the shell. For example, if the package.json has the following local tools:

{
  "devDependencies": {
    "cypress": "3.2.0",
    "http-server": "0.11.1",
    "start-server-and-test": "1.9.0"
  }
}

Then you can execute tests simply:

$ npx start-test 'http-server -c-1 .' 8080 'cypress run'
starting server using command "http-server -c-1 ."
and when url "http://127.0.0.1:8080" is responding
running tests using command "cypress run"
Starting up http-server, serving .
...

Similarly, you can use yarn to call locally installed tools

$ yarn start-test 'http-server -c-1 .' 8080 'cypress run'
yarn run v1.13.0
$ /private/tmp/test-t/node_modules/.bin/start-test 'http-server -c-1 .' 8080 'cypress run'
starting server using command "http-server -c-1 ."
and when url "http://127.0.0.1:8080" is responding
running tests using command "cypress run"
Starting up http-server, serving .
...

localhost vs 0.0.0.0 vs 127.0.0.1

The latest versions of Node and some web servers listen on host 0.0.0.0 which no longer means localhost. Thus if you specify just the port number, like :3000, this package will try http://127.0.0.1:3000 to ping the server. A good practice is to specify the full URL you would like to ping.

# same as "http://127.0.0.1:3000"
start-server start 3000 test
# better
start-server start http://127.0.0.1:3000 test
# or
start-server start http://0.0.0.0:3000 test
# of course, if your server is listening on localhost
# you can still set the URL
start-server start http://localhost:3000 test

Note for yarn users

By default, npm is used to run scripts, however you can specify that yarn is used as follows:

"scripts": {
    "start-server": "yarn start",
    "test": "mocha e2e-spec.js",
    "ci": "start-server-and-test 'yarn start-server' http://localhost:8080 'yarn test'"
}

Note for webpack-dev-server users

Also applies to Vite users!

If you are using webpack-dev-server (directly or via angular/cli or other boilerplates) then the server does not respond to HEAD requests from start-server-and-test. You can check if the server responds to the HEAD requests by starting the server and pinging it from another terminal using curl

# from the first terminal start the server
$ npm start
# from the second terminal call the server with HEAD request
$ curl --head http://localhost:3000

If the server responds with 404, then it does not handle the HEAD requests. You have two solutions:

Use HTTP GET requests

You can force the start-server-and-test to ping the server using GET requests using the http-get:// prefix:

start-server-and-test http-get://localhost:8080

Ping a specific resource

As an alternative to using GET method to request the root page, you can try pinging a specific resource, see the discussion in the issue #4.

# maybe the server responds to HEAD requests to the HTML page
start-server-and-test http://localhost:3000/index.html
# or maybe the server responds to HEAD requests to JS resource
start-server-and-test http://localhost:8080/app.js

Explanation

You can watch the explanation in the video Debug a Problem in start-server-and-test.

Under the hood this module uses wait-on to ping the server. Wait-on uses HEAD by default, but webpack-dev-server does not respond to HEAD only to GET requests. Thus you need to use http-get:// URL format to force wait-on to use GET probe or ask for a particular resource.

Debugging

To see diagnostic messages, run with environment variable DEBUG=start-server-and-test

$ DEBUG=start-server-and-test npm run test
  start-server-and-test parsing CLI arguments: [ 'dev', '3000', 'subtask' ] +0ms
  start-server-and-test parsed args: { services: [ { start: 'npm run dev', url: [Array] } ], test: 'npm run subtask' }
...
making HTTP(S) head request to url:http://127.0.0.1:3000 ...
  HTTP(S) error for http://127.0.0.1:3000 Error: Request failed with status code 404

Disable HTTPS certificate checks

To disable HTTPS checks for wait-on, run with environment variable START_SERVER_AND_TEST_INSECURE=1.

Timeout

This utility will wait for maximum of 5 minutes while checking for the server to respond (default). Setting an environment variable WAIT_ON_TIMEOUT=600000 (milliseconds) sets the timeout for example to 10 minutes.

Interval

This utility will check for a server response every two seconds (default). Setting an environment variable WAIT_ON_INTERVAL=600000 (milliseconds) sets the interval for example to 10 minutes.

Starting two servers

Sometimes you need to start one API server and one webserver in order to test the application. Use the syntax:

start-test <first command> <first resource> <second command> <second resource> <test command>

For example if API runs at port 3000 and server runs at port 8080:

{
  "scripts": {
    "test": "node src/test",
    "start:api": "node src/api",
    "start:server": "node src/server",
    "test:all": "start-test start:api 3000 start:server 8080 test"
  }
}

In the above example you would run npm run test:all to start the API first, then when it responds, start the server, and when the server is responding, it would run the tests. After the tests finish, it will shut down both servers. See the repo start-two-servers-example for full example

Note for Apollo Server users

When passing a simple GET request to Apollo Server it will respond with a 405 error. To get around this problem you need to pass a valid GraphQL query into the query parameter. Passing in a basic schema introspection query will work to determine the presence of an Apollo Server. You can configure your npm script like so:

{
  "scripts": {
    "ci": "start-server-and-test start 'http-get://localhost:4000/graphql?query={ __schema { queryType { name } } }' test"
  }
}

Small print

Author: Gleb Bahmutov <[email protected]> © 2017

License: MIT - do anything with the code, but don't blame me if it does not work.

Support: if you find any problems with this module, email / tweet / open issue on Github

MIT License

See LICENSE

More Repositories

1

code-snippets

Chrome DevTools code snippets
JavaScript
1,798
star
2

npm-install

GitHub Action for install npm dependencies with caching without any configuration
JavaScript
642
star
3

next-update

Tests if module's dependencies can be updated to latest version
JavaScript
558
star
4

bottle-service

Instant web applications restored from ServiceWorker cache
JavaScript
331
star
5

javascript-journey

Source code for blog post Journey from procedural to reactive JavaScript with stops
JavaScript
329
star
6

babel-service

On demand targeted transpiling inside the browser's ServiceWorker
JavaScript
209
star
7

dont-break

Checks if the current version of your package would break dependent projects
JavaScript
206
star
8

cy-api

Cypress custom command "cy.api" for end-to-end API testing
TypeScript
206
star
9

cypress-and-jest

Cypress and Jest both with code coverage running unit tests
JavaScript
205
star
10

express-service

Package ExpressJS server to run inside a ServiceWorker
JavaScript
203
star
11

cypress-failed-log

Saves the Cypress test command log as a JSON file if a test fails
JavaScript
179
star
12

snap-shot

Jest-like snapshot feature for the rest of us, works magically by finding the right caller function
JavaScript
171
star
13

pre-git

Automatically install pre-commit / pre-push hooks in your git repo
JavaScript
169
star
14

cypress-svelte-unit-test

Unit testing Svelte components in Cypress E2E test runner
JavaScript
160
star
15

cypress-angular-unit-test

Trying to load and bootstrap Angular component dynamically inside Cypress
TypeScript
157
star
16

cypress-dark

Dark and Halloween color themes for Cypress.io test runner
CSS
155
star
17

snap-shot-it

Smarter snapshot utility for Mocha and BDD test runners + data-driven testing!
JavaScript
155
star
18

draw-cycle

Simple Cycle.js application visualized: streams, events, DOM
HTML
146
star
19

now-pipeline

Simple CI pipeline with goal to deploy new version at Zeit Now cloud if tests pass
JavaScript
143
star
20

console.table

Adds console.table method that prints an array of objects as a table in console
JavaScript
140
star
21

npm-quick-run

Quickly run NPM script by prefix without typing the full name
JavaScript
139
star
22

next-and-cypress-example

Next.js example instrumented for code coverage from Cypress tests
JavaScript
129
star
23

cypress-skip-and-only-ui

Client-side buttons to run a single test or skip it for Cypress test runner
TypeScript
128
star
24

cache-require-paths

Caches resolved paths in module require to avoid Node hunting for right module. Speeds up app load.
JavaScript
127
star
25

npm-module-checklist

Steps to check when starting, working and publishing a module to NPM
124
star
26

really-need

Node require wrapper with options for cache busting, pre- and post-processing
JavaScript
109
star
27

add-typescript-to-cypress

Quickly adds TypeScript spec support to Cypress
JavaScript
108
star
28

cypress-examples

Static site with Cypress examples tested right from the Markdown sources
JavaScript
105
star
29

cypress-select-tests

User space solution for picking Cypress tests to run
JavaScript
98
star
30

test-todomvc-using-app-actions

Example Cypress tests going from page objects to app actions
TypeScript
97
star
31

cypress-movie

Generate movies from your Cypress end-to-end tests
JavaScript
95
star
32

eslint-rules

My custom eslint rules in addition to the ones provided at http://eslint.org/
JavaScript
95
star
33

console-log-div

Clones console.log calls to a created div in the page. Great for demos and experiments.
JavaScript
94
star
34

rambo

Automatic Ramda solution bot
JavaScript
92
star
35

git-branches

Bash shell to show current branches and their descriptions using only default Git features
JavaScript
89
star
36

cypress-recurse

A way to re-run Cypress commands until a predicate function returns true
JavaScript
88
star
37

game-of-github

Play Game of Life in your GitHub contributions
JavaScript
83
star
38

have-it

The fastest NPM install does nothing because you already have it
JavaScript
75
star
39

node-rx-cycle

Example using RxJS and Cycle.js on the server to handle requests (NOT server-side rendering)
JavaScript
73
star
40

lazy-ass

Lazy node assertions without performance penalty
TypeScript
68
star
41

talks

Public presentations
JavaScript
67
star
42

node-hook

Run source transform function on node require call
JavaScript
66
star
43

as-a

Runs a given command with additional environment settings for simple local development
JavaScript
64
star
44

ban-sensitive-files

Checks filenames to be committed against a library of filename rules to prevent sensitive files in Git
JavaScript
62
star
45

cypress-split

Split Cypress specs across parallel CI machines for speed
JavaScript
59
star
46

js-complexity-viz

JavaScript source code complexity tool
JavaScript
58
star
47

changed-log

Returns all commit messages between 2 versions of an NPM module
JavaScript
58
star
48

cypress-network-idle

A little Cypress.io plugin for waiting for network to be idle before continuing with the test
JavaScript
55
star
49

rollem

Roll up multiple ES6 bundles at once
JavaScript
54
star
50

cypress-watch-and-reload

Reloads Cypress when one of the watched files changes
JavaScript
53
star
51

cypress-data-session

Cypress command for flexible test data setup
JavaScript
51
star
52

cypress-esbuild-preprocessor

Bundle Cypress specs using esbuild
JavaScript
48
star
53

functional-pipeline

Quickly chain method calls, property access and functions into a pipeline
JavaScript
48
star
54

cypress-if

Easy conditional if-else logic for your Cypress tests when there is no other way
JavaScript
46
star
55

demo-docker-cypress-included

Demo running the complete Docker image `cypress/included`
Shell
45
star
56

vue-vuex-todomvc

Example TodoMVC Vue.js app with Vuex store and server backend via REST
JavaScript
44
star
57

manpm

Shows the relevant part of NPM module's README file right in your terminal
JavaScript
42
star
58

mocked-env

Easy way to mock process.env during BDD testing
JavaScript
42
star
59

compiled

Compiles the ES* bundle to your NodeJS version on install
JavaScript
41
star
60

ng-simple-webrtc

AngularJS wrapper for SimpleWebRTC client from https://simplewebrtc.com/
JavaScript
41
star
61

cypress-playwright

Run Cypress tests using Playwright and Playwright tests using Cypress
JavaScript
41
star
62

next-updater

Dependable and safe automatic dependency updater for Nodejs packages
JavaScript
41
star
63

rocha

Runs Mocha unit tests but randomizes their order
JavaScript
40
star
64

node-mock-examples

Examples of tests that mock Node system APIs: fs, http, child_process, timers
JavaScript
39
star
65

generator-node-bahmutov

My personal Node project boilerplate generator
JavaScript
38
star
66

center-code

Shows the file's source centered in the terminal
JavaScript
38
star
67

bdd-stdin

Utility for easily feeding mock responses to unit tests that require command line input from the user
JavaScript
38
star
68

instant-vdom-todo

Prehydrated, self-rewriting TodoMVC using Virtual-Dom and bottle-service
JavaScript
37
star
69

hydrate-app

Quick app pre-loading using saved HTML snapshot
JavaScript
36
star
70

cypress-workshop-basics

Basics of end-to-end testing with Cypress.io test runner
JavaScript
35
star
71

iframe-api

Bidirectional method calls API between external and iframed code.
JavaScript
35
star
72

cly

A prototype of Cypress CLI for quicker project scaffolding
JavaScript
34
star
73

condition-circle

Checks CircleCI environment before publishing successful build using semantic-release
JavaScript
33
star
74

cy-spok

Playing with spok inside Cypress
JavaScript
33
star
75

cypress-extends

Cypress plugin that adds "extends" support to the configuration file
JavaScript
33
star
76

schema-shot

Framework-agnostic snapshot testing using "schema by example" for highly dynamic data
JavaScript
33
star
77

spots

Partial function argument binding with placeholders
JavaScript
33
star
78

change-by-example

Finds a function that transforms a given object into another given object.
JavaScript
33
star
79

cypress-repeat

Run Cypress multiple times in a row
JavaScript
32
star
80

grunty

Run any grunt plugin as NPM script without Gruntfile.js
JavaScript
31
star
81

cypress-gh-action-example

Example running Cypress tests inside GitHub Action
JavaScript
31
star
82

all-nvm

Run any NPM command (including install) in all versions of Node managed by NVM
JavaScript
30
star
83

ci-publish

Poor man's semantic release utility. Let the CI do the `npm publish` step after the build passes
JavaScript
30
star
84

find-cypress-specs

Find Cypress spec files using the config settings
JavaScript
29
star
85

prettier-config-example

Example project with different per-folder prettier config and VSCode formatting on save
JavaScript
28
star
86

next-ver

Tells you the next semantic version for your local package
JavaScript
28
star
87

xplain

JavaScript API documentation generator that uses unit tests as examples, see example API doc at
JavaScript
28
star
88

todo-graphql-example

Example Todo app on top of json-graphql-server
JavaScript
27
star
89

local-cypress

Use Cypress without global objects
JavaScript
27
star
90

comment-value

Instruments a Node program and updates its comments with computed expression values
JavaScript
27
star
91

d3-helpers

Little utility D3 functions
JavaScript
27
star
92

cypress-hyperapp-unit-test

Unit test Hyperapp components using Cypress
JavaScript
26
star
93

google-cloud-build-example

Example running Cypress end-to-end tests on Google Cloud Build
JavaScript
26
star
94

heroin

Strong and addictive dependency injection for JavaScript
JavaScript
25
star
95

ggit

Local git command wrappers
JavaScript
25
star
96

wiseli

See the repo's example while installing it with NPM
JavaScript
24
star
97

cypress-timings

A Cypress plugin for reporting individual command timings
JavaScript
24
star
98

term-to-html

Stream terminal output with ansi codes into nicely formatted HTML
JavaScript
24
star
99

cypress-angularjs-unit-test

Unit test Angularjs code using Cypress.io test runner
JavaScript
23
star
100

cypress-get-it

Get elements by data attribute by creating a Cy command on the fly
JavaScript
23
star