React Native + Detox：基于 CDP 的信号同步机制

// 期望：等待 Promise resolve 后再返回
await client.Runtime.evaluate({
  expression: `window.login('user@test.com', 'password')`, // 这个函数返回一个 Promise
  awaitPromise: true, // 告诉引擎等待 Promise resolve 再返回
  returnByValue: true
});
console.log('登录完成，继续测试...');

// 文件: API/hermes/cdp/RuntimeDomainAgent.cpp (第 618-648 行)
void RuntimeDomainAgent::evaluate(const m::runtime::EvaluateRequest &req) {
  // 使用的参数
  serializationOptions.returnByValue = req.returnByValue.value_or(false);
  serializationOptions.generatePreview = req.generatePreview.value_or(false);
  std::string objectGroup = req.objectGroup.value_or("");

  // req.awaitPromise 未被读取

  // 直接同步执行，立即返回
  std::tie(resp.result, resp.exceptionDetails) = evaluateAndWrapResult(
      runtime_, *objTable_, objectGroup, serializationOptions,
      [&req](jsi::Runtime &runtime) {
        return runtime.evaluateJavaScript(...);
      });

  sendResponseToClient(resp);
}

// ❌ 错误示范:先触发操作,再监听信号
async function loginWrong(email: string, password: string) {
  const opId = generateOperationId();

  // 1. 先触发操作
  await client.Runtime.evaluate({
    expression: `login('${email}', '${password}', '${opId}')`,
    awaitPromise: false,
  });

  // 2. 再监听信号
  await waitForSignal(opId); // 可能错过信号
}

时间轴 (错误做法):
T1: evaluate() 发送命令
T2: App 执行 login()
T3: App 打印 console.log('[E2E:DONE:xxx]')  ← 信号已发出
T4: waitForSignal() 开始监听               ← 监听器才注册,错过信号

时间轴 (正确做法):
T1: waitForSignal() 开始监听               ← 监听器已就绪
T2: evaluate() 发送命令
T3: App 执行 login()
T4: App 打印 console.log('[E2E:DONE:xxx]')  ← 信号被捕获 ✅

