Today I saw an interesting tweet lined up in my twitter stream about a Page Recorder utility developed by Dmitry Zhariy which aids in generating PageObjects for Selenium WebDriver tests. I could not resist to get hands-on with this tool and write this post.
https://twitter.com/101byben/status/372992323757834240
I was playing with an idea to build such an utility and someone already done such a good work developing this cool tool. You can read the original blog post about SWD Page Recorder utility here (translated in English)
This project is hosted on GitHub https://github.com/dzhariy/swd-recorder and licensed under The MIT License.
First Impressions
The SWD Page Recorder utility helps automation developers in finding and locating elements as well as creating page objects through a nicely built user interface. You don’t need to juggle around browsers and tools like Firebug/Developer tools in Google Chrome or IE to find/create locator strategies. This tool allows you to launch various types of browsers, navigate to page and spy on elements, look at their attributes, create & test locators. You can then use this information to generate page objects in various programming languages.
SWD Recorder can be used to test locators just like Selenium IDE on browsers like IE, Chrome and Safari.
This is still in beta phase and have some areas for improvements. Read on the original blog for more details. I played with the utility to create a page object for http://demo.magentocommerce.com/customer/account/login/ with following steps:
Launch the SwdPageRecorder application. On the main Window you need to select & configure Browser that you want to use from Browser Settings tab. It also allows option to connect to RemoteWebDriver instance.
Select the desired Browser and hit Start button to start the Browser instance. By default utility points to http://www.yahoo.com. You can change this by entering desired URL in Browser textbox above Browser Settings tab and click on Go button.
It will navigate to the URL as shown in below screenshot:

Switch to Locators tab and click on Start button in In-Browser Web Element Explorer section. Now switch to the Browser instance opened by SWD Page Recorder.
Focus on a desired element in the Browser window and press Ctrl + Right click. This will open a popup window as shown in below screenshot:

Add a desired element by specifying a logical/descriptive name in Code Identifier textbox and click on Add element button. In this example I will specify emailTextBox in Code identifier textbox.
Go on adding elements that are needed for test with above steps. You can see the elements from the page added to the tree in below screenshot:

You can also add elements manually or edit elements that are already added by using WebElement section. Elements can be highlighted using Highlight button to test that locator information is sufficient or debug the locator values.
Generating PageObject Code
Once you capture all the elements needed for your PageObject, switch to Source Code tab. The source code tab provides templates for generating PageObject code in various languages (C#, Java, Perl, Python, Ruby etc.). Select a desired template and click on Generate button to generate the code. SWD Page Recorder generated following code the elements added from Login page.

You can either copy the code back to the editor or save this in a file and done!
Conclusion
Overall this utility worked pretty good. There are few glitches which I hope should be gone after beta is over. There is a scope for improvement in overall usability of the tool. Along with PageObjects I also want to see utility generating a sort of XML/Properties file based UI-Map.
Looks great!
I tried pulling the latest from the repo and it didn’t include a compiled binary.
So I tried building it with the included build.bat script and got the following errors:
F:\ATO-apps-and-tools\SeAutomation\dzhariy-swd-recorder-v0.1.2013.12.22-1-g631465d\dzhariy-swd-recorder-631465d\build>go.bat
[1/8] Building SwdPageRecorder…
[2/8] Sharpening knives….
[3/8] Vacuuming a room…
[4/8] Doing some morning exercises…
[5/8] Cheving a gum…
Could Not Find F:\ATO-apps-and-tools\SeAutomation\dzhariy-swd-recorder-v0.1.2013.12.22-1-g631465d\dzhariy-swd-recorder-631465d\build\SwdPageRecorder_Latest\SwdPageRecorder.pdb
[6/8] Shovelling coal into the build…
File not found – CodeTemplates
[7/8] Cutting the edges…
[8/8] Build completed.
F:\ATO-apps-and-tools\SeAutomation\dzhariy-swd-recorder-v0.1.2013.12.22-1-g631465d\dzhariy-swd-recorder-631465d\build>
Did your download include a .EXE, or did you have to build it?
Thanks, Scott
Hi, I could not build it from the source. can you please help?
kalyan
I had to update/restore the nuget packages.
Tools > NuGet Package Manager > Manage NuGet Packages for Solution…
there was a highlighted restore button etc. I clicked there (i’ve run into this issue before). I then rebuilt and was able to run in debug or build in release and go to the .exe and run from there. Hope that helps.
Hi
I’m trying to build the project & getting below error
Can some one please help me fix this issue
C:\Users\prasads\Downloads\swd-recorder-master\swd-recorder-master\build>go.bat
[1/8] Building SwdPageRecorder…
[2/8] Sharpening knives….
[3/8] Vacuuming a room…
The system cannot find the path specified.
ERROR: MSbuild: Compilation / Build Error
Hi, Does this tool also locate sclocators? The AUT is based on Smart GWT Technology.
I tried the tool. My understanding is that it will produce a java for the pageObject. I tries some page. It works fine. But other pages, it never finishes and I have no idea what is going on.