Skip to content

How to use WatchUI

Jan Egermaier edited this page May 24, 2022 · 5 revisions

Some rules

  • Python => 3.9
  • For comparing image you need use image with same resolution
  • For venv we recommend use Poetry

Demos

Every example you can find under unit tests and under examples

Basic usage WatchUI for compare image with Selenium

After installation, We create new file test.robot with:

*** Settings ***

*** Variables ***

*** Test Cases ***

*** Keywords ***

Within Settings section import Selenium and WatchUI libraries.

*** Settings ***
Library         SeleniumLibrary
Library         WatchUI

Under Test case we add:

Compare homapage with baseline
    Open Browser                https://www.google.com    chrome
    Capture Page Screenshot     baseline.png

This open browser and Capture screenshot. Now we must compare image so we add:

Compare Image               baseline.png              baselines/homepage.png    ssim=0.95
Close Browser

Now just starts robot and thats it, We have results if image is similar or not. Be carefull you must have image with same resolution!

Basic usage Tesseract OCR and WatchUI in test

This approach is recommended when we need to test content of PDF files and standard strategy of text recognition (using PyMuPDF keywords) doesn't work. Same applies for testing content of images.

For this cases we implemented two keywords using Tesseract OCR:

Image to string

and:

Image area on text

In this example we have a pdf and we want to extract the text from area at coordinates 0, 0, 179, 83.

We start with settings:

*** Settings ***
Library         WatchUI

After settings we must set up ours variables as

{: .table} | Variables | Description |- | ${TT_path_to_pdf} | Path to the tested PDF file | ${TT_name_img} | Name of the new image, which we create from PDF | ${TT_path_to_img} | Path to the new image ${TT_name_img} | @{TT_text_area_coo} | Area coordinates, where from we want to read text | ${TT_should_be_text} | Text we are expecting

*** Variables ***
${TT_path_to_pdf}          ../Img/dummy.pdf
${TT_name_img}              pdfInPng
${TT_path_to_img}          ../Outputs/${TT_name_img}.png
@{TT_text_area_coo}        0    0   179     83
${TT_should_be_text}        Dummy PDF file

Now we can finally create keywords:

  1. From pdf to image
  2. Extract data from image to variables and then compare values.
*** Keywords ***
Convert PDF to IMG
    pdf to image    ${TT_path_to_pdf}   name=${TT_name_img}  save_folder=../Outputs/

From IMG to string
    ${Text_from_area}   Image area on text   ${TT_path_to_img}  @{TT_text_area_coo}     psm=10
    Should Be True                          '''${Text_from_area}''' == '''${TT_should_be_text}'''

Final code is:

*** Settings ***
Library         WatchUI


*** Variables ***
${TT_path_to_pdf}          ../Img/dummy.pdf
${TT_name_img}             pdfInPng
${TT_path_to_img}          ../Outputs/${TT_name_img}.png
@{TT_text_area_coo}        0    0   179     83
${TT_should_be_text}       Dummy PDF file


*** Test Cases ***
Sample test
    Convert PDF to IMG
    From IMG to string


*** Keywords ***
Convert PDF to IMG
    pdf to image    ${TT_path_to_pdf}   name=${TT_name_img}  save_folder=../Outputs/

From IMG to string
    ${Text_from_area}   Image area on text   ${TT_path_to_img}  @{TT_text_area_coo}     psm=10
    Should Be True                          '''${Text_from_area}''' == '''${TT_should_be_text}'''