reactjs - 失败，因为此元素被另一个元素覆盖（不可见的 Iframe）

Question

我被这个中断了我所有点击的 iframe 击中，在向它添加 { force: true } 之后，它只是移动到中断 should() 断言。

我不知道这个 iframe 是什么，并且当您使用该应用程序时它在 html 中不可见。有解决方案吗？

此按钮的 HTML：

<button class="MuiButtonBase-root makeStyles-root-1080 makeStyles-sm-1082 makeStyles-sm-1303 makeStyles-ghost-1088 makeStyles-ghost-1308 makeStyles-button-1161 makeStyles-defaultState-1163 makeStyles-defaultState-1298" tabindex="0" type="button" aria-label="Lobby" data-cy="lobby-button" color="dark"><div class="makeStyles-contentWrapper-1093"><div class="makeStyles-content-1094 makeStyles-content-1310 makeStyles-content-1167"><span class="MuiBadge-root"><svg width="34" height="34" viewBox="0 0 34 34" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M21.7273 15.8571C23.6891 15.8571 25.2609 14.3257 25.2609 12.4286C25.2609 10.5314 23.6891 9 21.7273 9C19.7655 9 18.1818 10.5314 18.1818 12.4286C18.1818 14.3257 19.7655 15.8571 21.7273 15.8571ZM12.2727 15.8571C14.2345 15.8571 15.8064 14.3257 15.8064 12.4286C15.8064 10.5314 14.2345 9 12.2727 9C10.3109 9 8.72727 10.5314 8.72727 12.4286C8.72727 14.3257 10.3109 15.8571 12.2727 15.8571ZM12.2727 18.1429C9.51909 18.1429 4 19.48 4 22.1429V23.8571C4 24.4857 4.53182 25 5.18182 25H19.3636C20.0136 25 20.5455 24.4857 20.5455 23.8571V22.1429C20.5455 19.48 15.0264 18.1429 12.2727 18.1429ZM21.7273 18.1429C21.3845 18.1429 20.9945 18.1657 20.5809 18.2C20.6045 18.2114 20.6164 18.2343 20.6282 18.2457C21.9755 19.1943 22.9091 20.4629 22.9091 22.1429V23.8571C22.9091 24.2571 22.8264 24.6457 22.6964 25H28.8182C29.4682 25 30 24.4857 30 23.8571V22.1429C30 19.48 24.4809 18.1429 21.7273 18.1429Z" fill="currentColor"></path></svg><span class="MuiBadge-badge MuiBadge-anchorOriginTopRightRectangle MuiBadge-colorError MuiBadge-invisible">0</span></span></div></div><span class="MuiTouchRipple-root"></span></button>

而点击是这样的

 cy.get('[data-cy="lobby-button"]').click();

标签： reactjscypress

Answer 1

这在注释掉后消失了（已修复）

new ReactRefreshWebpackPlugin()

来自webpack.config.js