Moving Model Driven Engineering from Eclipse to Web Technologies
Total Page:16
File Type:pdf, Size:1020Kb
Moving Model Driven Engineering from Eclipse to Web Technologies Sören Domrös Master’s Thesis November 15, 2018 Prof. Dr. Reinhard von Hanxleden Real-Time and Embedded Systems Group Department of Computer Science Kiel University Advised by Alexander Schulz-Rosengarten Selbstständigkeitserklärung Hiermit erkläre ich, dass ich die vorliegende Arbeit selbstständig verfasst und keine anderen als die angegebenen Quellen und Hilfsmittel verwendet habe. Kiel, iii Abstract Eclipse is a popular IDE for model-driven-development. It is a current trend to move IDEs to the web. Web technologies enable to use flexible frameworks for UI development. Moreover, they enable container-based development. An IDE can be used in the web with nothing more than a browser with zero configuration and setup time. Web IDEs need separation between business logic and UI, which is not facilitated by Eclipse. The academic KIELER project is an Eclipse-based IDE for model-driven engineering of SCCharts and other synchronous languages. KIELER can only run as a desktop application and still uses a SWT-based UI. A migration to web technologies seems promising and provides new opportunities for Human Computer Interaction (HCI). Web technologies enable to design applications, which run in the web or locally as an Electron app. In this thesis the Theia framework is used to migrate KIELER from Eclipse to a client server archi- tecture called KEITH using the Language Server Protocol (LSP). The already existing implementation of KIELER is reused to generate a language server backend using Xtext. The LSP and Xtext allow to support KIELER and KEITH development at the same time. The qualitative evaluation of this migration project shows that web technologies can be used to develop an IDE and that Theia is a viable IDE framework, which is highly extensible. The resulting KEITH tool promises to be usable for teaching and conferences. The flexible UI allows to test and develop new UI concepts using HCI. The different setup methods of KEITH make it a highly flexible and configurable development tool. v Acknowledgements I want to give special thanks to my advisor Alexander Schulz-Rosengarten and my professor Dr. Reinhard von Hanxleden for reading everything I gave them and giving constructive criticism. Moreover, I want to thank Steven Smyth for coming up the name KEITH (for Rich Charts (RiCharts)). Without him the resulting tool would be named something less awesome. I want to thank Darth Vader, my friends, Niklas Rentz, and everyone else who supported me during my thesis. Last but not least I want to thank Keith Richards for his music and the similarity of his name to the developed tool. vi Contents 1 Introduction 1 1.1 Cloud Integrated Development Environment (IDE)......................1 1.1.1 Theia............................................2 1.2 The Language Server Protocol.................................2 1.3 Problem Statement........................................3 1.4 Outline...............................................4 2 Preliminaries 7 2.1 IDE Features............................................7 2.2 Eclipse...............................................8 2.3 Kiel Integrated Environment for Layout Eclipse Rich Client (KIELER)...........9 2.3.1 SCCharts and other Grammars.............................9 2.4 Xtext................................................ 10 2.5 The Language Server Protocol................................. 11 2.6 Theia................................................ 13 2.7 TypeScript............................................. 17 2.7.1 Yarn and npm....................................... 19 3 Related Work 21 3.1 Project Migration......................................... 21 3.1.1 ARNO Project....................................... 21 3.1.2 Backtory.......................................... 23 3.1.3 Migration using Model-Driven Engineering..................... 24 3.1.4 Dublo Pattern....................................... 25 3.1.5 General remarks..................................... 26 3.2 Cloud IDEs ............................................. 27 3.2.1 CEclipse.......................................... 27 3.2.2 Eclipse Che........................................ 27 3.2.3 CoreD........................................... 28 3.2.4 Yangster.......................................... 29 3.3 Diagram extension for KIEL Environment Integrated in Theia (KEITH)........... 29 3.4 Alternative LSP projects...................................... 30 3.5 Monto................................................ 30 3.6 Debugging Protocols....................................... 31 4 Migration from Eclipse to Web Technologies 33 4.1 Migration Strategy Discussion................................. 33 4.1.1 Migration Reasons.................................... 33 4.1.2 Migration Strategy.................................... 33 4.1.3 Reusing the Backend................................... 34 4.1.4 Migration Obstacles................................... 37 4.1.5 Operating System (OS)-Independence......................... 38 vii Contents 4.1.6 Migration of Knowledge................................. 39 4.1.7 The Migrated Product.................................. 39 4.1.8 Generalization of IDE Migration Problems...................... 39 4.2 UI Design in Web-based IDEs ................................... 40 4.2.1 Eclipse........................................... 40 4.2.2 Comparison to Modern web IDEs ............................ 40 5 Transforming KIELER into KEITH 43 5.1 Migration Strategy........................................ 43 5.2 Features.............................................. 44 5.3 Build Setup............................................ 47 5.3.1 Bamboo Build....................................... 48 5.3.2 Prerequisites........................................ 49 5.3.3 Building a Product for different OSs .......................... 50 5.4 Migration Process and Development.............................. 50 5.4.1 Upgrading Xtext..................................... 50 5.4.2 Syntax Highlighting for Theia............................. 51 5.4.3 Prototype for KEITH .................................... 51 5.4.4 Extending the KEITH Prototype............................. 51 5.5 Language Server......................................... 52 5.6 Theia extension.......................................... 53 5.6.1 Theia Backend...................................... 53 5.6.2 Theia Frontend...................................... 55 5.6.3 Creating a widget.................................... 57 5.7 Extending the LSP ......................................... 59 5.7.1 Server side LSP extension................................ 59 5.7.2 Client Side LSP Extension................................ 60 5.7.3 Combining two LSP extensions in Theia........................ 61 5.8 Development Setup........................................ 62 6 Evaluation and Experience Report 65 6.1 Migration Process......................................... 65 6.1.1 Language Server..................................... 65 6.1.2 Theia Extension...................................... 68 6.1.3 OS-Independence..................................... 71 6.2 Development Tools........................................ 72 6.2.1 Development in VSCode................................. 72 6.2.2 Development in Eclipse................................. 73 6.3 Performance Testing....................................... 73 6.3.1 Reactivity......................................... 73 6.3.2 Scalability......................................... 74 6.3.3 Maintainability...................................... 75 6.4 Use of KEITH in Teaching..................................... 76 6.5 Comparison............................................ 76 viii Contents 7 Conclusion 79 7.1 Summary.............................................. 79 7.1.1 Migration......................................... 79 7.1.2 Implementation...................................... 79 7.2 Future Work............................................ 80 7.2.1 Restructuring of KEITH and Further Development.................. 80 7.2.2 Build Setup and Automation.............................. 81 7.2.3 Future Tools for Theia and KEITH ............................ 81 7.2.4 Usage for Teaching.................................... 81 7.2.5 Build Language Server as fat jar............................ 82 7.2.6 Publishing of Xtext Fragment.............................. 82 7.2.7 Research regarding Usability of KEITH ......................... 82 Bibliography 83 Abbreviations 87 ix List of Figures 1.1 m IDEs n languages solution...................................3 1.2 Yang for four IDEs .........................................4 2.1 UI of KIELER ............................................ 10 2.2 Language server communication during a session..................... 11 2.3 Communication with multiple language servers....................... 13 2.4 Theia browser and Electron version.............................. 14 2.5 Communication for different Theia products......................... 15 2.6 Theia package composition................................... 16 2.7 Theia started using docker................................... 16 2.8 Variation of defect proneness of languages for a given domain [RPF+14]........ 18 3.1 The Amadeus Germany System [Tep09]........................... 22 3.2 Continuous delivery using microservices [BHJ16]...................... 23 3.3 Team restructuring for DevOps [BHJ16]........................... 24 3.4 Model-driven migration principle [FBB+07]......................... 25 3.5 Structural view on