Testing Color Properties of Text Elements in UI Automation

Testing Color Properties of Text Elements in UI Automation

11 April 2024 Stephan Petzl Leave a comment Tech-Help

When it comes to automated user interface testing, one common task that developers and testers might encounter is verifying the color of text elements within an application. This is particularly relevant when the visual indication of an element’s state is crucial, such as distinguishing between a “requested” or “draft” status in a table.

Understanding the Limitations of UI Testing

UI testing frameworks, such as the one provided by Apple for iOS applications, offer the ability to interact with and verify the properties of UI elements. However, these frameworks have their limitations. One such limitation is the inability to access certain properties of UI elements that are not exposed by Accessibility APIs.

Accessibility and UI Testing

UI Testing tools operate on the information provided by the Accessibility layer. This means that any attribute or property of a UI element that is not exposed to the Accessibility API is beyond the reach of UI Testing. For instance, while you can retrieve the text of a label, you cannot directly obtain its color since that is not a property provided by the Accessibility framework.

Here’s an example of how you might retrieve the text of a label in your UI Test:

var timeSheetStatus = app.tables.element.cells.elementBoundByIndex(0).staticTexts.elementBoundByIndex(1).label

Alternative Approach: Accessibility Labels

Despite the limitations mentioned above, there is a workaround that can help you verify the color of text indirectly. By leveraging accessibility labels, you can include additional information about the color within the label’s accessibility properties.

Enhancing the accessibility label not only aids in UI testing but also improves the overall accessibility of your application for visually impaired users who rely on screen readers and cannot perceive color.

Implementing Enhanced Accessibility Labels

To implement this strategy, you would need to modify the code of your application to include the color information within the accessibility label of the text element. Below is an example of how you might set an accessibility label to include color information:

myLabel.text = "Draft"
myLabel.color = .yellow
myLabel.accessibilityLabel = "Draft (Yellow)"

Once you’ve implemented this, your UI tests can then verify that the accessibility label contains the correct information, indirectly confirming the color. However, remember that this method assumes that the color set in the code and the color mentioned in the accessibility label are consistent. It is always a good practice to maintain accuracy in the code to ensure reliable tests.


While direct access to certain UI element properties such as color is not possible through UI Testing due to the constraints of the Accessibility framework, creative use of accessibility labels can provide a viable solution. By including color information within the accessibility label, you can create a testable attribute that serves both UI automation and accessibility needs. This method underscores the importance of thoughtful app design that considers both testability and accessibility from the outset.

Like this article? there’s more where that came from!