Contrib.social

core/jquery.ui library does not exist in Drupal 10

Open on Drupal.org →
Created on 13 July 2023, 12 months ago
Updated 14 November 2023, 8 months ago

Problem/Motivation

The commit applied in 🐛 Overlay blocking image upload modal in Drupal 10.1 Fixed was not correct. The core/jquery.ui and associated libraries were deprecated → in Drupal 9.2 and were removed in Drupal 10.

It only works in many scenarios because of happy accidents:

1) Drupal allows a library dependency on a non-existent library to silently fail.
2) Core's copy of the jQuery UI assets is still around. These files are direct assets of certain drupal.* libraries that have still not been decoupled from jQuery UI in Drupal 10. drupal.dialog is the one place in core.libraries.yml that still includes the jQuery UI "Draggable" library.

Presumably, many of us are working on sites that just so happen to include elements attaching the drupal.dialog library on pages that use the media library widget. But this is not guaranteed and should not be counted on.

Steps to reproduce

  1. On a Drupal 10.1 site, install the latest Focal Point and configure the default form display for an image-based media type to use the focal point widget. Upload an image as this media type.
  2. Because drupal.dialog is a very common library to include, it might be hard to prevent the entire library from being attached for reproduction. I think it's easier to reproduce by removing just the draggable asset file from the drupal.dialog library. Add the following custom hook to an enabled module:
    function hook_library_info_alter(&$libraries, $extension) {
  if ($extension === 'core') {
  unset($libraries['drupal.dialog']['js']['assets/vendor/jquery.ui/ui/widgets/draggable-min.js']);
  }
}
  3. Go to edit the media image. Note the JavaScript console error "this.$indicator.draggable is not a function" and how the focal point indicator is not funtional.

Proposed resolution

In the short term, if Focal Point is going to work around this by depending on the drupal.dialog library, it should depend on the drupal.dialog library.

A true long term resolution still depends on a resolution in jquery_ui (or possibly in Core). The root problem is still that described in 🐛 Module defines jQuery UI files independently from Core. Can cause CSS priority issues in AJAX calls Needs review

🐛 Bug report
Status

Fixed

Version

2.0

Component

Other Code

Created by

🇺🇸United States bvoynick

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.69.0 2024