cypress使用type输入内容被截断问题定位&解决

问题

通过cy.get('#id').type('abcd')对#id文本框输入内容abcd,会出现输入的内容不全情况

• 情况1：只输入前面几个字符 比如 ab，后面的cd没有输入到文本框
• 情况2：只输入后面几个字符 比如bcd,前面的a没有输入成功

解决

情况1

问题定位

情况1这个问题是我实际遇到的问题，文本框中输入一串数字，经常出现只输入前面几个字符的情况，通过console，查看type命令的输入过程

• 如下可以看到前面的两个数字是输入到input元素的，而后面的字符输入到了div#pay_for_1这个元素上了，从而导致内容没有完全输入到input中
• 定位div#pay_for_1这个元素，是打开弹框时候的背景层

解决办法

由于页面还未稳定加载(重新渲染），那么

1. 可以加等待时间，页面展示完全后在进行type操作
2. 判断div#pay_for_1这个元素是否已经加载，加载后再进行type操作

情况2

情况2这种前面几个字符未输入上的问题，目前我没有遇到过，只是在解决情况1的时候有看到此问题，不过猜测导致问题的原因和情况1类似，只不过是前面的几个字符输入到其他元素上了

解决思路

1. 打开console，查看type命令执行过程，确定是否输入到其他元素上了
2. 确定了是此原因的话，添加等待 或者type加delay参数type('12345',{delay:30}) (delay的默认值是10）