Troubleshooting: Unable to Preview Tests in VWO – VWO

close this to read article

Problem Statement

When I click the Preview Now button to check the live preview of my variation, the Preview Mode window that displays the preview does not appear.

Make sure that the VWO tracking code is correctly installed on the test page. The only scenario where the preview debugger does not appear is when the VWO tracking code could not be executed on the page. It could be possible that the tracking code is not present on the webpage or has some syntax errors due to which it does not gets executed successfully.
Clear the cache and all the cookies of the browser from Browser settings and then re-load the previews.
Ensure that you have enabled third-party cookies in your browser settings.
Try launching the preview in the incognito/private mode of the 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:

If the Default URL does not match with the URLs on which the test is running then the previews would not load.
If you want to run the test on different domains (either test URLs or goal URLs) and you have not enabled the Campaign involves multiple domains option in the settings. Please make sure cross-domain tracking is enabled as explained in the article.
If the test has any regular expression added either as a test URL or a goal URL, then make sure that it does not have any syntax error.
For example, a regex such as https://www.example.com/(page1.html|page2.html), you need to use escape characters and specify it as follows so that the previews work fine: http:\/\/www\.example\.com\/(page1\.html|page2\.html)

If the landing URL does not match with URLs included in VWO, then an error message will appear. If you are using a wildcard pattern or regular expression then make sure to include the URL for the preview. Also, check for HTTPS and HTTP within the URLs to ensure that the same protocol is mentioned in the VWO test as well as the landing URL.

When you apply a change in a webpage using the VWO editor, it saves the CSS selector path of the element on which the change is applied. VWO then tries to find the element on a live website with the same CSS selector path. Make sure that there are no changes from the backend in the source code of the page because of which VWO is not able to find the element with a specified CSS selector path.
Verify if the page is initialized with Dynamic IDs assigned to its elements within the source code. In the case of dynamic IDs, the CSS selector path saved by VWO may not be found on the test page as dynamic ID would have a new value. As a solution, use the Configuring Selector Path Options in Editor Settings for Your Website in VWO.
We do not recommend using multiple operations on the same element. Refer to the best practices for using the VWO editor before applying the changes.
If the element appears after VWO test settings are applied, especially in the case of AJAX content then change will not be applied. In such a case, we recommend you configure the SPA/SSR settings such that the element changes are applied whenever the element is loaded.