diff --git a/packages/happy-dom/src/nodes/basic/element/Element.ts b/packages/happy-dom/src/nodes/basic/element/Element.ts index 6f143c9ef..e22807c53 100644 --- a/packages/happy-dom/src/nodes/basic/element/Element.ts +++ b/packages/happy-dom/src/nodes/basic/element/Element.ts @@ -5,6 +5,7 @@ import DOMRect from './DOMRect'; import Range from './Range'; import ClassList from './ClassList'; import QuerySelector from '../../../query-selector/QuerySelector'; +import SelectorItem from '../../../query-selector/SelectorItem'; import MutationRecord from '../../../mutation-observer/MutationRecord'; import MutationTypeConstant from '../../../mutation-observer/MutationType'; import NamespaceURI from '../../../html-config/NamespaceURI'; @@ -558,6 +559,16 @@ export default class Element extends Node implements IElement { return new Range(); } + /** + * The matches() method checks to see if the Element would be selected by the provided selectorString. + * + * @param selector Selector. + * @returns "true" if matching. + */ + public matches(selector: string): boolean { + return new SelectorItem(selector).match(this); + } + /** * Query CSS selector to find matching nodes. * diff --git a/packages/happy-dom/src/nodes/basic/element/IElement.ts b/packages/happy-dom/src/nodes/basic/element/IElement.ts index 4245e12c2..e36971fe6 100644 --- a/packages/happy-dom/src/nodes/basic/element/IElement.ts +++ b/packages/happy-dom/src/nodes/basic/element/IElement.ts @@ -132,6 +132,14 @@ export default interface IElement extends IChildNode, INonDocumentTypeChildNode, */ createTextRange(): Range; + /** + * The matches() method checks to see if the Element would be selected by the provided selectorString. + * + * @param selector Selector. + * @returns "true" if matching. + */ + matches(selector: string): boolean; + /** * Returns an elements by tag name. * diff --git a/packages/happy-dom/test/nodes/basic/element/Element.test.ts b/packages/happy-dom/test/nodes/basic/element/Element.test.ts index 33bc80493..8e822d983 100644 --- a/packages/happy-dom/test/nodes/basic/element/Element.test.ts +++ b/packages/happy-dom/test/nodes/basic/element/Element.test.ts @@ -290,6 +290,16 @@ describe('Element', () => { }); }); + describe('matches()', () => { + test('Checks if the element matches a selector string.', () => { + const element = document.createElement('div'); + + element.className = 'container active'; + + expect(element.matches('.container.active')).toBe(true); + }); + }); + describe('querySelectorAll()', () => { test('Query CSS selector to find matching elements.', () => { const element = document.createElement('div');