Ant-design: 向表单相关组件添加ID(日期输入字段,单选按钮和复选框,下拉列表等)

创建于 2017-11-24  ·  7评论  ·  资料来源: ant-design/ant-design

此功能可以解决什么问题?

使用Selinium和xPath可以轻松进行端到端测试

建议的API是什么样的?

例如这样的代码:

<DatePicker id='datepicker' />应该在编译后的代码中给出如下内容:

...
<div class="ant-calendar-date-input-wrap">
       <input class="ant-calendar-input " value="" placeholder="Select date"  id="datepicker">
</div>
...

非常感谢您所做的出色工作!

Inactive help wanted

最有用的评论

出于可访问性原因,向输入字段(甚至在DatePicker类的内部组件)中添加id很重要。 我想将htmlFor到关联的标签,并在单击标签时将输入字段聚焦。

所有7条评论

添加ID不适用于所有组件。 假设Select组件是最简单的Select组件,它不呈现输入,您不能为输入分配值来更改Select的值。

@yesmeck感谢您向我提供有关此问题的更多信息,因此您是否还有其他解决方法? 您是否知道其他任何适用于端到端测试的工具? 这可以在antd @ 3上使用吗? 如果没有,至少我们将能够读取预填充的值。

将id添加到DatePicker输入中将不起作用。 我要填充DatePicker ,需要模拟用户行为:

  1. 找到“ .ant-calendar-picker”并模拟点击;
  2. 找到“ .ant-calendar-input”并填充其值;
  3. 模拟单击正文以关闭日期选择器面板。

据我所知,当前无法通过类'.ant-calendar-input'将任何类型的id传递到输入字段。
我将研究rc-calendar模块。

出于可访问性原因,向输入字段(甚至在DatePicker类的内部组件)中添加id很重要。 我想将htmlFor到关联的标签,并在单击标签时将输入字段聚焦。

如果发现任何组件不支持id,则随时可以进行PR。

我正在使用uilicious.com进行UI测试,如果没有ID,这将是非常具有挑战性的。

此页面是否有帮助?
0 / 5 - 0 等级