Preview, test, and publish an app

Creating any type of application including canvas applications is an iterative process, meaning that the app evolves over time, and through testing, you're able to adjust as needed. Power Apps Studio provides several tools that help you preview, refine, and publish your app effectively. In this learning unit, we explore each of these items individually.

Preview a canvas app in Power Apps Studio

Your canvas app will likely be used on different devices. Previewing your app allows you to see how it appears and functions on different devices and orientations. This step is useful when building responsive apps. Since each device can impact on how the app is displayed, you should test it. Since you can preview on different devices, you can ensure that it's displaying correctly.

When working in an app, select the Preview the app option. You can use the device picker to view your app on various devices, such as tablets, mobile phones, or web browsers. You can adjust the orientation using the Orientation Switcher.

Check for issues

Refining your app is a crucial step in ensuring it performs optimally and is accessible to all users. Power Apps provides two built-in tools to help identify and resolve issues, improve debugging, and ensure compliance with accessibility standards.

• App Checker
• Accessibility Checker

These tools not only enhance the functionality of your app but also make it more inclusive for users with disabilities.

App Checker

The App Checker is a powerful tool designed to identify formula errors, performance bottlenecks, and other issues that may impact your app’s functionality. It provides actionable recommendations to help you debug and optimize your app efficiently. App checker focuses on two primary areas:

• Formula Errors: Suppose your app includes a gallery that filters data based on user input, but the formula contains a syntax error. The App Checker flags the issue, highlight the problematic formula, and suggest corrections.
  For example: If the formula Filter(Orders, Status = "Open") is missing a closing parenthesis, the App Checker identifies the error and recommend adding the missing character.

• Performance Recommendations: If your app uses inefficient formulas or queries that could slow down performance, the App Checker provides suggestions to optimize them.
  For example: If a formula retrieves large datasets without delegation, the App Checker might recommend using a delegable query to improve performance when working with connected data sources like SharePoint or Dataverse.

By addressing the issues flagged by the App Checker, you can ensure your app runs smoothly and delivers a better user experience.

Accessibility checker

The Accessibility checker helps you identify and resolve potential accessibility issues in your app, ensuring it's usable by individuals with disabilities. This tool highlights areas where your app may lack support for features like keyboard navigation, screen readers, or color contrast compliance. Some of the items that the accessibility checker looks at include:

• Missing screen reader support: If a button in your app lacks a descriptive label, screen readers may not convey its purpose to visually impaired users. The Accessibility Checker flags this issue and recommend adding a meaningful label to the button’s AccessibleLabel property.
  For example: A button labeled "Submit" should have an AccessibleLabel property set to "Submit form data" to provide context for screen reader users.

• Keyboard navigation issues: If certain controls in your app can't be accessed using a keyboard, the Accessibility Checker highlights these elements and suggest enabling keyboard focus.
  For example: A dropdown menu might require adjustments to its TabIndex property to ensure it's navigable via keyboard shortcuts.

• Color contrast compliance: If text or UI elements in your app don't meet recommended color contrast ratios, the Accessibility Checker flags them and suggest changes to improve visibility for users with visual impairments.
  For example: A light gray text on a white background might need to be changed to a darker shade to meet contrast guidelines.

By addressing accessibility issues, you ensure your app is inclusive and compliant with accessibility standards, improving usability for all users.

Save and publish a canvas app

Saving and publishing your app ensures that changes are preserved and made available to all users with whom the app is shared.

To save a new version of your app, select the Save option. In addition to saving the app, other saving options are available. Those other options include:

• Save with version notes: Add notes about updates.
• Save as: Duplicate the app with a new name.
• Download a copy: Save a local copy of the app.

Publish your app

• After saving, explicitly publish your app to make it accessible to all shared users.
• To publish, select the publish icon while in editing mode.

For more information, visit Save and publish canvas apps.