相关疑难解决方法(0)

我正在使用反应测试库和笑话来测试我的反应应用程序。

我想知道如何在react-testing-library中获取具有“name”属性的元素。

例如，在下面的页面中，是否可以通过“userName”获取此元素？

<input type="text" name="userName" />

或者我应该设置data-testId到元素并使用getByTestId方法？

return (
  <div>
    <input type="text" name="userName" />
  </div>
)

自从使用 @testing-library 进行反应以来，我对这个name属性感到困惑。可以获取渲染按钮的引用，例如：

// <button>Button text</button>
screen.getbyRole("button", {name: /button text/gi})

在这种情况下，名称指的是textNode按钮的内部。围绕输入的故事类似，name可以指的是id或name文本内容。

我目前正在尝试获取像这样呈现的按钮的引用：

<button
  aria-label="Close"
  class="css-1dliicy"
  type="button"
  >
  Create new
  <svg>...</svg>
</button>

并且通过查询找不到该按钮：

const createNewButton = screen.getByRole('button', {
    name: /Create new/gi,
});

我显然似乎不知道该name属性的含义，但我似乎找不到有关它的文档。