mediametadata.html (13869B)
1 <!DOCTYPE html> 2 <title>MediaMetadata interface</title> 3 <script src=/resources/testharness.js></script> 4 <script src="/resources/testharnessreport.js"></script> 5 <script> 6 7 function load_iframe(src) { 8 return new Promise(resolve => { 9 const iframe = document.createElement('iframe'); 10 iframe.onload = () => { resolve(iframe); }; 11 iframe.src = src; 12 iframe.style.display = 'none'; 13 document.documentElement.appendChild(iframe); 14 }); 15 } 16 17 test(function() { 18 var metadata = new MediaMetadata({}); 19 navigator.mediaSession.metadata = metadata; 20 assert_equals(navigator.mediaSession.metadata, metadata); 21 }, "Test that mediaSession.metadata is properly set"); 22 23 test(function() { 24 var metadata = new MediaMetadata({}); 25 navigator.mediaSession.metadata = metadata; 26 metadata.title = 'foo'; 27 assert_equals(navigator.mediaSession.metadata.title, 'foo'); 28 }, "Test that changes to metadata propagate properly"); 29 30 test(function() { 31 var metadata = new MediaMetadata({}); 32 navigator.mediaSession.metadata = metadata; 33 navigator.mediaSession.metadata = null; 34 assert_equals(navigator.mediaSession.metadata, null); 35 }, "Test that resetting metadata to null is reflected"); 36 37 test(function() { 38 var metadata = new MediaMetadata({}); 39 assert_not_equals(metadata, null); 40 41 assert_throws_js(TypeError, _ => new MediaMetadata('foobar')); 42 assert_throws_js(TypeError, _ => new MediaMetadata(42)); 43 }, 'Test that MediaMetadata is constructed using a dictionary'); 44 45 test(function() { 46 var metadata = new MediaMetadata(); 47 assert_not_equals(metadata, null); 48 }, "Test that MediaMetadata constructor can take no parameter"); 49 50 test(function() { 51 var image1 = { src: 'http://example.com/1', sizes: 'sizes1', type: 'type1' }; 52 var image2 = { src: 'http://example.com/2', sizes: 'sizes2', type: 'type2' }; 53 var chapter1_image1 = { src: 'http://chapterexample.com/1', sizes: '128x128', type: 'image/png' }; 54 var chapter1_image2 = { src: 'http://chapterexample.com/2', sizes: '512x512', type: 'image/png' }; 55 var chapter2_image1 = { src: 'http://chapterexample.com/3', sizes: '128x128', type: 'image/png' }; 56 var chapter2_image2 = { src: 'http://chapterexample.com/4', sizes: '512x512', type: 'image/png' }; 57 var metadata = new MediaMetadata({ 58 title: 'foo', album: 'bar', artist: 'plop', artwork: [image1, image2], 59 chapterInfo: [{ 60 title: 'Chapter 1', 61 startTime: 0, 62 artwork: [ 63 chapter1_image1, 64 chapter1_image2 65 ] 66 }, { 67 title: 'Chapter 2', 68 startTime: 16, 69 artwork: [ 70 chapter2_image1, 71 chapter2_image2, 72 ] 73 }] 74 }); 75 76 assert_equals(metadata.title, 'foo'); 77 assert_equals(metadata.album, 'bar'); 78 assert_equals(metadata.artist, 'plop'); 79 assert_equals(metadata.artwork.length, 2); 80 assert_equals(metadata.artwork[0].src, image1.src); 81 assert_equals(metadata.artwork[0].sizes, image1.sizes); 82 assert_equals(metadata.artwork[0].type, image1.type); 83 assert_equals(metadata.artwork[1].src, image2.src); 84 assert_equals(metadata.artwork[1].sizes, image2.sizes); 85 assert_equals(metadata.artwork[1].type, image2.type); 86 assert_equals(metadata.chapterInfo[0].title, 'Chapter 1'); 87 assert_equals(metadata.chapterInfo[0].startTime, 0); 88 assert_equals(metadata.chapterInfo[0].artwork[0].src, chapter1_image1.src); 89 assert_equals(metadata.chapterInfo[0].artwork[1].src, chapter1_image2.src); 90 assert_equals(metadata.chapterInfo[0].artwork[0].sizes, chapter1_image1.sizes); 91 assert_equals(metadata.chapterInfo[0].artwork[1].sizes, chapter1_image2.sizes); 92 assert_equals(metadata.chapterInfo[0].artwork[0].type, chapter1_image1.type); 93 assert_equals(metadata.chapterInfo[0].artwork[1].type, chapter1_image2.type); 94 assert_equals(metadata.chapterInfo[1].title, 'Chapter 2'); 95 assert_equals(metadata.chapterInfo[1].startTime, 16); 96 assert_equals(metadata.chapterInfo[1].artwork[0].src, chapter2_image1.src); 97 assert_equals(metadata.chapterInfo[1].artwork[1].src, chapter2_image2.src); 98 assert_equals(metadata.chapterInfo[1].artwork[0].sizes, chapter2_image1.sizes); 99 assert_equals(metadata.chapterInfo[1].artwork[1].sizes, chapter2_image2.sizes); 100 assert_equals(metadata.chapterInfo[1].artwork[0].type, chapter2_image1.type); 101 assert_equals(metadata.chapterInfo[1].artwork[1].type, chapter2_image2.type); 102 }, 'Test the different values allowed in MediaMetadata init dictionary'); 103 104 test(function() { 105 var metadata = new MediaMetadata({}); 106 assert_equals(metadata.title, ''); 107 assert_equals(metadata.artist, ''); 108 assert_equals(metadata.album, ''); 109 assert_equals(0, metadata.artwork.length); 110 assert_equals(0, metadata.chapterInfo.length); 111 }, 'Test the default values for MediaMetadata with empty init dictionary'); 112 113 test(function() { 114 var metadata = new MediaMetadata(); 115 assert_equals(metadata.title, ''); 116 assert_equals(metadata.artist, ''); 117 assert_equals(metadata.album, ''); 118 assert_equals(0, metadata.artwork.length); 119 assert_equals(0, metadata.chapterInfo.length); 120 }, 'Test the default values for MediaMetadata with no init dictionary'); 121 122 test(function() { 123 var metadata = new MediaMetadata({ randomValueThatWillNotBeAdded: '... hopefully ;)' }); 124 assert_equals(metadata.randomValueThatWillNotBeAdded, undefined); 125 }, 'Test that passing unknown values to the dictionary is a no-op'); 126 127 test(function() { 128 var image1 = { src: 'http://example.com/1', sizes: 'sizes1', type: 'type1' }; 129 var image2 = { src: 'http://example.com/2', sizes: 'sizes2', type: 'type2' }; 130 var chapter1_image1 = { src: 'http://chapterexample.com/1', sizes: '128x128', type: 'image/png' }; 131 var chapter1_image2 = { src: 'http://chapterexample.com/2', sizes: '512x512', type: 'image/png' }; 132 var chapter2_image1 = { src: 'http://chapterexample.com/3', sizes: '128x128', type: 'image/png' }; 133 var chapter2_image2 = { src: 'http://chapterexample.com/4', sizes: '512x512', type: 'image/png' }; 134 135 var metadata = new MediaMetadata({ 136 title: 'foo', album: 'bar', artist: 'plop', artwork: [image1, image2], 137 chapterInfo: [{ 138 title: 'Chapter 1', 139 startTime: 0, 140 artwork: [ 141 chapter1_image1, 142 chapter1_image2 143 ] 144 }, { 145 title: 'Chapter 2', 146 startTime: 16, 147 artwork: [ 148 chapter2_image1, 149 chapter2_image2, 150 ] 151 }] 152 }); 153 154 metadata.title = 'something else'; 155 assert_equals(metadata.title, 'something else'); 156 157 metadata.album = 'other value'; 158 assert_equals(metadata.album, 'other value'); 159 160 metadata.artist = 'someone else'; 161 assert_equals(metadata.artist, 'someone else'); 162 163 var image = { src: 'http://example.com/', sizes: '40x40', type: 'image/png' }; 164 metadata.artwork = [ image ]; 165 assert_equals(metadata.artwork.length, 1); 166 assert_equals(metadata.artwork[0].src, 'http://example.com/'); 167 assert_equals(metadata.artwork[0].sizes, '40x40'); 168 assert_equals(metadata.artwork[0].type, 'image/png'); 169 170 // The chapterInfo cannot be modified. 171 var chapter_image = { src: 'http://example.com/', sizes: '40x40', type: 'image/png' }; 172 var chapter = { 173 title: 'Chapter 3', 174 startTime: 22, 175 artwork: [chapter_image] 176 }; 177 metadata.chapterInfo = [chapter]; 178 assert_equals(metadata.chapterInfo[0].title, 'Chapter 1'); 179 assert_equals(metadata.chapterInfo[0].startTime, 0); 180 assert_equals(metadata.chapterInfo.length, 2); 181 }, "Test that MediaMetadata is read/write"); 182 183 test(function() { 184 var metadata = new MediaMetadata({ artwork: [ { src: 'http://foo.com/' } ] }); 185 assert_throws_js(TypeError, _ => { 186 metadata.artwork.push({ 187 src: 'http://example.com/', sizes: '40x40', type: 'image/png', 188 }); 189 }); 190 191 metadata.artwork[0].src = 'bar'; 192 assert_equals(metadata.artwork[0].src, 'http://foo.com/'); 193 }, "Test that MediaMetadata.artwork can't be modified"); 194 195 test(function() { 196 var metadata = new MediaMetadata({ artwork: [{ 197 src: 'http://example.com/', sizes: '40x40', type: 'image/png', 198 some_other_value: 'foo', 199 }]}); 200 assert_equals(metadata.artwork[0].src, 'http://example.com/'); 201 assert_equals(metadata.artwork[0].sizes, '40x40'); 202 assert_equals(metadata.artwork[0].type, 'image/png'); 203 assert_false('some_other_value' in metadata.artwork[0]); 204 205 metadata.artwork[0].something_else = 'bar'; 206 assert_false('something_else' in metadata.artwork[0]); 207 }, "Test that MediaMetadata.artwork will not expose unknown properties"); 208 209 test(function() { 210 var metadata = new MediaMetadata({ artwork: [ 211 { src: 'http://example.com/1', sizes: '40x40', type: 'image/png' }, 212 { src: 'http://example.com/2', sizes: '40x40', type: 'image/png' }, 213 ]}); 214 215 assert_true(Object.isFrozen(metadata.artwork)); 216 for (var i = 0; i < metadata.artwork.length; ++i) 217 assert_true(Object.isFrozen(metadata.artwork[i])); 218 }, "Test that MediaMetadata.artwork is Frozen"); 219 220 test(function() { 221 var chapter1_image1 = { src: 'http://chapterexample.com/1', sizes: '128x128', type: 'image/png' }; 222 var chapter1_image2 = { src: 'http://chapterexample.com/2', sizes: '512x512', type: 'image/png' }; 223 var chapter2_image1 = { src: 'http://chapterexample.com/3', sizes: '128x128', type: 'image/png' }; 224 var chapter2_image2 = { src: 'http://chapterexample.com/4', sizes: '512x512', type: 'image/png' }; 225 var metadata = new MediaMetadata({ 226 chapterInfo: [{ 227 title: 'Chapter 1', 228 startTime: 0, 229 artwork: [ 230 chapter1_image1, 231 chapter1_image2 232 ] 233 }, { 234 title: 'Chapter 2', 235 startTime: 16, 236 artwork: [ 237 chapter2_image1, 238 chapter2_image2, 239 ] 240 }] 241 }); 242 243 assert_true(Object.isFrozen(metadata.chapterInfo)); 244 for (var i = 0; i < metadata.chapterInfo.length; ++i) 245 assert_true(Object.isFrozen(metadata.chapterInfo[i])); 246 }, "Test that MediaMetadata.chapterInfo is Frozen"); 247 248 test(function() { 249 var metadata = new MediaMetadata({ artwork: [ 250 { src: 'http://example.com', sizes: '40x40', type: 'image/png' }, 251 { src: '../foo', sizes: '40x40', type: 'image/png' }, 252 { src: '/foo/bar', sizes: '40x40', type: 'image/png' }, 253 ]}); 254 255 assert_equals(metadata.artwork[0].src, new URL('http://example.com', document.URL).href) 256 assert_equals(metadata.artwork[1].src, new URL('../foo', document.URL).href) 257 assert_equals(metadata.artwork[2].src, new URL('/foo/bar', document.URL).href) 258 }, "Test that MediaMetadata.artwork returns parsed urls"); 259 260 test(function() { 261 var chapter1_image1 = { src: 'http://chapterexample.com/1', sizes: '128x128', type: 'image/png' }; 262 var chapter1_image2 = { src: 'http://chapterexample.com/2', sizes: '512x512', type: 'image/png' }; 263 var chapter2_image1 = { src: 'http://chapterexample.com/3', sizes: '128x128', type: 'image/png' }; 264 var chapter2_image2 = { src: 'http://chapterexample.com/4', sizes: '512x512', type: 'image/png' }; 265 var metadata = new MediaMetadata({ 266 chapterInfo: [{ 267 title: 'Chapter 1', 268 startTime: 0, 269 artwork: [ 270 chapter1_image1, 271 chapter1_image2 272 ] 273 }, { 274 title: 'Chapter 2', 275 startTime: 16, 276 artwork: [ 277 chapter2_image1, 278 chapter2_image2, 279 ] 280 }] 281 }); 282 283 assert_equals(metadata.chapterInfo[0].artwork[0].src, 284 new URL('http://chapterexample.com/1', document.URL).href) 285 assert_equals(metadata.chapterInfo[0].artwork[1].src, 286 new URL('http://chapterexample.com/2', document.URL).href) 287 assert_equals(metadata.chapterInfo[1].artwork[0].src, 288 new URL('http://chapterexample.com/3', document.URL).href) 289 assert_equals(metadata.chapterInfo[1].artwork[1].src, 290 new URL('http://chapterexample.com/4', document.URL).href) 291 }, "Test that MediaMetadata.chapterInfo's artwork returns parsed urls"); 292 293 test(function() { 294 var metadata = 42; 295 296 assert_throws_js(TypeError, _ => { 297 metadata = 298 new MediaMetadata({ artwork: [ { src: 'http://[example.com]' }] }); 299 }); 300 assert_equals(metadata, 42); 301 302 metadata = new MediaMetadata(); 303 assert_throws_js(TypeError, _ => { 304 metadata.artwork = [ 305 // Valid url. 306 { src: 'http://example.com' }, 307 // Invalid url. 308 { src: 'http://example.com:demo' }, 309 ]; 310 }); 311 assert_equals(metadata.artwork.length, 0); 312 313 assert_throws_js(TypeError, _ => { 314 metadata = 315 new MediaMetadata({ 316 chapterInfo: [{ 317 title: 'Chapter 1', 318 startTime: 0, 319 artwork: [ 320 // Valid url. 321 { src: 'http://example.com' }, 322 // Invalid url. 323 { src: 'http://example.com:demo' }, 324 ] 325 }] 326 }); 327 }); 328 assert_equals(metadata.chapterInfo.length, 0); 329 }, "Test that MediaMetadata throws when setting an invalid url"); 330 331 test(function() { 332 var metadata = new MediaMetadata({ artwork: [ { src: 'foo.jpg' } ] }); 333 assert_equals(metadata.artwork[0].type, ''); 334 assert_equals(metadata.artwork[0].sizes, ''); 335 }, "Test MediaImage default values"); 336 337 test(function() { 338 assert_throws_js(TypeError, _ => { 339 new MediaMetadata({ artwork: [ {} ] }) 340 }); 341 342 var metadata = new MediaMetadata(); 343 assert_throws_js(TypeError, _ => { 344 metadata.artwork = [ { type: 'image/png', sizes: '40x40' } ]; 345 }); 346 347 assert_throws_js(TypeError, _ => { 348 metadata = 349 new MediaMetadata({ 350 chapterInfo: [{ 351 title: 'Chapter 1', 352 startTime: 0, 353 artwork: [{ type: 'image/png', sizes: '40x40' }] 354 }] 355 }); 356 }); 357 }, "Test that MediaImage.src is required") 358 359 promise_test(async t => { 360 const URLs = [ 361 'http://example.com', 362 '../foo', 363 './foo/bar', 364 '/foo/bar', 365 ]; 366 const subframe = await load_iframe('helper/artwork-generator.html'); 367 // createArtworkFromURLs is a function in the subframe. 368 const artwork = subframe.contentWindow.createArtworkFromURLs(URLs); 369 370 assert_equals(artwork.length, URLs.length); 371 for (let i = 0 ; i < artwork.length ; ++i) { 372 assert_equals(artwork[i].src, new URL(URLs[i], subframe.contentDocument.URL).href); 373 } 374 }, 'Test that the base URL of MediaImage is the base URL of entry setting object'); 375 376 </script>