如何测试声音？ [英] How to test a sound is playing?

问题描述

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

I've been trying to cover <audio> tag by automated tests, to start with just to confirmed it is playing.

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

I'm using the usual angular test suite, karma and protractor.

"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"
}

开Karma方面的问题是我无法找到一种方法来添加资源以便在测试中使用，因此没有文件可以在那里播放。如果有一种方法指向要播放的文件，那么它不应该是一个问题，因为我只需检查该元素的暂停的属性。

On the Karma side the issue is I couldn't find a way to add resources to potentially use in the tests so no file to play in there. If there was a way to point to a file to play then it shouldn't be an issue as I could simply check the paused property of the element.

在2e2方面有一个完美的演示应用，测试可以正常加载它并点击其中一个按钮不会产生任何错误（它会触发声音，如果你手动尝试）。然而，查看量角器API我找不到任何可以让我确保声音实际播放或允许我访问该元素的内容，甚至 document 和<$ c这里没有$ c> angular （这在2e2测试中是有意义的）或者只是用于检查元素属性的API。

On the 2e2 side of things there is a demo app which works perfectly, the test can load it just fine and clicking one of the button doesn't generate any errors (it does trigger sound if you try it manually). However looking into the protractor API I couldn't find anything which could allow me to ensure the sound was actually playing or allow me to access the element as even document and angular are not available here (which make sense as 2e2 testing) or just an API to check element properties.

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

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

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

    // what to do?

});

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

I have thought about possibly mocking the audio API and simply fake the properties being updated but then I'm still testing against my code and the currentTime would be very hard to mock accurately when my end goal is to test a sound on a audio sprite is starting and stopping when expected.

理想情况下，我想在单元测试中覆盖它应该是的，因此能够使用工作资源是理想的。所以一个简单的 expect（！element [0] .paused）.toEqual（true）; 就足以知道它正在播放。

Ideally I want to cover that in unit tests, where it should be, so being able to use a working resource would be ideal. So that a simple expect(!element[0].paused).toEqual(true); will enough to know it's playing.

如何在单元测试中提供文件作为音频源？

How can I serve a file in my unit tests to be used as audio source?

推荐答案

假设你'使用HTML5 < audio /> 重新播放声音，您可以执行以下操作 - 基本上使用 browser.executeScript 按照你想要的方式访问暂停。您需要有办法导航到< audio /> 标记;在这种情况下，它是第一个。这适用于我的沙箱。 注意：我与角度媒体播放器没有任何关系 - 这只是谷歌的第一个结果，我可以使用量角器 - 我可以重复使用。

Assuming you're playing sound using HTML5 <audio /> under the hood, you can do the following - basically use browser.executeScript to access pause like you wanted. You'll need to have a way to navigate to your <audio /> tag; in this case it was the first one. This works in my sandbox. Note: I am not affiliated with angular-media-player - it was just the first result on Google that I could get to work with protractor - I reuse when I can.

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 。

Also you could use someone else's directive like this website (or any other) and not worry about unit-testing (they've presumably done this for you) and just evaluate the scope for their object and make sure you're setting its properties correctly in your E2E tests and not even test for sound if you don't like executeScript.

这篇关于如何测试声音？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！