Opened 9 years ago
Closed 4 years ago
#36774 closed enhancement (wontfix)
Wrong JQuery UI AMD support
Reported by: |
|
Owned by: | |
---|---|---|---|
Milestone: | Priority: | normal | |
Severity: | normal | Version: | |
Component: | External Libraries | Keywords: | |
Focuses: | Cc: |
Description
After integration of Reuire.js into theme, i found some interested problem. When system include JQuery UI scripts with Require.js support, i catch the error for not existed modules.
Looks in the /wp-includes/js/jquery/ui/ directory i found some files with AMD loading support, but with wrong module names in depending modules.
For example file wp-includes/js/jquery/ui/accordion.min.js contain this substring
define(["jquery","./core","./widget"],a)
but Require.js can't find core or wodget modules. It happen, because by default this modules in wordpress area have names likes "jquery-ui-core" and "jquery-ui-widget"
Please, change all lines in JS files to correct module names, like
define(["jquery","jquery-ui-core","jquery-ui-widget"],a)
Change History (7)
#2
@
9 years ago
I catched this problem, when i tryed integrate Visual Composer plugin into my own theme with RequireJS. It means, whn i try open Frontend Editor from VC plugin, it trying load UI plugins from existing theme. My code catch all wp_enque_script calls and generate RequireJS config for loading javascript files.
<?php /** * That class provide functional for difficult theme settings */ class ThemeSettings { /** * Instance of current class * @var \ThemeSettings */ protected static $_instance; /** * Containd describe for RequireJS configuration * @var array[] */ protected $_scripts = array(); /** * Disallow native creation of object */ protected function __construct() {} /** * Generate and return instance of current class * @return \ThemeSettings */ public static function getInstance() { if (empty(self::$_instance)) { self::$_instance = new ThemeSettings(); } return self::$_instance; } /** * Add describe of javascript to RequireJS config * @param string $handle * @param string[] $script */ public function addScript($handle, $script) { $this->_scripts[$handle] = $script; } /** * Generate config for RequireJS loader * @return stdClass */ public function getRequirejsConfig() { $config = (object) array('waitSeconds' => 30,'paths' => (object) array(), 'shim' => (object) array()); foreach ($this->_scripts as $handle => $script) { $config->paths->{$handle} = $script->src; if (!empty($script->deps)) { $config->shim->{$handle} = $script->deps; } switch($handle) { case 'admin-bar': $config->shim->{$handle} = array('jquery'); break; } } return $config; } /** * Get all JS scripts description * @return type */ function getScripts() { return $this->_scripts; } } /* Delayed loading of all JS files */ add_filter('script_loader_tag', function($tag, $handle, $src) { if (isAdmin()) return $tag; global $wp_scripts; ThemeSettings::getInstance()->addScript($handle, (object)array( 'deps' => $wp_scripts->query($handle, 'registered')->deps, 'src' => $src, 'tag' => $tag )); return ''; }, 10, 3);
But when i catch standart the JQuery UI scripts, it try load modules with RequireJS supports and can't find these modules.
I propose to you recompile JQuery UI files with naming modules like it named in WordPress.
#3
@
9 years ago
- Milestone Awaiting Review deleted
- Resolution set to wontfix
- Status changed from new to closed
- Version 4.5.1 deleted
Core doesn't officially support RequireJS. I suggest to have a simple array in your class which maps a jQuery handle to its corresponding file.
#4
@
9 years ago
Please, be careful. Problem not in correct loadin of files. Problem in contain of wordpress javascript file in /wp-include/ directory. When RequireJS try load javascript file, and in that javascript file we have defined "define" function it will be executed. But your javascript file contain wrong paths to modules.
#6
@
9 years ago
- Component changed from General to External Libraries
- Milestone set to Awaiting Review
#7
@
4 years ago
- Resolution set to wontfix
- Status changed from reopened to closed
Sorry that this one fell through the cracks, @andrei-kazakou.
Looking over this again, though, I am still unable to identify an issue in WordPress Core. This is likely an issue with the implementation, or how Visual Composer is loading scripts.
I'm going to close this out again, but if you are still experiencing this issue, please do reopen with the exact code that can be used to reliably reproduce.
Hey there, welcome to trac and thanks for creating a ticket!
These minified JavaScript files are generated during build from the source files, which already include these lines (
define(["jquery","./core","./widget"]…)
). The source files are the ones you could download on the jQuery UI website. We usually try to avoid editing third-party files.jquery-ui-widget
is only the name of the handle needed forwp_enqueue_script()
. How would this affect RequireJS? Would you mind sharing some example code to highlight the problem?