Question

我有一个Ionic / Angular应用，可对文本选择做出反应（例如，用于电子书中的注释）。用户可以在浏览器中突出显示文本，然后弹出一个菜单（以某种方式覆盖/扩大了浏览器的上下文菜单）以允许操作。我想用testcafe测试该功能。（呈现文本的组件会对浏览器中的“ selectionchange”事件做出反应。）

除“选择文本”命令（https://devexpress.github.io/testcafe/documentation/test-api/actions/select-text.html）之外，似乎没有其他方法可以模拟文本选择，但这仅限于输入，文本区域或内容可编辑内容。我的文字不是这些-它是直接的

元素。

关于如何实现此目标的任何建议？

Answer 1

是的，SelectText命令仅限于输入，文本区域和可编辑内容的元素。如果使用ClientFunctions通过自定义选择逻辑实现自己的ClientFunction，则可以使用Selection API机制解决该问题。我准备了一个例子。如果需要选择文本内容的不同部分，请根据需要对其进行修改。

import { Selector, ClientFunction } from 'testcafe';

fixture `selection`
    .page `http://example.com`;

const selectElement = (selector) => ClientFunction(() => {
    const selection = document.getSelection();
    const range = document.createRange();

    range.selectNode(selector());
    selection.addRange(range);
}, { dependencies: { selector } });

test('selection', async t => {
    await selectElement(Selector('h1'))();

    await t.debug();
});

如何在testCafe中模拟文本选择

1 个答案: