Gitiles
Code Review Sign In
korap.ids-mannheim.de / IDS-Mannheim / revealjs / 8043a480ea9b2251f38ff3d8cb4079f6f8b172e8 / . / inst / reveal.js-4.1.2 / test / test.html
blob: 260b43cde6a6dfcd4ace88b8cf32fb05853aae23 [file] [log] [blame]
Christophe Dervieuxe1893ae2021-10-07 17:09:02 +0200[diff] [blame]1<!doctype html>
2<html lang="en">
3
4 <head>
5 <meta charset="utf-8">
6
7 <title>reveal.js - Tests</title>
8
9 <link rel="stylesheet" href="../dist/reveal.css">
10 <link rel="stylesheet" href="../node_modules/qunit/qunit/qunit.css">
11 <script src="../node_modules/qunit/qunit/qunit.js"></script>
12 </head>
13
14 <body style="overflow: auto;">
15
16 <div id="qunit"></div>
17 <div id="qunit-fixture"></div>
18
19 <div class="reveal" style="visibility: hidden;">
20
21 <div class="slides">
22
23 <section data-visibility="hidden">
24 This should be remove by reveal.js before our tests run.
25 </section>
26
27 <section data-background-image="examples/assets/image1.png">
28 <h1>1</h1>
29 <img data-src="">
30 <video data-src=""></video>
31 <audio data-src=""></audio>
32 <aside class="notes">speaker notes 1</aside>
33 </section>
34
35 <section>
36 <section data-background="examples/assets/image2.png" data-notes="speaker notes 2">
37 <h1>2.1</h1>
38 </section>
39 <section>
40 <h1>2.2</h1>
41 </section>
42 <section>
43 <h1>2.3</h1>
44 </section>
45 </section>
46
47 <section id="fragment-slides">
48 <section>
49 <h1>3.1</h1>
50 <ul>
51 <li class="fragment">4.1</li>
52 <li class="fragment">4.2</li>
53 <li class="fragment">4.3</li>
54 </ul>
55 </section>
56
57 <section>
58 <h1>3.2</h1>
59 <ul>
60 <li class="fragment" data-fragment-index="0">4.1</li>
61 <li class="fragment" data-fragment-index="0">4.2</li>
62 </ul>
63 <iframe data-src="http://example.com"></iframe>
64 </section>
65
66 <section id="fragments3">
67 <h1>3.3</h1>
68 <ul>
69 <li class="fragment" data-fragment-index="1">3.3.1</li>
70 <li class="fragment" data-fragment-index="4">3.3.2</li>
71 <li class="fragment" data-fragment-index="4">3.3.3</li>
72 </ul>
73 </section>
74 </section>
75
76 <section>
77 <h1>4</h1>
78 </section>
79
80 </div>
81
82 </div>
83
84 <script src="../dist/reveal.js"></script>
85 <script>
86 window.location.hash = '';
87
88 Reveal.configure({maxScale: 1.11});
89
90 // These tests expect the DOM to contain a presentation
91 // with the following slide structure:
92 //
93 // 1
94 // 2 - Three sub-slides
95 // 3 - Three fragment elements
96 // 3 - Two fragments with same data-fragment-index
97 // 4
98 Reveal.initialize().then( function() {
99
100 // ---------------------------------------------------------------
101 // DOM TESTS
102
103 QUnit.module( 'DOM' );
104
105 QUnit.test( 'Initial slides classes', function( assert ) {
106 var horizontalSlides = document.querySelectorAll( '.reveal .slides>section' )
107
108 assert.strictEqual( document.querySelectorAll( '.reveal .slides section[data-visibility="hidden"]' ).length, 0, 'no data-visibility="hidden" slides' );
109 assert.strictEqual( document.querySelectorAll( '.reveal .slides section.past' ).length, 0, 'no .past slides' );
110 assert.strictEqual( document.querySelectorAll( '.reveal .slides section.present' ).length, 1, 'one .present slide' );
111 assert.strictEqual( document.querySelectorAll( '.reveal .slides>section.future' ).length, horizontalSlides.length - 1, 'remaining horizontal slides are .future' );
112
113 assert.strictEqual( document.querySelectorAll( '.reveal .slides section.stack' ).length, 2, 'two .stacks' );
114
115 assert.ok( document.querySelectorAll( '.reveal .slides section.stack' )[0].querySelectorAll( '.future' ).length > 0, 'vertical slides are given .future' );
116 });
117
118 // ---------------------------------------------------------------
119 // API TESTS
120
121 QUnit.module( 'API' );
122
123 QUnit.test( 'Reveal.configure before initialization', function( assert ) {
124 assert.strictEqual( Reveal.getConfig().maxScale, 1.11 );
125 });
126
127 QUnit.test( 'Reveal.isReady', function( assert ) {
128 assert.strictEqual( Reveal.isReady(), true, 'returns true' );
129 });
130
131 QUnit.test( 'Reveal.isOverview', function( assert ) {
132 assert.strictEqual( Reveal.isOverview(), false, 'false by default' );
133
134 Reveal.toggleOverview();
135 assert.strictEqual( Reveal.isOverview(), true, 'true after toggling on' );
136
137 Reveal.toggleOverview();
138 assert.strictEqual( Reveal.isOverview(), false, 'false after toggling off' );
139 });
140
141 QUnit.test( 'Reveal.isPaused', function( assert ) {
142 assert.strictEqual( Reveal.isPaused(), false, 'false by default' );
143
144 Reveal.togglePause();
145 assert.strictEqual( Reveal.isPaused(), true, 'true after pausing' );
146
147 Reveal.togglePause();
148 assert.strictEqual( Reveal.isPaused(), false, 'false after resuming' );
149 });
150
151 QUnit.test( 'Reveal.isFirstSlide', function( assert ) {
152 Reveal.slide( 0, 0 );
153 assert.strictEqual( Reveal.isFirstSlide(), true, 'true after Reveal.slide( 0, 0 )' );
154
155 Reveal.slide( 1, 0 );
156 assert.strictEqual( Reveal.isFirstSlide(), false, 'false after Reveal.slide( 1, 0 )' );
157
158 Reveal.slide( 0, 0 );
159 assert.strictEqual( Reveal.isFirstSlide(), true, 'true after Reveal.slide( 0, 0 )' );
160 });
161
162 QUnit.test( 'Reveal.isFirstSlide after vertical slide', function( assert ) {
163 Reveal.slide( 1, 1 );
164 Reveal.slide( 0, 0 );
165 assert.strictEqual( Reveal.isFirstSlide(), true, 'true after Reveal.slide( 1, 1 ) and then Reveal.slide( 0, 0 )' );
166 });
167
168 QUnit.test( 'Reveal.isLastSlide', function( assert ) {
169 Reveal.slide( 0, 0 );
170 assert.strictEqual( Reveal.isLastSlide(), false, 'false after Reveal.slide( 0, 0 )' );
171
172 var lastSlideIndex = document.querySelectorAll( '.reveal .slides>section' ).length - 1;
173
174 Reveal.slide( lastSlideIndex, 0 );
175 assert.strictEqual( Reveal.isLastSlide(), true, 'true after Reveal.slide( '+ lastSlideIndex +', 0 )' );
176
177 Reveal.slide( 0, 0 );
178 assert.strictEqual( Reveal.isLastSlide(), false, 'false after Reveal.slide( 0, 0 )' );
179 });
180
181 QUnit.test( 'Reveal.isLastSlide after vertical slide', function( assert ) {
182 var lastSlideIndex = document.querySelectorAll( '.reveal .slides>section' ).length - 1;
183
184 Reveal.slide( 1, 1 );
185 Reveal.slide( lastSlideIndex );
186 assert.strictEqual( Reveal.isLastSlide(), true, 'true after Reveal.slide( 1, 1 ) and then Reveal.slide( '+ lastSlideIndex +', 0 )' );
187 });
188
189 QUnit.test( 'Reveal.getTotalSlides', function( assert ) {
190 assert.strictEqual( Reveal.getTotalSlides(), 8, 'eight slides in total' );
191 });
192
193 QUnit.test( 'Reveal.getIndices', function( assert ) {
194 var indices = Reveal.getIndices();
195
196 assert.ok( indices.hasOwnProperty( 'h' ), 'h exists' );
197 assert.ok( indices.hasOwnProperty( 'v' ), 'v exists' );
198 assert.ok( indices.hasOwnProperty( 'f' ), 'f exists' );
199
200 Reveal.slide( 1, 0 );
201 assert.strictEqual( Reveal.getIndices().h, 1, 'h 1' );
202 assert.strictEqual( Reveal.getIndices().v, 0, 'v 0' );
203
204 Reveal.slide( 1, 2 );
205 assert.strictEqual( Reveal.getIndices().h, 1, 'h 1' );
206 assert.strictEqual( Reveal.getIndices().v, 2, 'v 2' );
207
208 Reveal.slide( 0, 0 );
209 assert.strictEqual( Reveal.getIndices().h, 0, 'h 0' );
210 assert.strictEqual( Reveal.getIndices().v, 0, 'v 0' );
211 });
212
213 QUnit.test( 'Reveal.getSlide', function( assert ) {
214 assert.equal( Reveal.getSlide( 0 ), document.querySelector( '.reveal .slides>section:first-child' ), 'gets correct first slide' );
215 assert.equal( Reveal.getSlide( 1 ), document.querySelector( '.reveal .slides>section:nth-child(2)' ), 'no v index returns stack' );
216 assert.equal( Reveal.getSlide( 1, 0 ), document.querySelector( '.reveal .slides>section:nth-child(2)>section:nth-child(1)' ), 'v index 0 returns first vertical child' );
217 assert.equal( Reveal.getSlide( 1, 1 ), document.querySelector( '.reveal .slides>section:nth-child(2)>section:nth-child(2)' ), 'v index 1 returns second vertical child' );
218
219 assert.strictEqual( Reveal.getSlide( 100 ), undefined, 'undefined when out of horizontal bounds' );
220 assert.strictEqual( Reveal.getSlide( 1, 100 ), undefined, 'undefined when out of vertical bounds' );
221 });
222
223 QUnit.test( 'Reveal.getSlideBackground', function( assert ) {
224 assert.equal( Reveal.getSlideBackground( 0 ), document.querySelector( '.reveal .backgrounds>.slide-background:first-child' ), 'gets correct first background' );
225 assert.equal( Reveal.getSlideBackground( 1 ), document.querySelector( '.reveal .backgrounds>.slide-background:nth-child(2)' ), 'no v index returns stack' );
226 assert.equal( Reveal.getSlideBackground( 1, 0 ), document.querySelector( '.reveal .backgrounds>.slide-background:nth-child(2) .slide-background:nth-child(2)' ), 'v index 0 returns first vertical child' );
227 assert.equal( Reveal.getSlideBackground( 1, 1 ), document.querySelector( '.reveal .backgrounds>.slide-background:nth-child(2) .slide-background:nth-child(3)' ), 'v index 1 returns second vertical child' );
228
229 assert.strictEqual( Reveal.getSlideBackground( 100 ), undefined, 'undefined when out of horizontal bounds' );
230 assert.strictEqual( Reveal.getSlideBackground( 1, 100 ), undefined, 'undefined when out of vertical bounds' );
231 });
232
233 QUnit.test( 'Reveal.getSlideNotes', function( assert ) {
234 Reveal.slide( 0, 0 );
235 assert.ok( Reveal.getSlideNotes() === 'speaker notes 1', 'works with <aside class="notes">' );
236
237 Reveal.slide( 1, 0 );
238 assert.ok( Reveal.getSlideNotes() === 'speaker notes 2', 'works with <section data-notes="">' );
239 });
240
241 QUnit.test( 'Reveal.getPreviousSlide/getCurrentSlide', function( assert ) {
242 Reveal.slide( 0, 0 );
243 Reveal.slide( 1, 0 );
244
245 var firstSlide = document.querySelector( '.reveal .slides>section:first-child' );
246 var secondSlide = document.querySelector( '.reveal .slides>section:nth-child(2)>section' );
247
248 assert.equal( Reveal.getPreviousSlide(), firstSlide, 'previous is slide #0' );
249 assert.equal( Reveal.getCurrentSlide(), secondSlide, 'current is slide #1' );
250 });
251
252 QUnit.test( 'Reveal.getProgress', function( assert ) {
253 Reveal.slide( 0, 0 );
254 assert.strictEqual( Reveal.getProgress(), 0, 'progress is 0 on first slide' );
255
256 var lastSlideIndex = document.querySelectorAll( '.reveal .slides>section' ).length - 1;
257
258 Reveal.slide( lastSlideIndex, 0 );
259 assert.strictEqual( Reveal.getProgress(), 1, 'progress is 1 on last slide' );
260 });
261
262 QUnit.test( 'Reveal.getScale', function( assert ) {
263 assert.ok( typeof Reveal.getScale() === 'number', 'has scale' );
264 });
265
266 QUnit.test( 'Reveal.getConfig', function( assert ) {
267 assert.ok( typeof Reveal.getConfig() === 'object', 'has config' );
268 });
269
270 QUnit.test( 'Reveal.configure', function( assert ) {
271 assert.strictEqual( Reveal.getConfig().loop, false, '"loop" is false to start with' );
272
273 Reveal.configure({ loop: true });
274 assert.strictEqual( Reveal.getConfig().loop, true, '"loop" has changed to true' );
275
276 Reveal.configure({ loop: false, customTestValue: 1 });
277 assert.strictEqual( Reveal.getConfig().customTestValue, 1, 'supports custom values' );
278 });
279
280 QUnit.test( 'Reveal.availableRoutes', function( assert ) {
281 Reveal.slide( 0, 0 );
282 assert.deepEqual( Reveal.availableRoutes(), { left: false, up: false, down: false, right: true }, 'correct for first slide' );
283
284 Reveal.slide( 1, 0 );
285 assert.deepEqual( Reveal.availableRoutes(), { left: true, up: false, down: true, right: true }, 'correct for vertical slide' );
286
287 Reveal.slide( 0, 0 );
288 assert.deepEqual( Reveal.availableRoutes({ includeFragments: true }), { left: false, up: false, down: false, right: true }, 'correct with fragments included' );
289 });
290
291 QUnit.test( 'Reveal.next', function( assert ) {
292 Reveal.slide( 0, 0 );
293
294 // Step through vertical child slides
295 Reveal.next();
296 assert.deepEqual( Reveal.getIndices(), { h: 1, v: 0, f: undefined } );
297
298 Reveal.next();
299 assert.deepEqual( Reveal.getIndices(), { h: 1, v: 1, f: undefined } );
300
301 Reveal.next();
302 assert.deepEqual( Reveal.getIndices(), { h: 1, v: 2, f: undefined } );
303
304 // Step through fragments
305 Reveal.next();
306 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: -1 } );
307
308 Reveal.next();
309 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 0 } );
310
311 Reveal.next();
312 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 1 } );
313
314 Reveal.next();
315 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 2 } );
316 });
317
318 QUnit.test( 'Reveal.next at end', function( assert ) {
319 Reveal.slide( 3 );
320
321 // We're at the end, this should have no effect
322 Reveal.next();
323 assert.deepEqual( Reveal.getIndices(), { h: 3, v: 0, f: undefined } );
324
325 Reveal.next();
326 assert.deepEqual( Reveal.getIndices(), { h: 3, v: 0, f: undefined } );
327 });
328
329
330 // ---------------------------------------------------------------
331 // URL TESTS
332
333 QUnit.module( 'URL' );
334
335 QUnit.test( 'Write (fragmentInURL: false)', function( assert ) {
336 Reveal.configure({ hash: true, fragmentInURL: false });
337
338 Reveal.slide( 2, 0 );
339 assert.strictEqual( window.location.hash, '#/2' );
340
341 Reveal.slide( 2, 1 );
342 assert.strictEqual( window.location.hash, '#/2/1' );
343
344 Reveal.slide( 2, 0, 1 );
345 assert.strictEqual( window.location.hash, '#/2' );
346
347 Reveal.slide( 2, 2, 0 );
348 assert.strictEqual( window.location.hash, '#/fragments3' );
349
350 Reveal.slide( 2, 2, 1 );
351 assert.strictEqual( window.location.hash, '#/fragments3' );
352 });
353
354 QUnit.test( 'Write (fragmentInURL: true)', function( assert ) {
355 Reveal.configure({ hash: true, fragmentInURL: true });
356
357 Reveal.slide( 2, 0, -1 );
358 assert.strictEqual( window.location.hash, '#/2' );
359
360 Reveal.slide( 2, 1, -1 );
361 assert.strictEqual( window.location.hash, '#/2/1' );
362
363 Reveal.slide( 2, 0, 1 );
364 assert.strictEqual( window.location.hash, '#/2/0/1' );
365
366 Reveal.slide( 2, 2, -1 );
367 assert.strictEqual( window.location.hash, '#/fragments3' );
368
369 Reveal.slide( 2, 2, 1 );
370 assert.strictEqual( window.location.hash, '#/fragments3/1' );
371 });
372
373 QUnit.test( 'Read', async function( assert ) {
374 Reveal.configure({ hash: true, fragmentInURL: true });
375
376 let test = function( hash, indices ) {
377 return new Promise( resolve => {
378 window.onhashchange = () => {
379 assert.deepEqual( Reveal.getIndices(), indices );
380 resolve();
381 };
382 window.location.hash = hash;
383 } );
384 }
385
386 await test( '#/0', { h: 0, v: 0, f: undefined } ); // horizontal
387 await test( '#/1/1', { h: 1, v: 1, f: undefined } ); // vertical
388 await test( '#/0/', { h: 0, v: 0, f: undefined } ); // trailing /
389 await test( '#/1/1/', { h: 1, v: 1, f: undefined } ); // trailing /
390 await test( '#/2/0/1', { h: 2, v: 0, f: 1 } ); // fragment
391 });
392
393 // ---------------------------------------------------------------
394 // KEYBOARD TESTS
395
396 QUnit.module( 'Keyboard' );
397
398 QUnit.test( 'Add key bindings', function( assert ) {
399 var done = assert.async( 1 );
400
401 Reveal.addKeyBinding({keyCode: 88, key: 'X', description: 'X-SHORTCUT-X'}, function() {
402 assert.ok( true, 'callback triggered' );
403 done();
404 } );
405
406 Reveal.toggleHelp( true );
407 assert.ok( /X\-SHORTCUT\-X/.test( document.body.innerHTML ), 'binding is added to help overlay' );
408 Reveal.toggleHelp( false );
409
410 let event = new KeyboardEvent( 'keydown', { 'keyCode':88 } );
411 document.dispatchEvent( event );
412
413 Reveal.removeKeyBinding( 88 );
414
415 // should do nothing
416 document.dispatchEvent( event );
417 });
418
419 // ---------------------------------------------------------------
420 // FRAGMENT TESTS
421
422 QUnit.module( 'Fragments' );
423
424 QUnit.test( 'Sliding to fragments', function( assert ) {
425 Reveal.slide( 2, 0, -1 );
426 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: -1 }, 'Reveal.slide( 2, 0, -1 )' );
427
428 Reveal.slide( 2, 0, 0 );
429 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 0 }, 'Reveal.slide( 2, 0, 0 )' );
430
431 Reveal.slide( 2, 0, 2 );
432 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 2 }, 'Reveal.slide( 2, 0, 2 )' );
433
434 Reveal.slide( 2, 0, 1 );
435 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 1 }, 'Reveal.slide( 2, 0, 1 )' );
436 });
437
438 QUnit.test( 'data-fragment is set on slide <section>', function( assert ) {
439 Reveal.slide( 2, 0, -1 );
440 assert.deepEqual( Reveal.getCurrentSlide().getAttribute( 'data-fragment' ), '-1' );
441
442 Reveal.slide( 2, 0, 2 );
443 assert.deepEqual( Reveal.getCurrentSlide().getAttribute( 'data-fragment' ), '2' );
444
445 Reveal.slide( 2, 0, 0 );
446 assert.deepEqual( Reveal.getCurrentSlide().getAttribute( 'data-fragment' ), '0' );
447
448 var fragmentSlide = Reveal.getCurrentSlide();
449
450 Reveal.slide( 3, 0 );
451 assert.deepEqual( fragmentSlide.getAttribute( 'data-fragment' ), '0', 'data-fragment persists when jumping to another slide' );
452 });
453
454 QUnit.test( 'Hiding all fragments', function( assert ) {
455 var fragmentSlide = document.querySelector( '#fragment-slides>section:nth-child(1)' );
456
457 Reveal.slide( 2, 0, 0 );
458 assert.strictEqual( fragmentSlide.querySelectorAll( '.fragment.visible' ).length, 1, 'one fragment visible when index is 0' );
459
460 Reveal.slide( 2, 0, -1 );
461 assert.strictEqual( fragmentSlide.querySelectorAll( '.fragment.visible' ).length, 0, 'no fragments visible when index is -1' );
462 });
463
464 QUnit.test( 'Current fragment', function( assert ) {
465 var fragmentSlide = document.querySelector( '#fragment-slides>section:nth-child(1)' );
466 var lastFragmentIndex = [].slice.call( fragmentSlide.querySelectorAll( '.fragment' ) ).pop().getAttribute( 'data-fragment-index' );
467
468 Reveal.slide( 2, 0 );
469 assert.strictEqual( fragmentSlide.querySelectorAll( '.fragment.current-fragment' ).length, 0, 'no current fragment at index -1' );
470
471 Reveal.slide( 2, 0, 0 );
472 assert.strictEqual( fragmentSlide.querySelectorAll( '.fragment.current-fragment' ).length, 1, 'one current fragment at index 0' );
473
474 Reveal.slide( 1, 0, 0 );
475 assert.strictEqual( fragmentSlide.querySelectorAll( '.fragment.current-fragment' ).length, 0, 'no current fragment when navigating to previous slide' );
476
477 Reveal.slide( 3, 0, 0 );
478 assert.strictEqual( fragmentSlide.querySelectorAll( '.fragment.current-fragment' ).length, 0, 'no current fragment when navigating to next slide' );
479
480 Reveal.slide( 2, 1, -1 );
481 Reveal.prev();
482 assert.strictEqual( fragmentSlide.querySelector( '.fragment.current-fragment' ).getAttribute( 'data-fragment-index' ), lastFragmentIndex, 'last fragment is current fragment when returning from future slide' );
483 });
484
485 QUnit.test( 'Stepping through fragments', function( assert ) {
486 Reveal.slide( 2, 0, -1 );
487
488 // forwards:
489
490 Reveal.next();
491 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 0 }, 'next() goes to next fragment' );
492
493 Reveal.right();
494 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 1 }, 'right() goes to next fragment' );
495
496 Reveal.down();
497 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 2 }, 'down() goes to next fragment' );
498
499 Reveal.down(); // moves to f #3
500
501 // backwards:
502
503 Reveal.prev();
504 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 2 }, 'prev() goes to prev fragment' );
505
506 Reveal.left();
507 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 1 }, 'left() goes to prev fragment' );
508
509 Reveal.up();
510 assert.deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 0 }, 'up() goes to prev fragment' );
511 });
512
513 QUnit.test( 'Stepping past fragments', function( assert ) {
514 var fragmentSlide = document.querySelector( '#fragment-slides>section:nth-child(1)' );
515
516 Reveal.slide( 0, 0, 0 );
517 assert.equal( fragmentSlide.querySelectorAll( '.fragment.visible' ).length, 0, 'no fragments visible when on previous slide' );
518
519 Reveal.slide( 3, 0, 0 );
520 assert.equal( fragmentSlide.querySelectorAll( '.fragment.visible' ).length, 3, 'all fragments visible when on future slide' );
521 });
522
523 QUnit.test( 'Fragment indices', function( assert ) {
524 var fragmentSlide = document.querySelector( '#fragment-slides>section:nth-child(2)' );
525
526 Reveal.slide( 3, 0, 0 );
527 assert.equal( fragmentSlide.querySelectorAll( '.fragment.visible' ).length, 2, 'both fragments of same index are shown' );
528
529 // This slide has three fragments, first one is index 0, second and third have index 1
530 Reveal.slide( 2, 2, 0 );
531 assert.equal( Reveal.getIndices().f, 0, 'returns correct index for first fragment' );
532
533 Reveal.slide( 2, 2, 1 );
534 assert.equal( Reveal.getIndices().f, 1, 'returns correct index for two fragments with same index' );
535 });
536
537 QUnit.test( 'Index generation', function( assert ) {
538 var fragmentSlide = document.querySelector( '#fragment-slides>section:nth-child(1)' );
539
540 // These have no indices defined to start with
541 assert.equal( fragmentSlide.querySelectorAll( '.fragment' )[0].getAttribute( 'data-fragment-index' ), '0' );
542 assert.equal( fragmentSlide.querySelectorAll( '.fragment' )[1].getAttribute( 'data-fragment-index' ), '1' );
543 assert.equal( fragmentSlide.querySelectorAll( '.fragment' )[2].getAttribute( 'data-fragment-index' ), '2' );
544 });
545
546 QUnit.test( 'Index normalization', function( assert ) {
547 var fragmentSlide = document.querySelector( '#fragment-slides>section:nth-child(3)' );
548
549 // These start out as 1-4-4 and should normalize to 0-1-1
550 assert.equal( fragmentSlide.querySelectorAll( '.fragment' )[0].getAttribute( 'data-fragment-index' ), '0' );
551 assert.equal( fragmentSlide.querySelectorAll( '.fragment' )[1].getAttribute( 'data-fragment-index' ), '1' );
552 assert.equal( fragmentSlide.querySelectorAll( '.fragment' )[2].getAttribute( 'data-fragment-index' ), '1' );
553 });
554
555 QUnit.test( 'fragmentshown event', function( assert ) {
556 assert.expect( 2 );
557 var done = assert.async( 2 );
558
559 var _onEvent = function( event ) {
560 assert.ok( true, 'event fired' );
561 done();
562 }
563
564 Reveal.on( 'fragmentshown', _onEvent );
565
566 Reveal.slide( 2, 0 );
567 Reveal.slide( 2, 0 ); // should do nothing
568 Reveal.slide( 2, 0, 0 ); // should do nothing
569 Reveal.next();
570 Reveal.next();
571 Reveal.prev(); // shouldn't fire fragmentshown
572
573 Reveal.off( 'fragmentshown', _onEvent );
574 });
575
576 QUnit.test( 'fragmenthidden event', function( assert ) {
577 assert.expect( 2 );
578 var done = assert.async( 2 );
579
580 var _onEvent = function( event ) {
581 assert.ok( true, 'event fired' );
582 done();
583 }
584
585 Reveal.on( 'fragmenthidden', _onEvent );
586
587 Reveal.slide( 2, 0, 2 );
588 Reveal.slide( 2, 0, 2 ); // should do nothing
589 Reveal.prev();
590 Reveal.prev();
591 Reveal.next(); // shouldn't fire fragmenthidden
592
593 Reveal.off( 'fragmenthidden', _onEvent );
594 });
595
596
597 // ---------------------------------------------------------------
598 // AUTO-SLIDE TESTS
599
600 QUnit.module( 'Auto Sliding' );
601
602 QUnit.test( 'Reveal.isAutoSliding', function( assert ) {
603 assert.strictEqual( Reveal.isAutoSliding(), false, 'false by default' );
604
605 Reveal.configure({ autoSlide: 10000 });
606 assert.strictEqual( Reveal.isAutoSliding(), true, 'true after starting' );
607
608 Reveal.configure({ autoSlide: 0 });
609 assert.strictEqual( Reveal.isAutoSliding(), false, 'false after setting to 0' );
610 });
611
612 QUnit.test( 'Reveal.toggleAutoSlide', function( assert ) {
613 Reveal.configure({ autoSlide: 10000 });
614
615 Reveal.toggleAutoSlide();
616 assert.strictEqual( Reveal.isAutoSliding(), false, 'false after first toggle' );
617 Reveal.toggleAutoSlide();
618 assert.strictEqual( Reveal.isAutoSliding(), true, 'true after second toggle' );
619
620 Reveal.configure({ autoSlide: 0 });
621 });
622
623 QUnit.test( 'autoslidepaused', function( assert ) {
624 assert.expect( 1 );
625 var done = assert.async();
626
627 var _onEvent = function( event ) {
628 assert.ok( true, 'event fired' );
629 done();
630 }
631
632 Reveal.on( 'autoslidepaused', _onEvent );
633 Reveal.configure({ autoSlide: 10000 });
634 Reveal.toggleAutoSlide();
635
636 // cleanup
637 Reveal.configure({ autoSlide: 0 });
638 Reveal.off( 'autoslidepaused', _onEvent );
639 });
640
641 QUnit.test( 'autoslideresumed', function( assert ) {
642 assert.expect( 1 );
643 var done = assert.async();
644
645 var _onEvent = function( event ) {
646 assert.ok( true, 'event fired' );
647 done();
648 }
649
650 Reveal.on( 'autoslideresumed', _onEvent );
651 Reveal.configure({ autoSlide: 10000 });
652 Reveal.toggleAutoSlide();
653 Reveal.toggleAutoSlide();
654
655 // cleanup
656 Reveal.configure({ autoSlide: 0 });
657 Reveal.off( 'autoslideresumed', _onEvent );
658 });
659
660
661 // ---------------------------------------------------------------
662 // CONFIGURATION VALUES
663
664 QUnit.module( 'Configuration' );
665
666 QUnit.test( 'Controls', function( assert ) {
667 var controlsElement = document.querySelector( '.reveal>.controls' );
668
669 Reveal.configure({ controls: false });
670 assert.equal( controlsElement.style.display, 'none', 'controls are hidden' );
671
672 Reveal.configure({ controls: true });
673 assert.equal( controlsElement.style.display, 'block', 'controls are visible' );
674 });
675
676 QUnit.test( 'Progress', function( assert ) {
677 var progressElement = document.querySelector( '.reveal>.progress' );
678
679 Reveal.configure({ progress: false });
680 assert.equal( progressElement.style.display, 'none', 'progress are hidden' );
681
682 Reveal.configure({ progress: true });
683 assert.equal( progressElement.style.display, 'block', 'progress are visible' );
684 });
685
686 QUnit.test( 'Loop', function( assert ) {
687 Reveal.configure({ loop: true });
688
689 Reveal.slide( 0, 0 );
690
691 Reveal.left();
692 assert.notEqual( Reveal.getIndices().h, 0, 'looped from start to end' );
693
694 Reveal.right();
695 assert.equal( Reveal.getIndices().h, 0, 'looped from end to start' );
696
697 Reveal.configure({ loop: false });
698 });
699
700
701 // ---------------------------------------------------------------
702 // LAZY-LOADING TESTS
703
704 QUnit.module( 'Lazy-Loading' );
705
706 QUnit.test( 'img with data-src', function( assert ) {
707 assert.strictEqual( document.querySelectorAll( '.reveal section img[src]' ).length, 1, 'Image source has been set' );
708 });
709
710 QUnit.test( 'video with data-src', function( assert ) {
711 assert.strictEqual( document.querySelectorAll( '.reveal section video[src]' ).length, 1, 'Video source has been set' );
712 });
713
714 QUnit.test( 'audio with data-src', function( assert ) {
715 assert.strictEqual( document.querySelectorAll( '.reveal section audio[src]' ).length, 1, 'Audio source has been set' );
716 });
717
718 QUnit.test( 'iframe with data-src', function( assert ) {
719 Reveal.slide( 0, 0 );
720 assert.strictEqual( document.querySelectorAll( '.reveal section iframe[src]' ).length, 0, 'Iframe source is not set' );
721 Reveal.slide( 2, 1 );
722 assert.strictEqual( document.querySelectorAll( '.reveal section iframe[src]' ).length, 1, 'Iframe source is set' );
723 Reveal.slide( 2, 2 );
724 assert.strictEqual( document.querySelectorAll( '.reveal section iframe[src]' ).length, 0, 'Iframe source is not set' );
725 });
726
727 QUnit.test( 'background images', function( assert ) {
728 var imageSource1 = Reveal.getSlide( 0 ).getAttribute( 'data-background-image' );
729 var imageSource2 = Reveal.getSlide( 1, 0 ).getAttribute( 'data-background' );
730
731 // check that the images are applied to the background elements
732 assert.ok( Reveal.getSlideBackground( 0 ).querySelector( '.slide-background-content' ).style.backgroundImage.indexOf( imageSource1 ) !== -1, 'data-background-image worked' );
733 assert.ok( Reveal.getSlideBackground( 1, 0 ).querySelector( '.slide-background-content' ).style.backgroundImage.indexOf( imageSource2 ) !== -1, 'data-background worked' );
734 });
735
736
737 // ---------------------------------------------------------------
738 // EVENT TESTS
739
740 QUnit.module( 'Events' );
741
742 QUnit.test( 'slidechanged', function( assert ) {
743 assert.expect( 3 );
744 var done = assert.async( 3 );
745
746 var _onEvent = function( event ) {
747 assert.ok( true, 'event fired' );
748 done();
749 }
750
751 Reveal.on( 'slidechanged', _onEvent );
752
753 Reveal.slide( 1, 0 ); // should trigger
754 Reveal.slide( 1, 0 ); // should do nothing
755 Reveal.next(); // should trigger
756 Reveal.slide( 3, 0 ); // should trigger
757 Reveal.next(); // should do nothing
758
759 Reveal.off( 'slidechanged', _onEvent );
760
761 });
762
763 /* Fails intermittently...
764 QUnit.test( 'slidetransitionend', function( assert ) {
765 assert.expect( 2 );
766 let done = assert.async( 2 );
767 let time = Date.now();
768
769 let horizontalCallback = event => {
770 assert.ok( Date.now() - time > 200, 'horizontal event fired' );
771 done();
772
773 let verticalCallback = event => {
774 assert.ok( true, 'vertical event fired' );
775 done();
776 Reveal.off( 'slidetransitionend', verticalCallback );
777 }
778
779 Reveal.off( 'slidetransitionend', horizontalCallback );
780 Reveal.on( 'slidetransitionend', verticalCallback );
781 Reveal.slide( 1, 1 );
782 }
783
784 Reveal.slide( 0, 0 );
785 Reveal.on( 'slidetransitionend', horizontalCallback );
786 Reveal.slide( 1, 0 );
787
788 });
789 */
790
791 QUnit.test( 'paused', function( assert ) {
792 assert.expect( 1 );
793 var done = assert.async();
794
795 var _onEvent = function( event ) {
796 assert.ok( true, 'event fired' );
797 done();
798 }
799
800 Reveal.on( 'paused', _onEvent );
801
802 Reveal.togglePause();
803 Reveal.togglePause();
804
805 Reveal.off( 'paused', _onEvent );
806 });
807
808 QUnit.test( 'resumed', function( assert ) {
809 assert.expect( 1 );
810 var done = assert.async();
811
812 var _onEvent = function( event ) {
813 assert.ok( true, 'event fired' );
814 done();
815 }
816
817 Reveal.on( 'resumed', _onEvent );
818
819 Reveal.togglePause();
820 Reveal.togglePause();
821
822 Reveal.off( 'resumed', _onEvent );
823 });
824
825 } );
826 </script>
827
828 </body>
829</html>