https://github.com/airtoxin/enantiom

All-in-one web page screenshot testing tool.
https://github.com/airtoxin/enantiom

Last synced: 4 months ago
JSON representation

All-in-one web page screenshot testing tool.

• Host: GitHub
• URL: https://github.com/airtoxin/enantiom
• Owner: airtoxin
• License: mit
• Created: 2021-08-27T02:06:13.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2023-01-08T01:41:03.000Z (about 2 years ago)
• Last Synced: 2024-11-02T14:05:05.770Z (4 months ago)
• Language: TypeScript
• Homepage:
• Size: 1.11 MB
• Stars: 2
• Watchers: 3
• Forks: 1
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# [](https://github.com/airtoxin/enantiom)

[![npm version](https://badge.fury.io/js/enantiom.svg)](https://badge.fury.io/js/enantiom)

![GA test](https://github.com/github/docs/actions/workflows/test.yml/badge.svg?branch=master)

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

All-in-one web page screenshot testing tool.

![console](./docs/console.png)

## ✨ Features

- Take screenshot and compare with previous one

- Create static HTML report

- Change browser type / screen size

- Browser scripting

## 📦 Usage

Install the cli via **NPM**:

```

npm i -g enantiom

```

Install the cli via **Yarn**:

```

yarn global add enantiom

```

Create `enantiom.config.json`.

```json

{

  "artifact_path": "./dist",

  "screenshots": ["https://example.com", "https://time.is"]

}

```

Then, run enantiom cli with config option.

```shell

$ enantiom --config enantiom.config.json

```

One more time, run same command to calculate pixel diff from previous result.

```shell

$ enantiom --config enantiom.config.json

```

Static result report output to `dist` directory.  

Open it!

```shell

$ npx serve dist

```

## ⚙ Config

- [enantiom CLI options](./docs/CLI_OPTIONS.md)

- [enantiom.config.json](./docs/CONFIG_JSON.md)

examples are exists in [example](./example) directory.

## Development

Setup: just run `npm install`

### Tool development

```shell

$ npm run build

$ npm link

$ enantiom --config example/enantiom.config.json --no-html

```

### React console development

```shell

$ npm run dev --config example/enantiom.config.json

$ npm run site:dev

```

## Feature TODOs

- Debug mode

- Reuse browser object option