2.0.0 • Published 2 years ago

dialog-differ v2.0.0

Weekly downloads
7
License
ISC
Repository
-
Last release
2 years ago

Dialog differ

WORK IN PROGRESS

An application for diffing two dialogs against each other.

Uses Google Chrome's Puppeteer to take screenshots and ImageDiff to compare screenshots.

A collaboration with Starak.

Required

  • Node 6+

Use

npm install dialog-differ

const DialogDiffer = require( 'dialog-differ' );

const suite = { // see 'Suite' structure
    options: {
        sizes: [
            { width: 460, height: 350 },
            { width: 320, height: 150 }
        ],
        originalVersion: '1.0.1',
        currentVersion: '1.0.2'        
    },
    original: [
        {
            id: 'first',
            version: '1.0.1',
            url: 'http://example.com/1.0.1/dialog-first.html'
        },
        {
            id: 'second',
            version: '1.0.1',
            url: 'http://example.com/1.0.1/dialog-second.html'
        }
    ],
    current: [
        {
            id: 'first',
            version: '1.0.2',
            url: 'http://example.com/1.0.2/dialog-first.html'
        },
        {
            id: 'second',
            version: '1.0.2',
            url: 'http://example.com/1.0.2/dialog-second.html'
        }
    ]
};

// create dialog differ
const dialogDiffer = new DialogDiffer();

// init dialog differ
await dialogDiffer.initDialogDiffer( { databaseArgs: `${__dirname}/database.json` } ); // store database in database.json

// diff suite
const suiteResult = await dialogDiffer.diff( suite ); // see 'SuiteResult' structure

Methods

constructor

PropertyTypeDescription
[databaseLayer]AbstractDatabaseLayerDatabase layer. Default LowDbDatabaseLayer.
[logLevel]StringLog level. Default error.
const dialogDiffer = new DialogDiffer( {
    databaseLayer = null,
    logLevel = null,
} )

initDialogDiffer

Returns Promise<void>

Method to initialize dialog differ. Used to send arguments to database layer.

PropertyTypeDescription
[databaseArgs]anyDatabase arguments. See AbstractDatabaseLayer~initDB.
// store database in database.json when using LowDbDatabaseLayer
await dialogDiffer.initDialogDiffer( { databaseArgs: `${__dirname}/database.json` } );

diff

Returns Promise<DialogDiffer.SuiteResult>

Diffs original dialogs with current dialogs.

PropertyTypeDescription
suiteDialogDiffer.SuiteSuite. See AbstractDatabaseLayer~initDB.
const suiteResult = await dialogDiffer.diff( suite );

getSuiteResult

Returns Promise<DialogDiffer.SuiteResult>

Get running or finished DialogDiffer.SuiteResult from database.

PropertyTypeDescription
suiteIdStringSuite id
const suiteResult = await dialogDiffer.getSuiteResult( suiteId );

getLastSuiteResults

Returns Promise<Array<DialogDiffer.SuiteResult>>

Get list of latest running or finished DialogDiffer.SuiteResult from database.

const suiteResults = await dialogDiffer.getLastSuiteResults();

deleteDialogs

Returns Promise<Boolean>

Delete all DialogDiffer.DialogScreenshots for Dialogs matching dialogId from database.

PropertyTypeDescription
dialogIdStringDialog id
await dialogDiffer.deleteDialogs( dialogId );

deleteSuiteResult

Returns Promise<Boolean>

Delete DialogDiffer.SuiteResult for suiteId from database.

PropertyTypeDescription
suiteIdStringSuite id
await dialogDiffer.deleteSuiteResult( suiteId );

Structure

Input

Suite

PropertyTypeDescription
optionsDialogDiffer.OptionsSuite options
originalArray<DialogDiffer.Dialog>Original dialogs
currentArray<DialogDiffer.Dialog>Current dialogs

Suite Options

PropertyTypeDescriptionExample
sizesArray<{ width: Number, height: Number }>Sizes[ { width: 460, height: 350 } ]
originalVersionStringOriginal version1.0.1
currentVersionStringCurrent version1.0.2
[isForceSnap]BooleanForce snapfalse
[isForceDiff]BooleanForce difffalse

