Issue #3464340 by herved, ahsannazir, smustgrave, longwave, nod_: JS errors...

Issue #3464340 by herved, ahsannazir, smustgrave, longwave, nod_: JS errors from Drupal.behaviors.activeLinks (... is not a valid selector)

core/misc/active-link.js

@@ -23,11 +23,11 @@
       // Start by finding all potentially active links.
       const path = drupalSettings.path;
       const queryString = JSON.stringify(path.currentQuery);
-      const querySelector = path.currentQuery
-        ? `[data-drupal-link-query='${queryString}']`
+      const querySelector = queryString
+        ? `[data-drupal-link-query="${CSS.escape(queryString)}"]`
         : ':not([data-drupal-link-query])';
       const originalSelectors = [
-        `[data-drupal-link-system-path="${path.currentPath}"]`,
+        `[data-drupal-link-system-path="${CSS.escape(path.currentPath)}"]`,
       ];
       let selectors;
 

core/modules/system/tests/src/FunctionalJavascript/ActiveLinkTest.php

+<?php
+
+declare(strict_types=1);
+
+namespace Drupal\Tests\system\FunctionalJavascript;
+
+use Drupal\FunctionalJavascriptTests\WebDriverTestBase;
+
+/**
+ * Tests active link JS behavior.
+ *
+ * @see Drupal.behaviors.activeLinks
+ *
+ * @group system
+ */
+class ActiveLinkTest extends WebDriverTestBase {
+
+  /**
+   * {@inheritdoc}
+   */
+  protected $defaultTheme = 'stark';
+
+  /**
+   * Ensures no JS error is thrown with query strings containing special chars.
+   */
+  public function testQueryStringQuotes(): void {
+    $user = $this->createUser();
+    $this->drupalLogin($user);
+    $this->drupalGet($this->getSession()->getCurrentUrl(), ['query' => ['foo' => "\"'[](){}*+~>|\\/:;,.!@#$%^&-_=?<>"]]);
+    $this->failOnJavaScriptErrors();
+  }
+
+}