GUI Migration using MDE from GWT to Angular 6: An Industrial Case

During the evolution of an application, it happens that developers must change the programming language. In the context of a collaboration with Berger-Levrault, a major IT company, we are working on the migration of a GWT application to Angular. We focus on the GUI aspect of this migration which, even if both frameworks are web Graphical User Interface (GUI) frameworks, is made difficult because they use different programming languages and different organization schema. Such migration is complicated by the fact that the new application must be able to mimic closely the visual aspect of the old one so that the users of the application are not disrupted. We propose an approach in four steps that uses a meta-model to represent the GUI at a high abstraction level. We evaluated this approach on an application comprising 470 Java (GWT) classes representing 56 pages. We are able to model all the web pages of the application and 93% of the widgets they contain, and we successfully migrated 26 out of 39 pages (66%). We give examples of the migrated pages, both successful and not.

[1]  Ali Mesbah,et al.  Reverse Engineering iOS Mobile Applications , 2012, 2012 19th Working Conference on Reverse Engineering.

[2]  Eleni Stroulia,et al.  Swing2Script: Migration of Java-Swing Applications to Ajax Web Applications , 2007, 14th Working Conference on Reverse Engineering (WCRE 2007).

[3]  John Brant,et al.  Extreme maintenance: Transforming Delphi into C# , 2010, 2010 IEEE International Conference on Software Maintenance.

[4]  Rubby Casallas,et al.  White-box modernization of legacy applications: The oracle forms case study , 2018, Comput. Stand. Interfaces.

[5]  Jean-Marc Jézéquel,et al.  Model-driven engineering for software migration in a large industrial context , 2007, MODELS'07.

[6]  Stefan Staiger,et al.  Reverse Engineering of Graphical User Interfaces Using Static Analyses , 2007, 14th Working Conference on Reverse Engineering (WCRE 2007).

[7]  Oscar Nierstrasz,et al.  The story of moose: an agile reengineering environment , 2005, ESEC/FSE-13.

[8]  Arnaud Blouin,et al.  Automatic detection of GUI design smells: the case of Blob listener , 2016, EICS.

[9]  João Saraiva,et al.  The GUISurfer tool: towards a language independent approach to reverse engineering GUI code , 2010, EICS '10.

[10]  Spencer Rugaber,et al.  Knowledge-based user interface migration , 1994, Proceedings 1994 International Conference on Software Maintenance.

[11]  Atif M. Memon,et al.  GUI ripping: reverse engineering of graphical user interfaces for testing , 2003, 10th Working Conference on Reverse Engineering, 2003. WCRE 2003. Proceedings..

[12]  João Pascoal Faria,et al.  Reverse Engineering of Graphical User Interfaces , 2011, ICSEA 2011.

[13]  Eli Tilevich,et al.  Reverse-engineering user interfaces to facilitateporting to and across mobile devices and platforms , 2011, SPLASH Workshops.

[14]  Zineb Gotti,et al.  Java Swing Modernization Approach - Complete Abstract Representation based on Static and Dynamic Analysis , 2016, ICSOFT-EA.