jQuery & AMD: timing issue with noConflict()

require.js (and almond.js) use a 4ms setTimeout between when a module's define() callback is called and when the 'main' module's require() callback is called.

jQuery's behavior is to create global objects and let you destroy them later with jQuery.noConflict(true), even when in AMD mode.

When these two behaviors combine, the AMD-loaded copy of jQuery becomes the global one for a few milliseconds, even if jQuery.noConflict(true) is called as soon as possible.

This is particularly an issue when there is alread a global copy of jQuery and a plugin is loaded for use with that global copy. If the plugin loads during that 4ms, it attaches itself to the wrong copy of jQuery.

This page attempts to reproduce the issue by:

• Loading a normal (global) copy of jQuery
• Loading a "third-party widget" js file that includes:
  • requirejs,
  • jQuery,
  • And a main.js file that looks like this:

    require(["jquery"], function($) {
    	$.noConflict(true);
    	// do stuff
    });
    

  • The widget was built with this command: r.js -o baseUrl=. paths.requireLib=require name=main include=requireLib out=build/widget.js optimize=none
• Loading a jQuery plugin that attaches itself to the global copy of jQuery
• Waiting a second
• Checking if the plugin is now defined on the global copy of jQuery.

Results: Loading...

Alternate options: Load with a patched copy of jQuery in the widget | Load without the widget | Reset