Last Hit

Continuous Integration

Everybody loves continuous integration, we too.

Directly in any folder

Install

npm install -g last-hit-replayer

or

yarn global add last-hit-replayer

Yarn is recommanded. For install Yarn, see yarnpkg.com

Node.js 12 is required.

Run

Run whole workspace

last-hit-replayer --workspace=directory/to/your/workspace

Specify Story

last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name

Specify Flow

last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --flow=your-flow-name

In your project

Install

npm install last-hit-replayer

or

yarn add last-hit-replayer

Yarn is recommanded. For install Yarn, see yarnpkg.com

Add script

In package.json

"script": {
  "start": "last-hit-replayer"
}

Run

Run whole workspace

yarn start --workspace=directory/to/your/workspace

Specify Story

yarn start --workspace=directory/to/your/workspace --story=your-story-name

Specify Flow

yarn start --workspace=directory/to/your/workspace --story=your-story-name --flow=your-flow-name

Flow name will be ignored when story name does not specify.

Parallel

CI can be run in parallel, via --parallel cli argument.

Following are legal values of --parallel:

  • integer, specify how many child processes uses in CI.
  • non-integer, specify how many child processes uses in CI, base on CPU cores.

eg.

  • 8 child processes starts, not matter how many cpu cores there.
last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --parallel=8

eg.

  • If there are 16 cores, then 16 * 0.8 = 12.8 -> 13 child processes starts.
  • If there are 8 cores, then 8 * 0.8 = 6.4 -> 6 child processes starts.
last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --parallel=0.8

eg.

  • If there are 16 cores, then 16 * 1.2 = 19 -> 19 child processes starts.
  • If there are 8 cores, then 8 * 1.2 = 10 -> 10 child processes starts.
last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --parallel=1.2

CI is run synchronized if no --parallel specified.

CLI Arguments

All CLI arguments are passed by prefix --settings, such as --settings-sleepAfterChange.

Sleep after change

Sometimes the real change in memory data model will be invoked later. Use --settings-sleepAfterChange to set as global.

eg.

<input type="input" onChange="onChange" />
let changeTimeout;
const onChange = () => {
	if (changeTimeout) {
		clearTimeout(changeTimeout);
	}
	setTimeout(() => {
		// sync dom value into in memory model
	}, 200);
}

Then wait 200ms for each change step.

last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --flow=your-flow-name --settings-sleepAfterChange=200

Slow Ajax Time

To count how many ajax requests are slow than given time, default is 500ms.

eg.

last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --flow=your-flow-name --settings-slowAjaxTime=300

Ajax slower than 300ms should be counted.

Environment

Environment can be specified in IDE.

CLI Arguments

All CLI arguments can be set for each environments, unless they are given in CLI.

A workspace file with env settings as below,

{
	"name": "last-hit-demo",
	"envs": [
		{
			"name": "demo-env",
			"slowAjaxTime": 400
		}
	]
}

And CLI as

last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --flow=your-flow-name --env=demo-env

Then any ajax slower than 400ms should be counted as slow ajax.

Or via CLI, replace env settings,

last-hit-replayer --workspace=directory/to/your/workspace --story=your-story-name --flow=your-flow-name --env=demo-env --settings-slowAjaxTime=300

Then any ajax slower than 300ms should be counted as slow ajax.

URL Replacement

Sometimes record in one environment, and replay on another environment. The recorded url can be replaced via environment settings.

A workspace file with env settings as below,

{
	"name": "last-hit-demo",
	"envs": [
		{
			"name": "demo-dev",
			"urlReplaceRegexp": "^https?:\\/\\/localhost:3000(.*)$",
			"urlReplaceTo": "http://demo-dev.domain.com$1"
		}
	]
}

Then step url should be replace by the given regexp and replace to string.
Regexps can be splitted by &&.

{
	"name": "last-hit-demo",
	"envs": [
		{
			"name": "demo-dev",
			"urlReplaceRegexp": "^https?:\\/\\/localhost:3000(.*)$&&^https?:\\/\\/localhost:3002(.*)$",
			"urlReplaceTo": "http://demo-dev.domain.com$1&&http://demo-dev2.domain.com$1"
		}
	]
}

Make sure length of regexps and tos are same.

Result Gathering

After run replayer, output files can be found under workspace folder and cli run folder, knitting them as you wish.
We recommend attach key data and send notification mail to your team, simply using the features provided by CI Server.
Another option is collecting data to our Centralized Admin Server, for further analysis.