如何测试当前是否正在播放声音? [英] How to test if a sound is currently 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方面，问题是我找不到添加可能在测试中使用的资源的方法，因此没有文件可以在其中播放.如果有一种方法可以指向要播放的文件，那应该不成问题，因为我可以简单地检查元素的paused属性.

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和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来访问pause通缉.您将需要一种导航到<audio />标记的方法.在这种情况下，它是第一个.这在我的沙箱中有效. 注意:我不隶属于angular-media-player，这只是我可以与量角器一起使用的Google上的第一个结果-我会尽可能重复使用.

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);
  });
});

此外，您可以使用其他人的指令(例如此网站(或任何其他网站))，而不必担心单元测试(他们可能已经为您完成了此操作)，并且只需评估其对象的范围并确保您进行设置即可在您的端到端测试中正确显示了其属性，如果您不喜欢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屋！