Application Under Test Test Suite - PowerPoint Presentation

ida . @ida

344 views
Uploaded On 2022-06-18

Application Under Test Test Suite - PPT Presentation

Simulate UI Checkpoint Simulate UI Checkpoint Simulate UI Checkpoint 3 Match results Eyes Test Manager Match results Metadata 21 Simulate User actions Eyes System F0001V02 ID: 920884

image test eyes baseline test image baseline eyes check email img chrome code branch checkwindow results click feature firefox

Link:

Copy

Embed:

<iframe width="560" height="315" src="https://www.docslides.com/embed/920884" frameborder="0" allowfullscreen></iframe>

Download Presentation from below link

Download Presentation The PPT/PDF document "Application Under Test Test Suite" is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.

Presentation Transcript

Slide1

Application

Under Test

Test Suite

Simulate UICheckpointSimulate UICheckpointSimulate UICheckpoint::

3: Match results

Eyes

Test Manager

Match results

Metadata

2.1: Simulate User actions

Eyes System

F0001-V02

2.2: Take screenshot

Tester

1: Start Test Suite

4: Review and Save Results

Slide2

Test Program

Execution Environment

Application

Under Test

Eyes

Test Manager

2.2a: Get screenshot

2.2c: Check screenshot

2.2a: Get screenshot

Driver

(e.g. Selenium:

Eyes Server

Eyes SDK

F0001-V04

Test Suite

Simulate user actions

Checkpoint

Simulate user actions

Checkpoint

Simulate user actions

Checkpoint:

3: Test results

2.1: Simulate user actions

2.2: Visual checkpoint

1: Start test suite execution

4: Review test results, update baseline

2.1: Simulate user actions

image

4: Get results, update baseline

3a: Test results

Slide3

Write test code

Baseline

Write application code

Baseline Exists ?

Change test code

Change application code

rerun test

mismatches ?

Yes

passed

Mail & Chat

with

Team members

Bug fixes

SDK

Ignore details

Match Level

Bug fixes

SAVE

Fail/Pass

Update baseline image

Add ignore/floating regions

Review and Resolve

Compare captured and baseline images

View Similar Differences

Group, Sort, Filter by attributes

View Match Level influence

Reference images

regions

bugs

Issues

Remarks

Chat

Assign

Slide4

Img A

Img B

Img C

Img DImg E

Img A

Img C1

Img D

Img E

Img F

Img G

same

Img A

Img B

Img C

Img D

Img E

Img A

Img C1

Img D

Img E

Img F

Img G

missing

diff

same

new

same

new

Img A

Img B

Img C

Img D

Img E

Slide5

Test Suite

Test 1checkPoint 1acheckPoint 1b:Test 2checkPoint 2a:Test 3.

:Test N

Slide6

Write Test

First Test Run

Inspect Initial Results

Change Application SoftwareChange Test Software

Test Run

View and resolve results

Update Baseline

Eyes Results

BaselineEyes Results

Baseline

Slide7

visualTest

(){ simulate UI state 1 check(“check 1”) simulate UI state 2

check(“check 2”) simulate UI state 3 check(“check 3”))

1) Write app & test codeBaseline

Image 1

Image 2

Image 3

Baseline

<empty>

Image 1

2) Run test 1

time

3) Review results

4) Baseline created

Result:

new

Image 1

new

Image 1

new

Image 1

5) Update app & test code

Baseline

Image 1F

Image 2

Image 3

Image 1

Image 3

Image 2

6) Differences detected

7) Review results

8) Save baseline

Result:

diff

Image 1

diff

Image3

Image 2

visualTest

() {

simulate UI state 1F

check( “check 1”)

simulate UI state 2

check(“check 2”)

simulate UI state 3B

check(“check 3”)

)

Baseline

Image 1

Image 2

Image 3

3B : bug !

1F – new feature

Slide8

End of 1st test run:

Report an Issue Fail step

 Update database Pass step

After 2nd test runStepTestBatchNo further action required

No further action required

Baseline

updated

 Don’t update database

Fail step

this is the

image

Thumbnail

Captured in

The test

this is the

image

Thumbnail

Captured in

The test

this is the

image

Thumbnail

Captured in

