summaryrefslogtreecommitdiffstats
path: root/dom/media/mediacontrol/tests/browser/browser_resume_latest_paused_media.js
blob: 58cd3f5a0f6edcf4621af2fc793fe42c5fbc196e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
const PAGE_URL =
  "https://example.com/browser/dom/media/mediacontrol/tests/browser/file_multiple_audible_media.html";

add_task(async function setupTestingPref() {
  await SpecialPowers.pushPrefEnv({
    set: [["media.mediacontrol.testingevents.enabled", true]],
  });
});

/**
 * This test is used to check when resuming media, we would only resume latest
 * paused media, not all media in the page.
 */
add_task(async function testResumingLatestPausedMedias() {
  info(`open media page and play all media`);
  const tab = await createLoadedTabWrapper(PAGE_URL);
  await playAllMedia(tab);

  /**
   * Pressing `pause` key would pause video1, video2, video3
   * So resuming from media control key would affect those three media
   */
  info(`pressing 'pause' should pause all media`);
  await generateMediaControlKeyEvent("pause");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: true,
    shouldVideo2BePaused: true,
    shouldVideo3BePaused: true,
  });

  info(`all media are latest paused, pressing 'play' should resume all`);
  await generateMediaControlKeyEvent("play");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: false,
    shouldVideo2BePaused: false,
    shouldVideo3BePaused: false,
  });

  info(`pause only one playing video by calling its webidl method`);
  await pauseMedia(tab, "video3");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: false,
    shouldVideo2BePaused: false,
    shouldVideo3BePaused: true,
  });

  /**
   * Pressing `pause` key would pause video1, video2
   * So resuming from media control key would affect those two media
   */
  info(`pressing 'pause' should pause two playing media`);
  await generateMediaControlKeyEvent("pause");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: true,
    shouldVideo2BePaused: true,
    shouldVideo3BePaused: true,
  });

  info(`two media are latest paused, pressing 'play' should only affect them`);
  await generateMediaControlKeyEvent("play");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: false,
    shouldVideo2BePaused: false,
    shouldVideo3BePaused: true,
  });

  info(`pause only one playing video by calling its webidl method`);
  await pauseMedia(tab, "video2");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: false,
    shouldVideo2BePaused: true,
    shouldVideo3BePaused: true,
  });

  /**
   * Pressing `pause` key would pause video1
   * So resuming from media control key would only affect one media
   */
  info(`pressing 'pause' should pause one playing media`);
  await generateMediaControlKeyEvent("pause");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: true,
    shouldVideo2BePaused: true,
    shouldVideo3BePaused: true,
  });

  info(`one media is latest paused, pressing 'play' should only affect it`);
  await generateMediaControlKeyEvent("play");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: false,
    shouldVideo2BePaused: true,
    shouldVideo3BePaused: true,
  });

  /**
   * Only one media is playing, so pausing it should not stop controlling media.
   * We should still be able to resume it later.
   */
  info(`pause only playing video by calling its webidl method`);
  await pauseMedia(tab, "video1");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: true,
    shouldVideo2BePaused: true,
    shouldVideo3BePaused: true,
  });

  info(`pressing 'pause' for already paused media, nothing would happen`);
  // All media are already paused, so no need to wait for playback state change,
  // call the method directly.
  MediaControlService.generateMediaControlKey("pause");

  info(`pressing 'play' would still affect on latest paused media`);
  await generateMediaControlKeyEvent("play");
  await checkMediaPausedState(tab, {
    shouldVideo1BePaused: false,
    shouldVideo2BePaused: true,
    shouldVideo3BePaused: true,
  });

  info(`remove tab`);
  await tab.close();
});

/**
 * The following are helper functions.
 */
async function playAllMedia(tab) {
  const playbackStateChangedPromise = waitUntilDisplayedPlaybackChanged();
  await SpecialPowers.spawn(tab.linkedBrowser, [], () => {
    return new Promise(r => {
      const videos = content.document.getElementsByTagName("video");
      let mediaCount = 0;
      docShell.chromeEventHandler.addEventListener(
        "MozStartMediaControl",
        () => {
          if (++mediaCount == videos.length) {
            info(`all media have started media control`);
            r();
          }
        }
      );
      for (let video of videos) {
        info(`play ${video.id} video`);
        video.play();
      }
    });
  });
  await playbackStateChangedPromise;
}

async function pauseMedia(tab, videoId) {
  await SpecialPowers.spawn(tab.linkedBrowser, [videoId], videoId => {
    const video = content.document.getElementById(videoId);
    if (!video) {
      ok(false, `can not find ${videoId}!`);
    }
    video.pause();
  });
}

function checkMediaPausedState(
  tab,
  { shouldVideo1BePaused, shouldVideo2BePaused, shouldVideo3BePaused }
) {
  return SpecialPowers.spawn(
    tab.linkedBrowser,
    [shouldVideo1BePaused, shouldVideo2BePaused, shouldVideo3BePaused],
    (shouldVideo1BePaused, shouldVideo2BePaused, shouldVideo3BePaused) => {
      const video1 = content.document.getElementById("video1");
      const video2 = content.document.getElementById("video2");
      const video3 = content.document.getElementById("video3");
      is(
        video1.paused,
        shouldVideo1BePaused,
        "Correct paused state for video1"
      );
      is(
        video2.paused,
        shouldVideo2BePaused,
        "Correct paused state for video2"
      );
      is(
        video3.paused,
        shouldVideo3BePaused,
        "Correct paused state for video3"
      );
    }
  );
}