Checking for JavaScript Errors

Overview

Checking for JavaScript (JS) errors requires use of the browser inspection tools 'Console' tab. This article describes the type of JS errors to look for, and how to determine their source. Please follow the guidance on how to prepare your support request so that we can serve you quickly and effectively.

Article Contents


Open Your Browser Inspection Tools

Popup Maker relies heavily on Javascript to both edit and show popups. If you have trouble doing either, this article will help you track down the error causing the issue. Begin the process by opening your browser web inspection and development (dev) tools.  See the related article below for guidance on how to do this. 

Related article:  How to Open Browser Inspection Tools on Your Site

Once the inspection tools are open, select the Console tab.  

Most browser makers offer guidance on how to open and use their development tools and Console. 
Browser  Documentation Guide
Chrome Get Started With The Console
Firefox Opening the Web Console
Edge Microsoft Edge Developer Tools
Internet Explorer Navigating the F12 Developer Tools Interface

[ Back to top]

Check for JavaScript Errors in the Console

Refresh the page where you expect your popup to load.  Red text in the Console box indicates some type of JavaScript error. 
Many types of JS errors may occur, but only one type is relevant here. They usually look something like the screenshot shown below. Ignore the text, and focus instead on the error format.

Look for the following elements within the error shown.

  • A red (x) icon (located to the left of the error message);
  • file:line information (located in line with the message on the right side of the box); and
  • A little black arrow  between the ‘X’ and the message (see below). When clicked, the arrow points down and shows additional details about the error.

Always click the black arrow to get the full details about the error.

[ Back to top]

Assess the Errors

  1. Find the full path to the file where the error occurred. Hover over the file name associated with the error message to display the full path to that error.
  2. File paths of interest include the /wp-content/ directory. The paths may refer either to the Popup Maker plugin, another plugin, or the active theme used on the site.  Look at the files named from top to bottom for relevant paths like:
      1. /plugins/popup-maker/, 
      2. /uploads/pum/
      3. /plugins/{name-of-active-plugin}/
      4. /themes/{name-of-active-theme}/
  3. Ignore file paths from the /wp-includes/ directory, including files named ‘jquery’, or ‘jquery-ui’.

[ Back to top]


The Next Steps Depend on the Errors Observed

a)  Errors Do Not Refer to Popup Maker

If the file name in the error message refers to an active theme or a plugin file other than Popup Maker, contact the support team for that product.  See the section What to Include in Your Support Request for guidance when contacting the other plugin or theme support team.

b) Errors Refer to Another Plugin or Theme AND Popup Maker

If the call stack under the error message refers early on to another plugin or theme AND PUM, there may be a conflict between the two products. [ The 'call stack' refers to the name and order of the functions that fire up to the occurrence of the error. ] 
Sometimes plugin or theme developers change a variable or function within their code that causes Popup Maker to generate an error.  The problem may appear to be with Popup Maker. However, the actual root cause may be due to the performance of the other product (plugin or theme).  
It’s important to identify where the other product generates an error with Popup Maker in the call stack (for example, the file name and line number within the code).  Please contact the support team for the other product for assistance in fixing their code. 
In some cases, it may be necessary to work with both sets of developers (the other plugin or theme AND Popup Maker) to resolve the problem. See the section What to Include in Your Support Request for guidance when contacting the other plugin or theme support team.
As an example, the error message in the Console refers to a file that includes the path: 
’/uploads/pum/pum-site-scripts.js’. 
The call stack that leads to the error includes the path: 
‘/wp-content/themes/{name-of-active-theme}/main.js’.
This suggests a possible conflict between the code in the ‘main.js’ file of the site theme and Popup Maker. 

c) Errors Refer Only to Popup Maker

If the error message, file path, or error call stack refers only to Popup Maker ( plugin files only, or the path to the /uploads/pum/ directory ), this indicates that an error occurred solely in the Popup Maker JS. 

[ Back to top]


Console Error Message: ’Trigger or Function Does Not Exist'

A Console error message that refers to:  
'trigger or function does not exist'  
means that more than one copy of the jQuery JavaScript library is loaded on the site. 
By default, WordPress includes a copy of jQuery (currently version 1.12.4). Some themes or plugins install jQuery on a site in addition to the version loaded by WordPress.  Popup Maker relies on the native version of jQuery installed with WordPress to run it's scripts. 
Properly loading only one copy of jQuery will likely fix the issue. This may involve temporary deactivation of the plugin or theme that loads the second copy of jQuery. 
If the plugin or theme is essential to the operation of the site, we recommend you contact the plugin or theme developer for assistance to disable the second version of jQuery.
See the related article below for help to assess a potential plugin or theme conflict with Popup Maker.

[ Back to top]


What to Include in Your Support Request 

Please contact us for assistance either via our  secure support forum or the community plugin support forum at WordPress.org. We prefer that you not use the Facebook Group or GitHub issues tracker to request assistance with JS related issues.

Please follow the outline below to include as much detailed information as possible in your support request. The more precise information provided, the faster we can assist you to resolve the problem. 

  • Screenshot of the error with full details (click the black triangle to open the error message and display the error call stack).
  • Where does the issue occur? 
    • Front End (front of website)
      • Provide a link to the page with the error;
      • Describe the steps required to produce the error; and 
      • Provide a screenshot of any popup settings that seem relevant to the problem.  Include any error information displayed on the screen. 
    • Admin (back of website)
      • What interface are you having trouble with ( Popup Editor, Popup Maker Settings, etc. ); 
      • Provide a screenshot of what you see in the Admin. Include any error information displayed on the screen.
      • Describe what you’ve done so far to resolve the issue. What was the result?
      • Did your problem-solving include deactivation of other plugins and switching to the default theme?  See: Test if a Plugin or Theme Interferes with Popup Maker.
  • What have you tried to resolve the issue?
    • Describe the steps taken thus far to resolve the issue. What was the result?
    • Did the problem resolve when other plugins were deactivated and the site theme is changed to a default WordPress theme?  See: Test if a Plugin or Theme Interferes with Popup Maker.
    • If testing identifies a possible conflict with Popup Maker, what plugin or theme produces the error when active?

[ Back to top]

Temporary Site Admin Credentials

While not always necessary, sometimes login as an Admin user is useful to diagnose a problem. Please let us know whether you are willing and able to grant us temporary admin login credentials if requested. This can sometimes speed up the debugging process. Only our lead developers will log in to troubleshoot the issues you report.

[ Back to top]