Commit 0814176f authored by Hakim El Hattab's avatar Hakim El Hattab
Browse files

refactor unit tests, now consistently initializing reveal.js in the same way

parent 20b8def2
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -46,8 +47,6 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="qunit-2.5.0.js"></script>
<script>
const slides = Array.prototype.map.call( document.querySelectorAll( '.slides section' ), slide => {
......@@ -59,7 +58,7 @@
};
} );
Reveal.addEventListener( 'ready', () => {
Reveal.initialize().then( () => {
QUnit.module( 'Auto-Animate' );
......@@ -121,8 +120,6 @@
});
} );
Reveal.initialize();
</script>
</body>
......
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -26,8 +27,6 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="qunit-2.5.0.js"></script>
<script>
var externalScriptSequence = '';
var scriptCount = 0;
......
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -26,12 +27,16 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="qunit-2.5.0.js"></script>
<script>
window.externalScriptSequence = '';
Reveal.addEventListener( 'ready', function() {
Reveal.initialize({
dependencies: [
{ src: 'assets/external-script-a.js' },
{ src: 'assets/external-script-b.js' },
{ src: 'assets/external-script-c.js' }
]
}).then( () => {
QUnit.module( 'Dependencies' );
......@@ -40,14 +45,6 @@
});
} );
Reveal.initialize({
dependencies: [
{ src: 'assets/external-script-a.js' },
{ src: 'assets/external-script-b.js' },
{ src: 'assets/external-script-c.js' }
]
});
</script>
</body>
......
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -38,10 +39,8 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="qunit-2.5.0.js"></script>
<script>
Reveal.addEventListener( 'ready', function() {
Reveal.initialize().then( () => {
QUnit.module( 'Grid Navigation' );
......@@ -66,8 +65,6 @@
});
} );
Reveal.initialize();
</script>
</body>
......
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -31,12 +32,9 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="qunit-2.5.0.js"></script>
<script>
Reveal.addEventListener( 'ready', function() {
Reveal.initialize({ viewDistance: 3 }).then( () => {
function getIframe( index ) {
return document.querySelectorAll( '.slide-background' )[index].querySelector( 'iframe' );
......@@ -94,10 +92,6 @@
});
} );
Reveal.initialize({
viewDistance: 3
});
</script>
</body>
......
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -31,12 +32,9 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="qunit-2.5.0.js"></script>
<script>
Reveal.addEventListener( 'ready', function() {
Reveal.initialize({ viewDistance: 2 }).then( () => {
var defaultIframe = document.querySelector( '.default-iframe' ),
preloadIframe = document.querySelector( '.preload-iframe' );
......@@ -98,10 +96,6 @@
});
} );
Reveal.initialize({
viewDistance: 2
});
</script>
</body>
......
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -122,11 +123,55 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="../plugin/markdown/marked.js"></script>
<script src="../plugin/markdown/markdown.js"></script>
<script src="qunit-2.5.0.js"></script>
<script src="test-markdown-element-attributes.js"></script>
<script>
Reveal.initialize({
dependencies: [
{ src: '../plugin/markdown/marked.js' },
{ src: '../plugin/markdown/markdown.js' },
]
}).then( function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 4, 'found four slides' );
});
QUnit.test( 'Attributes on element header in vertical slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section h2.fragment.fade-out' ).length, 1, 'found one vertical slide with class fragment.fade-out on header' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section h2.fragment.shrink' ).length, 1, 'found one vertical slide with class fragment.shrink on header' );
});
QUnit.test( 'Attributes on element paragraphs in vertical slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section p.fragment.grow' ).length, 2, 'found a vertical slide with two paragraphs with class fragment.grow' );
});
QUnit.test( 'Attributes on element list items in vertical slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section li.fragment.grow' ).length, 3, 'found a vertical slide with three list items with class fragment.grow' );
});
QUnit.test( 'Attributes on element paragraphs in horizontal slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section p.fragment.highlight-red' ).length, 4, 'found a horizontal slide with four paragraphs with class fragment.grow' );
});
QUnit.test( 'Attributes on element list items in horizontal slides', function( assert ) {
assert.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' );
});
QUnit.test( 'Attributes on element image in horizontal slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section img.reveal.stretch' ).length, 1, 'found a horizontal slide with stretched image, class img.reveal.stretch' );
});
QUnit.test( 'Attributes on elements in vertical slides with default element attribute separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section h2.fragment.highlight-red' ).length, 2, 'found two h2 titles with fragment highlight-red in vertical slides with default element attribute separator' );
});
QUnit.test( 'Attributes on elements in single slides with default element attribute separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section p.fragment.highlight-blue' ).length, 3, 'found three elements with fragment highlight-blue in single slide with default element attribute separator' );
});
} );
</script>
</body>
</html>
Reveal.addEventListener( 'ready', function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 4, 'found four slides' );
});
QUnit.test( 'Attributes on element header in vertical slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section h2.fragment.fade-out' ).length, 1, 'found one vertical slide with class fragment.fade-out on header' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section h2.fragment.shrink' ).length, 1, 'found one vertical slide with class fragment.shrink on header' );
});
QUnit.test( 'Attributes on element paragraphs in vertical slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section p.fragment.grow' ).length, 2, 'found a vertical slide with two paragraphs with class fragment.grow' );
});
QUnit.test( 'Attributes on element list items in vertical slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section>section li.fragment.grow' ).length, 3, 'found a vertical slide with three list items with class fragment.grow' );
});
QUnit.test( 'Attributes on element paragraphs in horizontal slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section p.fragment.highlight-red' ).length, 4, 'found a horizontal slide with four paragraphs with class fragment.grow' );
});
QUnit.test( 'Attributes on element list items in horizontal slides', function( assert ) {
assert.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' );
});
QUnit.test( 'Attributes on element image in horizontal slides', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section img.reveal.stretch' ).length, 1, 'found a horizontal slide with stretched image, class img.reveal.stretch' );
});
QUnit.test( 'Attributes on elements in vertical slides with default element attribute separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section h2.fragment.highlight-red' ).length, 2, 'found two h2 titles with fragment highlight-red in vertical slides with default element attribute separator' );
});
QUnit.test( 'Attributes on elements in single slides with default element attribute separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides section p.fragment.highlight-blue' ).length, 3, 'found three elements with fragment highlight-blue in single slide with default element attribute separator' );
});
} );
Reveal.initialize();
......@@ -18,20 +18,34 @@
<div class="reveal" style="display: none;">
<div class="slides">
<!-- <section data-markdown="simple.md" data-separator="^\r?\n\r?\n\r?\n" data-separator-vertical="^\r?\n\r?\n"></section> -->
<section data-markdown="simple.md" data-separator="^\r?\n\r?\n\r?\n" data-separator-vertical="^\r?\n\r?\n"></section>
</div>
</div>
<script src="../dist/reveal.min.js"></script>
<script src="../plugin/highlight/highlight.js"></script>
<script src="../plugin/markdown/marked.js"></script>
<script src="../plugin/markdown/markdown.js"></script>
<script src="qunit-2.5.0.js"></script>
<script src="../dist/reveal.min.js"></script>
<script>
Reveal.initialize({
dependencies: [
{ src: '../plugin/markdown/marked.js' },
{ src: '../plugin/markdown/markdown.js' },
]
}).then( function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 2, 'found two slides' );
});
<!-- <script src="test-markdown-external.js"></script> -->
QUnit.test( 'Horizontal separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section' ).length, 2, 'found two slides' );
});
<!-- Test disabled 28/2/2019 by Hakim – Markdown plugin needs to be updated to load extenal files asycnhronously -->
} );
</script>
</body>
</html>
Reveal.addEventListener( 'ready', function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 2, 'found two slides' );
});
QUnit.test( 'Horizontal separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section' ).length, 2, 'found two slides' );
});
QUnit.test( 'Language highlighter', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.hljs-keyword' ).length, 1, 'got rendered highlight tag.' );
assert.strictEqual( document.querySelector( '.hljs-keyword' ).innerHTML, 'var', 'the same keyword: var.' );
});
} );
Reveal.initialize();
......@@ -31,10 +31,37 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="qunit-2.5.0.js"></script>
<script src="../dist/reveal.min.js"></script>
<script>
Reveal.initialize({
dependencies: [
{ src: '../plugin/markdown/marked.js' },
// Test loading JS files with query strings
{ src: '../plugin/markdown/markdown.js?query=string' },
],
markdown: {
smartypants: true
}
}).then( function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Options are set', function( assert ) {
assert.strictEqual( marked.defaults.smartypants, true );
});
QUnit.test( 'Smart quotes are activated', function( assert ) {
var text = document.querySelector( '.reveal .slides>section>p' ).textContent;
assert.strictEqual( /['"]/.test( text ), false );
assert.strictEqual( /[“”‘’]/.test( text ), true );
});
} );
<script src="test-markdown-options.js"></script>
</script>
</body>
</html>
Reveal.addEventListener( 'ready', function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Options are set', function( assert ) {
assert.strictEqual( marked.defaults.smartypants, true );
});
QUnit.test( 'Smart quotes are activated', function( assert ) {
var text = document.querySelector( '.reveal .slides>section>p' ).textContent;
assert.strictEqual( /['"]/.test( text ), false );
assert.strictEqual( /[“”‘’]/.test( text ), true );
});
} );
Reveal.initialize({
dependencies: [
{ src: '../plugin/markdown/marked.js' },
// Test loading JS files with query strings
{ src: '../plugin/markdown/markdown.js?query=string' },
],
markdown: {
smartypants: true
}
});
......@@ -116,12 +116,58 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="../plugin/markdown/marked.js"></script>
<script src="../plugin/markdown/markdown.js"></script>
<script src="qunit-2.5.0.js"></script>
<script src="../dist/reveal.min.js"></script>
<script src="test-markdown-slide-attributes.js"></script>
<script>
Reveal.initialize({
dependencies: [
{ src: '../plugin/markdown/marked.js' },
{ src: '../plugin/markdown/markdown.js' },
]
}).then( function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 6, 'found six vertical slides' );
});
QUnit.test( 'Id on slide', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section#slide2' ).length, 1, 'found one slide with id slide2' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section a[href="#/slide2"]' ).length, 1, 'found one slide with a link to slide2' );
});
QUnit.test( 'data-background attributes', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#A0C66B"]' ).length, 1, 'found one vertical slide with data-background="#A0C66B"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#ff0000"]' ).length, 1, 'found one vertical slide with data-background="#ff0000"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#C6916B"]' ).length, 1, 'found one slide with data-background="#C6916B"' );
});
QUnit.test( 'data-transition attributes', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="zoom"]' ).length, 1, 'found one vertical slide with data-transition="zoom"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="fade"]' ).length, 1, 'found one vertical slide with data-transition="fade"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides section [data-transition="zoom"]' ).length, 1, 'found one slide with data-transition="zoom"' );
});
QUnit.test( 'data-background attributes with default separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#A7C66B"]' ).length, 1, 'found one vertical slide with data-background="#A0C66B"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#f70000"]' ).length, 1, 'found one vertical slide with data-background="#ff0000"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#C7916B"]' ).length, 1, 'found one slide with data-background="#C6916B"' );
});
QUnit.test( 'data-transition attributes with default separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="concave"]' ).length, 1, 'found one vertical slide with data-transition="zoom"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="page"]' ).length, 1, 'found one vertical slide with data-transition="fade"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides section [data-transition="concave"]' ).length, 1, 'found one slide with data-transition="zoom"' );
});
QUnit.test( 'data-transition attributes with inline content', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#ff0000"]' ).length, 3, 'found three horizontal slides with data-background="#ff0000"' );
});
} );
</script>
</body>
</html>
Reveal.addEventListener( 'ready', function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 6, 'found six vertical slides' );
});
QUnit.test( 'Id on slide', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section#slide2' ).length, 1, 'found one slide with id slide2' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section a[href="#/slide2"]' ).length, 1, 'found one slide with a link to slide2' );
});
QUnit.test( 'data-background attributes', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#A0C66B"]' ).length, 1, 'found one vertical slide with data-background="#A0C66B"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#ff0000"]' ).length, 1, 'found one vertical slide with data-background="#ff0000"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#C6916B"]' ).length, 1, 'found one slide with data-background="#C6916B"' );
});
QUnit.test( 'data-transition attributes', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="zoom"]' ).length, 1, 'found one vertical slide with data-transition="zoom"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="fade"]' ).length, 1, 'found one vertical slide with data-transition="fade"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides section [data-transition="zoom"]' ).length, 1, 'found one slide with data-transition="zoom"' );
});
QUnit.test( 'data-background attributes with default separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#A7C66B"]' ).length, 1, 'found one vertical slide with data-background="#A0C66B"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-background="#f70000"]' ).length, 1, 'found one vertical slide with data-background="#ff0000"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#C7916B"]' ).length, 1, 'found one slide with data-background="#C6916B"' );
});
QUnit.test( 'data-transition attributes with default separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="concave"]' ).length, 1, 'found one vertical slide with data-transition="zoom"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section[data-transition="page"]' ).length, 1, 'found one vertical slide with data-transition="fade"' );
assert.strictEqual( document.querySelectorAll( '.reveal .slides section [data-transition="concave"]' ).length, 1, 'found one slide with data-transition="zoom"' );
});
QUnit.test( 'data-transition attributes with inline content', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section[data-background="#ff0000"]' ).length, 3, 'found three horizontal slides with data-background="#ff0000"' );
});
} );
Reveal.initialize();
......@@ -8,6 +8,7 @@
<link rel="stylesheet" href="../dist/reveal.css">
<link rel="stylesheet" href="qunit-2.5.0.css">
<script src="qunit-2.5.0.js"></script>
</head>
<body style="overflow: auto;">
......@@ -41,11 +42,22 @@
</div>
<script src="../dist/reveal.min.js"></script>
<script src="../plugin/markdown/marked.js"></script>
<script src="../plugin/markdown/markdown.js"></script>
<script src="qunit-2.5.0.js"></script>
<script src="test-markdown.js"></script>
<script>
Reveal.initialize({
dependencies: [
{ src: '../plugin/markdown/marked.js' },
{ src: '../plugin/markdown/markdown.js' },
]
}).then( function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 2, 'found two slides' );
});
} );
</script>
</body>
</html>
Reveal.addEventListener( 'ready', function() {
QUnit.module( 'Markdown' );
QUnit.test( 'Vertical separator', function( assert ) {
assert.strictEqual( document.querySelectorAll( '.reveal .slides>section>section' ).length, 2, 'found two slides' );
});
} );
Reveal.initialize();