赛普拉斯：在获取文本框“帮助！”时遇到问题

如何解决赛普拉斯：在获取文本框“帮助！”时遇到问题

我正在尝试获取文本框，因此在代码中添加了data-cy属性：

<login.StyledInput
        // eslint-disable-next-line jsx-a11y/no-autofocus
          autoFocus={focus}
          type={type}
          value={value}
          disabled={disabled}
          onInput={onInput}
          onKeyUp={onKeyUp}
          data-cy={`${text}-textBox`.replace(/\s+/g,'-')}
        />

在DOM中，它看起来像这样：

这会在所有textBox中添加data-cy，我正在寻找的那个名为data-cy = Password-textBox，一开始，我使用它来获取它：

cy.get('[data-cy=Password-textBox]').eq(1);

我使用eq(1)是因为它是第二个属性为data-cy = Password-textBox的元素，但是它没有用，但是，我使用了下面的代码，它起作用了：

cy.get（'＃other-form-animator>：nth-​​child（4）> .rs-input-group> [data-cy = Password-textBox]'）;

问题是我的老板不允许我使用最后一个。

有人知道更好看的解决方案吗？为什么[data-cy=Password-textBox]不起作用？

解决方法

您正在尝试通过CSS选择器获取元素。该选择器是一个字符串，用于获取属性-您应该使用double quotation marks作为属性，该属性是字符串中的字符串。您可以将其从检查菜单中的元素直接粘贴到此cy.get中。

cy.get('[data-cy="Password-textbox"]').eq(1);