如何在UI测试中点击ClickableText组件内的指定单词？

要定位并点击ClickableText组件内的特定单词，核心是利用语义测试框架获取文本布局信息，计算目标单词的精确点击坐标，再执行点击操作。以下是具体实现步骤和示例：

1. 为ClickableText添加测试标记 #

先给目标ClickableText的Modifier加上testTag，方便测试时快速定位组件：

ClickableText(
    modifier = Modifier
        .padding(bottom = 16.dp)
        .testTag("clickable_main_text"), // 添加测试标签
    text = someAnnotatedText,
    style = MaterialTheme.typography.body1.copy(color = Abbey),
    onClick = {
        // 原有点击逻辑保持不变
    }
)

2. 编写工具函数计算目标文本边界 #

创建扩展函数，从语义节点中提取目标单词的布局边界：

fun SemanticsNodeInteraction.findTextBounds(targetText: String): Rect? {
    val node = fetchSemanticsNode()
    val textLayoutResult = node.layoutInfo.getCachedLayoutResult() as TextLayoutResult?
    textLayoutResult ?: return null

    // 遍历每一行文本查找目标单词
    for (line in 0 until textLayoutResult.lineCount) {
        val lineStart = textLayoutResult.getLineStart(line)
        val lineEnd = textLayoutResult.getLineEnd(line)
        val lineText = textLayoutResult.layoutInput.text.substring(lineStart, lineEnd)
        
        val targetIndex = lineText.indexOf(targetText)
        if (targetIndex != -1) {
            val absoluteStart = lineStart + targetIndex
            val absoluteEnd = absoluteStart + targetText.length
            
            // 合并目标文本首尾字符的边界，得到完整文本区域
            return textLayoutResult.getBoundingBox(absoluteStart).union(
                textLayoutResult.getBoundingBox(absoluteEnd - 1)
            )
        }
    }
    return null
}

3. 编写UI测试用例 #

在测试中定位组件、计算坐标并执行点击，最后验证预期行为：

@OptIn(ExperimentalTestApi::class)
@Test
fun clickableText_specificWord_triggersAction() {
    val targetWord = "someword"
    composeTestRule.setContent {
        // 加载你的Compose页面
        YourScreen()
    }

    // 定位ClickableText节点
    val clickableTextNode = composeTestRule.onNodeWithTag("clickable_main_text")
    
    // 获取目标单词的边界矩形
    val textBounds = clickableTextNode.findTextBounds(targetWord)
    assertNotNull(textBounds)
    
    // 计算边界中心作为点击坐标
    val clickOffset = Offset(textBounds.centerX, textBounds.centerY)
    
    // 执行精确点击
    clickableTextNode.performClick(clickOffset)
    
    // 验证点击后的预期效果，比如状态变化或导航
    // 示例：composeTestRule.onNodeWithText("Action Executed").assertIsDisplayed()
}

补充说明 #

• 该方法依赖TextLayoutResult获取文本布局信息，Compose 1.0及以上版本均支持。
• 示例仅处理单行文本场景，若目标文本跨多行，需调整工具函数逻辑遍历多行匹配。
• 使用performClick(Offset)替代默认点击，确保点击位置精准落在目标单词区域。

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