Troubleshooting: Heatmap Report Not Loading in VWO

Problem Statement

When I try to load the page that I am running the heatmap on, it either loads with broken content or heatmap throws an error.

Resolution Steps

• Clear existing cookies from your browser and try again.

• Add VWO SmartCode directly on the web pages and not through proxy. If VWO SmartCode is not installed on the test pages, VWO tries to open the heatmap report using a proxy. Due to this, the report may not load properly as there could be issues in fetching CSS/JavaScript files, completing AJAX requests, and so on. Add the SmartCode on the test pages and try again.

• The error may occur because the X-frame header is set to SAME_ORIGIN on your website’s backend. You can ask your developer to add conditions to allow the VWO server to bypass the X-frame header settings.

• If you have created a test for one device-type (for example, an iPhone or iPad) and you try to view the heatmap report on another device-type (say, desktop), VWO will use proxy settings to load view and the heatmap report may not load. Please contact VWO support at support@vwo.com for help on resolving such issues.

• Heatmap reports are generated for the default test URL. Please ensure that you use the exact URL for the heatmaps.

• Enable third-party cookies in your browser settings. When creating a test, VWO drops cookies from app.vwo.com to dev.visualwebsiteoptimizer.com(third-party). Since the cookies on your website are created from dev.visualwebsiteoptimizer.com, your website pages may fail to load if third-party cookies are disabled in the browser settings. Using the browser settings option, you can block third-party cookies but create an exception for these two domains. To know more about enabling and disabling the cookies from the browser settings, refer to Enable or disable third-party cookies.

• Try opening the heatmap after clearing the browser cache and cookies. While you do so, please download and enable the VWO plugin on your browser.

• Ensure that you have not installed Javascript blockers like uBlock ad-blocker with custom settings. If you have the uBlock plugin enabled on your browser, the VWO's network calls initiating via the server URL dev.visualweboptimizer.com will be blocked. As a result, the Visual Editor, Heatmaps, SmartCode Checker, and the Previews will not load. 

  To use all the above features, you must either disable the uBlock plugin or whitelist VWO tracking in uBlock, keeping the uBlock plugin enabled. Here’s how you can whitelist:

  1. 1. Click on the uBlock icon in your browser and open the dashboard by clicking on the Settings icon.
        
     2. Go to the My filters tab and add- @@||*.visualwebsiteoptimizer.com^.
     3. Once done, click Apply changes. Now everything should work fine.