Angular 9中ProtractorHarnessEnvironment点击MatButton失效求助

看起来你遇到的问题是Angular Material Harness无法触发按钮点击，但原生Protractor元素操作可以正常工作。这大概率是Harness的初始化或定位逻辑和原生Protractor的交互方式存在差异导致的，下面是几个排查和解决方向：

1. 确保Harness依赖版本与Material完全匹配 #

Angular Material Harness和Material本体版本必须严格对应，尤其是在Angular 9这种较早的版本中，版本不匹配很容易导致奇怪的交互问题。检查你的package.json，确认@angular/material和@angular/material/testing的版本都是9.x.x，没有不一致的情况。

2. 等待Angular稳定后再获取Harness #

Harness依赖Angular的变更检测和组件初始化状态，有时候原生Protractor的element()会自动等待元素可见，但Harness的loader可能需要显式等待Angular完成初始化。尝试在获取Harness前添加：

await browser.waitForAngular(); // 等待Angular应用稳定
let harnessLoader = ProtractorHarnessEnvironment.loader(); 
const cvlBrand = await harnessLoader.getHarness<MatButtonHarness>( 
  MatButtonHarness.with({selector: '#cvl-brand'})); 
await cvlBrand.click();

3. 换一种Harness定位方式 #

虽然你用了ID选择器，但可以尝试通过按钮文本定位来排除选择器匹配问题：

const cvlBrand = await harnessLoader.getHarness(
  MatButtonHarness.with({text: /My Company Cool/}) // 用正则匹配按钮文本
);
await cvlBrand.click();

4. 直接通过元素实例创建Harness #

如果全局loader无法正确关联到目标按钮，你可以先通过原生Protractor获取元素，再基于该元素创建Harness：

// 先获取原生元素
const buttonElement = element(by.id('cvl-brand'));
// 基于元素创建Harness
const cvlBrandHarness = await ProtractorHarnessEnvironment.harnessForElement(
  buttonElement,
  MatButtonHarness
);
await cvlBrandHarness.click();

5. 检查是否禁用了Angular同步 #

如果你的测试中设置了browser.waitForAngularEnabled(false)，这会导致Harness无法和Angular的变更检测同步，从而无法正确触发组件交互。确保这个配置是true（默认就是true，除非你手动修改过）。

6. 排查控制台错误 #

在测试执行时打开浏览器控制台，看看有没有Harness相关的错误信息（比如找不到组件、初始化失败等），这些错误能帮你快速定位问题根源。可以用try-catch包裹Harness代码来捕获异常：

try {
  let harnessLoader = ProtractorHarnessEnvironment.loader(); 
  const cvlBrand = await harnessLoader.getHarness<MatButtonHarness>( 
    MatButtonHarness.with({selector: '#cvl-brand'})); 
  console.log("Harness successfully acquired");
  await cvlBrand.click();
} catch (error) {
  console.error("Harness error:", error);
}

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