HTML5 Support in Hybrid Mobile Applications

Applies to TestComplete 14.71, last modified on April 22, 2021

This topic gives an outline of the HTML5 support provided by TestComplete for hybrid mobile applications.

General Information

You can use TestComplete to automate and check HTML5 elements in your tested hybrid applications in the following way:

  • You can create, record and play back operations that work with HTML5 elements such as the new INPUT types (e-mail, number, search and so on).

    HTML5 elements of hybrid application in the TestComplete Object Browser

    Click the image to enlarge it.

  • You can use property checkpoints to verify the data, state and attributes of HTML5 elements.

  • You can use region checkpoints to verify the graphic content of SVG and CANVAS elements.

For more information on how to automate tests for hybrid applications, see Testing Hybrid Mobile Applications - Overview and Creating Tests for Hybrid Mobile Applications Manually.

The WebView control does not support all HTML5 features on all mobile devices. For information on which devices support which HTML5 features, refer to the following sites:

http://caniuse.com

http://html5test.com/

Besides, not all HTML5 features of hybrid applications are accessible to TestComplete:

HTML 5 Feature Is supported by Android WebView Is supported by iOS WebView Can be accessed by TestComplete
New media elements: AUDIO and VIDEO. Yes Yes Partially. Elements are available in the page object hierarchy. Native methods and properties are not accessible.
New INPUT types:
SEARCH, NUMBER, TEL and so on.
Yes Yes Yes
New semantic elements:
ARTICLE, HEADER, FOOTER, SUMMARY, DETAILS, METER and so on.
Mostly Mostly Partially. See below.
Canvas and SVG graphics. Yes Yes Partially. See below.
CSS3 attributes Mostly Mostly No. See below.
Web storage Yes Yes No. See below.
Application cache Yes Yes No. See below.
MathML No Mostly Partially. Elements are available in the page object hierarchy. Native methods and properties are not accessible.
Drag and Drop No No No

Requirements for HTML5 Application Testing

To test HTML5 hybrid applications with TestComplete, make sure the following requirements are met:

HTML5 Support Limitations for Hybrid Mobile Applications

Support Limitations for HTML5 Elements

  • HTML5 INPUT types that are not supported by the WebView control are identified as generic TextBox objects rather than specific test objects.

  • HTML5 INPUT types supported through custom components are not recognized. For example, TestComplete does not recognize the MonthInput dialog on HTC One S with Android 4.3 or earlier. You can still test these controls by performing image-based testing.

  • DATALIST elements are not available in the test object hierarchy. However, you can access a DATALIST element of an INPUT element through the list.options property of the TextBox object that corresponds to the INPUT element.

  • SOURCE elements are not available in the test object hierarchy, because they are invisible and users do not interact with them. To get the file name of a media source, use the src attribute.

  • WBR elements are not available in the test object hierarchy, because they are semantic and do not have any text content.

  • TestComplete does not support the following HTML5 elements:

    • COMMAND

    • KEYGEN

SVG Support Specifics

TestComplete identifies inline SVG on web pages. You can create verifications for the displayed content. For example, you can use region checkpoints to verify the displayed graphics.

When testing SVG, keep in mind the following:

  • Only inline SVG is supported.

    SVG files opened directly in web browsers (for example, http://www.example.com/file.svg) are not supported.

    SVG content embedded by using the OBJECT and EMBED elements is not supported.

  • SVG text elements are identified as TextNode objects.

    Other SVG content elements (rect, circle and so on) are not identified as individual test objects.

Data Object Model Is Inaccessible

WebView controls do not provide direct access to DOM of a web page.

CSS3 attributes, Web Storages and Application Cache are supported by WebView controls. You can work with these attributes and APIs from on-page scripts (defined directly on the web page and in external scripts). You cannot work with these attributes from TestComplete, as it does not have direct access to DOM.

See Also

Testing Hybrid Mobile Applications
Testing Hybrid Mobile Applications - Overview
Common Tasks for Hybrid Mobile Application Testing
HTML5 Support

Highlight search results