testing - Testcafe:如何将文本输入到 Spectrum 颜色选择器的隐藏输入中

Question

我正在尝试将颜色代码发送到 Spectrum color picker使用 t.typeText(colorPickerInput) 输入，但此输入被隐藏并且 Testcafe 抛出错误。基于文档选项 { visibilityCheck: false } 在 typeText()

的情况下不起作用

<input id="ember949" class="spectrum-color-picker ember-view" style="display: none;">

还有其他方法可以解决这个问题吗？

Answer 1

TestCafe 旨在模拟真实的用户行为，因此您不能使用“display: none”样式键入输入元素。但是，您可以使用 ClientFunctions 设置输入值机制，允许您编写任何自定义 JS 代码。

请看下面的例子:

import { ClientFunction } from 'testcafe';

const setInputValue = ClientFunction(() => {
    document.querySelector('input.spectrum-color-picker').value = '';
});

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

test('test', async t => {
    await setInputValue();
});