Research Article Open Access

Testing React Native Mobile Apps: Pruning GUI Model Approach

Rand Marwan Khalil Ibrahim1 and Samer Zein2
  • 1 Department of Information Technology, Birzeit University, Birzeit, Palestinian Authority
  • 2 Department of Computer Science, Birzeit University, Birzeit, Palestinian Authority

Abstract

The mobile app market is still in continual growth. People are migrating to smartphone mobile devices to accomplish their daily activities while working, playing, and communicating with others. From the developers' perspective, there exists a wide variety of platforms, technologies, and architecture choices for developing and testing mobile apps. However, because of the constant changes in software applications and the great technological development, developers are supposed to speed up the development process to satisfy the customer's needs and provide robust applications within a short period of time. Cross-platform mobile app development technology, such as react Native, aims to overcome these difficulties, where instead of building separate applications for each platform, a single code base that can be run on multiple platforms is developed, which accelerates the development process. Model-based testing is one of the techniques that are used to test cross-platform applications and identify and find defects and bugs. This study proposes a React Native Abstract Syntax Tree pruning (RN-AST pruning) framework, which aims to facilitate the mobile app testing process by pruning the original GUI model of the application and reducing the number of test cases by keeping only the test cases that cover the impacted regions from internal code changes. The pruning process to keep the GUI elements is applied to the abstract syntax tree, which is the result of doing the static analysis on the last two versions of the source code. After that the two pruned AST will be compared to keep only the affected and updated GUI elements. The affected files will be listed as paths to prevent any other file from being tested, consequently reducing the number of test cases. According to our knowledge, no comprehensive work was dedicated to use the static analysis approach in keeping only the impacted GUI elements by the internal code changes in cross-platform software, thus reducing the run test cases and increasing productivity by accelerating the development life cycle. Preliminary experimentation was done on our framework with the help of six developers and test engineers in cross-platform development. The experiment was carried out in a systematic process with clear steps on a proof of concept mobile application. Results show that the RN-AST Pruning framework is useful and provides test engineers with affected files and paths that need to be tested, thus reducing the test cases and minimizing the testing time and effort. Moreover, it identifies exactly the changes that occurred in each file and categorizes them into updates, placements, and deletions based on the differences between the original version and the updated version of the source code. The authors confirm that this study is original and its contents are unpublished. Moreover, no specific grant from any funding agency was received.

Journal of Computer Science
Volume 20 No. 6, 2024, 594-601

DOI: https://doi.org/10.3844/jcssp.2024.594.601

Submitted On: 9 September 2023 Published On: 12 March 2024

How to Cite: Ibrahim, R. M. K. & Zein, S. (2024). Testing React Native Mobile Apps: Pruning GUI Model Approach. Journal of Computer Science, 20(6), 594-601. https://doi.org/10.3844/jcssp.2024.594.601

  • 1,681 Views
  • 893 Downloads
  • 0 Citations

Download

Keywords

  • React Native
  • GUI Model
  • Pruning
  • Testing Process