The test

this is the

image

Thumbnail

Captured in

The test

this is the

image

Thumbnail

Captured in

The test

Slide9

Test() { e = Eyes(…) e.open(name,…)

e.check(“point 1”) e.check(“point 2”) e.check(“point 3”) e.close(“point 4”))

Image 1

Image 2Image 3Image 4Baseline ID = name + OS + browser + viewport

Slide10

Test() {

e = Eyes(…)

e.open(name,…)

e.check( ); //check point 1

 same

e.check( );

//check point 2

 differs e.check( );

//check point 3 

differs

 missing e.check

( ); //check point 99

 new

e.check

(); //check point 5

 differs

e.check( )

//check point 6

 same

e.close( ) //same)

Baseline ID = name + OS + browser + viewport

Test() {

e = Eyes(…)

e.open(name,…)

e.check

( ) //check point 1

e.check

( )

//check point 2

e.check

( )

//check point 3

e.check

( )

//check point 4

e.check

( )

//check point 5

e.check

( )

//check point 6

result =

e.close

( )

)

Image 1

Image 2

Image 3

Image 4

Image 1

Image 2A

Image 3A

Image 4

Image 1

Image 2

Image 3

Image 99

Image 5A

Image 5

Image 6

Baseline ID = name + OS + browser + viewport

Actual images

Baseline image

Image 1

Image 2

Image 3A

Image 99

Image 5A

ignore

bug

Baseline image and Metadata

Image 1

Image 2

Image 3

Image 4

Image 5

Image 6

new name or

environment

same name and

environment

Baseline image and Metadata

F0002 –

ver

Slide11

eyes.checkWindow()

go to Applitools.com, click “contact”,wait form displayed

eyes.checkWindow(“click on OK”)

eyes.checkWindow(“thank you dialog”)Enter form Name, click OK newname

new

name

John Doe

Thank You

wait for thanks dialog

No expected image

new

Test version 1

actual

expected

match

name

No expected image

F0002a-V02

before user confirmation

Slide12

eyes.checkWindow()

go to Applitools.com, click “contact”,wait form displayed

eyes.checkWindow(“click on OK”)

eyes.checkWindow(“thank you dialog”)Enter form Name, click OK

wait for thanks dialog

John Doe

Thank You

passed

actual

expected

match

name

John Doe

name

Test version 1

after user confirmation

F0002b-V02

Slide13

eyes.checkWindow()

go to Applitools.com, click “contact”,wait form displayed

eyes.checkWindow(“click on OK”)

eyes.checkWindow(“warning dialog”)//eyes.checkWindow(“thank you dialog”)enter form Name, click OK wait warning Dialog shown

Different

name

Different

John Buck

name

Missing

! Email missing

//click OK on Dialog , wait for thanks dialog

New

//wait thanks Dialog shown

New

eyes.checkWindow(“main window”)

actual

expected

match

Thank You

name

John Doe

name

Test version 2

before user confirmation

F0002c-V02

No expected image

No actual image

cancel

Enter email and press OK

eyes.checkWindow

(“click on OK”)

New

John Buck

name

JB@email.com

cancel

No expected image

Slide14

eyes.checkWindow()

go to Applitools.com, click “contact”,wait form displayed

eyes.checkWindow(“click on OK”)

eyes.checkWindow(“warning dialog”)enter form Name, click OK wait warning Dialog shown

No diffs

name

No diffs

John Doe

name

! Email missing

eyes.checkWindow(“main window”)

actual

expected

match

name

Test version 2

before user confirmation

F0002d-V02

cancel

John Doe

name

cancel

Enter email and press OK

eyes.checkWindow

(“click on OK”)

John Doe

name

JD@email.com

cancel

! Email missing

No expected image

No diffs

New

No diffs

//eyes.checkWindow(“thank you dialog”)

//click OK on Dialog , wait for thanks dialog

//wait thanks Dialog shown

wait Dialog closed

Slide15

eyes.checkWindow()

go to Applitools.com, click “contact”,wait form displayed

eyes.checkWindow(“click on OK”)

eyes.checkWindow(“warning dialog”)//eyes.checkWindow(“thank you dialog”)enter form Name, click OK wait warning Dialog shown

passed

name

passed

John Doe

name

! Email missing

//click OK on Dialog , wait for thanks dialog

//wait thanks Dialog shown

eyes.checkWindow(“main window”)

actual

expected

match

name

Test version 2

before user confirmation

F0002e-V02

cancel

John Doe

name

cancel

Enter email and press OK

eyes.checkWindow

(“click on OK”)

John Doe

name

JD@email.com

cancel

! Email missing

passed

John Doe

name

JD@email.com

cancel

wait Dialog closed

Slide16

Baseline revision N

Image

ImageImageImage

ImageTest (application Name, Test Name)

Branch

Image

Execution Environment

O/S

App Platform

Viewport Size

Env

Name

Image

Baseline revision N - 1

Baseline revision N - 2

Baseline revision N - 3

Region Functionality- ignore

FloatingAuto adjustPaste (??)

Team coordinationRemarksIssuesChat

Eyes

Result

Slide17

Baseline

Test

Matching Engine

3) Save test results