export function generateOperationId(): string {
  return `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
  // 示例: "1733812345678-k3j2h1"
}

// e2e/lib/inject/helpers.ts
export const signalDone = (opId: string) => {
  console.log(`[E2E:DONE:${opId}]`);
};

export const signalError = (opId: string, error: unknown) => {
  const message = error instanceof Error ? error.message : String(error);
  console.error(`[E2E:ERROR:${opId}:${message}]`);
};

// e2e/lib/inject/auth.ts
window.login = async (email: string, password: string, opId?: string) => {
  try {
    // 真实的业务逻辑
    await store.dispatch(loginLegacy({ byEmailPassword: { email, password } }));
    await store.dispatch(getAccountInfo());
    globalNavigation.current?.dispatch(PATH_HOME.reset({}));

    // 关键点:操作完成后打印特殊格式日志
    if (opId) signalDone(opId);
  } catch (error) {
    if (opId) signalError(opId, error);
  }
};

// e2e/lib/cdp/client.ts
export async function waitForSignal(opId: string, timeout = 60000): Promise<void> {
  const cdpClient = await getCdpClient();

  return new Promise((resolve, reject) => {
    // 1. 创建监听器
    const listener = (params: CDP.Runtime.ConsoleAPICalledEvent) => {
      const message = params.args?.[0]?.value;

      if (message === `[E2E:DONE:${opId}]`) {
        cleanup();
        resolve();
      } else if (typeof message === 'string' && message.startsWith(`[E2E:ERROR:${opId}:`)) {
        cleanup();
        const errorMsg = message.replace(`[E2E:ERROR:${opId}:`, '').replace(']', '');
        reject(new Error(errorMsg));
      }
    };

    // 2. 注册监听器
    const unsubscribe = cdpClient['Runtime.consoleAPICalled'](listener);

    // 3. 设置超时兜底
    const timeoutId = setTimeout(() => {
      cleanup();
      reject(new Error(`waitForSignal timeout after ${timeout}ms for opId: ${opId}`));
    }, timeout);

    // 清理函数
    const cleanup = () => {
      clearTimeout(timeoutId);
      unsubscribe();
    };
  });
}

// e2e/lib/actions/login.ts
export async function login(email: string, password: string): Promise<void> {
  const opId = generateOperationId();
  const client = await getCdpClient();

  // 关键顺序:先监听,后触发
  const signalPromise = waitForSignal(opId);  // 1️⃣ 先监听

  await client.Runtime.evaluate({
    expression: `window.login('${email}', '${password}', '${opId}')`,
    awaitPromise: false,  // 不依赖 Hermes 的 awaitPromise
  });

  await signalPromise;  // 3️⃣ 等待信号
}

T1: waitForSignal() 注册监听 ← 监听器已就绪
T2: Runtime.evaluate() 触发操作
T3: App 执行异步逻辑...
T4: signalDone(opId) 发出信号
T5: 监听器收到,resolve()

T0: App 开始启动
T1: setupConsoleInterceptor() 注入
T2-T4: 日志产生 (启动日志等)
T5: Detox 测试开始
T6: CDP 连接建立 ← 这时才能用 consoleAPICalled

WebSocket is not open: readyState 3 (CLOSED)

let client: CDP.Client | null = null;
let initPromise: Promise<CDP.Client> | null = null;

export const getCdpClient = async (): Promise<CDP.Client> => {
  // 1. 检查现有连接 + 健康检查
  if (client && (await isClientConnected(client))) {
    return client;
  }

  // 2. 并发锁:复用正在进行的连接尝试
  if (initPromise) return initPromise;

  // 3. 发起新连接
  initPromise = (async () => {
    try {
      const newClient = await createCdpConnectionWithRetry(3);
      client = newClient;
      return newClient;
    } finally {
      initPromise = null;  // 无论成功失败都重置,允许下次重试
    }
  })();

  return initPromise;
};

async function isClientConnected(cdpClient: CDP.Client): Promise<boolean> {
  try {
    const healthCheck = cdpClient.Runtime.evaluate({
      expression: '1+1',
      returnByValue: true,
    });

    const timeout = new Promise<never>((_, reject) =>
      setTimeout(() => reject(new Error('Health Check Timeout')), 2000)
    );

    await Promise.race([healthCheck, timeout]);
    return true;
  } catch {
    return false;
  }
}

async function createCdpConnection(): Promise<CDP.Client> {
  const newClient = await CDP({ port: 8081 });
  await newClient.Runtime.enable();

  // 监听断开事件
  newClient.on('disconnect', () => {
    console.log('[CDP] Connection disconnected, resetting client');
    // 防误杀:只有当前 client 是这个 newClient 时才重置
    if (client === newClient) {
      resetCdpClient();
    }
  });

  return newClient;
}

function resetCdpClient() {
  if (client) {
    // 清理所有监听器,防止内存泄漏
    (client as unknown as { removeAllListeners: () => void }).removeAllListeners();
    client = null;
  }
}

// ❌ 错误:不加 returnByValue,复杂对象返回引用
const resp = await client.Runtime.evaluate({
  expression: `window._consoleLogs.splice(0)`,
});
// resp.result.value 可能是 undefined

// ✅ 正确:加 returnByValue + JSON.stringify
const resp = await client.Runtime.evaluate({
  expression: `JSON.stringify(window._consoleLogs.splice(0))`,
  returnByValue: true,
});
const logs = JSON.parse(resp.result.value as string);

// App 端注入代码
window.getNavigationState = () => {
  const state = globalNavigation.current?.getRootState();
  // ✅ 必须序列化
  console.log(`[E2E:NAV_STATE:${JSON.stringify(state)}]`);
};

// ✅ 简单同步操作可以用 awaitPromise: true
await client.Runtime.evaluate({
  expression: `window.clearToast()`,
  awaitPromise: true,
});

// ❌ 复杂异步操作不可靠,使用信号同步
const opId = generateOperationId();
const signalPromise = waitForSignal(opId);
await client.Runtime.evaluate({
  expression: `window.navigate('/customer/detail', {id: 123}, '${opId}')`,
  awaitPromise: false,  // 不依赖 Hermes
});
await signalPromise;