Merge pull request #997 from capricorn86/task/632-queryselector-not-w…

…ork-for-attr-whose-value-contains-colon #632@patch: Adds support for using an escape character in attribute q…
capricorn86 · Jul 19, 2023 · e9038c7 · e9038c7
2 parents b928ce0 + 406b13b
commit e9038c7
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 5 deletions.
diff --git a/packages/happy-dom/src/query-selector/SelectorParser.ts b/packages/happy-dom/src/query-selector/SelectorParser.ts
@@ -30,7 +30,7 @@ const SELECTOR_REGEXP =
 /**
  * Escaped Character RegExp.
  */
-const CLASS_ESCAPED_CHARACTER_REGEXP = /\\/g;
+const ESCAPED_CHARACTER_REGEXP = /\\/g;
 
 /**
  * Nth Function.
@@ -110,10 +110,10 @@ export default class SelectorParser {
 				} else if (match[2]) {
 					currentSelectorItem.tagName = match[2].toUpperCase();
 				} else if (match[3]) {
-					currentSelectorItem.id = match[3].replace(CLASS_ESCAPED_CHARACTER_REGEXP, '');
+					currentSelectorItem.id = match[3].replace(ESCAPED_CHARACTER_REGEXP, '');
 				} else if (match[4]) {
 					currentSelectorItem.classNames = currentSelectorItem.classNames || [];
-					currentSelectorItem.classNames.push(match[4].replace(CLASS_ESCAPED_CHARACTER_REGEXP, ''));
+					currentSelectorItem.classNames.push(match[4].replace(ESCAPED_CHARACTER_REGEXP, ''));
 				} else if (match[5]) {
 					currentSelectorItem.attributes = currentSelectorItem.attributes || [];
 					currentSelectorItem.attributes.push({
@@ -128,7 +128,7 @@ export default class SelectorParser {
 					currentSelectorItem.attributes.push({
 						name: match[6].toLowerCase(),
 						operator: match[7] || null,
-						value: match[8],
+						value: match[8].replace(ESCAPED_CHARACTER_REGEXP, ''),
 						modifier: match[9] || null,
 						regExp: this.getAttributeRegExp({
 							operator: match[7],
@@ -141,7 +141,7 @@ export default class SelectorParser {
 					currentSelectorItem.attributes.push({
 						name: match[10].toLowerCase(),
 						operator: match[11] || null,
-						value: match[12],
+						value: match[12].replace(ESCAPED_CHARACTER_REGEXP, ''),
 						modifier: null,
 						regExp: this.getAttributeRegExp({ operator: match[11], value: match[12] })
 					});

diff --git a/packages/happy-dom/test/query-selector/QuerySelector.test.ts b/packages/happy-dom/test/query-selector/QuerySelector.test.ts
@@ -1117,5 +1117,14 @@ describe('QuerySelector', () => {
 			expect(div.querySelector('::-webkit-inner-spin-button')).toBeNull();
 			expect(document.querySelector('::-webkit-inner-spin-button')).toBeNull();
 		});
+
+		it('Has support for attributes containing colon', () => {
+			const div = document.createElement('div');
+			div.innerHTML = '<meta ab="a:b"></meta>';
+			const element = div.querySelector('[ab="a\\:b"]');
+			const element2 = div.querySelector('[ab="a:b"]');
+			expect(element === div.children[0]).toBe(true);
+			expect(element2 === div.children[0]).toBe(true);
+		});
 	});
 });