JavaScript error on all Chosen instances

Created on 26 February 2025, 3 months ago

Problem/Motivation

On all fields that have the "Chosen" widget applied, we encounter the JS error:
Uncaught DOMException: Document.querySelectorAll: '' is not a valid selector

This is stemming from the js/chosen.js file from this module, line 191

Steps to reproduce

  1. Drupal Core 10.4.3
  2. Upgrade to Chosen 5.0
  3. Ensure noli42/chosen library is being used (in our case, using Composer merge plugin)
  4. Visit any entity form (Node, Paragraphs, Media) that has the "Chosen" field widget applied. Notice the error and Chosen functionality is not applied
πŸ› Bug report
Status

Active

Version

5.0

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States Nuuou Lincoln, NE

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

Comments & Activities

  • Issue created by @Nuuou
  • πŸ‡­πŸ‡ΊHungary nagy.balint

    Thanks for the report.

    Is it possible for you to provide the value of the "Apply Chosen to the following elements" in admin/config/user-interface/chosen ?

    It would not work when that field is empty, but not sure if there are other edge cases.

  • πŸ‡ΊπŸ‡ΈUnited States Nuuou Lincoln, NE

    Ah! That field is indeed empty (and was with my 4.x usage too).
    I see that the default configuration (config/install/chosen.settings.yml) is meant to be the value 'select:visible'.

    Setting that value back to the module's default, everything now works for me!

    I'm curious why my empty selector ever worked in 4.x, so I assume something changed in that during the 5.x release.

    Regardless, I think this can be closed unless anyone sees anything actionable for future updaters!

  • πŸ‡ΊπŸ‡ΈUnited States Nuuou Lincoln, NE
  • πŸ‡­πŸ‡ΊHungary nagy.balint

    Maybe if you have the chosen_field module enabled, that could apply it, if the widget is specifically selected for the field.

    Just in case we could still fix of course to continue to work for empty value in "Apply Chosen to the following elements", likely I could just check if the selector is empty, and skip that part of the code, but then it is likely not very urgent.

  • πŸ‡ΊπŸ‡ΈUnited States Nuuou Lincoln, NE

    Yep, I do have "chosen_field" module enabled and the "Chosen" widget selected for my field. Honestly I expected that to just handle it since it was an explicit widget choice!

    I do think that improving this so it doesn't throw console errors for an empty selector would be a good idea!

  • πŸ‡­πŸ‡ΊHungary nagy.balint

    I committed a fix for the empty selector.

  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.71.5 2024