Challenges And Solutions In Test Automation For Safari Browsers

Apple offers an exceptional web browser, Safari, packed with cutting-edge web technologies. Safari boasts a clean user interface, swift browsing speeds, and exclusive, handpicked features. Although Chrome has been making inroads on Apple devices, tests on Safari browsers retain a significant share of the browser market. This underscores the importance of ensuring that websites perform optimally on Safari.

This article discusses some of the challenges in test automation for Safari browsers.

How to Verify Your Website’s Compatibility Across Browsers:

Cross-browser testing is a widely adopted approach to ensuring that your website functions correctly when accessed from various combinations of browsers and operating systems. Here’s how to perform thorough testing:

Diverse Browser-OS Combinations: Test your website on a range of popular web browsers, including Firefox, Chrome, Edge, Safari, and more. Also, consider testing on prevalent operating systems like Windows, macOS, iOS, and Android.
Varied Devices: Keep in mind that users access websites through different devices, such as smartphones, tablets, and desktop computers. Ensure your website’s compatibility across these diverse platforms.
Assistive Tools Compatibility: It’s essential to check if your website is accessible to users who rely on assistive technologies like screen readers, especially to accommodate differently-abled individuals.
Performing a thorough check for broken links is essential to ensuring a smooth and frustration-free experience for website visitors. Broken links not only inconvenience users but can also harm a website’s SEO. It’s crucial to confirm that all links direct users to their intended landing pages or documents.
Testing Cookies: Cookies, which store valuable end-user information like login details, cart contents, visited pages, and IP addresses, require meticulous testing. Evaluating a website’s behavior with cookies enabled or disabled across various user scenarios in real conditions is essential.
Validating UI Elements: UI elements, such as text fields, drop-downs, formatting, and spacing, should undergo rigorous testing, considering various use case scenarios. While manual testing suffices for smaller websites, comprehensive UI testing for larger sites can be daunting. Automated UI testing using tools like Selenium enables the execution of parallel tests, expediting the validation of UI functionality.
Website Responsive Testing: Ensuring mobile responsiveness is vital for websites to provide optimal viewing experiences across diverse screen resolutions, ultimately enhancing SEO efforts. Online responsive design checker tools prove valuable for assessing how websites appear on different devices, including mobiles, tablets, and desktops.

LambdaTest is an AI-powered test orchestration and execution platform that offers a comprehensive solution to simplify browser testing by providing access to over 3000 real devices and browsers, both legacy and current. This approach allows you to identify and address any browser-related issues, ensuring a smooth and seamless user experience on your website.

Challenges faced by Safari browser for Test Automation

Apple has established standards that emphasize the use of supported CSS, HTML, and JavaScript (ECMA6) content. For most conventional websites, the latest Safari version functions much like any other browser. However, complications may arise when websites incorporate innovative elements.

While Apple diligently adopts new technologies, its browser development pace lags behind that of Chrome or Firefox. Numerous issues can potentially impede your website’s performance, but I’ve highlighted the key concerns that can significantly affect it if left unaddressed.

CSS: Unsupported CSS is a major culprit behind many cross-browser compatibility issues, and Safari is no exception. The pursuit of efficient styled content has driven developers to embrace the latest web technologies, which sometimes lack support in certain browsers. While responsive design techniques are recommended to ensure styling flexibility across various viewports, it’s essential to be aware of features lacking support in the latest Safari version, 11.1, that should be avoided.
CSSOM Scroll Behavior: This method specifies scroll behavior for scrolling boxes, particularly for navigational scrolling.
Web Animations API: This API allows the creation of animations that run in the browser and provides the ability to inspect and manipulate animations created through declarative means, such as CSS.
CSS Containment: If you use CSS Containment to limit CSS content to enhance website efficiency, consider switching to alternative methods.
CSS Touch-action Property: This property controls the filtering of gesture events and offers developers options for selectively disabling touch scrolling.
CSS Text Alignment Last: This property determines the alignment of the last line of text in a block container.
CSS Overscroll Behavior: This property defines the behavior of the browser when the user scrolls beyond the boundaries of a scrolling area.
CSS Motion Path: This feature enables the animation of elements along a custom motion path.
ECMA 6: While Safari supports a wide range of ECMA 6 features, such as the Geolocation API and exclusive features like Tail Call Optimization, there are some unsupported features.
Shared memory and atomic
Asynchronous iterators
Lookbehind assertions in RegExp
Background sync API

Multimedia:

Careful consideration of multimedia formats is essential for Safari compatibility, as it has issues with certain formats. In addition to avoiding Flash plugins, here are formats lacking Safari support:

Media Recorder API: This API simplifies media recording from user input for immediate use in web apps, eliminating the need for manual encoding operations.
Ogg Vorbis Audio Format: Vorbis is a free and open-source audio format commonly used within the Ogg container.
Ogg/Theora Video Format: This free lossy video compression format is not fully supported.
WebM Video Format: WebM is a multimedia format designed for royalty-free, high-quality open video compression for use with HTML5 video. It supports the video codec VP8 and VP9.
Opus: This open codec, developed by IETF, combines SILK from Skype and CELT from Xiph.org to provide higher sound quality and lower latency bitrate.

Transport Layer Issues: Safari encounters consistent issues with certain Transport Layer features. Here are some noteworthy features lacking adequate support:

TLS 1.3: Safari appears to lack support for the upcoming version of the Transport Layer Security (TLS) Protocol, which removes weaker elliptic curves and hash functions. Chrome and Firefox have already adopted stable versions supporting TLS 1.3.
ChaCha20 Cipher Suites: These cipher suites, part of the TLS protocol, utilize symmetric encryption. Additionally, Poly1305, used for authentication, does not receive sufficient attention from Safari.

Other Important Features Lacking Support: Several other important features remain unsupported by Safari:

Resource Hints: Prefetch: This feature, supported by leading browsers, instructs browsers on which resources to prefetch for faster loading.
Resize Observer: This feature allows observation and response to changes in the size of the Document Object Model (DOM).
Permission API: A high-level JavaScript API for checking and requesting permissions.
HTML Imports: This method enables the inclusion and reuse of HTML documents within other HTML documents.
Web MIDI API: This specification provides web developers with the means to enumerate, manipulate, and access MIDI devices.
Public Key Pinning: Declares that a website’s HTTP certificate should only be treated as valid if the public key is included in a specified list, preventing MITM attacks using valid CA-issued certificates.
Web Authentication API: An extension of the Credential Management API, this feature enables strong authentication using public key cryptography, facilitating password-less authentication or secure second-factor authentication without SMS texts.
Visualizing Layer in Web Inspector: The Layers tab within Web Inspector provides a 3-D visualization of a page’s compositing layers, offering insights into how they are rendered. This visualization has the potential to address various performance issues and serves as a valuable debugging tool.
PWA (Progressive Web App) Support: Safari has begun embracing PWAs, recognizing their importance for the future of web applications. With support for Service Worker API, Web App Manifest, and other PWA-related features, Safari users can experience the benefits of these modern web apps, including offline access, improved caching, and push notifications.

Conclusion

Backed by Apple’s robust support, Safari is poised to maintain its relevance in the web browsing landscape. While the mentioned steps help guarantee your website’s compatibility with Safari, it’s crucial to adopt a neutral approach during development to ensure genuine cross-browser compatibility.

LambdaTest offers comprehensive testing solutions to address all your testing requirements. By testing your website on LambdaTest, you can uncover any additional issues and ensure its seamless performance across various browsers and platforms.