Playback review
First passage explains how reading controls work together on an article page.
@@ -34,7 +34,7 @@ async function fixture({ resume = false } = {}) {
`, { url: "https://example.com/article", runScripts: "outside-only", pretendToBeVisual: true });
const { window } = dom;
const source = createArticleSource(window.document);
- const reads = [];
+ const reads = structuredClone(savedReads);
const messages = [];
const ports = [];
const contexts = [];
@@ -127,7 +127,7 @@ async function fixture({ resume = false } = {}) {
port.emit({
event: "audio", section_index: 0, section_start_frame: 0, chunk_seq: 0,
audio_base64: Buffer.alloc(seconds * 44_100 * 2).toString("base64"),
- alignment: { segments: start.text.trim().split(/\s+/).map((text, index) => ({ text, start: index * 0.1, end: (index + 1) * 0.1 })) },
+ alignment: { segments: start.sections[0].text.trim().split(/\s+/).map((text, index) => ({ text, start: index * 0.1, end: (index + 1) * 0.1 })) },
});
if (finish) port.emit({ event: "finish" });
};
@@ -299,3 +299,100 @@ test("connection recovery after saved resume retains the absolute word offset an
f.advance(0.25);
assert.equal(f.followed.at(-1).paragraph, "second");
});
+
+test("reopening a saved read starts at its current word without repeating the sentence", async t => {
+ const f = await fixture({ resume: true });
+ t.after(f.close);
+ const wordOffset = f.source.text.indexOf("passage", f.source.text.indexOf("Second passage"));
+ await f.click("article-button");
+ assert.equal(f.ports[0].sent.find(message => message.type === "start").text, f.source.text.slice(wordOffset));
+ await f.click("stop-button");
+ assert.equal(f.reads[0].offset, wordOffset);
+ await f.click("article-button");
+ assert.equal(f.ports[1].sent.find(message => message.type === "start").text, f.source.text.slice(wordOffset));
+});
+
+test("rewinding to the beginning saves zero even before another word is audible", async t => {
+ const f = await fixture();
+ t.after(f.close);
+ await f.click("article-button");
+ f.audio();
+ f.advance(1.25);
+ await f.click("pause-button");
+ assert.ok(f.reads[0].offset > 0);
+ await f.click("rewind-button");
+ await f.click("stop-button");
+ assert.equal(f.reads[0].offset, 0);
+ await f.click("article-button");
+ assert.equal(f.ports[1].sent.find(message => message.type === "start").text, f.source.text);
+});
+
+test("hiding the tab saves the audible word before animation frames are throttled", async t => {
+ const f = await fixture();
+ t.after(f.close);
+ await f.click("article-button");
+ f.audio();
+ f.advance(1.25);
+ assert.equal(f.reads[0].offset, 0, "periodic progress has not run yet");
+ Object.defineProperty(f.window.document, "visibilityState", { value: "hidden" });
+ f.window.document.dispatchEvent(new f.window.Event("visibilitychange"));
+ await tick();
+ assert.ok(f.reads[0].offset > 0);
+ const saves = f.messages.filter(message => message.type === "reading_progress").length;
+ await f.click("stop-button");
+ f.window.document.dispatchEvent(new f.window.Event("visibilitychange"));
+ await tick();
+ assert.equal(f.messages.filter(message => message.type === "reading_progress").length, saves + 1);
+});
+
+test("jumping two paragraphs ahead resumes at the audible word after reopening the article", async t => {
+ const f = await fixture();
+ t.after(f.close);
+ await f.click("article-button");
+ f.audio();
+ f.advance(0.25);
+ const paragraph = f.window.document.getElementById("third");
+ const range = f.window.document.createRange();
+ range.setStart(paragraph.firstChild, 6);
+ range.setEnd(paragraph.firstChild, 13);
+ f.window.getSelection().addRange(range);
+ paragraph.dispatchEvent(new f.window.MouseEvent("dblclick", { bubbles: true }));
+ await tick();
+ const jumpedOffset = f.source.text.indexOf("passage", f.source.text.indexOf("Third passage"));
+ assert.equal(f.ports[1].sent.find(message => message.type === "start").text, f.source.text.slice(jumpedOffset));
+ f.audio();
+ f.advance(0.36);
+ await f.click("stop-button");
+ const expectedOffset = f.source.text.indexOf("enough", jumpedOffset);
+ assert.equal(f.reads[0].offset, expectedOffset);
+ const reopened = await fixture({ savedReads: f.reads });
+ t.after(reopened.close);
+ assert.equal(reopened.shadow.getElementById("article-button").textContent, "Resume read");
+ await reopened.click("article-button");
+ assert.equal(reopened.ports[0].sent.find(message => message.type === "start").text, f.source.text.slice(expectedOffset));
+ reopened.audio();
+ reopened.advance(0.25);
+ assert.equal(reopened.followed.at(-1).paragraph, "third");
+});
+
+test("later sections keep exact word checkpoints when earlier audio has no alignment", async t => {
+ const f = await fixture();
+ t.after(f.close);
+ await f.click("article-button");
+ const port = f.ports[0];
+ const start = port.sent.find(message => message.type === "start");
+ port.emit({ event: "audio", section_index: 0, section_start_frame: 0,
+ audio_base64: Buffer.alloc(4 * 44_100 * 2).toString("base64") });
+ const section = start.sections[1];
+ const words = [...section.text.matchAll(/\S+/g)];
+ port.emit({ event: "audio", section_index: 1, section_start_frame: 4 * 44_100,
+ chunk_seq: 0, chunk_audio_offset_sec: 4,
+ audio_base64: Buffer.alloc(4 * 44_100 * 2).toString("base64"),
+ alignment: { segments: words.map((word, index) => ({ text: word[0], start: index * 0.1, end: (index + 1) * 0.1 })) } });
+ f.advance(4.3);
+ await f.click("pause-button");
+ assert.equal(f.reads[0].offset, section.start + words[2].index);
+ await f.click("stop-button");
+ await f.click("article-button");
+ assert.equal(f.ports[1].sent.find(message => message.type === "start").text, f.source.text.slice(section.start + words[2].index));
+});
diff --git a/tests/reading-list.test.mjs b/tests/reading-list.test.mjs
index f80568f..64d6c6a 100644
--- a/tests/reading-list.test.mjs
+++ b/tests/reading-list.test.mjs
@@ -61,9 +61,11 @@ test("only playback completion marks a read complete; replay resets it", () => {
assert.equal(item.offset, 0);
});
-test("resume repeats the unfinished sentence, including at sentence boundaries", () => {
+test("resume repeats only the unfinished word, including at word boundaries", () => {
assert.equal(resumeOffset(article.text, 0), 0);
- assert.equal(resumeOffset(article.text, 23), 16);
+ assert.equal(resumeOffset(article.text, 20), 16);
+ assert.equal(resumeOffset(article.text, 26), 23);
+ assert.equal(resumeOffset(article.text, 23), 23);
assert.equal(resumeOffset(article.text, 33), 33);
});