Tweeter 与自动化代码不同的 Twitter 组件中的 data-testid 是啥？ [复制]

Posted 2023-03-28

【中文标题】Tweeter 与自动化代码不同的 Twitter 组件中的 data-testid 是啥？ [复制]

【英文标题】：What is data-testid in twitter components for Tweeter Unlike Automation Code? [duplicate]Tweeter 与自动化代码不同的 Twitter 组件中的 data-testid 是什么？ [复制]

【发布时间】：2021-03-03 00:51:53

【问题描述】：

我想与 Twitter 上所有喜欢的推文不同。因为 react 是使用高音扬声器开发的，所以我想用代码来做这件事。我在 Github 中找到了我们应该在开发者控制台上运行的心爱的代码。

setInterval(() => 
  for (const d of document.querySelectorAll('div[data-testid="unlike"]')) 
    d.click()
  
  window.scrollTo(0, document.body.scrollHeight)
, 1000)

所以这段代码将每 1000 毫秒运行一次，我将自行滚动。但是我想知道这里使用data-tested为什么他没有使用普通的class或id来选择tweet like按钮？ data-testid 和 id 有什么区别？

这是与组件不同的推文图像

【问题讨论】：

它们只是两个不同的属性，<div id="hello" data-testid="world">...</div>。 ids 必须是唯一的页面才能有效，并且可以通过特定的选择器语法#hello 进行选择。测试 ID 可以重复并如图所示使用通用属性选择器语法进行选择。

【参考方案1】：

data-testId 属性应该用作测试代码的句柄。它是一个标记，表示“不要更改此类，因为测试依赖它”。

如果这不是上面的测试代码，那么它可能是草率的编程实践，即一个错误。在实际运行的代码imo中不应使用TestId。