Skip to content

Commit

Permalink
XS✔ ◾ MAUI | Improving the order of the rules (#8613)
Browse files Browse the repository at this point in the history
* MAUI  |  Improving the order of the rules

* Added prefix

* Update rule.md

* Update rule.md

* Auto-fix Markdown files

* Reordered

* Auto-fix Markdown files

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
  • Loading branch information
tiagov8 and github-actions[bot] authored May 29, 2024
1 parent 857c74a commit f549799
Show file tree
Hide file tree
Showing 5 changed files with 23 additions and 21 deletions.
4 changes: 2 additions & 2 deletions categories/software-engineering/rules-to-better-maui.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,11 @@ index:
- build-cross-platform-apps
- maui-cross-platform
- how-to-build-for-the-right-platforms
- use-mvvm-pattern
- use-design-time-data
- the-best-maui-resources
- use-mvvm-pattern
- optimize-android-builds-and-start-up-times
- use-hot-reload
- use-design-time-data
- consistently-style-your-app
- conduct-cross-platform-ui-tests
- dev-test-maui-apps
Expand Down
5 changes: 3 additions & 2 deletions rules/conduct-cross-platform-ui-tests/rule.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
type: rule
title: Do you conduct cross-platform UI Tests?
title: Testing - Do you conduct cross-platform UI Tests?
guid: 8949d1b5-ff9d-4ffc-be57-87976af5b7c3
uri: conduct-cross-platform-ui-tests
created: 2020-10-07T23:30:41.0000000Z
Expand All @@ -16,8 +16,9 @@ redirects:
---

Any changes you make to your app risks breaking existing functionality. Having a suite of automated tests that you can run prior to any release reduces the risk of releasing a product with new features that don't work, or that breaks existing features. It also means that you can run these tests as part of your CI/CD pipeline.

<!--endintro-->

Every control in .NET MAUI exposes the `AutomationId` property, which allows a UI testing framework to find and interact with contols. [This article](https://learn.microsoft.com/en-us/samples/dotnet/maui-samples/uitest-appium-nunit/) demonstrates how you can write and run your UI tests with Appium.
Every control in .NET MAUI exposes the `AutomationId` property, which allows a UI testing framework to find and interact with contols. See [how you can write and run your UI tests with Appium](https://learn.microsoft.com/en-us/samples/dotnet/maui-samples/uitest-appium-nunit/).

Unlike Xamarin, .NET MAUI doesn't come with a [built-in UI testing framework - Xamarin.UITest](https://docs.microsoft.com/en-us/appcenter/test-cloud/frameworks/uitest). Technically, you still can use Xamarin.UITest with .NET MAUI, but only to unblock your team to migrate from Xamarin. For details, [see this video by Gerald Versluis](https://www.youtube.com/watch?v=0c2U-TzmTnQ).
25 changes: 13 additions & 12 deletions rules/dev-test-maui-apps/rule.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,19 @@
---
type: rule
archivedreason:
title: Do you test .NET MAUI apps on different devices?
title: Testing - Do you test .NET MAUI apps on different devices?
guid: c039d377-4b4e-4b81-adbf-2291c4648607
uri: dev-test-maui-apps
created: 2023-07-02T23:23:51Z
authors:
- title: Vlad Kireyev
url: https://www.ssw.com.au/people/vlad-kireyev/
url: https://www.ssw.com.au/people/vlad-kireyev
related:
- dev-mobile-device-policy
-
---
.NET MAUI (Multi-platform App UI) is a framework that enables developers to create cross-platform applications for different devices efficiently. However, the efficiency of this framework could mean nothing if the developed apps are not tested on various devices, especially the older once.

.NET MAUI (Multi-platform App UI) is a framework that enables developers to create cross-platform applications for different devices efficiently. However, the efficiency of this framework could mean nothing if the developed apps are not tested on various devices, especially the older once.

<!--endintro-->

Expand All @@ -22,25 +24,24 @@ Testing mobile apps on different devices helps in ensuring compatibility across
There are several ways that developers can test mobile apps on different devices to ensure that they are running smoothly and providing the best user experience possible. One approach is to use emulators, which are programs that simulate the behaviour of specific devices and operating systems. These emulators can be very helpful for testing basic functionality, but they may not accurately represent all aspects of the user experience, such as touch sensitivity and screen size.

Some of the popular .NET MAUI emulator apps are:
- iOS Simulator: it allows developers to preview their apps on iOS and macOS devices.
- Android Emulator: it allows developers to test their apps on various Android devices.
- Tizen Simulator: it allows developers to test their apps on Tizen devices.

* **iOS Simulator** - Allows developers to preview their apps on iOS and macOS devices
* **Android Emulator** - Allows developers to test their apps on various Android devices
* **Tizen Simulator** - Allows developers to test their apps on Tizen devices

## Option 2: Use a cloud-based service

Testing mobile apps with cloud-based services like BrowserStack offers several advantages to developers. Firstly, it allows them to easily access a wide range of real devices and browsers for testing, enabling comprehensive and efficient app evaluation. The developers can run tests on multiple operating systems, screen sizes, and resolutions, ensuring that their MAUI app performs seamlessly across various platforms. Additionally, these cloud-based services provide instant access to devices, eliminating the need for physical hardware and saving both time and resources. However, reliance on such cloud-based services introduces substantial latency to your inner development loop, and might not be the best option for development.

Apart from BrowserStack, there are several services that offer similar functionality:
- Sauce Labs
- LambdaTest
- Experitest
- CrossBrowserTesting.
Apart from BrowserStack, there are several services that offer similar functionality:

* Sauce Labs
* LambdaTest
* Experitest
* CrossBrowserTesting

## Option 3: Use real devices (Recommended)

Another effective way to test mobile apps on different devices is to use real hardware. This allows developers to see how the app performs on a variety of devices with different screen sizes, processing power, and other specifications. One approach is to borrow or purchase multiple devices to test on, but this can be time-consuming and expensive. The better way is to [have a device policy for your mobile dev teams](/dev-mobile-device-policy).


Regardless of the approach used, it is important to test on a variety of devices to ensure that the app works well for all users. This can include testing on both iOS and Android devices, as well as different versions of each device and operating system. Additionally, testing on different screen resolutions and aspect ratios can help identify any design issues that may arise. By thoroughly testing on a range of devices, developers can ensure that their MAUI app is high-quality, user-friendly, and reliable across all platforms.
4 changes: 2 additions & 2 deletions rules/use-design-time-data/rule.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
type: rule
archivedreason:
title: Do you use design time data?
title: Debugging - Do you use design time data?
guid: d6506511-92c5-4050-b048-a75505ff18b7
uri: use-design-time-data
created: 2020-10-07T23:21:11.0000000Z
Expand All @@ -20,7 +20,7 @@ redirects:

**UPDATE:** XAML Previewer was [deprecated in Visual Studio 2019](https://learn.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-previewer/?pivots=windows). For .NET MAUI use [Hot Reload](/use-hot-reload)

The XAML previewer in Visual Studio is a useful tool for designing your Xamarin UI. One limitation is that often your controls are bound to properties in your ViewModel (see rule: [Do you use the MVVM pattern?](/use-mvvm-pattern)), meaning that you can't see what your UI will look like with the data loaded, without building and running your app.
The XAML previewer in Visual Studio is a useful tool for designing your Xamarin UI. One limitation is that often your controls are bound to properties in your ViewModel (see rule [Do you use the MVVM pattern?](/use-mvvm-pattern)), meaning that you can't see what your UI will look like with the data loaded, without building and running your app.

<!--endintro-->

Expand Down
6 changes: 3 additions & 3 deletions rules/use-hot-reload/rule.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
type: rule
archivedreason:
title: Do you use Hot Reload?
title: Debugging - Do you use Hot Reload?
guid: e8523286-b3e3-49a1-8a9c-c01b43bc7390
uri: use-hot-reload
created: 2020-10-07T23:15:56.0000000Z
Expand All @@ -21,13 +21,13 @@ Developing mobile apps presents unique challenges compared to web or desktop dev
<!--endintro-->

::: bad
![Figure: Bad Example - rebuilding your app every time to see small UI changes](hot-reload-bad.png)
![Figure: Bad example - Rebuilding your app every time to see small UI changes](hot-reload-bad.png)
:::

To get around this problem use Hot Reload. This lets you make changes to your XAML while debugging your app - as soon as you save your UI will update, without having to stop and rebuild your app.

::: good
![Figure: Good example - hot reload enable screenshot Windows](hot-reload-good.png)
![Figure: Good example - Hot reload enable screenshot Windows](hot-reload-good.png)
:::

**Tip:** This works on the iOS simulator, the Android emulator, and physical iOS and Android devices.

0 comments on commit f549799

Please sign in to comment.