It's not a problem to automate GUI tests, nowadays. There are different approaches and tools. A nice tool overview is available on wikipedia.
The tools have different techniques to perform tests. On technique is sending/simulating mouse clicks to components. The problem is that the GUI shouldn't be changed between tests and you should use a special test environment/system. Another technique is tricky but there's a nice implementation from MIT. It works with image recognition. And finally there's a solution based on unique component identifiers.
We like the last technique, based on unique component identifiers because it allows changing the UI without changing test cases - we love flexibility. The only problem with JVx was that we didn't have unique identifiers and a developer won't set an identifier for every component. We didn't have a mechanism to create unique identifiers... BUT now... we have.
With upcoming JVx releases, it will be possible to test GUIs automatically based on unique identifiers. This identifiers will be available also for VaadinUI. Another advantage for VaadinUIs will be that the id could be used for styling via CSS.
There are still some todos for us but we're happy to be able to show you some examples.
We made some test-cases with different test tools. To test our VaadinUI, we use Selenium together with PhantomJS.
The source code might look like this one:
public class TestCaseB
{
private static final int TIMEOUT_IN_SECONDS
= 10;
private static final String TIMEOUT_IN_MILLISECONDS_AS_STRING
=
Integer.
toString(TIMEOUT_IN_SECONDS
* 1000
);
private WebDriver driver;
private Selenium selenium;
@Before
public void setUp()
{
driver = configureDriver(createPhantomJsDriver());
String baseUrl = "http://localhost:8080/";
selenium = new WebDriverBackedSelenium(driver, baseUrl);
selenium.setTimeout(TIMEOUT_IN_MILLISECONDS_AS_STRING);
}
@Test
public void testDemoerptest()
{
selenium.open("/VisionX.Server/app/web/ui/DemoERP/");
waitForPage();
selenium.type("id=UserName", "admin");
selenium.type("id=Password", "admin");
selenium.click("id=OK");
waitForPage();
selenium.click("id=DemoERP_P1_P1_P2_B1");
waitForPage();
selenium.click(
"//div[@id='NavigationTable']/div[2]/div/table/tbody/tr[2]/td[2]/div");
selenium.click(
"//div[@id='NavigationTable']/div[2]/div/table/tbody/tr[3]/td[2]/div");
selenium.click(
"//div[@id='NavigationTable']/div[2]/div/table/tbody/tr[2]/td[2]/div");
selenium.click(
"//div[@id='NavigationTable']/div[2]/div/table/tbody/tr/td[2]/div");
selenium.click("id=DemoERP_P1_P1_P2_B2");
waitForPage();
selenium.click(
"//div[@id='NavigationTable']/div[2]/div/table/tbody/tr[2]/td/div");
selenium.click(
"//div[@id='NavigationTable']/div[2]/div/table/tbody/tr[3]/td/div");
selenium.click(
"//div[@id='NavigationTable']/div[2]/div/table/tbody/tr[4]/td/div");
selenium.click("id=DemoERP_P1_P1_P2_B3");
waitForPage();
selenium.click("xpath=(//button[@type='button'])[7]");
waitForPage();
}
@After
public void tearDown()
{
driver.quit();
selenium.stop();
}
private WebDriver configureDriver(WebDriver pWebDriver)
{
pWebDriver.manage().timeouts().implicitlyWait(TIMEOUT_IN_SECONDS,
TimeUnit.SECONDS);
pWebDriver.manage().timeouts().pageLoadTimeout(TIMEOUT_IN_SECONDS,
TimeUnit.SECONDS);
pWebDriver.manage().timeouts().setScriptTimeout(TIMEOUT_IN_SECONDS,
TimeUnit.SECONDS);
pWebDriver.manage().window().setSize(new Dimension(1920, 1080));
return pWebDriver;
}
@SuppressWarnings("unused")
private WebDriver createChromeDriver()
{
ChromeOptions options = new ChromeOptions();
options.addArguments("-incognito");
return new ChromeDriver(options);
}
private WebDriver createPhantomJsDriver()
{
DesiredCapabilities capabilities = new DesiredCapabilities();
capabilities.setCapability(
PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY,
"D:\\opt\\phantomjs\\phantomjs.exe");
return new PhantomJSDriver(capabilities);
}
private void waitForPage()
{
selenium.waitForPageToLoad(TIMEOUT_IN_MILLISECONDS_AS_STRING);
}
}
We use FEST (doc) for Swing UIs. The library is old (like Swing) but still works!
A very simple example with FEST:
public class TestUI extends FestSwingTestCaseTemplate
{
private FrameFixture window;
@After
public void cleanItUp()
{
super.cleanUp();
}
@Before
public void setUp()
{
super.setUpRobot();
UIFactoryManager.getFactoryInstance(SwingFactory.class);
WorkScreenCreatingGuiQuery query = new WorkScreenCreatingGuiQuery();
Frame frame = GuiActionRunner.execute(query);
window = new FrameFixture(robot(), frame);
window.show();
query.afterShow();
}
@Test
public void testTheUIStuff()
{
// Check if the editor does have the correct value.
// The WorkScreen does select the first line for us.
Assert.assertEquals("John Smith",
window.textBox("UITWS_E_TESTDATABOOK_NAME").text());
// Select the next line in the table.
window.table("UITWS_T_TESTDATABOOK").selectRows(1);
Assert.assertEquals("Ian McIrish",
window.textBox("UITWS_E_TESTDATABOOK_NAME").text());
// Select the tab that has that TextField-Button-Label combo on it.
window.tabbedPane("UITWS_TP1").selectTab(1);
window.tabbedPane("UITWS_TP1_P2_TP1").selectTab(2);
// Enter something into the textfield, press the button and the label
// should now have the same text.
window.textBox("UITWS_TP1_P2_TP1_P3_P1_TF1").setText("This is an automated test.");
window.button("UITWS_TP1_P2_TP1_P3_P1_B1").click();
Assert.assertEquals("This is an automated test.",
window.label("UITWS_TP1_P2_TP1_P3_P1_L2").text());
}
private static final class WorkScreenCreatingGuiQuery extends GuiQuery<Frame>
{
private UIFrame frame;
private WorkScreen workscreen;
void afterShow()
{
// Important so that everything gets a name.
// There is a window constructed, but outside of the JVx scope.
frame.addNotify();
workscreen.notifyRepaint();
}
@Override
protected Frame executeInEDT() throws Throwable
{
frame = new UIFrame();
workscreen = new UITestingWorkScreen();
frame.add(workscreen);
return (Frame) frame.getResource();
}
private String dumpStructure()
{
return dumpStructure(frame, 1);
}
}
}
Our first Eclipse Plugin for JVx and VisionX will be available in a few weeks. We're feature complete and are in the internal test phase. We're extremely surprised about the productivity boost. With VisionX it's currently possible to create and deploy professional database applications in few minutes. The development process is super fast because of VisionX and some really useful features like Action wizard and GUI designer. The missing piece was the IDE integration. It was possible to use Eclipse as IDE to modify VisionX applications, live and bidirectional. The only problem was that it was not easy to find the right line of code or member to do modifications. It wasn't a big problem but it was a waste of time.
Our Plugin helps to save development time, again. The combination of VisionX with EPlug is awesome.
The name of the Plugin is EPlug (not very creative but simple). It will be available in different editions: Lite, Pro and VisionX.
The Lite edition will be free and doesn't offer full power but will be useful.
The Pro edition won't have any limits but won't interact with VisionX.
The VisionX edition adds interaction to Pro edition. It will be possible to use VisionX to jump to Source Code in Eclipse and to show changes directly in VisionX (means live live).
I've an amazing feature for you as screenshot:
 Preview image (hover) |
