如何测试声音?

时间:2014-09-09 17:46:00

标签: javascript angularjs protractor karma-runner karma-jasmine

我一直试图通过自动化测试覆盖<audio>标记,首先确认它正在播放。

我正在使用通常的角度测试套件,业力和量角器。

"devDependencies": {
    "karma": "~0.10",
    "protractor": "~0.20.1",
    "http-server": "^0.6.1",
    "bower": "^1.3.1",
    "shelljs": "^0.2.6",
    "karma-junit-reporter": "^0.2.2",
    "grunt": "~0.4.1",
    "grunt-contrib-uglify": "~0.2.0",
    "grunt-contrib-concat": "~0.3.0",
    "grunt-contrib-watch": "~0.4.3"
}

在业力方面,问题是我找不到添加资源以便在测试中使用的方法,因此没有文件可以在那里播放。如果有办法指向要播放的文件,那么它不应该是一个问题,因为我可以简单地检查该元素的paused属性。

在2e2方面有一个演示应用程序完美运行,测试可以加载它很好,单击其中一个按钮不会产生任何错误(如果你手动尝试它会触发声音)。然而,在查看量角器API时,我找不到任何可以让我确保声音实际播放或允许我访问该元素的内容,因为偶数documentangular在这里不可用(这使得感觉为2e2测试)或仅仅是用于检查元素属性的API。

beforeEach(function() {
    browser.get("index.html")
});

it("Ensure the player is playing", function () {

    $$("button").first().click();

    // what to do?

});

我已经考虑过可能会嘲笑音频API并简单地伪造正在更新的属性但是我仍在测试我的代码,当我的最终目标是测试时,currentTime很难准确地模拟音频精灵上的声音在预期时开始和停止。

理想情况下,我想在单元测试中覆盖它应该是的,因此能够使用工作资源将是理想的。这样一个简单的expect(!element[0].paused).toEqual(true);就足以让人知道它正在播放。

如何在单元测试中提供文件以用作音频源?

1 个答案:

答案 0 :(得分:12)

假设您正在使用HTML5 <audio />播放声音,您可以执行以下操作 - 基本上使用browser.executeScript按照您的意愿访问pause。您需要有办法导航到<audio />标记;在这种情况下,它是第一个。这适用于我的沙箱。 注意:我与角度媒体播放器无关 - 这只是我在谷歌上的第一个结果,我可以使用量角器 - 我会尽可能地重复使用。

describe('angularjs homepage', function() {
  it('should have a title', function() {
    browser.get('http://mrgamer.github.io/angular-media-player/interactive.html');

    // add a song to the playlist
    element(by.repeater('song in prefabPlaylist')).click();

    // hook into the browser
    var isPaused = function () {
        return browser.executeScript(function () {
            return document.getElementsByTagName('audio')[0].paused;
        });
    };

    // make sure it's not playing
    expect(isPaused()).toBe(true);

    // start playing
    element(by.css('div[ng-click="mediaPlayer.playPause()"]')).click();

    // for some reason these were needed for me; maybe it's the way the directive is implemented?
    browser.waitForAngular();
    browser.waitForAngular();
    browser.waitForAngular();

    // make sure it's playing
    expect(isPaused()).toBe(false);

    // pause
    element(by.css('div[ng-click="mediaPlayer.playPause()"]')).click();

    // make sure it's paused
    expect(isPaused()).toBe(true);
  });
});

此外,您可以使用其他人的指令,如本网站(或任何其他),而不用担心单元测试(他们可能是为您完成此操作),只是评估其对象的范围,并确保您正在设置在你的E2E测试中它的属性是正确的,如果你不喜欢executeScript,甚至不测试声音。