amilajack / amilajack/eslint-plugin-compat

ESlint-plugin-compat doesn't seem to be able to accurately flag errors for methods on HTMLElements

未关闭
#651 1 条评论 2 个 reaction 已指派 0 人 在 GitHub 查看
主要语言
TypeScript
星标
3.2k
派生
115
PR 合并指标
30 天内没有已合并 PR

描述

It seems at the very least the plugin has trouble detecting callExpressions on HTMLElements.

```js
/* This errors as expected with:
HTMLElement.attachInternals() is not supported in iOS Safari 15.6-15.8eslint[compat/compat](https://github.com/amilajack/eslint-plugin-compat/blob/master/docs/rules/compat.md)
*/

globalThis.HTMLElement.attachInternals();

/* None of these cases error despite clearly either:
* a) extending the `HTMLElement` object interface or
* b) straight up being an instance of HTMLElement
*/
const x = globalThis.HTMLElement;
new x().attachInternals();

const foo = document.createElement('custom-element');
foo.attachInternals();

class y extends HTMLElement {
constructor () {
this.attachInternals();
}
}

new y().attachInternals();
```
Looking through the source code, it seems like the algorithm we're using to match for failing rules in [lintMemberExpression](https://github.com/amilajack/eslint-plugin-compat/blob/506819bd19cbfee558abc5a6edbd57064a620037/src/helpers.ts#L135C17-L135C37) isn't able to match failingRules on these cases.

```js
const foo = document.createElement('custom-element');
foo.attachInternals();
```
The expected rule.object here is HTMLElement, rule.property `attachInternals()`
The evaluated node object name is `foo`, node property `attachInternals()`
This fails the failingRule check on [line 170](https://github.com/amilajack/eslint-plugin-compat/blob/506819bd19cbfee558abc5a6edbd57064a620037/src/helpers.ts#L170)

```js
class y extends HTMLElement {
constructor () {
this.attachInternals();
}
}
```
The expected `protochainId` here is `HTMLElement.attachInternals()` the evaluated protochainId is `attachInternals()`
It seems we're unable to evaluate / not evaluating the superclass of the `ClassDeclaration` represented by the `ThisExpression`. This fails the failingRule check on [line 156](https://github.com/amilajack/eslint-plugin-compat/blob/506819bd19cbfee558abc5a6edbd57064a620037/src/helpers.ts#L156)

Notably I get the same issue with other callexpressions on HTMLElement such as [hidePopover](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/hidePopover) and [showPopover](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/showPopover)

Though given the above examples I've given, this may be a larger problem with matching failing rules on memberExpressions.

I've created a minimal reproduction case [here](https://github.com/gwyneplaine/eslint-plugin-compat-bug-repro).
This leverages the latest version of this package with `eslint@8.57.1`, notably the same issue occurs with `eslint@9.23.0`

贡献指南

打开贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。