|
 Preview image (completion) |
|
Really useful 
All our applications have a menu and a toolbar. This is great for backend applications but not always good for web frontends. Our web UIs have a different menubar, styled for web, but it's always visible. If you have simple web forms, you won't use a menu. We did some changes and have new options for applications without menu and toolbar
Some impressions with standard (backend) Desktop application and as (frontend) web application:
 Backend application |
|
 Frontend application |
It's very simple to hide the menu. Simply set an application property via application.xml or directly via launcher - that's it. We changed our web menu and allow access to internal panels and components. It will be possible to hide buttons, change layouts, etc.
It's still possible to create your own, custom, application frame or extend our pre-defined frame. The new feature will be available in the next VisionX update.
We have another useful VisionX feature for you in the queue. It's the support for popup menus. It'll be possible to create and use popup menus for UI components. We had to change JVx to support this feature. It's now easily possible to work with popups because UIComponent got a new method: setPopupMenu(IPopupMenu).
The feature will be easy to use for end-users because it's not rocket science and we re-used existing VisionX concepts. Here's a first screenshot:
Popup menu integration
Our custom Vaadin application frame isn't a MDI. It's "web SDI" . We didn't show popup windows aka internal frames with work-screen content. We did embedd the content directly into the web page. But we changed the default implementation a little bit because it makes sense to show popup windows for modal work-screens. Modal frames are important for database applications. Such frames could be used for showing record details, for creating new records, ...
So it makes sense that our application frame supports such specific work-screens. And the good news is that we've support for this.
It could look like following screenshot:
Modal frame
It's a screenshot from one of our test applications. The feature isn't generally available yet, but it will be part of the next VisionX release.
Great news for all VisionX users!
The current update release 2.0.121 is available for download. Please check your download area.
The release is more than just an update release. It contains all currently available features. We wrote about some of them:
Repeating frames
IDE integration
QR Codes
Features for developers
Ready made solutions
It contains current JVx, ProjX libraries and source code.
If you miss some features after upgrading, please contact our product support because previous versions provided features without valid license. If the features are already licensed, no worries.
We have a product and feature overview for you.
Die Master Thesis von Stefan Fessler steht nun öffentlich zur Verfügung. Das Thema war
Design und Implementierung einer Multi-Touch optimierten iOS App für das JVx ERP Applikation Framework
Im Zuge seiner Arbeit wurde der iOS Client für JVx entwickelt. Das Projekt steht unter der Apache Lizenz 2.0 zur Verfügung.
Die Arbeit ist zugleich eine gute Dokumentation und erklärt Designentscheidungen sowie deren Umsetzung.
We want to tell you some fantastic news from our RnD team: The next big step for VisionX will be an IDE integration feature.
Our team is working very hard to reach the goals. The result will be an Eclipse plugin that connects to VisionX and allows bidirectional communication. We won't embedd VisionX in Eclipse because it makes no sense for us, but we'll use the whole power of the IDE.
What will be supported?
- Event links (Eclipse)
A click on an event action string will jump to the right method.
databook.eventValuesChanged().addListener(this, "doValuesChanged");
The click on doValuesChanged will jump to the method in the work-screen.
- Call links (Eclipse)
A click on an action/object call will jump to the right method, in the right life-cycle object.
getConnection().callAction("getLicenseInformation");
The click on getLicenseInformation will jump to the method in the life-cycle object.
- DataBook links (Eclipse)
A click on the name of a databook will jump to the storage definition, in the life-cycle object.
RemoteDataBook rdb = new RemoteDataBook();
rdb.setDataSource(dataSource);
rdb.setName("users");
rdb.open();
The click on users will jump to the DBStorage definition, in the the life-cycle object.
- Auto completion (Eclipse)
We'll offer auto completion for table columns, event methods, action/object calls, ...
databook.getRowDefinition().getColumnDefinition("DESCRIPTION").getDataType().setCellEditor(VisionXUtil.MULTILINE_EDITOR);
It'll be possible to get a list of all available columns, like DESCRIPTION.
- Column checks (Eclipse)
We'll check if all column names are valid and will show compiler warnings/errors.
- Jump to Eclipse
It'll be possible, with VisionX, to jump to the source code of e.g. actions, component definitions or databooks in Eclipse. We'll introduce some new Buttons in VisionX, for that feature.
VisionX E-Plug
- Jump to VisionX
It'll be possible, with Eclipse, to highlight selected GUI components directly in VisionX.
No worries, we have more features for you!
The IDE integration will be available as optional VisionX module.
If you are Liferay User and Vaadin Portlet developer, you know that Liferay has Vaadin bundled. If you develop a Vaadin portlet, you should use the bundled Vaadin version, otherwise it'll be a problem after a deployment.
We solved the problem in JVx' VaadinUI by extending Vaadin. Our implementation allows different Vaadin versions independent of Liferay. Some days ago, Matti Tahvonen posted an article about Using "self-contained" approach to package Vaadin portlets. This is an interesting article because it's exactly what we tried to do and we thought that Vaadin developers have a better solution for the problem!
And of course, their solution is better than ours But we are like copy cats and we changed our solution because it reduced code and made it easier for us to maintain our codebase. Our idea was not far away from the recommended solution, but we did too much.
To find out what Vaadin did in their archetype, we followed their posted instructions. We found two steps that could be ignored. The first step was the creation of a custom maven profile because it was possible to add all properties to the pom.xml of the project. The second step was the configuration of the profile in Eclipse. Not needed if properties were added to pom.xml.
And after creating the project, we had the recommended solution and it was absoutely trivial. Simply extend VaadinPortlet, extend VaadinPortletService and override getStaticFileLocation. The created source code:
public class CustomVaadinPortlet
extends VaadinPortlet
{
private static final long serialVersionUID = -13615405654173335L;
private class CustomVaadinPortletService extends VaadinPortletService {
/**
*
*/
private static final long serialVersionUID = -6282242585931296999L;
public CustomVaadinPortletService(final VaadinPortlet portlet,
final DeploymentConfiguration config) throws ServiceException {
super(portlet, config);
}
/**
* This method is used to determine the uri for Vaadin resources like theme
* or widgetset. It's overriden to point to this web application context,
* instead of ROOT context
*/
@Override
public String getStaticFileLocation(final VaadinRequest request) {
return request.getContextPath();
}
}
@Override
protected VaadinPortletService createPortletService(
final DeploymentConfiguration deploymentConfiguration)
throws ServiceException {
final CustomVaadinPortletService customVaadinPortletService = new CustomVaadinPortletService(
this, deploymentConfiguration);
customVaadinPortletService.init();
return customVaadinPortletService;
}
}
To be honest... our solution contained a little bit more code but it worked. We've used our new knowledge to improve our solution, because it should be possible to use "self-contained" and "shared" approach without additional source code. We introduced a context parameter to switch between modes. Vaadin could do the same, but currently it's not implemented.
Our new solution is as simple as the original Vaadin source code and the most important thing is that it works with our ant build.
It was a very simple task. The library Twitter4j (4.0.1) was compiled for Java 6 and I need a 1.5 compatible version. So, I thought it shouldn't be a problem to compile the project with 1.5 compatibility
Twitter4j is available via git and after cloning and switching to 4.0.1 everything was available. I tried to import the maven project with Eclipse (Kepler) and got many problems because of missing libraries. WTF?
Shouldn't maven solve all dependency problems? I didn't try to fix problems with Eclipse because it could be a maven plugin problem. So I tried maven itself with jdk 1.5 and some minutes later I got other exceptions because Twitter4j source was written with Java 6 syntax (@Override with interface methods).
So I had to use Java 6 with 1.5 target option... After modifying pom.xml of twitter4j-core, the build had another problem: All test cases failed . So I had to use the command-line property -Dmaven.test.skip=true to ignore unit tests.
Finally I got my 1.5 compatible Twitter4j library.
But it was an awful task because maven bundled with Eclipse didn't work as expected. It's horrible if tools that should save time, waste time. I still don't like maven. IMHO it's still to complex compared to other build tools.
A build tool shouldn't be as complex as developing software.
Nowadays everything has to work with our IDEs, but what happens if it doesn't?
I'm a researcher and love solving problems but is it that complex to keep things simple?
Software has to be simple to help us and we - developers - have to write simple software/frameworks/libraries.
Instead of creating simple software, many developers try to write millions LoC. Don't do that because no one can handle such code-bases in the future.
Just sayin'
Development | rjahn | 12/09/2014 | 
Comments (0) 
RSS-Feed