:has(> child) is not supported
c-harding opened this issue · comments
:has()
expressions do not work with a leading >
. This is included as the first example is the linked docs for :has
from the readme (https://drafts.csswg.org/selectors-4/Overview.bs#relational).
I am trying to match the following code, specifically any call to router.push(router.resolve(...))
.
function onClick() {
return router.push(
router.resolve({
name: "page1",
})
);
}
This means that I need to check both descent paths of the CallExpression. I would like to match the call expression containing both of these children:
CallExpression > MemberExpression.callee[object.name=router][property.name=push]
and CallExpression > CallExpression.arguments > MemberExpression.callee[object.name=router][property.name=resolve]
Ideally this could be achieved by
CallExpression:has(
> MemberExpression.callee[object.name=router][property.name=push]
):has(
> CallExpression.arguments > MemberExpression.callee[object.name=router][property.name=resolve]
)
If the leading >
inside the :has()
are omitted, this selector is too broad, also matching for example router.push(otherFunction(router.resolve({}))
.
+1 for this — having a direct child combinator would allow for both reducing the scope, and improving the selector's performance, as quite often you'd want to check just the immediate child, without checking anything deeper.
I am trying to match a function with specific name:
function shouldNotMatch() {
function shouldMatch() {
}
}
Without a direct child modifier working properly the outer function will match because it contains identifier with a specific name. Whereas it should not match, because this identifier belongs to the descendant.
Is there any work around for this?
@jggsus88 On the right, under "Development", it lists associated PRs.