More people use mobile devices to access websites and applications than laptops and desktop computers. According to Statista, mobile traffic share is over 54%, surpassing desktop computers as the most used device to access the internet in 2022. Mobile also fuels 45% more financial decisions, according to the State of Mobile 2021 report. If your app isn’t optimized for mobile, it may be undervalued and underperforming financially.
However, optimizing your app for mobile and testing can be challenging. It’s important to have a trusted testing solution. Flutter is an open-source app by Google that helps you build multi-platform applications from a single code base and ensures your websites are thoroughly tested and optimized for mobile.
This article will show you the benefits of using a software development kit like Flutter and how to integrate Flutter with Xray to unify your testing results. Before we dive deeper into this tutorial, we will give you a brief overview of testing for mobile devices and the challenges that come with it.
The importance of mobile-friendly apps
Before the last decade, testing for mobile devices was optional, depending on how much your business invested. The usage was low as the capacities of the device were limited. In contrast, mobile devices have advanced in terms of capabilities in recent years and are now an indispensable aspect of our life.
Mobile-friendly websites are increasingly required due to the exponential growth in the use of mobile devices, which is reflected in the fact that more mobile applications are downloaded (+20%) and more time is spent using mobile devices (State of Mobile 2021 - App Annie).
The response from manufacturers for such broad adoption of mobile devices was to diversify to address all different needs of users and markets. This has generated a flood of new devices that, for Android, has, in turn, generated a fragmentation challenge in terms of platform/OS version and the characteristics of the devices. Fragmentation refers to the fact that there are a massive number of different Android OS versions available and operational in the digital world that will require different codes to work properly.
OpenSignal 2015 Fragmentation Report
To create an application that will run on all these devices, a developer must be knowledgeable about various languages, frameworks, and tools, as well as the distribution specifics of each builder.
Trying to produce a product that will work on all devices has become almost impossible, and companies are now focusing on subsets that make sense for their target audience.
This has originated different test approaches and tools that follow the development process.
Mobile development types
New terms emerge to describe these new challenges. Regarding mobile development types, we start to hear about native mobile development and cross-platform development.
Native mobile development is the most common one, as it’s the standard provided by platform vendors (e.g., Google, Apple) and consists in using native platform SDKs (software development kits) to develop applications.
Given the diversity of devices and OS, developers felt the need to reach more devices with the same source code. This demand has generated new tools that enable one to write one source code that will be compiled and produce native applications for different platforms. This strategy enables those applications to work on different devices, which is known as cross-platform development.
These new development types generated new types of mobile applications that can be categorized into three types: native, hybrid, and web.
- Native applications are usually produced by the standard platform SDKs and have access to all device capabilities while simultaneously being the most performant ones. Native apps are the most popular ones.
- Hybrid applications use a mix of web technologies while providing access to low-level native API calls.
- Web applications are based on web standards (e.g., HTML5, JavaScript, CSS3). They are more simple as they will live within the browser, and due to that, they are also more limited.
Hybrid apps?
One frequent confusion is related to "hybrid apps" and "hybrid app development." Some users call hybrid apps all apps built for multiple platforms (i.e., cross-platform); others call hybrid apps since apps use a mix of HTML5 technologies on top of a webview component along with some access to native APIs.
Therefore, whenever we read about "hybrid apps," we need to understand the context of that statement. Given the wide variety of devices and development methodologies, we also saw an adjustment of the testing area for these realities.
Let’s quickly overview the mobile development tools available to produce mobile applications and how they solve the challenges we discussed.
Mobile development tools and environments
Android and iOS SDKs are probably the most used environments for mobile app development, in this case, for native apps.
Even though React Native seems to be more used and has more demand nowadays, Flutter is becoming the preferred tool for cross-platform mobile development (Statista).
Cross-platform mobile frameworks - Statista
We can now produce applications adjusted to each device and OS, but this also means that they will behave differently or should have the same behavior using different APIs, so how can we validate that? Is it acceptable to have one version of each device to perform validations?
Mobile farms in the cloud—solutions with online access to emulators and actual devices for validations—started to emerge at this stage. By doing this, you and your business can validate several devices (manually and automatically) without having to buy them.
Cross-platform is the preferred approach, and from the available tools, Flutter stands out. Flutter is an SDK that enables developers and testers to write one source code that will be compiled and tested on several devices (or emulators). Let’s look into it in a little more detail.
Flutter Components
Flutter is used to build native interfaces for iOS and Android using the Dart programming language (a client-optimized language for developing fast apps on any platform). Flutter can integrate with existing iOS and Android code bases. It also produces desktop or web applications and is free and open-source, which helps its growth amongst developers.
Flutter also covers testing and allows several types of tests, such as:
- Unit tests validate a single function, method, or class.
- Widget tests that validate a single widget (referred to as component tests in other UI frameworks).
- Integration tests validate a complete application or a large part of an application.
Flutter makes it possible to create one source code for your application using Dart, which can be compiled and generate native applications for Android, iOS, web, or desktop applications. This means that maintenance suddenly gets easy, as we only have one version of the code to maintain.
Flutter also allows you to define different types of tests to check your application. All those reasons have triggered us to produce a Flutter SDK tutorial on how to produce tests and integrate with Xray.
Xray and Flutter Integration
Integrating Flutter with Xray is straightforward, using the Flutter capacity to produce a JUnit report that will be imported directly into Xray. Take a look at our Flutter integration tutorial, which shows you how to integrate Flutter with Xray, with the respective source code and a video to help you get started.
It can be challenging to maintain visibility into testing efforts since only some on the team know the tests that are running or that are available and how to monitor their status. If your team uses a unique tool for testing that generates its reports in a distinct area or setting, you are impeding its ability to work together.
Xray focuses on bringing visibility to your team's testing efforts in the same place your team uses to manage their project. This enables everyone in the team to have visibility over the testing efforts (Tests, Test Plans, Executions, etc.) without changing tools. Having all this information available in a central place will trigger healthy discussions and collaboration toward the project's objective.
The SDK, framework, or tool you use to create your tests is irrelevant to Xray as long as the test report you create can be imported into Xray using the API or one of the available plugins (e.g., Jenkins plugin).
Create mobile-friendly apps with Xray and Flutter
Mobile is inevitable nowadays, and if you are not optimizing your app for mobile, you are missing out on a great opportunity to reach more users. It is difficult to be friendly and responsive on mobile and can be overwhelming. If it fits your testing strategy, use a tool that will enable you to write the code once and produce applications for several devices with the appropriate tests.
Finally, make sure your choice considers integration and visibility. How well will this tool integrate into your current process, and how/where will you share the results so that they are available to everyone? Choose tools based on how they will solve your technical challenges and how well they will integrate into your process to make the most of your efforts.