Suite Dialog

PropertyTypeDescriptionExample
versionStringDialog version1.0.1
idStringDialog idfirst
urlStringDialog URLhttp://example.com/1.0.1/dialog-first.html
[hash]StringURL hash#hash
[waitForSelector]StringWait for selectorbody.active
[timeout]NumberTimeout before taking snap (ms)250
[crop]StringSelector to use for cropping screenshot#container
[resize]Function(defaultWidth, defaultHeight): { width: Number, height: Number }Function evaluated by Puppeteer which returns the new size to use for screenshotfunction() { var container = document.querySelector('#container'); return { width: container.scrollWidth, height: container.scrollHeight }; }

Result

Suite Result

PropertyTypeDescriptionExample
optionsDialogDiffer.OptionsSuite options
resultsArray<DialogDiffer.DialogsResult>Dialog results[ DialogDiffer.DialogsResult, ... ]

Suite Dialogs Result

PropertyTypeDescriptionExample
dialogIdStringDialog idfirst
originalDialogDiffer.DialogResultOriginal dialog{ id: 'first', version: '1.0.1', url: ..., screenshots: [ ... ] }
currentDialogDiffer.DialogResultCurrent dialog{ id: 'first', version: '1.0.2', url: ..., screenshots: [ ... ] }
originalVersionStringOriginal version1.0.1
currentVersionStringCurrent version1.0.2
resultDifferConstantDiff resultchanged
differArray<DialogDiffer.DialogResultDiff>Dialogs diffs[ { index: 0, result: 'changed', base64: 'data:image/png;base64,...' } ]

Suite Dialog Result

Extends Suite Dialog

PropertyTypeDescriptionExample
screenshotsArray<base64: String, width: String, height: String>Dialog screenshots[ { base64: 'data:image/png;base64,...', width: 460, height: 350 } ]
[error]{ code: String, message: String }Error when creating screenshot{ code: 'snap-dialog-from-browser-error', message: 'Could not snap dialog url \'http://example.com/1.0.1/dialog-first.html\'' }

Suite Dialog Result Diff

PropertyTypeDescriptionExample
indexNumberIndex0
resultDifferConstantDiff resultidentical
base64StringDiff imagedata:image/png;base64,...

Suite Error

Extends JS Error

PropertyTypeDescriptionExample
messageStringError messageUnexpected error
codeErrorConstantsError codeunexpected-error
argsObjectError arguments{ dialogId: 'one' }

Constants

Error Constants

See ErrorConstants

PropertyTypeDescription
unexpected-errorStringUnexpected error

TODO More errors

Differ Constants

PropertyTypeDescription
identicalStringIdentical dialog/screenshot
changedStringChanged dialog/screenshot
newStringNew dialog/screenshot
deletedStringDeleted dialog/screenshot

Logger Constants

PropertyTypeDescription
noneStringNo logging
debugStringLog, info and error logging
infoStringInfo and error logging
errorStringError logging

Tests

  • npm install
  • npm test

Build

  • npm run dist

Todo

  • Examples
2.0.0

2 years ago

2.0.0-1

3 years ago

2.0.0-0

3 years ago

1.0.30

4 years ago

1.0.29

4 years ago

1.0.28

4 years ago

1.0.27

4 years ago

1.0.26

5 years ago

1.0.25

6 years ago

1.0.24

6 years ago

1.0.23

6 years ago

1.0.22

6 years ago

1.0.21

6 years ago

1.0.20

6 years ago

1.0.19

6 years ago

1.0.17

6 years ago

1.0.16

6 years ago

1.0.15

6 years ago

1.0.14

6 years ago

1.0.13

6 years ago

1.0.12

6 years ago

1.0.11

6 years ago

1.0.10

6 years ago

1.0.9

6 years ago

1.0.8

6 years ago

1.0.7

6 years ago

1.0.6

7 years ago

1.0.5

7 years ago

1.0.4

7 years ago

1.0.3

7 years ago

1.0.2

7 years ago

1.0.1

7 years ago

1.0.0

7 years ago