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

Benoît Verhaeghe (1, 2) , Anne Etien (1) , Nicolas Anquetil (1) , Abderrahmane Seriai (2) , Laurent Deruelle (2) , Stéphane Ducasse (1) , Mustapha Derras (2)

1 RMOD - Analyses and Languages Constructs for Object-Oriented Application Evolution
2 Berger-Levrault

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.

Mots clés: Java; User Interfaces; GWT; Angular; Migration; Model-Driven Engineering; Industrial case study

Domaines: Génie logiciel [cs.SE]

Benoît Verhaeghe, Anne Etien, Nicolas Anquetil, Abderrahmane Seriai, Laurent Deruelle, et al.. GUI Migration using MDE from GWT to Angular 6: An Industrial Case. SANER 2019 - 26th edition of the IEEE International Conference on Software Analysis, Evolution and Reengineering, Feb 2019, Hangzhou, China. ⟨hal-02019015⟩