Webflow sync, pageviews & more.
NEW

Does anyone have suggestions for a site or app that can emulate the latest Safari version to help me troubleshoot a flickering issue in Webflow? It only happens on the home page with split navigation div elements.

TL;DR
  • Use BrowserStack or real Apple hardware with Safari to accurately test and debug Webflow flickering issues.
  • For mobile testing, use Xcode’s iOS Simulator; avoid Windows-based Safari emulators due to inaccurate rendering.

You're dealing with a Safari-specific flickering issue in Webflow, typically caused by CSS rendering quirks or animation bugs in WebKit. To reliably reproduce and troubleshoot this in the latest version of Safari, you’ll need access to accurate Safari emulation or the real browser environment.

1. Use BrowserStack for Safari Emulation

  • BrowserStack offers real-time access to Safari on different macOS versions, including the latest stable release.
  • It lets you test your live Webflow site directly or upload a local build.
  • Go to browserstack.com > Live > macOS Safari, select the desired version, and enter your Webflow site URL.
  • Bonus: You can also test on iOS Safari to check for mobile-specific rendering issues.

2. Use macOS and Safari on a Real Device

  • Testing on actual Apple hardware running macOS Ventura or Sonoma with Safari 17+ is the most accurate way.
  • If you don't own a Mac, consider:
  • MacStadium: Offers Mac cloud machines with remote desktop access.
  • Borrow from a teammate or use an office device with the latest Safari installed.

3. Use Xcode Simulator (For iOS Safari Testing)

  • For mobile bugs, install Xcode (free from Mac App Store) on macOS.
  • Use the iOS Simulator to launch Safari and test your Webflow site.
  • This helps you isolate whether the flicker is specific to iOS Safari or applies universally.

4. Avoid Windows-Based Emulators for Safari

  • Tools like Lambdatest, Sauce Labs, or Windows-based browsers claiming to emulate Safari do not offer true Safari rendering.
  • Only a real Safari browser or enterprise-grade tools like BrowserStack can accomplish this accurately.

Summary

To emulate the latest Safari and troubleshoot flickering in your Webflow site, use BrowserStack for real-time Safari access or test on actual Apple hardware. Avoid unofficial emulators on Windows, as they won’t accurately replicate Safari’s rendering behavior.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
How can I change the font size of H4 elements in the Rich Text element on Webflow only for mobile screen sizes?
How can we style the dropdown field in Webflow forms?
Can I get a refund for a Webflow template if my own images don't work well with the design?
How can I select a collection page, instead of a regular page, when setting a link block in Webflow?
What is a solution to schedule a daily task in Webflow to run a script and avoid CORS blocks in the console?
Having trouble indexing my Webflow site on Google and uploading my sitemap on Google Search Console. Getting an error message. Can you help?
Why does a font appear differently in Webflow compared to Figma and how can I resolve this?
How can I add date filtering to my current list of filters in Webflow using Finsweet CMS Filtering?
What referral program service have you used to integrate with Webflow?
How can I auto start and loop a YouTube video in Webflow without the play button?
How can I clear the server cache in Webflow after migrating my site?
Why does the old design of my client's website appear broken for some visitors?
How can I style block quotes for blogs in Webflow?
Can I add a span with a class within a h4 tag in the Webflow editor or do I need to edit the code manually?
How can I ensure an image stays within its DIV without distorting its aspect ratio in Webflow?
Can Webflow be used to call a CSS or JS file stored on a different server, instead of hosting them on GitHub?
How can I dynamically redirect to a CMS created after form submission in Webflow?
In Webflow, how can I hide specific elements in the footer (such as "Ramin Khaze The Difference" and "Schedule showing") when the URL contains a certain parameter, such as "?mls"? I am a beginner in coding and would appreciate any help. Thank you!
How can I prevent the "w-current" class in Webflow from overriding the height of my custom class on a link block element?
Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?
How do I mirror user input from a form field to a non-form text field on the same Webflow page in real-time using JavaScript?
How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?
How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?
How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?
How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?
How can I change the language of the Google Maps embed from English to Arabic in Webflow?
How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?
How can the text color be changed for custom input fields on Webflow?
How can I add conditional visibility in Webflow to prevent a div from appearing on a published page if a CMS field is empty?
How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?