Unusual DOM ID not working as string selector

Created on 31 December 2024, 21 days ago

Problem/Motivation

In /*! @drupal/once - v1.0.1 - 2021-06-12 */

The string selector `#a98f0826-a717-4967-8b1c-8528dcd41133`, though a valid DOM ID does not select the element. It returns this error:

Failed to execute 'querySelectorAll' on 'Document': '#6e90d4bb-dd91-4393-9247-1c1209cb2646' is not a valid selector.

Steps to reproduce

1. Create DOM element with ID a98f0826-a717-4967-8b1c-8528dcd4113
2. Try to select it using once('foo', '#a98f0826-a717-4967-8b1c-8528dcd4113')
3. Nothing selected

In contrast the following DOES work:

once('foo', document.getElementById('a98f0826-a717-4967-8b1c-8528dcd41133'));

Proposed resolution

Remaining tasks

User interface changes

API changes

Data model changes

🐛 Bug report

Status

Active

Component

Code

Created by

🇺🇸United States aklump

Live updates comments and jobs are added and updated live.

Comments & Activities

Issue created by @aklump
Comment 21 days ago →
🇫🇷France nod_ Lille
It used to be that an id must start with a letter. I see that the restriction is now lifted, short term you can pass the selector through CSS.escape() as in

const id = 'a98f0826-a717-4967-8b1c-8528dcd4113'; once('foo', `#${CSS.escape(id)}`);

contrib.social Blog FAQ Discussions

Production build 0.71.5 2024