AudioPlayer: Add UI tests.

ui/file_manager/integration_tests/audio_player/click_control_buttons.js

+// Copyright 2015 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+'use strict';
+
+/**
+ * @return {Promise} Promise to be fulfilled with on success.
+ */
+testcase.clickControlButtons = function() {

[yawano, 2015/12/16 02:54:14]

This test case has more than 20 steps. It seems to be difficult to read what
this test is doing. Is it possible to split this test case into a few smaller
test cases?

e.g. split into volumeControlTest, playListControlTest, playButtonControlTest.

[fukino, 2015/12/16 07:42:02]

Thank you for the suggestion!
Done.

+  var openAudio = launch('local', 'downloads',
+      [ENTRIES.beautiful, ENTRIES.newlyAdded]);
+  var appId;
+  return openAudio.then(function(args) {
+    appId = args[0];
+  }).then(function() {
+    // Audio player should start playing automatically.
+    return remoteCallAudioPlayer.waitForElement(
+        appId, 'audio-player[playing]');
+  }).then(function() {
+    // While playing, the play/pause button should have 'Pause' label.
+    return remoteCallAudioPlayer.waitForElement(
+        appId, ['#play[aria-label=\'Pause\']']);

[yawano, 2015/12/16 02:54:14]

nit: How about to use double quotes here? Our HTML style guide says we should
use double quote for attribute value. -
https://google.github.io/styleguide/htmlcssguide.xml?showone=HTML_Quotation_M...

Also you don't need to use escape character if you use double quote.

[fukino, 2015/12/16 07:42:02]

Chromium coding style overrides the rule...: "Use single quotes instead of
double quotes for all strings."
https://www.chromium.org/developers/web-development-style-guide

That said, as this is a test code and this is not CSS file, let me use double
quotation for readability.

+  }).then(function() {
+    // Clicking the pause button should change the playback state to pause.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['#play']);
+  }).then(function() {
+    return remoteCallAudioPlayer.waitForElement(
+        appId, 'audio-player:not([playing])');
+  }).then(function() {
+    // ... and the play/pause button should have 'Play' label.
+    return remoteCallAudioPlayer.waitForElement(
+        appId, ['#play[aria-label=\'Play\']']);
+  }).then(function() {
+    // The default volume level should be 50.
+    return remoteCallAudioPlayer.waitForElement(
+        appId, ['control-panel[volume=\'50\']']);
+  }).then(function() {
+    // Clicking volume button should mute the player.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['#volumeButton']);
+  }).then(function() {
+    return Promise.all([
+      remoteCallAudioPlayer.waitForElement(
+          appId, ['control-panel[volume=\'0\']']),
+      remoteCallAudioPlayer.waitForElement(
+          appId, ['#volumeButton[aria-label=\'Unmute\']'])
+    ]);
+  }).then(function() {
+    // Clicking volume button again should restore volume.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['#volumeButton']);
+  }).then(function() {
+    return Promise.all([
+      remoteCallAudioPlayer.waitForElement(
+          appId, ['control-panel[volume=\'50\']']),
+      remoteCallAudioPlayer.waitForElement(
+          appId, ['#volumeButton[aria-label=\'Mute\']'])
+    ]);
+  }).then(function() {
+    // The first track should be active.
+    return remoteCallAudioPlayer.waitForElement(
+        appId, ['.track[index=\'0\'][active]']);
+  }).then(function() {
+    // Clicking next button should activate the second track and start playing.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['#next']);
+  }).then(function() {
+    return Promise.all([
+      remoteCallAudioPlayer.waitForElement(
+          appId, ['.track[index=\'1\'][active]']),
+      remoteCallAudioPlayer.waitForElement(
+          appId, 'audio-player[playing]')
+    ]);
+  }).then(function() {
+    // Pause to prepare for remaining steps.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['#play']);
+  }).then(function() {
+    return remoteCallAudioPlayer.waitForElement(
+        appId, 'audio-player:not([playing])');
+  }).then(function() {
+    // Clicking playlist button should expand track list.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['#playList']);
+  }).then(function() {
+    return remoteCallAudioPlayer.waitForElement(
+        appId, 'track-list[expanded]');
+  }).then(function() {
+    // Clicking the first track should make it active, but shouldn't start
+    // playing.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['.track[index=\'0\']']);
+  }).then(function() {
+    return remoteCallAudioPlayer.waitForElement(
+        appId, '.track[index=\'0\'][active]');
+  }).then(function() {
+    return remoteCallAudioPlayer.waitForElement(
+        appId, 'audio-player:not([playing])');
+  }).then(function() {
+    // Clicking the play icon on the second should make it active, and start
+    // playing.
+    return remoteCallAudioPlayer.callRemoteTestUtil(
+        'fakeMouseClick', appId, ['.track[index=\'1\'] .icon']);
+  }).then(function() {
+    return remoteCallAudioPlayer.waitForElement(
+        appId, '.track[index=\'1\'][active]');
+

[yawano, 2015/12/16 02:54:14]

nit: unnecessary blank line.

[fukino, 2015/12/16 07:42:01]

Done.

+  }).then(function() {
+    return remoteCallAudioPlayer.waitForElement(
+        appId, 'audio-player[playing]');
+  });
+};