Files

57 lines
2.7 KiB
JavaScript

import test from "node:test";
import assert from "node:assert/strict";
import { setupDom, teardownDom } from "../../composer/tests/_dom.js";
let createPeek;
test.before(async () => { setupDom(); ({ createPeek } = await import("../peek.js")); });
test.after(() => teardownDom());
const wait = (ms) => new Promise((r) => setTimeout(r, ms));
const point = (node) => node.dispatchEvent(new window.Event("pointerover", { bubbles: true }));
const frame = () => {
document.body.innerHTML = `<div class="fp-main"><div class="fp-row"></div><section><header class="cx-panel-head"><button id="gen">Generate</button><span id="status"></span></header><div class="cx-panel-body"><div id="lane"></div></div></section></div>`;
document.documentElement.className = "";
};
test("auto-hide: the title bar (Generate, Rate) never opens the timeline; resting on the strip does", async () => {
frame();
const root = document.documentElement, isOpen = () => root.classList.contains("fp-peek-open");
const peek = createPeek();
peek.set(true);
const strip = document.querySelector(".fp-peek-strip");
assert.ok(strip && strip.nextElementSibling.classList.contains("cx-panel-body"), "the strip sits between title bar and timeline");
point(document.getElementById("gen")); await wait(300);
assert.equal(isOpen(), false, "reaching for Generate keeps it shut");
point(strip); point(document.querySelector(".fp-row")); await wait(300);
assert.equal(isOpen(), false, "passing over the strip does not flash it open");
point(strip); await wait(300);
assert.equal(isOpen(), true, "resting on the strip opens it");
point(document.getElementById("lane")); await wait(10);
assert.equal(isOpen(), true, "the timeline itself keeps it open");
point(document.getElementById("gen"));
assert.equal(isOpen(), false, "back on the title bar, it shuts");
peek.set(false);
assert.equal(root.classList.contains("fp-peek"), false);
assert.equal(document.querySelector(".fp-peek-strip"), null, "switched off, the strip is gone");
});
test("a drag opens it at once and holds it open until the drop; switched off, nothing listens", async () => {
frame();
const root = document.documentElement, isOpen = () => root.classList.contains("fp-peek-open");
const peek = createPeek();
peek.set(true);
document.body.dispatchEvent(new window.Event("dragenter", { bubbles: true }));
assert.equal(isOpen(), true);
point(document.getElementById("gen"));
assert.equal(isOpen(), true, "held open while dragging");
document.body.dispatchEvent(new window.Event("drop", { bubbles: true }));
assert.equal(isOpen(), false);
peek.destroy();
document.body.dispatchEvent(new window.Event("dragenter", { bubbles: true }));
assert.equal(isOpen(), false, "off means off");
});