WFFM and Long history of javascript issues

Posted on

If you have ever used WFFM on your page, you know that it has its own set of scripts. The way these script injected to the page has evolved which confuses a lot of front-end developer whether they are upgrading their instance or developing new pages. In this article we are going to take a look at the journey WFFM went through (scripts only) Since Sitecore 7.2 to the latest release 8.2 and also discuss the common bugs faced with each version. The focus is on MVC pages which are widely used and has more known issues.

WFFM v2.4 rev.151103 and Sitecore 7.1 – 7.2

This version assembles RequireJS. The implementation is quite buggy and troublesome. Below are is some of the known bugs of this version.

Bug ID = #80478

Description: WFFM does not work with other JavaScript libraries which use define() function. Some JS libraries that use this function are Slick.js, jquery.cookie.js, and bodyBottom.min.js. error message is something like “Error: Mismatched anonymous define() module:”

This error can also cause misbehavior in page/experience editor. After adding a MVC form, page/experience editor will stop working.

Workaround : request Sitecore for a patch.

Resolution: Fixed in WFFM 8.1 Update 2

fixes include a number of JavaScript errors that appeared in multiple internet browsers and also a number of JS files that have been reviewed to ensure consistency. (80478, 78916, 82721, 85115, 83997)


Bug ID = (unknown)

Description: RequireJS is attached to global scope and does not let you add your own scripts to the page using this library.

Workaround: https://community.sitecore.net/developers/f/10/t/2050

WFFM 8.0 rev. 141217 (Update-1)

Since this release, requiredJS has been excluded from the module.

 
window.$scw = jQuery.noConflict(true);  

line is added to ~\Website\Views\Form\Index.cshtml so there should be no more conflict issue with your website jQuery

WFFM 8.1 rev. 151008 (initial release)

RequireJS is now back again without much improvement from the previous implementation in WFFM v2.4

In this version again there is no sign of jQuery.noConflict in WFFM implementation. So there should be conflict issue with your site specific jQuery library.

 

WFFM 8.1 rev. 160523 (Update 3)

Appearance of the following setting. This setting determins if bootstrap.min.css should be added to WFFM form rendering or not.

<setting name=”WFM.EnableBootstrapCssRendering” value=”false” />

$.noConflict(); is added to main.js file so there should be no issues with having two jQuery on a page.

 

There have not been much changes related to Javascripts in WFFM since 8.1 Update 3 release


Leave a Reply

Your email address will not be published. Required fields are marked *