SyntaxError: Failed to execute 'querySelector' on 'Element': '#div-2.1' is not a valid selector

Created by: larseggert

Prerequisites

• I have searched for duplicate or closed issues
• I have validated any HTML to avoid common problems
• I have read the contributing guidelines

Describe the issue

#35566 didn't fix things for all weird IDs. The test case addition below causes the error in the issue title.

Reduced test cases

diff --git a/js/tests/unit/scrollspy.spec.js b/js/tests/unit/scrollspy.spec.js
index c7951e6..704b52a 100644
--- a/js/tests/unit/scrollspy.spec.js
+++ b/js/tests/unit/scrollspy.spec.js
@@ -341,11 +341,13 @@ describe('ScrollSpy', () => {
           '  <ul class="nav">',
           '    <li class="nav-item"><a class="nav-link" id="a-1" href="#div-1">div 1</a></li>',
           '    <li class="nav-item"><a class="nav-link" id="a-2" href="#div-2">div 2</a></li>',
+          '    <li class="nav-item"><a class="nav-link" id="a-2.1" href="#div-2.1">div 2</a></li>',
           '  </ul>',
           '</nav>',
           '<div class="content" style="overflow: auto; height: 50px">',
           '  <div id="div-1" style="height: 100px; padding: 0; margin: 0">div 1</div>',
           '  <div id="div-2" style="height: 200px; padding: 0; margin: 0">div 2</div>',
+          '  <div id="div-2.1" style="height: 200px; padding: 0; margin: 0">div 2.1</div>',
           '</div>'
         ].join('')

What operating system(s) are you seeing the problem on?

macOS

What browser(s) are you seeing the problem on?

Firefox

What version of Bootstrap are you using?

v5.2.3