Question

我正在尝试使用Testcafe将视频属性设置为play()，pause()，获取当前播放时间并设置当前时间。

问题是我很难对设置的时间进行编码，理想情况下，我希望它是一个可以传递我想要的任何time值的函数。

我编写了以下简单测试：

import { ClientFunction } from 'testcafe';

const URL = 'https://www.youtube.com/watch?v=RWQtB6Xv01Q';

fixture `Portal Experience playback`
  .page `${URL}`;

function sleep (ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

test('Testing YouTube', async t => {
  const play = ClientFunction(() => document.querySelector('.video-stream').play());
  const pause = ClientFunction(() => document.querySelector('.video-stream').pause());
  const currentTime = ClientFunction(() => document.querySelector('.video-stream').currentTime);
  const setTime = await t.eval(() => document.querySelector('.video-stream').currentTime = 5);

  await setTime;
  console.info(`Video time is ${await currentTime()}`);
  await play;
  await sleep(5000);
  console.info(`Video time is ${await currentTime()}`);
  await pause;

});

我可以将play，pause和currentTime复制并粘贴到页面模型内的类中。

页面模型为：

export class Player {
  constructor () {
    this.play = ClientFunction(() => document.querySelector('.video-stream').play());
    this.pause = ClientFunction(() => document.querySelector('.video-stream').pause());
    this.currentTime = ClientFunction(() => document.querySelector('.video-stream').currentTime);
  }

  // a function to set video time

}

如何将setTime转换为页面模型内的函数？

Answer 1

您需要在time客户端函数中指定setTime参数：

ClientFunction((time) => document.querySelector('.video-stream').currentTime = time);

修改后的测试：

test('Testing YouTube', async t => {
    const play        = ClientFunction(() => document.querySelector('.video-stream').play());
    const pause       = ClientFunction(() => document.querySelector('.video-stream').pause());
    const currentTime = ClientFunction(() => document.querySelector('.video-stream').currentTime);
    const setTime     = ClientFunction((time) => document.querySelector('.video-stream').currentTime = time);

    await pause();

    await setTime(60);
    console.info(`Video time is ${await currentTime()}`);

    await play();

    await t.wait(10000);
    console.info(`Video time is ${await currentTime()}`);
});

我们计划add the --autoplay-policy=no-user-gesture-required flag to the default Chrome flags。目前，您应该run your test in the following way：

testcafe "chrome --autoplay-policy=no-user-gesture-required" test.js

结果：

 Running tests in:
 - Chrome 73.0.3683 / Windows 7.0.0

 Portal Experience playback
 Video time is 60
 Video time is 70.130405
  √ Testing YouTube


  1 passed (22s)

Testcafe ClientFunction设置视频currentTime属性

1 个答案: