Adaptive Card QuickView导航点击无响应问题排查

问题表现 #

• 本地运行gulp serve启动ACE项目调试时，卡片初始渲染状态完全正常，但所有绑定了QuickView触发动作的卡片按钮点击后无任何反应，和未绑定动作的表现完全一致。
• 更换多款浏览器测试，控制台无任何错误输出。
• 无论是PnP提供的公开ACE示例项目，还是Yeoman脚手架生成的全新默认ACE模板项目，都会复现相同问题，排除自定义代码编写错误的可能。

对应复现代码 #

卡片按钮配置 #

public get cardButtons(): [ICardButton] | [ICardButton, ICardButton] | undefined {
return [
  {
    title: strings.QuickViewButton,
    action: {
      type: 'QuickView',
      parameters: {
        view: QUICK_VIEW_REGISTRY_ID
      }
    }
  }
]};

视图注册逻辑 #

const CARD_VIEW_REGISTRY_ID: string = 'JasonAdaptiveTest_CARD_VIEW';
export const QUICK_VIEW_REGISTRY_ID: string = 'JasonAdaptiveTest_QUICK_VIEW';

public onInit(): Promise<void> {
    this.state = { };

    this.cardNavigator.register(CARD_VIEW_REGISTRY_ID, () => new CardView());
    this.quickViewNavigator.register(QUICK_VIEW_REGISTRY_ID, () => new QuickView());

    return Promise.resolve();
  }

根本原因 #

该故障和NPM包缺失无关，核心诱因是调试入口选择错误：
SPFx 1.16及更早版本提供的本地静态Workbench（即项目temp目录下的workbench.html）存在已知的ACE交互逻辑兼容缺陷，无法正确识别并执行QuickView导航动作，且不会在控制台抛出任何错误提示，是新手入门ACE开发时最容易踩的坑。

修复步骤 #

• 终止当前运行的gulp serve进程，清空浏览器缓存后重新执行gulp serve启动服务。
• 不要访问本地路径下的https://localhost:4321/temp/workbench.html调试页面，改为打开对应SharePoint租户的托管Workbench页面，地址格式为https://<你的租户域名>.sharepoint.com/_layouts/15/workbench.aspx。
• 在托管Workbench中重新添加本地调试的ACE组件，卡片按钮即可正常触发QuickView弹窗。
• 如果上述操作后仍存在异常，检查项目依赖：将@microsoft/sp-adaptive-card-extension-base包的版本和项目使用的SPFx整体版本对齐，不要混装跨大版本的SPFx依赖，重新执行npm install安装依赖后重启服务即可恢复正常。

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