Save parameters

1) Checkpoint images

2) Baseline images,

Matching parameters

Test Manager

Results

SDK

Slide18

Repository

Commit comment

Hash

Slide19

Test result

<OS, Browser,viewportSize

Test:<app_name, test_name>Send UI eventEyes->check()

Baseline<viewportSize, OS, Browser>

img1

img2

img4

imgA

imgB

imgC

Eyes Server

Updated baselines

Selected images

Annotations

Slide20

Test result

<OS,

Browser,viewportSize>

Test:<app_name, test_name>Send UI event

Eyes->check()Baseline<viewportSize

, OS, Browser><Branch>

Updated baselines

Selected images

Annotations

Eyes Server

img1

img2

img4

imgA

imgB

imgC

steps

Slide21

Test result

<OS,

Browser,viewportSize>

Test:<app_name, test_name>Send UI event

Eyes->check()Baseline<viewportSize

, OS, Browser><Branch>

Updated baselines

Selected images

Annotations

Eyes Server

<1024x768, windows10, Chrome>

<1024x768, windows10, Firefox>

<600x900, windows10, Firefox>

<600x900, windows10, Chrome>

<600x900, OS X, Chrome>

<1024x768, OS X, Chrome>

<600x900, OS X, Firefox >

<1024x768, OS X, Firefox >

<600x900, Android, Chrome >

<1024x768, Android, Firefox >

imgA

imgB

imgC

imgD

imgE

imgF

imgG

imgH

imgK

<1024x768, windows10, Chrome>

<600x900, windows10, Chrome>

<600x900, OS X, Chrome>

<1024x768, OS X, Chrome>

<600x900, Android, Chrome >

imgA

imgB

imgC

imgD

imgE

imgC

imgD

imgE

imgF

Branch “Beta”

Branch “Release”

img1

img2

img4

imgA

imgB

imgC

steps

Slide22

Test result

<OS, Browser,viewportSize

Test:<app_name, test_name>Send UI eventEyes->check()

Baseline<viewportSize, OS, Browser>

baselines

<1024x768, windows10, Chrome>

<1024x768, windows10, Firefox>

<600x900, windows10, Firefox><600x900, windows10, Chrome>

<600x900, OS X, Chrome>

<1024x768, OS X, Chrome>

<600x900, OS X, Firefox ><1024x768, OS X, Firefox >

<600x900, Android, Chrome ><1024x768, Android, Firefox >

imgA

imgB

imgC

imgD

imgE

imgF

imgG

imgH

imgK

img1

img2

img4

imgA

imgB

imgC

Slide23

App 1

Test 1

Test 2

Test 3Branch BetaBranch Release

App 2

Test 1

Test 4

Windows, Firefox, 768x1024

Mac OS, chrome, 1900x1024

Windows, Firefox, 1024x768

Windows, chrome, 1900x1024

Baselines

Img

Img 2a

Results

Rev 1245

Rev 2356

Latest

Results 1

Results 2

Results 3

Img

img

annotations

Windows, Firefox, 768X1024

Windows, Firefox, 1024x768

Windows, chrome, 1900x1024

Windows, Firefox, 768X1024

Windows, Firefox, 1024x768

