bug #2663 [Autocomplete] Escape querySelector option value (Bartheyrman22)

This PR was merged into the 2.x branch.

Discussion
----------

[Autocomplete] Escape querySelector option value

Properly escape the querySelector for option-values like "["Test"]"/
This to mitigate:
```
SyntaxError: Element.querySelector: ':scope > option[value="["foo"]"]' is not a valid selector
```

| Q             | A
| ------------- | ---
| Bug fix?      | yes
| New feature?  |no
| Issues        |
| License       | MIT

Some remark where I don't have a solution for:
The issue is only reproduceable on Chrome.
In Firefox, the code in the controller.js is not executed properly. So the error get's never triggered.
But no side effects detected so far.

Commits
-------

c330c1d [Autocomplete] Escape `querySelector` dynamic selector with `CSS.escape()`

Author: Kocal

src/Autocomplete/CHANGELOG.md

@@ -1,5 +1,9 @@
 # CHANGELOG
 
+## 2.25.0
+
+-   Escape `querySelector` dynamic selector with `CSS.escape()` #2663
+
 ## 2.23.0
 
 -   Deprecate `ExtraLazyChoiceLoader` in favor of `Symfony\Component\Form\ChoiceList\Loader\LazyChoiceLoader`

src/Autocomplete/assets/dist/controller.js

@@ -270,7 +270,7 @@ _default_1_instances = new WeakSet(), _default_1_getCommonConfig = function _def
             let orderedOption = null;
             for (const [, tomSelectOption] of Object.entries(this.tomSelect.options)) {
                 if (tomSelectOption.$order === optionOrder) {
-                    orderedOption = parentElement.querySelector(`:scope > option[value="${tomSelectOption[this.tomSelect.settings.valueField]}"]`);
+                    orderedOption = parentElement.querySelector(`:scope > option[value="${CSS.escape(tomSelectOption[this.tomSelect.settings.valueField])}"]`);
                     break;
                 }
             }

src/Autocomplete/assets/src/controller.ts

@@ -192,7 +192,7 @@ export default class extends Controller {
                 for (const [, tomSelectOption] of Object.entries(this.tomSelect.options)) {
                     if (tomSelectOption.$order === optionOrder) {
                         orderedOption = parentElement.querySelector(
-                            `:scope > option[value="${tomSelectOption[this.tomSelect.settings.valueField]}"]`
+                            `:scope > option[value="${CSS.escape(tomSelectOption[this.tomSelect.settings.valueField])}"]`
                         );
 
                         break;