Jadoulle Jérôme
RVP-ONP
April 2011
Why is it needed?
What is Narcissus?
In relation to Selenium;
In relation to the web browser;
In relation to Theseos;
How are Narcissus tests written:
The Unit test part;
The « Selenium » part;
Errors display with Narcissus-UI
State of advancement
Demo (Pension cadaster Narcissus tests by Ollie)
Wanting to test Web applications user interfaces in an
easy way.
No similar tool present of the market
Selenium allows UI interface testing through interactions
but nothing testing the « face » of the application itself
It is possible to take a screenshot of the full pages but not of page
elements themselves. It is also not possible to compare the
screenshots with previous version
Initial requirement: « Take a screenshot of a table full
of data and compare it with the same screenshots
taken the day before ».
A Web UI testing tool:
Takes screenshots of elements on any web page
and compares them, pixel by pixel, to the originals
Original
Taken screenshot
Result
Deeply related to Selenium
Use selenium for usual Web GUI testing;
Resort to Narcissus when wanting to compare element’s UI
Can be used for any web application tested with
Selenium
Internals have wider use:
Possible uses:
Use project’s core to compare PDF pages generated by multiple
versions of a PDF generation application
actually already implemented in narcissus-tools sub-project.
Automatically take screenshots of elements in a web interface and
integrate them in a report
As simple as a Selenium UnitTest
Extend NarcissusTestCase
Use Selenium
for page
navigation
Call Narcissus for screenshot comparison
Params:
•
Id of HTML element to take a screenshot of;
•
Name of the screenshot.
From the outside world, Narcissus is just ONE line of code to add to your tests!
Use Narcissus-UI to see the differences
Core:
Already possible to take screenshots of elements:
Directly in page;
Bigger than the page :
With scrolling if necessary;
With multiple screenshots assembled if necessary;
Inside scrollable elements (scrolled and with multiscreenshot capture if necessary!)
Scrollable elements themselves are not yet working
Just a « time » issue => doable.
UI:
Already possible to display the differences in
multiple modes (see demo);
Exclusion zones are displayed as well
Exclusion zone = expected difference we do not care
about.
Not yet possible to
add / edit / remove exclusion zones;
Replace a reference by a screenshot (in case of
application evolution);
Some more work on usability required.
Server/Client mode:
Narcissus can work in a server/client mode (the
« build environment » case
Screenshots taken by remote server;
Serialization and send back on local;
Comparison as usual.
Open-source released:
http://code.google.com/p/narcissus-webtests/
Initial commit performed.
Need to work on the documentation;
Should test Narcissus using Narcissus itself as well.