<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>reveal.js - Test Iframes</title>
<link rel="stylesheet" href="../dist/reveal.css" />
<link rel="stylesheet" href="../node_modules/qunit/qunit/qunit.css" />
<script src="../node_modules/qunit/qunit/qunit.js"></script>
</head>
<body style="overflow: auto">
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<div class="deck1">
<div class="reveal" style="display: none">
<div class="slides">
<section>1.1</section>
<section data-state="deck1slide2">1.2</section>
<section>1.3</section>
</div>
</div>
</div>
<div class="deck2">
<div class="reveal" style="display: none">
<div class="slides">
<section>2.1</section>
<section>2.2</section>
<section>2.3</section>
</div>
</div>
</div>
<script type="module">
import Reveal from "../dist/reveal.esm.js";
import Zoom from "../plugin/zoom/zoom.esm.js";
QUnit.config.testTimeout = 30000;
QUnit.module("Multiple reveal.js instances");
let r1 = new Reveal(document.querySelector(".deck1 .reveal"), {
embedded: true,
keyboard: true,
plugins: [Zoom],
});
r1.initialize();
let r2 = new Reveal(document.querySelector(".deck2 .reveal"), {
embedded: true,
keyboard: false,
});
r2.initialize();
QUnit.test("Can make independent changes", function (assert) {
r1.slide(1);
r2.slide(2);
assert.strictEqual(r1.getCurrentSlide().textContent, "1.2");
assert.strictEqual(r2.getCurrentSlide().textContent, "2.3");
r2.toggleOverview(true);
assert.strictEqual(r1.isOverview(), false);
assert.strictEqual(r2.isOverview(), true);
r2.toggleOverview(false);
assert.strictEqual(r1.getConfig().keyboard, true);
assert.strictEqual(r2.getConfig().keyboard, false);
});
QUnit.test("Can register plugins independently", function (assert) {
assert.ok(r1.hasPlugin("zoom"));
assert.notOk(r2.hasPlugin("zoom"));
});
QUnit.test("Slide state is set at the viewport level", function (assert) {
r1.slide(1);
assert.ok(
r1
.getViewportElement()
.classList.contains(r1.getCurrentSlide().getAttribute("data-state"))
);
r1.slide(2);
assert.ok(
!r1
.getViewportElement()
.classList.contains(
r1.getCurrentSlide().getAttribute("data-state")
),
"unset"
);
});
</script>
<script>
QUnit.test("Reveal does not leak to window", function (assert) {
assert.strictEqual(window.Reveal, undefined);
});
</script>
</body>
</html>