TestCafe无法定位含::before伪元素的锚点标签，点击失败求助

问题原因 #

• 你定位的<a>标签本身在hover前可能处于视觉不可见状态（比如opacity: 0、宽高为0，或被伪元素完全覆盖），TestCafe默认的可见性检查会验证元素是否在视口内、有有效尺寸、不透明等，不满足就会抛出"元素不可见"的错误。
• 实际可交互的区域是<a>标签的::before伪元素，而非标签本身，直接点击标签可能无法命中交互点。

解决方案 #

方案1：模拟用户hover后点击（推荐） #

先触发hover操作让元素变为可见，再执行点击，符合真实用户交互流程：

const anchorTag = Selector('a.nav-icon.flag.gh-desktop-only.en-GB');
await t.hover(anchorTag).click(anchorTag);

方案2：跳过可见性检查（应急用） #

如果hover后仍无法通过可见性验证，可以强制关闭TestCafe的可见性检查（不推荐长期使用，可能点击无效元素）：

const anchorTag = Selector('a.nav-icon.flag.gh-desktop-only.en-GB');
await t.click(anchorTag, { visibilityCheck: false });

方案3：直接定位并点击伪元素 #

TestCafe支持通过CSS伪类选择器定位::before伪元素，直接点击交互区域：

const pseudoElement = Selector('a.nav-icon.flag.gh-desktop-only.en-GB:before');
await t.click(pseudoElement);

内容的提问来源于stack exchange，提问作者vjayap