diff options
Diffstat (limited to 'test')
-rw-r--r-- | test/examples/barebones.html | 1 | ||||
-rw-r--r-- | test/examples/slide-backgrounds.html | 23 | ||||
-rw-r--r-- | test/test-element-attributes-markdown.html | 82 | ||||
-rw-r--r-- | test/test-element-attributes-markdown.js | 38 | ||||
-rw-r--r-- | test/test-markdown-attributes.html | 128 | ||||
-rw-r--r-- | test/test-markdown-attributes.js | 47 | ||||
-rw-r--r-- | test/test.js | 10 |
7 files changed, 327 insertions, 2 deletions
diff --git a/test/examples/barebones.html b/test/examples/barebones.html index 5c03ff3..c948d00 100644 --- a/test/examples/barebones.html +++ b/test/examples/barebones.html @@ -29,7 +29,6 @@ </div> - <script src="../../lib/js/head.min.js"></script> <script src="../../js/reveal.min.js"></script> <script> diff --git a/test/examples/slide-backgrounds.html b/test/examples/slide-backgrounds.html index 1e2da16..4f0fe62 100644 --- a/test/examples/slide-backgrounds.html +++ b/test/examples/slide-backgrounds.html @@ -75,6 +75,27 @@ <h2>Same background twice (2/2)</h2> </section> + <section> + <section data-background="#417203"> + <h2>Same background twice vertical (1/2)</h2> + </section> + <section data-background="#417203"> + <h2>Same background twice vertical (2/2)</h2> + </section> + </section> + + <section data-background="#934f4d"> + <h2>Same background from horizontal to vertical (1/3)</h2> + </section> + <section> + <section data-background="#934f4d"> + <h2>Same background from horizontal to vertical (2/3)</h2> + </section> + <section data-background="#934f4d"> + <h2>Same background from horizontal to vertical (3/3)</h2> + </section> + </section> + </div> </div> @@ -92,7 +113,7 @@ transition: 'linear', // transitionSpeed: 'slow', - // backgroundTransition: 'linear' + // backgroundTransition: 'slide' }); </script> diff --git a/test/test-element-attributes-markdown.html b/test/test-element-attributes-markdown.html new file mode 100644 index 0000000..0853801 --- /dev/null +++ b/test/test-element-attributes-markdown.html @@ -0,0 +1,82 @@ +<!doctype html> +<html lang="en"> + + <head> + <meta charset="utf-8"> + + <title>reveal.js - Test Markdown</title> + + <link rel="stylesheet" href="../css/reveal.min.css"> + <link rel="stylesheet" href="qunit-1.12.0.css"> + </head> + + <body style="overflow: auto;"> + + <div id="qunit"></div> + <div id="qunit-fixture"></div> + + <div class="reveal" style="display: none;"> + + <div class="slides"> + + <!-- <section data-markdown="example.md" data-separator="^\n\n\n" data-vertical="^\n\n"></section> --> + + <!-- Slides are separated by newline + three dashes + newline, vertical slides identical but two dashes --> + <section data-markdown data-separator="^\n---\n$" data-vertical="^\n--\n$" data-element-attributes="{_\s*?([^}]+?)}">> + <script type="text/template"> + ## Slide 1.1 {_class="fragment fade-out" data-fragment-index="1"} + + -- + + ## Slide 1.2 {_class="fragment shrink"} + + Paragraph 1 {_class="fragment grow"} + + Paragraph 2 {_class="fragment grow"} + + - list item 1 {_class="fragment roll-in"} + - list item 2 {_class="fragment roll-in"} + - list item 3 {_class="fragment roll-in"} + + + --- + + ## Slide 2 + + + Paragraph 1.2 + multi-line {_class="fragment highlight-red"} + + Paragraph 2.2 {_class="fragment highlight-red"} + + Paragraph 2.3 {_class="fragment highlight-red"} + + Paragraph 2.4 {_class="fragment highlight-red"} + + - list item 1 {_class="fragment highlight-green"} + - list item 2 {_class="fragment highlight-green"} + - list item 3 {_class="fragment highlight-green"} + - list item 4 {_class="fragment highlight-green"} + - list item 5 {_class="fragment highlight-green"} + + Test + +  + + </script> + </section> + + </div> + + </div> + + <script src="../lib/js/head.min.js"></script> + <script src="../js/reveal.min.js"></script> + <script src="../plugin/markdown/marked.js"></script> + <script src="../plugin/markdown/markdown.js"></script> + <script src="qunit-1.12.0.js"></script> + + <script src="test-element-attributes-markdown.js"></script> + + </body> +</html> diff --git a/test/test-element-attributes-markdown.js b/test/test-element-attributes-markdown.js new file mode 100644 index 0000000..e79806c --- /dev/null +++ b/test/test-element-attributes-markdown.js @@ -0,0 +1,38 @@ + + +Reveal.addEventListener( 'ready', function() { + + QUnit.module( 'Markdown' ); + + test( 'Vertical separator', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 2, 'found two slides' ); + }); + + + test( 'Attributes on vertical slides header', function() { + strictEqual( document.querySelectorAll( '.reveal .slides section>section h2.fragment.fade-out' ).length, 1, 'found one vertical slide with class fragment.fade-out on header' ); + strictEqual( document.querySelectorAll( '.reveal .slides section>section h2.fragment.shrink' ).length, 1, 'found one vertical slide with class fragment.shrink on header' ); + }); + + test( 'Attributes on vertical slides paragraphs', function() { + strictEqual( document.querySelectorAll( '.reveal .slides section>section p.fragment.grow' ).length, 2, 'found a vertical slide with two paragraphs with class fragment.grow' ); + }); + + test( 'Attributes on vertical slides list items', function() { + strictEqual( document.querySelectorAll( '.reveal .slides section>section li.fragment.roll-in' ).length, 3, 'found a vertical slide with three list items with class fragment.roll-in' ); + }); + + test( 'Attributes on horizontal slides paragraphs', function() { + strictEqual( document.querySelectorAll( '.reveal .slides section p.fragment.highlight-red' ).length, 4, 'found a horizontal slide with four paragraphs with class fragment.grow' ); + }); + test( 'Attributes on horizontal slides list items', function() { + strictEqual( document.querySelectorAll( '.reveal .slides section li.fragment.highlight-green' ).length, 5, 'found a horizontal slide with five list items with class fragment.roll-in' ); + }); + test( 'Attributes on horizontal slides list items', function() { + strictEqual( document.querySelectorAll( '.reveal .slides section img.reveal.stretch' ).length, 1, 'found a horizontal slide with stretched image, class img.reveal.stretch' ); + }); + +} ); + +Reveal.initialize(); + diff --git a/test/test-markdown-attributes.html b/test/test-markdown-attributes.html new file mode 100644 index 0000000..cc03177 --- /dev/null +++ b/test/test-markdown-attributes.html @@ -0,0 +1,128 @@ +<!doctype html> +<html lang="en"> + + <head> + <meta charset="utf-8"> + + <title>reveal.js - Test Markdown Attributes</title> + + <link rel="stylesheet" href="../css/reveal.min.css"> + <link rel="stylesheet" href="qunit-1.12.0.css"> + </head> + + <body style="overflow: auto;"> + + <div id="qunit"></div> + <div id="qunit-fixture"></div> + + <div class="reveal" style="display: none;"> + + <div class="slides"> + + <!-- <section data-markdown="example.md" data-separator="^\n\n\n" data-vertical="^\n\n"></section> --> + + <!-- Slides are separated by three lines, vertical slides by two lines, attributes are one any line starting with (spaces and) two dashes --> + <section data-markdown data-separator="^\n\n\n" + data-vertical="^\n\n" + data-notes="^Note:" + data-attributes="^\s*?--\s(.*?)$" + data-charset="utf-8"> + <script type="text/template"> + # Test attributes in Markdown + ## Slide 1 + + + + ## Slide 2 + -- id="slide2" data-transition="zoom" data-background="#A0C66B" + + + ## Slide 2.1 + -- data-background="#ff0000" data-transition="fade" + + + ## Slide 2.2 + [Link to Slide2](#/slide2) + + + + ## Slide 3 + -- data-transition="zoom" data-background="#C6916B" + + + + ## Slide 4 + </script> + </section> + + <section data-markdown data-separator="^\n\n\n" + data-vertical="^\n\n" + data-notes="^Note:" + data-charset="utf-8"> + <script type="text/template"> + # Test attributes in Markdown with default separator + ## Slide 1 Def + + + + ## Slide 2 Def + <!-- slide-attributes: id="slide2def" data-transition="concave" data-background="#A7C66B" --> + + + ## Slide 2.1 Def + <!-- slide-attributes: data-background="#f70000" data-transition="page" --> + + + ## Slide 2.2 Def + [Link to Slide2](#/slide2def) + + + + ## Slide 3 Def + <!-- slide-attributes: data-transition="concave" data-background="#C7916B" --> + + + + ## Slide 4 + </script> + </section> + + <section data-markdown> + <script type="text/template"> + <!-- slide-attributes: data-background="#ff0000" --> + ## Hello world + </script> + </section> + + <section data-markdown> + <script type="text/template"> + ## Hello world + <!-- slide-attributes: data-background="#ff0000" --> + </script> + </section> + + <section data-markdown> + <script type="text/template"> + ## Hello world + + Test + <!-- slide-attributes: data-background="#ff0000" --> + + More Test + </script> + </section> + + </div> + + </div> + + <script src="../lib/js/head.min.js"></script> + <script src="../js/reveal.min.js"></script> + <script src="../plugin/markdown/marked.js"></script> + <script src="../plugin/markdown/markdown.js"></script> + <script src="qunit-1.12.0.js"></script> + + <script src="test-markdown-attributes.js"></script> + + </body> +</html> diff --git a/test/test-markdown-attributes.js b/test/test-markdown-attributes.js new file mode 100644 index 0000000..a11f63b --- /dev/null +++ b/test/test-markdown-attributes.js @@ -0,0 +1,47 @@ + + +Reveal.addEventListener( 'ready', function() { + + QUnit.module( 'Markdown' ); + + test( 'Vertical separator', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 6, 'found six vertical slides' ); + }); + + test( 'Id on slide', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section#slide2' ).length, 1, 'found one slide with id slide2' ); + strictEqual( document.querySelectorAll( '.reveal .slides>section>section a[href="#/slide2"]' ).length, 1, 'found one slide with a link to slide2' ); + }); + + test( 'data-background attributes', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#A0C66B"]' ).length, 1, 'found one vertical slide with data-background="#A0C66B"' ); + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#ff0000"]' ).length, 1, 'found one vertical slide with data-background="#ff0000"' ); + strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#C6916B"]' ).length, 1, 'found one slide with data-background="#C6916B"' ); + }); + + test( 'data-transition attributes', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="zoom"]' ).length, 1, 'found one vertical slide with data-transition="zoom"' ); + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="fade"]' ).length, 1, 'found one vertical slide with data-transition="fade"' ); + strictEqual( document.querySelectorAll( '.reveal .slides section [data-transition="zoom"]' ).length, 1, 'found one slide with data-transition="zoom"' ); + }); + + test( 'data-background attributes with default separator', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#A7C66B"]' ).length, 1, 'found one vertical slide with data-background="#A0C66B"' ); + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#f70000"]' ).length, 1, 'found one vertical slide with data-background="#ff0000"' ); + strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#C7916B"]' ).length, 1, 'found one slide with data-background="#C6916B"' ); + }); + + test( 'data-transition attributes with default separator', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="concave"]' ).length, 1, 'found one vertical slide with data-transition="zoom"' ); + strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="page"]' ).length, 1, 'found one vertical slide with data-transition="fade"' ); + strictEqual( document.querySelectorAll( '.reveal .slides section [data-transition="concave"]' ).length, 1, 'found one slide with data-transition="zoom"' ); + }); + + test( 'data-transition attributes with inline content', function() { + strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#ff0000"]' ).length, 3, 'found three horizontal slides with data-background="#ff0000"' ); + }); + +} ); + +Reveal.initialize(); + diff --git a/test/test.js b/test/test.js index 00c9622..bd5cad1 100644 --- a/test/test.js +++ b/test/test.js @@ -204,6 +204,16 @@ Reveal.addEventListener( 'ready', function() { deepEqual( Reveal.getIndices(), { h: 2, v: 0, f: 0 }, 'left() goes to prev fragment' ); }); + test( 'Stepping past fragments', function() { + var fragmentSlide = document.querySelector( '.reveal .slides>section:nth-child(3)' ); + + Reveal.slide( 0, 0, 0 ); + equal( fragmentSlide.querySelectorAll( '.fragment.visible' ).length, 0, 'no fragments visible when on previous slide' ); + + Reveal.slide( 3, 0, 0 ); + equal( fragmentSlide.querySelectorAll( '.fragment.visible' ).length, 3, 'all fragments visible when on future slide' ); + }); + asyncTest( 'fragmentshown event', function() { expect( 2 ); |