Windows, chrome, 1900x1024

Windows, Firefox, 768X1024

Mac OS, chrome, 1900x1024

Windows, Firefox, 1024x768

Windows, Chrome, 768X1024

Windows, Firefox, 1024x768

Windows, Chrome, 768X1024

Windows, chrome, 1900x1024

Windows, Chrome, 768X1024

Slide24

Code

Eyes

Main Branch M.1

Feature B.1Feature B.2Feature A.1

Main Branch EM.1

Feature B.3

Baseline EB.1

Baseline EB.2

Baseline EA.1

Main Branch M.2

Main Branch EM.2

Feature A.2

Baseline EA.2

Baseline EA.3

Compare

Merge

Main Branch EM.2

Main Branch M.3

Test B1

Test A1

Test B2

Test B3

Test A2

Test MB

Test A3

Test MBA

Compare and auto merge

1) Start feature B, branch code & baseline. Test B1 that branch worked OK – no changes yet.

2) Test B2, code change B.2 , no baseline change EB.1, test B2 no regression.

3) Change code B.3, change baseline EB.2, test B3 new/changed steps and annotations

4) Start feature A branch code & baseline. Test A1 that branch worked OK – no changes yet.

5) Feature B complete, trivial merge code and baseline and test B4

6) Feature A code A.2 and baseline EA.2 changes . Test A2

7) Feature A ready, merge M+B code to A code, compare

Baseline, add M+B annotations, rerun test.

Feature A.3

Test M

8) Main code and baseline contains MAB . Check regression because of merge

0) System has main branch code and baseline.

Slide25

Code

Eyes

Main Branch M

Feature B.1Feature B.2Feature A.1

Main Branch E

Feature B.3

Baseline EB.1

Baseline EB.2

Baseline EA.1

Main Branch MB

Main Branch EMB

Test B1

Test A1

Test B2

Test B3

Test MB

Compare and auto merge

1) Start feature B, branch code & baseline. Test B1 that branch worked OK – no changes yet.

2) Test B2, code change B.2 , no baseline change EB.1, test B2 no regression.

3) Change code B.3, change baseline EB.2, test B3 new/changed steps and annotations

4) Start feature A branch code & baseline. Test A1 that branch worked OK – no changes yet.

5) Feature B complete, trivial merge code and baseline and test B4

6) Feature A code A.2 and baseline EA.2 changes . Test A2

7) Feature A ready, merge M+B code to A code, compare

Baseline, add M+B annotations, rerun test.

Test M

0) System has main branch code and baseline.

Merge

Main Branch EMBA

Main Branch MBA

Test MBA

8) Main code and baseline contains MAB . Check regression because of merge

Baseline EA.3

Compare

Test A3

Feature A.3

Feature A.2

Baseline EA.2

Test A2

Slide26

Test Suite

termNotification

= true

Test Manager(Admin)Eyes ServerSlack Notify

Notify this application ?Notify this type of result ?

Sent to Slack workspace/channel

Email Notify

Notify this application ?

Notify this type of result ?Sent to email list

Slack

{<app a1, all runs>, <app a2, unresolved>,

Find notification list for users team

Batch(B, {user,

termNotification

=true;

<test t1, app a1, results>,

<test t2, app a1, results>,

<test t3, app a2, results>}

For team T1 {

For Slack { {workspace/channel

{<app a1, all runs>, <app a2, unresolved>, ….} {….other workspaces/channels} } For Email { { A@a.com, B@a.com,...} <app a2, all runs>}

{ other email address, ….} }}For team T2 { …..}

Slide27

runner

= new

VisualGridRunner

()or new ClassicRunner()config = new Configuration()

eyes = new Eyes(

runner)driver = create web driver

webdriver

= eyes.open

(driver)eyes.setConfiguration(

config)

webdriver.do something

eyes.check()

eyes.closeAsync()

driver.quit()

results = runner

.getAllTestResults(false)

Set up the test suite

Set up before the test

The test

Wrap up after test

Wrap up after test suite

Slide28

Outer region

Inner region

downleftright

Application Under Test Test Suite - PowerPoint Presentation

Application Under Test Test Suite - PPT Presentation

Share:

Link:

Embed:

Related Contents